@xaui/native 0.0.12 → 0.0.13

package/dist/datepicker/index.cjs

@@ -35,8 +35,8 @@ __export(datepicker_exports, {
 module.exports = __toCommonJS(datepicker_exports);
 
 // src/components/datepicker/datepicker.tsx
-var import_react22 = __toESM(require("react"), 1);
-var import_react_native20 = require("react-native");
+var import_react15 = __toESM(require("react"), 1);
+var import_react_native13 = require("react-native");
 
 // src/components/datepicker/datepicker.hook.ts
 var import_react6 = require("react");
@@ -310,9 +310,7 @@ var getWeekdayNames = (locale, firstDayOfWeek) => {
   const days = [];
   for (let i = 0; i < 7; i++) {
     const date = new Date(2024, 0, 1 + offset + i);
-    days.push(
-      date.toLocaleDateString(locale, { weekday: "short" }).slice(0, 2)
-    );
+    days.push(date.toLocaleDateString(locale, { weekday: "short" }).slice(0, 2));
   }
   return days;
 };
@@ -523,8 +521,8 @@ var styles = import_react_native4.StyleSheet.create({
 });
 
 // src/components/dialogs/datepicker-dialog/datepicker-dialog.tsx
-var import_react20 = __toESM(require("react"), 1);
-var import_react_native18 = require("react-native");
+var import_react13 = __toESM(require("react"), 1);
+var import_react_native11 = require("react-native");
 var import_react_native_gesture_handler2 = require("react-native-gesture-handler");
 
 // src/components/dialogs/datepicker-dialog/datepicker-dialog.animation.ts
@@ -1013,718 +1011,12 @@ var DatePickerDialogCalendar = ({
 };
 
 // src/components/dialogs/datepicker-dialog/datepicker-dialog-header.tsx
-var import_react17 = __toESM(require("react"), 1);
-var import_react_native15 = require("react-native");
-
-// src/components/icon/icons/arrow-back.tsx
 var import_react10 = __toESM(require("react"), 1);
 var import_react_native8 = require("react-native");
-var import_react_native_svg = __toESM(require("react-native-svg"), 1);
-
-// src/components/icon/icon.utils.ts
-var isThemeColor = (color) => {
-  const themeColors = [
-    "primary",
-    "secondary",
-    "tertiary",
-    "danger",
-    "warning",
-    "success",
-    "default"
-  ];
-  return themeColors.includes(color);
-};
-
-// src/components/icon/icons/arrow-back.tsx
-var AnimatedPath = import_react_native8.Animated.createAnimatedComponent(import_react_native_svg.Path);
-
-// src/components/icon/icons/calendar.tsx
-var import_react11 = __toESM(require("react"), 1);
-var import_react_native9 = require("react-native");
-var import_react_native_svg2 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath2 = import_react_native9.Animated.createAnimatedComponent(import_react_native_svg2.Path);
-var CalendarIcon = ({
-  variant = "baseline",
-  size = 24,
-  color = "default",
-  isAnimated = false
-}) => {
-  const theme = useXUITheme();
-  const scaleAnim = (0, import_react11.useRef)(new import_react_native9.Animated.Value(isAnimated ? 0 : 1)).current;
-  const opacityAnim = (0, import_react11.useRef)(new import_react_native9.Animated.Value(isAnimated ? 0 : 1)).current;
-  const resolvedColor = (0, import_react11.useMemo)(() => {
-    if (typeof color === "string" && isThemeColor(color)) {
-      return theme.colors[color].main;
-    }
-    return color;
-  }, [color, theme]);
-  (0, import_react11.useEffect)(() => {
-    if (isAnimated) {
-      import_react_native9.Animated.parallel([
-        import_react_native9.Animated.spring(scaleAnim, {
-          toValue: 1,
-          useNativeDriver: true,
-          tension: 50,
-          friction: 7
-        }),
-        import_react_native9.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration: 200,
-          useNativeDriver: true
-        })
-      ]).start();
-    }
-  }, [isAnimated, scaleAnim, opacityAnim]);
-  const animatedProps = isAnimated ? {
-    transform: [{ scale: scaleAnim }],
-    opacity: opacityAnim
-  } : void 0;
-  const renderBaseline = () => /* @__PURE__ */ import_react11.default.createElement(
-    AnimatedPath2,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 32,
-      d: "M48 112a48 48 0 0148-48h320a48 48 0 0148 48v320a48 48 0 01-48 48H96a48 48 0 01-48-48zm0 80h416M176 64v48M336 64v48",
-      ...animatedProps
-    }
-  );
-  const renderFilled = () => /* @__PURE__ */ import_react11.default.createElement(
-    AnimatedPath2,
-    {
-      fill: resolvedColor,
-      d: "M416 64h-56V40a24 24 0 00-48 0v24H200V40a24 24 0 00-48 0v24H96a48 48 0 00-48 48v320a48 48 0 0048 48h320a48 48 0 0048-48V112a48 48 0 00-48-48zm0 368H96V208h320z",
-      ...animatedProps
-    }
-  );
-  const renderDuotone = () => /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(
-    import_react_native_svg2.Path,
-    {
-      fill: resolvedColor,
-      opacity: 0.3,
-      d: "M48 192h416v240a48 48 0 01-48 48H96a48 48 0 01-48-48z"
-    }
-  ), renderBaseline());
-  const renderRoundOutlined = () => /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(
-    import_react_native_svg2.Circle,
-    {
-      cx: "256",
-      cy: "256",
-      r: "192",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react11.default.createElement(
-    AnimatedPath2,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 28,
-      d: "M152 176a24 24 0 0124-24h160a24 24 0 0124 24v176a24 24 0 01-24 24H176a24 24 0 01-24-24zm0 48h208M208 152v32M304 152v32",
-      ...animatedProps
-    }
-  ));
-  const renderSquareOutlined = () => /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(
-    import_react_native_svg2.Rect,
-    {
-      x: "64",
-      y: "64",
-      width: "384",
-      height: "384",
-      rx: "48",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react11.default.createElement(
-    AnimatedPath2,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 28,
-      d: "M152 176a24 24 0 0124-24h160a24 24 0 0124 24v176a24 24 0 01-24 24H176a24 24 0 01-24-24zm0 48h208M208 152v32M304 152v32",
-      ...animatedProps
-    }
-  ));
-  const renderVariant = () => {
-    switch (variant) {
-      case "filled":
-        return renderFilled();
-      case "duotone":
-        return renderDuotone();
-      case "round-outlined":
-        return renderRoundOutlined();
-      case "square-outlined":
-        return renderSquareOutlined();
-      case "round-filled":
-      case "square-filled":
-        return renderFilled();
-      case "baseline":
-      default:
-        return renderBaseline();
-    }
-  };
-  return /* @__PURE__ */ import_react11.default.createElement(import_react_native_svg2.default, { width: size, height: size, viewBox: "0 0 512 512" }, renderVariant());
-};
-
-// src/components/icon/icons/checkmark.tsx
-var import_react12 = __toESM(require("react"), 1);
-var import_react_native10 = require("react-native");
-var import_react_native_svg3 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath3 = import_react_native10.Animated.createAnimatedComponent(import_react_native_svg3.Path);
-
-// src/components/icon/icons/chevron-down.tsx
-var import_react13 = __toESM(require("react"), 1);
-var import_react_native11 = require("react-native");
-var import_react_native_svg4 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath4 = import_react_native11.Animated.createAnimatedComponent(import_react_native_svg4.Path);
-var ChevronDownIcon = ({
-  variant = "baseline",
-  size = 24,
-  color = "default",
-  isAnimated = false
-}) => {
-  const theme = useXUITheme();
-  const scaleAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(isAnimated ? 0 : 1)).current;
-  const opacityAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(isAnimated ? 0 : 1)).current;
-  const resolvedColor = (0, import_react13.useMemo)(() => {
-    if (typeof color === "string" && isThemeColor(color)) {
-      return theme.colors[color].main;
-    }
-    return color;
-  }, [color, theme]);
-  (0, import_react13.useEffect)(() => {
-    if (isAnimated) {
-      import_react_native11.Animated.parallel([
-        import_react_native11.Animated.spring(scaleAnim, {
-          toValue: 1,
-          useNativeDriver: true,
-          tension: 50,
-          friction: 7
-        }),
-        import_react_native11.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration: 200,
-          useNativeDriver: true
-        })
-      ]).start();
-    }
-  }, [isAnimated, scaleAnim, opacityAnim]);
-  const animatedProps = isAnimated ? {
-    transform: [{ scale: scaleAnim }],
-    opacity: opacityAnim
-  } : void 0;
-  const renderBaseline = () => /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M112 184l144 144 144-144",
-      ...animatedProps
-    }
-  );
-  const renderFilled = () => /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: resolvedColor,
-      d: "M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z",
-      ...animatedProps
-    }
-  );
-  const renderDuotone = () => /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
-    import_react_native_svg4.Path,
-    {
-      fill: resolvedColor,
-      opacity: 0.3,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48z"
-    }
-  ), /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M112 184l144 144 144-144",
-      ...animatedProps
-    }
-  ));
-  const renderRoundOutlined = () => /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
-    import_react_native_svg4.Circle,
-    {
-      cx: "256",
-      cy: "256",
-      r: "192",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M112 184l144 144 144-144",
-      ...animatedProps
-    }
-  ));
-  const renderSquareOutlined = () => /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement(
-    import_react_native_svg4.Rect,
-    {
-      x: "64",
-      y: "64",
-      width: "384",
-      height: "384",
-      rx: "48",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M112 184l144 144 144-144",
-      ...animatedProps
-    }
-  ));
-  const renderRoundFilled = () => /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: resolvedColor,
-      d: "M464 256c0-114.87-93.13-208-208-208S48 141.13 48 256s93.13 208 208 208 208-93.13 208-208zm-100.69-28.69l-96 96a16 16 0 0 1-22.62 0l-96-96a16 16 0 0 1 22.62-22.62L256 289.37l84.69-84.68a16 16 0 0 1 22.62 22.62z",
-      ...animatedProps
-    }
-  );
-  const renderSquareFilled = () => /* @__PURE__ */ import_react13.default.createElement(
-    AnimatedPath4,
-    {
-      fill: resolvedColor,
-      d: "M400 64H112a48 48 0 0 0-48 48v288a48 48 0 0 0 48 48h288a48 48 0 0 0 48-48V112a48 48 0 0 0-48-48zm-36.69 163.31l-96 96a16 16 0 0 1-22.62 0l-96-96a16 16 0 0 1 22.62-22.62L256 289.37l84.69-84.68a16 16 0 0 1 22.62 22.62z",
-      ...animatedProps
-    }
-  );
-  const renderVariant = () => {
-    switch (variant) {
-      case "filled":
-        return renderFilled();
-      case "duotone":
-        return renderDuotone();
-      case "round-outlined":
-        return renderRoundOutlined();
-      case "square-outlined":
-        return renderSquareOutlined();
-      case "round-filled":
-        return renderRoundFilled();
-      case "square-filled":
-        return renderSquareFilled();
-      case "baseline":
-      default:
-        return renderBaseline();
-    }
-  };
-  return /* @__PURE__ */ import_react13.default.createElement(import_react_native_svg4.default, { width: size, height: size, viewBox: "0 0 512 512" }, renderVariant());
-};
-
-// src/components/icon/icons/chevron-left.tsx
-var import_react14 = __toESM(require("react"), 1);
-var import_react_native12 = require("react-native");
-var import_react_native_svg5 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath5 = import_react_native12.Animated.createAnimatedComponent(import_react_native_svg5.Path);
-var ChevronLeftIcon = ({
-  variant = "baseline",
-  size = 24,
-  color = "default",
-  isAnimated = false
-}) => {
-  const theme = useXUITheme();
-  const scaleAnim = (0, import_react14.useRef)(new import_react_native12.Animated.Value(isAnimated ? 0 : 1)).current;
-  const opacityAnim = (0, import_react14.useRef)(new import_react_native12.Animated.Value(isAnimated ? 0 : 1)).current;
-  const resolvedColor = (0, import_react14.useMemo)(() => {
-    if (typeof color === "string" && isThemeColor(color)) {
-      return theme.colors[color].main;
-    }
-    return color;
-  }, [color, theme]);
-  (0, import_react14.useEffect)(() => {
-    if (isAnimated) {
-      import_react_native12.Animated.parallel([
-        import_react_native12.Animated.spring(scaleAnim, {
-          toValue: 1,
-          useNativeDriver: true,
-          tension: 50,
-          friction: 7
-        }),
-        import_react_native12.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration: 200,
-          useNativeDriver: true
-        })
-      ]).start();
-    }
-  }, [isAnimated, scaleAnim, opacityAnim]);
-  const animatedProps = isAnimated ? {
-    transform: [{ scale: scaleAnim }],
-    opacity: opacityAnim
-  } : void 0;
-  const renderBaseline = () => /* @__PURE__ */ import_react14.default.createElement(
-    AnimatedPath5,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M328 112L184 256l144 144",
-      ...animatedProps
-    }
-  );
-  const renderFilled = () => /* @__PURE__ */ import_react14.default.createElement(
-    AnimatedPath5,
-    {
-      fill: resolvedColor,
-      d: "M256 217.9L383 345c9.4 9.4 24.6 9.4 33.9 0s9.3-24.6 0-34L273 167c-9.1-9.1-23.7-9.3-33.1-.7L95 310.9c-4.7 4.7-7 10.9-7 17s2.3 12.3 7 17c9.4 9.4 24.6 9.4 33.9 0l127.1-127z",
-      rotation: 90,
-      origin: "256, 256",
-      ...animatedProps
-    }
-  );
-  const renderDuotone = () => /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
-    import_react_native_svg5.Path,
-    {
-      fill: resolvedColor,
-      opacity: 0.3,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48z"
-    }
-  ), renderBaseline());
-  const renderRoundOutlined = () => /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
-    import_react_native_svg5.Circle,
-    {
-      cx: "256",
-      cy: "256",
-      r: "192",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), renderBaseline());
-  const renderSquareOutlined = () => /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(
-    import_react_native_svg5.Rect,
-    {
-      x: "64",
-      y: "64",
-      width: "384",
-      height: "384",
-      rx: "48",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), renderBaseline());
-  const renderVariant = () => {
-    switch (variant) {
-      case "filled":
-        return renderFilled();
-      case "duotone":
-        return renderDuotone();
-      case "round-outlined":
-        return renderRoundOutlined();
-      case "square-outlined":
-        return renderSquareOutlined();
-      case "round-filled":
-      case "square-filled":
-        return renderFilled();
-      case "baseline":
-      default:
-        return renderBaseline();
-    }
-  };
-  return /* @__PURE__ */ import_react14.default.createElement(import_react_native_svg5.default, { width: size, height: size, viewBox: "0 0 512 512" }, renderVariant());
-};
-
-// src/components/icon/icons/chevron-right.tsx
-var import_react15 = __toESM(require("react"), 1);
-var import_react_native13 = require("react-native");
-var import_react_native_svg6 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath6 = import_react_native13.Animated.createAnimatedComponent(import_react_native_svg6.Path);
-var ChevronRightIcon = ({
-  variant = "baseline",
-  size = 24,
-  color = "default",
-  isAnimated = false
-}) => {
-  const theme = useXUITheme();
-  const scaleAnim = (0, import_react15.useRef)(new import_react_native13.Animated.Value(isAnimated ? 0 : 1)).current;
-  const opacityAnim = (0, import_react15.useRef)(new import_react_native13.Animated.Value(isAnimated ? 0 : 1)).current;
-  const resolvedColor = (0, import_react15.useMemo)(() => {
-    if (typeof color === "string" && isThemeColor(color)) {
-      return theme.colors[color].main;
-    }
-    return color;
-  }, [color, theme]);
-  (0, import_react15.useEffect)(() => {
-    if (isAnimated) {
-      import_react_native13.Animated.parallel([
-        import_react_native13.Animated.spring(scaleAnim, {
-          toValue: 1,
-          useNativeDriver: true,
-          tension: 50,
-          friction: 7
-        }),
-        import_react_native13.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration: 200,
-          useNativeDriver: true
-        })
-      ]).start();
-    }
-  }, [isAnimated, scaleAnim, opacityAnim]);
-  const animatedProps = isAnimated ? {
-    transform: [{ scale: scaleAnim }],
-    opacity: opacityAnim
-  } : void 0;
-  const renderBaseline = () => /* @__PURE__ */ import_react15.default.createElement(
-    AnimatedPath6,
-    {
-      fill: "none",
-      stroke: resolvedColor,
-      strokeLinecap: "round",
-      strokeLinejoin: "round",
-      strokeWidth: 48,
-      d: "M184 112l144 144-144 144",
-      ...animatedProps
-    }
-  );
-  const renderFilled = () => /* @__PURE__ */ import_react15.default.createElement(
-    AnimatedPath6,
-    {
-      fill: resolvedColor,
-      d: "M256 294.1L383 167c9.4-9.4 24.6-9.4 33.9 0s9.3 24.6 0 34L273 345c-9.1 9.1-23.7 9.3-33.1.7L95 201.1c-4.7-4.7-7-10.9-7-17s2.3-12.3 7-17c9.4-9.4 24.6-9.4 33.9 0l127.1 127z",
-      rotation: -90,
-      origin: "256, 256",
-      ...animatedProps
-    }
-  );
-  const renderDuotone = () => /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
-    import_react_native_svg6.Path,
-    {
-      fill: resolvedColor,
-      opacity: 0.3,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48z"
-    }
-  ), renderBaseline());
-  const renderRoundOutlined = () => /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
-    import_react_native_svg6.Circle,
-    {
-      cx: "256",
-      cy: "256",
-      r: "192",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), renderBaseline());
-  const renderSquareOutlined = () => /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(
-    import_react_native_svg6.Rect,
-    {
-      x: "64",
-      y: "64",
-      width: "384",
-      height: "384",
-      rx: "48",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), renderBaseline());
-  const renderVariant = () => {
-    switch (variant) {
-      case "filled":
-        return renderFilled();
-      case "duotone":
-        return renderDuotone();
-      case "round-outlined":
-        return renderRoundOutlined();
-      case "square-outlined":
-        return renderSquareOutlined();
-      case "round-filled":
-      case "square-filled":
-        return renderFilled();
-      case "baseline":
-      default:
-        return renderBaseline();
-    }
-  };
-  return /* @__PURE__ */ import_react15.default.createElement(import_react_native_svg6.default, { width: size, height: size, viewBox: "0 0 512 512" }, renderVariant());
-};
-
-// src/components/icon/icons/close.tsx
-var import_react16 = __toESM(require("react"), 1);
-var import_react_native14 = require("react-native");
-var import_react_native_svg7 = __toESM(require("react-native-svg"), 1);
-var AnimatedPath7 = import_react_native14.Animated.createAnimatedComponent(import_react_native_svg7.Path);
-var CloseIcon = ({
-  variant = "baseline",
-  size = 24,
-  color = "default",
-  isAnimated = false
-}) => {
-  const theme = useXUITheme();
-  const scaleAnim = (0, import_react16.useRef)(new import_react_native14.Animated.Value(isAnimated ? 0 : 1)).current;
-  const opacityAnim = (0, import_react16.useRef)(new import_react_native14.Animated.Value(isAnimated ? 0 : 1)).current;
-  const resolvedColor = (0, import_react16.useMemo)(() => {
-    if (typeof color === "string" && isThemeColor(color)) {
-      return theme.colors[color].main;
-    }
-    return color;
-  }, [color, theme]);
-  (0, import_react16.useEffect)(() => {
-    if (isAnimated) {
-      import_react_native14.Animated.parallel([
-        import_react_native14.Animated.spring(scaleAnim, {
-          toValue: 1,
-          useNativeDriver: true,
-          tension: 50,
-          friction: 7
-        }),
-        import_react_native14.Animated.timing(opacityAnim, {
-          toValue: 1,
-          duration: 200,
-          useNativeDriver: true
-        })
-      ]).start();
-    }
-  }, [isAnimated, scaleAnim, opacityAnim]);
-  const animatedProps = isAnimated ? {
-    transform: [{ scale: scaleAnim }],
-    opacity: opacityAnim
-  } : void 0;
-  const renderBaseline = () => /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "m289.94 256l95-95A24 24 0 0 0 351 127l-95 95l-95-95a24 24 0 0 0-34 34l95 95l-95 95a24 24 0 1 0 34 34l95-95l95 95a24 24 0 0 0 34-34Z",
-      ...animatedProps
-    }
-  );
-  const renderFilled = () => /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 1 1-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 0 1-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0 1 22.62-22.62L256 233.37l52.69-52.68a16 16 0 0 1 22.62 22.62L278.63 256z",
-      ...animatedProps
-    }
-  );
-  const renderDuotone = () => /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(
-    import_react_native_svg7.Path,
-    {
-      fill: resolvedColor,
-      opacity: 0.3,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48z"
-    }
-  ), /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "m289.94 256l95-95A24 24 0 0 0 351 127l-95 95l-95-95a24 24 0 0 0-34 34l95 95l-95 95a24 24 0 1 0 34 34l95-95l95 95a24 24 0 0 0 34-34Z",
-      ...animatedProps
-    }
-  ));
-  const renderRoundOutlined = () => /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(
-    import_react_native_svg7.Circle,
-    {
-      cx: "256",
-      cy: "256",
-      r: "192",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "m289.94 256l95-95A24 24 0 0 0 351 127l-95 95l-95-95a24 24 0 0 0-34 34l95 95l-95 95a24 24 0 1 0 34 34l95-95l95 95a24 24 0 0 0 34-34Z",
-      ...animatedProps
-    }
-  ));
-  const renderSquareOutlined = () => /* @__PURE__ */ import_react16.default.createElement(import_react16.default.Fragment, null, /* @__PURE__ */ import_react16.default.createElement(
-    import_react_native_svg7.Rect,
-    {
-      x: "64",
-      y: "64",
-      width: "384",
-      height: "384",
-      rx: "48",
-      fill: "none",
-      stroke: resolvedColor,
-      strokeWidth: 32
-    }
-  ), /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "m289.94 256l95-95A24 24 0 0 0 351 127l-95 95l-95-95a24 24 0 0 0-34 34l95 95l-95 95a24 24 0 1 0 34 34l95-95l95 95a24 24 0 0 0 34-34Z",
-      ...animatedProps
-    }
-  ));
-  const renderRoundFilled = () => /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "M256 48C141.31 48 48 141.31 48 256s93.31 208 208 208 208-93.31 208-208S370.69 48 256 48zm75.31 260.69a16 16 0 1 1-22.62 22.62L256 278.63l-52.69 52.68a16 16 0 0 1-22.62-22.62L233.37 256l-52.68-52.69a16 16 0 0 1 22.62-22.62L256 233.37l52.69-52.68a16 16 0 0 1 22.62 22.62L278.63 256z",
-      ...animatedProps
-    }
-  );
-  const renderSquareFilled = () => /* @__PURE__ */ import_react16.default.createElement(
-    AnimatedPath7,
-    {
-      fill: resolvedColor,
-      d: "M400 64H112a48 48 0 0 0-48 48v288a48 48 0 0 0 48 48h288a48 48 0 0 0 48-48V112a48 48 0 0 0-48-48zm-59.31 244.69a16 16 0 1 1-22.62 22.62L256 278.63l-62.07 52.68a16 16 0 0 1-22.62-22.62L223.37 256l-52.06-52.69a16 16 0 0 1 22.62-22.62L256 233.37l62.07-52.68a16 16 0 0 1 22.62 22.62L288.63 256z",
-      ...animatedProps
-    }
-  );
-  const renderVariant = () => {
-    switch (variant) {
-      case "filled":
-        return renderFilled();
-      case "duotone":
-        return renderDuotone();
-      case "round-outlined":
-        return renderRoundOutlined();
-      case "square-outlined":
-        return renderSquareOutlined();
-      case "round-filled":
-        return renderRoundFilled();
-      case "square-filled":
-        return renderSquareFilled();
-      case "baseline":
-      default:
-        return renderBaseline();
-    }
-  };
-  return /* @__PURE__ */ import_react16.default.createElement(import_react_native_svg7.default, { width: size, height: size, viewBox: "0 0 512 512" }, renderVariant());
-};
-
-// src/components/dialogs/datepicker-dialog/datepicker-dialog-header.tsx
+var import_chevron_down = require("@xaui/icons/chevron-down");
+var import_chevron_left = require("@xaui/icons/chevron-left");
+var import_chevron_right = require("@xaui/icons/chevron-right");
+var import_close = require("@xaui/icons/close");
 var DatePickerDialogHeader = ({
   viewDate,
   selectedDate,
@@ -1738,89 +1030,77 @@ var DatePickerDialogHeader = ({
 }) => {
   const theme = useXUITheme();
   const colorScheme = theme.colors[themeColor] ?? theme.colors.primary;
-  const dateText = (0, import_react17.useMemo)(() => {
+  const dateText = (0, import_react10.useMemo)(() => {
     if (!selectedDate) return "---";
     return formatDate(selectedDate, locale);
   }, [selectedDate, locale]);
-  const monthYearLabel = (0, import_react17.useMemo)(() => {
+  const monthYearLabel = (0, import_react10.useMemo)(() => {
     const month = getMonthName(viewDate.getMonth(), locale);
     return `${month} ${viewDate.getFullYear()}`;
   }, [viewDate, locale]);
-  return /* @__PURE__ */ import_react17.default.createElement(import_react17.default.Fragment, null, /* @__PURE__ */ import_react17.default.createElement(import_react_native15.View, { style: [styles2.header, { backgroundColor: colorScheme.main }] }, /* @__PURE__ */ import_react17.default.createElement(import_react_native15.Text, { style: [styles2.headerLabel, { color: colorScheme.foreground }] }, selectDateLabel), /* @__PURE__ */ import_react17.default.createElement(import_react_native15.View, { style: styles2.headerDateRow }, /* @__PURE__ */ import_react17.default.createElement(import_react_native15.Text, { style: [styles2.headerDate, { color: colorScheme.foreground }] }, dateText), /* @__PURE__ */ import_react17.default.createElement(
-    import_react_native15.Pressable,
+  return /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement(import_react_native8.View, { style: [styles2.header, { backgroundColor: colorScheme.main }] }, /* @__PURE__ */ import_react10.default.createElement(import_react_native8.Text, { style: [styles2.headerLabel, { color: colorScheme.foreground }] }, selectDateLabel), /* @__PURE__ */ import_react10.default.createElement(import_react_native8.View, { style: styles2.headerDateRow }, /* @__PURE__ */ import_react10.default.createElement(import_react_native8.Text, { style: [styles2.headerDate, { color: colorScheme.foreground }] }, dateText), selectedDate ? /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native8.Pressable,
     {
       onPress: onClearValue,
       hitSlop: { top: 8, right: 8, bottom: 8, left: 8 },
       accessibilityLabel: "Clear date",
       accessibilityRole: "button"
     },
-    /* @__PURE__ */ import_react17.default.createElement(CloseIcon, { size: 20, color: colorScheme.foreground })
-  ))), /* @__PURE__ */ import_react17.default.createElement(import_react_native15.View, { style: styles2.navigationRow }, /* @__PURE__ */ import_react17.default.createElement(
-    import_react_native15.Pressable,
+    /* @__PURE__ */ import_react10.default.createElement(import_close.CloseIcon, { size: 20, color: colorScheme.foreground })
+  ) : null)), /* @__PURE__ */ import_react10.default.createElement(import_react_native8.View, { style: styles2.navigationRow }, /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native8.Pressable,
     {
       style: styles2.monthYearButton,
       onPress: onToggleYearPicker,
       accessibilityLabel: `${monthYearLabel}, tap to change`,
       accessibilityRole: "button"
     },
-    /* @__PURE__ */ import_react17.default.createElement(
-      import_react_native15.Text,
-      {
-        style: [styles2.monthYearText, { color: theme.colors.foreground }]
-      },
-      monthYearLabel
-    ),
-    /* @__PURE__ */ import_react17.default.createElement(
-      ChevronDownIcon,
-      {
-        size: 18,
-        color: theme.colors.foreground
-      }
-    )
-  ), /* @__PURE__ */ import_react17.default.createElement(import_react_native15.View, { style: styles2.navButtons }, /* @__PURE__ */ import_react17.default.createElement(
-    import_react_native15.Pressable,
+    /* @__PURE__ */ import_react10.default.createElement(import_react_native8.Text, { style: [styles2.monthYearText, { color: theme.colors.foreground }] }, monthYearLabel),
+    /* @__PURE__ */ import_react10.default.createElement(import_chevron_down.ChevronDownIcon, { size: 18, color: theme.colors.foreground })
+  ), /* @__PURE__ */ import_react10.default.createElement(import_react_native8.View, { style: styles2.navButtons }, /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native8.Pressable,
     {
       style: styles2.navButton,
       onPress: onPreviousMonth,
       accessibilityLabel: "Previous month",
       accessibilityRole: "button"
     },
-    /* @__PURE__ */ import_react17.default.createElement(ChevronLeftIcon, { size: 20, color: theme.colors.foreground })
-  ), /* @__PURE__ */ import_react17.default.createElement(
-    import_react_native15.Pressable,
+    /* @__PURE__ */ import_react10.default.createElement(import_chevron_left.ChevronLeftIcon, { size: 20, color: theme.colors.foreground })
+  ), /* @__PURE__ */ import_react10.default.createElement(
+    import_react_native8.Pressable,
     {
       style: styles2.navButton,
       onPress: onNextMonth,
       accessibilityLabel: "Next month",
       accessibilityRole: "button"
     },
-    /* @__PURE__ */ import_react17.default.createElement(ChevronRightIcon, { size: 20, color: theme.colors.foreground })
+    /* @__PURE__ */ import_react10.default.createElement(import_chevron_right.ChevronRightIcon, { size: 20, color: theme.colors.foreground })
   ))));
 };
 
 // src/components/dialogs/datepicker-dialog/datepicker-dialog-month-picker.tsx
-var import_react18 = __toESM(require("react"), 1);
-var import_react_native16 = require("react-native");
+var import_react11 = __toESM(require("react"), 1);
+var import_react_native9 = require("react-native");
 var DatePickerDialogMonthPicker = ({ viewDate, locale, themeColor, onSelectMonth }) => {
   const theme = useXUITheme();
   const colorScheme = theme.colors[themeColor] ?? theme.colors.primary;
   const isDefault = themeColor === "default";
   const accentColor = isDefault ? theme.colors.foreground : colorScheme.main;
   const accentFg = isDefault ? theme.colors.background : colorScheme.foreground;
-  const months = (0, import_react18.useMemo)(() => getMonthNames(locale), [locale]);
+  const months = (0, import_react11.useMemo)(() => getMonthNames(locale), [locale]);
   const currentMonth = viewDate.getMonth();
-  const groupAnim = (0, import_react18.useRef)(new import_react_native16.Animated.Value(0)).current;
-  (0, import_react18.useEffect)(() => {
+  const groupAnim = (0, import_react11.useRef)(new import_react_native9.Animated.Value(0)).current;
+  (0, import_react11.useEffect)(() => {
     groupAnim.setValue(0);
-    import_react_native16.Animated.timing(groupAnim, {
+    import_react_native9.Animated.timing(groupAnim, {
       toValue: 1,
       duration: 220,
-      easing: import_react_native16.Easing.out(import_react_native16.Easing.cubic),
+      easing: import_react_native9.Easing.out(import_react_native9.Easing.cubic),
       useNativeDriver: true
     }).start();
   }, [groupAnim]);
-  return /* @__PURE__ */ import_react18.default.createElement(import_react_native16.View, { style: styles2.monthPickerContainer }, /* @__PURE__ */ import_react18.default.createElement(
-    import_react_native16.Animated.View,
+  return /* @__PURE__ */ import_react11.default.createElement(import_react_native9.View, { style: styles2.monthPickerContainer }, /* @__PURE__ */ import_react11.default.createElement(
+    import_react_native9.Animated.View,
     {
       style: {
         opacity: groupAnim,
@@ -1834,10 +1114,10 @@ var DatePickerDialogMonthPicker = ({ viewDate, locale, themeColor, onSelectMonth
         ]
       }
     },
-    /* @__PURE__ */ import_react18.default.createElement(import_react_native16.View, { style: styles2.monthGrid }, months.map((name, index) => {
+    /* @__PURE__ */ import_react11.default.createElement(import_react_native9.View, { style: styles2.monthGrid }, months.map((name, index) => {
       const isCurrentMonth = index === currentMonth;
-      return /* @__PURE__ */ import_react18.default.createElement(
-        import_react_native16.Pressable,
+      return /* @__PURE__ */ import_react11.default.createElement(
+        import_react_native9.Pressable,
         {
           key: index,
           style: [
@@ -1849,8 +1129,8 @@ var DatePickerDialogMonthPicker = ({ viewDate, locale, themeColor, onSelectMonth
           accessibilityRole: "button",
           accessibilityState: { selected: isCurrentMonth }
         },
-        /* @__PURE__ */ import_react18.default.createElement(
-          import_react_native16.Text,
+        /* @__PURE__ */ import_react11.default.createElement(
+          import_react_native9.Text,
           {
             style: [
               styles2.monthText,
@@ -1869,38 +1149,35 @@ var DatePickerDialogMonthPicker = ({ viewDate, locale, themeColor, onSelectMonth
 };
 
 // src/components/dialogs/datepicker-dialog/datepicker-dialog-year-picker.tsx
-var import_react19 = __toESM(require("react"), 1);
-var import_react_native17 = require("react-native");
+var import_react12 = __toESM(require("react"), 1);
+var import_react_native10 = require("react-native");
 var ITEM_HEIGHT = 48;
 var NUM_COLUMNS = 4;
 var DatePickerDialogYearPicker = ({ viewDate, themeColor, minDate, maxDate, onSelectYear }) => {
-  const listRef = (0, import_react19.useRef)(null);
-  const groupAnim = (0, import_react19.useRef)(new import_react_native17.Animated.Value(0)).current;
+  const listRef = (0, import_react12.useRef)(null);
+  const groupAnim = (0, import_react12.useRef)(new import_react_native10.Animated.Value(0)).current;
   const theme = useXUITheme();
   const colorScheme = theme.colors[themeColor] ?? theme.colors.primary;
   const isDefault = themeColor === "default";
   const accentColor = isDefault ? theme.colors.foreground : colorScheme.main;
   const accentFg = isDefault ? theme.colors.background : colorScheme.foreground;
-  const years = (0, import_react19.useMemo)(
-    () => getYearRange(minDate, maxDate),
-    [minDate, maxDate]
-  );
+  const years = (0, import_react12.useMemo)(() => getYearRange(minDate, maxDate), [minDate, maxDate]);
   const currentYear = viewDate.getFullYear();
-  const initialIndex = (0, import_react19.useMemo)(() => {
+  const initialIndex = (0, import_react12.useMemo)(() => {
     const index = years.indexOf(currentYear);
     const rowIndex = Math.floor(index / NUM_COLUMNS);
     return Math.max(0, rowIndex);
   }, [years, currentYear]);
-  (0, import_react19.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     groupAnim.setValue(0);
-    import_react_native17.Animated.timing(groupAnim, {
+    import_react_native10.Animated.timing(groupAnim, {
       toValue: 1,
       duration: 220,
-      easing: import_react_native17.Easing.out(import_react_native17.Easing.cubic),
+      easing: import_react_native10.Easing.out(import_react_native10.Easing.cubic),
       useNativeDriver: true
     }).start();
   }, [groupAnim]);
-  const getItemLayout = (0, import_react19.useCallback)(
+  const getItemLayout = (0, import_react12.useCallback)(
     (_, index) => ({
       length: ITEM_HEIGHT,
       offset: ITEM_HEIGHT * index,
@@ -1908,11 +1185,11 @@ var DatePickerDialogYearPicker = ({ viewDate, themeColor, minDate, maxDate, onSe
     }),
     []
   );
-  const renderYear = (0, import_react19.useCallback)(
+  const renderYear = (0, import_react12.useCallback)(
     ({ item }) => {
       const isCurrentYear = item === currentYear;
-      return /* @__PURE__ */ import_react19.default.createElement(
-        import_react_native17.Pressable,
+      return /* @__PURE__ */ import_react12.default.createElement(
+        import_react_native10.Pressable,
         {
           style: [
             styles2.yearCell,
@@ -1923,8 +1200,8 @@ var DatePickerDialogYearPicker = ({ viewDate, themeColor, minDate, maxDate, onSe
           accessibilityRole: "button",
           accessibilityState: { selected: isCurrentYear }
         },
-        /* @__PURE__ */ import_react19.default.createElement(
-          import_react_native17.Text,
+        /* @__PURE__ */ import_react12.default.createElement(
+          import_react_native10.Text,
           {
             style: [
               styles2.yearText,
@@ -1941,8 +1218,8 @@ var DatePickerDialogYearPicker = ({ viewDate, themeColor, minDate, maxDate, onSe
     },
     [currentYear, onSelectYear, accentColor, accentFg, theme.colors.foreground]
   );
-  return /* @__PURE__ */ import_react19.default.createElement(import_react_native17.View, { style: styles2.yearPickerContainer }, /* @__PURE__ */ import_react19.default.createElement(
-    import_react_native17.Animated.View,
+  return /* @__PURE__ */ import_react12.default.createElement(import_react_native10.View, { style: styles2.yearPickerContainer }, /* @__PURE__ */ import_react12.default.createElement(
+    import_react_native10.Animated.View,
     {
       style: {
         opacity: groupAnim,
@@ -1956,8 +1233,8 @@ var DatePickerDialogYearPicker = ({ viewDate, themeColor, minDate, maxDate, onSe
         ]
       }
     },
-    /* @__PURE__ */ import_react19.default.createElement(
-      import_react_native17.FlatList,
+    /* @__PURE__ */ import_react12.default.createElement(
+      import_react_native10.FlatList,
       {
         ref: listRef,
         data: years,
@@ -1990,13 +1267,13 @@ var DatePickerDialog = ({
   onClose
 }) => {
   const theme = useXUITheme();
-  const { width: screenWidth, height: screenHeight } = (0, import_react_native18.useWindowDimensions)();
-  const fadeAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(0)).current;
-  const slideAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(0)).current;
-  const scaleAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(0)).current;
-  const viewFadeAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(1)).current;
-  const monthSlideXAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(0)).current;
-  const monthFadeAnim = (0, import_react20.useRef)(new import_react_native18.Animated.Value(1)).current;
+  const { width: screenWidth, height: screenHeight } = (0, import_react_native11.useWindowDimensions)();
+  const fadeAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(0)).current;
+  const slideAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(0)).current;
+  const scaleAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(0)).current;
+  const viewFadeAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(1)).current;
+  const monthSlideXAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(0)).current;
+  const monthFadeAnim = (0, import_react13.useRef)(new import_react_native11.Animated.Value(1)).current;
   const colorScheme = theme.colors[themeColor] ?? theme.colors.primary;
   const isDefault = themeColor === "default";
   const accentColor = isDefault ? theme.colors.foreground : colorScheme.main;
@@ -2014,7 +1291,7 @@ var DatePickerDialog = ({
     toggleYearPicker,
     syncViewToDate
   } = useDatePickerViewState(selectedDate);
-  const onCloseComplete = (0, import_react20.useCallback)(() => {
+  const onCloseComplete = (0, import_react13.useCallback)(() => {
     fadeAnim.setValue(0);
     slideAnim.setValue(0);
     scaleAnim.setValue(0);
@@ -2036,41 +1313,41 @@ var DatePickerDialog = ({
     slideAnim: monthSlideXAnim,
     fadeAnim: monthFadeAnim
   });
-  const prevViewModeRef = (0, import_react20.useRef)(viewMode);
-  (0, import_react20.useEffect)(() => {
+  const prevViewModeRef = (0, import_react13.useRef)(viewMode);
+  (0, import_react13.useEffect)(() => {
     if (prevViewModeRef.current !== viewMode) {
       prevViewModeRef.current = viewMode;
       animateViewTransition();
     }
   }, [viewMode, animateViewTransition]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (visible && selectedDate) {
       syncViewToDate(selectedDate);
     }
   }, [visible, selectedDate, syncViewToDate]);
-  (0, import_react20.useEffect)(() => {
+  (0, import_react13.useEffect)(() => {
     if (!visible) return;
-    const sub = import_react_native18.BackHandler.addEventListener("hardwareBackPress", () => {
+    const sub = import_react_native11.BackHandler.addEventListener("hardwareBackPress", () => {
       onClose();
       return true;
     });
     return () => sub.remove();
   }, [visible, onClose]);
-  const handlePreviousMonth = (0, import_react20.useCallback)(() => {
+  const handlePreviousMonth = (0, import_react13.useCallback)(() => {
     goToPreviousMonth();
     animateMonthSlide("left");
   }, [goToPreviousMonth, animateMonthSlide]);
-  const handleNextMonth = (0, import_react20.useCallback)(() => {
+  const handleNextMonth = (0, import_react13.useCallback)(() => {
     goToNextMonth();
     animateMonthSlide("right");
   }, [goToNextMonth, animateMonthSlide]);
-  const handleDaySelect = (0, import_react20.useCallback)(
+  const handleDaySelect = (0, import_react13.useCallback)(
     (date) => {
       onDateSelect(date);
     },
     [onDateSelect]
   );
-  const handleTodayPress = (0, import_react20.useCallback)(() => {
+  const handleTodayPress = (0, import_react13.useCallback)(() => {
     const today = /* @__PURE__ */ new Date();
     if (!isDateInRange(today, minDate, maxDate)) return;
     goToToday();
@@ -2119,7 +1396,7 @@ var DatePickerDialog = ({
   const renderContent = () => {
     switch (viewMode) {
       case "year":
-        return /* @__PURE__ */ import_react20.default.createElement(
+        return /* @__PURE__ */ import_react13.default.createElement(
           DatePickerDialogYearPicker,
           {
             viewDate,
@@ -2130,7 +1407,7 @@ var DatePickerDialog = ({
           }
         );
       case "month":
-        return /* @__PURE__ */ import_react20.default.createElement(
+        return /* @__PURE__ */ import_react13.default.createElement(
           DatePickerDialogMonthPicker,
           {
             viewDate,
@@ -2141,7 +1418,7 @@ var DatePickerDialog = ({
         );
       case "calendar":
       default:
-        return /* @__PURE__ */ import_react20.default.createElement(import_react_native18.Animated.View, { style: [viewTransitionStyle, monthSlideStyle] }, /* @__PURE__ */ import_react20.default.createElement(
+        return /* @__PURE__ */ import_react13.default.createElement(import_react_native11.Animated.View, { style: [viewTransitionStyle, monthSlideStyle] }, /* @__PURE__ */ import_react13.default.createElement(
           DatePickerDialogCalendar,
           {
             viewDate,
@@ -2158,23 +1435,23 @@ var DatePickerDialog = ({
         ));
     }
   };
-  return /* @__PURE__ */ import_react20.default.createElement(Portal, null, /* @__PURE__ */ import_react20.default.createElement(import_react_native_gesture_handler2.GestureHandlerRootView, { style: [overlayStyle, style] }, /* @__PURE__ */ import_react20.default.createElement(import_react_native18.View, { style: overlayStyle }, /* @__PURE__ */ import_react20.default.createElement(import_react_native18.Animated.View, { style: [styles2.backdrop, { opacity: fadeAnim }] }, /* @__PURE__ */ import_react20.default.createElement(
-    import_react_native18.Pressable,
+  return /* @__PURE__ */ import_react13.default.createElement(Portal, null, /* @__PURE__ */ import_react13.default.createElement(import_react_native_gesture_handler2.GestureHandlerRootView, { style: [overlayStyle, style] }, /* @__PURE__ */ import_react13.default.createElement(import_react_native11.View, { style: overlayStyle }, /* @__PURE__ */ import_react13.default.createElement(import_react_native11.Animated.View, { style: [styles2.backdrop, { opacity: fadeAnim }] }, /* @__PURE__ */ import_react13.default.createElement(
+    import_react_native11.Pressable,
     {
       style: { flex: 1 },
       onPress: onClose,
       accessibilityLabel: "Close calendar",
       accessibilityRole: "button"
     }
-  )), /* @__PURE__ */ import_react20.default.createElement(import_react_native18.Animated.View, { style: [styles2.dialogContainer, containerAnimatedStyle] }, /* @__PURE__ */ import_react20.default.createElement(
-    import_react_native18.View,
+  )), /* @__PURE__ */ import_react13.default.createElement(import_react_native11.Animated.View, { style: [styles2.dialogContainer, containerAnimatedStyle] }, /* @__PURE__ */ import_react13.default.createElement(
+    import_react_native11.View,
     {
       style: [
         styles2.container,
         { backgroundColor: theme.colors.background }
       ]
     },
-    /* @__PURE__ */ import_react20.default.createElement(
+    /* @__PURE__ */ import_react13.default.createElement(
       DatePickerDialogHeader,
       {
         viewDate,
@@ -2189,31 +1466,33 @@ var DatePickerDialog = ({
       }
     ),
     renderContent(),
-    /* @__PURE__ */ import_react20.default.createElement(import_react_native18.View, { style: styles2.footer }, /* @__PURE__ */ import_react20.default.createElement(
-      import_react_native18.Pressable,
+    /* @__PURE__ */ import_react13.default.createElement(import_react_native11.View, { style: styles2.footer }, /* @__PURE__ */ import_react13.default.createElement(
+      import_react_native11.Pressable,
       {
         style: styles2.footerButton,
         onPress: handleTodayPress,
         accessibilityLabel: resolvedTodayLabel,
         accessibilityRole: "button"
       },
-      /* @__PURE__ */ import_react20.default.createElement(import_react_native18.Text, { style: [styles2.footerButtonText, { color: accentColor }] }, resolvedTodayLabel)
-    ), /* @__PURE__ */ import_react20.default.createElement(
-      import_react_native18.Pressable,
+      /* @__PURE__ */ import_react13.default.createElement(import_react_native11.Text, { style: [styles2.footerButtonText, { color: accentColor }] }, resolvedTodayLabel)
+    ), /* @__PURE__ */ import_react13.default.createElement(
+      import_react_native11.Pressable,
       {
         style: styles2.footerButton,
         onPress: onClose,
         accessibilityLabel: resolvedConfirmLabel,
         accessibilityRole: "button"
       },
-      /* @__PURE__ */ import_react20.default.createElement(import_react_native18.Text, { style: [styles2.footerButtonText, { color: accentColor }] }, resolvedConfirmLabel)
+      /* @__PURE__ */ import_react13.default.createElement(import_react_native11.Text, { style: [styles2.footerButtonText, { color: accentColor }] }, resolvedConfirmLabel)
     ))
   )))));
 };
 
 // src/components/datepicker/datepicker-trigger.tsx
-var import_react21 = __toESM(require("react"), 1);
-var import_react_native19 = require("react-native");
+var import_react14 = __toESM(require("react"), 1);
+var import_react_native12 = require("react-native");
+var import_calendar = require("@xaui/icons/calendar");
+var import_close2 = require("@xaui/icons/close");
 var DatePickerTrigger = ({
   triggerRef,
   isDisabled,
@@ -2235,8 +1514,8 @@ var DatePickerTrigger = ({
   onLayout: handleTriggerLayout
 }) => {
   const renderLabel = isLabelInside && label;
-  return /* @__PURE__ */ import_react21.default.createElement(
-    import_react_native19.Pressable,
+  return /* @__PURE__ */ import_react14.default.createElement(
+    import_react_native12.Pressable,
     {
       ref: triggerRef,
       onPress: handleTriggerPress,
@@ -2258,8 +1537,8 @@ var DatePickerTrigger = ({
       accessibilityRole: "button",
       accessibilityState: { disabled: isDisabled }
     },
-    /* @__PURE__ */ import_react21.default.createElement(import_react_native19.View, { style: styles.triggerContent }, isLabelInside && renderLabel, /* @__PURE__ */ import_react21.default.createElement(
-      import_react_native19.Text,
+    /* @__PURE__ */ import_react14.default.createElement(import_react_native12.View, { style: styles.triggerContent }, isLabelInside && renderLabel, /* @__PURE__ */ import_react14.default.createElement(
+      import_react_native12.Text,
       {
         style: [
           styles.triggerText,
@@ -2272,15 +1551,15 @@ var DatePickerTrigger = ({
       },
       displayValue
     )),
-    isClearable && hasValue ? /* @__PURE__ */ import_react21.default.createElement(
-      import_react_native19.TouchableOpacity,
+    isClearable && hasValue ? /* @__PURE__ */ import_react14.default.createElement(
+      import_react_native12.TouchableOpacity,
       {
         onPress: handleClear,
         style: styles.clearButton,
         hitSlop: { top: 8, right: 8, bottom: 8, left: 8 }
       },
-      /* @__PURE__ */ import_react21.default.createElement(CloseIcon, { color: theme.colors.foreground, size: 20 })
-    ) : calendarIcon ?? /* @__PURE__ */ import_react21.default.createElement(CalendarIcon, { color: theme.colors.foreground, size: 20 })
+      /* @__PURE__ */ import_react14.default.createElement(import_close2.CloseIcon, { color: theme.colors.foreground, size: 20 })
+    ) : calendarIcon ?? /* @__PURE__ */ import_react14.default.createElement(import_calendar.CalendarIcon, { color: theme.colors.foreground, size: 20 })
   );
 };
 
@@ -2325,10 +1604,10 @@ var DatePicker = ({
     onOpen,
     onClose
   });
-  const triggerRef = (0, import_react22.useRef)(null);
-  const handleTriggerLayout = (0, import_react22.useCallback)(() => {
+  const triggerRef = (0, import_react15.useRef)(null);
+  const handleTriggerLayout = (0, import_react15.useCallback)(() => {
   }, []);
-  const firstDayOfWeek = (0, import_react22.useMemo)(
+  const firstDayOfWeek = (0, import_react15.useMemo)(
     () => firstDayOfWeekProp ?? getFirstDayOfWeek(locale),
     [firstDayOfWeekProp, locale]
   );
@@ -2341,35 +1620,35 @@ var DatePicker = ({
     sizeStyles.labelSize
   );
   const helperColor = useDatePickerHelperColor(isInvalid);
-  const displayValue = (0, import_react22.useMemo)(() => {
+  const displayValue = (0, import_react15.useMemo)(() => {
     if (!selectedDate) return placeholder;
     return formatDate(selectedDate, locale);
   }, [selectedDate, locale, placeholder]);
-  const handleTriggerPress = (0, import_react22.useCallback)(() => {
+  const handleTriggerPress = (0, import_react15.useCallback)(() => {
     if (!isDisabled && !isReadOnly) {
       setOpen(true);
     }
   }, [isDisabled, isReadOnly, setOpen]);
-  const handleClear = (0, import_react22.useCallback)(() => {
+  const handleClear = (0, import_react15.useCallback)(() => {
     if (isDisabled || isReadOnly) return;
     updateDate(null);
   }, [isDisabled, isReadOnly, updateDate]);
-  const handleDateSelect = (0, import_react22.useCallback)(
+  const handleDateSelect = (0, import_react15.useCallback)(
     (date) => {
       updateDate(date);
     },
     [updateDate]
   );
-  const handleClose = (0, import_react22.useCallback)(() => {
+  const handleClose = (0, import_react15.useCallback)(() => {
     setOpen(false);
   }, [setOpen]);
   const isLabelInside = labelPlacement === "inside";
   const isLabelOutsideLeft = labelPlacement === "outside-left";
   const isLabelOutside = labelPlacement === "outside" || labelPlacement === "outside-top";
-  const renderLabel = label ? typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ import_react22.default.createElement(import_react_native20.Text, { style: [styles.label, labelStyle] }, label) : /* @__PURE__ */ import_react22.default.createElement(import_react_native20.View, null, label) : null;
+  const renderLabel = label ? typeof label === "string" || typeof label === "number" ? /* @__PURE__ */ import_react15.default.createElement(import_react_native13.Text, { style: [styles.label, labelStyle] }, label) : /* @__PURE__ */ import_react15.default.createElement(import_react_native13.View, null, label) : null;
   const shouldShowHelper = Boolean(description || errorMessage);
   const helperContent = isInvalid && errorMessage ? errorMessage : description;
-  const triggerContent = /* @__PURE__ */ import_react22.default.createElement(
+  const triggerContent = /* @__PURE__ */ import_react15.default.createElement(
     DatePickerTrigger,
     {
       triggerRef,
@@ -2393,8 +1672,8 @@ var DatePicker = ({
     }
   );
   const labelBlock = isLabelOutside || isLabelInside ? renderLabel : null;
-  return /* @__PURE__ */ import_react22.default.createElement(
-    import_react_native20.View,
+  return /* @__PURE__ */ import_react15.default.createElement(
+    import_react_native13.View,
     {
       style: [
         styles.container,
@@ -2403,9 +1682,9 @@ var DatePicker = ({
       ]
     },
     isLabelOutside && labelBlock,
-    isLabelOutsideLeft ? /* @__PURE__ */ import_react22.default.createElement(import_react_native20.View, { style: styles.outsideLeftRow }, renderLabel, triggerContent) : triggerContent,
-    shouldShowHelper && helperContent ? typeof helperContent === "string" || typeof helperContent === "number" ? /* @__PURE__ */ import_react22.default.createElement(import_react_native20.Text, { style: [styles.helperText, { color: helperColor }] }, helperContent) : /* @__PURE__ */ import_react22.default.createElement(import_react_native20.View, null, helperContent) : null,
-    /* @__PURE__ */ import_react22.default.createElement(
+    isLabelOutsideLeft ? /* @__PURE__ */ import_react15.default.createElement(import_react_native13.View, { style: styles.outsideLeftRow }, renderLabel, triggerContent) : triggerContent,
+    shouldShowHelper && helperContent ? typeof helperContent === "string" || typeof helperContent === "number" ? /* @__PURE__ */ import_react15.default.createElement(import_react_native13.Text, { style: [styles.helperText, { color: helperColor }] }, helperContent) : /* @__PURE__ */ import_react15.default.createElement(import_react_native13.View, null, helperContent) : null,
+    /* @__PURE__ */ import_react15.default.createElement(
       DatePickerDialog,
       {
         visible: isOpen,