@lssm/lib.ui-kit 1.2.0

package/dist/ui/context-menu.js

@@ -0,0 +1,108 @@
+import { ChevronDown } from "./icons/ChevronDown.js";
+import { cn } from "./utils.js";
+import { TextClassContext } from "./text.js";
+import { Check } from "./icons/Check.js";
+import { ChevronRight } from "./icons/ChevronRight.js";
+import { ChevronUp } from "./icons/ChevronUp.js";
+import "react";
+import { Platform, StyleSheet, Text, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as ContextMenuPrimitive from "@rn-primitives/context-menu";
+
+//#region ui/context-menu.tsx
+const ContextMenu = ContextMenuPrimitive.Root;
+const ContextMenuTrigger = ContextMenuPrimitive.Trigger;
+const ContextMenuGroup = ContextMenuPrimitive.Group;
+const ContextMenuSub = ContextMenuPrimitive.Sub;
+const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
+function ContextMenuSubTrigger({ className, inset, children,...props }) {
+	const { open } = ContextMenuPrimitive.useSubContext();
+	const Icon = Platform.OS === "web" ? ChevronRight : open ? ChevronUp : ChevronDown;
+	return /* @__PURE__ */ jsx(TextClassContext.Provider, {
+		value: cn("native:text-lg text-primary text-sm select-none", open && "native:text-accent-foreground"),
+		children: /* @__PURE__ */ jsxs(ContextMenuPrimitive.SubTrigger, {
+			className: cn("native:py-2 active:bg-accent web:cursor-default web:select-none web:outline-hidden web:hover:bg-accent web:focus:bg-accent flex flex-row items-center gap-2 rounded-xs px-2 py-1.5", open && "bg-accent", inset && "pl-8", className),
+			...props,
+			children: [children, /* @__PURE__ */ jsx(Icon, {
+				size: 18,
+				className: "text-foreground ml-auto"
+			})]
+		})
+	});
+}
+function ContextMenuSubContent({ className,...props }) {
+	const { open } = ContextMenuPrimitive.useSubContext();
+	return /* @__PURE__ */ jsx(ContextMenuPrimitive.SubContent, {
+		className: cn("border-border bg-popover shadow-foreground/5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 mt-1 min-w-32 overflow-hidden rounded-md border p-1 shadow-md", open ? "web:animate-in web:fade-in-0 web:zoom-in-95" : "web:animate-out web:fade-out-0 web:zoom-out", className),
+		...props
+	});
+}
+function ContextMenuContent({ className, overlayClassName, overlayStyle, portalHost,...props }) {
+	const { open } = ContextMenuPrimitive.useRootContext();
+	return /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, {
+		hostName: portalHost,
+		children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Overlay, {
+			style: overlayStyle ? StyleSheet.flatten([Platform.OS !== "web" ? StyleSheet.absoluteFill : void 0, overlayStyle]) : Platform.OS !== "web" ? StyleSheet.absoluteFill : void 0,
+			className: overlayClassName,
+			children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, {
+				className: cn("border-border bg-popover shadow-foreground/5 web:data-[side=bottom]:slide-in-from-top-2 web:data-[side=left]:slide-in-from-right-2 web:data-[side=right]:slide-in-from-left-2 web:data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-md", open ? "web:animate-in web:fade-in-0 web:zoom-in-95" : "web:animate-out web:fade-out-0 web:zoom-out-95", className),
+				...props
+			})
+		})
+	});
+}
+function ContextMenuItem({ className, inset,...props }) {
+	return /* @__PURE__ */ jsx(TextClassContext.Provider, {
+		value: "select-none text-sm native:text-lg text-popover-foreground web:group-focus:text-accent-foreground",
+		children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Item, {
+			className: cn("native:py-2 group active:bg-accent web:cursor-default web:outline-hidden web:hover:bg-accent web:focus:bg-accent relative flex flex-row items-center gap-2 rounded-xs px-2 py-1.5", inset && "pl-8", props.disabled && "web:pointer-events-none opacity-50", className),
+			...props
+		})
+	});
+}
+function ContextMenuCheckboxItem({ className, children,...props }) {
+	return /* @__PURE__ */ jsxs(ContextMenuPrimitive.CheckboxItem, {
+		className: cn("web:group native:py-2 active:bg-accent web:cursor-default web:outline-hidden web:focus:bg-accent relative flex flex-row items-center rounded-xs py-1.5 pr-2 pl-8", props.disabled && "web:pointer-events-none opacity-50", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(View, {
+			className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+			children: /* @__PURE__ */ jsx(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(Check, {
+				size: 14,
+				strokeWidth: 3,
+				className: "text-foreground"
+			}) })
+		}), children]
+	});
+}
+function ContextMenuRadioItem({ className, children,...props }) {
+	return /* @__PURE__ */ jsxs(ContextMenuPrimitive.RadioItem, {
+		className: cn("web:group native:py-2 active:bg-accent web:cursor-default web:outline-hidden web:focus:bg-accent relative flex flex-row items-center rounded-xs py-1.5 pr-2 pl-8", props.disabled && "web:pointer-events-none opacity-50", className),
+		...props,
+		children: [/* @__PURE__ */ jsx(View, {
+			className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center",
+			children: /* @__PURE__ */ jsx(ContextMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx(View, { className: "bg-foreground h-2 w-2 rounded-full" }) })
+		}), children]
+	});
+}
+function ContextMenuLabel({ className, inset,...props }) {
+	return /* @__PURE__ */ jsx(ContextMenuPrimitive.Label, {
+		className: cn("native:text-base text-foreground web:cursor-default px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className),
+		...props
+	});
+}
+function ContextMenuSeparator({ className,...props }) {
+	return /* @__PURE__ */ jsx(ContextMenuPrimitive.Separator, {
+		className: cn("bg-border -mx-1 my-1 h-px", className),
+		...props
+	});
+}
+function ContextMenuShortcut({ className,...props }) {
+	return /* @__PURE__ */ jsx(Text, {
+		className: cn("native:text-sm text-muted-foreground ml-auto text-xs tracking-widest", className),
+		...props
+	});
+}
+
+//#endregion
+export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };
+//# sourceMappingURL=context-menu.js.map

package/dist/ui/context-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context-menu.js","names":[],"sources":["../../ui/context-menu.tsx"],"sourcesContent":["import * as ContextMenuPrimitive from '@rn-primitives/context-menu';\nimport * as React from 'react';\nimport {\n  Platform,\n  type StyleProp,\n  StyleSheet,\n  Text,\n  type TextProps,\n  View,\n  type ViewStyle,\n} from 'react-native';\nimport { Check } from './icons/Check';\nimport { ChevronDown } from './icons/ChevronDown';\nimport { ChevronRight } from './icons/ChevronRight';\nimport { ChevronUp } from './icons/ChevronUp';\nimport { TextClassContext } from './text';\nimport { cn } from './utils';\n\nconst ContextMenu = ContextMenuPrimitive.Root;\nconst ContextMenuTrigger = ContextMenuPrimitive.Trigger;\nconst ContextMenuGroup = ContextMenuPrimitive.Group;\nconst ContextMenuSub = ContextMenuPrimitive.Sub;\nconst ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;\n\nfunction ContextMenuSubTrigger({\n  className,\n  inset,\n  children,\n  ...props\n}: ContextMenuPrimitive.SubTriggerProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.SubTriggerRef>;\n  children?: React.ReactNode;\n  inset?: boolean;\n}) {\n  const { open } = ContextMenuPrimitive.useSubContext();\n  const Icon =\n    Platform.OS === 'web' ? ChevronRight : open ? ChevronUp : ChevronDown;\n  return (\n    <TextClassContext.Provider\n      value={cn(\n        'native:text-lg text-primary text-sm select-none',\n        open && 'native:text-accent-foreground'\n      )}\n    >\n      <ContextMenuPrimitive.SubTrigger\n        className={cn(\n          'native:py-2 active:bg-accent web:cursor-default web:select-none web:outline-hidden web:hover:bg-accent web:focus:bg-accent flex flex-row items-center gap-2 rounded-xs px-2 py-1.5',\n          open && 'bg-accent',\n          inset && 'pl-8',\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <Icon size={18} className=\"text-foreground ml-auto\" />\n      </ContextMenuPrimitive.SubTrigger>\n    </TextClassContext.Provider>\n  );\n}\n\nfunction ContextMenuSubContent({\n  className,\n  ...props\n}: ContextMenuPrimitive.SubContentProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.SubContentRef>;\n}) {\n  const { open } = ContextMenuPrimitive.useSubContext();\n  return (\n    <ContextMenuPrimitive.SubContent\n      className={cn(\n        'border-border bg-popover shadow-foreground/5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 mt-1 min-w-32 overflow-hidden rounded-md border p-1 shadow-md',\n        open\n          ? 'web:animate-in web:fade-in-0 web:zoom-in-95'\n          : 'web:animate-out web:fade-out-0 web:zoom-out',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ContextMenuContent({\n  className,\n  overlayClassName,\n  overlayStyle,\n  portalHost,\n  ...props\n}: ContextMenuPrimitive.ContentProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.ContentRef>;\n  overlayStyle?: StyleProp<ViewStyle>;\n  overlayClassName?: string;\n  portalHost?: string;\n}) {\n  const { open } = ContextMenuPrimitive.useRootContext();\n  return (\n    <ContextMenuPrimitive.Portal hostName={portalHost}>\n      <ContextMenuPrimitive.Overlay\n        style={\n          overlayStyle\n            ? StyleSheet.flatten([\n                Platform.OS !== 'web' ? StyleSheet.absoluteFill : undefined,\n                overlayStyle as typeof StyleSheet.absoluteFill,\n              ])\n            : Platform.OS !== 'web'\n              ? StyleSheet.absoluteFill\n              : undefined\n        }\n        className={overlayClassName}\n      >\n        <ContextMenuPrimitive.Content\n          className={cn(\n            'border-border bg-popover shadow-foreground/5 web:data-[side=bottom]:slide-in-from-top-2 web:data-[side=left]:slide-in-from-right-2 web:data-[side=right]:slide-in-from-left-2 web:data-[side=top]:slide-in-from-bottom-2 z-50 min-w-32 overflow-hidden rounded-md border p-1 shadow-md',\n            open\n              ? 'web:animate-in web:fade-in-0 web:zoom-in-95'\n              : 'web:animate-out web:fade-out-0 web:zoom-out-95',\n            className\n          )}\n          {...props}\n        />\n      </ContextMenuPrimitive.Overlay>\n    </ContextMenuPrimitive.Portal>\n  );\n}\n\nfunction ContextMenuItem({\n  className,\n  inset,\n  ...props\n}: ContextMenuPrimitive.ItemProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.ItemRef>;\n  className?: string;\n  inset?: boolean;\n}) {\n  return (\n    <TextClassContext.Provider value=\"select-none text-sm native:text-lg text-popover-foreground web:group-focus:text-accent-foreground\">\n      <ContextMenuPrimitive.Item\n        className={cn(\n          'native:py-2 group active:bg-accent web:cursor-default web:outline-hidden web:hover:bg-accent web:focus:bg-accent relative flex flex-row items-center gap-2 rounded-xs px-2 py-1.5',\n          inset && 'pl-8',\n          props.disabled && 'web:pointer-events-none opacity-50',\n          className\n        )}\n        {...props}\n      />\n    </TextClassContext.Provider>\n  );\n}\n\nfunction ContextMenuCheckboxItem({\n  className,\n  children,\n  ...props\n}: ContextMenuPrimitive.CheckboxItemProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.CheckboxItemRef>;\n  children?: React.ReactNode;\n}) {\n  return (\n    <ContextMenuPrimitive.CheckboxItem\n      className={cn(\n        'web:group native:py-2 active:bg-accent web:cursor-default web:outline-hidden web:focus:bg-accent relative flex flex-row items-center rounded-xs py-1.5 pr-2 pl-8',\n        props.disabled && 'web:pointer-events-none opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <View className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n        <ContextMenuPrimitive.ItemIndicator>\n          <Check size={14} strokeWidth={3} className=\"text-foreground\" />\n        </ContextMenuPrimitive.ItemIndicator>\n      </View>\n      {children}\n    </ContextMenuPrimitive.CheckboxItem>\n  );\n}\n\nfunction ContextMenuRadioItem({\n  className,\n  children,\n  ...props\n}: ContextMenuPrimitive.RadioItemProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.RadioItemRef>;\n  children?: React.ReactNode;\n}) {\n  return (\n    <ContextMenuPrimitive.RadioItem\n      className={cn(\n        'web:group native:py-2 active:bg-accent web:cursor-default web:outline-hidden web:focus:bg-accent relative flex flex-row items-center rounded-xs py-1.5 pr-2 pl-8',\n        props.disabled && 'web:pointer-events-none opacity-50',\n        className\n      )}\n      {...props}\n    >\n      <View className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n        <ContextMenuPrimitive.ItemIndicator>\n          <View className=\"bg-foreground h-2 w-2 rounded-full\" />\n        </ContextMenuPrimitive.ItemIndicator>\n      </View>\n      {children}\n    </ContextMenuPrimitive.RadioItem>\n  );\n}\n\nfunction ContextMenuLabel({\n  className,\n  inset,\n  ...props\n}: ContextMenuPrimitive.LabelProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.LabelRef>;\n  className?: string;\n  inset?: boolean;\n}) {\n  return (\n    <ContextMenuPrimitive.Label\n      className={cn(\n        'native:text-base text-foreground web:cursor-default px-2 py-1.5 text-sm font-semibold',\n        inset && 'pl-8',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ContextMenuSeparator({\n  className,\n  ...props\n}: ContextMenuPrimitive.SeparatorProps & {\n  ref?: React.RefObject<ContextMenuPrimitive.SeparatorRef>;\n}) {\n  return (\n    <ContextMenuPrimitive.Separator\n      className={cn('bg-border -mx-1 my-1 h-px', className)}\n      {...props}\n    />\n  );\n}\n\nfunction ContextMenuShortcut({ className, ...props }: TextProps) {\n  return (\n    <Text\n      className={cn(\n        'native:text-sm text-muted-foreground ml-auto text-xs tracking-widest',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  ContextMenu,\n  ContextMenuCheckboxItem,\n  ContextMenuContent,\n  ContextMenuGroup,\n  ContextMenuItem,\n  ContextMenuLabel,\n  ContextMenuRadioGroup,\n  ContextMenuRadioItem,\n  ContextMenuSeparator,\n  ContextMenuShortcut,\n  ContextMenuSub,\n  ContextMenuSubContent,\n  ContextMenuSubTrigger,\n  ContextMenuTrigger,\n};\n"],"mappings":";;;;;;;;;;;;AAkBA,MAAM,cAAc,qBAAqB;AACzC,MAAM,qBAAqB,qBAAqB;AAChD,MAAM,mBAAmB,qBAAqB;AAC9C,MAAM,iBAAiB,qBAAqB;AAC5C,MAAM,wBAAwB,qBAAqB;AAEnD,SAAS,sBAAsB,EAC7B,WACA,OACA,SACA,GAAG,SAKF;CACD,MAAM,EAAE,SAAS,qBAAqB,eAAe;CACrD,MAAM,OACJ,SAAS,OAAO,QAAQ,eAAe,OAAO,YAAY;AAC5D,QACE,oBAAC,iBAAiB;EAChB,OAAO,GACL,mDACA,QAAQ,gCACT;YAED,qBAAC,qBAAqB;GACpB,WAAW,GACT,sLACA,QAAQ,aACR,SAAS,QACT,UACD;GACD,GAAI;cAEH,UACD,oBAAC;IAAK,MAAM;IAAI,WAAU;KAA4B;IACtB;GACR;;AAIhC,SAAS,sBAAsB,EAC7B,UACA,GAAG,SAGF;CACD,MAAM,EAAE,SAAS,qBAAqB,eAAe;AACrD,QACE,oBAAC,qBAAqB;EACpB,WAAW,GACT,+QACA,OACI,gDACA,+CACJ,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,mBAAmB,EAC1B,WACA,kBACA,cACA,WACA,GAAG,SAMF;CACD,MAAM,EAAE,SAAS,qBAAqB,gBAAgB;AACtD,QACE,oBAAC,qBAAqB;EAAO,UAAU;YACrC,oBAAC,qBAAqB;GACpB,OACE,eACI,WAAW,QAAQ,CACjB,SAAS,OAAO,QAAQ,WAAW,eAAe,QAClD,aACD,CAAC,GACF,SAAS,OAAO,QACd,WAAW,eACX;GAER,WAAW;aAEX,oBAAC,qBAAqB;IACpB,WAAW,GACT,0RACA,OACI,gDACA,kDACJ,UACD;IACD,GAAI;KACJ;IAC2B;GACH;;AAIlC,SAAS,gBAAgB,EACvB,WACA,MACA,GAAG,SAKF;AACD,QACE,oBAAC,iBAAiB;EAAS,OAAM;YAC/B,oBAAC,qBAAqB;GACpB,WAAW,GACT,qLACA,SAAS,QACT,MAAM,YAAY,sCAClB,UACD;GACD,GAAI;IACJ;GACwB;;AAIhC,SAAS,wBAAwB,EAC/B,WACA,SACA,GAAG,SAIF;AACD,QACE,qBAAC,qBAAqB;EACpB,WAAW,GACT,oKACA,MAAM,YAAY,sCAClB,UACD;EACD,GAAI;aAEJ,oBAAC;GAAK,WAAU;aACd,oBAAC,qBAAqB,2BACpB,oBAAC;IAAM,MAAM;IAAI,aAAa;IAAG,WAAU;KAAoB,GAC5B;IAChC,EACN;GACiC;;AAIxC,SAAS,qBAAqB,EAC5B,WACA,SACA,GAAG,SAIF;AACD,QACE,qBAAC,qBAAqB;EACpB,WAAW,GACT,oKACA,MAAM,YAAY,sCAClB,UACD;EACD,GAAI;aAEJ,oBAAC;GAAK,WAAU;aACd,oBAAC,qBAAqB,2BACpB,oBAAC,QAAK,WAAU,uCAAuC,GACpB;IAChC,EACN;GAC8B;;AAIrC,SAAS,iBAAiB,EACxB,WACA,MACA,GAAG,SAKF;AACD,QACE,oBAAC,qBAAqB;EACpB,WAAW,GACT,yFACA,SAAS,QACT,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,qBAAqB,EAC5B,UACA,GAAG,SAGF;AACD,QACE,oBAAC,qBAAqB;EACpB,WAAW,GAAG,6BAA6B,UAAU;EACrD,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAAE,UAAW,GAAG,SAAoB;AAC/D,QACE,oBAAC;EACC,WAAW,GACT,wEACA,UACD;EACD,GAAI;GACJ"}

package/dist/ui/date-picker.d.ts

@@ -0,0 +1,24 @@
+import * as react_jsx_runtime161 from "react/jsx-runtime";
+
+//#region ui/date-picker.d.ts
+interface DatePickerProps {
+  value: Date | null;
+  onChange: (date: Date | null) => void;
+  disabled?: boolean;
+  minDate?: Date;
+  maxDate?: Date;
+  placeholder?: string;
+  className?: string;
+}
+declare function DatePicker({
+  value,
+  onChange,
+  disabled,
+  minDate,
+  maxDate,
+  placeholder,
+  className
+}: DatePickerProps): react_jsx_runtime161.JSX.Element;
+//#endregion
+export { DatePicker, DatePickerProps };
+//# sourceMappingURL=date-picker.d.ts.map

package/dist/ui/date-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.d.ts","names":[],"sources":["../../ui/date-picker.tsx"],"sourcesContent":[],"mappings":";;;UAUiB,eAAA;SACR;mBACU;EAFF,QAAA,CAAA,EAAA,OAAe;EACvB,OAAA,CAAA,EAGG,IAHH;EACU,OAAA,CAAA,EAGP,IAHO;EAEP,WAAA,CAAA,EAAA,MAAA;EACA,SAAA,CAAA,EAAA,MAAA;;AAkBI,iBAAA,UAAA,CAAU;EAAA,KAAA;EAAA,QAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,WAAA;EAAA;AAAA,CAAA,EAQvB,eARuB,CAAA,EAQR,oBAAA,CAAA,GAAA,CAAA,OARQ"}

package/dist/ui/date-picker.js

@@ -0,0 +1,54 @@
+import { cn } from "./utils.js";
+import { Text as Text$1 } from "./text.js";
+import React, { useMemo, useState } from "react";
+import { Platform, Pressable, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+import DateTimePicker from "@react-native-community/datetimepicker";
+
+//#region ui/date-picker.tsx
+function formatDateDisplay(date) {
+	if (!date) return "";
+	try {
+		return date.toLocaleDateString(void 0, {
+			day: "2-digit",
+			month: "long",
+			year: "numeric"
+		});
+	} catch {
+		return "";
+	}
+}
+function DatePicker({ value, onChange, disabled, minDate, maxDate, placeholder = "Select date", className }) {
+	const [show, setShow] = useState(false);
+	const pickerProps = useMemo(() => ({
+		minimumDate: minDate,
+		maximumDate: maxDate,
+		timeZoneName: void 0
+	}), [minDate, maxDate]);
+	const handleChange = (_event, selectedDate) => {
+		if (Platform.OS !== "ios") setShow(false);
+		if (selectedDate) onChange(selectedDate);
+	};
+	return /* @__PURE__ */ jsxs(View, {
+		className: cn("w-full", className),
+		children: [/* @__PURE__ */ jsx(Pressable, {
+			disabled,
+			onPress: () => setShow(true),
+			className: cn("border-input bg-background h-12 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
+			children: /* @__PURE__ */ jsx(Text$1, {
+				className: cn("text-foreground text-base", !value && "opacity-50"),
+				children: value ? formatDateDisplay(value) : placeholder
+			})
+		}), show && /* @__PURE__ */ jsx(DateTimePicker, {
+			value: value ?? /* @__PURE__ */ new Date(),
+			mode: "date",
+			display: Platform.OS === "ios" ? "inline" : "default",
+			onChange: handleChange,
+			...pickerProps
+		})]
+	});
+}
+
+//#endregion
+export { DatePicker };
+//# sourceMappingURL=date-picker.js.map

package/dist/ui/date-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-picker.js","names":["Text"],"sources":["../../ui/date-picker.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { Platform, Pressable, View } from 'react-native';\nimport type {\n  AndroidNativeProps,\n  IOSNativeProps,\n} from '@react-native-community/datetimepicker';\nimport DateTimePicker from '@react-native-community/datetimepicker';\nimport { cn } from './utils';\nimport { Text } from './text';\n\nexport interface DatePickerProps {\n  value: Date | null;\n  onChange: (date: Date | null) => void;\n  disabled?: boolean;\n  minDate?: Date;\n  maxDate?: Date;\n  placeholder?: string;\n  className?: string;\n}\n\nfunction formatDateDisplay(date: Date | null) {\n  if (!date) return '';\n  try {\n    return date.toLocaleDateString(undefined, {\n      day: '2-digit',\n      month: 'long',\n      year: 'numeric',\n    });\n  } catch {\n    return '';\n  }\n}\n\nexport function DatePicker({\n  value,\n  onChange,\n  disabled,\n  minDate,\n  maxDate,\n  placeholder = 'Select date',\n  className,\n}: DatePickerProps) {\n  const [show, setShow] = useState(false);\n\n  const pickerProps = useMemo<Partial<AndroidNativeProps & IOSNativeProps>>(\n    () => ({\n      minimumDate: minDate,\n      maximumDate: maxDate,\n      timeZoneName: undefined,\n    }),\n    [minDate, maxDate]\n  );\n\n  const handleChange = (_event: any, selectedDate?: Date | undefined) => {\n    if (Platform.OS !== 'ios') setShow(false);\n    if (selectedDate) {\n      onChange(selectedDate);\n    }\n  };\n\n  return (\n    <View className={cn('w-full', className)}>\n      <Pressable\n        disabled={disabled}\n        onPress={() => setShow(true)}\n        className={cn(\n          'border-input bg-background h-12 flex-row items-center rounded-md border px-3',\n          disabled && 'opacity-50'\n        )}\n      >\n        <Text\n          className={cn('text-foreground text-base', !value && 'opacity-50')}\n        >\n          {value ? formatDateDisplay(value) : placeholder}\n        </Text>\n      </Pressable>\n      {show && (\n        <DateTimePicker\n          value={value ?? new Date()}\n          mode=\"date\"\n          display={Platform.OS === 'ios' ? 'inline' : 'default'}\n          onChange={handleChange}\n          {...(pickerProps as any)}\n        />\n      )}\n    </View>\n  );\n}\n"],"mappings":";;;;;;;;AAoBA,SAAS,kBAAkB,MAAmB;AAC5C,KAAI,CAAC,KAAM,QAAO;AAClB,KAAI;AACF,SAAO,KAAK,mBAAmB,QAAW;GACxC,KAAK;GACL,OAAO;GACP,MAAM;GACP,CAAC;SACI;AACN,SAAO;;;AAIX,SAAgB,WAAW,EACzB,OACA,UACA,UACA,SACA,SACA,cAAc,eACd,aACkB;CAClB,MAAM,CAAC,MAAM,WAAW,SAAS,MAAM;CAEvC,MAAM,cAAc,eACX;EACL,aAAa;EACb,aAAa;EACb,cAAc;EACf,GACD,CAAC,SAAS,QAAQ,CACnB;CAED,MAAM,gBAAgB,QAAa,iBAAoC;AACrE,MAAI,SAAS,OAAO,MAAO,SAAQ,MAAM;AACzC,MAAI,aACF,UAAS,aAAa;;AAI1B,QACE,qBAAC;EAAK,WAAW,GAAG,UAAU,UAAU;aACtC,oBAAC;GACW;GACV,eAAe,QAAQ,KAAK;GAC5B,WAAW,GACT,gFACA,YAAY,aACb;aAED,oBAACA;IACC,WAAW,GAAG,6BAA6B,CAAC,SAAS,aAAa;cAEjE,QAAQ,kBAAkB,MAAM,GAAG;KAC/B;IACG,EACX,QACC,oBAAC;GACC,OAAO,yBAAS,IAAI,MAAM;GAC1B,MAAK;GACL,SAAS,SAAS,OAAO,QAAQ,WAAW;GAC5C,UAAU;GACV,GAAK;IACL;GAEC"}

package/dist/ui/date-range-picker.d.ts

@@ -0,0 +1,31 @@
+import * as react_jsx_runtime131 from "react/jsx-runtime";
+
+//#region ui/date-range-picker.d.ts
+interface DateRange {
+  start: Date | null;
+  end: Date | null;
+}
+interface DateRangePickerProps {
+  value: DateRange;
+  onChange: (range: DateRange) => void;
+  disabled?: boolean;
+  minDate?: Date;
+  maxDate?: Date;
+  placeholders?: {
+    start?: string;
+    end?: string;
+  };
+  className?: string;
+}
+declare function DateRangePicker({
+  value,
+  onChange,
+  disabled,
+  minDate,
+  maxDate,
+  placeholders,
+  className
+}: DateRangePickerProps): react_jsx_runtime131.JSX.Element;
+//#endregion
+export { DateRange, DateRangePicker, DateRangePickerProps };
+//# sourceMappingURL=date-range-picker.d.ts.map

package/dist/ui/date-range-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.d.ts","names":[],"sources":["../../ui/date-range-picker.tsx"],"sourcesContent":[],"mappings":";;;UAOiB,SAAA;SACR;OACF;AAFP;AAKiB,UAAA,oBAAA,CAAoB;EAC5B,KAAA,EAAA,SAAA;EACW,QAAA,EAAA,CAAA,KAAA,EAAA,SAAA,EAAA,GAAA,IAAA;EAER,QAAA,CAAA,EAAA,OAAA;EACA,OAAA,CAAA,EADA,IACA;EAAI,OAAA,CAAA,EAAJ,IAAI;EAcA,YAAA,CAAA,EAAA;IACd,KAAA,CAAA,EAAA,MAAA;IACA,GAAA,CAAA,EAAA,MAAA;EACA,CAAA;EACA,SAAA,CAAA,EAAA,MAAA;;AAEA,iBANc,eAAA,CAMd;EAAA,KAAA;EAAA,QAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,YAAA;EAAA;AAAA,CAAA,EAEC,oBAFD,CAAA,EAEqB,oBAAA,CAAA,GAAA,CAAA,OAFrB"}

package/dist/ui/date-range-picker.js

@@ -0,0 +1,86 @@
+import { cn } from "./utils.js";
+import { Text as Text$1 } from "./text.js";
+import { HStack, VStack } from "./stack.js";
+import React, { useMemo, useState } from "react";
+import { Platform, Pressable, View } from "react-native";
+import { jsx, jsxs } from "react/jsx-runtime";
+import DateTimePicker from "@react-native-community/datetimepicker";
+
+//#region ui/date-range-picker.tsx
+function fmt(d) {
+	if (!d) return "";
+	try {
+		return d.toLocaleDateString();
+	} catch {
+		return "";
+	}
+}
+function DateRangePicker({ value, onChange, disabled, minDate, maxDate, placeholders, className }) {
+	const [showStart, setShowStart] = useState(false);
+	const [showEnd, setShowEnd] = useState(false);
+	const pickerCommon = useMemo(() => ({
+		minimumDate: minDate,
+		maximumDate: maxDate
+	}), [minDate, maxDate]);
+	const handleStart = (_, d) => {
+		if (Platform.OS !== "ios") setShowStart(false);
+		if (!d) return;
+		onChange({
+			start: d,
+			end: value.end && d > value.end ? d : value.end
+		});
+	};
+	const handleEnd = (_, d) => {
+		if (Platform.OS !== "ios") setShowEnd(false);
+		if (!d) return;
+		onChange({
+			start: value.start && d < value.start ? d : value.start,
+			end: d
+		});
+	};
+	return /* @__PURE__ */ jsxs(VStack, {
+		className: cn("w-full", className),
+		spacing: "sm",
+		children: [
+			/* @__PURE__ */ jsxs(HStack, {
+				gap: "sm",
+				children: [/* @__PURE__ */ jsx(Pressable, {
+					disabled,
+					onPress: () => setShowStart(true),
+					className: cn("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
+					children: /* @__PURE__ */ jsx(Text$1, {
+						className: cn("text-foreground text-base", !value.start && "opacity-50"),
+						children: value.start ? fmt(value.start) : placeholders?.start || "Start date"
+					})
+				}), /* @__PURE__ */ jsx(Pressable, {
+					disabled,
+					onPress: () => setShowEnd(true),
+					className: cn("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
+					children: /* @__PURE__ */ jsx(Text$1, {
+						className: cn("text-foreground text-base", !value.end && "opacity-50"),
+						children: value.end ? fmt(value.end) : placeholders?.end || "End date"
+					})
+				})]
+			}),
+			showStart && /* @__PURE__ */ jsx(DateTimePicker, {
+				value: value.start ?? /* @__PURE__ */ new Date(),
+				mode: "date",
+				display: Platform.OS === "ios" ? "inline" : "default",
+				onChange: handleStart,
+				...pickerCommon
+			}),
+			showEnd && /* @__PURE__ */ jsx(DateTimePicker, {
+				value: value.end ?? value.start ?? /* @__PURE__ */ new Date(),
+				mode: "date",
+				display: Platform.OS === "ios" ? "inline" : "default",
+				onChange: handleEnd,
+				minimumDate: value.start ?? minDate,
+				maximumDate: maxDate
+			})
+		]
+	});
+}
+
+//#endregion
+export { DateRangePicker };
+//# sourceMappingURL=date-range-picker.js.map

package/dist/ui/date-range-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"date-range-picker.js","names":["Text"],"sources":["../../ui/date-range-picker.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport { Platform, Pressable, View } from 'react-native';\nimport DateTimePicker from '@react-native-community/datetimepicker';\nimport { HStack, VStack } from './stack';\nimport { Text } from './text';\nimport { cn } from './utils';\n\nexport interface DateRange {\n  start: Date | null;\n  end: Date | null;\n}\n\nexport interface DateRangePickerProps {\n  value: DateRange;\n  onChange: (range: DateRange) => void;\n  disabled?: boolean;\n  minDate?: Date;\n  maxDate?: Date;\n  placeholders?: { start?: string; end?: string };\n  className?: string;\n}\n\nfunction fmt(d: Date | null) {\n  if (!d) return '';\n  try {\n    return d.toLocaleDateString();\n  } catch {\n    return '';\n  }\n}\n\nexport function DateRangePicker({\n  value,\n  onChange,\n  disabled,\n  minDate,\n  maxDate,\n  placeholders,\n  className,\n}: DateRangePickerProps) {\n  const [showStart, setShowStart] = useState(false);\n  const [showEnd, setShowEnd] = useState(false);\n\n  const pickerCommon = useMemo(\n    () => ({ minimumDate: minDate, maximumDate: maxDate }),\n    [minDate, maxDate]\n  );\n\n  const handleStart = (_: any, d?: Date) => {\n    if (Platform.OS !== 'ios') setShowStart(false);\n    if (!d) return;\n    const end = value.end && d > value.end ? d : value.end;\n    onChange({ start: d, end });\n  };\n  const handleEnd = (_: any, d?: Date) => {\n    if (Platform.OS !== 'ios') setShowEnd(false);\n    if (!d) return;\n    const start = value.start && d < value.start ? d : value.start;\n    onChange({ start, end: d });\n  };\n\n  return (\n    <VStack className={cn('w-full', className)} spacing=\"sm\">\n      <HStack gap=\"sm\">\n        <Pressable\n          disabled={disabled}\n          onPress={() => setShowStart(true)}\n          className={cn(\n            'border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3',\n            disabled && 'opacity-50'\n          )}\n        >\n          <Text\n            className={cn(\n              'text-foreground text-base',\n              !value.start && 'opacity-50'\n            )}\n          >\n            {value.start\n              ? fmt(value.start)\n              : placeholders?.start || 'Start date'}\n          </Text>\n        </Pressable>\n        <Pressable\n          disabled={disabled}\n          onPress={() => setShowEnd(true)}\n          className={cn(\n            'border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3',\n            disabled && 'opacity-50'\n          )}\n        >\n          <Text\n            className={cn(\n              'text-foreground text-base',\n              !value.end && 'opacity-50'\n            )}\n          >\n            {value.end ? fmt(value.end) : placeholders?.end || 'End date'}\n          </Text>\n        </Pressable>\n      </HStack>\n\n      {showStart && (\n        <DateTimePicker\n          value={value.start ?? new Date()}\n          mode=\"date\"\n          display={Platform.OS === 'ios' ? 'inline' : 'default'}\n          onChange={handleStart}\n          {...(pickerCommon as any)}\n        />\n      )}\n      {showEnd && (\n        <DateTimePicker\n          value={value.end ?? value.start ?? new Date()}\n          mode=\"date\"\n          display={Platform.OS === 'ios' ? 'inline' : 'default'}\n          onChange={handleEnd}\n          minimumDate={value.start ?? minDate}\n          maximumDate={maxDate}\n        />\n      )}\n    </VStack>\n  );\n}\n"],"mappings":";;;;;;;;;AAsBA,SAAS,IAAI,GAAgB;AAC3B,KAAI,CAAC,EAAG,QAAO;AACf,KAAI;AACF,SAAO,EAAE,oBAAoB;SACvB;AACN,SAAO;;;AAIX,SAAgB,gBAAgB,EAC9B,OACA,UACA,UACA,SACA,SACA,cACA,aACuB;CACvB,MAAM,CAAC,WAAW,gBAAgB,SAAS,MAAM;CACjD,MAAM,CAAC,SAAS,cAAc,SAAS,MAAM;CAE7C,MAAM,eAAe,eACZ;EAAE,aAAa;EAAS,aAAa;EAAS,GACrD,CAAC,SAAS,QAAQ,CACnB;CAED,MAAM,eAAe,GAAQ,MAAa;AACxC,MAAI,SAAS,OAAO,MAAO,cAAa,MAAM;AAC9C,MAAI,CAAC,EAAG;AAER,WAAS;GAAE,OAAO;GAAG,KADT,MAAM,OAAO,IAAI,MAAM,MAAM,IAAI,MAAM;GACzB,CAAC;;CAE7B,MAAM,aAAa,GAAQ,MAAa;AACtC,MAAI,SAAS,OAAO,MAAO,YAAW,MAAM;AAC5C,MAAI,CAAC,EAAG;AAER,WAAS;GAAE,OADG,MAAM,SAAS,IAAI,MAAM,QAAQ,IAAI,MAAM;GACvC,KAAK;GAAG,CAAC;;AAG7B,QACE,qBAAC;EAAO,WAAW,GAAG,UAAU,UAAU;EAAE,SAAQ;;GAClD,qBAAC;IAAO,KAAI;eACV,oBAAC;KACW;KACV,eAAe,aAAa,KAAK;KACjC,WAAW,GACT,uFACA,YAAY,aACb;eAED,oBAACA;MACC,WAAW,GACT,6BACA,CAAC,MAAM,SAAS,aACjB;gBAEA,MAAM,QACH,IAAI,MAAM,MAAM,GAChB,cAAc,SAAS;OACtB;MACG,EACZ,oBAAC;KACW;KACV,eAAe,WAAW,KAAK;KAC/B,WAAW,GACT,uFACA,YAAY,aACb;eAED,oBAACA;MACC,WAAW,GACT,6BACA,CAAC,MAAM,OAAO,aACf;gBAEA,MAAM,MAAM,IAAI,MAAM,IAAI,GAAG,cAAc,OAAO;OAC9C;MACG;KACL;GAER,aACC,oBAAC;IACC,OAAO,MAAM,yBAAS,IAAI,MAAM;IAChC,MAAK;IACL,SAAS,SAAS,OAAO,QAAQ,WAAW;IAC5C,UAAU;IACV,GAAK;KACL;GAEH,WACC,oBAAC;IACC,OAAO,MAAM,OAAO,MAAM,yBAAS,IAAI,MAAM;IAC7C,MAAK;IACL,SAAS,SAAS,OAAO,QAAQ,WAAW;IAC5C,UAAU;IACV,aAAa,MAAM,SAAS;IAC5B,aAAa;KACb;;GAEG"}

package/dist/ui/datetime-picker.d.ts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region ui/datetime-picker.d.ts
+interface DateTimePickerProps {
+  value: Date | null;
+  onChange: (date: Date | null) => void;
+  disabled?: boolean;
+  minDate?: Date;
+  maxDate?: Date;
+  datePlaceholder?: string;
+  timePlaceholder?: string;
+  is24Hour?: boolean;
+  className?: string;
+}
+declare function DateTimePicker({
+  value,
+  onChange,
+  disabled,
+  minDate,
+  maxDate,
+  datePlaceholder,
+  timePlaceholder,
+  is24Hour,
+  className
+}: DateTimePickerProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { DateTimePicker, DateTimePickerProps };
+//# sourceMappingURL=datetime-picker.d.ts.map

package/dist/ui/datetime-picker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-picker.d.ts","names":[],"sources":["../../ui/datetime-picker.tsx"],"sourcesContent":[],"mappings":";;;UAKiB,mBAAA;SACR;mBACU;EAFF,QAAA,CAAA,EAAA,OAAA;EACR,OAAA,CAAA,EAGG,IAHH;EACU,OAAA,CAAA,EAGP,IAHO;EAEP,eAAA,CAAA,EAAA,MAAA;EACA,eAAA,CAAA,EAAA,MAAA;EAAI,QAAA,CAAA,EAAA,OAAA;EAOA,SAAA,CAAA,EAAA,MAAc;;AAE5B,iBAFc,cAAA,CAEd;EAAA,KAAA;EAAA,QAAA;EAAA,QAAA;EAAA,OAAA;EAAA,OAAA;EAAA,eAAA;EAAA,eAAA;EAAA,QAAA;EAAA;AAAA,CAAA,EAQC,mBARD,CAAA,EAQoB,kBAAA,CAAA,GAAA,CAAA,OARpB"}

package/dist/ui/datetime-picker.js

@@ -0,0 +1,45 @@
+import { DatePicker } from "./date-picker.js";
+import { HStack } from "./stack.js";
+import { TimePicker } from "./time-picker.js";
+import React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region ui/datetime-picker.tsx
+function DateTimePicker({ value, onChange, disabled, minDate, maxDate, datePlaceholder, timePlaceholder, is24Hour, className }) {
+	const handleDateChange = (d) => {
+		if (!d) return;
+		const next = new Date(d);
+		if (value) next.setHours(value.getHours(), value.getMinutes(), 0, 0);
+		onChange(next);
+	};
+	const handleTimeChange = (t) => {
+		if (!t) return;
+		const next = new Date(value ?? /* @__PURE__ */ new Date());
+		next.setHours(t.getHours(), t.getMinutes(), 0, 0);
+		onChange(next);
+	};
+	return /* @__PURE__ */ jsxs(HStack, {
+		className,
+		gap: "sm",
+		children: [/* @__PURE__ */ jsx(DatePicker, {
+			value,
+			onChange: handleDateChange,
+			disabled,
+			minDate,
+			maxDate,
+			placeholder: datePlaceholder,
+			className: "flex-1"
+		}), /* @__PURE__ */ jsx(TimePicker, {
+			value,
+			onChange: handleTimeChange,
+			disabled,
+			is24Hour,
+			placeholder: timePlaceholder,
+			className: "flex-1"
+		})]
+	});
+}
+
+//#endregion
+export { DateTimePicker };
+//# sourceMappingURL=datetime-picker.js.map

package/dist/ui/datetime-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"datetime-picker.js","names":[],"sources":["../../ui/datetime-picker.tsx"],"sourcesContent":["import React from 'react';\nimport { HStack } from './stack';\nimport { DatePicker } from './date-picker';\nimport { TimePicker } from './time-picker';\n\nexport interface DateTimePickerProps {\n  value: Date | null;\n  onChange: (date: Date | null) => void;\n  disabled?: boolean;\n  minDate?: Date;\n  maxDate?: Date;\n  datePlaceholder?: string;\n  timePlaceholder?: string;\n  is24Hour?: boolean;\n  className?: string;\n}\n\nexport function DateTimePicker({\n  value,\n  onChange,\n  disabled,\n  minDate,\n  maxDate,\n  datePlaceholder,\n  timePlaceholder,\n  is24Hour,\n  className,\n}: DateTimePickerProps) {\n  const handleDateChange = (d: Date | null) => {\n    if (!d) return;\n    const next = new Date(d);\n    if (value) {\n      next.setHours(value.getHours(), value.getMinutes(), 0, 0);\n    }\n    onChange(next);\n  };\n\n  const handleTimeChange = (t: Date | null) => {\n    if (!t) return;\n    const next = new Date(value ?? new Date());\n    next.setHours(t.getHours(), t.getMinutes(), 0, 0);\n    onChange(next);\n  };\n\n  return (\n    <HStack className={className} gap=\"sm\">\n      <DatePicker\n        value={value}\n        onChange={handleDateChange}\n        disabled={disabled}\n        minDate={minDate}\n        maxDate={maxDate}\n        placeholder={datePlaceholder}\n        className=\"flex-1\"\n      />\n      <TimePicker\n        value={value}\n        onChange={handleTimeChange}\n        disabled={disabled}\n        is24Hour={is24Hour}\n        placeholder={timePlaceholder}\n        className=\"flex-1\"\n      />\n    </HStack>\n  );\n}\n"],"mappings":";;;;;;;AAiBA,SAAgB,eAAe,EAC7B,OACA,UACA,UACA,SACA,SACA,iBACA,iBACA,UACA,aACsB;CACtB,MAAM,oBAAoB,MAAmB;AAC3C,MAAI,CAAC,EAAG;EACR,MAAM,OAAO,IAAI,KAAK,EAAE;AACxB,MAAI,MACF,MAAK,SAAS,MAAM,UAAU,EAAE,MAAM,YAAY,EAAE,GAAG,EAAE;AAE3D,WAAS,KAAK;;CAGhB,MAAM,oBAAoB,MAAmB;AAC3C,MAAI,CAAC,EAAG;EACR,MAAM,OAAO,IAAI,KAAK,yBAAS,IAAI,MAAM,CAAC;AAC1C,OAAK,SAAS,EAAE,UAAU,EAAE,EAAE,YAAY,EAAE,GAAG,EAAE;AACjD,WAAS,KAAK;;AAGhB,QACE,qBAAC;EAAkB;EAAW,KAAI;aAChC,oBAAC;GACQ;GACP,UAAU;GACA;GACD;GACA;GACT,aAAa;GACb,WAAU;IACV,EACF,oBAAC;GACQ;GACP,UAAU;GACA;GACA;GACV,aAAa;GACb,WAAU;IACV;GACK"}

package/dist/ui/dialog.d.ts

@@ -0,0 +1,69 @@
+import * as React$1 from "react";
+import * as react_native13 from "react-native";
+import { View, ViewProps } from "react-native";
+import * as react_jsx_runtime42 from "react/jsx-runtime";
+import * as DialogPrimitive from "@rn-primitives/dialog";
+
+//#region ui/dialog.d.ts
+declare const Dialog: React$1.ForwardRefExoticComponent<ViewProps & {
+  asChild?: boolean;
+} & {
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (value: boolean) => void;
+} & React$1.RefAttributes<View>>;
+declare const DialogTrigger: React$1.ForwardRefExoticComponent<Omit<react_native13.PressableProps & React$1.RefAttributes<View>, "ref"> & {
+  asChild?: boolean;
+} & {
+  onKeyDown?: (ev: React$1.KeyboardEvent) => void;
+  onKeyUp?: (ev: React$1.KeyboardEvent) => void;
+} & React$1.RefAttributes<View>>;
+declare const DialogPortal: typeof DialogPrimitive.Portal;
+declare const DialogClose: React$1.ForwardRefExoticComponent<Omit<react_native13.PressableProps & React$1.RefAttributes<View>, "ref"> & {
+  asChild?: boolean;
+} & {
+  onKeyDown?: (ev: React$1.KeyboardEvent) => void;
+  onKeyUp?: (ev: React$1.KeyboardEvent) => void;
+} & React$1.RefAttributes<View>>;
+declare function DialogOverlayNative({
+  className,
+  children,
+  ...props
+}: DialogPrimitive.OverlayProps & {
+  ref?: React$1.RefObject<DialogPrimitive.OverlayRef>;
+  children?: React$1.ReactNode;
+}): react_jsx_runtime42.JSX.Element;
+declare const DialogOverlay: typeof DialogOverlayNative;
+declare function DialogContent({
+  className,
+  children,
+  portalHost,
+  ...props
+}: DialogPrimitive.ContentProps & {
+  ref?: React$1.RefObject<DialogPrimitive.ContentRef>;
+  className?: string;
+  portalHost?: string;
+}): react_jsx_runtime42.JSX.Element;
+declare function DialogHeader({
+  className,
+  ...props
+}: ViewProps): react_jsx_runtime42.JSX.Element;
+declare function DialogFooter({
+  className,
+  ...props
+}: ViewProps): react_jsx_runtime42.JSX.Element;
+declare function DialogTitle({
+  className,
+  ...props
+}: DialogPrimitive.TitleProps & {
+  ref?: React$1.RefObject<DialogPrimitive.TitleRef>;
+}): react_jsx_runtime42.JSX.Element;
+declare function DialogDescription({
+  className,
+  ...props
+}: DialogPrimitive.DescriptionProps & {
+  ref?: React$1.RefObject<DialogPrimitive.DescriptionRef>;
+}): react_jsx_runtime42.JSX.Element;
+//#endregion
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };
+//# sourceMappingURL=dialog.d.ts.map

package/dist/ui/dialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.d.ts","names":[],"sources":["../../ui/dialog.tsx"],"sourcesContent":[],"mappings":";;;;;;;cAOM,QAAM,OAAA,CAAA,0BAAA;;;;EAAN,WAA6B,CAAA,EAAA,OAAA;EAAvB,YAAA,CAAA,EAAA,CAAA,KAAA,EAAA,OAAA,EAAA,GAAA,IAAA;;cAEN,eAAa,OAAA,CAAA,0BAAA,KAA0B,cAAA,CAA1B,cAAA,GAAA,OAAA,CAAA,cAAA;EAFP,OAAA,CAAA,EAAA,OAAA;CAAA,GAAA;EAEN,SAAA,CAAA,EAAA,CAAA,EAAA,uBAAuC,EAAA,GAAA,IAAA;EAAA,OAAA,CAAA,EAAA,CAAA,EAA1B,uBAAA,EAAA,GAAA,IAAA;CAAA,wBAAA,KAAA,CAAA,CAAA;cAEb,YAFa,EAAA,OAED,eAAA,CAAA,MAFC;cAIb,WAJa,EAIF,OAAA,CAAA,yBAJE,CAIF,IAJE,CAIsB,cAAA,CAAxB,cAAA,GAAA,OAAA,CAAA,aAJE,CAIF,IAJE,CAAA,EAAA,KAAA,CAAA,GAAA;;;;;CAAA,wBAAA,KAAA,CAAA,CAAA;iBA2BV,mBAAA,CA3BU;EAAA,SAAA;EAAA,QAAA;EAAA,GAAA;CAAA,EA+BhB,eAAA,CAAgB,YA/BA,GAAA;EAEb,GAAA,CAAA,EA8BE,OAAA,CAAM,SA9B6B,CA8BnB,eAAA,CAAgB,UA9BtB,CAAA;EAEZ,QAAA,CAAA,EA6BO,OAAA,CAAM,SA7BsB;CAAA,CAAA,EA8BxC,mBAAA,CAAA,GAAA,CAAA,OA9BgB;cAkDX,aAlDW,EAAA,OAkDE,mBAlDF;iBAuDR,aAAA,CAvDQ;EAAA,SAAA;EAAA,QAAA;EAAA,UAAA;EAAA,GAAA;CAAA,EA4Dd,eAAA,CAAgB,YA5DF,GAAA;EAAA,GAAA,CAAA,EA6DT,OAAA,CAAM,SA7DG,CA6DO,eAAA,CAAgB,UA7DvB,CAAA;;;IAgEhB,mBAAA,CAAA,GAAA,CAAA;iBAmCQ,YAAA;;;GAAsC,YAAS,mBAAA,CAAA,GAAA,CAAA;iBAY/C,YAAA,CA/GQ;EAAA,SAAA;EAAA,GAAA;AAAA,CAAA,EA+G8B,SA/G9B,CAAA,EA+GuC,mBAAA,CAAA,GAAA,CAAA,OA/GvC;iBA2HR,WAAA,CA3HQ;EAAA,SAAA;EAAA,GAAA;CAAA,EA8Hd,eAAA,CAAgB,UA9HF,GAAA;EAuBR,GAAA,CAAA,EAwGD,OAAA,CAAM,SAxGL,CAwGe,eAAA,CAAgB,QAxGZ,CAAA;CAC1B,CAAA,EAwGD,mBAAA,CAAA,GAAA,CAAA,OAxGC;iBAoHO,iBAAA,CAnHP;EAAA,SAAA;EAAA,GAAA;CAAA,EAsHC,eAAA,CAAgB,gBAtHjB,GAAA;EAEC,GAAA,CAAA,EAqHK,OAAA,CAAM,SArHK,CAqHK,eAAA,CAAgB,cArHrB,CAAA;CACK,CAAA,EAqHvB,mBAAA,CAAA,GAAA,CAAA,OArHuC"}

package/dist/ui/dialog.js

@@ -0,0 +1,81 @@
+import { cn } from "./utils.js";
+import { X } from "./icons/X.js";
+import "react";
+import { Platform, StyleSheet, View } from "react-native";
+import Animated, { FadeIn, FadeOut } from "react-native-reanimated";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as DialogPrimitive from "@rn-primitives/dialog";
+
+//#region ui/dialog.tsx
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogPortal = DialogPrimitive.Portal;
+const DialogClose = DialogPrimitive.Close;
+function DialogOverlayWeb({ className,...props }) {
+	const { open } = DialogPrimitive.useRootContext();
+	return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
+		className: cn("absolute top-0 right-0 bottom-0 left-0 flex items-center justify-center bg-black/80 p-2", open ? "web:animate-in web:fade-in-0" : "web:animate-out web:fade-out-0", className),
+		...props
+	});
+}
+function DialogOverlayNative({ className, children,...props }) {
+	return /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
+		style: StyleSheet.absoluteFill,
+		className: cn("flex items-center justify-center bg-black/80 p-2", className),
+		...props,
+		children: /* @__PURE__ */ jsx(Animated.View, {
+			entering: FadeIn.duration(150),
+			exiting: FadeOut.duration(150),
+			children
+		})
+	});
+}
+const DialogOverlay = Platform.select({
+	web: DialogOverlayWeb,
+	default: DialogOverlayNative
+});
+function DialogContent({ className, children, portalHost,...props }) {
+	const { open } = DialogPrimitive.useRootContext();
+	return /* @__PURE__ */ jsx(DialogPortal, {
+		hostName: portalHost,
+		children: /* @__PURE__ */ jsx(DialogOverlay, { children: /* @__PURE__ */ jsxs(DialogPrimitive.Content, {
+			className: cn("border-border bg-background web:cursor-default web:duration-200 max-w-lg gap-4 rounded-lg border p-6 shadow-lg", open ? "web:animate-in web:fade-in-0 web:zoom-in-95" : "web:animate-out web:fade-out-0 web:zoom-out-95", className),
+			...props,
+			children: [children, /* @__PURE__ */ jsx(DialogPrimitive.Close, {
+				className: "web:group web:ring-offset-background web:transition-opacity web:hover:opacity-100 web:focus:outline-hidden web:focus:ring-2 web:focus:ring-ring web:focus:ring-offset-2 web:disabled:pointer-events-none absolute top-4 right-4 rounded-xs p-0.5 opacity-70",
+				children: /* @__PURE__ */ jsx(X, {
+					size: Platform.OS === "web" ? 16 : 18,
+					className: cn("text-muted-foreground", open && "text-accent-foreground")
+				})
+			})]
+		}) })
+	});
+}
+function DialogHeader({ className,...props }) {
+	return /* @__PURE__ */ jsx(View, {
+		className: cn("flex flex-col gap-1.5 text-center sm:text-left", className),
+		...props
+	});
+}
+function DialogFooter({ className,...props }) {
+	return /* @__PURE__ */ jsx(View, {
+		className: cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", className),
+		...props
+	});
+}
+function DialogTitle({ className,...props }) {
+	return /* @__PURE__ */ jsx(DialogPrimitive.Title, {
+		className: cn("native:text-xl text-foreground text-lg leading-none font-semibold tracking-tight", className),
+		...props
+	});
+}
+function DialogDescription({ className,...props }) {
+	return /* @__PURE__ */ jsx(DialogPrimitive.Description, {
+		className: cn("native:text-base text-muted-foreground text-sm", className),
+		...props
+	});
+}
+
+//#endregion
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };
+//# sourceMappingURL=dialog.js.map

package/dist/ui/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dialog.js","names":[],"sources":["../../ui/dialog.tsx"],"sourcesContent":["import * as DialogPrimitive from '@rn-primitives/dialog';\nimport * as React from 'react';\nimport { Platform, StyleSheet, View, type ViewProps } from 'react-native';\nimport Animated, { FadeIn, FadeOut } from 'react-native-reanimated';\nimport { X } from './icons/X';\nimport { cn } from './utils';\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = DialogPrimitive.Portal;\n\nconst DialogClose = DialogPrimitive.Close;\n\nfunction DialogOverlayWeb({\n  className,\n  ...props\n}: DialogPrimitive.OverlayProps & {\n  ref?: React.RefObject<DialogPrimitive.OverlayRef>;\n}) {\n  const { open } = DialogPrimitive.useRootContext();\n  return (\n    <DialogPrimitive.Overlay\n      className={cn(\n        'absolute top-0 right-0 bottom-0 left-0 flex items-center justify-center bg-black/80 p-2',\n        open\n          ? 'web:animate-in web:fade-in-0'\n          : 'web:animate-out web:fade-out-0',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DialogOverlayNative({\n  className,\n  children,\n  ...props\n}: DialogPrimitive.OverlayProps & {\n  ref?: React.RefObject<DialogPrimitive.OverlayRef>;\n  children?: React.ReactNode;\n}) {\n  return (\n    <DialogPrimitive.Overlay\n      style={StyleSheet.absoluteFill}\n      className={cn(\n        'flex items-center justify-center bg-black/80 p-2',\n        className\n      )}\n      {...props}\n    >\n      <Animated.View\n        entering={FadeIn.duration(150)}\n        exiting={FadeOut.duration(150)}\n      >\n        {children}\n      </Animated.View>\n    </DialogPrimitive.Overlay>\n  );\n}\n\nconst DialogOverlay = Platform.select({\n  web: DialogOverlayWeb,\n  default: DialogOverlayNative,\n});\n\nfunction DialogContent({\n  className,\n  children,\n  portalHost,\n  ...props\n}: DialogPrimitive.ContentProps & {\n  ref?: React.RefObject<DialogPrimitive.ContentRef>;\n  className?: string;\n  portalHost?: string;\n}) {\n  const { open } = DialogPrimitive.useRootContext();\n  return (\n    <DialogPortal hostName={portalHost}>\n      <DialogOverlay>\n        <DialogPrimitive.Content\n          className={cn(\n            'border-border bg-background web:cursor-default web:duration-200 max-w-lg gap-4 rounded-lg border p-6 shadow-lg',\n            open\n              ? 'web:animate-in web:fade-in-0 web:zoom-in-95'\n              : 'web:animate-out web:fade-out-0 web:zoom-out-95',\n            className\n          )}\n          {...props}\n        >\n          {children}\n          <DialogPrimitive.Close\n            className={\n              'web:group web:ring-offset-background web:transition-opacity web:hover:opacity-100 web:focus:outline-hidden web:focus:ring-2 web:focus:ring-ring web:focus:ring-offset-2 web:disabled:pointer-events-none absolute top-4 right-4 rounded-xs p-0.5 opacity-70'\n            }\n          >\n            <X\n              size={Platform.OS === 'web' ? 16 : 18}\n              className={cn(\n                'text-muted-foreground',\n                open && 'text-accent-foreground'\n              )}\n            />\n          </DialogPrimitive.Close>\n        </DialogPrimitive.Content>\n      </DialogOverlay>\n    </DialogPortal>\n  );\n}\n\nfunction DialogHeader({ className, ...props }: ViewProps) {\n  return (\n    <View\n      className={cn(\n        'flex flex-col gap-1.5 text-center sm:text-left',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DialogFooter({ className, ...props }: ViewProps) {\n  return (\n    <View\n      className={cn(\n        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DialogTitle({\n  className,\n  ...props\n}: DialogPrimitive.TitleProps & {\n  ref?: React.RefObject<DialogPrimitive.TitleRef>;\n}) {\n  return (\n    <DialogPrimitive.Title\n      className={cn(\n        'native:text-xl text-foreground text-lg leading-none font-semibold tracking-tight',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction DialogDescription({\n  className,\n  ...props\n}: DialogPrimitive.DescriptionProps & {\n  ref?: React.RefObject<DialogPrimitive.DescriptionRef>;\n}) {\n  return (\n    <DialogPrimitive.Description\n      className={cn(\n        'native:text-base text-muted-foreground text-sm',\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Dialog,\n  DialogClose,\n  DialogContent,\n  DialogDescription,\n  DialogFooter,\n  DialogHeader,\n  DialogOverlay,\n  DialogPortal,\n  DialogTitle,\n  DialogTrigger,\n};\n"],"mappings":";;;;;;;;;AAOA,MAAM,SAAS,gBAAgB;AAE/B,MAAM,gBAAgB,gBAAgB;AAEtC,MAAM,eAAe,gBAAgB;AAErC,MAAM,cAAc,gBAAgB;AAEpC,SAAS,iBAAiB,EACxB,UACA,GAAG,SAGF;CACD,MAAM,EAAE,SAAS,gBAAgB,gBAAgB;AACjD,QACE,oBAAC,gBAAgB;EACf,WAAW,GACT,2FACA,OACI,iCACA,kCACJ,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAC3B,WACA,SACA,GAAG,SAIF;AACD,QACE,oBAAC,gBAAgB;EACf,OAAO,WAAW;EAClB,WAAW,GACT,oDACA,UACD;EACD,GAAI;YAEJ,oBAAC,SAAS;GACR,UAAU,OAAO,SAAS,IAAI;GAC9B,SAAS,QAAQ,SAAS,IAAI;GAE7B;IACa;GACQ;;AAI9B,MAAM,gBAAgB,SAAS,OAAO;CACpC,KAAK;CACL,SAAS;CACV,CAAC;AAEF,SAAS,cAAc,EACrB,WACA,UACA,WACA,GAAG,SAKF;CACD,MAAM,EAAE,SAAS,gBAAgB,gBAAgB;AACjD,QACE,oBAAC;EAAa,UAAU;YACtB,oBAAC,2BACC,qBAAC,gBAAgB;GACf,WAAW,GACT,kHACA,OACI,gDACA,kDACJ,UACD;GACD,GAAI;cAEH,UACD,oBAAC,gBAAgB;IACf,WACE;cAGF,oBAAC;KACC,MAAM,SAAS,OAAO,QAAQ,KAAK;KACnC,WAAW,GACT,yBACA,QAAQ,yBACT;MACD;KACoB;IACA,GACZ;GACH;;AAInB,SAAS,aAAa,EAAE,UAAW,GAAG,SAAoB;AACxD,QACE,oBAAC;EACC,WAAW,GACT,kDACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,aAAa,EAAE,UAAW,GAAG,SAAoB;AACxD,QACE,oBAAC;EACC,WAAW,GACT,0DACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,YAAY,EACnB,UACA,GAAG,SAGF;AACD,QACE,oBAAC,gBAAgB;EACf,WAAW,GACT,oFACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,kBAAkB,EACzB,UACA,GAAG,SAGF;AACD,QACE,oBAAC,gBAAgB;EACf,WAAW,GACT,kDACA,UACD;EACD,GAAI;GACJ"}