@razorwind/storybook 0.0.51 → 0.0.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -279,16 +279,16 @@ export { IconGalleryBlock } from "./IconGallery";
279
279
  export { TokenTableBlock } from "./TokenTable";
280
280
  export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
281
281
  export { TypesetBlock } from "./Typeset";
282
- `}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(`,
283
- `)}\n${t}})`}function j(e){return`import { create } from "storybook/theming";
282
+ `}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)}const O=/^\{([^{}]+)\}$/;function k(e){if(typeof e==`string`)return O.exec(e.trim())?.[1]?.trim()}function A(e){return _(e)&&`$value`in e&&!(`colorSpace`in e)&&!(`hex`in e)?e.$value:e}function j(e,t){let n=A(e),r=new Set;for(let e=0;e<8;e++){let e=k(n);if(!e||r.has(e))break;r.add(e);let i=t.get(e);if(!i)break;n=i.value}return n}function M(e){return e==null||typeof e==`string`||typeof e==`number`||typeof e==`boolean`?e:(0,n.formatTokenValue)(e)}function N(e,t){let r=(0,n.resolveTokenSets)(e),a=r.find(e=>e.id===t)??(r.length===1?r[0]:void 0),o=a?D(r,a):e,s=new Map;for(let e of i(o))(!s.get(e.path)||e.theme===t)&&s.set(e.path,e);return s}function P(e,t){let n={...e};for(let[r,i]of Object.entries(e))r!==`base`&&i!==void 0&&(n[r]=M(j(i,t)));return n}function F(e,t,n,r,i){let a=P(t,N(i.tokens,e));return I(T(e,a,i.theme),a,n,r)}function I(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 L(e,t=``){return`create({\n${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,n])=>`${t} ${e}: ${o(n)}`).join(`,
283
+ `)}\n${t}})`}function R(e){return`import { create } from "storybook/theming";
284
284
 
285
285
  /**
286
286
  * Storybook UI theme generated by \`@razorwind/storybook\`.
287
287
  *
288
288
  * @see https://storybook.js.org/docs/configure/user-interface/theming
289
289
  */
290
- export default ${A(e)};
291
- `}function M(e){return`import { create } from "storybook/theming";
290
+ export default ${L(e)};
291
+ `}function z(e){return`import { create } from "storybook/theming";
292
292
 
293
293
  /**
294
294
  * Storybook UI themes generated by \`@razorwind/storybook\`.
@@ -296,7 +296,7 @@ export default ${A(e)};
296
296
  * @see https://storybook.js.org/docs/configure/user-interface/theming
297
297
  */
298
298
  export default {
299
- ${Object.entries(e).map(([e,t])=>` ${E(e)}: ${A(t,` `)}`).join(`,
299
+ ${Object.entries(e).map(([e,t])=>` ${E(e)}: ${L(t,` `)}`).join(`,
300
300
  `)}
301
301
  };
302
- `}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}});
302
+ `}function B(e){if(S(e))return R(e);let t=Object.entries(e);if(t.length!==1)return z(e);let[,n]=t[0]??[];return n?R(n):z(e)}function V(e,t,r,i){let a=(e,n)=>F(e,n,r,t.fonts,t);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 H=e=>(t,i,a)=>(0,n.createDocument)((0,r.joinPaths)(e,t),i,{name:`razorwind-storybook`},!1,a);function U(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=H(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=V(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`,B(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 W=(0,e.definePlugin)(e=>({name:`storybook`,themeGeneration:`combined`,generate:async t=>U(t,e??{})}));exports.applyBrandDefaults=I,exports.default=W,exports.flattenTokens=i,Object.defineProperty(exports,"formatTokenValue",{enumerable:!0,get:function(){return n.formatTokenValue}}),exports.generateTokenDocs=U,exports.normalizeThemes=V,exports.renderInstallMd=s,exports.renderThemeFile=B,exports.resolveTokenSets=n.resolveTokenSets,Object.defineProperty(exports,"toCssVar",{enumerable:!0,get:function(){return n.toCssVar}});
package/dist/index.d.cts CHANGED
@@ -117,6 +117,9 @@ interface StorybookPluginOptions {
117
117
  * multiple themes become a record keyed by theme name
118
118
  * (`{ light: create({…}), dark: create({…}) }`).
119
119
  *
120
+ * DTCG aliases (`{color.base.1}`) and color objects in mapped values are
121
+ * resolved to concrete CSS colors before emit.
122
+ *
120
123
  * @see https://storybook.js.org/docs/configure/user-interface/theming
121
124
  */
122
125
  mapTheme?: GenerateStorybookTheme;
@@ -1 +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":";;;;;;;;;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"}
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":";;;;;;;;;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;;;;;;;;;;;;;;EAeA,WAAW;;;;;;EAOX;;;;;EAMA;;;;;;;iBCrIc,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBCba,gBAAgB;EAC9B;EACA;EACA;EACA;;;;;;;iBCorBc,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 CHANGED
@@ -117,6 +117,9 @@ interface StorybookPluginOptions {
117
117
  * multiple themes become a record keyed by theme name
118
118
  * (`{ light: create({…}), dark: create({…}) }`).
119
119
  *
120
+ * DTCG aliases (`{color.base.1}`) and color objects in mapped values are
121
+ * resolved to concrete CSS colors before emit.
122
+ *
120
123
  * @see https://storybook.js.org/docs/configure/user-interface/theming
121
124
  */
122
125
  mapTheme?: GenerateStorybookTheme;
package/dist/index.mjs CHANGED
@@ -230,7 +230,7 @@ ${n}${r}
230
230
  ## All tokens
231
231
 
232
232
  <TokenTableBlock />
233
- `}function E(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
233
+ `}function ee(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
234
234
  import { ColorPaletteBlock } from "./blocks/ColorPalette";
235
235
 
236
236
  <Meta title="${_(e.titlePrefix??`Design Tokens`)}/Colors" />
@@ -238,7 +238,7 @@ import { ColorPaletteBlock } from "./blocks/ColorPalette";
238
238
  # Colors
239
239
 
240
240
  <ColorPaletteBlock />
241
- `}function D(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
241
+ `}function E(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
242
242
  import { TypesetBlock } from "./blocks/Typeset";
243
243
 
244
244
  <Meta title="${_(e.titlePrefix??`Design Tokens`)}/Typography" />
@@ -246,7 +246,7 @@ import { TypesetBlock } from "./blocks/Typeset";
246
246
  # Typography
247
247
 
248
248
  <TypesetBlock />
249
- `}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";
249
+ `}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";
250
250
 
251
251
  /**
252
252
  * Icons rendered with Storybook's IconGallery doc block.
@@ -256,7 +256,7 @@ import { TypesetBlock } from "./blocks/Typeset";
256
256
  export function IconGalleryBlock() {
257
257
  return (
258
258
  <IconGallery>
259
- ${(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
259
+ ${(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
260
260
  style={{ display: "inline-flex", width: 24, height: 24 }}
261
261
  dangerouslySetInnerHTML={{ __html: ${v(n.content)} }}
262
262
  />`:`<code>${_(t)}</code>`;return` <IconItem name={${v(t)}}>
@@ -266,7 +266,7 @@ ${(k(e)?Object.values(e).filter(k).toSorted((e,t)=>(O(e,`name`)??``).localeCompa
266
266
  </IconGallery>
267
267
  );
268
268
  }
269
- `}function j(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
269
+ `}function A(e={}){return`import { Meta } from "@storybook/addon-docs/blocks";
270
270
  import { IconGalleryBlock } from "./blocks/IconGallery";
271
271
 
272
272
  <Meta title="${_(e.titlePrefix??`Design Tokens`)}/Icons" />
@@ -274,21 +274,21 @@ import { IconGalleryBlock } from "./blocks/IconGallery";
274
274
  # Icons
275
275
 
276
276
  <IconGalleryBlock />
277
- `}function M(){return`export { ColorPaletteBlock } from "./ColorPalette";
277
+ `}function j(){return`export { ColorPaletteBlock } from "./ColorPalette";
278
278
  export { IconGalleryBlock } from "./IconGallery";
279
279
  export { TokenTableBlock } from "./TokenTable";
280
280
  export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
281
281
  export { TypesetBlock } from "./Typeset";
282
- `}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(`,
283
- `)}\n${t}})`}function U(e){return`import { create } from "storybook/theming";
282
+ `}const M=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 N(e){return O(e)?e.base===`light`||e.base===`dark`:!1}function P(e){return O(e)?N(e)?!0:Object.keys(e).some(e=>M.has(e)):!1}function F(e){if(!O(e)||P(e))return!1;let t=Object.values(e);return t.length>0&&t.every(P)}function I(e,t,n){return t.base===`light`||t.base===`dark`?t.base:`${e} ${n??``}`.toLowerCase().includes(`light`)?`light`:`dark`}function L(e){return/^[a-z_$][\w$]*$/i.test(e)?e:v(e)}function R(e,t){let n=e.find(e=>e.id===a);return!n||l(t.id)?t.tokens:u(t.tokens,n.tokens)}const z=/^\{([^{}]+)\}$/;function B(e){if(typeof e==`string`)return z.exec(e.trim())?.[1]?.trim()}function V(e){return O(e)&&`$value`in e&&!(`colorSpace`in e)&&!(`hex`in e)?e.$value:e}function H(e,t){let n=V(e),r=new Set;for(let e=0;e<8;e++){let e=B(n);if(!e||r.has(e))break;r.add(e);let i=t.get(e);if(!i)break;n=i.value}return n}function U(e){return e==null||typeof e==`string`||typeof e==`number`||typeof e==`boolean`?e:c(e)}function W(e,t){let n=f(e),r=n.find(e=>e.id===t)??(n.length===1?n[0]:void 0),i=r?R(n,r):e,a=new Map;for(let e of g(i))(!a.get(e.path)||e.theme===t)&&a.set(e.path,e);return a}function G(e,t){let n={...e};for(let[r,i]of Object.entries(e))r!==`base`&&i!==void 0&&(n[r]=U(H(i,t)));return n}function K(e,t,n,r,i){let a=G(t,W(i.tokens,e));return q(I(e,a,i.theme),a,n,r)}function q(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 J(e,t=``){return`create({\n${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,n])=>`${t} ${e}: ${v(n)}`).join(`,
283
+ `)}\n${t}})`}function Y(e){return`import { create } from "storybook/theming";
284
284
 
285
285
  /**
286
286
  * Storybook UI theme generated by \`@razorwind/storybook\`.
287
287
  *
288
288
  * @see https://storybook.js.org/docs/configure/user-interface/theming
289
289
  */
290
- export default ${H(e)};
291
- `}function W(e){return`import { create } from "storybook/theming";
290
+ export default ${J(e)};
291
+ `}function X(e){return`import { create } from "storybook/theming";
292
292
 
293
293
  /**
294
294
  * Storybook UI themes generated by \`@razorwind/storybook\`.
@@ -296,8 +296,8 @@ export default ${H(e)};
296
296
  * @see https://storybook.js.org/docs/configure/user-interface/theming
297
297
  */
298
298
  export default {
299
- ${Object.entries(e).map(([e,t])=>` ${R(e)}: ${H(t,` `)}`).join(`,
299
+ ${Object.entries(e).map(([e,t])=>` ${L(e)}: ${J(t,` `)}`).join(`,
300
300
  `)}
301
301
  };
302
- `}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};
302
+ `}function Z(e){if(N(e))return Y(e);let t=Object.entries(e);if(t.length!==1)return X(e);let[,n]=t[0]??[];return n?Y(n):X(e)}function Q(e,t,n,r){let i=(e,r)=>K(e,r,n,t.fonts,t);if(F(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(R(a,t));if(F(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}P(n)&&(e[t.id]=i(t.id,n))}return e}if(P(e)){let n=o[0]&&o[0].id!=="default"?o[0].id:t.theme??`default`;return{[n]:i(n,e)}}return{}}const te=e=>(t,n,r)=>o(h(e,t),n,{name:`razorwind-storybook`},!1,r);function $(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&&O(e.icons)&&Object.keys(e.icons).length>0,u=te(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`,k(t.skipIcons?{}:e.icons),`tsx`),[h(n,`blocks/index.ts`)]:u(`blocks/index.ts`,j(),`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`,ee(a),`mdx`)),c&&(f[h(n,`Typography.mdx`)]=u(`Typography.mdx`,E(a),`mdx`)),l&&(f[h(n,`Icons.mdx`)]=u(`Icons.mdx`,A(a),`mdx`)),f[h(n,`tokens.json`)]=u(`tokens.json`,`${JSON.stringify(o,null,2)}\n`,`json`);let p;if(t.mapTheme){let i=Q(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`,Z(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 ne=e(e=>({name:`storybook`,themeGeneration:`combined`,generate:async t=>$(t,e??{})}));export{q as applyBrandDefaults,ne as default,g as flattenTokens,c as formatTokenValue,$ as generateTokenDocs,Q as normalizeThemes,y as renderInstallMd,Z as renderThemeFile,f as resolveTokenSets,p as toCssVar};
303
303
  //# sourceMappingURL=index.mjs.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@razorwind/storybook",
3
- "version": "0.0.51",
3
+ "version": "0.0.52",
4
4
  "type": "module",
5
5
  "description": "Razorwind plugin that creates Storybook MDX token doc blocks from Razorwind design tokens.",
6
6
  "repository": {
@@ -85,9 +85,9 @@
85
85
  "dependencies": {
86
86
  "@power-plant/core": "^0.0.90",
87
87
  "@power-plant/dtcg-schema": "^0.0.1",
88
- "@razorwind/core": "^0.0.54",
89
- "@stryke/path": "^0.29.35",
90
- "@stryke/type-checks": "^0.6.41"
88
+ "@razorwind/core": "^0.0.55",
89
+ "@stryke/path": "^0.29.36",
90
+ "@stryke/type-checks": "^0.6.42"
91
91
  },
92
92
  "peerDependencies": {
93
93
  "@storybook/addon-docs": ">=8",
@@ -101,10 +101,10 @@
101
101
  },
102
102
  "devDependencies": {
103
103
  "@powerlines/plugin-tsdown": "^0.1.612",
104
- "@stryke/types": "^0.12.36",
104
+ "@stryke/types": "^0.12.37",
105
105
  "@types/node": "^25.9.5",
106
106
  "typescript": "^6.0.3"
107
107
  },
108
108
  "publishConfig": { "access": "public" },
109
- "gitHead": "7a1d011f9b9716e3580fc01fd34abef701c02e3f"
109
+ "gitHead": "a0e63cfffa72f4e3438a28e633cc72c29aa065fd"
110
110
  }