-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathpreview-CDagOaLU.js
More file actions
9 lines (8 loc) · 1.2 KB
/
preview-CDagOaLU.js
File metadata and controls
9 lines (8 loc) · 1.2 KB
1
2
3
4
5
6
7
8
9
var ADDON_ID="storybook/highlight",HIGHLIGHT_STYLE_ID="storybookHighlight",HIGHLIGHT=`${ADDON_ID}/add`,RESET_HIGHLIGHT=`${ADDON_ID}/reset`;var {document}=__STORYBOOK_MODULE_GLOBAL__.global,highlightStyle=(color="#FF4785",style="dashed")=>`
outline: 2px ${style} ${color};
outline-offset: 2px;
box-shadow: 0 0 0 6px rgba(255,255,255,0.6);
`,highlightObject=color=>({outline:`2px dashed ${color}`,outlineOffset:2,boxShadow:"0 0 0 6px rgba(255,255,255,0.6)"}),channel=__STORYBOOK_MODULE_PREVIEW_API__.addons.getChannel(),highlight=infos=>{let id=HIGHLIGHT_STYLE_ID;resetHighlight();let elements=Array.from(new Set(infos.elements)),sheet=document.createElement("style");sheet.setAttribute("id",id),sheet.innerHTML=elements.map(target=>`${target}{
${highlightStyle(infos.color,infos.style)}
}`).join(" "),document.head.appendChild(sheet);},resetHighlight=()=>{let id=HIGHLIGHT_STYLE_ID,sheetToBeRemoved=document.getElementById(id);sheetToBeRemoved&&sheetToBeRemoved.parentNode?.removeChild(sheetToBeRemoved);};channel.on(__STORYBOOK_MODULE_CORE_EVENTS__.STORY_CHANGED,resetHighlight);channel.on(RESET_HIGHLIGHT,resetHighlight);channel.on(HIGHLIGHT,highlight);
export { highlightObject, highlightStyle };