@vifui/core 0.4.0-alpha.6 → 0.6.0-alpha.8

package/README.md

@@ -47,14 +47,14 @@ npm install vue@^3.4.0 tailwindcss@^4.0.0 @iconify/vue@^4.0.0
 In your `main.js` or `App.vue`:
 
 ```js
-import '@vifui/core/styles'
+import "@vifui/core/styles";
 ```
 
 ### 2. Use Components
 
 ```vue
 <script setup>
-import { Button, Badge, Card } from '@vifui/core'
+import { Button, Badge, Card } from "@vifui/core";
 </script>
 
 <template>
@@ -104,7 +104,7 @@ import { Button, Badge, Card } from '@vifui/core'
 
 ```vue
 <script setup>
-import { ref } from 'vue'
+import { ref } from "vue";
 import {
   AlertRoot,
   AlertIcon,
@@ -112,25 +112,19 @@ import {
   AlertHeader,
   AlertTitle,
   AlertDescription,
-  Button
-} from '@vifui/core'
+  Button,
+} from "@vifui/core";
 
-const showAlert = ref(true)
+const showAlert = ref(true);
 </script>
 
 <template>
-  <AlertRoot
-    v-model:visible="showAlert"
-    variant="soft"
-    color="success"
-  >
+  <AlertRoot v-model:visible="showAlert" variant="soft" color="success">
     <AlertIcon icon="lucide:check-circle" />
     <AlertContent>
       <AlertHeader>
         <AlertTitle>Success!</AlertTitle>
-        <AlertDescription>
-          Your changes have been saved.
-        </AlertDescription>
+        <AlertDescription> Your changes have been saved. </AlertDescription>
       </AlertHeader>
     </AlertContent>
   </AlertRoot>
@@ -164,13 +158,13 @@ For now, explore our [Storybook examples](https://github.com/I-am-abdulazeez/vif
 All components are built with TypeScript and include full type definitions:
 
 ```typescript
-import type { ButtonProps, CardRootProps } from '@vifui/core'
+import type { ButtonProps, CardRootProps } from "@vifui/core";
 
 const buttonProps: ButtonProps = {
-  color: 'brand',
-  size: 'lg',
-  variant: 'solid'
-}
+  color: "brand",
+  size: "lg",
+  variant: "solid",
+};
 ```
 
 ## Browser Support

package/dist/components/accordion/accordion-body.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionBody component.
  * Serves as a wrapper for the main content inside an accordion item.
@@ -13,7 +14,7 @@ export interface AccordionBodyProps {
      * <AccordionBody class="p-4 text-gray-700" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare var __VLS_1: {};
 type __VLS_Slots = {} & {

package/dist/components/accordion/accordion-body.vue.js

@@ -3,7 +3,7 @@ import { defineComponent, inject, createElementBlock, openBlock, normalizeClass,
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "accordion-body",
   props: {
-    class: { type: String, required: false }
+    class: { type: null, required: false }
   },
   setup(__props) {
     const props = __props;

package/dist/components/accordion/accordion-content.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionContent component.
  * Represents the collapsible content section of an accordion item.
@@ -13,7 +14,7 @@ export interface AccordionContentProps {
      * <AccordionContent class="p-4 bg-gray-50" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/components/accordion/accordion-content.vue.js

@@ -4,7 +4,7 @@ import { AccordionContent } from 'reka-ui';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "accordion-content",
   props: {
-    class: { type: String, required: false }
+    class: { type: null, required: false }
   },
   setup(__props) {
     const props = __props;

package/dist/components/accordion/accordion-header.vue.d.ts

@@ -1,4 +1,5 @@
 import { type AccordionHeaderProps as RekaAccordionHeaderProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionHeader component.
  * Serves as the wrapper for the accordion trigger and title,
@@ -14,7 +15,7 @@ export interface AccordionHeaderProps extends RekaAccordionHeaderProps {
      * <AccordionHeader class="bg-gray-50 px-4 py-2" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/components/accordion/accordion-header.vue.js

@@ -4,7 +4,7 @@ import { AccordionHeader } from 'reka-ui';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "accordion-header",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false }
   },

package/dist/components/accordion/accordion-indicator.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionIndicator component.
  * Renders the visual indicator (typically a chevron) for
@@ -24,7 +25,7 @@ export interface AccordionIndicatorProps {
      * <AccordionIndicator class="text-primary-600" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: import("vue").DefineComponent<AccordionIndicatorProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AccordionIndicatorProps> & Readonly<{}>, {
     icon: string;

package/dist/components/accordion/accordion-indicator.vue.js

@@ -5,7 +5,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "accordion-indicator",
   props: {
     icon: { type: String, required: false, default: "lucide:chevron-down" },
-    class: { type: String, required: false }
+    class: { type: null, required: false }
   },
   setup(__props) {
     const props = __props;

package/dist/components/accordion/accordion-item.vue.d.ts

@@ -1,3 +1,4 @@
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionItem component.
  * Represents a single accordion section that can expand or collapse,
@@ -36,7 +37,7 @@ export interface AccordionItemProps {
      * <AccordionItem class="border-b" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare var __VLS_6: {};
 type __VLS_Slots = {} & {

package/dist/components/accordion/accordion-item.vue.js

@@ -6,7 +6,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   props: {
     value: { type: String, required: true },
     disabled: { type: Boolean, required: false, default: false },
-    class: { type: String, required: false }
+    class: { type: null, required: false }
   },
   setup(__props) {
     const props = __props;

package/dist/components/accordion/accordion-root.vue.d.ts

@@ -1,3 +1,4 @@
+import { type HTMLAttributes } from "vue";
 import type { AccordionVariantProps } from "./accordion.styles";
 /**
  * Props for the VifUI AccordionRoot component.
@@ -53,7 +54,7 @@ export interface AccordionRootProps {
      * Custom class names for extending or overriding styles.
      * Applied directly to the accordion root element.
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
     /**
      * Orientation of the accordion layout.
      * `"vertical"` stacks items top-to-bottom — `"horizontal"` arranges them side-by-side.

package/dist/components/accordion/accordion-root.vue.js

@@ -12,7 +12,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     type: { type: String, required: false, default: "single" },
     collapsible: { type: Boolean, required: false, default: true },
     disabled: { type: Boolean, required: false, default: false },
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     orientation: { type: String, required: false, default: "vertical" },
     dir: { type: String, required: false, default: "ltr" }
   },

package/dist/components/accordion/accordion-trigger.vue.d.ts

@@ -1,4 +1,5 @@
 import { type AccordionTriggerProps as RekaAccordionTriggerProps } from "reka-ui";
+import type { HTMLAttributes } from "vue";
 /**
  * Props for the VifUI AccordionTrigger component.
  * Acts as the interactive button that expands or collapses
@@ -15,7 +16,7 @@ export interface AccordionTriggerProps extends RekaAccordionTriggerProps {
      * <AccordionTrigger class="text-primary-600" />
      * ```
      */
-    class?: string;
+    class?: HTMLAttributes["class"];
     /**
      * Disables this specific trigger.
      * Prevents the accordion item from opening or closing.

package/dist/components/accordion/accordion-trigger.vue.js

@@ -4,7 +4,7 @@ import { AccordionTrigger } from 'reka-ui';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "accordion-trigger",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     disabled: { type: Boolean, required: false, default: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false }

package/dist/components/accordion/index.d.ts

@@ -1,15 +1,15 @@
-export { default as AccordionRoot } from './accordion-root.vue';
-export { default as AccordionItem } from './accordion-item.vue';
-export { default as AccordionHeader } from './accordion-header.vue';
-export { default as AccordionTrigger } from './accordion-trigger.vue';
-export { default as AccordionContent } from './accordion-content.vue';
-export { default as AccordionIndicator } from './accordion-indicator.vue';
-export { default as AccordionBody } from './accordion-body.vue';
-export { accordionVariants, type AccordionVariantProps } from './accordion.styles';
-export type { AccordionItemProps } from './accordion-item.vue';
-export type { AccordionRootProps } from './accordion-root.vue';
-export type { AccordionHeaderProps } from './accordion-header.vue';
-export type { AccordionTriggerProps } from './accordion-trigger.vue';
-export type { AccordionContentProps } from './accordion-content.vue';
-export type { AccordionIndicatorProps } from './accordion-indicator.vue';
-export type { AccordionBodyProps } from './accordion-body.vue';
+export { default as AccordionRoot } from "./accordion-root.vue";
+export { default as AccordionItem } from "./accordion-item.vue";
+export { default as AccordionHeader } from "./accordion-header.vue";
+export { default as AccordionTrigger } from "./accordion-trigger.vue";
+export { default as AccordionContent } from "./accordion-content.vue";
+export { default as AccordionIndicator } from "./accordion-indicator.vue";
+export { default as AccordionBody } from "./accordion-body.vue";
+export { accordionVariants, type AccordionVariantProps, } from "./accordion.styles";
+export type { AccordionItemProps } from "./accordion-item.vue";
+export type { AccordionRootProps } from "./accordion-root.vue";
+export type { AccordionHeaderProps } from "./accordion-header.vue";
+export type { AccordionTriggerProps } from "./accordion-trigger.vue";
+export type { AccordionContentProps } from "./accordion-content.vue";
+export type { AccordionIndicatorProps } from "./accordion-indicator.vue";
+export type { AccordionBodyProps } from "./accordion-body.vue";

package/dist/components/alert/alert-body.vue.d.ts

@@ -1,7 +1,7 @@
 import { type PrimitiveProps } from "reka-ui";
-import { type Slot } from "vue";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertBodyProps extends PrimitiveProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertBodyProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertBodyProps> & Readonly<{}>, {
     as: import("reka-ui").AsTag | import("vue").Component;

package/dist/components/alert/alert-body.vue.js

@@ -5,7 +5,7 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-body",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   },

package/dist/components/alert/alert-close.vue.d.ts

@@ -1,5 +1,6 @@
+import { type HTMLAttributes } from "vue";
 export interface AlertCloseProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertCloseProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertCloseProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
     default?: (props: {}) => any;

package/dist/components/alert/alert-close.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, createBlock, openBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, renderSlot, createVNode } from 'vue';
+import { defineComponent, inject, computed, createBlock, openBlock, resolveDynamicComponent, unref, normalizeClass, withCtx, renderSlot, createVNode } from 'vue';
 import { Icon } from '@iconify/vue';
 import { alertVariants } from './alert.styles.js';
 import _sfc_main$1 from '../button/button.vue.js';
@@ -6,22 +6,34 @@ import _sfc_main$1 from '../button/button.vue.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-close",
   props: {
-    class: { type: String, required: false }
+    class: { type: null, required: false }
   },
   setup(__props) {
     const props = __props;
+    const alertContext = inject("alertContext", {
+      color: computed(() => "neutral"),
+      variant: computed(() => "primary")
+    });
     const classes = computed(
       () => alertVariants({
         class: props.class
       })
     );
+    const buttonColor = computed(() => {
+      const variant = alertContext.variant.value;
+      if (variant === "primary") {
+        return "neutral";
+      }
+      return alertContext.color.value;
+    });
+    const buttonVariant = computed(() => "ghost");
     return (_ctx, _cache) => {
       return openBlock(), createBlock(resolveDynamicComponent(unref(_sfc_main$1)), {
         "icon-only": "",
         class: normalizeClass(classes.value.close()),
         size: "sm",
-        color: "neutral",
-        variant: "ghost"
+        color: buttonColor.value,
+        variant: buttonVariant.value
       }, {
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default", {}, () => [
@@ -30,7 +42,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         ]),
         _: 3
         /* FORWARDED */
-      }, 8, ["class"]);
+      }, 8, ["class", "color", "variant"]);
     };
   }
 });

package/dist/components/alert/alert-content.vue.d.ts

@@ -1,11 +1,11 @@
-import { type PrimitiveProps } from 'reka-ui';
-import { type Slot } from 'vue';
+import { type PrimitiveProps } from "reka-ui";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertContentProps extends PrimitiveProps {
     /**
-   * Makes the content collapsible (header becomes trigger)
-   */
+     * Makes the content collapsible (header becomes trigger)
+     */
     collapsible?: boolean;
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertContentProps & {
     collapsed?: boolean;

package/dist/components/alert/alert-content.vue.js

@@ -6,7 +6,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-content",
   props: /* @__PURE__ */ mergeModels({
     collapsible: { type: Boolean, required: false },
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   }, {
@@ -17,10 +17,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const delegatedProps = computed(() => {
-      const {
-        as,
-        asChild
-      } = props;
+      const { as, asChild } = props;
       return { as, asChild };
     });
     const forwardedProps = useForwardProps(delegatedProps);

package/dist/components/alert/alert-description.vue.d.ts

@@ -1,7 +1,7 @@
-import { type PrimitiveProps } from 'reka-ui';
-import { type Slot } from 'vue';
+import { type PrimitiveProps } from "reka-ui";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertDescriptionProps extends PrimitiveProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertDescriptionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertDescriptionProps> & Readonly<{}>, {
     as: import("reka-ui").AsTag | import("vue").Component;

package/dist/components/alert/alert-description.vue.js

@@ -5,17 +5,14 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-description",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   },
   setup(__props) {
     const props = __props;
     const delegatedProps = computed(() => {
-      const {
-        as,
-        asChild
-      } = props;
+      const { as, asChild } = props;
       return { as, asChild };
     });
     const forwardedProps = useForwardProps(delegatedProps);

package/dist/components/alert/alert-footer.vue.d.ts

@@ -1,7 +1,7 @@
 import { type PrimitiveProps } from "reka-ui";
-import { type Slot } from "vue";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertFooterProps extends PrimitiveProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertFooterProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertFooterProps> & Readonly<{}>, {
     as: import("reka-ui").AsTag | import("vue").Component;

package/dist/components/alert/alert-footer.vue.js

@@ -5,7 +5,7 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-footer",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   },

package/dist/components/alert/alert-header.vue.d.ts

@@ -1,7 +1,7 @@
-import { type PrimitiveProps } from 'reka-ui';
-import { type Slot } from 'vue';
+import { type PrimitiveProps } from "reka-ui";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertHeaderProps extends PrimitiveProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertHeaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertHeaderProps> & Readonly<{}>, {
     as: import("reka-ui").AsTag | import("vue").Component;

package/dist/components/alert/alert-header.vue.js

@@ -5,7 +5,7 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-header",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   },
@@ -18,10 +18,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
     });
     const delegatedProps = computed(() => {
-      const {
-        as,
-        asChild
-      } = props;
+      const { as, asChild } = props;
       return { as, asChild };
     });
     const computedDelegatedProps = computed(() => ({

package/dist/components/alert/alert-icon.vue.d.ts

@@ -1,6 +1,7 @@
-import { type IconifyIconProps } from '@iconify/vue';
+import { type IconifyIconProps } from "@iconify/vue";
+import { type HTMLAttributes } from "vue";
 export interface AlertIconProps extends IconifyIconProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: import("vue").DefineComponent<AlertIconProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertIconProps> & Readonly<{}>, {
     mode: import("@iconify/vue/dist/iconify.js").IconifyRenderMode;

package/dist/components/alert/alert-icon.vue.js

@@ -5,7 +5,7 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-icon",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     icon: { type: [Object, String], required: true },
     mode: { type: String, required: false, default: "svg" },
     color: { type: String, required: false },

package/dist/components/alert/alert-root.vue.d.ts

@@ -1,5 +1,5 @@
 import { type PrimitiveProps } from "reka-ui";
-import { type Slot } from "vue";
+import { type HTMLAttributes, type Slot } from "vue";
 import type { Colors, Variants } from "../types/shared-types";
 export interface AlertRootProps extends PrimitiveProps {
     /**
@@ -17,7 +17,7 @@ export interface AlertRootProps extends PrimitiveProps {
      * @defaultValue "false"
      */
     hideContent?: boolean;
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertRootProps & {
     /**

package/dist/components/alert/alert-root.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent, mergeModels, computed, useModel, createBlock, openBlock, Transition, withCtx, createCommentVNode, unref, mergeProps, renderSlot } from 'vue';
+import { defineComponent, mergeModels, computed, useModel, provide, createBlock, openBlock, Transition, withCtx, createCommentVNode, unref, mergeProps, renderSlot } from 'vue';
 import { useForwardProps, Primitive } from 'reka-ui';
 import { alertVariants } from './alert.styles.js';
 
@@ -8,7 +8,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     variant: { type: String, required: false, default: "primary" },
     color: { type: String, required: false, default: "brand" },
     hideContent: { type: Boolean, required: false },
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   }, {
@@ -31,6 +31,10 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
         color: props.color
       })
     );
+    provide("alertContext", {
+      color: computed(() => props.color),
+      variant: computed(() => props.variant)
+    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(Transition, { name: "vif-alert-fade" }, {
         default: withCtx(() => [

package/dist/components/alert/alert-title.vue.d.ts

@@ -1,7 +1,7 @@
-import { type PrimitiveProps } from 'reka-ui';
-import { type Slot } from 'vue';
+import { type PrimitiveProps } from "reka-ui";
+import { type HTMLAttributes, type Slot } from "vue";
 export interface AlertTitleProps extends PrimitiveProps {
-    class?: string;
+    class?: HTMLAttributes["class"];
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<AlertTitleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<AlertTitleProps> & Readonly<{}>, {
     as: import("reka-ui").AsTag | import("vue").Component;

package/dist/components/alert/alert-title.vue.js

@@ -5,17 +5,14 @@ import { alertVariants } from './alert.styles.js';
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "alert-title",
   props: {
-    class: { type: String, required: false },
+    class: { type: null, required: false },
     asChild: { type: Boolean, required: false },
     as: { type: null, required: false, default: "div" }
   },
   setup(__props) {
     const props = __props;
     const delegatedProps = computed(() => {
-      const {
-        as,
-        asChild
-      } = props;
+      const { as, asChild } = props;
       return { as, asChild };
     });
     const forwardedProps = useForwardProps(delegatedProps);

package/dist/components/alert/index.d.ts

@@ -1,19 +1,19 @@
-export { default as AlertRoot } from './alert-root.vue';
-export { default as AlertIcon } from './alert-icon.vue';
-export { default as AlertContent } from './alert-content.vue';
-export { default as AlertHeader } from './alert-header.vue';
-export { default as AlertTitle } from './alert-title.vue';
-export { default as AlertDescription } from './alert-description.vue';
-export { default as AlertBody } from './alert-body.vue';
-export { default as AlertFooter } from './alert-footer.vue';
-export { default as AlertClose } from './alert-close.vue';
-export type { AlertRootProps } from './alert-root.vue';
-export type { AlertIconProps } from './alert-icon.vue';
-export type { AlertContentProps } from './alert-content.vue';
-export type { AlertHeaderProps } from './alert-header.vue';
-export type { AlertTitleProps } from './alert-title.vue';
-export type { AlertDescriptionProps } from './alert-description.vue';
-export type { AlertBodyProps } from './alert-body.vue';
-export type { AlertFooterProps } from './alert-footer.vue';
-export type { AlertCloseProps } from './alert-close.vue';
-export { alertVariants, type AlertVariantProps } from './alert.styles';
+export { default as AlertRoot } from "./alert-root.vue";
+export { default as AlertIcon } from "./alert-icon.vue";
+export { default as AlertContent } from "./alert-content.vue";
+export { default as AlertHeader } from "./alert-header.vue";
+export { default as AlertTitle } from "./alert-title.vue";
+export { default as AlertDescription } from "./alert-description.vue";
+export { default as AlertBody } from "./alert-body.vue";
+export { default as AlertFooter } from "./alert-footer.vue";
+export { default as AlertClose } from "./alert-close.vue";
+export type { AlertRootProps } from "./alert-root.vue";
+export type { AlertIconProps } from "./alert-icon.vue";
+export type { AlertContentProps } from "./alert-content.vue";
+export type { AlertHeaderProps } from "./alert-header.vue";
+export type { AlertTitleProps } from "./alert-title.vue";
+export type { AlertDescriptionProps } from "./alert-description.vue";
+export type { AlertBodyProps } from "./alert-body.vue";
+export type { AlertFooterProps } from "./alert-footer.vue";
+export type { AlertCloseProps } from "./alert-close.vue";
+export { alertVariants, type AlertVariantProps } from "./alert.styles";