@antscorp/antsomi-ui 1.3.7-beta.68 → 1.3.7-beta.69

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

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import cls from 'clsx';
 import React, { forwardRef } from 'react';
 import { Typography } from '@antscorp/antsomi-ui/es/components/atoms';
-import { ACTION_TYPES } from '../../actions';
+import { ACTION_TYPES } from '../../constants';
 import { useCalendarSelectionContext } from '../../hooks';
 import { getRangeTypeSelectedTitle, getRangeValueSelctedTitle } from '../../utils';
 import { StyledBtnDisplayWrapper } from './styled';

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

@@ -1,4 +1,3 @@
-import { DaysUpToToday, DaysUpToYesterday } from './types';
 export declare const TRIGGER_OUT_MODE: {
     readonly auto: "auto";
     readonly manual: "manual";
@@ -65,27 +64,6 @@ export declare const MAP_TITLE: {
     monToToDay: string;
     monToSun: string;
 };
-export declare const MAP_TITLE_DISPLAY: {
-    days_up_to_yesterday: (rangeInfo: DaysUpToYesterday) => string;
-    days_up_to_today: (rangeInfo: DaysUpToToday) => string;
-    today: string;
-    yesterday: string;
-    last_7_days: string;
-    last_14_days: string;
-    this_month: string;
-    last_30_days: string;
-    last_month: string;
-    all_time: string;
-    last_week: string;
-    this_week: string;
-    this_quarter: string;
-    last_quarter: string;
-    custom: string;
-    sundayToToDay: string;
-    sundayToSat: string;
-    monToToDay: string;
-    monToSun: string;
-};
 export declare const RANGE_SELECTION_OPTIONS: Record<string, {
     key: string;
     label: string;
@@ -95,3 +73,13 @@ export declare const RANGE_SELECTION_OPTIONS: Record<string, {
         label: string;
     }[];
 }>;
+export declare const ACTION_TYPES: {
+    readonly initState: "init_state";
+    readonly changeRangeType: "change_range_type";
+    readonly updateRangeInfo: "update_range_info";
+    readonly updateRangeValue: "update_range_value";
+    readonly changeAutoUpdateTo: "change_auto_update_to";
+    readonly togglePopover: "toggle_popover";
+    readonly apply: "apply";
+    readonly resetValue: "reset_value";
+};

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

@@ -83,11 +83,6 @@ export const MAP_TITLE = {
     monToToDay: 'Mon-Today',
     monToSun: 'Mon-Sun',
 };
-export const MAP_TITLE_DISPLAY = {
-    ...MAP_TITLE,
-    [SELECTION_KEY.days_up_to_yesterday]: (rangeInfo) => `${rangeInfo.numOfDays} day(s) up to yesterday')`,
-    [SELECTION_KEY.days_up_to_today]: (rangeInfo) => `${rangeInfo.numOfDays} day(s) up today`,
-};
 export const RANGE_SELECTION_OPTIONS = {
     [SELECTION_KEY.today]: {
         key: SELECTION_KEY.today,
@@ -185,3 +180,13 @@ export const RANGE_SELECTION_OPTIONS = {
         isFixed: true,
     },
 };
+export const ACTION_TYPES = {
+    initState: 'init_state',
+    changeRangeType: 'change_range_type',
+    updateRangeInfo: 'update_range_info',
+    updateRangeValue: 'update_range_value',
+    changeAutoUpdateTo: 'change_auto_update_to',
+    togglePopover: 'toggle_popover',
+    apply: 'apply',
+    resetValue: 'reset_value',
+};

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ReducerState, ActionType } from './types';
 export declare const StateContext: import("react").Context<ReducerState>;
 export declare const ActionContext: import("react").Context<ActionType>;

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

@@ -55,7 +55,7 @@ export declare const CalendarSelectionUtils: {
     };
     getRangeValue: ({ rangeInfo, currentRangeValue, limitNumOfDays, }: {
         rangeInfo: import("./types").RangeInfo;
-        currentRangeValue?: import("./types").RangeValue[];
-        limitNumOfDays?: number;
+        currentRangeValue?: import("./types").RangeValue[] | undefined;
+        limitNumOfDays?: number | undefined;
     }) => import("./types").RangeValue[];
 };

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

@@ -1,8 +1,7 @@
 import { produce } from 'immer';
-import { AUTO_UPDATE_TO_KEY, LOCAL_TIMEZONE, RANGE_LIMIT, SELECTION_KEY, TRIGGER_OUT_MODE, } from './constants';
+import { AUTO_UPDATE_TO_KEY, LOCAL_TIMEZONE, RANGE_LIMIT, SELECTION_KEY, TRIGGER_OUT_MODE, ACTION_TYPES, } from './constants';
 import { generateRangeInfo, getRangeValue, genTriggerOut } from './utils';
 import dayjs from 'dayjs';
-import { ACTION_TYPES } from './actions';
 const DEFAULT_VALUE = {
     rangeInfo: { type: SELECTION_KEY.today },
     rangeValue: [

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

@@ -1,4 +1,5 @@
-export declare const StyledPopover: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").PopoverProps & import("react").RefAttributes<unknown>> & {
+/// <reference types="react" />
+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/types.d.ts

@@ -1,9 +1,14 @@
 import { DatePickerProps, PopoverProps } from 'antd';
 import { Dispatch } from 'react';
 import { ValueOf } from 'type-fest';
-import { updateRangeInfo, changeRangeType, updateRangeValue, changeAutoUpdateTo, initState, togglePopover, apply, resetValue } from './actions';
-import { SELECTION_KEY, AUTO_UPDATE_TO_KEY } from './constants';
-import { TimeRangeDisplayProps } from './components/TimeRangeDisplay/TimeRangeDisplay';
+import { SELECTION_KEY, AUTO_UPDATE_TO_KEY, ACTION_TYPES } from './constants';
+export type TimeRangeDisplayProps = {
+    showType?: boolean;
+    formatStart?: string;
+    formatEnd?: string;
+    operator?: string;
+    render?: (value: CalendarSelectionValue, rangeSelectedTitle: string, rangeValueTitles: string[], handleOpenPopover: () => void) => React.ReactNode;
+};
 export type CalendarSelectionProps = Partial<{
     popoverProps: PopoverProps;
     rangeLimit: number;
@@ -32,7 +37,41 @@ export type ReducerState = {
     timezone: string;
     open: boolean;
 };
-export type Action = ReturnType<typeof changeRangeType> | ReturnType<typeof updateRangeInfo> | ReturnType<typeof updateRangeValue> | ReturnType<typeof changeAutoUpdateTo> | ReturnType<typeof initState> | ReturnType<typeof togglePopover> | ReturnType<typeof apply> | ReturnType<typeof resetValue>;
+export type Action = {
+    type: typeof ACTION_TYPES.initState;
+    payload: {
+        initData: CalendarSelectionValue;
+        needTriggerOut: boolean;
+    };
+} | {
+    type: typeof ACTION_TYPES.changeRangeType;
+    payload: {
+        rangeType: string;
+        callback?: (rangeInfo: RangeInfo) => void;
+    };
+} | {
+    type: typeof ACTION_TYPES.updateRangeInfo;
+    payload: {
+        updateValue: Partial<RangeInfo>;
+    };
+} | {
+    type: typeof ACTION_TYPES.updateRangeValue;
+    payload: {
+        rangeValue: RangeValue[];
+        options?: {
+            isManual: boolean;
+        };
+    };
+} | {
+    type: typeof ACTION_TYPES.changeAutoUpdateTo;
+    payload: Custom['autoUpdateTo'];
+} | {
+    type: typeof ACTION_TYPES.togglePopover;
+} | {
+    type: typeof ACTION_TYPES.apply;
+} | {
+    type: typeof ACTION_TYPES.resetValue;
+};
 type ToDay = {
     type: typeof SELECTION_KEY.today;
 };

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

@@ -1,4 +1,4 @@
-import { AutoUpdateTo, RangeInfo, RangeValue, ReducerState } from './types';
+import { AutoUpdateTo, DaysUpToToday, DaysUpToYesterday, RangeInfo, RangeValue, ReducerState } from './types';
 export declare const rangeInfoToStringType: (rangeInfo: RangeInfo) => string;
 export declare const serializeWeekStartsOn: (rangeType: string) => number | undefined;
 export declare const generateRangeInfo: (rangeType: string) => RangeInfo | null;
@@ -43,10 +43,31 @@ export declare const combineCurrentValue: (state: ReducerState) => {
     rangeValue: RangeValue[];
 };
 export declare const genTriggerOut: ({ mode, id, }: {
-    mode: ReducerState["triggerOut"]["mode"];
+    mode: ReducerState['triggerOut']['mode'];
     id?: number;
 }) => {
     mode: "auto" | "manual";
     id: number;
 };
 export declare const isAutoUpdateToOption: (value: unknown) => value is AutoUpdateTo;
+export declare const MAP_TITLE_DISPLAY: {
+    days_up_to_yesterday: (rangeInfo: DaysUpToYesterday) => string;
+    days_up_to_today: (rangeInfo: DaysUpToToday) => string;
+    today: string;
+    yesterday: string;
+    last_7_days: string;
+    last_14_days: string;
+    this_month: string;
+    last_30_days: string;
+    last_month: string;
+    all_time: string;
+    last_week: string;
+    this_week: string;
+    this_quarter: string;
+    last_quarter: string;
+    custom: string;
+    sundayToToDay: string;
+    sundayToSat: string;
+    monToToDay: string;
+    monToSun: string;
+};

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

@@ -284,3 +284,8 @@ export const isAutoUpdateToOption = (value) => {
     }
     return false;
 };
+export const MAP_TITLE_DISPLAY = {
+    ...MAP_TITLE,
+    [SELECTION_KEY.days_up_to_yesterday]: (rangeInfo) => `${rangeInfo.numOfDays} day(s) up to yesterday')`,
+    [SELECTION_KEY.days_up_to_today]: (rangeInfo) => `${rangeInfo.numOfDays} day(s) up today`,
+};

package/es/components/molecules/CaptureScreen/components/Cursor/styled.d.ts

@@ -1,7 +1,7 @@
 export declare const PlusCursor: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const TooltipDrag: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const DottedCursor: import("styled-components").StyledComponent<"div", any, {
-    bgColor?: string;
-    isPointerBox?: boolean;
+    bgColor?: string | undefined;
+    isPointerBox?: boolean | undefined;
     offset: number;
 }, never>;

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

@@ -13,9 +13,7 @@ export const PlusCursor = styled.div `
   /* border-radius: 50%; */
   background: linear-gradient(#000 0 0), linear-gradient(#000 0 0);
   background-position: center;
-  background-size:
-    90% 2px,
-    2px 90%; /*thickness = 2px, length = 50% (25px)*/
+  background-size: 90% 2px, 2px 90%; /*thickness = 2px, length = 50% (25px)*/
   background-repeat: no-repeat;
   box-sizing: border-box;
   cursor: none;

package/es/components/molecules/CaptureScreen/constants.d.ts

@@ -1,6 +1,4 @@
 import { CSSProperties } from 'react';
-import { BoxDimensionProps } from './components/CommentBox/types';
-import { DrawItemProps } from './types';
 export declare const OFFSET_CENTER = 20;
 export declare const SIZE_ADJUST = 1;
 export declare enum IGNORE_DRAW_ID_LIST {
@@ -9,7 +7,10 @@ export declare enum IGNORE_DRAW_ID_LIST {
     DRAW_ACTIONS = "antsomi-package-draw-action-options",
     CLASS_PREVENT_HOVER = "antsomi-package-ignore-hovering-draw"
 }
-export declare const COMMENT_BOX_DIMENSION_FIXED: BoxDimensionProps;
+export declare const COMMENT_BOX_DIMENSION_FIXED: {
+    readonly width: 330;
+    readonly height: 170;
+};
 export declare const styleDrawItem: {
     MEDIUM: number;
     SMALL: number;
@@ -38,4 +39,25 @@ export declare enum RECORD_KEYS {
     MUTED = "muted_recorder",
     TIMELINE = "timeline_recorder"
 }
-export declare const DRAW_ACTION_LIST: Array<DrawItemProps>;
+export declare const DRAW_ACTION_LIST: ({
+    key: DRAW_KEYS;
+    icon: string;
+    label: string;
+    isShowColorList: boolean;
+    colorList: string[];
+    type?: undefined;
+} | {
+    key: DRAW_KEYS;
+    icon: string;
+    type: string;
+    isShowColorList: boolean;
+    label?: undefined;
+    colorList?: undefined;
+} | {
+    key: DRAW_KEYS;
+    icon: string;
+    label: string;
+    isShowColorList: boolean;
+    colorList?: undefined;
+    type?: undefined;
+})[];

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

@@ -1,24 +1,25 @@
+/// <reference types="react" />
 export declare const ContainerCapture: import("styled-components").StyledComponent<"div", any, {
     isRecord: boolean;
-    imageURL?: string;
+    imageURL?: string | undefined;
 }, never>;
 export declare const BorderOverlay: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const FlexColumn: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const FlexCenter: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const WrapperIcon: import("styled-components").StyledComponent<"div", any, {
-    isRecord?: boolean;
+    isRecord?: boolean | undefined;
 }, never>;
 export declare const DrawerGroups: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const WrapperDraggable: import("styled-components").StyledComponent<"strong", any, {}, never>;
 export declare const DrawerGroupItem: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Divider: import("styled-components").StyledComponent<"div", any, {
-    isVertical?: boolean;
+    isVertical?: boolean | undefined;
 }, never>;
 export declare const PopupBySide: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const Heading: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const WrapperColor: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const BoxColor: import("styled-components").StyledComponent<"div", any, {
-    bgColor?: string;
+    bgColor?: string | undefined;
 }, never>;
 export declare const ImageIcon: import("styled-components").StyledComponent<"img", any, {}, never>;
 export declare const OutlineRemoveContainer: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -1,3 +1,3 @@
 export declare const ItemStyled: import("styled-components").StyledComponent<"div", any, {
-    $isActive?: boolean;
+    $isActive?: boolean | undefined;
 }, never>;

package/es/components/molecules/ChatBox/ChatBoxInsight/styled.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const ChatBoxWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ChatBoxHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ChatBoxBody: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -12,5 +13,5 @@ export declare const WrapperContentSuggest: import("styled-components").StyledCo
 export declare const WrapperHeader: import("styled-components").StyledComponent<"strong", any, {}, never>;
 export declare const Header: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {}, never>;
 export declare const WrapperBody: import("styled-components").StyledComponent<"div", any, {
-    types?: string;
+    types?: string | undefined;
 }, never>;

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

@@ -1,5 +1,5 @@
 export declare const ChatBoxWrapper: import("styled-components").StyledComponent<"div", any, {
-    withoutBox?: boolean;
+    withoutBox?: boolean | undefined;
 }, never>;
 export declare const ChatBoxHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ChatBoxBody: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -1,4 +1,4 @@
 export declare const CodeStructureWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const BlockAbsolute: import("styled-components").StyledComponent<"div", any, {
-    left?: number;
+    left?: number | undefined;
 }, never>;

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

@@ -1,10 +1,10 @@
 import { CharacterType, CodeStructureData, SeparatorType } from './type';
 export declare const generateRandomCodeWithConfig: ({ characterType, digitalNumbers, alphabetLetters, capitalization, characterOrder, }: {
-    characterType: CodeStructureData["characterType"];
-    digitalNumbers: CodeStructureData["digitalNumbers"];
-    alphabetLetters: CodeStructureData["alphabetLetters"];
-    capitalization: CodeStructureData["capitalization"];
-    characterOrder: CodeStructureData["characterOrder"];
+    characterType: CodeStructureData['characterType'];
+    digitalNumbers: CodeStructureData['digitalNumbers'];
+    alphabetLetters: CodeStructureData['alphabetLetters'];
+    capitalization: CodeStructureData['capitalization'];
+    characterOrder: CodeStructureData['characterOrder'];
 }) => string;
 export declare const generateCodeWithPrefixAndSuffix: (code: string, prefix: string, suffix: string, separator: SeparatorType) => string;
 export declare const calculateTotalCodes: ({ numberOfLetters, numberOfDigits, characterType, }: {

package/es/components/molecules/ColorPicker/ChromePicker/styled.js

@@ -5,8 +5,8 @@ import { ChromePicker } from 'react-color';
 export const StyledChromePicker = styled(ChromePicker) `
   padding: 0px !important;
   --tw-shadow: 0 0 #0000 !important;
-  box-shadow:
-    var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+    var(--tw-shadow) !important;
 
   div + div {
     padding-left: 0px !important;

package/es/components/molecules/ColorPicker/CustomPicker/index.js

@@ -42,7 +42,7 @@ const styleContainAlpha = {
 };
 const CustomPicker = props => {
     // Props
-    const { className, style, children, onChange, onChangeComplete, presetColors, ...restOf } = props;
+    const { className, style, children, isHideAlpha, onChange, onChangeComplete, presetColors, ...restOf } = props;
     // State
     const [isShowRgbaInput, setShowRgbaInput] = useState(true);
     const onChangeRgbaColor = (key, value) => {
@@ -68,7 +68,7 @@ const CustomPicker = props => {
                                     width: '100%',
                                     height: 12,
                                     marginTop: 10,
-                                }, children: _jsx(Alpha, { ...restOf, pointer: HuePointer, onChange: onChange }) })] })] }), _jsxs("div", { style: { ...wrapperStyling, paddingBottom: 15 }, children: [_jsx(Icon, { type: "icon-ants-unfold-more", style: { cursor: 'pointer', fontSize: '20px' }, onClick: () => setShowRgbaInput(!isShowRgbaInput) }), isShowRgbaInput ? (_jsxs("div", { style: rgbaInputStyling, children: [_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.r, controls: false, onChange: value => onChangeRgbaColor('r', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "R" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.g, controls: false, onChange: value => onChangeRgbaColor('g', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "G" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.b, controls: false, onChange: value => onChangeRgbaColor('b', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "B" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.a, controls: false, onChange: value => onChangeRgbaColor('a', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "A" })] })] })) : (_jsxs(EditableInputWrapper, { children: [_jsx(EditableInput, { value: props.color, onChange: onChange }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "HEX" })] })), _jsx(Button, { onClick: () => {
+                                }, children: _jsx(Alpha, { ...restOf, pointer: HuePointer, onChange: onChange }) })] })] }), _jsxs("div", { style: { ...wrapperStyling, paddingBottom: 15 }, children: [_jsx(Icon, { type: "icon-ants-unfold-more", style: { cursor: 'pointer', fontSize: '20px' }, onClick: () => setShowRgbaInput(!isShowRgbaInput) }), isShowRgbaInput ? (_jsxs("div", { style: rgbaInputStyling, children: [_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.r, controls: false, onChange: value => onChangeRgbaColor('r', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "R" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.g, controls: false, onChange: value => onChangeRgbaColor('g', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "G" })] }), _jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.b, controls: false, onChange: value => onChangeRgbaColor('b', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "B" })] }), !isHideAlpha && (_jsxs("div", { style: rgbaStyling, children: [_jsx(InputNumberWrapper, { value: props.rgb?.a, controls: false, onChange: value => onChangeRgbaColor('a', value) }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "A" })] }))] })) : (_jsxs(EditableInputWrapper, { children: [_jsx(EditableInput, { value: props.color, onChange: onChange }), _jsx(Text, { style: { position: 'absolute', bottom: '-20px' }, children: "HEX" })] })), _jsx(Button, { onClick: () => {
                             setShowRgbaInput(true);
                             onChange('rgba(0, 0, 0, 0)');
                         }, children: "Clear" })] }), presetColors ? (_jsxs("div", { children: [_jsx(Divider, {}), presetColors] })) : null] }));

package/es/components/molecules/ColorPicker/CustomPicker/styled.d.ts

@@ -2,7 +2,7 @@ export declare const CustomPickerWrapper: import("styled-components").StyledComp
 export declare const SaturationPointer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const HuePointer: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const PreviewColorPoint: import("styled-components").StyledComponent<"div", any, {
-    $color?: string;
+    $color?: string | undefined;
 }, never>;
 export declare const EditableInputWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const InputNumberWrapper: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;

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

@@ -56,8 +56,8 @@ export const EditableInputWrapper = styled.div `
     font-size: ${THEME.token?.fontSize}px;
     --tw-shadow: 0 1px 0 0 #e0e0e0;
     --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
-    box-shadow:
-      var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+      var(--tw-shadow);
 
     &::placeholder {
       color: ${THEME.token?.accent5};
@@ -77,8 +77,8 @@ export const EditableInputWrapper = styled.div `
       background-color: ${THEME.token?.blue0};
       --tw-shadow: 0 1px 0 0 #194e8d;
       --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
-      box-shadow:
-        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+        var(--tw-shadow);
     }
 
     &:disabled {
@@ -86,8 +86,8 @@ export const EditableInputWrapper = styled.div `
       color: ${THEME.token?.accent5};
       --tw-shadow: 0 1px 0 0 #e0e0e0;
       --tw-shadow-colored: 0 1px 0 0 var(--tw-shadow-color);
-      box-shadow:
-        var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+      box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+        var(--tw-shadow);
     }
   }
 `;

package/es/components/molecules/ColorPicker/SketchPicker/styled.js

@@ -4,7 +4,7 @@ import styled from 'styled-components';
 import { SketchPicker } from 'react-color';
 export const SketchPickerWrapper = styled(SketchPicker) `
   --tw-shadow: 0 0 #0000 !important;
-  box-shadow:
-    var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000),
+    var(--tw-shadow) !important;
   padding: 0px !important;
 `;

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

@@ -3,6 +3,7 @@ export interface ColorPickerProps {
     className?: string;
     color?: string;
     presetColors?: any[] | ReactNode;
+    isHideAlpha?: boolean;
     defaultColor?: string;
     icon?: React.ReactNode | string;
     onChange?: (color: string) => void;

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

@@ -22,7 +22,7 @@ const styleBtnColor = {
 };
 export const ColorPicker = props => {
     // Props
-    const { className = '', defaultColor = '#000000', presetColors, positionInput = 'left', icon, showInput = true, style = {}, inputProps = {}, } = props;
+    const { className = '', defaultColor = '#000000', presetColors, positionInput = 'left', icon, showInput = true, style = {}, isHideAlpha, inputProps = {}, } = props;
     const { onChange = () => { }, onAfterClosePicker = () => { } } = props;
     // States
     const [color, setColor] = useState(defaultColor);
@@ -76,7 +76,7 @@ export const ColorPicker = props => {
             onAfterClosePicker(color);
         }
     };
-    return (_jsxs(ColorPickerWrapper, { className: `antsomi-color-picker ${className || ''}`, style: style, children: [showInput && positionInput === 'left' && (_jsx(Input, { style: { textTransform: 'uppercase' }, value: color, onChange: onChangeColorInput, ...inputProps })), _jsx(Popover, { arrow: true, content: _jsx(CustomPicker, { color: color, presetColors: presetColors, onChange: onChangeColorPicker, onChangeComplete: onChangeComplete }), trigger: "click", open: popoverVisible, getPopupContainer: triggerNode => triggerNode, onOpenChange: onPopoverVisibleChange, afterOpenChange: handleAfterOpenChange, children: _jsx("div", { className: "antsomi-popover-button", style: styleBtnColor, children: iconNode || (_jsx("span", { style: {
+    return (_jsxs(ColorPickerWrapper, { className: `antsomi-color-picker ${className || ''}`, style: style, children: [showInput && positionInput === 'left' && (_jsx(Input, { style: { textTransform: 'uppercase' }, value: color, onChange: onChangeColorInput, ...inputProps })), _jsx(Popover, { arrow: true, content: _jsx(CustomPicker, { color: color, presetColors: presetColors, isHideAlpha: isHideAlpha, onChange: onChangeColorPicker, onChangeComplete: onChangeComplete }), trigger: "click", open: popoverVisible, getPopupContainer: triggerNode => triggerNode, onOpenChange: onPopoverVisibleChange, afterOpenChange: handleAfterOpenChange, children: _jsx("div", { className: "antsomi-popover-button", style: styleBtnColor, children: iconNode || (_jsx("span", { style: {
                             backgroundColor: color,
                             display: 'block',
                             width: 20,
@@ -88,6 +88,7 @@ ColorPicker.defaultProps = {
     className: '',
     color: '#000000',
     defaultColor: '#000000',
+    isHideAlpha: false,
     onChange: () => { },
     showInput: true,
     positionInput: 'left',

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export declare const StyledColorPicker: import("styled-components").StyledComponent<import("react").FC<import("@antscorp/antsomi-ui/es/components/molecules/ColorPicker").ColorPickerProps>, any, {}, never>;
 export declare const PresetColor: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const ButtonPreset: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").ButtonProps & import("react").RefAttributes<import("react").LegacyRef<HTMLElement>>>, any, {}, never>;

package/es/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.js

@@ -53,12 +53,12 @@ export const AdvancedPicker = React.forwardRef((props, ref) => {
         if (defaultDateTypeKey) {
             const index = DATE_TYPES.findIndex(dateType => dateType.value === defaultDateTypeKey);
             if (index !== -1) {
-                return reorder(DATE_TYPES, index, 0);
+                return reorder([...DATE_TYPES], index, 0);
             }
         }
-        return DATE_TYPES;
+        return [...DATE_TYPES];
     }, [dateTypeKeysShow, defaultDateTypeKey]);
-    const newCalculationDates = useMemo(() => CALCULATION_DATES.filter(calculationDate => GRANULARITY_MAPPING[valueType].includes(calculationDate.value)), [valueType]);
+    const newCalculationDates = useMemo(() => CALCULATION_DATES.filter(calculationDate => GRANULARITY_MAPPING[valueType].some(granularity => granularity === calculationDate.value)), [valueType]);
     const { formatDisplay } = getFormatDisplay(operatorKey, type, valueType);
     // State
     const [state, setState] = useState({