@indielayer/ui 0.0.0-dev-20240125104319

package/lib/components/select/Select.vue.d.ts

@@ -0,0 +1,150 @@
+import { type PropType, type ExtractPublicPropTypes, type Ref } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
+declare const selectProps: {
+    placeholder: StringConstructor;
+    options: PropType<SelectOption[]>;
+    multiple: BooleanConstructor;
+    flat: BooleanConstructor;
+    native: BooleanConstructor;
+    modelValue: PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+};
+export type SelectOption = {
+    value: number | string;
+    label: string;
+    disabled?: boolean;
+};
+export type SelectProps = ExtractPublicPropTypes<typeof selectProps>;
+type InternalClasses = 'wrapper' | 'box' | 'content' | 'iconWrapper' | 'icon';
+type InternalExtraData = {
+    errorInternal: Ref<boolean>;
+};
+export interface SelectTheme extends ThemeComponent<SelectProps, InternalClasses, InternalExtraData> {
+}
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    placeholder: StringConstructor;
+    options: PropType<SelectOption[]>;
+    multiple: BooleanConstructor;
+    flat: BooleanConstructor;
+    native: BooleanConstructor;
+    modelValue: PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+}, {
+    focus: () => void | undefined;
+    blur: () => void | undefined;
+    reset: () => void;
+    validate: (val?: any) => boolean;
+    setError: (val: string) => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, string[], string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    placeholder: StringConstructor;
+    options: PropType<SelectOption[]>;
+    multiple: BooleanConstructor;
+    flat: BooleanConstructor;
+    native: BooleanConstructor;
+    modelValue: PropType<string | number | boolean | object | any[] | undefined>;
+    id: StringConstructor;
+    name: StringConstructor;
+    readonly: BooleanConstructor;
+    required: BooleanConstructor;
+    validateOnInput: {
+        readonly type: BooleanConstructor;
+        readonly default: true;
+    };
+    label: StringConstructor;
+    helper: StringConstructor;
+    error: StringConstructor;
+    hideFooter: BooleanConstructor;
+    rules: {
+        readonly type: ArrayConstructor;
+        readonly default: () => never[];
+    };
+    disabled: BooleanConstructor;
+    loading: BooleanConstructor;
+    loadingLabel: StringConstructor;
+    loadingStatus: {
+        readonly type: PropType<import("../loader/Loader.vue").LoaderStatus>;
+        readonly default: "active";
+    };
+    size: {
+        readonly type: PropType<import("../../composables/useCommon").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+}>> & {
+    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    flat: boolean;
+    size: import("../../composables/useCommon").Size;
+    loading: boolean;
+    loadingStatus: import("../loader/Loader.vue").LoaderStatus;
+    readonly: boolean;
+    required: boolean;
+    validateOnInput: boolean;
+    hideFooter: boolean;
+    rules: unknown[];
+    multiple: boolean;
+    native: boolean;
+}, {}>, {
+    icon?(_: {}): any;
+}>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/select/Select.vue.js

@@ -0,0 +1,346 @@
+import { defineComponent as ve, ref as A, computed as I, watch as N, nextTick as X, unref as s, openBlock as a, createBlock as c, mergeProps as x, toHandlers as H, withCtx as b, createElementVNode as E, createElementBlock as o, normalizeClass as R, Fragment as p, renderList as z, createTextVNode as C, toDisplayString as m, createVNode as K, withDirectives as pe, vModelSelect as ce, renderSlot as me, createCommentVNode as ye } from "vue";
+import { useEventListener as he } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.9/node_modules/@vueuse/core/index.js";
+import { useCommon as G } from "../../composables/useCommon.js";
+import { useInputtable as O } from "../../composables/useInputtable.js";
+import { useInteractive as J } from "../../composables/useInteractive.js";
+import { useTheme as be } from "../../composables/useTheme.js";
+import { checkIcon as ke, chevronDownIcon as ge } from "../../common/icons.js";
+import we from "../label/Label.vue.js";
+import W from "../tag/Tag.vue.js";
+import Ae from "../icon/Icon.vue.js";
+import Ie from "../menu/MenuItem.vue.js";
+import Re from "../spinner/Spinner.vue.js";
+import Ve from "../popover/Popover.vue.js";
+import "../popover/Popover.vue2.js";
+import _e from "../popover/PopoverContainer.vue.js";
+import $e from "../inputFooter/InputFooter.vue.js";
+const Ee = { class: "relative" }, ze = {
+  key: 0,
+  class: "flex gap-1 flex-wrap"
+}, Ce = {
+  key: 0,
+  class: "text-gray-400 dark:text-gray-500"
+}, Se = { key: 1 }, De = {
+  key: 0,
+  class: "flex gap-1 flex-wrap"
+}, Ne = {
+  key: 0,
+  class: "text-gray-400 dark:text-gray-500"
+}, Oe = { key: 1 }, Le = {
+  key: 1,
+  class: "px-2 text-center text-gray-400"
+}, Be = ["id", "name", "disabled", "multiple", "readonly"], Te = ["value", "disabled"], Fe = {
+  ...G.props(),
+  ...J.props(),
+  ...O.props(),
+  placeholder: String,
+  options: Array,
+  multiple: Boolean,
+  flat: Boolean,
+  native: Boolean
+}, Pe = {
+  name: "XSelect",
+  validators: {
+    ...G.validators()
+  }
+}, il = /* @__PURE__ */ ve({
+  ...Pe,
+  props: Fe,
+  emits: O.emits(),
+  setup(Q, { expose: Y, emit: Z }) {
+    const r = Q, V = Z, k = A(null), S = A(null), _ = A(null), f = A(null), u = A(), t = I({
+      get() {
+        return r.multiple ? r.modelValue ? Array.isArray(r.modelValue) ? r.modelValue : [r.modelValue] : [] : r.modelValue;
+      },
+      set(e) {
+        V("update:modelValue", e);
+      }
+    }), d = I(() => !r.options || r.options.length === 0 ? [] : r.options.map((e) => {
+      let i = !1;
+      return r.multiple && Array.isArray(t.value) ? i = t.value.includes(e.value) : i = e.value === t.value, {
+        value: e.value,
+        label: e.label,
+        active: i,
+        disabled: e.disabled,
+        iconRight: i ? ke : void 0,
+        onClick: () => T(e.value)
+      };
+    })), L = I(() => {
+      var e;
+      return (e = r.options) == null ? void 0 : e.filter((i) => !i.disabled);
+    }), y = I(() => {
+      var e;
+      return (e = f.value) == null ? void 0 : e.isOpen;
+    });
+    N(y, (e) => {
+      e && (ee(), setTimeout(() => {
+        B(u.value || 0);
+      }, 50), (r.multiple || typeof u.value > "u") && D(-1));
+    });
+    function ee() {
+      if (r.multiple) {
+        if (Array.isArray(t.value) && t.value.length > 0) {
+          const e = d.value.findIndex((i) => i.value === t.value[0]);
+          e !== -1 && (u.value = e);
+        }
+      } else {
+        const e = d.value.findIndex((i) => i.value === t.value);
+        e !== -1 && (u.value = e);
+      }
+    }
+    function B(e) {
+      var i;
+      _.value && ((i = _.value[e]) == null || i.$el.scrollIntoView({ block: "nearest", inline: "nearest" }));
+    }
+    N(u, (e) => {
+      typeof e < "u" && _.value && B(e);
+    });
+    function D(e, i = "down") {
+      if (!L.value || L.value.length === 0) {
+        u.value = void 0;
+        return;
+      }
+      if (typeof e > "u" && (e = i === "down" ? -1 : 1), i === "down") {
+        let l = e + 1;
+        for (l > d.value.length - 1 && (l = 0); d.value[l].disabled; )
+          ++l > d.value.length - 1 && (l = 0);
+        u.value = l;
+      } else {
+        let l = e - 1;
+        for (l < 0 && (l = d.value.length - 1); d.value[l].disabled; )
+          --l < 0 && (l = d.value.length - 1);
+        u.value = l;
+      }
+    }
+    function T(e) {
+      var l;
+      const i = (l = r.options) == null ? void 0 : l.find((n) => n.value === e);
+      if (!(!i || i.disabled)) {
+        if (r.multiple)
+          if (Array.isArray(t.value)) {
+            const n = t.value.indexOf(e);
+            n !== -1 ? t.value.splice(n, 1) : (t.value.push(e), V("update:modelValue", t.value));
+          } else
+            t.value = [e];
+        else
+          t.value = e;
+        r.native || X(() => {
+          var n, v, w;
+          (n = k.value) == null || n.dispatchEvent(new Event("input")), (v = k.value) == null || v.dispatchEvent(new Event("change")), (w = S.value) == null || w.$el.focus();
+        });
+      }
+    }
+    function F(e) {
+      return !!(typeof e > "u" || e === null || e === "" || Array.isArray(e) && e.length === 0 || !Array.isArray(e) && typeof e == "object" && Object.keys(e).length === 0);
+    }
+    function P(e, i) {
+      e.stopPropagation();
+      const l = t.value.indexOf(i);
+      l !== -1 && (t.value.splice(l, 1), V("update:modelValue", t.value));
+    }
+    function $(e) {
+      var l;
+      const i = (l = r.options) == null ? void 0 : l.find((n) => n.value === e);
+      return i ? i.label : "";
+    }
+    const { focus: q, blur: le } = J(k), {
+      errorInternal: j,
+      hideFooterInternal: ie,
+      inputListeners: M,
+      reset: te,
+      validate: ne,
+      setError: ae,
+      isFocused: re,
+      isInsideForm: oe
+    } = O(r, { focus: q, emit: V, withListeners: !0 }), se = I(() => {
+      const { focus: e, blur: i } = s(M);
+      return {
+        focus: e,
+        blur: i
+      };
+    });
+    let g = null;
+    N([re, y], ([e, i]) => {
+      e || i ? g || (g = he(document, "keydown", ue)) : g && (g(), g = null);
+    }, {
+      immediate: !0
+    });
+    function ue(e) {
+      var i, l, n, v, w;
+      if (d.value.length !== 0)
+        if (e.code === "ArrowDown") {
+          if (e.preventDefault(), !y.value) {
+            (i = f.value) == null || i.show();
+            return;
+          }
+          D(u.value, "down");
+        } else if (e.code === "ArrowUp") {
+          if (e.preventDefault(), !y.value) {
+            (l = f.value) == null || l.show();
+            return;
+          }
+          D(u.value, "up");
+        } else if (e.code === "Enter" || e.code === "Space") {
+          if (e.preventDefault(), e.stopPropagation(), !y.value) {
+            (n = f.value) == null || n.show();
+            return;
+          }
+          typeof u.value < "u" && (T(d.value[u.value].value), r.multiple || (v = f.value) == null || v.hide());
+        } else
+          e.code === "Tab" && y.value && (e.preventDefault(), (w = f.value) == null || w.hide(), r.native || X(() => {
+            var U;
+            (U = S.value) == null || U.$el.focus();
+          }));
+    }
+    const { styles: de, classes: h, className: fe } = be("Select", {}, r, { errorInternal: j });
+    return Y({ focus: q, blur: le, reset: te, validate: ne, setError: ae }), (e, i) => (a(), c(we, x({
+      ref_key: "labelRef",
+      ref: S,
+      tabindex: "0",
+      class: ["group", [
+        s(fe),
+        s(h).wrapper
+      ]],
+      style: s(de),
+      disabled: e.disabled,
+      required: e.required,
+      "is-inside-form": s(oe),
+      label: e.label
+    }, H(se.value)), {
+      default: b(() => [
+        E("div", Ee, [
+          e.native && !e.multiple ? (a(), o("div", {
+            key: 0,
+            class: R(s(h).box),
+            onClick: i[0] || (i[0] = (l) => {
+              var n;
+              return (n = k.value) == null ? void 0 : n.click();
+            })
+          }, [
+            e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (a(), o("div", ze, [
+              (a(!0), o(p, null, z(t.value, (l) => (a(), c(W, {
+                key: l,
+                size: "sm",
+                removable: "",
+                onRemove: (n) => {
+                  P(n, l);
+                }
+              }, {
+                default: b(() => [
+                  C(m($(l)), 1)
+                ]),
+                _: 2
+              }, 1032, ["onRemove"]))), 128))
+            ])) : !e.multiple && !F(t.value) ? (a(), o(p, { key: 1 }, [
+              C(m($(t.value)), 1)
+            ], 64)) : (a(), o(p, { key: 2 }, [
+              e.placeholder ? (a(), o("div", Ce, m(e.placeholder), 1)) : (a(), o("div", Se, " "))
+            ], 64))
+          ], 2)) : (a(), c(Ve, {
+            key: 1,
+            ref_key: "popoverRef",
+            ref: f,
+            block: "",
+            disabled: e.disabled || e.loading || e.readonly,
+            "dismiss-on-click": !e.multiple,
+            align: "left"
+          }, {
+            content: b(() => [
+              K(_e, {
+                class: R(s(h).content)
+              }, {
+                default: b(() => [
+                  d.value.length > 0 ? (a(!0), o(p, { key: 0 }, z(d.value, (l, n) => (a(), c(Ie, {
+                    key: n,
+                    ref_for: !0,
+                    ref_key: "itemsRef",
+                    ref: _,
+                    item: l,
+                    size: e.size,
+                    disabled: l.disabled,
+                    selected: n === u.value,
+                    color: "primary",
+                    filled: "",
+                    onClick: i[1] || (i[1] = () => {
+                      var v;
+                      return !e.multiple && ((v = f.value) == null ? void 0 : v.hide());
+                    })
+                  }, null, 8, ["item", "size", "disabled", "selected"]))), 128)) : (a(), o("div", Le, " No options "))
+                ]),
+                _: 1
+              }, 8, ["class"])
+            ]),
+            default: b(() => [
+              E("div", {
+                class: R([s(h).box])
+              }, [
+                e.multiple && Array.isArray(t.value) && t.value.length > 0 ? (a(), o("div", De, [
+                  (a(!0), o(p, null, z(t.value, (l) => (a(), c(W, {
+                    key: l,
+                    size: "sm",
+                    removable: "",
+                    onRemove: (n) => {
+                      P(n, l);
+                    }
+                  }, {
+                    default: b(() => [
+                      C(m($(l)), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["onRemove"]))), 128))
+                ])) : !e.multiple && !F(t.value) ? (a(), o(p, { key: 1 }, [
+                  C(m($(t.value)), 1)
+                ], 64)) : (a(), o(p, { key: 2 }, [
+                  e.placeholder ? (a(), o("div", Ne, m(e.placeholder), 1)) : (a(), o("div", Oe, " "))
+                ], 64))
+              ], 2)
+            ]),
+            _: 1
+          }, 8, ["disabled", "dismiss-on-click"])),
+          pe(E("select", x({
+            id: e.id,
+            ref_key: "elRef",
+            ref: k,
+            "onUpdate:modelValue": i[2] || (i[2] = (l) => t.value = l),
+            tabindex: "-1",
+            class: e.native && !e.multiple ? "absolute inset-0 w-full h-full cursor-pointer opacity-0" : "hidden",
+            name: e.name,
+            disabled: e.disabled || e.loading,
+            multiple: e.multiple,
+            readonly: e.readonly
+          }, H(s(M), !0)), [
+            (a(!0), o(p, null, z(e.options, (l, n) => (a(), o("option", {
+              key: n,
+              value: l.value,
+              disabled: l.disabled
+            }, m(l.label), 9, Te))), 128))
+          ], 16, Be), [
+            [ce, t.value]
+          ]),
+          E("div", {
+            class: R(s(h).iconWrapper)
+          }, [
+            e.loading ? (a(), c(Re, {
+              key: 0,
+              size: e.size
+            }, null, 8, ["size"])) : me(e.$slots, "icon", { key: 1 }, () => [
+              K(Ae, {
+                icon: s(ge),
+                class: R([s(h).icon])
+              }, null, 8, ["icon", "class"])
+            ])
+          ], 2)
+        ]),
+        s(ie) ? ye("", !0) : (a(), c($e, {
+          key: 0,
+          error: s(j),
+          helper: e.helper
+        }, null, 8, ["error", "helper"]))
+      ]),
+      _: 3
+    }, 16, ["style", "disabled", "required", "is-inside-form", "label", "class"]));
+  }
+});
+export {
+  il as default
+};

package/lib/components/select/Select.vue2.js

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

package/lib/components/select/__tests__/Select.spec.d.ts

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

package/lib/components/select/index.d.ts

@@ -0,0 +1,2 @@
+export { default as XSelect } from './Select.vue';
+export type { SelectProps, SelectOption, SelectTheme } from './Select.vue';

package/lib/components/select/theme/Select.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { SelectTheme } from '../Select.vue';
+declare const theme: SelectTheme;
+export default theme;

package/lib/components/select/theme/Select.base.theme.js

@@ -0,0 +1,22 @@
+const t = {
+  classes: {
+    wrapper: "",
+    box: ({ props: e, data: s }) => {
+      const r = ["w-full border border-gray-300 dark:border-gray-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out rounded-md shadow-sm"];
+      return !s.errorInternal && !e.disabled && r.push("hover:border-gray-400 dark:hover:border-gray-500"), e.size === "xs" ? r.push("px-2 py-1 text-xs") : e.size === "sm" ? r.push("px-2 py-2 text-sm") : e.size === "lg" ? r.push("px-4 py-3 text-lg") : e.size === "xl" ? r.push("px-5 py-4 text-xl") : r.push("px-3 py-2"), e.disabled ? r.push("bg-gray-100 dark:bg-gray-900 text-gray-500 cursor-not-allowed") : r.push("bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-200"), s.errorInternal ? r.push("border-red-500 dark:border-red-400 group-focus:outline-red-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
+    },
+    content: "py-1 max-h-72 overflow-scroll",
+    iconWrapper: "pointer-events-none absolute inset-y-0 right-0 flex items-center px-2",
+    icon: ({ props: e }) => {
+      const s = [""];
+      return e.size === "sm" || e.size === "xs" ? s.push("h-3 w-3") : e.size === "lg" ? s.push("h-6 w-6") : e.size === "xl" ? s.push("h-7 w-7") : s.push("h-5 w-5"), e.disabled ? s.push("text-gray-300 dark:text-gray-500") : s.push("text-gray-500 dark:text-gray-400"), s;
+    }
+  },
+  styles: ({ colors: e, css: s }) => {
+    const r = e.getPalette("primary");
+    return s.get("border", r[500]);
+  }
+}, l = t;
+export {
+  l as default
+};

package/lib/components/select/theme/Select.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import { type SelectTheme } from '../Select.vue';
+declare const theme: SelectTheme;
+export default theme;

package/lib/components/select/theme/Select.carbon.theme.js

@@ -0,0 +1,22 @@
+const s = {
+  classes: {
+    wrapper: "",
+    box: ({ props: e, data: t }) => {
+      const r = ["w-full border-b text-sm px-4 border-gray-300 dark:border-gray-700 pr-8 outline-transparent outline outline-2 outline-offset-[-1px] transition-all duration-150 ease-in-out"];
+      return !t.errorInternal && !e.disabled && r.push("hover:border-gray-400 dark:hover:border-gray-500"), e.size === "xs" || e.size === "sm" ? r.push("py-1.5") : e.size === "lg" || e.size === "xl" ? r.push("py-3.5") : r.push("py-2.5"), e.disabled ? r.push("bg-gray-100 dark:bg-gray-900 text-gray-300 cursor-not-allowed") : e.readonly ? r.push("bg-white dark:bg-gray-900 text-gray-700") : r.push("bg-gray-50 dark:bg-gray-800 text-gray-700 dark:text-gray-200"), t.errorInternal ? r.push("border-red-500 dark:border-red-400 group-focus:outline-red-500") : e.disabled || r.push("group-focus:outline-[color:var(--x-select-border)]"), r;
+    },
+    content: "py-1 max-h-72 overflow-scroll",
+    iconWrapper: "pointer-events-none absolute inset-y-0 right-0 flex items-center px-2",
+    icon: ({ props: e }) => {
+      const t = ["h-5 w-5"];
+      return e.disabled ? t.push("text-gray-300 dark:text-gray-500") : t.push("text-gray-500 dark:text-gray-400"), t;
+    }
+  },
+  styles: ({ colors: e, css: t }) => {
+    const r = e.getPalette("primary");
+    return t.get("border", r[500]);
+  }
+}, a = s;
+export {
+  a as default
+};

package/lib/components/skeleton/Skeleton.vue.d.ts

@@ -0,0 +1,26 @@
+import type { ExtractPublicPropTypes } from 'vue';
+import { type ThemeComponent } from '../../composables/useTheme';
+declare const skeletonProps: {
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+};
+export type SkeletonProps = ExtractPublicPropTypes<typeof skeletonProps>;
+type InternalClasses = 'wrapper';
+export interface SkeletonTheme extends ThemeComponent<SkeletonProps, InternalClasses> {
+}
+declare const _default: import("vue").DefineComponent<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    tag: string;
+}, {}>;
+export default _default;

package/lib/components/skeleton/Skeleton.vue.js

@@ -0,0 +1,29 @@
+import { defineComponent as r, openBlock as c, createBlock as p, resolveDynamicComponent as m, normalizeStyle as i, unref as e, normalizeClass as f, withCtx as u, createTextVNode as _ } from "vue";
+import { useTheme as d } from "../../composables/useTheme.js";
+const y = {
+  tag: {
+    type: String,
+    default: "div"
+  }
+}, k = { name: "XSkeleton" }, h = /* @__PURE__ */ r({
+  ...k,
+  props: y,
+  setup(t) {
+    const s = t, { styles: o, classes: n, className: a } = d("Skeleton", {}, s);
+    return (l, C) => (c(), p(m(l.tag), {
+      style: i(e(o)),
+      class: f([
+        e(a),
+        e(n).wrapper
+      ])
+    }, {
+      default: u(() => [
+        _(" ​ ")
+      ]),
+      _: 1
+    }, 8, ["style", "class"]));
+  }
+});
+export {
+  h as default
+};

package/lib/components/skeleton/Skeleton.vue2.js

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

package/lib/components/skeleton/__tests__/Skeleton.spec.d.ts

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

package/lib/components/skeleton/index.d.ts

@@ -0,0 +1,2 @@
+export { default as XSkeleton } from './Skeleton.vue';
+export type { SkeletonProps, SkeletonTheme } from './Skeleton.vue';

package/lib/components/skeleton/theme/Skeleton.base.theme.d.ts

@@ -0,0 +1,3 @@
+import type { SkeletonTheme } from '../Skeleton.vue';
+declare const theme: SkeletonTheme;
+export default theme;

package/lib/components/skeleton/theme/Skeleton.base.theme.js

@@ -0,0 +1,8 @@
+const e = {
+  classes: {
+    wrapper: "animate-pulse bg-gray-300 dark:bg-gray-600 rounded-md"
+  }
+}, a = e;
+export {
+  a as default
+};

package/lib/components/skeleton/theme/Skeleton.carbon.theme.d.ts

@@ -0,0 +1,3 @@
+import type { SkeletonTheme } from '../Skeleton.vue';
+declare const theme: SkeletonTheme;
+export default theme;

package/lib/components/skeleton/theme/Skeleton.carbon.theme.js

@@ -0,0 +1,5 @@
+import e from "./Skeleton.base.theme.js";
+const t = e, o = t;
+export {
+  o as default
+};