@antscorp/antsomi-ui 1.3.5-beta.62 → 1.3.5-beta.621

package/es/components/molecules/ApplyPopupContent/styled.js

@@ -0,0 +1,40 @@
+// Libraries
+import styled from 'styled-components';
+// Components
+import { Flex } from '@antscorp/antsomi-ui/es/components/atoms';
+// Constants
+import { globalToken } from '@antscorp/antsomi-ui/es/constants';
+export const ContentWrapper = styled.div `
+  .content {
+    &__body {
+      padding: 15px;
+    }
+
+    &__title {
+      font-size: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.fontSizeXL}px;
+      font-weight: 500;
+    }
+
+    &__footer {
+      display: flex;
+      padding: 15px;
+      gap: 10px;
+      border-top: 1px solid ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};
+    }
+  }
+`;
+export const CloseButton = styled(Flex) `
+  width: 24px;
+  height: 24px;
+  color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw8};
+  transition: all 0.3s;
+  cursor: pointer;
+
+  &:hover {
+    color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw10};
+  }
+
+  i {
+    font-size: 12px;
+  }
+`;

package/es/components/molecules/CalendarSelection/CalendarSelection.js

@@ -1,6 +1,6 @@
 /* eslint-disable react/jsx-no-constructed-context-values */
 import React, { useLayoutEffect, useReducer, useRef } from 'react';
-import { Divider } from 'antd';
+import { Divider, ConfigProvider as AntdConfigProvider } from 'antd';
 import { ActionContext, StateContext } from './context';
 import { reducer, INITIAL_STATE } from './reducer';
 import { StyledPopover, StyledPopoverBody, StyledPopoverContainer } from './styled';
@@ -13,9 +13,9 @@ export const CalendarSelection = props => {
     const { value, rangeLimit = RANGE_LIMIT, timezone = LOCAL_TIMEZONE, timeDisplayProps, popoverProps, rangePickerProps, onChange, } = props;
     const [state, dispatch] = useReducer(reducer, INITIAL_STATE);
     useLayoutEffect(() => {
-        if (!value)
+        if (!value || initialed.current)
             return;
-        dispatch(initState(value, !initialed.current));
+        dispatch(initState(value, initialed.current));
         initialed.current = true;
     }, [value]);
     useLayoutEffect(() => {
@@ -34,12 +34,21 @@ export const CalendarSelection = props => {
         React.createElement(Divider, { style: { margin: 0 } }),
         React.createElement(Footer, null)));
     // console.log(state.value.current.rangeValue);
-    return (React.createElement(StateContext.Provider, { value: Object.assign(Object.assign({}, state), { rangeLimit,
-            timezone }) },
-        React.createElement(ActionContext.Provider, { value: { dispatch } },
-            React.createElement(StyledPopover, Object.assign({}, popoverProps, { open: state.open, arrow: false, trigger: ['click'], content: popoverContent, destroyTooltipOnHide: true, overlayInnerStyle: { padding: 0 }, onOpenChange: isOpen => {
-                    if (!isOpen)
-                        dispatch({ type: 'toggle_popover' });
-                } }),
-                React.createElement(TimeRangeDisplay, Object.assign({}, timeDisplayProps))))));
+    return (React.createElement(AntdConfigProvider, { theme: {
+            components: {
+                Popover: {
+                    borderRadiusLG: 0,
+                    borderRadius: 0,
+                    borderRadiusOuter: 0,
+                },
+            },
+        } },
+        React.createElement(StateContext.Provider, { value: Object.assign(Object.assign({}, state), { rangeLimit,
+                timezone }) },
+            React.createElement(ActionContext.Provider, { value: { dispatch } },
+                React.createElement(StyledPopover, Object.assign({}, popoverProps, { open: state.open, arrow: false, trigger: ['click'], content: popoverContent, destroyTooltipOnHide: true, overlayInnerStyle: { padding: 0 }, onOpenChange: isOpen => {
+                        if (!isOpen)
+                            dispatch({ type: 'toggle_popover' });
+                    } }),
+                    React.createElement(TimeRangeDisplay, Object.assign({}, timeDisplayProps)))))));
 };

package/es/components/molecules/CalendarSelection/actions.d.ts

@@ -9,7 +9,7 @@ export declare const ACTION_TYPES: {
     readonly apply: "apply";
     readonly resetValue: "reset_value";
 };
-export declare const changeRangeType: (rangeType: string, callback?: ((rangeInfo: RangeInfo) => void) | undefined) => {
+export declare const changeRangeType: (rangeType: string, callback?: (rangeInfo: RangeInfo) => void) => {
     type: "change_range_type";
     payload: {
         rangeType: string;

package/es/components/molecules/CalendarSelection/components/CustomPicker/CustomPicker.js

@@ -65,44 +65,45 @@ export const CustomPicker = props => {
         return React.createElement(StyledCellDate, { rangeColor: cellBgColor }, originNode);
     }, [rangeValue]);
     return (React.createElement(StyledCustomPickerRoot, null,
-        React.createElement("div", { className: "range-inputs" }, rangeValue.map((range, rangeIdx) => (React.createElement(ConfigProvider, { key: rangeIdx, theme: {
-                components: {
-                    DatePicker: Object.assign({ cellHeight: 20 }, (range.color && {
-                        hoverBorderColor: range.color,
-                        colorBorder: range.color,
-                        colorPrimary: range.color,
-                        colorPrimaryActive: range.color,
-                        cellActiveWithRangeBg: new TinyColor(range.color).lighten(40).toHexString(),
-                    })),
-                },
-            } },
-            React.createElement("div", { className: "range-input" },
-                React.createElement("div", { className: "range-input-label" }, generateRangeInputLabel(rangeIdx, range.label)),
-                React.createElement(RangePicker, Object.assign({}, rest, { open: true, value: [dayjs(range.start), dayjs(range.end)], onClick: () => setActiveRangeIdx(rangeIdx), getPopupContainer: () => popupContainer.current || document.body, panelRender: originalPanel => {
-                        if (activeRangeIdx !== rangeIdx)
-                            return null;
-                        return originalPanel;
-                    }, cellRender: (current, info) => {
-                        if (typeof current === 'number' || info.type !== 'date') {
-                            return info.originNode;
-                        }
-                        return renderCellDate(current, info.originNode);
-                    }, onCalendarChange: value => {
-                        var _a, _b;
-                        let start = '';
-                        let end = '';
-                        const valueFirst = dayjs((_a = value === null || value === void 0 ? void 0 : value.at(0)) === null || _a === void 0 ? void 0 : _a.toDate());
-                        const valueSecond = dayjs((_b = value === null || value === void 0 ? void 0 : value.at(1)) === null || _b === void 0 ? void 0 : _b.toDate());
-                        if (valueFirst.isBefore(valueSecond)) {
-                            start = valueFirst.toISOString();
-                            end = valueSecond.toISOString();
-                        }
-                        else {
-                            start = valueSecond.toISOString();
-                            end = valueFirst.toISOString();
-                        }
-                        handleCalendarChange(start, end);
-                    } }))))))),
-        React.createElement(AutoUpdateTo, null),
+        React.createElement("div", { className: "section-input" },
+            React.createElement("div", { className: "range-inputs" }, rangeValue.map((range, rangeIdx) => (React.createElement(ConfigProvider, { key: rangeIdx, theme: {
+                    components: {
+                        DatePicker: Object.assign({ cellHeight: 20 }, (range.color && {
+                            hoverBorderColor: range.color,
+                            colorBorder: range.color,
+                            colorPrimary: range.color,
+                            colorPrimaryActive: range.color,
+                            cellActiveWithRangeBg: new TinyColor(range.color).lighten(40).toHexString(),
+                        })),
+                    },
+                } },
+                React.createElement("div", { className: "range-input" },
+                    React.createElement("div", { className: "range-input-label" }, generateRangeInputLabel(rangeIdx, range.label)),
+                    React.createElement(RangePicker, Object.assign({}, rest, { open: true, value: [dayjs(range.start), dayjs(range.end)], onClick: () => setActiveRangeIdx(rangeIdx), getPopupContainer: () => popupContainer.current || document.body, panelRender: originalPanel => {
+                            if (activeRangeIdx !== rangeIdx)
+                                return null;
+                            return originalPanel;
+                        }, cellRender: (current, info) => {
+                            if (typeof current === 'number' || info.type !== 'date') {
+                                return info.originNode;
+                            }
+                            return renderCellDate(current, info.originNode);
+                        }, onCalendarChange: value => {
+                            var _a, _b;
+                            let start = '';
+                            let end = '';
+                            const valueFirst = dayjs((_a = value === null || value === void 0 ? void 0 : value.at(0)) === null || _a === void 0 ? void 0 : _a.toDate());
+                            const valueSecond = dayjs((_b = value === null || value === void 0 ? void 0 : value.at(1)) === null || _b === void 0 ? void 0 : _b.toDate());
+                            if (valueFirst.isBefore(valueSecond)) {
+                                start = valueFirst.toISOString();
+                                end = valueSecond.toISOString();
+                            }
+                            else {
+                                start = valueSecond.toISOString();
+                                end = valueFirst.toISOString();
+                            }
+                            handleCalendarChange(start, end);
+                        } }))))))),
+            React.createElement(AutoUpdateTo, null)),
         React.createElement(CalendarContainerStyled, { className: "calendar-container", ref: popupContainer })));
 };

package/es/components/molecules/CalendarSelection/components/CustomPicker/styled.js

@@ -20,17 +20,23 @@ export const StyledCustomPickerRoot = styled.div `
   display: flex;
   flex-direction: column;
   gap: 8px;
-  padding: 8px 12px;
 
-  .range-inputs {
+  .section-input {
+    padding: 8px 12px;
     display: flex;
     flex-direction: column;
-    gap: 8px;
+    gap: 4px;
 
-    .range-input {
+    .range-inputs {
       display: flex;
       flex-direction: column;
-      gap: 4px;
+      gap: 8px;
+
+      .range-input {
+        display: flex;
+        flex-direction: column;
+        gap: 4px;
+      }
     }
   }
 
@@ -68,83 +74,8 @@ export const CalendarContainerStyled = styled.div `
 
     /* Content */
     .antsomi-picker-content {
-      /* Rectangle */
-      & td,
-      & th,
-      & .antsomi-picker-cell-inner,
-      & td::before {
-        /* width: var(--cellWidth);
-        height: var(--cellHeight); */
-      }
-
-      /* Date node */
-      .antsomi-picker-cell-inner {
-      }
-
-      /* Today node */
-      .antsomi-picker-cell-today {
-        .antsomi-picker-cell-inner {
-          &::before {
-            border-radius: 18px;
-            border: 0.0001rem solid var(--colorToDay);
-          }
-        }
-      }
-
-      /* Selected node */
-      .antsomi-picker-cell-in-view {
-        &.antsomi-picker-cell-selected,
-        &.antsomi-picker-cell-range-start,
-        &.antsomi-picker-cell-range-end {
-          .antsomi-picker-cell-inner {
-            background: var(--colorSelected) !important;
-            border-radius: 18px !important;
-          }
-        }
-      }
-
-      /* In Range */
-      .antsomi-picker-cell-in-range.antsomi-picker-cell-in-view {
-        &::before {
-          background: var(--colorInRange) !important;
-        }
-        .antsomi-picker-cell-inner {
-          /* background: var(--colorInRange) !important; */
-          &::after {
-            content: none !important;
-            background: var(--colorInRange) !important;
-          }
-        }
-      }
-
-      /* In Range Start End */
-      .antsomi-picker-cell-in-view.antsomi-picker-cell-range-start:not(
-          .antsomi-picker-cell-range-start-single
-        ) {
-        &::before {
-          background: var(--colorInRange) !important;
-        }
-      }
-      .antsomi-picker-cell-in-view.antsomi-picker-cell-range-end:not(
-          .antsomi-picker-cell-range-end-single
-        ) {
-        &::before {
-          background: var(--colorInRange) !important;
-        }
-      }
-
-      /* Hover */
-      .antsomi-picker-cell-in-view {
-        &.antsomi-picker-cell-range-hover,
-        &.antsomi-picker-cell-range-hover-start,
-        &.antsomi-picker-cell-range-hover-end {
-          &:not(.antsomi-picker-cell-in-range)::after {
-            content: none !important;
-            border: none;
-          }
-        }
-      }
     }
+
     .antsomi-picker-range-arrow {
       display: none !important;
     }

package/es/components/molecules/CalendarSelection/components/RangePicker/RangePicker.js

@@ -1,4 +1,4 @@
 import React from 'react';
 import { StyledRangePicker } from './styled';
 const DATE_FORMAT = 'DD/MM/YYYY';
-export const RangePicker = props => (React.createElement(StyledRangePicker, Object.assign({}, props, { allowEmpty: [true, true], allowClear: false, autoFocus: false, size: "large", suffixIcon: false, format: DATE_FORMAT })));
+export const RangePicker = props => (React.createElement(StyledRangePicker, Object.assign({}, props, { allowEmpty: [true, true], allowClear: false, autoFocus: false, bordered: false, size: "middle", suffixIcon: false, format: DATE_FORMAT })));

package/es/components/molecules/CalendarSelection/components/RangePicker/styled.js

@@ -1,13 +1,26 @@
 import { DatePicker } from '@antscorp/antsomi-ui/es/components/molecules';
+import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 import styled from 'styled-components';
 const { RangePicker } = DatePicker;
 export const StyledRangePicker = styled(RangePicker) `
-  font-size: 12px;
-  padding-right: 8px;
+  &.antsomi-picker {
+    font-size: 12px;
+    padding: 0;
 
-  .ant-picker-input {
-    input {
-      width: 80px;
+    .antsomi-picker-active-bar {
+      display: none;
+    }
+
+    .antsomi-picker-input {
+      padding: 4px 10px;
+
+      &.antsomi-picker-input-active {
+        border-bottom: 2px solid ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.colorPrimary};
+      }
+
+      input {
+        font-size: inherit;
+      }
     }
   }
 `;

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/NumOfDaysRanges/index.d.ts

@@ -1 +1 @@
-export * from './NumOfDaysRanges';
+export { NumOfDaysRanges } from './NumOfDaysRanges';

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/NumOfDaysRanges/index.js

@@ -1 +1 @@
-export * from './NumOfDaysRanges';
+export { NumOfDaysRanges } from './NumOfDaysRanges';

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/Option/Option.js

@@ -1,12 +1,39 @@
 import React, { useRef } from 'react';
+import { List, Menu } from 'antd';
 import Icon from '@antscorp/icons';
+import styled from 'styled-components';
 import { Popover } from '@antscorp/antsomi-ui/es/components/atoms';
 import classNames from 'classnames';
 import { useCalendarSelectionContext } from '../../../../hooks';
 import { changeRangeType } from '../../../../actions';
 import { rangeInfoToStringType } from '../../../../utils';
-import { StyledMenu } from './styled';
-import { List } from 'antd';
+const StyledMenu = styled(Menu) `
+  &.antsomi-menu-root {
+    .antsomi-menu-item {
+      position: relative;
+      color: black;
+      height: 32px;
+      line-height: 32px;
+      border-radius: 0;
+      width: 100%;
+      margin: 0;
+
+      &.antsomi-menu-item-selected {
+        font-weight: bold;
+
+        &:after {
+          content: '';
+          position: absolute;
+          left: 0;
+          top: 0;
+          width: 4px;
+          height: 100%;
+          background-color: #005fb8;
+        }
+      }
+    }
+  }
+`;
 export const Option = props => {
     const itemRef = useRef(null);
     const { label = '', options = [], type } = props;

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Option';
-export * from './NumOfDaysRanges';
+export { Option } from './Option';
+export { NumOfDaysRanges } from './NumOfDaysRanges';

package/es/components/molecules/CalendarSelection/components/RangeSelectOptions/components/index.js

@@ -1,2 +1,2 @@
-export * from './Option';
-export * from './NumOfDaysRanges';
+export { Option } from './Option';
+export { NumOfDaysRanges } from './NumOfDaysRanges';

package/es/components/molecules/CalendarSelection/components/TimeRangeDisplay/TimeRangeDisplay.js

@@ -10,22 +10,16 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import cls from 'clsx';
-import React, { forwardRef, useEffect, useState } from 'react';
+import React, { forwardRef } from 'react';
 import { Typography } from '@antscorp/antsomi-ui/es/components/atoms';
 import { ACTION_TYPES } from '../../actions';
 import { useCalendarSelectionContext } from '../../hooks';
 import { getRangeTypeSelectedTitle, getRangeValueSelctedTitle } from '../../utils';
 import { StyledBtnDisplayWrapper } from './styled';
-import Icon from '@antscorp/icons';
 const { Text } = Typography;
 export const TimeRangeDisplay = forwardRef((props, ref) => {
     const { showType = true, formatStart, formatEnd, operator } = props, rest = __rest(props, ["showType", "formatStart", "formatEnd", "operator"]);
     const { state, action } = useCalendarSelectionContext();
-    // console.log({ state, action });
-    const [collapse, setCollapse] = useState(false);
-    useEffect(() => {
-        setCollapse(false);
-    }, []);
     const { rangeInfo, rangeValue } = state.value.original;
     const handleOpenPopover = () => {
         action.dispatch({ type: ACTION_TYPES.togglePopover });
@@ -36,14 +30,14 @@ export const TimeRangeDisplay = forwardRef((props, ref) => {
         formatEnd,
         operator,
     });
-    // console.log({ rangeSelectedTitle, rangeValueTitles });
+    const renderDateTitle = (title) => (React.createElement(Text, { className: "range-date-title", ellipsis: {
+            tooltip: title,
+        } }, title));
     return (React.createElement(StyledBtnDisplayWrapper, Object.assign({ ref: ref }, rest, { onClick: handleOpenPopover, role: "button" }),
         showType && (React.createElement(Text, { className: "range-type", ellipsis: { tooltip: rangeSelectedTitle } }, rangeSelectedTitle)),
-        React.createElement("div", { className: cls('range-date', { collapse: state.open }) },
-            rangeValue.length > 0 && (React.createElement(Text, { className: "range-date-title", ellipsis: { tooltip: rangeValueTitles[0] } },
-                rangeValueTitles[0],
-                React.createElement(Icon, { className: "collapse-btn", type: "icon-ants-angle-down", style: { fontSize: 9 } }))),
+        React.createElement("div", { className: cls('range-date') },
+            rangeValue.length > 0 && renderDateTitle(rangeValueTitles[0]),
             rangeValue.length > 1 && (React.createElement("div", { className: cls('collapse-wrapper') }, rangeValueTitles.slice(1).map(title => (React.createElement(React.Fragment, { key: title },
                 React.createElement("div", { className: "compare-title" }, "Compare"),
-                React.createElement(Text, { className: "range-date-title", ellipsis: { tooltip: title } }, title)))))))));
+                renderDateTitle(title)))))))));
 });

package/es/components/molecules/CalendarSelection/components/TimeRangeDisplay/styled.js

@@ -1,70 +1,29 @@
+import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 import styled from 'styled-components';
 export const StyledBtnDisplayWrapper = styled.div `
   display: flex;
   overflow: hidden;
   text-overflow: ellipsis;
-  background-color: transparent;
   cursor: pointer;
   width: fit-content;
+  flex-direction: column;
+  gap: 4px;
+  line-height: 1.4;
 
   .range-type {
-    /* font-size: 0.75rem;
-    width: fit-content;
-    padding: 2px 8px; */
-
     display: block;
-    font-size: 0.813rem;
-    margin-right: 0.5rem;
-    color: rgb(127, 127, 127);
+    font-size: 11px;
+    padding: 3px 5px;
+    border-radius: 3px;
+    width: fit-content;
+    background-color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw2};
+    line-height: inherit;
   }
 
-  .range-date {
-    border-top: none;
-    border-right: none;
-    border-left: none;
-    border-image: initial;
-    background: transparent;
-    border-bottom: 1px solid rgb(184, 207, 230);
-    text-align: left;
-    display: flex;
-    -webkit-box-pack: justify;
-    justify-content: space-between;
-    -webkit-box-align: center;
-    align-items: center;
-    font-size: 0.75rem;
-    padding: 2px 8px;
-    max-width: unset;
-
-    .range-date-title {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-    }
-
-    .collapse-wrapper {
-      display: flex;
-      flex-direction: column;
-      gap: 2px;
-      overflow: hidden;
-
-      .compare-title {
-        font-size: 11px;
-        color: #878d93;
-      }
-    }
-
-    .collapse-btn {
-      padding: 4px;
-    }
-
-    &.collapse {
-      .collapse-wrapper {
-        height: 0;
-      }
-
-      .collapse-btn {
-        transform: rotate(180deg);
-      }
-    }
+  .range-date-title {
+    padding: 3px 5px;
+    border-radius: 3px;
+    background-color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.blue1_1};
+    line-height: inherit;
   }
 `;

package/es/components/molecules/CalendarSelection/index.d.ts

@@ -21,5 +21,36 @@ export declare const CalendarSelectionConstants: {
         readonly days_up_to_today: "days_up_to_today";
         readonly days_up_to_yesterday: "days_up_to_yesterday";
     };
+    AUTO_UPDATE_TO_KEY: {
+        readonly today: "today";
+        readonly yesterday: "yesterday";
+        readonly fixed: "fixed";
+    };
 };
 export type { TriggerOutInfo, CalendarSelectionValue } from './types';
+export declare const CalendarSelectionUtils: {
+    getDefaultDate: () => {
+        toDay: string;
+        yesterday: string;
+        startWeekSS: string;
+        startWeekMS: string;
+        last7Days: string;
+        startLastWeekSS: string;
+        startLastWeekMS: string;
+        endLastWeekSS: string;
+        endLastWeekMS: string;
+        last14Days: string;
+        startOfThisMonth: string;
+        endOfThisMonth: string;
+        last30Days: string;
+        lastMonthFirstDate: string;
+        lastMonthLastDate: string;
+        thisQuaterFirstDate: string;
+        thisQuaterLastDate: string;
+        lastQuaterFirstDate: string;
+        lastQuaterLastDate: string;
+        maxSub: number;
+        todayUptoCount: (val: number) => string;
+        yesterdayUptoCount: (val: number) => string;
+    };
+};

package/es/components/molecules/CalendarSelection/index.js

@@ -1,6 +1,11 @@
-import { TRIGGER_OUT_MODE, SELECTION_KEY } from './constants';
+import { TRIGGER_OUT_MODE, SELECTION_KEY, AUTO_UPDATE_TO_KEY } from './constants';
+import { getDefaultDate } from './utils';
 export { CalendarSelection } from './CalendarSelection';
 export const CalendarSelectionConstants = {
     TRIGGER_OUT_MODE,
     SELECTION_KEY,
+    AUTO_UPDATE_TO_KEY,
+};
+export const CalendarSelectionUtils = {
+    getDefaultDate,
 };

package/es/components/molecules/CalendarSelection/styled.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare const StyledPopover: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").PopoverProps & import("react").RefAttributes<unknown>> & {
+export declare const StyledPopover: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/popover").PopoverProps & import("react").RefAttributes<unknown>> & {
     _InternalPanelDoNotUseOrYouWillBeFired: import("react").FC<import("antd/es/popover/PurePanel").PurePanelProps>;
 }, any, {}, never>;
 export declare const StyledPopoverContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

package/es/components/molecules/CalendarSelection/styled.js

@@ -1,5 +1,7 @@
-import { Popover } from '@antscorp/antsomi-ui/es/components/atoms';
+// Libraries
 import styled from 'styled-components';
+// Components
+import { Popover } from '@antscorp/antsomi-ui/es/components/atoms/Popover';
 export const StyledPopover = styled(Popover) `
   font-size: 12px;
 `;

package/es/components/molecules/CalendarSelection/utils.d.ts

@@ -29,7 +29,7 @@ export declare const getDefaultDate: () => {
 export declare const getRangeValue: ({ rangeInfo, currentRangeValue, limitNumOfDays, }: {
     rangeInfo: RangeInfo;
     currentRangeValue: RangeValue[];
-    limitNumOfDays?: number | undefined;
+    limitNumOfDays?: number;
 }) => RangeValue[];
 export declare const getRangeValueSelctedTitle: (rangeValue: RangeValue[], options?: {
     formatStart?: string;
@@ -44,7 +44,7 @@ export declare const combineCurrentValue: (state: ReducerState) => {
 };
 export declare const genTriggerOut: ({ mode, id, }: {
     mode: ReducerState['triggerOut']['mode'];
-    id?: number | undefined;
+    id?: number;
 }) => {
     mode: "auto" | "manual";
     id: number;

package/es/components/molecules/CalendarSelection/utils.js

@@ -7,7 +7,7 @@ import quarterOfYear from 'dayjs/plugin/quarterOfYear';
 import isSameOrBefore from 'dayjs/plugin/isSameOrBefore';
 import { AUTO_UPDATE_TO_KEY, DEFAULT_NUM_UP_TO, MAP_TITLE, RANGE_LIMIT, SELECTION_KEY, } from './constants';
 import { last } from 'lodash';
-import { asssertCannotReach } from '@antscorp/antsomi-ui/es/utils/common';
+import { asssertCannotReach } from '@antscorp/antsomi-ui/es/utils';
 dayjs.extend(utc);
 dayjs.extend(timezone);
 dayjs.extend(isoWeek);

package/es/components/molecules/CaptureScreen/CaptureScreen.js

@@ -696,7 +696,7 @@ const CaptureScreen = (props) => {
         'icon-ants-mute': React.createElement(MuteIcon, { style: style }),
         'icon-ants-pause': React.createElement(PauseIcon, { style: style }),
         'icon-ants-stop-record': React.createElement(StopRecordIcon, { style: style }),
-    }[name]);
+    })[name];
     const renderDrawActionList = () => DRAW_ACTION_LIST.map(drawItem => {
         var _a, _b, _c, _d;
         if ((drawItem === null || drawItem === void 0 ? void 0 : drawItem.type) === 'divider') {