@nexxtmove/ui 1.8.0 → 1.9.0

package/dist/components/{Announcement → molecules/Announcement}/Announcement.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as NexxtIcon } from '../Icon/Icon.vue';
+import { default as NexxtIcon } from '../../atoms/Icon/Icon.vue';
 type AnnouncementVariant = 'info' | 'success' | 'warning' | 'danger' | 'neutral';
 interface NexxtAnnouncementProps {
     /**

package/dist/components/{InfoBlock → molecules/InfoBlock}/InfoBlock.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as Icon } from '../Icon/Icon.vue';
+import { default as Icon } from '../../atoms/Icon/Icon.vue';
 interface NexxtInfoBlockProps {
     icon: InstanceType<typeof Icon>['name'];
     color?: 'green' | 'purple' | 'blue' | 'rose';

package/dist/components/{InputField → molecules/InputField}/InputField.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as Icon } from '../Icon/Icon.vue';
+import { default as Icon } from '../../atoms/Icon/Icon.vue';
 export interface NexxtInputFieldProps {
     placeholder?: string;
     label?: string;

package/dist/components/{InputSelect → molecules/InputSelect}/InputSelect.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as Icon } from '../Icon/Icon.vue';
+import { default as Icon } from '../../atoms/Icon/Icon.vue';
 import { SelectOption } from '../Select/Select.vue';
 export type { SelectOption };
 export interface NexxtInputSelectProps {

package/dist/components/{ModalFooter → molecules/ModalFooter}/ModalFooter.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as NexxtButton } from '../Button/Button.vue';
+import { default as NexxtButton } from '../../atoms/Button/Button.vue';
 type ButtonVariant = InstanceType<typeof NexxtButton>['$props']['variant'];
 type ButtonIcon = InstanceType<typeof NexxtButton>['$props']['icon'];
 interface NexxtModalFooterProps {

package/dist/components/{Select → molecules/Select}/Select.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as Icon } from '../Icon/Icon.vue';
+import { default as Icon } from '../../atoms/Icon/Icon.vue';
 export type SelectOption = {
     label: string;
     value: string | number;

package/dist/components/{SidebarMenuItem → molecules/SidebarMenuItem}/SidebarMenuItem.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as NexxtIcon } from '../Icon/Icon.vue';
+import { default as NexxtIcon } from '../../atoms/Icon/Icon.vue';
 interface SidebarMenuItemProps {
     icon: InstanceType<typeof NexxtIcon>['name'];
     selected?: boolean;

package/dist/components/{Tabs → molecules/Tabs}/Tabs.vue.d.ts

@@ -1,4 +1,4 @@
-import { NexxtIconName } from '../Icon/Icon.vue';
+import { NexxtIconName } from '../../atoms/Icon/Icon.vue';
 export interface NexxtTabItem {
     label: string;
     icon?: NexxtIconName;

package/dist/components/{DropdownButton → organisms/DropdownButton}/DropdownButton.vue.d.ts

@@ -1,4 +1,4 @@
-import { default as NexxtIcon } from '../Icon/Icon.vue';
+import { default as NexxtIcon } from '../../atoms/Icon/Icon.vue';
 interface NexxtDropdownButton {
     label: string;
     action: string | (() => void);

package/dist/components/{TimelinePhaseblock → organisms/TimelinePhaseblock}/TimelinePhaseblock.vue.d.ts

@@ -1,4 +1,4 @@
-import { TimelinePhase } from '../TimelineEvent/TimelineTypes';
+import { TimelinePhase } from '../../molecules/TimelineEvent/TimelineTypes';
 type __VLS_Props = {
     phase: TimelinePhase;
     /** Index within the filtered phases array (used to determine phase direction/date). */

package/dist/components/{TimelineTrack → organisms/TimelineTrack}/TimelineTrack.vue.d.ts

@@ -1,4 +1,4 @@
-import { TimelineEvent as Event } from '../TimelineEvent/TimelineTypes';
+import { TimelineEvent as Event } from '../../molecules/TimelineEvent/TimelineTypes';
 type __VLS_Props = {
     /** Events, newest first. Ignored when the default slot is used. */
     events?: Event[];

package/dist/components/{Toaster → organisms/Toaster}/Toaster.vue.d.ts

@@ -1,4 +1,4 @@
-import { ToastItem } from '../Toast/Toast.vue';
+import { ToastItem } from '../../molecules/Toast/Toast.vue';
 export type ToasterPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
 interface NexxtToasterProps {
     toasts: ToastItem[];

package/dist/index.d.ts

@@ -1,65 +1,66 @@
 export type { Placement } from '@floating-ui/vue';
-export { EVENT_CONFIG_MAP, PHASE_MAP } from './components/TimelineEvent/TimelineTypes';
-export type { TimelineEvent, TimelinePhase, TimelineResponse, } from './components/TimelineEvent/TimelineTypes';
-export type { IconType, NexxtIconName } from './components/Icon/Icon.vue';
-export type { CustomIconName } from './components/Icon/customIcons';
-export type { NexxtTabItem } from './components/Tabs/Tabs.vue';
-export { default as NexxtAnimatedNumber } from './components/AnimatedNumber/AnimatedNumber.vue';
-export { default as NexxtAnnouncement } from './components/Announcement/Announcement.vue';
-export { default as NexxtAvatar } from './components/Avatar/Avatar.vue';
-export { default as NexxtButton } from './components/Button/Button.vue';
-export { default as NexxtCalendar } from './components/Calendar/Calendar.vue';
-export { default as NexxtCard } from './components/Card/Card.vue';
-export { default as NexxtCheckbox } from './components/Checkbox/Checkbox.vue';
-export { default as NexxtChip } from './components/Chip/Chip.vue';
-export { default as NexxtColorPicker } from './components/ColorPicker/ColorPicker.vue';
-export { default as NexxtCombobox } from './components/Combobox/Combobox.vue';
-export { default as NexxtComboboxPanel } from './components/ComboboxPanel/ComboboxPanel.vue';
-export { default as NexxtContactInfoCard } from './components/ContactInfoCard/ContactInfoCard.vue';
-export { default as NexxtCountrySelect } from './components/CountrySelect/CountrySelect.vue';
-export { default as NexxtCustomerJourneyTile } from './components/CustomerJourneyTile/CustomerJourneyTile.vue';
-export { default as NexxtDatePicker } from './components/DatePicker/DatePicker.vue';
-export { default as NexxtDoughnutChart } from './components/DoughnutChart/DoughnutChart.vue';
-export { default as NexxtDropdownButton } from './components/DropdownButton/DropdownButton.vue';
-export { default as NexxtEnergyLabel } from './components/EnergyLabel/EnergyLabel.vue';
-export { default as NexxtFloatingPanel } from './components/FloatingPanel/FloatingPanel.vue';
-export { default as NexxtHeader } from './components/Header/Header.vue';
-export { default as NexxtIcon } from './components/Icon/Icon.vue';
-export { default as NexxtInfoBlock } from './components/InfoBlock/InfoBlock.vue';
-export { default as NexxtInputField } from './components/InputField/InputField.vue';
-export { default as NexxtInputSelect } from './components/InputSelect/InputSelect.vue';
-export { default as NexxtModal } from './components/Modal/Modal.vue';
-export { default as NexxtModalFooter } from './components/ModalFooter/ModalFooter.vue';
-export { default as NexxtPagination } from './components/Pagination/Pagination.vue';
-export { default as NexxtPresenceIndicator } from './components/PresenceIndicator/PresenceIndicator.vue';
-export { default as NexxtProgressBar } from './components/ProgressBar/ProgressBar.vue';
-export { default as NexxtPropertyCard } from './components/PropertyCard/PropertyCard.vue';
-export { default as NexxtPropertyListing } from './components/PropertyListing/PropertyListing.vue';
-export { default as NexxtReferenceCard } from './components/ReferenceCard/ReferenceCard.vue';
-export { default as NexxtSelect } from './components/Select/Select.vue';
-export { default as NexxtSidebarMenuItem } from './components/SidebarMenuItem/SidebarMenuItem.vue';
-export { default as NexxtSkeleton } from './components/Skeleton/Skeleton.vue';
-export { default as NexxtSkeletonPropertyCard } from './components/SkeletonPropertyCard/SkeletonPropertyCard.vue';
-export { default as NexxtSlider } from './components/Slider/Slider.vue';
-export { default as NexxtSocialIcons } from './components/SocialIcons/SocialIcons.vue';
-export { default as NexxtSocialMediaCustomTemplate } from './components/SocialMediaCustomTemplate/SocialMediaCustomTemplate.vue';
-export { default as NexxtSocialMediaTemplate } from './components/SocialMediaTemplate/SocialMediaTemplate.vue';
-export { default as NexxtSocialMediaType } from './components/SocialMediaType/SocialMediaType.vue';
-export { default as NexxtSource, SOURCE_MAP } from './components/Source/Source.vue';
-export { default as NexxtSquircle } from './components/Squircle/Squircle.vue';
-export { default as NexxtStepperHeader } from './components/StepperHeader/StepperHeader.vue';
-export { default as NexxtSwitch } from './components/Switch/Switch.vue';
-export { default as NexxtTabbedContent } from './components/TabbedContent/TabbedContent.vue';
-export { default as NexxtTable } from './components/Table/Table.vue';
-export { default as NexxtTabs } from './components/Tabs/Tabs.vue';
-export { default as NexxtTemplateCard } from './components/TemplateCard/TemplateCard.vue';
-export { default as NexxtTextarea } from './components/Textarea/Textarea.vue';
-export { default as NexxtTimelineEvent } from './components/TimelineEvent/TimelineEvent.vue';
-export { default as NexxtTimelineLanes } from './components/TimelineLanes/TimelineLanes.vue';
-export { default as NexxtTimelinePhaseblock } from './components/TimelinePhaseblock/TimelinePhaseblock.vue';
-export { default as NexxtTimelineTrack } from './components/TimelineTrack/TimelineTrack.vue';
-export { default as NexxtToast } from './components/Toast/Toast.vue';
-export { default as NexxtToaster } from './components/Toaster/Toaster.vue';
-export { default as NexxtToggleGroup } from './components/ToggleGroup/ToggleGroup.vue';
-export { default as NexxtTooltip } from './components/Tooltip/Tooltip.vue';
-export { default as NexxtVideoPlayer } from './components/VideoPlayer/VideoPlayer.vue';
+export { EVENT_CONFIG_MAP, PHASE_MAP } from './components/molecules/TimelineEvent/TimelineTypes';
+export type { TimelineEvent, TimelinePhase, TimelineResponse, } from './components/molecules/TimelineEvent/TimelineTypes';
+export type { EnergyLabelLetter } from './components/atoms/EnergyLabel/EnergyLabel.vue';
+export type { IconType, NexxtIconName } from './components/atoms/Icon/Icon.vue';
+export type { CustomIconName } from './components/atoms/Icon/customIcons';
+export type { NexxtTabItem } from './components/molecules/Tabs/Tabs.vue';
+export { default as NexxtAnimatedNumber } from './components/atoms/AnimatedNumber/AnimatedNumber.vue';
+export { default as NexxtAnnouncement } from './components/molecules/Announcement/Announcement.vue';
+export { default as NexxtAvatar } from './components/atoms/Avatar/Avatar.vue';
+export { default as NexxtButton } from './components/atoms/Button/Button.vue';
+export { default as NexxtCalendar } from './components/organisms/Calendar/Calendar.vue';
+export { default as NexxtCard } from './components/atoms/Card/Card.vue';
+export { default as NexxtCheckbox } from './components/atoms/Checkbox/Checkbox.vue';
+export { default as NexxtChip } from './components/atoms/Chip/Chip.vue';
+export { default as NexxtColorPicker } from './components/organisms/ColorPicker/ColorPicker.vue';
+export { default as NexxtCombobox } from './components/organisms/Combobox/Combobox.vue';
+export { default as NexxtComboboxPanel } from './components/organisms/ComboboxPanel/ComboboxPanel.vue';
+export { default as NexxtContactInfoCard } from './components/molecules/ContactInfoCard/ContactInfoCard.vue';
+export { default as NexxtCountrySelect } from './components/organisms/CountrySelect/CountrySelect.vue';
+export { default as NexxtCustomerJourneyTile } from './components/molecules/CustomerJourneyTile/CustomerJourneyTile.vue';
+export { default as NexxtDatePicker } from './components/organisms/DatePicker/DatePicker.vue';
+export { default as NexxtDoughnutChart } from './components/molecules/DoughnutChart/DoughnutChart.vue';
+export { default as NexxtDropdownButton } from './components/organisms/DropdownButton/DropdownButton.vue';
+export { default as NexxtEnergyLabel } from './components/atoms/EnergyLabel/EnergyLabel.vue';
+export { default as NexxtFloatingPanel } from './components/atoms/FloatingPanel/FloatingPanel.vue';
+export { default as NexxtHeader } from './components/organisms/Header/Header.vue';
+export { default as NexxtIcon } from './components/atoms/Icon/Icon.vue';
+export { default as NexxtInfoBlock } from './components/molecules/InfoBlock/InfoBlock.vue';
+export { default as NexxtInputField } from './components/molecules/InputField/InputField.vue';
+export { default as NexxtInputSelect } from './components/molecules/InputSelect/InputSelect.vue';
+export { default as NexxtModal } from './components/organisms/Modal/Modal.vue';
+export { default as NexxtModalFooter } from './components/molecules/ModalFooter/ModalFooter.vue';
+export { default as NexxtPagination } from './components/molecules/Pagination/Pagination.vue';
+export { default as NexxtPresenceIndicator } from './components/atoms/PresenceIndicator/PresenceIndicator.vue';
+export { default as NexxtProgressBar } from './components/organisms/ProgressBar/ProgressBar.vue';
+export { default as NexxtPropertyCard } from './components/molecules/PropertyCard/PropertyCard.vue';
+export { default as NexxtPropertyListing } from './components/atoms/PropertyListing/PropertyListing.vue';
+export { default as NexxtReferenceCard } from './components/organisms/ReferenceCard/ReferenceCard.vue';
+export { default as NexxtSelect } from './components/molecules/Select/Select.vue';
+export { default as NexxtSidebarMenuItem } from './components/molecules/SidebarMenuItem/SidebarMenuItem.vue';
+export { default as NexxtSkeleton } from './components/atoms/Skeleton/Skeleton.vue';
+export { default as NexxtSkeletonPropertyCard } from './components/molecules/SkeletonPropertyCard/SkeletonPropertyCard.vue';
+export { default as NexxtSlider } from './components/atoms/Slider/Slider.vue';
+export { default as NexxtSocialIcons } from './components/molecules/SocialIcons/SocialIcons.vue';
+export { default as NexxtSocialMediaCustomTemplate } from './components/molecules/SocialMediaCustomTemplate/SocialMediaCustomTemplate.vue';
+export { default as NexxtSocialMediaTemplate } from './components/organisms/SocialMediaTemplate/SocialMediaTemplate.vue';
+export { default as NexxtSocialMediaType } from './components/molecules/SocialMediaType/SocialMediaType.vue';
+export { default as NexxtSource, SOURCE_MAP } from './components/molecules/Source/Source.vue';
+export { default as NexxtSquircle } from './components/atoms/Squircle/Squircle.vue';
+export { default as NexxtStepperHeader } from './components/organisms/StepperHeader/StepperHeader.vue';
+export { default as NexxtSwitch } from './components/atoms/Switch/Switch.vue';
+export { default as NexxtTabbedContent } from './components/molecules/TabbedContent/TabbedContent.vue';
+export { default as NexxtTable } from './components/organisms/Table/Table.vue';
+export { default as NexxtTabs } from './components/molecules/Tabs/Tabs.vue';
+export { default as NexxtTemplateCard } from './components/molecules/TemplateCard/TemplateCard.vue';
+export { default as NexxtTextarea } from './components/molecules/Textarea/Textarea.vue';
+export { default as NexxtTimelineEvent } from './components/molecules/TimelineEvent/TimelineEvent.vue';
+export { default as NexxtTimelineLanes } from './components/molecules/TimelineLanes/TimelineLanes.vue';
+export { default as NexxtTimelinePhaseblock } from './components/organisms/TimelinePhaseblock/TimelinePhaseblock.vue';
+export { default as NexxtTimelineTrack } from './components/organisms/TimelineTrack/TimelineTrack.vue';
+export { default as NexxtToast } from './components/molecules/Toast/Toast.vue';
+export { default as NexxtToaster } from './components/organisms/Toaster/Toaster.vue';
+export { default as NexxtToggleGroup } from './components/molecules/ToggleGroup/ToggleGroup.vue';
+export { default as NexxtTooltip } from './components/atoms/Tooltip/Tooltip.vue';
+export { default as NexxtVideoPlayer } from './components/organisms/VideoPlayer/VideoPlayer.vue';

package/dist/index.js

@@ -6,7 +6,7 @@ import { nl as he } from "date-fns/locale";
 import { ColorAreaArea as ge, ColorAreaRoot as _e, ColorAreaThumb as ve, ColorFieldInput as X, ColorFieldRoot as ye, ColorSliderRoot as be, ColorSliderThumb as xe, ColorSliderTrack as Se, ColorSwatch as Ce, DialogClose as we, DialogContent as Te, DialogDescription as Ee, DialogOverlay as De, DialogPortal as Oe, DialogRoot as ke, DialogTitle as Ae, PaginationEllipsis as je, PaginationFirst as Me, PaginationLast as Ne, PaginationList as Pe, PaginationListItem as Fe, PaginationNext as Ie, PaginationPrev as Le, PaginationRoot as Re, SliderRange as ze, SliderRoot as Be, SliderThumb as Ve, SliderTrack as He, TooltipContent as Ue, TooltipPortal as We, TooltipProvider as Ge, TooltipRoot as Ke, TooltipTrigger as qe, colorToString as Je, normalizeColor as Ye, setChannelValue as Xe } from "reka-ui";
 import { autoUpdate as Ze, flip as Qe, offset as $e, shift as et, size as tt, useFloating as nt } from "@floating-ui/vue";
 import { useEventListener as rt, useFullscreen as it, useMediaControls as at, useResizeObserver as ot } from "@vueuse/core";
-//#region src/components/TimelineEvent/TimelineTypes.ts
+//#region src/components/molecules/TimelineEvent/TimelineTypes.ts
 var st = {
 	contact_created: {
 		label: "Contact aangemaakt",
@@ -309,7 +309,7 @@ function dt(e, t) {
 	}, null, -1)]]);
 }
 //#endregion
-//#region src/components/Icon/customIcons.ts
+//#region src/components/atoms/Icon/customIcons.ts
 var ft = { funda: { render: dt } }, Q = /* @__PURE__ */ p({
 	name: "NexxtIcon",
 	__name: "Icon",
@@ -1656,24 +1656,27 @@ var ft = { funda: { render: dt } }, Q = /* @__PURE__ */ p({
 	}),
 	emits: ["update:modelValue"],
 	setup(e, { expose: t }) {
-		let r = "input-field-" + Math.random().toString(36).slice(2, 10), a = j(), l = i(() => {
+		let r = "input-field-" + Math.random().toString(36).slice(2, 10), a = j(), l = i(() => ({
+			class: a.class,
+			style: a.style
+		})), u = i(() => {
 			let e = { ...a };
 			return delete e.class, delete e.style, e;
-		}), u = N(e, "modelValue"), p = P("inputEl");
+		}), p = N(e, "modelValue"), h = P("inputEl");
 		t({
-			focus: () => p.value?.focus(),
-			inputEl: p
+			focus: () => h.value?.focus(),
+			inputEl: h
 		});
-		let h = i(() => m()?.attrs.type === "number"), g = () => {
-			let e = Number(u.value || 0);
-			u.value = e + 1;
-		}, v = () => {
-			let e = Number(u.value || 0);
-			u.value = e - 1;
+		let g = i(() => m()?.attrs.type === "number"), v = () => {
+			let e = Number(p.value || 0);
+			p.value = e + 1;
+		}, b = () => {
+			let e = Number(p.value || 0);
+			p.value = e - 1;
 		};
 		return (t, i) => (w(), s("div", {
-			class: y(["inline-flex flex-col gap-1", A(a).class]),
-			style: x(A(a).style)
+			class: y(["inline-flex flex-col gap-1", l.value.class]),
+			style: x(l.value.style)
 		}, [
 			e.label ? (w(), s("label", {
 				key: 0,
@@ -1687,19 +1690,19 @@ var ft = { funda: { render: dt } }, Q = /* @__PURE__ */ p({
 				e.leftIcon ? (w(), s("span", Cn, [f(Q, { name: e.leftIcon }, null, 8, ["name"])])) : o("", !0),
 				V(c("input", _({
 					ref_key: "inputEl",
-					ref: p,
+					ref: h,
 					id: r,
-					"onUpdate:modelValue": i[0] ||= (e) => u.value = e,
+					"onUpdate:modelValue": i[0] ||= (e) => p.value = e,
 					placeholder: e.placeholder
-				}, l.value, { class: ["bg-transparant h-10 w-full min-w-60 text-sm text-gray-900 placeholder-gray-400 focus:outline-none [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none", {
+				}, u.value, { class: ["bg-transparant h-10 w-full min-w-60 text-sm text-gray-900 placeholder-gray-400 focus:outline-none [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none", {
 					"pl-3": !e.leftIcon,
 					"pr-3": !e.rightIcon
-				}] }), null, 16, wn), [[I, u.value]]),
-				D(t.$slots, "right", {}, () => [h.value ? (w(), s("div", Tn, [c("button", {
+				}] }), null, 16, wn), [[I, p.value]]),
+				D(t.$slots, "right", {}, () => [g.value ? (w(), s("div", Tn, [c("button", {
 					type: "button",
 					class: "flex h-5 w-8 cursor-pointer items-center justify-center pt-2 text-gray-400 transition-colors group-focus-within:text-gray-950 hover:text-cornflower-blue-600 focus:text-cornflower-blue-600 focus:outline-none",
 					"aria-label": "Verhogen",
-					onClick: g
+					onClick: v
 				}, [f(Q, {
 					name: "chevron-up",
 					class: "text-[10px]",
@@ -1708,7 +1711,7 @@ var ft = { funda: { render: dt } }, Q = /* @__PURE__ */ p({
 					type: "button",
 					class: "flex h-5 w-8 cursor-pointer items-center justify-center pb-2 text-gray-400 transition-colors group-focus-within:text-gray-950 hover:text-cornflower-blue-600 focus:text-cornflower-blue-600 focus:outline-none",
 					"aria-label": "Verlagen",
-					onClick: v
+					onClick: b
 				}, [f(Q, {
 					name: "chevron-down",
 					class: "text-[10px]",
@@ -2861,7 +2864,7 @@ if (typeof document < "u") {
 	e.textContent = Zn, document.head.appendChild(e);
 }
 //#endregion
-//#region src/components/CountrySelect/CountrySelect.vue
+//#region src/components/organisms/CountrySelect/CountrySelect.vue
 var cr = /* @__PURE__ */ p({
 	name: "NexxtCountrySelect",
 	__name: "CountrySelect",
@@ -3435,19 +3438,22 @@ var cr = /* @__PURE__ */ p({
 	}),
 	emits: ["update:input", "update:select"],
 	setup(t) {
-		let r = () => "input-select-" + Math.random().toString(36).slice(2, 10), l = r(), u = r(), p = j(), m = i(() => {
+		let r = () => "input-select-" + Math.random().toString(36).slice(2, 10), l = r(), u = r(), p = j(), m = i(() => ({
+			class: p.class,
+			style: p.style
+		})), h = i(() => {
 			let e = { ...p };
 			return delete e.class, delete e.style, e;
-		}), h = t, g = (e) => typeof e == "string" ? e : e.label, v = (e) => typeof e == "string" ? e : e.value, b = N(t, "input"), S = N(t, "select"), C = i(() => {
-			if (S.value === null || S.value === void 0) return null;
-			let e = h.options.find((e) => v(e) === S.value);
-			return e ? g(e) : null;
-		}), T = (e, t) => {
-			S.value = v(e), t();
+		}), g = t, v = (e) => typeof e == "string" ? e : e.label, b = (e) => typeof e == "string" ? e : e.value, S = N(t, "input"), C = N(t, "select"), T = i(() => {
+			if (C.value === null || C.value === void 0) return null;
+			let e = g.options.find((e) => b(e) === C.value);
+			return e ? v(e) : null;
+		}), D = (e, t) => {
+			C.value = b(e), t();
 		};
 		return (r, i) => (w(), s("div", {
-			class: y(["inline-flex flex-col gap-1", A(p).class]),
-			style: x(A(p).style)
+			class: y(["inline-flex flex-col gap-1", m.value.class]),
+			style: x(m.value.style)
 		}, [
 			t.label ? (w(), s("label", {
 				key: 0,
@@ -3461,7 +3467,7 @@ var cr = /* @__PURE__ */ p({
 					"aria-expanded": e,
 					"aria-haspopup": "listbox",
 					tabindex: "0",
-					class: y(["flex h-10 shrink-0 cursor-pointer items-center gap-1.5 px-3 text-sm transition-colors focus:outline-none", [C.value ? "text-gray-900" : "text-gray-400", t.selectPosition === "after" ? "border-l border-gray-200" : "border-r border-gray-200"]]),
+					class: y(["flex h-10 shrink-0 cursor-pointer items-center gap-1.5 px-3 text-sm transition-colors focus:outline-none", [T.value ? "text-gray-900" : "text-gray-400", t.selectPosition === "after" ? "border-l border-gray-200" : "border-r border-gray-200"]]),
 					onClick: n,
 					onKeydown: [H(U(n, ["prevent"]), ["enter"]), H(U(n, ["prevent"]), ["space"])]
 				}, [
@@ -3470,19 +3476,19 @@ var cr = /* @__PURE__ */ p({
 						name: t.leftIcon,
 						class: "text-gray-400"
 					}, null, 8, ["name"])) : o("", !0),
-					c("span", null, k(C.value ?? t.selectPlaceholder), 1),
+					c("span", null, k(T.value ?? t.selectPlaceholder), 1),
 					f(Q, {
 						name: "chevron-down",
 						class: y(["shrink-0 text-gray-400 transition-all duration-200", { "rotate-180": e }])
 					}, null, 8, ["class"])
 				], 42, Rr)]),
 				content: B(({ close: n }) => [c("ul", zr, [(w(!0), s(e, null, E(t.options, (e) => (w(), s("li", {
-					key: v(e),
+					key: b(e),
 					role: "option",
-					"aria-selected": S.value === v(e),
-					class: y(["flex cursor-pointer items-center justify-between px-4 py-3 text-sm text-gray-900 transition-colors duration-150 hover:bg-gray-50 hover:text-purple-600", { "font-medium text-cornflower-blue-600": S.value === v(e) }]),
-					onClick: (t) => T(e, n)
-				}, [d(k(g(e)) + " ", 1), S.value === v(e) ? (w(), a(Q, {
+					"aria-selected": C.value === b(e),
+					class: y(["flex cursor-pointer items-center justify-between px-4 py-3 text-sm text-gray-900 transition-colors duration-150 hover:bg-gray-50 hover:text-purple-600", { "font-medium text-cornflower-blue-600": C.value === b(e) }]),
+					onClick: (t) => D(e, n)
+				}, [d(k(v(e)) + " ", 1), C.value === b(e) ? (w(), a(Q, {
 					key: 0,
 					name: "check",
 					class: "text-xs"
@@ -3490,9 +3496,9 @@ var cr = /* @__PURE__ */ p({
 				_: 1
 			}, 8, ["placement"]), V(c("input", _({
 				id: A(l),
-				"onUpdate:modelValue": i[0] ||= (e) => b.value = e,
+				"onUpdate:modelValue": i[0] ||= (e) => S.value = e,
 				placeholder: t.placeholder
-			}, m.value, { class: "bg-transparant h-10 w-full min-w-40 px-3 text-sm text-gray-900 placeholder-gray-400 focus:outline-none" }), null, 16, Vr), [[I, b.value]])], 2),
+			}, h.value, { class: "bg-transparant h-10 w-full min-w-40 px-3 text-sm text-gray-900 placeholder-gray-400 focus:outline-none" }), null, 16, Vr), [[I, S.value]])], 2),
 			f(n, {
 				"enter-active-class": "transition-all duration-200 ease-out",
 				"enter-from-class": "opacity-0 -translate-y-1",
@@ -4932,13 +4938,13 @@ var Pa = { render: Na }, Fa = { class: "flex items-center justify-end self-stret
 	}),
 	emits: ["update:modelValue"],
 	setup(e) {
-		let t = e, r = N(e, "modelValue"), a = T("forward");
-		R(() => t.tabs, (e) => {
-			!r.value && e?.length > 0 && (r.value = e[0]);
-		}, { immediate: !0 }), R(r, (e, n) => {
-			a.value = t.tabs.indexOf(e) > t.tabs.indexOf(n) ? "forward" : "backward";
+		let t = e, r = N(e, "modelValue"), a = T("forward"), o = i(() => t.tabs.map((e) => typeof e == "string" ? e : e.label));
+		R(o, (e) => {
+			!r.value && e.length > 0 && (r.value = e[0]);
+		}, { immediate: !0 }), R(r, (e, t) => {
+			a.value = o.value.indexOf(e) > o.value.indexOf(t) ? "forward" : "backward";
 		});
-		let o = (e) => e.toLowerCase().replace(/\s+/g, "-"), l = (e) => `tab-${o(e)}`, u = i(() => t.animated ? {
+		let l = (e) => e.toLowerCase().replace(/\s+/g, "-"), u = (e) => `tab-${l(e)}`, d = i(() => t.animated ? {
 			enterActiveClass: "transition-all duration-300 ease-in-out",
 			leaveActiveClass: "transition-all duration-300 ease-in-out absolute inset-0",
 			enterFromClass: a.value === "forward" ? "-translate-x-10 opacity-0" : "translate-x-10 opacity-0",
@@ -4954,13 +4960,13 @@ var Pa = { render: Na }, Fa = { class: "flex items-center justify-end self-stret
 			"tabs",
 			"modelValue",
 			"tablist-label"
-		]), c("div", oo, [f(n, b(h(u.value)), {
+		]), c("div", oo, [f(n, b(h(d.value)), {
 			default: B(() => [(w(), s("div", {
 				key: r.value,
 				role: "tabpanel",
-				"aria-labelledby": l(r.value),
+				"aria-labelledby": u(r.value),
 				class: "w-full"
-			}, [D(t.$slots, o(r.value))], 8, so))]),
+			}, [D(t.$slots, l(r.value))], 8, so))]),
 			_: 3
 		}, 16)])]));
 	}
@@ -5559,7 +5565,7 @@ var Pa = { render: Na }, Fa = { class: "flex items-center justify-end self-stret
 	},
 	emits: ["dismiss"],
 	setup(e, { emit: t }) {
-		M((e) => ({ v3e3d3e68: us }));
+		M((e) => ({ b622135e: us }));
 		let n = {
 			info: {
 				icon: "info",
@@ -5641,7 +5647,7 @@ var Pa = { render: Na }, Fa = { class: "flex items-center justify-end self-stret
 			})], 8, cs)) : o("", !0)
 		], 42, as));
 	}
-}), [["__scopeId", "data-v-89269eaa"]]), fs = /* @__PURE__ */ p({
+}), [["__scopeId", "data-v-d13bb383"]]), fs = /* @__PURE__ */ p({
 	name: "NexxtToaster",
 	__name: "Toaster",
 	props: {

package/dist/nuxt.js

@@ -2,65 +2,65 @@ import { addComponent as e, addTemplate as t, addVitePlugin as n, createResolver
 import { existsSync as a } from "node:fs";
 import o from "vite-svg-loader";
 var s = {
-	NexxtAnimatedNumber: "components/AnimatedNumber/AnimatedNumber.vue",
-	NexxtAnnouncement: "components/Announcement/Announcement.vue",
-	NexxtAvatar: "components/Avatar/Avatar.vue",
-	NexxtButton: "components/Button/Button.vue",
-	NexxtCalendar: "components/Calendar/Calendar.vue",
-	NexxtCard: "components/Card/Card.vue",
-	NexxtCheckbox: "components/Checkbox/Checkbox.vue",
-	NexxtChip: "components/Chip/Chip.vue",
-	NexxtColorPicker: "components/ColorPicker/ColorPicker.vue",
-	NexxtCombobox: "components/Combobox/Combobox.vue",
-	NexxtComboboxPanel: "components/ComboboxPanel/ComboboxPanel.vue",
-	NexxtContactInfoCard: "components/ContactInfoCard/ContactInfoCard.vue",
-	NexxtCountrySelect: "components/CountrySelect/CountrySelect.vue",
-	NexxtCustomerJourneyTile: "components/CustomerJourneyTile/CustomerJourneyTile.vue",
-	NexxtDatePicker: "components/DatePicker/DatePicker.vue",
-	NexxtDoughnutChart: "components/DoughnutChart/DoughnutChart.vue",
-	NexxtDropdownButton: "components/DropdownButton/DropdownButton.vue",
-	NexxtEnergyLabel: "components/EnergyLabel/EnergyLabel.vue",
-	NexxtFloatingPanel: "components/FloatingPanel/FloatingPanel.vue",
-	NexxtHeader: "components/Header/Header.vue",
-	NexxtIcon: "components/Icon/Icon.vue",
-	NexxtInfoBlock: "components/InfoBlock/InfoBlock.vue",
-	NexxtInputField: "components/InputField/InputField.vue",
-	NexxtInputSelect: "components/InputSelect/InputSelect.vue",
-	NexxtModal: "components/Modal/Modal.vue",
-	NexxtModalFooter: "components/ModalFooter/ModalFooter.vue",
-	NexxtPagination: "components/Pagination/Pagination.vue",
-	NexxtPresenceIndicator: "components/PresenceIndicator/PresenceIndicator.vue",
-	NexxtProgressBar: "components/ProgressBar/ProgressBar.vue",
-	NexxtPropertyCard: "components/PropertyCard/PropertyCard.vue",
-	NexxtPropertyListing: "components/PropertyListing/PropertyListing.vue",
-	NexxtReferenceCard: "components/ReferenceCard/ReferenceCard.vue",
-	NexxtSelect: "components/Select/Select.vue",
-	NexxtSidebarMenuItem: "components/SidebarMenuItem/SidebarMenuItem.vue",
-	NexxtSkeleton: "components/Skeleton/Skeleton.vue",
-	NexxtSkeletonPropertyCard: "components/SkeletonPropertyCard/SkeletonPropertyCard.vue",
-	NexxtSlider: "components/Slider/Slider.vue",
-	NexxtSocialIcons: "components/SocialIcons/SocialIcons.vue",
-	NexxtSocialMediaCustomTemplate: "components/SocialMediaCustomTemplate/SocialMediaCustomTemplate.vue",
-	NexxtSocialMediaTemplate: "components/SocialMediaTemplate/SocialMediaTemplate.vue",
-	NexxtSocialMediaType: "components/SocialMediaType/SocialMediaType.vue",
-	NexxtSource: "components/Source/Source.vue",
-	NexxtSquircle: "components/Squircle/Squircle.vue",
-	NexxtStepperHeader: "components/StepperHeader/StepperHeader.vue",
-	NexxtSwitch: "components/Switch/Switch.vue",
-	NexxtTabbedContent: "components/TabbedContent/TabbedContent.vue",
-	NexxtTable: "components/Table/Table.vue",
-	NexxtTabs: "components/Tabs/Tabs.vue",
-	NexxtTemplateCard: "components/TemplateCard/TemplateCard.vue",
-	NexxtTextarea: "components/Textarea/Textarea.vue",
-	NexxtTimelineEvent: "components/TimelineEvent/TimelineEvent.vue",
-	NexxtTimelineLanes: "components/TimelineLanes/TimelineLanes.vue",
-	NexxtTimelinePhaseblock: "components/TimelinePhaseblock/TimelinePhaseblock.vue",
-	NexxtTimelineTrack: "components/TimelineTrack/TimelineTrack.vue",
-	NexxtToast: "components/Toast/Toast.vue",
-	NexxtToaster: "components/Toaster/Toaster.vue",
-	NexxtToggleGroup: "components/ToggleGroup/ToggleGroup.vue",
-	NexxtTooltip: "components/Tooltip/Tooltip.vue",
-	NexxtVideoPlayer: "components/VideoPlayer/VideoPlayer.vue"
+	NexxtAnimatedNumber: "components/atoms/AnimatedNumber/AnimatedNumber.vue",
+	NexxtAvatar: "components/atoms/Avatar/Avatar.vue",
+	NexxtButton: "components/atoms/Button/Button.vue",
+	NexxtCard: "components/atoms/Card/Card.vue",
+	NexxtCheckbox: "components/atoms/Checkbox/Checkbox.vue",
+	NexxtChip: "components/atoms/Chip/Chip.vue",
+	NexxtEnergyLabel: "components/atoms/EnergyLabel/EnergyLabel.vue",
+	NexxtFloatingPanel: "components/atoms/FloatingPanel/FloatingPanel.vue",
+	NexxtIcon: "components/atoms/Icon/Icon.vue",
+	NexxtPresenceIndicator: "components/atoms/PresenceIndicator/PresenceIndicator.vue",
+	NexxtPropertyListing: "components/atoms/PropertyListing/PropertyListing.vue",
+	NexxtSkeleton: "components/atoms/Skeleton/Skeleton.vue",
+	NexxtSlider: "components/atoms/Slider/Slider.vue",
+	NexxtSquircle: "components/atoms/Squircle/Squircle.vue",
+	NexxtSwitch: "components/atoms/Switch/Switch.vue",
+	NexxtTooltip: "components/atoms/Tooltip/Tooltip.vue",
+	NexxtAnnouncement: "components/molecules/Announcement/Announcement.vue",
+	NexxtContactInfoCard: "components/molecules/ContactInfoCard/ContactInfoCard.vue",
+	NexxtCustomerJourneyTile: "components/molecules/CustomerJourneyTile/CustomerJourneyTile.vue",
+	NexxtDoughnutChart: "components/molecules/DoughnutChart/DoughnutChart.vue",
+	NexxtInfoBlock: "components/molecules/InfoBlock/InfoBlock.vue",
+	NexxtInputField: "components/molecules/InputField/InputField.vue",
+	NexxtInputSelect: "components/molecules/InputSelect/InputSelect.vue",
+	NexxtModalFooter: "components/molecules/ModalFooter/ModalFooter.vue",
+	NexxtPagination: "components/molecules/Pagination/Pagination.vue",
+	NexxtPropertyCard: "components/molecules/PropertyCard/PropertyCard.vue",
+	NexxtSelect: "components/molecules/Select/Select.vue",
+	NexxtSidebarMenuItem: "components/molecules/SidebarMenuItem/SidebarMenuItem.vue",
+	NexxtSkeletonPropertyCard: "components/molecules/SkeletonPropertyCard/SkeletonPropertyCard.vue",
+	NexxtSocialIcons: "components/molecules/SocialIcons/SocialIcons.vue",
+	NexxtSocialMediaCustomTemplate: "components/molecules/SocialMediaCustomTemplate/SocialMediaCustomTemplate.vue",
+	NexxtSocialMediaType: "components/molecules/SocialMediaType/SocialMediaType.vue",
+	NexxtSource: "components/molecules/Source/Source.vue",
+	NexxtTabbedContent: "components/molecules/TabbedContent/TabbedContent.vue",
+	NexxtTabs: "components/molecules/Tabs/Tabs.vue",
+	NexxtTemplateCard: "components/molecules/TemplateCard/TemplateCard.vue",
+	NexxtTextarea: "components/molecules/Textarea/Textarea.vue",
+	NexxtTimelineEvent: "components/molecules/TimelineEvent/TimelineEvent.vue",
+	NexxtTimelineLanes: "components/molecules/TimelineLanes/TimelineLanes.vue",
+	NexxtToast: "components/molecules/Toast/Toast.vue",
+	NexxtToggleGroup: "components/molecules/ToggleGroup/ToggleGroup.vue",
+	NexxtCalendar: "components/organisms/Calendar/Calendar.vue",
+	NexxtColorPicker: "components/organisms/ColorPicker/ColorPicker.vue",
+	NexxtCombobox: "components/organisms/Combobox/Combobox.vue",
+	NexxtComboboxPanel: "components/organisms/ComboboxPanel/ComboboxPanel.vue",
+	NexxtCountrySelect: "components/organisms/CountrySelect/CountrySelect.vue",
+	NexxtDatePicker: "components/organisms/DatePicker/DatePicker.vue",
+	NexxtDropdownButton: "components/organisms/DropdownButton/DropdownButton.vue",
+	NexxtHeader: "components/organisms/Header/Header.vue",
+	NexxtModal: "components/organisms/Modal/Modal.vue",
+	NexxtProgressBar: "components/organisms/ProgressBar/ProgressBar.vue",
+	NexxtReferenceCard: "components/organisms/ReferenceCard/ReferenceCard.vue",
+	NexxtSocialMediaTemplate: "components/organisms/SocialMediaTemplate/SocialMediaTemplate.vue",
+	NexxtStepperHeader: "components/organisms/StepperHeader/StepperHeader.vue",
+	NexxtTable: "components/organisms/Table/Table.vue",
+	NexxtTimelinePhaseblock: "components/organisms/TimelinePhaseblock/TimelinePhaseblock.vue",
+	NexxtTimelineTrack: "components/organisms/TimelineTrack/TimelineTrack.vue",
+	NexxtToaster: "components/organisms/Toaster/Toaster.vue",
+	NexxtVideoPlayer: "components/organisms/VideoPlayer/VideoPlayer.vue"
 }, c = ["@nexxtmove/ui/ui.css", "@nexxtmove/ui/dist/ui.css"], l = (e, t) => e.some((e) => e === t || c.includes(e)), u = i({
 	meta: {
 		name: "@nexxtmove/ui",

package/dist/ui.css

@@ -1,2 +1,2 @@
-.timer-circle[data-v-89269eaa]{stroke-dashoffset:0;animation:linear forwards toast-timer-89269eaa}@keyframes toast-timer-89269eaa{to{stroke-dashoffset:var(--v3e3d3e68)}}
+.timer-circle[data-v-d13bb383]{stroke-dashoffset:0;animation:linear forwards toast-timer-d13bb383}@keyframes toast-timer-d13bb383{to{stroke-dashoffset:var(--b622135e)}}
 /*$vite$:1*/