@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.
Files changed (72) hide show
  1. package/dist/PlayAdvancedComponents-ZYK66UII.js +8 -0
  2. package/dist/PlayColorPalette-IWECRZUS.js +8 -0
  3. package/dist/PlayCoreComponents-F2OFSQZK.js +8 -0
  4. package/dist/PlayDataComponents-BA3NA225.js +8 -0
  5. package/dist/PlayFormComponents-MZC7CNES.js +8 -0
  6. package/dist/PlayFormWidgets-IWJJQ5XL.js +8 -0
  7. package/dist/PlayForms-FOF3XE6G.js +7 -0
  8. package/dist/PlayGraph-RHFIDAS3.js +7 -0
  9. package/dist/PlayJsonEditor-SYZYEJEA.js +7 -0
  10. package/dist/PlayJsonEditor-SYZYEJEA.js.map +1 -0
  11. package/dist/PlayShellApi-3T4FZPEV.js +8 -0
  12. package/dist/PlayShellApi-3T4FZPEV.js.map +1 -0
  13. package/dist/PlayTypography-T6SMPHUB.js +8 -0
  14. package/dist/PlayTypography-T6SMPHUB.js.map +1 -0
  15. package/dist/chunk-4S2ITDB3.js +322 -0
  16. package/dist/chunk-4S2ITDB3.js.map +1 -0
  17. package/dist/chunk-4Y4JFKAK.js +240 -0
  18. package/dist/chunk-4Y4JFKAK.js.map +1 -0
  19. package/dist/{chunk-QIETZUEN.js → chunk-6DZ3TSV4.js} +66 -71
  20. package/dist/chunk-6DZ3TSV4.js.map +1 -0
  21. package/dist/{chunk-CYNK2P2Q.js → chunk-7IBZEHLI.js} +14 -13
  22. package/dist/chunk-7IBZEHLI.js.map +1 -0
  23. package/dist/chunk-C2EZ2ECG.js +40 -0
  24. package/dist/chunk-C2EZ2ECG.js.map +1 -0
  25. package/dist/{chunk-A3IK3CVW.js → chunk-DA3BIB5N.js} +24 -25
  26. package/dist/{chunk-A3IK3CVW.js.map → chunk-DA3BIB5N.js.map} +1 -1
  27. package/dist/{chunk-TZGJH7YS.js → chunk-DKLALDHR.js} +325 -331
  28. package/dist/chunk-DKLALDHR.js.map +1 -0
  29. package/dist/chunk-DZB6WFHA.js +401 -0
  30. package/dist/chunk-DZB6WFHA.js.map +1 -0
  31. package/dist/{chunk-KAT24CQQ.js → chunk-FZ3ZC7VM.js} +8 -6
  32. package/dist/chunk-FZ3ZC7VM.js.map +1 -0
  33. package/dist/chunk-MT4ILA37.js +563 -0
  34. package/dist/chunk-MT4ILA37.js.map +1 -0
  35. package/dist/chunk-QCK2M4KD.js +907 -0
  36. package/dist/chunk-QCK2M4KD.js.map +1 -0
  37. package/dist/chunk-SBKZRIJC.js +316 -0
  38. package/dist/chunk-SBKZRIJC.js.map +1 -0
  39. package/dist/index.d.ts +10 -6
  40. package/dist/index.js +52 -16
  41. package/dist/index.js.map +1 -1
  42. package/dist/pages/index.d.ts +26 -11
  43. package/dist/pages/index.js +23 -11
  44. package/package.json +6 -5
  45. package/dist/PlayColorPalette-UFMTJTUB.js +0 -8
  46. package/dist/PlayCoreComponents-7QCDFQLT.js +0 -7
  47. package/dist/PlayDataComponents-GZSRTW4F.js +0 -7
  48. package/dist/PlayFormComponents-RJB6WZHD.js +0 -7
  49. package/dist/PlayFormWidgets-OFV7TJKH.js +0 -7
  50. package/dist/PlayForms-24XX5DC6.js +0 -7
  51. package/dist/PlayJsonEditor-4L5INQPU.js +0 -7
  52. package/dist/PlayTypography-ID6DLFZD.js +0 -8
  53. package/dist/chunk-5V27QDAY.js +0 -617
  54. package/dist/chunk-5V27QDAY.js.map +0 -1
  55. package/dist/chunk-CYNK2P2Q.js.map +0 -1
  56. package/dist/chunk-FTN2A5YL.js +0 -20
  57. package/dist/chunk-FTN2A5YL.js.map +0 -1
  58. package/dist/chunk-GYKEPHHA.js +0 -1154
  59. package/dist/chunk-GYKEPHHA.js.map +0 -1
  60. package/dist/chunk-KAT24CQQ.js.map +0 -1
  61. package/dist/chunk-P7I5IDXA.js +0 -432
  62. package/dist/chunk-P7I5IDXA.js.map +0 -1
  63. package/dist/chunk-QIETZUEN.js.map +0 -1
  64. package/dist/chunk-TZGJH7YS.js.map +0 -1
  65. /package/dist/{PlayColorPalette-UFMTJTUB.js.map → PlayAdvancedComponents-ZYK66UII.js.map} +0 -0
  66. /package/dist/{PlayCoreComponents-7QCDFQLT.js.map → PlayColorPalette-IWECRZUS.js.map} +0 -0
  67. /package/dist/{PlayDataComponents-GZSRTW4F.js.map → PlayCoreComponents-F2OFSQZK.js.map} +0 -0
  68. /package/dist/{PlayFormComponents-RJB6WZHD.js.map → PlayDataComponents-BA3NA225.js.map} +0 -0
  69. /package/dist/{PlayFormWidgets-OFV7TJKH.js.map → PlayFormComponents-MZC7CNES.js.map} +0 -0
  70. /package/dist/{PlayForms-24XX5DC6.js.map → PlayFormWidgets-IWJJQ5XL.js.map} +0 -0
  71. /package/dist/{PlayJsonEditor-4L5INQPU.js.map → PlayForms-FOF3XE6G.js.map} +0 -0
  72. /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-FTN2A5YL.js";
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-ID6DLFZD.js")),
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-UFMTJTUB.js")),
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-7QCDFQLT.js")),
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-4L5INQPU.js")),
143
+ component: lazy(() => import("./PlayJsonEditor-SYZYEJEA.js")),
130
144
  group: "Components",
131
- order: 1
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-RJB6WZHD.js")),
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-24XX5DC6.js")),
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-OFV7TJKH.js")),
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-GZSRTW4F.js")),
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-6", children: /* @__PURE__ */ jsx(
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-[50px] h-[50px] rounded-md ${COLOR_CLASSES[item.color] ?? COLOR_CLASSES.blue}`,
213
- children: /* @__PURE__ */ jsx(item.icon, { size: 28 })
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 py-12 px-4", children: [
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-lg text-muted-foreground", children: subtitle })
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"]}
@@ -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
- * PlayCoreComponents - Showcase for all core UI components
13
+ * PlayAdvancedComponents — Stepper and TreeView demos.
11
14
  *
12
- * This playground allows testing and visual verification of all core UI components
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 PlayCoreComponents(): react_jsx_runtime.JSX.Element;
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
- export { PlayColorPalette, PlayCoreComponents, PlayDataComponents, PlayFormComponents, PlayFormWidgets, PlayForms, PlayJsonEditor, PlayTypography };
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 };
@@ -1,36 +1,48 @@
1
+ import {
2
+ PlayForms
3
+ } from "../chunk-6DZ3TSV4.js";
1
4
  import {
2
5
  PlayFormWidgets
3
- } from "../chunk-P7I5IDXA.js";
6
+ } from "../chunk-DZB6WFHA.js";
4
7
  import {
5
8
  PlayDataComponents
6
- } from "../chunk-TZGJH7YS.js";
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-CYNK2P2Q.js";
18
+ } from "../chunk-7IBZEHLI.js";
10
19
  import {
11
20
  PlayColorPalette
12
- } from "../chunk-A3IK3CVW.js";
13
- import "../chunk-FTN2A5YL.js";
21
+ } from "../chunk-DA3BIB5N.js";
14
22
  import {
15
23
  PlayCoreComponents
16
- } from "../chunk-GYKEPHHA.js";
24
+ } from "../chunk-QCK2M4KD.js";
25
+ import {
26
+ PlayAdvancedComponents
27
+ } from "../chunk-4Y4JFKAK.js";
17
28
  import {
18
29
  PlayJsonEditor
19
- } from "../chunk-KAT24CQQ.js";
30
+ } from "../chunk-FZ3ZC7VM.js";
20
31
  import {
21
32
  PlayFormComponents
22
- } from "../chunk-5V27QDAY.js";
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.1.6",
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-forms": "0.1.6",
30
- "@petrarca/sonnet-ui": "0.1.6",
31
- "@petrarca/sonnet-shell": "0.1.6",
32
- "@petrarca/sonnet-core": "0.1.6"
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",
@@ -1,8 +0,0 @@
1
- import {
2
- PlayColorPalette
3
- } from "./chunk-A3IK3CVW.js";
4
- import "./chunk-FTN2A5YL.js";
5
- export {
6
- PlayColorPalette as default
7
- };
8
- //# sourceMappingURL=PlayColorPalette-UFMTJTUB.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayCoreComponents
3
- } from "./chunk-GYKEPHHA.js";
4
- export {
5
- PlayCoreComponents as default
6
- };
7
- //# sourceMappingURL=PlayCoreComponents-7QCDFQLT.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayDataComponents
3
- } from "./chunk-TZGJH7YS.js";
4
- export {
5
- PlayDataComponents as default
6
- };
7
- //# sourceMappingURL=PlayDataComponents-GZSRTW4F.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayFormComponents
3
- } from "./chunk-5V27QDAY.js";
4
- export {
5
- PlayFormComponents as default
6
- };
7
- //# sourceMappingURL=PlayFormComponents-RJB6WZHD.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayFormWidgets
3
- } from "./chunk-P7I5IDXA.js";
4
- export {
5
- PlayFormWidgets as default
6
- };
7
- //# sourceMappingURL=PlayFormWidgets-OFV7TJKH.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayForms
3
- } from "./chunk-QIETZUEN.js";
4
- export {
5
- PlayForms as default
6
- };
7
- //# sourceMappingURL=PlayForms-24XX5DC6.js.map
@@ -1,7 +0,0 @@
1
- import {
2
- PlayJsonEditor
3
- } from "./chunk-KAT24CQQ.js";
4
- export {
5
- PlayJsonEditor as default
6
- };
7
- //# sourceMappingURL=PlayJsonEditor-4L5INQPU.js.map
@@ -1,8 +0,0 @@
1
- import {
2
- PlayTypography
3
- } from "./chunk-CYNK2P2Q.js";
4
- import "./chunk-FTN2A5YL.js";
5
- export {
6
- PlayTypography as default
7
- };
8
- //# sourceMappingURL=PlayTypography-ID6DLFZD.js.map