vlite3 0.0.1

package/README.md

@@ -0,0 +1,72 @@
+# vlite3
+
+A lightweight Vue 3 UI component library built with Tailwind CSS.
+
+## Installation
+
+### NPM
+
+```bash
+npm install vlite3
+```
+
+### Yarn
+
+```bash
+yarn add vlite3
+```
+
+## Configuration
+
+### 1. Import Styles
+
+Import the library's base styles (for custom component styles) in your main entry file (e.g., `main.ts` or `App.vue`):
+
+```ts
+import 'vlite3/style.css'
+```
+
+### 2. Tailwind CSS Setup
+
+This library relies on Tailwind CSS for utility classes. You must configure your project to scan the library's files so that the necessary classes are generated.
+
+#### Tailwind CSS v3 (`tailwind.config.js`)
+
+Add the library path to your `content` array:
+
+```js
+module.exports = {
+	content: [
+		'./index.html',
+		'./src/**/*.{vue,js,ts,jsx,tsx}',
+		'./node_modules/vlite3/dist/**/*.{js,vue}', // <--- Add this line
+	],
+	// ...
+}
+```
+
+#### Tailwind CSS v4
+
+If you are using the new CSS-first configuration, add the source path:
+
+```css
+@import 'tailwindcss';
+@source "../node_modules/vlite3/dist";
+```
+
+## Usage
+
+Import components directly in your Vue files:
+
+```vue
+<script setup>
+import { Button, Input } from 'vlite3'
+</script>
+
+<template>
+	<div class="p-4 space-y-4">
+		<Button>Click Me</Button>
+		<Input placeholder="Type here..." />
+	</div>
+</template>
+```

package/_virtual/_plugin-vue_export-helper.js

@@ -0,0 +1,9 @@
+const s = (t, e) => {
+  const o = t.__vccOpts || t;
+  for (const [r, c] of e)
+    o[r] = c;
+  return o;
+};
+export {
+  s as default
+};

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

@@ -0,0 +1,42 @@
+import { AccordionProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        trigger?(_: {
+            item: import('./types').AccordionItemSchema;
+            open: boolean;
+            toggle: () => void;
+            triggerClass: string;
+        }): any;
+        content?(_: {
+            close: (id: string) => void;
+            item: import('./types').AccordionItemSchema;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<AccordionProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    "update:modelValue": (value: string | string[]) => any;
+    change: (value: string | string[]) => any;
+}, string, import('vue').PublicProps, Readonly<AccordionProps> & Readonly<{
+    "onUpdate:modelValue"?: (value: string | string[]) => any;
+    onChange?: (value: string | string[]) => any;
+}>, {
+    disabled: boolean;
+    showIndex: boolean;
+    iconVariant: "simple" | "solid" | "outline" | "primary" | "ghost";
+    variant: import('./types').AccordionVariant;
+    attached: boolean;
+    items: import('./types').AccordionItemSchema[];
+    allowMultiple: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, 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/Accordion/Accordion.vue.js

@@ -0,0 +1,102 @@
+import { defineComponent as p, ref as b, watch as f, computed as B, openBlock as s, createElementBlock as m, normalizeClass as k, renderSlot as r, Fragment as $, renderList as x, createBlock as A, createSlots as M, withCtx as v } from "vue";
+import O from "./AccordionItem.vue.js";
+const j = /* @__PURE__ */ p({
+  __name: "Accordion",
+  props: {
+    items: { default: () => [] },
+    modelValue: {},
+    allowMultiple: { type: Boolean, default: !1 },
+    defaultValue: {},
+    disabled: { type: Boolean, default: !1 },
+    variant: { default: "default" },
+    attached: { type: Boolean, default: !1 },
+    openIcon: {},
+    closeIcon: {},
+    iconPosition: {},
+    iconVariant: { default: "simple" },
+    activeIconVariant: {},
+    showIndex: { type: Boolean, default: !1 },
+    class: {},
+    itemClass: {},
+    triggerClass: {},
+    contentClass: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(t, { emit: g }) {
+    const l = t, c = g, a = b([]), u = (e) => Array.isArray(e) ? e : typeof e == "string" && e ? [e] : [];
+    f(
+      () => l.modelValue,
+      (e) => {
+        a.value = u(e);
+      },
+      { immediate: !0 }
+    ), f(
+      () => l.defaultValue,
+      (e) => {
+        !l.modelValue && e && (a.value = u(e));
+      },
+      { immediate: !0 }
+    );
+    const d = (e) => {
+      if (l.disabled) return;
+      const i = a.value.includes(e);
+      l.allowMultiple ? i ? a.value = a.value.filter((n) => n !== e) : a.value = [...a.value, e] : i ? a.value = [] : a.value = [e], h();
+    }, h = () => {
+      const e = l.allowMultiple ? a.value : a.value[0] || "";
+      c("update:modelValue", e), c("change", e);
+    }, C = B(() => {
+      const e = ["w-full", l.class];
+      return l.attached && (e.push("rounded-lg overflow-hidden"), (l.variant === "outline" || l.variant === "default") && e.push("border"), l.variant === "solid" && e.push("border")), e.join(" ");
+    });
+    return (e, i) => (s(), m("div", {
+      class: k(C.value)
+    }, [
+      r(e.$slots, "default", {}, () => [
+        (s(!0), m($, null, x(t.items, (n, I) => (s(), A(O, {
+          key: n.id,
+          item: n,
+          isOpen: a.value.includes(n.id),
+          variant: t.variant,
+          attached: t.attached,
+          disabled: t.disabled,
+          index: I + 1,
+          showIndex: t.showIndex,
+          openIcon: t.openIcon,
+          closeIcon: t.closeIcon,
+          iconVariant: t.iconVariant,
+          activeIconVariant: t.activeIconVariant,
+          triggerClass: t.triggerClass,
+          contentClass: t.contentClass,
+          itemClass: t.itemClass,
+          onToggle: d
+        }, M({ _: 2 }, [
+          e.$slots.trigger ? {
+            name: "trigger",
+            fn: v(({ item: o, open: V, toggle: w, triggerClass: y }) => [
+              r(e.$slots, "trigger", {
+                item: o,
+                open: V,
+                toggle: w,
+                triggerClass: y
+              })
+            ]),
+            key: "0"
+          } : void 0,
+          e.$slots.content ? {
+            name: "content",
+            fn: v(({ item: o }) => [
+              r(e.$slots, "content", {
+                close: d,
+                item: o
+              })
+            ]),
+            key: "1"
+          } : void 0
+        ]), 1032, ["item", "isOpen", "variant", "attached", "disabled", "index", "showIndex", "openIcon", "closeIcon", "iconVariant", "activeIconVariant", "triggerClass", "contentClass", "itemClass"]))), 128))
+      ])
+    ], 2));
+  }
+});
+export {
+  j as default
+};

package/components/Accordion/Accordion.vue2.js

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

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

@@ -0,0 +1,22 @@
+interface Props {
+    class?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        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, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    class: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, 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/Accordion/AccordionContent.vue.js

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

package/components/Accordion/AccordionContent.vue2.js

@@ -0,0 +1,47 @@
+import { defineComponent as d, openBlock as h, createBlock as f, Transition as m, withCtx as p, createElementVNode as n, normalizeClass as u, renderSlot as v } from "vue";
+const _ = { class: "overflow-hidden text-sm transition-all duration-300 ease-in-out" }, E = /* @__PURE__ */ d({
+  __name: "AccordionContent",
+  props: {
+    class: { default: "" }
+  },
+  setup(o) {
+    const s = o, r = (t) => {
+      const e = t;
+      e.style.height = "0";
+    }, l = (t) => {
+      const e = t;
+      e.style.height = e.scrollHeight + "px";
+    }, c = (t) => {
+      const e = t;
+      e.style.height = "auto";
+    }, a = (t) => {
+      const e = t;
+      e.style.height = e.scrollHeight + "px";
+    }, i = (t) => {
+      const e = t;
+      e.style.height = "0";
+    };
+    return (t, e) => (h(), f(m, {
+      name: "accordion",
+      onBeforeEnter: r,
+      onEnter: l,
+      onAfterEnter: c,
+      onBeforeLeave: a,
+      onLeave: i
+    }, {
+      default: p(() => [
+        n("div", _, [
+          n("div", {
+            class: u(["pb-4", s.class])
+          }, [
+            v(t.$slots, "default", {}, void 0, !0)
+          ], 2)
+        ])
+      ]),
+      _: 3
+    }));
+  }
+});
+export {
+  E as default
+};

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

@@ -0,0 +1,54 @@
+import { AccordionItemSchema, AccordionVariant } from './types';
+interface Props {
+    item: AccordionItemSchema;
+    isOpen: boolean;
+    variant?: AccordionVariant;
+    attached?: boolean;
+    disabled?: boolean;
+    index?: number;
+    showIndex?: boolean;
+    openIcon?: string;
+    closeIcon?: string;
+    iconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    activeIconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    triggerClass?: string;
+    contentClass?: string;
+    itemClass?: string;
+    class?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        trigger?(_: {
+            item: AccordionItemSchema;
+            open: boolean;
+            toggle: () => void;
+            triggerClass: string;
+        }): any;
+        content?(_: {
+            item: AccordionItemSchema;
+            close: () => void;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    toggle: (id: string) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onToggle?: (id: string) => any;
+}>, {
+    disabled: boolean;
+    class: string;
+    showIndex: boolean;
+    variant: AccordionVariant;
+    attached: 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/Accordion/AccordionItem.vue.js

@@ -0,0 +1,102 @@
+import { defineComponent as y, computed as s, openBlock as l, createElementBlock as d, normalizeClass as c, renderSlot as u, createVNode as f, withCtx as b, createElementVNode as I, toDisplayString as g, createCommentVNode as v, withDirectives as w, createBlock as k, resolveDynamicComponent as B, vShow as V } from "vue";
+import p from "./AccordionTrigger.vue.js";
+import O from "./AccordionContent.vue.js";
+const T = {
+  key: 0,
+  class: "ml-2 text-sm text-muted-foreground font-normal"
+}, A = ["innerHTML"], E = /* @__PURE__ */ y({
+  __name: "AccordionItem",
+  props: {
+    item: {},
+    isOpen: { type: Boolean },
+    variant: { default: "default" },
+    attached: { type: Boolean, default: !1 },
+    disabled: { type: Boolean, default: !1 },
+    index: {},
+    showIndex: { type: Boolean, default: !1 },
+    openIcon: {},
+    closeIcon: {},
+    iconVariant: {},
+    activeIconVariant: {},
+    triggerClass: {},
+    contentClass: {},
+    itemClass: {},
+    class: { default: "" }
+  },
+  emits: ["toggle"],
+  setup(e, { emit: h }) {
+    const n = e, C = h, r = () => {
+      n.item.disabled || n.disabled || C("toggle", n.item.id);
+    }, x = s(() => {
+      const { variant: t, attached: i } = n;
+      if (i) {
+        const o = "transition-all first:rounded-t-lg last:rounded-b-lg";
+        let a = "border-b last:border-0";
+        return t === "default" || t === "outline" ? `${o} ${a}` : t === "solid" ? "border-b last:border-0 bg-transparent" : t === "ghost" ? "bg-transparent border-b last:border-0" : `${o} ${a}`;
+      }
+      return t === "solid" ? "mb-2 border rounded-lg overflow-hidden transition-all duration-200" : t === "outline" ? "border mb-2 rounded-lg overflow-hidden" : t === "separated" ? "border mb-4 rounded-lg  overflow-hidden" : t === "ghost" ? "border-none bg-transparent mb-1" : "border-b";
+    }), m = s(() => {
+      const { variant: t, attached: i, isOpen: o } = n, a = n.triggerClass || "";
+      return t === "solid" ? `${a} px-4 bg-muted transition-colors` : !i && (t === "ghost" || t === "default") ? `${a} px-0 hover:no-underline` : `${a} px-4 hover:bg-accent`;
+    }), $ = s(() => {
+      const { variant: t, attached: i } = n, o = n.contentClass || "";
+      return t === "solid" ? `${o} px-4 pt-2` : !i && (t === "ghost" || t === "default") ? `${o} px-0` : `${o} px-4`;
+    });
+    return (t, i) => (l(), d("div", {
+      class: c([x.value, n.class, n.itemClass])
+    }, [
+      u(t.$slots, "trigger", {
+        item: e.item,
+        open: e.isOpen,
+        toggle: r,
+        triggerClass: m.value
+      }, () => [
+        f(p, {
+          open: e.isOpen,
+          disabled: e.item.disabled || e.disabled,
+          icon: e.item.icon,
+          index: e.index,
+          showIndex: e.showIndex,
+          "open-icon": e.openIcon,
+          "close-icon": e.closeIcon,
+          "icon-variant": e.iconVariant,
+          "active-icon-variant": e.activeIconVariant,
+          class: c(m.value),
+          onClick: r
+        }, {
+          default: b(() => [
+            I("span", null, g(e.item.title), 1),
+            e.item.description ? (l(), d("span", T, g(e.item.description), 1)) : v("", !0)
+          ]),
+          _: 1
+        }, 8, ["open", "disabled", "icon", "index", "showIndex", "open-icon", "close-icon", "icon-variant", "active-icon-variant", "class"])
+      ]),
+      w(f(O, {
+        class: c($.value)
+      }, {
+        default: b(() => [
+          u(t.$slots, "content", {
+            item: e.item,
+            close: r
+          }, () => [
+            e.item.bodyComponent ? (l(), k(B(e.item.bodyComponent), {
+              key: 0,
+              item: e.item,
+              close: r
+            }, null, 8, ["item"])) : e.item.content ? (l(), d("div", {
+              key: 1,
+              class: "text-muted-foreground leading-relaxed",
+              innerHTML: e.item.content
+            }, null, 8, A)) : v("", !0)
+          ])
+        ]),
+        _: 3
+      }, 8, ["class"]), [
+        [V, e.isOpen]
+      ])
+    ], 2));
+  }
+});
+export {
+  E as default
+};

package/components/Accordion/AccordionItem.vue2.js

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

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

@@ -0,0 +1,40 @@
+interface Props {
+    class?: string;
+    icon?: string;
+    open?: boolean;
+    disabled?: boolean;
+    index?: number;
+    showIndex?: boolean;
+    openIcon?: string;
+    closeIcon?: string;
+    iconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    activeIconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    chevron?: boolean;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+        icon?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLButtonElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    click: (event: MouseEvent) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onClick?: (event: MouseEvent) => any;
+}>, {
+    class: string;
+    showIndex: boolean;
+    iconVariant: "simple" | "solid" | "outline" | "primary" | "ghost";
+    chevron: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLButtonElement>;
+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/Accordion/AccordionTrigger.vue.js

@@ -0,0 +1,72 @@
+import { defineComponent as I, computed as o, openBlock as r, createElementBlock as s, normalizeClass as a, createElementVNode as f, toDisplayString as k, createCommentVNode as c, createBlock as w, renderSlot as m, createVNode as C } from "vue";
+import p from "../Icon.vue.js";
+const V = ["data-state", "disabled"], $ = { class: "flex items-center gap-3" }, B = {
+  key: 0,
+  class: "flex items-center justify-center h-7 w-7 rounded-full bg-primary-light text-primary text-xs font-bold shrink-0"
+}, j = { class: "flex flex-col" }, E = /* @__PURE__ */ I({
+  __name: "AccordionTrigger",
+  props: {
+    class: { default: "" },
+    icon: {},
+    open: { type: Boolean },
+    disabled: { type: Boolean },
+    index: {},
+    showIndex: { type: Boolean, default: !1 },
+    openIcon: {},
+    closeIcon: {},
+    iconVariant: { default: "simple" },
+    activeIconVariant: {},
+    chevron: { type: Boolean, default: !0 }
+  },
+  emits: ["click"],
+  setup(t, { emit: g }) {
+    const e = t, v = g, h = (n) => {
+      e.disabled || v("click", n);
+    }, x = o(() => e.open && e.openIcon ? e.openIcon : !e.open && e.closeIcon ? e.closeIcon : "lucide:chevron-down"), l = o(() => e.openIcon && e.closeIcon ? "" : e.open ? "rotate-180" : ""), i = o(() => e.open && e.activeIconVariant ? e.activeIconVariant : e.iconVariant), b = o(() => {
+      const n = "flex items-center justify-center shrink-0 transition-all duration-300", u = "h-8 w-8 rounded-full", d = {
+        simple: "text-muted-foreground bg-transparent",
+        solid: "text-foreground bg-muted",
+        outline: "text-foreground border bg-transparent",
+        primary: "text-primary-dark bg-primary-light",
+        ghost: "text-muted-foreground hover:bg-accent bg-transparent"
+      }, y = d[i.value] || d.simple;
+      return i.value === "simple" ? `text-muted-foreground group-hover:text-foreground ${l.value}` : `${n} ${u} ${y} ${l.value}`;
+    });
+    return (n, u) => (r(), s("button", {
+      type: "button",
+      class: a(["group flex flex-1 w-full items-center justify-between py-3 text-left font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2", [
+        e.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
+        e.class
+      ]]),
+      "data-state": e.open ? "open" : "closed",
+      disabled: e.disabled,
+      onClick: h
+    }, [
+      f("div", $, [
+        t.showIndex && t.index !== void 0 ? (r(), s("div", B, k(t.index), 1)) : c("", !0),
+        t.icon ? (r(), w(p, {
+          key: 1,
+          icon: t.icon,
+          class: "h-5 w-5 shrink-0 text-muted-foreground group-hover:text-foreground transition-colors"
+        }, null, 8, ["icon"])) : c("", !0),
+        f("div", j, [
+          m(n.$slots, "default")
+        ])
+      ]),
+      m(n.$slots, "icon", {}, () => [
+        t.chevron || t.openIcon || t.closeIcon ? (r(), s("div", {
+          key: 0,
+          class: a(b.value)
+        }, [
+          C(p, {
+            icon: x.value,
+            class: a(["h-4 w-4 shrink-0 transition-transform duration-200", { "rotate-0": i.value !== "simple" }])
+          }, null, 8, ["icon", "class"])
+        ], 2)) : c("", !0)
+      ])
+    ], 10, V));
+  }
+});
+export {
+  E as default
+};

package/components/Accordion/AccordionTrigger.vue2.js

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

package/components/Accordion/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Accordion } from './Accordion.vue';
+export { default as AccordionItem } from './AccordionItem.vue';
+export { default as AccordionTrigger } from './AccordionTrigger.vue';
+export { default as AccordionContent } from './AccordionContent.vue';
+export * from './types';

package/components/Accordion/types.d.ts

@@ -0,0 +1,30 @@
+export interface AccordionItemSchema {
+    id: string;
+    title: string;
+    description?: string;
+    content?: string;
+    bodyComponent?: any;
+    disabled?: boolean;
+    icon?: string;
+    [key: string]: any;
+}
+export type AccordionVariant = 'default' | 'solid' | 'outline' | 'ghost' | 'separated';
+export interface AccordionProps {
+    items?: AccordionItemSchema[];
+    modelValue?: string | string[];
+    allowMultiple?: boolean;
+    defaultValue?: string | string[];
+    disabled?: boolean;
+    variant?: AccordionVariant;
+    attached?: boolean;
+    openIcon?: string;
+    closeIcon?: string;
+    iconPosition?: 'left' | 'right';
+    iconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    activeIconVariant?: 'simple' | 'solid' | 'outline' | 'primary' | 'ghost';
+    showIndex?: boolean;
+    class?: string;
+    itemClass?: string;
+    triggerClass?: string;
+    contentClass?: string;
+}

package/components/Alert.vue.d.ts

@@ -0,0 +1,36 @@
+import { AlertVariant } from '../types';
+interface Props {
+    title?: string;
+    description?: string;
+    icon?: string;
+    variant?: AlertVariant;
+    closable?: boolean;
+    role?: 'alert' | 'status' | 'none';
+    class?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        icon?(_: {}): 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, {} & {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    onClose?: () => any;
+}>, {
+    class: string;
+    variant: AlertVariant;
+    closable: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};