@well-insight/ui 0.1.7 → 0.1.8

package/dist/tooltip/style.js

@@ -0,0 +1,3 @@
+import '../theme/styles.css'
+import '../styles/base.css'
+import '../components/Tooltip/styles.css'

package/dist/tree/index.js

@@ -0,0 +1,296 @@
+import { a as e, t } from "../Icon-B6gOD07E.js";
+import { t as n } from "../Checkbox-BtgWgkHI.js";
+import { a as r, c as i, n as a, o, s, t as c } from "../checkStrategy-CZzuUKDI.js";
+import { n as l } from "../locale-CYkJyRd1.js";
+import "./style.js";
+import { Fragment as u, computed as d, createBlock as f, createCommentVNode as p, createElementBlock as m, createElementVNode as h, createTextVNode as g, defineComponent as _, inject as v, normalizeClass as y, openBlock as b, provide as x, reactive as S, ref as C, renderList as w, resolveDynamicComponent as T, toDisplayString as E, unref as D, useSlots as O, watch as k, withModifiers as A } from "vue";
+//#region src/components/Tree/context.ts
+var j = Symbol("wi-tree"), M = Symbol("wi-tree-node-slot"), N = ["aria-expanded", "aria-disabled"], P = ["draggable"], F = ["aria-label", "disabled"], I = {
+	key: 1,
+	class: "wi-tree__toggler wi-tree__toggler--leaf",
+	"aria-hidden": "true"
+}, L = {
+	key: 3,
+	class: "wi-tree__icon",
+	"aria-hidden": "true"
+}, R = ["disabled"], z = {
+	key: 0,
+	class: "wi-tree__children",
+	role: "group"
+}, B = /* @__PURE__ */ _({
+	__name: "TreeNodeItem",
+	props: { node: {} },
+	setup(r) {
+		let i = r, a = v(j), o = v(M, void 0), s = l(), c = d(() => a.isExpanded(i.node.key)), _ = d(() => a.isSelected(i.node.key)), x = d(() => a.isChecked(i.node.key)), S = d(() => a.isIndeterminate(i.node.key)), C = d(() => a.isDisabled(i.node)), O = d(() => a.isMatch(i.node)), k = d(() => !!a.loadingKeys[i.node.key]), V = d(() => !!i.node.children?.length || a.lazy && !i.node.isLeaf), H = d(() => {
+			if (i.node.icon && e(i.node.icon)) return i.node.icon;
+		}), U = d(() => i.node.children ?? []), W = d(() => o?.({
+			node: i.node,
+			data: i.node
+		}));
+		return (e, i) => (b(), m("li", {
+			class: "wi-tree__node",
+			role: "treeitem",
+			"aria-expanded": V.value ? c.value : void 0,
+			"aria-disabled": C.value || void 0
+		}, [h("div", {
+			class: y(["wi-tree__row", {
+				"wi-tree__row--selected": _.value,
+				"wi-tree__row--disabled": C.value,
+				"wi-tree__row--matched": O.value,
+				"wi-tree__row--indeterminate": S.value
+			}]),
+			draggable: D(a).draggable && !C.value,
+			onDragstart: i[4] ||= (e) => D(a).onDragStart(r.node, e),
+			onDragover: i[5] ||= (e) => D(a).onDragOver(r.node, e),
+			onDrop: i[6] ||= (e) => D(a).onDrop(r.node, e)
+		}, [
+			V.value ? (b(), m("button", {
+				key: 0,
+				type: "button",
+				class: "wi-tree__toggler",
+				"aria-label": c.value ? D(s).collapse : D(s).expand,
+				disabled: C.value,
+				onClick: i[0] ||= (e) => D(a).toggleExpand(r.node)
+			}, [k.value ? (b(), f(t, {
+				key: 0,
+				name: "loader",
+				size: "sm"
+			})) : (b(), f(t, {
+				key: 1,
+				name: c.value ? "chevron-down" : "chevron-right",
+				size: "sm"
+			}, null, 8, ["name"]))], 8, F)) : (b(), m("span", I)),
+			D(a).showCheckbox ? (b(), f(n, {
+				key: 2,
+				class: "wi-tree__checkbox",
+				"model-value": x.value || S.value,
+				disabled: C.value,
+				"onUpdate:modelValue": i[1] ||= (e) => D(a).toggleCheck(r.node),
+				onClick: i[2] ||= A(() => {}, ["stop"])
+			}, null, 8, ["model-value", "disabled"])) : p("", !0),
+			H.value || r.node.icon ? (b(), m("span", L, [H.value ? (b(), f(t, {
+				key: 0,
+				name: H.value,
+				size: "sm"
+			}, null, 8, ["name"])) : (b(), m(u, { key: 1 }, [g(E(r.node.icon), 1)], 64))])) : p("", !0),
+			h("button", {
+				type: "button",
+				class: "wi-tree__label",
+				disabled: C.value,
+				onClick: i[3] ||= (e) => D(a).select(r.node)
+			}, [W.value ? (b(), f(T({ render: () => W.value }), { key: 0 })) : (b(), m(u, { key: 1 }, [g(E(r.node.label), 1)], 64))], 8, R)
+		], 42, P), V.value && c.value ? (b(), m("ul", z, [(b(!0), m(u, null, w(U.value, (e) => (b(), f(B, {
+			key: e.key,
+			node: e
+		}, null, 8, ["node"]))), 128))])) : p("", !0)], 8, N));
+	}
+}), V = {
+	class: "wi-tree",
+	role: "tree"
+}, H = /* @__PURE__ */ _({
+	__name: "Tree",
+	props: {
+		value: {},
+		selectionKeys: { default: () => ({}) },
+		modelValue: { default: null },
+		selectionMode: { default: "single" },
+		showCheckbox: {
+			type: Boolean,
+			default: !1
+		},
+		checkedKeys: { default: () => ({}) },
+		checkStrictly: {
+			type: Boolean,
+			default: !1
+		},
+		checkStrategy: { default: "all" },
+		expandedKeys: { default: void 0 },
+		defaultExpandAll: {
+			type: Boolean,
+			default: !1
+		},
+		accordion: {
+			type: Boolean,
+			default: !1
+		},
+		filter: { default: "" },
+		filterNode: {},
+		lazy: {
+			type: Boolean,
+			default: !1
+		},
+		load: {},
+		draggable: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: [
+		"update:selectionKeys",
+		"update:modelValue",
+		"update:checkedKeys",
+		"update:expandedKeys",
+		"node-expand",
+		"node-collapse",
+		"check",
+		"node-drop"
+	],
+	setup(e, { emit: t }) {
+		let n = e, l = O();
+		x(M, l.default);
+		let p = t, h = C({}), g = S({}), _ = C(null), v = d(() => c(n.value)), y = d(() => n.checkStrategy ?? "all");
+		k(() => [
+			n.value,
+			n.defaultExpandAll,
+			n.expandedKeys
+		], () => {
+			if (n.expandedKeys) {
+				h.value = { ...n.expandedKeys };
+				return;
+			}
+			if (n.defaultExpandAll) {
+				let e = {};
+				i(n.value, (t) => {
+					t.children?.length && (e[t.key] = !0);
+				}), h.value = e;
+			}
+		}, {
+			immediate: !0,
+			deep: !0
+		}), k(() => n.expandedKeys, (e) => {
+			e && (h.value = { ...e });
+		});
+		let T = d(() => n.selectionMode === "single" && n.modelValue ? { [n.modelValue]: !0 } : n.selectionKeys ?? {}), E = d(() => a(n.value, n.checkedKeys ?? {}, y.value, n.checkStrictly));
+		function D(e, t) {
+			return t.label.toLowerCase().includes(e.toLowerCase());
+		}
+		function A(e) {
+			let t = n.filter?.trim();
+			return !t || (n.filterNode ?? D)(t, e) ? !0 : (e.children ?? []).some((e) => A(e));
+		}
+		let N = d(() => n.filter?.trim() ? n.value.filter((e) => A(e)) : n.value);
+		function P(e) {
+			if (n.filter?.trim()) {
+				let t = F(n.value, e);
+				if (t && (t.children ?? []).some((e) => A(e))) return !0;
+			}
+			return !!h.value[e];
+		}
+		function F(e, t) {
+			for (let n of e) {
+				if (n.key === t) return n;
+				let e = F(n.children ?? [], t);
+				if (e) return e;
+			}
+			return null;
+		}
+		function I(e) {
+			return !!T.value[e];
+		}
+		function L(e) {
+			return !!E.value[e];
+		}
+		function R(e) {
+			if (n.checkStrictly || !n.showCheckbox) return !1;
+			let t = v.value.get(e) ?? [];
+			if (!t.length) return !1;
+			let r = 0, i = !1;
+			for (let e of t) L(e.key) && (r += 1), R(e.key) && (i = !0);
+			return i ? !0 : r > 0 && r < t.length;
+		}
+		function z(e) {
+			return !!e.disabled;
+		}
+		function H(e) {
+			return e.isLeaf ? !0 : n.lazy ? !e.children?.length && !g[e.key] : !e.children?.length;
+		}
+		function U(e) {
+			let t = n.filter?.trim();
+			return t ? (n.filterNode ?? D)(t, e) : !1;
+		}
+		async function W(e) {
+			if (z(e)) return;
+			let t = P(e.key), r = { ...h.value };
+			if (t) delete r[e.key], p("node-collapse", e);
+			else if (n.accordion && (r = {}), r[e.key] = !0, p("node-expand", e), n.lazy && n.load && !e.children?.length && !e.isLeaf) {
+				g[e.key] = !0;
+				try {
+					e.children = await n.load(e);
+				} finally {
+					g[e.key] = !1;
+				}
+			}
+			h.value = r, p("update:expandedKeys", r);
+		}
+		function G(e) {
+			if (z(e)) return;
+			if (n.selectionMode === "single") {
+				let t = I(e.key) ? null : e.key;
+				p("update:modelValue", t), p("update:selectionKeys", t ? { [t]: !0 } : {});
+				return;
+			}
+			let t = { ...T.value };
+			t[e.key] ? delete t[e.key] : t[e.key] = !0, p("update:selectionKeys", t);
+		}
+		function K(e) {
+			if (z(e)) return;
+			let t = { ...E.value }, i = !L(e.key);
+			n.checkStrictly ? i ? t[e.key] = !0 : delete t[e.key] : (o(e, i, t), s(n.value, t));
+			let a = r(n.value, t, y.value, n.checkStrictly);
+			p("update:checkedKeys", a), p("check", {
+				node: e,
+				checkedKeys: a
+			});
+		}
+		function q(e, t) {
+			if (!n.draggable || z(e)) {
+				t.preventDefault();
+				return;
+			}
+			_.value = e.key, t.dataTransfer?.setData("text/plain", e.key), t.dataTransfer.effectAllowed = "move";
+		}
+		function J(e, t) {
+			!n.draggable || !_.value || _.value === e.key || (t.preventDefault(), t.dataTransfer.dropEffect = "move");
+		}
+		function Y(e, t) {
+			if (!n.draggable || !_.value || _.value === e.key) return;
+			t.preventDefault();
+			let r = t.currentTarget.getBoundingClientRect(), i = t.clientY - r.top, a = "inside";
+			i < r.height * .25 ? a = "before" : i > r.height * .75 && (a = "after"), p("node-drop", {
+				dragKey: _.value,
+				dropKey: e.key,
+				position: a
+			}), _.value = null;
+		}
+		return x(j, {
+			isExpanded: P,
+			isSelected: I,
+			isChecked: L,
+			isIndeterminate: R,
+			isDisabled: z,
+			isLeaf: H,
+			isMatch: U,
+			get showCheckbox() {
+				return n.showCheckbox;
+			},
+			get draggable() {
+				return n.draggable;
+			},
+			get lazy() {
+				return n.lazy;
+			},
+			loadingKeys: g,
+			toggleExpand: W,
+			select: G,
+			toggleCheck: K,
+			onDragStart: q,
+			onDragOver: J,
+			onDrop: Y
+		}), (e, t) => (b(), m("ul", V, [(b(!0), m(u, null, w(N.value, (e) => (b(), f(B, {
+			key: e.key,
+			node: e
+		}, null, 8, ["node"]))), 128))]));
+	}
+});
+//#endregion
+export { H as WiTree };