@skeletonlabs/skeleton-react 4.7.4 → 4.9.0

package/dist/index.mjs

@@ -3,29 +3,30 @@ import { connect, machine, splitItemProps, splitProps } from "@zag-js/accordion"
 import { Portal as Portal$1, mergeProps, normalizeProps, useMachine } from "@zag-js/react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { connect as connect$1, machine as machine$1, splitProps as splitProps$1 } from "@zag-js/avatar";
-import { connect as connect$2, machine as machine$2, splitProps as splitProps$2 } from "@zag-js/collapsible";
-import { connect as connect$3, machine as machine$3, splitItemGroupLabelProps, splitItemGroupProps, splitItemProps as splitItemProps$1, splitProps as splitProps$3 } from "@zag-js/combobox";
-import { connect as connect$4, machine as machine$4, parse as parseDate, splitInputProps, splitPresetTriggerProps, splitProps as splitProps$4, splitTableCellProps, splitViewProps } from "@zag-js/date-picker";
-import { connect as connect$5, machine as machine$5, splitProps as splitProps$5 } from "@zag-js/dialog";
-import { connect as connect$6, machine as machine$6, splitItemProps as splitItemProps$2, splitProps as splitProps$6 } from "@zag-js/file-upload";
-import { connect as connect$7, machine as machine$7, splitProps as splitProps$7, splitResizeTriggerProps } from "@zag-js/floating-panel";
-import { connect as connect$8, machine as machine$8, splitItemGroupLabelProps as splitItemGroupLabelProps$1, splitItemGroupProps as splitItemGroupProps$1, splitItemProps as splitItemProps$3, splitProps as splitProps$8 } from "@zag-js/listbox";
-import { connect as connect$9, machine as machine$9, splitItemGroupLabelProps as splitItemGroupLabelProps$2, splitItemGroupProps as splitItemGroupProps$2, splitItemProps as splitItemProps$4, splitOptionItemProps, splitProps as splitProps$9 } from "@zag-js/menu";
-import { connect as connect$10, machine as machine$10, splitEllipsisProps, splitItemProps as splitItemProps$5, splitProps as splitProps$10 } from "@zag-js/pagination";
-import { connect as connect$11, machine as machine$11, splitProps as splitProps$11 } from "@zag-js/popover";
+import { connect as connect$2, machine as machine$2, splitIndicatorProps, splitItemProps as splitItemProps$1, splitProps as splitProps$2 } from "@zag-js/carousel";
+import { connect as connect$3, machine as machine$3, splitProps as splitProps$3 } from "@zag-js/collapsible";
+import { connect as connect$4, machine as machine$4, splitItemGroupLabelProps, splitItemGroupProps, splitItemProps as splitItemProps$2, splitProps as splitProps$4 } from "@zag-js/combobox";
+import { connect as connect$5, machine as machine$5, parse as parseDate, splitInputProps, splitPresetTriggerProps, splitProps as splitProps$5, splitTableCellProps, splitViewProps } from "@zag-js/date-picker";
+import { connect as connect$6, machine as machine$6, splitProps as splitProps$6 } from "@zag-js/dialog";
+import { connect as connect$7, machine as machine$7, splitItemProps as splitItemProps$3, splitProps as splitProps$7 } from "@zag-js/file-upload";
+import { connect as connect$8, machine as machine$8, splitProps as splitProps$8, splitResizeTriggerProps } from "@zag-js/floating-panel";
+import { connect as connect$9, machine as machine$9, splitItemGroupLabelProps as splitItemGroupLabelProps$1, splitItemGroupProps as splitItemGroupProps$1, splitItemProps as splitItemProps$4, splitProps as splitProps$9 } from "@zag-js/listbox";
+import { connect as connect$10, machine as machine$10, splitItemGroupLabelProps as splitItemGroupLabelProps$2, splitItemGroupProps as splitItemGroupProps$2, splitItemProps as splitItemProps$5, splitOptionItemProps, splitProps as splitProps$10 } from "@zag-js/menu";
+import { connect as connect$11, machine as machine$11, splitEllipsisProps, splitItemProps as splitItemProps$6, splitProps as splitProps$11 } from "@zag-js/pagination";
+import { connect as connect$12, machine as machine$12, splitProps as splitProps$12 } from "@zag-js/popover";
 import { createPortal } from "react-dom";
-import { connect as connect$12, machine as machine$12, splitProps as splitProps$12 } from "@zag-js/progress";
-import { connect as connect$13, machine as machine$13, splitItemProps as splitItemProps$6, splitProps as splitProps$13 } from "@zag-js/rating-group";
-import { connect as connect$14, machine as machine$14, splitItemProps as splitItemProps$7, splitProps as splitProps$14 } from "@zag-js/radio-group";
-import { connect as connect$15, machine as machine$15, splitProps as splitProps$15, splitThumbProps } from "@zag-js/slider";
-import { connect as connect$16, machine as machine$16, splitProps as splitProps$16 } from "@zag-js/steps";
-import { connect as connect$17, machine as machine$17, splitProps as splitProps$17 } from "@zag-js/switch";
-import { connect as connect$18, machine as machine$18, splitContentProps, splitProps as splitProps$18, splitTriggerProps } from "@zag-js/tabs";
-import { connect as connect$19, machine as machine$19, splitItemProps as splitItemProps$8, splitProps as splitProps$19 } from "@zag-js/tags-input";
-import { connect as connect$20, createStore as createToaster, group, machine as machine$20 } from "@zag-js/toast";
-import { connect as connect$21, machine as machine$21, splitItemProps as splitItemProps$9, splitProps as splitProps$20 } from "@zag-js/toggle-group";
-import { connect as connect$22, machine as machine$22, splitProps as splitProps$21 } from "@zag-js/tooltip";
-import { collection as createTreeViewCollection, connect as connect$23, machine as machine$23, splitProps as splitProps$22 } from "@zag-js/tree-view";
+import { connect as connect$13, machine as machine$13, splitProps as splitProps$13 } from "@zag-js/progress";
+import { connect as connect$14, machine as machine$14, splitItemProps as splitItemProps$7, splitProps as splitProps$14 } from "@zag-js/rating-group";
+import { connect as connect$15, machine as machine$15, splitItemProps as splitItemProps$8, splitProps as splitProps$15 } from "@zag-js/radio-group";
+import { connect as connect$16, machine as machine$16, splitProps as splitProps$16, splitThumbProps } from "@zag-js/slider";
+import { connect as connect$17, machine as machine$17, splitProps as splitProps$17 } from "@zag-js/steps";
+import { connect as connect$18, machine as machine$18, splitProps as splitProps$18 } from "@zag-js/switch";
+import { connect as connect$19, machine as machine$19, splitContentProps, splitProps as splitProps$19, splitTriggerProps } from "@zag-js/tabs";
+import { connect as connect$20, machine as machine$20, splitItemProps as splitItemProps$9, splitProps as splitProps$20 } from "@zag-js/tags-input";
+import { connect as connect$21, createStore as createToaster, group, machine as machine$21 } from "@zag-js/toast";
+import { connect as connect$22, machine as machine$22, splitItemProps as splitItemProps$10, splitProps as splitProps$21 } from "@zag-js/toggle-group";
+import { connect as connect$23, machine as machine$23, splitProps as splitProps$22 } from "@zag-js/tooltip";
+import { collection as createTreeViewCollection, connect as connect$24, machine as machine$24, splitProps as splitProps$23 } from "@zag-js/tree-view";
 import { ListCollection } from "@zag-js/collection";
 
 //#region src/internal/create-context.ts
@@ -48,12 +49,12 @@ function useAccordion(props = {}) {
 
 //#endregion
 //#region src/components/accordion/modules/root-context.ts
-const RootContext$48 = createContext$1();
+const RootContext$50 = createContext$1();
 
 //#endregion
 //#region src/components/accordion/anatomy/item-content.tsx
 function ItemContent(props) {
-	const accordion = use(RootContext$48);
+	const accordion = use(RootContext$50);
 	const itemProps = use(ItemContext$7);
 	const { element, children, ...rest } = props;
 	const attributes = mergeProps(accordion.getItemContentProps(itemProps), rest);
@@ -66,7 +67,7 @@ function ItemContent(props) {
 //#endregion
 //#region src/components/accordion/anatomy/item-indicator.tsx
 function ItemIndicator$3(props) {
-	const accordion = use(RootContext$48);
+	const accordion = use(RootContext$50);
 	const itemProps = use(ItemContext$7);
 	const { element, children, ...rest } = props;
 	const attributes = mergeProps(accordion.getItemIndicatorProps(itemProps), rest);
@@ -79,7 +80,7 @@ function ItemIndicator$3(props) {
 //#endregion
 //#region src/components/accordion/anatomy/item-trigger.tsx
 function ItemTrigger(props) {
-	const accordion = use(RootContext$48);
+	const accordion = use(RootContext$50);
 	const itemProps = use(ItemContext$7);
 	const { element, children, ...rest } = props;
 	const attributes = mergeProps(accordion.getItemTriggerProps(itemProps), rest);
@@ -91,8 +92,8 @@ function ItemTrigger(props) {
 
 //#endregion
 //#region src/components/accordion/anatomy/item.tsx
-function Item$11(props) {
-	const accordion = use(RootContext$48);
+function Item$12(props) {
+	const accordion = use(RootContext$50);
 	const [itemProps, componentProps] = splitItemProps(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(accordion.getItemProps(itemProps), rest);
@@ -107,18 +108,18 @@ function Item$11(props) {
 
 //#endregion
 //#region src/components/accordion/anatomy/root-context.tsx
-function RootContext$47(props) {
-	const accordion = use(RootContext$48);
+function RootContext$49(props) {
+	const accordion = use(RootContext$50);
 	const { children } = props;
 	return children(accordion);
 }
 
 //#endregion
 //#region src/components/accordion/anatomy/root-provider.tsx
-function RootProvider$17(props) {
+function RootProvider$18(props) {
 	const { element, children, value: accordion, ...rest } = props;
 	const attributes = mergeProps(accordion.getRootProps(), rest);
-	return /* @__PURE__ */ jsx(RootContext$48.Provider, {
+	return /* @__PURE__ */ jsx(RootContext$50.Provider, {
 		value: accordion,
 		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
 			...attributes,
@@ -129,12 +130,12 @@ function RootProvider$17(props) {
 
 //#endregion
 //#region src/components/accordion/anatomy/root.tsx
-function Root$18(props) {
+function Root$19(props) {
 	const [accordionProps, componentProps] = splitProps(props);
 	const { element, children, ...rest } = componentProps;
 	const accordion = useAccordion(accordionProps);
 	const attributes = mergeProps(accordion.getRootProps(), rest);
-	return /* @__PURE__ */ jsx(RootContext$48.Provider, {
+	return /* @__PURE__ */ jsx(RootContext$50.Provider, {
 		value: accordion,
 		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
 			...attributes,
@@ -145,10 +146,10 @@ function Root$18(props) {
 
 //#endregion
 //#region src/components/accordion/modules/anatomy.ts
-const Accordion = Object.assign(Root$18, {
-	Provider: RootProvider$17,
-	Context: RootContext$47,
-	Item: Item$11,
+const Accordion = Object.assign(Root$19, {
+	Provider: RootProvider$18,
+	Context: RootContext$49,
+	Item: Item$12,
 	ItemTrigger,
 	ItemIndicator: ItemIndicator$3,
 	ItemContent
@@ -235,12 +236,12 @@ const AppBar = Object.assign(AppBarRoot, {
 
 //#endregion
 //#region src/components/avatar/modules/root-context.ts
-const RootContext$46 = createContext$1();
+const RootContext$48 = createContext$1();
 
 //#endregion
 //#region src/components/avatar/anatomy/fallback.tsx
 function Fallback(props) {
-	const avatar = use(RootContext$46);
+	const avatar = use(RootContext$48);
 	const { element, children, ...rest } = props;
 	const attributes = mergeProps(avatar.getFallbackProps(), rest);
 	return element ? element(attributes) : /* @__PURE__ */ jsx("span", {
@@ -252,7 +253,7 @@ function Fallback(props) {
 //#endregion
 //#region src/components/avatar/anatomy/image.tsx
 function Image(props) {
-	const avatar = use(RootContext$46);
+	const avatar = use(RootContext$48);
 	const { element, ...rest } = props;
 	const attributes = mergeProps(avatar.getImageProps(), rest);
 	return element ? element(attributes) : /* @__PURE__ */ jsx("img", { ...attributes });
@@ -260,8 +261,8 @@ function Image(props) {
 
 //#endregion
 //#region src/components/avatar/anatomy/root-context.tsx
-function RootContext$45(props) {
-	const avatar = use(RootContext$46);
+function RootContext$47(props) {
+	const avatar = use(RootContext$48);
 	const { children } = props;
 	return children(avatar);
 }
@@ -271,7 +272,7 @@ function RootContext$45(props) {
 function AvatarRootProvider(props) {
 	const { element, children, value: avatar, ...rest } = props;
 	const attributes = mergeProps(avatar.getRootProps(), rest);
-	return /* @__PURE__ */ jsx(RootContext$46.Provider, {
+	return /* @__PURE__ */ jsx(RootContext$48.Provider, {
 		value: avatar,
 		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
 			...attributes,
@@ -296,7 +297,7 @@ function AvatarRoot(props) {
 	const { element, children, ...rest } = componentProps;
 	const avatar = useAvatar(avatarProps);
 	const attributes = mergeProps(avatar.getRootProps(), rest);
-	return /* @__PURE__ */ jsx(RootContext$46.Provider, {
+	return /* @__PURE__ */ jsx(RootContext$48.Provider, {
 		value: avatar,
 		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
 			...attributes,
@@ -309,11 +310,193 @@ function AvatarRoot(props) {
 //#region src/components/avatar/modules/anatomy.ts
 const Avatar = Object.assign(AvatarRoot, {
 	Provider: AvatarRootProvider,
-	Context: RootContext$45,
+	Context: RootContext$47,
 	Image,
 	Fallback
 });
 
+//#endregion
+//#region src/components/carousel/modules/root-context.ts
+const RootContext$46 = createContext$1();
+
+//#endregion
+//#region src/components/carousel/anatomy/autoplay-trigger.tsx
+function AutoplayTrigger(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getAutoplayTriggerProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/control.tsx
+function Control$8(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getControlProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/indicator.tsx
+function Indicator$5(props) {
+	const carousel = use(RootContext$46);
+	const [indicatorProps, componentProps] = splitIndicatorProps(props);
+	const { element, children, ...rest } = componentProps;
+	const attributes = mergeProps(carousel.getIndicatorProps(indicatorProps), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/indicator-group.tsx
+function IndicatorGroup(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getIndicatorGroupProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/item.tsx
+function Item$11(props) {
+	const carousel = use(RootContext$46);
+	const [itemProps, componentProps] = splitItemProps$1(props);
+	const { element, children, ...rest } = componentProps;
+	const attributes = mergeProps(carousel.getItemProps(itemProps), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/item-group.tsx
+function ItemGroup$4(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getItemGroupProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/next-trigger.tsx
+function NextTrigger$3(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getNextTriggerProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/prev-trigger.tsx
+function PrevTrigger$3(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getPrevTriggerProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/progress-text.tsx
+function ProgressText(props) {
+	const carousel = use(RootContext$46);
+	const { element, children, ...rest } = props;
+	const attributes = mergeProps(carousel.getProgressTextProps(), rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/root-context.tsx
+function RootContext$45(props) {
+	const carousel = use(RootContext$46);
+	const { children } = props;
+	return children(carousel);
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/root-provider.tsx
+function RootProvider$17(props) {
+	const { element, children, value: carousel, ...rest } = props;
+	const attributes = mergeProps(carousel.getRootProps(), rest);
+	return /* @__PURE__ */ jsx(RootContext$46.Provider, {
+		value: carousel,
+		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+			...attributes,
+			children
+		})
+	});
+}
+
+//#endregion
+//#region src/components/carousel/modules/provider.ts
+function useCarousel(props) {
+	const { slideCount, ...rest } = props;
+	return connect$2(useMachine(machine$2, {
+		id: useId(),
+		slideCount: slideCount ?? 0,
+		...rest
+	}), normalizeProps);
+}
+
+//#endregion
+//#region src/components/carousel/anatomy/root.tsx
+function Root$18(props) {
+	const [carouselProps, componentProps] = splitProps$2(props);
+	const { element, children, ...rest } = componentProps;
+	const carousel = useCarousel({
+		...carouselProps,
+		slideCount: props.slideCount
+	});
+	const attributes = mergeProps(carousel.getRootProps(), rest);
+	return /* @__PURE__ */ jsx(RootContext$46.Provider, {
+		value: carousel,
+		children: element ? element(attributes) : /* @__PURE__ */ jsx("div", {
+			...attributes,
+			children
+		})
+	});
+}
+
+//#endregion
+//#region src/components/carousel/modules/anatomy.ts
+const Carousel = Object.assign(Root$18, {
+	Provider: RootProvider$17,
+	Context: RootContext$45,
+	Control: Control$8,
+	ItemGroup: ItemGroup$4,
+	Item: Item$11,
+	PrevTrigger: PrevTrigger$3,
+	NextTrigger: NextTrigger$3,
+	AutoplayTrigger,
+	IndicatorGroup,
+	Indicator: Indicator$5,
+	ProgressText
+});
+
 //#endregion
 //#region src/components/collapsible/modules/root-context.ts
 const RootContext$44 = createContext$1();
@@ -367,7 +550,7 @@ function CollapsibleRootProvider(props) {
 //#endregion
 //#region src/components/collapsible/modules/provider.ts
 function useCollapsible(props = {}) {
-	return connect$2(useMachine(machine$2, {
+	return connect$3(useMachine(machine$3, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -376,7 +559,7 @@ function useCollapsible(props = {}) {
 //#endregion
 //#region src/components/collapsible/anatomy/root.tsx
 function CollapsibleRoot(props) {
-	const [collapsibleProps, componentProps] = splitProps$2(props);
+	const [collapsibleProps, componentProps] = splitProps$3(props);
 	const { element, children, ...rest } = componentProps;
 	const collapsible = useCollapsible(collapsibleProps);
 	const attributes = mergeProps(collapsible.getRootProps(), rest);
@@ -553,7 +736,7 @@ function ItemText$4(props) {
 //#region src/components/combobox/anatomy/item.tsx
 function Item$10(props) {
 	const combobox = use(RootContext$42);
-	const [itemProps, componentProps] = splitItemProps$1(props);
+	const [itemProps, componentProps] = splitItemProps$2(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(combobox.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext$6.Provider, {
@@ -600,7 +783,7 @@ function RootContext$41(props) {
 //#endregion
 //#region src/components/combobox/modules/provider.ts
 function useCombobox(props = {}) {
-	return connect$3(useMachine(machine$3, {
+	return connect$4(useMachine(machine$4, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -623,7 +806,7 @@ function RootProvider$16(props) {
 //#endregion
 //#region src/components/combobox/anatomy/root.tsx
 function Root$17(props) {
-	const [comboboxProps, componentProps] = splitProps$3(props);
+	const [comboboxProps, componentProps] = splitProps$4(props);
 	const { element, children, ...rest } = componentProps;
 	const combobox = useCombobox(comboboxProps);
 	const attributes = mergeProps(combobox.getRootProps(), rest);
@@ -871,7 +1054,7 @@ function RootContext$39(props) {
 //#endregion
 //#region src/components/date-picker/modules/provider.ts
 function useDatePicker(props = {}) {
-	return connect$4(useMachine(machine$4, {
+	return connect$5(useMachine(machine$5, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -894,7 +1077,7 @@ function RootProvider$15(props) {
 //#endregion
 //#region src/components/date-picker/anatomy/root.tsx
 function Root$16(props) {
-	const [datePickerProps, componentProps] = splitProps$4(props);
+	const [datePickerProps, componentProps] = splitProps$5(props);
 	const { element, children, ...rest } = componentProps;
 	const datePicker = useDatePicker(datePickerProps);
 	const attributes = mergeProps(datePicker.getRootProps(), rest);
@@ -1232,7 +1415,7 @@ function RootProvider$14(props) {
 //#endregion
 //#region src/components/dialog/modules/provider.ts
 function useDialog(props = {}) {
-	return connect$5(useMachine(machine$5, {
+	return connect$6(useMachine(machine$6, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -1241,7 +1424,7 @@ function useDialog(props = {}) {
 //#endregion
 //#region src/components/dialog/anatomy/root.tsx
 function Root$15(props) {
-	const [dialogProps, componentProps] = splitProps$5(props);
+	const [dialogProps, componentProps] = splitProps$6(props);
 	const { children } = componentProps;
 	const dialog = useDialog(dialogProps);
 	return /* @__PURE__ */ jsx(RootContext$38.Provider, {
@@ -1384,7 +1567,7 @@ function ItemSizeText(props) {
 //#region src/components/file-upload/anatomy/item.tsx
 function Item$9(props) {
 	const fileUpload = use(RootContext$36);
-	const [itemProps, componentProps] = splitItemProps$2(props);
+	const [itemProps, componentProps] = splitItemProps$3(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(fileUpload.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext$5.Provider, {
@@ -1433,7 +1616,7 @@ function RootProvider$13(props) {
 //#endregion
 //#region src/components/file-upload/modules/provider.ts
 function useFileUpload(props = {}) {
-	return connect$6(useMachine(machine$6, {
+	return connect$7(useMachine(machine$7, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -1442,7 +1625,7 @@ function useFileUpload(props = {}) {
 //#endregion
 //#region src/components/file-upload/anatomy/root.tsx
 function Root$14(props) {
-	const [fileUploadProps, componentProps] = splitProps$6(props);
+	const [fileUploadProps, componentProps] = splitProps$7(props);
 	const { element, children, ...rest } = componentProps;
 	const fileUpload = useFileUpload(fileUploadProps);
 	const attributes = mergeProps(fileUpload.getRootProps(), rest);
@@ -1606,7 +1789,7 @@ function RootProvider$12(props) {
 //#endregion
 //#region src/components/floating-panel/modules/provider.ts
 function useFloatingPanel(props = {}) {
-	return connect$7(useMachine(machine$7, {
+	return connect$8(useMachine(machine$8, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -1615,7 +1798,7 @@ function useFloatingPanel(props = {}) {
 //#endregion
 //#region src/components/floating-panel/anatomy/root.tsx
 function Root$13(props) {
-	const [floatingPanelProps, componentProps] = splitProps$7(props);
+	const [floatingPanelProps, componentProps] = splitProps$8(props);
 	const { children } = componentProps;
 	const floatingPanel = useFloatingPanel(floatingPanelProps);
 	return /* @__PURE__ */ jsx(RootContext$34.Provider, {
@@ -1776,7 +1959,7 @@ function ItemText$3(props) {
 //#region src/components/listbox/anatomy/item.tsx
 function Item$8(props) {
 	const listbox = use(RootContext$32);
-	const [itemProps, componentProps] = splitItemProps$3(props);
+	const [itemProps, componentProps] = splitItemProps$4(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(listbox.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext$4.Provider, {
@@ -1811,7 +1994,7 @@ function RootContext$31(props) {
 //#endregion
 //#region src/components/listbox/modules/provider.ts
 function useListbox(props) {
-	return connect$8(useMachine(machine$8, {
+	return connect$9(useMachine(machine$9, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -1834,7 +2017,7 @@ function RootProvider$11(props) {
 //#endregion
 //#region src/components/listbox/anatomy/root.tsx
 function Root$12(props) {
-	const [listboxProps, componentProps] = splitProps$8(props);
+	const [listboxProps, componentProps] = splitProps$9(props);
 	const { element, children, ...rest } = componentProps;
 	const listbox = useListbox(listboxProps);
 	const attributes = mergeProps(listbox.getRootProps(), rest);
@@ -1999,7 +2182,7 @@ function ItemText$2(props) {
 //#region src/components/menu/anatomy/item.tsx
 function Item$7(props) {
 	const menu = use(RootContext$30);
-	const [itemProps, componentProps] = splitItemProps$4(props);
+	const [itemProps, componentProps] = splitItemProps$5(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(menu.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext$3.Provider, {
@@ -2073,12 +2256,12 @@ function RootProvider$10(props) {
 //#endregion
 //#region src/components/menu/modules/provider.ts
 function useMenu(props = {}) {
-	const service = useMachine(machine$9, {
+	const service = useMachine(machine$10, {
 		id: useId(),
 		...props
 	});
 	return {
-		...connect$9(service, normalizeProps),
+		...connect$10(service, normalizeProps),
 		service
 	};
 }
@@ -2087,7 +2270,7 @@ function useMenu(props = {}) {
 //#region src/components/menu/anatomy/root.tsx
 function Root$11(props) {
 	const parentMenu = use(RootContext$30);
-	const [menuProps, componentProps] = splitProps$9(props);
+	const [menuProps, componentProps] = splitProps$10(props);
 	const { children } = componentProps;
 	const menu = useMenu(menuProps);
 	useEffect(() => {
@@ -2117,7 +2300,7 @@ function Separator$1(props) {
 //#region src/components/menu/anatomy/trigger-item.tsx
 function TriggerItem(props) {
 	const triggerItemProps = use(TriggerItemContext);
-	const [itemProps, componentProps] = splitItemProps$4(props);
+	const [itemProps, componentProps] = splitItemProps$5(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(triggerItemProps, rest);
 	return /* @__PURE__ */ jsx(ItemContext$3.Provider, {
@@ -2263,6 +2446,55 @@ function NavigationMenu(props) {
 	});
 }
 
+//#endregion
+//#region src/components/navigation/anatomy/trigger.tsx
+function NavigationTrigger(props) {
+	const { element, children, ...rest } = props;
+	const navigation = use(RootContext$28);
+	const attributes = mergeProps({
+		"data-scope": "navigation",
+		"data-part": "trigger",
+		"data-layout": navigation.layout,
+		type: "button"
+	}, rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/navigation/anatomy/trigger-anchor.tsx
+function NavigationTriggerAnchor(props) {
+	const { element, children, ...rest } = props;
+	const navigation = use(RootContext$28);
+	const attributes = mergeProps({
+		"data-scope": "navigation",
+		"data-part": "trigger-anchor",
+		"data-layout": navigation.layout
+	}, rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("a", {
+		...attributes,
+		children
+	});
+}
+
+//#endregion
+//#region src/components/navigation/anatomy/trigger-text.tsx
+function NavigationTriggerText(props) {
+	const { element, children, ...rest } = props;
+	const navigation = use(RootContext$28);
+	const attributes = mergeProps({
+		"data-scope": "navigation",
+		"data-part": "trigger-text",
+		"data-layout": navigation.layout
+	}, rest);
+	return element ? element(attributes) : /* @__PURE__ */ jsx("span", {
+		...attributes,
+		children
+	});
+}
+
 //#endregion
 //#region src/components/navigation/anatomy/root.tsx
 function NavigationRoot(props) {
@@ -2289,6 +2521,9 @@ const Navigation = Object.assign(NavigationRoot, {
 	Group: NavigationGroup,
 	Label: NavigationLabel,
 	Menu: NavigationMenu,
+	Trigger: NavigationTrigger,
+	TriggerAnchor: NavigationTriggerAnchor,
+	TriggerText: NavigationTriggerText,
 	Footer: NavigationFooter
 });
 
@@ -2325,7 +2560,7 @@ function FirstTrigger(props) {
 //#region src/components/pagination/anatomy/item.tsx
 function Item$6(props) {
 	const pagination = use(RootContext$27);
-	const [itemProps, componentProps] = splitItemProps$5(props);
+	const [itemProps, componentProps] = splitItemProps$6(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(pagination.getItemProps(itemProps), rest);
 	return element ? element(attributes) : /* @__PURE__ */ jsx("a", {
@@ -2395,7 +2630,7 @@ function PaginationRootProvider(props) {
 //#endregion
 //#region src/components/pagination/modules/provider.ts
 function usePagination(props = {}) {
-	return connect$10(useMachine(machine$10, {
+	return connect$11(useMachine(machine$11, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -2404,7 +2639,7 @@ function usePagination(props = {}) {
 //#endregion
 //#region src/components/pagination/anatomy/root.tsx
 function PaginationRoot(props) {
-	const [paginationProps, componentProps] = splitProps$10(props);
+	const [paginationProps, componentProps] = splitProps$11(props);
 	const { element, children, ...rest } = componentProps;
 	const pagination = usePagination(paginationProps);
 	const attributes = mergeProps(pagination.getRootProps(), rest);
@@ -2539,7 +2774,7 @@ function RootProvider$9(props) {
 //#endregion
 //#region src/components/popover/modules/provider.ts
 function usePopover(props = {}) {
-	return connect$11(useMachine(machine$11, {
+	return connect$12(useMachine(machine$12, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -2548,7 +2783,7 @@ function usePopover(props = {}) {
 //#endregion
 //#region src/components/popover/anatomy/root.tsx
 function Root$10(props) {
-	const [popoverProps, componentProps] = splitProps$11(props);
+	const [popoverProps, componentProps] = splitProps$12(props);
 	const { children } = componentProps;
 	const popover = usePopover(popoverProps);
 	return /* @__PURE__ */ jsx(RootContext$25.Provider, {
@@ -2689,7 +2924,7 @@ function RootProvider$8(props) {
 //#endregion
 //#region src/components/progress/modules/provider.ts
 function useProgress(props = {}) {
-	return connect$12(useMachine(machine$12, {
+	return connect$13(useMachine(machine$13, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -2698,7 +2933,7 @@ function useProgress(props = {}) {
 //#endregion
 //#region src/components/progress/anatomy/root.tsx
 function Root$8(props) {
-	const [progressProps, componentProps] = splitProps$12(props);
+	const [progressProps, componentProps] = splitProps$13(props);
 	const { element, children, ...rest } = componentProps;
 	const progress = useProgress(progressProps);
 	const attributes = mergeProps(progress.getRootProps(), rest);
@@ -2856,7 +3091,7 @@ function StarHalf(props) {
 //#region src/components/rating-group/anatomy/item.tsx
 function Item$5(props) {
 	const ratingGroup = use(RootContext$21);
-	const [itemProps, componentProps] = splitItemProps$6(props);
+	const [itemProps, componentProps] = splitItemProps$7(props);
 	const { element, children, empty = /* @__PURE__ */ jsx(StarEmpty, {}), half = /* @__PURE__ */ jsx(StarHalf, {}), full = /* @__PURE__ */ jsx(StarFull, {}), ...rest } = componentProps;
 	const itemState = ratingGroup.getItemState(itemProps);
 	const attributes = mergeProps(ratingGroup.getItemProps(itemProps), rest);
@@ -2903,7 +3138,7 @@ function RootProvider$7(props) {
 //#endregion
 //#region src/components/rating-group/modules/provider.ts
 function useRatingGroup(props = {}) {
-	return connect$13(useMachine(machine$13, {
+	return connect$14(useMachine(machine$14, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -2912,7 +3147,7 @@ function useRatingGroup(props = {}) {
 //#endregion
 //#region src/components/rating-group/anatomy/root.tsx
 function Root$7(props) {
-	const [ratingGroupProps, componentProps] = splitProps$13(props);
+	const [ratingGroupProps, componentProps] = splitProps$14(props);
 	const { element, children, ...rest } = componentProps;
 	const ratingGroup = useRatingGroup(ratingGroupProps);
 	const attributes = mergeProps(ratingGroup.getRootProps(), rest);
@@ -2994,7 +3229,7 @@ function ItemText$1(props) {
 //#region src/components/segmented-control/anatomy/item.tsx
 function Item$4(props) {
 	const segmentedControl = use(RootContext$19);
-	const [itemProps, componentProps] = splitItemProps$7(props);
+	const [itemProps, componentProps] = splitItemProps$8(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(segmentedControl.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext$2.Provider, {
@@ -3043,7 +3278,7 @@ function RootProvider$6(props) {
 //#endregion
 //#region src/components/segmented-control/modules/provider.ts
 function useSegmentedControl(props = {}) {
-	return connect$14(useMachine(machine$14, {
+	return connect$15(useMachine(machine$15, {
 		id: useId(),
 		orientation: "horizontal",
 		...props
@@ -3053,7 +3288,7 @@ function useSegmentedControl(props = {}) {
 //#endregion
 //#region src/components/segmented-control/anatomy/root.tsx
 function Root$6(props) {
-	const [segmentedControlProps, componentProps] = splitProps$14(props);
+	const [segmentedControlProps, componentProps] = splitProps$15(props);
 	const { element, children, ...rest } = componentProps;
 	const segmentedControl = useSegmentedControl(segmentedControlProps);
 	const attributes = mergeProps(segmentedControl.getRootProps(), rest);
@@ -3182,7 +3417,7 @@ function SliderRootProvider(props) {
 //#endregion
 //#region src/components/slider/modules/provider.ts
 function useSlider(props = {}) {
-	return connect$15(useMachine(machine$15, {
+	return connect$16(useMachine(machine$16, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -3191,7 +3426,7 @@ function useSlider(props = {}) {
 //#endregion
 //#region src/components/slider/anatomy/root.tsx
 function SliderRoot$1(props) {
-	const [sliderProps, componentProps] = splitProps$15(props);
+	const [sliderProps, componentProps] = splitProps$16(props);
 	const { element, children, ...rest } = componentProps;
 	const slider = useSlider(sliderProps);
 	const attributes = mergeProps(slider.getRootProps(), rest);
@@ -3370,7 +3605,7 @@ function RootProvider$5(props) {
 //#endregion
 //#region src/components/steps/modules/provider.ts
 function useSteps(props = {}) {
-	return connect$16(useMachine(machine$16, {
+	return connect$17(useMachine(machine$17, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -3379,7 +3614,7 @@ function useSteps(props = {}) {
 //#endregion
 //#region src/components/steps/anatomy/root.tsx
 function SliderRoot(props) {
-	const [stepsProps, componentProps] = splitProps$16(props);
+	const [stepsProps, componentProps] = splitProps$17(props);
 	const { element, children, ...rest } = componentProps;
 	const steps = useSteps(stepsProps);
 	const attributes = mergeProps(steps.getRootProps(), rest);
@@ -3495,7 +3730,7 @@ function RootProvider$4(props) {
 //#endregion
 //#region src/components/switch/modules/provider.ts
 function useSwitch(props = {}) {
-	return connect$17(useMachine(machine$17, {
+	return connect$18(useMachine(machine$18, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -3504,7 +3739,7 @@ function useSwitch(props = {}) {
 //#endregion
 //#region src/components/switch/anatomy/root.tsx
 function Root$5(props) {
-	const [switchProps, componentProps] = splitProps$17(props);
+	const [switchProps, componentProps] = splitProps$18(props);
 	const { element, children, ...rest } = componentProps;
 	const switch_ = useSwitch(switchProps);
 	const attributes = mergeProps(switch_.getRootProps(), rest);
@@ -3603,7 +3838,7 @@ function RootProvider$3(props) {
 //#endregion
 //#region src/components/tabs/modules/provider.ts
 function useTabs(props = {}) {
-	return connect$18(useMachine(machine$18, {
+	return connect$19(useMachine(machine$19, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -3612,7 +3847,7 @@ function useTabs(props = {}) {
 //#endregion
 //#region src/components/tabs/anatomy/root.tsx
 function Root$4(props) {
-	const [tabsProps, componentProps] = splitProps$18(props);
+	const [tabsProps, componentProps] = splitProps$19(props);
 	const { element, children, ...rest } = componentProps;
 	const tabs = useTabs(tabsProps);
 	const attributes = mergeProps(tabs.getRootProps(), rest);
@@ -3752,7 +3987,7 @@ function ItemText(props) {
 //#region src/components/tags-input/anatomy/item.tsx
 function Item$2(props) {
 	const tagsInput = use(RootContext$9);
-	const [itemProps, componentProps] = splitItemProps$8(props);
+	const [itemProps, componentProps] = splitItemProps$9(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(tagsInput.getItemProps(itemProps), rest);
 	return /* @__PURE__ */ jsx(ItemContext.Provider, {
@@ -3801,7 +4036,7 @@ function RootProvider$2(props) {
 //#endregion
 //#region src/components/tags-input/modules/provider.ts
 function useTagsInput(props = {}) {
-	return connect$19(useMachine(machine$19, {
+	return connect$20(useMachine(machine$20, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -3810,7 +4045,7 @@ function useTagsInput(props = {}) {
 //#endregion
 //#region src/components/tags-input/anatomy/root.tsx
 function Root$3(props) {
-	const [tagsInputProps, componentProps] = splitProps$19(props);
+	const [tagsInputProps, componentProps] = splitProps$20(props);
 	const { element, children, ...rest } = componentProps;
 	const tagsInput = useTagsInput(tagsInputProps);
 	const attributes = mergeProps(tagsInput.getRootProps(), rest);
@@ -3950,7 +4185,7 @@ function RootContext$6(props) {
 function Root$2(props) {
 	const group$1 = use(GroupContext);
 	const { element, children, toast: toastProps, ...rest } = props;
-	const toast = connect$20(useMachine(machine$20, {
+	const toast = connect$21(useMachine(machine$21, {
 		...toastProps,
 		parent: group$1
 	}), normalizeProps);
@@ -4000,7 +4235,7 @@ const RootContext$5 = createContext$1();
 //#region src/components/toggle-group/anatomy/item.tsx
 function Item$1(props) {
 	const toggleGroup = use(RootContext$5);
-	const [itemProps, componentProps] = splitItemProps$9(props);
+	const [itemProps, componentProps] = splitItemProps$10(props);
 	const { element, children, ...rest } = componentProps;
 	const attributes = mergeProps(toggleGroup.getItemProps(itemProps), rest);
 	return element ? element(attributes) : /* @__PURE__ */ jsx("button", {
@@ -4034,7 +4269,7 @@ function ToggleGroupRootProvider(props) {
 //#endregion
 //#region src/components/toggle-group/modules/provider.ts
 function useToggleGroup(props = {}) {
-	return connect$21(useMachine(machine$21, {
+	return connect$22(useMachine(machine$22, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -4043,7 +4278,7 @@ function useToggleGroup(props = {}) {
 //#endregion
 //#region src/components/toggle-group/anatomy/root.tsx
 function ToggleGroupRoot(props) {
-	const [toggleGroupProps, componentProps] = splitProps$20(props);
+	const [toggleGroupProps, componentProps] = splitProps$21(props);
 	const { element, children, ...rest } = componentProps;
 	const toggleGroup = useToggleGroup(toggleGroupProps);
 	const attributes = mergeProps(toggleGroup.getRootProps(), rest);
@@ -4137,7 +4372,7 @@ function RootProvider$1(props) {
 //#endregion
 //#region src/components/tooltip/modules/provider.ts
 function useTooltip(props = {}) {
-	return connect$22(useMachine(machine$22, {
+	return connect$23(useMachine(machine$23, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -4146,7 +4381,7 @@ function useTooltip(props = {}) {
 //#endregion
 //#region src/components/tooltip/anatomy/root.tsx
 function Root$1(props) {
-	const [tooltipProps, componentProps] = splitProps$21(props);
+	const [tooltipProps, componentProps] = splitProps$22(props);
 	const { children } = componentProps;
 	const tooltip = useTooltip(tooltipProps);
 	return /* @__PURE__ */ jsx(RootContext$3.Provider, {
@@ -4334,7 +4569,7 @@ function RootProvider(props) {
 //#endregion
 //#region src/components/tree-view/modules/provider.ts
 function useTreeView(props = {}) {
-	return connect$23(useMachine(machine$23, {
+	return connect$24(useMachine(machine$24, {
 		id: useId(),
 		...props
 	}), normalizeProps);
@@ -4343,7 +4578,7 @@ function useTreeView(props = {}) {
 //#endregion
 //#region src/components/tree-view/anatomy/root.tsx
 function Root(props) {
-	const [treeViewProps, componentProps] = splitProps$22(props);
+	const [treeViewProps, componentProps] = splitProps$23(props);
 	const { element, children, ...rest } = componentProps;
 	const treeView = useTreeView(treeViewProps);
 	const attributes = mergeProps(treeView.getRootProps(), rest);
@@ -4393,4 +4628,4 @@ function useListCollection(options) {
 }
 
 //#endregion
-export { Accordion, AppBar, Avatar, Collapsible, Combobox, DatePicker, Dialog, FileUpload, FloatingPanel, Listbox, Menu, Navigation, Pagination, Popover, Portal, Progress, RatingGroup, SegmentedControl, Slider, Steps, Switch, Tabs, TagsInput, Toast, ToggleGroup, Tooltip, TreeView, createToaster, createTreeViewCollection, parseDate, useAccordion, useAvatar, useCollapsible, useCombobox, useDatePicker, useDialog, useFileUpload, useFloatingPanel, useListCollection, useListbox, useMenu, usePagination, usePopover, useProgress, useRatingGroup, useSegmentedControl, useSlider, useSteps, useSwitch, useTabs, useTagsInput, useToggleGroup, useTooltip, useTreeView };
+export { Accordion, AppBar, Avatar, Carousel, Collapsible, Combobox, DatePicker, Dialog, FileUpload, FloatingPanel, Listbox, Menu, Navigation, Pagination, Popover, Portal, Progress, RatingGroup, SegmentedControl, Slider, Steps, Switch, Tabs, TagsInput, Toast, ToggleGroup, Tooltip, TreeView, createToaster, createTreeViewCollection, parseDate, useAccordion, useAvatar, useCarousel, useCollapsible, useCombobox, useDatePicker, useDialog, useFileUpload, useFloatingPanel, useListCollection, useListbox, useMenu, usePagination, usePopover, useProgress, useRatingGroup, useSegmentedControl, useSlider, useSteps, useSwitch, useTabs, useTagsInput, useToggleGroup, useTooltip, useTreeView };