@petrarca/sonnet-playground 0.1.6 → 0.3.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/PlayAdvancedComponents-ZYK66UII.js +8 -0
- package/dist/PlayColorPalette-IWECRZUS.js +8 -0
- package/dist/PlayCoreComponents-F2OFSQZK.js +8 -0
- package/dist/PlayDataComponents-BA3NA225.js +8 -0
- package/dist/PlayFormComponents-MZC7CNES.js +8 -0
- package/dist/PlayFormWidgets-IWJJQ5XL.js +8 -0
- package/dist/PlayForms-FOF3XE6G.js +7 -0
- package/dist/PlayGraph-RHFIDAS3.js +7 -0
- package/dist/PlayJsonEditor-SYZYEJEA.js +7 -0
- package/dist/PlayJsonEditor-SYZYEJEA.js.map +1 -0
- package/dist/PlayShellApi-3T4FZPEV.js +8 -0
- package/dist/PlayShellApi-3T4FZPEV.js.map +1 -0
- package/dist/PlayTypography-T6SMPHUB.js +8 -0
- package/dist/PlayTypography-T6SMPHUB.js.map +1 -0
- package/dist/chunk-4S2ITDB3.js +322 -0
- package/dist/chunk-4S2ITDB3.js.map +1 -0
- package/dist/chunk-4Y4JFKAK.js +240 -0
- package/dist/chunk-4Y4JFKAK.js.map +1 -0
- package/dist/{chunk-QIETZUEN.js → chunk-6DZ3TSV4.js} +66 -71
- package/dist/chunk-6DZ3TSV4.js.map +1 -0
- package/dist/{chunk-CYNK2P2Q.js → chunk-7IBZEHLI.js} +14 -13
- package/dist/chunk-7IBZEHLI.js.map +1 -0
- package/dist/chunk-C2EZ2ECG.js +40 -0
- package/dist/chunk-C2EZ2ECG.js.map +1 -0
- package/dist/{chunk-A3IK3CVW.js → chunk-DA3BIB5N.js} +24 -25
- package/dist/{chunk-A3IK3CVW.js.map → chunk-DA3BIB5N.js.map} +1 -1
- package/dist/{chunk-TZGJH7YS.js → chunk-DKLALDHR.js} +325 -331
- package/dist/chunk-DKLALDHR.js.map +1 -0
- package/dist/chunk-DZB6WFHA.js +401 -0
- package/dist/chunk-DZB6WFHA.js.map +1 -0
- package/dist/{chunk-KAT24CQQ.js → chunk-FZ3ZC7VM.js} +8 -6
- package/dist/chunk-FZ3ZC7VM.js.map +1 -0
- package/dist/chunk-MT4ILA37.js +563 -0
- package/dist/chunk-MT4ILA37.js.map +1 -0
- package/dist/chunk-QCK2M4KD.js +907 -0
- package/dist/chunk-QCK2M4KD.js.map +1 -0
- package/dist/chunk-SBKZRIJC.js +316 -0
- package/dist/chunk-SBKZRIJC.js.map +1 -0
- package/dist/index.d.ts +10 -6
- package/dist/index.js +52 -16
- package/dist/index.js.map +1 -1
- package/dist/pages/index.d.ts +26 -11
- package/dist/pages/index.js +23 -11
- package/package.json +6 -5
- package/dist/PlayColorPalette-UFMTJTUB.js +0 -8
- package/dist/PlayCoreComponents-7QCDFQLT.js +0 -7
- package/dist/PlayDataComponents-GZSRTW4F.js +0 -7
- package/dist/PlayFormComponents-RJB6WZHD.js +0 -7
- package/dist/PlayFormWidgets-OFV7TJKH.js +0 -7
- package/dist/PlayForms-24XX5DC6.js +0 -7
- package/dist/PlayJsonEditor-4L5INQPU.js +0 -7
- package/dist/PlayTypography-ID6DLFZD.js +0 -8
- package/dist/chunk-5V27QDAY.js +0 -617
- package/dist/chunk-5V27QDAY.js.map +0 -1
- package/dist/chunk-CYNK2P2Q.js.map +0 -1
- package/dist/chunk-FTN2A5YL.js +0 -20
- package/dist/chunk-FTN2A5YL.js.map +0 -1
- package/dist/chunk-GYKEPHHA.js +0 -1154
- package/dist/chunk-GYKEPHHA.js.map +0 -1
- package/dist/chunk-KAT24CQQ.js.map +0 -1
- package/dist/chunk-P7I5IDXA.js +0 -432
- package/dist/chunk-P7I5IDXA.js.map +0 -1
- package/dist/chunk-QIETZUEN.js.map +0 -1
- package/dist/chunk-TZGJH7YS.js.map +0 -1
- /package/dist/{PlayColorPalette-UFMTJTUB.js.map → PlayAdvancedComponents-ZYK66UII.js.map} +0 -0
- /package/dist/{PlayCoreComponents-7QCDFQLT.js.map → PlayColorPalette-IWECRZUS.js.map} +0 -0
- /package/dist/{PlayDataComponents-GZSRTW4F.js.map → PlayCoreComponents-F2OFSQZK.js.map} +0 -0
- /package/dist/{PlayFormComponents-RJB6WZHD.js.map → PlayDataComponents-BA3NA225.js.map} +0 -0
- /package/dist/{PlayFormWidgets-OFV7TJKH.js.map → PlayFormComponents-MZC7CNES.js.map} +0 -0
- /package/dist/{PlayForms-24XX5DC6.js.map → PlayFormWidgets-IWJJQ5XL.js.map} +0 -0
- /package/dist/{PlayJsonEditor-4L5INQPU.js.map → PlayForms-FOF3XE6G.js.map} +0 -0
- /package/dist/{PlayTypography-ID6DLFZD.js.map → PlayGraph-RHFIDAS3.js.map} +0 -0
package/dist/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import {
|
|
2
2
|
PlaygroundSection
|
|
3
|
-
} from "./chunk-
|
|
3
|
+
} from "./chunk-C2EZ2ECG.js";
|
|
4
4
|
|
|
5
5
|
// src/PlaygroundRegistry.ts
|
|
6
6
|
var PlaygroundRegistry = class _PlaygroundRegistry {
|
|
@@ -79,11 +79,14 @@ import {
|
|
|
79
79
|
Type,
|
|
80
80
|
Palette,
|
|
81
81
|
Grid,
|
|
82
|
+
Layers,
|
|
82
83
|
Braces,
|
|
83
84
|
Check,
|
|
84
85
|
Edit,
|
|
85
86
|
Package,
|
|
86
|
-
Table2
|
|
87
|
+
Table2,
|
|
88
|
+
Network,
|
|
89
|
+
SquareTerminal
|
|
87
90
|
} from "lucide-react";
|
|
88
91
|
var builtinEntries = [
|
|
89
92
|
{
|
|
@@ -93,7 +96,7 @@ var builtinEntries = [
|
|
|
93
96
|
icon: Type,
|
|
94
97
|
color: "teal",
|
|
95
98
|
path: "typography",
|
|
96
|
-
component: lazy(() => import("./PlayTypography-
|
|
99
|
+
component: lazy(() => import("./PlayTypography-T6SMPHUB.js")),
|
|
97
100
|
group: "Design System",
|
|
98
101
|
order: 0
|
|
99
102
|
},
|
|
@@ -104,7 +107,7 @@ var builtinEntries = [
|
|
|
104
107
|
icon: Palette,
|
|
105
108
|
color: "violet",
|
|
106
109
|
path: "color-palette",
|
|
107
|
-
component: lazy(() => import("./PlayColorPalette-
|
|
110
|
+
component: lazy(() => import("./PlayColorPalette-IWECRZUS.js")),
|
|
108
111
|
group: "Design System",
|
|
109
112
|
order: 1
|
|
110
113
|
},
|
|
@@ -115,10 +118,21 @@ var builtinEntries = [
|
|
|
115
118
|
icon: Grid,
|
|
116
119
|
color: "indigo",
|
|
117
120
|
path: "core-components",
|
|
118
|
-
component: lazy(() => import("./PlayCoreComponents-
|
|
121
|
+
component: lazy(() => import("./PlayCoreComponents-F2OFSQZK.js")),
|
|
119
122
|
group: "Components",
|
|
120
123
|
order: 0
|
|
121
124
|
},
|
|
125
|
+
{
|
|
126
|
+
id: "sonnet.advanced-components",
|
|
127
|
+
title: "Advanced Components",
|
|
128
|
+
description: "Multi-step workflows (Stepper) and hierarchical data structures (TreeView) with keyboard navigation and selection.",
|
|
129
|
+
icon: Layers,
|
|
130
|
+
color: "emerald",
|
|
131
|
+
path: "advanced-components",
|
|
132
|
+
component: lazy(() => import("./PlayAdvancedComponents-ZYK66UII.js")),
|
|
133
|
+
group: "Components",
|
|
134
|
+
order: 1
|
|
135
|
+
},
|
|
122
136
|
{
|
|
123
137
|
id: "sonnet.json-editor",
|
|
124
138
|
title: "JSON Editor",
|
|
@@ -126,9 +140,9 @@ var builtinEntries = [
|
|
|
126
140
|
icon: Braces,
|
|
127
141
|
color: "amber",
|
|
128
142
|
path: "json-editor",
|
|
129
|
-
component: lazy(() => import("./PlayJsonEditor-
|
|
143
|
+
component: lazy(() => import("./PlayJsonEditor-SYZYEJEA.js")),
|
|
130
144
|
group: "Components",
|
|
131
|
-
order:
|
|
145
|
+
order: 2
|
|
132
146
|
},
|
|
133
147
|
{
|
|
134
148
|
id: "sonnet.form-components",
|
|
@@ -137,7 +151,7 @@ var builtinEntries = [
|
|
|
137
151
|
icon: Check,
|
|
138
152
|
color: "blue",
|
|
139
153
|
path: "form-components",
|
|
140
|
-
component: lazy(() => import("./PlayFormComponents-
|
|
154
|
+
component: lazy(() => import("./PlayFormComponents-MZC7CNES.js")),
|
|
141
155
|
group: "Forms",
|
|
142
156
|
order: 0
|
|
143
157
|
},
|
|
@@ -148,7 +162,7 @@ var builtinEntries = [
|
|
|
148
162
|
icon: Edit,
|
|
149
163
|
color: "purple",
|
|
150
164
|
path: "forms",
|
|
151
|
-
component: lazy(() => import("./PlayForms-
|
|
165
|
+
component: lazy(() => import("./PlayForms-FOF3XE6G.js")),
|
|
152
166
|
group: "Forms",
|
|
153
167
|
order: 1
|
|
154
168
|
},
|
|
@@ -159,7 +173,7 @@ var builtinEntries = [
|
|
|
159
173
|
icon: Package,
|
|
160
174
|
color: "indigo",
|
|
161
175
|
path: "form-widgets",
|
|
162
|
-
component: lazy(() => import("./PlayFormWidgets-
|
|
176
|
+
component: lazy(() => import("./PlayFormWidgets-IWJJQ5XL.js")),
|
|
163
177
|
group: "Forms",
|
|
164
178
|
order: 2
|
|
165
179
|
},
|
|
@@ -170,9 +184,31 @@ var builtinEntries = [
|
|
|
170
184
|
icon: Table2,
|
|
171
185
|
color: "teal",
|
|
172
186
|
path: "data-components",
|
|
173
|
-
component: lazy(() => import("./PlayDataComponents-
|
|
187
|
+
component: lazy(() => import("./PlayDataComponents-BA3NA225.js")),
|
|
174
188
|
group: "Data",
|
|
175
189
|
order: 0
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
id: "sonnet.graph",
|
|
193
|
+
title: "Graph Visualization",
|
|
194
|
+
description: "Interactive property graph visualization with dual renderer support (Cytoscape, Reagraph). Org hierarchy demo with filtering, selection, and exploration.",
|
|
195
|
+
icon: Network,
|
|
196
|
+
color: "cyan",
|
|
197
|
+
path: "graph",
|
|
198
|
+
component: lazy(() => import("./PlayGraph-RHFIDAS3.js")),
|
|
199
|
+
group: "Graph",
|
|
200
|
+
order: 0
|
|
201
|
+
},
|
|
202
|
+
{
|
|
203
|
+
id: "sonnet.shell-api",
|
|
204
|
+
title: "Shell API",
|
|
205
|
+
description: "Interactive demo of the shell API: notifications, dialogs, programmatic navigation, slide-over panels, the resizable sidePane, and the Cmd+K command menu.",
|
|
206
|
+
icon: SquareTerminal,
|
|
207
|
+
color: "orange",
|
|
208
|
+
path: "shell-api",
|
|
209
|
+
component: lazy(() => import("./PlayShellApi-3T4FZPEV.js")),
|
|
210
|
+
group: "Shell",
|
|
211
|
+
order: 0
|
|
176
212
|
}
|
|
177
213
|
];
|
|
178
214
|
|
|
@@ -206,11 +242,11 @@ function PlaygroundTile({ item, onNavigate }) {
|
|
|
206
242
|
className: "cursor-pointer shadow-sm border rounded-md p-6 transition-transform duration-200 motion-safe:hover:-translate-y-1",
|
|
207
243
|
onClick: () => onNavigate(item.path),
|
|
208
244
|
children: [
|
|
209
|
-
/* @__PURE__ */ jsx("div", { className: "flex items-center mb-
|
|
245
|
+
/* @__PURE__ */ jsx("div", { className: "flex items-center mb-4", children: /* @__PURE__ */ jsx(
|
|
210
246
|
"div",
|
|
211
247
|
{
|
|
212
|
-
className: `flex items-center justify-center w-
|
|
213
|
-
children: /* @__PURE__ */ jsx(item.icon, { size:
|
|
248
|
+
className: `flex items-center justify-center w-9 h-9 rounded-md ${COLOR_CLASSES[item.color] ?? COLOR_CLASSES.blue}`,
|
|
249
|
+
children: /* @__PURE__ */ jsx(item.icon, { size: 18 })
|
|
214
250
|
}
|
|
215
251
|
) }),
|
|
216
252
|
/* @__PURE__ */ jsx("h3", { className: "heading-section mb-1", children: item.title }),
|
|
@@ -229,11 +265,11 @@ function PlaygroundOverview({
|
|
|
229
265
|
const navigate = useNavigate();
|
|
230
266
|
const [grouped, setGrouped] = useState(initialGrouped);
|
|
231
267
|
const handleNavigate = (path) => navigate(`${basePath}/${path}`);
|
|
232
|
-
return /* @__PURE__ */ jsxs("div", { className: "w-full
|
|
268
|
+
return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
|
|
233
269
|
/* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between mb-6", children: [
|
|
234
270
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
235
271
|
/* @__PURE__ */ jsx("h1", { className: "mb-1", children: title }),
|
|
236
|
-
/* @__PURE__ */ jsx("p", { className: "text-
|
|
272
|
+
/* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: subtitle })
|
|
237
273
|
] }),
|
|
238
274
|
/* @__PURE__ */ jsx(SimpleTooltip, { label: grouped ? "Show flat list" : "Group by category", children: /* @__PURE__ */ jsx(
|
|
239
275
|
Button,
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/PlaygroundRegistry.ts","../src/builtinEntries.ts","../src/createPlaygroundModule.tsx","../src/PlaygroundOverview.tsx","../src/index.ts"],"sourcesContent":["/**\n * PlaygroundRegistry -- mutable collection of playground entries.\n *\n * The library ships a default instance pre-populated with the built-in\n * sonnet component demos. Consumers register additional entries for\n * domain-specific playgrounds before passing the registry to\n * createPlaygroundModule().\n */\nimport type { PlaygroundEntry } from \"./types\";\n\nexport class PlaygroundRegistry {\n private entries: Map<string, PlaygroundEntry> = new Map();\n\n /** Register a playground entry. Overwrites any existing entry with the same id. */\n register(entry: PlaygroundEntry): void {\n this.entries.set(entry.id, entry);\n }\n\n /** Register multiple entries at once. */\n registerAll(entries: PlaygroundEntry[]): void {\n for (const entry of entries) {\n this.entries.set(entry.id, entry);\n }\n }\n\n /** Remove an entry by id. Returns true if it existed. */\n unregister(id: string): boolean {\n return this.entries.delete(id);\n }\n\n /** Get a single entry by id. */\n get(id: string): PlaygroundEntry | undefined {\n return this.entries.get(id);\n }\n\n /** Fallback group label for entries with no group defined. */\n static readonly DEFAULT_GROUP = \"General\";\n\n /**\n * All registered entries, sorted by group registration order then\n * by `order` within each group.\n */\n getAll(): PlaygroundEntry[] {\n const groupOrder = this.getGroupOrder();\n return [...this.entries.values()].sort((a, b) => {\n const groupA = a.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n const groupB = b.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n if (groupA !== groupB) {\n return (\n (groupOrder.get(groupA) ?? 999) - (groupOrder.get(groupB) ?? 999)\n );\n }\n return (a.order ?? 0) - (b.order ?? 0);\n });\n }\n\n /**\n * Entries grouped by their group label.\n * Returns an array of [groupLabel, entries[]] tuples, preserving\n * first-seen registration order for groups and `order` within each group.\n */\n getGrouped(): Array<[string, PlaygroundEntry[]]> {\n const grouped = new Map<string, PlaygroundEntry[]>();\n for (const entry of this.getAll()) {\n const group = entry.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n const list = grouped.get(group) ?? [];\n list.push(entry);\n grouped.set(group, list);\n }\n return [...grouped.entries()];\n }\n\n /** Map of group name → first-seen index (registration order). */\n private getGroupOrder(): Map<string, number> {\n const order = new Map<string, number>();\n let idx = 0;\n for (const entry of this.entries.values()) {\n const group = entry.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n if (!order.has(group)) {\n order.set(group, idx++);\n }\n }\n return order;\n }\n\n /** Number of registered entries. */\n get size(): number {\n return this.entries.size;\n }\n}\n","/**\n * Built-in playground entries for the sonnet component library.\n *\n * These entries demonstrate @petrarca/sonnet-* components with static\n * mock data -- no application backend required. Each page is lazy-loaded.\n */\nimport { lazy } from \"react\";\nimport {\n Type,\n Palette,\n Grid,\n Braces,\n Check,\n Edit,\n Package,\n Table2,\n} from \"lucide-react\";\nimport type { PlaygroundEntry } from \"./types\";\n\nexport const builtinEntries: PlaygroundEntry[] = [\n {\n id: \"sonnet.typography\",\n title: \"Typography\",\n description:\n \"Living style-guide for the typography system. Font families, type scale, weights, heading hierarchy, color tiers, and component patterns.\",\n icon: Type,\n color: \"teal\",\n path: \"typography\",\n component: lazy(() => import(\"./pages/PlayTypography\")),\n group: \"Design System\",\n order: 0,\n },\n {\n id: \"sonnet.color-palette\",\n title: \"Color Palette\",\n description:\n \"Living reference for the color system. Semantic tokens, extended palette, badge colors, icon accents, and usage guidance.\",\n icon: Palette,\n color: \"violet\",\n path: \"color-palette\",\n component: lazy(() => import(\"./pages/PlayColorPalette\")),\n group: \"Design System\",\n order: 1,\n },\n {\n id: \"sonnet.core-components\",\n title: \"Core UI Components\",\n description:\n \"Test all core UI components (notifications, buttons, dialogs, forms, etc.) in isolation before production use.\",\n icon: Grid,\n color: \"indigo\",\n path: \"core-components\",\n component: lazy(() => import(\"./pages/PlayCoreComponents\")),\n group: \"Components\",\n order: 0,\n },\n {\n id: \"sonnet.json-editor\",\n title: \"JSON Editor\",\n description:\n \"Constrained JSON editor with selectively editable regions using JSON Pointer (RFC 6901). Readonly sections are visible but locked.\",\n icon: Braces,\n color: \"amber\",\n path: \"json-editor\",\n component: lazy(() => import(\"./pages/PlayJsonEditor\")),\n group: \"Components\",\n order: 1,\n },\n {\n id: \"sonnet.form-components\",\n title: \"Form Components\",\n description:\n \"Test custom Form wrapper components with labels, descriptions, and error states. Includes Input, Textarea, Number, Checkbox, Select, MultiSelect, and Tags.\",\n icon: Check,\n color: \"blue\",\n path: \"form-components\",\n component: lazy(() => import(\"./pages/PlayFormComponents\")),\n group: \"Forms\",\n order: 0,\n },\n {\n id: \"sonnet.forms\",\n title: \"Forms Renderer\",\n description:\n \"Test and experiment with the JsonSchemaFormRenderer component. Try different schemas and see real-time validation.\",\n icon: Edit,\n color: \"purple\",\n path: \"forms\",\n component: lazy(() => import(\"./pages/PlayForms\")),\n group: \"Forms\",\n order: 1,\n },\n {\n id: \"sonnet.form-widgets\",\n title: \"Form Widgets\",\n description:\n \"Pluggable field components consumed by the Forms Renderer. Each widget maps to a JSON Schema type or format and can be swapped independently.\",\n icon: Package,\n color: \"indigo\",\n path: \"form-widgets\",\n component: lazy(() => import(\"./pages/PlayFormWidgets\")),\n group: \"Forms\",\n order: 2,\n },\n {\n id: \"sonnet.data-components\",\n title: \"Data Components\",\n description:\n \"Interactive sandbox for SearchInput (simple and faceted mode) and EntityTable. Includes a live table wired to the faceted search.\",\n icon: Table2,\n color: \"teal\",\n path: \"data-components\",\n component: lazy(() => import(\"./pages/PlayDataComponents\")),\n group: \"Data\",\n order: 0,\n },\n];\n","/**\n * Factory that turns a PlaygroundRegistry into a ServiceModule.\n *\n * Generates routes (lazy + Suspense), sidebar navigation, and the\n * overview index page -- all derived from the registry entries.\n * The consumer just passes a registry and optional overrides.\n */\nimport React, { Suspense } from \"react\";\nimport { FlaskConical } from \"lucide-react\";\nimport type { ServiceModule, NavGroup } from \"@petrarca/sonnet-shell\";\nimport type { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport type { PlaygroundModuleOptions } from \"./types\";\nimport { PlaygroundOverview } from \"./PlaygroundOverview\";\n\n/**\n * Build sidebar navigation groups from registry entries.\n *\n * Groups entries by their `group` field. Each group becomes a NavGroup\n * with a heading. Ungrouped entries go into a \"General\" group.\n */\nfunction buildNavigation(\n registry: PlaygroundRegistry,\n basePath: string,\n): NavGroup[] {\n const groups = registry.getGrouped();\n const navGroups: NavGroup[] = [];\n\n // Overview link is always first\n const overviewGroup: NavGroup = {\n id: \"playground-overview\",\n links: [{ label: \"Overview\", path: basePath }],\n };\n navGroups.push(overviewGroup);\n\n for (const [groupLabel, entries] of groups) {\n navGroups.push({\n id: `playground-${groupLabel.toLowerCase().replace(/\\s+/g, \"-\")}`,\n heading: groupLabel,\n links: entries.map((e) => ({\n label: e.title,\n path: `${basePath}/${e.path}`,\n })),\n });\n }\n\n return navGroups;\n}\n\n/** Wrap a component in Suspense for lazy loading. */\nfunction suspended(Component: React.ComponentType): React.ReactElement {\n return (\n <Suspense>\n <Component />\n </Suspense>\n );\n}\n\n/**\n * Create a ServiceModule for the playground.\n *\n * Returns a complete module definition ready to pass to\n * createModuleRegistry(). Routes, navigation, and the overview page\n * are all generated from the registry.\n */\nexport function createPlaygroundModule(\n registry: PlaygroundRegistry,\n options: PlaygroundModuleOptions = {},\n): ServiceModule {\n const {\n icon = FlaskConical,\n label = \"Playground\",\n basePath = \"/playground\",\n overviewTitle = \"Developer Playground\",\n overviewSubtitle = \"Experiment with components, test features, and explore capabilities.\",\n grouped = true,\n } = options;\n\n // Strip leading slash for route paths (React Router relative convention)\n const routeBase = basePath.replace(/^\\//, \"\");\n\n const routes = [\n {\n path: routeBase,\n element: suspended(() => (\n <PlaygroundOverview\n registry={registry}\n basePath={basePath}\n title={overviewTitle}\n subtitle={overviewSubtitle}\n grouped={grouped}\n />\n )),\n },\n ...registry.getAll().map((entry) => ({\n path: `${routeBase}/${entry.path}`,\n element: suspended(entry.component),\n })),\n ];\n\n return {\n id: \"playground\",\n label,\n icon,\n basePath,\n pinBottom: true,\n navigation: buildNavigation(registry, basePath),\n routes,\n };\n}\n","/**\n * PlaygroundOverview -- tile grid rendered from a PlaygroundRegistry.\n *\n * Displays cards with colored icons. Clicking a card navigates to the\n * playground page. A toggle in the header lets the user switch between\n * grouped (by category) and flat (all tiles) views.\n */\nimport React, { useState } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { LayoutGrid, List } from \"lucide-react\";\nimport { Card, Button, SimpleTooltip } from \"@petrarca/sonnet-ui\";\nimport type { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport type { PlaygroundColor, PlaygroundEntry } from \"./types\";\n\n// Maps colour name to icon container classes (bg-*-100 text-*-600 pairing).\nconst COLOR_CLASSES: Record<PlaygroundColor, string> = {\n blue: \"bg-blue-100 text-blue-600\",\n violet: \"bg-violet-100 text-violet-600\",\n indigo: \"bg-indigo-100 text-indigo-600\",\n purple: \"bg-purple-100 text-purple-600\",\n teal: \"bg-teal-100 text-teal-600\",\n amber: \"bg-amber-100 text-amber-600\",\n emerald: \"bg-emerald-100 text-emerald-600\",\n rose: \"bg-rose-100 text-rose-600\",\n orange: \"bg-orange-100 text-orange-600\",\n cyan: \"bg-cyan-100 text-cyan-600\",\n};\n\nconst TILE_GRID = \"grid grid-cols-1 sm:grid-cols-2 2xl:grid-cols-3 gap-6\";\n\ninterface PlaygroundOverviewProps {\n registry: PlaygroundRegistry;\n basePath: string;\n title: string;\n subtitle: string;\n /** Initial grouping state. Defaults to true. User can toggle at runtime. */\n grouped?: boolean;\n}\n\ninterface TileProps {\n item: PlaygroundEntry;\n onNavigate: (path: string) => void;\n}\n\n/** A single playground tile card. */\nfunction PlaygroundTile({ item, onNavigate }: TileProps): React.ReactElement {\n return (\n <Card\n className=\"cursor-pointer shadow-sm border rounded-md p-6 transition-transform duration-200 motion-safe:hover:-translate-y-1\"\n onClick={() => onNavigate(item.path)}\n >\n <div className=\"flex items-center mb-6\">\n <div\n className={`flex items-center justify-center w-[50px] h-[50px] rounded-md ${COLOR_CLASSES[item.color] ?? COLOR_CLASSES.blue}`}\n >\n <item.icon size={28} />\n </div>\n </div>\n <h3 className=\"heading-section mb-1\">{item.title}</h3>\n <p className=\"text-sm text-muted-foreground\">{item.description}</p>\n </Card>\n );\n}\n\n/** Developer playground overview -- card grid linking to all registered pages. */\nexport function PlaygroundOverview({\n registry,\n basePath,\n title,\n subtitle,\n grouped: initialGrouped = true,\n}: PlaygroundOverviewProps): React.ReactElement {\n const navigate = useNavigate();\n const [grouped, setGrouped] = useState(initialGrouped);\n\n const handleNavigate = (path: string) => navigate(`${basePath}/${path}`);\n\n return (\n <div className=\"w-full py-12 px-4\">\n <div className=\"flex items-start justify-between mb-6\">\n <div>\n <h1 className=\"mb-1\">{title}</h1>\n <p className=\"text-lg text-muted-foreground\">{subtitle}</p>\n </div>\n <SimpleTooltip label={grouped ? \"Show flat list\" : \"Group by category\"}>\n <Button\n variant=\"ghost\"\n size=\"icon\"\n onClick={() => setGrouped((v) => !v)}\n >\n {grouped ? (\n <LayoutGrid className=\"h-4 w-4\" />\n ) : (\n <List className=\"h-4 w-4\" />\n )}\n </Button>\n </SimpleTooltip>\n </div>\n\n {grouped ? (\n registry.getGrouped().map(([groupLabel, entries]) => (\n <div key={groupLabel} className=\"mb-8\">\n <h2 className=\"text-sm font-medium text-muted-foreground uppercase tracking-wider mb-4\">\n {groupLabel}\n </h2>\n <div className={TILE_GRID}>\n {entries.map((item) => (\n <PlaygroundTile\n key={item.id}\n item={item}\n onNavigate={handleNavigate}\n />\n ))}\n </div>\n </div>\n ))\n ) : (\n <div className={TILE_GRID}>\n {registry.getAll().map((item) => (\n <PlaygroundTile\n key={item.id}\n item={item}\n onNavigate={handleNavigate}\n />\n ))}\n </div>\n )}\n </div>\n );\n}\n","/**\n * @petrarca/sonnet-playground\n *\n * Playground framework and built-in component demos for the Petrarca\n * Sonnet component library.\n *\n * Usage:\n *\n * import {\n * createPlaygroundRegistry,\n * createPlaygroundModule,\n * } from \"@petrarca/sonnet-playground\";\n *\n * const playground = createPlaygroundRegistry();\n * // Optionally register additional entries:\n * playground.register({ id: \"app.custom\", ... });\n *\n * const playgroundModule = createPlaygroundModule(playground);\n */\n\nimport { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport { builtinEntries } from \"./builtinEntries\";\n\n// Framework\nexport { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nexport { createPlaygroundModule } from \"./createPlaygroundModule\";\nexport { PlaygroundOverview } from \"./PlaygroundOverview\";\nexport { PlaygroundSection } from \"./PlaygroundSection\";\n\n// Types\nexport type {\n PlaygroundEntry,\n PlaygroundColor,\n PlaygroundModuleOptions,\n} from \"./types\";\n\n// Built-in entries (for selective use or extending)\nexport { builtinEntries } from \"./builtinEntries\";\n\n/**\n * Convenience factory: creates a new PlaygroundRegistry pre-populated\n * with all built-in sonnet component demos.\n */\nexport function createPlaygroundRegistry(): PlaygroundRegistry {\n const registry = new PlaygroundRegistry();\n registry.registerAll(builtinEntries);\n return registry;\n}\n"],"mappings":"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","names":["jsx"]}
|
|
1
|
+
{"version":3,"sources":["../src/PlaygroundRegistry.ts","../src/builtinEntries.ts","../src/createPlaygroundModule.tsx","../src/PlaygroundOverview.tsx","../src/index.ts"],"sourcesContent":["/**\n * PlaygroundRegistry -- mutable collection of playground entries.\n *\n * The library ships a default instance pre-populated with the built-in\n * sonnet component demos. Consumers register additional entries for\n * domain-specific playgrounds before passing the registry to\n * createPlaygroundModule().\n */\nimport type { PlaygroundEntry } from \"./types\";\n\nexport class PlaygroundRegistry {\n private entries: Map<string, PlaygroundEntry> = new Map();\n\n /** Register a playground entry. Overwrites any existing entry with the same id. */\n register(entry: PlaygroundEntry): void {\n this.entries.set(entry.id, entry);\n }\n\n /** Register multiple entries at once. */\n registerAll(entries: PlaygroundEntry[]): void {\n for (const entry of entries) {\n this.entries.set(entry.id, entry);\n }\n }\n\n /** Remove an entry by id. Returns true if it existed. */\n unregister(id: string): boolean {\n return this.entries.delete(id);\n }\n\n /** Get a single entry by id. */\n get(id: string): PlaygroundEntry | undefined {\n return this.entries.get(id);\n }\n\n /** Fallback group label for entries with no group defined. */\n static readonly DEFAULT_GROUP = \"General\";\n\n /**\n * All registered entries, sorted by group registration order then\n * by `order` within each group.\n */\n getAll(): PlaygroundEntry[] {\n const groupOrder = this.getGroupOrder();\n return [...this.entries.values()].sort((a, b) => {\n const groupA = a.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n const groupB = b.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n if (groupA !== groupB) {\n return (\n (groupOrder.get(groupA) ?? 999) - (groupOrder.get(groupB) ?? 999)\n );\n }\n return (a.order ?? 0) - (b.order ?? 0);\n });\n }\n\n /**\n * Entries grouped by their group label.\n * Returns an array of [groupLabel, entries[]] tuples, preserving\n * first-seen registration order for groups and `order` within each group.\n */\n getGrouped(): Array<[string, PlaygroundEntry[]]> {\n const grouped = new Map<string, PlaygroundEntry[]>();\n for (const entry of this.getAll()) {\n const group = entry.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n const list = grouped.get(group) ?? [];\n list.push(entry);\n grouped.set(group, list);\n }\n return [...grouped.entries()];\n }\n\n /** Map of group name → first-seen index (registration order). */\n private getGroupOrder(): Map<string, number> {\n const order = new Map<string, number>();\n let idx = 0;\n for (const entry of this.entries.values()) {\n const group = entry.group ?? PlaygroundRegistry.DEFAULT_GROUP;\n if (!order.has(group)) {\n order.set(group, idx++);\n }\n }\n return order;\n }\n\n /** Number of registered entries. */\n get size(): number {\n return this.entries.size;\n }\n}\n","/**\n * Built-in playground entries for the sonnet component library.\n *\n * These entries demonstrate @petrarca/sonnet-* components with static\n * mock data -- no application backend required. Each page is lazy-loaded.\n */\nimport { lazy } from \"react\";\nimport {\n Type,\n Palette,\n Grid,\n Layers,\n Braces,\n Check,\n Edit,\n Package,\n Table2,\n Network,\n SquareTerminal,\n} from \"lucide-react\";\nimport type { PlaygroundEntry } from \"./types\";\n\nexport const builtinEntries: PlaygroundEntry[] = [\n {\n id: \"sonnet.typography\",\n title: \"Typography\",\n description:\n \"Living style-guide for the typography system. Font families, type scale, weights, heading hierarchy, color tiers, and component patterns.\",\n icon: Type,\n color: \"teal\",\n path: \"typography\",\n component: lazy(() => import(\"./pages/PlayTypography\")),\n group: \"Design System\",\n order: 0,\n },\n {\n id: \"sonnet.color-palette\",\n title: \"Color Palette\",\n description:\n \"Living reference for the color system. Semantic tokens, extended palette, badge colors, icon accents, and usage guidance.\",\n icon: Palette,\n color: \"violet\",\n path: \"color-palette\",\n component: lazy(() => import(\"./pages/PlayColorPalette\")),\n group: \"Design System\",\n order: 1,\n },\n {\n id: \"sonnet.core-components\",\n title: \"Core UI Components\",\n description:\n \"Test all core UI components (notifications, buttons, dialogs, forms, etc.) in isolation before production use.\",\n icon: Grid,\n color: \"indigo\",\n path: \"core-components\",\n component: lazy(() => import(\"./pages/PlayCoreComponents\")),\n group: \"Components\",\n order: 0,\n },\n {\n id: \"sonnet.advanced-components\",\n title: \"Advanced Components\",\n description:\n \"Multi-step workflows (Stepper) and hierarchical data structures (TreeView) with keyboard navigation and selection.\",\n icon: Layers,\n color: \"emerald\",\n path: \"advanced-components\",\n component: lazy(() => import(\"./pages/PlayAdvancedComponents\")),\n group: \"Components\",\n order: 1,\n },\n {\n id: \"sonnet.json-editor\",\n title: \"JSON Editor\",\n description:\n \"Constrained JSON editor with selectively editable regions using JSON Pointer (RFC 6901). Readonly sections are visible but locked.\",\n icon: Braces,\n color: \"amber\",\n path: \"json-editor\",\n component: lazy(() => import(\"./pages/PlayJsonEditor\")),\n group: \"Components\",\n order: 2,\n },\n {\n id: \"sonnet.form-components\",\n title: \"Form Components\",\n description:\n \"Test custom Form wrapper components with labels, descriptions, and error states. Includes Input, Textarea, Number, Checkbox, Select, MultiSelect, and Tags.\",\n icon: Check,\n color: \"blue\",\n path: \"form-components\",\n component: lazy(() => import(\"./pages/PlayFormComponents\")),\n group: \"Forms\",\n order: 0,\n },\n {\n id: \"sonnet.forms\",\n title: \"Forms Renderer\",\n description:\n \"Test and experiment with the JsonSchemaFormRenderer component. Try different schemas and see real-time validation.\",\n icon: Edit,\n color: \"purple\",\n path: \"forms\",\n component: lazy(() => import(\"./pages/PlayForms\")),\n group: \"Forms\",\n order: 1,\n },\n {\n id: \"sonnet.form-widgets\",\n title: \"Form Widgets\",\n description:\n \"Pluggable field components consumed by the Forms Renderer. Each widget maps to a JSON Schema type or format and can be swapped independently.\",\n icon: Package,\n color: \"indigo\",\n path: \"form-widgets\",\n component: lazy(() => import(\"./pages/PlayFormWidgets\")),\n group: \"Forms\",\n order: 2,\n },\n {\n id: \"sonnet.data-components\",\n title: \"Data Components\",\n description:\n \"Interactive sandbox for SearchInput (simple and faceted mode) and EntityTable. Includes a live table wired to the faceted search.\",\n icon: Table2,\n color: \"teal\",\n path: \"data-components\",\n component: lazy(() => import(\"./pages/PlayDataComponents\")),\n group: \"Data\",\n order: 0,\n },\n {\n id: \"sonnet.graph\",\n title: \"Graph Visualization\",\n description:\n \"Interactive property graph visualization with dual renderer support (Cytoscape, Reagraph). Org hierarchy demo with filtering, selection, and exploration.\",\n icon: Network,\n color: \"cyan\",\n path: \"graph\",\n component: lazy(() => import(\"./pages/PlayGraph\")),\n group: \"Graph\",\n order: 0,\n },\n {\n id: \"sonnet.shell-api\",\n title: \"Shell API\",\n description:\n \"Interactive demo of the shell API: notifications, dialogs, programmatic navigation, slide-over panels, the resizable sidePane, and the Cmd+K command menu.\",\n icon: SquareTerminal,\n color: \"orange\",\n path: \"shell-api\",\n component: lazy(() => import(\"./pages/PlayShellApi\")),\n group: \"Shell\",\n order: 0,\n },\n];\n","/**\n * Factory that turns a PlaygroundRegistry into a ShellModule.\n *\n * Generates routes (lazy + Suspense), sidebar navigation, and the\n * overview index page -- all derived from the registry entries.\n * The consumer just passes a registry and optional overrides.\n */\nimport React, { Suspense } from \"react\";\nimport { FlaskConical } from \"lucide-react\";\nimport type { ShellModule, NavGroup } from \"@petrarca/sonnet-shell\";\nimport type { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport type { PlaygroundModuleOptions } from \"./types\";\nimport { PlaygroundOverview } from \"./PlaygroundOverview\";\n\n/**\n * Build sidebar navigation groups from registry entries.\n *\n * Groups entries by their `group` field. Each group becomes a NavGroup\n * with a heading. Ungrouped entries go into a \"General\" group.\n */\nfunction buildNavigation(\n registry: PlaygroundRegistry,\n basePath: string,\n): NavGroup[] {\n const groups = registry.getGrouped();\n const navGroups: NavGroup[] = [];\n\n // Overview link is always first\n const overviewGroup: NavGroup = {\n id: \"playground-overview\",\n links: [{ label: \"Overview\", path: basePath }],\n };\n navGroups.push(overviewGroup);\n\n for (const [groupLabel, entries] of groups) {\n navGroups.push({\n id: `playground-${groupLabel.toLowerCase().replace(/\\s+/g, \"-\")}`,\n heading: groupLabel,\n links: entries.map((e) => ({\n label: e.title,\n path: `${basePath}/${e.path}`,\n })),\n });\n }\n\n return navGroups;\n}\n\n/** Wrap a component in Suspense for lazy loading. */\nfunction suspended(Component: React.ComponentType): React.ReactElement {\n return (\n <Suspense>\n <Component />\n </Suspense>\n );\n}\n\n/**\n * Create a ShellModule for the playground.\n *\n * Returns a complete module definition ready to pass to\n * createModuleRegistry(). Routes, navigation, and the overview page\n * are all generated from the registry.\n */\nexport function createPlaygroundModule(\n registry: PlaygroundRegistry,\n options: PlaygroundModuleOptions = {},\n): ShellModule {\n const {\n icon = FlaskConical,\n label = \"Playground\",\n basePath = \"/playground\",\n overviewTitle = \"Developer Playground\",\n overviewSubtitle = \"Experiment with components, test features, and explore capabilities.\",\n grouped = true,\n } = options;\n\n // Strip leading slash for route paths (React Router relative convention)\n const routeBase = basePath.replace(/^\\//, \"\");\n\n const routes = [\n {\n path: routeBase,\n element: suspended(() => (\n <PlaygroundOverview\n registry={registry}\n basePath={basePath}\n title={overviewTitle}\n subtitle={overviewSubtitle}\n grouped={grouped}\n />\n )),\n },\n ...registry.getAll().map((entry) => ({\n path: `${routeBase}/${entry.path}`,\n element: suspended(entry.component),\n })),\n ];\n\n return {\n id: \"playground\",\n label,\n icon,\n basePath,\n pinBottom: true,\n navigation: buildNavigation(registry, basePath),\n routes,\n };\n}\n","/**\n * PlaygroundOverview -- tile grid rendered from a PlaygroundRegistry.\n *\n * Displays cards with colored icons. Clicking a card navigates to the\n * playground page. A toggle in the header lets the user switch between\n * grouped (by category) and flat (all tiles) views.\n */\nimport React, { useState } from \"react\";\nimport { useNavigate } from \"react-router-dom\";\nimport { LayoutGrid, List } from \"lucide-react\";\nimport { Card, Button, SimpleTooltip } from \"@petrarca/sonnet-ui\";\nimport type { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport type { PlaygroundColor, PlaygroundEntry } from \"./types\";\n\n// Maps colour name to icon container classes (bg-*-100 text-*-600 pairing).\nconst COLOR_CLASSES: Record<PlaygroundColor, string> = {\n blue: \"bg-blue-100 text-blue-600\",\n violet: \"bg-violet-100 text-violet-600\",\n indigo: \"bg-indigo-100 text-indigo-600\",\n purple: \"bg-purple-100 text-purple-600\",\n teal: \"bg-teal-100 text-teal-600\",\n amber: \"bg-amber-100 text-amber-600\",\n emerald: \"bg-emerald-100 text-emerald-600\",\n rose: \"bg-rose-100 text-rose-600\",\n orange: \"bg-orange-100 text-orange-600\",\n cyan: \"bg-cyan-100 text-cyan-600\",\n};\n\nconst TILE_GRID = \"grid grid-cols-1 sm:grid-cols-2 2xl:grid-cols-3 gap-6\";\n\ninterface PlaygroundOverviewProps {\n registry: PlaygroundRegistry;\n basePath: string;\n title: string;\n subtitle: string;\n /** Initial grouping state. Defaults to true. User can toggle at runtime. */\n grouped?: boolean;\n}\n\ninterface TileProps {\n item: PlaygroundEntry;\n onNavigate: (path: string) => void;\n}\n\n/** A single playground tile card. */\nfunction PlaygroundTile({ item, onNavigate }: TileProps): React.ReactElement {\n return (\n <Card\n className=\"cursor-pointer shadow-sm border rounded-md p-6 transition-transform duration-200 motion-safe:hover:-translate-y-1\"\n onClick={() => onNavigate(item.path)}\n >\n <div className=\"flex items-center mb-4\">\n <div\n className={`flex items-center justify-center w-9 h-9 rounded-md ${COLOR_CLASSES[item.color] ?? COLOR_CLASSES.blue}`}\n >\n <item.icon size={18} />\n </div>\n </div>\n <h3 className=\"heading-section mb-1\">{item.title}</h3>\n <p className=\"text-sm text-muted-foreground\">{item.description}</p>\n </Card>\n );\n}\n\n/** Developer playground overview -- card grid linking to all registered pages. */\nexport function PlaygroundOverview({\n registry,\n basePath,\n title,\n subtitle,\n grouped: initialGrouped = true,\n}: PlaygroundOverviewProps): React.ReactElement {\n const navigate = useNavigate();\n const [grouped, setGrouped] = useState(initialGrouped);\n\n const handleNavigate = (path: string) => navigate(`${basePath}/${path}`);\n\n return (\n <div className=\"w-full\">\n <div className=\"flex items-start justify-between mb-6\">\n <div>\n <h1 className=\"mb-1\">{title}</h1>\n <p className=\"text-sm text-muted-foreground\">{subtitle}</p>\n </div>\n <SimpleTooltip label={grouped ? \"Show flat list\" : \"Group by category\"}>\n <Button\n variant=\"ghost\"\n size=\"icon\"\n onClick={() => setGrouped((v) => !v)}\n >\n {grouped ? (\n <LayoutGrid className=\"h-4 w-4\" />\n ) : (\n <List className=\"h-4 w-4\" />\n )}\n </Button>\n </SimpleTooltip>\n </div>\n\n {grouped ? (\n registry.getGrouped().map(([groupLabel, entries]) => (\n <div key={groupLabel} className=\"mb-8\">\n <h2 className=\"text-sm font-medium text-muted-foreground uppercase tracking-wider mb-4\">\n {groupLabel}\n </h2>\n <div className={TILE_GRID}>\n {entries.map((item) => (\n <PlaygroundTile\n key={item.id}\n item={item}\n onNavigate={handleNavigate}\n />\n ))}\n </div>\n </div>\n ))\n ) : (\n <div className={TILE_GRID}>\n {registry.getAll().map((item) => (\n <PlaygroundTile\n key={item.id}\n item={item}\n onNavigate={handleNavigate}\n />\n ))}\n </div>\n )}\n </div>\n );\n}\n","/**\n * @petrarca/sonnet-playground\n *\n * Playground framework and built-in component demos for the Petrarca\n * Sonnet component library.\n *\n * Usage:\n *\n * import {\n * createPlaygroundRegistry,\n * createPlaygroundModule,\n * } from \"@petrarca/sonnet-playground\";\n *\n * const playground = createPlaygroundRegistry();\n * // Optionally register additional entries:\n * playground.register({ id: \"app.custom\", ... });\n *\n * const playgroundModule = createPlaygroundModule(playground);\n */\n\nimport { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nimport { builtinEntries } from \"./builtinEntries\";\n\n// Framework\nexport { PlaygroundRegistry } from \"./PlaygroundRegistry\";\nexport { createPlaygroundModule } from \"./createPlaygroundModule\";\nexport { PlaygroundOverview } from \"./PlaygroundOverview\";\nexport { PlaygroundSection } from \"./PlaygroundSection\";\n\n// Types\nexport type {\n PlaygroundEntry,\n PlaygroundColor,\n PlaygroundModuleOptions,\n} from \"./types\";\n\n// Built-in entries (for selective use or extending)\nexport { builtinEntries } from \"./builtinEntries\";\n\n/**\n * Convenience factory: creates a new PlaygroundRegistry pre-populated\n * with all built-in sonnet component demos.\n */\nexport function createPlaygroundRegistry(): PlaygroundRegistry {\n const registry = new PlaygroundRegistry();\n registry.registerAll(builtinEntries);\n return registry;\n}\n"],"mappings":"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","names":["jsx"]}
|
package/dist/pages/index.d.ts
CHANGED
|
@@ -6,19 +6,15 @@ declare function PlayTypography(): React.ReactElement;
|
|
|
6
6
|
/** Color Palette playground -- living reference for the design system color tokens. */
|
|
7
7
|
declare function PlayColorPalette(): React.ReactElement;
|
|
8
8
|
|
|
9
|
+
/** PlayCoreComponents — showcase for all core UI primitives. */
|
|
10
|
+
declare function PlayCoreComponents(): react_jsx_runtime.JSX.Element;
|
|
11
|
+
|
|
9
12
|
/**
|
|
10
|
-
*
|
|
13
|
+
* PlayAdvancedComponents — Stepper and TreeView demos.
|
|
11
14
|
*
|
|
12
|
-
*
|
|
13
|
-
* before they are used in production. Each component is tested "in-vitro" here first.
|
|
14
|
-
*
|
|
15
|
-
* Structure:
|
|
16
|
-
* - Each component type gets its own section
|
|
17
|
-
* - Show all variants, states, and edge cases
|
|
18
|
-
* - Interactive examples where applicable
|
|
19
|
-
* - Use simple HTML/Tailwind for layout (no Mantine)
|
|
15
|
+
* Split from PlayCoreComponents to keep files manageable.
|
|
20
16
|
*/
|
|
21
|
-
declare function
|
|
17
|
+
declare function PlayAdvancedComponents(): react_jsx_runtime.JSX.Element;
|
|
22
18
|
|
|
23
19
|
/**
|
|
24
20
|
* Playground page for the JsonEditor component.
|
|
@@ -66,4 +62,23 @@ declare function PlayFormWidgets(): react_jsx_runtime.JSX.Element;
|
|
|
66
62
|
/** Playground sandbox for SearchInput, EntitySelect, and EntityTable. */
|
|
67
63
|
declare function PlayDataComponents(): React.ReactElement;
|
|
68
64
|
|
|
69
|
-
|
|
65
|
+
/**
|
|
66
|
+
* Playground page for @petrarca/sonnet-graph.
|
|
67
|
+
* Accessible at /playground/graph
|
|
68
|
+
*
|
|
69
|
+
* Demonstrates graph visualization with static mock data -- no backend required.
|
|
70
|
+
* Uses the GraphStoresContext provider pattern that consumers like explorer
|
|
71
|
+
* and Atlas would use to wire their own stores.
|
|
72
|
+
*/
|
|
73
|
+
|
|
74
|
+
declare function PlayGraph(): React.ReactElement;
|
|
75
|
+
|
|
76
|
+
/**
|
|
77
|
+
* PlayShellApi -- playground page that exercises the shell API surface.
|
|
78
|
+
*
|
|
79
|
+
* Covers: notification, dialog, navigation, panel, sidePane,
|
|
80
|
+
* and the command menu (Cmd+K).
|
|
81
|
+
*/
|
|
82
|
+
declare function PlayShellApi(): react_jsx_runtime.JSX.Element;
|
|
83
|
+
|
|
84
|
+
export { PlayAdvancedComponents, PlayColorPalette, PlayCoreComponents, PlayDataComponents, PlayFormComponents, PlayFormWidgets, PlayForms, PlayGraph, PlayJsonEditor, PlayShellApi, PlayTypography };
|
package/dist/pages/index.js
CHANGED
|
@@ -1,36 +1,48 @@
|
|
|
1
|
+
import {
|
|
2
|
+
PlayForms
|
|
3
|
+
} from "../chunk-6DZ3TSV4.js";
|
|
1
4
|
import {
|
|
2
5
|
PlayFormWidgets
|
|
3
|
-
} from "../chunk-
|
|
6
|
+
} from "../chunk-DZB6WFHA.js";
|
|
4
7
|
import {
|
|
5
8
|
PlayDataComponents
|
|
6
|
-
} from "../chunk-
|
|
9
|
+
} from "../chunk-DKLALDHR.js";
|
|
10
|
+
import {
|
|
11
|
+
PlayGraph
|
|
12
|
+
} from "../chunk-SBKZRIJC.js";
|
|
13
|
+
import {
|
|
14
|
+
PlayShellApi
|
|
15
|
+
} from "../chunk-4S2ITDB3.js";
|
|
7
16
|
import {
|
|
8
17
|
PlayTypography
|
|
9
|
-
} from "../chunk-
|
|
18
|
+
} from "../chunk-7IBZEHLI.js";
|
|
10
19
|
import {
|
|
11
20
|
PlayColorPalette
|
|
12
|
-
} from "../chunk-
|
|
13
|
-
import "../chunk-FTN2A5YL.js";
|
|
21
|
+
} from "../chunk-DA3BIB5N.js";
|
|
14
22
|
import {
|
|
15
23
|
PlayCoreComponents
|
|
16
|
-
} from "../chunk-
|
|
24
|
+
} from "../chunk-QCK2M4KD.js";
|
|
25
|
+
import {
|
|
26
|
+
PlayAdvancedComponents
|
|
27
|
+
} from "../chunk-4Y4JFKAK.js";
|
|
17
28
|
import {
|
|
18
29
|
PlayJsonEditor
|
|
19
|
-
} from "../chunk-
|
|
30
|
+
} from "../chunk-FZ3ZC7VM.js";
|
|
20
31
|
import {
|
|
21
32
|
PlayFormComponents
|
|
22
|
-
} from "../chunk-
|
|
23
|
-
import
|
|
24
|
-
PlayForms
|
|
25
|
-
} from "../chunk-QIETZUEN.js";
|
|
33
|
+
} from "../chunk-MT4ILA37.js";
|
|
34
|
+
import "../chunk-C2EZ2ECG.js";
|
|
26
35
|
export {
|
|
36
|
+
PlayAdvancedComponents,
|
|
27
37
|
PlayColorPalette,
|
|
28
38
|
PlayCoreComponents,
|
|
29
39
|
PlayDataComponents,
|
|
30
40
|
PlayFormComponents,
|
|
31
41
|
PlayFormWidgets,
|
|
32
42
|
PlayForms,
|
|
43
|
+
PlayGraph,
|
|
33
44
|
PlayJsonEditor,
|
|
45
|
+
PlayShellApi,
|
|
34
46
|
PlayTypography
|
|
35
47
|
};
|
|
36
48
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@petrarca/sonnet-playground",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Playground framework and built-in component demos for the Petrarca Sonnet component library",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"publishConfig": {
|
|
@@ -26,10 +26,11 @@
|
|
|
26
26
|
"lucide-react": "^0.553.0",
|
|
27
27
|
"sonner": "^2.0.7",
|
|
28
28
|
"zod": "^4.3.6",
|
|
29
|
-
"@petrarca/sonnet-
|
|
30
|
-
"@petrarca/sonnet-ui": "0.
|
|
31
|
-
"@petrarca/sonnet-
|
|
32
|
-
"@petrarca/sonnet-
|
|
29
|
+
"@petrarca/sonnet-core": "0.3.0",
|
|
30
|
+
"@petrarca/sonnet-ui": "0.3.0",
|
|
31
|
+
"@petrarca/sonnet-forms": "0.3.0",
|
|
32
|
+
"@petrarca/sonnet-shell": "0.3.0",
|
|
33
|
+
"@petrarca/sonnet-graph": "0.3.0"
|
|
33
34
|
},
|
|
34
35
|
"peerDependencies": {
|
|
35
36
|
"react": ">=19",
|