mirror of
https://github.com/johndoe6345789/metabuilder.git
synced 2026-04-24 22:04:56 +00:00
johndoe6345789
3ec49cfe8c
- Added `package_system.tla` to model the schema-driven package system, including multi-source loading, validation, dependency resolution, and permission filtering. - Created `package_system.cfg` for TLC model checker configuration, defining constants and invariants for bounded model checking. - Updated `metabuilder.tla` to reflect the core specification of MetaBuilder, emphasizing the package lifecycle and related specifications.
585 lines
20 KiB
JSON
585 lines
20 KiB
JSON
{
|
|
"$schema": "https://metabuilder.dev/schemas/json-script-components.schema.json",
|
|
"schemaVersion": "2.0.0",
|
|
"package": "dropdown_manager",
|
|
"description": "Dropdown configuration components for managing reusable option sets",
|
|
"components": [
|
|
{
|
|
"id": "dropdown_manager",
|
|
"name": "DropdownManager",
|
|
"description": "Main dropdown configuration management interface",
|
|
"props": [
|
|
{
|
|
"name": "tenantId",
|
|
"type": "string",
|
|
"required": true,
|
|
"description": "Current tenant ID"
|
|
}
|
|
],
|
|
"render": {
|
|
"type": "element",
|
|
"template": {
|
|
"type": "Box",
|
|
"className": "dropdown-manager",
|
|
"children": [
|
|
{
|
|
"type": "Paper",
|
|
"elevation": 1,
|
|
"sx": { "p": 3 },
|
|
"children": [
|
|
{
|
|
"type": "Stack",
|
|
"direction": "row",
|
|
"justifyContent": "space-between",
|
|
"alignItems": "center",
|
|
"mb": 3,
|
|
"children": [
|
|
{
|
|
"type": "Typography",
|
|
"variant": "h5",
|
|
"children": "Dropdown Manager"
|
|
},
|
|
{
|
|
"type": "Button",
|
|
"variant": "contained",
|
|
"startIcon": {
|
|
"type": "Icon",
|
|
"name": "Add"
|
|
},
|
|
"onClick": "{{handleCreateDropdown}}",
|
|
"children": "New Dropdown"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TextField",
|
|
"placeholder": "Search dropdowns...",
|
|
"value": "{{searchQuery}}",
|
|
"onChange": "{{handleSearchChange}}",
|
|
"size": "small",
|
|
"fullWidth": true,
|
|
"sx": { "mb": 3 },
|
|
"InputProps": {
|
|
"startAdornment": {
|
|
"type": "InputAdornment",
|
|
"position": "start",
|
|
"children": [
|
|
{
|
|
"type": "Icon",
|
|
"name": "Search"
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"type": "Grid",
|
|
"container": true,
|
|
"spacing": 2,
|
|
"children": [
|
|
{
|
|
"type": "each",
|
|
"items": "{{filteredDropdowns}}",
|
|
"as": "dropdown",
|
|
"render": {
|
|
"type": "Grid",
|
|
"item": true,
|
|
"xs": 12,
|
|
"sm": 6,
|
|
"md": 4,
|
|
"children": [
|
|
{
|
|
"type": "Card",
|
|
"variant": "outlined",
|
|
"sx": { "height": "100%" },
|
|
"children": [
|
|
{
|
|
"type": "CardContent",
|
|
"children": [
|
|
{
|
|
"type": "Stack",
|
|
"spacing": 1,
|
|
"children": [
|
|
{
|
|
"type": "Typography",
|
|
"variant": "subtitle1",
|
|
"fontWeight": "bold",
|
|
"children": "{{dropdown.name}}"
|
|
},
|
|
{
|
|
"type": "Typography",
|
|
"variant": "body2",
|
|
"color": "textSecondary",
|
|
"children": "{{dropdown.description || 'No description'}}"
|
|
},
|
|
{
|
|
"type": "Typography",
|
|
"variant": "caption",
|
|
"color": "textSecondary",
|
|
"children": "{{dropdown.options.length}} options"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "CardActions",
|
|
"children": [
|
|
{
|
|
"type": "Button",
|
|
"size": "small",
|
|
"onClick": "{{() => handlePreview(dropdown)}}",
|
|
"children": "Preview"
|
|
},
|
|
{
|
|
"type": "Button",
|
|
"size": "small",
|
|
"onClick": "{{() => handleEdit(dropdown)}}",
|
|
"children": "Edit"
|
|
},
|
|
{
|
|
"type": "IconButton",
|
|
"size": "small",
|
|
"color": "error",
|
|
"onClick": "{{() => handleDelete(dropdown)}}",
|
|
"children": [
|
|
{
|
|
"type": "Icon",
|
|
"name": "Delete",
|
|
"fontSize": "small"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "conditional",
|
|
"condition": "{{editingDropdown}}",
|
|
"then": {
|
|
"type": "ComponentRef",
|
|
"ref": "dropdown_editor",
|
|
"props": {
|
|
"dropdown": "{{editingDropdown}}",
|
|
"isNew": "{{isNewDropdown}}",
|
|
"onSave": "{{handleSave}}",
|
|
"onClose": "{{handleCloseEditor}}"
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"type": "conditional",
|
|
"condition": "{{previewDropdown}}",
|
|
"then": {
|
|
"type": "ComponentRef",
|
|
"ref": "dropdown_preview",
|
|
"props": {
|
|
"dropdown": "{{previewDropdown}}",
|
|
"onClose": "{{handleClosePreview}}"
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"id": "dropdown_editor",
|
|
"name": "DropdownEditor",
|
|
"description": "Editor dialog for creating/editing dropdown configurations",
|
|
"props": [
|
|
{
|
|
"name": "dropdown",
|
|
"type": "object",
|
|
"required": false
|
|
},
|
|
{
|
|
"name": "isNew",
|
|
"type": "boolean",
|
|
"required": false,
|
|
"default": false
|
|
},
|
|
{
|
|
"name": "onSave",
|
|
"type": "function",
|
|
"required": true
|
|
},
|
|
{
|
|
"name": "onClose",
|
|
"type": "function",
|
|
"required": true
|
|
}
|
|
],
|
|
"render": {
|
|
"type": "element",
|
|
"template": {
|
|
"type": "Dialog",
|
|
"open": true,
|
|
"onClose": "{{onClose}}",
|
|
"maxWidth": "md",
|
|
"fullWidth": true,
|
|
"children": [
|
|
{
|
|
"type": "DialogTitle",
|
|
"children": "{{isNew ? 'Create New Dropdown' : 'Edit Dropdown'}}"
|
|
},
|
|
{
|
|
"type": "DialogContent",
|
|
"dividers": true,
|
|
"children": [
|
|
{
|
|
"type": "Stack",
|
|
"spacing": 3,
|
|
"sx": { "mt": 1 },
|
|
"children": [
|
|
{
|
|
"type": "TextField",
|
|
"label": "Dropdown Name",
|
|
"value": "{{formData.name}}",
|
|
"onChange": "{{handleFieldChange('name')}}",
|
|
"fullWidth": true,
|
|
"required": true,
|
|
"placeholder": "e.g., countries, status_options"
|
|
},
|
|
{
|
|
"type": "TextField",
|
|
"label": "Description",
|
|
"value": "{{formData.description}}",
|
|
"onChange": "{{handleFieldChange('description')}}",
|
|
"fullWidth": true,
|
|
"multiline": true,
|
|
"rows": 2,
|
|
"placeholder": "Describe what this dropdown is used for"
|
|
},
|
|
{
|
|
"type": "Divider"
|
|
},
|
|
{
|
|
"type": "ComponentRef",
|
|
"ref": "options_list",
|
|
"props": {
|
|
"options": "{{formData.options}}",
|
|
"onChange": "{{handleOptionsChange}}"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "DialogActions",
|
|
"children": [
|
|
{
|
|
"type": "Button",
|
|
"onClick": "{{onClose}}",
|
|
"children": "Cancel"
|
|
},
|
|
{
|
|
"type": "Button",
|
|
"variant": "contained",
|
|
"onClick": "{{handleSave}}",
|
|
"disabled": "{{!formData.name || formData.options.length === 0}}",
|
|
"children": "{{isNew ? 'Create' : 'Save'}}"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"id": "options_list",
|
|
"name": "OptionsList",
|
|
"description": "Editable list of dropdown options with value/label pairs",
|
|
"props": [
|
|
{
|
|
"name": "options",
|
|
"type": "array",
|
|
"required": true,
|
|
"description": "Array of {value, label} objects"
|
|
},
|
|
{
|
|
"name": "onChange",
|
|
"type": "function",
|
|
"required": true
|
|
}
|
|
],
|
|
"render": {
|
|
"type": "element",
|
|
"template": {
|
|
"type": "Box",
|
|
"children": [
|
|
{
|
|
"type": "Stack",
|
|
"direction": "row",
|
|
"justifyContent": "space-between",
|
|
"alignItems": "center",
|
|
"mb": 2,
|
|
"children": [
|
|
{
|
|
"type": "Typography",
|
|
"variant": "subtitle1",
|
|
"children": "Options"
|
|
},
|
|
{
|
|
"type": "Button",
|
|
"size": "small",
|
|
"startIcon": {
|
|
"type": "Icon",
|
|
"name": "Add"
|
|
},
|
|
"onClick": "{{handleAddOption}}",
|
|
"children": "Add Option"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TableContainer",
|
|
"component": "Paper",
|
|
"variant": "outlined",
|
|
"children": [
|
|
{
|
|
"type": "Table",
|
|
"size": "small",
|
|
"children": [
|
|
{
|
|
"type": "TableHead",
|
|
"children": [
|
|
{
|
|
"type": "TableRow",
|
|
"children": [
|
|
{
|
|
"type": "TableCell",
|
|
"sx": { "width": 40 },
|
|
"children": ""
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"children": "Value"
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"children": "Label"
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"align": "right",
|
|
"children": "Actions"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TableBody",
|
|
"children": [
|
|
{
|
|
"type": "each",
|
|
"items": "{{options}}",
|
|
"as": "option",
|
|
"index": "idx",
|
|
"render": {
|
|
"type": "TableRow",
|
|
"children": [
|
|
{
|
|
"type": "TableCell",
|
|
"children": [
|
|
{
|
|
"type": "Icon",
|
|
"name": "DragIndicator",
|
|
"color": "action",
|
|
"sx": { "cursor": "grab" }
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"children": [
|
|
{
|
|
"type": "TextField",
|
|
"value": "{{option.value}}",
|
|
"onChange": "{{(e) => handleOptionChange(idx, 'value', e.target.value)}}",
|
|
"size": "small",
|
|
"fullWidth": true,
|
|
"placeholder": "value"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"children": [
|
|
{
|
|
"type": "TextField",
|
|
"value": "{{option.label}}",
|
|
"onChange": "{{(e) => handleOptionChange(idx, 'label', e.target.value)}}",
|
|
"size": "small",
|
|
"fullWidth": true,
|
|
"placeholder": "Display Label"
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "TableCell",
|
|
"align": "right",
|
|
"children": [
|
|
{
|
|
"type": "IconButton",
|
|
"size": "small",
|
|
"color": "error",
|
|
"onClick": "{{() => handleRemoveOption(idx)}}",
|
|
"children": [
|
|
{
|
|
"type": "Icon",
|
|
"name": "Delete",
|
|
"fontSize": "small"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "conditional",
|
|
"condition": "{{options.length === 0}}",
|
|
"then": {
|
|
"type": "Alert",
|
|
"severity": "info",
|
|
"sx": { "mt": 2 },
|
|
"children": "No options defined. Click \"Add Option\" to get started."
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
},
|
|
{
|
|
"id": "dropdown_preview",
|
|
"name": "DropdownPreview",
|
|
"description": "Live preview of a dropdown configuration",
|
|
"props": [
|
|
{
|
|
"name": "dropdown",
|
|
"type": "object",
|
|
"required": true
|
|
},
|
|
{
|
|
"name": "onClose",
|
|
"type": "function",
|
|
"required": true
|
|
}
|
|
],
|
|
"render": {
|
|
"type": "element",
|
|
"template": {
|
|
"type": "Dialog",
|
|
"open": true,
|
|
"onClose": "{{onClose}}",
|
|
"maxWidth": "sm",
|
|
"fullWidth": true,
|
|
"children": [
|
|
{
|
|
"type": "DialogTitle",
|
|
"children": "Preview: {{dropdown.name}}"
|
|
},
|
|
{
|
|
"type": "DialogContent",
|
|
"children": [
|
|
{
|
|
"type": "Stack",
|
|
"spacing": 3,
|
|
"sx": { "mt": 1 },
|
|
"children": [
|
|
{
|
|
"type": "Typography",
|
|
"variant": "body2",
|
|
"color": "textSecondary",
|
|
"children": "{{dropdown.description || 'No description'}}"
|
|
},
|
|
{
|
|
"type": "Divider"
|
|
},
|
|
{
|
|
"type": "FormControl",
|
|
"fullWidth": true,
|
|
"children": [
|
|
{
|
|
"type": "InputLabel",
|
|
"children": "{{dropdown.name}}"
|
|
},
|
|
{
|
|
"type": "Select",
|
|
"value": "{{previewValue}}",
|
|
"onChange": "{{handlePreviewChange}}",
|
|
"label": "{{dropdown.name}}",
|
|
"children": [
|
|
{
|
|
"type": "each",
|
|
"items": "{{dropdown.options}}",
|
|
"as": "opt",
|
|
"render": {
|
|
"type": "MenuItem",
|
|
"value": "{{opt.value}}",
|
|
"children": "{{opt.label}}"
|
|
}
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "conditional",
|
|
"condition": "{{previewValue}}",
|
|
"then": {
|
|
"type": "Alert",
|
|
"severity": "success",
|
|
"children": "Selected value: {{previewValue}}"
|
|
}
|
|
},
|
|
{
|
|
"type": "Box",
|
|
"children": [
|
|
{
|
|
"type": "Typography",
|
|
"variant": "caption",
|
|
"color": "textSecondary",
|
|
"children": "Total options: {{dropdown.options.length}}"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
]
|
|
},
|
|
{
|
|
"type": "DialogActions",
|
|
"children": [
|
|
{
|
|
"type": "Button",
|
|
"onClick": "{{onClose}}",
|
|
"children": "Close"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|