@caipira/tamandua 0.0.3 → 0.0.6

package/README.md

@@ -4,12 +4,20 @@ Tamanduá is a UI library designed for the Caipira ecosystem
 
 ## Storybook
 
-You can start Storybook by running:
+You can start storybook by running:
 
 ```sh
 npm run start:sb
 ```
 
+## Bundle
+
+You can analyze the bundle by running:
+
+```sh
+npx vite-bundle-visualizer
+```
+
 ## Reference
 
-[Storybook](https://storybook.js.org/docs/get-started/vue3-vite)
+[Storybook](https://storybook.js.org/docs/get-started/vue3-vite) [TailwindCSS](https://tailwindcss.com/)

package/dist/Avatar.js

@@ -0,0 +1,6 @@
+import { _ as o } from "./Avatar.vue_vue_type_script_setup_true_lang-C3xje4Mr.js";
+import { p } from "./plugin-BHaaQBWr.js";
+export {
+  o as Avatar,
+  p as AvatarPlugin
+};

package/dist/Avatar.vue_vue_type_script_setup_true_lang-C3xje4Mr.js

@@ -0,0 +1,51 @@
+import { defineComponent as m, getCurrentInstance as f, computed as _, resolveComponent as h, openBlock as n, createElementBlock as r, normalizeClass as v, unref as t, createBlock as y, toDisplayString as A, createCommentVNode as E } from "vue";
+import { E as o, a as s } from "./ui-BLR-4Xlv.js";
+import { u as a } from "./ui-MicIL_Lw.js";
+const S = ["role"], z = ["src"], C = { key: 2 }, R = /* @__PURE__ */ m({
+  name: "TAvatar",
+  __name: "Avatar",
+  props: {
+    icon: {},
+    text: { default: "" },
+    role: { default: "" },
+    size: { default: o.DEFAULT },
+    image: { default: "" },
+    shape: { default: s.CIRCLE },
+    disableStyle: { type: Boolean, default: !1 }
+  },
+  setup(c) {
+    const e = c, i = f(), p = _(() => e.role !== "" ? e.role : i && a.isPopoverActivator(i) ? "button" : ""), u = (l) => {
+      i && a.isPopoverActivator(i) && a.onPopoverActivatorClick(l, i);
+    };
+    return (l, L) => {
+      const d = h("t-icon");
+      return n(), r("div", {
+        role: p.value,
+        class: v([{
+          "h-5 w-5": !e.disableStyle && e.size === t(o).EXTRA_SMALL,
+          "h-7 w-7": !e.disableStyle && e.size === t(o).SMALL,
+          "h-10 w-10": !e.disableStyle && e.size === t(o).DEFAULT,
+          "h-20 w-20": !e.disableStyle && e.size === t(o).LARGE,
+          "h-40 w-40": !e.disableStyle && e.size === t(o).EXTRA_LARGE,
+          "rounded-full": e.shape === t(s).CIRCLE,
+          rounded: e.shape === t(s).SQUARE
+        }, "overflow-hidden inline-flex items-center justify-center bg-caipira-primary-inverted"]),
+        onClick: u
+      }, [
+        e.image ? (n(), r("img", {
+          key: 0,
+          class: "w-full h-full object-cover",
+          src: e.image
+        }, null, 8, z)) : e.icon ? (n(), y(d, {
+          key: 1,
+          class: "color-caipira-primary",
+          icon: e.icon,
+          size: e.size
+        }, null, 8, ["icon", "size"])) : e.text ? (n(), r("span", C, A(e.text), 1)) : E("", !0)
+      ], 10, S);
+    };
+  }
+});
+export {
+  R as _
+};

package/dist/Backdrop.js

@@ -0,0 +1,6 @@
+import { _ as p } from "./Backdrop.vue_vue_type_script_setup_true_lang-OaEBTmYK.js";
+import { p as c } from "./plugin-C-iGigb_.js";
+export {
+  p as Backdrop,
+  c as BackdropPlugin
+};

package/dist/Backdrop.vue_vue_type_script_setup_true_lang-OaEBTmYK.js

@@ -0,0 +1,22 @@
+import { defineComponent as i, openBlock as s, createElementBlock as c, normalizeClass as p } from "vue";
+const k = /* @__PURE__ */ i({
+  name: "TBackdrop",
+  __name: "Backdrop",
+  props: {
+    isTransparent: { type: Boolean, default: !1 }
+  },
+  emits: ["click"],
+  setup(t, { emit: n }) {
+    const o = t, r = n;
+    return (l, e) => (s(), c("div", {
+      class: p(["fixed inset-0", {
+        "bg-caipira-tertiary opacity-80": !o.isTransparent
+      }]),
+      role: "button",
+      onClick: e[0] || (e[0] = (a) => r("click", a))
+    }, null, 2));
+  }
+});
+export {
+  k as _
+};

package/dist/Button-Bzvqv1bQ.js

@@ -0,0 +1,6 @@
+import { _ as o } from "./Button.vue_vue_type_style_index_0_scoped_5056001e_lang-DmQxrvfv.js";
+import { _ as t } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const a = /* @__PURE__ */ t(o, [["__scopeId", "data-v-5056001e"]]);
+export {
+  a as B
+};

package/dist/Button.js

@@ -0,0 +1,6 @@
+import { B as r } from "./Button-Bzvqv1bQ.js";
+import { p } from "./plugin-BLe_xel4.js";
+export {
+  r as Button,
+  p as ButtonPlugin
+};

package/dist/Button.vue_vue_type_style_index_0_scoped_5056001e_lang-DmQxrvfv.js

@@ -0,0 +1,143 @@
+import './Button.css';
+import { defineComponent as w, getCurrentInstance as O, ref as y, computed as o, resolveComponent as U, openBlock as s, createBlock as m, resolveDynamicComponent as _, normalizeClass as c, unref as i, withCtx as B, renderSlot as k, createCommentVNode as u, createElementBlock as b, toDisplayString as z } from "vue";
+import { B as a, E as l, a as d, b as r } from "./ui-BLR-4Xlv.js";
+import { u as h } from "./ui-MicIL_Lw.js";
+import "./Icon.vue_vue_type_script_setup_true_lang-hxJ1wXXd.js";
+const x = ["multiple"], K = /* @__PURE__ */ w({
+  name: "TButton",
+  __name: "Button",
+  props: {
+    to: {},
+    icon: {},
+    href: { default: "" },
+    type: { default: a.BUTTON },
+    size: { default: l.DEFAULT },
+    label: { default: "" },
+    shape: { default: d.ROUNDED },
+    target: { default: void 0 },
+    variant: { default: r.DEFAULT },
+    multiple: { type: Boolean, default: !1 },
+    isOutline: { type: Boolean, default: !1 },
+    isDisabled: { type: Boolean, default: !1 },
+    injectStyle: { default: () => ({ icon: "" }) },
+    disableStyle: { type: Boolean, default: !1 }
+  },
+  emits: ["upload"],
+  setup(g, { expose: S, emit: E }) {
+    const e = g, A = E, p = O(), f = y(), v = y(null), R = o(() => e.href ? e.href : void 0), D = o(() => {
+      switch (e.type) {
+        case a.LINK:
+          return;
+        case a.FILE:
+          return "button";
+        default:
+          return e.type;
+      }
+    }), L = o(() => e.type === a.SUBMIT ? e.label : void 0), T = o(() => {
+      switch (e.type) {
+        case a.SUBMIT:
+          return "input";
+        case a.LINK:
+          return "a";
+        case a.ROUTER_LINK:
+          return "router-link";
+        default:
+          return "button";
+      }
+    }), C = (t) => {
+      p && h.isPopoverActivator(p) && h.onPopoverActivatorClick(t, p), e.type === a.SUBMIT && t.preventDefault(), e.type === a.FILE && f.value?.click();
+    }, I = (t) => {
+      t.stopPropagation();
+      const n = t.target.files;
+      !n || !n.length || A("upload", n);
+    };
+    return S({ iconReference: v }), (t, N) => {
+      const n = U("t-icon");
+      return s(), m(_(T.value), {
+        type: D.value,
+        href: R.value,
+        value: L.value,
+        to: e.to,
+        disabled: e.isDisabled,
+        target: e.target,
+        class: c([{
+          "font-bold": !e.disableStyle,
+          "opacity-50": e.isDisabled,
+          // Padding
+          "px-1 py-0": !e.disableStyle && e.size === i(l).EXTRA_SMALL,
+          "px-4 h-9": !e.disableStyle && e.size === i(l).SMALL,
+          "px-4 py-2 h-10": !e.disableStyle && e.size === i(l).DEFAULT,
+          // Border
+          border: e.isOutline,
+          // Shape
+          "rounded-full": e.shape === i(d).CIRCLE,
+          "input-roundness": e.shape === i(d).ROUNDED,
+          // Cursor
+          "cursor-pointer": !e.isDisabled,
+          "cursor-not-allowed": e.isDisabled,
+          // Default color
+          "border-caipira-primary-inverted fill-caipira-primary-inverted": e.variant === i(r).DEFAULT,
+          "bg-transparent color-caipira-primary-inverted hover:bg-caipira-primary-inverted hover:color-caipira-primary hover:fill-white": e.variant === i(r).DEFAULT && e.isOutline,
+          "bg-caipira-primary-inverted color-caipira-primary": e.variant === i(r).DEFAULT && !e.isOutline,
+          // Primary color
+          "fill-caipira-primary": e.variant === i(r).PRIMARY,
+          "bg-transparent border-caipira-blue color-caipira-blue hover:bg-caipira-blue hover:color-caipira-primary hover:fill-white": e.variant === i(r).PRIMARY && e.isOutline,
+          "bg-caipira-blue color-caipira-primary": e.variant === i(r).PRIMARY && !e.isOutline,
+          // Success color
+          "fill-caipira-green": e.variant === i(r).SUCCESS,
+          "bg-transparent border-caipira-green color-caipira-green hover:bg-caipira-green hover:color-caipira-primary hover:fill-white": e.variant === i(r).SUCCESS && e.isOutline,
+          "bg-caipira-green color-caipira-primary": e.variant === i(r).SUCCESS && !e.isOutline,
+          // Warning color
+          "fill-caipira-yellow": e.variant === i(r).WARNING,
+          "bg-transparent border-caipira-yellow color-caipira-yellow hover:bg-caipira-yellow hover:color-caipira-primary hover:fill-white": e.variant === i(r).WARNING && e.isOutline,
+          "bg-caipira-yellow color-caipira-primary": e.variant === i(r).WARNING && !e.isOutline,
+          // Danger color
+          "fill-caipira-red": e.variant === i(r).DANGER,
+          "bg-transparent border-caipira-red color-caipira-red hover:bg-caipira-red hover:color-caipira-primary hover:fill-white": e.variant === i(r).DANGER && e.isOutline,
+          "bg-caipira-red color-caipira-primary": e.variant === i(r).DANGER && !e.isOutline,
+          // Transparent color
+          "transparent-button": e.variant === i(r).TRANSPARENT
+        }, "input-outline inline-flex items-center"]),
+        role: "button",
+        onClick: C
+      }, {
+        default: B(() => [
+          k(t.$slots, "default", {}, void 0, !0),
+          e.icon ? (s(), m(n, {
+            key: 0,
+            ref_key: "iconReference",
+            ref: v,
+            size: e.size,
+            icon: e.icon,
+            "is-outline": e.isOutline,
+            class: c({
+              [e.injectStyle.icon]: !0
+            })
+          }, null, 8, ["size", "icon", "is-outline", "class"])) : u("", !0),
+          e.label && e.type !== i(a).SUBMIT ? (s(), b("span", {
+            key: 1,
+            class: c([{
+              "ml-2": !!e.icon,
+              "text-lg": e.size === i(l).LARGE,
+              "text-sm": e.size === i(l).SMALL,
+              "text-xs": e.size === i(l).EXTRA_SMALL
+            }, "whitespace-nowrap"])
+          }, z(e.label), 3)) : u("", !0),
+          e.type === "file" ? (s(), b("input", {
+            key: 2,
+            multiple: e.multiple,
+            onChange: I,
+            type: "file",
+            ref_key: "fileInput",
+            ref: f,
+            class: "hidden"
+          }, null, 40, x)) : u("", !0)
+        ]),
+        _: 3
+      }, 8, ["type", "href", "value", "to", "disabled", "target", "class"]);
+    };
+  }
+});
+export {
+  K as _
+};

package/dist/ButtonCopy.js

@@ -0,0 +1,6 @@
+import { _ as p } from "./ButtonCopy.vue_vue_type_script_setup_true_lang-C8Ndx2n_.js";
+import { p as n } from "./plugin-APHHlXVq.js";
+export {
+  p as ButtonCopy,
+  n as ButtonCopyPlugin
+};

package/dist/ButtonCopy.vue_vue_type_script_setup_true_lang-C8Ndx2n_.js

@@ -0,0 +1,43 @@
+import { defineComponent as l, ref as c, resolveComponent as u, openBlock as f, createBlock as y } from "vue";
+import { g as p } from "./index-CVD_wAsU.js";
+import "./Button.vue_vue_type_style_index_0_scoped_5056001e_lang-DmQxrvfv.js";
+const d = async (o) => {
+  navigator.clipboard && await navigator.clipboard.writeText(o);
+}, x = /* @__PURE__ */ l({
+  name: "TButtonCopy",
+  __name: "ButtonCopy",
+  props: {
+    text: {},
+    isDisabled: { type: Boolean, default: !1 }
+  },
+  setup(o) {
+    const a = c(null), n = c(!1), e = o, r = async (s) => {
+      n.value = !0, s.stopPropagation();
+      const i = typeof e.text == "function" ? await e.text() : e.text, t = a.value?.iconReference?.reference;
+      await d(i), t && p.to(t, {
+        scale: 4,
+        yoyo: !0,
+        opacity: 0,
+        duration: 0.2,
+        ease: "power3.easeInOut",
+        onComplete: () => {
+          p.set(t, { opacity: 1, scale: 1 });
+        }
+      }), n.value = !1;
+    };
+    return (s, i) => {
+      const t = u("t-icon-button");
+      return f(), y(t, {
+        "is-disabled": n.value || e.isDisabled,
+        icon: "copy",
+        size: "xs",
+        ref_key: "buttonRef",
+        ref: a,
+        onClick: r
+      }, null, 8, ["is-disabled"]);
+    };
+  }
+});
+export {
+  x as _
+};

package/dist/Drawer-DH5EEenO.js

@@ -0,0 +1,74 @@
+import './Drawer.css';
+import { defineComponent as _, ref as y, onMounted as v, resolveComponent as b, openBlock as o, createElementBlock as t, withKeys as h, createVNode as i, createElementVNode as a, normalizeClass as c, renderSlot as l, toDisplayString as w, createCommentVNode as d } from "vue";
+import { _ as k } from "./Backdrop.vue_vue_type_script_setup_true_lang-OaEBTmYK.js";
+import { _ as x } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+const C = {
+  key: 0,
+  class: "flex justify-between items-center p-4 border-b border-color"
+}, $ = { key: 0 }, g = {
+  key: 1,
+  class: "inline-block text-base"
+}, D = { class: "flex flex-col flex-1 relative overflow-y-auto scrollbar" }, z = /* @__PURE__ */ _({
+  name: "TDrawer",
+  __name: "Drawer",
+  props: {
+    title: { default: "" },
+    style: { default: () => ({
+      footer: ""
+    }) },
+    direction: { default: "rtl" },
+    showHeader: { type: Boolean, default: !0 }
+  },
+  emits: ["closed"],
+  setup(f, { emit: m }) {
+    const r = f, p = m, n = y(null), s = (e) => {
+      e.stopPropagation(), p("closed");
+    };
+    return v(() => {
+      n.value?.focus();
+    }), (e, B) => {
+      const u = b("t-icon");
+      return o(), t("div", {
+        class: "fixed inset-0 flex items-center z-10",
+        tabindex: "0",
+        ref_key: "modal",
+        ref: n,
+        onKeyup: h(s, ["esc"])
+      }, [
+        i(k, { onClick: s }),
+        a("div", {
+          class: c(["w-[38rem] absolute inset-y-0 z-20 flex flex-col bg-caipira-primary drawer", {
+            "right-0 drop-shadow-lg": r.direction === "ltr",
+            "left-0": r.direction === "rtl"
+          }])
+        }, [
+          r.showHeader ? (o(), t("div", C, [
+            e.$slots.header ? (o(), t("div", $, [
+              l(e.$slots, "header", {}, void 0, !0)
+            ])) : (o(), t("span", g, w(r.title), 1)),
+            i(u, {
+              icon: "close",
+              role: "button",
+              onClick: s,
+              size: "sm"
+            })
+          ])) : d("", !0),
+          a("div", D, [
+            l(e.$slots, "default", {}, void 0, !0)
+          ]),
+          e.$slots.footer ? (o(), t("div", {
+            key: 1,
+            class: c(["p-4 border-t border-color", {
+              [e.style.footer]: !0
+            }])
+          }, [
+            l(e.$slots, "footer", {}, void 0, !0)
+          ], 2)) : d("", !0)
+        ], 2)
+      ], 544);
+    };
+  }
+}), H = /* @__PURE__ */ x(z, [["__scopeId", "data-v-921c45c2"]]);
+export {
+  H as D
+};

package/dist/Drawer.js

@@ -0,0 +1,6 @@
+import { D as e } from "./Drawer-DH5EEenO.js";
+import { p } from "./plugin-BC-6G-0o.js";
+export {
+  e as Drawer,
+  p as DrawerPlugin
+};

package/dist/Dropdown.js

@@ -0,0 +1,6 @@
+import { _ as p } from "./Dropdown.vue_vue_type_script_setup_true_lang-CJ6tMLP5.js";
+import { p as a } from "./plugin-turENJ3j.js";
+export {
+  p as Dropdown,
+  a as DropdownPlugin
+};

package/dist/Dropdown.vue_vue_type_script_setup_true_lang-CJ6tMLP5.js

@@ -0,0 +1,135 @@
+import { defineComponent as T, ref as h, resolveComponent as z, openBlock as r, createElementBlock as a, normalizeClass as w, Fragment as R, renderList as A, toDisplayString as P, withKeys as L, renderSlot as N, normalizeProps as V, mergeProps as E, createBlock as G, createCommentVNode as $, createTextVNode as I } from "vue";
+const O = ["aria-selected", "onKeydown", "onClick"], F = {
+  key: 1,
+  class: "inline-flex items-center input-label"
+}, j = /* @__PURE__ */ T({
+  name: "TDropdown",
+  __name: "Dropdown",
+  props: {
+    items: { default: () => [] },
+    owner: {},
+    multiple: { type: Boolean, default: !1 },
+    isVisible: { type: Boolean, default: !1 },
+    optionMarginClass: { default: "" },
+    optionPaddingClass: { default: "py-2 px-2" },
+    optionRoundnessClass: { default: "" },
+    wrapperRoundnessClass: { default: "rounded-md" },
+    wrapperPaddingClass: { default: "" }
+  },
+  emits: ["change", "end-reached", "created"],
+  setup(H, { expose: D, emit: S }) {
+    const s = H, C = S, i = h(-1), b = h(null), u = h([]), d = h("keyboard"), y = (o = i.value, t = s.items[o], n = void 0) => {
+      n?.stopPropagation(), C("change", {
+        index: o,
+        option: t,
+        hold: n?.ctrlKey ?? !1
+      }), t.action && t.action();
+    }, B = (o) => {
+      if (!s.isVisible)
+        return !1;
+      switch (o.preventDefault(), d.value = "keyboard", o.key) {
+        case "ArrowUp":
+        case "ArrowDown":
+          return x(o);
+        case "Enter":
+          return y();
+      }
+    }, x = (o) => {
+      const t = o.key === "ArrowDown", n = s.items.length;
+      let e = i.value;
+      const l = () => s.items[e] ? "isGroupLabel" in s.items[e] && s.items[e].isGroupLabel : !1, f = () => {
+        e === n - 1 ? e = 0 : e++;
+      }, M = () => {
+        e === 0 ? e = n - 1 : e--;
+      };
+      if (t)
+        do
+          f();
+        while (l());
+      else
+        do
+          M();
+        while (l());
+      e > -1 && e < n && (i.value = e);
+      const v = b.value, k = u.value[i.value], p = k.offsetTop, m = k.offsetHeight, _ = v.offsetHeight, c = v.scrollTop;
+      let g = 0;
+      if (k.focus(), p === 0 || c === 0)
+        g = p - _ + m;
+      else if (t && p + m > _ + c)
+        g = c + m;
+      else if (!t && p < c)
+        g = c - m;
+      else
+        return !0;
+      return v.scroll({ top: g }), !0;
+    }, K = (o) => {
+      const t = o.target, n = u.value[0];
+      !t || !n || t.scrollTop + t.clientHeight + n.offsetHeight >= t.scrollHeight && C("end-reached");
+    };
+    return D({ move: x }), (o, t) => {
+      const n = z("t-icon");
+      return r(), a("ul", {
+        ref_key: "listRef",
+        ref: b,
+        role: "listbox",
+        class: w(["text-left max-h-60 min-w-[12rem] z-10 overflow-y-auto scrollbar select-none floatable", [s.wrapperRoundnessClass, s.wrapperPaddingClass]]),
+        onScrollend: K,
+        onMousemove: t[0] || (t[0] = () => d.value = "mouse"),
+        onKeydown: B
+      }, [
+        o.items.length === 0 ? (r(), a("li", {
+          key: 0,
+          role: "option",
+          "aria-disabled": "true",
+          class: w(["whitespace-nowrap text-gray-400", [
+            s.optionPaddingClass,
+            s.optionMarginClass,
+            s.optionRoundnessClass
+          ]])
+        }, " Nothing here ", 2)) : (r(!0), a(R, { key: 1 }, A(o.items, (e, l) => (r(), a(R, { key: l }, [
+          e.isGroupLabel ? (r(), a("li", {
+            key: 0,
+            class: w(["text-xs font-bold tracking-wider text-neutral-600", [
+              s.optionPaddingClass,
+              s.optionMarginClass,
+              s.optionRoundnessClass
+            ]]),
+            ref_for: !0,
+            ref_key: "itemRefs",
+            ref: u
+          }, P(e.label), 3)) : (r(), a("li", {
+            key: 1,
+            class: w([{
+              "bg-hover": l === i.value && d.value === "keyboard",
+              "hover:bg-hover": d.value === "mouse",
+              [s.optionMarginClass]: !0,
+              [s.optionPaddingClass]: !0,
+              [s.optionRoundnessClass]: !0
+            }, "flex text-base cursor-pointer whitespace-nowrap items-center focus-visible:outline-none"]),
+            role: "option",
+            ref_for: !0,
+            ref_key: "itemRefs",
+            ref: u,
+            tabindex: 0,
+            "aria-selected": l === i.value,
+            onKeydown: L((f) => y(l, e), ["enter"]),
+            onClick: (f) => y(l, e, f)
+          }, [
+            o.$slots.default ? N(o.$slots, "default", V(E({ key: 0 }, e))) : (r(), a("div", F, [
+              e.icon ? (r(), G(n, {
+                key: 0,
+                icon: e.icon,
+                class: "mr-2",
+                size: "xs"
+              }, null, 8, ["icon"])) : $("", !0),
+              I(" " + P(e.label), 1)
+            ]))
+          ], 42, O))
+        ], 64))), 128))
+      ], 34);
+    };
+  }
+});
+export {
+  j as _
+};

package/dist/FileDrop.js

@@ -0,0 +1,6 @@
+import { _ as p } from "./FileDrop.vue_vue_type_script_setup_true_lang-Cmrpt2_c.js";
+import { p as i } from "./plugin-DDPcV7Fj.js";
+export {
+  p as FileDrop,
+  i as FileDropPlugin
+};

package/dist/FileDrop.vue_vue_type_script_setup_true_lang-Cmrpt2_c.js

@@ -0,0 +1,86 @@
+import { defineComponent as b, ref as k, inject as C, computed as i, resolveComponent as F, openBlock as o, createElementBlock as s, normalizeClass as c, unref as V, createElementVNode as e, Fragment as z, renderList as N, toDisplayString as u, createVNode as d, createTextVNode as j } from "vue";
+const w = { class: "flex items-center justify-center w-full" }, D = {
+  for: "dropzone-file",
+  class: "flex flex-col items-center justify-center w-full h-full cursor-pointer border input-border border-dashed input-roundness input-text-color input-bg-color hover:bg-caipira-secondary"
+}, G = {
+  key: 0,
+  class: "my-5"
+}, S = { class: "text-xs" }, B = {
+  key: 1,
+  class: "flex items-center justify-evenly my-4 w-full"
+}, P = { class: "text-center" }, E = /* @__PURE__ */ e("p", { class: "mb-2 text-sm text-gray-500 dark:text-gray-400" }, [
+  /* @__PURE__ */ e("span", { class: "font-semibold" }, "Click to upload"),
+  /* @__PURE__ */ j(" or drag and drop ")
+], -1), T = { class: "text-xs text-gray-500 dark:text-gray-400" }, A = ["multiple"], J = /* @__PURE__ */ b({
+  name: "TFileDrop",
+  __name: "FileDrop",
+  props: {
+    types: {},
+    multiple: { type: Boolean, default: !0 },
+    modelValue: { default: () => [] }
+  },
+  emits: ["update:modelValue"],
+  setup(p, { emit: m }) {
+    const r = p, f = m, a = k([]), _ = C("formStyle", { label: "", input: "" }), y = i(() => r.modelValue.length > 0), h = i(() => {
+      switch (r.types) {
+        default:
+          return "SVG, PNG, JPG or GIF";
+      }
+    }), x = (l) => {
+    }, g = (l) => {
+      l.stopPropagation();
+      const t = l.target.files;
+      !t || !t.length || (a.value = Array.from(t), f("update:modelValue", t));
+    };
+    return (l, v) => {
+      const t = F("t-icon");
+      return o(), s("div", {
+        class: c({ [V(_).input]: !0 })
+      }, [
+        e("div", w, [
+          e("label", D, [
+            y.value ? (o(), s("div", G, [
+              (o(!0), s(z, null, N(a.value, (n) => (o(), s("div", {
+                key: n.name,
+                class: "flex items-center"
+              }, [
+                e("img", {
+                  class: c(["fs mr-1", [n.name.split(".").pop()]])
+                }, null, 2),
+                e("span", S, u(n.name), 1),
+                d(t, {
+                  icon: "close",
+                  class: "ml-2 text-red-400",
+                  size: "sm",
+                  role: "button",
+                  onClick: () => x(n.name)
+                }, null, 8, ["onClick"])
+              ]))), 128))
+            ])) : (o(), s("div", B, [
+              d(t, {
+                class: "dark:fill-gray-400",
+                icon: "upload",
+                role: "button",
+                size: "lg"
+              }),
+              e("div", P, [
+                E,
+                e("p", T, u(h.value), 1)
+              ])
+            ])),
+            e("input", {
+              id: "dropzone-file",
+              type: "file",
+              class: "hidden",
+              multiple: l.multiple,
+              onChange: g
+            }, null, 40, A)
+          ])
+        ])
+      ], 2);
+    };
+  }
+});
+export {
+  J as _
+};

package/dist/Form.js

@@ -0,0 +1,6 @@
+import { _ as m } from "./Form.vue_vue_type_script_setup_true_lang-CgTo7ahn.js";
+import { p as a } from "./plugin-DSCBycRO.js";
+export {
+  m as Form,
+  a as FormPlugin
+};