init tw

.gitignore

@@ -0,0 +1,3 @@
+node_modules
+
+stroybook-static

.npmrc

@@ -0,0 +1,4 @@
+//npm.xiongxiao.me/:_authToken=${ME_NPM_TOKEN}
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}
+
+ignore-workspace-root-check=true

.storybook/main.js

@@ -0,0 +1,28 @@
+/** @type { import('@storybook/react-vite').StorybookConfig } */
+const config = {
+  stories: [
+    '../stories/**/*.mdx',
+    '../stories/**/*.stories.@(js|jsx|mjs|ts|tsx)', //
+
+    '../packages/**/*.mdx',
+    '../packages/**/*.stories.@(js|jsx|mjs|ts|tsx)',
+  ],
+  addons: ['@storybook/addon-essentials', '@storybook/addon-onboarding', '@chromatic-com/storybook', '@storybook/experimental-addon-test'],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+  async viteFinal(config) {
+    const isDev = config.mode === 'development';
+    config.base = isDev ? '/' : '/root/tw-story'; // 设置基础路径
+    // 添加 Tailwind CSS 支持
+    config.css = {
+      postcss: {
+        // @ts-ignore
+        plugins: [require('@tailwindcss/postcss')({})],
+      },
+    };
+    return config;
+  },
+};
+export default config;

.storybook/preview.ts

@@ -0,0 +1,14 @@
+import './tailwind.css';
+/** @type { import('@storybook/react').Preview } */
+const preview = {
+  parameters: {
+    controls: {
+      matchers: {
+       color: /(background|color)$/i,
+       date: /Date$/i,
+      },
+    },
+  },
+};
+
+export default preview;

.storybook/tailwind.css

@@ -0,0 +1 @@
+@import 'tailwindcss';

.storybook/vitest.setup.js

@@ -0,0 +1,9 @@
+import { beforeAll } from 'vitest';
+import { setProjectAnnotations } from '@storybook/react';
+import * as projectAnnotations from './preview';
+
+// This is an important step to apply the right configuration when testing your stories.
+// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
+const project = setProjectAnnotations([projectAnnotations]);
+
+beforeAll(project.beforeAll);

package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@kevisual/tw",
+  "version": "0.0.1",
+  "description": "",
+  "main": "index.js",
+  "basename": "root/tw-story",
+  "scripts": {
+    "story": "storybook dev -p 6006 ",
+    "build:story": "storybook build",
+    "pub": "envision deploy ./storybook-static -k tw-story -v 0.0.1 -u"
+  },
+  "files": [
+    "storybook-static"
+  ],
+  "keywords": [],
+  "author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
+  "license": "MIT",
+  "packageManager": "pnpm@10.6.2",
+  "type": "module",
+  "dependencies": {
+    "@kevisual/types": "0.0.9",
+    "storybook": "^8.6.12",
+    "tailwindcss": "^4.1.4"
+  },
+  "devDependencies": {
+    "@chromatic-com/storybook": "^3",
+    "@storybook/addon-essentials": "^8.6.12",
+    "@storybook/addon-onboarding": "^8.6.12",
+    "@storybook/blocks": "^8.6.12",
+    "@storybook/experimental-addon-test": "^8.6.12",
+    "@storybook/react": "^8.6.12",
+    "@storybook/react-vite": "^8.6.12",
+    "@storybook/test": "^8.6.12",
+    "@tailwindcss/postcss": "^4.1.4",
+    "@types/react": "^19.1.2",
+    "@types/react-dom": "^19.1.2",
+    "@vitest/browser": "^3.1.2",
+    "@vitest/coverage-v8": "^3.1.2",
+    "playwright": "^1.52.0",
+    "prop-types": "^15.8.1",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "vitest": "^3.1.2"
+  }
+}

packages/twu/.npmrc

@@ -0,0 +1,4 @@
+//npm.xiongxiao.me/:_authToken=${ME_NPM_TOKEN}
+//registry.npmjs.org/:_authToken=${NPM_TOKEN}
+
+ignore-workspace-root-check=true

packages/twu/nav/Nav.tsx

@@ -0,0 +1,3 @@
+export const Nav = () => {
+  return <div>Nav</div>
+}

packages/twu/nav/nav.mdx

@@ -0,0 +1 @@
+# nav的模块

packages/twu/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@kevisual/twu",
+  "version": "0.0.1",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [],
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "src",
+    "nav"
+  ],
+  "author": "abearxiong <xiongxiao@xiongxiao.me> (https://www.xiongxiao.me)",
+  "license": "MIT",
+  "packageManager": "pnpm@10.6.2",
+  "type": "module",
+  "dependencies": {},
+  "devDependencies": {
+    "tailwindcss": "^4.1.4",
+    "@tailwindcss/vite": "^4.1.4"
+  }
+}

packages/twu/src/First.tsx

@@ -0,0 +1,3 @@
+export const First = () => {
+  return <div>First</div>
+}

packages/twu/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "extends": "@kevisual/types/json/frontend.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "jsx": "react-jsx",
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    }
+  },
+  "include": [
+    "src/**/*",
+    "stories/**/*",
+    "nav"
+  ]
+}

pnpm-workspace.yaml

@@ -0,0 +1,2 @@
+packages:
+  - packages/*

stories/Introduce.mdx

@@ -0,0 +1,5 @@
+# twu
+
+当使用mui的组件的时候，使用astro会有问题，所以很多的组件应该是纯原生的组件模块。
+
+使用tailwindcss来做样式，使用原生的js来做交互。

stories/Page.stories.tsx

@@ -0,0 +1,11 @@
+import { Page } from './Page';
+
+export default {
+  title: 'Page',
+  component: Page,
+};
+export const Primary = () => (
+  <div className='bg-red-500 p-4'>
+    <Page />
+  </div>
+);

stories/Page.tsx

@@ -0,0 +1,3 @@
+export const Page = () => {
+  return <div>Page</div>;
+};

stories/Test.mdx

@@ -0,0 +1 @@
+# Test

storybook-static/assets/Introduce-Cbr15kRu.js

@@ -0,0 +1,3 @@
+import{j as n}from"./jsx-runtime-D_zvdyIk.js";import{useMDXComponents as s}from"./index-CB3_FCD4.js";import"./index-MPVjHJeJ.js";function o(t){const e={h1:"h1",p:"p",...s(),...t.components};return n.jsxs(n.Fragment,{children:[n.jsx(e.h1,{id:"twu",children:"twu"}),`
+`,n.jsx(e.p,{children:"当使用mui的组件的时候，使用astro会有问题，所以很多的组件应该是纯原生的组件模块。"}),`
+`,n.jsx(e.p,{children:"使用tailwindcss来做样式，使用原生的js来做交互。"})]})}function m(t={}){const{wrapper:e}={...s(),...t.components};return e?n.jsx(e,{...t,children:n.jsx(o,{...t})}):o(t)}export{m as default};

storybook-static/assets/Page.stories-CmwSLAP_.js

@@ -0,0 +1,3 @@
+import{j as r}from"./jsx-runtime-D_zvdyIk.js";const s=()=>r.jsx("div",{children:"Page"});s.__docgenInfo={description:"",methods:[],displayName:"Page"};const i={title:"Page",component:s},e=()=>r.jsx("div",{className:"bg-red-500 p-4",children:r.jsx(s,{})});e.__docgenInfo={description:"",methods:[],displayName:"Primary"};var a,o,t;e.parameters={...e.parameters,docs:{...(a=e.parameters)==null?void 0:a.docs,source:{originalSource:`() => <div className='bg-red-500 p-4'>
+    <Page />
+  </div>`,...(t=(o=e.parameters)==null?void 0:o.docs)==null?void 0:t.source}}};const n=["Primary"];export{e as Primary,n as __namedExportsOrder,i as default};

storybook-static/assets/Test-DYyZzibc.js

@@ -0,0 +1 @@
+import{j as e}from"./jsx-runtime-D_zvdyIk.js";import{useMDXComponents as r}from"./index-CB3_FCD4.js";import"./index-MPVjHJeJ.js";function o(t){const n={h1:"h1",...r(),...t.components};return e.jsx(n.h1,{id:"test",children:"Test"})}function i(t={}){const{wrapper:n}={...r(),...t.components};return n?e.jsx(n,{...t,children:e.jsx(o,{...t})}):o(t)}export{i as default};

storybook-static/assets/chunk-XP5HYGXS-BpfKkqn7.js

@@ -0,0 +1 @@
+var u=Object.create,a=Object.defineProperty,s=Object.getOwnPropertyDescriptor,o=Object.getOwnPropertyNames,c=Object.getPrototypeOf,O=Object.prototype.hasOwnProperty,l=(e,r)=>function(){return e&&(r=(0,e[o(e)[0]])(e=0)),r},v=(e,r)=>function(){return r||(0,e[o(e)[0]])((r={exports:{}}).exports,r),r.exports},b=(e,r)=>{for(var t in r)a(e,t,{get:r[t],enumerable:!0})},n=(e,r,t,p)=>{if(r&&typeof r=="object"||typeof r=="function")for(let _ of o(r))!O.call(e,_)&&_!==t&&a(e,_,{get:()=>r[_],enumerable:!(p=s(r,_))||p.enumerable});return e},P=(e,r,t)=>(t=e!=null?u(c(e)):{},n(!e||!e.__esModule?a(t,"default",{value:e,enumerable:!0}):t,e)),y=e=>n(a({},"__esModule",{value:!0}),e);export{P as _,v as a,b,l as c,y as d};

storybook-static/assets/index-CB3_FCD4.js

@@ -0,0 +1 @@
+import{e}from"./index-MPVjHJeJ.js";const o={},c=e.createContext(o);function u(n){const t=e.useContext(c);return e.useMemo(function(){return typeof n=="function"?n(t):{...t,...n}},[t,n])}function m(n){let t;return n.disableParentContext?t=typeof n.components=="function"?n.components(o):n.components||o:t=u(n.components),e.createElement(c.Provider,{value:t},n.children)}export{m as MDXProvider,u as useMDXComponents};

storybook-static/assets/index-DrFu-skq.js

@@ -0,0 +1,6 @@
+function l(o){for(var f=[],i=1;i<arguments.length;i++)f[i-1]=arguments[i];var n=Array.from(typeof o=="string"?[o]:o);n[n.length-1]=n[n.length-1].replace(/\r?\n([\t ]*)$/,"");var s=n.reduce(function(t,g){var a=g.match(/\n([\t ]+|(?!\s).)/g);return a?t.concat(a.map(function(u){var r,e;return(e=(r=u.match(/[\t ]/g))===null||r===void 0?void 0:r.length)!==null&&e!==void 0?e:0})):t},[]);if(s.length){var d=new RegExp(`
+[	 ]{`+Math.min.apply(Math,s)+"}","g");n=n.map(function(t){return t.replace(d,`
+`)})}n[0]=n[0].replace(/^\r?\n/,"");var c=n[0];return f.forEach(function(t,g){var a=c.match(/(?:^|\n)( *)$/),u=a?a[1]:"",r=t;typeof t=="string"&&t.includes(`
+`)&&(r=String(t).split(`
+`).map(function(e,h){return h===0?e:""+u+e}).join(`
+`)),c+=r+n[g+1]}),c}export{l as d};

storybook-static/assets/jsx-runtime-D_zvdyIk.js

@@ -0,0 +1,9 @@
+var s={exports:{}},e={};/**
+ * @license React
+ * react-jsx-runtime.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var o;function d(){if(o)return e;o=1;var R=Symbol.for("react.transitional.element"),a=Symbol.for("react.fragment");function i(v,r,t){var u=null;if(t!==void 0&&(u=""+t),r.key!==void 0&&(u=""+r.key),"key"in r){t={};for(var n in r)n!=="key"&&(t[n]=r[n])}else t=r;return r=t.ref,{$$typeof:R,type:v,key:u,ref:r!==void 0?r:null,props:t}}return e.Fragment=a,e.jsx=i,e.jsxs=i,e}var x;function l(){return x||(x=1,s.exports=d()),s.exports}var p=l();export{p as j};

storybook-static/assets/nav-CCVeh-3w.js

@@ -0,0 +1 @@
+import{j as o}from"./jsx-runtime-D_zvdyIk.js";import{useMDXComponents as r}from"./index-CB3_FCD4.js";import"./index-MPVjHJeJ.js";function e(n){const t={h1:"h1",...r(),...n.components};return o.jsx(t.h1,{id:"nav的模块",children:"nav的模块"})}function i(n={}){const{wrapper:t}={...r(),...n.components};return t?o.jsx(t,{...n,children:o.jsx(e,{...n})}):e(n)}export{i as default};

storybook-static/assets/preview-B8lJiyuQ.js

@@ -0,0 +1,34 @@
+import{d as P}from"./index-DrFu-skq.js";const{useEffect:_,useMemo:h}=__STORYBOOK_MODULE_PREVIEW_API__,{global:j}=__STORYBOOK_MODULE_GLOBAL__,{logger:X}=__STORYBOOK_MODULE_CLIENT_LOGGER__;var p="backgrounds",U={light:{name:"light",value:"#F8F8F8"},dark:{name:"dark",value:"#333"}},{document:b,window:O}=j,D=()=>{var r;return!!((r=O==null?void 0:O.matchMedia("(prefers-reduced-motion: reduce)"))!=null&&r.matches)},A=r=>{(Array.isArray(r)?r:[r]).forEach(N)},N=r=>{var t;let e=b.getElementById(r);e&&((t=e.parentElement)==null||t.removeChild(e))},F=(r,e)=>{let t=b.getElementById(r);if(t)t.innerHTML!==e&&(t.innerHTML=e);else{let o=b.createElement("style");o.setAttribute("id",r),o.innerHTML=e,b.head.appendChild(o)}},Y=(r,e,t)=>{var a;let o=b.getElementById(r);if(o)o.innerHTML!==e&&(o.innerHTML=e);else{let d=b.createElement("style");d.setAttribute("id",r),d.innerHTML=e;let i=`addon-backgrounds-grid${t?`-docs-${t}`:""}`,n=b.getElementById(i);n?(a=n.parentElement)==null||a.insertBefore(d,n):b.head.appendChild(d)}},W={cellSize:100,cellAmount:10,opacity:.8},w="addon-backgrounds",R="addon-backgrounds-grid",q=D()?"":"transition: background-color 0.3s;",J=(r,e)=>{let{globals:t,parameters:o,viewMode:a,id:d}=e,{options:i=U,disable:n,grid:s=W}=o[p]||{},c=t[p]||{},u=c.value,l=u?i[u]:void 0,$=(l==null?void 0:l.value)||"transparent",f=c.grid||!1,y=!!l&&!n,m=a==="docs"?`#anchor--${d} .docs-story`:".sb-show-main",E=a==="docs"?`#anchor--${d} .docs-story`:".sb-show-main",H=o.layout===void 0||o.layout==="padded",L=a==="docs"?20:H?16:0,{cellAmount:k,cellSize:g,opacity:x,offsetX:v=L,offsetY:S=L}=s,B=a==="docs"?`${w}-docs-${d}`:`${w}-color`,G=a==="docs"?d:null;_(()=>{let M=`
+    ${m} {
+      background: ${$} !important;
+      ${q}
+      }`;if(!y){A(B);return}Y(B,M,G)},[m,B,G,y,$]);let T=a==="docs"?`${R}-docs-${d}`:`${R}`;return _(()=>{if(!f){A(T);return}let M=[`${g*k}px ${g*k}px`,`${g*k}px ${g*k}px`,`${g}px ${g}px`,`${g}px ${g}px`].join(", "),K=`
+        ${E} {
+          background-size: ${M} !important;
+          background-position: ${v}px ${S}px, ${v}px ${S}px, ${v}px ${S}px, ${v}px ${S}px !important;
+          background-blend-mode: difference !important;
+          background-image: linear-gradient(rgba(130, 130, 130, ${x}) 1px, transparent 1px),
+           linear-gradient(90deg, rgba(130, 130, 130, ${x}) 1px, transparent 1px),
+           linear-gradient(rgba(130, 130, 130, ${x/2}) 1px, transparent 1px),
+           linear-gradient(90deg, rgba(130, 130, 130, ${x/2}) 1px, transparent 1px) !important;
+        }
+      `;F(T,K)},[k,g,E,T,f,v,S,x]),r()},Q=(r,e=[],t)=>{if(r==="transparent")return"transparent";if(e.find(a=>a.value===r)||r)return r;let o=e.find(a=>a.name===t);if(o)return o.value;if(t){let a=e.map(d=>d.name).join(", ");X.warn(P`
+        Backgrounds Addon: could not find the default color "${t}".
+        These are the available colors for your story based on your configuration:
+        ${a}.
+      `)}return"transparent"},Z=(r,e)=>{var u;let{globals:t,parameters:o}=e,a=(u=t[p])==null?void 0:u.value,d=o[p],i=h(()=>d.disable?"transparent":Q(a,d.values,d.default),[d,a]),n=h(()=>i&&i!=="transparent",[i]),s=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",c=h(()=>`
+      ${s} {
+        background: ${i} !important;
+        ${D()?"":"transition: background-color 0.3s;"}
+      }
+    `,[i,s]);return _(()=>{let l=e.viewMode==="docs"?`addon-backgrounds-docs-${e.id}`:"addon-backgrounds-color";if(!n){A(l);return}Y(l,c,e.viewMode==="docs"?e.id:null)},[n,c,e]),r()},V=(r,e)=>{var y;let{globals:t,parameters:o}=e,a=o[p].grid,d=((y=t[p])==null?void 0:y.grid)===!0&&a.disable!==!0,{cellAmount:i,cellSize:n,opacity:s}=a,c=e.viewMode==="docs",u=o.layout===void 0||o.layout==="padded"?16:0,l=a.offsetX??(c?20:u),$=a.offsetY??(c?20:u),f=h(()=>{let m=e.viewMode==="docs"?`#anchor--${e.id} .docs-story`:".sb-show-main",E=[`${n*i}px ${n*i}px`,`${n*i}px ${n*i}px`,`${n}px ${n}px`,`${n}px ${n}px`].join(", ");return`
+      ${m} {
+        background-size: ${E} !important;
+        background-position: ${l}px ${$}px, ${l}px ${$}px, ${l}px ${$}px, ${l}px ${$}px !important;
+        background-blend-mode: difference !important;
+        background-image: linear-gradient(rgba(130, 130, 130, ${s}) 1px, transparent 1px),
+         linear-gradient(90deg, rgba(130, 130, 130, ${s}) 1px, transparent 1px),
+         linear-gradient(rgba(130, 130, 130, ${s/2}) 1px, transparent 1px),
+         linear-gradient(90deg, rgba(130, 130, 130, ${s/2}) 1px, transparent 1px) !important;
+      }
+    `},[n]);return _(()=>{let m=e.viewMode==="docs"?`addon-backgrounds-grid-docs-${e.id}`:"addon-backgrounds-grid";if(!d){A(m);return}F(m,f)},[d,f,e]),r()},C,ae=(C=globalThis.FEATURES)!=null&&C.backgroundsStoryGlobals?[J]:[V,Z],I,oe={[p]:{grid:{cellSize:20,opacity:.5,cellAmount:5},disable:!1,...!((I=globalThis.FEATURES)!=null&&I.backgroundsStoryGlobals)&&{values:Object.values(U)}}},ee={[p]:{value:void 0,grid:!1}},z,de=(z=globalThis.FEATURES)!=null&&z.backgroundsStoryGlobals?ee:{[p]:null};export{ae as decorators,de as initialGlobals,oe as parameters};

storybook-static/assets/preview-BGkG0iU-.js

@@ -0,0 +1,2 @@
+const __vite__mapDeps=(i,m=__vite__mapDeps,d=(m.f||(m.f=["assets/DocsRenderer-CFRXHY34-HVOe_iH5.js","assets/iframe-CPAQYodo.js","assets/index-MPVjHJeJ.js","assets/jsx-runtime-D_zvdyIk.js","assets/react-18-DX46YMEZ.js","assets/index-CXQShRbs.js","assets/index-DrFu-skq.js"])))=>i.map(i=>d[i]);
+import{_ as a}from"./iframe-CPAQYodo.js";var s=Object.defineProperty,i=(e,r)=>{for(var t in r)s(e,t,{get:r[t],enumerable:!0})},_={};i(_,{parameters:()=>n});var d=Object.entries(globalThis.TAGS_OPTIONS??{}).reduce((e,r)=>{let[t,o]=r;return o.excludeFromDocsStories&&(e[t]=!0),e},{}),n={docs:{renderer:async()=>{let{DocsRenderer:e}=await a(()=>import("./DocsRenderer-CFRXHY34-HVOe_iH5.js").then(r=>r.D),__vite__mapDeps([0,1,2,3,4,5,6]));return new e},stories:{filter:e=>{var r;return(e.tags||[]).filter(t=>d[t]).length===0&&!((r=e.parameters.docs)!=null&&r.disable)}}}};export{n as parameters};

storybook-static/assets/preview-BWzBA1C2.js

@@ -0,0 +1,396 @@
+import{d as $}from"./index-DrFu-skq.js";const{useMemo:x,useEffect:f}=__STORYBOOK_MODULE_PREVIEW_API__,{global:p}=__STORYBOOK_MODULE_GLOBAL__;var m="outline",u=i=>{(Array.isArray(i)?i:[i]).forEach(r)},r=i=>{let t=typeof i=="string"?i:i.join(""),o=p.document.getElementById(t);o&&o.parentElement&&o.parentElement.removeChild(o)},b=(i,t)=>{let o=p.document.getElementById(i);if(o)o.innerHTML!==t&&(o.innerHTML=t);else{let n=p.document.createElement("style");n.setAttribute("id",i),n.innerHTML=t,p.document.head.appendChild(n)}};function s(i){return $`
+    ${i} body {
+      outline: 1px solid #2980b9 !important;
+    }
+
+    ${i} article {
+      outline: 1px solid #3498db !important;
+    }
+
+    ${i} nav {
+      outline: 1px solid #0088c3 !important;
+    }
+
+    ${i} aside {
+      outline: 1px solid #33a0ce !important;
+    }
+
+    ${i} section {
+      outline: 1px solid #66b8da !important;
+    }
+
+    ${i} header {
+      outline: 1px solid #99cfe7 !important;
+    }
+
+    ${i} footer {
+      outline: 1px solid #cce7f3 !important;
+    }
+
+    ${i} h1 {
+      outline: 1px solid #162544 !important;
+    }
+
+    ${i} h2 {
+      outline: 1px solid #314e6e !important;
+    }
+
+    ${i} h3 {
+      outline: 1px solid #3e5e85 !important;
+    }
+
+    ${i} h4 {
+      outline: 1px solid #449baf !important;
+    }
+
+    ${i} h5 {
+      outline: 1px solid #c7d1cb !important;
+    }
+
+    ${i} h6 {
+      outline: 1px solid #4371d0 !important;
+    }
+
+    ${i} main {
+      outline: 1px solid #2f4f90 !important;
+    }
+
+    ${i} address {
+      outline: 1px solid #1a2c51 !important;
+    }
+
+    ${i} div {
+      outline: 1px solid #036cdb !important;
+    }
+
+    ${i} p {
+      outline: 1px solid #ac050b !important;
+    }
+
+    ${i} hr {
+      outline: 1px solid #ff063f !important;
+    }
+
+    ${i} pre {
+      outline: 1px solid #850440 !important;
+    }
+
+    ${i} blockquote {
+      outline: 1px solid #f1b8e7 !important;
+    }
+
+    ${i} ol {
+      outline: 1px solid #ff050c !important;
+    }
+
+    ${i} ul {
+      outline: 1px solid #d90416 !important;
+    }
+
+    ${i} li {
+      outline: 1px solid #d90416 !important;
+    }
+
+    ${i} dl {
+      outline: 1px solid #fd3427 !important;
+    }
+
+    ${i} dt {
+      outline: 1px solid #ff0043 !important;
+    }
+
+    ${i} dd {
+      outline: 1px solid #e80174 !important;
+    }
+
+    ${i} figure {
+      outline: 1px solid #ff00bb !important;
+    }
+
+    ${i} figcaption {
+      outline: 1px solid #bf0032 !important;
+    }
+
+    ${i} table {
+      outline: 1px solid #00cc99 !important;
+    }
+
+    ${i} caption {
+      outline: 1px solid #37ffc4 !important;
+    }
+
+    ${i} thead {
+      outline: 1px solid #98daca !important;
+    }
+
+    ${i} tbody {
+      outline: 1px solid #64a7a0 !important;
+    }
+
+    ${i} tfoot {
+      outline: 1px solid #22746b !important;
+    }
+
+    ${i} tr {
+      outline: 1px solid #86c0b2 !important;
+    }
+
+    ${i} th {
+      outline: 1px solid #a1e7d6 !important;
+    }
+
+    ${i} td {
+      outline: 1px solid #3f5a54 !important;
+    }
+
+    ${i} col {
+      outline: 1px solid #6c9a8f !important;
+    }
+
+    ${i} colgroup {
+      outline: 1px solid #6c9a9d !important;
+    }
+
+    ${i} button {
+      outline: 1px solid #da8301 !important;
+    }
+
+    ${i} datalist {
+      outline: 1px solid #c06000 !important;
+    }
+
+    ${i} fieldset {
+      outline: 1px solid #d95100 !important;
+    }
+
+    ${i} form {
+      outline: 1px solid #d23600 !important;
+    }
+
+    ${i} input {
+      outline: 1px solid #fca600 !important;
+    }
+
+    ${i} keygen {
+      outline: 1px solid #b31e00 !important;
+    }
+
+    ${i} label {
+      outline: 1px solid #ee8900 !important;
+    }
+
+    ${i} legend {
+      outline: 1px solid #de6d00 !important;
+    }
+
+    ${i} meter {
+      outline: 1px solid #e8630c !important;
+    }
+
+    ${i} optgroup {
+      outline: 1px solid #b33600 !important;
+    }
+
+    ${i} option {
+      outline: 1px solid #ff8a00 !important;
+    }
+
+    ${i} output {
+      outline: 1px solid #ff9619 !important;
+    }
+
+    ${i} progress {
+      outline: 1px solid #e57c00 !important;
+    }
+
+    ${i} select {
+      outline: 1px solid #e26e0f !important;
+    }
+
+    ${i} textarea {
+      outline: 1px solid #cc5400 !important;
+    }
+
+    ${i} details {
+      outline: 1px solid #33848f !important;
+    }
+
+    ${i} summary {
+      outline: 1px solid #60a1a6 !important;
+    }
+
+    ${i} command {
+      outline: 1px solid #438da1 !important;
+    }
+
+    ${i} menu {
+      outline: 1px solid #449da6 !important;
+    }
+
+    ${i} del {
+      outline: 1px solid #bf0000 !important;
+    }
+
+    ${i} ins {
+      outline: 1px solid #400000 !important;
+    }
+
+    ${i} img {
+      outline: 1px solid #22746b !important;
+    }
+
+    ${i} iframe {
+      outline: 1px solid #64a7a0 !important;
+    }
+
+    ${i} embed {
+      outline: 1px solid #98daca !important;
+    }
+
+    ${i} object {
+      outline: 1px solid #00cc99 !important;
+    }
+
+    ${i} param {
+      outline: 1px solid #37ffc4 !important;
+    }
+
+    ${i} video {
+      outline: 1px solid #6ee866 !important;
+    }
+
+    ${i} audio {
+      outline: 1px solid #027353 !important;
+    }
+
+    ${i} source {
+      outline: 1px solid #012426 !important;
+    }
+
+    ${i} canvas {
+      outline: 1px solid #a2f570 !important;
+    }
+
+    ${i} track {
+      outline: 1px solid #59a600 !important;
+    }
+
+    ${i} map {
+      outline: 1px solid #7be500 !important;
+    }
+
+    ${i} area {
+      outline: 1px solid #305900 !important;
+    }
+
+    ${i} a {
+      outline: 1px solid #ff62ab !important;
+    }
+
+    ${i} em {
+      outline: 1px solid #800b41 !important;
+    }
+
+    ${i} strong {
+      outline: 1px solid #ff1583 !important;
+    }
+
+    ${i} i {
+      outline: 1px solid #803156 !important;
+    }
+
+    ${i} b {
+      outline: 1px solid #cc1169 !important;
+    }
+
+    ${i} u {
+      outline: 1px solid #ff0430 !important;
+    }
+
+    ${i} s {
+      outline: 1px solid #f805e3 !important;
+    }
+
+    ${i} small {
+      outline: 1px solid #d107b2 !important;
+    }
+
+    ${i} abbr {
+      outline: 1px solid #4a0263 !important;
+    }
+
+    ${i} q {
+      outline: 1px solid #240018 !important;
+    }
+
+    ${i} cite {
+      outline: 1px solid #64003c !important;
+    }
+
+    ${i} dfn {
+      outline: 1px solid #b4005a !important;
+    }
+
+    ${i} sub {
+      outline: 1px solid #dba0c8 !important;
+    }
+
+    ${i} sup {
+      outline: 1px solid #cc0256 !important;
+    }
+
+    ${i} time {
+      outline: 1px solid #d6606d !important;
+    }
+
+    ${i} code {
+      outline: 1px solid #e04251 !important;
+    }
+
+    ${i} kbd {
+      outline: 1px solid #5e001f !important;
+    }
+
+    ${i} samp {
+      outline: 1px solid #9c0033 !important;
+    }
+
+    ${i} var {
+      outline: 1px solid #d90047 !important;
+    }
+
+    ${i} mark {
+      outline: 1px solid #ff0053 !important;
+    }
+
+    ${i} bdi {
+      outline: 1px solid #bf3668 !important;
+    }
+
+    ${i} bdo {
+      outline: 1px solid #6f1400 !important;
+    }
+
+    ${i} ruby {
+      outline: 1px solid #ff7b93 !important;
+    }
+
+    ${i} rt {
+      outline: 1px solid #ff2f54 !important;
+    }
+
+    ${i} rp {
+      outline: 1px solid #803e49 !important;
+    }
+
+    ${i} span {
+      outline: 1px solid #cc2643 !important;
+    }
+
+    ${i} br {
+      outline: 1px solid #db687d !important;
+    }
+
+    ${i} wbr {
+      outline: 1px solid #db175b !important;
+    }`}var e=(i,t)=>{let{globals:o}=t,n=[!0,"true"].includes(o[m]),d=t.viewMode==="docs",l=x(()=>s(d?'[data-story-block="true"]':".sb-show-main"),[t]);return f(()=>{let a=d?`addon-outline-docs-${t.id}`:"addon-outline";return n?b(a,l):u(a),()=>{u(a)}},[n,l,t]),i()},h=[e],g={[m]:!1};export{h as decorators,g as initialGlobals};

storybook-static/assets/preview-CQwBxdXq.js

@@ -0,0 +1 @@
+const e={parameters:{controls:{matchers:{color:/(background|color)$/i,date:/Date$/i}}}};export{e as default};

storybook-static/assets/preview-CvbIS5ZJ.js

@@ -0,0 +1 @@
+var o="viewport",a={[o]:{value:void 0,isRotated:!1}},t={viewport:"reset",viewportRotated:!1},e,l=(e=globalThis.FEATURES)!=null&&e.viewportStoryGlobals?a:t;export{l as initialGlobals};

storybook-static/assets/preview-DD_OYowb.js

@@ -0,0 +1 @@
+let p;const S=new Uint8Array(16);function A(){if(!p&&(p=typeof crypto<"u"&&crypto.getRandomValues&&crypto.getRandomValues.bind(crypto),!p))throw new Error("crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported");return p(S)}const o=[];for(let e=0;e<256;++e)o.push((e+256).toString(16).slice(1));function D(e,t=0){return o[e[t+0]]+o[e[t+1]]+o[e[t+2]]+o[e[t+3]]+"-"+o[e[t+4]]+o[e[t+5]]+"-"+o[e[t+6]]+o[e[t+7]]+"-"+o[e[t+8]]+o[e[t+9]]+"-"+o[e[t+10]]+o[e[t+11]]+o[e[t+12]]+o[e[t+13]]+o[e[t+14]]+o[e[t+15]]}const I=typeof crypto<"u"&&crypto.randomUUID&&crypto.randomUUID.bind(crypto),h={randomUUID:I};function f(e,t,r){if(h.randomUUID&&!e)return h.randomUUID();e=e||{};const n=e.random||(e.rng||A)();return n[6]=n[6]&15|64,n[8]=n[8]&63|128,D(n)}const{addons:v}=__STORYBOOK_MODULE_PREVIEW_API__,{ImplicitActionsDuringRendering:U}=__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__,{global:d}=__STORYBOOK_MODULE_GLOBAL__;var w="storybook/actions",j=`${w}/action-event`,V={depth:10,clearOnStoryChange:!0,limit:50},E=(e,t)=>{let r=Object.getPrototypeOf(e);return!r||t(r)?r:E(r,t)},C=e=>!!(typeof e=="object"&&e&&E(e,t=>/^Synthetic(?:Base)?Event$/.test(t.constructor.name))&&typeof e.persist=="function"),K=e=>{if(C(e)){let t=Object.create(e.constructor.prototype,Object.getOwnPropertyDescriptors(e));t.persist();let r=Object.getOwnPropertyDescriptor(t,"view"),n=r==null?void 0:r.value;return typeof n=="object"&&(n==null?void 0:n.constructor.name)==="Window"&&Object.defineProperty(t,"view",{...r,value:Object.create(n.constructor.prototype)}),t}return e},L=()=>typeof crypto=="object"&&typeof crypto.getRandomValues=="function"?f():Date.now().toString(36)+Math.random().toString(36).substring(2);function _(e,t={}){let r={...V,...t},n=function(...s){var g,O;if(t.implicit){let y=(g="__STORYBOOK_PREVIEW__"in d?d.__STORYBOOK_PREVIEW__:void 0)==null?void 0:g.storyRenders.find(l=>l.phase==="playing"||l.phase==="rendering");if(y){let l=!((O=globalThis==null?void 0:globalThis.FEATURES)!=null&&O.disallowImplicitActionsInRenderV8),R=new U({phase:y.phase,name:e,deprecated:l});if(l)console.warn(R);else throw R}}let i=v.getChannel(),c=L(),a=5,u=s.map(K),b=s.length>1?u:u[0],x={id:c,count:0,data:{name:e,args:b},options:{...r,maxDepth:a+(r.depth||3),allowFunction:r.allowFunction||!1}};i.emit(j,x)};return n.isAction=!0,n.implicit=t.implicit,n}var T=(e,t)=>typeof t[e]>"u"&&!(e in t),B=e=>{let{initialArgs:t,argTypes:r,id:n,parameters:{actions:s}}=e;if(!s||s.disable||!s.argTypesRegex||!r)return{};let i=new RegExp(s.argTypesRegex);return Object.entries(r).filter(([c])=>!!i.test(c)).reduce((c,[a,u])=>(T(a,t)&&(c[a]=_(a,{implicit:!0,id:n})),c),{})},M=e=>{let{initialArgs:t,argTypes:r,parameters:{actions:n}}=e;return n!=null&&n.disable||!r?{}:Object.entries(r).filter(([s,i])=>!!i.action).reduce((s,[i,c])=>(T(i,t)&&(s[i]=_(typeof c.action=="string"?c.action:i)),s),{})},Y=[M,B],m=!1,P=e=>{let{parameters:{actions:t}}=e;if(!(t!=null&&t.disable)&&!m&&"__STORYBOOK_TEST_ON_MOCK_CALL__"in d&&typeof d.__STORYBOOK_TEST_ON_MOCK_CALL__=="function"){let r=d.__STORYBOOK_TEST_ON_MOCK_CALL__;r((n,s)=>{let i=n.getMockName();i!=="spy"&&(!/^next\/.*::/.test(i)||["next/router::useRouter()","next/navigation::useRouter()","next/navigation::redirect","next/cache::","next/headers::cookies().set","next/headers::cookies().delete","next/headers::headers().set","next/headers::headers().delete"].some(c=>i.startsWith(c)))&&_(i)(s)}),m=!0}},N=[P];export{Y as argsEnhancers,N as loaders};

storybook-static/assets/preview-DGUiP6tS.js

@@ -0,0 +1,7 @@
+const{STORY_CHANGED:r}=__STORYBOOK_MODULE_CORE_EVENTS__,{addons:s}=__STORYBOOK_MODULE_PREVIEW_API__,{global:O}=__STORYBOOK_MODULE_GLOBAL__;var d="storybook/highlight",i="storybookHighlight",g=`${d}/add`,E=`${d}/reset`,{document:l}=O,H=(e="#FF4785",t="dashed")=>`
+  outline: 2px ${t} ${e};
+  outline-offset: 2px;
+  box-shadow: 0 0 0 6px rgba(255,255,255,0.6);
+`,h=s.getChannel(),T=e=>{let t=i;n();let o=Array.from(new Set(e.elements)),_=l.createElement("style");_.setAttribute("id",t),_.innerHTML=o.map(a=>`${a}{
+          ${H(e.color,e.style)}
+         }`).join(" "),l.head.appendChild(_)},n=()=>{var o;let e=i,t=l.getElementById(e);t&&((o=t.parentNode)==null||o.removeChild(t))};h.on(r,n);h.on(E,n);h.on(g,T);

storybook-static/assets/preview-Dyg8NwXV.js

@@ -0,0 +1 @@
+import{i as r}from"./index-Domkg0jQ.js";var{step:p}=r({step:async(a,t,e)=>t(e)},{intercept:!0}),s={throwPlayFunctionExceptions:!1};export{s as parameters,p as runStep};

storybook-static/assets/test-utils-CKET_awV.js

@@ -0,0 +1,9 @@
+import{a as l,g as p}from"./index-MPVjHJeJ.js";function d(t,e){for(var r=0;r<e.length;r++){const o=e[r];if(typeof o!="string"&&!Array.isArray(o)){for(const s in o)if(s!=="default"&&!(s in t)){const a=Object.getOwnPropertyDescriptor(o,s);a&&Object.defineProperty(t,s,a.get?a:{enumerable:!0,get:()=>o[s]})}}}return Object.freeze(Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}))}var i={exports:{}},n={};/**
+ * @license React
+ * react-dom-test-utils.production.js
+ *
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */var c;function m(){if(c)return n;c=1;var t=l(),e=!1;return n.act=function(r){return e===!1&&(e=!0,console.error("`ReactDOMTestUtils.act` is deprecated in favor of `React.act`. Import `act` from `react` instead of `react-dom/test-utils`. See https://react.dev/warnings/react-dom-test-utils for more info.")),t.act(r)},n}var u;function g(){return u||(u=1,i.exports=m()),i.exports}var f=g();const U=p(f),R=d({__proto__:null,default:U},[f]);export{R as t};

storybook-static/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:svgjs="http://svgjs.com/svgjs" xmlns:xlink="http://www.w3.org/1999/xlink" width="164" height="164" version="1.1"><svg xmlns="http://www.w3.org/2000/svg" width="164" height="164" fill="none" viewBox="0 0 164 164"><path fill="#FF4785" d="M22.467 147.762 17.5 15.402a8.062 8.062 0 0 1 7.553-8.35L137.637.016a8.061 8.061 0 0 1 8.565 8.047v144.23a8.063 8.063 0 0 1-8.424 8.054l-107.615-4.833a8.062 8.062 0 0 1-7.695-7.752Z"/><path fill="#fff" fill-rule="evenodd" d="m128.785.57-15.495.968-.755 18.172a1.203 1.203 0 0 0 1.928 1.008l7.06-5.354 5.962 4.697a1.202 1.202 0 0 0 1.946-.987L128.785.569Zm-12.059 60.856c-2.836 2.203-23.965 3.707-23.965.57.447-11.969-4.912-12.494-7.889-12.494-2.828 0-7.59.855-7.59 7.267 0 6.534 6.96 10.223 15.13 14.553 11.607 6.15 25.654 13.594 25.654 32.326 0 17.953-14.588 27.871-33.194 27.871-19.201 0-35.981-7.769-34.086-34.702.744-3.163 25.156-2.411 25.156 0-.298 11.114 2.232 14.383 8.633 14.383 4.912 0 7.144-2.708 7.144-7.267 0-6.9-7.252-10.973-15.595-15.657C64.827 81.933 51.53 74.468 51.53 57.34c0-17.098 11.76-28.497 32.747-28.497 20.988 0 32.449 11.224 32.449 32.584Z" clip-rule="evenodd"/></svg><style>@media (prefers-color-scheme:light){:root{filter:none}}</style></svg>

storybook-static/iframe.html

@@ -0,0 +1,666 @@
+<!doctype html>
+<!--suppress HtmlUnknownTarget -->
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <title>Storybook</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+    <style>
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: normal;
+        font-weight: 400;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-regular.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: italic;
+        font-weight: 400;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-italic.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: normal;
+        font-weight: 700;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-bold.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: italic;
+        font-weight: 700;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-bold-italic.woff2') format('woff2');
+      }
+    </style>
+
+    <script>
+      window.CONFIG_TYPE = 'PRODUCTION';
+      window.LOGLEVEL = 'info';
+      window.FRAMEWORK_OPTIONS = {};
+      window.CHANNEL_OPTIONS = {};
+      window.FEATURES = {"argTypeTargetsV7":true,"legacyDecoratorFileOrder":false,"disallowImplicitActionsInRenderV8":true};
+      window.STORIES = [{"titlePrefix":"","directory":"./stories","files":"**/*.mdx","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.mdx)$"},{"titlePrefix":"","directory":"./stories","files":"**/*.stories.@(js|jsx|mjs|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:stories(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|mjs|ts|tsx))$"},{"titlePrefix":"","directory":"./packages","files":"**/*.mdx","importPathMatcher":"^\\.[\\\\/](?:packages(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.mdx)$"},{"titlePrefix":"","directory":"./packages","files":"**/*.stories.@(js|jsx|mjs|ts|tsx)","importPathMatcher":"^\\.[\\\\/](?:packages(?:\\/(?!\\.)(?:(?:(?!(?:^|\\/)\\.).)*?)\\/|\\/|$)(?!\\.)(?=.)[^/]*?\\.stories\\.(js|jsx|mjs|ts|tsx))$"}];
+      window.DOCS_OPTIONS = {"defaultName":"Docs","autodocs":"tag"};
+      window.TAGS_OPTIONS = {"dev-only":{"excludeFromDocsStories":true},"docs-only":{"excludeFromSidebar":true},"test-only":{"excludeFromSidebar":true,"excludeFromDocsStories":true}};
+
+      
+
+      // We do this so that "module && module.hot" etc. in Storybook source code
+      // doesn't fail (it will simply be disabled)
+      window.module = undefined;
+      window.global = window;
+    </script>
+    <base target="_parent" />
+
+<style>
+  /* While we aren't showing the main block yet, but still preparing, we want everything the user
+     has rendered, which may or may not be in #storybook-root, to be display none */
+  .sb-show-preparing-story:not(.sb-show-main) > :not(.sb-preparing-story) {
+    display: none;
+  }
+
+  .sb-show-preparing-docs:not(.sb-show-main) > :not(.sb-preparing-docs) {
+    display: none;
+  }
+
+  /* Hide our own blocks when we aren't supposed to be showing them */
+  :not(.sb-show-preparing-story) > .sb-preparing-story,
+  :not(.sb-show-preparing-docs) > .sb-preparing-docs,
+  :not(.sb-show-nopreview) > .sb-nopreview,
+  :not(.sb-show-errordisplay) > .sb-errordisplay {
+    display: none;
+  }
+
+  .sb-show-main.sb-main-centered {
+    margin: 0;
+    display: flex;
+    align-items: center;
+    min-height: 100vh;
+  }
+
+  .sb-show-main.sb-main-centered #storybook-root {
+    box-sizing: border-box;
+    margin: auto;
+    padding: 1rem;
+    max-height: 100%;
+    /* Hack for centering correctly in IE11 */
+  }
+
+  /* Vertical centering fix for IE11 */
+  @media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
+    .sb-show-main.sb-main-centered:after {
+      content: '';
+      min-height: inherit;
+      font-size: 0;
+    }
+  }
+
+  .sb-show-main.sb-main-fullscreen {
+    margin: 0;
+    padding: 0;
+    display: block;
+  }
+
+  .sb-show-main.sb-main-padded {
+    margin: 0;
+    padding: 1rem;
+    display: block;
+    box-sizing: border-box;
+  }
+
+  .sb-wrapper {
+    position: fixed;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    box-sizing: border-box;
+
+    padding: 40px;
+    font-family:
+      'Nunito Sans',
+      -apple-system,
+      '.SFNSText-Regular',
+      'San Francisco',
+      BlinkMacSystemFont,
+      'Segoe UI',
+      'Helvetica Neue',
+      Helvetica,
+      Arial,
+      sans-serif;
+    -webkit-font-smoothing: antialiased;
+    overflow: auto;
+  }
+
+  @media (max-width: 700px) {
+    .sb-wrapper {
+      padding: 20px;
+    }
+  }
+
+  @media (max-width: 500px) {
+    .sb-wrapper {
+      padding: 10px;
+    }
+  }
+
+  .sb-heading {
+    font-size: 14px;
+    font-weight: 600;
+    letter-spacing: 0.2px;
+    margin: 10px 0;
+    padding-right: 25px;
+  }
+
+  .sb-nopreview {
+    display: flex;
+    align-content: center;
+    justify-content: center;
+    box-sizing: border-box;
+  }
+
+  .sb-nopreview_main {
+    margin: auto;
+    padding: 30px;
+    border-radius: 10px;
+    background: rgba(0, 0, 0, 0.03);
+  }
+
+  .sb-nopreview_heading {
+    text-align: center;
+  }
+
+  .sb-errordisplay {
+    background: #f6f9fc;
+    color: black;
+    z-index: 999999;
+    width: 100vw;
+    min-height: 100vh;
+    box-sizing: border-box;
+
+    & ol {
+      padding-left: 18px;
+      margin: 0;
+    }
+
+    & h1 {
+      font-family: Nunito Sans;
+      font-size: 22px;
+      font-weight: 400;
+      line-height: 30px;
+      font-weight: normal;
+      margin: 0;
+
+      &::before {
+        content: '';
+        display: inline-block;
+        width: 12px;
+        height: 12px;
+        background: #ff4400;
+        border-radius: 50%;
+        margin-right: 8px;
+      }
+    }
+
+    & p,
+    & ol {
+      font-family: Nunito Sans;
+      font-size: 14px;
+      font-weight: 400;
+      line-height: 19px;
+      margin: 0;
+    }
+
+    & li + li {
+      margin: 0;
+      padding: 0;
+      padding-top: 12px;
+    }
+
+    & a {
+      color: currentColor;
+    }
+  }
+
+  .sb-errordisplay_main {
+    margin: auto;
+    padding: 24px;
+    display: flex;
+    box-sizing: border-box;
+
+    flex-direction: column;
+    min-height: 100%;
+    width: 100%;
+    border-radius: 6px;
+    background: white;
+    border: 1px solid #ff0000;
+    box-shadow: 0 0 64px rgba(0, 0, 0, 0.1);
+    gap: 24px;
+  }
+
+  .sb-errordisplay_code {
+    padding: 10px;
+    flex: 1;
+    background: #242424;
+    color: #c6c6c6;
+    box-sizing: border-box;
+
+    font-size: 14px;
+    font-weight: 400;
+    line-height: 19px;
+    border-radius: 4px;
+
+    font-family: 'Operator Mono', 'Fira Code Retina', 'Fira Code', 'FiraCode-Retina', 'Andale Mono',
+      'Lucida Console', Consolas, Monaco, monospace;
+    margin: 0;
+    overflow: auto;
+  }
+
+  .sb-errordisplay pre {
+    white-space: pre-wrap;
+    white-space: revert;
+  }
+
+  @-webkit-keyframes sb-rotate360 {
+    from {
+      transform: rotate(0deg);
+    }
+
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  @keyframes sb-rotate360 {
+    from {
+      transform: rotate(0deg);
+    }
+
+    to {
+      transform: rotate(360deg);
+    }
+  }
+
+  @-webkit-keyframes sb-glow {
+    0%,
+    100% {
+      opacity: 1;
+    }
+
+    50% {
+      opacity: 0.4;
+    }
+  }
+
+  @keyframes sb-glow {
+    0%,
+    100% {
+      opacity: 1;
+    }
+
+    50% {
+      opacity: 0.4;
+    }
+  }
+
+  /* We display the preparing loaders *over* the rendering story */
+  .sb-preparing-story,
+  .sb-preparing-docs {
+    background-color: white;
+    /* Maximum possible z-index. It would be better to use stacking contexts to ensure it's always
+    on top, but this isn't possible as it would require making CSS changes that could affect user code */
+    z-index: 2147483647;
+  }
+
+  .sb-loader {
+    -webkit-animation: sb-rotate360 0.7s linear infinite;
+    animation: sb-rotate360 0.7s linear infinite;
+    border-color: rgba(97, 97, 97, 0.29);
+    border-radius: 50%;
+    border-style: solid;
+    border-top-color: #646464;
+    border-width: 2px;
+    display: inline-block;
+    height: 32px;
+    left: 50%;
+    margin-left: -16px;
+    margin-top: -16px;
+    mix-blend-mode: difference;
+    overflow: hidden;
+    position: absolute;
+    top: 50%;
+    transition: all 200ms ease-out;
+    vertical-align: top;
+    width: 32px;
+    z-index: 4;
+  }
+
+  .sb-previewBlock {
+    background: #fff;
+    border: 1px solid rgba(0, 0, 0, 0.1);
+    border-radius: 4px;
+    box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
+    margin: 25px auto 40px;
+    max-width: 600px;
+  }
+
+  .sb-previewBlock_header {
+    align-items: center;
+    box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
+    display: flex;
+    gap: 14px;
+    height: 40px;
+    padding: 0 12px;
+  }
+
+  .sb-previewBlock_icon {
+    -webkit-animation: sb-glow 1.5s ease-in-out infinite;
+    animation: sb-glow 1.5s ease-in-out infinite;
+    background: #e6e6e6;
+    height: 14px;
+    width: 14px;
+  }
+
+  .sb-previewBlock_icon:last-child {
+    margin-left: auto;
+  }
+
+  .sb-previewBlock_body {
+    -webkit-animation: sb-glow 1.5s ease-in-out infinite;
+    animation: sb-glow 1.5s ease-in-out infinite;
+    height: 182px;
+    position: relative;
+  }
+
+  .sb-argstableBlock {
+    border-collapse: collapse;
+    border-spacing: 0;
+    font-size: 13px;
+    line-height: 20px;
+    margin: 25px auto 40px;
+    max-width: 600px;
+    text-align: left;
+    width: 100%;
+  }
+
+  .sb-argstableBlock th:first-of-type,
+  .sb-argstableBlock td:first-of-type {
+    padding-left: 20px;
+  }
+
+  .sb-argstableBlock th:nth-of-type(2),
+  .sb-argstableBlock td:nth-of-type(2) {
+    width: 35%;
+  }
+
+  .sb-argstableBlock th:nth-of-type(3),
+  .sb-argstableBlock td:nth-of-type(3) {
+    width: 15%;
+  }
+
+  .sb-argstableBlock th:last-of-type,
+  .sb-argstableBlock td:last-of-type {
+    width: 25%;
+    padding-right: 20px;
+  }
+
+  .sb-argstableBlock th span,
+  .sb-argstableBlock td span {
+    -webkit-animation: sb-glow 1.5s ease-in-out infinite;
+    animation: sb-glow 1.5s ease-in-out infinite;
+    background-color: rgba(0, 0, 0, 0.1);
+    border-radius: 0;
+    box-shadow: none;
+    color: transparent;
+  }
+
+  .sb-argstableBlock th {
+    padding: 10px 15px;
+  }
+
+  .sb-argstableBlock-body {
+    border-radius: 4px;
+    box-shadow:
+      rgba(0, 0, 0, 0.1) 0 1px 3px 1px,
+      rgba(0, 0, 0, 0.065) 0 0 0 1px;
+  }
+
+  .sb-argstableBlock-body tr {
+    background: transparent;
+    overflow: hidden;
+  }
+
+  .sb-argstableBlock-body tr:not(:first-child) {
+    border-top: 1px solid #e6e6e6;
+  }
+
+  .sb-argstableBlock-body tr:first-child td:first-child {
+    border-top-left-radius: 4px;
+  }
+
+  .sb-argstableBlock-body tr:first-child td:last-child {
+    border-top-right-radius: 4px;
+  }
+
+  .sb-argstableBlock-body tr:last-child td:first-child {
+    border-bottom-left-radius: 4px;
+  }
+
+  .sb-argstableBlock-body tr:last-child td:last-child {
+    border-bottom-right-radius: 4px;
+  }
+
+  .sb-argstableBlock-body td {
+    background: #fff;
+    padding-bottom: 10px;
+    padding-top: 10px;
+    vertical-align: top;
+  }
+
+  .sb-argstableBlock-body td:not(:first-of-type) {
+    padding-left: 15px;
+    padding-right: 15px;
+  }
+
+  .sb-argstableBlock-body button {
+    -webkit-animation: sb-glow 1.5s ease-in-out infinite;
+    animation: sb-glow 1.5s ease-in-out infinite;
+    background-color: rgba(0, 0, 0, 0.1);
+    border: 0;
+    border-radius: 0;
+    box-shadow: none;
+    color: transparent;
+    display: inline;
+    font-size: 12px;
+    line-height: 1;
+    padding: 10px 16px;
+  }
+
+  .sb-argstableBlock-summary {
+    margin-top: 4px;
+  }
+
+  .sb-argstableBlock-code {
+    margin-right: 4px;
+    margin-bottom: 4px;
+    padding: 2px 5px;
+  }
+</style>
+
+<script>
+  /* globals window */
+  /* eslint-disable no-underscore-dangle */
+  try {
+    if (window.top !== window) {
+      window.__REACT_DEVTOOLS_GLOBAL_HOOK__ = window.top.__REACT_DEVTOOLS_GLOBAL_HOOK__;
+      window.__VUE_DEVTOOLS_GLOBAL_HOOK__ = window.top.__VUE_DEVTOOLS_GLOBAL_HOOK__;
+      window.top.__VUE_DEVTOOLS_CONTEXT__ = window.document;
+    }
+  } catch (e) {
+    // eslint-disable-next-line no-console
+    console.warn('unable to connect to top frame for connecting dev tools');
+  }
+</script>
+
+    <script type="module" crossorigin src="/root/tw-story/assets/iframe-CPAQYodo.js"></script>
+  </head>
+
+  <body>
+    <div class="sb-preparing-story sb-wrapper">
+  <div class="sb-loader"></div>
+</div>
+
+<div class="sb-preparing-docs sb-wrapper">
+  <div class="sb-previewBlock">
+    <div class="sb-previewBlock_header">
+      <div class="sb-previewBlock_icon"></div>
+      <div class="sb-previewBlock_icon"></div>
+      <div class="sb-previewBlock_icon"></div>
+      <div class="sb-previewBlock_icon"></div>
+    </div>
+    <div class="sb-previewBlock_body">
+      <div class="sb-loader"></div>
+    </div>
+  </div>
+  <table aria-hidden="true" class="sb-argstableBlock">
+    <thead class="sb-argstableBlock-head">
+      <tr>
+        <th><span>Name</span></th>
+        <th><span>Description</span></th>
+        <th><span>Default</span></th>
+        <th><span>Control </span></th>
+      </tr>
+    </thead>
+    <tbody class="sb-argstableBlock-body">
+      <tr>
+        <td><span>propertyName</span><span title="Required">*</span></td>
+        <td>
+          <div><span>This is a short description</span></div>
+          <div class="sb-argstableBlock-summary">
+            <div><span class="sb-argstableBlock-code">summary</span></div>
+          </div>
+        </td>
+        <td>
+          <div><span class="sb-argstableBlock-code">defaultValue</span></div>
+        </td>
+        <td><button>Set string</button></td>
+      </tr>
+      <tr>
+        <td><span>propertyName</span><span>*</span></td>
+        <td>
+          <div><span>This is a short description</span></div>
+          <div class="sb-argstableBlock-summary">
+            <div><span class="sb-argstableBlock-code">summary</span></div>
+          </div>
+        </td>
+        <td>
+          <div><span class="sb-argstableBlock-code">defaultValue</span></div>
+        </td>
+        <td><button>Set string</button></td>
+      </tr>
+      <tr>
+        <td><span>propertyName</span><span>*</span></td>
+        <td>
+          <div><span>This is a short description</span></div>
+          <div class="sb-argstableBlock-summary">
+            <div><span class="sb-argstableBlock-code">summary</span></div>
+          </div>
+        </td>
+        <td>
+          <div><span class="sb-argstableBlock-code">defaultValue</span></div>
+        </td>
+        <td><button>Set string</button></td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+
+<div class="sb-nopreview sb-wrapper">
+  <div class="sb-nopreview_main">
+    <h1 class="sb-nopreview_heading sb-heading">No Preview</h1>
+    <p>Sorry, but you either have no stories or none are selected somehow.</p>
+    <ul>
+      <li>Please check the Storybook config.</li>
+      <li>Try reloading the page.</li>
+    </ul>
+    <p>
+      If the problem persists, check the browser console, or the terminal you've run Storybook from.
+    </p>
+  </div>
+</div>
+
+<div class="sb-errordisplay sb-wrapper">
+  <div class="sb-errordisplay_main">
+    <h1 id="error-message"></h1>
+    <p>
+      The component failed to render properly, likely due to a configuration issue in Storybook.
+      Here are some common causes and how you can address them:
+    </p>
+    <ol>
+      <li>
+        <strong>Missing Context/Providers</strong>: You can use decorators to supply specific
+        contexts or providers, which are sometimes necessary for components to render correctly. For
+        detailed instructions on using decorators, please visit the
+        <a href="https://storybook.js.org/docs/writing-stories/decorators"
+          >Decorators documentation</a
+        >.
+      </li>
+      <li>
+        <strong>Misconfigured Webpack or Vite</strong>: Verify that Storybook picks up all necessary
+        settings for loaders, plugins, and other relevant parameters. You can find step-by-step
+        guides for configuring
+        <a href="https://storybook.js.org/docs/builders/webpack">Webpack</a> or
+        <a href="https://storybook.js.org/docs/builders/vite">Vite</a>
+        with Storybook.
+      </li>
+      <li>
+        <strong>Missing Environment Variables</strong>: Your Storybook may require specific
+        environment variables to function as intended. You can set up custom environment variables
+        as outlined in the
+        <a href="https://storybook.js.org/docs/configure/environment-variables"
+          >Environment Variables documentation</a
+        >.
+      </li>
+    </ol>
+    <pre class="sb-errordisplay_code"><code id="error-stack"></code></pre>
+  </div>
+</div>
+
+    <div id="storybook-root"></div>
+    <div id="storybook-docs"></div>
+    <script>
+      // eslint-disable-next-line no-underscore-dangle, @typescript-eslint/naming-convention
+      function __onViteAppLoadingError(event) {
+        const hostname = globalThis.location.hostname;
+        if (hostname !== 'localhost' && globalThis.CONFIG_TYPE === 'DEVELOPMENT') {
+          const message = `Failed to load the Storybook preview file 'vite-app.js':
+
+It looks like you're visiting the Storybook development server on another hostname than localhost: '${hostname}', but you haven't configured the necessary security features to support this.
+Please re-run your Storybook development server with the '--host ${hostname}' flag, or manually configure your Vite allowedHosts configuration with viteFinal.
+
+See:`;
+          const docs = [
+            'https://storybook.js.org/docs/api/cli-options#dev',
+            'https://storybook.js.org/docs/api/main-config/main-config-vite-final',
+            'https://vite.dev/config/server-options.html#server-allowedhosts',
+          ];
+          console.error(`${message}\n${docs.map((doc) => `- ${doc}`).join('\n')}`);
+
+          document.getElementById('storybook-root').innerHTML =
+            `<p style="color: red; max-width: 70ch">${message.replaceAll(
+              '\n',
+              '<br/>'
+            )}<ul>${docs.map((doc) => `<li><a href='${doc}' target='_blank'>${doc}</a></li>`).join('')}<ul></p>`;
+          return;
+        }
+      }
+    </script>
+  </body>
+</html>

storybook-static/index.html

@@ -0,0 +1,181 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+
+    <title>@storybook/core - Storybook</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
+
+    
+    <link rel="icon" type="image/svg+xml" href="./favicon.svg" />
+    
+    <style>
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: normal;
+        font-weight: 400;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-regular.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: italic;
+        font-weight: 400;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-italic.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: normal;
+        font-weight: 700;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-bold.woff2') format('woff2');
+      }
+
+      @font-face {
+        font-family: 'Nunito Sans';
+        font-style: italic;
+        font-weight: 700;
+        font-display: swap;
+        src: url('./sb-common-assets/nunito-sans-bold-italic.woff2') format('woff2');
+      }
+    </style>
+
+    <link href="./sb-manager/runtime.js" rel="modulepreload" />
+
+    
+    <link href="./sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-controls-1/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-actions-2/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-docs-3/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-backgrounds-4/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-viewport-5/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-toolbars-6/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-measure-7/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/essentials-outline-8/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/onboarding-9/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/chromatic-com-storybook-10/manager-bundle.js" rel="modulepreload" />
+    
+    <link href="./sb-addons/storybook-experimental-addon-test-11/manager-bundle.js" rel="modulepreload" />
+       
+
+    <style>
+      #storybook-root[hidden] {
+        display: none !important;
+      }
+    </style>
+
+    
+  </head>
+  <body>
+    <div id="root"></div>
+
+    
+    <script>
+      
+        
+          window['FEATURES'] = {
+  "argTypeTargetsV7": true,
+  "legacyDecoratorFileOrder": false,
+  "disallowImplicitActionsInRenderV8": true
+};
+        
+      
+        
+          window['REFS'] = {};
+        
+      
+        
+          window['LOGLEVEL'] = "info";
+        
+      
+        
+          window['DOCS_OPTIONS'] = {
+  "defaultName": "Docs",
+  "autodocs": "tag"
+};
+        
+      
+        
+          window['CONFIG_TYPE'] = "PRODUCTION";
+        
+      
+        
+      
+        
+      
+        
+          window['TAGS_OPTIONS'] = {
+  "dev-only": {
+    "excludeFromDocsStories": true
+  },
+  "docs-only": {
+    "excludeFromSidebar": true
+  },
+  "test-only": {
+    "excludeFromSidebar": true,
+    "excludeFromDocsStories": true
+  }
+};
+        
+      
+        
+          window['STORYBOOK_RENDERER'] = "react";
+        
+      
+        
+          window['STORYBOOK_BUILDER'] = "@storybook/builder-vite";
+        
+      
+        
+          window['STORYBOOK_FRAMEWORK'] = "@storybook/react-vite";
+        
+      
+    </script>
+    
+
+    <script type="module">
+      import './sb-manager/globals-runtime.js';
+      
+      
+        import './sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js';
+      
+        import './sb-addons/essentials-controls-1/manager-bundle.js';
+      
+        import './sb-addons/essentials-actions-2/manager-bundle.js';
+      
+        import './sb-addons/essentials-docs-3/manager-bundle.js';
+      
+        import './sb-addons/essentials-backgrounds-4/manager-bundle.js';
+      
+        import './sb-addons/essentials-viewport-5/manager-bundle.js';
+      
+        import './sb-addons/essentials-toolbars-6/manager-bundle.js';
+      
+        import './sb-addons/essentials-measure-7/manager-bundle.js';
+      
+        import './sb-addons/essentials-outline-8/manager-bundle.js';
+      
+        import './sb-addons/onboarding-9/manager-bundle.js';
+      
+        import './sb-addons/chromatic-com-storybook-10/manager-bundle.js';
+      
+        import './sb-addons/storybook-experimental-addon-test-11/manager-bundle.js';
+      
+      
+      import './sb-manager/runtime.js';
+    </script>
+  </body>
+</html>

storybook-static/index.json

@@ -0,0 +1 @@
+{"v":5,"entries":{"introduce--docs":{"id":"introduce--docs","title":"Introduce","name":"Docs","importPath":"./stories/Introduce.mdx","storiesImports":[],"type":"docs","tags":["dev","test","unattached-mdx"]},"test--docs":{"id":"test--docs","title":"Test","name":"Docs","importPath":"./stories/Test.mdx","storiesImports":[],"type":"docs","tags":["dev","test","unattached-mdx"]},"page--primary":{"type":"story","id":"page--primary","name":"Primary","title":"Page","importPath":"./stories/Page.stories.tsx","componentPath":"./stories/Page.tsx","tags":["dev","test"]},"twu-nav--docs":{"id":"twu-nav--docs","title":"twu/nav","name":"Docs","importPath":"./packages/twu/nav/nav.mdx","storiesImports":[],"type":"docs","tags":["dev","test","unattached-mdx"]}}}

storybook-static/project.json

@@ -0,0 +1 @@
+{"generatedAt":1745947201031,"hasCustomBabel":false,"hasCustomWebpack":false,"hasStaticDirs":false,"hasStorybookEslint":false,"refCount":0,"testPackages":{"@vitest/browser":"3.1.2","@vitest/coverage-v8":"3.1.2","playwright":"1.52.0","vitest":"3.1.2"},"hasRouterPackage":false,"packageManager":{"type":"pnpm","version":"10.6.2","agent":"pnpm"},"preview":{"usesGlobals":false},"framework":{"name":"@storybook/react-vite","options":{}},"builder":"@storybook/builder-vite","renderer":"@storybook/react","portableStoriesFileCount":0,"applicationFileCount":0,"storybookVersion":"8.6.12","storybookVersionSpecifier":"^8.6.12","language":"javascript","storybookPackages":{"storybook":{"version":"8.6.12"},"@storybook/blocks":{"version":"8.6.12"},"@storybook/react":{"version":"8.6.12"},"@storybook/react-vite":{"version":"8.6.12"},"@storybook/test":{"version":"8.6.12"}},"addons":{"@storybook/addon-essentials":{"version":"8.6.12"},"@storybook/addon-onboarding":{"version":"8.6.12"},"@chromatic-com/storybook":{"version":"3.2.6"},"@storybook/experimental-addon-test":{"version":"8.6.12"}}}

storybook-static/sb-addons/chromatic-com-storybook-10/manager-bundle.js.LEGAL.txt

@@ -0,0 +1,51 @@
+Bundled license information:
+
+react/cjs/react-jsx-runtime.production.js:
+  /**
+   * @license React
+   * react-jsx-runtime.production.js
+   *
+   * Copyright (c) Meta Platforms, Inc. and affiliates.
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   */
+
+filesize/dist/filesize.esm.js:
+  /**
+   * filesize
+   *
+   * @copyright 2024 Jason Mulligan <jason.mulligan@avoidwork.com>
+   * @license BSD-3-Clause
+   * @version 10.1.6
+   */
+
+@chromatic-com/storybook/dist/manager.mjs:
+  /*! Bundled license information:
+  
+  popper.js/dist/esm/popper.js:
+    (**!
+     * @fileOverview Kickass library to create and place poppers near their reference elements.
+     * @version 1.16.1
+     * @license
+     * Copyright (c) 2016 Federico Zivolo and contributors
+     *
+     * Permission is hereby granted, free of charge, to any person obtaining a copy
+     * of this software and associated documentation files (the "Software"), to deal
+     * in the Software without restriction, including without limitation the rights
+     * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+     * copies of the Software, and to permit persons to whom the Software is
+     * furnished to do so, subject to the following conditions:
+     *
+     * The above copyright notice and this permission notice shall be included in all
+     * copies or substantial portions of the Software.
+     *
+     * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+     * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+     * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+     * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+     * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+     * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+     * SOFTWARE.
+     *)
+  */

storybook-static/sb-addons/storybook-core-core-server-presets-0/common-manager-bundle.js

@@ -0,0 +1,3 @@
+try{
+(()=>{var g=__STORYBOOK_API__,{ActiveTabs:T,Consumer:O,ManagerContext:f,Provider:v,RequestResponseError:x,addons:n,combineParameters:A,controlOrMetaKey:k,controlOrMetaSymbol:M,eventMatchesShortcut:P,eventToShortcut:R,experimental_MockUniversalStore:w,experimental_UniversalStore:C,experimental_requestResponse:G,experimental_useUniversalStore:I,isMacLike:K,isShortcutTaken:U,keyToSymbol:q,merge:B,mockChannel:F,optionOrAltSymbol:Y,shortcutMatchesShortcut:j,shortcutToHumanString:E,types:H,useAddonState:L,useArgTypes:N,useArgs:z,useChannel:D,useGlobalTypes:J,useGlobals:Q,useParameter:V,useSharedState:W,useStoryPrepared:X,useStorybookApi:Z,useStorybookState:$}=__STORYBOOK_API__;var S=(()=>{let e;return typeof window<"u"?e=window:typeof globalThis<"u"?e=globalThis:typeof window<"u"?e=window:typeof self<"u"?e=self:e={},e})(),c="tag-filters",p="static-filter";n.register(c,e=>{let i=Object.entries(S.TAGS_OPTIONS??{}).reduce((t,r)=>{let[o,u]=r;return u.excludeFromSidebar&&(t[o]=!0),t},{});e.experimental_setFilter(p,t=>{let r=t.tags??[];return(r.includes("dev")||t.type==="docs")&&r.filter(o=>i[o]).length===0})});})();
+}catch(e){ console.error("[Storybook] One of your manager-entries failed: " + import.meta.url, e); }

storybook-static/sb-common-assets/favicon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:svgjs="http://svgjs.com/svgjs" xmlns:xlink="http://www.w3.org/1999/xlink" width="164" height="164" version="1.1"><svg xmlns="http://www.w3.org/2000/svg" width="164" height="164" fill="none" viewBox="0 0 164 164"><path fill="#FF4785" d="M22.467 147.762 17.5 15.402a8.062 8.062 0 0 1 7.553-8.35L137.637.016a8.061 8.061 0 0 1 8.565 8.047v144.23a8.063 8.063 0 0 1-8.424 8.054l-107.615-4.833a8.062 8.062 0 0 1-7.695-7.752Z"/><path fill="#fff" fill-rule="evenodd" d="m128.785.57-15.495.968-.755 18.172a1.203 1.203 0 0 0 1.928 1.008l7.06-5.354 5.962 4.697a1.202 1.202 0 0 0 1.946-.987L128.785.569Zm-12.059 60.856c-2.836 2.203-23.965 3.707-23.965.57.447-11.969-4.912-12.494-7.889-12.494-2.828 0-7.59.855-7.59 7.267 0 6.534 6.96 10.223 15.13 14.553 11.607 6.15 25.654 13.594 25.654 32.326 0 17.953-14.588 27.871-33.194 27.871-19.201 0-35.981-7.769-34.086-34.702.744-3.163 25.156-2.411 25.156 0-.298 11.114 2.232 14.383 8.633 14.383 4.912 0 7.144-2.708 7.144-7.267 0-6.9-7.252-10.973-15.595-15.657C64.827 81.933 51.53 74.468 51.53 57.34c0-17.098 11.76-28.497 32.747-28.497 20.988 0 32.449 11.224 32.449 32.584Z" clip-rule="evenodd"/></svg><style>@media (prefers-color-scheme:light){:root{filter:none}}</style></svg>

storybook-static/sb-manager/globals.js

@@ -0,0 +1,48 @@
+import ESM_COMPAT_Module from "node:module";
+import { fileURLToPath as ESM_COMPAT_fileURLToPath } from 'node:url';
+import { dirname as ESM_COMPAT_dirname } from 'node:path';
+const __filename = ESM_COMPAT_fileURLToPath(import.meta.url);
+const __dirname = ESM_COMPAT_dirname(__filename);
+const require = ESM_COMPAT_Module.createRequire(import.meta.url);
+
+// src/manager/globals/globals.ts
+var _ = {
+  react: "__REACT__",
+  "react-dom": "__REACT_DOM__",
+  "react-dom/client": "__REACT_DOM_CLIENT__",
+  "@storybook/icons": "__STORYBOOK_ICONS__",
+  "storybook/internal/manager-api": "__STORYBOOK_API__",
+  "@storybook/manager-api": "__STORYBOOK_API__",
+  "@storybook/core/manager-api": "__STORYBOOK_API__",
+  "storybook/internal/components": "__STORYBOOK_COMPONENTS__",
+  "@storybook/components": "__STORYBOOK_COMPONENTS__",
+  "@storybook/core/components": "__STORYBOOK_COMPONENTS__",
+  "storybook/internal/channels": "__STORYBOOK_CHANNELS__",
+  "@storybook/channels": "__STORYBOOK_CHANNELS__",
+  "@storybook/core/channels": "__STORYBOOK_CHANNELS__",
+  "storybook/internal/core-errors": "__STORYBOOK_CORE_EVENTS__",
+  "@storybook/core-events": "__STORYBOOK_CORE_EVENTS__",
+  "@storybook/core/core-events": "__STORYBOOK_CORE_EVENTS__",
+  "storybook/internal/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__",
+  "@storybook/core-events/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__",
+  "@storybook/core/manager-errors": "__STORYBOOK_CORE_EVENTS_MANAGER_ERRORS__",
+  "storybook/internal/router": "__STORYBOOK_ROUTER__",
+  "@storybook/router": "__STORYBOOK_ROUTER__",
+  "@storybook/core/router": "__STORYBOOK_ROUTER__",
+  "storybook/internal/theming": "__STORYBOOK_THEMING__",
+  "@storybook/theming": "__STORYBOOK_THEMING__",
+  "@storybook/core/theming": "__STORYBOOK_THEMING__",
+  "storybook/internal/theming/create": "__STORYBOOK_THEMING_CREATE__",
+  "@storybook/theming/create": "__STORYBOOK_THEMING_CREATE__",
+  "@storybook/core/theming/create": "__STORYBOOK_THEMING_CREATE__",
+  "storybook/internal/client-logger": "__STORYBOOK_CLIENT_LOGGER__",
+  "@storybook/client-logger": "__STORYBOOK_CLIENT_LOGGER__",
+  "@storybook/core/client-logger": "__STORYBOOK_CLIENT_LOGGER__",
+  "storybook/internal/types": "__STORYBOOK_TYPES__",
+  "@storybook/types": "__STORYBOOK_TYPES__",
+  "@storybook/core/types": "__STORYBOOK_TYPES__"
+}, o = Object.keys(_);
+export {
+  o as globalPackages,
+  _ as globalsNameReferenceMap
+};

tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "extends": "@kevisual/types/json/frontend.json",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "jsx" :"react-jsx",
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    }
+  },
+  "include": [
+    "src/**/*",
+    "stories/**/*",
+    ".storybook"
+  ]
+}

vitest.config.js

@@ -0,0 +1,35 @@
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+import { defineConfig } from 'vitest/config';
+
+import { storybookTest } from '@storybook/experimental-addon-test/vitest-plugin';
+
+const dirname =
+  typeof __dirname !== 'undefined' ? __dirname : path.dirname(fileURLToPath(import.meta.url));
+
+// More info at: https://storybook.js.org/docs/writing-tests/test-addon
+export default defineConfig({
+  test: {
+    workspace: [
+      {
+        extends: true,
+        plugins: [
+          // The plugin will run tests for the stories defined in your Storybook config
+          // See options at: https://storybook.js.org/docs/writing-tests/test-addon#storybooktest
+          storybookTest({ configDir: path.join(dirname, '.storybook') }),
+        ],
+        test: {
+          name: 'storybook',
+          browser: {
+        enabled: true,
+        headless: true,
+        name: 'chromium',
+        provider: 'playwright'
+      },
+          setupFiles: ['.storybook/vitest.setup.js'],
+        },
+      },
+    ],
+  },
+});