vlite3 0.1.0 → 0.1.2

package/components/ColorPicker/ColorIro.vue.js

@@ -0,0 +1,142 @@
+import { defineComponent as B, defineAsyncComponent as E, ref as h, computed as C, watch as u, onMounted as H, onUnmounted as _, openBlock as i, createElementBlock as g, createVNode as P, unref as c, createBlock as x, createCommentVNode as d, createElementVNode as T, normalizeClass as N, nextTick as R } from "vue";
+import n from "@jaames/iro";
+import { useEyeDropper as V } from "@vueuse/core";
+const D = { class: "space-y-3" }, $ = {
+  key: 0,
+  class: "flex gap-2 mb-2.5 -text-fs-3 pr-0.5"
+}, M = /* @__PURE__ */ B({
+  __name: "ColorIro",
+  props: {
+    color: {},
+    showHeader: { type: Boolean, default: !0 },
+    size: { default: "md" }
+  },
+  emits: ["update:color", "close"],
+  setup(l, { emit: b }) {
+    const a = E(() => import("../Button.vue2.js")), t = l, s = b, p = h(), e = h(null), { isSupported: m, open: z, sRGBHex: S } = V(), f = C(() => {
+      switch (t.size) {
+        case "sm":
+          return 140;
+        case "lg":
+          return 170;
+        default:
+          return 162;
+      }
+    }), w = {
+      sm: 120,
+      md: 140,
+      lg: 150
+    }, v = async () => {
+      if (!(!p.value || e.value)) {
+        await R();
+        try {
+          e.value && (e.value.off("color:change"), e.value = null), e.value = n.ColorPicker(p.value, {
+            width: f.value,
+            color: t.color,
+            margin: 9,
+            boxHeight: w[t?.size],
+            // Auto-scale or keep ratio? default is usually width.
+            // Let's rely on default square-ish box unless specified.
+            // But for small size, maybe we want to keep it compact.
+            // iro defaults boxHeight to width if not specified.
+            sliderSize: 14,
+            layout: [
+              {
+                component: n.ui.Box
+              },
+              {
+                component: n.ui.Slider,
+                options: {
+                  sliderType: "hue"
+                }
+              },
+              {
+                component: n.ui.Slider,
+                options: {
+                  sliderType: "saturation"
+                }
+              },
+              {
+                component: n.ui.Slider,
+                options: {
+                  sliderType: "value"
+                }
+              }
+            ]
+          }), e.value.on("color:change", (o) => {
+            s("update:color", o.hexString);
+          });
+        } catch (o) {
+          console.error("Failed to initialize color picker:", o);
+        }
+      }
+    }, k = () => {
+      e.value && (e.value.off("color:change"), e.value = null);
+    };
+    u(
+      () => t.color,
+      (o) => {
+        if (e.value && e.value.color.hexString !== o)
+          try {
+            e.value.color.hexString = o;
+          } catch (r) {
+            console.error("Error updating color:", r);
+          }
+      }
+    ), u(
+      () => t.size,
+      () => {
+        k(), v();
+      }
+    ), u(S, (o) => {
+      if (o && (s("update:color", o), e.value))
+        try {
+          e.value.color.hexString = o;
+        } catch (r) {
+          console.error("Error updating color from eyedropper:", r);
+        }
+    });
+    const y = async () => {
+      try {
+        await z();
+      } catch (o) {
+        console.error("Error opening eyedropper:", o);
+      }
+    };
+    return H(() => {
+      v();
+    }), _(() => {
+      k();
+    }), (o, r) => (i(), g("div", D, [
+      l.showHeader ? (i(), g("div", $, [
+        P(c(a), {
+          icon: "typcn:arrow-back",
+          onClick: r[0] || (r[0] = (A) => s("close")),
+          class: "flex-1 px-2 py-1 bg-background hover:bg-accent rounded text-xs border border-border transition-colors"
+        }),
+        c(m) ? (i(), x(c(a), {
+          key: 0,
+          onClick: y,
+          icon: "pepicons-pop:color-picker",
+          class: "flex-1 px-2 py-1 bg-background hover:bg-accent rounded text-xs border border-border transition-colors"
+        })) : d("", !0)
+      ])) : d("", !0),
+      T("div", {
+        ref_key: "pickerRef",
+        ref: p,
+        class: N(`w-[${f.value}px]`)
+      }, null, 2),
+      c(m) && !l.showHeader ? (i(), x(c(a), {
+        key: 1,
+        onClick: y,
+        icon: "pepicons-pop:color-picker",
+        variant: "outline",
+        size: "xs",
+        class: "w-full"
+      })) : d("", !0)
+    ]));
+  }
+});
+export {
+  M as default
+};

package/components/ColorPicker/ColorIro.vue3.js

@@ -0,0 +1,5 @@
+import o from "./ColorIro.vue.js";
+/* empty css              */
+export {
+  o as default
+};

package/components/ColorPicker/ColorPicker.vue.d.ts

@@ -0,0 +1,22 @@
+import { TooltTipPlacement } from 'v-tooltip-lite/types';
+import { ButtonProps } from '../../types';
+interface Props {
+    modelValue?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    position?: TooltTipPlacement;
+    btnProps?: ButtonProps;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: string) => any;
+    change: (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: (value: string) => any;
+    onChange?: (value: string) => any;
+}>, {
+    disabled: boolean;
+    size: "sm" | "md" | "lg";
+    modelValue: string;
+    position: TooltTipPlacement;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/components/ColorPicker/ColorPicker.vue.js

@@ -0,0 +1,56 @@
+import { defineComponent as n, openBlock as d, createBlock as r, unref as c, withCtx as l, createElementVNode as m, createVNode as a, mergeProps as u } from "vue";
+import f from "../Dropdown/Dropdown.vue.js";
+import "@iconify/vue";
+import p from "../Button.vue.js";
+import h from "./ColorIro.vue.js";
+/* empty css              */
+const b = { class: "p-1.5" }, w = /* @__PURE__ */ n({
+  __name: "ColorPicker",
+  props: {
+    modelValue: { default: "#000000" },
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    position: { default: "bottom" },
+    btnProps: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: s }) {
+    const t = s, i = (o) => {
+      t("update:modelValue", o), t("change", o);
+    };
+    return (o, g) => (d(), r(c(f), {
+      disabled: e.disabled,
+      class: "w-auto",
+      position: e.position,
+      offset: [0, 8],
+      searchable: !1,
+      "close-on-select": !1
+    }, {
+      trigger: l(({ isOpen: V }) => [
+        a(p, u({
+          style: { backgroundColor: e.modelValue }
+        }, {
+          rounded: "full",
+          size: "xs",
+          icon: " ",
+          variant: "outline",
+          ...e.btnProps || {}
+        }), null, 16, ["style"])
+      ]),
+      default: l(() => [
+        m("div", b, [
+          a(h, {
+            color: e.modelValue,
+            "show-header": !1,
+            size: e.size,
+            "onUpdate:color": i
+          }, null, 8, ["color", "size"])
+        ])
+      ]),
+      _: 1
+    }, 8, ["disabled", "position"]));
+  }
+});
+export {
+  w as default
+};

package/components/ColorPicker/ColorPicker.vue2.js

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

package/components/ConfirmationModal.vue.d.ts

@@ -0,0 +1,39 @@
+interface Props {
+    show?: boolean;
+    title: string;
+    description: string;
+    loading?: boolean;
+    confirmText?: string;
+    cancelText?: string;
+    variant?: 'danger' | 'primary' | 'warning' | 'success' | 'info';
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    cancel: () => any;
+    confirm: () => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onCancel?: () => any;
+    onConfirm?: () => any;
+}>, {
+    variant: "danger" | "primary" | "warning" | "success" | "info";
+    loading: boolean;
+    show: boolean;
+    confirmText: string;
+    cancelText: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/ConfirmationModal.vue.js

@@ -0,0 +1,55 @@
+import { defineComponent as f, openBlock as m, createBlock as u, withCtx as a, createElementVNode as x, createVNode as d, renderSlot as r } from "vue";
+import g from "./Modal.vue.js";
+import s from "./Button.vue.js";
+const w = { class: "flex w-full items-center justify-end space-x-2 pt-4" }, p = /* @__PURE__ */ f({
+  __name: "ConfirmationModal",
+  props: {
+    show: { type: Boolean, default: !1 },
+    title: {},
+    description: {},
+    loading: { type: Boolean, default: !1 },
+    confirmText: { default: "Delete" },
+    cancelText: { default: "Cancel" },
+    variant: { default: "danger" }
+  },
+  emits: ["cancel", "confirm"],
+  setup(e, { emit: c }) {
+    const i = c, n = () => {
+      i("cancel");
+    };
+    return (l, t) => (m(), u(g, {
+      show: e.show,
+      title: e.title,
+      description: e.description,
+      "max-width": "max-w-[400px]",
+      onClose: n,
+      "onUpdate:show": t[1] || (t[1] = (o) => !o && n())
+    }, {
+      trigger: a(() => [
+        r(l.$slots, "trigger", {}, () => [
+          r(l.$slots, "default")
+        ])
+      ]),
+      default: a(() => [
+        x("div", w, [
+          d(s, {
+            variant: "outline",
+            text: e.cancelText,
+            disabled: e.loading,
+            onClick: n
+          }, null, 8, ["text", "disabled"]),
+          d(s, {
+            variant: e.variant,
+            text: e.confirmText,
+            loading: e.loading,
+            onClick: t[0] || (t[0] = (o) => i("confirm"))
+          }, null, 8, ["variant", "text", "loading"])
+        ])
+      ]),
+      _: 3
+    }, 8, ["show", "title", "description"]));
+  }
+});
+export {
+  p as default
+};

package/components/ConfirmationModal.vue2.js

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

package/components/DataTable/DataTable.vue.d.ts

@@ -0,0 +1,60 @@
+import { DataTableProps, SelectionState, RowClickPayload, TableState } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: Partial<Record<string, (_: {
+        value: any;
+        row: any;
+        index: number;
+        field: string;
+    }) => any>> & {
+        'toolbar-left'?(_: {}): any;
+        'toolbar-right'?(_: {}): any;
+        'empty-description'?(_: {}): any;
+        'empty-action'?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<DataTableProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    select: (state: SelectionState) => any;
+    change: (state: TableState) => any;
+    delete: (rows: any[]) => any;
+    "update:itemsPerPage": (value: number) => any;
+    rowClick: (payload: RowClickPayload) => any;
+    "update:selectedRows": (value: any[]) => any;
+}, string, import('vue').PublicProps, Readonly<DataTableProps> & Readonly<{
+    onSelect?: (state: SelectionState) => any;
+    onChange?: (state: TableState) => any;
+    onDelete?: (rows: any[]) => any;
+    "onUpdate:itemsPerPage"?: (value: number) => any;
+    onRowClick?: (payload: RowClickPayload) => any;
+    "onUpdate:selectedRows"?: (value: any[]) => any;
+}>, {
+    search: string;
+    loading: boolean;
+    rows: any[];
+    selectable: boolean;
+    emptyMessage: string;
+    showSearch: boolean;
+    showItemsPerPage: boolean;
+    itemsPerPage: number;
+    itemsPerPageOptions: number[];
+    compact: boolean;
+    headers: import('./types').TableHeader[];
+    keyField: string;
+    hoverable: boolean;
+    striped: boolean;
+    selectedRows: any[];
+    searchPlaceholder: string;
+    emptyIcon: string;
+    showPagination: boolean;
+    bordered: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/components/DataTable/DataTable.vue.js

@@ -0,0 +1,7 @@
+import a from "./DataTable.vue2.js";
+/* empty css               */
+import o from "../../_virtual/_plugin-vue_export-helper.js";
+const m = /* @__PURE__ */ o(a, [["__scopeId", "data-v-45a246be"]]);
+export {
+  m as default
+};