@alepha/ui 0.16.1 → 0.17.0

package/dist/admin/AdminParameters-iQE8o7a7.js

@@ -0,0 +1,774 @@
+import { ActionButton, Flex, Text, TypeForm, useToast } from "@alepha/ui";
+import { jsonSchemaToTypeBox, t } from "alepha";
+import { IconArrowLeft, IconChevronDown, IconChevronRight, IconClock, IconFolder, IconFolderOpen, IconHistory, IconRefresh, IconSearch, IconSettings } from "@tabler/icons-react";
+import { Badge, Card, Code, Collapse, Flex as Flex$1, Loader, ScrollArea, TextInput, Timeline, UnstyledButton } from "@mantine/core";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useClient } from "alepha/react";
+import { useI18n } from "alepha/react/i18n";
+import { memo, useCallback, useEffect, useMemo, useState } from "react";
+import { useForm } from "alepha/react/form";
+
+//#region ../../src/admin/components/parameters/types.ts
+const getStatusColor = (status) => {
+	switch (status) {
+		case "current": return "green";
+		case "next": return "blue";
+		case "future": return "cyan";
+		case "expired": return "gray";
+		default: return "gray";
+	}
+};
+const formatJson = (obj) => {
+	try {
+		return JSON.stringify(obj, null, 2);
+	} catch {
+		return String(obj);
+	}
+};
+
+//#endregion
+//#region ../../src/admin/components/parameters/ParameterDetails.tsx
+/**
+* Loading state.
+*/
+const LoadingState = () => /* @__PURE__ */ jsx(Flex, {
+	flex: 1,
+	h: "100%",
+	p: "md",
+	style: {
+		overflow: "hidden",
+		minWidth: 0,
+		display: "flex"
+	},
+	children: /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		h: "100%",
+		children: /* @__PURE__ */ jsx(Loader, { size: "sm" })
+	})
+});
+/**
+* The actual form component - only rendered when a config is selected.
+*/
+const ConfigForm = ({ selectedConfig, configValue, saving, onSave }) => {
+	const { l } = useI18n();
+	const currentContent = useMemo(() => {
+		if (configValue?.current?.content) return configValue.current.content;
+		if (configValue?.currentValue !== void 0) return configValue.currentValue;
+		return null;
+	}, [configValue]);
+	const schemaForForm = useMemo(() => {
+		if (!configValue?.schema) return t.object({});
+		try {
+			return jsonSchemaToTypeBox(configValue.schema);
+		} catch {
+			return t.object({});
+		}
+	}, [configValue?.schema]);
+	const form = useForm({
+		schema: schemaForForm,
+		initialValues: currentContent ?? {},
+		handler: async (values) => {
+			await onSave(values);
+		}
+	}, [
+		selectedConfig,
+		schemaForForm,
+		currentContent
+	]);
+	const hasValidSchema = useMemo(() => {
+		const schema = configValue?.schema;
+		return schema && typeof schema === "object" && "properties" in schema && Object.keys(schema.properties).length > 0;
+	}, [configValue?.schema]);
+	const fieldCount = useMemo(() => {
+		const schema = configValue?.schema;
+		if (schema && typeof schema === "object" && "properties" in schema && schema.properties) return Object.keys(schema.properties).length;
+		return 0;
+	}, [configValue?.schema]);
+	const columns = useMemo(() => {
+		if (fieldCount <= 2) return 1;
+		if (fieldCount <= 6) return 2;
+		return 3;
+	}, [fieldCount]);
+	return /* @__PURE__ */ jsx(Flex, {
+		flex: 1,
+		h: "100%",
+		style: {
+			overflow: "hidden",
+			minWidth: 0,
+			display: "flex"
+		},
+		children: /* @__PURE__ */ jsxs(Flex, {
+			direction: "column",
+			h: "100%",
+			w: "100%",
+			style: { minHeight: 0 },
+			children: [/* @__PURE__ */ jsx(Flex, {
+				flex: 1,
+				p: "md",
+				className: "overflow-auto",
+				style: { minHeight: 0 },
+				children: currentContent !== null ? /* @__PURE__ */ jsxs(Flex, {
+					direction: "column",
+					gap: "lg",
+					children: [
+						/* @__PURE__ */ jsx(Flex, { children: hasValidSchema ? /* @__PURE__ */ jsx(TypeForm, {
+							form,
+							columns,
+							skipSubmitButton: true,
+							fill: false
+						}) : /* @__PURE__ */ jsxs(Flex, { children: [/* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							mb: 4,
+							children: "Current Value"
+						}), /* @__PURE__ */ jsx(Code, {
+							block: true,
+							style: { whiteSpace: "pre-wrap" },
+							children: formatJson(currentContent)
+						})] }) }),
+						configValue?.current?.changeDescription && /* @__PURE__ */ jsxs(Flex, { children: [/* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							mb: 4,
+							children: "Change Description"
+						}), /* @__PURE__ */ jsx(Text, {
+							size: "sm",
+							children: configValue.current.changeDescription
+						})] }),
+						configValue?.current && /* @__PURE__ */ jsxs(Flex, {
+							gap: "xl",
+							children: [/* @__PURE__ */ jsxs(Flex, { children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								mb: 2,
+								children: "Updated"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								children: l(configValue.current.updatedAt, { date: "fromNow" })
+							})] }), configValue.current.creatorName && /* @__PURE__ */ jsxs(Flex, { children: [/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								mb: 2,
+								children: "Updated By"
+							}), /* @__PURE__ */ jsx(Text, {
+								size: "sm",
+								children: configValue.current.creatorName
+							})] })]
+						}),
+						!configValue?.current && configValue?.currentValue !== void 0 && /* @__PURE__ */ jsx(Text, {
+							size: "xs",
+							c: "dimmed",
+							children: "This configuration is using its default value. No versions have been saved to the database yet."
+						}),
+						configValue?.next && /* @__PURE__ */ jsx(Card, {
+							withBorder: true,
+							p: "sm",
+							bg: "var(--mantine-color-blue-light)",
+							children: /* @__PURE__ */ jsxs(Flex, {
+								direction: "column",
+								gap: "xs",
+								children: [
+									/* @__PURE__ */ jsxs(Flex, {
+										gap: "xs",
+										children: [/* @__PURE__ */ jsx(IconClock, {
+											size: 14,
+											color: "var(--mantine-color-blue-6)"
+										}), /* @__PURE__ */ jsxs(Text, {
+											size: "xs",
+											fw: 500,
+											c: "blue",
+											children: [
+												"Scheduled Update (v",
+												configValue.next.version,
+												")"
+											]
+										})]
+									}),
+									/* @__PURE__ */ jsxs(Text, {
+										size: "xs",
+										c: "dimmed",
+										children: [
+											"Activates",
+											" ",
+											l(configValue.next.activationDate, { date: "fromNow" })
+										]
+									}),
+									/* @__PURE__ */ jsx(Code, {
+										block: true,
+										style: { whiteSpace: "pre-wrap" },
+										fz: "xs",
+										children: formatJson(configValue.next.content)
+									})
+								]
+							})
+						})
+					]
+				}) : /* @__PURE__ */ jsx(Flex, {
+					justify: "center",
+					align: "center",
+					h: 200,
+					children: /* @__PURE__ */ jsx(Text, {
+						c: "dimmed",
+						size: "sm",
+						children: "No current value"
+					})
+				})
+			}), hasValidSchema && currentContent !== null && /* @__PURE__ */ jsx(Flex, {
+				p: "md",
+				style: {
+					flexShrink: 0,
+					borderTop: "1px solid var(--mantine-color-default-border)"
+				},
+				children: /* @__PURE__ */ jsxs(Flex, {
+					justify: "flex-end",
+					gap: "sm",
+					children: [/* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						onClick: () => form.reset({}),
+						disabled: saving,
+						children: "Reset"
+					}), /* @__PURE__ */ jsx(ActionButton, {
+						intent: "primary",
+						form,
+						loading: saving,
+						children: "Save Changes"
+					})]
+				})
+			})]
+		})
+	});
+};
+/**
+* Parameter details panel.
+* Shows loading state or the config form.
+* Note: Empty state is handled by parent (AdminParameters).
+*/
+const ParameterDetails = ({ selectedConfig, configValue, loading, saving, onSave }) => {
+	if (loading) return /* @__PURE__ */ jsx(LoadingState, {});
+	return /* @__PURE__ */ jsx(ConfigForm, {
+		selectedConfig,
+		configValue,
+		saving,
+		onSave
+	});
+};
+
+//#endregion
+//#region ../../src/admin/components/parameters/ParameterEmptyState.tsx
+/**
+* Empty state displayed when no parameter is selected.
+* Invites user to select a parameter from the tree.
+*/
+const ParameterEmptyState = () => {
+	return /* @__PURE__ */ jsx(Flex$1, {
+		flex: 1,
+		p: "xl",
+		align: "center",
+		children: /* @__PURE__ */ jsxs(Flex$1, {
+			direction: "column",
+			align: "center",
+			gap: "md",
+			children: [/* @__PURE__ */ jsx(IconArrowLeft, {
+				size: 32,
+				color: "var(--mantine-color-dimmed)"
+			}), /* @__PURE__ */ jsxs(Flex$1, {
+				direction: "column",
+				align: "center",
+				gap: 4,
+				children: [/* @__PURE__ */ jsx(Text, {
+					fw: 500,
+					c: "dimmed",
+					children: "No Parameter Selected"
+				}), /* @__PURE__ */ jsx(Text, {
+					size: "xs",
+					c: "dimmed",
+					ta: "center",
+					maw: 240,
+					children: "Choose a parameter from the tree to view and edit its configuration"
+				})]
+			})]
+		})
+	});
+};
+
+//#endregion
+//#region ../../src/admin/components/parameters/ParameterHistory.tsx
+const ParameterHistory = ({ history, loading, onRollback }) => {
+	const { l } = useI18n();
+	const renderContent = () => {
+		if (loading) return /* @__PURE__ */ jsx(Flex, {
+			flex: 1,
+			justify: "center",
+			align: "center",
+			children: /* @__PURE__ */ jsx(Loader, { size: "sm" })
+		});
+		if (history.length === 0) return /* @__PURE__ */ jsx(Flex, {
+			flex: 1,
+			justify: "center",
+			align: "center",
+			children: /* @__PURE__ */ jsx(Text, {
+				c: "dimmed",
+				size: "xs",
+				children: "Empty"
+			})
+		});
+		return /* @__PURE__ */ jsx(ScrollArea, {
+			flex: 1,
+			offsetScrollbars: true,
+			children: /* @__PURE__ */ jsx(Timeline, {
+				active: history.findIndex((h) => h.status === "current"),
+				bulletSize: 24,
+				lineWidth: 2,
+				children: history.map((version) => /* @__PURE__ */ jsx(Timeline.Item, {
+					bullet: /* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						fw: 500,
+						children: version.version
+					}),
+					title: /* @__PURE__ */ jsxs(Flex, {
+						gap: "xs",
+						children: [/* @__PURE__ */ jsxs(Text, {
+							size: "xs",
+							fw: 500,
+							children: ["Version ", version.version]
+						}), /* @__PURE__ */ jsx(Badge, {
+							size: "xs",
+							variant: "light",
+							color: getStatusColor(version.status),
+							children: version.status
+						})]
+					}),
+					children: /* @__PURE__ */ jsxs(Flex, {
+						direction: "column",
+						gap: 4,
+						mt: 4,
+						children: [
+							/* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: l(version.createdAt, { date: "fromNow" })
+							}),
+							version.changeDescription && /* @__PURE__ */ jsx(Text, {
+								size: "xs",
+								lineClamp: 2,
+								children: version.changeDescription
+							}),
+							version.creatorName && /* @__PURE__ */ jsxs(Text, {
+								size: "xs",
+								c: "dimmed",
+								children: ["by ", version.creatorName]
+							}),
+							version.migrationLog && /* @__PURE__ */ jsx(Badge, {
+								size: "xs",
+								variant: "outline",
+								color: "orange",
+								children: "Schema Changed"
+							}),
+							version.status === "expired" && /* @__PURE__ */ jsx(ActionButton, {
+								size: "compact-xs",
+								variant: "subtle",
+								onClick: () => onRollback(version.version),
+								children: "Rollback to this version"
+							})
+						]
+					})
+				}, version.id))
+			})
+		});
+	};
+	return /* @__PURE__ */ jsx(Flex, {
+		w: 160,
+		h: "100%",
+		p: "xs",
+		style: {
+			flexShrink: 0,
+			overflow: "hidden",
+			display: "flex",
+			flexDirection: "column",
+			borderLeft: "1px solid var(--mantine-color-default-border)"
+		},
+		children: /* @__PURE__ */ jsxs(Flex, {
+			direction: "column",
+			gap: "xs",
+			h: "100%",
+			style: { minHeight: 0 },
+			children: [/* @__PURE__ */ jsxs(Flex, {
+				gap: "xs",
+				children: [/* @__PURE__ */ jsx(IconHistory, {
+					size: 16,
+					color: "var(--mantine-color-dimmed)"
+				}), /* @__PURE__ */ jsx(Text, {
+					size: "sm",
+					fw: 500,
+					children: "History"
+				})]
+			}), renderContent()]
+		})
+	});
+};
+
+//#endregion
+//#region ../../src/admin/components/parameters/ParameterTree.tsx
+/**
+* Filters tree nodes by search query.
+*/
+const filterTree = (nodes, query) => {
+	if (!query.trim()) return nodes;
+	const lowerQuery = query.toLowerCase();
+	return nodes.map((node) => {
+		const filteredChildren = filterTree(node.children, query);
+		const nameMatches = node.name.toLowerCase().includes(lowerQuery);
+		const pathMatches = node.path.toLowerCase().includes(lowerQuery);
+		if (nameMatches || pathMatches || filteredChildren.length > 0) return {
+			...node,
+			children: filteredChildren
+		};
+		return null;
+	}).filter((node) => node !== null);
+};
+/**
+* Memoized tree node to prevent unnecessary re-renders.
+*/
+const TreeNode = memo(({ node, level, selectedConfig, onSelect, expandedNodes, onToggle }) => {
+	const [isHovered, setIsHovered] = useState(false);
+	const hasChildren = node.children.length > 0;
+	const isExpanded = expandedNodes.has(node.path);
+	const isSelected = selectedConfig === node.path;
+	const isLeaf = !hasChildren;
+	return /* @__PURE__ */ jsxs(Flex$1, { children: [/* @__PURE__ */ jsx(UnstyledButton, {
+		onClick: useCallback(() => {
+			if (hasChildren) onToggle(node.path);
+			else onSelect(node.path);
+		}, [
+			hasChildren,
+			node.path,
+			onToggle,
+			onSelect
+		]),
+		onMouseEnter: useCallback(() => setIsHovered(true), []),
+		onMouseLeave: useCallback(() => setIsHovered(false), []),
+		w: "100%",
+		style: { display: "block" },
+		children: /* @__PURE__ */ jsxs(Flex$1, {
+			gap: 6,
+			wrap: "nowrap",
+			p: "4px 8px",
+			pl: 8 + level * 16,
+			style: {
+				borderRadius: "var(--mantine-radius-sm)",
+				backgroundColor: isSelected || isHovered ? "var(--mantine-color-default-hover)" : void 0
+			},
+			children: [hasChildren ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Flex$1, {
+				style: {
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "center",
+					width: 16
+				},
+				children: isExpanded ? /* @__PURE__ */ jsx(IconChevronDown, {
+					size: 14,
+					color: "var(--mantine-color-dimmed)"
+				}) : /* @__PURE__ */ jsx(IconChevronRight, {
+					size: 14,
+					color: "var(--mantine-color-dimmed)"
+				})
+			}), isExpanded ? /* @__PURE__ */ jsx(IconFolderOpen, {
+				size: 16,
+				color: "var(--mantine-color-dimmed)",
+				style: { flexShrink: 0 }
+			}) : /* @__PURE__ */ jsx(IconFolder, {
+				size: 16,
+				color: "var(--mantine-color-dimmed)",
+				style: { flexShrink: 0 }
+			})] }) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Flex$1, { w: 16 }), /* @__PURE__ */ jsx(IconSettings, {
+				size: 16,
+				color: isSelected ? "var(--mantine-color-blue-6)" : "var(--mantine-color-dimmed)",
+				style: { flexShrink: 0 }
+			})] }), /* @__PURE__ */ jsx(Text, {
+				size: "sm",
+				fw: isSelected ? 600 : 400,
+				c: isSelected ? void 0 : isLeaf ? void 0 : "dimmed",
+				style: {
+					whiteSpace: "nowrap",
+					overflow: "hidden",
+					textOverflow: "ellipsis"
+				},
+				children: node.name
+			})]
+		})
+	}), hasChildren && /* @__PURE__ */ jsx(Collapse, {
+		in: isExpanded,
+		children: node.children.map((child) => /* @__PURE__ */ jsx(TreeNode, {
+			node: child,
+			level: level + 1,
+			selectedConfig,
+			onSelect,
+			expandedNodes,
+			onToggle
+		}, child.path))
+	})] });
+});
+TreeNode.displayName = "TreeNode";
+/**
+* Collects all folder paths to expand by default.
+*/
+const collectAllFolderPaths = (nodes) => {
+	const paths = /* @__PURE__ */ new Set();
+	const traverse = (nodeList) => {
+		for (const node of nodeList) if (node.children.length > 0) {
+			paths.add(node.path);
+			traverse(node.children);
+		}
+	};
+	traverse(nodes);
+	return paths;
+};
+const ParameterTree = ({ treeData, selectedConfig, onSelect, onRefresh }) => {
+	const [searchQuery, setSearchQuery] = useState("");
+	const [expandedNodes, setExpandedNodes] = useState(() => collectAllFolderPaths(treeData));
+	const filteredTreeData = useMemo(() => filterTree(treeData, searchQuery), [treeData, searchQuery]);
+	const handleToggle = useCallback((path) => {
+		setExpandedNodes((prev) => {
+			const next = new Set(prev);
+			if (next.has(path)) next.delete(path);
+			else next.add(path);
+			return next;
+		});
+	}, []);
+	const handleSearchChange = useCallback((e) => {
+		setSearchQuery(e.currentTarget.value);
+	}, []);
+	return /* @__PURE__ */ jsx(Flex$1, {
+		w: 280,
+		h: "100%",
+		p: "sm",
+		style: {
+			flexShrink: 0,
+			display: "flex",
+			flexDirection: "column",
+			borderRight: "1px solid var(--mantine-color-default-border)"
+		},
+		children: /* @__PURE__ */ jsxs(Flex$1, {
+			direction: "column",
+			gap: "sm",
+			h: "100%",
+			style: { minHeight: 0 },
+			children: [
+				/* @__PURE__ */ jsxs(Flex$1, {
+					justify: "space-between",
+					gap: "xs",
+					children: [/* @__PURE__ */ jsx(Text, {
+						size: "sm",
+						fw: 600,
+						children: "Parameters"
+					}), /* @__PURE__ */ jsx(ActionButton, {
+						variant: "subtle",
+						size: "compact-xs",
+						onClick: onRefresh,
+						tooltip: "Refresh",
+						children: /* @__PURE__ */ jsx(IconRefresh, { size: 14 })
+					})]
+				}),
+				/* @__PURE__ */ jsx(TextInput, {
+					placeholder: "Search...",
+					size: "xs",
+					leftSection: /* @__PURE__ */ jsx(IconSearch, { size: 14 }),
+					value: searchQuery,
+					onChange: handleSearchChange
+				}),
+				/* @__PURE__ */ jsx(ScrollArea, {
+					flex: 1,
+					offsetScrollbars: true,
+					style: { minHeight: 0 },
+					children: filteredTreeData.length === 0 ? /* @__PURE__ */ jsx(Text, {
+						size: "xs",
+						c: "dimmed",
+						ta: "center",
+						py: "md",
+						children: searchQuery ? "No matching parameters" : "No parameters"
+					}) : /* @__PURE__ */ jsx(Flex$1, {
+						direction: "column",
+						gap: 0,
+						style: { gap: 1 },
+						children: filteredTreeData.map((node) => /* @__PURE__ */ jsx(TreeNode, {
+							node,
+							level: 0,
+							selectedConfig,
+							onSelect,
+							expandedNodes,
+							onToggle: handleToggle
+						}, node.path))
+					})
+				})
+			]
+		})
+	});
+};
+
+//#endregion
+//#region ../../src/admin/components/parameters/AdminParameters.tsx
+const AdminParameters = ({ treeData: initialTreeData }) => {
+	const client = useClient();
+	const toast = useToast();
+	const [treeData, setTreeData] = useState(initialTreeData);
+	const [selectedConfig, setSelectedConfig] = useState(null);
+	const [configValue, setConfigValue] = useState(null);
+	const [history, setHistory] = useState([]);
+	const [loadingConfig, setLoadingConfig] = useState(false);
+	const [loadingHistory, setLoadingHistory] = useState(false);
+	const [saving, setSaving] = useState(false);
+	const handleRefresh = useCallback(async () => {
+		try {
+			setTreeData(await client.getParameterTree({}));
+		} catch (error) {
+			toast.danger({
+				title: "Failed to refresh parameters",
+				message: error instanceof Error ? error.message : "Unknown error"
+			});
+		}
+	}, [client, toast]);
+	const loadConfigDetails = useCallback(async (name) => {
+		setLoadingConfig(true);
+		setLoadingHistory(true);
+		try {
+			const [currentResponse, historyResponse] = await Promise.all([client.getCurrent({ params: { name } }), client.getHistory({ params: { name } })]);
+			setConfigValue(currentResponse);
+			setHistory(historyResponse.versions);
+		} catch (error) {
+			toast.danger({
+				title: "Failed to load configuration",
+				message: error instanceof Error ? error.message : "Unknown error"
+			});
+			setConfigValue(null);
+			setHistory([]);
+		} finally {
+			setLoadingConfig(false);
+			setLoadingHistory(false);
+		}
+	}, [client, toast]);
+	const handleSave = useCallback(async (values) => {
+		if (!selectedConfig || !configValue) return;
+		setSaving(true);
+		try {
+			await client.createVersion({
+				params: { name: selectedConfig },
+				body: {
+					content: values,
+					schemaHash: "",
+					changeDescription: "Updated via admin UI"
+				}
+			});
+			toast.success({
+				title: "Configuration saved",
+				message: `${selectedConfig} has been updated`
+			});
+			await loadConfigDetails(selectedConfig);
+		} catch (error) {
+			toast.danger({
+				title: "Failed to save configuration",
+				message: error instanceof Error ? error.message : "Unknown error"
+			});
+			throw error;
+		} finally {
+			setSaving(false);
+		}
+	}, [
+		client,
+		selectedConfig,
+		configValue,
+		loadConfigDetails,
+		toast
+	]);
+	useEffect(() => {
+		if (selectedConfig) loadConfigDetails(selectedConfig);
+		else {
+			setConfigValue(null);
+			setHistory([]);
+		}
+	}, [selectedConfig, loadConfigDetails]);
+	const handleRollback = useCallback(async (version) => {
+		if (!selectedConfig) return;
+		try {
+			await client.rollback({
+				params: { name: selectedConfig },
+				body: { targetVersion: version }
+			});
+			toast.success({
+				title: "Rollback successful",
+				message: `${selectedConfig} rolled back to version ${version}`
+			});
+			await loadConfigDetails(selectedConfig);
+		} catch (error) {
+			toast.danger({
+				title: "Rollback failed",
+				message: error instanceof Error ? error.message : "Unknown error"
+			});
+		}
+	}, [
+		client,
+		selectedConfig,
+		loadConfigDetails,
+		toast
+	]);
+	if (treeData.length === 0) return /* @__PURE__ */ jsx(Flex$1, {
+		flex: 1,
+		justify: "center",
+		align: "center",
+		children: /* @__PURE__ */ jsxs(Flex$1, {
+			direction: "column",
+			align: "center",
+			gap: "xs",
+			children: [
+				/* @__PURE__ */ jsx(IconSettings, {
+					size: 48,
+					stroke: 1.5,
+					color: "var(--mantine-color-dimmed)"
+				}),
+				/* @__PURE__ */ jsx(Text, {
+					c: "dimmed",
+					children: "No Parameters Found"
+				}),
+				/* @__PURE__ */ jsx(Text, {
+					size: "xs",
+					c: "dimmed",
+					ta: "center",
+					maw: 400,
+					children: "Define parameters using the $parameter primitive to manage dynamic application settings. Parameters will appear here once created."
+				})
+			]
+		})
+	});
+	return /* @__PURE__ */ jsx(Flex$1, {
+		flex: 1,
+		p: "md",
+		children: /* @__PURE__ */ jsxs(Card, {
+			withBorder: true,
+			p: 0,
+			w: "100%",
+			style: { flexDirection: "row" },
+			children: [/* @__PURE__ */ jsx(ParameterTree, {
+				treeData,
+				selectedConfig,
+				onSelect: setSelectedConfig,
+				onRefresh: handleRefresh
+			}), selectedConfig ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(ParameterDetails, {
+				selectedConfig,
+				configValue,
+				loading: loadingConfig,
+				saving,
+				onSave: handleSave
+			}), /* @__PURE__ */ jsx(ParameterHistory, {
+				selectedConfig,
+				history,
+				loading: loadingHistory,
+				onRollback: handleRollback
+			})] }) : /* @__PURE__ */ jsx(ParameterEmptyState, {})]
+		})
+	});
+};
+
+//#endregion
+export { AdminParameters as default };
+//# sourceMappingURL=AdminParameters-iQE8o7a7.js.map