@pyck/react 0.0.6 → 0.0.8

package/dist/components/date-picker/index.js

@@ -1,10 +1,11 @@
 import { t as __exportAll } from "../../chunk-BYypO7fO.js";
-import { n as IconButton, r as Button } from "../../close-button-r3blTfSH.js";
+import { n as IconButton, r as Button } from "../../close-button-DAgpEZYq.js";
 import "../button/index.js";
 import { DatePicker, DatePickerContext as Context } from "@ark-ui/react/date-picker";
 import { createStyleContext } from "@pyck/styled-system/jsx";
 import { datePicker } from "@pyck/styled-system/recipes";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import { jsx } from "react/jsx-runtime";
 
 //#region src/components/date-picker/date-picker.tsx
 var date_picker_exports = /* @__PURE__ */ __exportAll({
@@ -46,17 +47,21 @@ const Label = withContext(DatePicker.Label, "label");
 const MonthSelect = withContext(DatePicker.MonthSelect, "monthSelect");
 const NextTrigger = withContext(DatePicker.NextTrigger, "nextTrigger", { defaultProps: {
 	asChild: true,
-	children: <IconButton size="sm" variant="plain">
-        <ChevronRightIcon />
-      </IconButton>
+	children: /* @__PURE__ */ jsx(IconButton, {
+		size: "sm",
+		variant: "plain",
+		children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
+	})
 } });
 const Positioner = withContext(DatePicker.Positioner, "positioner");
 const PresetTrigger = withContext(DatePicker.PresetTrigger, "presetTrigger");
 const PrevTrigger = withContext(DatePicker.PrevTrigger, "prevTrigger", { defaultProps: {
 	asChild: true,
-	children: <IconButton size="sm" variant="plain">
-        <ChevronLeftIcon />
-      </IconButton>
+	children: /* @__PURE__ */ jsx(IconButton, {
+		size: "sm",
+		variant: "plain",
+		children: /* @__PURE__ */ jsx(ChevronLeftIcon, {})
+	})
 } });
 const RangeText = withContext(DatePicker.RangeText, "rangeText");
 const Table = withContext(DatePicker.Table, "table");
@@ -71,9 +76,11 @@ const View = withContext(DatePicker.View, "view");
 const ViewControl = withContext(DatePicker.ViewControl, "viewControl");
 const ViewTrigger = withContext(DatePicker.ViewTrigger, "viewTrigger", { defaultProps: {
 	asChild: true,
-	children: <Button variant="plain" size="sm">
-        <RangeText />
-      </Button>
+	children: /* @__PURE__ */ jsx(Button, {
+		variant: "plain",
+		size: "sm",
+		children: /* @__PURE__ */ jsx(RangeText, {})
+	})
 } });
 const YearSelect = withContext(DatePicker.YearSelect, "yearSelect");
 

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

@@ -3,10 +3,10 @@ import * as react from "react";
 import { ComponentProps, ElementType, ReactNode } from "react";
 import * as _pyck_styled_system_jsx0 from "@pyck/styled-system/jsx";
 import * as _pyck_styled_system_recipes0 from "@pyck/styled-system/recipes";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { DefaultValues, FieldValues } from "react-hook-form";
 import { Dialog, DialogContext as Context } from "@ark-ui/react/dialog";
 import * as _ark_ui_react0 from "@ark-ui/react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/dialog/create-overlay.d.ts
 interface CreateOverlayProps {

package/dist/components/dialog/index.js

@@ -5,9 +5,10 @@ import { ark } from "@ark-ui/react/factory";
 import { Stack, createStyleContext } from "@pyck/styled-system/jsx";
 import { dialog } from "@pyck/styled-system/recipes";
 import { CheckCircleIcon, FilePenLineIcon, Trash2Icon } from "lucide-react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { useForm } from "react-hook-form";
-import { omit } from "@pyck/react/utils";
 import { Show } from "@pyck/react/show";
+import { omit } from "@pyck/react/utils";
 import { Portal } from "@ark-ui/react/portal";
 import { Button, CloseButton } from "@pyck/react/button";
 import { FeaturedIcon } from "@pyck/react/icon";
@@ -127,7 +128,7 @@ function createOverlay(Component, options) {
 		} else t0 = $[1];
 		let t1;
 		if ($[2] !== t0) {
-			t1 = <>{t0}</>;
+			t1 = /* @__PURE__ */ jsx(Fragment$1, { children: t0 });
 			$[2] = t0;
 			$[3] = t1;
 		} else t1 = $[3];
@@ -135,8 +136,7 @@ function createOverlay(Component, options) {
 	}
 	function _temp(props) {
 		const { _id, ...componentProps } = props;
-		const Comp = Component;
-		return <Comp key={_id} {...componentProps} />;
+		return /* @__PURE__ */ jsx(Component, { ...componentProps }, _id);
 	}
 	return {
 		Viewport,
@@ -199,7 +199,11 @@ const ActionTrigger = forwardRef(function ActionTrigger(props, ref) {
 	} else t0 = $[1];
 	let t1;
 	if ($[2] !== props || $[3] !== ref || $[4] !== t0) {
-		t1 = <ark.button {...props} ref={ref} onClick={t0} />;
+		t1 = /* @__PURE__ */ jsx(ark.button, {
+			...props,
+			ref,
+			onClick: t0
+		});
 		$[2] = props;
 		$[3] = ref;
 		$[4] = t0;
@@ -212,98 +216,124 @@ const ActionTrigger = forwardRef(function ActionTrigger(props, ref) {
 //#region src/components/dialog/confirm-dialog.tsx
 const ConfirmDialog = createOverlay((props) => {
 	const { title, description, onConfirm, intent = "default", ...rest } = props;
-	return <dialog_exports.Root size="sm" {...rest}>
-      <Portal>
-        <dialog_exports.Backdrop />
-        <dialog_exports.Positioner>
-          <dialog_exports.Content backgroundImage={{
-		_light: "url(/public/images/pattern-light.svg)",
-		_dark: "url(/public/images/pattern-dark.svg)"
-	}} backgroundPosition="center" backgroundRepeat="no-repeat" backgroundPositionX="-25" backgroundPositionY="-73">
-            <dialog_exports.Header pb="0">
-              <Stack gap="4">
-                <Show when={intent === "destructive"} fallback={<FeaturedIcon variant="embedded">
-                      <CheckCircleIcon />
-                    </FeaturedIcon>}>
-                  <FeaturedIcon variant="embedded">
-                    <Trash2Icon />
-                  </FeaturedIcon>
-                </Show>
-                <Stack gap="0.5">
-                  <dialog_exports.Title>{title}</dialog_exports.Title>
-                  {description && <dialog_exports.Description>{description}</dialog_exports.Description>}
-                </Stack>
-              </Stack>
-            </dialog_exports.Header>
-            <dialog_exports.Footer>
-              <dialog_exports.ActionTrigger asChild>
-                <Button variant="outline" flex="1">
-                  Cancel
-                </Button>
-              </dialog_exports.ActionTrigger>
-              <dialog_exports.ActionTrigger asChild>
-                <Button onClick={onConfirm} flex="1" colorPalette={intent === "destructive" ? "red" : "teal"}>
-                  {intent === "destructive" ? "Delete" : "Confirm"}
-                </Button>
-              </dialog_exports.ActionTrigger>
-            </dialog_exports.Footer>
-            <dialog_exports.CloseTrigger asChild>
-              <CloseButton />
-            </dialog_exports.CloseTrigger>
-          </dialog_exports.Content>
-        </dialog_exports.Positioner>
-      </Portal>
-    </dialog_exports.Root>;
+	return /* @__PURE__ */ jsx(Root, {
+		size: "sm",
+		...rest,
+		children: /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Backdrop, {}), /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, {
+			backgroundImage: {
+				_light: "url(/public/images/pattern-light.svg)",
+				_dark: "url(/public/images/pattern-dark.svg)"
+			},
+			backgroundPosition: "center",
+			backgroundRepeat: "no-repeat",
+			backgroundPositionX: "-25",
+			backgroundPositionY: "-73",
+			children: [
+				/* @__PURE__ */ jsx(Header, {
+					pb: "0",
+					children: /* @__PURE__ */ jsxs(Stack, {
+						gap: "4",
+						children: [/* @__PURE__ */ jsx(Show, {
+							when: intent === "destructive",
+							fallback: /* @__PURE__ */ jsx(FeaturedIcon, {
+								variant: "embedded",
+								children: /* @__PURE__ */ jsx(CheckCircleIcon, {})
+							}),
+							children: /* @__PURE__ */ jsx(FeaturedIcon, {
+								variant: "embedded",
+								children: /* @__PURE__ */ jsx(Trash2Icon, {})
+							})
+						}), /* @__PURE__ */ jsxs(Stack, {
+							gap: "0.5",
+							children: [/* @__PURE__ */ jsx(Title, { children: title }), description && /* @__PURE__ */ jsx(Description, { children: description })]
+						})]
+					})
+				}),
+				/* @__PURE__ */ jsxs(Footer, { children: [/* @__PURE__ */ jsx(ActionTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						flex: "1",
+						children: "Cancel"
+					})
+				}), /* @__PURE__ */ jsx(ActionTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(Button, {
+						onClick: onConfirm,
+						flex: "1",
+						colorPalette: intent === "destructive" ? "red" : "teal",
+						children: intent === "destructive" ? "Delete" : "Confirm"
+					})
+				})] }),
+				/* @__PURE__ */ jsx(CloseTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(CloseButton, {})
+				})
+			]
+		}) })] })
+	});
 });
 
 //#endregion
 //#region src/components/dialog/form-dialog.tsx
 const FormDialogBase = createOverlay((props) => {
-	const { content, defaultValues, description, onSubmit, schema, title, icon = <FilePenLineIcon />, submitLabel = "Submit", ...rest } = props;
+	const { content, defaultValues, description, onSubmit, schema, title, icon = /* @__PURE__ */ jsx(FilePenLineIcon, {}), submitLabel = "Submit", ...rest } = props;
 	const form = useForm({
 		resolver: zodResolver(schema),
 		defaultValues
 	});
 	const id = useId();
-	return <dialog_exports.Root size="sm" {...rest}>
-      <Portal>
-        <dialog_exports.Backdrop />
-        <dialog_exports.Positioner>
-          <dialog_exports.Content backgroundImage={{
-		_light: "url(/public/images/pattern-light.svg)",
-		_dark: "url(/public/images/pattern-dark.svg)"
-	}} backgroundPosition="center" backgroundRepeat="no-repeat" backgroundPositionX="-25" backgroundPositionY="-73">
-            <dialog_exports.Header>
-              <Stack gap="4">
-                <FeaturedIcon variant="embedded">{icon}</FeaturedIcon>
-                <Stack gap="0.5">
-                  <dialog_exports.Title>{title}</dialog_exports.Title>
-                  {description && <dialog_exports.Description>{description}</dialog_exports.Description>}
-                </Stack>
-              </Stack>
-            </dialog_exports.Header>
-            <dialog_exports.Body>
-              <Form id={id} value={form} onSubmit={form.handleSubmit(onSubmit)}>
-                {content}
-              </Form>
-            </dialog_exports.Body>
-            <dialog_exports.Footer>
-              <dialog_exports.ActionTrigger asChild>
-                <Button variant="outline" flex="1">
-                  Cancel
-                </Button>
-              </dialog_exports.ActionTrigger>
-              <Button form={id} type="submit" loading={form.formState.isSubmitting} colorPalette="teal" flex="1">
-                {submitLabel}
-              </Button>
-            </dialog_exports.Footer>
-            <dialog_exports.CloseTrigger asChild>
-              <CloseButton />
-            </dialog_exports.CloseTrigger>
-          </dialog_exports.Content>
-        </dialog_exports.Positioner>
-      </Portal>
-    </dialog_exports.Root>;
+	return /* @__PURE__ */ jsx(Root, {
+		size: "sm",
+		...rest,
+		children: /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Backdrop, {}), /* @__PURE__ */ jsx(Positioner, { children: /* @__PURE__ */ jsxs(Content, {
+			backgroundImage: {
+				_light: "url(/public/images/pattern-light.svg)",
+				_dark: "url(/public/images/pattern-dark.svg)"
+			},
+			backgroundPosition: "center",
+			backgroundRepeat: "no-repeat",
+			backgroundPositionX: "-25",
+			backgroundPositionY: "-73",
+			children: [
+				/* @__PURE__ */ jsx(Header, { children: /* @__PURE__ */ jsxs(Stack, {
+					gap: "4",
+					children: [/* @__PURE__ */ jsx(FeaturedIcon, {
+						variant: "embedded",
+						children: icon
+					}), /* @__PURE__ */ jsxs(Stack, {
+						gap: "0.5",
+						children: [/* @__PURE__ */ jsx(Title, { children: title }), description && /* @__PURE__ */ jsx(Description, { children: description })]
+					})]
+				}) }),
+				/* @__PURE__ */ jsx(Body, { children: /* @__PURE__ */ jsx(Form, {
+					id,
+					value: form,
+					onSubmit: form.handleSubmit(onSubmit),
+					children: content
+				}) }),
+				/* @__PURE__ */ jsxs(Footer, { children: [/* @__PURE__ */ jsx(ActionTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						flex: "1",
+						children: "Cancel"
+					})
+				}), /* @__PURE__ */ jsx(Button, {
+					form: id,
+					type: "submit",
+					loading: form.formState.isSubmitting,
+					colorPalette: "teal",
+					flex: "1",
+					children: submitLabel
+				})] }),
+				/* @__PURE__ */ jsx(CloseTrigger, {
+					asChild: true,
+					children: /* @__PURE__ */ jsx(CloseButton, {})
+				})
+			]
+		}) })] })
+	});
 });
 const FormDialog = {
 	...FormDialogBase,
@@ -316,7 +346,7 @@ const OverlayManager = () => {
 	const $ = c(1);
 	let t0;
 	if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
-		t0 = <><FormDialog.Viewport /><ConfirmDialog.Viewport /></>;
+		t0 = /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsx(FormDialog.Viewport, {}), /* @__PURE__ */ jsx(ConfirmDialog.Viewport, {})] });
 		$[0] = t0;
 	} else t0 = $[0];
 	return t0;

package/dist/components/display-date-value/index.d.ts

@@ -1,3 +1,3 @@
-import { n as DisplayDateValue, r as DisplayDateValueProps, t as DateFormatType } from "../../display-date-value-CdfgVuB7.js";
+import { n as DisplayDateValue, r as DisplayDateValueProps, t as DateFormatType } from "../../display-date-value-RbzRgYHt.js";
 import { DateInput } from "@pyck/react/utils";
 export { type DateFormatType, type DateInput, DisplayDateValue, type DisplayDateValueProps };

package/dist/components/display-date-value/index.js

@@ -1,4 +1,4 @@
-import "../../display-value-Bz71ZqgM.js";
-import { t as DisplayDateValue } from "../../display-date-value-BAU46P8s.js";
+import "../../display-value-DDIH9kvx.js";
+import { t as DisplayDateValue } from "../../display-date-value-Ca7v5jK7.js";
 
 export { DisplayDateValue };

package/dist/components/display-value/index.js

@@ -1,3 +1,3 @@
-import { t as DisplayValue } from "../../display-value-Bz71ZqgM.js";
+import { t as DisplayValue } from "../../display-value-DDIH9kvx.js";
 
 export { DisplayValue };

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

@@ -2,9 +2,9 @@ import * as react from "react";
 import { ComponentProps } from "react";
 import * as _pyck_styled_system_jsx0 from "@pyck/styled-system/jsx";
 import * as _pyck_styled_system_recipes0 from "@pyck/styled-system/recipes";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { Dialog, DialogContext as Context } from "@ark-ui/react/dialog";
 import * as _ark_ui_react0 from "@ark-ui/react";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/drawer/drawer.d.ts
 declare namespace drawer_d_exports {

package/dist/components/drawer/index.js

@@ -4,6 +4,7 @@ import { forwardRef } from "react";
 import { ark } from "@ark-ui/react/factory";
 import { createStyleContext } from "@pyck/styled-system/jsx";
 import { drawer } from "@pyck/styled-system/recipes";
+import { jsx } from "react/jsx-runtime";
 import { Dialog, DialogContext as Context, useDialogContext } from "@ark-ui/react/dialog";
 
 //#region src/components/drawer/drawer.tsx
@@ -53,7 +54,11 @@ const ActionTrigger = forwardRef(function ActionTrigger(props, ref) {
 	} else t0 = $[1];
 	let t1;
 	if ($[2] !== props || $[3] !== ref || $[4] !== t0) {
-		t1 = <ark.button {...props} ref={ref} onClick={t0} />;
+		t1 = /* @__PURE__ */ jsx(ark.button, {
+			...props,
+			ref,
+			onClick: t0
+		});
 		$[2] = props;
 		$[3] = ref;
 		$[4] = t0;

package/dist/components/drilldown-menu/index.js

@@ -1,5 +1,4 @@
-import { t as __exportAll } from "../../chunk-BYypO7fO.js";
-import { n as Icon } from "../../featured-icon-CKDv0xfF.js";
+import { n as Icon } from "../../featured-icon-DBnAKGXC.js";
 import "../icon/index.js";
 import { t as Span } from "../../span-DWZSA3mH.js";
 import "../span/index.js";
@@ -9,18 +8,11 @@ import { ark } from "@ark-ui/react/factory";
 import { Box, HStack, Stack, createStyleContext } from "@pyck/styled-system/jsx";
 import { drilldownMenu } from "@pyck/styled-system/recipes";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Group } from "@pyck/react/group";
 import { Show } from "@pyck/react/show";
 
 //#region src/components/drilldown-menu/drilldown-menu.tsx
-var drilldown_menu_exports = /* @__PURE__ */ __exportAll({
-	Content: () => Content,
-	Item: () => Item,
-	List: () => List,
-	Root: () => Root,
-	Trigger: () => Trigger,
-	Viewport: () => Viewport
-});
 const { withProvider, withContext } = createStyleContext(drilldownMenu);
 const Root = withProvider(ark.div, "root");
 const Viewport = withContext(ark.div, "viewport");
@@ -164,12 +156,17 @@ const DrilldownMenu = (t0) => {
 	const t6 = menu.canGoBack ? "1" : "0";
 	let t7;
 	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = <ChevronLeftIcon />;
+		t7 = /* @__PURE__ */ jsx(ChevronLeftIcon, {});
 		$[11] = t7;
 	} else t7 = $[11];
 	let t8;
 	if ($[12] !== t6) {
-		t8 = <Icon size="sm" color="fg.subtle" opacity={t6}>{t7}</Icon>;
+		t8 = /* @__PURE__ */ jsx(Icon, {
+			size: "sm",
+			color: "fg.subtle",
+			opacity: t6,
+			children: t7
+		});
 		$[12] = t6;
 		$[13] = t8;
 	} else t8 = $[13];
@@ -183,25 +180,46 @@ const DrilldownMenu = (t0) => {
 	} else t9 = $[17];
 	let t10;
 	if ($[18] !== t9) {
-		t10 = <Stack gap="0" alignItems="start" justify="center"><Span textStyle="md" fontWeight="medium">{t9}</Span></Stack>;
+		t10 = /* @__PURE__ */ jsx(Stack, {
+			gap: "0",
+			alignItems: "start",
+			justify: "center",
+			children: /* @__PURE__ */ jsx(Span, {
+				textStyle: "md",
+				fontWeight: "medium",
+				children: t9
+			})
+		});
 		$[18] = t9;
 		$[19] = t10;
 	} else t10 = $[19];
 	let t11;
 	if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
-		t11 = <Box />;
+		t11 = /* @__PURE__ */ jsx(Box, {});
 		$[20] = t11;
 	} else t11 = $[20];
 	let t12;
 	if ($[21] !== t10 || $[22] !== t8) {
-		t12 = <HStack justify="space-between" width="full">{t8}{t10}{t11}</HStack>;
+		t12 = /* @__PURE__ */ jsxs(HStack, {
+			justify: "space-between",
+			width: "full",
+			children: [
+				t8,
+				t10,
+				t11
+			]
+		});
 		$[21] = t10;
 		$[22] = t8;
 		$[23] = t12;
 	} else t12 = $[23];
 	let t13;
 	if ($[24] !== menu.prev || $[25] !== t12 || $[26] !== t5) {
-		t13 = <drilldown_menu_exports.Trigger onClick={menu.prev} disabled={t5}>{t12}</drilldown_menu_exports.Trigger>;
+		t13 = /* @__PURE__ */ jsx(Trigger, {
+			onClick: menu.prev,
+			disabled: t5,
+			children: t12
+		});
 		$[24] = menu.prev;
 		$[25] = t12;
 		$[26] = t5;
@@ -216,7 +234,28 @@ const DrilldownMenu = (t0) => {
 	} else t15 = $[29];
 	let t16;
 	if ($[30] !== collection || $[31] !== handleNodeClick || $[32] !== isLeafNode || $[33] !== menu.current || $[34] !== renderNode) {
-		t16 = menu.current?.map((node_2) => <drilldown_menu_exports.Item key={collection.getNodeValue(node_2)}><drilldown_menu_exports.Trigger onClick={() => handleNodeClick(node_2)}><HStack justifyContent="space-between" width="full"><Stack gap="0" alignItems="start"><Span fontWeight="medium">{renderNode(node_2)}</Span></Stack><Show when={!isLeafNode(node_2)}><Icon size="sm" color="fg.subtle"><ChevronRightIcon /></Icon></Show></HStack></drilldown_menu_exports.Trigger></drilldown_menu_exports.Item>);
+		t16 = menu.current?.map((node_2) => /* @__PURE__ */ jsx(Item, { children: /* @__PURE__ */ jsx(Trigger, {
+			onClick: () => handleNodeClick(node_2),
+			children: /* @__PURE__ */ jsxs(HStack, {
+				justifyContent: "space-between",
+				width: "full",
+				children: [/* @__PURE__ */ jsx(Stack, {
+					gap: "0",
+					alignItems: "start",
+					children: /* @__PURE__ */ jsx(Span, {
+						fontWeight: "medium",
+						children: renderNode(node_2)
+					})
+				}), /* @__PURE__ */ jsx(Show, {
+					when: !isLeafNode(node_2),
+					children: /* @__PURE__ */ jsx(Icon, {
+						size: "sm",
+						color: "fg.subtle",
+						children: /* @__PURE__ */ jsx(ChevronRightIcon, {})
+					})
+				})]
+			})
+		}) }, collection.getNodeValue(node_2)));
 		$[30] = collection;
 		$[31] = handleNodeClick;
 		$[32] = isLeafNode;
@@ -226,13 +265,24 @@ const DrilldownMenu = (t0) => {
 	} else t16 = $[35];
 	let t17;
 	if ($[36] !== t16) {
-		t17 = <Group attached={true} orientation="vertical" width="full" asChild={true}><drilldown_menu_exports.List>{t16}</drilldown_menu_exports.List></Group>;
+		t17 = /* @__PURE__ */ jsx(Group, {
+			attached: true,
+			orientation: "vertical",
+			width: "full",
+			asChild: true,
+			children: /* @__PURE__ */ jsx(List, { children: t16 })
+		});
 		$[36] = t16;
 		$[37] = t17;
 	} else t17 = $[37];
 	let t18;
 	if ($[38] !== menu.depth || $[39] !== menu.direction || $[40] !== t14 || $[41] !== t15 || $[42] !== t17) {
-		t18 = <drilldown_menu_exports.Viewport><drilldown_menu_exports.Content key={menu.depth} data-animating={t14} data-direction={menu.direction} onAnimationEnd={t15}>{t17}</drilldown_menu_exports.Content></drilldown_menu_exports.Viewport>;
+		t18 = /* @__PURE__ */ jsx(Viewport, { children: /* @__PURE__ */ jsx(Content, {
+			"data-animating": t14,
+			"data-direction": menu.direction,
+			onAnimationEnd: t15,
+			children: t17
+		}, menu.depth) });
 		$[38] = menu.depth;
 		$[39] = menu.direction;
 		$[40] = t14;
@@ -242,7 +292,7 @@ const DrilldownMenu = (t0) => {
 	} else t18 = $[43];
 	let t19;
 	if ($[44] !== t13 || $[45] !== t18) {
-		t19 = <drilldown_menu_exports.Root>{t13}{t18}</drilldown_menu_exports.Root>;
+		t19 = /* @__PURE__ */ jsxs(Root, { children: [t13, t18] });
 		$[44] = t13;
 		$[45] = t18;
 		$[46] = t19;