Skip to content

Commit e9bb3da

Browse files
committed
docs(search): support tags export on examples
Examples can now declare search keywords via `export let tags = [...]` in their `<script module>` block. The catalog generator picks them up (also accepting `export const`), threads them through to the search index, and includes them in the "Best match" haystack alongside the title and component name — so e.g. tagging the Tree playground with `['tiger']` makes it discoverable by that keyword.
1 parent f1485aa commit e9bb3da

21 files changed

Lines changed: 129 additions & 74 deletions

docs/scripts/generate-example-catalog.ts

Lines changed: 24 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -97,22 +97,36 @@ function extractComponentsFromExample(
9797
}
9898

9999
/**
100-
* Extract module-level exports (title, description) from a <script module> block
100+
* Extract module-level exports (title, description, tags) from a <script module> block
101101
*/
102-
function extractModuleExports(filePath: string): { title?: string; description?: string } {
102+
function extractModuleExports(filePath: string): {
103+
title?: string;
104+
description?: string;
105+
tags?: string[];
106+
} {
103107
const content = fs.readFileSync(filePath, 'utf-8');
104-
const moduleMatch = content.match(/<script\s+module>([\s\S]*?)<\/script>/);
108+
const moduleMatch = content.match(/<script\s+module[^>]*>([\s\S]*?)<\/script>/);
105109
if (!moduleMatch) return {};
106110

107111
const moduleContent = moduleMatch[1];
108-
const result: { title?: string; description?: string } = {};
112+
const result: { title?: string; description?: string; tags?: string[] } = {};
109113

110-
const titleMatch = moduleContent.match(/export\s+const\s+title\s*=\s*['"`](.+?)['"`]/);
114+
const titleMatch = moduleContent.match(/export\s+(?:let|const)\s+title\s*=\s*['"`](.+?)['"`]/);
111115
if (titleMatch) result.title = titleMatch[1];
112116

113-
const descMatch = moduleContent.match(/export\s+const\s+description\s*=\s*['"`](.+?)['"`]/);
117+
const descMatch = moduleContent.match(
118+
/export\s+(?:let|const)\s+description\s*=\s*['"`](.+?)['"`]/
119+
);
114120
if (descMatch) result.description = descMatch[1];
115121

122+
const tagsMatch = moduleContent.match(/export\s+(?:let|const)\s+tags\s*=\s*\[([\s\S]*?)\]/);
123+
if (tagsMatch) {
124+
const items = tagsMatch[1].match(/['"`]([^'"`]+)['"`]/g);
125+
if (items?.length) {
126+
result.tags = items.map((s) => s.slice(1, -1));
127+
}
128+
}
129+
116130
return result;
117131
}
118132

@@ -153,6 +167,10 @@ function getComponentExamples(componentName: string, allComponents: string[]): E
153167
info.description = moduleExports.description;
154168
}
155169

170+
if (moduleExports.tags?.length) {
171+
info.tags = moduleExports.tags;
172+
}
173+
156174
examples.push(info);
157175
}
158176
}

docs/src/examples/catalog/Axis.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1756,7 +1756,7 @@
17561756
"example": "single-stack-with-indicator",
17571757
"component": "BarChart",
17581758
"path": "/docs/components/BarChart/single-stack-with-indicator",
1759-
"lineNumber": 65,
1759+
"lineNumber": 69,
17601760
"line": "<Axis placement=\"bottom\" tickLength={0} ticks={[15, 16, 18.5, 25, 30, 35, 40]}>"
17611761
},
17621762
{
@@ -4990,14 +4990,14 @@
49904990
"example": "pan-zoom-axes",
49914991
"component": "TransformContext",
49924992
"path": "/docs/components/TransformContext/pan-zoom-axes",
4993-
"lineNumber": 54,
4993+
"lineNumber": 53,
49944994
"line": "<Axis"
49954995
},
49964996
{
49974997
"example": "pan-zoom-axes",
49984998
"component": "TransformContext",
49994999
"path": "/docs/components/TransformContext/pan-zoom-axes",
5000-
"lineNumber": 61,
5000+
"lineNumber": 60,
50015001
"line": "<Axis"
50025002
},
50035003
{
@@ -5106,5 +5106,5 @@
51065106
"line": "<Axis placement=\"bottom\" rule />"
51075107
}
51085108
],
5109-
"updatedAt": "2026-04-17T14:32:25.646Z"
5109+
"updatedAt": "2026-04-19T13:23:56.697Z"
51105110
}

docs/src/examples/catalog/BarChart.json

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1245,29 +1245,32 @@
12451245
"components": [
12461246
{
12471247
"component": "BarChart",
1248-
"lineNumber": 39,
1248+
"lineNumber": 43,
12491249
"line": "<BarChart"
12501250
},
12511251
{
12521252
"component": "Axis",
1253-
"lineNumber": 65,
1253+
"lineNumber": 69,
12541254
"line": "<Axis placement=\"bottom\" tickLength={0} ticks={[15, 16, 18.5, 25, 30, 35, 40]}>"
12551255
},
12561256
{
12571257
"component": "Text",
1258-
"lineNumber": 67,
1258+
"lineNumber": 71,
12591259
"line": "<Text {...props} textAnchor={props.value === '40' ? 'end' : 'start'} />"
12601260
},
12611261
{
12621262
"component": "Polygon",
1263-
"lineNumber": 73,
1263+
"lineNumber": 77,
12641264
"line": "<Polygon"
12651265
},
12661266
{
12671267
"component": "Tooltip",
1268-
"lineNumber": 84,
1268+
"lineNumber": 88,
12691269
"line": "<Tooltip.Root>"
12701270
}
1271+
],
1272+
"tags": [
1273+
"gauge"
12711274
]
12721275
},
12731276
{
@@ -2079,7 +2082,7 @@
20792082
"example": "single-stack-with-indicator",
20802083
"component": "BarChart",
20812084
"path": "/docs/components/BarChart/single-stack-with-indicator",
2082-
"lineNumber": 39,
2085+
"lineNumber": 43,
20832086
"line": "<BarChart"
20842087
},
20852088
{
@@ -2251,5 +2254,5 @@
22512254
"line": "<BarChart"
22522255
}
22532256
],
2254-
"updatedAt": "2026-04-13T13:16:04.045Z"
2257+
"updatedAt": "2026-04-19T13:21:53.938Z"
22552258
}

docs/src/examples/catalog/Chart.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4020,21 +4020,21 @@
40204020
"example": "pan-zoom-axes",
40214021
"component": "TransformContext",
40224022
"path": "/docs/components/TransformContext/pan-zoom-axes",
4023-
"lineNumber": 19,
4023+
"lineNumber": 18,
40244024
"line": "<Chart"
40254025
},
40264026
{
40274027
"example": "pan-zoom-html-image",
40284028
"component": "TransformContext",
40294029
"path": "/docs/components/TransformContext/pan-zoom-html-image",
4030-
"lineNumber": 7,
4030+
"lineNumber": 11,
40314031
"line": "<Chart"
40324032
},
40334033
{
40344034
"example": "pan-zoom-svg-image",
40354035
"component": "TransformContext",
40364036
"path": "/docs/components/TransformContext/pan-zoom-svg-image",
4037-
"lineNumber": 7,
4037+
"lineNumber": 11,
40384038
"line": "<Chart"
40394039
},
40404040
{
@@ -4055,7 +4055,7 @@
40554055
"example": "scroll-activation-key",
40564056
"component": "TransformContext",
40574057
"path": "/docs/components/TransformContext/scroll-activation-key",
4058-
"lineNumber": 9,
4058+
"lineNumber": 16,
40594059
"line": "<Chart"
40604060
},
40614061
{
@@ -4199,5 +4199,5 @@
41994199
"line": "<Chart {data} x=\"x\" y=\"y\" height={400}>"
42004200
}
42014201
],
4202-
"updatedAt": "2026-04-17T14:32:26.034Z"
4202+
"updatedAt": "2026-04-19T13:23:57.080Z"
42034203
}

docs/src/examples/catalog/Image.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -230,7 +230,7 @@
230230
"example": "pan-zoom-svg-image",
231231
"component": "TransformContext",
232232
"path": "/docs/components/TransformContext/pan-zoom-svg-image",
233-
"lineNumber": 19,
233+
"lineNumber": 23,
234234
"line": "<image"
235235
},
236236
{
@@ -244,9 +244,9 @@
244244
"example": "scroll-activation-key",
245245
"component": "TransformContext",
246246
"path": "/docs/components/TransformContext/scroll-activation-key",
247-
"lineNumber": 22,
247+
"lineNumber": 29,
248248
"line": "<image"
249249
}
250250
],
251-
"updatedAt": "2026-04-12T22:48:25.950Z"
251+
"updatedAt": "2026-04-19T13:23:58.214Z"
252252
}

docs/src/examples/catalog/Layer.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3982,21 +3982,21 @@
39823982
"example": "pan-zoom-axes",
39833983
"component": "TransformContext",
39843984
"path": "/docs/components/TransformContext/pan-zoom-axes",
3985-
"lineNumber": 41,
3985+
"lineNumber": 40,
39863986
"line": "<Layer>"
39873987
},
39883988
{
39893989
"example": "pan-zoom-html-image",
39903990
"component": "TransformContext",
39913991
"path": "/docs/components/TransformContext/pan-zoom-html-image",
3992-
"lineNumber": 18,
3992+
"lineNumber": 22,
39933993
"line": "<Layer type=\"html\">"
39943994
},
39953995
{
39963996
"example": "pan-zoom-svg-image",
39973997
"component": "TransformContext",
39983998
"path": "/docs/components/TransformContext/pan-zoom-svg-image",
3999-
"lineNumber": 18,
3999+
"lineNumber": 22,
40004000
"line": "<Layer type=\"svg\">"
40014001
},
40024002
{
@@ -4017,7 +4017,7 @@
40174017
"example": "scroll-activation-key",
40184018
"component": "TransformContext",
40194019
"path": "/docs/components/TransformContext/scroll-activation-key",
4020-
"lineNumber": 21,
4020+
"lineNumber": 28,
40214021
"line": "<Layer type=\"svg\">"
40224022
},
40234023
{
@@ -4175,5 +4175,5 @@
41754175
"line": "<Layer onpointermove={onPointerMove}>"
41764176
}
41774177
],
4178-
"updatedAt": "2026-04-17T14:32:27.192Z"
4178+
"updatedAt": "2026-04-19T13:23:58.262Z"
41794179
}

docs/src/examples/catalog/LinearGradient.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -570,9 +570,9 @@
570570
"example": "pan-zoom-axes",
571571
"component": "TransformContext",
572572
"path": "/docs/components/TransformContext/pan-zoom-axes",
573-
"lineNumber": 42,
573+
"lineNumber": 41,
574574
"line": "<LinearGradient x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\" {stops}>"
575575
}
576576
],
577-
"updatedAt": "2026-04-14T21:42:24.391Z"
577+
"updatedAt": "2026-04-19T13:23:58.401Z"
578578
}

docs/src/examples/catalog/Polygon.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -565,7 +565,7 @@
565565
"example": "single-stack-with-indicator",
566566
"component": "BarChart",
567567
"path": "/docs/components/BarChart/single-stack-with-indicator",
568-
"lineNumber": 73,
568+
"lineNumber": 77,
569569
"line": "<Polygon"
570570
},
571571
{
@@ -772,5 +772,5 @@
772772
"line": "<Polygon"
773773
}
774774
],
775-
"updatedAt": "2026-04-16T17:47:00.397Z"
775+
"updatedAt": "2026-04-19T13:21:55.859Z"
776776
}

docs/src/examples/catalog/Rect.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -860,7 +860,7 @@
860860
"example": "pan-zoom-axes",
861861
"component": "TransformContext",
862862
"path": "/docs/components/TransformContext/pan-zoom-axes",
863-
"lineNumber": 44,
863+
"lineNumber": 43,
864864
"line": "<Rect"
865865
},
866866
{
@@ -920,5 +920,5 @@
920920
"line": "<Rect"
921921
}
922922
],
923-
"updatedAt": "2026-04-16T17:47:00.475Z"
923+
"updatedAt": "2026-04-19T13:23:58.832Z"
924924
}

docs/src/examples/catalog/Text.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -462,7 +462,7 @@
462462
"example": "single-stack-with-indicator",
463463
"component": "BarChart",
464464
"path": "/docs/components/BarChart/single-stack-with-indicator",
465-
"lineNumber": 67,
465+
"lineNumber": 71,
466466
"line": "<Text {...props} textAnchor={props.value === '40' ? 'end' : 'start'} />"
467467
},
468468
{
@@ -1026,5 +1026,5 @@
10261026
"line": "<Text x={570} y={16} textAnchor=\"middle\" class=\"text-xs fill-surface-content/50\""
10271027
}
10281028
],
1029-
"updatedAt": "2026-04-17T14:32:28.157Z"
1029+
"updatedAt": "2026-04-19T13:21:56.185Z"
10301030
}

0 commit comments

Comments
 (0)