@feugene/granularity 0.1.0

package/dist/chunks/DsTree-Bz37FcIb.js

@@ -0,0 +1,602 @@
+import { t as e } from "./_plugin-vue_export-helper-DOgycIVc.js";
+import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, mergeProps as c, normalizeClass as l, normalizeStyle as u, openBlock as d, ref as f, renderList as p, renderSlot as m, resolveComponent as h, shallowRef as g, toDisplayString as _, toValue as v, unref as y, watch as b, withCtx as x, withModifiers as S } from "vue";
+//#region src/components/DsTree/dsTreeDataAdapter.ts
+var C = "children", w = "label";
+function T(e) {
+	return typeof e == "string" || typeof e == "number";
+}
+function E(e, t, n) {
+	return e?.[t] ?? n;
+}
+function D(e) {
+	function t() {
+		return e.nodeKey != null;
+	}
+	function n() {
+		return E(e.props, "children", C);
+	}
+	function r() {
+		return E(e.props, "label", w);
+	}
+	function i(e) {
+		let t = e[r()];
+		return t == null ? "" : String(t);
+	}
+	function a(e) {
+		let t = e[n()];
+		return Array.isArray(t) ? t : [];
+	}
+	function o(e) {
+		let t = n(), r = e[t];
+		if (Array.isArray(r)) return r;
+		let i = [];
+		return e[t] = i, i;
+	}
+	function s(t) {
+		if (e.nodeKey == null) return;
+		let n = t[e.nodeKey];
+		return T(n) ? n : void 0;
+	}
+	function c(e, t, n) {
+		return s(e) ?? (n == null ? t : `${String(n)}:${t}`);
+	}
+	return {
+		hasNodeKey: t,
+		getChildrenKey: n,
+		getLabelKey: r,
+		getLabel: i,
+		getChildren: a,
+		ensureChildren: o,
+		getNodeKey: c,
+		getExplicitNodeKey: s
+	};
+}
+//#endregion
+//#region src/components/DsTree/dsTreeInteractionContext.ts
+function O(e, t) {
+	let n = f(void 0), r = g(null), i = g(null);
+	function a(t) {
+		return e.draggable ? e.allowDrag ? e.allowDrag(t) : !0 : !1;
+	}
+	function o(t, n, r) {
+		return e.allowDrop ? e.allowDrop(t, n, r) : !0;
+	}
+	function s() {
+		r.value = null, i.value = null;
+	}
+	return {
+		hoveredKey: n,
+		draggingNode: r,
+		dropTarget: i,
+		canDrag: a,
+		canDrop: o,
+		resetDragState: s,
+		...t
+	};
+}
+//#endregion
+//#region src/components/DsTree/dsTreeStore.ts
+function k(e) {
+	let t = f(""), r = g(/* @__PURE__ */ new Set()), i = f(void 0), a = () => v(e.data) ?? [], o = () => v(e.filterNodeMethod);
+	b(() => v(e.defaultExpandedKeys), (e) => {
+		r.value = new Set(e ?? []);
+	}, { immediate: !0 });
+	let s = n(() => {
+		let t = /* @__PURE__ */ new Map(), n = /* @__PURE__ */ new WeakMap(), r = (i, a, o) => i.map((i, s) => {
+			let c = {
+				key: e.adapter.getNodeKey(i, s, a?.key),
+				label: e.adapter.getLabel(i),
+				data: i,
+				level: o,
+				parent: a,
+				childNodes: []
+			};
+			return t.set(c.key, c), n.set(i, c), c.childNodes = r(e.adapter.getChildren(i), c, o + 1), c;
+		});
+		return {
+			roots: r(a(), void 0, 1),
+			byKey: t,
+			byData: n
+		};
+	}), c = n(() => {
+		let e = t.value, n = e.trim().length > 0, r = e.toLowerCase(), i = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Set(), c = /* @__PURE__ */ new Set();
+		if (!n) return {
+			isActive: n,
+			subtreeHasMatch: i,
+			matchedKeys: a,
+			autoExpandKeys: c
+		};
+		let l = (t) => {
+			let n = o();
+			return n ? n(e, t.data, t) : t.label.toLowerCase().includes(r);
+		}, u = (e) => {
+			let t = !1;
+			for (let n of e) {
+				let e = l(n), r = u(n.childNodes), o = e || r;
+				i.set(n.key, o), e && a.add(n.key), r && c.add(n.key), t ||= o;
+			}
+			return t;
+		};
+		return u(s.value.roots), {
+			isActive: n,
+			subtreeHasMatch: i,
+			matchedKeys: a,
+			autoExpandKeys: c
+		};
+	});
+	function l(e) {
+		return s.value.byKey.get(e);
+	}
+	function u(e) {
+		return s.value.byData.get(e);
+	}
+	function d(e) {
+		return typeof e == "object" && !!e && "key" in e && "data" in e && "childNodes" in e;
+	}
+	function p(t) {
+		if (t == null) return;
+		if (typeof t == "string" || typeof t == "number") return l(t);
+		if (d(t)) return l(t.key) ?? t;
+		let n = e.adapter.getExplicitNodeKey(t);
+		return n == null ? u(t) : l(n);
+	}
+	function m(t) {
+		let n = t.parent ? e.adapter.ensureChildren(t.parent.data) : a(), r = n.findIndex((e) => e === t.data);
+		if (r >= 0) return {
+			items: n,
+			index: r
+		};
+		let i = e.adapter.getExplicitNodeKey(t.data);
+		if (i != null && (r = n.findIndex((t) => e.adapter.getExplicitNodeKey(t) === i), !(r < 0))) return {
+			items: n,
+			index: r
+		};
+	}
+	function h(e, t) {
+		let n = t.parent;
+		for (; n;) {
+			if (n.key === e.key) return !0;
+			n = n.parent;
+		}
+		return !1;
+	}
+	function _(e, t, n) {
+		let r = p(e), i = p(t);
+		return !r || !i || r.key === i.key || h(r, i) || !m(r) ? !1 : n === "inner" ? !0 : !!m(i);
+	}
+	function y() {
+		let e = s.value.byKey;
+		i.value != null && !e.has(i.value) && (i.value = void 0);
+		let t = new Set(Array.from(r.value).filter((t) => e.has(t)));
+		t.size !== r.value.size && (r.value = t);
+	}
+	function x(e) {
+		return r.value.has(e);
+	}
+	function S(e, t) {
+		let n = new Set(r.value);
+		t ? n.add(e) : n.delete(e), r.value = n;
+	}
+	function C(e) {
+		S(e.key, !x(e.key));
+	}
+	function w(e) {
+		i.value = e;
+	}
+	function T() {
+		return i.value;
+	}
+	function E() {
+		let e = i.value;
+		return e == null ? void 0 : l(e);
+	}
+	function D(e) {
+		if (e == null) return i.value = void 0, !0;
+		let t = p(e);
+		return t ? (i.value = t.key, !0) : !1;
+	}
+	function O(t) {
+		let n = e.adapter.getExplicitNodeKey(t);
+		return n == null ? u(t) : l(n);
+	}
+	function k(t, n, r) {
+		let i = p(t), a = p(n);
+		if (!i || !a || !_(i, a, r)) return;
+		let o = m(i);
+		if (!o) return;
+		let s, c;
+		if (r === "inner") s = e.adapter.ensureChildren(a.data), c = s.length;
+		else {
+			let e = m(a);
+			if (!e) return;
+			s = e.items, c = r === "prev" ? e.index : e.index + 1;
+		}
+		s === o.items && o.index < c && --c;
+		let [l] = o.items.splice(o.index, 1);
+		return s.splice(c, 0, l), r === "inner" && S(a.key, !0), y(), O(l);
+	}
+	function A(t, n) {
+		let r = p(n);
+		if (r) return e.adapter.ensureChildren(r.data).push(t), S(r.key, !0), y(), O(t);
+	}
+	function j(t) {
+		if (!e.adapter.hasNodeKey()) return !1;
+		let n = p(t);
+		if (!n) return !1;
+		let r = m(n);
+		return r ? (r.items.splice(r.index, 1), y(), !0) : !1;
+	}
+	function M(e, t) {
+		let n = p(t);
+		if (!n) return;
+		let r = m(n);
+		if (r) return r.items.splice(r.index, 0, e), y(), O(e);
+	}
+	function N(e, t) {
+		let n = p(t);
+		if (!n) return;
+		let r = m(n);
+		if (r) return r.items.splice(r.index + 1, 0, e), y(), O(e);
+	}
+	function P(e) {
+		t.value = e;
+	}
+	return {
+		filterValue: t,
+		expandedKeys: r,
+		currentKey: i,
+		treeModel: s,
+		filterInfo: c,
+		filter: P,
+		isExpandedKey: x,
+		setExpandedKey: S,
+		toggleExpand: C,
+		setCurrentKey: w,
+		getCurrentKey: T,
+		getCurrentNode: E,
+		setCurrentNode: D,
+		getNode: l,
+		canMoveNode: _,
+		moveNode: k,
+		appendNode: A,
+		removeNode: j,
+		insertNodeBefore: M,
+		insertNodeAfter: N
+	};
+}
+//#endregion
+//#region src/components/DsTree/DsTree.vue?vue&type=script&setup=true&lang.ts
+var A = ["role"], j = ["aria-level", "aria-expanded"], M = [
+	"onClick",
+	"onDrop",
+	"onDragover",
+	"onMouseenter",
+	"onMouseleave"
+], N = ["draggable", "onDragstart"], P = ["aria-label", "onClick"], F = { class: "ds-tree__label" }, I = { class: "ds-tree__label" }, L = "var(--ds-tree-branch-line-default-color, #e2e8f0)", R = /* @__PURE__ */ e(/* @__PURE__ */ s({
+	name: "DsTree",
+	__name: "DsTree",
+	props: {
+		data: {},
+		props: { default: () => ({
+			children: "children",
+			label: "label"
+		}) },
+		nodeKey: { default: "id" },
+		defaultExpandedKeys: { default: () => [] },
+		filterNodeMethod: {},
+		highlightCurrent: {
+			type: Boolean,
+			default: !0
+		},
+		expandIcon: { default: "i-lucide-chevron-right" },
+		collapseIcon: { default: "i-lucide-chevron-right" },
+		toggleIconRotate: {
+			type: Boolean,
+			default: !0
+		},
+		branchLine: {
+			type: Boolean,
+			default: !1
+		},
+		branchLineColor: {
+			type: [String, Function],
+			default: void 0
+		},
+		branchLineActiveColor: {
+			type: [String, Function],
+			default: void 0
+		},
+		rowClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		dragHandleClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		toggleClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		toggleIconClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		toggleSpacerClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		contentClass: {
+			type: [
+				Boolean,
+				null,
+				String,
+				Object,
+				Array,
+				Function
+			],
+			default: void 0
+		},
+		draggable: {
+			type: Boolean,
+			default: !1
+		},
+		dragHandleIcon: { default: "i-lucide-grip-vertical" },
+		allowDrop: {},
+		allowDrag: {},
+		internalRows: { default: void 0 },
+		internalNested: {
+			type: Boolean,
+			default: !1
+		},
+		internalStore: { default: void 0 },
+		internalInteractionContext: {}
+	},
+	emits: [
+		"nodeClick",
+		"nodeExpand",
+		"nodeCollapse",
+		"nodeDrop"
+	],
+	setup(e, { expose: s, emit: f }) {
+		let g = e, v = f, b = D(g), C = g.internalStore ?? k({
+			adapter: b,
+			data: () => g.data,
+			defaultExpandedKeys: () => g.defaultExpandedKeys,
+			filterNodeMethod: () => g.filterNodeMethod
+		}), w = g.internalInteractionContext ?? O(g, {
+			emitNodeClick: (e, t) => v("nodeClick", e, t),
+			emitNodeExpand: (e, t) => v("nodeExpand", e, t),
+			emitNodeCollapse: (e, t) => v("nodeCollapse", e, t),
+			emitNodeDrop: (e, t, n) => v("nodeDrop", e, t, n)
+		}), T = g, E = C.currentKey, R = w.hoveredKey, z = w.dropTarget, B = n(() => {
+			if (g.internalRows) return g.internalRows;
+			let { roots: e } = C.treeModel.value, { isActive: t, subtreeHasMatch: n, matchedKeys: r, autoExpandKeys: i } = C.filterInfo.value, a = (e) => {
+				let o = [];
+				for (let s of e) {
+					if (t && !n.get(s.key)) continue;
+					let e = s.childNodes.length === 0, c = r.has(s.key), l = C.isExpandedKey(s.key) || t && i.has(s.key);
+					o.push({
+						node: s,
+						isExpanded: l,
+						isLeaf: e,
+						isMatched: c,
+						children: l ? a(s.childNodes) : []
+					});
+				}
+				return o;
+			};
+			return a(e);
+		});
+		function V(e) {
+			C.setCurrentKey(e.key), w.emitNodeClick(e.data, e);
+		}
+		function H(e) {
+			R.value = e.key;
+		}
+		function U(e) {
+			R.value === e.key && (R.value = void 0);
+		}
+		function W(e) {
+			let t = !C.isExpandedKey(e.key);
+			C.toggleExpand(e), t ? w.emitNodeExpand(e.data, e) : w.emitNodeCollapse(e.data, e);
+		}
+		function G(e) {
+			return w.canDrag(e);
+		}
+		function K(e) {
+			return G(e) && R.value === e.key;
+		}
+		function q(e, t) {
+			let n = t.getBoundingClientRect(), r = e.clientY - n.top, i = n.height / 3;
+			return r < i ? "prev" : r > i * 2 ? "next" : "inner";
+		}
+		function J(e, t, n) {
+			return w.canDrop(e, t, n);
+		}
+		function Y(e, t) {
+			if (!G(t)) {
+				e.preventDefault();
+				return;
+			}
+			w.draggingNode.value = t, w.dropTarget.value = null;
+			try {
+				e.dataTransfer?.setData("text/plain", String(t.key));
+			} catch {}
+			e.dataTransfer && (e.dataTransfer.effectAllowed = "move");
+		}
+		function X() {
+			w.resetDragState();
+		}
+		function Z(e, t, n) {
+			let r = w.draggingNode.value;
+			if (!T.draggable || !r) return;
+			e.preventDefault();
+			let i = q(e, n), a = C.canMoveNode(r, t, i) && J(r, t, i);
+			w.dropTarget.value = {
+				key: t.key,
+				type: i,
+				allowed: a
+			}, e.dataTransfer && (e.dataTransfer.dropEffect = a ? "move" : "none");
+		}
+		function ee(e, t) {
+			let n = w.draggingNode.value, r = w.dropTarget.value;
+			if (!(!T.draggable || !n || !r)) {
+				if (e.preventDefault(), r.key === t.key && r.allowed) {
+					let e = C.moveNode(n, t, r.type);
+					if (e) {
+						let n = C.getNode(t.key) ?? t;
+						w.emitNodeDrop(e, n, r.type);
+					}
+				}
+				w.resetDragState();
+			}
+		}
+		function te(e) {
+			C.filter(e);
+		}
+		function Q(e, t) {
+			if (e) return typeof e == "function" ? e(t) : e;
+		}
+		function $(e, t) {
+			if (e) return typeof e == "function" ? e(t) ?? void 0 : e;
+		}
+		function ne(e) {
+			let t = E.value;
+			return t == null ? !1 : e.key === t ? !0 : e.childNodes.some((e) => e.key === t && !C.isExpandedKey(e.key));
+		}
+		function re(e) {
+			let t = $(T.branchLineColor, e) ?? L;
+			return ne(e) ? $(T.branchLineActiveColor, e) ?? t : t;
+		}
+		function ie(e) {
+			return T.branchLine ? { "--ds-tree-branch-line-color": re(e.node) } : {};
+		}
+		return s({
+			appendNode: C.appendNode,
+			filter: te,
+			getCurrentNode: C.getCurrentNode,
+			setCurrentKey: C.setCurrentKey,
+			getCurrentKey: C.getCurrentKey,
+			getNode: C.getNode,
+			insertNodeAfter: C.insertNodeAfter,
+			insertNodeBefore: C.insertNodeBefore,
+			removeNode: C.removeNode,
+			setCurrentNode: C.setCurrentNode
+		}), (e, n) => {
+			let s = h("DsTree", !0);
+			return d(), i("div", {
+				class: l(g.internalNested ? "ds-tree__children" : "ds-tree"),
+				role: g.internalNested ? "group" : "tree"
+			}, [(d(!0), i(t, null, p(B.value, (t) => (d(), i("div", {
+				key: t.node.key,
+				role: "treeitem",
+				"aria-level": t.node.level,
+				"aria-expanded": t.isLeaf ? void 0 : t.isExpanded
+			}, [a("div", {
+				class: l(["ds-tree__row py-2 px-2", [
+					y(T).highlightCurrent && y(E) === t.node.key ? "ds-tree__row--current" : "",
+					t.isMatched ? "ds-tree__row--matched" : "",
+					y(z)?.key === t.node.key && y(z).allowed && y(z).type === "inner" ? "ds-tree__row--drop-inner" : "",
+					y(z)?.key === t.node.key && y(z).allowed && y(z).type === "prev" ? "ds-tree__row--drop-prev" : "",
+					y(z)?.key === t.node.key && y(z).allowed && y(z).type === "next" ? "ds-tree__row--drop-next" : "",
+					Q(y(T).rowClass, t)
+				]]),
+				tabindex: "0",
+				onClick: (e) => V(t.node),
+				onDrop: (e) => ee(e, t.node),
+				onDragover: (e) => Z(e, t.node, e.currentTarget),
+				onMouseenter: (e) => H(t.node),
+				onMouseleave: (e) => U(t.node)
+			}, [
+				y(T).draggable ? (d(), i("button", {
+					key: 0,
+					type: "button",
+					class: l(["ds-tree__drag-handle", [
+						K(t.node) ? "ds-tree__drag-handle--visible" : "",
+						G(t.node) ? "" : "ds-tree__drag-handle--disabled",
+						Q(y(T).dragHandleClass, t)
+					]]),
+					"aria-label": "Drag",
+					draggable: G(t.node),
+					onClick: n[0] ||= S(() => {}, ["stop"]),
+					onMousedown: n[1] ||= S(() => {}, ["stop"]),
+					onDragstart: (e) => Y(e, t.node),
+					onDragend: X
+				}, [a("span", { class: l(["ds-tree__drag-icon", y(T).dragHandleIcon]) }, null, 2)], 42, N)) : r("", !0),
+				t.isLeaf ? (d(), i("span", {
+					key: 2,
+					class: l(["ds-tree__toggle-spacer", Q(y(T).toggleSpacerClass, t)])
+				}, null, 2)) : (d(), i("button", {
+					key: 1,
+					type: "button",
+					class: l(["ds-tree__toggle", Q(y(T).toggleClass, t)]),
+					"aria-label": t.isExpanded ? "Collapse" : "Expand",
+					onClick: S((e) => W(t.node), ["stop"])
+				}, [a("span", { class: l(["ds-tree__toggle-icon", [
+					t.isExpanded ? y(T).collapseIcon : y(T).expandIcon,
+					t.isExpanded && y(T).toggleIconRotate ? "ds-tree__toggle-icon--expanded" : "",
+					Q(y(T).toggleIconClass, t)
+				]]) }, null, 2)], 10, P)),
+				a("div", { class: l(["ds-tree__content", Q(y(T).contentClass, t)]) }, [m(e.$slots, "default", {
+					node: t.node,
+					data: t.node.data
+				}, () => [a("span", F, _(t.node.label), 1)], !0)], 2)
+			], 42, M), t.children.length ? (d(), i("div", {
+				key: 0,
+				class: l(["ds-tree__children-wrap ml-6", y(T).branchLine ? "ds-tree__children-wrap--with-branch" : ""]),
+				style: u(ie(t))
+			}, [o(s, c({ ref_for: !0 }, g, {
+				data: [],
+				"internal-rows": t.children,
+				"internal-nested": "",
+				"internal-store": y(C),
+				"internal-interaction-context": y(w)
+			}), {
+				default: x((t) => [m(e.$slots, "default", c({ ref_for: !0 }, t), () => [a("span", I, _(t.node.label), 1)], !0)]),
+				_: 3
+			}, 16, [
+				"internal-rows",
+				"internal-store",
+				"internal-interaction-context"
+			])], 6)) : r("", !0)], 8, j))), 128))], 10, A);
+		};
+	}
+}), [["__scopeId", "data-v-5e92add7"]]);
+//#endregion
+export { R as t };