feat: migrate Phase 12 components with registry updates (Phase 11 continuation)

Added 3 additional JSON component definitions and interfaces:
- ComponentTreeDemoPage: Demo page for component tree visualization
- JsonFlaskDesigner: Designer for Flask app config using JSON
- JsonStyleDesigner: Designer for styling config using JSON

Changes:
- Created 2 JSON definitions in src/components/json-definitions/
- Created 3 TypeScript interfaces in src/lib/json-ui/interfaces/
- Updated interfaces/index.ts to export all new interfaces
- Updated json-components.ts exports for all 3 new components
- Updated json-components-registry.json with 3 new entries
- Updated registry statistics: 373 → 376 total, 223 → 226 JSON-compatible

Build status: PASS ✓
All components verified and building successfully.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>

src/components/json-definitions/component-tree-demo-page.json

@@ -0,0 +1,16 @@
+{
+  "id": "component-tree-demo-page",
+  "type": "div",
+  "bindings": {
+    "className": {
+      "source": null,
+      "transform": "'h-full'"
+    }
+  },
+  "children": [
+    {
+      "id": "component-tree-viewer",
+      "type": "ComponentTreeViewer"
+    }
+  ]
+}

src/components/json-definitions/json-style-designer.json

@@ -0,0 +1,7 @@
+{
+  "id": "json-style-designer",
+  "type": "JSONPageRenderer",
+  "props": {
+    "schema": "styleDesignerConfig"
+  }
+}

src/lib/json-ui/interfaces/component-tree-demo-page.ts

@@ -0,0 +1 @@
+export interface ComponentTreeDemoPageProps {}

src/lib/json-ui/interfaces/index.ts

@@ -206,6 +206,9 @@ export * from './error-panel'
 export * from './preview-dialog'
 export * from './not-found-page'
 export * from './global-search'
+export * from './json-flask-designer'
+export * from './json-style-designer'
+export * from './component-tree-demo-page'
 export * from './atomic-component-showcase'
 export * from './json-ui-showcase-page'
 export * from './json-demo-page'

src/lib/json-ui/interfaces/json-flask-designer.ts

@@ -0,0 +1,3 @@
+export interface JSONFlaskDesignerProps {
+  schema?: any
+}

src/lib/json-ui/interfaces/json-style-designer.ts

@@ -0,0 +1,3 @@
+export interface JSONStyleDesignerProps {
+  schema?: any
+}

src/lib/json-ui/json-components.ts

@@ -224,6 +224,9 @@ import type {
   NotFoundPageProps,
   GlobalSearchProps,
   FileExplorerProps,
+  JSONFlaskDesignerProps,
+  JSONStyleDesignerProps,
+  ComponentTreeDemoPageProps,
   AtomicComponentShowcaseProps,
   JSONUIShowcasePageProps,
   JSONDemoPageProps,
@@ -453,6 +456,9 @@ import previewDialogDef from '@/components/json-definitions/preview-dialog.json'
 import notFoundPageDef from '@/components/json-definitions/not-found-page.json'
 import globalSearchDef from '@/components/json-definitions/global-search.json'
 import fileExplorerDef from '@/components/json-definitions/file-explorer.json'
+import jsonFlaskDesignerDef from '@/components/json-definitions/json-flask-designer.json'
+import jsonStyleDesignerDef from '@/components/json-definitions/json-style-designer.json'
+import componentTreeDemoPageDef from '@/components/json-definitions/component-tree-demo-page.json'
 import atomicComponentShowcaseDef from '@/components/json-definitions/atomic-component-showcase.json'
 import jsonUiShowcasePageDef from '@/components/json-definitions/json-ui-showcase-page.json'
 import jsonDemoPageDef from '@/components/json-definitions/json-demo-page.json'
@@ -827,6 +833,9 @@ export const PreviewDialog = createJsonComponent<PreviewDialogProps>(previewDial
 export const NotFoundPage = createJsonComponent<NotFoundPageProps>(notFoundPageDef)
 export const GlobalSearch = createJsonComponent<GlobalSearchProps>(globalSearchDef)
 export const FileExplorer = createJsonComponent<FileExplorerProps>(fileExplorerDef)
+export const JSONFlaskDesigner = createJsonComponent<JSONFlaskDesignerProps>(jsonFlaskDesignerDef)
+export const JSONStyleDesigner = createJsonComponent<JSONStyleDesignerProps>(jsonStyleDesignerDef)
+export const ComponentTreeDemoPage = createJsonComponent<ComponentTreeDemoPageProps>(componentTreeDemoPageDef)
 export const AtomicComponentShowcase = createJsonComponent<AtomicComponentShowcaseProps>(atomicComponentShowcaseDef)
 export const JSONUIShowcasePage = createJsonComponent<JSONUIShowcasePageProps>(jsonUiShowcasePageDef)
 export const JSONDemoPage = createJsonComponent<JSONDemoPageProps>(jsonDemoPageDef)