Native Date Select

1import {
2  Children,
3  createContext,
4  isValidElement,
5  useCallback,
6  useContext,
7  useEffect,
8  useLayoutEffect,
9  useMemo,
10  useState,
11} from "react";
12import {
13  type GestureResponderEvent,
14  Platform,
15  Pressable,
16  type PressableProps,
17  View,
18} from "react-native";
19import Animated, {
20  Easing,
21  interpolate,
22  useAnimatedStyle,
23  useSharedValue,
24  withTiming,
25} from "react-native-reanimated";
26import { cn } from "@/lib/utils";
27import { ActionInput } from "../action-input";
28import {
29  BottomSheet,
30  BottomSheetBody,
31  BottomSheetContent,
32  BottomSheetFooter,
33  BottomSheetHeader,
34  BottomSheetTitle,
35} from "../bottom-sheet";
36import { ChevronDownIcon } from "../icons";
37import {
38  InputAddon,
39  type InputAddonChild,
40  type InputAddonChildren,
41  InputAddonIcon,
42  useInputAddons,
43} from "../input";
44import { Slot } from "../slot";
45import {
46  type NativeDateSelectMode,
47  NativeDateSelectPicker,
48  type NativeDateSelectVariant,
49} from "./native-date-select-picker";
50 
51// Constants
52const ANIMATION_DURATION = 280;
53const ANIMATION_EASING = Easing.out(Easing.cubic);
54const NATIVE_DATE_SELECT_INPUT_NAME = "NativeDateSelectInput";
55const NATIVE_DATE_SELECT_TRIGGER_NAME = "NativeDateSelectTrigger";
56const NATIVE_DATE_SELECT_CONTENT_NAME = "NativeDateSelectContent";
57const NATIVE_DATE_SELECT_SHEET_FOOTER_NAME = "NativeDateSelectSheetFooter";
58const WHEEL_PICKER_HEIGHT = 216;
59const DEFAULT_PLACEHOLDER = "Pick a date";
60 
61// Types
62type NativeDateSelectContextProps = {
63  open: boolean;
64  onOpenChange: (open: boolean) => void;
65  value?: Date;
66  onValueChange: (value: Date) => void;
67  selectedValue?: Date;
68  setSelectedValue: (value: Date) => void;
69  onConfirm: (value?: Date) => void;
70  onCancel: () => void;
71  disabled?: boolean;
72  mode: NativeDateSelectMode;
73  variant: NativeDateSelectVariant;
74  setVariant: (variant: NativeDateSelectVariant) => void;
75  minimumDate?: Date;
76  maximumDate?: Date;
77  is24Hour?: boolean;
78  placeholder: string;
79  setPlaceholder: (placeholder: string) => void;
80  hasTrigger: boolean;
81  hasInput: boolean;
82  className?: string;
83  testID?: string;
84};
85 
86type NativeDateSelectProps = {
87  open?: boolean;
88  onOpenChange?: (open: boolean) => void;
89  value?: Date;
90  onValueChange?: (value: Date) => void;
91  mode?: NativeDateSelectMode;
92  variant?: NativeDateSelectVariant;
93  minimumDate?: Date;
94  maximumDate?: Date;
95  disabled?: boolean;
96  is24Hour?: boolean;
97  className?: string;
98  testID?: string;
99  children?: React.ReactNode;
100};
101 
102// … truncated