@razorwind/storybook 0.0.71 → 0.0.72

package/dist/index.cjs

@@ -71,26 +71,18 @@ import { ColorPaletteBlock } from "./blocks";
 ## Regenerate
 
 Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputPath}/\`.
-`}const p=/* @__PURE__ */ new Set([`fontFamily`,`fontWeight`,`typography`]),m=/font|typography|type|text|line[-_.]?height|letter[-_.]?spacing/i;function h(e){return p.has(e.type??``)?!0:(e.type===`dimension`||e.type===`number`)&&m.test(e.path)}function g(e,t){return e.some(e=>t.some(t=>e.path===t||e.path.startsWith(`${t}.`)))}const _=/^\{([^{}]+)\}$/,v=/^var\((--[^),\s]+)(?:\s*,[^)]*)?\)$/;function y(e){if(typeof e==`string`)return _.exec(e.trim())?.[1]?.trim()}function b(e){if(typeof e==`string`)return v.exec(e.trim())?.[1]}function x(e){let t=new Map(e.map(e=>[e.path,e])),r=new Map(e.map(e=>[(0,n.toThemeCssVar)(e.path),e])),i=e=>{let n=e,i=/* @__PURE__ */ new Set;for(let a=0;a<8;a++){if(i.has(n.path))return e.cssValue;i.add(n.path);let a=t.get(y(n.value)??``)??r.get(b(n.value)??b(n.cssValue)??``);if(!a||a.path===n.path)return n.cssValue;n=a}return e.cssValue};return e.map(e=>e.type===`color`?{...e,cssValue:i(e)}:e)}function S(e){return Object.keys(e).length>1}function ee(){return`import { useGlobals, useMemo } from "storybook/preview-api";
-
-/**
- * Select a generated token variant. By default this follows Storybook's
- * \`theme\` global; callers may pass \`theme\` to override it.
+`}const p=/* @__PURE__ */ new Set([`fontFamily`,`fontWeight`,`typography`]),m=/font|typography|type|text|line[-_.]?height|letter[-_.]?spacing/i;function h(e){return p.has(e.type??``)?!0:(e.type===`dimension`||e.type===`number`)&&m.test(e.path)}function g(e,t){return e.some(e=>t.some(t=>e.path===t||e.path.startsWith(`${t}.`)))}const _=/^\{([^{}]+)\}$/,v=/^var\((--[^),\s]+)(?:\s*,[^)]*)?\)$/;function y(e){if(typeof e==`string`)return _.exec(e.trim())?.[1]?.trim()}function b(e){if(typeof e==`string`)return v.exec(e.trim())?.[1]}function x(e){let t=new Map(e.map(e=>[e.path,e])),r=new Map(e.map(e=>[(0,n.toThemeCssVar)(e.path),e])),i=e=>{let n=e,i=/* @__PURE__ */ new Set;for(let a=0;a<8;a++){if(i.has(n.path))return e.cssValue;i.add(n.path);let a=t.get(y(n.value)??``)??r.get(b(n.value)??b(n.cssValue)??``);if(!a||a.path===n.path)return n.cssValue;n=a}return e.cssValue};return e.map(e=>e.type===`color`?{...e,cssValue:i(e)}:e)}function S(e){return Object.keys(e).length>1}function ee(){return`/**
+ * Select a generated token variant. Callers may pass \`theme\` to override
+ * the generated fallback without requiring Storybook preview-hook context.
  */
-export function useThemeVariant<T extends Record<string, unknown>>(
+export function resolveThemeVariant<T extends Record<string, unknown>>(
   variants: T,
   fallback: keyof T & string,
   theme?: string
 ): keyof T & string {
-  const [globals] = useGlobals();
-
-  return useMemo(() => {
-    const candidate = theme ?? globals.theme;
-
-    return typeof candidate === "string" && candidate in variants
-      ? (candidate as keyof T & string)
-      : fallback;
-  }, [fallback, globals.theme, theme, variants]);
+  return typeof theme === "string" && theme in variants
+    ? (theme as keyof T & string)
+    : fallback;
 }
 `}function C(e,t){let r=(0,n.resolveTokenSets)(e),i=r.filter(e=>!(0,n.isSharedThemeId)(e.id));return i.length<=1?{default:x(l(e,t))}:Object.fromEntries(i.map(e=>[e.id,x(l(B(r,e),t))]))}function w(e,t){let n=/* @__PURE__ */ 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 T(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function E(e,t={}){let n=t.colorGroupBy??2,r=Object.entries(e),i=r[0]?.[0]??`default`,a=S(e),o=(e,t=`    `)=>[...w(e,n).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,n])=>{let r=n.map(n=>`${t}  ${d(T(n.path,e))}: ${d(n.cssValue)}`).join(`,
 `),i=n.find(e=>e.description)?.description??`${n.length} token${n.length===1?``:`s`}`;return`${t}<ColorItem
@@ -108,7 +100,7 @@ ${o(t,`          `)}
       </section>`).join(`
 `);return a?`<>\n${c}\n    </>`:`<ColorPalette>\n${s||`      {/* No color tokens */}`}\n    </ColorPalette>`},c=r.map(([e,t])=>`  ${d(e)}: (\n    ${s(t)}\n  )`).join(`,
 `);return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
-${a?`import { useThemeVariant } from "./ThemeVariant";
+${a?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 /**
@@ -121,12 +113,12 @@ ${c}
 };
 
 export interface ColorPaletteBlockProps {
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
 export function ColorPaletteBlock({ theme }: ColorPaletteBlockProps = {}) {
-  const activeTheme = ${a?`useThemeVariant(COLOR_VARIANTS, ${d(i)}, theme)`:d(i)};
+  const activeTheme = ${a?`resolveThemeVariant(COLOR_VARIANTS, ${d(i)}, theme)`:d(i)};
 
   return COLOR_VARIANTS[activeTheme];
 }
@@ -137,7 +129,7 @@ export function ColorPaletteBlock({ theme }: ColorPaletteBlockProps = {}) {
       sampleText={${d(r)}}
     />`},c=a.map(([e,t])=>`  ${d(e)}: (${s(t)})`).join(`,
 `);return`import { Typeset } from "@storybook/addon-docs/blocks";
-${i?`import { useThemeVariant } from "./ThemeVariant";
+${i?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 /**
@@ -150,12 +142,12 @@ ${c}
 };
 
 export interface TypesetBlockProps {
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
 export function TypesetBlock({ theme }: TypesetBlockProps = {}) {
-  const activeTheme = ${i?`useThemeVariant(TYPESET_VARIANTS, ${d(o)}, theme)`:d(o)};
+  const activeTheme = ${i?`resolveThemeVariant(TYPESET_VARIANTS, ${d(o)}, theme)`:d(o)};
 
   return TYPESET_VARIANTS[activeTheme];
 }
@@ -172,7 +164,7 @@ export function TypesetBlock({ theme }: TypesetBlockProps = {}) {
 ${i(t)}
   ]`).join(`,
 `);return`import type { CSSProperties, ReactElement } from "react";
-${t?`import { useThemeVariant } from "./ThemeVariant";
+${t?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 export interface TokenTableRow {
@@ -220,7 +212,7 @@ export interface TokenTableBlockProps {
   type?: string;
   /** Restrict rows to tokens used to define typography. */
   typography?: boolean;
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
@@ -233,7 +225,7 @@ export function TokenTableBlock({
   typography,
   theme
 }: TokenTableBlockProps = {}): ReactElement {
-  const activeTheme = ${t?`useThemeVariant(TOKEN_VARIANTS, ${d(r)}, theme)`:d(r)};
+  const activeTheme = ${t?`resolveThemeVariant(TOKEN_VARIANTS, ${d(r)}, theme)`:d(r)};
   const rows = TOKEN_VARIANTS[activeTheme].filter(token => {
     const filters = typeof filter === "string" ? [filter] : filter;
     if (

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":";;;;;;;;;UAwBiB;;EAEf;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;;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;;;;;;;iBC3Dc,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBC3Fa,gBAAgB;EAC9B;EACA;EACA;EACA;EACA;;;;;;;iBCi7Bc,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"}
+{"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;;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;;;;;;;iBC3Dc,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBC3Fa,gBAAgB;EAC9B;EACA;EACA;EACA;EACA;;;;;;;iBCy6Bc,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.mjs

@@ -71,26 +71,18 @@ import { ColorPaletteBlock } from "./blocks";
 ## Regenerate
 
 Re-run Razorwind generate when tokens change to refresh docs under \`${e.outputPath}/\`.
-`}const E=/* @__PURE__ */ new Set([`fontFamily`,`fontWeight`,`typography`]),ne=/font|typography|type|text|line[-_.]?height|letter[-_.]?spacing/i;function D(e){return E.has(e.type??``)?!0:(e.type===`dimension`||e.type===`number`)&&ne.test(e.path)}function O(e,t){return e.some(e=>t.some(t=>e.path===t||e.path.startsWith(`${t}.`)))}const re=/^\{([^{}]+)\}$/,ie=/^var\((--[^),\s]+)(?:\s*,[^)]*)?\)$/;function k(e){if(typeof e==`string`)return re.exec(e.trim())?.[1]?.trim()}function A(e){if(typeof e==`string`)return ie.exec(e.trim())?.[1]}function j(e){let t=new Map(e.map(e=>[e.path,e])),n=new Map(e.map(e=>[g(e.path),e])),r=e=>{let r=e,i=/* @__PURE__ */ new Set;for(let a=0;a<8;a++){if(i.has(r.path))return e.cssValue;i.add(r.path);let a=t.get(k(r.value)??``)??n.get(A(r.value)??A(r.cssValue)??``);if(!a||a.path===r.path)return r.cssValue;r=a}return e.cssValue};return e.map(e=>e.type===`color`?{...e,cssValue:r(e)}:e)}function M(e){return Object.keys(e).length>1}function ae(){return`import { useGlobals, useMemo } from "storybook/preview-api";
-
-/**
- * Select a generated token variant. By default this follows Storybook's
- * \`theme\` global; callers may pass \`theme\` to override it.
+`}const E=/* @__PURE__ */ new Set([`fontFamily`,`fontWeight`,`typography`]),ne=/font|typography|type|text|line[-_.]?height|letter[-_.]?spacing/i;function D(e){return E.has(e.type??``)?!0:(e.type===`dimension`||e.type===`number`)&&ne.test(e.path)}function O(e,t){return e.some(e=>t.some(t=>e.path===t||e.path.startsWith(`${t}.`)))}const re=/^\{([^{}]+)\}$/,ie=/^var\((--[^),\s]+)(?:\s*,[^)]*)?\)$/;function k(e){if(typeof e==`string`)return re.exec(e.trim())?.[1]?.trim()}function A(e){if(typeof e==`string`)return ie.exec(e.trim())?.[1]}function j(e){let t=new Map(e.map(e=>[e.path,e])),n=new Map(e.map(e=>[g(e.path),e])),r=e=>{let r=e,i=/* @__PURE__ */ new Set;for(let a=0;a<8;a++){if(i.has(r.path))return e.cssValue;i.add(r.path);let a=t.get(k(r.value)??``)??n.get(A(r.value)??A(r.cssValue)??``);if(!a||a.path===r.path)return r.cssValue;r=a}return e.cssValue};return e.map(e=>e.type===`color`?{...e,cssValue:r(e)}:e)}function M(e){return Object.keys(e).length>1}function ae(){return`/**
+ * Select a generated token variant. Callers may pass \`theme\` to override
+ * the generated fallback without requiring Storybook preview-hook context.
  */
-export function useThemeVariant<T extends Record<string, unknown>>(
+export function resolveThemeVariant<T extends Record<string, unknown>>(
   variants: T,
   fallback: keyof T & string,
   theme?: string
 ): keyof T & string {
-  const [globals] = useGlobals();
-
-  return useMemo(() => {
-    const candidate = theme ?? globals.theme;
-
-    return typeof candidate === "string" && candidate in variants
-      ? (candidate as keyof T & string)
-      : fallback;
-  }, [fallback, globals.theme, theme, variants]);
+  return typeof theme === "string" && theme in variants
+    ? (theme as keyof T & string)
+    : fallback;
 }
 `}function oe(e,t){let n=p(e),r=n.filter(e=>!u(e.id));return r.length<=1?{default:j(S(e,t))}:Object.fromEntries(r.map(e=>[e.id,j(S(K(n,e),t))]))}function se(e,t){let n=/* @__PURE__ */ 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 ce(e,t){return e===t?e.split(`.`).at(-1)??e:e.startsWith(`${t}.`)?e.slice(t.length+1):e.split(`.`).at(-1)??e}function le(e,t={}){let n=t.colorGroupBy??2,r=Object.entries(e),i=r[0]?.[0]??`default`,a=M(e),o=(e,t=`    `)=>[...se(e,n).entries()].toSorted(([e],[t])=>e.localeCompare(t)).map(([e,n])=>{let r=n.map(n=>`${t}  ${w(ce(n.path,e))}: ${w(n.cssValue)}`).join(`,
 `),i=n.find(e=>e.description)?.description??`${n.length} token${n.length===1?``:`s`}`;return`${t}<ColorItem
@@ -108,7 +100,7 @@ ${o(t,`          `)}
       </section>`).join(`
 `);return a?`<>\n${c}\n    </>`:`<ColorPalette>\n${s||`      {/* No color tokens */}`}\n    </ColorPalette>`},c=r.map(([e,t])=>`  ${w(e)}: (\n    ${s(t)}\n  )`).join(`,
 `);return`import { ColorPalette, ColorItem } from "@storybook/addon-docs/blocks";
-${a?`import { useThemeVariant } from "./ThemeVariant";
+${a?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 /**
@@ -121,12 +113,12 @@ ${c}
 };
 
 export interface ColorPaletteBlockProps {
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
 export function ColorPaletteBlock({ theme }: ColorPaletteBlockProps = {}) {
-  const activeTheme = ${a?`useThemeVariant(COLOR_VARIANTS, ${w(i)}, theme)`:w(i)};
+  const activeTheme = ${a?`resolveThemeVariant(COLOR_VARIANTS, ${w(i)}, theme)`:w(i)};
 
   return COLOR_VARIANTS[activeTheme];
 }
@@ -137,7 +129,7 @@ export function ColorPaletteBlock({ theme }: ColorPaletteBlockProps = {}) {
       sampleText={${w(a)}}
     />`},u=s.map(([e,t])=>`  ${w(e)}: (${l(t)})`).join(`,
 `);return`import { Typeset } from "@storybook/addon-docs/blocks";
-${o?`import { useThemeVariant } from "./ThemeVariant";
+${o?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 /**
@@ -150,12 +142,12 @@ ${u}
 };
 
 export interface TypesetBlockProps {
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
 export function TypesetBlock({ theme }: TypesetBlockProps = {}) {
-  const activeTheme = ${o?`useThemeVariant(TYPESET_VARIANTS, ${w(c)}, theme)`:w(c)};
+  const activeTheme = ${o?`resolveThemeVariant(TYPESET_VARIANTS, ${w(c)}, theme)`:w(c)};
 
   return TYPESET_VARIANTS[activeTheme];
 }
@@ -172,7 +164,7 @@ export function TypesetBlock({ theme }: TypesetBlockProps = {}) {
 ${i(t)}
   ]`).join(`,
 `);return`import type { CSSProperties, ReactElement } from "react";
-${t?`import { useThemeVariant } from "./ThemeVariant";
+${t?`import { resolveThemeVariant } from "./ThemeVariant";
 `:``}
 
 export interface TokenTableRow {
@@ -220,7 +212,7 @@ export interface TokenTableBlockProps {
   type?: string;
   /** Restrict rows to tokens used to define typography. */
   typography?: boolean;
-  /** Generated token-set name. Defaults to Storybook's \`theme\` global. */
+  /** Generated token-set name. Defaults to the first generated variant. */
   theme?: string;
 }
 
@@ -233,7 +225,7 @@ export function TokenTableBlock({
   typography,
   theme
 }: TokenTableBlockProps = {}): ReactElement {
-  const activeTheme = ${t?`useThemeVariant(TOKEN_VARIANTS, ${w(r)}, theme)`:w(r)};
+  const activeTheme = ${t?`resolveThemeVariant(TOKEN_VARIANTS, ${w(r)}, theme)`:w(r)};
   const rows = TOKEN_VARIANTS[activeTheme].filter(token => {
     const filters = typeof filter === "string" ? [filter] : filter;
     if (

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@razorwind/storybook",
-  "version": "0.0.71",
+  "version": "0.0.72",
   "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.93",
     "@power-plant/dtcg-schema": "^0.0.1",
-    "@razorwind/core": "^0.0.73",
+    "@razorwind/core": "^0.0.74",
     "@stryke/path": "^0.29.42",
     "@stryke/type-checks": "^0.6.48"
   },
@@ -102,9 +102,9 @@
   "devDependencies": {
     "@powerlines/plugin-tsdown": "^0.1.614",
     "@stryke/types": "^0.12.43",
-    "@types/node": "^25.9.7",
+    "@types/node": "^25.9.8",
     "typescript": "^6.0.3"
   },
   "publishConfig": { "access": "public" },
-  "gitHead": "65650c7f21668e9942ca662de1a5ac72beed01e1"
+  "gitHead": "b974ce9d1f860a656d4af34b1c1f2ff82d80f4f6"
 }