@septkit/ui 0.0.56 → 0.0.58

package/dist/index.d.ts

@@ -84,6 +84,13 @@ expanded: ExplorerExpandedState;
 ariaLabel: string;
 }, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
 
+declare const __VLS_component_6: DefineComponent<__VLS_Props_17, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<__VLS_Props_17> & Readonly<{}>, {
+direction: "horizontal" | "vertical";
+defaultSize: number;
+maxSize: number;
+minSize: number;
+}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;
+
 declare type __VLS_Props = {
     color?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error';
     variant?: 'outline' | 'dash' | 'soft' | 'ghost' | 'link';
@@ -144,6 +151,19 @@ declare type __VLS_Props_16 = {
     items: ContextMenuItem[];
 };
 
+declare type __VLS_Props_17 = {
+    /** Unique key: drives the splitter group's auto-save-id and both panel ids. */
+    persistenceKey: string;
+    showSidebar: boolean;
+    direction?: 'horizontal' | 'vertical';
+    /** Default size of the sidebar panel, in percent. */
+    defaultSize?: number;
+    /** Minimum size of the sidebar panel, in percent. */
+    minSize?: number;
+    /** Maximum size of the sidebar panel, in percent. */
+    maxSize?: number;
+};
+
 declare type __VLS_Props_2 = {
     /** Trigger color */
     color?: 'neutral' | 'primary' | 'secondary' | 'accent' | 'info' | 'success' | 'warning' | 'error';
@@ -321,6 +341,16 @@ declare function __VLS_template_5(): {
     rootEl: any;
 };
 
+declare function __VLS_template_6(): {
+    attrs: Partial<{}>;
+    slots: {
+        main?(_: {}): any;
+        sidebar?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+
 declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 
 declare type __VLS_TemplateResult_2 = ReturnType<typeof __VLS_template_2>;
@@ -331,6 +361,8 @@ declare type __VLS_TemplateResult_4 = ReturnType<typeof __VLS_template_4>;
 
 declare type __VLS_TemplateResult_5 = ReturnType<typeof __VLS_template_5>;
 
+declare type __VLS_TemplateResult_6 = ReturnType<typeof __VLS_template_6>;
+
 declare type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
@@ -361,6 +393,12 @@ declare type __VLS_WithTemplateSlots_5<T, S> = T & {
     };
 };
 
+declare type __VLS_WithTemplateSlots_6<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+
 export declare type ActionFn = () => void;
 
 /** The component + props + options currently mounted in the host (the "root"). */
@@ -502,6 +540,11 @@ export declare function createDocumentStore<GenericBaseDocument, GenericAugmente
     clear: () => void;
 };
 
+/** Create an ELK-backed `LayoutEngine`. Each instance owns its own ELK
+ * worker/instance so callers/tests stay isolated. `defaults` are applied to
+ * every `layout()` call and can be overridden per call via its `options`. */
+export declare function createElkLayoutEngine(defaults?: LayoutOptions): LayoutEngine;
+
 /** A user's binary choice on a decision group. */
 export declare type DecisionAction = 'accept' | 'skip';
 
@@ -708,6 +751,77 @@ export declare function highlightCode(code: string, options?: {
     lineStatuses?: readonly LineStatus[];
 }): Promise<string>;
 
+export declare type LayoutDirection = 'UP' | 'DOWN' | 'LEFT' | 'RIGHT';
+
+/** A connection between nodes. Arrays mirror ELK's hyperedge model, so a
+ * single logical edge can bundle multiple sources/targets (for example
+ * ELK's `mergeEdges` bus-style routing). */
+export declare type LayoutEdge = {
+    id: string;
+    sources: string[];
+    targets: string[];
+};
+
+/** A swappable diagram layout algorithm. */
+export declare type LayoutEngine = {
+    layout(input: LayoutGraphInput, options?: LayoutOptions): Promise<LayoutGraphResult>;
+};
+
+export declare type LayoutGraphInput = {
+    nodes: LayoutNode[];
+    edges: LayoutEdge[];
+};
+
+export declare type LayoutGraphResult = {
+    /** Computed position per node id. */
+    positions: Record<string, LayoutPoint>;
+    /**
+     * Computed route points per edge id (start, optional bend points, end),
+     * when the engine produces routed edges. Absent/empty for engines that
+     * don't route edges explicitly.
+     */
+    edgeRoutes: Record<string, LayoutPoint[]>;
+};
+
+/**
+ * Normalized, engine-agnostic diagram layout contract. No Vue, Pinia, SCL,
+ * Dialecte, or VueFlow types may appear here — see ADR-0024 (shared
+ * swappable diagram layout engine).
+ */
+/** A single node to be positioned. */
+export declare type LayoutNode = {
+    id: string;
+    width: number;
+    height: number;
+    /**
+     * Rank used to order siblings left-to-right during layout (for example
+     * to keep expansion order stable). Engines that don't support ordering
+     * hints may ignore this.
+     */
+    orderHint?: number;
+    /** Nested child nodes, for engines/consumers that lay out containment. */
+    children?: LayoutNode[];
+};
+
+export declare type LayoutOptions = {
+    direction?: LayoutDirection;
+    /** Minimum spacing between sibling nodes. */
+    nodeSpacing?: number;
+    /** Minimum spacing between layers/ranks. */
+    layerSpacing?: number;
+    /**
+     * Engine-specific escape hatch. `ElkLayoutEngine` forwards these
+     * verbatim as ELK layout options; other engines may ignore it.
+     */
+    elkOptions?: Record<string, string>;
+};
+
+/** An absolute point on an edge's route. */
+export declare type LayoutPoint = {
+    x: number;
+    y: number;
+};
+
 export declare type LineStatus = 'added' | 'removed' | 'unchanged';
 
 /**
@@ -821,6 +935,8 @@ export declare type ReactiveDocument = {
 
 export declare const SclExplorer: __VLS_WithTemplateSlots_5<typeof __VLS_component_5, __VLS_TemplateResult_5["slots"]>;
 
+export declare const SplitLayout: __VLS_WithTemplateSlots_6<typeof __VLS_component_6, __VLS_TemplateResult_6["slots"]>;
+
 /** Per-node selection payload: what to preview and (if any) the change it carries. */
 declare type StructuralNodeInfo = {
     previewRef: Scl.Ref<Scl.ElementsOf>;

package/dist/index.js

@@ -35,4 +35,8 @@ import N from "./merge/merge-review.js";
 import "./merge/index.js";
 import P from "./context-menu/context-menu.js";
 import "./context-menu/index.js";
-export { s as Button, y as CATEGORY_ELEMENTS, T as CodeBlock, l as Combobox, P as ContextMenu, O as DecisionToggle, d as Dialog, _ as DialogHost, v as DocumentProgressBar, c as Dropdown, b as ELEMENT_TO_COLOR, x as ELEMENT_TO_ICON, k as ElementDetail, f as FeedbackDialog, N as MergeReview, A as MergeTree, u as MultiSelect, C as SclExplorer, j as TypeNameAuthority, D as XmlDiff, S as collectExpandableNodeIds, p as createDialogHost, e as createDocumentStore, m as dialogHostKey, E as diffLines, w as highlightCode, h as provideDialogHost, i as useActiveDocument, t as useDialecteChannel, g as useDialog, a as useDocumentProgress, o as useDocumentState, n as useLiveData, M as useMergeSession, r as useProjectLiveData };
+import F from "./split-layout/split-layout.js";
+import "./split-layout/index.js";
+import { createElkLayoutEngine as I } from "./diagram-layout/elk-layout-engine.js";
+import "./diagram-layout/index.js";
+export { s as Button, y as CATEGORY_ELEMENTS, T as CodeBlock, l as Combobox, P as ContextMenu, O as DecisionToggle, d as Dialog, _ as DialogHost, v as DocumentProgressBar, c as Dropdown, b as ELEMENT_TO_COLOR, x as ELEMENT_TO_ICON, k as ElementDetail, f as FeedbackDialog, N as MergeReview, A as MergeTree, u as MultiSelect, C as SclExplorer, F as SplitLayout, j as TypeNameAuthority, D as XmlDiff, S as collectExpandableNodeIds, p as createDialogHost, e as createDocumentStore, I as createElkLayoutEngine, m as dialogHostKey, E as diffLines, w as highlightCode, h as provideDialogHost, i as useActiveDocument, t as useDialecteChannel, g as useDialog, a as useDocumentProgress, o as useDocumentState, n as useLiveData, M as useMergeSession, r as useProjectLiveData };

package/dist/split-layout/index.js

@@ -0,0 +1,2 @@
+import e from "./split-layout.js";
+export { e as SplitLayout };

package/dist/split-layout/split-layout.js

@@ -0,0 +1,5 @@
+import e from "./split-layout.vue_vue_type_script_setup_true_lang.js";
+//#region lib/split-layout/split-layout.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/split-layout/split-layout.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,55 @@
+import { SplitterGroup_default as e } from "../external/.pnpm/reka-ui@2.10.1_vue@3.5.39_typescript@5.8.3_/node_modules/reka-ui/dist/Splitter/SplitterGroup.js";
+import { SplitterPanel_default as t } from "../external/.pnpm/reka-ui@2.10.1_vue@3.5.39_typescript@5.8.3_/node_modules/reka-ui/dist/Splitter/SplitterPanel.js";
+import { SplitterResizeHandle_default as n } from "../external/.pnpm/reka-ui@2.10.1_vue@3.5.39_typescript@5.8.3_/node_modules/reka-ui/dist/Splitter/SplitterResizeHandle.js";
+import { Fragment as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createVNode as l, defineComponent as u, openBlock as d, renderSlot as f, unref as p, withCtx as m } from "vue";
+//#region lib/split-layout/split-layout.vue?vue&type=script&setup=true&lang.ts
+var h = { class: "h-full p-4" }, g = { class: "absolute h-full w-full p-4" }, _ = /*@__PURE__*/ u({
+	__name: "split-layout",
+	props: {
+		persistenceKey: {},
+		showSidebar: { type: Boolean },
+		direction: { default: "horizontal" },
+		defaultSize: { default: 25 },
+		minSize: { default: 15 },
+		maxSize: { default: 50 }
+	},
+	setup(u) {
+		let _ = u, v = i(() => `${_.persistenceKey}-main`), y = i(() => `${_.persistenceKey}-sidebar`), b = i(() => _.showSidebar ? 100 - _.defaultSize : 100);
+		return (i, _) => (d(), a(p(e), {
+			direction: u.direction,
+			"auto-save-id": u.persistenceKey,
+			class: "h-full w-full"
+		}, {
+			default: m(() => [l(p(t), {
+				id: v.value,
+				order: 1,
+				"default-size": b.value,
+				class: "bg-base-200"
+			}, {
+				default: m(() => [c("div", h, [f(i.$slots, "main")])]),
+				_: 3
+			}, 8, ["id", "default-size"]), u.showSidebar ? (d(), s(r, { key: 0 }, [l(p(n), {
+				"data-testid": "resize-handle",
+				class: "w-0.5 bg-base-300 transition-colors duration-200 hover:bg-primary/20"
+			}), l(p(t), {
+				id: y.value,
+				order: 2,
+				"default-size": u.defaultSize,
+				"min-size": u.minSize,
+				"max-size": u.maxSize,
+				class: "relative border-l-2 border-base-300 bg-base-100"
+			}, {
+				default: m(() => [c("div", g, [f(i.$slots, "sidebar")])]),
+				_: 3
+			}, 8, [
+				"id",
+				"default-size",
+				"min-size",
+				"max-size"
+			])], 64)) : o("", !0)]),
+			_: 3
+		}, 8, ["direction", "auto-save-id"]));
+	}
+});
+//#endregion
+export { _ as default };