@nuxt/ui 4.0.0-alpha.0 → 4.0.0-alpha.2

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

@@ -0,0 +1,108 @@
+import type { DialogRootProps, DialogRootEmits, DialogContentProps, DialogContentEmits } from 'reka-ui';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/slideover';
+import type { ButtonProps, IconProps } from '../types';
+import type { EmitsToProps } from '../types/utils';
+import type { ComponentConfig } from '../types/tv';
+type Slideover = ComponentConfig<typeof theme, AppConfig, 'slideover'>;
+export interface SlideoverProps extends DialogRootProps {
+    title?: string;
+    description?: string;
+    /** The content of the slideover. */
+    content?: Omit<DialogContentProps, 'as' | 'asChild' | 'forceMount'> & Partial<EmitsToProps<DialogContentEmits>>;
+    /**
+     * Render an overlay behind the slideover.
+     * @defaultValue true
+     */
+    overlay?: boolean;
+    /**
+     * Animate the slideover when opening or closing.
+     * @defaultValue true
+     */
+    transition?: boolean;
+    /**
+     * The side of the slideover.
+     * @defaultValue 'right'
+     */
+    side?: Slideover['variants']['side'];
+    /**
+     * Render the slideover in a portal.
+     * @defaultValue true
+     */
+    portal?: boolean | string | HTMLElement;
+    /**
+     * Display a close button to dismiss the slideover.
+     * `{ size: 'md', color: 'neutral', variant: 'ghost' }`{lang="ts-type"}
+     * @defaultValue true
+     */
+    close?: boolean | Partial<ButtonProps>;
+    /**
+     * The icon displayed in the close button.
+     * @defaultValue appConfig.ui.icons.close
+     * @IconifyIcon
+     */
+    closeIcon?: IconProps['name'];
+    /**
+     * When `false`, the slideover will not close when clicking outside or pressing escape.
+     * @defaultValue true
+     */
+    dismissible?: boolean;
+    class?: any;
+    ui?: Slideover['slots'];
+}
+export interface SlideoverEmits extends DialogRootEmits {
+    'after:leave': [];
+    'after:enter': [];
+    'close:prevent': [];
+}
+export interface SlideoverSlots {
+    default(props: {
+        open: boolean;
+    }): any;
+    content(props: {
+        close: () => void;
+    }): any;
+    header(props: {
+        close: () => void;
+    }): any;
+    title(props?: {}): any;
+    description(props?: {}): any;
+    actions(props?: {}): any;
+    close(props: {
+        close: () => void;
+        ui: {
+            [K in keyof Required<Slideover['slots']>]: (props?: Record<string, any>) => string;
+        };
+    }): any;
+    body(props: {
+        close: () => void;
+    }): any;
+    footer(props: {
+        close: () => void;
+    }): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SlideoverProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:open": (value: boolean) => any;
+    "after:leave": () => any;
+    "after:enter": () => any;
+    "close:prevent": () => any;
+}, string, import("vue").PublicProps, Readonly<SlideoverProps> & Readonly<{
+    "onUpdate:open"?: ((value: boolean) => any) | undefined;
+    "onAfter:leave"?: (() => any) | undefined;
+    "onAfter:enter"?: (() => any) | undefined;
+    "onClose:prevent"?: (() => any) | undefined;
+}>, {
+    close: boolean | Partial<ButtonProps>;
+    modal: boolean;
+    transition: boolean;
+    portal: boolean | string | HTMLElement;
+    overlay: boolean;
+    side: Slideover["variants"]["side"];
+    dismissible: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, SlideoverSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Slideover.vue

@@ -20,7 +20,7 @@ const props = defineProps({
   side: { type: null, required: false, default: "right" },
   portal: { type: [Boolean, String], required: false, skipCheck: true, default: true },
   close: { type: [Boolean, Object], required: false, default: true },
-  closeIcon: { type: String, required: false },
+  closeIcon: { type: [String, Object], required: false },
   dismissible: { type: Boolean, required: false, default: true },
   class: { type: null, required: false },
   ui: { type: null, required: false },

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

@@ -1,7 +1,7 @@
 import type { DialogRootProps, DialogRootEmits, DialogContentProps, DialogContentEmits } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/slideover';
-import type { ButtonProps } from '../types';
+import type { ButtonProps, IconProps } from '../types';
 import type { EmitsToProps } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Slideover = ComponentConfig<typeof theme, AppConfig, 'slideover'>;
@@ -41,7 +41,7 @@ export interface SlideoverProps extends DialogRootProps {
      * @defaultValue appConfig.ui.icons.close
      * @IconifyIcon
      */
-    closeIcon?: string;
+    closeIcon?: IconProps['name'];
     /**
      * When `false`, the slideover will not close when clicking outside or pressing escape.
      * @defaultValue true
@@ -81,7 +81,7 @@ export interface SlideoverSlots {
         close: () => void;
     }): any;
 }
-declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SlideoverProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SlideoverProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     "update:open": (value: boolean) => any;
     "after:leave": () => any;
     "after:enter": () => any;

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

@@ -0,0 +1,57 @@
+import type { SliderRootProps } from 'reka-ui';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/slider';
+import type { TooltipProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type Slider = ComponentConfig<typeof theme, AppConfig, 'slider'>;
+export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' | 'inverted' | 'min' | 'max' | 'step' | 'minStepsBetweenThumbs'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    /**
+     * @defaultValue 'md'
+     */
+    size?: Slider['variants']['size'];
+    /**
+     * @defaultValue 'primary'
+     */
+    color?: Slider['variants']['color'];
+    /**
+     * The orientation of the slider.
+     * @defaultValue 'horizontal'
+     */
+    orientation?: SliderRootProps['orientation'];
+    /**
+     * Display a tooltip around the slider thumbs with the current value.
+     * `{ disableClosingTrigger: true }`{lang="ts-type"}
+     * @defaultValue false
+     */
+    tooltip?: boolean | TooltipProps;
+    /** The value of the slider when initially rendered. Use when you do not need to control the state of the slider. */
+    defaultValue?: number | number[];
+    class?: any;
+    ui?: Slider['slots'];
+}
+export interface SliderEmits {
+    change: [event: Event];
+}
+declare const _default: <T extends number | number[]>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onChange?: ((event: Event) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value: T | undefined) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onChange" | "onUpdate:modelValue"> & (SliderProps & {
+        modelValue?: T;
+    }) & {}> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
+    attrs: any;
+    slots: {};
+    emit: ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: T | undefined) => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

package/dist/runtime/components/Slider.vue

@@ -27,7 +27,7 @@ const props = defineProps({
   step: { type: Number, required: false, default: 1 },
   minStepsBetweenThumbs: { type: Number, required: false }
 });
-const emits = defineEmits(["update:modelValue", "change"]);
+const emits = defineEmits(["change"]);
 const modelValue = defineModel({ type: null });
 const appConfig = useAppConfig();
 const rootProps = useForwardPropsEmits(reactivePick(props, "as", "orientation", "min", "max", "step", "minStepsBetweenThumbs", "inverted"), emits);

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

@@ -34,21 +34,20 @@ export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' |
     class?: any;
     ui?: Slider['slots'];
 }
-export interface SliderEmits<T extends number | number[] = number | number[]> {
-    'update:modelValue': [payload: T];
-    'change': [payload: Event];
+export interface SliderEmits {
+    change: [event: Event];
 }
 declare const _default: <T extends number | number[]>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly onChange?: ((payload: Event) => any) | undefined;
-        readonly "onUpdate:modelValue"?: ((...args: unknown[]) => any) | undefined;
+        readonly onChange?: ((event: Event) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value: T | undefined) => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onChange" | "onUpdate:modelValue"> & (SliderProps & {
         modelValue?: T;
-    }) & Partial<{}>> & import("vue").PublicProps;
+    }) & {}> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
     attrs: any;
     slots: {};
-    emit: (((evt: "change", payload: Event) => void) & ((evt: "update:modelValue", payload: T) => void)) & ((evt: "update:modelValue", value: T | undefined) => void);
+    emit: ((evt: "change", event: Event) => void) & ((evt: "update:modelValue", value: T | undefined) => void);
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

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

@@ -0,0 +1,87 @@
+import type { StepperRootProps, StepperRootEmits } from 'reka-ui';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/stepper';
+import type { IconProps } from '../types';
+import type { DynamicSlots } from '../types/utils';
+import type { ComponentConfig } from '../types/tv';
+type Stepper = ComponentConfig<typeof theme, AppConfig, 'stepper'>;
+export interface StepperItem {
+    slot?: string;
+    value?: string | number;
+    title?: string;
+    description?: string;
+    /**
+     * @IconifyIcon
+     */
+    icon?: IconProps['name'];
+    content?: string;
+    disabled?: boolean;
+    class?: any;
+    ui?: Pick<Stepper['slots'], 'item' | 'container' | 'trigger' | 'indicator' | 'icon' | 'separator' | 'wrapper' | 'title' | 'description'>;
+    [key: string]: any;
+}
+export interface StepperProps<T extends StepperItem = StepperItem> extends Pick<StepperRootProps, 'linear'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    items: T[];
+    /**
+     * @defaultValue 'md'
+     */
+    size?: Stepper['variants']['size'];
+    /**
+     * @defaultValue 'primary'
+     */
+    color?: Stepper['variants']['color'];
+    /**
+     * The orientation of the stepper.
+     * @defaultValue 'horizontal'
+     */
+    orientation?: Stepper['variants']['orientation'];
+    /**
+     * The value of the step that should be active when initially rendered. Use when you do not need to control the state of the steps.
+     */
+    defaultValue?: string | number;
+    disabled?: boolean;
+    class?: any;
+    ui?: Stepper['slots'];
+}
+export type StepperEmits<T extends StepperItem = StepperItem> = Omit<StepperRootEmits, 'update:modelValue'> & {
+    next: [value: T];
+    prev: [value: T];
+};
+type SlotProps<T extends StepperItem> = (props: {
+    item: T;
+}) => any;
+export type StepperSlots<T extends StepperItem = StepperItem> = {
+    indicator: SlotProps<T>;
+    title: SlotProps<T>;
+    description: SlotProps<T>;
+    content: SlotProps<T>;
+} & DynamicSlots<T>;
+declare const _default: <T extends StepperItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
+        readonly onNext?: ((value: T) => any) | undefined;
+        readonly onPrev?: ((value: T) => any) | undefined;
+        readonly "onUpdate:modelValue"?: ((value: string | number | undefined) => any) | undefined;
+    } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onNext" | "onPrev"> & (StepperProps<T> & {
+        modelValue?: string | number;
+    }) & {}> & import("vue").PublicProps;
+    expose(exposed: import("vue").ShallowUnwrapRef<{
+        next(): void;
+        prev(): void;
+        hasNext: import("vue").ComputedRef<boolean>;
+        hasPrev: import("vue").ComputedRef<boolean>;
+    }>): void;
+    attrs: any;
+    slots: StepperSlots<T>;
+    emit: (((evt: "next", value: T) => void) & ((evt: "prev", value: T) => void)) & ((evt: "update:modelValue", value: string | number | undefined) => void);
+}>) => import("vue").VNode & {
+    __ctx?: Awaited<typeof __VLS_setup>;
+};
+export default _default;
+type __VLS_PrettifyLocal<T> = {
+    [K in keyof T as K]: T[K];
+} & {};

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

@@ -1,6 +1,7 @@
 import type { StepperRootProps, StepperRootEmits } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/stepper';
+import type { IconProps } from '../types';
 import type { DynamicSlots } from '../types/utils';
 import type { ComponentConfig } from '../types/tv';
 type Stepper = ComponentConfig<typeof theme, AppConfig, 'stepper'>;
@@ -12,7 +13,7 @@ export interface StepperItem {
     /**
      * @IconifyIcon
      */
-    icon?: string;
+    icon?: IconProps['name'];
     content?: string;
     disabled?: boolean;
     class?: any;
@@ -48,8 +49,8 @@ export interface StepperProps<T extends StepperItem = StepperItem> extends Pick<
     ui?: Stepper['slots'];
 }
 export type StepperEmits<T extends StepperItem = StepperItem> = Omit<StepperRootEmits, 'update:modelValue'> & {
-    next: [payload: T];
-    prev: [payload: T];
+    next: [value: T];
+    prev: [value: T];
 };
 type SlotProps<T extends StepperItem> = (props: {
     item: T;
@@ -62,12 +63,12 @@ export type StepperSlots<T extends StepperItem = StepperItem> = {
 } & DynamicSlots<T>;
 declare const _default: <T extends StepperItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
     props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
-        readonly onNext?: ((payload: T) => any) | undefined;
-        readonly onPrev?: ((payload: T) => any) | undefined;
+        readonly onNext?: ((value: T) => any) | undefined;
+        readonly onPrev?: ((value: T) => any) | undefined;
         readonly "onUpdate:modelValue"?: ((value: string | number | undefined) => any) | undefined;
     } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onUpdate:modelValue" | "onNext" | "onPrev"> & (StepperProps<T> & {
         modelValue?: string | number;
-    }) & Partial<{}>> & import("vue").PublicProps;
+    }) & {}> & import("vue").PublicProps;
     expose(exposed: import("vue").ShallowUnwrapRef<{
         next(): void;
         prev(): void;
@@ -76,7 +77,7 @@ declare const _default: <T extends StepperItem>(__VLS_props: NonNullable<Awaited
     }>): void;
     attrs: any;
     slots: StepperSlots<T>;
-    emit: (((evt: "next", payload: T) => void) & ((evt: "prev", payload: T) => void)) & ((evt: "update:modelValue", value: string | number | undefined) => void);
+    emit: (((evt: "next", value: T) => void) & ((evt: "prev", value: T) => void)) & ((evt: "update:modelValue", value: string | number | undefined) => void);
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

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

@@ -0,0 +1,71 @@
+import type { SwitchRootProps } from 'reka-ui';
+import type { AppConfig } from '@nuxt/schema';
+import theme from '#build/ui/switch';
+import type { IconProps } from '../types';
+import type { ComponentConfig } from '../types/tv';
+type Switch = ComponentConfig<typeof theme, AppConfig, 'switch'>;
+export interface SwitchProps extends Pick<SwitchRootProps, 'disabled' | 'id' | 'name' | 'required' | 'value' | 'defaultValue'> {
+    /**
+     * The element or component this component should render as.
+     * @defaultValue 'div'
+     */
+    as?: any;
+    /**
+     * @defaultValue 'primary'
+     */
+    color?: Switch['variants']['color'];
+    /**
+     * @defaultValue 'md'
+     */
+    size?: Switch['variants']['size'];
+    /** When `true`, the loading icon will be displayed. */
+    loading?: boolean;
+    /**
+     * The icon when the `loading` prop is `true`.
+     * @defaultValue appConfig.ui.icons.loading
+     * @IconifyIcon
+     */
+    loadingIcon?: IconProps['name'];
+    /**
+     * Display an icon when the switch is checked.
+     * @IconifyIcon
+     */
+    checkedIcon?: IconProps['name'];
+    /**
+     * Display an icon when the switch is unchecked.
+     * @IconifyIcon
+     */
+    uncheckedIcon?: IconProps['name'];
+    label?: string;
+    description?: string;
+    class?: any;
+    ui?: Switch['slots'];
+}
+export type SwitchEmits = {
+    change: [event: Event];
+};
+export interface SwitchSlots {
+    label(props: {
+        label?: string;
+    }): any;
+    description(props: {
+        description?: string;
+    }): any;
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SwitchProps & {
+    modelValue?: boolean;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (event: Event) => any;
+    "update:modelValue": (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<SwitchProps & {
+    modelValue?: boolean;
+}> & Readonly<{
+    onChange?: ((event: Event) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, SwitchSlots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/Switch.vue

@@ -16,9 +16,9 @@ const props = defineProps({
   color: { type: null, required: false },
   size: { type: null, required: false },
   loading: { type: Boolean, required: false },
-  loadingIcon: { type: String, required: false },
-  checkedIcon: { type: String, required: false },
-  uncheckedIcon: { type: String, required: false },
+  loadingIcon: { type: [String, Object], required: false },
+  checkedIcon: { type: [String, Object], required: false },
+  uncheckedIcon: { type: [String, Object], required: false },
   label: { type: String, required: false },
   description: { type: String, required: false },
   class: { type: null, required: false },

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

@@ -1,6 +1,7 @@
 import type { SwitchRootProps } from 'reka-ui';
 import type { AppConfig } from '@nuxt/schema';
 import theme from '#build/ui/switch';
+import type { IconProps } from '../types';
 import type { ComponentConfig } from '../types/tv';
 type Switch = ComponentConfig<typeof theme, AppConfig, 'switch'>;
 export interface SwitchProps extends Pick<SwitchRootProps, 'disabled' | 'id' | 'name' | 'required' | 'value' | 'defaultValue'> {
@@ -24,24 +25,24 @@ export interface SwitchProps extends Pick<SwitchRootProps, 'disabled' | 'id' | '
      * @defaultValue appConfig.ui.icons.loading
      * @IconifyIcon
      */
-    loadingIcon?: string;
+    loadingIcon?: IconProps['name'];
     /**
      * Display an icon when the switch is checked.
      * @IconifyIcon
      */
-    checkedIcon?: string;
+    checkedIcon?: IconProps['name'];
     /**
      * Display an icon when the switch is unchecked.
      * @IconifyIcon
      */
-    uncheckedIcon?: string;
+    uncheckedIcon?: IconProps['name'];
     label?: string;
     description?: string;
     class?: any;
     ui?: Switch['slots'];
 }
 export type SwitchEmits = {
-    change: [payload: Event];
+    change: [event: Event];
 };
 export interface SwitchSlots {
     label(props: {
@@ -53,13 +54,13 @@ export interface SwitchSlots {
 }
 declare const _default: __VLS_WithSlots<import("vue").DefineComponent<SwitchProps & {
     modelValue?: boolean;
-}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    change: (payload: Event) => any;
+}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (event: Event) => any;
     "update:modelValue": (value: boolean) => any;
 }, string, import("vue").PublicProps, Readonly<SwitchProps & {
     modelValue?: boolean;
 }> & Readonly<{
-    onChange?: ((payload: Event) => any) | undefined;
+    onChange?: ((event: Event) => any) | undefined;
     "onUpdate:modelValue"?: ((value: boolean) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, SwitchSlots>;
 export default _default;