@baseline-ui/mcp 0.58.0 → 0.59.0

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
@@ -8,7 +8,606 @@
8
8
  * This notice may not be removed from this file.
9
9
  *
10
10
  */
11
- var o={Accordion:{id:"core-navigation-accordion",breadcrumb:"Core/Navigation/Accordion",importStatement:'import { Accordion, AccordionExample } from "@baseline-ui/core";',description:"`Accordion` is a component that allows users to toggle the visibility of content. It\u2019s composed of an `Accordion` component and an `AccordionItem` component. The `Accordion` component is a container for the `AccordionItem` components.",documentation:`\`Accordion\` is a component that allows users to toggle the visibility of content. It\u2019s composed of an \`Accordion\` component and an \`AccordionItem\` component. The \`Accordion\` component is a container for the \`AccordionItem\` components.
11
+ var o={BarChart:{id:"charts-barchart",breadcrumb:"Charts/BarChart",importStatement:`import { BarChart } from "@baseline-ui/charts";
12
+ import { Box } from "@baseline-ui/core";`,description:"The `BarChart` component renders a responsive bar chart for categorical data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.",documentation:`The \`BarChart\` component renders a responsive bar chart for categorical data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.
13
+
14
+ * Renders one or more bar series from a single dataset, keyed by \`xAxisDataKey\` and the per-bar \`dataKey\`.
15
+ * Themed axes, grid, tooltip, and legend styled with Baseline UI tokens \u2014 adapts to light, dark, and high-contrast themes.
16
+ * Default bar colors cycle through theme support colors (\`info\`, \`success\`, \`warning\`, \`error\`); each bar can override with a custom \`color\`.
17
+ * Toggleable tooltip, legend, grid, and axes for compact layouts.
18
+ * Grouped bars by default, with an opt-in \`stacked\` variant. The topmost bar in each stack keeps its rounded corners; inner segments stay flat.
19
+ * Responsive by default \u2014 fills the parent container width while preserving the configured \`height\`.
20
+ * Built-in keyboard navigation across data points via Recharts' accessibility layer.
21
+
22
+ \`\`\`jsx
23
+ import { BarChart } from "@baseline-ui/charts";
24
+
25
+ const data = [
26
+ { year: "2020", revenue: 14_000_000, expenses: 12_000_000 },
27
+ { year: "2021", revenue: 24_000_000, expenses: 6_000_000 },
28
+ { year: "2022", revenue: 26_000_000, expenses: 13_000_000 },
29
+ ];
30
+
31
+ <BarChart
32
+ data={data}
33
+ xAxisDataKey="year"
34
+ bars={[
35
+ { dataKey: "revenue", name: "Revenue" },
36
+ { dataKey: "expenses", name: "Expenses" },
37
+ ]}
38
+ />;
39
+ \`\`\`
40
+
41
+ The default variant renders bar series side-by-side within each X-axis category. Use \`showLegend\` to also render a legend above the chart.
42
+
43
+ \`\`\`jsx
44
+ <BarChart
45
+ data={data}
46
+ xAxisDataKey="year"
47
+ bars={[
48
+ { dataKey: "revenue", name: "Revenue" },
49
+ { dataKey: "expenses", name: "Expenses" },
50
+ ]}
51
+ showLegend
52
+ />
53
+ \`\`\`
54
+
55
+ Set \`variant="stacked"\` to stack bars on top of each other within each category. The topmost bar keeps its rounded top corners; inner segments are flat so the stack reads as a single continuous bar.
56
+
57
+ \`\`\`jsx
58
+ <BarChart
59
+ variant="stacked"
60
+ data={data}
61
+ xAxisDataKey="year"
62
+ bars={[
63
+ { dataKey: "revenue", name: "Revenue" },
64
+ { dataKey: "expenses", name: "Expenses" },
65
+ ]}
66
+ showLegend
67
+ />
68
+ \`\`\`
69
+
70
+ For mixed grouped/stacked layouts, set a custom \`stackId\` per bar \u2014 bars sharing the same \`stackId\` are stacked together; bars with different (or no) \`stackId\` are grouped beside the stack.
71
+
72
+ Pass a single entry in \`bars\` to render a single-series chart.
73
+
74
+ \`\`\`jsx
75
+ <BarChart
76
+ data={data}
77
+ xAxisDataKey="year"
78
+ bars={[{ dataKey: "revenue", name: "Revenue" }]}
79
+ />
80
+ \`\`\`
81
+
82
+ Default colors cycle through \`info\` \u2192 \`success\` \u2192 \`warning\` \u2192 \`error\` and wrap modulo four. Provide a \`color\` per bar to override the default.
83
+
84
+ \`\`\`jsx
85
+ <BarChart
86
+ data={data}
87
+ xAxisDataKey="year"
88
+ bars={[
89
+ { dataKey: "revenue", name: "Revenue" },
90
+ { dataKey: "expenses", name: "Expenses" },
91
+ { dataKey: "profit", name: "Profit" },
92
+ { dataKey: "tax", name: "Tax" },
93
+ { dataKey: "fees", name: "Fees" },
94
+ ]}
95
+ showLegend
96
+ />
97
+ \`\`\`
98
+
99
+ Override the default theme colors by passing \`color\` per bar.
100
+
101
+ \`\`\`jsx
102
+ <BarChart
103
+ data={data}
104
+ xAxisDataKey="year"
105
+ bars={[
106
+ { dataKey: "revenue", name: "Revenue", color: "#7c3aed" },
107
+ { dataKey: "expenses", name: "Expenses", color: "#f59e0b" },
108
+ ]}
109
+ showLegend
110
+ />
111
+ \`\`\`
112
+
113
+ \`barSize\` controls the bar width in pixels (default \`12\`). \`barRadius\` controls the rounded top-corner radius in pixels (default \`2\`).
114
+
115
+ \`\`\`jsx
116
+ <BarChart
117
+ data={data}
118
+ xAxisDataKey="year"
119
+ bars={[...]}
120
+ barSize={24}
121
+ />
122
+ \`\`\`
123
+
124
+ \`showTooltip\`, \`showGrid\`, \`showXAxis\`, and \`showYAxis\` toggle the corresponding chart chrome individually. They all default to \`true\`.
125
+
126
+ \`\`\`jsx
127
+ <BarChart
128
+ data={data}
129
+ xAxisDataKey="year"
130
+ bars={[...]}
131
+ showXAxis={false}
132
+ showYAxis={false}
133
+ showGrid={false}
134
+ />
135
+ \`\`\`
136
+
137
+ The chart surface is keyboard-focusable. When focused via keyboard, the surface shows a focus ring and arrow keys move an indicator across data points, opening the tooltip at each step.
138
+
139
+ | Key | Function |
140
+ | ------------- | --------------------------------------------------------------------------- |
141
+ | \`Tab\` | Moves focus to the chart surface. |
142
+ | \`Arrow Right\` | Advances the active data point one step to the right and shows the tooltip. |
143
+ | \`Arrow Left\` | Advances the active data point one step to the left and shows the tooltip. |
144
+ | \`Escape\` | Dismisses the tooltip and clears the active data point. |
145
+
146
+ BarChart shares its legend, tooltip, and surface markup with every other chart in the package. The \`BaselineUI-Chart-*\` selectors are stable shared hooks; the kind-specific \`BaselineUI-BarChart\` class lets you scope styles to bar charts only. Internal Recharts class names are not part of the public API.
147
+
148
+ | Selector | Description |
149
+ | ---------------------------------------------- | ------------------------------------------------------------------- |
150
+ | \`.BaselineUI-BarChart\` | The bar-chart root identifier. |
151
+ | \`.BaselineUI-BarChart[data-variant="default"]\` | Targets only the default variant. |
152
+ | \`.BaselineUI-BarChart[data-variant="stacked"]\` | Targets only the stacked variant. |
153
+ | \`.BaselineUI-Chart-Surface\` | The chart drawing area that wraps the SVG. |
154
+ | \`.BaselineUI-Chart-Legend\` | The legend list element. Only rendered when \`showLegend\` is \`true\`. |
155
+ | \`.BaselineUI-Chart-LegendItem\` | A single legend entry \u2014 one per series. |
156
+ | \`.BaselineUI-Chart-LegendSwatch\` | The colored swatch in a legend entry. |
157
+ | \`.BaselineUI-Chart-Tooltip\` | The hover/focus tooltip container. |
158
+ | \`.BaselineUI-Chart-TooltipItem\` | A single series entry in the tooltip. |
159
+ | \`.BaselineUI-Chart-TooltipSwatch\` | The colored swatch in a tooltip entry. |`,props:`interface BarChartProps {
160
+ /**
161
+ * Additional class name for the chart root.
162
+ */
163
+ className?: string
164
+ /**
165
+ * Additional inline styles for the chart root.
166
+ */
167
+ style?: CSSProperties
168
+ /**
169
+ * Chart width. @default "100%"
170
+ */
171
+ width?: number | \`\${number}%\`
172
+ /**
173
+ * Chart height. @default 300
174
+ */
175
+ height?: number
176
+ /**
177
+ * Whether to show the tooltip on hover. @default true
178
+ */
179
+ showTooltip?: boolean
180
+ /**
181
+ * Whether to show the legend.
182
+ */
183
+ showLegend?: boolean
184
+ /**
185
+ * Whether to show the grid lines. @default true
186
+ */
187
+ showGrid?: boolean
188
+ /**
189
+ * Whether to show the X axis. @default true
190
+ */
191
+ showXAxis?: boolean
192
+ /**
193
+ * Whether to show the Y axis. @default true
194
+ */
195
+ showYAxis?: boolean
196
+ /**
197
+ * The data array to render. Each item is an object keyed by \`xAxisDataKey\` and bar \`dataKey\` values.
198
+ */
199
+ data: unknown
200
+ /**
201
+ * Configuration for each bar series to render.
202
+ */
203
+ bars: unknown
204
+ /**
205
+ * The data key for the X axis.
206
+ */
207
+ xAxisDataKey: string
208
+ /**
209
+ * Visual variant. \`"stacked"\` stacks every series on top of each other; the
210
+ * default groups them side-by-side. Per-bar \`stackId\` overrides the variant
211
+ * default for that bar.
212
+ * @default "default"
213
+ */
214
+ variant?: "default" | "stacked"
215
+ /**
216
+ * Fixed width of each bar in pixels. @default 12
217
+ */
218
+ barSize?: number
219
+ /**
220
+ * Maximum gap in pixels between adjacent bars within the same X-axis
221
+ * category. Falls back toward a 1px floor when there isn't enough room
222
+ * to fit every bar at the requested gap.
223
+ * @default 4
224
+ */
225
+ barGap?: number
226
+ /**
227
+ * Border radius applied to the top of each bar in pixels. @default 2
228
+ */
229
+ barRadius?: number
230
+ }`,stories:{usage:[{id:"charts-barchart--basic",name:"Basic",snippet:`const Basic = () => <BarChart
231
+ data={yearlyData}
232
+ xAxisDataKey="year"
233
+ bars={[
234
+ { dataKey: "revenue", name: "Revenue" },
235
+ { dataKey: "expenses", name: "Expenses" },
236
+ ]}
237
+ height={320} />;`},{id:"charts-barchart--single-series",name:"Single Series",snippet:`const SingleSeries = () => <BarChart
238
+ data={yearlyData}
239
+ xAxisDataKey="year"
240
+ bars={[{ dataKey: "revenue", name: "Revenue" }]}
241
+ height={320} />;`},{id:"charts-barchart--with-legend",name:"With Legend",snippet:`const WithLegend = () => <BarChart
242
+ data={yearlyData}
243
+ xAxisDataKey="year"
244
+ bars={[
245
+ { dataKey: "revenue", name: "Revenue" },
246
+ { dataKey: "expenses", name: "Expenses" },
247
+ ]}
248
+ height={320}
249
+ showLegend />;`},{id:"charts-barchart--stacked",name:"Stacked",snippet:`const Stacked = () => <BarChart
250
+ data={yearlyData}
251
+ xAxisDataKey="year"
252
+ bars={[
253
+ { dataKey: "revenue", name: "Revenue" },
254
+ { dataKey: "expenses", name: "Expenses" },
255
+ ]}
256
+ height={320}
257
+ variant="stacked"
258
+ showLegend />;`},{id:"charts-barchart--stacked-with-three-series",name:"Stacked With Three Series",snippet:`const StackedWithThreeSeries = () => <BarChart
259
+ data={yearlyData.map((row) => ({
260
+ ...row,
261
+ profit: row.revenue - row.expenses,
262
+ }))}
263
+ xAxisDataKey="year"
264
+ bars={[
265
+ { dataKey: "revenue", name: "Revenue" },
266
+ { dataKey: "expenses", name: "Expenses" },
267
+ { dataKey: "profit", name: "Profit" },
268
+ ]}
269
+ height={320}
270
+ variant="stacked"
271
+ showLegend />;`},{id:"charts-barchart--custom-colors",name:"Custom Colors",snippet:`const CustomColors = () => <BarChart
272
+ data={yearlyData}
273
+ xAxisDataKey="year"
274
+ bars={[
275
+ { dataKey: "revenue", name: "Revenue", color: "#7c3aed" },
276
+ { dataKey: "expenses", name: "Expenses", color: "#f59e0b" },
277
+ ]}
278
+ height={320}
279
+ showLegend />;`},{id:"charts-barchart--many-series",name:"Many Series",snippet:`const ManySeries = () => <BarChart
280
+ data={yearlyData.map((row) => ({
281
+ ...row,
282
+ profit: row.revenue - row.expenses,
283
+ tax: Math.round(row.revenue * 0.18),
284
+ fees: Math.round(row.revenue * 0.05),
285
+ }))}
286
+ xAxisDataKey="year"
287
+ bars={[
288
+ { dataKey: "revenue", name: "Revenue" },
289
+ { dataKey: "expenses", name: "Expenses" },
290
+ { dataKey: "profit", name: "Profit" },
291
+ { dataKey: "tax", name: "Tax" },
292
+ { dataKey: "fees", name: "Fees" },
293
+ ]}
294
+ height={320}
295
+ showLegend />;`},{id:"charts-barchart--thicker-bars",name:"Thicker Bars",snippet:`const ThickerBars = () => <BarChart
296
+ data={yearlyData}
297
+ xAxisDataKey="year"
298
+ bars={[
299
+ { dataKey: "revenue", name: "Revenue" },
300
+ { dataKey: "expenses", name: "Expenses" },
301
+ ]}
302
+ height={320}
303
+ barSize={24} />;`},{id:"charts-barchart--mixed-stacking",name:"Mixed Stacking",snippet:`const MixedStacking = () => <BarChart
304
+ data={yearlyData.map((row) => ({
305
+ ...row,
306
+ other: Math.round(row.revenue * 0.15),
307
+ }))}
308
+ xAxisDataKey="year"
309
+ bars={[
310
+ { dataKey: "revenue", name: "Revenue", stackId: "income" },
311
+ { dataKey: "other", name: "Other income", stackId: "income" },
312
+ { dataKey: "expenses", name: "Expenses" },
313
+ ]}
314
+ height={320}
315
+ showLegend />;`},{id:"charts-barchart--hidden-axes",name:"Hidden Axes",snippet:`const HiddenAxes = () => <BarChart
316
+ data={yearlyData}
317
+ xAxisDataKey="year"
318
+ bars={[
319
+ { dataKey: "revenue", name: "Revenue" },
320
+ { dataKey: "expenses", name: "Expenses" },
321
+ ]}
322
+ height={320}
323
+ showXAxis={false}
324
+ showYAxis={false}
325
+ showGrid={false} />;`}],implementation:`import React from "react";
326
+
327
+ import { BarChart } from "../BarChart";
328
+
329
+ import type { BarChartProps } from "../BarChart.types";
330
+
331
+ const data = [
332
+ { year: "2020", revenue: 14_000_000 },
333
+ { year: "2021", revenue: 24_000_000 },
334
+ { year: "2022", revenue: 26_000_000 },
335
+ ];
336
+
337
+ const bars = [{ dataKey: "revenue", name: "Revenue" }];
338
+
339
+ /**
340
+ * Wraps BarChart in a sized parent so the default \`width: "100%"\` resolves
341
+ * to a measurable size for layout-dependent assertions.
342
+ */
343
+ export function SizedBarChart(
344
+ props: Partial<Pick<BarChartProps, "className" | "style">>,
345
+ ) {
346
+ return (
347
+ <div style={{ width: 480, height: 300 }}>
348
+ <BarChart data={data} bars={bars} xAxisDataKey="year" {...props} />
349
+ </div>
350
+ );
351
+ }`},similarTo:[],figmaUrl:null},LineChart:{id:"charts-linechart",breadcrumb:"Charts/LineChart",importStatement:`import { Box } from "@baseline-ui/core";
352
+ import { LineChart } from "@baseline-ui/charts";`,description:"The `LineChart` component renders a responsive line chart for time series or other ordered data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.",documentation:'The `LineChart` component renders a responsive line chart for time series or other ordered data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.\n\n* Renders one or more lines from a single dataset, keyed by `xAxisDataKey` and the per-line `dataKey`.\n* Themed axes, grid, tooltip, and legend styled with Baseline UI tokens \u2014 adapts to light, dark, and high-contrast themes.\n* Default line colors cycle through theme support colors (`info`, `success`, `warning`, `error`); each line can override with a custom `color`.\n* Toggleable tooltip, legend, grid, and axes for compact or sparkline-style charts.\n* Configurable curve interpolation (`monotone`, `linear`, etc.) and per-line stroke width.\n* Responsive by default \u2014 fills the parent container width while preserving the configured `height`.\n* Built-in keyboard navigation across data points via Recharts\' accessibility layer.\n\n```jsx\nimport { LineChart } from "@baseline-ui/charts";\n\nconst data = [\n { month: "Jan", revenue: 4000, expenses: 2400 },\n { month: "Feb", revenue: 3000, expenses: 1398 },\n { month: "Mar", revenue: 5000, expenses: 3200 },\n];\n\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue" },\n { dataKey: "expenses", name: "Expenses" },\n ]}\n/>;\n```\n\nThe default variant renders a full-width line chart with grid, axes, and tooltip enabled. Use `showLegend` to also render a legend above the chart.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue" },\n { dataKey: "expenses", name: "Expenses" },\n ]}\n showLegend\n/>\n```\n\nSet `variant="sparkline"` for a compact 40\xD720 inline trend indicator. Grid, axes, tooltip, and legend are hidden by default, the stroke is thinner, and chart margins are reduced to a 1px inset (just enough to prevent stroke clipping) so the line fills the box. Each chrome flag can still be re-enabled individually \u2014 for example, `showTooltip` re-enables the tooltip on a sparkline.\n\n```jsx\n<LineChart\n variant="sparkline"\n data={data}\n xAxisDataKey="month"\n lines={[{ dataKey: "revenue" }]}\n/>\n```\n\nPass a single entry in `lines` to render a single-series chart.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[{ dataKey: "revenue", name: "Revenue" }]}\n/>\n```\n\nDefault line colors cycle through `info` \u2192 `success` \u2192 `warning` \u2192 `error` and wrap modulo four. Provide a `color` per line to override the default.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue" },\n { dataKey: "expenses", name: "Expenses" },\n { dataKey: "profit", name: "Profit" },\n { dataKey: "tax", name: "Tax" },\n { dataKey: "fees", name: "Fees" },\n ]}\n showLegend\n/>\n```\n\nSet `dot` to `true` on a line to render a marker at each data point.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue", dot: true },\n { dataKey: "expenses", name: "Expenses", dot: true },\n ]}\n/>\n```\n\nThe `type` prop on each line controls the curve interpolation. The default is `monotone`; use `linear` for straight segments between points. Any [Recharts curve type](https://recharts.org/en-US/api/Line#type) is supported.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue", type: "linear" },\n { dataKey: "expenses", name: "Expenses", type: "linear" },\n ]}\n/>\n```\n\nOverride the default theme colors by passing `color` and `strokeWidth` per line.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[\n { dataKey: "revenue", name: "Revenue", color: "#7c3aed", strokeWidth: 3 },\n { dataKey: "expenses", name: "Expenses", color: "#f59e0b", strokeWidth: 3 },\n ]}\n showLegend\n/>\n```\n\n`showTooltip`, `showGrid`, `showXAxis`, and `showYAxis` toggle the corresponding chart chrome individually. They default to `true` for the default variant and `false` for the `sparkline` variant. Pass an explicit value to override the variant default.\n\n```jsx\n<LineChart\n data={data}\n xAxisDataKey="month"\n lines={[...]}\n showXAxis={false}\n showYAxis={false}\n showGrid={false}\n/>\n```\n\nThe chart surface is keyboard-focusable on the default variant. When focused via keyboard, the surface shows a focus ring and arrow keys move an indicator across data points, opening the tooltip at each step. The `sparkline` variant disables the accessibility layer and is not focusable.\n\n| Key | Function |\n| ------------- | --------------------------------------------------------------------------- |\n| `Tab` | Moves focus to the chart surface (default variant only). |\n| `Arrow Right` | Advances the active data point one step to the right and shows the tooltip. |\n| `Arrow Left` | Advances the active data point one step to the left and shows the tooltip. |\n| `Escape` | Dismisses the tooltip and clears the active data point. |\n\nThe `sparkline` variant disables the accessibility layer and is not keyboard-navigable.\n\nLineChart shares its legend, tooltip, and surface markup with every other chart in the package. The `BaselineUI-Chart-*` selectors are stable shared hooks; the kind-specific `BaselineUI-LineChart` class lets you scope styles to line charts only. Internal Recharts class names are not part of the public API.\n\n| Selector | Description |\n| ------------------------------------------------- | ------------------------------------------------------------------- |\n| `.BaselineUI-LineChart` | The line-chart root identifier. |\n| `.BaselineUI-LineChart[data-variant="default"]` | Targets only the default variant. |\n| `.BaselineUI-LineChart[data-variant="sparkline"]` | Targets only the sparkline variant. |\n| `.BaselineUI-Chart-Surface` | The chart drawing area that wraps the SVG. |\n| `.BaselineUI-Chart-Legend` | The legend list element. Only rendered when `showLegend` is `true`. |\n| `.BaselineUI-Chart-LegendItem` | A single legend entry \u2014 one per series. |\n| `.BaselineUI-Chart-LegendSwatch` | The colored swatch in a legend entry. |\n| `.BaselineUI-Chart-Tooltip` | The hover/focus tooltip container. |\n| `.BaselineUI-Chart-TooltipItem` | A single series entry in the tooltip. |\n| `.BaselineUI-Chart-TooltipSwatch` | The colored swatch in a tooltip entry. |',props:`interface LineChartProps {
353
+ /**
354
+ * Additional class name for the chart root.
355
+ */
356
+ className?: string
357
+ /**
358
+ * Additional inline styles for the chart root.
359
+ */
360
+ style?: CSSProperties
361
+ /**
362
+ * Chart width. @default "100%"
363
+ */
364
+ width?: number | \`\${number}%\`
365
+ /**
366
+ * Chart height. @default 300
367
+ */
368
+ height?: number
369
+ /**
370
+ * Whether to show the tooltip on hover. @default true
371
+ */
372
+ showTooltip?: boolean
373
+ /**
374
+ * Whether to show the legend.
375
+ */
376
+ showLegend?: boolean
377
+ /**
378
+ * Whether to show the grid lines. @default true
379
+ */
380
+ showGrid?: boolean
381
+ /**
382
+ * Whether to show the X axis. @default true
383
+ */
384
+ showXAxis?: boolean
385
+ /**
386
+ * Whether to show the Y axis. @default true
387
+ */
388
+ showYAxis?: boolean
389
+ /**
390
+ * The data array to render. Each item is an object keyed by \`xAxisDataKey\` and line \`dataKey\` values.
391
+ */
392
+ data: unknown
393
+ /**
394
+ * Configuration for each line to render.
395
+ */
396
+ lines: unknown
397
+ /**
398
+ * The data key for the X axis.
399
+ */
400
+ xAxisDataKey: string
401
+ /**
402
+ * Visual variant. \`"sparkline"\` renders a compact 40\xD720 line with no axes,
403
+ * grid, tooltip, or legend \u2014 suitable for inline trend indicators.
404
+ * @default "default"
405
+ */
406
+ variant?: "default" | "sparkline"
407
+ }`,stories:{usage:[{id:"charts-linechart--basic",name:"Basic",snippet:`const Basic = () => <LineChart
408
+ data={monthlyData}
409
+ xAxisDataKey="month"
410
+ lines={[
411
+ { dataKey: "revenue", name: "Revenue" },
412
+ { dataKey: "expenses", name: "Expenses" },
413
+ ]}
414
+ height={320} />;`},{id:"charts-linechart--single-line",name:"Single Line",snippet:`const SingleLine = () => <LineChart
415
+ data={monthlyData}
416
+ xAxisDataKey="month"
417
+ lines={[{ dataKey: "revenue", name: "Revenue" }]}
418
+ height={320} />;`},{id:"charts-linechart--with-legend",name:"With Legend",snippet:`const WithLegend = () => <LineChart
419
+ data={monthlyData}
420
+ xAxisDataKey="month"
421
+ lines={[
422
+ { dataKey: "revenue", name: "Revenue" },
423
+ { dataKey: "expenses", name: "Expenses" },
424
+ ]}
425
+ height={320}
426
+ showLegend />;`},{id:"charts-linechart--with-dots",name:"With Dots",snippet:`const WithDots = () => <LineChart
427
+ data={monthlyData}
428
+ xAxisDataKey="month"
429
+ lines={[
430
+ { dataKey: "revenue", name: "Revenue", dot: true },
431
+ { dataKey: "expenses", name: "Expenses", dot: true },
432
+ ]}
433
+ height={320} />;`},{id:"charts-linechart--linear-curve",name:"Linear Curve",snippet:`const LinearCurve = () => <LineChart
434
+ data={monthlyData}
435
+ xAxisDataKey="month"
436
+ lines={[
437
+ { dataKey: "revenue", name: "Revenue", type: "linear" },
438
+ { dataKey: "expenses", name: "Expenses", type: "linear" },
439
+ ]}
440
+ height={320} />;`},{id:"charts-linechart--custom-colors",name:"Custom Colors",snippet:`const CustomColors = () => <LineChart
441
+ data={monthlyData}
442
+ xAxisDataKey="month"
443
+ lines={[
444
+ { dataKey: "revenue", name: "Revenue", color: "#7c3aed", strokeWidth: 3 },
445
+ {
446
+ dataKey: "expenses",
447
+ name: "Expenses",
448
+ color: "#f59e0b",
449
+ strokeWidth: 3,
450
+ },
451
+ ]}
452
+ height={320}
453
+ showLegend />;`},{id:"charts-linechart--many-lines",name:"Many Lines",snippet:`const ManyLines = () => <LineChart
454
+ data={monthlyData.map((row) => ({
455
+ ...row,
456
+ profit: row.revenue - row.expenses,
457
+ tax: Math.round(row.revenue * 0.18),
458
+ fees: Math.round(row.revenue * 0.05),
459
+ }))}
460
+ xAxisDataKey="month"
461
+ lines={[
462
+ { dataKey: "revenue", name: "Revenue" },
463
+ { dataKey: "expenses", name: "Expenses" },
464
+ { dataKey: "profit", name: "Profit" },
465
+ { dataKey: "tax", name: "Tax" },
466
+ { dataKey: "fees", name: "Fees" },
467
+ ]}
468
+ height={320}
469
+ showLegend />;`},{id:"charts-linechart--hidden-axes",name:"Hidden Axes",snippet:`const HiddenAxes = () => <LineChart
470
+ data={monthlyData}
471
+ xAxisDataKey="month"
472
+ lines={[
473
+ { dataKey: "revenue", name: "Revenue" },
474
+ { dataKey: "expenses", name: "Expenses" },
475
+ ]}
476
+ height={320}
477
+ showXAxis={false}
478
+ showYAxis={false}
479
+ showGrid={false} />;`},{id:"charts-linechart--sparkline",name:"Sparkline",snippet:`const Sparkline = () => <LineChart
480
+ data={monthlyData}
481
+ xAxisDataKey="month"
482
+ lines={[{ dataKey: "revenue" }]}
483
+ height={64}
484
+ variant="sparkline"
485
+ width={320} />;`}],implementation:`import React from "react";
486
+
487
+ import { LineChart } from "../LineChart";
488
+
489
+ import type { LineChartProps } from "../LineChart.types";
490
+
491
+ const data = [
492
+ { month: "Jan", revenue: 4000 },
493
+ { month: "Feb", revenue: 3000 },
494
+ { month: "Mar", revenue: 5000 },
495
+ ];
496
+
497
+ const lines = [{ dataKey: "revenue", name: "Revenue" }];
498
+
499
+ /**
500
+ * Wraps LineChart in a sized parent so the default \`width: "100%"\` resolves
501
+ * to a measurable size for layout-dependent assertions.
502
+ */
503
+ export function SizedLineChart(
504
+ props: Partial<Pick<LineChartProps, "className" | "style">>,
505
+ ) {
506
+ return (
507
+ <div style={{ width: 480, height: 300 }}>
508
+ <LineChart data={data} lines={lines} xAxisDataKey="month" {...props} />
509
+ </div>
510
+ );
511
+ }`},similarTo:[],figmaUrl:null},PieChart:{id:"charts-piechart",breadcrumb:"Charts/PieChart",importStatement:`import { Box } from "@baseline-ui/core";
512
+ import { PieChart } from "@baseline-ui/charts";`,description:"The `PieChart` component renders a responsive pie chart for proportional data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.",documentation:'The `PieChart` component renders a responsive pie chart for proportional data. It is built on top of [Recharts](https://recharts.org/) and styled with Baseline UI design tokens so it picks up the active theme automatically.\n\n* Renders one wedge per slice, sized proportionally to its `value`.\n* Slices are sorted in descending value order \u2014 largest first, regardless of input order. Default colors are assigned by sorted index, so the largest slice always gets the first theme color.\n* Themed slices, tooltip, and legend styled with Baseline UI tokens \u2014 adapts to light, dark, and high-contrast themes.\n* Default slice colors cycle through theme support colors (`info`, `success`, `error`, `warning`); each slice can override with a custom `color`.\n* Inline percentage labels rendered inside each slice, with small slices (under 5%) automatically suppressed.\n* Hover or focus highlights a slice with an enlarged outline rendered behind it; the highlighted slice is brought to the front so its outline isn\'t clipped by neighbors.\n* Donut variant via the `innerRadius` prop.\n* Toggleable tooltip, legend, and labels.\n* Responsive by default \u2014 fills the parent container width while preserving the configured `height`.\n* Built-in keyboard navigation across slices via Recharts\' accessibility layer.\n\n```jsx\nimport { PieChart } from "@baseline-ui/charts";\n\nconst data = [\n { name: "Water", value: 46 },\n { name: "Earth", value: 26 },\n { name: "Wind", value: 18 },\n { name: "Fire", value: 10 },\n];\n\n<PieChart data={data} />;\n```\n\nPass `innerRadius` to render a donut chart instead of a solid pie.\n\n```jsx\n<PieChart data={data} innerRadius={50} />\n```\n\nOverride the default theme colors by passing `color` per slice.\n\n```jsx\n<PieChart\n data={[\n { name: "Water", value: 46, color: "#0ea5e9" },\n { name: "Earth", value: 26, color: "#65a30d" },\n { name: "Wind", value: 18, color: "#a855f7" },\n { name: "Fire", value: 10, color: "#f97316" },\n ]}\n/>\n```\n\nDefault colors cycle through `info` \u2192 `success` \u2192 `error` \u2192 `warning` and wrap modulo four. Provide a `color` per slice to override.\n\nLong names wrap within legend entries.\n\nSlices contributing less than 5% of the total automatically have their inline label suppressed; their value is still visible via the tooltip and legend.\n\nWhen a slice is hovered with a pointer, focused via keyboard, or activated via the accessibility layer, an enlarged copy of the slice is rendered behind the original \u2014 visible as a thin outline that follows the slice\'s outer arc. The active slice is also reordered to render on top of its neighbors so the outline isn\'t clipped.\n\nThe chart surface is keyboard-focusable (single tab stop \u2014 only the SVG surface, not the inner pie group). When focused, arrow keys move an active indicator across slices and open the tooltip at each step.\n\n```jsx\n<PieChart data={data} showTooltip={false} />\n```\n\n```jsx\n<PieChart data={data} showLabels={false} />\n```\n\n```jsx\n<PieChart data={data} showLegend={false} />\n```\n\n| Key | Function |\n| ------------- | ------------------------------------------------------------------ |\n| `Tab` | Moves focus to the chart surface. |\n| `Arrow Right` | Advances the active slice clockwise and shows the tooltip. |\n| `Arrow Left` | Advances the active slice counter-clockwise and shows the tooltip. |\n| `Escape` | Dismisses the tooltip and clears the active slice. |\n\nPieChart shares its legend, tooltip, and surface markup with every other chart in the package. The `BaselineUI-Chart-*` selectors are stable shared hooks; the kind-specific `BaselineUI-PieChart` class lets you scope styles to pie charts only. Internal Recharts class names are not part of the public API.\n\n| Selector | Description |\n| --------------------------------- | ------------------------------------------------------------------- |\n| `.BaselineUI-PieChart` | The pie-chart root identifier. |\n| `.BaselineUI-Chart-Surface` | The chart drawing area that wraps the SVG. |\n| `.BaselineUI-Chart-Legend` | The legend list element. Only rendered when `showLegend` is `true`. |\n| `.BaselineUI-Chart-LegendItem` | A single legend entry \u2014 one per slice. |\n| `.BaselineUI-Chart-LegendSwatch` | The colored swatch in a legend entry. |\n| `.BaselineUI-Chart-Tooltip` | The hover/focus tooltip container. |\n| `.BaselineUI-Chart-TooltipItem` | A single slice entry in the tooltip. |\n| `.BaselineUI-Chart-TooltipSwatch` | The colored swatch in a tooltip entry. |',props:`interface PieChartProps {
513
+ /**
514
+ * Additional class name for the chart root.
515
+ */
516
+ className?: string
517
+ /**
518
+ * Additional inline styles for the chart root.
519
+ */
520
+ style?: CSSProperties
521
+ /**
522
+ * Chart width. @default "100%"
523
+ */
524
+ width?: number | \`\${number}%\`
525
+ /**
526
+ * Chart height. @default 300
527
+ */
528
+ height?: number
529
+ /**
530
+ * Whether to show the tooltip on hover. @default true
531
+ */
532
+ showTooltip?: boolean
533
+ /**
534
+ * Whether to show the legend.
535
+ */
536
+ showLegend?: boolean
537
+ /**
538
+ * The slices to render. Each slice contributes a wedge proportional to \`value\`.
539
+ */
540
+ data: unknown
541
+ /**
542
+ * Inner radius in pixels. @default 0
543
+ */
544
+ innerRadius?: number
545
+ /**
546
+ * Outer radius in pixels. When omitted, the chart fits the smaller of its
547
+ * width and height.
548
+ */
549
+ outerRadius?: number
550
+ /**
551
+ * Whether to render percentage labels inside each slice. @default true
552
+ */
553
+ showLabels?: boolean
554
+ }`,stories:{usage:[{id:"charts-piechart--basic",name:"Basic",snippet:"const Basic = () => <PieChart data={elementsData} height={257} />;"},{id:"charts-piechart--no-labels",name:"No Labels",snippet:"const NoLabels = () => <PieChart data={elementsData} height={257} showLabels={false} />;"},{id:"charts-piechart--no-legend",name:"No Legend",snippet:"const NoLegend = () => <PieChart data={elementsData} height={257} showLegend={false} />;"},{id:"charts-piechart--custom-colors",name:"Custom Colors",snippet:`const CustomColors = () => <PieChart
555
+ data={[
556
+ { name: "Water", value: 46, color: "#0ea5e9" },
557
+ { name: "Earth", value: 26, color: "#65a30d" },
558
+ { name: "Wind", value: 18, color: "#a855f7" },
559
+ { name: "Fire", value: 10, color: "#f97316" },
560
+ ]}
561
+ height={257} />;`},{id:"charts-piechart--many-slices",name:"Many Slices",snippet:`const ManySlices = () => <PieChart
562
+ data={[
563
+ { name: "Water", value: 30 },
564
+ { name: "Earth", value: 22 },
565
+ { name: "Wind", value: 16 },
566
+ { name: "Fire", value: 12 },
567
+ { name: "Aether", value: 10 },
568
+ { name: "Void", value: 6 },
569
+ { name: "Light", value: 4 },
570
+ ]}
571
+ height={257} />;`},{id:"charts-piechart--donut",name:"Donut",snippet:"const Donut = () => <PieChart data={elementsData} height={257} innerRadius={50} />;"},{id:"charts-piechart--no-tooltip",name:"No Tooltip",snippet:"const NoTooltip = () => <PieChart data={elementsData} height={257} showTooltip={false} />;"},{id:"charts-piechart--long-legend-names",name:"Long Legend Names",snippet:`const LongLegendNames = () => <PieChart
572
+ data={[
573
+ { name: "Atmospheric water vapor", value: 46 },
574
+ { name: "Subterranean rock formations", value: 26 },
575
+ { name: "High-altitude jet streams", value: 18 },
576
+ { name: "Volcanic core temperatures", value: 10 },
577
+ ]}
578
+ height={257} />;`},{id:"charts-piechart--small-slices-below-five-percent",name:"Small Slices Below Five Percent",snippet:`const SmallSlicesBelowFivePercent = () => <PieChart
579
+ data={[
580
+ { name: "Major", value: 92 },
581
+ { name: "Minor", value: 4 },
582
+ { name: "Trace", value: 3 },
583
+ { name: "Edge", value: 1 },
584
+ ]}
585
+ height={257} />;`}],implementation:`import React from "react";
586
+
587
+ import { PieChart } from "../PieChart";
588
+
589
+ import type { PieChartProps } from "../PieChart.types";
590
+
591
+ const data = [
592
+ { name: "Water", value: 46 },
593
+ { name: "Earth", value: 26 },
594
+ { name: "Wind", value: 18 },
595
+ { name: "Fire", value: 10 },
596
+ ];
597
+
598
+ /**
599
+ * Wraps PieChart in a sized parent so the default \`width: "100%"\` resolves
600
+ * to a measurable size for layout-dependent assertions.
601
+ */
602
+ export function SizedPieChart(
603
+ props: Partial<Pick<PieChartProps, "className" | "style">>,
604
+ ) {
605
+ return (
606
+ <div style={{ width: 320, height: 280 }}>
607
+ <PieChart data={data} {...props} />
608
+ </div>
609
+ );
610
+ }`},similarTo:[],figmaUrl:null},Accordion:{id:"core-navigation-accordion",breadcrumb:"Core/Navigation/Accordion",importStatement:'import { Accordion, AccordionExample } from "@baseline-ui/core";',description:"`Accordion` is a component that allows users to toggle the visibility of content. It\u2019s composed of an `Accordion` component and an `AccordionItem` component. The `Accordion` component is a container for the `AccordionItem` components.",documentation:`\`Accordion\` is a component that allows users to toggle the visibility of content. It\u2019s composed of an \`Accordion\` component and an \`AccordionItem\` component. The \`Accordion\` component is a container for the \`AccordionItem\` components.
12
611
 
13
612
  * Full keyboard navigation
14
613
  * It can expand one or multiple items
@@ -30544,7 +31143,7 @@ padding={[null, "lg", "xl"]}
30544
31143
 
30545
31144
  * [vanilla-extract sprinkles documentation](https://vanilla-extract.style/documentation/packages/sprinkles/) - Learn about the underlying sprinkles framework
30546
31145
  * [Box component documentation](/docs/core-utilities-box--docs) - Detailed information about the Box component
30547
- * [Theme documentation](/docs/theming--docs) - Learn about Baseline UI's theming system`};var c={"8":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","ChevronRightFilledIcon","ChevronRightIcon","EllipseIcon","MinusIcon","PlusIcon","XIcon"],"12":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","EditIcon","EllipseIcon","EnterKeyIcon","LockFilledIcon","LockIcon","MinusIcon","MoreVIcon","MoreIcon","PlaceholderIcon","PlusIcon","SearchIcon","SizeIcon","TrashIcon","XIcon","ZoomIcon"],"16":["AlignBottomIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDiagonalTopLeftBottomRightIcon","ArrowDownCircleFilledIcon","ArrowDownIcon","ArrowIcon","ArrowLeftRightIcon","ArrowRightIcon","ArrowUpArrowDownIcon","ArrowUpIcon","AtIcon","AttachmentsIcon","AvatarIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BulletListIcon","CalendarIcon","CaretLeftIcon","CaretRightIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","CircleFilledIcon","ClockIcon","CopyIcon","CustomizeIcon","DocumentEditIcon","DownloadIcon","DuplicateIcon","EditIcon","ElipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FilterAltIcon","FolderIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FullScreenIcon","HelpCircleIcon","HelpIcon","HereIcon","HideIcon","HighlightTextAltIcon","HighlightTextIcon","HorizontalScrollIcon","ImageIcon","InfoCircleFilledIcon","InsertIcon","ItalicIcon","LightBulbIcon","LineIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MeasureIcon","MinusIcon","MoreIcon","MoreVerticalIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","NumberedListIcon","OpenIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageVerticalScrollIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PlaceholderIcon","PlayIcon","PlusIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","ReadOnlyIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedoIcon","RemoveFormattingIcon","ReorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RulerIcon","SearchIcon","SettingsIcon","ShowIcon","SlashCommandsIcon","SoundRecordIcon","StampIcon","StarFilledIcon","StarIcon","StrikeoutTextAltIcon","TableCellIcon","TableColumnIcon","TableHeaderIcon","TableIcon","TableRowIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextDecreaseIndentIcon","TextIcon","TextIncreaseIndentIcon","TextMarkIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UndoIcon","UnlockIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WindowedIcon","WorkflowIcon","XCircleFilledIcon","XIcon"],"20":["AddPageIcon","AnonymousIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpCircleFilledIcon","AtIcon","AvatarFilledIcon","BoldIcon","CalloutIcon","CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ClockIcon","CollapseIcon","CommentIcon","CopyIcon","CutIcon","DistanceIcon","DownloadIcon","DuplicateIcon","EditIcon","EllipseIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorAlternativeCircleIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FormDateIcon","FormSignatureIcon","FormTextFieldIcon","HelpCircleIcon","HighlightTextIcon","HomeIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","ItalicIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MinusIcon","MoreIcon","MoreVerticalIcon","MoveIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OpenIcon","PageMoveLeftIcon","PageMoveRightIcon","PagesInsertIcon","PasteIcon","PipetteIcon","PlusIcon","PrintIcon","RotateClockwiseIcon","SearchIcon","SettingsIcon","ShapeIcon","ShareIcon","SoundIcon","SoundRecordIcon","StarFilledIcon","StarIcon","StyleIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UploadIcon","WarningFilledIcon","WarningIcon","XCircleFilledIcon","XCircleIcon","XIcon"],"24":["AddNoteCloudIcon","AddNoteIcon","AddTextSerifIcon","AiIcon","AirplaneIcon","AlignBottomIcon","AlignHorizontalCenterIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDownIcon","ArrowIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpIcon","AtIcon","AttachmentIcon","AvatarFilledIcon","AvatarIcon","BlendModeIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BorderColorIcon","BottomBorderIcon","BulletListIcon","CalibrateIcon","CaptureAddIcon","CaretDownIcon","CaretIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ChevronListIcon","ClockIcon","CloudyBorderIcon","CollapseIcon","ColorPaletteIcon","ColorSwatchIcon","CommentIcon","CommentInSidebarIcon","CommentOnPageIcon","CompareDocumentsIcon","CopyIcon","CopyPageIcon","CropIcon","CustomizeIcon","CutIcon","DateModifiedIcon","DatePlusIcon","DebugIcon","DocumentArrowDownCircleIcon","DocumentArrowDownIcon","DocumentArrowRightIcon","DocumentFilledIcon","DocumentLockIcon","DocumentPdfIcon","DownloadIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","DuplicateIcon","EditAnnotationsIcon","EditContentIcon","EditDocumentIcon","EditIcon","EditThumbnailsIcon","EllipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","EndCapArrowFilledIcon","EndCapArrowIcon","EndCapChevronFilledIcon","EndCapChevronIcon","EndCapCircleIcon","EndCapDiamondIcon","EndCapNoneIcon","EndCapSlantedIcon","EndCapSquareIcon","EndCapStraightIcon","EraserIcon","ErrorAltCircleFilledIcon","ErrorAltIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","ExpandVerticalIcon","FillColorIcon","FilterIcon","FitToHeightIcon","FivePagesHorizontalFilledIcon","FivePagesVerticalFilledIcon","FolderAddIcon","FolderIcon","FontListIcon","FontSizeIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormPageIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FormTwoRadioButtonsIcon","FourPagesGridFilledIcon","FourPagesHorizontalFilledIcon","FourPagesStackedFilledIcon","FourPagesVerticalFilledIcon","GroupIcon","HamburgerMenuIcon","HandIcon","HeartIcon","HideIcon","HideRevealIcon","HighlightTextIcon","HomeIcon","HorizontalScollIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","InitialsIcon","InnerHorizontalBorderIcon","InnerVerticalBorderIcon","InsertIcon","ItalicIcon","LayerBottomIcon","LayerDownIcon","LayerTopIcon","LayerUpIcon","LayersIcon","LeftBindingIcon","LeftBorderIcon","LineCapsIcon","LineIcon","LineSpacingIcon","LineStyleCloudyIcon","LineStyleDashedDoubleDashIcon","LineStyleDashedDoubleGapIcon","LineStyleDashedQuadrupleDashIcon","LineStyleDashedSingleGapIcon","LineStyleIcon","LineStyleSolidIcon","LineWidthIcon","LinkIcon","LockFilledIcon","LockIcon","MagicIcon","MagicPenIcon","MailIcon","MarkupIcon","MarqueeZoomIcon","MeasureIcon","MergeIcon","MessageCloudIcon","MinusIcon","MoonIcon","MoreCircleIcon","MoreIcon","MoreVerticalIcon","MoveAllDirectionsIcon","MoveLeftIcon","MoveLeftRightIcon","MoveRightIcon","MultiplePagesIcon","NonEditableIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OcrIcon","OpacityIcon","PageAddIcon","PageCurlIcon","PageDuplicateIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLandscapeIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageMoveLeftIcon","PageMoveRightIcon","PageNumberCircleIcon","PageNumberIcon","PagePortraitIcon","PageRemoveIcon","PageVerticalScrollIcon","PagesInsertAltIcon","PagesInsertIcon","PagesNewFromSelectionAltIcon","PagesNewFromSelectionIcon","PagesSelectAllIcon","PagesSelectNoneIcon","PasteBoardIcon","PastePageIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PinDropFilledIcon","PinDropIcon","PipetteIcon","PlayIcon","PlusCircleFilledIcon","PlusCircleIcon","PlusIcon","PointerIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","PrecisionIcon","PrintIcon","PrivateModeIcon","PushPinIcon","QuestionmarkCircleIcon","ReaderViewIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedactIcon","RedactRectangleIcon","RedactTextHighlighterIcon","RedactionTextRepeatingIcon","RedactionTextSingleIcon","RedoAllIcon","RedoIcon","RegexIcon","ReplaceIcon","RightBindingIcon","RightBorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RotateObjectClockwiseIcon","RotateObjectCounterClockwiseIcon","RulerIcon","ScaleIcon","SearchCircleIcon","SearchIcon","SearchSelectionIcon","SelectAllIcon","SelectionToolIcon","SettingsIcon","ShapesIcon","ShareAltIcon","ShareIcon","ShieldAddIcon","ShieldCheckmarkIcon","ShieldWarningIcon","ShieldXIcon","ShowIcon","SidebarIcon","SignOutIcon","SignatureDigitalIcon","SignatureIcon","SinglePageFilledIcon","SoundIcon","SquigglyTextIcon","StampAddIcon","StampIcon","StarFilledIcon","StarIcon","StartCapArrowFilledIcon","StartCapArrowIcon","StartCapChevronFilledIcon","StartCapChevronIcon","StartCapCircleIcon","StartCapDiamondIcon","StartCapNoneIcon","StartCapSlantedIcon","StartCapSquareIcon","StartCapStraightIcon","StrikeoutTextIcon","StyleFilledIcon","StyleIcon","StylusFilledIcon","StylusIcon","SunIcon","TableCellIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextColorIcon","TextIcon","TextPropertiesHideIcon","TextPropertiesShowIcon","TextSerifIcon","TextSmallerIcon","ThreePagesHorizontalFilledIcon","ThreePagesStackedFilledIcon","ThreePagesVerticalFilledIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TopBorderIcon","TrashIcon","TwoPagesHorizontalFilledIcon","TwoPagesVerticalFilledIcon","TypeTextIcon","UnderlineIcon","UnderlineTextIcon","UndoAllIcon","UndoIcon","UndoRedoIcon","UngroupIcon","UnlockIcon","UploadIcon","UserIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WidgetIcon","WorkflowIcon","XCircleFilledIcon","XCircleIcon","XIcon","ZoomInIcon","ZoomOutIcon"],"36":["ArrowRight","Check","Circle","Cross","Help","Inset","Key","NewParagraphAlt","NewParagraph","Note","PointerRight","SpeechBubble","Star"]};var p={version:"0.58.0"};var u=`
31146
+ * [Theme documentation](/docs/theming--docs) - Learn about Baseline UI's theming system`};var c={"8":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","ChevronRightFilledIcon","ChevronRightIcon","EllipseIcon","MinusIcon","PlusIcon","XIcon"],"12":["CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","EditIcon","EllipseIcon","EnterKeyIcon","LockFilledIcon","LockIcon","MinusIcon","MoreVIcon","MoreIcon","PlaceholderIcon","PlusIcon","SearchIcon","SizeIcon","TrashIcon","XIcon","ZoomIcon"],"16":["AlignBottomIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDiagonalTopLeftBottomRightIcon","ArrowDownCircleFilledIcon","ArrowDownIcon","ArrowIcon","ArrowLeftRightIcon","ArrowRightIcon","ArrowUpArrowDownIcon","ArrowUpIcon","AtIcon","AttachmentsIcon","AvatarIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BulletListIcon","CalendarIcon","CaretLeftIcon","CaretRightIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","CircleFilledIcon","ClockIcon","CopyIcon","CustomizeIcon","DocumentEditIcon","DownloadIcon","DuplicateIcon","EditIcon","ElipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FilterAltIcon","FolderIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FullScreenIcon","HelpCircleIcon","HelpIcon","HereIcon","HideIcon","HighlightTextAltIcon","HighlightTextIcon","HorizontalScrollIcon","ImageIcon","InfoCircleFilledIcon","InsertIcon","ItalicIcon","LightBulbIcon","LineIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MeasureIcon","MinusIcon","MoreIcon","MoreVerticalIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","NumberedListIcon","OpenIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageVerticalScrollIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PlaceholderIcon","PlayIcon","PlusIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","ReadOnlyIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedoIcon","RemoveFormattingIcon","ReorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RulerIcon","SearchIcon","SettingsIcon","ShowIcon","SlashCommandsIcon","SoundRecordIcon","StampIcon","StarFilledIcon","StarIcon","StrikeoutTextAltIcon","TableCellIcon","TableColumnIcon","TableHeaderIcon","TableIcon","TableRowIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextDecreaseIndentIcon","TextIcon","TextIncreaseIndentIcon","TextMarkIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UndoIcon","UnlockIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WindowedIcon","WorkflowIcon","XCircleFilledIcon","XIcon"],"20":["AddPageIcon","AnonymousIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpCircleFilledIcon","AtIcon","AvatarFilledIcon","BoldIcon","CalloutIcon","CaretDownIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ClockIcon","CollapseIcon","CommentIcon","CopyIcon","CutIcon","DistanceIcon","DownloadIcon","DuplicateIcon","EditIcon","EllipseIcon","EmojiSmileIcon","ErrorAltCircleFilledIcon","ErrorAlternativeCircleIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","FormDateIcon","FormSignatureIcon","FormTextFieldIcon","HelpCircleIcon","HighlightTextIcon","HomeIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","ItalicIcon","LinkIcon","ListIcon","LockIcon","MagicIcon","MinusIcon","MoreIcon","MoreVerticalIcon","MoveIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCrossIcon","NoteHelpIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OpenIcon","PageMoveLeftIcon","PageMoveRightIcon","PagesInsertIcon","PasteIcon","PipetteIcon","PlusIcon","PrintIcon","RotateClockwiseIcon","SearchIcon","SettingsIcon","ShapeIcon","ShareIcon","SoundIcon","SoundRecordIcon","StarFilledIcon","StarIcon","StyleIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TrashIcon","TypeTextIcon","UnderlineIcon","UploadIcon","WarningFilledIcon","WarningIcon","XCircleFilledIcon","XCircleIcon","XIcon"],"24":["AddNoteCloudIcon","AddNoteIcon","AddTextSerifIcon","AiIcon","AirplaneIcon","AlignBottomIcon","AlignHorizontalCenterIcon","AlignMiddleIcon","AlignTopIcon","AnonymousIcon","ArrowDownIcon","ArrowIcon","ArrowLeftIcon","ArrowRightIcon","ArrowUpIcon","AtIcon","AttachmentIcon","AvatarFilledIcon","AvatarIcon","BlendModeIcon","BoldIcon","BookmarkFilledIcon","BookmarkIcon","BorderColorIcon","BottomBorderIcon","BulletListIcon","CalibrateIcon","CaptureAddIcon","CaretDownIcon","CaretIcon","CaretLeftIcon","CaretRightIcon","CaretUpIcon","CheckmarkCircleFilledIcon","CheckmarkCircleIcon","CheckmarkIcon","ChevronListIcon","ClockIcon","CloudyBorderIcon","CollapseIcon","ColorPaletteIcon","ColorSwatchIcon","CommentIcon","CommentInSidebarIcon","CommentOnPageIcon","CompareDocumentsIcon","CopyIcon","CopyPageIcon","CropIcon","CustomizeIcon","CutIcon","DateModifiedIcon","DatePlusIcon","DebugIcon","DocumentArrowDownCircleIcon","DocumentArrowDownIcon","DocumentArrowRightIcon","DocumentFilledIcon","DocumentLockIcon","DocumentPdfIcon","DownloadIcon","DragIndicatorIcon","DragIndicatorVerticalIcon","DuplicateIcon","EditAnnotationsIcon","EditContentIcon","EditDocumentIcon","EditIcon","EditThumbnailsIcon","EllipseAreaIcon","EllipseCloudyIcon","EllipseDashedIcon","EllipseIcon","EmbedIcon","EmojiSmileIcon","EndCapArrowFilledIcon","EndCapArrowIcon","EndCapChevronFilledIcon","EndCapChevronIcon","EndCapCircleIcon","EndCapDiamondIcon","EndCapNoneIcon","EndCapSlantedIcon","EndCapSquareIcon","EndCapStraightIcon","EraserIcon","ErrorAltCircleFilledIcon","ErrorAltIcon","ErrorCircleFilledIcon","ErrorCircleIcon","ExpandIcon","ExpandVerticalIcon","FillColorIcon","FilterIcon","FitToHeightIcon","FivePagesHorizontalFilledIcon","FivePagesVerticalFilledIcon","FolderAddIcon","FolderIcon","FontListIcon","FontSizeIcon","FormButtonIcon","FormChoiceIcon","FormComboboxIcon","FormDateIcon","FormListboxIcon","FormPageIcon","FormRadioButtonIcon","FormSignatureIcon","FormTextFieldIcon","FormTwoRadioButtonsIcon","FourPagesGridFilledIcon","FourPagesHorizontalFilledIcon","FourPagesStackedFilledIcon","FourPagesVerticalFilledIcon","GroupIcon","HamburgerMenuIcon","HandIcon","HeartIcon","HideIcon","HideRevealIcon","HighlightTextIcon","HomeIcon","HorizontalScollIcon","ImageIcon","InfoCircleFilledIcon","InfoCircleIcon","InitialsIcon","InnerHorizontalBorderIcon","InnerVerticalBorderIcon","InsertIcon","ItalicIcon","LayerBottomIcon","LayerDownIcon","LayerTopIcon","LayerUpIcon","LayersIcon","LeftBindingIcon","LeftBorderIcon","LineCapsIcon","LineIcon","LineSpacingIcon","LineStyleCloudyIcon","LineStyleDashedDoubleDashIcon","LineStyleDashedDoubleGapIcon","LineStyleDashedQuadrupleDashIcon","LineStyleDashedSingleGapIcon","LineStyleIcon","LineStyleSolidIcon","LineWidthIcon","LinkIcon","LockFilledIcon","LockIcon","MagicIcon","MagicPenIcon","MailIcon","MarkupIcon","MarqueeZoomIcon","MeasureIcon","MergeIcon","MessageCloudIcon","MinusIcon","MoonIcon","MoreCircleIcon","MoreIcon","MoreVerticalIcon","MoveAllDirectionsIcon","MoveLeftIcon","MoveLeftRightIcon","MoveRightIcon","MultiplePagesIcon","NonEditableIcon","NoteArrowRightIcon","NoteCheckIcon","NoteCircleIcon","NoteCloudIcon","NoteCrossIcon","NoteHelpIcon","NoteIcon","NoteInsetIcon","NoteKeyIcon","NoteNewParagraphAltIcon","NoteNewParagraphIcon","NoteNoteIcon","NotePointerRightIcon","NoteSpeechBubbleIcon","NoteStarIcon","OcrIcon","OpacityIcon","PageAddIcon","PageCurlIcon","PageDuplicateIcon","PageFittingFillIcon","PageFittingFitIcon","PageHorizontalScrollIcon","PageLandscapeIcon","PageLayoutDoubleIcon","PageLayoutSingleIcon","PageMoveLeftIcon","PageMoveRightIcon","PageNumberCircleIcon","PageNumberIcon","PagePortraitIcon","PageRemoveIcon","PageVerticalScrollIcon","PagesInsertAltIcon","PagesInsertIcon","PagesNewFromSelectionAltIcon","PagesNewFromSelectionIcon","PagesSelectAllIcon","PagesSelectNoneIcon","PasteBoardIcon","PastePageIcon","PauseIcon","PenHighlighterIcon","PenIcon","PerimeterIcon","PinDropFilledIcon","PinDropIcon","PipetteIcon","PlayIcon","PlusCircleFilledIcon","PlusCircleIcon","PlusIcon","PointerIcon","PolygonAreaIcon","PolygonCloudyIcon","PolygonDashedIcon","PolygonIcon","PolylineIcon","PrecisionIcon","PrintIcon","PrivateModeIcon","PushPinIcon","QuestionmarkCircleIcon","ReaderViewIcon","RectangleAreaIcon","RectangleCloudyIcon","RectangleDashedIcon","RectangleIcon","RedactIcon","RedactRectangleIcon","RedactTextHighlighterIcon","RedactionTextRepeatingIcon","RedactionTextSingleIcon","RedoAllIcon","RedoIcon","RegexIcon","ReplaceIcon","RightBindingIcon","RightBorderIcon","RotateClockwiseIcon","RotateCounterClockwiseIcon","RotateObjectClockwiseIcon","RotateObjectCounterClockwiseIcon","RulerIcon","ScaleIcon","SearchCircleIcon","SearchIcon","SearchSelectionIcon","SelectAllIcon","SelectionToolIcon","SettingsIcon","ShapesIcon","ShareAltIcon","ShareIcon","ShieldAddIcon","ShieldCheckmarkIcon","ShieldWarningIcon","ShieldXIcon","ShowIcon","SidebarIcon","SignOutIcon","SignatureDigitalIcon","SignatureIcon","SinglePageFilledIcon","SoundIcon","SquigglyTextIcon","StampAddIcon","StampIcon","StarFilledIcon","StarIcon","StartCapArrowFilledIcon","StartCapArrowIcon","StartCapChevronFilledIcon","StartCapChevronIcon","StartCapCircleIcon","StartCapDiamondIcon","StartCapNoneIcon","StartCapSlantedIcon","StartCapSquareIcon","StartCapStraightIcon","StrikeoutTextIcon","StyleFilledIcon","StyleIcon","StylusFilledIcon","StylusIcon","SunIcon","TableCellIcon","TextAlignCenterIcon","TextAlignJustifyIcon","TextAlignLeftIcon","TextAlignRightIcon","TextCalloutIcon","TextColorIcon","TextIcon","TextPropertiesHideIcon","TextPropertiesShowIcon","TextSerifIcon","TextSmallerIcon","ThreePagesHorizontalFilledIcon","ThreePagesStackedFilledIcon","ThreePagesVerticalFilledIcon","ThumbnailsIcon","ThumbsDownIcon","ThumbsUpIcon","TopBorderIcon","TrashIcon","TwoPagesHorizontalFilledIcon","TwoPagesVerticalFilledIcon","TypeTextIcon","UnderlineIcon","UnderlineTextIcon","UndoAllIcon","UndoIcon","UndoRedoIcon","UngroupIcon","UnlockIcon","UploadIcon","UserIcon","VerticalScrollIcon","VideoIcon","WarningFilledIcon","WarningIcon","WidgetIcon","WorkflowIcon","XCircleFilledIcon","XCircleIcon","XIcon","ZoomInIcon","ZoomOutIcon"],"36":["ArrowRight","Check","Circle","Cross","Help","Inset","Key","NewParagraphAlt","NewParagraph","Note","PointerRight","SpeechBubble","Star"]};var p={version:"0.59.0"};var u=`
30548
31147
  # Baseline UI MCP Server Guidelines
30549
31148
 
30550
31149
  This MCP server provides AI assistants with structured access to Baseline UI's comprehensive component documentation, icon library, theming resources, and design guidelines.
@@ -30651,7 +31250,7 @@ import { ComponentName } from "@baseline-ui/core";
30651
31250
  Generate a live demo URL for a Baseline UI story. Use story IDs from the component info tool to view interactive examples. The response will be a string containing the URL. You can use this URL to understand the structure of the component and how to customize it.
30652
31251
  `,b=`
30653
31252
  Get the Figma URL for a given component. The response will be a string containing the URL. You can use this URL to understand the structure of the component and how it looks. The actual component's HTML structure might be slightly different from the Figma design but the overall structure and design should be the same including the design tokens.
30654
- `,l=`
31253
+ `,s=`
30655
31254
  Best practices and guidelines for using Baseline UI components, styling, and design tokens. READ THIS BEFORE DOING ANYTHING.
30656
31255
 
30657
31256
  ## Usage
@@ -30659,7 +31258,7 @@ Best practices and guidelines for using Baseline UI components, styling, and des
30659
31258
  Use this resource to:
30660
31259
  - Understand best practices for using Baseline UI components
30661
31260
  - Understand styling guidelines for using Baseline UI components
30662
- `,s=`
31261
+ `,l=`
30663
31262
  A guide for implementing styling elements in Baseline UI components or applying styling to existing components. READ THIS BEFORE DOING ANYTHING.
30664
31263
  `,g=`
30665
31264
  List all 8 available resources in the Baseline UI MCP server with their descriptions and URIs. Use this tool to discover what information and documentation is available.
@@ -30708,4 +31307,4 @@ ${Object.entries(o).toSorted(([n],[t])=>n.localeCompare(t)).map(([n,{description
30708
31307
 
30709
31308
  ${t.map(e=>"- "+e).join(`
30710
31309
  `)}`).join(`
30711
- `);async function S(){let n=new mcp_js.McpServer({name:"baseline-ui",version:p.version});n.registerResource("list_components","resource://baseline-ui/list_components.md",{description:a,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:I}]})),n.registerResource("list_icons","resource://baseline-ui/list_icons.md",{description:r,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:P}]})),n.registerResource("getting_started","resource://baseline-ui/getting_started.md",{description:"Quick start guide for integrating Baseline UI into new projects",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.gettingStarted}]})),n.registerResource("nutrient_web_viewer_theming","resource://baseline-ui/nutrient_web_viewer_theming.md",{description:"Specialized theming guide for customizing Baseline UI in Nutrient Web Viewer. This is not applicable if you are not theming the Nutrient Web Viewer SDK.",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.nutrientWebViewerTheming}]})),n.registerResource("theming","resource://baseline-ui/theming.md",{description:"Comprehensive guide for implementing custom themes and color schemes in Baseline UI",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.theming}]})),n.registerResource("internationalization","resource://baseline-ui/internationalization.md",{description:"Guide for implementing multi-language support and localization in Baseline UI",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.internationalization}]})),n.registerResource("styling","resource://baseline-ui/styling.md",{description:s,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.styling}]})),n.registerResource("guidelines","resource://baseline-ui/guidelines.md",{description:l,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:u}]})),n.registerTool("get_component_info",{title:"Get component info",description:m,inputSchema:{componentName:zod.z.enum(Object.keys(o))}},({componentName:e})=>({content:[{type:"text",text:JSON.stringify(Object.fromEntries(Object.entries(o[e]).filter(([f])=>!["description","similarTo","figmaUrl"].includes(f))),null,2)}]})),n.registerTool("get_story_url",{title:"Get story demo URL",description:h,inputSchema:{storyId:zod.z.string()}},({storyId:e})=>({content:[{type:"text",text:`https://nutrient.io/baseline-ui/iframe.html?id=${e}`}]})),n.registerTool("get_figma_url",{title:"Get Figma URL",description:b,inputSchema:{componentName:zod.z.enum(Object.keys(o))}},({componentName:e})=>({content:[{type:"text",text:o[e].figmaUrl}]})),n.registerTool("list_available_resources",{title:"List Available Resources",description:g,inputSchema:{}},()=>({content:[{type:"text",text:JSON.stringify([{name:"list_components",uri:"resource://baseline-ui/list_components.md",description:a,mimeType:"text/markdown"},{name:"list_icons",uri:"resource://baseline-ui/list_icons.md",description:r,mimeType:"text/markdown"},{name:"getting_started",uri:"resource://baseline-ui/getting_started.md",description:"Quick start guide for integrating Baseline UI into new projects",mimeType:"text/markdown"},{name:"nutrient_web_viewer_theming",uri:"resource://baseline-ui/nutrient_web_viewer_theming.md",description:"Specialized theming guide for customizing Baseline UI in Nutrient Web Viewer. This is not applicable if you are not theming the Nutrient Web Viewer SDK.",mimeType:"text/markdown"},{name:"theming",uri:"resource://baseline-ui/theming.md",description:"Comprehensive guide for implementing custom themes and color schemes in Baseline UI",mimeType:"text/markdown"},{name:"internationalization",uri:"resource://baseline-ui/internationalization.md",description:"Guide for implementing multi-language support and localization in Baseline UI",mimeType:"text/markdown"},{name:"styling",uri:"resource://baseline-ui/styling.md",description:s,mimeType:"text/markdown"},{name:"guidelines",uri:"resource://baseline-ui/guidelines.md",description:l,mimeType:"text/markdown"}],null,2)}]}));let t=new stdio_js.StdioServerTransport;await n.connect(t);}(async()=>await S())();
31310
+ `);async function S(){let n=new mcp_js.McpServer({name:"baseline-ui",version:p.version});n.registerResource("list_components","resource://baseline-ui/list_components.md",{description:a,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:I}]})),n.registerResource("list_icons","resource://baseline-ui/list_icons.md",{description:r,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:P}]})),n.registerResource("getting_started","resource://baseline-ui/getting_started.md",{description:"Quick start guide for integrating Baseline UI into new projects",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.gettingStarted}]})),n.registerResource("nutrient_web_viewer_theming","resource://baseline-ui/nutrient_web_viewer_theming.md",{description:"Specialized theming guide for customizing Baseline UI in Nutrient Web Viewer. This is not applicable if you are not theming the Nutrient Web Viewer SDK.",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.nutrientWebViewerTheming}]})),n.registerResource("theming","resource://baseline-ui/theming.md",{description:"Comprehensive guide for implementing custom themes and color schemes in Baseline UI",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.theming}]})),n.registerResource("internationalization","resource://baseline-ui/internationalization.md",{description:"Guide for implementing multi-language support and localization in Baseline UI",mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.internationalization}]})),n.registerResource("styling","resource://baseline-ui/styling.md",{description:l,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:i.styling}]})),n.registerResource("guidelines","resource://baseline-ui/guidelines.md",{description:s,mimeType:"text/markdown"},e=>({contents:[{uri:e.href,mimeType:"text/markdown",text:u}]})),n.registerTool("get_component_info",{title:"Get component info",description:m,inputSchema:{componentName:zod.z.enum(Object.keys(o))}},({componentName:e})=>({content:[{type:"text",text:JSON.stringify(Object.fromEntries(Object.entries(o[e]).filter(([f])=>!["description","similarTo","figmaUrl"].includes(f))),null,2)}]})),n.registerTool("get_story_url",{title:"Get story demo URL",description:h,inputSchema:{storyId:zod.z.string()}},({storyId:e})=>({content:[{type:"text",text:`https://nutrient.io/baseline-ui/iframe.html?id=${e}`}]})),n.registerTool("get_figma_url",{title:"Get Figma URL",description:b,inputSchema:{componentName:zod.z.enum(Object.keys(o))}},({componentName:e})=>({content:[{type:"text",text:o[e].figmaUrl}]})),n.registerTool("list_available_resources",{title:"List Available Resources",description:g,inputSchema:{}},()=>({content:[{type:"text",text:JSON.stringify([{name:"list_components",uri:"resource://baseline-ui/list_components.md",description:a,mimeType:"text/markdown"},{name:"list_icons",uri:"resource://baseline-ui/list_icons.md",description:r,mimeType:"text/markdown"},{name:"getting_started",uri:"resource://baseline-ui/getting_started.md",description:"Quick start guide for integrating Baseline UI into new projects",mimeType:"text/markdown"},{name:"nutrient_web_viewer_theming",uri:"resource://baseline-ui/nutrient_web_viewer_theming.md",description:"Specialized theming guide for customizing Baseline UI in Nutrient Web Viewer. This is not applicable if you are not theming the Nutrient Web Viewer SDK.",mimeType:"text/markdown"},{name:"theming",uri:"resource://baseline-ui/theming.md",description:"Comprehensive guide for implementing custom themes and color schemes in Baseline UI",mimeType:"text/markdown"},{name:"internationalization",uri:"resource://baseline-ui/internationalization.md",description:"Guide for implementing multi-language support and localization in Baseline UI",mimeType:"text/markdown"},{name:"styling",uri:"resource://baseline-ui/styling.md",description:l,mimeType:"text/markdown"},{name:"guidelines",uri:"resource://baseline-ui/guidelines.md",description:s,mimeType:"text/markdown"}],null,2)}]}));let t=new stdio_js.StdioServerTransport;await n.connect(t);}(async()=>await S())();