- Introduced `menu.json` for menu component structure with bindings for trigger and content. - Created `password-input.json` for password input handling visibility and value changes. - Added `popover.json` for popover component with trigger and content bindings. feat: Implement custom hooks for UI interactions - Added `useAccordion` for managing accordion state with single/multiple item support. - Created `useBindingEditor` for managing bindings in a dynamic editor. - Implemented `useCopyState` for clipboard copy functionality with feedback. - Developed `useFileUpload` for handling file uploads with drag-and-drop support. - Introduced `useFocusState` for managing focus state in components. - Created `useImageState` for handling image loading and error states. - Added `useMenuState` for managing menu interactions and item clicks. - Implemented `usePasswordVisibility` for toggling password visibility. - Developed `usePopoverState` for managing popover visibility and interactions. feat: Add constants and interfaces for JSON UI components - Introduced constants for sizes, placements, styles, and object-fit handling. - Created interfaces for various components including Accordion, Binding Editor, Copy Button, Data Source Editor, File Upload, and more. - Added type definitions for menu items, popover props, and other UI elements to enhance type safety and maintainability.
2.4 KiB
Update for Current State section (lines 8-15)
- ~400 TSX files in
src/components/(legacy - being phased out) - 338 JSON definitions in
src/config/pages/(target architecture) - 342 entries in
json-components-registry.json - 27 complete JSON implementations in
src/components/json-definitions/ - 141 duplicate TSX files deleted (had JSON equivalents)
- ✅ ALL ATOMS CONVERTED! (0 remaining)
- 1 molecule remaining: BindingEditor
- 3 organisms remaining: DataSourceManager, NavigationMenu, TreeListPanel
Update for atoms section (lines 28-34)
│ ├── atoms/ # ✅ ALL CONVERTED! (0 TSX remaining) │ │ └── json-ui/ # JSON-specific atoms
Update for json-definitions (lines 41-57)
│ └── json-definitions/ # ✅ JSON implementations (27 files) │ ├── loading-fallback.json │ ├── navigation-item.json │ ├── page-header-content.json │ ├── component-binding-dialog.json │ ├── data-source-editor-dialog.json │ ├── github-build-status.json │ ├── save-indicator.json │ ├── component-tree.json │ ├── seed-data-manager.json │ ├── lazy-d3-bar-chart.json │ ├── storage-settings.json │ ├── tree-card.json │ ├── filter-input.json │ ├── copy-button.json │ ├── input.json │ ├── password-input.json │ ├── image.json │ ├── popover.json │ ├── menu.json │ ├── file-upload.json │ └── accordion.json
Update for hooks (lines 73-76)
│ ├── use-focus-state.ts # For FilterInput │ ├── use-copy-state.ts # For CopyButton │ ├── use-password-visibility.ts # For PasswordInput │ ├── use-image-state.ts # For Image │ ├── use-popover-state.ts # For Popover │ ├── use-menu-state.ts # For Menu │ ├── use-file-upload.ts # For FileUpload │ ├── use-accordion.ts # For Accordion
Update for json-components count (line 82)
│ ├── json-components.ts # JSON component exports (27 components)
Update for hooks-registry count (line 86)
│ ├── hooks-registry.ts # Hook registration (12 hooks registered)