@itguy614/clean-ui 0.3.1 → 1.0.0

package/dist/components/CuiTooltip.vue2.js

@@ -0,0 +1,128 @@
+import { defineComponent as V, ref as A, watch as N, toRef as z, onUnmounted as L, computed as d, withDirectives as I, openBlock as u, createElementBlock as a, createElementVNode as v, renderSlot as g, createBlock as K, Teleport as O, normalizeStyle as p, unref as f, normalizeClass as P, createTextVNode as U, toDisplayString as j, createCommentVNode as m, vShow as q } from "vue";
+import { usePopover as G } from "../composables/usePopover.js";
+const H = { class: "cui-tooltip__content" }, X = /* @__PURE__ */ V({
+  __name: "CuiTooltip",
+  props: {
+    text: {},
+    placement: { default: "top" },
+    trigger: { default: "hover-focus" },
+    showDelay: { default: 200 },
+    hideDelay: { default: 100 },
+    noArrow: { type: Boolean, default: !1 },
+    visible: { type: Boolean },
+    hidden: { type: Boolean, default: !1 },
+    color: {},
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:visible"],
+  setup(n, { emit: h }) {
+    const e = n, s = h, r = A(!1);
+    let i = null, o = null;
+    N(
+      () => e.visible,
+      (t) => {
+        t !== void 0 && (r.value = t);
+      }
+    );
+    const { referenceRef: y, floatingRef: w, arrowRef: T, floatingStyles: k, arrowStyle: b, currentSide: _ } = G({
+      placement: z(e, "placement"),
+      offsetDistance: 8,
+      arrow: !e.noArrow
+    });
+    function c() {
+      e.disabled || (o && (clearTimeout(o), o = null), i = setTimeout(() => {
+        r.value = !0, s("update:visible", !0);
+      }, e.showDelay));
+    }
+    function l() {
+      i && (clearTimeout(i), i = null), o = setTimeout(() => {
+        r.value = !1, s("update:visible", !1);
+      }, e.hideDelay);
+    }
+    function M() {
+      r.value ? l() : c();
+    }
+    function S() {
+      (e.trigger === "hover" || e.trigger === "hover-focus") && c();
+    }
+    function B() {
+      (e.trigger === "hover" || e.trigger === "hover-focus") && l();
+    }
+    function D() {
+      (e.trigger === "focus" || e.trigger === "hover-focus") && c();
+    }
+    function R() {
+      (e.trigger === "focus" || e.trigger === "hover-focus") && l();
+    }
+    function $() {
+      e.trigger === "click" && M();
+    }
+    function x(t) {
+      t.key === "Escape" && r.value && l();
+    }
+    function C() {
+      (e.trigger === "hover" || e.trigger === "hover-focus") && o && (clearTimeout(o), o = null);
+    }
+    function E() {
+      (e.trigger === "hover" || e.trigger === "hover-focus") && l();
+    }
+    L(() => {
+      i && clearTimeout(i), o && clearTimeout(o);
+    });
+    const F = d(() => e.color ? {
+      background: `var(--cui-${e.color})`,
+      color: `var(--cui-${e.color}-text)`,
+      "--_arrow-bg": `var(--cui-${e.color})`
+    } : {});
+    return d(() => e.text || !0), (t, J) => I((u(), a("div", {
+      class: "cui-tooltip-wrapper",
+      onMouseenter: S,
+      onMouseleave: B,
+      onFocusin: D,
+      onFocusout: R,
+      onClick: $,
+      onKeydown: x
+    }, [
+      v("div", {
+        ref_key: "referenceRef",
+        ref: y,
+        class: "cui-tooltip__trigger"
+      }, [
+        g(t.$slots, "default", {}, void 0, !0)
+      ], 512),
+      (u(), K(O, { to: "body" }, [
+        r.value ? (u(), a("div", {
+          key: 0,
+          ref_key: "floatingRef",
+          ref: w,
+          class: P(["cui-tooltip", [
+            e.color ? "cui-tooltip--colored" : "cui-tooltip--default",
+            `cui-tooltip--${f(_)}`
+          ]]),
+          style: p({ ...f(k), ...F.value }),
+          role: "tooltip",
+          onMouseenter: C,
+          onMouseleave: E
+        }, [
+          v("div", H, [
+            g(t.$slots, "content", {}, () => [
+              U(j(n.text), 1)
+            ], !0)
+          ]),
+          n.noArrow ? m("", !0) : (u(), a("div", {
+            key: 0,
+            ref_key: "arrowRef",
+            ref: T,
+            class: "cui-tooltip__arrow",
+            style: p(f(b))
+          }, null, 4))
+        ], 38)) : m("", !0)
+      ]))
+    ], 544)), [
+      [q, !n.hidden]
+    ]);
+  }
+});
+export {
+  X as default
+};

package/dist/components/CuiTransferList.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HideableProps, DisableableProps } from "../types/common";
 export interface TransferListItem {
     value: string | number;
     label: string;
@@ -6,7 +7,7 @@ export interface TransferListItem {
     disabled?: boolean;
     [key: string]: unknown;
 }
-export interface CuiTransferListProps {
+export interface CuiTransferListProps extends HideableProps, DisableableProps {
     /** All available items */
     items: TransferListItem[];
     /** Selected values (right panel) — order is preserved */
@@ -25,10 +26,6 @@ export interface CuiTransferListProps {
     height?: string;
     /** Size */
     size?: "sm" | "md" | "lg";
-    /** Disabled */
-    disabled?: boolean;
-    /** Hidden */
-    hidden?: boolean;
 }
 declare var __VLS_10: {
     item: TransferListItem;
@@ -47,10 +44,10 @@ declare const __VLS_component: import("vue").DefineComponent<CuiTransferListProp
 }, string, import("vue").PublicProps, Readonly<CuiTransferListProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: (string | number)[]) => any) | undefined;
 }>, {
-    size: "sm" | "md" | "lg";
     hidden: boolean;
-    disabled: boolean;
+    size: "sm" | "md" | "lg";
     height: string;
+    disabled: boolean;
     modelValue: (string | number)[];
     sourceTitle: string;
     targetTitle: string;

package/dist/components/CuiTransferList.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CuiTransferList.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiTransferList.vue"],"names":[],"mappings":"AAkbA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,oBAAoB;IACnC,0BAA0B;IAC1B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW;IACX,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa;IACb,MAAM,CAAC,EAAE,OAAO,CAAC;CAClB;AAouBD,QAAA,IAAI,QAAQ;;;CAAU,EAAE,QAAQ;;;CAAY,CAAE;AAC9C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC1C;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAsD7C,QAAA,MAAM,eAAe;;;;;UAlyBZ,IAAI,GAAG,IAAI,GAAG,IAAI;YAIhB,OAAO;cAFL,OAAO;YAJT,MAAM;gBAZF,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE;iBAElB,MAAM;iBAEN,MAAM;gBAEP,OAAO;uBAEA,MAAM;uBAEN,MAAM;6EA8yB1B,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiTransferList.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiTransferList.vue"],"names":[],"mappings":"AA8aA,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAEvE,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED,MAAM,WAAW,oBAAqB,SAAQ,aAAa,EAAE,gBAAgB;IAC3E,0BAA0B;IAC1B,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAC1B,yDAAyD;IACzD,UAAU,CAAC,EAAE,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,CAAC;IACjC,uBAAuB;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wBAAwB;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wCAAwC;IACxC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,gCAAgC;IAChC,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,2BAA2B;IAC3B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW;IACX,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B;AAouBD,QAAA,IAAI,QAAQ;;;CAAU,EAAE,QAAQ;;;CAAY,CAAE;AAC9C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC1C;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAsD7C,QAAA,MAAM,eAAe;;;;;;UA9xBZ,IAAI,GAAG,IAAI,GAAG,IAAI;YAFhB,MAAM;;gBAZF,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE;iBAElB,MAAM;iBAEN,MAAM;gBAEP,OAAO;uBAEA,MAAM;uBAEN,MAAM;6EA0yB1B,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAa1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/CuiTransferList.vue.js

@@ -0,0 +1,442 @@
+import { defineComponent as oe, ref as z, computed as k, withDirectives as se, openBlock as c, createElementBlock as m, normalizeStyle as y, createElementVNode as s, toDisplayString as p, createVNode as o, withCtx as b, createCommentVNode as x, Fragment as j, renderList as U, renderSlot as q, createBlock as G, vShow as de } from "vue";
+import V from "./CuiButton.vue.js";
+import v from "./CuiIcon.vue.js";
+import J from "./CuiInput.vue.js";
+const ue = { style: { padding: "calc(0.625rem * var(--cui-density-scale, 1)) calc(0.75rem * var(--cui-density-scale, 1))", display: "flex", justifyContent: "space-between", alignItems: "center" } }, ce = { style: { fontSize: "0.6875rem", color: "var(--cui-text-tertiary)" } }, ve = {
+  key: 0,
+  style: { padding: "0 calc(0.5rem * var(--cui-density-scale, 1)) calc(0.375rem * var(--cui-density-scale, 1))" }
+}, fe = ["draggable", "onClick", "onDblclick", "onDragstart", "onDragover"], me = { style: { flex: "1", minWidth: "0" } }, ge = { style: { lineHeight: "1.3" } }, ye = {
+  key: 0,
+  style: { fontSize: "0.6875rem", color: "var(--cui-text-tertiary)", lineHeight: "1.3" }
+}, pe = {
+  key: 0,
+  style: { padding: "calc(1rem * var(--cui-density-scale, 1))", textAlign: "center", fontSize: "0.8125rem", color: "var(--cui-text-tertiary)" }
+}, be = { style: { display: "flex", flexDirection: "column", justifyContent: "center", gap: "calc(0.25rem * var(--cui-density-scale, 1))", flexShrink: "0" } }, xe = { style: { padding: "calc(0.625rem * var(--cui-density-scale, 1)) calc(0.75rem * var(--cui-density-scale, 1))", display: "flex", justifyContent: "space-between", alignItems: "center" } }, he = { style: { fontSize: "0.6875rem", color: "var(--cui-text-tertiary)" } }, Se = {
+  key: 0,
+  style: { padding: "0 calc(0.5rem * var(--cui-density-scale, 1)) calc(0.375rem * var(--cui-density-scale, 1))" }
+}, ze = ["onClick", "onDblclick", "onDragstart", "onDragover"], ke = { style: { flex: "1", minWidth: "0" } }, De = { style: { lineHeight: "1.3" } }, Ve = {
+  key: 0,
+  style: { fontSize: "0.6875rem", color: "var(--cui-text-tertiary)", lineHeight: "1.3" }
+}, Ce = {
+  key: 0,
+  style: { padding: "calc(1rem * var(--cui-density-scale, 1))", textAlign: "center", fontSize: "0.8125rem", color: "var(--cui-text-tertiary)" }
+}, Be = /* @__PURE__ */ oe({
+  __name: "CuiTransferList",
+  props: {
+    items: {},
+    modelValue: { default: () => [] },
+    sourceTitle: { default: "Available" },
+    targetTitle: { default: "Selected" },
+    filterable: { type: Boolean, default: !0 },
+    sourcePlaceholder: { default: "Filter..." },
+    targetPlaceholder: { default: "Filter..." },
+    height: { default: "320px" },
+    size: { default: "md" },
+    hidden: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(n, { emit: K }) {
+    const r = n, f = K, C = z(""), w = z(""), h = z(/* @__PURE__ */ new Set()), u = z(/* @__PURE__ */ new Set()), M = k(() => new Set(r.modelValue)), T = k(
+      () => r.items.filter((l) => !M.value.has(l.value))
+    ), P = k(() => {
+      if (!C.value) return T.value;
+      const l = C.value.toLowerCase();
+      return T.value.filter(
+        (e) => e.label.toLowerCase().includes(l) || e.description && e.description.toLowerCase().includes(l)
+      );
+    }), B = k(
+      () => r.modelValue.map((l) => r.items.find((e) => e.value === l)).filter(Boolean)
+    ), L = k(() => {
+      if (!w.value) return B.value;
+      const l = w.value.toLowerCase();
+      return B.value.filter(
+        (e) => e.label.toLowerCase().includes(l) || e.description && e.description.toLowerCase().includes(l)
+      );
+    });
+    function Q() {
+      if (r.disabled) return;
+      const l = [...r.modelValue, ...h.value];
+      h.value = /* @__PURE__ */ new Set(), f("update:modelValue", l);
+    }
+    function X() {
+      if (r.disabled) return;
+      const l = [...r.modelValue, ...T.value.filter((e) => !e.disabled).map((e) => e.value)];
+      h.value = /* @__PURE__ */ new Set(), f("update:modelValue", l);
+    }
+    function Z() {
+      if (r.disabled) return;
+      const l = u.value, e = r.modelValue.filter((a) => !l.has(a));
+      u.value = /* @__PURE__ */ new Set(), f("update:modelValue", e);
+    }
+    function _() {
+      r.disabled || (u.value = /* @__PURE__ */ new Set(), f("update:modelValue", []));
+    }
+    function ee() {
+      if (r.disabled || u.value.size !== 1) return;
+      const l = [...u.value][0], e = [...r.modelValue], a = e.indexOf(l);
+      a > 0 && ([e[a - 1], e[a]] = [e[a], e[a - 1]], f("update:modelValue", e));
+    }
+    function te() {
+      if (r.disabled || u.value.size !== 1) return;
+      const l = [...u.value][0], e = [...r.modelValue], a = e.indexOf(l);
+      a < e.length - 1 && ([e[a], e[a + 1]] = [e[a + 1], e[a]], f("update:modelValue", e));
+    }
+    function le(l) {
+      if (r.disabled) return;
+      const e = new Set(h.value);
+      e.has(l) ? e.delete(l) : e.add(l), h.value = e;
+    }
+    function ae(l) {
+      if (r.disabled) return;
+      const e = new Set(u.value);
+      e.has(l) ? e.delete(l) : e.add(l), u.value = e;
+    }
+    function re(l) {
+      r.disabled || l.disabled || f("update:modelValue", [...r.modelValue, l.value]);
+    }
+    function ie(l) {
+      r.disabled || f("update:modelValue", r.modelValue.filter((e) => e !== l.value));
+    }
+    const S = z(null), d = z(null), D = z(null);
+    function O(l, e, a) {
+      if (r.disabled) {
+        l.preventDefault();
+        return;
+      }
+      S.value = { value: e, from: a }, l.dataTransfer.effectAllowed = "move", l.dataTransfer.setData("text/plain", String(e));
+    }
+    function A() {
+      S.value = null, d.value = null, D.value = null;
+    }
+    function H(l, e, a) {
+      l.preventDefault(), l.dataTransfer.dropEffect = "move";
+      const g = l.currentTarget.getBoundingClientRect(), t = g.top + g.height / 2, i = l.clientY < t ? "before" : "after";
+      d.value = { value: e, side: a, position: i };
+    }
+    function $(l, e) {
+      l.preventDefault(), l.dataTransfer.dropEffect = "move", D.value = e;
+    }
+    function E() {
+      D.value = null;
+    }
+    function N(l, e) {
+      if (l.preventDefault(), !S.value) return;
+      const { value: a, from: g } = S.value;
+      if (g === "source" && e === "target") {
+        const t = [...r.modelValue];
+        if (d.value && d.value.side === "target") {
+          const i = t.indexOf(d.value.value);
+          if (i >= 0) {
+            const F = d.value.position === "after" ? i + 1 : i;
+            t.splice(F, 0, a);
+          } else
+            t.push(a);
+        } else
+          t.push(a);
+        f("update:modelValue", t);
+      } else if (g === "target" && e === "source")
+        f("update:modelValue", r.modelValue.filter((t) => t !== a));
+      else if (g === "target" && e === "target") {
+        const t = r.modelValue.filter((i) => i !== a);
+        if (d.value && d.value.side === "target") {
+          const i = t.indexOf(d.value.value);
+          if (i >= 0) {
+            const F = d.value.position === "after" ? i + 1 : i;
+            t.splice(F, 0, a);
+          } else
+            t.push(a);
+        } else
+          t.push(a);
+        f("update:modelValue", t);
+      }
+      S.value = null, d.value = null, D.value = null;
+    }
+    function R(l, e) {
+      if (!d.value || d.value.value !== l || d.value.side !== e) return;
+      const a = "2px solid var(--cui-primary)";
+      return d.value.position === "before" ? { borderTop: a } : { borderBottom: a };
+    }
+    const ne = {
+      sm: { fontSize: "0.8125rem", itemPad: "0.3125rem 0.5rem", titleFont: "0.75rem" },
+      md: { fontSize: "0.875rem", itemPad: "0.4375rem 0.625rem", titleFont: "0.8125rem" },
+      lg: { fontSize: "0.9375rem", itemPad: "0.5rem 0.75rem", titleFont: "0.875rem" }
+    }, I = k(() => ne[r.size]);
+    function W(l, e) {
+      return {
+        display: "flex",
+        alignItems: "center",
+        gap: "calc(0.5rem * var(--cui-density-scale, 1))",
+        padding: I.value.itemPad,
+        fontSize: I.value.fontSize,
+        cursor: e ? "default" : "pointer",
+        borderRadius: "0.25rem",
+        background: l ? "var(--cui-primary-bg)" : "transparent",
+        color: e ? "var(--cui-text-tertiary)" : "var(--cui-text-body)",
+        opacity: e ? "0.5" : "1",
+        transition: "background 0.1s ease",
+        userSelect: "none"
+      };
+    }
+    const Y = k(() => ({
+      flex: "1",
+      minWidth: "0",
+      border: "1px solid var(--cui-border)",
+      borderRadius: "0.5rem",
+      background: "var(--cui-surface-base, white)",
+      display: "flex",
+      flexDirection: "column",
+      overflow: "hidden"
+    }));
+    return (l, e) => {
+      var a, g;
+      return se((c(), m("div", {
+        style: y({
+          display: "flex",
+          gap: "calc(0.5rem * var(--cui-density-scale, 1))",
+          alignItems: "stretch",
+          opacity: n.disabled ? "0.5" : "1"
+        })
+      }, [
+        s("div", {
+          style: y(Y.value)
+        }, [
+          s("div", ue, [
+            s("span", {
+              style: y({ fontSize: I.value.titleFont, fontWeight: "600", color: "var(--cui-text-body)", textTransform: "uppercase", letterSpacing: "0.03em" })
+            }, p(n.sourceTitle), 5),
+            s("span", ce, p(P.value.length), 1)
+          ]),
+          n.filterable ? (c(), m("div", ve, [
+            o(J, {
+              modelValue: C.value,
+              "onUpdate:modelValue": e[0] || (e[0] = (t) => C.value = t),
+              placeholder: n.sourcePlaceholder,
+              size: "sm"
+            }, {
+              prefix: b(() => [
+                o(v, {
+                  name: "magnifying-glass",
+                  size: "0.75rem"
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue", "placeholder"])
+          ])) : x("", !0),
+          s("div", {
+            style: y({
+              flex: "1",
+              overflowY: "auto",
+              padding: "0 calc(0.375rem * var(--cui-density-scale, 1)) calc(0.375rem * var(--cui-density-scale, 1))",
+              maxHeight: n.height,
+              outline: D.value === "source" && ((a = S.value) == null ? void 0 : a.from) === "target" ? "2px dashed var(--cui-primary)" : "none",
+              outlineOffset: "-2px",
+              borderRadius: "0 0 0.5rem 0.5rem"
+            }),
+            onDragover: e[1] || (e[1] = (t) => $(t, "source")),
+            onDragleave: E,
+            onDrop: e[2] || (e[2] = (t) => N(t, "source"))
+          }, [
+            (c(!0), m(j, null, U(P.value, (t) => (c(), m("div", {
+              key: String(t.value),
+              draggable: !t.disabled && !n.disabled,
+              style: y({ ...W(h.value.has(t.value), t.disabled), ...R(t.value, "source") }),
+              onClick: (i) => !t.disabled && le(t.value),
+              onDblclick: (i) => re(t),
+              onDragstart: (i) => O(i, t.value, "source"),
+              onDragend: A,
+              onDragover: (i) => H(i, t.value, "source")
+            }, [
+              o(v, {
+                name: "dots-six-vertical",
+                size: "0.75rem",
+                style: { flexShrink: "0", color: "var(--cui-text-tertiary)", cursor: "grab", opacity: "0.4" }
+              }),
+              q(l.$slots, "item", {
+                item: t,
+                side: "source"
+              }, () => [
+                t.icon ? (c(), G(v, {
+                  key: 0,
+                  name: t.icon,
+                  size: "0.875rem",
+                  style: { flexShrink: "0", color: "var(--cui-text-secondary)" }
+                }, null, 8, ["name"])) : x("", !0),
+                s("div", me, [
+                  s("div", ge, p(t.label), 1),
+                  t.description ? (c(), m("div", ye, p(t.description), 1)) : x("", !0)
+                ])
+              ])
+            ], 44, fe))), 128)),
+            P.value.length === 0 ? (c(), m("div", pe, " No items ")) : x("", !0)
+          ], 36)
+        ], 4),
+        s("div", be, [
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || h.value.size === 0,
+            onClick: Q
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-right",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || T.value.length === 0,
+            onClick: X
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-double-right",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || u.value.size === 0,
+            onClick: Z
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-left",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || B.value.length === 0,
+            onClick: _
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-double-left",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          e[6] || (e[6] = s("div", { style: { height: "0.5rem" } }, null, -1)),
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || u.value.size !== 1,
+            onClick: ee
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-up",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"]),
+          o(V, {
+            variant: "outline",
+            size: "xs",
+            disabled: n.disabled || u.value.size !== 1,
+            onClick: te
+          }, {
+            default: b(() => [
+              o(v, {
+                name: "caret-down",
+                size: "0.875rem"
+              })
+            ]),
+            _: 1
+          }, 8, ["disabled"])
+        ]),
+        s("div", {
+          style: y(Y.value)
+        }, [
+          s("div", xe, [
+            s("span", {
+              style: y({ fontSize: I.value.titleFont, fontWeight: "600", color: "var(--cui-text-body)", textTransform: "uppercase", letterSpacing: "0.03em" })
+            }, p(n.targetTitle), 5),
+            s("span", he, p(L.value.length), 1)
+          ]),
+          n.filterable ? (c(), m("div", Se, [
+            o(J, {
+              modelValue: w.value,
+              "onUpdate:modelValue": e[3] || (e[3] = (t) => w.value = t),
+              placeholder: n.targetPlaceholder,
+              size: "sm"
+            }, {
+              prefix: b(() => [
+                o(v, {
+                  name: "magnifying-glass",
+                  size: "0.75rem"
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue", "placeholder"])
+          ])) : x("", !0),
+          s("div", {
+            style: y({
+              flex: "1",
+              overflowY: "auto",
+              padding: "0 calc(0.375rem * var(--cui-density-scale, 1)) calc(0.375rem * var(--cui-density-scale, 1))",
+              maxHeight: n.height,
+              outline: D.value === "target" && ((g = S.value) == null ? void 0 : g.from) === "source" ? "2px dashed var(--cui-primary)" : "none",
+              outlineOffset: "-2px",
+              borderRadius: "0 0 0.5rem 0.5rem"
+            }),
+            onDragover: e[4] || (e[4] = (t) => $(t, "target")),
+            onDragleave: E,
+            onDrop: e[5] || (e[5] = (t) => N(t, "target"))
+          }, [
+            (c(!0), m(j, null, U(L.value, (t) => (c(), m("div", {
+              key: String(t.value),
+              draggable: "true",
+              style: y({ ...W(u.value.has(t.value)), ...R(t.value, "target") }),
+              onClick: (i) => ae(t.value),
+              onDblclick: (i) => ie(t),
+              onDragstart: (i) => O(i, t.value, "target"),
+              onDragend: A,
+              onDragover: (i) => H(i, t.value, "target")
+            }, [
+              o(v, {
+                name: "dots-six-vertical",
+                size: "0.75rem",
+                style: { flexShrink: "0", color: "var(--cui-text-tertiary)", cursor: "grab", opacity: "0.4" }
+              }),
+              q(l.$slots, "item", {
+                item: t,
+                side: "target"
+              }, () => [
+                t.icon ? (c(), G(v, {
+                  key: 0,
+                  name: t.icon,
+                  size: "0.875rem",
+                  style: { flexShrink: "0", color: "var(--cui-text-secondary)" }
+                }, null, 8, ["name"])) : x("", !0),
+                s("div", ke, [
+                  s("div", De, p(t.label), 1),
+                  t.description ? (c(), m("div", Ve, p(t.description), 1)) : x("", !0)
+                ])
+              ])
+            ], 44, ze))), 128)),
+            L.value.length === 0 ? (c(), m("div", Ce, " No items ")) : x("", !0)
+          ], 36)
+        ], 4)
+      ], 4)), [
+        [de, !n.hidden]
+      ]);
+    };
+  }
+});
+export {
+  Be as default
+};

package/dist/components/CuiTransferList.vue2.js

@@ -0,0 +1,4 @@
+import f from "./CuiTransferList.vue.js";
+export {
+  f as default
+};

package/dist/components/CuiTreeNode.vue.d.ts

@@ -12,7 +12,8 @@ type __VLS_Props = {
         fontSize: string;
         iconSize: string;
         indent: string;
-        padding: string;
+        padY: string;
+        padX: string;
     };
 };
 declare var __VLS_7: {

package/dist/components/CuiTreeNode.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CuiTreeNode.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiTreeNode.vue"],"names":[],"mappings":"AA6NA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IAC/B,WAAW,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;CAC9E,CAAC;AAgQF,QAAA,IAAI,OAAO;;;;;CAAU,EAAE,QAAQ,KAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GACzC;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAiC7C,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CuiTreeNode.vue.d.ts","sourceRoot":"","sources":["../../src/components/CuiTreeNode.vue"],"names":[],"mappings":"AA6NA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,KAAK,WAAW,GAAG;IACjB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,QAAQ,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IAC/B,WAAW,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;IAClC,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,GAAG,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;CACzF,CAAC;AAgQF,QAAA,IAAI,OAAO;;;;;CAAU,EAAE,QAAQ,KAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GACzC;IAAE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAiC7C,QAAA,MAAM,eAAe;;;;;;kFAOnB,CAAC;wBACkB,eAAe,CAAC,OAAO,eAAe,EAAE,WAAW,CAAC;AAAzE,wBAA0E;AAQ1E,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}