@razorwind/storybook 0.0.48 → 0.0.49

package/dist/index.cjs

@@ -1,16 +1,31 @@
-Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let e=require("@razorwind/core/plugin"),t=require("@razorwind/core/lib/fonts"),n=require("@razorwind/core/utils"),r=require("@stryke/path/join"),i=require("node:path");function a(e,t={}){let r=t.cssVarPrefix??`rw`;return(0,n.flattenTokens)(e,{includeTypes:t.includeTypes,enrichToken:e=>({...e,cssVar:(0,n.toCssVar)(e.path,r)})})}function o(e){return e.replaceAll(`\\`,`\\\\`).replaceAll(`"`,`\\"`).replaceAll(`
-`,`\\n`).replaceAll(`\r`,`\\r`)}function s(e){return typeof e==`string`?`"${o(e)}"`:typeof e==`number`||typeof e==`boolean`?String(e):e==null?`undefined`:JSON.stringify(e)}function c(e){let t=e.titlePrefix??`Design Tokens`,n=e.themeFiles&&e.themeFiles.length>0?`
+Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let e=require("@razorwind/core/plugin"),t=require("@razorwind/core/lib/fonts"),n=require("@razorwind/core/utils"),r=require("@stryke/path/join");function i(e,t={}){let r=t.cssVarPrefix??`rw`;return(0,n.flattenTokens)(e,{includeTypes:t.includeTypes,enrichToken:e=>({...e,cssVar:(0,n.toCssVar)(e.path,r)})})}function a(e){return e.replaceAll(`\\`,`\\\\`).replaceAll(`"`,`\\"`).replaceAll(`
+`,`\\n`).replaceAll(`\r`,`\\r`)}function o(e){return typeof e==`string`?`"${a(e)}"`:typeof e==`number`||typeof e==`boolean`?String(e):e==null?`undefined`:JSON.stringify(e)}function s(e){let t=e.titlePrefix??`Design Tokens`,n=e.themeFiles?.[0],r=e.themeNames??[],i=n?r.length>1?`
+## Storybook UI theme
+
+Generated theme module:
+
+- \`${n}\` — record of \`create()\` themes keyed by name (${r.map(e=>`\`${e}\``).join(`, `)})
+
+Wire into \`.storybook/preview.ts\`:
+
+\`\`\`ts
+import themes from "../${n}";
+
+export const parameters = {
+  docs: { theme: themes[${JSON.stringify(r[0])}] }
+};
+\`\`\`
+`:`
 ## Storybook UI theme
 
 Generated theme module(s):
 
-${e.themeFiles.map(e=>`- \`${e}\``).join(`
-`)}
+- \`${n}\`
 
 Wire into \`.storybook/preview.ts\`:
 
 \`\`\`ts
-import theme from "../${e.themeFiles[0]}";
+import theme from "../${n}";
 
 export const parameters = {
   docs: { theme }
@@ -25,7 +40,7 @@ Generated by \`@razorwind/storybook\`.
 - \`${e.outputPath}/Tokens.mdx\` — token overview (${t})
 - \`${e.outputPath}/blocks/\` — React doc blocks (ColorPalette, Typeset, …)
 - \`${e.outputPath}/tokens.json\` — flattened token manifest
-${n}
+${i}
 ## Setup
 
 1. Add the generated MDX pages to Storybook (paths depend on your \`stories\` config):
@@ -50,7 +65,7 @@ import { ColorPaletteBlock } from "./blocks";
 ## Regenerate
 
 Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputPath}/\`.
-`}function l(e,t){let n=new Map;for(let r of e){let e=r.path.split(`.`).slice(0,Math.max(t,1)).join(`.`)||r.path,i=n.get(e)??[];i.push(r),n.set(e,i)}return n}function u(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function d(e,t={}){return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
+`}function c(e,t){let n=new Map;for(let r of e){let e=r.path.split(`.`).slice(0,Math.max(t,1)).join(`.`)||r.path,i=n.get(e)??[];i.push(r),n.set(e,i)}return n}function l(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function u(e,t={}){return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
 
 /**
  * Color tokens rendered with Storybook's ColorPalette doc block.
@@ -60,10 +75,10 @@ Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputP
 export function ColorPaletteBlock() {
   return (
     <ColorPalette>
-${[...l(e.filter(e=>e.type===`color`),t.colorGroupBy??2).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,t])=>{let n=t.map(t=>`      ${s(u(t.path,e))}: ${s(t.cssValue)}`).join(`,
+${[...c(e.filter(e=>e.type===`color`),t.colorGroupBy??2).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,t])=>{let n=t.map(t=>`      ${o(l(t.path,e))}: ${o(t.cssValue)}`).join(`,
 `),r=t.find(e=>e.description)?.description??`${t.length} token${t.length===1?``:`s`}`;return`    <ColorItem
-      title={${s(e)}}
-      subtitle={${s(r)}}
+      title={${o(e)}}
+      subtitle={${o(r)}}
       colors={{
 ${n}
       }}
@@ -72,7 +87,7 @@ ${n}
     </ColorPalette>
   );
 }
-`}function f(e,n={}){let r=n.sampleText??`The quick brown fox jumps over the lazy dog`,i=e.filter(e=>e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)).map(e=>{let t=/^(\d+(?:\.\d+)?)/.exec(e.cssValue);return t?Number(t[1]):e.cssValue}),a=[...new Set(i)],o=(0,t.pickFontByRole)(n.fonts,t.SANS_ROLES),c=(o?(0,t.cssFontFamily)(o):void 0)??e.find(e=>e.type===`fontFamily`)?.cssValue??`system-ui, sans-serif`,l=e.find(e=>e.type===`fontWeight`),u=l&&Number.parseFloat(l.cssValue)||400,d=a.length>0?`[${a.map(e=>s(e)).join(`, `)}]`:`[12, 14, 16, 20, 24, 32]`;return`import { Typeset } from "@storybook/addon-docs/blocks";
+`}function d(e,n={}){let r=n.sampleText??`The quick brown fox jumps over the lazy dog`,i=e.filter(e=>e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)).map(e=>{let t=/^(\d+(?:\.\d+)?)/.exec(e.cssValue);return t?Number(t[1]):e.cssValue}),a=[...new Set(i)],s=(0,t.pickFontByRole)(n.fonts,t.SANS_ROLES),c=(s?(0,t.cssFontFamily)(s):void 0)??e.find(e=>e.type===`fontFamily`)?.cssValue??`system-ui, sans-serif`,l=e.find(e=>e.type===`fontWeight`),u=l&&Number.parseFloat(l.cssValue)||400,d=a.length>0?`[${a.map(e=>o(e)).join(`, `)}]`:`[12, 14, 16, 20, 24, 32]`;return`import { Typeset } from "@storybook/addon-docs/blocks";
 
 /**
  * Typography tokens rendered with Storybook's Typeset doc block.
@@ -82,14 +97,14 @@ ${n}
 export function TypesetBlock() {
   return (
     <Typeset
-      fontFamily={${s(c)}}
+      fontFamily={${o(c)}}
       fontSizes={${d}}
-      fontWeight={${s(u)}}
-      sampleText={${s(r)}}
+      fontWeight={${o(u)}}
+      sampleText={${o(r)}}
     />
   );
 }
-`}function p(e){return`import type { CSSProperties, ReactElement } from "react";
+`}function f(e){return`import type { CSSProperties, ReactElement } from "react";
 
 export interface TokenTableRow {
   path: string;
@@ -101,12 +116,12 @@ export interface TokenTableRow {
 }
 
 const TOKENS: TokenTableRow[] = [
-${e.map(e=>{let t=e.theme?s(e.theme):`undefined`;return`    {
-      path: ${s(e.path)},
-      type: ${e.type?s(e.type):`undefined`},
-      value: ${s(e.cssValue)},
-      cssVar: ${s(e.cssVar)},
-      description: ${e.description?s(e.description):`undefined`},
+${e.map(e=>{let t=e.theme?o(e.theme):`undefined`;return`    {
+      path: ${o(e.path)},
+      type: ${e.type?o(e.type):`undefined`},
+      value: ${o(e.cssValue)},
+      cssVar: ${o(e.cssVar)},
+      description: ${e.description?o(e.description):`undefined`},
       theme: ${t}
     }`}).join(`,
 `)||``}
@@ -193,7 +208,7 @@ export function TokenTableBlock({
     </table>
   );
 }
-`}function m(e){let t=e.titlePrefix??`Design Tokens`,n=e.hasColors?`
+`}function p(e){let t=e.titlePrefix??`Design Tokens`,n=e.hasColors?`
 ## Colors
 
 <ColorPaletteBlock />
@@ -206,7 +221,7 @@ import { ColorPaletteBlock } from "./blocks/ColorPalette";
 import { TokenTableBlock } from "./blocks/TokenTable";
 import { TypesetBlock } from "./blocks/Typeset";
 
-<Meta title="${o(t)}/Overview" />
+<Meta title="${a(t)}/Overview" />
 
 # ${t}
 
@@ -215,23 +230,23 @@ ${n}${r}
 ## All tokens
 
 <TokenTableBlock />
-`}function h(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function m(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { ColorPaletteBlock } from "./blocks/ColorPalette";
 
-<Meta title="${o(e.titlePrefix??`Design Tokens`)}/Colors" />
+<Meta title="${a(e.titlePrefix??`Design Tokens`)}/Colors" />
 
 # Colors
 
 <ColorPaletteBlock />
-`}function g(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function h(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { TypesetBlock } from "./blocks/Typeset";
 
-<Meta title="${o(e.titlePrefix??`Design Tokens`)}/Typography" />
+<Meta title="${a(e.titlePrefix??`Design Tokens`)}/Typography" />
 
 # Typography
 
 <TypesetBlock />
-`}function _(e,t){let n=e[t];return typeof n==`string`?n:void 0}function v(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function y(e){return`import { IconGallery, IconItem } from "@storybook/addon-docs/blocks";
+`}function g(e,t){let n=e[t];return typeof n==`string`?n:void 0}function _(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function v(e){return`import { IconGallery, IconItem } from "@storybook/addon-docs/blocks";
 
 /**
  * Icons rendered with Storybook's IconGallery doc block.
@@ -241,38 +256,47 @@ import { TypesetBlock } from "./blocks/Typeset";
 export function IconGalleryBlock() {
   return (
     <IconGallery>
-${(v(e)?Object.values(e).filter(v).toSorted((e,t)=>(_(e,`name`)??``).localeCompare(_(t,`name`)??``)):[]).map(e=>{let t=_(e,`name`)??`unknown`,n=(Array.isArray(e.files)?e.files:[]).find(e=>v(e)&&_(e,`type`)===`svg`&&typeof e.content==`string`),r=v(n)&&typeof n.content==`string`?`<span
+${(_(e)?Object.values(e).filter(_).toSorted((e,t)=>(g(e,`name`)??``).localeCompare(g(t,`name`)??``)):[]).map(e=>{let t=g(e,`name`)??`unknown`,n=(Array.isArray(e.files)?e.files:[]).find(e=>_(e)&&g(e,`type`)===`svg`&&typeof e.content==`string`),r=_(n)&&typeof n.content==`string`?`<span
           style={{ display: "inline-flex", width: 24, height: 24 }}
-          dangerouslySetInnerHTML={{ __html: ${s(n.content)} }}
-        />`:`<code>${o(t)}</code>`;return`    <IconItem name={${s(t)}}>
+          dangerouslySetInnerHTML={{ __html: ${o(n.content)} }}
+        />`:`<code>${a(t)}</code>`;return`    <IconItem name={${o(t)}}>
       ${r}
     </IconItem>`}).join(`
 `)||`      {/* No icons */}`}
     </IconGallery>
   );
 }
-`}function b(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function y(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { IconGalleryBlock } from "./blocks/IconGallery";
 
-<Meta title="${o(e.titlePrefix??`Design Tokens`)}/Icons" />
+<Meta title="${a(e.titlePrefix??`Design Tokens`)}/Icons" />
 
 # Icons
 
 <IconGalleryBlock />
-`}function x(){return`export { ColorPaletteBlock } from "./ColorPalette";
+`}function b(){return`export { ColorPaletteBlock } from "./ColorPalette";
 export { IconGalleryBlock } from "./IconGallery";
 export { TokenTableBlock } from "./TokenTable";
 export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
 export { TypesetBlock } from "./Typeset";
-`}function S(e){return v(e)?e.base===`light`||e.base===`dark`:!1}function C(e,n,r){let i=(0,t.pickFontByRole)(r,t.SANS_ROLES),a=(0,t.pickFontByRole)(r,t.MONO_ROLES);return{brandTarget:`_blank`,...e,brandTitle:e.brandTitle??n.title,brandUrl:e.brandUrl??n.homepage,brandImage:e.brandImage??n.logo,fontBase:e.fontBase??(i?(0,t.cssFontFamily)(i):void 0),fontCode:e.fontCode??(a?(0,t.cssFontFamily)(a):void 0)}}function w(e){return`import { create } from "storybook/theming";
+`}const x=new Set(`base.colorPrimary.colorSecondary.appBg.appContentBg.appHoverBg.appPreviewBg.appBorderColor.appBorderRadius.fontBase.fontCode.textColor.textInverseColor.textMutedColor.barTextColor.barHoverColor.barSelectedColor.barBg.buttonBg.buttonBorder.booleanBg.booleanSelectedBg.inputBg.inputBorder.inputTextColor.inputBorderRadius.brandTitle.brandUrl.brandImage.brandTarget.gridCellSize`.split(`.`));function S(e){return _(e)?e.base===`light`||e.base===`dark`:!1}function C(e){return _(e)?S(e)?!0:Object.keys(e).some(e=>x.has(e)):!1}function w(e){if(!_(e)||C(e))return!1;let t=Object.values(e);return t.length>0&&t.every(C)}function T(e,t,n){return t.base===`light`||t.base===`dark`?t.base:`${e} ${n??``}`.toLowerCase().includes(`light`)?`light`:`dark`}function E(e){return/^[a-z_$][\w$]*$/i.test(e)?e:o(e)}function D(e,t){let r=e.find(e=>e.id===n.SHARED_THEME_ID);return!r||(0,n.isSharedThemeId)(t.id)?t.tokens:(0,n.mergeTokenTrees)(t.tokens,r.tokens)}function O(e,t,n,r,i){return k(T(e,t,i),t,n,r)}function k(e,n,r,i){let a=(0,t.pickFontByRole)(i,t.SANS_ROLES),o=(0,t.pickFontByRole)(i,t.MONO_ROLES);return{brandTarget:`_blank`,base:e||`light`,...n,brandTitle:n.brandTitle??r.title,brandUrl:n.brandUrl??r.homepage,brandImage:n.brandImage??r.logo,fontBase:n.fontBase??(a?(0,t.cssFontFamily)(a):void 0),fontCode:n.fontCode??(o?(0,t.cssFontFamily)(o):void 0)}}function A(e,t=``){return`create({\n${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,n])=>`${t}  ${e}: ${o(n)}`).join(`,
+`)}\n${t}})`}function j(e){return`import { create } from "storybook/theming";
 
 /**
  * Storybook UI theme generated by \`@razorwind/storybook\`.
  *
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  */
-export default create({
-${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,t])=>`  ${e}: ${s(t)}`).join(`,
+export default ${A(e)};
+`}function M(e){return`import { create } from "storybook/theming";
+
+/**
+ * Storybook UI themes generated by \`@razorwind/storybook\`.
+ *
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
+ */
+export default {
+${Object.entries(e).map(([e,t])=>`  ${E(e)}: ${A(t,`  `)}`).join(`,
 `)}
-});
-`}const T=e=>(t,i,a)=>(0,n.createDocument)((0,r.joinPaths)(e,t),i,{name:`razorwind-storybook`},(i,a)=>(0,r.joinPaths)(e,(0,n.slugifyThemeName)(a),t),a);function E(e,t={}){let o=t.outputPath??`storybook/tokens`,s=(0,n.resolveSchemaIdentity)(e),l=t.titlePrefix??s.title??`Design Tokens`,u={...t,titlePrefix:l},_=a(e.tokens,t),E=_.some(e=>e.type===`color`),D=e.fonts&&Object.keys(e.fonts).length>0||_.some(e=>e.type===`fontFamily`||e.type===`fontWeight`||e.type===`typography`||e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)),O=!t.skipIcons&&v(e.icons)&&Object.keys(e.icons).length>0,k=T(o),A={[(0,r.joinPaths)(o,`blocks/ColorPalette.tsx`)]:k(`blocks/ColorPalette.tsx`,d(_,u),`tsx`),[(0,r.joinPaths)(o,`blocks/Typeset.tsx`)]:k(`blocks/Typeset.tsx`,f(_,{...u,fonts:e.fonts}),`tsx`),[(0,r.joinPaths)(o,`blocks/TokenTable.tsx`)]:k(`blocks/TokenTable.tsx`,p(_),`tsx`),[(0,r.joinPaths)(o,`blocks/IconGallery.tsx`)]:k(`blocks/IconGallery.tsx`,y(t.skipIcons?{}:e.icons),`tsx`),[(0,r.joinPaths)(o,`blocks/index.ts`)]:k(`blocks/index.ts`,x(),`typescript`),[(0,r.joinPaths)(o,`Tokens.mdx`)]:k(`Tokens.mdx`,m({titlePrefix:l,hasColors:E,hasTypography:D}),`mdx`)};if(E&&(A[(0,r.joinPaths)(o,`Colors.mdx`)]=k(`Colors.mdx`,h(u),`mdx`)),D&&(A[(0,r.joinPaths)(o,`Typography.mdx`)]=k(`Typography.mdx`,g(u),`mdx`)),O&&(A[(0,r.joinPaths)(o,`Icons.mdx`)]=k(`Icons.mdx`,b(u),`mdx`)),A[(0,r.joinPaths)(o,`tokens.json`)]=k(`tokens.json`,`${JSON.stringify(_,null,2)}\n`,`json`),t.mapTheme){let n=t.mapTheme(e.tokens);if(S(n))A[(0,r.joinPaths)(o,`theme.ts`)]=k(`theme.ts`,w(C(n,s,e.fonts)),`typescript`);else if(v(n))for(let[t,i]of Object.entries(n))S(i)&&(A[(0,r.joinPaths)(o,`theme-${t}.ts`)]=k(`theme-${t}.ts`,w(C(i,s,e.fonts)),`typescript`))}let j=Object.keys(A).filter(e=>e.startsWith((0,i.join)(o,`theme`))).map(e=>e.slice(o.length+1)),M=`INSTALL.md`;return A[(0,r.joinPaths)(o,M)]=k(M,t.installGuide??c({outputPath:o,titlePrefix:l,themeFiles:j.length>0?j:void 0}),`markdown`),A}var D=(0,e.definePlugin)(e=>({name:`storybook`,generate:async t=>E(t,e??{})}));exports.applyBrandDefaults=C,exports.default=D,exports.flattenTokens=a,Object.defineProperty(exports,"formatTokenValue",{enumerable:!0,get:function(){return n.formatTokenValue}}),exports.generateTokenDocs=E,exports.renderInstallMd=c,exports.renderThemeFile=w,exports.resolveTokenSets=n.resolveTokenSets,Object.defineProperty(exports,"toCssVar",{enumerable:!0,get:function(){return n.toCssVar}});
+};
+`}function N(e){if(S(e))return j(e);let t=Object.entries(e);if(t.length!==1)return M(e);let[,n]=t[0]??[];return n?j(n):M(e)}function P(e,t,r,i){let a=(e,n)=>O(e,n,r,t.fonts,t.theme);if(w(e))return Object.fromEntries(Object.entries(e).map(([e,t])=>[e,a(e,t)]));let o=(0,n.resolveTokenSets)(t.tokens),s=o.filter(e=>!(0,n.isSharedThemeId)(e.id));if(s.length>1){let e={};for(let t of s){let n=i(D(o,t));if(w(n)){let r=n[t.id];if(r){e[t.id]=a(t.id,r);continue}for(let[t,r]of Object.entries(n))e[t]=a(t,r);continue}C(n)&&(e[t.id]=a(t.id,n))}return e}if(C(e)){let n=s[0]&&s[0].id!=="default"?s[0].id:t.theme??`default`;return{[n]:a(n,e)}}return{}}const F=e=>(t,i,a)=>(0,n.createDocument)((0,r.joinPaths)(e,t),i,{name:`razorwind-storybook`},!1,a);function I(e,t={}){let a=t.outputPath??`storybook/tokens`,o=(0,n.resolveSchemaIdentity)(e),c=t.titlePrefix??o.title??`Design Tokens`,l={...t,titlePrefix:c},g=i(e.tokens,t),x=g.some(e=>e.type===`color`),S=e.fonts&&Object.keys(e.fonts).length>0||g.some(e=>e.type===`fontFamily`||e.type===`fontWeight`||e.type===`typography`||e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)),C=!t.skipIcons&&_(e.icons)&&Object.keys(e.icons).length>0,w=F(a),T={[(0,r.joinPaths)(a,`blocks/ColorPalette.tsx`)]:w(`blocks/ColorPalette.tsx`,u(g,l),`tsx`),[(0,r.joinPaths)(a,`blocks/Typeset.tsx`)]:w(`blocks/Typeset.tsx`,d(g,{...l,fonts:e.fonts}),`tsx`),[(0,r.joinPaths)(a,`blocks/TokenTable.tsx`)]:w(`blocks/TokenTable.tsx`,f(g),`tsx`),[(0,r.joinPaths)(a,`blocks/IconGallery.tsx`)]:w(`blocks/IconGallery.tsx`,v(t.skipIcons?{}:e.icons),`tsx`),[(0,r.joinPaths)(a,`blocks/index.ts`)]:w(`blocks/index.ts`,b(),`typescript`),[(0,r.joinPaths)(a,`Tokens.mdx`)]:w(`Tokens.mdx`,p({titlePrefix:c,hasColors:x,hasTypography:S}),`mdx`)};x&&(T[(0,r.joinPaths)(a,`Colors.mdx`)]=w(`Colors.mdx`,m(l),`mdx`)),S&&(T[(0,r.joinPaths)(a,`Typography.mdx`)]=w(`Typography.mdx`,h(l),`mdx`)),C&&(T[(0,r.joinPaths)(a,`Icons.mdx`)]=w(`Icons.mdx`,y(l),`mdx`)),T[(0,r.joinPaths)(a,`tokens.json`)]=w(`tokens.json`,`${JSON.stringify(g,null,2)}\n`,`json`);let E;if(t.mapTheme){let n=P(t.mapTheme(e.tokens),e,o,t.mapTheme);Object.keys(n).length>0&&(E=Object.keys(n),T[(0,r.joinPaths)(a,`theme.ts`)]=w(`theme.ts`,N(n),`typescript`))}let D=`INSTALL.md`;return T[(0,r.joinPaths)(a,D)]=w(D,t.installGuide??s({outputPath:a,titlePrefix:c,themeFiles:E?[`theme.ts`]:void 0,themeNames:E}),`markdown`),T}var L=(0,e.definePlugin)(e=>({name:`storybook`,themeGeneration:`combined`,generate:async t=>I(t,e??{})}));exports.applyBrandDefaults=k,exports.default=L,exports.flattenTokens=i,Object.defineProperty(exports,"formatTokenValue",{enumerable:!0,get:function(){return n.formatTokenValue}}),exports.generateTokenDocs=I,exports.normalizeThemes=P,exports.renderInstallMd=s,exports.renderThemeFile=N,exports.resolveTokenSets=n.resolveTokenSets,Object.defineProperty(exports,"toCssVar",{enumerable:!0,get:function(){return n.toCssVar}});

package/dist/index.d.cts

@@ -1,4 +1,5 @@
 import { TokenType, Tokens } from "@power-plant/dtcg-schema";
+import { PartialKeys } from "@stryke/types/base";
 import { Fonts, Schema, Tokens as Tokens$1 } from "@razorwind/core/schema";
 import { formatTokenValue, resolveTokenSets, toCssVar } from "@razorwind/core/utils";
 import { GeneratorFunctionResult } from "@power-plant/core";
@@ -61,7 +62,8 @@ interface StorybookTheme {
   brandTarget?: string;
   gridCellSize?: number;
 }
-type StorybookThemeResult = StorybookTheme | Record<string, StorybookTheme>;
+type StorybookThemePartial = PartialKeys<StorybookTheme, "base">;
+type StorybookThemeResult = StorybookThemePartial | Record<string, StorybookThemePartial>;
 /**
  * Map flattened design tokens to a Storybook theme object.
  *
@@ -110,8 +112,10 @@ interface StorybookPluginOptions {
   /**
    * Map extracted token values to a Storybook UI theme.
    *
-   * When provided, the result is written to `{outputPath}/theme.ts` as a
-   * `create()` call from `storybook/theming`.
+   * When provided, all mapped themes are written to a single
+   * `{outputPath}/theme.ts`. One theme becomes `export default create({…})`;
+   * multiple themes become a record keyed by theme name
+   * (`{ light: create({…}), dark: create({…}) }`).
    *
    * @see https://storybook.js.org/docs/configure/user-interface/theming
    */
@@ -145,23 +149,37 @@ declare function renderInstallMd(options: {
   outputPath: string;
   titlePrefix?: string;
   themeFiles?: string[];
+  themeNames?: string[];
 }): string;
 //#endregion
 //#region src/generate.d.ts
 /**
  * Fill Storybook brand fields from Schema identity when the mapped theme omits them.
  */
-declare function applyBrandDefaults(theme: StorybookTheme, identity: {
+declare function applyBrandDefaults(base: "light" | "dark", theme: PartialKeys<StorybookTheme, "base">, identity: {
   title?: string;
   homepage?: string;
   logo?: string;
 }, fonts?: Fonts): StorybookTheme;
 /**
- * Serialize a Storybook theme object as a `storybook/theming` `create()` module.
+ * Serialize Storybook theme(s) as a `storybook/theming` `create()` module.
+ *
+ * A single theme becomes `export default create({…})`. Multiple named themes
+ * become a record: `{ light: create({…}), dark: create({…}) }`.
  *
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  */
-declare function renderThemeFile(theme: StorybookTheme): string;
+declare function renderThemeFile(theme: StorybookTheme | Record<string, StorybookTheme>): string;
+/**
+ * Normalize {@link StorybookPluginOptions.mapTheme} results into a named
+ * theme record. Multi-theme token sets are mapped per theme when `mapTheme`
+ * returns a single theme object.
+ */
+declare function normalizeThemes(mapped: unknown, spec: Pick<Schema, "tokens" | "theme" | "fonts">, identity: {
+  title?: string;
+  homepage?: string;
+  logo?: string;
+}, mapTheme: NonNullable<StorybookPluginOptions["mapTheme"]>): Record<string, StorybookTheme>;
 /**
  * Generate Storybook MDX / React token doc blocks from a Razorwind schema.
  */
@@ -172,6 +190,10 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
  * Razorwind plugin that turns design tokens into Storybook MDX doc blocks
  * (`ColorPalette`, `Typeset`, `TokenTable`, `IconGallery`) and optional UI themes.
  *
+ * Light and dark token sets are emitted as a single `theme.ts`: one theme is
+ * `export default create({…})`; multiple themes are a record keyed by name
+ * (`{ light: create({…}), dark: create({…}) }`).
+ *
  * @see https://storybook.js.org/docs/writing-docs/doc-blocks
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  * @see https://github.com/unpunnyfuns/swatchbook/tree/main/packages/addon
@@ -196,5 +218,5 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
  */
 declare const _default: (options?: StorybookPluginOptions | undefined) => import("@razorwind/core/plugin").Plugin;
 //#endregion
-export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, applyBrandDefaults, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, renderInstallMd, renderThemeFile, resolveTokenSets, toCssVar };
+export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, type StorybookThemePartial, type StorybookThemeResult, applyBrandDefaults, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, normalizeThemes, renderInstallMd, renderThemeFile, resolveTokenSets, toCssVar };
 //# sourceMappingURL=index.d.cts.map

package/dist/index.d.cts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.cts","names":[],"sources":["../src/types.ts","../src/flatten.ts","../src/install.ts","../src/generate.ts","../src/index.ts"],"mappings":";;;;;;;;UAuBiB;;EAEf;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;;EAEA;;EAEA;;;;;;;UAQe;;EAEf;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;KAGU,uBACV,iBAAiB,eAAe;;;;;;KAOtB,0BACV,QAAQ,SAAS,eAAe,YAC7B;;;;UAKY;;;;;;EAMf;;;;;;EAOA;;;;;;EAOA;;;;;;EAOA;;;;;EAMA,eAAe;;;;;;EAOf;;;;;;;;;EAUA,WAAW;;;;;;EAOX;;;;;EAMA;;;;;;;iBC7Hc,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBCba,gBAAgB;EAC9B;EACA;EACA;;;;;;;iBC8cc,mBACd,OAAO,gBACP;EAAY;EAAgB;EAAmB;GAC/C,QAAQ,QACP;;;;;;iBAoBa,gBAAgB,OAAO;;;;iBA0CvB,kBACd,MAAM,QACN,UAAS,yBACR,wBAAwB,QAAQ"}
+{"version":3,"file":"index.d.cts","names":[],"sources":["../src/types.ts","../src/flatten.ts","../src/install.ts","../src/generate.ts","../src/index.ts"],"mappings":";;;;;;;;;UAwBiB;;EAEf;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;;EAEA;;EAEA;;;;;;;UAQe;;EAEf;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;KAGU,wBAAwB,YAAY;KAEpC,uBACV,wBAAwB,eAAe;;;;;;KAO7B,0BACV,QAAQ,SAAS,eAAe,YAC7B;;;;UAKY;;;;;;EAMf;;;;;;EAOA;;;;;;EAOA;;;;;;EAOA;;;;;EAMA,eAAe;;;;;;EAOf;;;;;;;;;;;EAYA,WAAW;;;;;;EAOX;;;;;EAMA;;;;;;;iBClIc,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBCba,gBAAgB;EAC9B;EACA;EACA;EACA;;;;;;;iBCqjBc,mBACd,wBACA,OAAO,YAAY,yBACnB;EAAY;EAAgB;EAAmB;GAC/C,QAAQ,QACP;;;;;;;;;iBAkEa,gBACd,OAAO,iBAAiB,eAAe;;;;;;iBAwBzB,gBACd,iBACA,MAAM,KAAK,uCACX;EAAY;EAAgB;EAAmB;GAC/C,UAAU,YAAY,sCACrB,eAAe;;;;iBAwEF,kBACd,MAAM,QACN,UAAS,yBACR,wBAAwB,QAAQ"}

package/dist/index.d.mts

@@ -1,5 +1,6 @@
 import { formatTokenValue, resolveTokenSets, toCssVar } from "@razorwind/core/utils";
 import { TokenType, Tokens } from "@power-plant/dtcg-schema";
+import { PartialKeys } from "@stryke/types/base";
 import { Fonts, Schema, Tokens as Tokens$1 } from "@razorwind/core/schema";
 import { GeneratorFunctionResult } from "@power-plant/core";
 //#region src/types.d.ts
@@ -61,7 +62,8 @@ interface StorybookTheme {
   brandTarget?: string;
   gridCellSize?: number;
 }
-type StorybookThemeResult = StorybookTheme | Record<string, StorybookTheme>;
+type StorybookThemePartial = PartialKeys<StorybookTheme, "base">;
+type StorybookThemeResult = StorybookThemePartial | Record<string, StorybookThemePartial>;
 /**
  * Map flattened design tokens to a Storybook theme object.
  *
@@ -110,8 +112,10 @@ interface StorybookPluginOptions {
   /**
    * Map extracted token values to a Storybook UI theme.
    *
-   * When provided, the result is written to `{outputPath}/theme.ts` as a
-   * `create()` call from `storybook/theming`.
+   * When provided, all mapped themes are written to a single
+   * `{outputPath}/theme.ts`. One theme becomes `export default create({…})`;
+   * multiple themes become a record keyed by theme name
+   * (`{ light: create({…}), dark: create({…}) }`).
    *
    * @see https://storybook.js.org/docs/configure/user-interface/theming
    */
@@ -145,23 +149,37 @@ declare function renderInstallMd(options: {
   outputPath: string;
   titlePrefix?: string;
   themeFiles?: string[];
+  themeNames?: string[];
 }): string;
 //#endregion
 //#region src/generate.d.ts
 /**
  * Fill Storybook brand fields from Schema identity when the mapped theme omits them.
  */
-declare function applyBrandDefaults(theme: StorybookTheme, identity: {
+declare function applyBrandDefaults(base: "light" | "dark", theme: PartialKeys<StorybookTheme, "base">, identity: {
   title?: string;
   homepage?: string;
   logo?: string;
 }, fonts?: Fonts): StorybookTheme;
 /**
- * Serialize a Storybook theme object as a `storybook/theming` `create()` module.
+ * Serialize Storybook theme(s) as a `storybook/theming` `create()` module.
+ *
+ * A single theme becomes `export default create({…})`. Multiple named themes
+ * become a record: `{ light: create({…}), dark: create({…}) }`.
  *
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  */
-declare function renderThemeFile(theme: StorybookTheme): string;
+declare function renderThemeFile(theme: StorybookTheme | Record<string, StorybookTheme>): string;
+/**
+ * Normalize {@link StorybookPluginOptions.mapTheme} results into a named
+ * theme record. Multi-theme token sets are mapped per theme when `mapTheme`
+ * returns a single theme object.
+ */
+declare function normalizeThemes(mapped: unknown, spec: Pick<Schema, "tokens" | "theme" | "fonts">, identity: {
+  title?: string;
+  homepage?: string;
+  logo?: string;
+}, mapTheme: NonNullable<StorybookPluginOptions["mapTheme"]>): Record<string, StorybookTheme>;
 /**
  * Generate Storybook MDX / React token doc blocks from a Razorwind schema.
  */
@@ -172,6 +190,10 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
  * Razorwind plugin that turns design tokens into Storybook MDX doc blocks
  * (`ColorPalette`, `Typeset`, `TokenTable`, `IconGallery`) and optional UI themes.
  *
+ * Light and dark token sets are emitted as a single `theme.ts`: one theme is
+ * `export default create({…})`; multiple themes are a record keyed by name
+ * (`{ light: create({…}), dark: create({…}) }`).
+ *
  * @see https://storybook.js.org/docs/writing-docs/doc-blocks
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  * @see https://github.com/unpunnyfuns/swatchbook/tree/main/packages/addon
@@ -196,5 +218,5 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
  */
 declare const _default: (options?: StorybookPluginOptions | undefined) => import("@razorwind/core/plugin").Plugin;
 //#endregion
-export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, applyBrandDefaults, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, renderInstallMd, renderThemeFile, resolveTokenSets, toCssVar };
+export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, type StorybookThemePartial, type StorybookThemeResult, applyBrandDefaults, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, normalizeThemes, renderInstallMd, renderThemeFile, resolveTokenSets, toCssVar };
 //# sourceMappingURL=index.d.mts.map

package/dist/index.mjs

@@ -1,16 +1,31 @@
-import{definePlugin as e}from"@razorwind/core/plugin";import{MONO_ROLES as t,SANS_ROLES as n,cssFontFamily as r,pickFontByRole as i}from"@razorwind/core/lib/fonts";import{createDocument as a,flattenTokens as o,formatTokenValue as s,resolveSchemaIdentity as c,resolveTokenSets as l,slugifyThemeName as u,toCssVar as d,toCssVar as f}from"@razorwind/core/utils";import{joinPaths as p}from"@stryke/path/join";import{join as m}from"node:path";function h(e,t={}){let n=t.cssVarPrefix??`rw`;return o(e,{includeTypes:t.includeTypes,enrichToken:e=>({...e,cssVar:f(e.path,n)})})}function g(e){return e.replaceAll(`\\`,`\\\\`).replaceAll(`"`,`\\"`).replaceAll(`
-`,`\\n`).replaceAll(`\r`,`\\r`)}function _(e){return typeof e==`string`?`"${g(e)}"`:typeof e==`number`||typeof e==`boolean`?String(e):e==null?`undefined`:JSON.stringify(e)}function v(e){let t=e.titlePrefix??`Design Tokens`,n=e.themeFiles&&e.themeFiles.length>0?`
+import{definePlugin as e}from"@razorwind/core/plugin";import{MONO_ROLES as t,SANS_ROLES as n,cssFontFamily as r,pickFontByRole as i}from"@razorwind/core/lib/fonts";import{SHARED_THEME_ID as a,createDocument as o,flattenTokens as s,formatTokenValue as c,isSharedThemeId as l,mergeTokenTrees as u,resolveSchemaIdentity as d,resolveTokenSets as f,toCssVar as p,toCssVar as m}from"@razorwind/core/utils";import{joinPaths as h}from"@stryke/path/join";function g(e,t={}){let n=t.cssVarPrefix??`rw`;return s(e,{includeTypes:t.includeTypes,enrichToken:e=>({...e,cssVar:m(e.path,n)})})}function _(e){return e.replaceAll(`\\`,`\\\\`).replaceAll(`"`,`\\"`).replaceAll(`
+`,`\\n`).replaceAll(`\r`,`\\r`)}function v(e){return typeof e==`string`?`"${_(e)}"`:typeof e==`number`||typeof e==`boolean`?String(e):e==null?`undefined`:JSON.stringify(e)}function y(e){let t=e.titlePrefix??`Design Tokens`,n=e.themeFiles?.[0],r=e.themeNames??[],i=n?r.length>1?`
+## Storybook UI theme
+
+Generated theme module:
+
+- \`${n}\` — record of \`create()\` themes keyed by name (${r.map(e=>`\`${e}\``).join(`, `)})
+
+Wire into \`.storybook/preview.ts\`:
+
+\`\`\`ts
+import themes from "../${n}";
+
+export const parameters = {
+  docs: { theme: themes[${JSON.stringify(r[0])}] }
+};
+\`\`\`
+`:`
 ## Storybook UI theme
 
 Generated theme module(s):
 
-${e.themeFiles.map(e=>`- \`${e}\``).join(`
-`)}
+- \`${n}\`
 
 Wire into \`.storybook/preview.ts\`:
 
 \`\`\`ts
-import theme from "../${e.themeFiles[0]}";
+import theme from "../${n}";
 
 export const parameters = {
   docs: { theme }
@@ -25,7 +40,7 @@ Generated by \`@razorwind/storybook\`.
 - \`${e.outputPath}/Tokens.mdx\` — token overview (${t})
 - \`${e.outputPath}/blocks/\` — React doc blocks (ColorPalette, Typeset, …)
 - \`${e.outputPath}/tokens.json\` — flattened token manifest
-${n}
+${i}
 ## Setup
 
 1. Add the generated MDX pages to Storybook (paths depend on your \`stories\` config):
@@ -50,7 +65,7 @@ import { ColorPaletteBlock } from "./blocks";
 ## Regenerate
 
 Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputPath}/\`.
-`}function y(e,t){let n=new Map;for(let r of e){let e=r.path.split(`.`).slice(0,Math.max(t,1)).join(`.`)||r.path,i=n.get(e)??[];i.push(r),n.set(e,i)}return n}function b(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function x(e,t={}){return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
+`}function b(e,t){let n=new Map;for(let r of e){let e=r.path.split(`.`).slice(0,Math.max(t,1)).join(`.`)||r.path,i=n.get(e)??[];i.push(r),n.set(e,i)}return n}function x(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function S(e,t={}){return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
 
 /**
  * Color tokens rendered with Storybook's ColorPalette doc block.
@@ -60,10 +75,10 @@ Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputP
 export function ColorPaletteBlock() {
   return (
     <ColorPalette>
-${[...y(e.filter(e=>e.type===`color`),t.colorGroupBy??2).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,t])=>{let n=t.map(t=>`      ${_(b(t.path,e))}: ${_(t.cssValue)}`).join(`,
+${[...b(e.filter(e=>e.type===`color`),t.colorGroupBy??2).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,t])=>{let n=t.map(t=>`      ${v(x(t.path,e))}: ${v(t.cssValue)}`).join(`,
 `),r=t.find(e=>e.description)?.description??`${t.length} token${t.length===1?``:`s`}`;return`    <ColorItem
-      title={${_(e)}}
-      subtitle={${_(r)}}
+      title={${v(e)}}
+      subtitle={${v(r)}}
       colors={{
 ${n}
       }}
@@ -72,7 +87,7 @@ ${n}
     </ColorPalette>
   );
 }
-`}function S(e,t={}){let a=t.sampleText??`The quick brown fox jumps over the lazy dog`,o=e.filter(e=>e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)).map(e=>{let t=/^(\d+(?:\.\d+)?)/.exec(e.cssValue);return t?Number(t[1]):e.cssValue}),s=[...new Set(o)],c=i(t.fonts,n),l=(c?r(c):void 0)??e.find(e=>e.type===`fontFamily`)?.cssValue??`system-ui, sans-serif`,u=e.find(e=>e.type===`fontWeight`),d=u&&Number.parseFloat(u.cssValue)||400,f=s.length>0?`[${s.map(e=>_(e)).join(`, `)}]`:`[12, 14, 16, 20, 24, 32]`;return`import { Typeset } from "@storybook/addon-docs/blocks";
+`}function C(e,t={}){let a=t.sampleText??`The quick brown fox jumps over the lazy dog`,o=e.filter(e=>e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)).map(e=>{let t=/^(\d+(?:\.\d+)?)/.exec(e.cssValue);return t?Number(t[1]):e.cssValue}),s=[...new Set(o)],c=i(t.fonts,n),l=(c?r(c):void 0)??e.find(e=>e.type===`fontFamily`)?.cssValue??`system-ui, sans-serif`,u=e.find(e=>e.type===`fontWeight`),d=u&&Number.parseFloat(u.cssValue)||400,f=s.length>0?`[${s.map(e=>v(e)).join(`, `)}]`:`[12, 14, 16, 20, 24, 32]`;return`import { Typeset } from "@storybook/addon-docs/blocks";
 
 /**
  * Typography tokens rendered with Storybook's Typeset doc block.
@@ -82,14 +97,14 @@ ${n}
 export function TypesetBlock() {
   return (
     <Typeset
-      fontFamily={${_(l)}}
+      fontFamily={${v(l)}}
       fontSizes={${f}}
-      fontWeight={${_(d)}}
-      sampleText={${_(a)}}
+      fontWeight={${v(d)}}
+      sampleText={${v(a)}}
     />
   );
 }
-`}function C(e){return`import type { CSSProperties, ReactElement } from "react";
+`}function w(e){return`import type { CSSProperties, ReactElement } from "react";
 
 export interface TokenTableRow {
   path: string;
@@ -101,12 +116,12 @@ export interface TokenTableRow {
 }
 
 const TOKENS: TokenTableRow[] = [
-${e.map(e=>{let t=e.theme?_(e.theme):`undefined`;return`    {
-      path: ${_(e.path)},
-      type: ${e.type?_(e.type):`undefined`},
-      value: ${_(e.cssValue)},
-      cssVar: ${_(e.cssVar)},
-      description: ${e.description?_(e.description):`undefined`},
+${e.map(e=>{let t=e.theme?v(e.theme):`undefined`;return`    {
+      path: ${v(e.path)},
+      type: ${e.type?v(e.type):`undefined`},
+      value: ${v(e.cssValue)},
+      cssVar: ${v(e.cssVar)},
+      description: ${e.description?v(e.description):`undefined`},
       theme: ${t}
     }`}).join(`,
 `)||``}
@@ -193,7 +208,7 @@ export function TokenTableBlock({
     </table>
   );
 }
-`}function w(e){let t=e.titlePrefix??`Design Tokens`,n=e.hasColors?`
+`}function T(e){let t=e.titlePrefix??`Design Tokens`,n=e.hasColors?`
 ## Colors
 
 <ColorPaletteBlock />
@@ -206,7 +221,7 @@ import { ColorPaletteBlock } from "./blocks/ColorPalette";
 import { TokenTableBlock } from "./blocks/TokenTable";
 import { TypesetBlock } from "./blocks/Typeset";
 
-<Meta title="${g(t)}/Overview" />
+<Meta title="${_(t)}/Overview" />
 
 # ${t}
 
@@ -215,23 +230,23 @@ ${n}${r}
 ## All tokens
 
 <TokenTableBlock />
-`}function T(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function E(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { ColorPaletteBlock } from "./blocks/ColorPalette";
 
-<Meta title="${g(e.titlePrefix??`Design Tokens`)}/Colors" />
+<Meta title="${_(e.titlePrefix??`Design Tokens`)}/Colors" />
 
 # Colors
 
 <ColorPaletteBlock />
-`}function E(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function D(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { TypesetBlock } from "./blocks/Typeset";
 
-<Meta title="${g(e.titlePrefix??`Design Tokens`)}/Typography" />
+<Meta title="${_(e.titlePrefix??`Design Tokens`)}/Typography" />
 
 # Typography
 
 <TypesetBlock />
-`}function D(e,t){let n=e[t];return typeof n==`string`?n:void 0}function O(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function k(e){return`import { IconGallery, IconItem } from "@storybook/addon-docs/blocks";
+`}function O(e,t){let n=e[t];return typeof n==`string`?n:void 0}function k(e){return typeof e==`object`&&!!e&&!Array.isArray(e)}function A(e){return`import { IconGallery, IconItem } from "@storybook/addon-docs/blocks";
 
 /**
  * Icons rendered with Storybook's IconGallery doc block.
@@ -241,39 +256,48 @@ import { TypesetBlock } from "./blocks/Typeset";
 export function IconGalleryBlock() {
   return (
     <IconGallery>
-${(O(e)?Object.values(e).filter(O).toSorted((e,t)=>(D(e,`name`)??``).localeCompare(D(t,`name`)??``)):[]).map(e=>{let t=D(e,`name`)??`unknown`,n=(Array.isArray(e.files)?e.files:[]).find(e=>O(e)&&D(e,`type`)===`svg`&&typeof e.content==`string`),r=O(n)&&typeof n.content==`string`?`<span
+${(k(e)?Object.values(e).filter(k).toSorted((e,t)=>(O(e,`name`)??``).localeCompare(O(t,`name`)??``)):[]).map(e=>{let t=O(e,`name`)??`unknown`,n=(Array.isArray(e.files)?e.files:[]).find(e=>k(e)&&O(e,`type`)===`svg`&&typeof e.content==`string`),r=k(n)&&typeof n.content==`string`?`<span
           style={{ display: "inline-flex", width: 24, height: 24 }}
-          dangerouslySetInnerHTML={{ __html: ${_(n.content)} }}
-        />`:`<code>${g(t)}</code>`;return`    <IconItem name={${_(t)}}>
+          dangerouslySetInnerHTML={{ __html: ${v(n.content)} }}
+        />`:`<code>${_(t)}</code>`;return`    <IconItem name={${v(t)}}>
       ${r}
     </IconItem>`}).join(`
 `)||`      {/* No icons */}`}
     </IconGallery>
   );
 }
-`}function A(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
+`}function j(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
 import { IconGalleryBlock } from "./blocks/IconGallery";
 
-<Meta title="${g(e.titlePrefix??`Design Tokens`)}/Icons" />
+<Meta title="${_(e.titlePrefix??`Design Tokens`)}/Icons" />
 
 # Icons
 
 <IconGalleryBlock />
-`}function j(){return`export { ColorPaletteBlock } from "./ColorPalette";
+`}function M(){return`export { ColorPaletteBlock } from "./ColorPalette";
 export { IconGalleryBlock } from "./IconGallery";
 export { TokenTableBlock } from "./TokenTable";
 export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
 export { TypesetBlock } from "./Typeset";
-`}function M(e){return O(e)?e.base===`light`||e.base===`dark`:!1}function N(e,a,o){let s=i(o,n),c=i(o,t);return{brandTarget:`_blank`,...e,brandTitle:e.brandTitle??a.title,brandUrl:e.brandUrl??a.homepage,brandImage:e.brandImage??a.logo,fontBase:e.fontBase??(s?r(s):void 0),fontCode:e.fontCode??(c?r(c):void 0)}}function P(e){return`import { create } from "storybook/theming";
+`}const N=new Set(`base.colorPrimary.colorSecondary.appBg.appContentBg.appHoverBg.appPreviewBg.appBorderColor.appBorderRadius.fontBase.fontCode.textColor.textInverseColor.textMutedColor.barTextColor.barHoverColor.barSelectedColor.barBg.buttonBg.buttonBorder.booleanBg.booleanSelectedBg.inputBg.inputBorder.inputTextColor.inputBorderRadius.brandTitle.brandUrl.brandImage.brandTarget.gridCellSize`.split(`.`));function P(e){return k(e)?e.base===`light`||e.base===`dark`:!1}function F(e){return k(e)?P(e)?!0:Object.keys(e).some(e=>N.has(e)):!1}function I(e){if(!k(e)||F(e))return!1;let t=Object.values(e);return t.length>0&&t.every(F)}function L(e,t,n){return t.base===`light`||t.base===`dark`?t.base:`${e} ${n??``}`.toLowerCase().includes(`light`)?`light`:`dark`}function R(e){return/^[a-z_$][\w$]*$/i.test(e)?e:v(e)}function z(e,t){let n=e.find(e=>e.id===a);return!n||l(t.id)?t.tokens:u(t.tokens,n.tokens)}function B(e,t,n,r,i){return V(L(e,t,i),t,n,r)}function V(e,a,o,s){let c=i(s,n),l=i(s,t);return{brandTarget:`_blank`,base:e||`light`,...a,brandTitle:a.brandTitle??o.title,brandUrl:a.brandUrl??o.homepage,brandImage:a.brandImage??o.logo,fontBase:a.fontBase??(c?r(c):void 0),fontCode:a.fontCode??(l?r(l):void 0)}}function H(e,t=``){return`create({\n${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,n])=>`${t}  ${e}: ${v(n)}`).join(`,
+`)}\n${t}})`}function U(e){return`import { create } from "storybook/theming";
 
 /**
  * Storybook UI theme generated by \`@razorwind/storybook\`.
  *
  * @see https://storybook.js.org/docs/configure/user-interface/theming
  */
-export default create({
-${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,t])=>`  ${e}: ${_(t)}`).join(`,
+export default ${H(e)};
+`}function W(e){return`import { create } from "storybook/theming";
+
+/**
+ * Storybook UI themes generated by \`@razorwind/storybook\`.
+ *
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
+ */
+export default {
+${Object.entries(e).map(([e,t])=>`  ${R(e)}: ${H(t,`  `)}`).join(`,
 `)}
-});
-`}const F=e=>(t,n,r)=>a(p(e,t),n,{name:`razorwind-storybook`},(n,r)=>p(e,u(r),t),r);function I(e,t={}){let n=t.outputPath??`storybook/tokens`,r=c(e),i=t.titlePrefix??r.title??`Design Tokens`,a={...t,titlePrefix:i},o=h(e.tokens,t),s=o.some(e=>e.type===`color`),l=e.fonts&&Object.keys(e.fonts).length>0||o.some(e=>e.type===`fontFamily`||e.type===`fontWeight`||e.type===`typography`||e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)),u=!t.skipIcons&&O(e.icons)&&Object.keys(e.icons).length>0,d=F(n),f={[p(n,`blocks/ColorPalette.tsx`)]:d(`blocks/ColorPalette.tsx`,x(o,a),`tsx`),[p(n,`blocks/Typeset.tsx`)]:d(`blocks/Typeset.tsx`,S(o,{...a,fonts:e.fonts}),`tsx`),[p(n,`blocks/TokenTable.tsx`)]:d(`blocks/TokenTable.tsx`,C(o),`tsx`),[p(n,`blocks/IconGallery.tsx`)]:d(`blocks/IconGallery.tsx`,k(t.skipIcons?{}:e.icons),`tsx`),[p(n,`blocks/index.ts`)]:d(`blocks/index.ts`,j(),`typescript`),[p(n,`Tokens.mdx`)]:d(`Tokens.mdx`,w({titlePrefix:i,hasColors:s,hasTypography:l}),`mdx`)};if(s&&(f[p(n,`Colors.mdx`)]=d(`Colors.mdx`,T(a),`mdx`)),l&&(f[p(n,`Typography.mdx`)]=d(`Typography.mdx`,E(a),`mdx`)),u&&(f[p(n,`Icons.mdx`)]=d(`Icons.mdx`,A(a),`mdx`)),f[p(n,`tokens.json`)]=d(`tokens.json`,`${JSON.stringify(o,null,2)}\n`,`json`),t.mapTheme){let i=t.mapTheme(e.tokens);if(M(i))f[p(n,`theme.ts`)]=d(`theme.ts`,P(N(i,r,e.fonts)),`typescript`);else if(O(i))for(let[t,a]of Object.entries(i))M(a)&&(f[p(n,`theme-${t}.ts`)]=d(`theme-${t}.ts`,P(N(a,r,e.fonts)),`typescript`))}let g=Object.keys(f).filter(e=>e.startsWith(m(n,`theme`))).map(e=>e.slice(n.length+1)),_=`INSTALL.md`;return f[p(n,_)]=d(_,t.installGuide??v({outputPath:n,titlePrefix:i,themeFiles:g.length>0?g:void 0}),`markdown`),f}var L=e(e=>({name:`storybook`,generate:async t=>I(t,e??{})}));export{N as applyBrandDefaults,L as default,h as flattenTokens,s as formatTokenValue,I as generateTokenDocs,v as renderInstallMd,P as renderThemeFile,l as resolveTokenSets,d as toCssVar};
+};
+`}function G(e){if(P(e))return U(e);let t=Object.entries(e);if(t.length!==1)return W(e);let[,n]=t[0]??[];return n?U(n):W(e)}function K(e,t,n,r){let i=(e,r)=>B(e,r,n,t.fonts,t.theme);if(I(e))return Object.fromEntries(Object.entries(e).map(([e,t])=>[e,i(e,t)]));let a=f(t.tokens),o=a.filter(e=>!l(e.id));if(o.length>1){let e={};for(let t of o){let n=r(z(a,t));if(I(n)){let r=n[t.id];if(r){e[t.id]=i(t.id,r);continue}for(let[t,r]of Object.entries(n))e[t]=i(t,r);continue}F(n)&&(e[t.id]=i(t.id,n))}return e}if(F(e)){let n=o[0]&&o[0].id!=="default"?o[0].id:t.theme??`default`;return{[n]:i(n,e)}}return{}}const q=e=>(t,n,r)=>o(h(e,t),n,{name:`razorwind-storybook`},!1,r);function J(e,t={}){let n=t.outputPath??`storybook/tokens`,r=d(e),i=t.titlePrefix??r.title??`Design Tokens`,a={...t,titlePrefix:i},o=g(e.tokens,t),s=o.some(e=>e.type===`color`),c=e.fonts&&Object.keys(e.fonts).length>0||o.some(e=>e.type===`fontFamily`||e.type===`fontWeight`||e.type===`typography`||e.type===`dimension`&&/(?:font|type|text).*size|size.*(?:font|type|text)/i.test(e.path)),l=!t.skipIcons&&k(e.icons)&&Object.keys(e.icons).length>0,u=q(n),f={[h(n,`blocks/ColorPalette.tsx`)]:u(`blocks/ColorPalette.tsx`,S(o,a),`tsx`),[h(n,`blocks/Typeset.tsx`)]:u(`blocks/Typeset.tsx`,C(o,{...a,fonts:e.fonts}),`tsx`),[h(n,`blocks/TokenTable.tsx`)]:u(`blocks/TokenTable.tsx`,w(o),`tsx`),[h(n,`blocks/IconGallery.tsx`)]:u(`blocks/IconGallery.tsx`,A(t.skipIcons?{}:e.icons),`tsx`),[h(n,`blocks/index.ts`)]:u(`blocks/index.ts`,M(),`typescript`),[h(n,`Tokens.mdx`)]:u(`Tokens.mdx`,T({titlePrefix:i,hasColors:s,hasTypography:c}),`mdx`)};s&&(f[h(n,`Colors.mdx`)]=u(`Colors.mdx`,E(a),`mdx`)),c&&(f[h(n,`Typography.mdx`)]=u(`Typography.mdx`,D(a),`mdx`)),l&&(f[h(n,`Icons.mdx`)]=u(`Icons.mdx`,j(a),`mdx`)),f[h(n,`tokens.json`)]=u(`tokens.json`,`${JSON.stringify(o,null,2)}\n`,`json`);let p;if(t.mapTheme){let i=K(t.mapTheme(e.tokens),e,r,t.mapTheme);Object.keys(i).length>0&&(p=Object.keys(i),f[h(n,`theme.ts`)]=u(`theme.ts`,G(i),`typescript`))}let m=`INSTALL.md`;return f[h(n,m)]=u(m,t.installGuide??y({outputPath:n,titlePrefix:i,themeFiles:p?[`theme.ts`]:void 0,themeNames:p}),`markdown`),f}var Y=e(e=>({name:`storybook`,themeGeneration:`combined`,generate:async t=>J(t,e??{})}));export{V as applyBrandDefaults,Y as default,g as flattenTokens,c as formatTokenValue,J as generateTokenDocs,K as normalizeThemes,y as renderInstallMd,G as renderThemeFile,f as resolveTokenSets,p as toCssVar};
 //# sourceMappingURL=index.mjs.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@razorwind/storybook",
-  "version": "0.0.48",
+  "version": "0.0.49",
   "type": "module",
   "description": "Razorwind plugin that creates Storybook MDX token doc blocks from Razorwind design tokens.",
   "repository": {
@@ -85,7 +85,7 @@
   "dependencies": {
     "@power-plant/core": "^0.0.90",
     "@power-plant/dtcg-schema": "^0.0.1",
-    "@razorwind/core": "^0.0.51",
+    "@razorwind/core": "^0.0.52",
     "@stryke/path": "^0.29.35",
     "@stryke/type-checks": "^0.6.41"
   },
@@ -101,9 +101,10 @@
   },
   "devDependencies": {
     "@powerlines/plugin-tsdown": "^0.1.612",
+    "@stryke/types": "^0.12.36",
     "@types/node": "^25.9.5",
     "typescript": "^6.0.3"
   },
   "publishConfig": { "access": "public" },
-  "gitHead": "3a51456206724861cda83c344cb35ffcb8b3b8f1"
+  "gitHead": "a72e2fb9b29f96e4f2c2241f622e56e6929f6dc9"
 }