@indielayer/ui 1.0.9 → 1.1.0

package/lib/components/slider/Slider.vue.js

@@ -0,0 +1,148 @@
+import { defineComponent as H, ref as i, watch as C, computed as J, openBlock as x, createElementBlock as y, normalizeClass as d, unref as o, normalizeStyle as N, toDisplayString as V, createCommentVNode as P, createElementVNode as v, renderSlot as R, createVNode as O } from "vue";
+import { useEventListener as f } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.4/node_modules/@vueuse/core/index.js";
+import { useCommon as X } from "../../composables/common.js";
+import { useColors as Q } from "../../composables/colors.js";
+import { useInteractive as L } from "../../composables/interactive.js";
+import { useInputtable as h } from "../../composables/inputtable.js";
+import { useTheme as U } from "../../composables/theme.js";
+import Y from "../progress/Progress.vue.js";
+import Z from "./Slider.theme.js";
+const ee = ["textContent"], te = { class: "flex items-center relative w-full" }, re = { class: "-mx-2" }, oe = ["textContent"], ae = {
+  ...X.props(),
+  ...Q.props("primary"),
+  ...L.props(),
+  ...h.props(),
+  label: String,
+  min: Number,
+  max: Number,
+  step: {
+    type: Number,
+    default: 1
+  },
+  gradient: Boolean
+}, le = {
+  name: "XSlider",
+  validators: {
+    ...X.validators()
+  }
+}, ve = /* @__PURE__ */ H({
+  ...le,
+  props: ae,
+  emits: h.emits(!1),
+  setup(S, { expose: W, emit: w }) {
+    const p = S, g = i(null), a = i(null), n = i(null), t = i(Number(p.modelValue ?? 0)), { focus: c, blur: E } = L(g);
+    C(() => p.modelValue, (e) => {
+      t.value = Number(e ?? 0);
+    }), C(t, (e) => {
+      w("update:modelValue", e);
+    });
+    const l = i(), _ = J(() => !!l.value);
+    function I(e) {
+      if (e.stopPropagation(), !a.value || !n.value)
+        return;
+      c();
+      const r = n.value.offsetWidth;
+      let s = Math.floor(e.offsetX * 100 / r);
+      s < 0 && (s = 0), s > 100 && (s = 100), t.value = s, setTimeout(() => {
+        var m;
+        l.value = {
+          x: e.x,
+          y: e.y,
+          maxWidth: r,
+          offsetX: (m = a.value) == null ? void 0 : m.offsetLeft
+        };
+      }), e.preventDefault(), e.stopPropagation();
+    }
+    function $(e) {
+      !a.value || !n.value || (c(), l.value = {
+        x: e.x,
+        y: e.y,
+        maxWidth: n.value.offsetWidth,
+        offsetX: a.value.offsetLeft
+      }, e.preventDefault(), e.stopPropagation());
+    }
+    function B(e) {
+      if (!l.value || !a.value)
+        return;
+      const { x: r, maxWidth: s, offsetX: m } = l.value, k = e.x - r;
+      if (k === 0)
+        return;
+      const G = m + k;
+      let u = Math.floor(G * 100 / s);
+      u < 0 && (u = 0), u > 100 && (u = 100), t.value = u, e.preventDefault(), e.stopPropagation();
+    }
+    function M(e) {
+      l.value && (l.value = void 0, e.preventDefault(), e.stopPropagation());
+    }
+    typeof window < "u" && (f(n, "pointerdown", I, !1), f(a, "pointerdown", $, !1), f(window, "pointermove", B, !0), f(window, "pointerup", M, !0)), f(g, "keydown", z);
+    function z(e) {
+      if (e.code === "ArrowLeft") {
+        const r = t.value - 1;
+        r >= 0 && (t.value = r), e.preventDefault();
+      } else if (e.code === "ArrowRight") {
+        const r = t.value + 1;
+        r <= 100 && (t.value = r), e.preventDefault();
+      }
+    }
+    const {
+      errorInternal: D,
+      reset: A,
+      validate: T,
+      setError: F,
+      isInsideForm: K
+    } = h(p, { focus: c, emit: w, withListeners: !1 }), { styles: j, classes: b, className: q } = U("slider", Z, p);
+    return W({ focus: c, blur: E, reset: A, validate: T, setError: F }), (e, r) => (x(), y("label", {
+      ref_key: "elRef",
+      ref: g,
+      tabindex: "0",
+      class: d(["group relative", [
+        o(q),
+        o(b).wrapper,
+        { "mb-3": o(K) }
+      ]]),
+      style: N(o(j))
+    }, [
+      e.label ? (x(), y("p", {
+        key: 0,
+        class: d(o(b).label),
+        textContent: V(e.label)
+      }, null, 10, ee)) : P("", !0),
+      v("div", te, [
+        R(e.$slots, "prefix", { value: t.value }),
+        v("div", {
+          ref_key: "progressRef",
+          ref: n,
+          class: d([[_.value ? "cursor-grabbing" : "cursor-grab"], "relative w-full py-2 mx-2"])
+        }, [
+          v("div", re, [
+            O(Y, {
+              percentage: t.value,
+              animate: !1,
+              thick: "",
+              class: "w-full",
+              gradient: e.gradient
+            }, null, 8, ["percentage", "gradient"])
+          ]),
+          v("div", {
+            ref_key: "dragRef",
+            ref: a,
+            class: d(["absolute group-focus:border-[color:var(--x-slider-border)]", [
+              o(b).drag,
+              _.value ? "cursor-grabbing" : "cursor-grab"
+            ]]),
+            style: N(`left: ${t.value}%;`)
+          }, null, 6)
+        ], 2),
+        R(e.$slots, "suffix", { value: t.value })
+      ]),
+      o(D) ? (x(), y("p", {
+        key: 1,
+        class: "text-sm text-red-500 mt-1",
+        textContent: V(o(D))
+      }, null, 8, oe)) : P("", !0)
+    ], 6));
+  }
+});
+export {
+  ve as default
+};

package/lib/components/slider/Slider.vue2.js

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

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

@@ -0,0 +1,2 @@
+export { default as XSlider } from './Slider.vue';
+export type { SliderProps } from './Slider.vue';

package/lib/components/spacer/Spacer.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("vue").DefineComponent<{}, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+declare const _default: import("vue").DefineComponent<{}, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}, {}>;
 export default _default;

package/lib/components/spacer/Spacer.js

@@ -0,0 +1,12 @@
+import { defineComponent as e, createVNode as r } from "vue";
+const t = /* @__PURE__ */ e({
+  name: "XSpacer",
+  setup() {
+    return () => r("div", {
+      class: "flex-grow"
+    }, null);
+  }
+});
+export {
+  t as default
+};

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

@@ -0,0 +1 @@
+export { default as XSpacer } from './Spacer';

package/lib/components/spinner/Spinner.vue.d.ts

@@ -1,3 +1,16 @@
+import type { ExtractPublicPropTypes } from 'vue';
+declare const spinnerProps: {
+    icon: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        readonly type: import("vue").PropType<import("../../composables/common").Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+};
+export type SpinnerProps = ExtractPublicPropTypes<typeof spinnerProps>;
 declare const _default: import("vue").DefineComponent<{
     icon: {
         type: StringConstructor;
@@ -21,5 +34,5 @@ declare const _default: import("vue").DefineComponent<{
 }>>, {
     size: import("../../composables/common").Size;
     icon: string;
-}>;
+}, {}>;
 export default _default;

package/lib/components/spinner/Spinner.vue.js

@@ -0,0 +1,28 @@
+import { defineComponent as t, openBlock as r, createBlock as n } from "vue";
+import { useCommon as o } from "../../composables/common.js";
+import i from "../icon/Icon.vue.js";
+const a = {
+  ...o.props(),
+  icon: {
+    type: String,
+    default: '<g fill="none" fill-rule="evenodd"><g transform="translate(1 1)" stroke-width="2"><circle stroke-opacity=".5" cx="18" cy="18" r="18"/><path d="M36 18c0-9.94-8.06-18-18-18"><animateTransform attributeName="transform" type="rotate" from="0 18 18" to="360 18 18" dur="0.5s" repeatCount="indefinite"/></path></g></g>'
+  }
+}, s = {
+  name: "XSpinner",
+  validators: {
+    ...o.validators()
+  }
+}, d = /* @__PURE__ */ t({
+  ...s,
+  props: a,
+  setup(p) {
+    return (e, c) => (r(), n(i, {
+      icon: e.icon,
+      size: e.size,
+      "view-box": "0 0 38 38"
+    }, null, 8, ["icon", "size"]));
+  }
+});
+export {
+  d as default
+};

package/lib/components/spinner/Spinner.vue2.js

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

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

@@ -0,0 +1,2 @@
+export { default as XSpinner } from './Spinner.vue';
+export type { SpinnerProps } from './Spinner.vue';

package/lib/components/tab/Tab.theme.d.ts

@@ -1,9 +1,12 @@
-import type { ThemeParams } from '../../composables/theme';
-declare const _default: {
-    classes: {
-        wrapper: ({ props, data }: ThemeParams) => string[];
-        label: string;
-        icon: string;
-    };
-};
-export default _default;
+import type { ThemeClasses, ThemeComponent } from '../../composables/theme';
+import type { TabProps } from './Tab.vue';
+import type { TabGroupInjection } from './TabGroup.vue';
+type InternalClasses = 'wrapper' | 'label' | 'icon';
+type InternalExtraData = Pick<TabGroupInjection, 'state'>['state'];
+interface InternalTheme extends ThemeComponent<TabProps, InternalClasses, InternalExtraData> {
+}
+export interface TabTheme extends Omit<InternalTheme, 'classes'> {
+    classes?: Partial<ThemeClasses<TabProps, InternalClasses, InternalExtraData>>;
+}
+declare const theme: InternalTheme;
+export default theme;

package/lib/components/tab/Tab.theme.js

@@ -0,0 +1,13 @@
+const i = {
+  classes: {
+    wrapper: ({ props: t, data: s }) => {
+      const e = ["py-2 transition-colors duration-150 ease-in-out whitespace-nowrap text-center"];
+      return s.variant === "block" && e.push("px-8"), t.size === "xs" ? e.push("text-xs") : t.size === "sm" ? e.push("text-sm") : t.size === "lg" ? e.push("text-lg") : t.size === "xl" && e.push("text-xl"), e;
+    },
+    label: "",
+    icon: "mr-1.5"
+  }
+}, l = i;
+export {
+  l as default
+};

package/lib/components/tab/Tab.vue.d.ts

@@ -1,43 +1,78 @@
-declare const _default: import("vue").DefineComponent<{
+import { type ExtractPublicPropTypes } from 'vue';
+import { type Size } from '../../composables/common';
+declare const tabProps: {
     value: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
     };
     tag: {
         type: StringConstructor;
         default: string;
     };
-    to: StringConstructor;
+    to: (ObjectConstructor | StringConstructor)[];
     label: StringConstructor;
     icon: StringConstructor;
     disabled: BooleanConstructor;
     exact: BooleanConstructor;
     size: {
-        readonly type: import("vue").PropType<import("../../composables/common").Size>;
+        readonly type: import("vue").PropType<Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+};
+export type TabProps = ExtractPublicPropTypes<typeof tabProps>;
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    value: {
+        type: (StringConstructor | NumberConstructor)[];
+    };
+    tag: {
+        type: StringConstructor;
+        default: string;
+    };
+    to: (ObjectConstructor | StringConstructor)[];
+    label: StringConstructor;
+    icon: StringConstructor;
+    disabled: BooleanConstructor;
+    exact: BooleanConstructor;
+    size: {
+        readonly type: import("vue").PropType<Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     value: {
-        type: (NumberConstructor | StringConstructor)[];
+        type: (StringConstructor | NumberConstructor)[];
     };
     tag: {
         type: StringConstructor;
         default: string;
     };
-    to: StringConstructor;
+    to: (ObjectConstructor | StringConstructor)[];
     label: StringConstructor;
     icon: StringConstructor;
     disabled: BooleanConstructor;
     exact: BooleanConstructor;
     size: {
-        readonly type: import("vue").PropType<import("../../composables/common").Size>;
+        readonly type: import("vue").PropType<Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
 }>>, {
-    size: import("../../composables/common").Size;
-    tag: string;
     disabled: boolean;
+    size: Size;
     exact: boolean;
+    tag: string;
+}, {}>, {
+    tab?(_: {
+        label: string | undefined;
+        value: string | number | undefined;
+        size: Size;
+        icon: string | undefined;
+    }): any;
+    default?(_: {}): any;
 }>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/lib/components/tab/Tab.vue.js

@@ -0,0 +1,129 @@
+import { defineComponent as j, computed as r, ref as n, inject as B, reactive as N, onMounted as R, openBlock as m, createBlock as f, resolveDynamicComponent as D, normalizeStyle as L, unref as l, normalizeClass as p, withCtx as V, renderSlot as y, createElementVNode as g, createCommentVNode as x, toDisplayString as E, Teleport as M } from "vue";
+import { useMutationObserver as O } from "../../node_modules/.pnpm/@vueuse_core@10.2.0_vue@3.3.4/node_modules/@vueuse/core/index.js";
+import { injectTabKey as P } from "../../composables/keys.js";
+import { useCommon as h } from "../../composables/common.js";
+import { useTheme as X } from "../../composables/theme.js";
+import F from "../icon/Icon.vue.js";
+import K from "../link/Link.vue.js";
+import q from "./Tab.theme.js";
+const A = { class: "flex items-center justify-center" }, G = {
+  ...h.props(),
+  value: {
+    type: [String, Number]
+  },
+  tag: {
+    type: String,
+    default: "div"
+  },
+  to: [String, Object],
+  label: String,
+  icon: String,
+  disabled: Boolean,
+  exact: Boolean
+}, H = {
+  name: "XTab",
+  validators: {
+    ...h.validators()
+  }
+}, ee = /* @__PURE__ */ j({
+  ...H,
+  props: G,
+  setup(z) {
+    const t = z, i = r(() => {
+      var e, d;
+      return ((d = (e = o.value) == null ? void 0 : e.$el) == null ? void 0 : d.href) || t.value;
+    }), C = r(() => t.label || t.value), c = n(null), o = n(null), a = B(P, {
+      tabsContentRef: n(null),
+      activateTab: () => {
+      },
+      state: N({
+        active: void 0,
+        variant: "line",
+        ghost: !1,
+        grow: !1,
+        exact: !1,
+        size: "md",
+        color: "primary"
+      })
+    }), b = r(() => a.state.exact || t.exact), u = r(() => t.size || a.state.size);
+    R(() => {
+      c.value = a.tabsContentRef.value, t.to && o.value && (k(), O(o.value.$el, k, {
+        attributes: !0,
+        attributeFilter: ["class"]
+      }));
+    });
+    function k() {
+      o.value && o.value.$el && t.to && o.value.$el.classList.contains(b.value ? "router-link-exact-active" : "router-link-active") && a.activateTab(i.value);
+    }
+    const s = r(() => a.state.active === i.value), S = r(() => a.state.color);
+    function T(e) {
+      if (t.disabled) {
+        e.preventDefault(), e.stopPropagation();
+        return;
+      }
+      !t.to && i.value && a.activateTab(i.value);
+    }
+    const { styles: $, classes: v, className: w } = X("tab", q, n({
+      ...t,
+      size: u.value,
+      exact: b.value
+    }), a.state);
+    return (e, d) => (m(), f(D(e.to ? K : e.tag), {
+      ref_key: "elRef",
+      ref: o,
+      "data-value": i.value,
+      to: e.to,
+      color: s.value ? S.value : void 0,
+      style: L([
+        l($),
+        e.to && s.value && l(a).state.variant === "block" ? "--x-link-text: var(--x-tabs-text); --x-link-text-hover: var(--x-tabs-text);" : ""
+      ]),
+      class: p([
+        l(w),
+        l(v).wrapper,
+        "shrink-0 font-medium",
+        {
+          "flex-1": l(a).state.grow,
+          "text-[color:var(--x-tabs-text)] dark:text-[color:var(--x-tabs-dark-text)]": s.value,
+          "cursor-pointer": !e.disabled,
+          "cursor-not-allowed": e.disabled,
+          "cursor-not-allowed text-gray-500": e.disabled && !s.value
+        }
+      ]),
+      "aria-disabled": e.disabled ? "true" : void 0,
+      "aria-selected": s.value ? "true" : "false",
+      onClick: T
+    }, {
+      default: V(() => [
+        y(e.$slots, "tab", {
+          label: e.label,
+          value: e.value,
+          size: u.value,
+          icon: e.icon
+        }, () => [
+          g("div", A, [
+            e.icon ? (m(), f(F, {
+              key: 0,
+              icon: e.icon,
+              size: u.value,
+              class: p(l(v).icon)
+            }, null, 8, ["icon", "size", "class"])) : x("", !0),
+            g("div", {
+              class: p(l(v).label)
+            }, E(C.value), 3)
+          ])
+        ]),
+        s.value && c.value ? (m(), f(M, {
+          key: 0,
+          to: c.value
+        }, [
+          y(e.$slots, "default")
+        ], 8, ["to"])) : x("", !0)
+      ]),
+      _: 3
+    }, 8, ["data-value", "to", "color", "style", "class", "aria-disabled", "aria-selected"]));
+  }
+});
+export {
+  ee as default
+};

package/lib/components/tab/Tab.vue2.js

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

package/lib/components/tab/TabGroup.theme.d.ts

@@ -1,10 +1,10 @@
-import type { ThemeParams } from '../../composables/theme';
-declare const _default: {
-    classes: {
-        wrapper: string;
-        list: ({ props, colors, css }: ThemeParams) => string[];
-        tracker: ({ props }: ThemeParams) => string[];
-    };
-    styles: ({ props, colors, css }: ThemeParams) => Record<string, string>;
-};
-export default _default;
+import type { ThemeClasses, ThemeComponent } from '../../composables/theme';
+import type { TabGroupProps } from './TabGroup.vue';
+type InternalClasses = 'wrapper' | 'list' | 'tracker';
+interface InternalTheme extends ThemeComponent<TabGroupProps, InternalClasses> {
+}
+export interface TabGroupTheme extends Omit<InternalTheme, 'classes'> {
+    classes?: Partial<ThemeClasses<TabGroupProps, InternalClasses>>;
+}
+declare const theme: InternalTheme;
+export default theme;

package/lib/components/tab/TabGroup.theme.js

@@ -0,0 +1,27 @@
+const l = {
+  classes: {
+    wrapper: "",
+    list: ({ props: t }) => {
+      const a = ["flex min-w-full w-fit"];
+      return t.variant === "line" && a.push("border-b border-gray-200 dark:border-gray-700"), t.variant === "line" && !t.grow && a.push("space-x-8"), t.variant === "block" && a.push("z-[1]"), t.align === "center" && a.push("justify-center"), t.align === "right" && a.push("justify-end"), a;
+    },
+    tracker: ({ props: t }) => {
+      const a = ["absolute transition-all duration-150"];
+      return t.variant === "line" && a.push("h-[2px] -mt-[2px] bg-[color:var(--x-tabs-text)] dark:bg-[color:var(--x-tabs-dark-text)]"), t.variant === "block" && a.push("rounded-md h-full top-0 bg-[color:var(--x-tabs-bg)] dark:bg-[color:var(--x-tabs-dark-bg)]"), a;
+    }
+  },
+  styles: ({ props: t, colors: a, css: e }) => {
+    const i = a.getPalette("gray"), r = a.getPalette(t.color);
+    return e.variables({
+      text: r[600],
+      bg: t.ghost ? r[50] : "#fff",
+      dark: {
+        text: r[400],
+        bg: t.ghost ? r[900] : i[700]
+      }
+    });
+  }
+}, n = l;
+export {
+  n as default
+};

package/lib/components/tab/TabGroup.vue.d.ts

@@ -1,6 +1,12 @@
-import { type PropType } from 'vue';
-declare const _default: import("vue").DefineComponent<{
-    modelValue: (NumberConstructor | StringConstructor)[];
+import { type PropType, type ExtractPublicPropTypes, type Ref } from 'vue';
+import { type Size } from '../../composables/common';
+declare const validators: {
+    variant: readonly ["line", "block"];
+    align: readonly ["left", "center", "right"];
+    size: string[];
+};
+declare const tabGroupProps: {
+    modelValue: (StringConstructor | NumberConstructor)[];
     variant: {
         type: PropType<"line" | "block">;
         default: string;
@@ -17,12 +23,51 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: string | undefined;
     };
     size: {
-        readonly type: PropType<import("../../composables/common").Size>;
+        readonly type: PropType<Size>;
+        readonly default: "md";
+        readonly validator: (value: string) => boolean;
+    };
+};
+export type TabGroupInjection = {
+    tabsContentRef: Ref<HTMLElement | null>;
+    activateTab: (tab: string | number) => void;
+    state: {
+        active: string | number | undefined;
+        variant: TabGroupVariant;
+        ghost: boolean;
+        grow: boolean;
+        exact: boolean;
+        size: Size;
+        color: string;
+    };
+};
+export type TabGroupVariant = typeof validators.variant[number];
+export type TabGroupAlign = typeof validators.align[number];
+export type TabGroupProps = ExtractPublicPropTypes<typeof tabGroupProps>;
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
+    modelValue: (StringConstructor | NumberConstructor)[];
+    variant: {
+        type: PropType<"line" | "block">;
+        default: string;
+    };
+    align: {
+        type: PropType<"left" | "right" | "center">;
+        default: string;
+    };
+    ghost: BooleanConstructor;
+    grow: BooleanConstructor;
+    exact: BooleanConstructor;
+    color: {
+        readonly type: StringConstructor;
+        readonly default: string | undefined;
+    };
+    size: {
+        readonly type: PropType<Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
 }, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
-    modelValue: (NumberConstructor | StringConstructor)[];
+    modelValue: (StringConstructor | NumberConstructor)[];
     variant: {
         type: PropType<"line" | "block">;
         default: string;
@@ -39,19 +84,26 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: string | undefined;
     };
     size: {
-        readonly type: PropType<import("../../composables/common").Size>;
+        readonly type: PropType<Size>;
         readonly default: "md";
         readonly validator: (value: string) => boolean;
     };
 }>> & {
     "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
 }, {
-    size: import("../../composables/common").Size;
     color: string;
+    size: Size;
+    variant: "line" | "block";
     align: "left" | "right" | "center";
     ghost: boolean;
-    exact: boolean;
-    variant: "line" | "block";
     grow: boolean;
+    exact: boolean;
+}, {}>, {
+    default?(_: {}): any;
 }>;
 export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};