@indielayer/ui 1.18.0 → 2.0.0

package/lib/components/tag/Tag.vue.js

@@ -1,73 +0,0 @@
-import { defineComponent as k, computed as l, useAttrs as x, openBlock as n, createBlock as h, resolveDynamicComponent as y, normalizeClass as t, unref as r, normalizeStyle as z, withCtx as B, createElementVNode as s, renderSlot as i, createElementBlock as C, createVNode as S, withModifiers as _, createCommentVNode as w } from "vue";
-import { useColors as N } from "../../composables/useColors.js";
-import { useCommon as d } from "../../composables/useCommon.js";
-import { useTheme as T } from "../../composables/useTheme.js";
-import { closeIcon as $ } from "../../common/icons.js";
-import V from "../icon/Icon.vue.js";
-const E = { class: "flex items-center gap-2" }, I = { class: "truncate" }, j = {
-  key: 0,
-  class: "absolute right-1.5 top-0 h-full flex items-center"
-}, A = {
-  ...d.props(),
-  ...N.props("secondary"),
-  tag: {
-    type: String,
-    default: "span"
-  },
-  rounded: Boolean,
-  removable: Boolean,
-  outlined: Boolean,
-  filled: Boolean,
-  disabled: Boolean,
-  to: [String, Object]
-}, D = {
-  name: "XTag",
-  validators: {
-    ...d.validators()
-  }
-}, G = /* @__PURE__ */ k({
-  ...D,
-  props: A,
-  emits: ["remove"],
-  setup(c) {
-    const o = c, m = l(() => o.size === "xs" ? "xs" : o.size === "sm" ? "sm" : o.size === "lg" ? "md" : o.size === "xl" ? "lg" : "sm"), u = x(), p = l(() => u.href ? "a" : o.to ? "router-link" : o.tag), { styles: f, classes: g, className: v } = T("Tag", {}, o);
-    return (e, a) => (n(), h(y(p.value), {
-      to: e.to,
-      class: t([
-        "text-[color:var(--x-tag-text)] dark:text-[color:var(--x-tag-dark-text)] border relative",
-        [
-          r(v),
-          r(g).wrapper,
-          e.outlined ? "border-[color:var(--x-tag-border)] dark:border-[color:var(--x-tag-dark-border)]" : "!border-transparent bg-[color:var(--x-tag-bg)] dark:bg-[color:var(--x-tag-dark-bg)]",
-          e.rounded ? "rounded-full" : "rounded"
-        ]
-      ]),
-      style: z(r(f))
-    }, {
-      default: B(() => [
-        s("span", {
-          class: t(["max-w-full", { "pr-4": e.removable }])
-        }, [
-          s("div", E, [
-            i(e.$slots, "prefix"),
-            s("div", I, [
-              i(e.$slots, "default")
-            ])
-          ]),
-          e.removable ? (n(), C("div", j, [
-            S(V, {
-              size: m.value,
-              icon: r($),
-              class: t(["cursor-pointer transition-colors duration-150", [e.disabled ? "text-secondary-400" : "hover:text-secondary-500"]]),
-              onClick: a[0] || (a[0] = _((b) => !e.disabled && e.$emit("remove", b), ["prevent"]))
-            }, null, 8, ["size", "icon", "class"])
-          ])) : w("", !0)
-        ], 2)
-      ]),
-      _: 3
-    }, 8, ["to", "style", "class"]));
-  }
-});
-export {
-  G as default
-};

package/lib/components/tag/Tag.vue2.js

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

package/lib/components/tag/__tests__/Tag.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/components/textarea/Textarea.vue.js

@@ -1,141 +0,0 @@
-import { defineComponent as O, useAttrs as D, computed as i, ref as W, watch as X, openBlock as u, createBlock as m, normalizeStyle as G, unref as r, normalizeClass as h, withCtx as J, createElementVNode as b, renderSlot as g, mergeProps as M, toHandlers as Q, withKeys as U, createCommentVNode as v } from "vue";
-import { useResizeObserver as Y, useEventListener as Z } from "../../node_modules/.pnpm/@vueuse_core@11.1.0_vue@3.5.10_typescript@5.2.2_/node_modules/@vueuse/core/index.js";
-import { useCSS as _ } from "../../composables/useCSS.js";
-import { useTheme as ee } from "../../composables/useTheme.js";
-import { useCommon as y } from "../../composables/useCommon.js";
-import { useColors as re } from "../../composables/useColors.js";
-import { useInputtable as d } from "../../composables/useInputtable.js";
-import { useInteractive as w } from "../../composables/useInteractive.js";
-import oe from "../label/Label.vue.js";
-import te from "../inputFooter/InputFooter.vue.js";
-import ne from "../icon/Icon.vue.js";
-import { closeIcon as se } from "../../common/icons.js";
-const le = { class: "relative" }, ae = ["id", "disabled", "max", "maxlength", "min", "dir", "rows", "minlength", "name", "placeholder", "readonly", "value"], ie = {
-  ...y.props(),
-  ...w.props(),
-  ...d.props(),
-  dir: {
-    type: String,
-    default: "ltr"
-  },
-  rows: {
-    type: [Number, String],
-    default: 2
-  },
-  max: [Number, String],
-  maxlength: [Number, String],
-  min: [Number, String],
-  minlength: [Number, String],
-  placeholder: String,
-  adjustToText: Boolean,
-  preventEnter: Boolean,
-  block: Boolean,
-  resizable: Boolean,
-  showCounter: Boolean,
-  clearable: Boolean
-}, ue = {
-  name: "XTextarea",
-  validators: {
-    ...y.validators()
-  }
-}, ze = /* @__PURE__ */ O({
-  ...ue,
-  props: ie,
-  emits: d.emits(),
-  setup(S, { expose: C, emit: k }) {
-    const o = S, z = k, p = D(), B = i(() => Object.keys(p).reduce((e, n) => (n.startsWith("data-") && (e[n] = p[n]), e), {})), t = W(null);
-    Y(t, s), typeof window < "u" && Z(window, "resize", s), X([() => o.modelValue, () => o.size], () => {
-      setTimeout(s);
-    });
-    const I = _("textarea"), N = re().getPalette("primary"), T = I.get("border", N[400]);
-    function E() {
-      s();
-    }
-    function V(e) {
-      o.preventEnter && e.preventDefault(), e.stopPropagation();
-    }
-    function s() {
-      o.adjustToText && t.value && (t.value.style.height = "1px", t.value.style.height = 2 + t.value.scrollHeight + "px");
-    }
-    const { focus: c, blur: $ } = w(t), {
-      errorInternal: l,
-      hideFooterInternal: x,
-      isInsideForm: P,
-      inputListeners: j,
-      reset: f,
-      validate: q,
-      setError: L
-    } = d(o, { focus: c, emit: z }), R = i(() => {
-      const e = o.modelValue;
-      return e ? String(e).length : 0;
-    }), A = i(() => o.clearable && o.modelValue !== "");
-    function F(e) {
-      return typeof e > "u" || e === null;
-    }
-    const { styles: H, classes: a, className: K } = ee("Textarea", {}, o, { errorInternal: l });
-    return C({ focus: c, blur: $, reset: f, validate: q, setError: L }), (e, n) => (u(), m(oe, {
-      style: G(r(H)),
-      block: e.block,
-      disabled: e.disabled,
-      required: e.required,
-      "is-inside-form": r(P),
-      label: e.label,
-      class: h([
-        r(K),
-        r(a).wrapper
-      ]),
-      tooltip: e.tooltip
-    }, {
-      default: J(() => [
-        b("div", le, [
-          g(e.$slots, "prefix"),
-          b("textarea", M({
-            id: e.id,
-            ref_key: "elRef",
-            ref: t,
-            class: ["", [
-              r(a).input,
-              r(l) ? "border-error-500 dark:border-error-400 focus:outline-error-500" : "focus:outline-[color:var(--x-textarea-border)]"
-            ]],
-            style: r(T),
-            disabled: e.disabled,
-            max: e.max,
-            maxlength: e.maxlength,
-            min: e.min,
-            dir: e.dir,
-            rows: e.rows,
-            minlength: e.minlength,
-            name: e.name,
-            placeholder: e.placeholder,
-            readonly: e.readonly,
-            value: F(e.modelValue) ? "" : String(e.modelValue)
-          }, B.value, Q(r(j), !0), {
-            onKeydown: U(V, ["enter"]),
-            onInput: E
-          }), null, 16, ae),
-          g(e.$slots, "suffix", {}, () => [
-            A.value ? (u(), m(ne, {
-              key: 0,
-              size: e.size,
-              icon: r(se),
-              class: h(["right-2 cursor-pointer", r(a).icon]),
-              onClick: n[0] || (n[0] = (de) => r(f)())
-            }, null, 8, ["size", "icon", "class"])) : v("", !0)
-          ])
-        ]),
-        r(x) ? v("", !0) : (u(), m(te, {
-          key: 0,
-          error: r(l),
-          helper: e.helper,
-          "character-count": R.value,
-          "max-characters": e.maxlength,
-          "show-counter": e.showCounter
-        }, null, 8, ["error", "helper", "character-count", "max-characters", "show-counter"]))
-      ]),
-      _: 3
-    }, 8, ["style", "block", "disabled", "required", "is-inside-form", "label", "class", "tooltip"]));
-  }
-});
-export {
-  ze as default
-};

package/lib/components/textarea/Textarea.vue2.js

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

package/lib/components/textarea/__tests__/Textarea.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/components/themeProvider/ThemeProvider.vue.js

@@ -1,18 +0,0 @@
-import { defineComponent as a, inject as c, ref as i, unref as r, provide as f, watchEffect as l, renderSlot as p } from "vue";
-import { injectThemeKey as n } from "../../composables/keys.js";
-import { injectThemeStyles as u } from "../../theme.js";
-const h = { name: "XThemeProvider" }, y = /* @__PURE__ */ a({
-  ...h,
-  props: {
-    theme: Object
-  },
-  setup(m) {
-    const t = m, o = c(n, {}), e = i(t.theme || r(o) || {});
-    return f(n, e), l(() => {
-      e.value = t.theme || r(o) || {}, e.value.styles && u(e.value.name || "", e.value.styles);
-    }), (s, d) => p(s.$slots, "default");
-  }
-});
-export {
-  y as default
-};

package/lib/components/themeProvider/ThemeProvider.vue2.js

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

package/lib/components/toggle/Toggle.vue.js

@@ -1,108 +0,0 @@
-import { defineComponent as T, ref as $, computed as D, openBlock as d, createElementBlock as b, normalizeClass as l, unref as r, createElementVNode as a, normalizeStyle as R, withDirectives as S, vModelCheckbox as F, toDisplayString as L, createCommentVNode as t, createBlock as g } from "vue";
-import { useTheme as M } from "../../composables/useTheme.js";
-import { useCommon as f } from "../../composables/useCommon.js";
-import { useColors as P } from "../../composables/useColors.js";
-import { useInputtable as i } from "../../composables/useInputtable.js";
-import { useInteractive as v } from "../../composables/useInteractive.js";
-import U from "../spinner/Spinner.vue.js";
-import W from "../inputFooter/InputFooter.vue.js";
-const X = { class: "flex items-center" }, j = ["id", "aria-checked", "aria-disabled", "disabled", "name", "required", "value"], A = ["textContent"], G = {
-  ...f.props(),
-  ...P.props("primary"),
-  ...v.props(),
-  ...i.props(),
-  glow: Boolean
-}, H = {
-  name: "XToggle",
-  validators: {
-    ...f.validators()
-  }
-}, ee = /* @__PURE__ */ T({
-  ...H,
-  props: G,
-  emits: i.emits(!1),
-  setup(h, { expose: k, emit: y }) {
-    const n = h, u = y, m = $(null), o = D({
-      get() {
-        return !!n.modelValue;
-      },
-      set(e) {
-        u("update:modelValue", e);
-      }
-    }), { focus: p, blur: w } = v(m), {
-      errorInternal: C,
-      hideFooterInternal: V,
-      reset: z,
-      validate: B,
-      setError: I
-    } = i(n, { focus: p, emit: u, withListeners: !1 }), { styles: q, classes: s, className: E } = M("Toggle", {}, n);
-    return k({ focus: p, blur: w, reset: z, validate: B, setError: I }), (e, c) => (d(), b("label", {
-      class: l(["inline-block", [
-        r(E),
-        r(s).wrapper,
-        e.disabled ? "cursor-not-allowed" : "cursor-pointer"
-      ]])
-    }, [
-      a("div", X, [
-        a("div", {
-          class: l(["flex items-center rounded-full transition-colors duration-300 border-[3px] shrink-0 !border-transparent", {
-            [`shadow-lg shadow-${e.color}-500/50`]: e.glow && e.modelValue,
-            "bg-secondary-300 dark:bg-secondary-500": !e.disabled && !o.value && !e.loading,
-            "bg-secondary-100 dark:bg-secondary-700": e.disabled || e.loading,
-            "bg-[color:var(--x-toggle-bg)] dark:bg-[color:var(--x-toggle-dark-bg)]": !e.disabled && o.value
-          }]),
-          style: R(r(q))
-        }, [
-          a("div", {
-            class: l(r(s).buttonWrapper)
-          }, [
-            S(a("input", {
-              id: e.id,
-              ref_key: "elRef",
-              ref: m,
-              "onUpdate:modelValue": c[0] || (c[0] = (N) => o.value = N),
-              "aria-checked": o.value ? "true" : "false",
-              "aria-disabled": e.disabled ? "true" : void 0,
-              type: "checkbox",
-              class: "hidden",
-              disabled: e.disabled || e.loading,
-              name: e.name,
-              required: e.required,
-              value: e.modelValue
-            }, null, 8, j), [
-              [F, o.value]
-            ]),
-            a("div", {
-              class: l([
-                r(s).button,
-                {
-                  "translate-x-full": o.value,
-                  shadow: !e.disabled
-                },
-                e.disabled ? "bg-secondary-50 dark:bg-secondary-800" : "bg-white dark:bg-secondary-800"
-              ])
-            }, null, 2)
-          ], 2)
-        ], 6),
-        e.label ? (d(), b("span", {
-          key: 0,
-          class: l(["ml-2", r(s).label]),
-          textContent: L(e.label)
-        }, null, 10, A)) : t("", !0),
-        e.loading ? (d(), g(U, {
-          key: 1,
-          size: e.size,
-          class: "ml-1"
-        }, null, 8, ["size"])) : t("", !0)
-      ]),
-      r(V) ? t("", !0) : (d(), g(W, {
-        key: 0,
-        error: r(C),
-        helper: e.helper
-      }, null, 8, ["error", "helper"]))
-    ], 2));
-  }
-});
-export {
-  ee as default
-};

package/lib/components/toggle/Toggle.vue2.js

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

package/lib/components/toggle/__tests__/Toggle.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/components/tooltip/ToggleTip.vue.js

@@ -1,29 +0,0 @@
-import { defineComponent as r, computed as i, openBlock as s, createBlock as p, withCtx as o, createElementVNode as a, createVNode as m } from "vue";
-import l from "./Tooltip.vue.js";
-import _ from "../icon/Icon.vue.js";
-import { infoIcon as d } from "../../common/icons.js";
-const f = ["innerHTML"], u = {
-  content: String,
-  icon: String
-}, g = { name: "XToggleTip" }, y = /* @__PURE__ */ r({
-  ...g,
-  props: u,
-  setup(t) {
-    const n = t, e = i(() => n.icon || d);
-    return (c, T) => (s(), p(l, { position: "right" }, {
-      tooltip: o(() => [
-        a("div", { innerHTML: c.content }, null, 8, f)
-      ]),
-      default: o(() => [
-        m(_, {
-          icon: e.value,
-          class: "text-secondary-500 dark:text-secondary-300 cursor-pointer"
-        }, null, 8, ["icon"])
-      ]),
-      _: 1
-    }));
-  }
-});
-export {
-  y as default
-};

package/lib/components/tooltip/ToggleTip.vue2.js

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

package/lib/components/tooltip/Tooltip.vue.js

@@ -1,132 +0,0 @@
-import { defineComponent as W, ref as c, useSlots as X, computed as f, openBlock as b, createBlock as C, resolveDynamicComponent as L, normalizeClass as u, unref as T, withCtx as k, renderSlot as R, Teleport as Y, createVNode as j, Transition as q, createElementBlock as A, normalizeStyle as x, createTextVNode as G, toDisplayString as I, createElementVNode as S, createCommentVNode as _ } from "vue";
-import { useTheme as J } from "../../composables/useTheme.js";
-const K = {
-  tag: {
-    type: String,
-    default: "div"
-  },
-  tooltip: String,
-  disabled: Boolean,
-  position: {
-    type: String,
-    default: "bottom"
-  }
-}, Q = { name: "XTooltip" }, tt = /* @__PURE__ */ W({
-  ...Q,
-  props: K,
-  setup($) {
-    const n = $, g = c(null), h = c(null), d = c(!1), y = c({}), s = c(n.position), B = X(), N = f(() => n.tooltip || B.tooltip), a = f(() => n.disabled || !N.value), V = f(() => a.value ? "" : {
-      top: "-bottom-2.5 w-3.5",
-      bottom: "-top-2.5 w-3.5",
-      left: "-right-2.5 h-3.5",
-      right: "-left-2.5 h-3.5"
-    }[s.value]), z = f(() => a.value ? "" : {
-      top: "-rotate-45 origin-top-left",
-      bottom: "rotate-45 origin-bottom-left",
-      left: "rotate-45 origin-top-left",
-      right: "-rotate-45 origin-top-right"
-    }[s.value]), P = f(() => a.value ? "" : {
-      top: "origin-bottom",
-      bottom: "origin-top",
-      left: "origin-right",
-      right: "origin-left"
-    }[s.value]), D = () => {
-      if (!g.value || !h.value)
-        return;
-      const t = g.value.getBoundingClientRect(), e = h.value.getBoundingClientRect(), l = 8, m = window.innerWidth, v = window.innerHeight;
-      let o = n.position, i = 0, r = 0;
-      switch (o) {
-        case "top":
-          i = t.top - e.height - l, r = t.left + t.width / 2 - e.width / 2, i < 0 && (o = "bottom", i = t.bottom + l);
-          break;
-        case "bottom":
-          i = t.bottom + l, r = t.left + t.width / 2 - e.width / 2, i + e.height > v && (o = "top", i = t.top - e.height - l);
-          break;
-        case "left":
-          i = t.top + t.height / 2 - e.height / 2, r = t.left - e.width - l, r < 0 && (o = "right", r = t.right + l);
-          break;
-        case "right":
-          i = t.top + t.height / 2 - e.height / 2, r = t.right + l, r + e.width > m && (o = "left", r = t.left - e.width - l);
-          break;
-      }
-      (o === "top" || o === "bottom") && (r < 0 && (r = l), r + e.width > m && (r = m - e.width - l)), (o === "left" || o === "right") && (i < 0 && (i = l), i + e.height > v && (i = v - e.height - l));
-      const p = {};
-      if (o === "top" || o === "bottom") {
-        const w = t.left + t.width / 2 - r;
-        p.left = `${w}px`;
-      } else if (o === "left" || o === "right") {
-        const w = t.top + t.height / 2 - i;
-        p.top = `${w}px`;
-      }
-      s.value = o, y.value = {
-        top: `${i}px`,
-        left: `${r}px`,
-        "--arrow-offset-x": p.left || "0px",
-        "--arrow-offset-y": p.top || "0px"
-      };
-    }, E = () => {
-      a.value || (d.value = !0, setTimeout(D, 0));
-    }, F = () => {
-      a.value || (d.value = !1);
-    }, { classes: H, className: M } = J("Tooltip", {}, n);
-    return (t, e) => (b(), C(L(t.tag), {
-      ref_key: "triggerRef",
-      ref: g,
-      class: u([
-        T(M),
-        {
-          "inline-block": !t.$attrs.class
-        }
-      ]),
-      onMouseenter: E,
-      onMouseleave: F
-    }, {
-      default: k(() => [
-        R(t.$slots, "default"),
-        a.value ? _("", !0) : (b(), C(Y, {
-          key: 0,
-          to: "body"
-        }, [
-          j(q, {
-            "enter-active-class": "transition-opacity duration-150 ease-out",
-            "leave-active-class": "transition-opacity duration-150 ease-in",
-            "enter-from-class": "opacity-0",
-            "enter-to-class": "opacity-100",
-            "leave-from-class": "opacity-100",
-            "leave-to-class": "opacity-0"
-          }, {
-            default: k(() => [
-              d.value ? (b(), A("div", {
-                key: 0,
-                ref_key: "tooltipRef",
-                ref: h,
-                style: x(y.value),
-                class: u(["fixed z-[10001] pointer-events-none", [
-                  T(H).tooltip,
-                  P.value
-                ]])
-              }, [
-                R(t.$slots, "tooltip", {}, () => [
-                  G(I(t.tooltip), 1)
-                ]),
-                S("div", {
-                  class: u(["absolute overflow-hidden shadow-lg z-10", V.value]),
-                  style: x(s.value === "top" || s.value === "bottom" ? { left: "var(--arrow-offset-x)", transform: "translateX(-50%)" } : { top: "var(--arrow-offset-y)", transform: "translateY(-50%)" })
-                }, [
-                  S("div", {
-                    class: u(["h-2.5 w-2.5 bg-secondary-700 transform border border-secondary-800", z.value])
-                  }, null, 2)
-                ], 6)
-              ], 6)) : _("", !0)
-            ]),
-            _: 3
-          })
-        ]))
-      ]),
-      _: 3
-    }, 40, ["class"]));
-  }
-});
-export {
-  tt as default
-};

package/lib/components/tooltip/Tooltip.vue2.js

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

package/lib/components/tooltip/__tests__/ToggleTip.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/components/tooltip/__tests__/Tooltip.spec.d.ts

@@ -1 +0,0 @@
-export {};