@stevendejong/storybook-stylesheet-toggle 0.0.12--canary.403e0aa.0 → 1.0.1

package/dist/index.js

@@ -1,5 +1,2 @@
-var e={};
-
-export { e as default };
-//# sourceMappingURL=out.js.map
+var e={};export{e as default};//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"names":["src_default"],"mappings":"AACA,IAAOA,EAAQ,CAAC","sourcesContent":["// make it work with --isolatedModules\nexport default {};\n"]}
+{"version":3,"sources":["../src/index.ts"],"names":["index_default"],"mappings":"AACA,IAAOA,EAAQ","file":"index.js","sourcesContent":["// make it work with --isolatedModules\nexport default {};\n"]}

package/dist/manager.js

@@ -1,8 +1,2 @@
-import l from 'react';
-import { addons, types, useParameter, useGlobals } from '@storybook/manager-api';
-import { WithTooltip, TooltipLinkList, IconButton } from '@storybook/components';
-import { PaintBrushIcon } from '@storybook/icons';
-
-var s="stylesheetToggle",m=`${s}/tool`,e="stylesheetToggle";var a={default:""};var I=({stylesheets:o})=>{let[f]=useGlobals(),g=[!0,"true"].includes(f[e]);if(o===null)return null;let i={};for(let[t,r]of Object.entries(a))i[t]=r;for(let[t,r]of Object.entries(o))i[t]=r;let n=localStorage.getItem(e);n||localStorage.setItem(e,"default");let d=t=>{localStorage.setItem(e,t),window.location.reload();},c=[];for(let[t,r]of Object.entries(i))c.push({id:t,title:t,onClick:()=>d(t),active:!n&&t==="default"||n===t});return l.createElement(WithTooltip,{placement:"top",trigger:"click",tooltip:l.createElement(TooltipLinkList,{links:c}),closeOnOutsideClick:!0},l.createElement(IconButton,{key:m,active:g,title:"Activate Stylesheet"},l.createElement(PaintBrushIcon,null)))},p=I;addons.register(s,()=>{addons.add(s,{title:"Stylesheet Toggle",type:types.TOOL,render:()=>{let o=useParameter(e,null);return l.createElement(p,{stylesheets:o})}});});
-//# sourceMappingURL=out.js.map
+import l from'react';import {addons,types,useParameter,useGlobals}from'storybook/manager-api';import {WithTooltip,TooltipLinkList,IconButton}from'storybook/internal/components';import {PaintBrushIcon}from'@storybook/icons';var s="stylesheetToggle",m=`${s}/tool`,e="stylesheetToggle";var a={default:""};var I=({stylesheets:o})=>{let[f]=useGlobals(),g=[true,"true"].includes(f[e]);if(o===null)return null;let i={};for(let[t,r]of Object.entries(a))i[t]=r;for(let[t,r]of Object.entries(o))i[t]=r;let n=localStorage.getItem(e);n||localStorage.setItem(e,"default");let d=t=>{localStorage.setItem(e,t),window.location.reload();},c=[];for(let[t,r]of Object.entries(i))c.push({id:t,title:t,onClick:()=>d(t),active:!n&&t==="default"||n===t});return l.createElement(WithTooltip,{placement:"top",trigger:"click",tooltip:l.createElement(TooltipLinkList,{links:c}),closeOnOutsideClick:true},l.createElement(IconButton,{key:m,active:g,title:"Activate Stylesheet"},l.createElement(PaintBrushIcon,null)))},p=I;addons.register(s,()=>{addons.add(s,{title:"Stylesheet Toggle",type:types.TOOL,render:()=>{let o=useParameter(e,null);return l.createElement(p,{stylesheets:o})}});});//# sourceMappingURL=manager.js.map
 //# sourceMappingURL=manager.js.map

package/dist/manager.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/manager.tsx","../src/constants.ts","../src/Tool.tsx","../src/defaults.ts"],"names":["React","addons","types","useParameter","ADDON_ID","TOOL_ID","PARAM_KEY","useGlobals","IconButton","TooltipLinkList","WithTooltip","PaintBrushIcon","defaultStylesheets","Tool","stylesheets","globals","isActive","mapping","name","url","active","toggleStylesheet","sheet","items","Tool_default"],"mappings":"AAAA,OAAOA,MAAW,QAClB,OAAS,UAAAC,EAAQ,SAAAC,EAAO,gBAAAC,MAAoB,yBCDrC,IAAMC,EAAW,mBACXC,EAAU,GAAGD,CAAQ,QACrBE,EAAY,mBCFzB,OAAON,MAAW,QAClB,OAAS,cAAAO,MAAkB,yBAC3B,OAAS,cAAAC,EAAY,mBAAAC,EAAiB,eAAAC,MAAmB,wBACzD,OAAS,kBAAAC,MAAsB,mBCHxB,IAAMC,EAA8C,CACzD,QAAW,EACb,EDMA,IAAMC,EAAO,CAAC,CAAE,YAAAC,CAAY,IAAiC,CAC3D,GAAM,CAACC,CAAO,EAAIR,EAAW,EACvBS,EAAW,CAAC,GAAM,MAAM,EAAE,SAASD,EAAQT,CAAS,CAAC,EAE3D,GAAIQ,IAAgB,KAClB,OAAO,KAGT,IAAMG,EAAmC,CAAC,EAC1C,OAAW,CAACC,EAAMC,CAAG,IAAK,OAAO,QAAQP,CAAkB,EACzDK,EAAQC,CAAI,EAAIC,EAElB,OAAW,CAACD,EAAMC,CAAG,IAAK,OAAO,QAAQL,CAAW,EAClDG,EAAQC,CAAI,EAAIC,EAGlB,IAAMC,EAAS,aAAa,QAAQd,CAAS,EACxCc,GACH,aAAa,QAAQd,EAAW,SAAS,EAG3C,IAAMe,EAAoBC,GAAkB,CAC1C,aAAa,QAAQhB,EAAWgB,CAAK,EACrC,OAAO,SAAS,OAAO,CACzB,EAEMC,EAAQ,CAAC,EACf,OAAW,CAACL,EAAMC,CAAG,IAAK,OAAO,QAAQF,CAAO,EAC9CM,EAAM,KAAK,CACT,GAAIL,EACJ,MAAOA,EACP,QAAS,IAAMG,EAAiBH,CAAI,EACpC,OAAU,CAACE,GAAUF,IAAS,WAAcE,IAAWF,CACzD,CAAC,EAGH,OACElB,EAAA,cAACU,EAAA,CACC,UAAU,MACV,QAAQ,QACR,QAASV,EAAA,cAACS,EAAA,CAAgB,MAAOc,EAAO,EACxC,oBAAmB,IAEnBvB,EAAA,cAACQ,EAAA,CACC,IAAKH,EACL,OAAQW,EACR,MAAM,uBAENhB,EAAA,cAACW,EAAA,IAAe,CAClB,CACF,CAEJ,EAEOa,EAAQX,EFzDfZ,EAAO,SAASG,EAAU,IAAM,CAC9BH,EAAO,IAAIG,EAAU,CACnB,MAAO,oBACP,KAAMF,EAAM,KACZ,OAAQ,IAAM,CACZ,IAAMY,EAAcX,EAClBG,EACA,IACF,EAEA,OAAON,EAAA,cAACwB,EAAA,CAAK,YAAaV,EAAa,CACzC,CACF,CAAC,CACH,CAAC","sourcesContent":["import React from \"react\";\nimport { addons, types, useParameter } from \"@storybook/manager-api\";\nimport { ADDON_ID, PARAM_KEY } from \"./constants\";\nimport Tool from './Tool'\n\naddons.register(ADDON_ID, () => {\n  addons.add(ADDON_ID, {\n    title: 'Stylesheet Toggle',\n    type: types.TOOL,\n    render: () => {\n      const stylesheets = useParameter(\n        PARAM_KEY,\n        null,\n      );\n\n      return <Tool stylesheets={stylesheets} />\n    },\n  });\n});\n","export const ADDON_ID = \"stylesheetToggle\";\nexport const TOOL_ID = `${ADDON_ID}/tool`;\nexport const PARAM_KEY = `stylesheetToggle`;\n\n","import React from \"react\";\nimport { useGlobals } from \"@storybook/manager-api\";\nimport { IconButton, TooltipLinkList, WithTooltip } from \"@storybook/components\";\nimport { PaintBrushIcon } from \"@storybook/icons\";\nimport { PARAM_KEY, TOOL_ID } from \"./constants\";\nimport { defaultStylesheets } from \"./defaults\";\n\n\nconst Tool = ({ stylesheets }: { [key: string]: string }) => {\n  const [globals] = useGlobals();\n  const isActive = [true, \"true\"].includes(globals[PARAM_KEY]);\n\n  if (stylesheets === null) {\n    return null;\n  }\n\n  const mapping: {[key: string]: string} = {};\n  for (const [name, url] of Object.entries(defaultStylesheets)) {\n    mapping[name] = url;\n  }\n  for (const [name, url] of Object.entries(stylesheets)) {\n    mapping[name] = url;\n  }\n\n  const active = localStorage.getItem(PARAM_KEY);\n  if (!active) {\n    localStorage.setItem(PARAM_KEY, \"default\");\n  }\n\n  const toggleStylesheet = (sheet: string) => {\n    localStorage.setItem(PARAM_KEY, sheet);\n    window.location.reload();\n  };\n\n  const items = [];\n  for (const [name, url] of Object.entries(mapping)) {\n    items.push({\n      id: name,\n      title: name,\n      onClick: () => toggleStylesheet(name),\n      active: ((!active && name === \"default\") || active === name)\n    });\n  }\n\n  return (\n    <WithTooltip\n      placement=\"top\"\n      trigger=\"click\"\n      tooltip={<TooltipLinkList links={items} />}\n      closeOnOutsideClick\n    >\n      <IconButton\n        key={TOOL_ID}\n        active={isActive}\n        title=\"Activate Stylesheet\"\n      >\n        <PaintBrushIcon />\n      </IconButton>\n    </WithTooltip>\n  );\n};\n\nexport default Tool;\n","export const defaultStylesheets: {[key: string]: string} = {\n  \"default\": ''\n}\n"]}
+{"version":3,"sources":["../src/constants.ts","../src/defaults.ts","../src/Tool.tsx","../src/manager.tsx"],"names":["ADDON_ID","TOOL_ID","PARAM_KEY","defaultStylesheets","Tool","stylesheets","globals","useGlobals","isActive","mapping","name","url","active","toggleStylesheet","sheet","items","React","WithTooltip","TooltipLinkList","IconButton","PaintBrushIcon","Tool_default","addons","types","useParameter"],"mappings":"+NAAO,IAAMA,CAAAA,CAAW,mBACXC,CAAAA,CAAU,CAAA,EAAGD,CAAQ,CAAA,KAAA,CAAA,CACrBE,CAAAA,CAAY,kBAAA,CCFlB,IAAMC,CAAAA,CAA8C,CACzD,OAAA,CAAW,EACb,CAAA,CCMA,IAAMC,CAAAA,CAAO,CAAC,CAAE,WAAA,CAAAC,CAAY,CAAA,GAAiC,CAC3D,GAAM,CAACC,CAAO,CAAA,CAAIC,UAAAA,GACZC,CAAAA,CAAW,CAAC,IAAA,CAAM,MAAM,CAAA,CAAE,QAAA,CAASF,CAAAA,CAAQJ,CAAS,CAAC,CAAA,CAE3D,GAAIG,CAAAA,GAAgB,IAAA,CAClB,OAAO,KAGT,IAAMI,CAAAA,CAAmC,EAAC,CAC1C,IAAA,GAAW,CAACC,CAAAA,CAAMC,CAAG,CAAA,GAAK,MAAA,CAAO,OAAA,CAAQR,CAAkB,CAAA,CACzDM,CAAAA,CAAQC,CAAI,CAAA,CAAIC,CAAAA,CAElB,IAAA,GAAW,CAACD,CAAAA,CAAMC,CAAG,CAAA,GAAK,MAAA,CAAO,OAAA,CAAQN,CAAW,CAAA,CAClDI,CAAAA,CAAQC,CAAI,CAAA,CAAIC,EAGlB,IAAMC,CAAAA,CAAS,YAAA,CAAa,OAAA,CAAQV,CAAS,CAAA,CACxCU,CAAAA,EACH,YAAA,CAAa,OAAA,CAAQV,CAAAA,CAAW,SAAS,CAAA,CAG3C,IAAMW,CAAAA,CAAoBC,GAAkB,CAC1C,YAAA,CAAa,OAAA,CAAQZ,CAAAA,CAAWY,CAAK,CAAA,CACrC,MAAA,CAAO,QAAA,CAAS,MAAA,GAClB,CAAA,CAEMC,CAAAA,CAAQ,EAAC,CACf,OAAW,CAACL,CAAAA,CAAMC,CAAG,CAAA,GAAK,MAAA,CAAO,OAAA,CAAQF,CAAO,CAAA,CAC9CM,CAAAA,CAAM,IAAA,CAAK,CACT,EAAA,CAAIL,CAAAA,CACJ,KAAA,CAAOA,EACP,OAAA,CAAS,IAAMG,CAAAA,CAAiBH,CAAI,CAAA,CACpC,MAAA,CAAU,CAACE,CAAAA,EAAUF,CAAAA,GAAS,SAAA,EAAcE,CAAAA,GAAWF,CACzD,CAAC,CAAA,CAGH,OACEM,CAAAA,CAAA,aAAA,CAACC,WAAAA,CAAA,CACC,SAAA,CAAU,KAAA,CACV,OAAA,CAAQ,OAAA,CACR,OAAA,CAASD,CAAAA,CAAA,aAAA,CAACE,eAAAA,CAAA,CAAgB,KAAA,CAAOH,EAAO,CAAA,CACxC,mBAAA,CAAmB,IAAA,CAAA,CAEnBC,CAAAA,CAAA,aAAA,CAACG,UAAAA,CAAA,CACC,GAAA,CAAKlB,CAAAA,CACL,MAAA,CAAQO,CAAAA,CACR,KAAA,CAAM,qBAAA,CAAA,CAENQ,CAAAA,CAAA,cAACI,cAAAA,CAAA,IAAe,CAClB,CACF,CAEJ,CAAA,CAEOC,CAAAA,CAAQjB,CAAAA,CCzDfkB,MAAAA,CAAO,QAAA,CAAStB,CAAAA,CAAU,IAAM,CAC9BsB,MAAAA,CAAO,IAAItB,CAAAA,CAAU,CACnB,KAAA,CAAO,mBAAA,CACP,IAAA,CAAMuB,KAAAA,CAAM,IAAA,CACZ,MAAA,CAAQ,IAAM,CACZ,IAAMlB,CAAAA,CAAcmB,YAAAA,CAClBtB,CAAAA,CACA,IACF,CAAA,CAEA,OAAOc,CAAAA,CAAA,aAAA,CAACK,CAAAA,CAAA,CAAK,WAAA,CAAahB,CAAAA,CAAa,CACzC,CACF,CAAC,EACH,CAAC,CAAA","file":"manager.js","sourcesContent":["export const ADDON_ID = \"stylesheetToggle\";\nexport const TOOL_ID = `${ADDON_ID}/tool`;\nexport const PARAM_KEY = `stylesheetToggle`;\n\n","export const defaultStylesheets: {[key: string]: string} = {\n  \"default\": ''\n}\n","import React from \"react\";\nimport { useGlobals } from \"storybook/manager-api\";\nimport { IconButton, TooltipLinkList, WithTooltip } from \"storybook/internal/components\";\nimport { PaintBrushIcon } from \"@storybook/icons\";\nimport { PARAM_KEY, TOOL_ID } from \"./constants\";\nimport { defaultStylesheets } from \"./defaults\";\n\n\nconst Tool = ({ stylesheets }: { [key: string]: string }) => {\n  const [globals] = useGlobals();\n  const isActive = [true, \"true\"].includes(globals[PARAM_KEY]);\n\n  if (stylesheets === null) {\n    return null;\n  }\n\n  const mapping: {[key: string]: string} = {};\n  for (const [name, url] of Object.entries(defaultStylesheets)) {\n    mapping[name] = url;\n  }\n  for (const [name, url] of Object.entries(stylesheets)) {\n    mapping[name] = url;\n  }\n\n  const active = localStorage.getItem(PARAM_KEY);\n  if (!active) {\n    localStorage.setItem(PARAM_KEY, \"default\");\n  }\n\n  const toggleStylesheet = (sheet: string) => {\n    localStorage.setItem(PARAM_KEY, sheet);\n    window.location.reload();\n  };\n\n  const items = [];\n  for (const [name, url] of Object.entries(mapping)) {\n    items.push({\n      id: name,\n      title: name,\n      onClick: () => toggleStylesheet(name),\n      active: ((!active && name === \"default\") || active === name)\n    });\n  }\n\n  return (\n    <WithTooltip\n      placement=\"top\"\n      trigger=\"click\"\n      tooltip={<TooltipLinkList links={items} />}\n      closeOnOutsideClick\n    >\n      <IconButton\n        key={TOOL_ID}\n        active={isActive}\n        title=\"Activate Stylesheet\"\n      >\n        <PaintBrushIcon />\n      </IconButton>\n    </WithTooltip>\n  );\n};\n\nexport default Tool;\n","import React from \"react\";\nimport { addons, types, useParameter } from \"storybook/manager-api\";\nimport { ADDON_ID, PARAM_KEY } from \"./constants\";\nimport Tool from './Tool'\n\naddons.register(ADDON_ID, () => {\n  addons.add(ADDON_ID, {\n    title: 'Stylesheet Toggle',\n    type: types.TOOL,\n    render: () => {\n      const stylesheets = useParameter(\n        PARAM_KEY,\n        null,\n      );\n\n      return <Tool stylesheets={stylesheets} />\n    },\n  });\n});\n"]}

package/dist/preset.js

@@ -0,0 +1,2 @@
+var e=async n=>(console.log("This addon is augmenting the Vite config"),n),o=async n=>(console.log("This addon is augmenting the Webpack config"),n);export{e as viteFinal,o as webpack};//# sourceMappingURL=preset.js.map
+//# sourceMappingURL=preset.js.map

package/dist/preset.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/preset.ts"],"names":["viteFinal","config","webpack"],"mappings":"AAKO,IAAMA,CAAAA,CAAY,MAAOC,CAAAA,GAC9B,OAAA,CAAQ,IAAI,0CAA0C,CAAA,CAC/CA,CAAAA,CAAAA,CAGIC,CAAAA,CAAU,MAAOD,CAAAA,GAC5B,OAAA,CAAQ,GAAA,CAAI,6CAA6C,CAAA,CAClDA,CAAAA","file":"preset.js","sourcesContent":["// You can use presets to augment the Storybook configuration\n// You rarely want to do this in addons,\n// so often you want to delete this file and remove the reference to it in package.json#exports and package.json#bunder.nodeEntries\n// Read more about presets at https://storybook.js.org/docs/addons/writing-presets\n\nexport const viteFinal = async (config: any) => {\n  console.log(\"This addon is augmenting the Vite config\");\n  return config;\n};\n\nexport const webpack = async (config: any) => {\n  console.log(\"This addon is augmenting the Webpack config\");\n  return config;\n};"]}

package/dist/preview.d.ts

@@ -1,4 +1,4 @@
-import { ProjectAnnotations, Renderer } from '@storybook/types';
+import { ProjectAnnotations, Renderer } from 'storybook/internal/types';
 
 declare const preview: ProjectAnnotations<Renderer>;
 

package/dist/preview.js

@@ -1,7 +1,2 @@
-import { useGlobals, useEffect } from '@storybook/preview-api';
-
-var e="stylesheetToggle";var c=(o,r)=>{let[s]=useGlobals(),n=s[e],{theme:t}=r.globals,i=r.parameters[e],l=localStorage.getItem(e);l||localStorage.setItem(e,"default");let y=i[l];return useEffect(()=>{p(y);},[n,t]),o()};function p(o){let r=document.querySelector("#stylesheetToggle"),s=document.querySelector("#storybook-root"),n=document.querySelector("body"),t=document.createElement("link");o&&(t.setAttribute("id","stylesheetToggle"),t.setAttribute("rel","stylesheet"),t.setAttribute("href",o),r?.remove(),n.insertBefore(t,s));}var f={decorators:[c],globals:{[e]:!1}},R=f;
-
-export { R as default };
-//# sourceMappingURL=out.js.map
+import {useGlobals,useEffect}from'storybook/preview-api';var e="stylesheetToggle";var c=(o,r)=>{let[s]=useGlobals(),n=s[e],{theme:t}=r.globals,i=r.parameters[e],l=localStorage.getItem(e);l||localStorage.setItem(e,"default");let y=i[l];return useEffect(()=>{p(y);},[n,t]),o()};function p(o){let r=document.querySelector("#stylesheetToggle"),s=document.querySelector("#storybook-root"),n=document.querySelector("body"),t=document.createElement("link");o&&(t.setAttribute("id","stylesheetToggle"),t.setAttribute("rel","stylesheet"),t.setAttribute("href",o),r?.remove(),n.insertBefore(t,s));}var f={decorators:[c],initialGlobals:{[e]:false}},R=f;export{R as default};//# sourceMappingURL=preview.js.map
 //# sourceMappingURL=preview.js.map

package/dist/preview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/constants.ts","../src/withGlobals.ts","../src/preview.ts"],"names":["ADDON_ID","TOOL_ID","PARAM_KEY","useEffect","useGlobals","withGlobals","StoryFn","context","globals","stylesheetToggle","theme","stylesheets","active","stylesheet","injectStylesheet","previousStylesheet","beforeElement","bodyElement","stylesheetElement","preview","preview_default"],"mappings":"AAAO,IAAMA,EAAW,mBACXC,EAAU,GAAGD,CAAQ,QACrBE,EAAY,mBCDzB,OAAS,aAAAC,EAAW,cAAAC,MAAkB,yBAI/B,IAAMC,EAAc,CACzBC,EACAC,IACG,CACH,GAAM,CAACC,CAAO,EAAIJ,EAAW,EACvBK,EAAmBD,EAAQN,CAAS,EAEpC,CAAE,MAAAQ,CAAM,EAAIH,EAAQ,QACpBI,EAAcJ,EAAQ,WAAWL,CAAS,EAE1CU,EAAS,aAAa,QAAQV,CAAS,EACxCU,GACH,aAAa,QAAQV,EAAW,SAAS,EAE3C,IAAMW,EAAaF,EAAYC,CAAM,EAErC,OAAAT,EAAU,IAAM,CACdW,EAAiBD,CAAU,CAC7B,EAAG,CAACJ,EAAkBC,CAAK,CAAC,EAErBJ,EAAQ,CACjB,EAEA,SAASQ,EAAiBD,EAAoB,CAC5C,IAAME,EAAqB,SAAS,cAAc,mBAAmB,EAC/DC,EAAgB,SAAS,cAAc,iBAAiB,EACxDC,EAAc,SAAS,cAAc,MAAM,EAC3CC,EAAoB,SAAS,cAAc,MAAM,EAElDL,IAILK,EAAkB,aAAa,KAAM,kBAAkB,EACvDA,EAAkB,aAAa,MAAO,YAAY,EAClDA,EAAkB,aAAa,OAAQL,CAAU,EAEjDE,GAAoB,OAAO,EAC3BE,EAAY,aAAaC,EAAmBF,CAAa,EAC3D,CCvCA,IAAMG,EAAwC,CAC5C,WAAY,CAACd,CAAW,EACxB,QAAS,CACP,CAACH,CAAS,EAAG,EACf,CACF,EAEOkB,EAAQD","sourcesContent":["export const ADDON_ID = \"stylesheetToggle\";\nexport const TOOL_ID = `${ADDON_ID}/tool`;\nexport const PARAM_KEY = `stylesheetToggle`;\n\n","import type { PartialStoryFn as StoryFunction, Renderer, StoryContext } from \"@storybook/types\";\nimport { useEffect, useGlobals } from \"@storybook/preview-api\";\nimport { PARAM_KEY } from \"./constants\";\n\n\nexport const withGlobals = (\n  StoryFn: StoryFunction<Renderer>,\n  context: StoryContext<Renderer>\n) => {\n  const [globals] = useGlobals();\n  const stylesheetToggle = globals[PARAM_KEY];\n\n  const { theme } = context.globals;\n  const stylesheets = context.parameters[PARAM_KEY];\n\n  const active = localStorage.getItem(PARAM_KEY);\n  if (!active) {\n    localStorage.setItem(PARAM_KEY, \"default\");\n  }\n  const stylesheet = stylesheets[active];\n\n  useEffect(() => {\n    injectStylesheet(stylesheet);\n  }, [stylesheetToggle, theme]);\n\n  return StoryFn();\n};\n\nfunction injectStylesheet(stylesheet: string) {\n  const previousStylesheet = document.querySelector(\"#stylesheetToggle\");\n  const beforeElement = document.querySelector(\"#storybook-root\");\n  const bodyElement = document.querySelector(\"body\");\n  const stylesheetElement = document.createElement(\"link\");\n\n  if (!stylesheet) {\n    return;\n  }\n\n  stylesheetElement.setAttribute(\"id\", \"stylesheetToggle\");\n  stylesheetElement.setAttribute(\"rel\", \"stylesheet\");\n  stylesheetElement.setAttribute(\"href\", stylesheet);\n\n  previousStylesheet?.remove();\n  bodyElement.insertBefore(stylesheetElement, beforeElement);\n}\n","import type { Renderer, ProjectAnnotations } from \"@storybook/types\";\nimport { PARAM_KEY } from \"./constants\";\nimport { withGlobals } from \"./withGlobals\";\n\n\nconst preview: ProjectAnnotations<Renderer> = {\n  decorators: [withGlobals],\n  globals: {\n    [PARAM_KEY]: false,\n  },\n};\n\nexport default preview;\n"]}
+{"version":3,"sources":["../src/constants.ts","../src/withGlobals.ts","../src/preview.ts"],"names":["PARAM_KEY","withGlobals","StoryFn","context","globals","useGlobals","stylesheetToggle","theme","stylesheets","active","stylesheet","useEffect","injectStylesheet","previousStylesheet","beforeElement","bodyElement","stylesheetElement","preview","preview_default"],"mappings":"yDAAO,IAEMA,CAAAA,CAAY,mBCGlB,IAAMC,CAAAA,CAAc,CACzBC,CAAAA,CACAC,CAAAA,GACG,CACH,GAAM,CAACC,CAAO,CAAA,CAAIC,UAAAA,EAAW,CACvBC,CAAAA,CAAmBF,CAAAA,CAAQJ,CAAS,CAAA,CAEpC,CAAE,KAAA,CAAAO,CAAM,CAAA,CAAIJ,CAAAA,CAAQ,OAAA,CACpBK,CAAAA,CAAcL,CAAAA,CAAQ,UAAA,CAAWH,CAAS,CAAA,CAE1CS,CAAAA,CAAS,YAAA,CAAa,OAAA,CAAQT,CAAS,CAAA,CACxCS,CAAAA,EACH,YAAA,CAAa,QAAQT,CAAAA,CAAW,SAAS,CAAA,CAE3C,IAAMU,CAAAA,CAAaF,CAAAA,CAAYC,CAAM,CAAA,CAErC,OAAAE,SAAAA,CAAU,IAAM,CACdC,CAAAA,CAAiBF,CAAU,EAC7B,CAAA,CAAG,CAACJ,EAAkBC,CAAK,CAAC,CAAA,CAErBL,CAAAA,EACT,CAAA,CAEA,SAASU,CAAAA,CAAiBF,CAAAA,CAAoB,CAC5C,IAAMG,CAAAA,CAAqB,QAAA,CAAS,aAAA,CAAc,mBAAmB,CAAA,CAC/DC,EAAgB,QAAA,CAAS,aAAA,CAAc,iBAAiB,CAAA,CACxDC,CAAAA,CAAc,QAAA,CAAS,aAAA,CAAc,MAAM,EAC3CC,CAAAA,CAAoB,QAAA,CAAS,aAAA,CAAc,MAAM,CAAA,CAElDN,CAAAA,GAILM,CAAAA,CAAkB,YAAA,CAAa,KAAM,kBAAkB,CAAA,CACvDA,CAAAA,CAAkB,YAAA,CAAa,KAAA,CAAO,YAAY,CAAA,CAClDA,CAAAA,CAAkB,aAAa,MAAA,CAAQN,CAAU,CAAA,CAEjDG,CAAAA,EAAoB,MAAA,EAAO,CAC3BE,CAAAA,CAAY,YAAA,CAAaC,EAAmBF,CAAa,CAAA,EAC3D,CCvCA,IAAMG,CAAAA,CAAwC,CAC5C,UAAA,CAAY,CAAChB,CAAW,CAAA,CACxB,cAAA,CAAgB,CACd,CAACD,CAAS,EAAG,KACf,CACF,EAEOkB,CAAAA,CAAQD","file":"preview.js","sourcesContent":["export const ADDON_ID = \"stylesheetToggle\";\nexport const TOOL_ID = `${ADDON_ID}/tool`;\nexport const PARAM_KEY = `stylesheetToggle`;\n\n","import type { PartialStoryFn as StoryFunction, Renderer, StoryContext } from \"storybook/internal/types\";\nimport { useEffect, useGlobals } from \"storybook/preview-api\";\nimport { PARAM_KEY } from \"./constants\";\n\n\nexport const withGlobals = (\n  StoryFn: StoryFunction<Renderer>,\n  context: StoryContext<Renderer>\n) => {\n  const [globals] = useGlobals();\n  const stylesheetToggle = globals[PARAM_KEY];\n\n  const { theme } = context.globals;\n  const stylesheets = context.parameters[PARAM_KEY];\n\n  const active = localStorage.getItem(PARAM_KEY);\n  if (!active) {\n    localStorage.setItem(PARAM_KEY, \"default\");\n  }\n  const stylesheet = stylesheets[active];\n\n  useEffect(() => {\n    injectStylesheet(stylesheet);\n  }, [stylesheetToggle, theme]);\n\n  return StoryFn();\n};\n\nfunction injectStylesheet(stylesheet: string) {\n  const previousStylesheet = document.querySelector(\"#stylesheetToggle\");\n  const beforeElement = document.querySelector(\"#storybook-root\");\n  const bodyElement = document.querySelector(\"body\");\n  const stylesheetElement = document.createElement(\"link\");\n\n  if (!stylesheet) {\n    return;\n  }\n\n  stylesheetElement.setAttribute(\"id\", \"stylesheetToggle\");\n  stylesheetElement.setAttribute(\"rel\", \"stylesheet\");\n  stylesheetElement.setAttribute(\"href\", stylesheet);\n\n  previousStylesheet?.remove();\n  bodyElement.insertBefore(stylesheetElement, beforeElement);\n}\n","import type { Renderer, ProjectAnnotations } from \"storybook/internal/types\";\nimport { PARAM_KEY } from \"./constants\";\nimport { withGlobals } from \"./withGlobals\";\n\n\nconst preview: ProjectAnnotations<Renderer> = {\n  decorators: [withGlobals],\n  initialGlobals: {\n    [PARAM_KEY]: false,\n  },\n};\n\nexport default preview;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stevendejong/storybook-stylesheet-toggle",
-  "version": "0.0.12--canary.403e0aa.0",
+  "version": "1.0.1",
   "description": "The Storybook Stylesheet Toggle addon is a simple and convenient tool for changing stylesheets on the fly.",
   "keywords": [
     "storybook-addons"
@@ -15,18 +15,19 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "require": "./dist/index.cjs",
-      "import": "./dist/index.js"
+      "default": "./dist/index.js"
     },
     "./preview": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/preview.js",
-      "require": "./dist/preview.js"
+      "types": "./dist/preview.d.ts",
+      "default": "./dist/preview.js"
     },
-    "./preset": "./dist/preset.cjs",
+    "./preset": "./preset.js",
     "./manager": "./dist/manager.js",
     "./package.json": "./package.json"
   },
+  "peerDependencies": {
+    "storybook": "^9.0.0 || ^10.0.0"
+  },
   "files": [
     "dist/**/*",
     "README.md",
@@ -35,24 +36,20 @@
   ],
   "scripts": {
     "clean": "rimraf ./dist",
-    "prebuild": "yarn clean",
+    "prebuild": "npm run clean",
     "build": "tsup",
-    "build:watch": "yarn build --watch",
+    "build:watch": "npm run build -- --watch",
     "test": "echo \"Error: no test specified\" && exit 1",
     "start": "run-p build:watch 'storybook --quiet'",
     "prerelease": "zx scripts/prepublish-checks.js",
-    "release": "yarn build && auto shipit",
+    "release": "npm run build && auto shipit",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
   "devDependencies": {
-    "@storybook/addon-essentials": "^8.0.0",
-    "@storybook/addon-interactions": "^8.0.0",
-    "@storybook/addon-links": "^8.0.0",
-    "@storybook/addon-mdx-gfm": "^8.0.0",
-    "@storybook/react": "^8.0.0",
-    "@storybook/react-vite": "^8.0.0",
-    "@types/node": "^20.11.26",
+    "@storybook/react": "^10.1.11",
+    "@storybook/react-vite": "^10.1.11",
+    "@types/node": "^22.10.2",
     "@types/react": "^18.2.65",
     "@vitejs/plugin-react": "^4.2.1",
     "auto": "^11.1.1",
@@ -61,12 +58,12 @@
     "npm-run-all": "^4.1.5",
     "prettier": "^3.2.5",
     "prompts": "^2.4.2",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
     "rimraf": "^5.0.5",
-    "storybook": "^8.0.0",
-    "tsup": "^8.0.2",
-    "typescript": "^5.4.2",
+    "storybook": "^10.1.11",
+    "tsup": "^8.3.5",
+    "typescript": "^5.7.2",
     "vite": "^5.1.6",
     "zx": "^7.2.3"
   },
@@ -75,14 +72,12 @@
     "registry": "https://registry.npmjs.org"
   },
   "bundler": {
-    "exportEntries": [
-      "src/index.ts"
-    ],
     "managerEntries": [
       "src/manager.tsx"
     ],
     "previewEntries": [
-      "src/preview.ts"
+      "src/preview.ts",
+      "src/index.ts"
     ],
     "nodeEntries": [
       "src/preset.ts"

package/preset.js

@@ -0,0 +1 @@
+export * from "./dist/preset.js";

package/dist/index.cjs

@@ -1,7 +0,0 @@
-'use strict';
-
-var e={};
-
-module.exports = e;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/index.ts"],"names":["src_default"],"mappings":"AACA,IAAOA,EAAQ,CAAC","sourcesContent":["// make it work with --isolatedModules\nexport default {};\n"]}

package/dist/index.d.cts

@@ -1,3 +0,0 @@
-declare const _default: {};
-
-export { _default as default };

package/dist/preset.cjs

@@ -1,8 +0,0 @@
-'use strict';
-
-var e=async n=>(console.log("This addon is augmenting the Vite config"),n),o=async n=>(console.log("This addon is augmenting the Webpack config"),n);
-
-exports.viteFinal = e;
-exports.webpack = o;
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=preset.cjs.map

package/dist/preset.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/preset.ts"],"names":["viteFinal","config","webpack"],"mappings":"AAKO,IAAMA,EAAY,MAAOC,IAC9B,QAAQ,IAAI,0CAA0C,EAC/CA,GAGIC,EAAU,MAAOD,IAC5B,QAAQ,IAAI,6CAA6C,EAClDA","sourcesContent":["// You can use presets to augment the Storybook configuration\n// You rarely want to do this in addons,\n// so often you want to delete this file and remove the reference to it in package.json#exports and package.json#bunder.nodeEntries\n// Read more about presets at https://storybook.js.org/docs/addons/writing-presets\n\nexport const viteFinal = async (config: any) => {\n  console.log(\"This addon is augmenting the Vite config\");\n  return config;\n};\n\nexport const webpack = async (config: any) => {\n  console.log(\"This addon is augmenting the Webpack config\");\n  return config;\n};"]}