@alpaca-headless/alpaca-headless-nextjs 1.0.246 → 1.0.281

package/dist/esm/editor/sidebar/ComponentTree.js

@@ -1,237 +0,0 @@
-"use client";
-import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEditContext } from "../editContext";
-import { Tree, } from "primereact/tree";
-import { useEffect, useRef, useState } from "react";
-import { Tag } from "primereact/tag";
-import { confirmDialog } from "primereact/confirmdialog";
-import { getComponentCommands } from "../commands/componentCommands";
-import { Tooltip } from "primereact/tooltip";
-function mapPlaceholderNode(p, parent) {
-    const node = {
-        key: p.key,
-        componentId: p.key,
-        label: p.name,
-        data: p,
-        icon: "pi pi-folder",
-        parent: parent,
-        droppable: true,
-    };
-    node.children = p.components.map((c) => mapComponentNode(c, node));
-    return node;
-}
-function mapPlaceholders(c, parent) {
-    if (c.placeholders.length > 1)
-        return c.placeholders.map((x) => mapPlaceholderNode(x, parent));
-    else if (c.placeholders.length > 0)
-        return c.placeholders[0].components.map((c) => mapComponentNode(c, parent));
-    return [];
-}
-function mapComponentNode(c, parent) {
-    var _a;
-    const node = {
-        key: c._editor.linkItemId + "_" + c.id || c.id,
-        componentId: c.id,
-        label: c.name,
-        icon: "pi pi-stop",
-        data: c,
-        parent: parent,
-        tags: [],
-        droppable: true,
-        className: c._editor.isRemovedFromMasterLanguage ? "a-text-gray-400" : "",
-    };
-    // if (c.translations && c.translations.length > 1)
-    //   node.tags!.push({
-    //     severity: "info",
-    //     value: c.translations!.length + " Languages",
-    //     icon: "pi pi-flag",
-    //   });
-    if (c._editor.isInheritedFromMasterLanguage) {
-        node.tags.push({
-            id: "inherited",
-            severity: "info",
-            value: "Inherited " +
-                (c._editor.isRemovedFromMasterLanguage ? " / removed" : ""),
-            tooltip: c._editor.isRemovedFromMasterLanguage
-                ? "Component was removed from master language"
-                : "Component is inherited from master language",
-            icon: "pi pi-caret-right",
-        });
-    }
-    if (c._editor.hostingPageItem) {
-        node.tags.push({
-            id: "layout",
-            severity: "warning",
-            value: "Layout",
-            icon: "",
-            color: "rgb(192 132 252)",
-            tooltip: "Component is inherited from layout. Click to edit layout.",
-            onClick: () => {
-                var _a;
-                confirmDialog({
-                    header: "Edit layout",
-                    message: "Edit layout " + ((_a = c._editor.hostingPageItem) === null || _a === void 0 ? void 0 : _a.path) + "?",
-                    accept: () => window.open(c._editor.hostingPageItem.editUrl, "_blank"),
-                });
-            },
-        });
-    }
-    if (c._editor.linkedComponentItem) {
-        node.tags.push({
-            id: "linked",
-            severity: "warning",
-            value: "Shared",
-            icon: "",
-            tooltip: "Component is linked to " + ((_a = c._editor.linkedComponentItem) === null || _a === void 0 ? void 0 : _a.path),
-            color: "rgb(251, 146, 60)",
-        });
-    }
-    if (!c.visible) {
-        node.tags.push({
-            id: "hidden",
-            severity: "warning",
-            value: "Hidden",
-            icon: "pi pi-exclamation-triangle",
-            color: "rgb(251, 146, 60)",
-            tooltip: "Component is hidden. " +
-                (c._editor.messages ? c._editor.messages.join(", ") : ""),
-        });
-    }
-    node.children = mapPlaceholders(c, node);
-    return node;
-}
-export function ComponentTree({}) {
-    const [expandedKeys, setExpandedKeys] = useState({
-        "0": true,
-    });
-    const [selectedKeys, setSelectedKeys] = useState();
-    let editContext = useEditContext();
-    const treeRef = useRef(null);
-    useEffect(() => {
-        if (treeRef.current) {
-            const selectedNodeKey = Object.keys(selectedKeys || {})[0];
-            const selectedNodeElement = treeRef.current.querySelector(`[data-key="${selectedNodeKey}"]`);
-            if (selectedNodeElement) {
-                selectedNodeElement.scrollIntoView({
-                    behavior: "smooth",
-                    block: "nearest",
-                });
-            }
-        }
-    }, [selectedKeys]);
-    const selection = (editContext === null || editContext === void 0 ? void 0 : editContext.selection) || [];
-    const page = editContext === null || editContext === void 0 ? void 0 : editContext.page;
-    useEffect(() => {
-        const newSelectedKeys = {};
-        selection.forEach((id) => {
-            const nodes = findNodesByComponentId(id, nodeDictionary);
-            nodes.forEach((nodeId) => {
-                newSelectedKeys[nodeId] = true;
-            });
-        });
-        const newExpandedKeys = Object.assign({}, expandedKeys);
-        Object.keys(newSelectedKeys).forEach((id) => {
-            const node = nodeDictionary[id];
-            if (node)
-                expandParents(node.parent, newExpandedKeys);
-        });
-        if (!hasSameProps(newExpandedKeys, expandedKeys))
-            setExpandedKeys(newExpandedKeys);
-        setSelectedKeys(newSelectedKeys);
-    }, [selection]);
-    if (!editContext)
-        return;
-    if (!page)
-        return _jsx(_Fragment, {});
-    const treeNodes = mapPlaceholders(page, {});
-    const nodeDictionary = {};
-    createMap(treeNodes, nodeDictionary);
-    const nodeTemplate = (node, options) => {
-        var _a;
-        let label = (_jsxs("span", { "data-key": node.key, className: "a-flex a-items-center", children: [_jsx("span", { className: node.className, children: node.label }), (_a = node.tags) === null || _a === void 0 ? void 0 : _a.map((x) => (_jsxs("span", { children: [_jsx(Tag, { id: "id-" + node.key + x.id, icon: x.icon, value: x.value, severity: x.severity, onClick: x.onClick, style: {
-                                backgroundColor: x.color,
-                                marginLeft: "8px",
-                                fontSize: "10px",
-                                padding: "1px 4px 2px 2px",
-                            } }), _jsx(Tooltip, { target: "#id-" + node.key + x.id, content: x.tooltip })] }, node.key + x.id)))] }));
-        return _jsx("span", { className: options.className, children: label });
-    };
-    return (_jsx("div", { className: "a-p-1", ref: treeRef, children: _jsx(Tree, { value: treeNodes, selectionMode: "multiple", selectionKeys: selectedKeys, className: "a-w-full alpaca-no-border a-text-xs", onToggle: (e) => setExpandedKeys(e.value), expandedKeys: expandedKeys, nodeTemplate: nodeTemplate, dragdropScope: "ignore", onSelectionChange: (ev) => {
-                if (ev.value) {
-                    const selectedKeys = Object.keys(ev.value);
-                    const selectedComponentIds = selectedKeys
-                        .filter((key) => nodeDictionary[key])
-                        .map((key) => nodeDictionary[key].componentId);
-                    editContext === null || editContext === void 0 ? void 0 : editContext.select(selectedComponentIds);
-                    if (selectedComponentIds.length === 1)
-                        editContext.setScrollIntoView(selectedComponentIds[0]);
-                }
-                else {
-                    editContext === null || editContext === void 0 ? void 0 : editContext.select([]);
-                }
-            }, onDragDrop: (e) => {
-                console.log(e.dropNode);
-                console.log(e.dragNode);
-                console.log(e.dropIndex);
-            }, onContextMenu: (e) => {
-                const componentId = nodeDictionary[e.node.key].componentId;
-                let selectedComponentIds = selection;
-                if (componentId) {
-                    if (selection.indexOf(componentId) < 0) {
-                        editContext === null || editContext === void 0 ? void 0 : editContext.select([componentId]);
-                        selectedComponentIds = [componentId];
-                    }
-                }
-                let selectedEntities = selectedComponentIds
-                    .filter((key) => nodeDictionary[key])
-                    .map((key) => nodeDictionary[key].data)
-                    .filter((x) => x);
-                if (selectedEntities.length === 0) {
-                    selectedEntities = [e.node.data];
-                }
-                let commands = getComponentCommands(selectedEntities, editContext);
-                const menu = commands.map((x) => ({
-                    label: x.label,
-                    icon: x.icon,
-                    disabled: editContext === null || editContext === void 0 ? void 0 : editContext.isCommandDisabled(x),
-                    command: (ev) => {
-                        editContext === null || editContext === void 0 ? void 0 : editContext.executeCommand({
-                            command: x,
-                            event: ev.originalEvent,
-                        });
-                    },
-                }));
-                editContext === null || editContext === void 0 ? void 0 : editContext.showContextMenu(e.originalEvent, menu);
-            } }) }));
-}
-function createMap(treeNodes, nodeDictionary) {
-    treeNodes.forEach((n) => {
-        if (n.key)
-            nodeDictionary[n.key] = n;
-        if (n.children)
-            createMap(n.children, nodeDictionary);
-    });
-}
-function findNodesByComponentId(id, nodesDictionary) {
-    const allNodes = Object.values(nodesDictionary);
-    return allNodes
-        .filter((x) => x.componentId === id)
-        .map((x) => { var _a; return ((_a = x.key) === null || _a === void 0 ? void 0 : _a.toString()) || ""; });
-}
-function expandParents(node, newExpandedKeys) {
-    if (!node)
-        return;
-    if (node.key)
-        newExpandedKeys[node.key] = true;
-    if (node.parent)
-        expandParents(node.parent, newExpandedKeys);
-}
-function hasSameProps(obj1, obj2) {
-    var obj1Props = Object.keys(obj1), obj2Props = Object.keys(obj2);
-    if (obj1Props.length == obj2Props.length) {
-        return obj1Props.every(function (prop) {
-            return obj2Props.indexOf(prop) >= 0;
-        });
-    }
-    return false;
-}

package/dist/esm/editor/sidebar/Debug.js

@@ -1,46 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TabView, TabPanel } from "primereact/tabview";
-import { CopyToClipboardButton } from "../ui/CopyToClipboardButton";
-import { useState } from "react";
-import { useEditContext } from "../editContext";
-import { getComponentById } from "../componentTreeHelper";
-import { ObjectInspector, ObjectLabel, ObjectRootLabel } from "react-inspector";
-export function Debug({}) {
-    const [activeTab, setActiveTab] = useState(0);
-    const editContext = useEditContext();
-    if (!editContext)
-        return;
-    const page = editContext.page;
-    let component = null;
-    if (page) {
-        const selectedComponents = editContext.selection
-            .map((x) => getComponentById(x, page))
-            .filter((x) => x);
-        component = selectedComponents.length === 1 ? selectedComponents[0] : null;
-    }
-    if (!component && !page)
-        return;
-    const replacer = function (key, value) {
-        if (key === "parentComponent" ||
-            key === "placeholderReference" ||
-            key === "_editor") {
-            return undefined;
-        }
-        return value;
-    };
-    const tabs = [];
-    const defaultNodeRenderer = ({ depth, name, data, isNonenumerable }) => {
-        if (name == "__editor" ||
-            name == "parentComponent" ||
-            name == "placeholderReference")
-            return null;
-        return depth === 0 ? (_jsx(ObjectRootLabel, { name: name, data: data })) : (_jsx(ObjectLabel, { name: name, data: data, isNonenumerable: isNonenumerable }));
-    };
-    if (component) {
-        tabs.push(_jsx(TabPanel, { header: "Component", className: "a-relative a-h-full", children: _jsx("div", { className: "a-inset-0 a-absolute a-overflow-auto a-p-2", children: _jsx(ObjectInspector, { data: component, nodeRenderer: defaultNodeRenderer }) }) }, "component"));
-    }
-    tabs.push(_jsx(TabPanel, { header: "Page", className: "a-relative a-h-full", children: _jsx("div", { className: "a-inset-0 a-absolute a-overflow-auto a-p-2", children: _jsx(ObjectInspector, { data: page, nodeRenderer: defaultNodeRenderer }) }) }, "page"));
-    return (_jsxs("div", { className: "a-relative a-h-[calc(100%-6px)]", children: [_jsx(TabView, { className: "a-h-full alpaca-editor-tabs", onTabChange: (ev) => {
-                    setActiveTab(ev.index);
-                }, activeIndex: activeTab, children: tabs }), _jsx("div", { className: "a-absolute a-top-2 a-right-1", children: _jsx(CopyToClipboardButton, { text: JSON.stringify(activeTab === 0 && component ? component : page, replacer, 2) }) })] }));
-}

package/dist/esm/editor/sidebar/EditHistory.js

@@ -1,66 +0,0 @@
-"use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { classNames } from "primereact/utils";
-import { useEditContext } from "../editContext";
-import { useState } from "react";
-import { WizardIcon } from "../ui/Icons";
-export function EditHistory() {
-    const editContext = useEditContext();
-    const [showOnlyMyChanges, setShowOnlyMyChanges] = useState(true);
-    if (!editContext)
-        return;
-    let operations = showOnlyMyChanges
-        ? editContext.editHistory.filter((x) => x.sessionId === editContext.sessionId)
-        : editContext.editHistory;
-    operations = filterUndone(operations);
-    const dateOptions = {
-        year: "numeric",
-        month: "numeric",
-        day: "numeric",
-        hour: "numeric",
-        minute: "numeric",
-        second: "numeric",
-        hour12: false,
-    };
-    const dateFormat = Intl.DateTimeFormat(navigator.language, dateOptions);
-    return (_jsxs("div", { className: "a-inset-0 a-absolute a-flex a-flex-col", children: [_jsx("div", { className: "a-bg-gray-50", children: _jsx("i", { className: classNames("pi pi-user a-text-xs a-cursor-pointer a-p-0.5", showOnlyMyChanges && "a-bg-gray-200"), onClick: () => setShowOnlyMyChanges(!showOnlyMyChanges), title: "Show only my changes" }) }), _jsx("div", { className: "flex-1 a-flex a-flex-col a-overflow-y-auto a-overflow-x-hidden a-text-sm", children: operations.map((o, i) => singleOperation(i, o)) })] }));
-    function getDate(o) {
-        const date = new Date(o.date);
-        return dateFormat.format(date);
-    }
-    function singleOperation(i, o) {
-        var _a, _b;
-        let className = "a-border-b a-p-1 a-flex a-justify-between a-items-start a-text-xs";
-        if (o.undone)
-            className = className + " a-text-gray-300";
-        if (o.focus)
-            className = className + " a-cursor-pointer";
-        return (_jsxs("div", { className: className, onClick: () => {
-                if (o.focus) {
-                    const focusComponents = o.focus.split(":");
-                    if (focusComponents.length > 0) {
-                        editContext === null || editContext === void 0 ? void 0 : editContext.select([focusComponents[0]]);
-                    }
-                    if (focusComponents.length > 1) {
-                        editContext === null || editContext === void 0 ? void 0 : editContext.setFocusedField({
-                            item: {
-                                id: focusComponents[0],
-                                language: editContext.page.language,
-                                version: editContext.page.version,
-                            },
-                            fieldId: focusComponents[1],
-                        }, false);
-                    }
-                }
-            }, children: [_jsxs("div", { className: "a-flex a-gap-1", children: [((_a = o.user) === null || _a === void 0 ? void 0 : _a.ai) && (_jsx(WizardIcon, { className: classNames("a-w-4 a-h-4", o.undone ? "a-text-gray-200" : "a-text-gray-500") })), _jsx("div", { children: o.description })] }), _jsxs("div", { children: [_jsx("div", { className: "a-text-xs", children: getDate(o) }), !showOnlyMyChanges && (_jsx("div", { className: "a-text-xs", children: (_b = o.user) === null || _b === void 0 ? void 0 : _b.name }))] })] }, i));
-    }
-}
-function filterUndone(operations) {
-    let allUndone = true;
-    return operations.filter((o) => {
-        if (!o.undone) {
-            allUndone = false;
-        }
-        return allUndone || !o.undone;
-    });
-}

package/dist/esm/editor/sidebar/EditorForm.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TabPanel, TabView } from "primereact/tabview";
-import { useEditContext } from "../editContext";
-import { getComponentById } from "../componentTreeHelper";
-import { FieldList } from "../FieldList";
-export function EditorForm() {
-    var _a, _b;
-    const editContext = useEditContext();
-    if (!editContext)
-        return;
-    const page = editContext.page;
-    if (!page)
-        return;
-    const selectedComponents = editContext.selection
-        .map((x) => getComponentById(x, page))
-        .filter((x) => x);
-    const selectedComponent = selectedComponents.length === 1 ? selectedComponents[0] : page;
-    const validators = ((_b = (_a = editContext.pageValidationResult) === null || _a === void 0 ? void 0 : _a.find((x) => x.item.id === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.id) &&
-        x.item.language === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.language) &&
-        x.item.version === (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.version))) === null || _b === void 0 ? void 0 : _b.results) || [];
-    return (_jsxs("div", { className: "a-flex a-flex-col a-h-full", children: [_jsxs("h1", { className: "a-border-b a-border-gray-200 a-flex a-justify-center a-items-center a-h-12", children: [selectedComponents.length > 0 && (_jsx("i", { className: "pi pi-angle-left a-cursor-pointer a-mr-2 a-p-4", onClick: () => editContext.select([]) })), _jsx("div", { className: "a-flex-1 a-text-center", children: (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.name) || page.name || "Page" }), selectedComponents.length > 0 && _jsx("div", { className: "a-w-12" })] }), _jsxs(TabView, { className: "a-flex-1 a-flex a-flex-col", children: [_jsx(TabPanel, { header: "Content", className: "a-h-full", children: _jsx("div", { className: "a-relative a-h-full", children: _jsx("div", { className: "a-p-4 a-overflow-auto a-absolute a-inset-0", children: _jsx(FieldList, { fields: (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.fields) || [], validators: validators, simplified: true, filter: (x) => editContext.configuration.alwaysVisiblePageFields.includes(x._editor.name) ||
-                                        editContext.renderedFields.find((y) => y.fieldId == x.id &&
-                                            x._editor.descriptor.item.id == y.item.id) != null }) }) }) }), _jsx(TabPanel, { header: "Advanced", className: "a-h-full", children: _jsx("div", { className: "a-relative a-h-full", children: _jsx("div", { className: "a-p-2 a-overflow-auto a-absolute a-inset-0 ", children: _jsx(FieldList, { fields: (selectedComponent === null || selectedComponent === void 0 ? void 0 : selectedComponent.fields) || [], validators: validators }) }) }) })] })] }));
-}

package/dist/esm/editor/sidebar/GraphQL.js

@@ -1,85 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TabView, TabPanel } from "primereact/tabview";
-import { FieldList } from "../FieldList";
-import { Splitter, SplitterPanel } from "primereact/splitter";
-import { InputTextarea } from "primereact/inputtextarea";
-import { Button } from "primereact/button";
-import { useEffect, useState } from "react";
-import { format } from "graphql-formatter";
-import { useEditContext } from "../editContext";
-import { ObjectInspector } from "react-inspector";
-export function GraphQL() {
-    const editContext = useEditContext();
-    const [query, setQuery] = useState("");
-    const [showSpinner, setShowSpinner] = useState(false);
-    const item = editContext === null || editContext === void 0 ? void 0 : editContext.page;
-    if (!(item === null || item === void 0 ? void 0 : item._editor))
-        return;
-    const graphql = item.graphql;
-    const graphql_query = item._editor.graphql_query;
-    useEffect(() => {
-        setQuery(graphql_query);
-    }, [graphql_query]);
-    useEffect(() => {
-        setShowSpinner(false);
-    }, [editContext === null || editContext === void 0 ? void 0 : editContext.refreshCompletedFlag]);
-    function findFields(json) {
-        let result = {};
-        for (let key in json) {
-            if (typeof json[key] === "object" && json[key] !== null) {
-                let subResult = findFields(json[key]);
-                for (let subKey in subResult) {
-                    if (result[subKey]) {
-                        result[subKey] = result[subKey].concat(subResult[subKey]);
-                    }
-                    else {
-                        result[subKey] = subResult[subKey];
-                    }
-                }
-            }
-            if (key === "jsonValue" && json[key]) {
-                let groupKey = `${json[key].itemId}_${json[key].language}_${json[key].version}`;
-                if (result[groupKey]) {
-                    result[groupKey].push(json[key]);
-                }
-                else {
-                    result[groupKey] = [json[key]];
-                }
-            }
-        }
-        return result;
-    }
-    const fieldsjsonValues = findFields(graphql);
-    function renderItem(fields) {
-        var _a, _b, _c;
-        const first = fields[0];
-        const item = (_a = first._editor) === null || _a === void 0 ? void 0 : _a.descriptor.item;
-        if (!item)
-            return null;
-        return (_jsxs("div", { children: ["Item: ", item.name, " ", first.id, " ", item.language, " ", item.version, _jsx(FieldList, { fields: fields, validators: ((_c = (_b = editContext === null || editContext === void 0 ? void 0 : editContext.pageValidationResult) === null || _b === void 0 ? void 0 : _b.find((x) => x.item.id === item.id &&
-                        x.item.language === item.language &&
-                        x.item.version === item.version)) === null || _c === void 0 ? void 0 : _c.results) || [] })] }, first.id + item.id + item.language + item.version));
-    }
-    function refresh() {
-        if (!item)
-            return;
-        const field = {
-            _editor: {
-                name: "_GraphQL",
-                type: "jsonValue",
-                descriptor: {
-                    item: item,
-                    fieldId: "3622F861-ECA9-45D7-8DA7-2CDA35235002",
-                },
-            },
-            id: "3622F861-ECA9-45D7-8DA7-2CDA35235002",
-            value: query,
-        };
-        const prettyQuery = format(query);
-        setQuery(prettyQuery);
-        editContext === null || editContext === void 0 ? void 0 : editContext.editField({ field, value: prettyQuery });
-        setShowSpinner(true);
-        editContext === null || editContext === void 0 ? void 0 : editContext.requestRefresh("immediate");
-    }
-    return (_jsxs(Splitter, { layout: "vertical", style: { height: "100%" }, children: [_jsx(SplitterPanel, { size: 50, className: "a-relative", children: _jsxs("div", { className: "a-absolute a-inset-0 a-flex", children: [_jsx(InputTextarea, { value: query, onChange: (e) => setQuery(e.target.value), className: "a-flex-1 a-text-xs", style: { height: "100%" } }), _jsx(Button, { icon: "pi pi-refresh" + (showSpinner ? " pi-spin" : ""), onClick: refresh, disabled: showSpinner })] }) }), _jsx(SplitterPanel, { className: "a-relative", children: _jsxs(TabView, { className: "a-inset-0 a-absolute a-flex a-flex-col", children: [_jsx(TabPanel, { header: "JSON", className: "a-relative a-h-full", children: _jsx("div", { className: "a-inset-0 a-absolute a-overflow-y-auto a-p-2", children: _jsx(ObjectInspector, { data: graphql, expandLevel: 3 }) }) }), _jsx(TabPanel, { header: "Data", className: "a-relative a-h-full", children: _jsx("div", { className: "a-m-1 a-h-full", children: Object.values(fieldsjsonValues).map((x) => renderItem(x)) }) })] }) })] }));
-}

package/dist/esm/editor/sidebar/Insert.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TabPanel, TabView } from "primereact/tabview";
-import { ComponentPalette } from "./ComponentPalette";
-import { MainContentTree } from "./MainContentTree";
-export function Insert() {
-    return (_jsxs(TabView, { className: "a-flex-1 a-flex a-flex-col", children: [_jsx(TabPanel, { header: "New Components", className: "a-h-full", children: _jsx(ComponentPalette, {}) }, "new"), _jsx(TabPanel, { header: "Existing", className: "a-h-full", children: _jsx(MainContentTree, { mode: "insert" }) }, "existing")] }));
-}

package/dist/esm/editor/sidebar/MainContentTree.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import ContentTree from "../ContentTree";
-import { useEditContext } from "../editContext";
-import { getInsertOptionsForCurrentSelection } from "../utils/insertOptions";
-export function MainContentTree({ mode }) {
-    var _a;
-    const editContext = useEditContext();
-    if (!editContext)
-        return null;
-    const page = editContext.page;
-    if (!(page === null || page === void 0 ? void 0 : page._editor))
-        return null;
-    const currentInsertOptions = getInsertOptionsForCurrentSelection(editContext);
-    return (_jsx(ContentTree, { rootItemId: "{11111111-1111-1111-1111-111111111111}", expandIdPath: page._editor.idPath, className: "a-p-1", selectionMode: mode == "insert" ? "none" : "single", selectedItemIds: editContext.secondaryItem ? [editContext.secondaryItem.id] : [page.id], secondarySelectedItemId: (_a = editContext.secondaryItem) === null || _a === void 0 ? void 0 : _a.id, onSelectionChange: (selection) => {
-            const selectedItem = selection;
-            editContext.loadItem({
-                id: selectedItem.id,
-                language: selectedItem.language,
-                version: selectedItem.version,
-                hasLayout: selectedItem.hasLayout,
-            });
-        }, isDraggable: (x) => mode !== "insert" &&
-            (currentInsertOptions === null || currentInsertOptions === void 0 ? void 0 : currentInsertOptions.find((insertOption) => {
-                var _a;
-                return insertOption.id == x.templateId ||
-                    ((_a = insertOption.compatibleTemplates) === null || _a === void 0 ? void 0 : _a.find((compatibleTemplate) => compatibleTemplate == x.templateId)) !== undefined;
-            })) !== undefined, dragStart: (itemNode) => {
-            editContext.dragStart({
-                type: "link-component",
-                templateId: itemNode.templateId,
-                component: {
-                    id: itemNode.id,
-                    language: itemNode.language,
-                    version: itemNode.version,
-                },
-            });
-        } }));
-}

package/dist/esm/editor/sidebar/Sessions.js

@@ -1,11 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { DataTable } from "primereact/datatable";
-import { Column } from "primereact/column";
-import { useEditContext } from "../editContext";
-export function Sessions() {
-    var editContext = useEditContext();
-    if (!editContext)
-        return null;
-    const sessions = editContext === null || editContext === void 0 ? void 0 : editContext.activeSessions;
-    return (_jsxs(DataTable, { value: sessions, className: "a-text-xs a-w-full", children: [_jsx(Column, { body: (session) => { var _a; return (_a = session.user) === null || _a === void 0 ? void 0 : _a.name; }, header: "User" }), _jsx(Column, { body: (session) => { var _a; return (_a = session.page) === null || _a === void 0 ? void 0 : _a.name; }, header: "Page" }), _jsx(Column, { body: (session) => { var _a; return (_a = session.page) === null || _a === void 0 ? void 0 : _a.language; }, header: "Language" }), _jsx(Column, { body: (session) => { var _a; return (_a = session.page) === null || _a === void 0 ? void 0 : _a.version; }, header: "Version" })] }));
-}

package/dist/esm/editor/sidebar/Sidebar.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { classNames } from "primereact/utils";
-import { useEditContext } from "../editContext";
-import { SidebarView } from "./SidebarView";
-export function Sidebar({ views }) {
-    var editContext = useEditContext();
-    if (!editContext)
-        return null;
-    const view = editContext.view;
-    return (_jsxs("div", { className: "a-flex a-items-stretch a-h-full", children: [_jsx("div", { className: "a-bg-slate-700 a-flex a-flex-col ", children: views.map((x, i) => (_jsx("div", { title: x.title, className: classNames(view.name == x.name
-                        ? "a-text-white"
-                        : "a-text-gray-400 hover:a-text-white", "a-cursor-pointer a-p-3"), onClick: () => editContext.setView(x), children: typeof x.icon === "string" ? (_jsx("i", { className: classNames(x.icon, "a-text-xl") })) : (x.icon) }, i))) }), views.map((x, i) => (_jsx(SidebarView, { view: x, editContext: editContext, active: view.name === x.name }, i)))] }));
-}

package/dist/esm/editor/sidebar/SidebarView.js

@@ -1,69 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import "allotment/dist/style.css";
-import { Allotment } from "allotment";
-import { useEffect, useRef, useState } from "react";
-import { classNames } from "primereact/utils";
-export function SidebarView({ view, editContext, active, }) {
-    const splitter = useRef(null);
-    const [sizes, setSizes] = useState([]);
-    const [preferredSizes, setPreferredSizes] = useState([]);
-    const [panelsExpanded, setPanelsExpanded] = useState([]);
-    const panelHeaderSize = 30;
-    const toggle = (panelIndex) => {
-        const newSize = panelsExpanded[panelIndex]
-            ? panelHeaderSize
-            : preferredSizes[panelIndex];
-        resizePanel(panelIndex, newSize);
-        setPanelsExpanded((x) => {
-            const newState = [...x];
-            newState[panelIndex] = !newState[panelIndex];
-            return newState;
-        });
-    };
-    useEffect(() => {
-        var _a;
-        if (sizes.length == 0)
-            return;
-        (_a = splitter.current) === null || _a === void 0 ? void 0 : _a.resize(sizes);
-    }, [sizes]);
-    const resolvedPanels = view.leftSidebar.map((x) => {
-        if (typeof x === "function") {
-            return x(editContext);
-        }
-        return x;
-    });
-    useEffect(() => {
-        setPanelsExpanded(view.leftSidebar.map(() => true));
-        setPreferredSizes(() => resolvedPanels.map((x) => x.initialSize));
-    }, [view]);
-    const resizePanel = (panelIndex, newSize) => {
-        const totalSize = sizes.reduce((a, b) => a + b, 0);
-        const totalOther = totalSize - sizes[panelIndex];
-        const tmpSizes = [...sizes];
-        tmpSizes[panelIndex] = newSize;
-        const percentages = tmpSizes.map((x) => x / totalOther);
-        percentages[panelIndex] = 0;
-        const remaining = totalSize - newSize;
-        const newSizes = percentages.map((x) => x * remaining);
-        newSizes[panelIndex] = newSize;
-        setSizes(newSizes);
-    };
-    const getHeader = (panel, index) => {
-        if (panel.header)
-            return panel.header({ panel, index });
-        return (_jsxs("div", { className: classNames("a-p-1.5 a-bg-gray-50 a-uppercase a-text-gray-500 a-text-xs a-flex a-justify a-items-center a-cursor-pointer", panelsExpanded[index] ? "a-border-b" : ""), onClick: () => toggle(index), children: [panel.icon &&
-                    (typeof panel.icon === "string" ? (_jsx("i", { className: classNames(panel.icon, "pi a-mr-1.5") })) : (_jsx("div", { className: "a-w-4 a-h-4 a-mr-1.5", children: panel.icon }))), _jsx("div", { className: "a-mr-auto", children: panel.title }), _jsx("i", { className: classNames(panelsExpanded[index] ? "pi-chevron-up" : "pi-chevron-down", "pi  a-text-sm") })] }));
-    };
-    return (_jsx(Allotment, { vertical: true, snap: true, defaultSizes: resolvedPanels.map((x) => x.initialSize), className: !active ? "a-hidden a-h-full" : "a-h-full", ref: splitter, onChange: (s) => {
-            if (preferredSizes.length == 0)
-                return;
-            if (sizes.join(",") != s.join(","))
-                setSizes(s);
-            const newPreferred = [...preferredSizes];
-            s.forEach((x, i) => {
-                if (x > panelHeaderSize)
-                    newPreferred[i] = x;
-            });
-            setPreferredSizes(newPreferred);
-        }, children: resolvedPanels.map((panel, index) => (_jsx(Allotment.Pane, { preferredSize: preferredSizes[index] + "%", maxSize: panelsExpanded[index] ? 10000 : panelHeaderSize, children: _jsxs("div", { className: "a-flex a-flex-col a-h-full", children: [getHeader(panel, index), panelsExpanded[index] && (_jsx("div", { className: "a-overflow-hidden a-relative a-flex-1", children: _jsx("div", { className: "a-inset-0 a-absolute a-overflow-y-auto", children: panel.content }) }))] }) }, index))) }));
-}