@feugene/granularity 0.4.0 → 0.4.1

package/dist/components/GrTreeSelect/chunks/GrTreeSelect-DAAay-QB.js

@@ -1,353 +0,0 @@
-import { a as e } from "../../../chunks/directives-Dr5NPOT8.js";
-import { t } from "../../GrInput/chunks/GrInput-CLKX1inm.js";
-import { t as n } from "../../../chunks/granularityI18n-8_v1B11L.js";
-import { t as r } from "../../GrTree/chunks/GrTree-C2CXR_vW.js";
-import { i, r as a } from "../../../chunks/config-NuqoO_Of.js";
-import { Teleport as o, Transition as s, computed as c, createBlock as l, createCommentVNode as u, createElementBlock as d, createElementVNode as f, createTextVNode as ee, createVNode as p, defineComponent as m, nextTick as h, normalizeClass as g, normalizeStyle as _, onUnmounted as te, openBlock as v, ref as y, renderSlot as b, toDisplayString as x, unref as S, vShow as ne, watch as C, withCtx as w, withDirectives as T, withModifiers as re } from "vue";
-//#region src/components/GrTreeSelect/GrTreeSelect.vue?vue&type=script&setup=true&lang.ts
-var ie = { class: "relative" }, ae = [
-	"value",
-	"placeholder",
-	"disabled",
-	"aria-expanded",
-	"aria-invalid"
-], oe = ["disabled", "aria-label"], se = {
-	key: 1,
-	"data-testid": "ds-tree-select-chevron",
-	"data-ds-tree-select-chevron": "",
-	class: "absolute top-1/2 -translate-y-1/2 right-3 text-[var(--muted-fg)] pointer-events-none"
-}, ce = {
-	key: 2,
-	class: "absolute inset-y-0 left-3 right-9 flex items-center pointer-events-none"
-}, le = {
-	key: 0,
-	class: "p-2 border-b border-[var(--brd)]"
-}, ue = {
-	key: 0,
-	class: "px-3 py-2 text-[13px] text-[var(--muted-fg)]"
-}, de = { class: "flex items-center gap-2 min-w-0" }, fe = { class: "truncate" }, E = /* @__PURE__ */ m({
-	__name: "GrTreeSelect",
-	props: {
-		modelValue: {},
-		data: {},
-		props: { default: () => ({
-			children: "children",
-			label: "label"
-		}) },
-		nodeKey: { default: "id" },
-		defaultExpandedKeys: { default: () => [] },
-		disabled: {
-			type: Boolean,
-			default: !1
-		},
-		placeholder: { default: void 0 },
-		size: { default: "md" },
-		invalid: {
-			type: Boolean,
-			default: !1
-		},
-		state: { default: "default" },
-		multiple: {
-			type: Boolean,
-			default: !1
-		},
-		clearable: {
-			type: Boolean,
-			default: !1
-		},
-		valueDisplay: { default: "label" },
-		filterable: {
-			type: Boolean,
-			default: !1
-		},
-		filterPlaceholder: { default: void 0 },
-		filterInputmode: { default: void 0 },
-		filterNodeMethod: {
-			type: Function,
-			default: void 0
-		},
-		closeOnSelect: {
-			type: Boolean,
-			default: void 0
-		},
-		dropdownMaxHeight: { default: 320 }
-	},
-	emits: [
-		"update:modelValue",
-		"change",
-		"visibleChange",
-		"clear",
-		"nodeClick"
-	],
-	setup(m, { emit: E }) {
-		let D = m, { t: O } = n(), k = E, A = y(null), j = y(null), M = y(null), N = y(null), P = y(null), pe = [() => P.value], F = !1, I = y(!1), L = y(""), R = y({
-			left: "0px",
-			top: "0px",
-			width: "0px",
-			zIndex: "2147483647"
-		});
-		function z() {
-			if (typeof window > "u") return;
-			let e = A.value;
-			if (!e) return;
-			let t = e.getBoundingClientRect();
-			R.value = {
-				left: `${t.left}px`,
-				top: `${t.bottom + 8}px`,
-				width: `${t.width}px`,
-				zIndex: "2147483647"
-			};
-		}
-		function me() {
-			typeof window > "u" || (window.addEventListener("resize", z), window.addEventListener("scroll", z, !0));
-		}
-		function B() {
-			typeof window > "u" || (window.removeEventListener("resize", z), window.removeEventListener("scroll", z, !0));
-		}
-		let V = c(() => D.closeOnSelect ?? !D.multiple);
-		function he() {
-			return D.props.children ?? "children";
-		}
-		function ge() {
-			return D.props.label ?? "label";
-		}
-		function H(e) {
-			let t = e[ge()];
-			return t == null ? "" : String(t);
-		}
-		function U(e) {
-			let t = e[he()];
-			return Array.isArray(t) ? t : [];
-		}
-		function W(e, t, n) {
-			return e[D.nodeKey] ?? (n == null ? t : `${String(n)}:${t}`);
-		}
-		let _e = c(() => {
-			let e = /* @__PURE__ */ new Map(), t = (n, r) => {
-				for (let i = 0; i < n.length; i++) {
-					let a = n[i], o = W(a, i, r);
-					e.set(o, H(a)), t(U(a), o);
-				}
-			};
-			return t(D.data ?? [], void 0), e;
-		}), ve = c(() => {
-			let e = /* @__PURE__ */ new Map(), t = (n, r, i) => {
-				for (let a = 0; a < n.length; a++) {
-					let o = n[a], s = W(o, a, r), c = H(o), l = [...i, c];
-					e.set(s, l), t(U(o), s, l);
-				}
-			};
-			return t(D.data ?? [], void 0, []), e;
-		}), G = c(() => {
-			if (D.multiple) return Array.isArray(D.modelValue) ? D.modelValue : [];
-			let e = D.modelValue;
-			return e == null || Array.isArray(e) ? [] : [e];
-		}), K = c(() => new Set(G.value)), q = c(() => {
-			let e = _e.value;
-			return G.value.map((t) => e.get(t) ?? String(t));
-		}), J = c(() => {
-			if (D.multiple) return;
-			let e = G.value[0];
-			if (e == null) return;
-			let t = ve.value.get(e);
-			if (t?.length) return t;
-			let n = q.value;
-			return n.length ? [n[0]] : void 0;
-		}), ye = c(() => {
-			let e = q.value;
-			if (e.length === 0) return "";
-			if (!D.multiple) {
-				if (D.valueDisplay === "path") {
-					let e = J.value;
-					if (e?.length) return e.join(" / ");
-				}
-				return e[0];
-			}
-			return e.length === 1 ? e[0] : `${e[0]} +${e.length - 1}`;
-		}), be = c(() => G.value.length > 0), xe = c(() => D.filterPlaceholder ?? O("gr.treeSelect.filterPlaceholder", "Search…")), Se = c(() => a({
-			size: D.size,
-			state: D.state,
-			invalid: D.invalid
-		})), Ce = c(() => i);
-		function Y(e) {
-			D.disabled || I.value !== e && (I.value = e, k("visibleChange", e));
-		}
-		function we() {
-			Y(!1);
-		}
-		function X() {
-			Y(!0);
-		}
-		function Z() {
-			Y(!1);
-		}
-		function Te() {
-			Y(!I.value);
-		}
-		function Ee() {
-			F = !0, typeof window < "u" ? window.setTimeout(() => {
-				F = !1;
-			}, 0) : F = !1;
-		}
-		function De() {
-			F || X();
-		}
-		function Q(e) {
-			e.key === "Escape" && (Z(), h(() => j.value?.focus()));
-		}
-		C(I, async (e) => {
-			if (!(typeof document > "u") && (document.removeEventListener("keydown", Q), B(), e && document.addEventListener("keydown", Q), e)) {
-				if (me(), await h(), z(), !D.multiple) {
-					let e = D.modelValue;
-					e != null && !Array.isArray(e) && N.value?.setCurrentKey(e);
-				}
-				D.filterable && (await h(), M.value?.focus());
-			}
-		}, { immediate: !0 }), te(() => {
-			typeof document > "u" || (document.removeEventListener("keydown", Q), B());
-		}), C(() => D.modelValue, (e) => {
-			if (!D.multiple) {
-				if (e == null || Array.isArray(e)) {
-					N.value?.setCurrentKey(void 0);
-					return;
-				}
-				N.value?.setCurrentKey(e);
-			}
-		}), C(L, (e) => {
-			N.value?.filter(e);
-		}), C(I, (e) => {
-			e || L.value.trim().length > 0 && (L.value = "");
-		});
-		function $(e) {
-			k("update:modelValue", e), k("change", e);
-		}
-		function Oe() {
-			D.disabled || ($(D.multiple ? [] : null), k("clear"), D.multiple || N.value?.setCurrentKey(void 0));
-		}
-		function ke(e) {
-			D.disabled || ((e.key === "ArrowDown" || e.key === "Enter" || e.key === " ") && (e.preventDefault(), X()), e.key === "Escape" && (e.preventDefault(), Z()));
-		}
-		function Ae(e, t) {
-			if (k("nodeClick", e, t), !D.disabled) {
-				if (D.multiple) {
-					let e = new Set(K.value);
-					e.has(t.key) ? e.delete(t.key) : e.add(t.key), $([...e]), V.value && Z();
-					return;
-				}
-				$(t.key), V.value && Z();
-			}
-		}
-		return (n, i) => T((v(), d("div", {
-			ref_key: "rootEl",
-			ref: A,
-			"data-ds-tree-select": "",
-			class: "relative"
-		}, [f("div", ie, [
-			f("input", {
-				ref_key: "triggerEl",
-				ref: j,
-				"data-testid": "ds-tree-select-trigger",
-				"data-ds-tree-select-trigger": "",
-				type: "text",
-				value: ye.value,
-				placeholder: m.placeholder,
-				disabled: m.disabled,
-				readonly: "",
-				role: "combobox",
-				"aria-readonly": "true",
-				"aria-expanded": I.value ? "true" : "false",
-				"aria-invalid": m.invalid ? "true" : void 0,
-				class: g(["w-full rounded-md border bg-[var(--bg)] text-[var(--fg)] placeholder:text-[var(--muted-fg)] transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-[var(--ring)] disabled:opacity-50 disabled:cursor-not-allowed", [Se.value, n.$slots.value ? "text-transparent placeholder:text-transparent" : ""]]),
-				onPointerdown: Ee,
-				onClick: Te,
-				onFocus: De,
-				onKeydown: ke
-			}, null, 42, ae),
-			m.clearable && be.value ? (v(), d("button", {
-				key: 0,
-				"data-testid": "ds-tree-select-clear",
-				"data-ds-tree-select-clear": "",
-				type: "button",
-				class: "absolute top-1/2 -translate-y-1/2 right-3 h-6 w-6 inline-flex items-center justify-center rounded-md text-[var(--muted-fg)] hover:text-[var(--fg)] hover:bg-[color-mix(in_srgb,var(--muted)_25%,transparent)] disabled:opacity-50",
-				disabled: m.disabled,
-				"aria-label": S(O)("gr.common.clear", "Clear"),
-				onClick: re(Oe, ["stop"])
-			}, [...i[1] ||= [f("span", { class: "i-lucide-x h-4 w-4" }, null, -1)]], 8, oe)) : (v(), d("span", se, [f("span", { class: g(["i-lucide-chevron-down h-4 w-4 transition-transform duration-150", I.value ? "rotate-180" : ""]) }, null, 2)])),
-			n.$slots.value ? (v(), d("div", ce, [b(n.$slots, "value", {
-				value: m.modelValue,
-				labels: q.value,
-				displayValue: ye.value,
-				pathLabels: J.value
-			})])) : u("", !0)
-		]), (v(), l(o, { to: "body" }, [p(s, {
-			"enter-active-class": "transition ease-out duration-150",
-			"enter-from-class": "transform opacity-0 scale-95",
-			"enter-to-class": "transform opacity-100 scale-100",
-			"leave-active-class": "transition ease-in duration-100",
-			"leave-from-class": "transform opacity-100 scale-100",
-			"leave-to-class": "transform opacity-0 scale-95"
-		}, {
-			default: w(() => [T(f("div", {
-				ref_key: "panelEl",
-				ref: P,
-				"data-testid": "ds-tree-select-panel",
-				"data-ds-tree-select-panel": "",
-				class: "fixed w-full",
-				style: _(R.value)
-			}, [f("div", { class: g(Ce.value) }, [m.filterable ? (v(), d("div", le, [p(t, {
-				ref_key: "filterInputRef",
-				ref: M,
-				modelValue: L.value,
-				"onUpdate:modelValue": i[0] ||= (e) => L.value = e,
-				"data-testid": "ds-tree-select-filter",
-				"data-ds-tree-select-filter": "",
-				type: "search",
-				inputmode: m.filterInputmode,
-				placeholder: xe.value,
-				size: "sm"
-			}, null, 8, [
-				"modelValue",
-				"inputmode",
-				"placeholder"
-			])])) : u("", !0), f("div", {
-				class: "p-1 overflow-auto",
-				style: _({ maxHeight: `${m.dropdownMaxHeight}px` })
-			}, [(m.data?.length ?? 0) === 0 ? (v(), d("div", ue, [b(n.$slots, "empty", {}, () => [ee(x(S(O)("gr.treeSelect.empty", "No data")), 1)])])) : (v(), l(S(r), {
-				key: 1,
-				ref_key: "treeRef",
-				ref: N,
-				data: m.data,
-				props: D.props,
-				"node-key": m.nodeKey,
-				"default-expanded-keys": m.defaultExpandedKeys,
-				"filter-node-method": m.filterNodeMethod,
-				"highlight-current": !m.multiple,
-				onNodeClick: Ae
-			}, {
-				default: w(({ node: e, data: t }) => [b(n.$slots, "node", {
-					node: e,
-					data: t,
-					selected: K.value.has(e.key)
-				}, () => [f("div", de, [f("span", {
-					class: g(["h-4 w-4 shrink-0", K.value.has(e.key) ? "i-lucide-check text-[var(--primary)]" : ""]),
-					"aria-hidden": "true"
-				}, null, 2), f("span", fe, x(e.label), 1)])])]),
-				_: 3
-			}, 8, [
-				"data",
-				"props",
-				"node-key",
-				"default-expanded-keys",
-				"filter-node-method",
-				"highlight-current"
-			]))], 4)], 2)], 4), [[ne, I.value]])]),
-			_: 3
-		})]))])), [[S(e), {
-			handler: we,
-			enabled: I.value,
-			exclude: pe
-		}]]);
-	}
-});
-//#endregion
-export { E as t };