@razorwind/storybook 0.0.19 → 0.0.21

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.
Files changed (6) hide show
  1. package/dist/index.cjs +12 -1
  2. package/dist/index.d.cts +97 -27
  3. package/dist/index.d.cts.map +1 -1
  4. package/dist/index.d.mts +97 -27
  5. package/dist/index.mjs +12 -1
  6. package/package.json +3 -3
package/dist/index.cjs CHANGED
@@ -184,4 +184,15 @@ import { TypesetBlock } from "./blocks/Typeset";
184
184
  export { TokenTableBlock } from "./TokenTable";
185
185
  export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
186
186
  export { TypesetBlock } from "./Typeset";
187
- `}function S(e,n,r){return(0,t.createDocument)(e,n,{name:`razorwind-storybook`},r)}function C(e,t={}){let r=t.outputPath??`storybook/tokens`,i=f(e.tokens,t),a=i.some(e=>e.type===`color`),o=i.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)),s={[(0,n.join)(r,`blocks/ColorPalette.tsx`)]:S((0,n.join)(r,`blocks/ColorPalette.tsx`),h(i,t),`tsx`),[(0,n.join)(r,`blocks/Typeset.tsx`)]:S((0,n.join)(r,`blocks/Typeset.tsx`),g(i,t),`tsx`),[(0,n.join)(r,`blocks/TokenTable.tsx`)]:S((0,n.join)(r,`blocks/TokenTable.tsx`),_(i),`tsx`),[(0,n.join)(r,`blocks/index.ts`)]:S((0,n.join)(r,`blocks/index.ts`),x(),`typescript`),[(0,n.join)(r,`Tokens.mdx`)]:S((0,n.join)(r,`Tokens.mdx`),v({titlePrefix:t.titlePrefix,hasColors:a,hasTypography:o}),`mdx`)};return a&&(s[(0,n.join)(r,`Colors.mdx`)]=S((0,n.join)(r,`Colors.mdx`),y(t),`mdx`)),o&&(s[(0,n.join)(r,`Typography.mdx`)]=S((0,n.join)(r,`Typography.mdx`),b(t),`mdx`)),s[(0,n.join)(r,`tokens.json`)]=S((0,n.join)(r,`tokens.json`),`${JSON.stringify(i,null,2)}\n`,`json`),s}var w=(0,e.definePlugin)(e=>({name:`storybook`,generate:async t=>C(t,e??{})}));exports.default=w,exports.flattenTokens=f,Object.defineProperty(exports,"formatTokenValue",{enumerable:!0,get:function(){return t.formatTokenValue}}),exports.generateTokenDocs=C,exports.resolveTokenSets=d,Object.defineProperty(exports,"toCssVar",{enumerable:!0,get:function(){return t.toCssVar}});
187
+ `}function S(e){return`import { create } from "storybook/theming";
188
+
189
+ /**
190
+ * Storybook UI theme generated by \`@razorwind/storybook\`.
191
+ *
192
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
193
+ */
194
+ export default create({
195
+ ${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,t])=>` ${e}: ${i(t)}`).join(`,
196
+ `)}
197
+ });
198
+ `}function C(e,n,r){return(0,t.createDocument)(e,n,{name:`razorwind-storybook`},r)}function w(e,t={}){let r=t.outputPath??`storybook/tokens`,i=f(e.tokens,t),a=i.some(e=>e.type===`color`),o=i.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)),s={[(0,n.join)(r,`blocks/ColorPalette.tsx`)]:C((0,n.join)(r,`blocks/ColorPalette.tsx`),h(i,t),`tsx`),[(0,n.join)(r,`blocks/Typeset.tsx`)]:C((0,n.join)(r,`blocks/Typeset.tsx`),g(i,t),`tsx`),[(0,n.join)(r,`blocks/TokenTable.tsx`)]:C((0,n.join)(r,`blocks/TokenTable.tsx`),_(i),`tsx`),[(0,n.join)(r,`blocks/index.ts`)]:C((0,n.join)(r,`blocks/index.ts`),x(),`typescript`),[(0,n.join)(r,`Tokens.mdx`)]:C((0,n.join)(r,`Tokens.mdx`),v({titlePrefix:t.titlePrefix,hasColors:a,hasTypography:o}),`mdx`)};if(a&&(s[(0,n.join)(r,`Colors.mdx`)]=C((0,n.join)(r,`Colors.mdx`),y(t),`mdx`)),o&&(s[(0,n.join)(r,`Typography.mdx`)]=C((0,n.join)(r,`Typography.mdx`),b(t),`mdx`)),s[(0,n.join)(r,`tokens.json`)]=C((0,n.join)(r,`tokens.json`),`${JSON.stringify(i,null,2)}\n`,`json`),t.generateTheme){let i=t.generateTheme(e.tokens);if(typeof i==`object`&&i)for(let[e,t]of Object.entries(i))s[(0,n.join)(r,`theme-${e}.ts`)]=C((0,n.join)(r,`theme-${e}.ts`),S(t),`typescript`);else s[(0,n.join)(r,`theme.ts`)]=C((0,n.join)(r,`theme.ts`),S(i),`typescript`)}return s}var T=(0,e.definePlugin)(e=>({name:`storybook`,generate:async t=>w(t,e??{})}));exports.default=T,exports.flattenTokens=f,Object.defineProperty(exports,"formatTokenValue",{enumerable:!0,get:function(){return t.formatTokenValue}}),exports.generateTokenDocs=w,exports.renderThemeFile=S,exports.resolveTokenSets=d,Object.defineProperty(exports,"toCssVar",{enumerable:!0,get:function(){return t.toCssVar}});
package/dist/index.d.cts CHANGED
@@ -1,8 +1,73 @@
1
- import { TokenType } from "@power-plant/dtcg-schema";
2
- import { Schema, Tokens } from "@razorwind/core/schema";
1
+ import { TokenType, Tokens } from "@power-plant/dtcg-schema";
2
+ import { Schema, Tokens as Tokens$1 } from "@razorwind/core/schema";
3
3
  import { formatTokenValue, toCssVar } from "@razorwind/core/utils";
4
4
  import { GeneratorFunctionResult } from "@power-plant/core";
5
5
  //#region src/types.d.ts
6
+ /**
7
+ * A flattened design token ready for documentation rendering.
8
+ */
9
+ interface FlatToken {
10
+ /** Dot-separated token path (e.g. `color.primary`). */
11
+ path: string;
12
+ /** DTCG `$type`, when known. */
13
+ type?: TokenType | string;
14
+ /** Raw `$value` from the token document. */
15
+ value: unknown;
16
+ /** CSS-friendly string form of {@link value}. */
17
+ cssValue: string;
18
+ /** Stable CSS custom property name for this path. */
19
+ cssVar: string;
20
+ /** Optional DTCG `$description`. */
21
+ description?: string;
22
+ /** Theme / set id when tokens are a `Record<string, Tokens>`. */
23
+ theme?: string;
24
+ }
25
+ /**
26
+ * Storybook theme variables passed to `create()` from `storybook/theming`.
27
+ *
28
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
29
+ */
30
+ interface StorybookTheme {
31
+ /** Required baseline palette (`light` or `dark`). */
32
+ base: "light" | "dark";
33
+ colorPrimary?: string;
34
+ colorSecondary?: string;
35
+ appBg?: string;
36
+ appContentBg?: string;
37
+ appHoverBg?: string;
38
+ appPreviewBg?: string;
39
+ appBorderColor?: string;
40
+ appBorderRadius?: number;
41
+ fontBase?: string;
42
+ fontCode?: string;
43
+ textColor?: string;
44
+ textInverseColor?: string;
45
+ textMutedColor?: string;
46
+ barTextColor?: string;
47
+ barHoverColor?: string;
48
+ barSelectedColor?: string;
49
+ barBg?: string;
50
+ buttonBg?: string;
51
+ buttonBorder?: string;
52
+ booleanBg?: string;
53
+ booleanSelectedBg?: string;
54
+ inputBg?: string;
55
+ inputBorder?: string;
56
+ inputTextColor?: string;
57
+ inputBorderRadius?: number;
58
+ brandTitle?: string;
59
+ brandUrl?: string;
60
+ brandImage?: string;
61
+ brandTarget?: string;
62
+ gridCellSize?: number;
63
+ }
64
+ type StorybookThemeResult = StorybookTheme | Record<string, StorybookTheme>;
65
+ /**
66
+ * Map flattened design tokens to a Storybook theme object.
67
+ *
68
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
69
+ */
70
+ type GenerateStorybookTheme = (tokens: Tokens | Record<string, Tokens>) => StorybookThemeResult;
6
71
  /**
7
72
  * Options for the Razorwind Storybook token docs generator.
8
73
  */
@@ -42,31 +107,21 @@ interface StorybookPluginOptions {
42
107
  * @defaultValue `2`
43
108
  */
44
109
  colorGroupBy?: number;
45
- }
46
- /**
47
- * A flattened design token ready for documentation rendering.
48
- */
49
- interface FlatToken {
50
- /** Dot-separated token path (e.g. `color.primary`). */
51
- path: string;
52
- /** DTCG `$type`, when known. */
53
- type?: TokenType | string;
54
- /** Raw `$value` from the token document. */
55
- value: unknown;
56
- /** CSS-friendly string form of {@link value}. */
57
- cssValue: string;
58
- /** Stable CSS custom property name for this path. */
59
- cssVar: string;
60
- /** Optional DTCG `$description`. */
61
- description?: string;
62
- /** Theme / set id when tokens are a `Record<string, Tokens>`. */
63
- theme?: string;
110
+ /**
111
+ * Map extracted token values to a Storybook UI theme.
112
+ *
113
+ * When provided, the result is written to `{outputPath}/theme.ts` as a
114
+ * `create()` call from `storybook/theming`.
115
+ *
116
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
117
+ */
118
+ generateTheme?: GenerateStorybookTheme;
64
119
  }
65
120
  //#endregion
66
121
  //#region src/flatten.d.ts
67
122
  interface TokenSet {
68
123
  id: string;
69
- tokens: Tokens;
124
+ tokens: Tokens$1;
70
125
  }
71
126
  /**
72
127
  * Split `Schema.tokens` into one or more named token sets.
@@ -74,13 +129,19 @@ interface TokenSet {
74
129
  * A record whose keys all look like themes (`light`, `dark`, …) is treated as
75
130
  * multi-theme input; otherwise the whole document is a single set.
76
131
  */
77
- declare function resolveTokenSets(tokens: Tokens | Record<string, Tokens>): TokenSet[];
132
+ declare function resolveTokenSets(tokens: Tokens$1 | Record<string, Tokens$1>): TokenSet[];
78
133
  /**
79
134
  * Flatten DTCG token trees into documentation rows.
80
135
  */
81
- declare function flattenTokens(tokens: Tokens | Record<string, Tokens>, options?: Pick<StorybookPluginOptions, "cssVarPrefix" | "includeTypes">): FlatToken[];
136
+ declare function flattenTokens(tokens: Tokens$1 | Record<string, Tokens$1>, options?: Pick<StorybookPluginOptions, "cssVarPrefix" | "includeTypes">): FlatToken[];
82
137
  //#endregion
83
138
  //#region src/generate.d.ts
139
+ /**
140
+ * Serialize a Storybook theme object as a `storybook/theming` `create()` module.
141
+ *
142
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
143
+ */
144
+ declare function renderThemeFile(theme: StorybookTheme): string;
84
145
  /**
85
146
  * Generate Storybook MDX / React token doc blocks from a Razorwind schema.
86
147
  */
@@ -89,9 +150,10 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
89
150
  //#region src/index.d.ts
90
151
  /**
91
152
  * Razorwind plugin that turns design tokens into Storybook MDX doc blocks
92
- * (`ColorPalette`, `Typeset`, `TokenTable`).
153
+ * (`ColorPalette`, `Typeset`, `TokenTable`) and optional UI themes.
93
154
  *
94
155
  * @see https://storybook.js.org/docs/writing-docs/doc-blocks
156
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
95
157
  * @see https://github.com/unpunnyfuns/swatchbook/tree/main/packages/addon
96
158
  *
97
159
  * @example
@@ -100,11 +162,19 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
100
162
  * import storybook from "@razorwind/storybook";
101
163
  *
102
164
  * export default defineConfig({
103
- * plugins: [storybook]
165
+ * plugins: [
166
+ * storybook({
167
+ * generateTheme: tokens => ({
168
+ * base: "light",
169
+ * colorPrimary: tokens.find(t => t.path === "color.primary")?.cssValue,
170
+ * brandTitle: "My Design System"
171
+ * })
172
+ * })
173
+ * ]
104
174
  * });
105
175
  * ```
106
176
  */
107
177
  declare const _default: (options?: StorybookPluginOptions | undefined) => import("@razorwind/core/plugin").Plugin;
108
178
  //#endregion
109
- export { type FlatToken, type StorybookPluginOptions, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, resolveTokenSets, toCssVar };
179
+ export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, renderThemeFile, resolveTokenSets, toCssVar };
110
180
  //# sourceMappingURL=index.d.cts.map
package/dist/index.d.cts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.cts","names":[],"sources":["../src/types.ts","../src/flatten.ts","../src/generate.ts","../src/index.ts"],"mappings":";;;;;;;;UAuBiB;;;;;;EAMf;;;;;;EAOA;;;;;;EAOA;;;;;;EAOA;;;;;EAMA,eAAe;;;;;;EAOf;;;;;UAMe;;EAEf;;EAEA,OAAO;;EAEP;;EAEA;;EAEA;;EAEA;;EAEA;;;;UCyBe;EACf;EACA,QAAQ;;;;;;;;iBASM,iBACd,QAAQ,SAAS,eAAe,UAC/B;;;;iBAuBa,cACd,QAAQ,SAAS,eAAe,SAChC,UAAS,KAAK,2DACb;;;;;;iBCgPa,kBACd,MAAM,QACN,UAAS,yBACR,wBAAwB,QAAQ"}
1
+ {"version":3,"file":"index.d.cts","names":[],"sources":["../src/types.ts","../src/flatten.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,uBAAuB,iBAAiB,eAAe;;;;;;KAOvD,0BACV,QAAQ,SAAS,eAAe,YAC7B;;;;UAKY;;;;;;EAMf;;;;;;EAOA;;;;;;EAOA;;;;;;EAOA;;;;;EAMA,eAAe;;;;;;EAOf;;;;;;;;;EAUA,gBAAgB;;;;UCpCD;EACf;EACA,QAAQ;;;;;;;;iBASM,iBACd,QAAQ,WAAS,eAAe,YAC/B;;;;iBAuBa,cACd,QAAQ,WAAS,eAAe,WAChC,UAAS,KAAK,2DACb;;;;;;;;iBCyOa,gBAAgB,OAAO;;;;iBAmCvB,kBACd,MAAM,QACN,UAAS,yBACR,wBAAwB,QAAQ"}
package/dist/index.d.mts CHANGED
@@ -1,8 +1,73 @@
1
1
  import { formatTokenValue, toCssVar } from "@razorwind/core/utils";
2
- import { TokenType } from "@power-plant/dtcg-schema";
3
- import { Schema, Tokens } from "@razorwind/core/schema";
2
+ import { TokenType, Tokens } from "@power-plant/dtcg-schema";
3
+ import { Schema, Tokens as Tokens$1 } from "@razorwind/core/schema";
4
4
  import { GeneratorFunctionResult } from "@power-plant/core";
5
5
  //#region src/types.d.ts
6
+ /**
7
+ * A flattened design token ready for documentation rendering.
8
+ */
9
+ interface FlatToken {
10
+ /** Dot-separated token path (e.g. `color.primary`). */
11
+ path: string;
12
+ /** DTCG `$type`, when known. */
13
+ type?: TokenType | string;
14
+ /** Raw `$value` from the token document. */
15
+ value: unknown;
16
+ /** CSS-friendly string form of {@link value}. */
17
+ cssValue: string;
18
+ /** Stable CSS custom property name for this path. */
19
+ cssVar: string;
20
+ /** Optional DTCG `$description`. */
21
+ description?: string;
22
+ /** Theme / set id when tokens are a `Record<string, Tokens>`. */
23
+ theme?: string;
24
+ }
25
+ /**
26
+ * Storybook theme variables passed to `create()` from `storybook/theming`.
27
+ *
28
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
29
+ */
30
+ interface StorybookTheme {
31
+ /** Required baseline palette (`light` or `dark`). */
32
+ base: "light" | "dark";
33
+ colorPrimary?: string;
34
+ colorSecondary?: string;
35
+ appBg?: string;
36
+ appContentBg?: string;
37
+ appHoverBg?: string;
38
+ appPreviewBg?: string;
39
+ appBorderColor?: string;
40
+ appBorderRadius?: number;
41
+ fontBase?: string;
42
+ fontCode?: string;
43
+ textColor?: string;
44
+ textInverseColor?: string;
45
+ textMutedColor?: string;
46
+ barTextColor?: string;
47
+ barHoverColor?: string;
48
+ barSelectedColor?: string;
49
+ barBg?: string;
50
+ buttonBg?: string;
51
+ buttonBorder?: string;
52
+ booleanBg?: string;
53
+ booleanSelectedBg?: string;
54
+ inputBg?: string;
55
+ inputBorder?: string;
56
+ inputTextColor?: string;
57
+ inputBorderRadius?: number;
58
+ brandTitle?: string;
59
+ brandUrl?: string;
60
+ brandImage?: string;
61
+ brandTarget?: string;
62
+ gridCellSize?: number;
63
+ }
64
+ type StorybookThemeResult = StorybookTheme | Record<string, StorybookTheme>;
65
+ /**
66
+ * Map flattened design tokens to a Storybook theme object.
67
+ *
68
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
69
+ */
70
+ type GenerateStorybookTheme = (tokens: Tokens | Record<string, Tokens>) => StorybookThemeResult;
6
71
  /**
7
72
  * Options for the Razorwind Storybook token docs generator.
8
73
  */
@@ -42,31 +107,21 @@ interface StorybookPluginOptions {
42
107
  * @defaultValue `2`
43
108
  */
44
109
  colorGroupBy?: number;
45
- }
46
- /**
47
- * A flattened design token ready for documentation rendering.
48
- */
49
- interface FlatToken {
50
- /** Dot-separated token path (e.g. `color.primary`). */
51
- path: string;
52
- /** DTCG `$type`, when known. */
53
- type?: TokenType | string;
54
- /** Raw `$value` from the token document. */
55
- value: unknown;
56
- /** CSS-friendly string form of {@link value}. */
57
- cssValue: string;
58
- /** Stable CSS custom property name for this path. */
59
- cssVar: string;
60
- /** Optional DTCG `$description`. */
61
- description?: string;
62
- /** Theme / set id when tokens are a `Record<string, Tokens>`. */
63
- theme?: string;
110
+ /**
111
+ * Map extracted token values to a Storybook UI theme.
112
+ *
113
+ * When provided, the result is written to `{outputPath}/theme.ts` as a
114
+ * `create()` call from `storybook/theming`.
115
+ *
116
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
117
+ */
118
+ generateTheme?: GenerateStorybookTheme;
64
119
  }
65
120
  //#endregion
66
121
  //#region src/flatten.d.ts
67
122
  interface TokenSet {
68
123
  id: string;
69
- tokens: Tokens;
124
+ tokens: Tokens$1;
70
125
  }
71
126
  /**
72
127
  * Split `Schema.tokens` into one or more named token sets.
@@ -74,13 +129,19 @@ interface TokenSet {
74
129
  * A record whose keys all look like themes (`light`, `dark`, …) is treated as
75
130
  * multi-theme input; otherwise the whole document is a single set.
76
131
  */
77
- declare function resolveTokenSets(tokens: Tokens | Record<string, Tokens>): TokenSet[];
132
+ declare function resolveTokenSets(tokens: Tokens$1 | Record<string, Tokens$1>): TokenSet[];
78
133
  /**
79
134
  * Flatten DTCG token trees into documentation rows.
80
135
  */
81
- declare function flattenTokens(tokens: Tokens | Record<string, Tokens>, options?: Pick<StorybookPluginOptions, "cssVarPrefix" | "includeTypes">): FlatToken[];
136
+ declare function flattenTokens(tokens: Tokens$1 | Record<string, Tokens$1>, options?: Pick<StorybookPluginOptions, "cssVarPrefix" | "includeTypes">): FlatToken[];
82
137
  //#endregion
83
138
  //#region src/generate.d.ts
139
+ /**
140
+ * Serialize a Storybook theme object as a `storybook/theming` `create()` module.
141
+ *
142
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
143
+ */
144
+ declare function renderThemeFile(theme: StorybookTheme): string;
84
145
  /**
85
146
  * Generate Storybook MDX / React token doc blocks from a Razorwind schema.
86
147
  */
@@ -89,9 +150,10 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
89
150
  //#region src/index.d.ts
90
151
  /**
91
152
  * Razorwind plugin that turns design tokens into Storybook MDX doc blocks
92
- * (`ColorPalette`, `Typeset`, `TokenTable`).
153
+ * (`ColorPalette`, `Typeset`, `TokenTable`) and optional UI themes.
93
154
  *
94
155
  * @see https://storybook.js.org/docs/writing-docs/doc-blocks
156
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
95
157
  * @see https://github.com/unpunnyfuns/swatchbook/tree/main/packages/addon
96
158
  *
97
159
  * @example
@@ -100,11 +162,19 @@ declare function generateTokenDocs(spec: Schema, options?: StorybookPluginOption
100
162
  * import storybook from "@razorwind/storybook";
101
163
  *
102
164
  * export default defineConfig({
103
- * plugins: [storybook]
165
+ * plugins: [
166
+ * storybook({
167
+ * generateTheme: tokens => ({
168
+ * base: "light",
169
+ * colorPrimary: tokens.find(t => t.path === "color.primary")?.cssValue,
170
+ * brandTitle: "My Design System"
171
+ * })
172
+ * })
173
+ * ]
104
174
  * });
105
175
  * ```
106
176
  */
107
177
  declare const _default: (options?: StorybookPluginOptions | undefined) => import("@razorwind/core/plugin").Plugin;
108
178
  //#endregion
109
- export { type FlatToken, type StorybookPluginOptions, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, resolveTokenSets, toCssVar };
179
+ export { type FlatToken, type GenerateStorybookTheme, type StorybookPluginOptions, type StorybookTheme, _default as default, flattenTokens, formatTokenValue, generateTokenDocs, renderThemeFile, resolveTokenSets, toCssVar };
110
180
  //# sourceMappingURL=index.d.mts.map
package/dist/index.mjs CHANGED
@@ -184,5 +184,16 @@ import { TypesetBlock } from "./blocks/Typeset";
184
184
  export { TokenTableBlock } from "./TokenTable";
185
185
  export type { TokenTableBlockProps, TokenTableRow } from "./TokenTable";
186
186
  export { TypesetBlock } from "./Typeset";
187
- `}function T(e,n,r){return t(e,n,{name:`razorwind-storybook`},r)}function E(e,t={}){let n=t.outputPath??`storybook/tokens`,r=h(e.tokens,t),i=r.some(e=>e.type===`color`),o=r.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)),s={[a(n,`blocks/ColorPalette.tsx`)]:T(a(n,`blocks/ColorPalette.tsx`),v(r,t),`tsx`),[a(n,`blocks/Typeset.tsx`)]:T(a(n,`blocks/Typeset.tsx`),y(r,t),`tsx`),[a(n,`blocks/TokenTable.tsx`)]:T(a(n,`blocks/TokenTable.tsx`),b(r),`tsx`),[a(n,`blocks/index.ts`)]:T(a(n,`blocks/index.ts`),w(),`typescript`),[a(n,`Tokens.mdx`)]:T(a(n,`Tokens.mdx`),x({titlePrefix:t.titlePrefix,hasColors:i,hasTypography:o}),`mdx`)};return i&&(s[a(n,`Colors.mdx`)]=T(a(n,`Colors.mdx`),S(t),`mdx`)),o&&(s[a(n,`Typography.mdx`)]=T(a(n,`Typography.mdx`),C(t),`mdx`)),s[a(n,`tokens.json`)]=T(a(n,`tokens.json`),`${JSON.stringify(r,null,2)}\n`,`json`),s}var D=e(e=>({name:`storybook`,generate:async t=>E(t,e??{})}));export{D as default,h as flattenTokens,n as formatTokenValue,E as generateTokenDocs,m as resolveTokenSets,i as toCssVar};
187
+ `}function T(e){return`import { create } from "storybook/theming";
188
+
189
+ /**
190
+ * Storybook UI theme generated by \`@razorwind/storybook\`.
191
+ *
192
+ * @see https://storybook.js.org/docs/configure/user-interface/theming
193
+ */
194
+ export default create({
195
+ ${Object.entries(e).filter(([,e])=>e!==void 0).map(([e,t])=>` ${e}: ${s(t)}`).join(`,
196
+ `)}
197
+ });
198
+ `}function E(e,n,r){return t(e,n,{name:`razorwind-storybook`},r)}function D(e,t={}){let n=t.outputPath??`storybook/tokens`,r=h(e.tokens,t),i=r.some(e=>e.type===`color`),o=r.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)),s={[a(n,`blocks/ColorPalette.tsx`)]:E(a(n,`blocks/ColorPalette.tsx`),v(r,t),`tsx`),[a(n,`blocks/Typeset.tsx`)]:E(a(n,`blocks/Typeset.tsx`),y(r,t),`tsx`),[a(n,`blocks/TokenTable.tsx`)]:E(a(n,`blocks/TokenTable.tsx`),b(r),`tsx`),[a(n,`blocks/index.ts`)]:E(a(n,`blocks/index.ts`),w(),`typescript`),[a(n,`Tokens.mdx`)]:E(a(n,`Tokens.mdx`),x({titlePrefix:t.titlePrefix,hasColors:i,hasTypography:o}),`mdx`)};if(i&&(s[a(n,`Colors.mdx`)]=E(a(n,`Colors.mdx`),S(t),`mdx`)),o&&(s[a(n,`Typography.mdx`)]=E(a(n,`Typography.mdx`),C(t),`mdx`)),s[a(n,`tokens.json`)]=E(a(n,`tokens.json`),`${JSON.stringify(r,null,2)}\n`,`json`),t.generateTheme){let r=t.generateTheme(e.tokens);if(typeof r==`object`&&r)for(let[e,t]of Object.entries(r))s[a(n,`theme-${e}.ts`)]=E(a(n,`theme-${e}.ts`),T(t),`typescript`);else s[a(n,`theme.ts`)]=E(a(n,`theme.ts`),T(r),`typescript`)}return s}var O=e(e=>({name:`storybook`,generate:async t=>D(t,e??{})}));export{O as default,h as flattenTokens,n as formatTokenValue,D as generateTokenDocs,T as renderThemeFile,m as resolveTokenSets,i as toCssVar};
188
199
  //# sourceMappingURL=index.mjs.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@razorwind/storybook",
3
- "version": "0.0.19",
3
+ "version": "0.0.21",
4
4
  "type": "module",
5
5
  "description": "Razorwind plugin that creates Storybook MDX token doc blocks from Razorwind design tokens.",
6
6
  "repository": {
@@ -85,7 +85,7 @@
85
85
  "dependencies": {
86
86
  "@power-plant/core": "^0.0.67",
87
87
  "@power-plant/dtcg-schema": "^0.0.1",
88
- "@razorwind/core": "^0.0.23",
88
+ "@razorwind/core": "^0.0.24",
89
89
  "@stryke/type-checks": "^0.6.32"
90
90
  },
91
91
  "peerDependencies": {
@@ -104,5 +104,5 @@
104
104
  "typescript": "^6.0.3"
105
105
  },
106
106
  "publishConfig": { "access": "public" },
107
- "gitHead": "2c23fda28cfa954a894442bc9c08de10a2e5e799"
107
+ "gitHead": "5282fc6de7d131e6b97d8df3921c08f1676ac874"
108
108
  }