@saas-ui/storybook-addon 4.0.0 → 4.0.1
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/ChakraProviderDecorator.cjs +5 -5
- package/dist/ChakraProviderDecorator.cjs.map +1 -1
- package/dist/ChakraProviderDecorator.js +5 -5
- package/dist/ChakraProviderDecorator.js.map +1 -1
- package/dist/arg-types.cjs +1 -1
- package/dist/arg-types.cjs.map +1 -1
- package/dist/arg-types.d.cts +1 -1
- package/dist/arg-types.d.ts +1 -1
- package/dist/arg-types.js +1 -1
- package/dist/arg-types.js.map +1 -1
- package/dist/color-mode/ColorModeSync.cjs +1 -1
- package/dist/color-mode/ColorModeSync.cjs.map +1 -1
- package/dist/color-mode/ColorModeSync.js +1 -1
- package/dist/color-mode/ColorModeSync.js.map +1 -1
- package/dist/color-mode/ColorModeTool.cjs +1 -1
- package/dist/color-mode/ColorModeTool.cjs.map +1 -1
- package/dist/color-mode/ColorModeTool.js +1 -1
- package/dist/color-mode/ColorModeTool.js.map +1 -1
- package/dist/constants.cjs +1 -1
- package/dist/constants.cjs.map +1 -1
- package/dist/constants.js +1 -1
- package/dist/constants.js.map +1 -1
- package/dist/direction/DirectionTool.cjs +1 -1
- package/dist/direction/DirectionTool.cjs.map +1 -1
- package/dist/direction/DirectionTool.js +1 -1
- package/dist/direction/DirectionTool.js.map +1 -1
- package/dist/direction/useDirection.cjs +1 -1
- package/dist/direction/useDirection.cjs.map +1 -1
- package/dist/direction/useDirection.js +1 -1
- package/dist/direction/useDirection.js.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/index.js.map +1 -1
- package/dist/manager.cjs +1 -1
- package/dist/manager.cjs.map +1 -1
- package/dist/manager.js +1 -1
- package/dist/manager.js.map +1 -1
- package/dist/preview.cjs +5 -5
- package/dist/preview.cjs.map +1 -1
- package/dist/preview.js +5 -5
- package/dist/preview.js.map +1 -1
- package/dist/theme/ThemeTool.cjs +1 -1
- package/dist/theme/ThemeTool.cjs.map +1 -1
- package/dist/theme/ThemeTool.js +1 -1
- package/dist/theme/ThemeTool.js.map +1 -1
- package/package.json +1 -1
package/dist/theme/ThemeTool.cjs
CHANGED
@@ -8,5 +8,5 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
8
8
|
var t="@saas-ui/storybook-addon2",s={TOGGLE_COLOR_MODE:`${t}/toggleColorMode`,TOGGLE_DIRECTION:`${t}/toggleDirection`,SET_THEME:`${t}/setTheme`};var I={0:"Chakra UI",1:"Saas UI",2:"Glass"},$=()=>{let n=localStorage.getItem("saas-ui-theme"),[l,c]=managerApi.useAddonState(`${t}/theme`,n),r=previewApi.addons.getChannel(),e=o=>{r.emit(s.SET_THEME,o||"1"),c(o);};return jsxRuntime.jsx(components.WithTooltip,{placement:"top",closeOnOutsideClick:!0,trigger:"click",tooltip:({onHide:o})=>jsxRuntime.jsx(components.TooltipLinkList,{links:[{id:"0",title:"Chakra UI",onClick:()=>{e("0"),o();}},{id:"1",title:"Saas UI",onClick:()=>{e("1"),o();}},{id:"2",title:"Glass",onClick:()=>{e("2"),o();}}]}),children:jsxRuntime.jsxs(components.IconButton,{title:"Select theme",children:[jsxRuntime.jsx(components.Icons,{icon:"eye"})," ",I[l||"1"]]})})};
|
9
9
|
|
10
10
|
exports.ThemeTool = $;
|
11
|
-
//# sourceMappingURL=
|
11
|
+
//# sourceMappingURL=ThemeTool.cjs.map
|
12
12
|
//# sourceMappingURL=ThemeTool.cjs.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/
|
1
|
+
{"version":3,"sources":["../../src/constants.ts","../../src/theme/ThemeTool.tsx"],"names":["ADDON_ID","EVENTS","themes","ThemeTool","themeId","theme","setTheme","useAddonState","channel","addons","setActiveTheme","jsx","WithTooltip","onHide","TooltipLinkList","jsxs","IconButton","Icons"],"mappings":";;;;;;;IAAaA,CAAW,CAAA,2BAAA,CAKXC,EAAS,CACpB,iBAAA,CAAmB,GAAGD,CAAQ,CAAA,gBAAA,CAAA,CAC9B,iBAAkB,CAAGA,EAAAA,CAAQ,mBAC7B,SAAW,CAAA,CAAA,EAAGA,CAAQ,CACxB,SAAA,CAAA,ECCME,IAAAA,CAAAA,CAAiC,CACrC,CAAG,CAAA,WAAA,CACH,EAAG,SACH,CAAA,CAAA,CAAG,OACL,CAKaC,CAAAA,CAAAA,CAAY,IAAM,CAC7B,IAAMC,EAAU,YAAa,CAAA,OAAA,CAAQ,eAAe,CAC9C,CAAA,CAACC,EAAOC,CAAQ,CAAA,CAAIC,yBAAc,CAAGP,EAAAA,CAAQ,SAAUI,CAAO,CAAA,CAE9DI,EAAUC,iBAAO,CAAA,UAAA,GAEjBC,CAAkBN,CAAAA,CAAAA,EAAoB,CAC1CI,CAAQ,CAAA,IAAA,CAAKP,EAAO,SAAYG,CAAAA,CAAAA,EAAU,GAAa,CAAA,CACvDE,EAASF,CAAO,EAClB,EAEA,OACEO,cAAAA,CAACC,uBAAA,CACC,SAAA,CAAU,MACV,mBAAmB,CAAA,CAAA,CAAA,CACnB,QAAQ,OACR,CAAA,OAAA,CAAS,CAAC,CAAE,MAAA,CAAAC,CAAO,CACjBF,GAAAA,cAAAA,CAACG,2BAAA,CACC,KAAA,CAAO,CACL,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,WAAA,CACP,QAAS,IAAM,CACbJ,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,EACA,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,SAAA,CACP,QAAS,IAAM,CACbH,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,EACA,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,OAAA,CACP,QAAS,IAAM,CACbH,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,CACF,CACF,CAAA,CAAA,CAGF,SAAAE,eAACC,CAAAA,qBAAAA,CAAA,CAAW,KAAM,CAAA,cAAA,CAChB,UAAAL,cAACM,CAAAA,gBAAAA,CAAA,CAAM,IAAK,CAAA,KAAA,CAAM,EAAE,GAAEf,CAAAA,CAAAA,CAAOG,GAAS,GAAG,CAAA,CAAA,CAC3C,EACF,CAEJ","file":"ThemeTool.cjs","sourcesContent":["export const ADDON_ID = '@saas-ui/storybook-addon2'\nexport const COLOR_MODE_TOOL_ID = `${ADDON_ID}/color-mode-tool`\nexport const DIRECTION_TOOL_ID = `${ADDON_ID}/direction-tool`\nexport const THEME_TOOL_ID = `${ADDON_ID}/theme-tool`\n\nexport const EVENTS = {\n TOGGLE_COLOR_MODE: `${ADDON_ID}/toggleColorMode`,\n TOGGLE_DIRECTION: `${ADDON_ID}/toggleDirection`,\n SET_THEME: `${ADDON_ID}/setTheme`,\n}\n","import {\n IconButton,\n WithTooltip,\n TooltipLinkList,\n Icons,\n} from '@storybook/components'\nimport { ADDON_ID, EVENTS } from '../constants'\nimport { addons } from '@storybook/preview-api'\nimport { useAddonState } from '@storybook/manager-api'\n\nconst themes: Record<string, string> = {\n 0: 'Chakra UI',\n 1: 'Saas UI',\n 2: 'Glass',\n}\n\n/**\n * This component is rendered in the Storybook toolbar\n */\nexport const ThemeTool = () => {\n const themeId = localStorage.getItem('saas-ui-theme')\n const [theme, setTheme] = useAddonState(`${ADDON_ID}/theme`, themeId)\n\n const channel = addons.getChannel()\n\n const setActiveTheme = (themeId: string) => {\n channel.emit(EVENTS.SET_THEME, !themeId ? '1' : themeId)\n setTheme(themeId)\n }\n\n return (\n <WithTooltip\n placement=\"top\"\n closeOnOutsideClick\n trigger=\"click\"\n tooltip={({ onHide }) => (\n <TooltipLinkList\n links={[\n {\n id: '0',\n title: 'Chakra UI',\n onClick: () => {\n setActiveTheme('0')\n onHide()\n },\n },\n {\n id: '1',\n title: 'Saas UI',\n onClick: () => {\n setActiveTheme('1')\n onHide()\n },\n },\n {\n id: '2',\n title: 'Glass',\n onClick: () => {\n setActiveTheme('2')\n onHide()\n },\n },\n ]}\n />\n )}\n >\n <IconButton title=\"Select theme\">\n <Icons icon=\"eye\" /> {themes[theme || '1']}\n </IconButton>\n </WithTooltip>\n )\n}\n"]}
|
package/dist/theme/ThemeTool.js
CHANGED
@@ -6,5 +6,5 @@ import { jsx, jsxs } from 'react/jsx-runtime';
|
|
6
6
|
var t="@saas-ui/storybook-addon2",s={TOGGLE_COLOR_MODE:`${t}/toggleColorMode`,TOGGLE_DIRECTION:`${t}/toggleDirection`,SET_THEME:`${t}/setTheme`};var I={0:"Chakra UI",1:"Saas UI",2:"Glass"},$=()=>{let n=localStorage.getItem("saas-ui-theme"),[l,c]=useAddonState(`${t}/theme`,n),r=addons.getChannel(),e=o=>{r.emit(s.SET_THEME,o||"1"),c(o);};return jsx(WithTooltip,{placement:"top",closeOnOutsideClick:!0,trigger:"click",tooltip:({onHide:o})=>jsx(TooltipLinkList,{links:[{id:"0",title:"Chakra UI",onClick:()=>{e("0"),o();}},{id:"1",title:"Saas UI",onClick:()=>{e("1"),o();}},{id:"2",title:"Glass",onClick:()=>{e("2"),o();}}]}),children:jsxs(IconButton,{title:"Select theme",children:[jsx(Icons,{icon:"eye"})," ",I[l||"1"]]})})};
|
7
7
|
|
8
8
|
export { $ as ThemeTool };
|
9
|
-
//# sourceMappingURL=
|
9
|
+
//# sourceMappingURL=ThemeTool.js.map
|
10
10
|
//# sourceMappingURL=ThemeTool.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/
|
1
|
+
{"version":3,"sources":["../../src/constants.ts","../../src/theme/ThemeTool.tsx"],"names":["ADDON_ID","EVENTS","themes","ThemeTool","themeId","theme","setTheme","useAddonState","channel","addons","setActiveTheme","jsx","WithTooltip","onHide","TooltipLinkList","jsxs","IconButton","Icons"],"mappings":";;;;;IAAaA,CAAW,CAAA,2BAAA,CAKXC,EAAS,CACpB,iBAAA,CAAmB,GAAGD,CAAQ,CAAA,gBAAA,CAAA,CAC9B,iBAAkB,CAAGA,EAAAA,CAAQ,mBAC7B,SAAW,CAAA,CAAA,EAAGA,CAAQ,CACxB,SAAA,CAAA,ECCME,IAAAA,CAAAA,CAAiC,CACrC,CAAG,CAAA,WAAA,CACH,EAAG,SACH,CAAA,CAAA,CAAG,OACL,CAKaC,CAAAA,CAAAA,CAAY,IAAM,CAC7B,IAAMC,EAAU,YAAa,CAAA,OAAA,CAAQ,eAAe,CAC9C,CAAA,CAACC,EAAOC,CAAQ,CAAA,CAAIC,cAAc,CAAGP,EAAAA,CAAQ,SAAUI,CAAO,CAAA,CAE9DI,EAAUC,MAAO,CAAA,UAAA,GAEjBC,CAAkBN,CAAAA,CAAAA,EAAoB,CAC1CI,CAAQ,CAAA,IAAA,CAAKP,EAAO,SAAYG,CAAAA,CAAAA,EAAU,GAAa,CAAA,CACvDE,EAASF,CAAO,EAClB,EAEA,OACEO,GAAAA,CAACC,YAAA,CACC,SAAA,CAAU,MACV,mBAAmB,CAAA,CAAA,CAAA,CACnB,QAAQ,OACR,CAAA,OAAA,CAAS,CAAC,CAAE,MAAA,CAAAC,CAAO,CACjBF,GAAAA,GAAAA,CAACG,gBAAA,CACC,KAAA,CAAO,CACL,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,WAAA,CACP,QAAS,IAAM,CACbJ,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,EACA,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,SAAA,CACP,QAAS,IAAM,CACbH,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,EACA,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,OAAA,CACP,QAAS,IAAM,CACbH,EAAe,GAAG,CAAA,CAClBG,IACF,CACF,CACF,CACF,CAAA,CAAA,CAGF,SAAAE,IAACC,CAAAA,UAAAA,CAAA,CAAW,KAAM,CAAA,cAAA,CAChB,UAAAL,GAACM,CAAAA,KAAAA,CAAA,CAAM,IAAK,CAAA,KAAA,CAAM,EAAE,GAAEf,CAAAA,CAAAA,CAAOG,GAAS,GAAG,CAAA,CAAA,CAC3C,EACF,CAEJ","file":"ThemeTool.js","sourcesContent":["export const ADDON_ID = '@saas-ui/storybook-addon2'\nexport const COLOR_MODE_TOOL_ID = `${ADDON_ID}/color-mode-tool`\nexport const DIRECTION_TOOL_ID = `${ADDON_ID}/direction-tool`\nexport const THEME_TOOL_ID = `${ADDON_ID}/theme-tool`\n\nexport const EVENTS = {\n TOGGLE_COLOR_MODE: `${ADDON_ID}/toggleColorMode`,\n TOGGLE_DIRECTION: `${ADDON_ID}/toggleDirection`,\n SET_THEME: `${ADDON_ID}/setTheme`,\n}\n","import {\n IconButton,\n WithTooltip,\n TooltipLinkList,\n Icons,\n} from '@storybook/components'\nimport { ADDON_ID, EVENTS } from '../constants'\nimport { addons } from '@storybook/preview-api'\nimport { useAddonState } from '@storybook/manager-api'\n\nconst themes: Record<string, string> = {\n 0: 'Chakra UI',\n 1: 'Saas UI',\n 2: 'Glass',\n}\n\n/**\n * This component is rendered in the Storybook toolbar\n */\nexport const ThemeTool = () => {\n const themeId = localStorage.getItem('saas-ui-theme')\n const [theme, setTheme] = useAddonState(`${ADDON_ID}/theme`, themeId)\n\n const channel = addons.getChannel()\n\n const setActiveTheme = (themeId: string) => {\n channel.emit(EVENTS.SET_THEME, !themeId ? '1' : themeId)\n setTheme(themeId)\n }\n\n return (\n <WithTooltip\n placement=\"top\"\n closeOnOutsideClick\n trigger=\"click\"\n tooltip={({ onHide }) => (\n <TooltipLinkList\n links={[\n {\n id: '0',\n title: 'Chakra UI',\n onClick: () => {\n setActiveTheme('0')\n onHide()\n },\n },\n {\n id: '1',\n title: 'Saas UI',\n onClick: () => {\n setActiveTheme('1')\n onHide()\n },\n },\n {\n id: '2',\n title: 'Glass',\n onClick: () => {\n setActiveTheme('2')\n onHide()\n },\n },\n ]}\n />\n )}\n >\n <IconButton title=\"Select theme\">\n <Icons icon=\"eye\" /> {themes[theme || '1']}\n </IconButton>\n </WithTooltip>\n )\n}\n"]}
|