@raystack/apsara 0.18.2 → 0.18.3

package/dist/index.js

@@ -28028,19 +28028,24 @@ function DayPicker(props) {
 var styles$6 = {"calendarRoot":"calendar-module_calendarRoot__KnBz-","caption_label":"calendar-module_caption_label__C5Ys7","dropdowns":"calendar-module_dropdowns__Wn53e","dropdown_trigger":"calendar-module_dropdown_trigger__dsyaq","dropdown_item_text":"calendar-module_dropdown_item_text__Tudqv","nav_button":"calendar-module_nav_button__8W5py","nav_button_previous":"calendar-module_nav_button_previous__lWJYm","nav_button_next":"calendar-module_nav_button_next__1MzRT","months":"calendar-module_months__IN75k","nav":"calendar-module_nav__aGeze","month_caption":"calendar-module_month_caption__Ws6Hx","day":"calendar-module_day__rQFGK","disabled":"calendar-module_disabled__jqgRB","outside":"calendar-module_outside__nq5XC","selected":"calendar-module_selected__kiiAZ","range_middle":"calendar-module_range_middle__PmzFi","range_start":"calendar-module_range_start__ZUooG","range_end":"calendar-module_range_end__PKrm7","week":"calendar-module_week__kCvKJ","day_button":"calendar-module_day_button__vCKP1","today":"calendar-module_today__iXQIQ","weekday":"calendar-module_weekday__xzf6F","hidden":"calendar-module_hidden__wqJVo","calendarPopover":"calendar-module_calendarPopover__PY4sa","datePickerInput":"calendar-module_datePickerInput__aOnRQ","dropdown_icon":"calendar-module_dropdown_icon__rDTbz","dropdown_content":"calendar-module_dropdown_content__ajJ5V"};
 
 const root$1 = cva(styles$6.calendarRoot);
-function DropDown({ options = [], value, onChange }) {
+function DropDown({ options = [], value, onChange, onDropdownOpen, }) {
+    const [open, setOpen] = useState(false);
+    useEffect(() => {
+        if (open && onDropdownOpen)
+            onDropdownOpen();
+    }, [open]);
     function handleChange(value) {
         if (onChange) {
             onChange({ target: { value } });
         }
     }
-    return (jsxRuntimeExports.jsxs(Select$1, { value: value?.toString(), onValueChange: handleChange, children: [jsxRuntimeExports.jsx(Select$1.Trigger, { className: styles$6.dropdown_trigger, iconProps: {
+    return (jsxRuntimeExports.jsxs(Select$1, { value: value?.toString(), onValueChange: handleChange, open: open, onOpenChange: setOpen, children: [jsxRuntimeExports.jsx(Select$1.Trigger, { className: styles$6.dropdown_trigger, iconProps: {
                     className: styles$6.dropdown_icon,
                 }, children: jsxRuntimeExports.jsx(Select$1.Value, {}) }), jsxRuntimeExports.jsxs(Select$1.Content, { className: styles$6.dropdown_content, children: [jsxRuntimeExports.jsx(Select$1.ScrollUpButton, { asChild: true, children: jsxRuntimeExports.jsx(Flex, { justify: "center", children: jsxRuntimeExports.jsx(ChevronUpIcon, {}) }) }), jsxRuntimeExports.jsx(Select$1.Viewport, { children: options.map((opt) => (jsxRuntimeExports.jsx(Select$1.Item, { value: opt.value.toString(), disabled: opt.disabled, textProps: {
                                 className: styles$6.dropdown_item_text,
                             }, children: opt.label }, opt.value))) }), jsxRuntimeExports.jsx(Select$1.ScrollDownButton, { asChild: true, children: jsxRuntimeExports.jsx(Flex, { justify: "center", children: jsxRuntimeExports.jsx(ChevronDownIcon, {}) }) })] })] }));
 }
-const Calendar = function ({ className, classNames, showOutsideDays = true, ...props }) {
+const Calendar = function ({ className, classNames, showOutsideDays = true, onDropdownOpen, ...props }) {
     return (jsxRuntimeExports.jsx(DayPicker, { showOutsideDays: showOutsideDays, components: {
             Chevron: (props) => {
                 if (props.orientation === "left") {
@@ -28048,7 +28053,7 @@ const Calendar = function ({ className, classNames, showOutsideDays = true, ...p
                 }
                 return jsxRuntimeExports.jsx(ChevronRightIcon, { ...props });
             },
-            Dropdown: DropDown,
+            Dropdown: (props) => (jsxRuntimeExports.jsx(DropDown, { ...props, onDropdownOpen: onDropdownOpen })),
         }, classNames: {
             caption_label: styles$6.caption_label,
             button_previous: `${styles$6.nav_button} ${styles$6.nav_button_previous}`,
@@ -28122,14 +28127,21 @@ var dayjs = /*@__PURE__*/getDefaultExportFromCjs(dayjs_minExports);
 function DatePicker({ side = "top", dateFormat = "DD/MM/YYYY", textFieldProps, calendarProps, value = new Date(), onSelect = () => { }, }) {
     const [showCalendar, setShowCalendar] = useState(false);
     const dateValue = dayjs(value).format(dateFormat);
+    const isDropdownOpenedRef = useRef(false);
     const handleSelect = (day) => {
         onSelect(day);
         setShowCalendar(false);
     };
+    function onDropdownOpen() {
+        isDropdownOpenedRef.current = true;
+    }
     function onOpenChange(open) {
-        setShowCalendar(Boolean(open));
+        if (!isDropdownOpenedRef.current) {
+            setShowCalendar(Boolean(open));
+        }
+        isDropdownOpenedRef.current = false;
     }
-    return (jsxRuntimeExports.jsxs(Popover, { open: showCalendar, onOpenChange: onOpenChange, children: [jsxRuntimeExports.jsx(Popover.Trigger, { asChild: true, children: jsxRuntimeExports.jsx(TextField, { value: dateValue, trailing: jsxRuntimeExports.jsx(CalendarIcon, {}), className: styles$6.datePickerInput, readOnly: true, ...textFieldProps }) }), jsxRuntimeExports.jsx(Popover.Content, { side: side, className: styles$6.calendarPopover, children: jsxRuntimeExports.jsx(Calendar, { required: true, ...calendarProps, mode: "single", selected: value, defaultMonth: value, onSelect: handleSelect }) })] }));
+    return (jsxRuntimeExports.jsxs(Popover, { open: showCalendar, onOpenChange: onOpenChange, children: [jsxRuntimeExports.jsx(Popover.Trigger, { asChild: true, children: jsxRuntimeExports.jsx(TextField, { value: dateValue, trailing: jsxRuntimeExports.jsx(CalendarIcon, {}), className: styles$6.datePickerInput, readOnly: true, ...textFieldProps }) }), jsxRuntimeExports.jsx(Popover.Content, { side: side, className: styles$6.calendarPopover, children: jsxRuntimeExports.jsx(Calendar, { required: true, ...calendarProps, onDropdownOpen: onDropdownOpen, mode: "single", selected: value, defaultMonth: value, onSelect: handleSelect }) })] }));
 }
 
 function RangePicker({ side = "top", dateFormat = "DD/MM/YYYY", textFieldProps, calendarProps, onSelect = () => { }, value = {