@robuust-digital/vue-components 2.1.0 → 2.2.0-rc.0

package/dist/_shared/Toast.vue_vue_type_script_setup_true_lang-FEeRXoIx.js

@@ -0,0 +1,75 @@
+import { defineComponent as d, onMounted as h, watch as w, createBlock as a, openBlock as o, unref as r, withCtx as i, resolveDynamicComponent as c, normalizeClass as y, renderSlot as s, createElementVNode as m, createCommentVNode as u, toDisplayString as C, createElementBlock as $, createVNode as b } from "vue";
+import { TransitionRoot as k } from "@headlessui/vue";
+import { r as B } from "./XMarkIcon-90mcPzBs.js";
+const T = { class: "rvc-toast-title" }, S = /* @__PURE__ */ d({
+  __name: "Toast",
+  props: {
+    show: { type: Boolean, default: !1 },
+    as: { default: "div" },
+    title: { default: "" },
+    icon: { type: [Function, Object, null], default: null },
+    timeout: { type: [Number, Boolean], default: 5e3 },
+    position: { default: "bottom" },
+    type: { default: "info" },
+    showClose: { type: Boolean, default: !1 }
+  },
+  emits: ["toast:close"],
+  setup(f, { emit: p }) {
+    const e = f, v = p, n = () => {
+      e.timeout && e.show && setTimeout(() => {
+        v("toast:close");
+      }, e.timeout);
+    };
+    return h(() => {
+      n();
+    }), w(() => e.show, (t) => {
+      t && n();
+    }), (t, l) => (o(), a(r(k), {
+      show: t.show,
+      as: "template",
+      enter: "rvc-toast-transition-enter",
+      "enter-from": "rvc-toast-transition-enter-from",
+      "enter-to": "rvc-toast-transition-enter-to",
+      leave: "rvc-toast-transition-leave",
+      "leave-from": "rvc-toast-transition-leave-from",
+      "leave-to": "rvc-toast-transition-leave-to"
+    }, {
+      default: i(() => [
+        (o(), a(c(t.as), {
+          class: y(["rvc-toast", `rvc-toast-${t.position}`, `rvc-toast-${t.type}`, { "rvc-toast-open": t.show }])
+        }, {
+          default: i(() => [
+            s(t.$slots, "icon", {}, () => [
+              t.icon ? (o(), a(c(t.icon), {
+                key: 0,
+                class: "rvc-toast-icon"
+              })) : u("", !0)
+            ]),
+            m("div", null, [
+              s(t.$slots, "title", {}, () => [
+                m("span", T, C(t.title), 1)
+              ]),
+              s(t.$slots, "default")
+            ]),
+            s(t.$slots, "close", {}, () => [
+              t.showClose ? (o(), $("button", {
+                key: 0,
+                type: "button",
+                class: "rvc-toast-close",
+                "aria-label": "Close",
+                onClick: l[0] || (l[0] = (N) => t.$emit("toast:close"))
+              }, [
+                b(r(B))
+              ])) : u("", !0)
+            ])
+          ]),
+          _: 3
+        }, 8, ["class"]))
+      ]),
+      _: 3
+    }, 8, ["show"]));
+  }
+});
+export {
+  S as _
+};

package/dist/_shared/Tooltip.vue_vue_type_script_setup_true_lang-CoydN9sS.js

@@ -0,0 +1,96 @@
+import { defineComponent as R, shallowRef as n, createElementBlock as f, openBlock as d, renderSlot as u, createElementVNode as w, normalizeStyle as k, normalizeClass as z, unref as h, createCommentVNode as S, mergeProps as x } from "vue";
+import { useFloating as C, autoUpdate as W, autoPlacement as M, offset as P, shift as _, arrow as A, size as B } from "@floating-ui/vue";
+const E = ["innerHTML"], L = /* @__PURE__ */ R({
+  __name: "Tooltip",
+  props: {
+    content: {},
+    blur: { type: Boolean, default: !0 },
+    maxWidth: { default: null },
+    tooltipClass: { default: "" },
+    placement: { default: void 0 },
+    size: { default: "base" }
+  },
+  setup(v) {
+    const o = v, s = n(), a = n(), l = n(), {
+      floatingStyles: y,
+      middlewareData: g,
+      placement: i
+    } = C(s, a, {
+      middleware: [
+        ...o.placement ? [] : [M()],
+        P(o.size === "sm" ? 7 : 10),
+        _({ crossAxis: !0, padding: 5 }),
+        A({ element: l }),
+        B({
+          apply({ availableWidth: e, availableHeight: t, elements: r }) {
+            Object.assign(r.floating.style, {
+              maxWidth: o.maxWidth ? `${Math.min(e, o.maxWidth) / 16}rem` : "",
+              maxHeight: `${t / 16}rem `
+            });
+          }
+        })
+      ],
+      whileElementsMounted: W,
+      placement: o.placement
+    }), b = (e) => {
+      const t = {
+        top: 0,
+        bottom: 180,
+        left: -90,
+        right: 90
+      }, r = e.split("-")[0];
+      return r && t[r] || 0;
+    }, $ = (e) => {
+      var m, c;
+      const t = i.value.split("-")[0], p = t ? {
+        left: "right",
+        right: "left",
+        bottom: "top",
+        top: "bottom"
+      }[t] : "";
+      return {
+        style: {
+          left: (m = e.arrow) != null && m.x ? `${e.arrow.x}px` : "",
+          top: (c = e.arrow) != null && c.y ? `${e.arrow.y}px` : "",
+          bottom: "",
+          right: "",
+          ...p ? { [p]: l.value ? `${l.value.offsetWidth * -1}px` : "" } : {},
+          transform: `rotate(${b(i.value)}deg)`
+        }
+      };
+    };
+    return (e, t) => (d(), f("div", {
+      ref_key: "wrapperRef",
+      ref: s,
+      class: "rvc-tooltip-wrapper"
+    }, [
+      u(e.$slots, "default"),
+      w("div", {
+        ref_key: "tooltipRef",
+        ref: a,
+        class: z([
+          "rvc-tooltip",
+          e.tooltipClass,
+          `rvc-tooltip-${e.size}`,
+          { "rvc-tooltip-blur": e.blur }
+        ]),
+        style: k(h(y))
+      }, [
+        u(e.$slots, "content", { content: e.content }, () => [
+          e.content ? (d(), f("div", {
+            key: 0,
+            innerHTML: e.content
+          }, null, 8, E)) : S("", !0)
+        ]),
+        w("div", x({
+          ref_key: "arrowRef",
+          ref: l,
+          class: "rvc-tooltip-arrow"
+        }, $(h(g))), null, 16)
+      ], 6)
+    ], 512));
+  }
+});
+export {
+  L as _
+};

package/dist/combobox/index.js

@@ -1,349 +1,5 @@
-import { createElementBlock as d, openBlock as a, createElementVNode as r, ref as p, computed as K, createBlock as g, unref as c, mergeProps as F, withCtx as x, createCommentVNode as C, renderSlot as v, createVNode as y, resolveDynamicComponent as N, withModifiers as P, Fragment as j, renderList as z, createTextVNode as Z, toDisplayString as S, normalizeClass as U } from "vue";
-import { useDebounceFn as G } from "@vueuse/core";
-import { Combobox as H, ComboboxInput as J, ComboboxButton as Q, ComboboxOptions as W, ComboboxOption as X } from "@headlessui/vue";
-import { r as Y, _ } from "../_shared/ChevronDownIcon-z-5U4fIb.js";
-import { S as ee } from "../_shared/icon-spinner-CmxIOqaK.js";
-function te(e, $) {
-  return a(), d("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 16 16",
-    fill: "currentColor",
-    "aria-hidden": "true",
-    "data-slot": "icon"
-  }, [
-    r("path", {
-      "fill-rule": "evenodd",
-      d: "M8 15A7 7 0 1 0 8 1a7 7 0 0 0 0 14Zm2.78-4.22a.75.75 0 0 1-1.06 0L8 9.06l-1.72 1.72a.75.75 0 1 1-1.06-1.06L6.94 8 5.22 6.28a.75.75 0 0 1 1.06-1.06L8 6.94l1.72-1.72a.75.75 0 1 1 1.06 1.06L9.06 8l1.72 1.72a.75.75 0 0 1 0 1.06Z",
-      "clip-rule": "evenodd"
-    })
-  ]);
-}
-function le(e, $) {
-  return a(), d("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 20 20",
-    fill: "currentColor",
-    "aria-hidden": "true",
-    "data-slot": "icon"
-  }, [
-    r("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
-  ]);
-}
-const oe = { class: "rvc-combobox-container" }, ne = { class: "rvc-combobox-wrapper" }, ae = { class: "rvc-combobox-field" }, ie = {
-  key: 0,
-  class: "rvc-combobox-chips"
-}, ue = ["onClick"], re = {
-  key: 0,
-  class: "rvc-combobox-content"
-}, se = {
-  key: 1,
-  class: "rvc-combobox-content"
-}, ce = { class: "rvc-combobox-option-text" }, ye = /* @__PURE__ */ Object.assign({
-  inheritAttrs: !1
-}, {
-  __name: "Combobox",
-  props: {
-    id: {
-      type: String,
-      required: !0
-    },
-    rootClass: {
-      type: String,
-      default: ""
-    },
-    modelValue: {
-      type: [Number, String, Object, Array, null],
-      required: !1,
-      default: null
-    },
-    endpoint: {
-      type: String,
-      default: void 0
-    },
-    requestParams: {
-      type: Object,
-      required: !1,
-      default: () => ({})
-    },
-    manualInput: {
-      type: Boolean,
-      required: !1,
-      default: !1
-    },
-    responseData: {
-      type: Function,
-      required: !1,
-      default: (e) => e
-    },
-    displayValue: {
-      type: Function,
-      required: !1,
-      default: (e) => (e == null ? void 0 : e.name) || null
-    },
-    optionText: {
-      type: Function,
-      required: !1,
-      default: (e) => (e == null ? void 0 : e.name) || null
-    },
-    disabled: {
-      type: Boolean,
-      required: !1,
-      default: !1
-    },
-    minLength: {
-      type: Number,
-      default: 2,
-      required: !1
-    },
-    itemKey: {
-      type: String,
-      required: !1,
-      default: "id"
-    },
-    clearable: {
-      type: Boolean,
-      required: !1
-    },
-    rootAttrs: {
-      type: Object,
-      default: () => {
-      }
-    },
-    multiple: {
-      type: Boolean
-    },
-    onSearch: {
-      type: Function,
-      default: () => null
-    },
-    searchOnly: {
-      type: Boolean
-    },
-    icon: {
-      type: [Object, Function],
-      default: null
-    },
-    prefixIcon: {
-      type: [Object, Function],
-      default: null
-    },
-    size: {
-      type: String,
-      default: "base",
-      validator: (e) => ["sm", "base"].includes(e)
-    },
-    debounce: {
-      type: Number,
-      default: 150
-    },
-    minLoadingTime: {
-      type: Number,
-      default: 0
-    },
-    onCancel: {
-      type: Function,
-      default: null
-    }
-  },
-  emits: ["update:modelValue", "update:requestParams", "combobox:noResults", "combobox:error"],
-  setup(e, { emit: $ }) {
-    const n = e, m = $, s = p([]), f = p(!1), k = p(null), L = p(!0), q = p(null), b = K({
-      get: () => n.multiple ? n.modelValue || [] : n.modelValue,
-      set: (t) => m("update:modelValue", t)
-    }), O = K({
-      get: () => n.requestParams,
-      set: (t) => m("update:requestParams", t)
-    }), D = (t) => new Promise((l) => {
-      setTimeout(l, t);
-    }), T = (t, l) => {
-      s.value = [], m("combobox:error", t), m("combobox:noResults", l);
-    }, A = async (t) => {
-      if (!n.onSearch) return;
-      if (n.searchOnly && !t) {
-        s.value = [];
-        return;
-      }
-      if (t && t.length < n.minLength) {
-        s.value = [];
-        return;
-      }
-      q.value && n.onCancel && n.onCancel(q.value), f.value = !0;
-      const l = Date.now();
-      try {
-        const { data: i, error: h, cancel: w } = await n.onSearch(t, O.value, n.endpoint);
-        q.value = w;
-        const o = n.responseData(i), u = Date.now() - l;
-        !o.length && h && T(h, t), u < n.minLoadingTime && await D(n.minLoadingTime - u), o != null && o.length ? s.value = o : (s.value = [], m("combobox:noResults", t));
-      } catch (i) {
-        i.cancelled || T(i, t);
-      } finally {
-        f.value = !1;
-      }
-    }, M = G(A, n.debounce), B = (t) => {
-      L.value ? (L.value = !1, A(t)) : M(t);
-    }, R = (t) => {
-      var l;
-      ((l = t.target.value) == null ? void 0 : l.length) === 0 && (s.value = [], m("update:modelValue", null)), n.manualInput && m("update:modelValue", O.value.query);
-    }, V = (t) => {
-      var l;
-      return n.multiple ? b.value.some((i) => i[n.itemKey] === t) : ((l = b.value) == null ? void 0 : l[n.itemKey]) === t;
-    }, I = (t) => {
-      b.value = b.value.filter((l) => l[n.itemKey] !== t[n.itemKey]);
-    };
-    return (t, l) => (a(), g(c(H), F({
-      modelValue: b.value,
-      "onUpdate:modelValue": l[4] || (l[4] = (i) => b.value = i),
-      as: "div"
-    }, e.rootAttrs, {
-      multiple: e.multiple,
-      class: [
-        "rvc-combobox",
-        `rvc-combobox-${e.size}`,
-        e.rootClass
-      ]
-    }), {
-      default: x(() => {
-        var i, h, w;
-        return [
-          r("div", oe, [
-            r("div", ne, [
-              r("div", ae, [
-                e.prefixIcon ? v(t.$slots, "prefixIcon", {
-                  key: 0,
-                  icon: e.prefixIcon
-                }, () => [
-                  (a(), g(N(e.prefixIcon), { "aria-hidden": "true" }))
-                ]) : C("", !0),
-                y(c(J), F(t.$attrs, {
-                  id: e.id,
-                  "display-value": e.displayValue,
-                  disabled: e.disabled,
-                  autocomplete: "off",
-                  onChange: l[0] || (l[0] = (o) => B(o.target.value)),
-                  onSearch: R,
-                  onInput: l[1] || (l[1] = (o) => k.value = o.target.value)
-                }), null, 16, ["id", "display-value", "disabled"]),
-                y(c(Q), {
-                  disabled: e.disabled,
-                  class: "rvc-combobox-button",
-                  onClick: l[2] || (l[2] = (o) => B(k.value || null))
-                }, {
-                  default: x(() => {
-                    var o;
-                    return [
-                      f.value ? v(t.$slots, "spinner", {
-                        key: 0,
-                        spinning: f.value
-                      }, () => [
-                        y(c(ee), { class: "rvc-combobox-spinner" })
-                      ]) : (!e.searchOnly || (o = s.value) != null && o.length) && !f.value ? v(t.$slots, "icon", {
-                        key: 1,
-                        icon: e.icon
-                      }, () => [
-                        (a(), g(N(e.icon ?? c(Y)), { "aria-hidden": "true" }))
-                      ]) : C("", !0)
-                    ];
-                  }),
-                  _: 3
-                }, 8, ["disabled"])
-              ]),
-              e.clearable && ((i = e.modelValue) != null && i.length || (h = e.modelValue) != null && h.id) ? (a(), d("button", {
-                key: 0,
-                type: "button",
-                "aria-label": "Clear selection",
-                class: "rvc-combobox-clear",
-                onClick: l[3] || (l[3] = P((o) => m("update:modelValue", e.multiple ? [] : null), ["prevent"]))
-              }, [
-                v(t.$slots, "clear", {}, () => [
-                  y(c(le))
-                ])
-              ])) : C("", !0)
-            ]),
-            e.multiple && b.value.length ? (a(), d("ul", ie, [
-              (a(!0), d(j, null, z(b.value, (o) => (a(), d("li", {
-                key: `${e.id}-selected-option-${o[e.itemKey]}`
-              }, [
-                v(t.$slots, "chip", {
-                  optionText: e.optionText(o),
-                  option: o,
-                  removeOption: I
-                }, () => [
-                  y(_, {
-                    color: "gray",
-                    class: "rvc-combobox-chip",
-                    size: e.size
-                  }, {
-                    default: x(() => [
-                      Z(S(e.optionText(o)) + " ", 1),
-                      r("button", {
-                        type: "button",
-                        "aria-label": "Remove option",
-                        onClick: P((u) => I(o), ["prevent"])
-                      }, [
-                        y(c(te))
-                      ], 8, ue)
-                    ]),
-                    _: 2
-                  }, 1032, ["size"])
-                ])
-              ]))), 128))
-            ])) : C("", !0),
-            (!e.searchOnly || (w = k.value) != null && w.length) && (!f.value || s.value.length) ? (a(), g(c(W), {
-              key: 1,
-              class: "rvc-combobox-options"
-            }, {
-              default: x(() => {
-                var o;
-                return [
-                  ((o = k.value) == null ? void 0 : o.length) < e.minLength ? (a(), d("div", re, [
-                    r("div", null, [
-                      r("em", null, "Minimal " + S(e.minLength) + " characters.", 1)
-                    ])
-                  ])) : !f.value && !s.value.length ? (a(), d("div", se, l[5] || (l[5] = [
-                    r("div", null, " No results found. ", -1)
-                  ]))) : (a(!0), d(j, { key: 2 }, z(s.value, (u) => (a(), g(c(X), {
-                    key: u[e.itemKey],
-                    value: u,
-                    as: "template"
-                  }, {
-                    default: x(({ active: E }) => [
-                      r("li", {
-                        class: U([
-                          "rvc-combobox-option",
-                          { "rvc-combobox-option-hover": E },
-                          { "rvc-combobox-option-active": V(u[e.itemKey]) }
-                        ])
-                      }, [
-                        v(t.$slots, "option", {
-                          option: u,
-                          isActive: V
-                        }, () => [
-                          v(t.$slots, "optionPrefix", {
-                            option: u[e.itemKey],
-                            isActive: V
-                          }),
-                          r("span", ce, S(e.optionText(u)), 1),
-                          v(t.$slots, "optionSuffix", {
-                            option: u[e.itemKey],
-                            isActive: V
-                          })
-                        ])
-                      ], 2)
-                    ]),
-                    _: 2
-                  }, 1032, ["value"]))), 128))
-                ];
-              }),
-              _: 3
-            })) : C("", !0)
-          ])
-        ];
-      }),
-      _: 3
-    }, 16, ["modelValue", "multiple", "class"]));
-  }
-});
+import { _ as a } from "../_shared/Combobox.vue_vue_type_script_setup_true_lang-D1vKMJok.js";
 export {
-  ye as Combobox,
-  ye as default
+  a as Combobox,
+  a as default
 };

package/dist/combobox.d.ts

@@ -0,0 +1,4 @@
+import { default as Combobox } from './components/Combobox.vue';
+export type { ComboboxProps, ComboboxModelValue, ComboboxSize } from './components/Combobox.vue';
+export { Combobox };
+export default Combobox;

package/dist/components/Accordion.vue.d.ts

@@ -0,0 +1,37 @@
+export interface AccordionItem {
+    title: string;
+    content: string;
+    [key: string]: unknown;
+}
+export interface AccordionProps {
+    items: AccordionItem[];
+    name?: string;
+    defaultOpenIndex?: number;
+    contentClass?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        summary?(_: {
+            item: AccordionItem;
+            index: number;
+        }): any;
+        icon?(_: {
+            classList: string;
+        }): any;
+        content?(_: {
+            item: AccordionItem;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('../../node_modules/vue').DefineComponent<AccordionProps, {}, {}, {}, {}, import('../../node_modules/vue').ComponentOptionsMixin, import('../../node_modules/vue').ComponentOptionsMixin, {}, string, import('../../node_modules/vue').PublicProps, Readonly<AccordionProps> & Readonly<{}>, {}, {}, {}, {}, string, import('../../node_modules/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/dist/components/Alert.vue.d.ts

@@ -0,0 +1,39 @@
+import { Icon } from '../types/shared';
+export type AlertType = 'success' | 'warning' | 'danger' | 'info';
+export interface AlertProps {
+    as?: string;
+    title?: string;
+    icon?: Icon;
+    type?: AlertType;
+    close?: boolean;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {}): any;
+        title?(_: {}): any;
+        default?(_: {}): any;
+        close?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('../../node_modules/vue').DefineComponent<AlertProps, {}, {}, {}, {}, import('../../node_modules/vue').ComponentOptionsMixin, import('../../node_modules/vue').ComponentOptionsMixin, {} & {
+    "alert:close": () => any;
+}, string, import('../../node_modules/vue').PublicProps, Readonly<AlertProps> & Readonly<{
+    "onAlert:close"?: (() => any) | undefined;
+}>, {
+    title: string;
+    close: boolean;
+    as: string;
+    icon: Icon;
+    type: AlertType;
+}, {}, {}, {}, string, import('../../node_modules/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/dist/components/Badge.vue.d.ts

@@ -0,0 +1,32 @@
+export type BadgeColor = 'default' | 'gray' | 'red' | 'yellow' | 'green' | 'blue' | 'violet' | 'purple' | 'pink' | `custom-${string}`;
+export type BadgeSize = 'sm' | 'base';
+export interface BadgeProps {
+    as?: string;
+    label?: string;
+    size?: BadgeSize;
+    color?: BadgeColor;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            label: string;
+        }): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('../../node_modules/vue').DefineComponent<BadgeProps, {}, {}, {}, {}, import('../../node_modules/vue').ComponentOptionsMixin, import('../../node_modules/vue').ComponentOptionsMixin, {}, string, import('../../node_modules/vue').PublicProps, Readonly<BadgeProps> & Readonly<{}>, {
+    label: string;
+    as: string;
+    size: BadgeSize;
+    color: BadgeColor;
+}, {}, {}, {}, string, import('../../node_modules/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/dist/components/ButtonBase.vue.d.ts

@@ -0,0 +1,50 @@
+import { Icon } from '../types/shared';
+export interface ButtonProps {
+    as?: string;
+    bindAs?: string;
+    label?: string;
+    icon?: Icon;
+    iconOnly?: boolean;
+    iconLeft?: boolean;
+    size?: 'sm' | 'base';
+    spinning?: boolean;
+    color?: 'primary' | 'secondary' | 'tertiary' | 'light' | 'dark' | 'green' | 'red' | 'yellow' | 'blue' | 'green-soft' | 'red-soft' | 'yellow-soft' | 'blue-soft' | `custom-${string}` | 'clear';
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {
+            label: string;
+        }): any;
+        default?(_: {
+            label: string;
+        }): any;
+        icon?(_: {
+            icon: Icon;
+        }): any;
+        spinner?(_: {
+            spinning: boolean;
+        }): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('../../node_modules/vue').DefineComponent<ButtonProps, {}, {}, {}, {}, import('../../node_modules/vue').ComponentOptionsMixin, import('../../node_modules/vue').ComponentOptionsMixin, {}, string, import('../../node_modules/vue').PublicProps, Readonly<ButtonProps> & Readonly<{}>, {
+    label: string;
+    as: string;
+    icon: Icon;
+    size: "sm" | "base";
+    color: "primary" | "secondary" | "tertiary" | "light" | "dark" | "green" | "red" | "yellow" | "blue" | "green-soft" | "red-soft" | "yellow-soft" | "blue-soft" | `custom-${string}` | "clear";
+    bindAs: string;
+    iconOnly: boolean;
+    iconLeft: boolean;
+    spinning: boolean;
+}, {}, {}, {}, string, import('../../node_modules/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;
+    };
+};