@saas-ui/storybook-addon 6.0.1 → 7.0.0-next.0

package/dist/manager.js

@@ -1,10 +1,33 @@
-import { addons, types, useGlobals, useAddonState } from '@storybook/manager-api';
-import * as g from 'react';
-import { useEffect, useCallback } from 'react';
-import { IconButton, WithTooltip, TooltipLinkList, Icons } from '@storybook/components';
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { addons as addons$1 } from '@storybook/preview-api';
-
-var c="@saas-ui/storybook-addon2",T=`${c}/color-mode-tool`,a=`${c}/direction-tool`,O=`${c}/theme-tool`,h={TOGGLE_COLOR_MODE:`${c}/toggleColorMode`,TOGGLE_DIRECTION:`${c}/toggleDirection`,SET_THEME:`${c}/setTheme`};var M=()=>jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsx("path",{fill:"currentColor",d:"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z"})}),k=()=>jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsxs("g",{strokeLinejoin:"round",strokeLinecap:"round",strokeWidth:"2",fill:"none",stroke:"currentColor",children:[jsx("circle",{cx:"12",cy:"12",r:"5"}),jsx("path",{d:"M12 1v2"}),jsx("path",{d:"M12 21v2"}),jsx("path",{d:"M4.22 4.22l1.42 1.42"}),jsx("path",{d:"M18.36 18.36l1.42 1.42"}),jsx("path",{d:"M1 12h2"}),jsx("path",{d:"M21 12h2"}),jsx("path",{d:"M4.22 19.78l1.42-1.42"}),jsx("path",{d:"M18.36 5.64l1.42-1.42"})]})}),C=()=>{let n=localStorage.getItem("chakra-ui-color-mode")==="dark",[o,e]=g.useState(n),s=addons.getChannel();return jsx(IconButton,{title:`Set color mode to ${o?"light":"dark"}`,active:o,onClick:()=>{s.emit(h.TOGGLE_COLOR_MODE,o?"light":"dark"),e(r=>!r);},children:o?jsx(k,{}):jsx(M,{})})};var N=n=>jsxs("svg",{stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"},...n,children:[jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsx("path",{d:"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z"})]}),y=n=>jsxs("svg",{stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"},...n,children:[jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsx("path",{d:"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z"})]}),I=()=>{let[n,o]=useGlobals(),[e,s]=useAddonState(a,n[a]||"ltr"),l=e!=="ltr"?"ltr":"rtl";useEffect(()=>{o({[a]:e});},[e,o]);let r=useCallback(()=>{addons.getChannel().emit(h.TOGGLE_DIRECTION,l),s(l);},[s,l]);return jsx(IconButton,{active:e==="rtl",title:`Set layout direction to ${l}`,onClick:r,children:l==="ltr"?jsx(N,{}):jsx(y,{})})};var w={0:"Chakra UI",1:"Saas UI",2:"Glass"},E=()=>{let n=localStorage.getItem("saas-ui-theme"),[o,e]=useAddonState(`${c}/theme`,n),s=addons$1.getChannel(),l=r=>{s.emit(h.SET_THEME,r||"1"),e(r);};return jsx(WithTooltip,{placement:"top",closeOnOutsideClick:!0,trigger:"click",tooltip:({onHide:r})=>jsx(TooltipLinkList,{links:[{id:"0",title:"Chakra UI",onClick:()=>{l("0"),r();}},{id:"1",title:"Saas UI",onClick:()=>{l("1"),r();}},{id:"2",title:"Glass",onClick:()=>{l("2"),r();}}]}),children:jsxs(IconButton,{title:"Select theme",children:[jsx(Icons,{icon:"eye"})," ",w[o||"1"]]})})};addons.register(c,n=>{let o=({viewMode:e})=>!!(e&&e.match(/^(story|docs)$/));addons.add(a,{type:types.TOOL,title:"Direction",render:I,match:o}),addons.add(T,{type:types.TOOL,title:"Color Mode",render:C,match:o}),addons.add(O,{type:types.TOOL,title:"Theme",render:E,match:o});});
-//# sourceMappingURL=manager.js.map
+'use strict';
+
+var Co = require('@storybook/manager-api');
+var M = require('react');
+var components = require('@storybook/components');
+var jsxRuntime = require('react/jsx-runtime');
+require('@storybook/types');
+require('@storybook/preview-api/dist/addons');
+
+function _interopNamespace(e) {
+	if (e && e.__esModule) return e;
+	var n = Object.create(null);
+	if (e) {
+		Object.keys(e).forEach(function (k) {
+			if (k !== 'default') {
+				var d = Object.getOwnPropertyDescriptor(e, k);
+				Object.defineProperty(n, k, d.get ? d : {
+					enumerable: true,
+					get: function () { return e[k]; }
+				});
+			}
+		});
+	}
+	n.default = e;
+	return Object.freeze(n);
+}
+
+var Co__namespace = /*#__PURE__*/_interopNamespace(Co);
+var M__namespace = /*#__PURE__*/_interopNamespace(M);
+
+var E=Object.defineProperty,V=Object.defineProperties,x=Object.getOwnPropertyDescriptor,y=Object.getOwnPropertyDescriptors,N=Object.getOwnPropertyNames,C=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable;var u=(t,o,e)=>o in t?E(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,p=(t,o)=>{for(var e in o||(o={}))I.call(o,e)&&u(t,e,o[e]);if(C)for(var e of C(o))B.call(o,e)&&u(t,e,o[e]);return t},T=(t,o)=>V(t,y(o));var f=(t,o,e,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of N(o))!I.call(t,r)&&r!==e&&E(t,r,{get:()=>o[r],enumerable:!(c=x(o,r))||c.enumerable});return t},D=(t,o,e)=>(f(t,o,"default"),e&&f(e,o,"default"));var s="@saas-ui/storybook-addon2",k=`${s}/color-mode-tool`,i=`${s}/direction-tool`,v=`${s}/theme-tool`,h={TOGGLE_COLOR_MODE:`${s}/toggleColorMode`,TOGGLE_DIRECTION:`${s}/toggleDirection`,SET_THEME:`${s}/setTheme`};var H=()=>jsxRuntime.jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsxRuntime.jsx("path",{fill:"currentColor",d:"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z"})}),A=()=>jsxRuntime.jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsxRuntime.jsxs("g",{strokeLinejoin:"round",strokeLinecap:"round",strokeWidth:"2",fill:"none",stroke:"currentColor",children:[jsxRuntime.jsx("circle",{cx:"12",cy:"12",r:"5"}),jsxRuntime.jsx("path",{d:"M12 1v2"}),jsxRuntime.jsx("path",{d:"M12 21v2"}),jsxRuntime.jsx("path",{d:"M4.22 4.22l1.42 1.42"}),jsxRuntime.jsx("path",{d:"M18.36 18.36l1.42 1.42"}),jsxRuntime.jsx("path",{d:"M1 12h2"}),jsxRuntime.jsx("path",{d:"M21 12h2"}),jsxRuntime.jsx("path",{d:"M4.22 19.78l1.42-1.42"}),jsxRuntime.jsx("path",{d:"M18.36 5.64l1.42-1.42"})]})}),_=()=>{let t=localStorage.getItem("chakra-ui-color-mode")==="dark",[o,e]=M__namespace.useState(t),c=Co.addons.getChannel();return jsxRuntime.jsx(components.IconButton,{title:`Set color mode to ${o?"light":"dark"}`,active:o,onClick:()=>{c.emit(h.TOGGLE_COLOR_MODE,o?"light":"dark"),e(l=>!l);},children:o?jsxRuntime.jsx(A,{}):jsxRuntime.jsx(H,{})})};var J=t=>jsxRuntime.jsxs("svg",T(p({stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"}},t),{children:[jsxRuntime.jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsxRuntime.jsx("path",{d:"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z"})]})),K=t=>jsxRuntime.jsxs("svg",T(p({stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"}},t),{children:[jsxRuntime.jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsxRuntime.jsx("path",{d:"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z"})]})),S=()=>{let[t,o]=Co.useGlobals(),[e,c]=Co.useAddonState(i,t[i]||"ltr"),r=e!=="ltr"?"ltr":"rtl";M.useEffect(()=>{o({[i]:e});},[e,o]);let l=M.useCallback(()=>{Co.addons.getChannel().emit(h.TOGGLE_DIRECTION,r),c(r);},[c,r]);return jsxRuntime.jsx(components.IconButton,{active:e==="rtl",title:`Set layout direction to ${r}`,onClick:l,children:r==="ltr"?jsxRuntime.jsx(J,{}):jsxRuntime.jsx(K,{})})};var m={};D(m,Co__namespace);var j={0:"Chakra UI",1:"Saas UI",2:"Glass"},R=()=>{let t=localStorage.getItem("saas-ui-theme"),[o,e]=(0, m.useAddonState)(`${s}/theme`,t),c=Co.addons.getChannel(),r=l=>{c.emit(h.SET_THEME,l||"1"),e(l);};return jsxRuntime.jsx(components.WithTooltip,{placement:"top",closeOnClick:!0,trigger:"click",tooltip:({onHide:l})=>jsxRuntime.jsx(components.TooltipLinkList,{links:[{id:"0",title:"Chakra UI",onClick:()=>{r("0"),l();}},{id:"1",title:"Saas UI",onClick:()=>{r("1"),l();}},{id:"2",title:"Glass",onClick:()=>{r("2"),l();}}]}),children:jsxRuntime.jsxs(components.IconButton,{title:"Select theme",children:[jsxRuntime.jsx(components.Icons,{icon:"eye"})," ",j[o||"1"]]})})};Co.addons.register(s,()=>{let t=({viewMode:o})=>!!(o&&o.match(/^(story|docs)$/));Co.addons.add(i,{type:Co.types.TOOL,title:"Direction",render:S,match:t}),Co.addons.add(k,{type:Co.types.TOOL,title:"Color Mode",render:_,match:t}),Co.addons.add(v,{type:Co.types.TOOL,title:"Theme",render:R,match:t});});
+//# sourceMappingURL=out.js.map
 //# sourceMappingURL=manager.js.map

package/dist/manager.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/constants.ts","../src/color-mode/ColorModeTool.tsx","../src/direction/DirectionTool.tsx","../src/theme/ThemeTool.tsx","../src/manager.ts"],"names":["ADDON_ID","COLOR_MODE_TOOL_ID","DIRECTION_TOOL_ID","THEME_TOOL_ID","EVENTS","MoonIcon","jsx","SunIcon","jsxs","ColorModeTool","isDarkMode","darkMode","setDarkMode","channel","addons","IconButton","prev","LTRIcon","props","RTLIcon","DirectionTool","globals","setGlobals","useGlobals","direction","setDirection","useAddonState","targetDirection","useEffect","toggleDirection","useCallback","themes","ThemeTool","themeId","theme","setTheme","setActiveTheme","WithTooltip","onHide","TooltipLinkList","Icons","api","match","viewMode","types"],"mappings":";;;;;;;AAAO,IAAMA,CAAAA,CAAW,2BACXC,CAAAA,CAAAA,CAAqB,GAAGD,CAAQ,CAAA,gBAAA,CAAA,CAChCE,CAAoB,CAAA,CAAA,EAAGF,CAAQ,CAC/BG,eAAAA,CAAAA,CAAAA,CAAAA,CAAgB,CAAGH,EAAAA,CAAQ,CAE3BI,WAAAA,CAAAA,CAAAA,CAAAA,CAAS,CACpB,iBAAA,CAAmB,GAAGJ,CAAQ,CAAA,gBAAA,CAAA,CAC9B,gBAAkB,CAAA,CAAA,EAAGA,CAAQ,CAC7B,gBAAA,CAAA,CAAA,SAAA,CAAW,CAAGA,EAAAA,CAAQ,WACxB,CCTA,CAMA,IAAMK,EAAW,IACfC,GAAAA,CAAC,KAAI,CAAA,CAAA,OAAA,CAAQ,YAAY,SAAU,CAAA,OAAA,CACjC,QAAAA,CAAAA,GAAAA,CAAC,QACC,IAAK,CAAA,cAAA,CACL,CAAE,CAAA,oOAAA,CACH,EACH,CAGIC,CAAAA,CAAAA,CAAU,IACdD,GAAAA,CAAC,OAAI,OAAQ,CAAA,WAAA,CAAY,SAAU,CAAA,OAAA,CACjC,QAAAE,CAAAA,IAAAA,CAAC,GACC,CAAA,CAAA,cAAA,CAAe,QACf,aAAc,CAAA,OAAA,CACd,WAAY,CAAA,GAAA,CACZ,KAAK,MACL,CAAA,MAAA,CAAO,cAEP,CAAA,QAAA,CAAA,CAAAF,IAAC,QAAO,CAAA,CAAA,EAAA,CAAG,IAAK,CAAA,EAAA,CAAG,KAAK,CAAE,CAAA,GAAA,CAAI,CAC9BA,CAAAA,GAAAA,CAAC,QAAK,CAAE,CAAA,SAAA,CAAU,CAClBA,CAAAA,GAAAA,CAAC,QAAK,CAAE,CAAA,UAAA,CAAW,CACnBA,CAAAA,GAAAA,CAAC,QAAK,CAAE,CAAA,sBAAA,CAAuB,CAC/BA,CAAAA,GAAAA,CAAC,MAAK,CAAA,CAAA,CAAA,CAAE,wBAAyB,CAAA,CAAA,CACjCA,IAAC,MAAK,CAAA,CAAA,CAAA,CAAE,SAAU,CAAA,CAAA,CAClBA,IAAC,MAAK,CAAA,CAAA,CAAA,CAAE,UAAW,CAAA,CAAA,CACnBA,IAAC,MAAK,CAAA,CAAA,CAAA,CAAE,uBAAwB,CAAA,CAAA,CAChCA,IAAC,MAAK,CAAA,CAAA,CAAA,CAAE,uBAAwB,CAAA,CAAA,CAAA,CAClC,EACF,CAGWG,CAAAA,CAAAA,CAAgB,IAAM,CACjC,IAAMC,CAAa,CAAA,YAAA,CAAa,OAAQ,CAAA,sBAAsB,IAAM,MAE9D,CAAA,CAACC,CAAUC,CAAAA,CAAW,CAAU,CAAA,CAAA,CAAA,QAAA,CAASF,CAAU,CAAA,CAEnDG,EAAUC,MAAO,CAAA,UAAA,EAOvB,CAAA,OACER,IAACS,UAAA,CAAA,CACC,KAAO,CAAA,CAAA,kBAAA,EAAqBJ,EAAW,OAAU,CAAA,MAAM,CACvD,CAAA,CAAA,MAAA,CAAQA,CACR,CAAA,OAAA,CATiB,IAAM,CACzBE,EAAQ,IAAKT,CAAAA,CAAAA,CAAO,iBAAoBO,CAAAA,CAAAA,CAAoB,QAAT,MAAgB,CAAA,CACnEC,CAAaI,CAAAA,CAAAA,EAAS,CAACA,CAAI,EAC7B,CAQK,CAAA,QAAA,CAAAL,CAAWL,CAAAA,GAAAA,CAACC,CAAA,CAAA,EAAQ,EAAKD,GAACD,CAAAA,CAAAA,CAAA,EAAS,CAAA,CACtC,CAEJ,CC1DA,CAKA,IAAMY,CAAAA,CAAWC,CACfV,EAAAA,IAAAA,CAAC,KACC,CAAA,CAAA,MAAA,CAAO,cACP,CAAA,IAAA,CAAK,eACL,WAAY,CAAA,GAAA,CACZ,OAAQ,CAAA,WAAA,CACR,OAAO,KACP,CAAA,KAAA,CAAM,KACN,CAAA,KAAA,CAAO,CACL,SAAW,CAAA,YACb,CACC,CAAA,GAAGU,EAEJ,QAAAZ,CAAAA,CAAAA,GAAAA,CAAC,MAAK,CAAA,CAAA,IAAA,CAAK,OAAO,CAAE,CAAA,iBAAA,CAAkB,CACtCA,CAAAA,GAAAA,CAAC,QAAK,CAAE,CAAA,iHAAA,CAAkH,CAC5H,CAAA,CAAA,CAAA,CAGIa,EAAWD,CACfV,EAAAA,IAAAA,CAAC,KACC,CAAA,CAAA,MAAA,CAAO,cACP,CAAA,IAAA,CAAK,cACL,CAAA,WAAA,CAAY,IACZ,OAAQ,CAAA,WAAA,CACR,MAAO,CAAA,KAAA,CACP,MAAM,KACN,CAAA,KAAA,CAAO,CACL,SAAA,CAAW,YACb,CACC,CAAA,GAAGU,CAEJ,CAAA,QAAA,CAAA,CAAAZ,IAAC,MAAK,CAAA,CAAA,IAAA,CAAK,MAAO,CAAA,CAAA,CAAE,kBAAkB,CACtCA,CAAAA,GAAAA,CAAC,MAAK,CAAA,CAAA,CAAA,CAAE,wHAAwH,CAClI,CAAA,CAAA,CAAA,CAMWc,CAAgB,CAAA,IAAM,CACjC,GAAM,CAACC,CAASC,CAAAA,CAAU,CAAIC,CAAAA,UAAAA,EACxB,CAAA,CAACC,EAAWC,CAAY,CAAA,CAAIC,aAChCxB,CAAAA,CAAAA,CACAmB,EAAQnB,CAAiB,CAAA,EAAK,KAChC,CAAA,CACMyB,EAAkBH,CAAc,GAAA,KAAA,CAAQ,KAAQ,CAAA,KAAA,CACtDI,SAAU,CAAA,IAAM,CACdN,CAAAA,CAAW,CAAE,CAACpB,CAAiB,EAAGsB,CAAU,CAAC,EAC/C,CAAA,CAAG,CAACA,CAAAA,CAAWF,CAAU,CAAC,CAAA,CAE1B,IAAMO,CAAAA,CAAkBC,WAAY,CAAA,IAAM,CACxBhB,MAAAA,CAAO,YACf,CAAA,IAAA,CAAKV,CAAO,CAAA,gBAAA,CAAkBuB,CAAe,CACrDF,CAAAA,CAAAA,CAAaE,CAAe,EAC9B,EAAG,CAACF,CAAAA,CAAcE,CAAe,CAAC,EAElC,OACErB,GAAAA,CAACS,UAAA,CAAA,CACC,OAAQS,CAAc,GAAA,KAAA,CACtB,KAAO,CAAA,CAAA,wBAAA,EAA2BG,CAAe,CACjD,CAAA,CAAA,OAAA,CAASE,CAER,CAAA,QAAA,CAAAF,IAAoB,KAAQrB,CAAAA,GAAAA,CAACW,CAAA,CAAA,EAAQ,CAAKX,CAAAA,GAAAA,CAACa,CAAA,CAAA,EAAQ,EACtD,CAEJ,CAAA,CC5DA,IAAMY,CAAAA,CAAiC,CACrC,CAAA,CAAG,YACH,CAAG,CAAA,SAAA,CACH,CAAG,CAAA,OACL,CAKaC,CAAAA,CAAAA,CAAY,IAAM,CAC7B,IAAMC,CAAU,CAAA,YAAA,CAAa,OAAQ,CAAA,eAAe,EAC9C,CAACC,CAAAA,CAAOC,CAAQ,CAAA,CAAIT,cAAc,CAAG1B,EAAAA,CAAQ,CAAUiC,MAAAA,CAAAA,CAAAA,CAAO,EAE9DpB,CAAUC,CAAAA,QAAAA,CAAO,UAAW,EAAA,CAE5BsB,EAAkBH,CAAoB,EAAA,CAC1CpB,CAAQ,CAAA,IAAA,CAAKT,EAAO,SAAY6B,CAAAA,CAAAA,EAAU,GAAa,CAAA,CACvDE,EAASF,CAAO,EAClB,CAEA,CAAA,OACE3B,GAAC+B,CAAAA,WAAAA,CAAA,CACC,SAAA,CAAU,MACV,mBAAmB,CAAA,CAAA,CAAA,CACnB,OAAQ,CAAA,OAAA,CACR,QAAS,CAAC,CAAE,MAAAC,CAAAA,CAAO,IACjBhC,GAACiC,CAAAA,eAAAA,CAAA,CACC,KAAA,CAAO,CACL,CACE,EAAI,CAAA,GAAA,CACJ,MAAO,WACP,CAAA,OAAA,CAAS,IAAM,CACbH,EAAe,GAAG,CAAA,CAClBE,CAAO,GACT,CACF,CACA,CAAA,CACE,EAAI,CAAA,GAAA,CACJ,KAAO,CAAA,SAAA,CACP,OAAS,CAAA,IAAM,CACbF,CAAe,CAAA,GAAG,CAClBE,CAAAA,CAAAA,GACF,CACF,CAAA,CACA,CACE,EAAA,CAAI,IACJ,KAAO,CAAA,OAAA,CACP,OAAS,CAAA,IAAM,CACbF,CAAe,CAAA,GAAG,CAClBE,CAAAA,CAAAA,GACF,CACF,CACF,CACF,CAAA,CAAA,CAGF,SAAA9B,IAACO,CAAAA,UAAAA,CAAA,CAAW,KAAA,CAAM,eAChB,QAAAT,CAAAA,CAAAA,GAAAA,CAACkC,KAAA,CAAA,CAAM,IAAK,CAAA,KAAA,CAAM,CAAE,CAAA,GAAA,CAAET,EAAOG,CAAS,EAAA,GAAG,CAC3C,CAAA,CAAA,CAAA,CACF,CAEJ,CC5DApB,CAAAA,MAAAA,CAAO,QAASd,CAAAA,CAAAA,CAAWyC,GAAQ,CACjC,IAAMC,CAAQ,CAAA,CAAC,CAAE,QAAAC,CAAAA,CAAS,CACxB,GAAA,CAAA,EAAQA,GAAYA,CAAS,CAAA,KAAA,CAAM,gBAAgB,CAAA,CAAA,CAErD7B,OAAO,GAAIZ,CAAAA,CAAAA,CAAmB,CAC5B,IAAA,CAAM0C,MAAM,IACZ,CAAA,KAAA,CAAO,WACP,CAAA,MAAA,CAAQxB,CACR,CAAA,KAAA,CAAAsB,CACF,CAAC,EAED5B,MAAO,CAAA,GAAA,CAAIb,CAAoB,CAAA,CAC7B,KAAM2C,KAAM,CAAA,IAAA,CACZ,KAAO,CAAA,YAAA,CACP,OAAQnC,CACR,CAAA,KAAA,CAAAiC,CACF,CAAC,EAED5B,MAAO,CAAA,GAAA,CAAIX,CAAe,CAAA,CACxB,KAAMyC,KAAM,CAAA,IAAA,CACZ,KAAO,CAAA,OAAA,CACP,OAAQZ,CACR,CAAA,KAAA,CAAAU,CACF,CAAC,EACH,CAAC,CAAA","file":"manager.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 * as React from 'react'\nimport { IconButton } from '@storybook/components'\nimport { addons } from '@storybook/manager-api'\n\nimport { EVENTS } from '../constants'\n\nconst MoonIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <path\n      fill=\"currentColor\"\n      d=\"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z\"\n    ></path>\n  </svg>\n)\n\nconst SunIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <g\n      strokeLinejoin=\"round\"\n      strokeLinecap=\"round\"\n      strokeWidth=\"2\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"5\"></circle>\n      <path d=\"M12 1v2\"></path>\n      <path d=\"M12 21v2\"></path>\n      <path d=\"M4.22 4.22l1.42 1.42\"></path>\n      <path d=\"M18.36 18.36l1.42 1.42\"></path>\n      <path d=\"M1 12h2\"></path>\n      <path d=\"M21 12h2\"></path>\n      <path d=\"M4.22 19.78l1.42-1.42\"></path>\n      <path d=\"M18.36 5.64l1.42-1.42\"></path>\n    </g>\n  </svg>\n)\n\nexport const ColorModeTool = () => {\n  const isDarkMode = localStorage.getItem('chakra-ui-color-mode') === 'dark'\n\n  const [darkMode, setDarkMode] = React.useState(isDarkMode)\n\n  const channel = addons.getChannel()\n\n  const handleToggle = () => {\n    channel.emit(EVENTS.TOGGLE_COLOR_MODE, !darkMode ? 'dark' : 'light')\n    setDarkMode((prev) => !prev)\n  }\n\n  return (\n    <IconButton\n      title={`Set color mode to ${darkMode ? 'light' : 'dark'}`}\n      active={darkMode}\n      onClick={handleToggle}\n    >\n      {darkMode ? <SunIcon /> : <MoonIcon />}\n    </IconButton>\n  )\n}\n","import { useCallback, useEffect } from 'react'\nimport { addons, useAddonState, useGlobals } from '@storybook/manager-api'\nimport { IconButton } from '@storybook/components'\nimport { DIRECTION_TOOL_ID, EVENTS } from '../constants'\n\nconst LTRIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z\" />\n  </svg>\n)\n\nconst RTLIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z\" />\n  </svg>\n)\n\n/**\n * This component is rendered in the Storybook toolbar\n */\nexport const DirectionTool = () => {\n  const [globals, setGlobals] = useGlobals()\n  const [direction, setDirection] = useAddonState(\n    DIRECTION_TOOL_ID,\n    globals[DIRECTION_TOOL_ID] || 'ltr'\n  )\n  const targetDirection = direction !== 'ltr' ? 'ltr' : 'rtl'\n  useEffect(() => {\n    setGlobals({ [DIRECTION_TOOL_ID]: direction })\n  }, [direction, setGlobals])\n\n  const toggleDirection = useCallback(() => {\n    const channel = addons.getChannel()\n    channel.emit(EVENTS.TOGGLE_DIRECTION, targetDirection)\n    setDirection(targetDirection)\n  }, [setDirection, targetDirection])\n\n  return (\n    <IconButton\n      active={direction === 'rtl'}\n      title={`Set layout direction to ${targetDirection}`}\n      onClick={toggleDirection}\n    >\n      {targetDirection === 'ltr' ? <LTRIcon /> : <RTLIcon />}\n    </IconButton>\n  )\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","import { addons, types } from '@storybook/manager-api'\nimport {\n  ADDON_ID,\n  COLOR_MODE_TOOL_ID,\n  DIRECTION_TOOL_ID,\n  THEME_TOOL_ID,\n} from './constants'\nimport { ColorModeTool } from './color-mode/ColorModeTool'\nimport { DirectionTool } from './direction/DirectionTool'\nimport { ThemeTool } from './theme/ThemeTool'\n\naddons.register(ADDON_ID, (api) => {\n  const match = ({ viewMode }: { viewMode?: string }) =>\n    Boolean(viewMode && viewMode.match(/^(story|docs)$/))\n\n  addons.add(DIRECTION_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Direction',\n    render: DirectionTool,\n    match,\n  })\n\n  addons.add(COLOR_MODE_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Color Mode',\n    render: ColorModeTool,\n    match,\n  })\n\n  addons.add(THEME_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Theme',\n    render: ThemeTool,\n    match,\n  })\n})\n"]}
+{"version":3,"sources":["../src/manager.ts","../src/constants.ts","../src/color-mode/ColorModeTool.tsx","../src/direction/DirectionTool.tsx","../../../node_modules/@storybook/api/dist/entry.mjs","../src/theme/ThemeTool.tsx","../../../node_modules/@storybook/addons/dist/index.mjs"],"names":["addons","types","ADDON_ID","COLOR_MODE_TOOL_ID","DIRECTION_TOOL_ID","THEME_TOOL_ID","EVENTS","React","IconButton","jsx","jsxs","MoonIcon","SunIcon","ColorModeTool","isDarkMode","darkMode","setDarkMode","channel","prev","useCallback","useEffect","useAddonState","useGlobals","LTRIcon","props","__spreadProps","__spreadValues","RTLIcon","DirectionTool","globals","setGlobals","direction","setDirection","targetDirection","toggleDirection","entry_exports","__reExport","manager_api_star","WithTooltip","TooltipLinkList","Icons","Addon_TypesEnum","mockChannel","HooksContext","applyHooks","makeDecorator","useArgs","useChannel","useMemo","useParameter","useReducer","useRef","useState","useStoryContext","themes","ThemeTool","themeId","theme","setTheme","setActiveTheme","onHide","match","viewMode"],"mappings":"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","sourcesContent":["import { addons, types } from '@storybook/manager-api'\nimport {\n  ADDON_ID,\n  COLOR_MODE_TOOL_ID,\n  DIRECTION_TOOL_ID,\n  THEME_TOOL_ID,\n} from './constants'\nimport { ColorModeTool } from './color-mode/ColorModeTool'\nimport { DirectionTool } from './direction/DirectionTool'\nimport { ThemeTool } from './theme/ThemeTool'\n\naddons.register(ADDON_ID, () => {\n  const match = ({ viewMode }: { viewMode?: string }) =>\n    Boolean(viewMode && viewMode.match(/^(story|docs)$/))\n\n  addons.add(DIRECTION_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Direction',\n    render: DirectionTool,\n    match,\n  })\n\n  addons.add(COLOR_MODE_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Color Mode',\n    render: ColorModeTool,\n    match,\n  })\n\n  addons.add(THEME_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Theme',\n    render: ThemeTool,\n    match,\n  })\n})\n","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 * as React from 'react'\nimport { IconButton } from '@storybook/components'\nimport { addons } from '@storybook/manager-api'\n\nimport { EVENTS } from '../constants'\n\nconst MoonIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <path\n      fill=\"currentColor\"\n      d=\"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z\"\n    ></path>\n  </svg>\n)\n\nconst SunIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <g\n      strokeLinejoin=\"round\"\n      strokeLinecap=\"round\"\n      strokeWidth=\"2\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"5\"></circle>\n      <path d=\"M12 1v2\"></path>\n      <path d=\"M12 21v2\"></path>\n      <path d=\"M4.22 4.22l1.42 1.42\"></path>\n      <path d=\"M18.36 18.36l1.42 1.42\"></path>\n      <path d=\"M1 12h2\"></path>\n      <path d=\"M21 12h2\"></path>\n      <path d=\"M4.22 19.78l1.42-1.42\"></path>\n      <path d=\"M18.36 5.64l1.42-1.42\"></path>\n    </g>\n  </svg>\n)\n\nexport const ColorModeTool = () => {\n  const isDarkMode = localStorage.getItem('chakra-ui-color-mode') === 'dark'\n\n  const [darkMode, setDarkMode] = React.useState(isDarkMode)\n\n  const channel = addons.getChannel()\n\n  const handleToggle = () => {\n    channel.emit(EVENTS.TOGGLE_COLOR_MODE, !darkMode ? 'dark' : 'light')\n    setDarkMode((prev) => !prev)\n  }\n\n  return (\n    <IconButton\n      title={`Set color mode to ${darkMode ? 'light' : 'dark'}`}\n      active={darkMode}\n      onClick={handleToggle}\n    >\n      {darkMode ? <SunIcon /> : <MoonIcon />}\n    </IconButton>\n  )\n}\n","import { useCallback, useEffect } from 'react'\nimport { addons, useAddonState, useGlobals } from '@storybook/manager-api'\nimport { IconButton } from '@storybook/components'\nimport { DIRECTION_TOOL_ID, EVENTS } from '../constants'\n\nconst LTRIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z\" />\n  </svg>\n)\n\nconst RTLIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z\" />\n  </svg>\n)\n\n/**\n * This component is rendered in the Storybook toolbar\n */\nexport const DirectionTool = () => {\n  const [globals, setGlobals] = useGlobals()\n  const [direction, setDirection] = useAddonState(\n    DIRECTION_TOOL_ID,\n    globals[DIRECTION_TOOL_ID] || 'ltr'\n  )\n  const targetDirection = direction !== 'ltr' ? 'ltr' : 'rtl'\n  useEffect(() => {\n    setGlobals({ [DIRECTION_TOOL_ID]: direction })\n  }, [direction, setGlobals])\n\n  const toggleDirection = useCallback(() => {\n    const channel = addons.getChannel()\n    channel.emit(EVENTS.TOGGLE_DIRECTION, targetDirection)\n    setDirection(targetDirection)\n  }, [setDirection, targetDirection])\n\n  return (\n    <IconButton\n      active={direction === 'rtl'}\n      title={`Set layout direction to ${targetDirection}`}\n      onClick={toggleDirection}\n    >\n      {targetDirection === 'ltr' ? <LTRIcon /> : <RTLIcon />}\n    </IconButton>\n  )\n}\n","// shim-mmode\nexport * from '@storybook/manager-api';","import { useAddonState } from '@storybook/api'\nimport {\n  IconButton,\n  WithTooltip,\n  TooltipLinkList,\n  Icons,\n} from '@storybook/components'\nimport { addons } from '@storybook/addons'\nimport { ADDON_ID, EVENTS } from '../constants'\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      closeOnClick\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","export { Addon_TypesEnum as types } from '@storybook/types';\nexport { addons, mockChannel } from '@storybook/manager-api';\nexport { HooksContext, applyHooks, makeDecorator, useArgs, useCallback, useChannel, useEffect, useGlobals, useMemo, useParameter, useReducer, useRef, useState, useStoryContext } from '@storybook/preview-api/dist/addons';\n"]}

package/dist/manager.mjs

@@ -0,0 +1,12 @@
+import * as Co from '@storybook/manager-api';
+import { addons, types, useGlobals, useAddonState } from '@storybook/manager-api';
+import * as M from 'react';
+import { useEffect, useCallback } from 'react';
+import { IconButton, WithTooltip, TooltipLinkList, Icons } from '@storybook/components';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import '@storybook/types';
+import '@storybook/preview-api/dist/addons';
+
+var E=Object.defineProperty,V=Object.defineProperties,x=Object.getOwnPropertyDescriptor,y=Object.getOwnPropertyDescriptors,N=Object.getOwnPropertyNames,C=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,B=Object.prototype.propertyIsEnumerable;var u=(t,o,e)=>o in t?E(t,o,{enumerable:!0,configurable:!0,writable:!0,value:e}):t[o]=e,p=(t,o)=>{for(var e in o||(o={}))I.call(o,e)&&u(t,e,o[e]);if(C)for(var e of C(o))B.call(o,e)&&u(t,e,o[e]);return t},T=(t,o)=>V(t,y(o));var f=(t,o,e,c)=>{if(o&&typeof o=="object"||typeof o=="function")for(let r of N(o))!I.call(t,r)&&r!==e&&E(t,r,{get:()=>o[r],enumerable:!(c=x(o,r))||c.enumerable});return t},D=(t,o,e)=>(f(t,o,"default"),e&&f(e,o,"default"));var s="@saas-ui/storybook-addon2",k=`${s}/color-mode-tool`,i=`${s}/direction-tool`,v=`${s}/theme-tool`,h={TOGGLE_COLOR_MODE:`${s}/toggleColorMode`,TOGGLE_DIRECTION:`${s}/toggleDirection`,SET_THEME:`${s}/setTheme`};var H=()=>jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsx("path",{fill:"currentColor",d:"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z"})}),A=()=>jsx("svg",{viewBox:"0 0 24 24",focusable:"false",children:jsxs("g",{strokeLinejoin:"round",strokeLinecap:"round",strokeWidth:"2",fill:"none",stroke:"currentColor",children:[jsx("circle",{cx:"12",cy:"12",r:"5"}),jsx("path",{d:"M12 1v2"}),jsx("path",{d:"M12 21v2"}),jsx("path",{d:"M4.22 4.22l1.42 1.42"}),jsx("path",{d:"M18.36 18.36l1.42 1.42"}),jsx("path",{d:"M1 12h2"}),jsx("path",{d:"M21 12h2"}),jsx("path",{d:"M4.22 19.78l1.42-1.42"}),jsx("path",{d:"M18.36 5.64l1.42-1.42"})]})}),_=()=>{let t=localStorage.getItem("chakra-ui-color-mode")==="dark",[o,e]=M.useState(t),c=addons.getChannel();return jsx(IconButton,{title:`Set color mode to ${o?"light":"dark"}`,active:o,onClick:()=>{c.emit(h.TOGGLE_COLOR_MODE,o?"light":"dark"),e(l=>!l);},children:o?jsx(A,{}):jsx(H,{})})};var J=t=>jsxs("svg",T(p({stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"}},t),{children:[jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsx("path",{d:"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z"})]})),K=t=>jsxs("svg",T(p({stroke:"currentColor",fill:"currentColor",strokeWidth:"0",viewBox:"0 0 24 24",height:"1em",width:"1em",style:{transform:"scale(1.2)"}},t),{children:[jsx("path",{fill:"none",d:"M0 0h24v24H0V0z"}),jsx("path",{d:"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z"})]})),S=()=>{let[t,o]=useGlobals(),[e,c]=useAddonState(i,t[i]||"ltr"),r=e!=="ltr"?"ltr":"rtl";useEffect(()=>{o({[i]:e});},[e,o]);let l=useCallback(()=>{addons.getChannel().emit(h.TOGGLE_DIRECTION,r),c(r);},[c,r]);return jsx(IconButton,{active:e==="rtl",title:`Set layout direction to ${r}`,onClick:l,children:r==="ltr"?jsx(J,{}):jsx(K,{})})};var m={};D(m,Co);var j={0:"Chakra UI",1:"Saas UI",2:"Glass"},R=()=>{let t=localStorage.getItem("saas-ui-theme"),[o,e]=(0, m.useAddonState)(`${s}/theme`,t),c=addons.getChannel(),r=l=>{c.emit(h.SET_THEME,l||"1"),e(l);};return jsx(WithTooltip,{placement:"top",closeOnClick:!0,trigger:"click",tooltip:({onHide:l})=>jsx(TooltipLinkList,{links:[{id:"0",title:"Chakra UI",onClick:()=>{r("0"),l();}},{id:"1",title:"Saas UI",onClick:()=>{r("1"),l();}},{id:"2",title:"Glass",onClick:()=>{r("2"),l();}}]}),children:jsxs(IconButton,{title:"Select theme",children:[jsx(Icons,{icon:"eye"})," ",j[o||"1"]]})})};addons.register(s,()=>{let t=({viewMode:o})=>!!(o&&o.match(/^(story|docs)$/));addons.add(i,{type:types.TOOL,title:"Direction",render:S,match:t}),addons.add(k,{type:types.TOOL,title:"Color Mode",render:_,match:t}),addons.add(v,{type:types.TOOL,title:"Theme",render:R,match:t});});
+//# sourceMappingURL=out.js.map
+//# sourceMappingURL=manager.mjs.map

package/dist/manager.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/manager.ts","../src/constants.ts","../src/color-mode/ColorModeTool.tsx","../src/direction/DirectionTool.tsx","../../../node_modules/@storybook/api/dist/entry.mjs","../src/theme/ThemeTool.tsx","../../../node_modules/@storybook/addons/dist/index.mjs"],"names":["addons","types","ADDON_ID","COLOR_MODE_TOOL_ID","DIRECTION_TOOL_ID","THEME_TOOL_ID","EVENTS","React","IconButton","jsx","jsxs","MoonIcon","SunIcon","ColorModeTool","isDarkMode","darkMode","setDarkMode","channel","prev","useCallback","useEffect","useAddonState","useGlobals","LTRIcon","props","__spreadProps","__spreadValues","RTLIcon","DirectionTool","globals","setGlobals","direction","setDirection","targetDirection","toggleDirection","entry_exports","__reExport","manager_api_star","WithTooltip","TooltipLinkList","Icons","Addon_TypesEnum","mockChannel","HooksContext","applyHooks","makeDecorator","useArgs","useChannel","useMemo","useParameter","useReducer","useRef","useState","useStoryContext","themes","ThemeTool","themeId","theme","setTheme","setActiveTheme","onHide","match","viewMode"],"mappings":"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","sourcesContent":["import { addons, types } from '@storybook/manager-api'\nimport {\n  ADDON_ID,\n  COLOR_MODE_TOOL_ID,\n  DIRECTION_TOOL_ID,\n  THEME_TOOL_ID,\n} from './constants'\nimport { ColorModeTool } from './color-mode/ColorModeTool'\nimport { DirectionTool } from './direction/DirectionTool'\nimport { ThemeTool } from './theme/ThemeTool'\n\naddons.register(ADDON_ID, () => {\n  const match = ({ viewMode }: { viewMode?: string }) =>\n    Boolean(viewMode && viewMode.match(/^(story|docs)$/))\n\n  addons.add(DIRECTION_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Direction',\n    render: DirectionTool,\n    match,\n  })\n\n  addons.add(COLOR_MODE_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Color Mode',\n    render: ColorModeTool,\n    match,\n  })\n\n  addons.add(THEME_TOOL_ID, {\n    type: types.TOOL,\n    title: 'Theme',\n    render: ThemeTool,\n    match,\n  })\n})\n","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 * as React from 'react'\nimport { IconButton } from '@storybook/components'\nimport { addons } from '@storybook/manager-api'\n\nimport { EVENTS } from '../constants'\n\nconst MoonIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <path\n      fill=\"currentColor\"\n      d=\"M21.4,13.7C20.6,13.9,19.8,14,19,14c-5,0-9-4-9-9c0-0.8,0.1-1.6,0.3-2.4c0.1-0.3,0-0.7-0.3-1 c-0.3-0.3-0.6-0.4-1-0.3C4.3,2.7,1,7.1,1,12c0,6.1,4.9,11,11,11c4.9,0,9.3-3.3,10.6-8.1c0.1-0.3,0-0.7-0.3-1 C22.1,13.7,21.7,13.6,21.4,13.7z\"\n    ></path>\n  </svg>\n)\n\nconst SunIcon = () => (\n  <svg viewBox=\"0 0 24 24\" focusable=\"false\">\n    <g\n      strokeLinejoin=\"round\"\n      strokeLinecap=\"round\"\n      strokeWidth=\"2\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n    >\n      <circle cx=\"12\" cy=\"12\" r=\"5\"></circle>\n      <path d=\"M12 1v2\"></path>\n      <path d=\"M12 21v2\"></path>\n      <path d=\"M4.22 4.22l1.42 1.42\"></path>\n      <path d=\"M18.36 18.36l1.42 1.42\"></path>\n      <path d=\"M1 12h2\"></path>\n      <path d=\"M21 12h2\"></path>\n      <path d=\"M4.22 19.78l1.42-1.42\"></path>\n      <path d=\"M18.36 5.64l1.42-1.42\"></path>\n    </g>\n  </svg>\n)\n\nexport const ColorModeTool = () => {\n  const isDarkMode = localStorage.getItem('chakra-ui-color-mode') === 'dark'\n\n  const [darkMode, setDarkMode] = React.useState(isDarkMode)\n\n  const channel = addons.getChannel()\n\n  const handleToggle = () => {\n    channel.emit(EVENTS.TOGGLE_COLOR_MODE, !darkMode ? 'dark' : 'light')\n    setDarkMode((prev) => !prev)\n  }\n\n  return (\n    <IconButton\n      title={`Set color mode to ${darkMode ? 'light' : 'dark'}`}\n      active={darkMode}\n      onClick={handleToggle}\n    >\n      {darkMode ? <SunIcon /> : <MoonIcon />}\n    </IconButton>\n  )\n}\n","import { useCallback, useEffect } from 'react'\nimport { addons, useAddonState, useGlobals } from '@storybook/manager-api'\nimport { IconButton } from '@storybook/components'\nimport { DIRECTION_TOOL_ID, EVENTS } from '../constants'\n\nconst LTRIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M9 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2H9C6.79 2 5 3.79 5 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zm0 12v3H5v2h12v3l4-4-4-4z\" />\n  </svg>\n)\n\nconst RTLIcon = (props: React.SVGProps<SVGSVGElement>) => (\n  <svg\n    stroke=\"currentColor\"\n    fill=\"currentColor\"\n    strokeWidth=\"0\"\n    viewBox=\"0 0 24 24\"\n    height=\"1em\"\n    width=\"1em\"\n    style={{\n      transform: 'scale(1.2)',\n    }}\n    {...props}\n  >\n    <path fill=\"none\" d=\"M0 0h24v24H0V0z\" />\n    <path d=\"M10 4v4c-1.1 0-2-.9-2-2s.9-2 2-2m8-2h-8C7.79 2 6 3.79 6 6s1.79 4 4 4v5h2V4h2v11h2V4h2V2zM8 14l-4 4 4 4v-3h12v-2H8v-3z\" />\n  </svg>\n)\n\n/**\n * This component is rendered in the Storybook toolbar\n */\nexport const DirectionTool = () => {\n  const [globals, setGlobals] = useGlobals()\n  const [direction, setDirection] = useAddonState(\n    DIRECTION_TOOL_ID,\n    globals[DIRECTION_TOOL_ID] || 'ltr'\n  )\n  const targetDirection = direction !== 'ltr' ? 'ltr' : 'rtl'\n  useEffect(() => {\n    setGlobals({ [DIRECTION_TOOL_ID]: direction })\n  }, [direction, setGlobals])\n\n  const toggleDirection = useCallback(() => {\n    const channel = addons.getChannel()\n    channel.emit(EVENTS.TOGGLE_DIRECTION, targetDirection)\n    setDirection(targetDirection)\n  }, [setDirection, targetDirection])\n\n  return (\n    <IconButton\n      active={direction === 'rtl'}\n      title={`Set layout direction to ${targetDirection}`}\n      onClick={toggleDirection}\n    >\n      {targetDirection === 'ltr' ? <LTRIcon /> : <RTLIcon />}\n    </IconButton>\n  )\n}\n","// shim-mmode\nexport * from '@storybook/manager-api';","import { useAddonState } from '@storybook/api'\nimport {\n  IconButton,\n  WithTooltip,\n  TooltipLinkList,\n  Icons,\n} from '@storybook/components'\nimport { addons } from '@storybook/addons'\nimport { ADDON_ID, EVENTS } from '../constants'\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      closeOnClick\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","export { Addon_TypesEnum as types } from '@storybook/types';\nexport { addons, mockChannel } from '@storybook/manager-api';\nexport { HooksContext, applyHooks, makeDecorator, useArgs, useCallback, useChannel, useEffect, useGlobals, useMemo, useParameter, useReducer, useRef, useState, useStoryContext } from '@storybook/preview-api/dist/addons';\n"]}