nuance-ui 0.2.34 → 0.2.36

package/dist/runtime/components/dialog/ui/dialog-header.vue.d.ts

@@ -1,9 +1,9 @@
 import type { BoxProps } from '../../box.vue.js';
 export interface DialogHeaderProps extends BoxProps {
 }
-declare var __VLS_14: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<DialogHeaderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DialogHeaderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/dialog/ui/dialog-root.d.vue.ts

@@ -36,9 +36,9 @@ type __VLS_ModelProps = {
     'open'?: DialogModel['open'];
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_38: {};
+declare var __VLS_31: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_38) => any;
+    default?: (props: typeof __VLS_31) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;

package/dist/runtime/components/dialog/ui/dialog-root.vue

@@ -71,29 +71,27 @@ const style = computed(() => ({
 </script>
 
 <template>
-	<ClientOnly>
-		<Teleport :disabled='!withinPortal' :to='portalTarget'>
-			<Box
-				is='dialog'
-				ref='dialogRef'
-				:class='[css.root, classes?.root]'
-				:mod='[{ "without-overlay": withoutOverlay }, mod]'
-				:style
-				@click='overlayClick'
-				@close='$emit("close")'
-				@cancel.prevent='opened = false'
-			>
-				<NTransition :name='transition'>
-					<Box
-						is='section'
-						v-if='opened'
-						:class='[css.content, classes?.content]'
-						v-bind='$attrs'
-					>
-						<slot />
-					</Box>
-				</NTransition>
-			</Box>
-		</Teleport>
-	</ClientOnly>
+	<Teleport :disabled='!withinPortal' :to='portalTarget'>
+		<Box
+			is='dialog'
+			ref='dialogRef'
+			:class='[css.root, classes?.root]'
+			:mod='[{ "without-overlay": withoutOverlay }, mod]'
+			:style
+			@click='overlayClick'
+			@close='$emit("close")'
+			@cancel.prevent='opened = false'
+		>
+			<NTransition :name='transition'>
+				<Box
+					is='section'
+					v-if='opened'
+					:class='[css.content, classes?.content]'
+					v-bind='$attrs'
+				>
+					<slot />
+				</Box>
+			</NTransition>
+		</Box>
+	</Teleport>
 </template>

package/dist/runtime/components/dialog/ui/dialog-root.vue.d.ts

@@ -36,9 +36,9 @@ type __VLS_ModelProps = {
     'open'?: DialogModel['open'];
 };
 type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
-declare var __VLS_38: {};
+declare var __VLS_31: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_38) => any;
+    default?: (props: typeof __VLS_31) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     close: () => any;

package/dist/runtime/components/dialog/ui/dialog-section.d.vue.ts

@@ -2,9 +2,9 @@ import type { BoxProps } from '../../box.vue.js';
 export interface DialogSectionProps extends BoxProps {
     bordered?: boolean;
 }
-declare var __VLS_14: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<DialogSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DialogSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/dialog/ui/dialog-section.vue

@@ -9,9 +9,7 @@ const { is = "section", bordered, mod } = defineProps({
 </script>
 
 <template>
-	<ClientOnly>
-		<Box :is :mod='[{ bordered }, mod]' :class='css.section'>
-			<slot />
-		</Box>
-	</ClientOnly>
+	<Box :is :mod='[{ bordered }, mod]' :class='css.section'>
+		<slot />
+	</Box>
 </template>

package/dist/runtime/components/dialog/ui/dialog-section.vue.d.ts

@@ -2,9 +2,9 @@ import type { BoxProps } from '../../box.vue.js';
 export interface DialogSectionProps extends BoxProps {
     bordered?: boolean;
 }
-declare var __VLS_14: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<DialogSectionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DialogSectionProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/dialog/ui/dialog-title.d.vue.ts

@@ -1,9 +1,9 @@
 import type { TitleProps } from '../../title.vue.js';
 export interface DialogTitleProps extends TitleProps {
 }
-declare var __VLS_14: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<DialogTitleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DialogTitleProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/dialog/ui/dialog-title.vue

@@ -21,9 +21,7 @@ const { size = "md", lh = "1", ...props } = defineProps({
 </script>
 
 <template>
-	<ClientOnly>
-		<Title :class='css.title' :lh :size v-bind='props'>
-			<slot />
-		</Title>
-	</ClientOnly>
+	<Title :class='css.title' :lh :size v-bind='props'>
+		<slot />
+	</Title>
 </template>

package/dist/runtime/components/dialog/ui/dialog-title.vue.d.ts

@@ -1,9 +1,9 @@
 import type { TitleProps } from '../../title.vue.js';
 export interface DialogTitleProps extends TitleProps {
 }
-declare var __VLS_14: {};
+declare var __VLS_8: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_14) => any;
+    default?: (props: typeof __VLS_8) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<DialogTitleProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<DialogTitleProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -1,3 +1,4 @@
+export type * from './accordion.vue';
 export * from './action-icon/index.js';
 export * from './app-shell/index.js';
 export * from './avatar/index.js';
@@ -10,6 +11,7 @@ export * from './calendar/index.js';
 export * from './card/index.js';
 export * from './checkbox/index.js';
 export * from './chip/index.js';
+export * from './collapsible/index.js';
 export * from './combobox/index.js';
 export type * from './container.vue';
 export type * from './date-time-picker.vue';

package/dist/runtime/components/index.js

@@ -6,6 +6,7 @@ export * from "./calendar/index.js";
 export * from "./card/index.js";
 export * from "./checkbox/index.js";
 export * from "./chip/index.js";
+export * from "./collapsible/index.js";
 export * from "./combobox/index.js";
 export * from "./dialog/index.js";
 export * from "./drawer/index.js";

package/dist/runtime/components/link/lib.d.ts

@@ -1,5 +1,5 @@
 import type { NuxtLinkProps } from '#app';
 export declare function pickLinkProps<T extends NuxtLinkProps>(props: T): {
-    link: Pick<T, "replace" | "to" | "target" | "external" | "rel" | "noRel" | "prefetch" | "noPrefetch" | "prefetchOn" | "trailingSlash" | "activeClass" | "ariaCurrentValue" | "exactActiveClass" | "prefetchedClass" | "viewTransition">;
-    rest: Omit<T, "replace" | "to" | "target" | "external" | "rel" | "noRel" | "prefetch" | "noPrefetch" | "prefetchOn" | "trailingSlash" | "activeClass" | "ariaCurrentValue" | "exactActiveClass" | "prefetchedClass" | "viewTransition">;
+    link: Pick<T, "replace" | "target" | "to" | "external" | "rel" | "noRel" | "prefetch" | "noPrefetch" | "prefetchOn" | "trailingSlash" | "activeClass" | "ariaCurrentValue" | "exactActiveClass" | "prefetchedClass" | "viewTransition">;
+    rest: Omit<T, "replace" | "target" | "to" | "external" | "rel" | "noRel" | "prefetch" | "noPrefetch" | "prefetchOn" | "trailingSlash" | "activeClass" | "ariaCurrentValue" | "exactActiveClass" | "prefetchedClass" | "viewTransition">;
 };

package/dist/runtime/components/scroll-area.vue

@@ -1,6 +1,7 @@
 <script setup>
+import { useVarsResolver } from "@nui/composables";
+import { getSize } from "@nui/utils";
 import { useResizeObserver } from "@vueuse/core";
-import { getSize, useVarsResolver } from "#imports";
 import { computed, onBeforeUnmount, onMounted, ref, useTemplateRef } from "vue";
 import Box from "./box.vue";
 const {

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

@@ -40,8 +40,8 @@ declare const __VLS_export: <Value extends string = string, Ext extends Combobox
         onSubmit?: ((args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => any) | undefined;
         "onUpdate:modelValue"?: ((value: string | string[] | null) => any) | undefined;
         onOpen?: ((args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => any) | undefined;
-        "onUpdate:search"?: ((value: string) => any) | undefined;
         "onUpdate:open"?: ((value: boolean) => any) | undefined;
+        "onUpdate:search"?: ((value: string) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -63,7 +63,7 @@ declare const __VLS_export: <Value extends string = string, Ext extends Combobox
     } & {
         rightSection?: (props: {}) => any;
     };
-    emit: (((evt: "select", args_0: number) => void) & ((evt: "clear") => void) & ((evt: "close", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void) & ((evt: "submit", args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => void) & ((evt: "open", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void)) & (((event: "update:modelValue", value: string | string[] | null) => void) & ((event: "update:search", value: string) => void) & ((event: "update:open", value: boolean) => void));
+    emit: (((evt: "select", args_0: number) => void) & ((evt: "clear") => void) & ((evt: "close", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void) & ((evt: "submit", args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => void) & ((evt: "open", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void)) & (((event: "update:modelValue", value: string | string[] | null) => void) & ((event: "update:open", value: boolean) => void) & ((event: "update:search", value: string) => void));
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

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

@@ -40,8 +40,8 @@ declare const __VLS_export: <Value extends string = string, Ext extends Combobox
         onSubmit?: ((args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => any) | undefined;
         "onUpdate:modelValue"?: ((value: string | string[] | null) => any) | undefined;
         onOpen?: ((args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => any) | undefined;
-        "onUpdate:search"?: ((value: string) => any) | undefined;
         "onUpdate:open"?: ((value: boolean) => any) | undefined;
+        "onUpdate:search"?: ((value: string) => any) | undefined;
     }> & (typeof globalThis extends {
         __VLS_PROPS_FALLBACK: infer P;
     } ? P : {});
@@ -63,7 +63,7 @@ declare const __VLS_export: <Value extends string = string, Ext extends Combobox
     } & {
         rightSection?: (props: {}) => any;
     };
-    emit: (((evt: "select", args_0: number) => void) & ((evt: "clear") => void) & ((evt: "close", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void) & ((evt: "submit", args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => void) & ((evt: "open", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void)) & (((event: "update:modelValue", value: string | string[] | null) => void) & ((event: "update:search", value: string) => void) & ((event: "update:open", value: boolean) => void));
+    emit: (((evt: "select", args_0: number) => void) & ((evt: "clear") => void) & ((evt: "close", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void) & ((evt: "submit", args_0: string, args_1: import("./combobox/index.js").ComboboxItem<string, object>) => void) & ((evt: "open", args_0: import("./combobox/index.js").ComboboxDropdownEventSource) => void)) & (((event: "update:modelValue", value: string | string[] | null) => void) & ((event: "update:open", value: boolean) => void) & ((event: "update:search", value: string) => void));
 }>) => import("vue").VNode & {
     __ctx?: Awaited<typeof __VLS_setup>;
 };

package/dist/runtime/components/table/ui/table.vue

@@ -1,4 +1,5 @@
 <script setup>
+import { useVarsResolver } from "@nui/composables";
 import { getThemeColor } from "@nui/utils";
 import {
   FlexRender,
@@ -9,7 +10,6 @@ import {
   useVueTable
 } from "@tanstack/vue-table";
 import { reactivePick, unrefElement } from "@vueuse/core";
-import { useVarsResolver } from "#imports";
 import { computed, ref, useTemplateRef, watch } from "vue";
 import Box from "../../box.vue";
 import { createRowHandlers, processColumns, resolveValue, valueUpdater } from "../lib";

package/dist/runtime/components/tabs/tabs-root.d.vue.ts

@@ -62,8 +62,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
 }>, {
-    variant: TabsVariant;
     orientation: "vertical" | "horizontal";
+    variant: TabsVariant;
     placement: "left" | "right";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/runtime/components/tabs/tabs-root.vue.d.ts

@@ -62,8 +62,8 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
 }, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
     "onUpdate:modelValue"?: ((value: string | null) => any) | undefined;
 }>, {
-    variant: TabsVariant;
     orientation: "vertical" | "horizontal";
+    variant: TabsVariant;
     placement: "left" | "right";
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -27,7 +27,7 @@ export interface TimelineItem {
     [key: string]: any;
 }
 export interface TimelineVars {
-    root: '--tl-line-width' | '--tl-size' | '--tl-color' | '--tl-radius';
+    root: '--tl-line-width' | '--tl-size' | '--tl-color' | '--tl-radius' | '--tl-gap';
 }
 export type TimelineSlots<T extends TimelineItem = TimelineItem> = {
     bullet?: SlotProps<T>;
@@ -57,6 +57,8 @@ export interface TimelineProps<T extends TimelineItem> extends BoxProps {
     align?: 'right' | 'left';
     /** Control width of the line */
     lineWidth?: number | string;
+    /** Gap between items (padding-bottom on each non-last item) */
+    gap?: number | string;
     /** If set, the active items direction is reversed without reversing items order @default false */
     reverse?: boolean;
     /** @default 'vertical' */

package/dist/runtime/components/timeline.vue

@@ -1,6 +1,6 @@
 <script setup>
 import { useVarsResolver } from "@nui/composables";
-import { getRadius, getSize, getThemeColor, rem } from "@nui/utils";
+import { getRadius, getSize, getSpacing, getThemeColor, rem } from "@nui/utils";
 import { computed } from "vue";
 import Box from "./box.vue";
 const {
@@ -9,6 +9,7 @@ const {
   align = "left",
   size,
   lineWidth = 4,
+  gap,
   color,
   classes,
   mod,
@@ -22,6 +23,7 @@ const {
   size: { type: [String, Object], required: false },
   align: { type: String, required: false },
   lineWidth: { type: [Number, String], required: false },
+  gap: { type: [Number, String], required: false },
   reverse: { type: Boolean, required: false },
   orientation: { type: String, required: false },
   valueKey: { type: String, required: false },
@@ -37,7 +39,8 @@ const style = useVarsResolver((theme) => ({
     "--tl-size": getSize(size, "tl-size"),
     "--tl-line-width": rem(lineWidth),
     "--tl-radius": radius === void 0 ? void 0 : getRadius(radius),
-    "--tl-color": color ? getThemeColor(color, theme) : void 0
+    "--tl-color": color ? getThemeColor(color, theme) : void 0,
+    "--tl-gap": getSpacing(gap)
   }
 }));
 const currentStepIx = computed(() => {
@@ -108,5 +111,5 @@ function getActive(ix) {
 </template>
 
 <style module>
-.root{--tl-size-xs:1rem;--tl-size-sm:1.25rem;--tl-size-md:1.5rem;--tl-size-lg:1.75rem;--tl-size-xl:2rem;--tl-size:var(--tl-size-md);--tl-offset:calc((var(--tl-size) - var(--tl-line-width))/2);--tl-line-width:.25rem;--tl-radius:1000px;--tl-color:var(--color-primary-filled)}.root:where([data-align=left]){padding-inline-start:var(--tl-offset)}.root:where([data-align=right]){padding-inline-end:var(--tl-offset)}.root:where([data-orientation=horizontal]){display:flex;flex-direction:row;padding-block-start:var(--tl-offset);padding-inline:0}.item{--tli-bd-style:solid;--tli-bd-color:var(--color-primary-filled);--item-border:var(--tl-line-width) var(--tli-bd-style) var(--tli-bd-color);color:var(--color-text);position:relative}.item:before{border-inline-start:var(--item-border);bottom:0;content:"";display:var(--timeline-line-display,none);left:var(--timeline-line-left,0);pointer-events:none;position:absolute;right:var(--timeline-line-right,0);top:0}.root[data-align=left] .item:before{--timeline-line-left:calc(var(--tl-line-width)*-1);--timeline-line-right:auto;@mixin rtl{--timeline-line-left:auto;--timeline-line-right:calc(var(--tl-line-width)*-1)}}.root[data-align=right] .item:before{--timeline-line-left:auto;--timeline-line-right:calc(var(--tl-line-width)*-1);@mixin rtl{--timeline-line-left:calc(var(--tl-line-width)*-1);--timeline-line-right:auto}}.root:where([data-align=left]) .item{padding-inline-start:var(--tl-offset);text-align:left}.root:where([data-align=right]) .item{padding-inline-end:var(--tl-offset);text-align:right}.root:where([data-orientation=horizontal]) .item{flex:1;padding-block-start:var(--tl-offset);padding-inline:0;text-align:center}.root:where([data-orientation=horizontal]) .item:before{--timeline-line-top:calc((var(--tl-size) - var(--tl-line-width))/2);border-inline-start:none;border-top:var(--item-border);bottom:auto;height:var(--tl-line-width);left:0;right:0;top:var(--timeline-line-top,0)}.root:where([data-orientation=horizontal]) .item:where(:not(:last-of-type)){--timeline-line-display:block;padding-bottom:0}.item{@mixin where-light{--tli-bd-color:var(--color-gray-3)}}.item{@mixin where-dark{--tli-bd-color:var(--color-dark-4)}}.item:where([data-line-active]){--tli-bd-color:var(--tl-color)}.item:where(:not(:last-of-type)){--timeline-line-display:block;padding-bottom:var(--spacing-xl)}.root:where([data-orientation=horizontal]) .item:where(:not(:first-of-type)){padding-bottom:0}.bullet{--tl-bullet-offset:calc(var(--tl-size)/2*-1 + var(--tl-line-width)/2*-1);align-items:center;background-color:var(--color-body);border:var(--tl-line-width) solid;border-radius:var(--tli-radius,var(--tl-radius));color:var(--color-text);display:flex;height:var(--tl-size);justify-content:center;position:absolute;top:0;width:var(--tl-size);@mixin where-light{border-color:var(--color-gray-3)}@mixin where-dark{border-color:var(--color-dark-4)}}.root:where([data-align=left]) .bullet{left:var(--tl-bullet-offset);right:auto;@mixin where-rtl{left:auto;right:var(--tl-bullet-offset)}}.root:where([data-align=right]) .bullet{left:auto;right:var(--tl-bullet-offset);@mixin where-rtl{left:var(--tl-bullet-offset);right:auto}}.root:where([data-orientation=horizontal]) .bullet{--tl-bullet-offset:0}.bullet:where([data-with-child]){border-width:var(--tl-line-width);@mixin where-light{background-color:var(--color-gray-3)}@mixin where-dark{background-color:var(--color-dark-4)}}.bullet:where([data-active]){background-color:var(--color-white);border-color:var(--tli-color,var(--tl-color));color:var(--tl-icon-color,var(--color-white))}.bullet:where([data-active]):where([data-with-child]){background-color:var(--tli-color,var(--tl-color));color:var(--tl-icon-color,var(--color-white))}.root:where([data-align=left]) .body{padding-inline-start:var(--tl-offset);text-align:left;@mixin where-rtl{text-align:right}}.root:where([data-align=right]) .body{padding-inline-end:var(--tl-offset);text-align:right;@mixin where-rtl{text-align:left}}.root:where([data-orientation=horizontal]) .body{padding-block-start:calc(var(--tl-offset) + var(--spacing-xs));padding-inline:0}.label{font-weight:600;line-height:var(--tl-size)}.content{color:var(--color-dimmed)}
+.root{--tl-size-xs:1rem;--tl-size-sm:1.25rem;--tl-size-md:1.5rem;--tl-size-lg:1.75rem;--tl-size-xl:2rem;--tl-size:var(--tl-size-md);--tl-offset:calc((var(--tl-size) - var(--tl-line-width))/2);--tl-line-width:.25rem;--tl-radius:1000px;--tl-color:var(--color-primary-filled);--tl-gap:var(--spacing-xl)}.root:where([data-align=left]){padding-inline-start:var(--tl-offset)}.root:where([data-align=right]){padding-inline-end:var(--tl-offset)}.root:where([data-orientation=horizontal]){display:flex;flex-direction:row;padding-block-start:var(--tl-offset);padding-inline:0}.item{--tli-bd-style:solid;--tli-bd-color:var(--color-primary-filled);--item-border:var(--tl-line-width) var(--tli-bd-style) var(--tli-bd-color);color:var(--color-text);position:relative}.item:before{border-inline-start:var(--item-border);bottom:0;content:"";display:var(--timeline-line-display,none);left:var(--timeline-line-left,0);pointer-events:none;position:absolute;right:var(--timeline-line-right,0);top:0}.root[data-align=left] .item:before{--timeline-line-left:calc(var(--tl-line-width)*-1);--timeline-line-right:auto;@mixin rtl{--timeline-line-left:auto;--timeline-line-right:calc(var(--tl-line-width)*-1)}}.root[data-align=right] .item:before{--timeline-line-left:auto;--timeline-line-right:calc(var(--tl-line-width)*-1);@mixin rtl{--timeline-line-left:calc(var(--tl-line-width)*-1);--timeline-line-right:auto}}.root:where([data-align=left]) .item{padding-inline-start:var(--tl-offset);text-align:left}.root:where([data-align=right]) .item{padding-inline-end:var(--tl-offset);text-align:right}.root:where([data-orientation=horizontal]) .item{flex:1;padding-block-start:var(--tl-offset);padding-inline:0;text-align:center}.root:where([data-orientation=horizontal]) .item:before{--timeline-line-top:calc((var(--tl-size) - var(--tl-line-width))/2);border-inline-start:none;border-top:var(--item-border);bottom:auto;height:var(--tl-line-width);left:0;right:0;top:var(--timeline-line-top,0)}.root:where([data-orientation=horizontal]) .item:where(:not(:last-of-type)){--timeline-line-display:block;padding-bottom:0}.item{@mixin where-light{--tli-bd-color:var(--color-gray-3)}}.item{@mixin where-dark{--tli-bd-color:var(--color-dark-4)}}.item:where([data-line-active]){--tli-bd-color:var(--tl-color)}.item:where(:not(:last-of-type)){--timeline-line-display:block;padding-bottom:var(--tl-gap)}.root:where([data-orientation=horizontal]) .item:where(:not(:first-of-type)){padding-bottom:0}.bullet{--tl-bullet-offset:calc(var(--tl-size)/2*-1 + var(--tl-line-width)/2*-1);align-items:center;background-color:var(--color-body);border:var(--tl-line-width) solid;border-radius:var(--tli-radius,var(--tl-radius));color:var(--color-text);display:flex;height:var(--tl-size);justify-content:center;position:absolute;top:0;width:var(--tl-size);@mixin where-light{border-color:var(--color-gray-3)}@mixin where-dark{border-color:var(--color-dark-4)}}.root:where([data-align=left]) .bullet{left:var(--tl-bullet-offset);right:auto;@mixin where-rtl{left:auto;right:var(--tl-bullet-offset)}}.root:where([data-align=right]) .bullet{left:auto;right:var(--tl-bullet-offset);@mixin where-rtl{left:var(--tl-bullet-offset);right:auto}}.root:where([data-orientation=horizontal]) .bullet{--tl-bullet-offset:0}.bullet:where([data-with-child]){border-width:var(--tl-line-width);@mixin where-light{background-color:var(--color-gray-3)}@mixin where-dark{background-color:var(--color-dark-4)}}.bullet:where([data-active]){background-color:var(--color-white);border-color:var(--tli-color,var(--tl-color));color:var(--tl-icon-color,var(--color-white))}.bullet:where([data-active]):where([data-with-child]){background-color:var(--tli-color,var(--tl-color));color:var(--tl-icon-color,var(--color-white))}.root:where([data-align=left]) .body{padding-inline-start:var(--tl-offset);text-align:left;@mixin where-rtl{text-align:right}}.root:where([data-align=right]) .body{padding-inline-end:var(--tl-offset);text-align:right;@mixin where-rtl{text-align:left}}.root:where([data-orientation=horizontal]) .body{padding-block-start:calc(var(--tl-offset) + var(--spacing-xs));padding-inline:0}.label{font-weight:600;line-height:var(--tl-size)}.content{color:var(--color-dimmed)}
 </style>

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

@@ -27,7 +27,7 @@ export interface TimelineItem {
     [key: string]: any;
 }
 export interface TimelineVars {
-    root: '--tl-line-width' | '--tl-size' | '--tl-color' | '--tl-radius';
+    root: '--tl-line-width' | '--tl-size' | '--tl-color' | '--tl-radius' | '--tl-gap';
 }
 export type TimelineSlots<T extends TimelineItem = TimelineItem> = {
     bullet?: SlotProps<T>;
@@ -57,6 +57,8 @@ export interface TimelineProps<T extends TimelineItem> extends BoxProps {
     align?: 'right' | 'left';
     /** Control width of the line */
     lineWidth?: number | string;
+    /** Gap between items (padding-bottom on each non-last item) */
+    gap?: number | string;
     /** If set, the active items direction is reversed without reversing items order @default false */
     reverse?: boolean;
     /** @default 'vertical' */

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

@@ -15,6 +15,16 @@ export interface TransitionProps {
      * @default `0`
      */
     delay?: number;
+    /**
+   * Controls the timing sequence of leaving/entering transitions.
+   * Default behavior is simultaneous.
+   */
+    mode?: 'in-out' | 'out-in' | 'default';
+    /**
+   * Whether to apply transition on initial render.
+   * Default: false
+   */
+    appear?: boolean;
 }
 declare var __VLS_9: {};
 type __VLS_Slots = {} & {

package/dist/runtime/components/transition.vue

@@ -3,11 +3,15 @@ import { computed } from "vue";
 const {
   name = "pop-bottom-left",
   duration = 250,
-  delay
+  delay,
+  appear,
+  mode
 } = defineProps({
   name: { type: String, required: false },
   duration: { type: Number, required: false },
-  delay: { type: Number, required: false }
+  delay: { type: Number, required: false },
+  mode: { type: String, required: false },
+  appear: { type: Boolean, required: false }
 });
 const emit = defineEmits(["afterLeave"]);
 const style = computed(() => ({
@@ -17,7 +21,14 @@ const style = computed(() => ({
 </script>
 
 <template>
-	<Transition :class='$style.root' :style :name @after-leave='() => emit("afterLeave")'>
+	<Transition
+		:class='$style.root'
+		:style
+		:name
+		:mode
+		:appear
+		@after-leave='() => emit("afterLeave")'
+	>
 		<slot />
 	</Transition>
 </template>

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

@@ -15,6 +15,16 @@ export interface TransitionProps {
      * @default `0`
      */
     delay?: number;
+    /**
+   * Controls the timing sequence of leaving/entering transitions.
+   * Default behavior is simultaneous.
+   */
+    mode?: 'in-out' | 'out-in' | 'default';
+    /**
+   * Whether to apply transition on initial render.
+   * Default: false
+   */
+    appear?: boolean;
 }
 declare var __VLS_9: {};
 type __VLS_Slots = {} & {

package/dist/runtime/modals/modals-provider.vue

@@ -3,14 +3,12 @@ import { $modals } from "./modal-manager";
 </script>
 
 <template>
-	<ClientOnly>
-		<div id='nui-modals-root'>
-			<component
-				:is='entry.component'
-				v-for='[id, entry] in $modals.modals'
-				:key='id'
-				v-bind='entry.props'
-			/>
-		</div>
-	</ClientOnly>
+	<div id='nui-modals-root'>
+		<component
+			:is='entry.component'
+			v-for='[id, entry] in $modals.modals'
+			:key='id'
+			v-bind='entry.props'
+		/>
+	</div>
 </template>

package/dist/runtime/utils/color/get-gradient.js

@@ -1,4 +1,4 @@
-import { DEFAULT_GRADIENT } from "./const.js";
+import { DEFAULT_GRADIENT } from "../const/index.js";
 import { parseThemeColor } from "./parse-theme-color.js";
 export function getGradient(gradient, theme) {
   const merged = {

package/dist/runtime/utils/color/index.d.ts

@@ -1,4 +1,3 @@
-export * from './const.js';
 export * from './get-color-var.js';
 export * from './get-gradient.js';
 export * from './parse-theme-color.js';

package/dist/runtime/utils/color/index.js

@@ -1,4 +1,3 @@
-export * from "./const.js";
 export * from "./get-color-var.js";
 export * from "./get-gradient.js";
 export * from "./parse-theme-color.js";

package/dist/runtime/utils/const/icons.js

@@ -0,0 +1,33 @@
+export const DEFAULT_ICONS = {
+  // ─── Actions ───
+  close: "lucide:x",
+  check: "lucide:check",
+  minus: "lucide:minus",
+  plus: "lucide:plus",
+  // ─── Chevrons ───
+  chevronRight: "lucide:chevron-right",
+  chevronLeft: "lucide:chevron-left",
+  chevronDown: "lucide:chevron-down",
+  chevronUp: "lucide:chevron-up",
+  selectExpand: "lucide:chevrons-up-down",
+  // ─── Inputs ───
+  email: "lucide:at-sign",
+  passwordShow: "lucide:eye",
+  passwordHide: "lucide:eye-off",
+  calendar: "lucide:calendar",
+  clock: "lucide:clock",
+  // ─── User ───
+  person: "lucide:user",
+  // ─── Theme ───
+  sun: "lucide:sun",
+  moon: "lucide:moon",
+  // ─── Files & tree ───
+  upload: "lucide:upload",
+  file: "lucide:file",
+  folder: "lucide:folder",
+  folderOpen: "lucide:folder-open",
+  // ─── Table sort ───
+  sortAsc: "lucide:arrow-up-narrow-wide",
+  sortDesc: "lucide:arrow-down-wide-narrow",
+  sortOff: "lucide:arrow-up-down"
+};

package/dist/runtime/utils/const/index.d.ts

@@ -0,0 +1,2 @@
+export * from './gradient.js';
+export * from './icons.js';

package/dist/runtime/utils/const/index.js

@@ -0,0 +1,2 @@
+export * from "./gradient.js";
+export * from "./icons.js";

package/dist/runtime/utils/index.d.ts

@@ -1,7 +1,7 @@
 export * from './boolean/index.js';
 export * from './color/index.js';
+export * from './const/index.js';
 export * from './css/index.js';
 export * from './date/index.js';
-export * from './icons/index.js';
 export * from './style/index.js';
 export * from './tree.js';

package/dist/runtime/utils/index.js

@@ -1,7 +1,7 @@
 export * from "./boolean/index.js";
 export * from "./color/index.js";
+export * from "./const/index.js";
 export * from "./css/index.js";
 export * from "./date/index.js";
-export * from "./icons/index.js";
 export * from "./style/index.js";
 export * from "./tree.js";

package/dist/runtime/utils/style/create-variant-color-resolver.js

@@ -1,6 +1,6 @@
-import { DEFAULT_GRADIENT } from "../color/const.js";
 import { getGradient, getGradientOutline } from "../color/get-gradient.js";
 import { getThemeColor, parseThemeColor } from "../color/parse-theme-color.js";
+import { DEFAULT_GRADIENT } from "../const/index.js";
 export function createVariantColorResolver({
   color = "primary",
   variant,

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "nuance-ui",
-	"version": "0.2.34",
-	"description": "A modern Vue UI library inspired by the best of the React ecosystem.",
+	"version": "0.2.36",
+	"description": "A modern Nuxt UI library inspired by the best of the React ecosystem.",
 	"repository": {
 		"type": "git",
 		"url": "git+https://github.com/Igor-Iugin/nuance-ui.git"
@@ -77,10 +77,11 @@
 		}
 	},
 	"devDependencies": {
-		"@antfu/eslint-config": "^8.2.0",
+		"@antfu/eslint-config": "^9.1.0",
 		"@nuxt/devtools": "^3.1.1",
 		"@nuxt/eslint": "1.10.0",
 		"@nuxt/eslint-config": "^1.13.0",
+		"@nuxt/icon": "^2.2.1",
 		"@nuxt/image": "^2.0.0",
 		"@nuxt/module-builder": "^1.0.2",
 		"@nuxt/schema": "^4.4.2",