@bitrix24/b24ui-nuxt 2.3.0 → 2.4.1

package/dist/runtime/components/TableWrapper.vue.d.ts

@@ -1,3 +1,4 @@
+import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/table-wrapper';
 import type { ComponentConfig } from '../types/tv';
@@ -44,7 +45,7 @@ export interface TableWrapperProps {
     b24ui?: TableWrapper['slots'];
 }
 export interface TableWrapperSlots {
-    default(props?: {}): any;
+    default?(props?: {}): VNode[];
 }
 declare const _default: typeof __VLS_export;
 export default _default;

package/dist/runtime/components/Tabs.d.vue.ts

@@ -1,3 +1,4 @@
+import type { ComponentPublicInstance, VNode } from 'vue';
 import type { TabsRootProps, TabsRootEmits } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/tabs';
@@ -70,17 +71,17 @@ type SlotProps<T extends TabsItem> = (props: {
     item: T;
     index: number;
     b24ui: Tabs['b24ui'];
-}) => any;
+}) => VNode[];
 export type TabsSlots<T extends TabsItem = TabsItem> = {
-    'leading': SlotProps<T>;
-    'default'(props: {
+    'leading'?: SlotProps<T>;
+    'default'?(props: {
         item: T;
         index: number;
-    }): any;
-    'trailing': SlotProps<T>;
-    'content': SlotProps<T>;
-    'list-leading'(props?: {}): any;
-    'list-trailing'(props?: {}): any;
+    }): VNode[];
+    'trailing'?: SlotProps<T>;
+    'content'?: SlotProps<T>;
+    'list-leading'?(props?: {}): VNode[];
+    'list-trailing'?(props?: {}): VNode[];
 } & DynamicSlots<T, undefined, {
     index: number;
     b24ui: Tabs['b24ui'];
@@ -94,7 +95,7 @@ declare const __VLS_export: <T extends TabsItem>(__VLS_props: NonNullable<Awaite
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
     expose: (exposed: import("vue").ShallowUnwrapRef<{
-        triggersRef: import("vue").Ref<any[], any[]>;
+        triggersRef: import("vue").Ref<ComponentPublicInstance[], ComponentPublicInstance[]>;
     }>) => void;
     attrs: any;
     slots: TabsSlots<T>;

package/dist/runtime/components/Tabs.vue

@@ -7,6 +7,7 @@ import { ref, computed } from "vue";
 import { TabsRoot, TabsList, TabsIndicator, TabsTrigger, TabsContent, useForwardPropsEmits } from "reka-ui";
 import { reactivePick } from "@vueuse/core";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../composables/useComponentUI";
 import { get } from "../utils";
 import { tv } from "../utils/tv";
 import B24Avatar from "./Avatar.vue";
@@ -30,6 +31,7 @@ const props = defineProps({
 const emits = defineEmits(["update:modelValue"]);
 const slots = defineSlots();
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("tabs", props);
 const rootProps = useForwardPropsEmits(reactivePick(props, "as", "unmountOnHide"), emits);
 const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.tabs || {} })({
   variant: props.variant,
@@ -37,6 +39,9 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.tabs ||
   orientation: props.orientation
 }));
 const triggersRef = ref([]);
+function setTriggerRef(index, el) {
+  triggersRef.value[index] = el;
+}
 defineExpose({
   triggersRef
 });
@@ -50,39 +55,39 @@ defineExpose({
     :orientation="orientation"
     :activation-mode="activationMode"
     data-slot="root"
-    :class="b24ui.root({ class: [props.b24ui?.root, props.class] })"
+    :class="b24ui.root({ class: [uiProp?.root, props.class] })"
   >
-    <TabsList data-slot="list" :class="b24ui.list({ class: props.b24ui?.list })">
-      <TabsIndicator data-slot="indicator" :class="b24ui.indicator({ class: props.b24ui?.indicator })" />
+    <TabsList data-slot="list" :class="b24ui.list({ class: uiProp?.list })">
+      <TabsIndicator data-slot="indicator" :class="b24ui.indicator({ class: uiProp?.indicator })" />
 
       <slot name="list-leading" />
 
       <TabsTrigger
         v-for="(item, index) of items"
         :key="index"
-        :ref="(el) => triggersRef[index] = el"
+        :ref="(el) => setTriggerRef(index, el)"
         :value="get(item, props.valueKey) ?? String(index)"
         :disabled="item.disabled"
         data-slot="trigger"
-        :class="b24ui.trigger({ class: [props.b24ui?.trigger, item.b24ui?.trigger] })"
+        :class="b24ui.trigger({ class: [uiProp?.trigger, item.b24ui?.trigger] })"
       >
         <slot name="leading" :item="item" :index="index" :b24ui="b24ui">
           <Component
             :is="item.icon"
             v-if="item.icon"
             data-slot="leadingIcon"
-            :class="b24ui.leadingIcon({ class: [props.b24ui?.leadingIcon, item.b24ui?.leadingIcon] })"
+            :class="b24ui.leadingIcon({ class: [uiProp?.leadingIcon, item.b24ui?.leadingIcon] })"
           />
           <B24Avatar
             v-else-if="item.avatar"
-            :size="item.b24ui?.leadingAvatarSize || props.b24ui?.leadingAvatarSize || b24ui.leadingAvatarSize()"
+            :size="item.b24ui?.leadingAvatarSize || uiProp?.leadingAvatarSize || b24ui.leadingAvatarSize()"
             v-bind="item.avatar"
             data-slot="leadingAvatar"
-            :class="b24ui.leadingAvatar({ class: [props.b24ui?.leadingAvatar, item.b24ui?.leadingAvatar] })"
+            :class="b24ui.leadingAvatar({ class: [uiProp?.leadingAvatar, item.b24ui?.leadingAvatar] })"
           />
         </slot>
 
-        <span v-if="get(item, props.labelKey) || !!slots.default" data-slot="label" :class="b24ui.label({ class: [props.b24ui?.label, item.b24ui?.label] })">
+        <span v-if="get(item, props.labelKey) || !!slots.default" data-slot="label" :class="b24ui.label({ class: [uiProp?.label, item.b24ui?.label] })">
           <slot :item="item" :index="index">{{ get(item, props.labelKey) }}</slot>
         </span>
 
@@ -90,10 +95,10 @@ defineExpose({
           <B24Badge
             v-if="item.badge || item.badge === 0"
             color="air-primary"
-            :size="item.b24ui?.trailingBadgeSize || props.b24ui?.trailingBadgeSize || b24ui.trailingBadgeSize()"
+            :size="item.b24ui?.trailingBadgeSize || uiProp?.trailingBadgeSize || b24ui.trailingBadgeSize()"
             v-bind="typeof item.badge === 'string' || typeof item.badge === 'number' ? { label: item.badge } : item.badge"
             data-slot="trailingBadge"
-            :class="b24ui.trailingBadge({ class: [props.b24ui?.trailingBadge, item.b24ui?.trailingBadge] })"
+            :class="b24ui.trailingBadge({ class: [uiProp?.trailingBadge, item.b24ui?.trailingBadge] })"
           />
         </slot>
       </TabsTrigger>
@@ -107,7 +112,7 @@ defineExpose({
         :key="index"
         :value="get(item, props.valueKey) ?? String(index)"
         data-slot="content"
-        :class="b24ui.content({ class: [props.b24ui?.content, item.b24ui?.content, item.class] })"
+        :class="b24ui.content({ class: [uiProp?.content, item.b24ui?.content, item.class] })"
       >
         <slot
           :name="item.slot || 'content'"

package/dist/runtime/components/Tabs.vue.d.ts

@@ -1,3 +1,4 @@
+import type { ComponentPublicInstance, VNode } from 'vue';
 import type { TabsRootProps, TabsRootEmits } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/tabs';
@@ -70,17 +71,17 @@ type SlotProps<T extends TabsItem> = (props: {
     item: T;
     index: number;
     b24ui: Tabs['b24ui'];
-}) => any;
+}) => VNode[];
 export type TabsSlots<T extends TabsItem = TabsItem> = {
-    'leading': SlotProps<T>;
-    'default'(props: {
+    'leading'?: SlotProps<T>;
+    'default'?(props: {
         item: T;
         index: number;
-    }): any;
-    'trailing': SlotProps<T>;
-    'content': SlotProps<T>;
-    'list-leading'(props?: {}): any;
-    'list-trailing'(props?: {}): any;
+    }): VNode[];
+    'trailing'?: SlotProps<T>;
+    'content'?: SlotProps<T>;
+    'list-leading'?(props?: {}): VNode[];
+    'list-trailing'?(props?: {}): VNode[];
 } & DynamicSlots<T, undefined, {
     index: number;
     b24ui: Tabs['b24ui'];
@@ -94,7 +95,7 @@ declare const __VLS_export: <T extends TabsItem>(__VLS_props: NonNullable<Awaite
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
     expose: (exposed: import("vue").ShallowUnwrapRef<{
-        triggersRef: import("vue").Ref<any[], any[]>;
+        triggersRef: import("vue").Ref<ComponentPublicInstance[], ComponentPublicInstance[]>;
     }>) => void;
     attrs: any;
     slots: TabsSlots<T>;

package/dist/runtime/components/Textarea.d.vue.ts

@@ -1,13 +1,14 @@
+import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/textarea';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
 import type { BadgeProps } from '../types';
 import type { TextareaHTMLAttributes } from '../types/html';
-import type { ModelModifiers } from '../types/input';
+import type { ModelModifiers, ApplyModifiers } from '../types/input';
 import type { ComponentConfig } from '../types/tv';
 type Textarea = ComponentConfig<typeof theme, AppConfig, 'textarea'>;
 type TextareaValue = string | number | null;
-export interface TextareaProps<T extends TextareaValue = TextareaValue> extends UseComponentIconsProps, /** @vue-ignore */ Omit<TextareaHTMLAttributes, 'name' | 'placeholder' | 'required' | 'autofocus' | 'disabled' | 'rows'> {
+export interface TextareaProps<T extends TextareaValue = TextareaValue, Mod extends ModelModifiers = ModelModifiers> extends UseComponentIconsProps, /** @vue-ignore */ Omit<TextareaHTMLAttributes, 'name' | 'placeholder' | 'required' | 'autofocus' | 'disabled' | 'rows'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'div'
@@ -59,35 +60,57 @@ export interface TextareaProps<T extends TextareaValue = TextareaValue> extends
     tagColor?: BadgeProps['color'];
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
-    modelValue?: T;
-    defaultValue?: T;
-    modelModifiers?: ModelModifiers<T>;
+    /** Keep the mobile text size on all breakpoints. (Left for backward compatibility.) */
+    fixed?: boolean;
+    defaultValue?: ApplyModifiers<T, Mod>;
+    modelValue?: ApplyModifiers<T, Mod>;
+    modelModifiers?: Mod;
     class?: any;
     b24ui?: Textarea['slots'];
 }
-export interface TextareaEmits<T extends TextareaValue = TextareaValue> {
-    'update:modelValue': [value: T];
+export interface TextareaEmits<T extends TextareaValue = TextareaValue, Mod extends ModelModifiers = ModelModifiers> {
+    'update:modelValue': [value: ApplyModifiers<T, Mod>];
     'blur': [event: FocusEvent];
     'change': [event: Event];
 }
 export interface TextareaSlots {
-    leading(props: {
+    leading?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
-    default(props: {
+    }): VNode[];
+    default?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
-    trailing(props: {
+    }): VNode[];
+    trailing?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
+    }): VNode[];
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: <T extends TextareaValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: import("vue").PublicProps & __VLS_PrettifyLocal<TextareaProps<T> & {
+declare const __VLS_export: <T extends TextareaValue, Mod extends ModelModifiers = ModelModifiers>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<TextareaProps<T, Mod> & {
         onBlur?: ((event: FocusEvent) => any) | undefined;
         onChange?: ((event: Event) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: T) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: Mod extends {
+            number: true;
+        } ? (Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) extends infer T_1 ? T_1 extends (Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) ? T_1 extends string ? number | T_1 : T_1 : never : never : Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -96,7 +119,27 @@ declare const __VLS_export: <T extends TextareaValue>(__VLS_props: NonNullable<A
     }>) => void;
     attrs: any;
     slots: TextareaSlots;
-    emit: ((evt: "blur", event: FocusEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: T) => void);
+    emit: ((evt: "blur", event: FocusEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: Mod extends {
+        number: true;
+    } ? (Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) extends infer T_1 ? T_1 extends (Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) ? T_1 extends string ? number | T_1 : T_1 : never : never : Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) => void);
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/runtime/components/Textarea.vue

@@ -7,6 +7,7 @@ import { useTemplateRef, computed, onMounted, nextTick, watch } from "vue";
 import { Primitive } from "reka-ui";
 import { useVModel } from "@vueuse/core";
 import { useAppConfig } from "#imports";
+import { useComponentUI } from "../composables/useComponentUI";
 import { useComponentIcons } from "../composables/useComponentIcons";
 import { useFormField } from "../composables/useFormField";
 import { looseToNumber } from "../utils";
@@ -31,13 +32,14 @@ const props = defineProps({
   autoresizeDelay: { type: Number, required: false, default: 0 },
   disabled: { type: Boolean, required: false },
   rows: { type: Number, required: false, default: 3 },
-  maxrows: { type: Number, required: false },
+  maxrows: { type: Number, required: false, default: 0 },
   tag: { type: String, required: false },
   tagColor: { type: null, required: false },
   highlight: { type: Boolean, required: false },
-  modelValue: { type: null, required: false },
+  fixed: { type: Boolean, required: false },
   defaultValue: { type: null, required: false },
-  modelModifiers: { type: Object, required: false },
+  modelValue: { type: null, required: false },
+  modelModifiers: { type: null, required: false },
   class: { type: null, required: false },
   b24ui: { type: Object, required: false },
   icon: { type: [Function, Object], required: false },
@@ -50,6 +52,7 @@ const emits = defineEmits(["update:modelValue", "blur", "change"]);
 const slots = defineSlots();
 const modelValue = useVModel(props, "modelValue", emits, { defaultValue: props.defaultValue });
 const appConfig = useAppConfig();
+const uiProp = useComponentUI("textarea", props);
 const { emitFormFocus, emitFormBlur, emitFormInput, emitFormChange, color, id, name, highlight, disabled, ariaAttrs } = useFormField(props, { deferInputValidation: true });
 const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponentIcons(props);
 const isTag = computed(() => {
@@ -60,6 +63,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.textare
   // size: size?.value,
   loading: props.loading,
   highlight: highlight.value,
+  fixed: props.fixed,
   autoresize: Boolean(props.autoresize),
   rounded: Boolean(props.rounded),
   noPadding: Boolean(props.noPadding),
@@ -70,7 +74,7 @@ const b24ui = computed(() => tv({ extend: tv(theme), ...appConfig.b24ui?.textare
 }));
 const textareaRef = useTemplateRef("textareaRef");
 function updateInput(value) {
-  if (props.modelModifiers?.trim) {
+  if (props.modelModifiers?.trim && (typeof value === "string" || value === null || value === void 0)) {
     value = value?.trim() ?? null;
   }
   if (props.modelModifiers?.number) {
@@ -79,7 +83,7 @@ function updateInput(value) {
   if (props.modelModifiers?.nullable) {
     value ||= null;
   }
-  if (props.modelModifiers?.optional) {
+  if (props.modelModifiers?.optional && !props.modelModifiers?.nullable && value !== null) {
     value ||= void 0;
   }
   modelValue.value = value;
@@ -146,11 +150,11 @@ defineExpose({
 </script>
 
 <template>
-  <Primitive :as="as" data-slot="root" :class="b24ui.root({ class: [props.b24ui?.root, props.class] })">
+  <Primitive :as="as" data-slot="root" :class="b24ui.root({ class: [uiProp?.root, props.class] })">
     <B24Badge
       v-if="isTag"
       data-slot="tag"
-      :class="b24ui.tag({ class: props.b24ui?.tag })"
+      :class="b24ui.tag({ class: uiProp?.tag })"
       :color="props.tagColor"
       :label="props.tag"
       size="xs"
@@ -164,7 +168,7 @@ defineExpose({
       :rows="rows"
       :placeholder="placeholder"
       data-slot="base"
-      :class="b24ui.base({ class: props.b24ui?.base })"
+      :class="b24ui.base({ class: uiProp?.base })"
       :disabled="disabled"
       :required="required"
       v-bind="{ ...$attrs, ...ariaAttrs }"
@@ -176,31 +180,31 @@ defineExpose({
 
     <slot :b24ui="b24ui" />
 
-    <span v-if="isLeading || !!avatar || !!slots.leading" data-slot="leading" :class="b24ui.leading({ class: props.b24ui?.leading })">
+    <span v-if="isLeading || !!avatar || !!slots.leading" data-slot="leading" :class="b24ui.leading({ class: uiProp?.leading })">
       <slot name="leading" :b24ui="b24ui">
         <Component
           :is="leadingIconName"
           v-if="isLeading && leadingIconName"
           data-slot="leadingIcon"
-          :class="b24ui.leadingIcon({ class: props.b24ui?.leadingIcon })"
+          :class="b24ui.leadingIcon({ class: uiProp?.leadingIcon })"
         />
         <B24Avatar
           v-else-if="!!avatar"
-          :size="props.b24ui?.leadingAvatarSize || b24ui.leadingAvatarSize()"
+          :size="uiProp?.leadingAvatarSize || b24ui.leadingAvatarSize()"
           v-bind="avatar"
           data-slot="leadingAvatar"
-          :class="b24ui.leadingAvatar({ class: props.b24ui?.leadingAvatar })"
+          :class="b24ui.leadingAvatar({ class: uiProp?.leadingAvatar })"
         />
       </slot>
     </span>
 
-    <span v-if="isTrailing || !!slots.trailing" data-slot="trailing" :class="b24ui.trailing({ class: props.b24ui?.trailing })">
+    <span v-if="isTrailing || !!slots.trailing" data-slot="trailing" :class="b24ui.trailing({ class: uiProp?.trailing })">
       <slot name="trailing" :b24ui="b24ui">
         <Component
           :is="trailingIconName"
           v-if="trailingIconName"
           data-slot="trailingIcon"
-          :class="b24ui.trailingIcon({ class: props.b24ui?.trailingIcon })"
+          :class="b24ui.trailingIcon({ class: uiProp?.trailingIcon })"
         />
       </slot>
     </span>

package/dist/runtime/components/Textarea.vue.d.ts

@@ -1,13 +1,14 @@
+import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/textarea';
 import type { UseComponentIconsProps } from '../composables/useComponentIcons';
 import type { BadgeProps } from '../types';
 import type { TextareaHTMLAttributes } from '../types/html';
-import type { ModelModifiers } from '../types/input';
+import type { ModelModifiers, ApplyModifiers } from '../types/input';
 import type { ComponentConfig } from '../types/tv';
 type Textarea = ComponentConfig<typeof theme, AppConfig, 'textarea'>;
 type TextareaValue = string | number | null;
-export interface TextareaProps<T extends TextareaValue = TextareaValue> extends UseComponentIconsProps, /** @vue-ignore */ Omit<TextareaHTMLAttributes, 'name' | 'placeholder' | 'required' | 'autofocus' | 'disabled' | 'rows'> {
+export interface TextareaProps<T extends TextareaValue = TextareaValue, Mod extends ModelModifiers = ModelModifiers> extends UseComponentIconsProps, /** @vue-ignore */ Omit<TextareaHTMLAttributes, 'name' | 'placeholder' | 'required' | 'autofocus' | 'disabled' | 'rows'> {
     /**
      * The element or component this component should render as.
      * @defaultValue 'div'
@@ -59,35 +60,57 @@ export interface TextareaProps<T extends TextareaValue = TextareaValue> extends
     tagColor?: BadgeProps['color'];
     /** Highlight the ring color like a focus state. */
     highlight?: boolean;
-    modelValue?: T;
-    defaultValue?: T;
-    modelModifiers?: ModelModifiers<T>;
+    /** Keep the mobile text size on all breakpoints. (Left for backward compatibility.) */
+    fixed?: boolean;
+    defaultValue?: ApplyModifiers<T, Mod>;
+    modelValue?: ApplyModifiers<T, Mod>;
+    modelModifiers?: Mod;
     class?: any;
     b24ui?: Textarea['slots'];
 }
-export interface TextareaEmits<T extends TextareaValue = TextareaValue> {
-    'update:modelValue': [value: T];
+export interface TextareaEmits<T extends TextareaValue = TextareaValue, Mod extends ModelModifiers = ModelModifiers> {
+    'update:modelValue': [value: ApplyModifiers<T, Mod>];
     'blur': [event: FocusEvent];
     'change': [event: Event];
 }
 export interface TextareaSlots {
-    leading(props: {
+    leading?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
-    default(props: {
+    }): VNode[];
+    default?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
-    trailing(props: {
+    }): VNode[];
+    trailing?(props: {
         b24ui: Textarea['b24ui'];
-    }): any;
+    }): VNode[];
 }
 declare const _default: typeof __VLS_export;
 export default _default;
-declare const __VLS_export: <T extends TextareaValue>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: import("vue").PublicProps & __VLS_PrettifyLocal<TextareaProps<T> & {
+declare const __VLS_export: <T extends TextareaValue, Mod extends ModelModifiers = ModelModifiers>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import("vue").PublicProps & __VLS_PrettifyLocal<TextareaProps<T, Mod> & {
         onBlur?: ((event: FocusEvent) => any) | undefined;
         onChange?: ((event: Event) => any) | undefined;
-        "onUpdate:modelValue"?: ((value: T) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: Mod extends {
+            number: true;
+        } ? (Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) extends infer T_1 ? T_1 extends (Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) ? T_1 extends string ? number | T_1 : T_1 : never : never : Mod extends {
+            optional: true;
+        } ? (Mod extends {
+            nullable: true;
+        } ? T | null : T) | undefined : Mod extends {
+            nullable: true;
+        } ? T | null : T) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -96,7 +119,27 @@ declare const __VLS_export: <T extends TextareaValue>(__VLS_props: NonNullable<A
     }>) => void;
     attrs: any;
     slots: TextareaSlots;
-    emit: ((evt: "blur", event: FocusEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: T) => void);
+    emit: ((evt: "blur", event: FocusEvent) => void) & ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: Mod extends {
+        number: true;
+    } ? (Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) extends infer T_1 ? T_1 extends (Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) ? T_1 extends string ? number | T_1 : T_1 : never : never : Mod extends {
+        optional: true;
+    } ? (Mod extends {
+        nullable: true;
+    } ? T | null : T) | undefined : Mod extends {
+        nullable: true;
+    } ? T | null : T) => void);
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/runtime/components/Theme.d.vue.ts

@@ -0,0 +1,18 @@
+import type { VNode } from 'vue';
+import type { ThemeUI } from '../composables/useComponentUI';
+export interface ThemeProps {
+    b24ui: ThemeUI;
+}
+export interface ThemeSlots {
+    default?(props?: {}): VNode[];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ThemeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ThemeProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Theme.vue

@@ -0,0 +1,17 @@
+<script>
+import { computed } from "vue";
+import { provideThemeContext } from "../composables/useComponentUI";
+</script>
+
+<script setup>
+const props = defineProps({
+  b24ui: { type: null, required: true }
+});
+provideThemeContext({
+  b24ui: computed(() => props.b24ui)
+});
+</script>
+
+<template>
+  <slot />
+</template>

package/dist/runtime/components/Theme.vue.d.ts

@@ -0,0 +1,18 @@
+import type { VNode } from 'vue';
+import type { ThemeUI } from '../composables/useComponentUI';
+export interface ThemeProps {
+    b24ui: ThemeUI;
+}
+export interface ThemeSlots {
+    default?(props?: {}): VNode[];
+}
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<ThemeProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ThemeProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Timeline.d.vue.ts

@@ -1,3 +1,4 @@
+import type { VNode } from 'vue';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/b24ui/timeline';
 import type { AvatarProps, IconComponent } from '../types';
@@ -48,16 +49,16 @@ export interface TimelineProps<T extends TimelineItem = TimelineItem> {
 }
 type SlotProps<T extends TimelineItem> = (props: {
     item: T;
-}) => any;
+}) => VNode[];
 export interface TimelineEmits<T extends TimelineItem = TimelineItem> {
     select: [event: Event, item: T];
 }
 export type TimelineSlots<T extends TimelineItem = TimelineItem> = {
-    indicator: SlotProps<T>;
-    wrapper: SlotProps<T>;
-    date: SlotProps<T>;
-    title: SlotProps<T>;
-    description: SlotProps<T>;
+    indicator?: SlotProps<T>;
+    wrapper?: SlotProps<T>;
+    date?: SlotProps<T>;
+    title?: SlotProps<T>;
+    description?: SlotProps<T>;
 } & DynamicSlots<T, 'indicator' | 'wrapper' | 'date' | 'title' | 'description', {
     item: T;
 }>;