@alpaca-editor/core 1.0.3767 → 1.0.3769

package/dist/editor/ui/PerfectTree.js

@@ -1,46 +1,10 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PerfectTree = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const progressspinner_1 = require("primereact/progressspinner");
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useEffect, useMemo, useCallback, memo } from "react";
+import { ProgressSpinner } from "primereact/progressspinner";
 // Local DropZone component to handle drag-over state.
-const DropZone = (0, react_1.memo)(({ parent, index, isDragging, onDragOverZone, onDrop, onDragEnd, isLast, }) => {
-    const [isDragOver, setIsDragOver] = react_1.default.useState(false);
-    const handleDragEnter = (0, react_1.useCallback)((e) => {
+const DropZone = memo(({ parent, index, isDragging, onDragOverZone, onDrop, onDragEnd, isLast, }) => {
+    const [isDragOver, setIsDragOver] = React.useState(false);
+    const handleDragEnter = useCallback((e) => {
         e.preventDefault();
         e.stopPropagation();
         if (onDragOverZone) {
@@ -49,12 +13,12 @@ const DropZone = (0, react_1.memo)(({ parent, index, isDragging, onDragOverZone,
             e.dataTransfer.dropEffect = allowed ? "move" : "none";
         }
     }, [onDragOverZone, parent, index]);
-    const handleDragLeave = (0, react_1.useCallback)((e) => {
+    const handleDragLeave = useCallback((e) => {
         e.preventDefault();
         e.stopPropagation();
         setIsDragOver(false);
     }, []);
-    const handleDragOver = (0, react_1.useCallback)((e) => {
+    const handleDragOver = useCallback((e) => {
         e.preventDefault();
         e.stopPropagation();
         if (onDragOverZone) {
@@ -62,7 +26,7 @@ const DropZone = (0, react_1.memo)(({ parent, index, isDragging, onDragOverZone,
             setIsDragOver(allowed);
         }
     }, [onDragOverZone, parent, index]);
-    const handleDrop = (0, react_1.useCallback)((e) => {
+    const handleDrop = useCallback((e) => {
         e.preventDefault();
         e.stopPropagation();
         setIsDragOver(false);
@@ -72,17 +36,17 @@ const DropZone = (0, react_1.memo)(({ parent, index, isDragging, onDragOverZone,
     }, [onDrop, parent, index]);
     if (!isDragging)
         return null;
-    return ((0, jsx_runtime_1.jsx)("div", { className: `relative ${isLast ? "h-3" : ""}`, children: (0, jsx_runtime_1.jsx)("div", { className: `drop-zone absolute top-[-5px] right-0 left-[45px] z-1000 h-3 rounded-md transition-colors duration-100 ${isDragOver ? "bg-sky-200" : ""}`, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDragLeave: handleDragLeave }) }));
+    return (_jsx("div", { className: `relative ${isLast ? "h-3" : ""}`, children: _jsx("div", { className: `drop-zone absolute top-[-5px] right-0 left-[45px] z-1000 h-3 rounded-md transition-colors duration-100 ${isDragOver ? "bg-sky-200" : ""}`, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDragLeave: handleDragLeave }) }));
 });
 // NodeContent component extracted and memoized
-const NodeContent = (0, react_1.memo)(({ node, isExpanded, isSelected, onSelect, onToggleNode, onStartDrag, onDragEnd, onDragOverZone, onDrop, onDoubleClick, renderNode, onContextMenu, enableDragAndDrop = false, selectedKeys, isDragging, }) => {
-    const [isDragOver, setIsDragOver] = react_1.default.useState(false);
-    (0, react_1.useEffect)(() => {
+const NodeContent = memo(({ node, isExpanded, isSelected, onSelect, onToggleNode, onStartDrag, onDragEnd, onDragOverZone, onDrop, onDoubleClick, renderNode, onContextMenu, enableDragAndDrop = false, selectedKeys, isDragging, }) => {
+    const [isDragOver, setIsDragOver] = React.useState(false);
+    useEffect(() => {
         if (!isDragging) {
             setIsDragOver(false);
         }
     }, [isDragging]);
-    const handleDragStart = (0, react_1.useCallback)((event) => {
+    const handleDragStart = useCallback((event) => {
         const isMultiSelect = isSelected && selectedKeys && selectedKeys.length > 1;
         // Set drag preview for multiple items if applicable
         if (isMultiSelect) {
@@ -104,18 +68,18 @@ const NodeContent = (0, react_1.memo)(({ node, isExpanded, isSelected, onSelect,
             onStartDrag({ node, event, isMultiSelect: isMultiSelect ?? false });
         }
     }, [node, onStartDrag]);
-    const handleDragLeave = (0, react_1.useCallback)((event) => {
+    const handleDragLeave = useCallback((event) => {
         event.preventDefault();
         setIsDragOver(false);
     }, []);
-    const handleDragEnter = (0, react_1.useCallback)((event) => {
+    const handleDragEnter = useCallback((event) => {
         event.preventDefault();
         if (onDragOverZone) {
             const allowed = onDragOverZone(node, -1, event);
             setIsDragOver(allowed);
         }
     }, [node, onDragOverZone]);
-    const handleDragOver = (0, react_1.useCallback)((event) => {
+    const handleDragOver = useCallback((event) => {
         event.preventDefault();
         if (onDragOverZone) {
             const allowed = onDragOverZone(node, -1, event);
@@ -123,41 +87,41 @@ const NodeContent = (0, react_1.memo)(({ node, isExpanded, isSelected, onSelect,
             event.dataTransfer.dropEffect = allowed ? "move" : "none";
         }
     }, [node, onDragOverZone]);
-    const handleDrop = (0, react_1.useCallback)((e) => {
+    const handleDrop = useCallback((e) => {
         e.preventDefault();
         e.stopPropagation();
         if (onDrop) {
             onDrop(node, -1, e);
         }
     }, [node, onDrop]);
-    const handleDoubleClick = (0, react_1.useCallback)((e) => {
+    const handleDoubleClick = useCallback((e) => {
         e.stopPropagation();
         onDoubleClick?.(node);
     }, [node, onDoubleClick]);
-    const handleSelect = (0, react_1.useCallback)((e) => {
+    const handleSelect = useCallback((e) => {
         e.stopPropagation();
         onSelect(node.key, e);
     }, [node.key, onSelect]);
-    const handleToggle = (0, react_1.useCallback)((e) => {
+    const handleToggle = useCallback((e) => {
         e.stopPropagation();
         onToggleNode(node);
     }, [node, onToggleNode]);
     const renderToggle = () => {
         if (node.hasChildren && node.children === null) {
-            return ((0, jsx_runtime_1.jsx)(progressspinner_1.ProgressSpinner, { style: { width: "18px", height: "18px", margin: "0 2px" }, className: "text-gray-500" }));
+            return (_jsx(ProgressSpinner, { style: { width: "18px", height: "18px", margin: "0 2px" }, className: "text-gray-500" }));
         }
-        return ((0, jsx_runtime_1.jsx)("span", { onClick: handleToggle, className: `mr-2 inline-block transform cursor-pointer transition duration-150 select-none ${isExpanded ? "rotate-90" : "rotate-0"}`, children: (0, jsx_runtime_1.jsx)("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", "data-pc-section": "togglericon", children: (0, jsx_runtime_1.jsx)("path", { d: "M4.38708 13C4.28408 13.0005 4.18203 12.9804 4.08691 12.9409C3.99178 12.9014 3.9055 12.8433 3.83313 12.7701C3.68634 12.6231 3.60388 12.4238 3.60388 12.2161C3.60388 12.0084 3.68634 11.8091 3.83313 11.6622L8.50507 6.99022L3.83313 2.31827C3.69467 2.16968 3.61928 1.97313 3.62287 1.77005C3.62645 1.56698 3.70872 1.37322 3.85234 1.22959C3.99596 1.08597 4.18972 1.00371 4.3928 1.00012C4.59588 0.996539 4.79242 1.07192 4.94102 1.21039L10.1669 6.43628C10.3137 6.58325 10.3962 6.78249 10.3962 6.99022C10.3962 7.19795 10.3137 7.39718 10.1669 7.54416L4.94102 12.7701C4.86865 12.8433 4.78237 12.9014 4.68724 12.9409C4.59212 12.9804 4.49007 13.0005 4.38708 13Z", fill: "currentColor" }) }) }));
+        return (_jsx("span", { onClick: handleToggle, className: `mr-2 inline-block transform cursor-pointer transition duration-150 select-none ${isExpanded ? "rotate-90" : "rotate-0"}`, children: _jsx("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", "data-pc-section": "togglericon", children: _jsx("path", { d: "M4.38708 13C4.28408 13.0005 4.18203 12.9804 4.08691 12.9409C3.99178 12.9014 3.9055 12.8433 3.83313 12.7701C3.68634 12.6231 3.60388 12.4238 3.60388 12.2161C3.60388 12.0084 3.68634 11.8091 3.83313 11.6622L8.50507 6.99022L3.83313 2.31827C3.69467 2.16968 3.61928 1.97313 3.62287 1.77005C3.62645 1.56698 3.70872 1.37322 3.85234 1.22959C3.99596 1.08597 4.18972 1.00371 4.3928 1.00012C4.59588 0.996539 4.79242 1.07192 4.94102 1.21039L10.1669 6.43628C10.3137 6.58325 10.3962 6.78249 10.3962 6.99022C10.3962 7.19795 10.3137 7.39718 10.1669 7.54416L4.94102 12.7701C4.86865 12.8433 4.78237 12.9014 4.68724 12.9409C4.59212 12.9804 4.49007 13.0005 4.38708 13Z", fill: "currentColor" }) }) }));
     };
-    const handleContextMenu = (0, react_1.useCallback)((e) => {
+    const handleContextMenu = useCallback((e) => {
         e.stopPropagation();
         e.preventDefault();
         onContextMenu?.(node, e);
     }, [node, onContextMenu]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "tree-node mb-0.5 flex cursor-pointer items-center", draggable: enableDragAndDrop, onClick: handleSelect, onDragStart: (event) => handleDragStart(event), onDragEnd: onDragEnd, onDragLeave: handleDragLeave, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDoubleClick: handleDoubleClick, onContextMenu: handleContextMenu, children: [node.hasChildren || node.children?.length ? (renderToggle()) : ((0, jsx_runtime_1.jsx)("div", { className: "w-6" })), (0, jsx_runtime_1.jsx)("div", { className: `rounded-md border border-transparent p-0.5 hover:border-gray-300 ${isDragOver ? "bg-sky-200" : isSelected ? "bg-blue-100" : ""}`, onClick: handleSelect, children: renderNode(node) })] }));
+    return (_jsxs("div", { className: "tree-node mb-0.5 flex cursor-pointer items-center", draggable: enableDragAndDrop, onClick: handleSelect, onDragStart: (event) => handleDragStart(event), onDragEnd: onDragEnd, onDragLeave: handleDragLeave, onDragEnter: handleDragEnter, onDragOver: handleDragOver, onDrop: handleDrop, onDoubleClick: handleDoubleClick, onContextMenu: handleContextMenu, children: [node.hasChildren || node.children?.length ? (renderToggle()) : (_jsx("div", { className: "w-6" })), _jsx("div", { className: `rounded-md border border-transparent p-0.5 hover:border-gray-300 ${isDragOver ? "bg-sky-200" : isSelected ? "bg-blue-100" : ""}`, onClick: handleSelect, children: renderNode(node) })] }));
 });
-const PerfectTree = ({ nodes, selectedKeys = [], expandedKeys = [], renderNode, onToggleExpand, onSelect, onDragOverZone, onDrop, isDragging = false, onStartDrag, onDragEnd, onLazyLoad, onDoubleClick, onContextMenu, enableDragAndDrop = false, }) => {
+export const PerfectTree = ({ nodes, selectedKeys = [], expandedKeys = [], renderNode, onToggleExpand, onSelect, onDragOverZone, onDrop, isDragging = false, onStartDrag, onDragEnd, onLazyLoad, onDoubleClick, onContextMenu, enableDragAndDrop = false, }) => {
     // When toggling a node, notify parent and trigger external lazy load if needed.
-    const handleToggle = (0, react_1.useCallback)((node) => {
+    const handleToggle = useCallback((node) => {
         if (onToggleExpand) {
             onToggleExpand(node.key);
         }
@@ -167,14 +131,14 @@ const PerfectTree = ({ nodes, selectedKeys = [], expandedKeys = [], renderNode,
             onLazyLoad(node);
         }
     }, [onToggleExpand, onLazyLoad]);
-    const handleSelect = (0, react_1.useCallback)((nodeKey, event) => {
+    const handleSelect = useCallback((nodeKey, event) => {
         if (onSelect) {
             onSelect(nodeKey, event);
         }
     }, [onSelect]);
     // Global drag end handler.
-    const isDraggingRef = react_1.default.useRef(false);
-    (0, react_1.useEffect)(() => {
+    const isDraggingRef = React.useRef(false);
+    useEffect(() => {
         const handleGlobalDragEnd = (event) => {
             if (isDraggingRef.current && onDragEnd) {
                 onDragEnd(event);
@@ -186,22 +150,22 @@ const PerfectTree = ({ nodes, selectedKeys = [], expandedKeys = [], renderNode,
             document.removeEventListener("dragend", handleGlobalDragEnd);
         };
     }, [onDragEnd]);
-    const handleDragEnd = (0, react_1.useCallback)((event) => {
+    const handleDragEnd = useCallback((event) => {
         isDraggingRef.current = false;
         if (onDragEnd) {
             onDragEnd(event);
         }
     }, [onDragEnd]);
     // Recursive function to render tree nodes along with drop zones.
-    const renderTreeList = (0, react_1.useCallback)((nodes, depth, parent = null) => {
-        return ((0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col", children: [nodes.map((node, index) => {
+    const renderTreeList = useCallback((nodes, depth, parent = null) => {
+        return (_jsxs("div", { className: "flex flex-col", children: [nodes.map((node, index) => {
                     const children = node.children;
                     const isExpanded = expandedKeys.includes(node.key);
                     const isSelected = selectedKeys.includes(node.key);
-                    return ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)(DropZone, { parent: parent, index: index, isDragging: isDragging, onDragOverZone: onDragOverZone, onDrop: onDrop, onDragEnd: onDragEnd }), (0, jsx_runtime_1.jsxs)("div", { style: {
+                    return (_jsxs(React.Fragment, { children: [_jsx(DropZone, { parent: parent, index: index, isDragging: isDragging, onDragOverZone: onDragOverZone, onDrop: onDrop, onDragEnd: onDragEnd }), _jsxs("div", { style: {
                                     marginLeft: depth > 0 ? "21px" : undefined,
-                                }, className: "flex flex-col", children: [(0, jsx_runtime_1.jsx)(NodeContent, { node: node, isExpanded: isExpanded, isSelected: isSelected, onSelect: handleSelect, onToggleNode: handleToggle, onStartDrag: onStartDrag, onDragEnd: handleDragEnd, onDragOverZone: onDragOverZone, onDrop: onDrop, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, renderNode: renderNode, enableDragAndDrop: enableDragAndDrop, selectedKeys: selectedKeys, isDragging: isDragging }), isExpanded && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children && children.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { children: renderTreeList(children, depth + 1, node) })) : null }))] })] }, node.key));
-                }), (0, jsx_runtime_1.jsx)(DropZone, { parent: parent, index: nodes.length, isDragging: isDragging, onDragOverZone: onDragOverZone, onDrop: onDrop, onDragEnd: onDragEnd, isLast: true })] }));
+                                }, className: "flex flex-col", children: [_jsx(NodeContent, { node: node, isExpanded: isExpanded, isSelected: isSelected, onSelect: handleSelect, onToggleNode: handleToggle, onStartDrag: onStartDrag, onDragEnd: handleDragEnd, onDragOverZone: onDragOverZone, onDrop: onDrop, onDoubleClick: onDoubleClick, onContextMenu: onContextMenu, renderNode: renderNode, enableDragAndDrop: enableDragAndDrop, selectedKeys: selectedKeys, isDragging: isDragging }), isExpanded && (_jsx(_Fragment, { children: children && children.length > 0 ? (_jsx("div", { children: renderTreeList(children, depth + 1, node) })) : null }))] })] }, node.key));
+                }), _jsx(DropZone, { parent: parent, index: nodes.length, isDragging: isDragging, onDragOverZone: onDragOverZone, onDrop: onDrop, onDragEnd: onDragEnd, isLast: true })] }));
     }, [
         expandedKeys,
         selectedKeys,
@@ -216,8 +180,7 @@ const PerfectTree = ({ nodes, selectedKeys = [], expandedKeys = [], renderNode,
         renderNode,
     ]);
     // Memoize the tree structure
-    const treeContent = (0, react_1.useMemo)(() => renderTreeList(nodes, 0), [nodes, renderTreeList]);
-    return (0, jsx_runtime_1.jsx)("div", { children: treeContent });
+    const treeContent = useMemo(() => renderTreeList(nodes, 0), [nodes, renderTreeList]);
+    return _jsx("div", { children: treeContent });
 };
-exports.PerfectTree = PerfectTree;
-exports.default = (0, react_1.memo)(exports.PerfectTree);
+export default memo(PerfectTree);

package/dist/editor/ui/Section.d.ts

@@ -0,0 +1,4 @@
+export declare function Section({ title, children, }: {
+    title: string;
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/Section.js

@@ -1,12 +1,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Section = Section;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("primereact/utils");
-const utils_2 = require("../utils");
-function Section({ title, children, }) {
-    const [open, setOpen] = (0, utils_2.useLocalStorage)("editor.showSection-" + title, true);
-    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.classNames)(open
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { classNames } from "primereact/utils";
+import { useLocalStorage } from "../utils";
+export function Section({ title, children, }) {
+    const [open, setOpen] = useLocalStorage("editor.showSection-" + title, true);
+    return (_jsxs("div", { children: [_jsxs("div", { className: classNames(open
                     ? "border-blue-500 bg-gray-600"
-                    : "border-gray-400 bg-gray-400 hover:bg-gray-500 hover:border-gray-300", "py-2.5 px-3 border-l-[8px] text-white text-xs cursor-pointer flex justify-between items-center"), onClick: () => setOpen(!open), children: [title, (0, jsx_runtime_1.jsx)("i", { className: (0, utils_1.classNames)(open ? "pi-chevron-up" : "pi-chevron-down", "pi cursor-pointer text-xs") })] }), open && (0, jsx_runtime_1.jsx)("div", { className: "pt-4 pb-6 px-2 bg-gray-50", children: children })] }));
+                    : "border-gray-400 bg-gray-400 hover:bg-gray-500 hover:border-gray-300", "py-2.5 px-3 border-l-[8px] text-white text-xs cursor-pointer flex justify-between items-center"), onClick: () => setOpen(!open), children: [title, _jsx("i", { className: classNames(open ? "pi-chevron-up" : "pi-chevron-down", "pi cursor-pointer text-xs") })] }), open && _jsx("div", { className: "pt-4 pb-6 px-2 bg-gray-50", children: children })] }));
 }

package/dist/editor/ui/SimpleIconButton.d.ts

@@ -0,0 +1,11 @@
+import { MouseEventHandler } from "react";
+export declare function SimpleIconButton({ onClick, className, icon, label, disabled, size, id, selected, }: {
+    onClick: MouseEventHandler;
+    className?: string;
+    icon?: React.ReactNode;
+    label: string;
+    disabled?: boolean;
+    id?: string;
+    size?: "large" | "small";
+    selected?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/SimpleIconButton.js

@@ -1,10 +1,7 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleIconButton = SimpleIconButton;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("primereact/utils");
-function SimpleIconButton({ onClick, className, icon, label, disabled, size, id, selected, }) {
-    return ((0, jsx_runtime_1.jsx)("button", { id: id, disabled: disabled, className: (0, utils_1.classNames)(typeof icon === "string" ? icon + " p-[6px]" : "p-[4px]", "  rounded-full", disabled ? "text-gray-300" : " hover:bg-gray-200  cursor-pointer", className, size === "large" ? "text-lg" : "text-xs", selected ? "bg-gray-200" : ""), onClick: (ev) => {
+import { jsx as _jsx } from "react/jsx-runtime";
+import { classNames } from "primereact/utils";
+export function SimpleIconButton({ onClick, className, icon, label, disabled, size, id, selected, }) {
+    return (_jsx("button", { id: id, disabled: disabled, className: classNames(typeof icon === "string" ? icon + " p-[6px]" : "p-[4px]", "  rounded-full", disabled ? "text-gray-300" : " hover:bg-gray-200  cursor-pointer", className, size === "large" ? "text-lg" : "text-xs", selected ? "bg-gray-200" : ""), onClick: (ev) => {
             if (!disabled)
                 onClick(ev);
         }, title: label, children: typeof icon !== "string" && icon }));

package/dist/editor/ui/SimpleMenu.d.ts

@@ -0,0 +1,13 @@
+import { ReactNode } from "react";
+export type MenuItem = {
+    key: string;
+    label: string;
+    items?: MenuItem[];
+    icon?: ReactNode;
+    command?: () => void;
+};
+export declare function SimpleMenu({ items, activeItemKey, onItemClick, }: {
+    items: MenuItem[];
+    activeItemKey: string | null;
+    onItemClick: (item: MenuItem) => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/SimpleMenu.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleMenu = SimpleMenu;
-const jsx_runtime_1 = require("react/jsx-runtime");
-function SimpleMenu({ items, activeItemKey, onItemClick, }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: "flex flex-col p-1 h-full", children: items.map((item, index) => ((0, jsx_runtime_1.jsxs)("div", { className: "p-2 h-full flex flex-col gap-1", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row items-center gap-2 border-b border-gray-200 pb-1 pl-2", children: [item.icon && item.icon, item.label] }), item.items?.map((subItem, subIndex) => ((0, jsx_runtime_1.jsx)("div", { className: `flex flex-col px-4 p-1 cursor-pointer hover:bg-gray-100 ${activeItemKey === subItem.key ? "bg-gray-100" : ""}`, onClick: () => {
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+export function SimpleMenu({ items, activeItemKey, onItemClick, }) {
+    return (_jsx("div", { className: "flex flex-col p-1 h-full", children: items.map((item, index) => (_jsxs("div", { className: "p-2 h-full flex flex-col gap-1", children: [_jsxs("div", { className: "flex flex-row items-center gap-2 border-b border-gray-200 pb-1 pl-2", children: [item.icon && item.icon, item.label] }), item.items?.map((subItem, subIndex) => (_jsx("div", { className: `flex flex-col px-4 p-1 cursor-pointer hover:bg-gray-100 ${activeItemKey === subItem.key ? "bg-gray-100" : ""}`, onClick: () => {
                         onItemClick(subItem);
-                    }, children: (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-row items-center gap-2 text-sm", children: [subItem.icon && subItem.icon, subItem.label] }) }, subIndex)))] }, index))) }));
+                    }, children: _jsxs("div", { className: "flex flex-row items-center gap-2 text-sm", children: [subItem.icon && subItem.icon, subItem.label] }) }, subIndex)))] }, index))) }));
 }

package/dist/editor/ui/SimpleTable.d.ts

@@ -0,0 +1,14 @@
+export declare function SimpleTable<T>({ items, columns, onRowHover, onRowClick, rowClassName, }: {
+    items: T[];
+    columns: {
+        header: React.ReactNode;
+        body: (item: T) => React.ReactNode;
+        className?: string;
+    }[];
+    onRowClick?: (data: {
+        item: T;
+        event: React.MouseEvent<HTMLTableRowElement>;
+    }) => void;
+    onRowHover?: (item: T | undefined) => void;
+    rowClassName?: (item: T) => string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/SimpleTable.js

@@ -1,11 +1,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleTable = SimpleTable;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("primereact/utils");
-function SimpleTable({ items, columns, onRowHover, onRowClick, rowClassName, }) {
-    return ((0, jsx_runtime_1.jsxs)("table", { className: "table-auto min-w-full text-left text-xs font-light text-surface", children: [(0, jsx_runtime_1.jsx)("thead", { className: "border-b border-neutral-200 font-medium", children: (0, jsx_runtime_1.jsx)("tr", { children: columns.map((col, index) => ((0, jsx_runtime_1.jsx)("th", { className: "px-2 py-3", children: col.header }, index))) }) }), (0, jsx_runtime_1.jsx)("tbody", { children: items.map((item, index) => ((0, jsx_runtime_1.jsx)("tr", { className: (0, utils_1.classNames)("border-b border-neutral-200", onRowClick ? "cursor-pointer hover:bg-neutral-100" : "", rowClassName ? rowClassName(item) : ""), onClick: (ev) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { classNames } from "primereact/utils";
+export function SimpleTable({ items, columns, onRowHover, onRowClick, rowClassName, }) {
+    return (_jsxs("table", { className: "table-auto min-w-full text-left text-xs font-light text-surface", children: [_jsx("thead", { className: "border-b border-neutral-200 font-medium", children: _jsx("tr", { children: columns.map((col, index) => (_jsx("th", { className: "px-2 py-3", children: col.header }, index))) }) }), _jsx("tbody", { children: items.map((item, index) => (_jsx("tr", { className: classNames("border-b border-neutral-200", onRowClick ? "cursor-pointer hover:bg-neutral-100" : "", rowClassName ? rowClassName(item) : ""), onClick: (ev) => {
                         if (onRowClick)
                             onRowClick({ item, event: ev });
-                    }, onMouseOver: () => onRowHover?.(item), onMouseLeave: () => onRowHover?.(undefined), children: columns.map((col, index) => ((0, jsx_runtime_1.jsx)("td", { className: (0, utils_1.classNames)("px-2 py-2", col.className), children: col.body(item) }, index))) }, index))) })] }));
+                    }, onMouseOver: () => onRowHover?.(item), onMouseLeave: () => onRowHover?.(undefined), children: columns.map((col, index) => (_jsx("td", { className: classNames("px-2 py-2", col.className), children: col.body(item) }, index))) }, index))) })] }));
 }

package/dist/editor/ui/SimpleTabs.d.ts

@@ -0,0 +1,12 @@
+export type Tab = {
+    label: string;
+    content: React.ReactNode;
+    id: string;
+    testId?: string;
+};
+export declare function SimpleTabs({ tabs, setActiveTab, activeTab, className, }: {
+    tabs: Tab[];
+    setActiveTab: (index: number) => void;
+    activeTab: number;
+    className?: string;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/editor/ui/SimpleTabs.js

@@ -1,9 +1,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleTabs = SimpleTabs;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const tailwind_merge_1 = require("tailwind-merge");
-function SimpleTabs({ tabs, setActiveTab, activeTab, className, }) {
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { twMerge } from "tailwind-merge";
+export function SimpleTabs({ tabs, setActiveTab, activeTab, className, }) {
     if (activeTab > tabs.length - 1) {
         activeTab = 0;
     }
@@ -12,7 +9,7 @@ function SimpleTabs({ tabs, setActiveTab, activeTab, className, }) {
     }
     if (tabs.length === 0)
         return null;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: (0, tailwind_merge_1.twMerge)("flex gap-4 pb-3", className), children: tabs.map((tab, index) => ((0, jsx_runtime_1.jsx)("button", { id: tab.id, className: activeTab === index ? "active-tab" : "cursor-pointer", "data-testid": tab.testId, onClick: () => setActiveTab(index), style: {
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: twMerge("flex gap-4 pb-3", className), children: tabs.map((tab, index) => (_jsx("button", { id: tab.id, className: activeTab === index ? "active-tab" : "cursor-pointer", "data-testid": tab.testId, onClick: () => setActiveTab(index), style: {
                         fontWeight: index === activeTab ? "bold" : "normal",
                         borderBottom: index === activeTab ? "3px solid black" : "none",
                         marginBottom: index === activeTab ? "0" : "3px",

package/dist/editor/ui/SimpleToolbar.d.ts

@@ -0,0 +1,3 @@
+export declare function SimpleToolbar({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/SimpleToolbar.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleToolbar = SimpleToolbar;
-const jsx_runtime_1 = require("react/jsx-runtime");
-function SimpleToolbar({ children }) {
-    return ((0, jsx_runtime_1.jsx)("div", { className: "flex gap-2 p-2 items-center bg-gray-50 rounded-md border-b border-gray-200 text-gray-500 text-sm", children: children }));
+import { jsx as _jsx } from "react/jsx-runtime";
+export function SimpleToolbar({ children }) {
+    return (_jsx("div", { className: "flex gap-2 p-2 items-center bg-gray-50 rounded-md border-b border-gray-200 text-gray-500 text-sm", children: children }));
 }

package/dist/editor/ui/Spinner.d.ts

@@ -0,0 +1,3 @@
+export declare function Spinner({ size, }: {
+    size?: "2xl" | "3xl" | "4xl" | "5xl";
+}): import("react/jsx-runtime").JSX.Element;

package/dist/editor/ui/Spinner.js

@@ -1,7 +1,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Spinner = Spinner;
-const jsx_runtime_1 = require("react/jsx-runtime");
-function Spinner({ size = "4xl", }) {
-    return (0, jsx_runtime_1.jsx)("i", { className: `pi pi-cog pi-spin text-${size} text-gray-600` });
+import { jsx as _jsx } from "react/jsx-runtime";
+export function Spinner({ size = "4xl", }) {
+    return _jsx("i", { className: `pi pi-cog pi-spin text-${size} text-gray-600` });
 }

package/dist/editor/ui/Splitter.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+export type SplitterPanel = {
+    defaultSize: number | "auto";
+    name: string;
+    content: React.ReactNode;
+    collapsible?: boolean;
+};
+interface SplitterProps {
+    panels: SplitterPanel[];
+    localStorageKey?: string;
+    expandLabel?: React.ReactNode;
+    growablePanelIndex?: number;
+}
+export declare const Splitter: React.FC<SplitterProps>;
+export {};

package/dist/editor/ui/Splitter.js

@@ -1,45 +1,9 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Splitter = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = __importStar(require("react"));
-const react_dom_1 = require("react-dom");
-const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "Expand", }) => {
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState, useRef, useEffect, useCallback } from "react";
+import { flushSync } from "react-dom";
+export const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "Expand", }) => {
     const totalPanels = panels.length;
-    const [panelSizes, setPanelSizes] = (0, react_1.useState)(() => {
+    const [panelSizes, setPanelSizes] = useState(() => {
         // Load sizes from local storage on initial render
         const storedSizes = localStorage.getItem(localStorageKey);
         if (storedSizes) {
@@ -53,10 +17,10 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
         }
         return null; // No stored sizes, initial render will handle defaults
     });
-    const panelRefs = (0, react_1.useRef)([]);
-    const splitterRef = (0, react_1.useRef)(null);
+    const panelRefs = useRef([]);
+    const splitterRef = useRef(null);
     const lastPanelCollapsible = panels[panels.length - 1]?.collapsible;
-    const [isLastPanelCollapsed, setIsLastPanelCollapsed] = (0, react_1.useState)(() => {
+    const [isLastPanelCollapsed, setIsLastPanelCollapsed] = useState(() => {
         const storedSizes = localStorage.getItem(localStorageKey);
         if (storedSizes) {
             const parsedSizes = JSON.parse(storedSizes);
@@ -64,8 +28,8 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
         }
         return true;
     });
-    const [isResizing, setIsResizing] = (0, react_1.useState)(false);
-    (0, react_1.useEffect)(() => {
+    const [isResizing, setIsResizing] = useState(false);
+    useEffect(() => {
         if (!panelSizes && splitterRef.current) {
             const initialSizes = {};
             panels.forEach((panel) => {
@@ -74,7 +38,7 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
             setPanelSizes(initialSizes);
         }
     }, [panels]);
-    (0, react_1.useEffect)(() => {
+    useEffect(() => {
         if (panelSizes) {
             const storedSizes = {
                 panels: panelSizes,
@@ -86,13 +50,13 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
     const toggleLastPanelCollapse = () => {
         if (lastPanelCollapsible) {
             document.startViewTransition(() => {
-                (0, react_dom_1.flushSync)(() => {
+                flushSync(() => {
                     setIsLastPanelCollapsed((prev) => !prev);
                 });
             });
         }
     };
-    const handleResize = (0, react_1.useCallback)((index, event) => {
+    const handleResize = useCallback((index, event) => {
         event.preventDefault();
         const iframes = splitterRef.current?.querySelectorAll("iframe");
         iframes?.forEach((iframe) => {
@@ -162,17 +126,17 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
         return "1fr"; //default
     };
     const getExpandButton = () => {
-        return ((0, jsx_runtime_1.jsx)("div", { onClick: !isResizing ? toggleLastPanelCollapse : undefined, className: "select-none p-1 bg-gray-200  flex items-center justify-center text-gray-500  hover:bg-blue-700 hover:text-white cursor-pointer", style: { writingMode: "vertical-rl", userSelect: "none" }, children: expandLabel }));
+        return (_jsx("div", { onClick: !isResizing ? toggleLastPanelCollapse : undefined, className: "select-none p-1 bg-gray-200  flex items-center justify-center text-gray-500  hover:bg-blue-700 hover:text-white cursor-pointer", style: { writingMode: "vertical-rl", userSelect: "none" }, children: expandLabel }));
     };
     const getSplitter = (index) => {
         if (lastPanelCollapsible && isLastPanelCollapsed && isLastResizer(index)) {
             return getExpandButton();
         }
-        return ((0, jsx_runtime_1.jsx)("div", { className: " bg-gray-200 cursor-ew-resize select-none flex items-center justify-center hover:bg-blue-700  w-[4px] relative z-1000", onDoubleClick: isLastResizer(index) ? toggleLastPanelCollapse : undefined, onMouseDown: (event) => {
+        return (_jsx("div", { className: " bg-gray-200 cursor-ew-resize select-none flex items-center justify-center hover:bg-blue-700  w-[4px] relative z-1000", onDoubleClick: isLastResizer(index) ? toggleLastPanelCollapse : undefined, onMouseDown: (event) => {
                 handleResize(index, event);
             } }));
     };
-    return ((0, jsx_runtime_1.jsx)("div", { className: "flex w-full h-full overflow-hidden", ref: splitterRef, children: panels.map((panel, index) => ((0, jsx_runtime_1.jsxs)(react_1.default.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { ref: (el) => {
+    return (_jsx("div", { className: "flex w-full h-full overflow-hidden", ref: splitterRef, children: panels.map((panel, index) => (_jsxs(React.Fragment, { children: [_jsx("div", { ref: (el) => {
                         panelRefs.current[index] = el;
                     }, className: "relative", style: {
                         flex: `${panel.defaultSize === "auto" ? 1 : 0} 1 ${getFlexBasis(index)}`,
@@ -184,4 +148,3 @@ const Splitter = ({ panels, localStorageKey = "splitter-sizes", expandLabel = "E
                             : "block",
                     }, children: panel.content }), index < panels.length - 1 && getSplitter(index)] }, panel.name))) }));
 };
-exports.Splitter = Splitter;

package/dist/editor/ui/StackedPanels.d.ts

@@ -0,0 +1,5 @@
+import "allotment/dist/style.css";
+import { Panel } from "../../config/types";
+export declare function StackedPanels({ panels }: {
+    panels: Panel[];
+}): import("react/jsx-runtime").JSX.Element;