@antscorp/antsomi-ui 1.1.10 → 1.2.0-beta.0

package/dist/types/src/components/atoms/index.d.ts

@@ -0,0 +1,9 @@
+export { Button } from './Button';
+export { Divider } from './Divider';
+export { Input } from './Input';
+export { InputNumber } from './InputNumber';
+export { Radio } from './Radio';
+export { Space } from './Space';
+export { Tag } from './Tag';
+export { Tooltip } from './Tooltip';
+export { Typography } from './Typography';

package/dist/{esm/types/components → types/src/components/common}/ConfigProvider/ConfigProvider.d.ts

@@ -1,7 +1,10 @@
 import { ConfigProviderProps as AntdConfigProviderProps } from 'antd/es/config-provider';
 import React, { ReactNode } from 'react';
-interface ConfigProviderProps extends AntdConfigProviderProps {
+import { TLocale } from 'src/types';
+import 'src/locales/i18n';
+interface ConfigProviderProps extends Omit<AntdConfigProviderProps, 'locale'> {
     children?: ReactNode;
+    locale?: TLocale;
 }
 declare const ConfigProvider: React.FC<ConfigProviderProps>;
 export default ConfigProvider;

package/dist/types/src/components/common/index.d.ts

@@ -0,0 +1 @@
+export { ConfigProvider } from './ConfigProvider';

package/dist/types/src/components/icons/EventIcon.d.ts

@@ -0,0 +1,3 @@
+export declare const EventIcon: ({ ...props }: {
+    [x: string]: any;
+}) => JSX.Element;

package/dist/types/src/components/icons/index.d.ts

@@ -0,0 +1 @@
+export { EventIcon } from './EventIcon';

package/dist/types/src/components/index.d.ts

@@ -0,0 +1,3 @@
+export * from './atoms';
+export * from './molecules';
+export * from './common';

package/dist/types/src/components/molecules/CustomComponent/CustomComponent.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const CustomComponent: React.FC<any>;

package/dist/types/src/components/molecules/CustomComponent/index.d.ts

@@ -0,0 +1 @@
+export { CustomComponent } from './CustomComponent';

package/dist/types/src/components/molecules/DatePicker/DatePicker.d.ts

@@ -0,0 +1,8 @@
+import { DatePicker as AntdDatePicker } from 'antd';
+import { AdvancedPicker } from './components/AdvancedPicker';
+import { AdvancedRangePicker } from './components/AdvancedRangePicker';
+export type TDatePicker = typeof AntdDatePicker & {
+    AdvancedPicker: typeof AdvancedPicker;
+    AdvancedRangePicker: typeof AdvancedRangePicker;
+};
+export declare const DatePicker: TDatePicker;

package/dist/types/src/components/molecules/DatePicker/DatePicker.stories.d.ts

@@ -0,0 +1,4 @@
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<import("./DatePicker").TDatePicker>;
+export default _default;
+export declare const Default: ComponentStory<import("./DatePicker").TDatePicker>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { TAdvancedType, TOperatorKey, TOption } from './types';
+export interface AdvancedPickerProps {
+    label?: string;
+    dateTypeKeysShow?: string[];
+    defaultDateTypeKey?: string;
+    valueType?: string;
+    option?: TOption;
+    operatorKey?: TOperatorKey;
+    type?: TAdvancedType;
+    date?: string;
+    format?: string;
+    formatInputDisplay?: string;
+    inputStyle?: React.CSSProperties;
+    disableAfterDate?: string;
+    disableBeforeDate?: string;
+    errorMessage?: string;
+    onUpdatedNewDate?: (newDate: any) => void;
+    onApply?: ({ date, option }: {
+        date: string;
+        option: TOption;
+    }) => void;
+}
+export declare const AdvancedPicker: React.FC<AdvancedPickerProps>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/AdvancedPicker.stories.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+declare const _default: ComponentMeta<React.FC<import("./AdvancedPicker").AdvancedPickerProps>>;
+export default _default;
+export declare const Default: ComponentStory<React.FC<import("./AdvancedPicker").AdvancedPickerProps>>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/constants.d.ts

@@ -0,0 +1,53 @@
+import { TAdvancedType } from './types';
+export declare const DATE_TYPES: {
+    value: string;
+    label: string;
+}[];
+export declare const CALCULATION_TYPES: {
+    value: string;
+    label: string;
+}[];
+export declare const CALCULATION_DATES: {
+    value: string;
+    label: string;
+}[];
+export declare const VALUE_TYPES: {
+    INPUT_TEXT: string;
+    INPUT_NUMBER: string;
+    MATCHES_ANY: string;
+    YEAR: string;
+    YEAR_QUARTER: string;
+    YEAR_MONTH: string;
+    YEAR_WEEK: string;
+    YEAR_MONTH_DAY: string;
+    YEAR_MONTH_DAY_HOUR: string;
+    YEAR_MONTH_DAY_MINUTE: string;
+    YEAR_MONTH_DAY_SECOND: string;
+    QUARTER: string;
+    MONTH: string;
+    WEEK: string;
+    MONTH_DAY: string;
+    DAY_OF_WEEK: string;
+    DAY: string;
+    HOUR: string;
+    MINUTE: string;
+    INPUT_TEXT_NO_FIELD: string;
+};
+export declare const DEFAULT_DATE_FORMAT = "YYYYMMDDHHmmss";
+export declare const DEFAULT_TIME_FORMAT = "HH:mm:ss";
+export declare const DEFAULT_DATE_DISPLAY_FORMAT = "DD/MM/YYYY HH:mm:ss";
+export declare const TIME_PICKER_TYPE: {
+    DATE_TIME: string;
+    DATE_HOUR: string;
+    DATE_HOUR_MINUTE: string;
+    DATE: string;
+};
+export declare const YEAR_PICKER_TYPE: {
+    YEAR: string;
+    MONTH: string;
+    QUARTER: string;
+};
+export declare const ADVANCED_PICKER_TYPE: Record<string, {
+    value: TAdvancedType;
+    label: string;
+}>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/index.d.ts

@@ -0,0 +1,3 @@
+export { AdvancedPicker } from './AdvancedPicker';
+export type { AdvancedPickerProps } from './AdvancedPicker';
+export type { TOption as TAdvancedPickerOption } from './types';

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/styled.d.ts

@@ -0,0 +1,6 @@
+export declare const DropdownContent: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DropdownHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DropdownFooter: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DatePickerHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const DatePickerCustomInput: import("styled-components").StyledComponent<"input", any, {}, never>;
+export declare const DatePickerFooter: import("styled-components").StyledComponent<"div", any, {}, never>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/types.d.ts

@@ -0,0 +1,11 @@
+export type TOption = {
+    dateType: TDateType;
+    calculationType: TCalculationType;
+    calculationDate: TCalculationDate;
+    value: number;
+};
+export type TDateType = 'today' | 'first_day_of_week_mon_sun' | 'first_day_of_week_sun_sat' | 'first_day_of_month' | 'first_day_of_quarter' | 'first_day_of_year' | 'last_day_of_week_mon_sun' | 'last_day_of_week_sun_sat' | 'last_day_of_month' | 'last_day_of_quarter' | 'last_day_of_year' | 'fixed';
+export type TCalculationType = 'minus' | 'plus' | '';
+export type TCalculationDate = 'seconds' | 'minutes' | 'hours' | 'days' | 'weeks' | 'months' | 'quarters' | 'years' | '';
+export type TOperatorKey = 'after' | 'between' | 'before';
+export type TAdvancedType = 'startDate' | 'endDate';

package/dist/types/src/components/molecules/DatePicker/components/AdvancedPicker/utils.d.ts

@@ -0,0 +1,15 @@
+/**
+ * Calculates a new date based on the given parameters.
+ * @param {string} [dateTypeKey='today'] - Key to determine the type of date to be used as the starting point.
+ * Valid values are: 'today', 'first_day_of_week_mon_sun', 'first_day_of_week_sun_sat',
+ * 'first_day_of_month', 'first_day_of_quarter', 'first_day_of_year', 'last_day_of_week_mon_sun',
+ * 'last_day_of_week_sun_sat', 'last_day_of_month', 'last_day_of_quarter', 'last_day_of_year'.
+ * @param {string} [calculationTypeKey='minus'] - Key to determine whether to add or subtract the specified value.
+ * Valid values are: 'plus', 'minus'.
+ * @param {string} [calculationDateKey='days'] - Key to determine the unit of time to be added or subtracted.
+ * Valid values are: 'days', 'weeks', 'months', 'quarters', 'years'.
+ * @param {number} [value=0] - Value to be added or subtracted.
+ * @param {string} [dateFormat=DEFAULT_DATE_FORMAT] - Format in which to return the new date.
+ * @returns {string} The new date in the specified format.
+ */
+export declare const calculationDateAdvanced: (dateTypeKey?: string, calculationTypeKey?: string, calculationDateKey?: any, value?: number, dateFormat?: string) => any;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedRangePicker/AdvancedRangePicker.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { TOnChangePayload, TTimeRange } from './types';
+export interface AdvancedRangePickerProps {
+    timeRange: TTimeRange;
+    errorMessage?: string;
+    showLabel?: boolean;
+    onChange?: ({ timeRange, mode }: TOnChangePayload) => void;
+}
+export declare const AdvancedRangePicker: React.FC<AdvancedRangePickerProps>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedRangePicker/AdvancedRangePicker.stories.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import { AdvancedRangePicker } from './AdvancedRangePicker';
+declare const _default: ComponentMeta<React.FC<import("./AdvancedRangePicker").AdvancedRangePickerProps>>;
+export default _default;
+export declare const Template: ComponentStory<typeof AdvancedRangePicker>;
+export declare const Basic: ComponentStory<typeof AdvancedRangePicker>;

package/dist/types/src/components/molecules/DatePicker/components/AdvancedRangePicker/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const ADVANCED_RANGE_PICKER_FORMAT: {
+    startDate: string;
+    endDate: string;
+};

package/dist/types/src/components/molecules/DatePicker/components/AdvancedRangePicker/index.d.ts

@@ -0,0 +1,2 @@
+export { AdvancedRangePicker } from './AdvancedRangePicker';
+export type { TTimeRange as TAdvancedRangePickerTimeRange } from './types';

package/dist/types/src/components/molecules/DatePicker/components/AdvancedRangePicker/types.d.ts

@@ -0,0 +1,14 @@
+import { TOption } from '../AdvancedPicker/types';
+export type TOnChangeMode = 'system' | 'user';
+export type TTimeRange = {
+    startDate: TOption & {
+        date: string;
+    };
+    endDate: TOption & {
+        date: string;
+    };
+};
+export type TOnChangePayload = {
+    timeRange: TTimeRange;
+    mode: 'system' | 'user';
+};

package/dist/types/src/components/molecules/DatePicker/index.d.ts

@@ -0,0 +1,3 @@
+export { DatePicker } from './DatePicker';
+export type { AdvancedPickerProps, TAdvancedPickerOption } from './components/AdvancedPicker';
+export type { TAdvancedRangePickerTimeRange } from './components/AdvancedRangePicker';

package/dist/types/src/components/molecules/Select/Select.d.ts

@@ -0,0 +1,15 @@
+import { SelectProps as AntdSelectProps } from 'antd';
+import React from 'react';
+export interface SelectProps extends AntdSelectProps {
+}
+declare const Select: (<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: AntdSelectProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & {
+    ref?: React.Ref<import("antd").RefSelectProps> | undefined;
+}) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    SECRET_COMBOBOX_MODE_DO_NOT_USE: string;
+    Option: import("rc-select/lib/Option").OptionFC;
+    OptGroup: import("rc-select/lib/OptGroup").OptionGroupFC;
+    _InternalPanelDoNotUseOrYouWillBeFired: any;
+} & React.FC<SelectProps>;
+export { Select };

package/dist/types/src/components/molecules/Select/Select.stories.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import { Select, SelectProps } from './Select';
+declare const _default: ComponentMeta<(<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: import("antd").SelectProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & {
+    ref?: React.Ref<import("rc-select").BaseSelectRef> | undefined;
+}) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    SECRET_COMBOBOX_MODE_DO_NOT_USE: string;
+    Option: import("rc-select/lib/Option").OptionFC;
+    OptGroup: import("rc-select/lib/OptGroup").OptionGroupFC;
+    _InternalPanelDoNotUseOrYouWillBeFired: any;
+} & React.FC<SelectProps>>;
+export default _default;
+export declare const Default: ComponentStory<(<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: import("antd").SelectProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & {
+    ref?: React.Ref<import("rc-select").BaseSelectRef> | undefined;
+}) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    SECRET_COMBOBOX_MODE_DO_NOT_USE: string;
+    Option: import("rc-select/lib/Option").OptionFC;
+    OptGroup: import("rc-select/lib/OptGroup").OptionGroupFC;
+    _InternalPanelDoNotUseOrYouWillBeFired: any;
+} & React.FC<SelectProps>>;
+export declare const BasicUsage: ComponentStory<typeof Select>;
+export declare const MultipleSelection: ComponentStory<typeof Select>;
+export declare const CustomSelectionRender: ComponentStory<typeof Select>;
+export declare const Status: ComponentStory<typeof Select>;

package/dist/types/src/components/molecules/Select/Test.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const SelectTest: () => JSX.Element;
+export default SelectTest;

package/dist/types/src/components/molecules/Select/index.d.ts

@@ -0,0 +1,2 @@
+export { Select } from './Select';
+export type { SelectProps } from './Select';

package/dist/types/src/components/molecules/Select/styled.d.ts

@@ -0,0 +1,4 @@
+export declare const StyledTag: import("styled-components").StyledComponent<import("antd").TagType, any, {}, never>;
+export declare const TagCloseBtn: import("styled-components").StyledComponent<"div", any, {
+    borderColor?: string | undefined;
+}, never>;

package/dist/types/src/components/molecules/index.d.ts

@@ -0,0 +1,8 @@
+export { Alert } from './Alert';
+export { Cascader } from './Cascader';
+export { Dropdown } from './Dropdown';
+export { Modal } from './Modal';
+export { Select } from './Select';
+export { CustomComponent } from './CustomComponent';
+export { DatePicker } from './DatePicker';
+export type { AdvancedPickerProps, TAdvancedPickerOption, TAdvancedRangePickerTimeRange, } from './DatePicker';

package/dist/types/src/hooks/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function useDeepCompareEffect(callback: React.EffectCallback, dependencies: React.DependencyList | undefined): void;

package/dist/types/src/locales/i18n.d.ts

@@ -0,0 +1,73 @@
+export declare const translationsJson: {
+    en: {
+        translation: {
+            global: {
+                minus: string;
+                plus: string;
+            };
+            button: {};
+            datePicker: {
+                startDate: string;
+                endDate: string;
+                dateTypes: {
+                    today: string;
+                    firstDayOfWeekMonSun: string;
+                    firstDayOfWeekSunSat: string;
+                    firstDayOfMonth: string;
+                    firstDayOfQuarter: string;
+                    firstDayOfYear: string;
+                    lastDayOfWeekMonSun: string;
+                    lastDayOfWeekSunSat: string;
+                    lastDayOfMonth: string;
+                    lastDayOfQuarter: string;
+                    lastDayOfYear: string;
+                    fixed: string;
+                };
+                seconds: string;
+                minutes: string;
+                hours: string;
+                days: string;
+                weeks: string;
+                months: string;
+                quarters: string;
+                years: string;
+            };
+        };
+    };
+    vi: {
+        translation: {
+            global: {
+                minus: string;
+                plus: string;
+            };
+            button: {};
+            datePicker: {
+                startDate: string;
+                endDate: string;
+                dateTypes: {
+                    today: string;
+                    firstDayOfWeekMonSun: string;
+                    firstDayOfWeekSunSat: string;
+                    firstDayOfMonth: string;
+                    firstDayOfQuarter: string;
+                    firstDayOfYear: string;
+                    lastDayOfWeekMonSun: string;
+                    lastDayOfWeekSunSat: string;
+                    lastDayOfMonth: string;
+                    lastDayOfQuarter: string;
+                    lastDayOfYear: string;
+                    fixed: string;
+                };
+                seconds: string;
+                minutes: string;
+                hours: string;
+                days: string;
+                weeks: string;
+                months: string;
+                quarters: string;
+                years: string;
+            };
+        };
+    };
+};
+export declare const i18n: Promise<import("i18next").TFunction<"translation", undefined, "translation">>;

package/dist/types/src/locales/translations.d.ts

@@ -0,0 +1,37 @@
+import { ConvertedToObjectType, TranslationJsonType } from './types';
+export declare const translations: ConvertedToObjectType<TranslationJsonType>;
+export declare const convertLanguageJsonToObject: (json: any, objToConvertTo?: ConvertedToObjectType<{
+    global: {
+        minus: string;
+        plus: string;
+    };
+    button: {};
+    datePicker: {
+        startDate: string;
+        endDate: string;
+        dateTypes: {
+            today: string;
+            firstDayOfWeekMonSun: string;
+            firstDayOfWeekSunSat: string;
+            firstDayOfMonth: string;
+            firstDayOfQuarter: string;
+            firstDayOfYear: string;
+            lastDayOfWeekMonSun: string;
+            lastDayOfWeekSunSat: string;
+            lastDayOfMonth: string;
+            lastDayOfQuarter: string;
+            lastDayOfYear: string;
+            fixed: string;
+        };
+        seconds: string;
+        minutes: string;
+        hours: string;
+        days: string;
+        weeks: string;
+        months: string;
+        quarters: string;
+        years: string;
+    };
+}>, current?: string) => void;
+export declare const t: (id: string, ...rest: any[]) => [string, ...any[]];
+export declare const getTranslateMessage: (id: string, defaultMessage?: string, value?: Record<string, unknown>) => string;

package/dist/types/src/locales/types.d.ts

@@ -0,0 +1,15 @@
+export type ConvertedToObjectType<T> = {
+    [P in keyof T]: T[P] extends string ? string : ConvertedToObjectType<T[P]>;
+};
+/**
+ 
+If you don't want non-existing keys to throw ts error you can simply do(also keeping the intellisense)
+
+export type ConvertedToObjectType<T> = {
+  [P in keyof T]: T[P] extends string ? string : ConvertedToObjectType<T[P]>;
+} & {
+  [P: string]: any;
+};
+
+*/
+export type TranslationJsonType = typeof import('./en/translation.json');

package/dist/types/src/types/index.d.ts

@@ -0,0 +1,6 @@
+export type THandleErrorPayload = {
+    path: string;
+    name: string;
+    args: Record<string, any>;
+};
+export type TLocale = 'en' | 'vi';

package/dist/types/src/utils/common.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Function to reorder list
+ * @param {Object[]} list - list of item want to reorder
+ * @param {number} startIndex - start item index want to replace position: ;
+ * @param {number} endIndex - end item index want to replace position: ;
+ * @returns {object[]}
+ */
+export declare const reorder: (list: Array<Record<string, unknown> | string | number>, startIndex: number, endIndex: number) => any[];

package/dist/types/src/utils/handleError.d.ts

@@ -0,0 +1,2 @@
+import { THandleErrorPayload } from 'src/types';
+export declare const handleError: (error: any, payload: THandleErrorPayload) => void;

package/dist/types/types/index.d.ts

@@ -0,0 +1,5 @@
+export type THandleErrorPayload = {
+    path: string;
+    name: string;
+    args: Record<string, any>;
+};

package/dist/types/utils/common.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Function to reorder list
+ * @param {Object[]} list - list of item want to reorder
+ * @param {number} startIndex - start item index want to replace position: ;
+ * @param {number} endIndex - end item index want to replace position: ;
+ * @returns {object[]}
+ */
+export declare const reorder: (list: Array<Record<string, unknown> | string | number>, startIndex: number, endIndex: number) => any[];

package/dist/types/utils/handleError.d.ts

@@ -0,0 +1,2 @@
+import { THandleErrorPayload } from 'src/types';
+export declare const handleError: (error: any, payload: THandleErrorPayload) => void;

package/package.json

@@ -1,16 +1,15 @@
 {
   "name": "@antscorp/antsomi-ui",
-  "version": "1.1.10",
+  "version": "1.2.0-beta.0",
   "description": "An enterprise-class UI design language and React UI library.",
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
+  "main": "dist/index.js",
   "files": [
     "dist"
   ],
-  "types": "dist/index.d.ts",
+  "types": "dist/types",
   "scripts": {
     "dev": "vite",
-    "build": "rollup -c",
+    "build": "webpack --config webpack.build.js",
     "eslint": "eslint --ext js,ts,tsx",
     "lint": "yarn run eslint src",
     "lint:fix": "yarn run eslint src --fix",
@@ -18,7 +17,10 @@
     "storybook": "start-storybook -p 6006 -s public",
     "build-storybook": "build-storybook",
     "serve-storybook": "serve storybook-static",
-    "version": "auto-changelog -p && git add CHANGELOG.md"
+    "version": "auto-changelog -p && git add CHANGELOG.md",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "test:coverage": "jest --coverage"
   },
   "husky": {
     "hooks": {
@@ -32,7 +34,12 @@
   },
   "author": "",
   "license": "MIT",
-  "dependencies": {},
+  "dependencies": {
+    "antd": "^5.3.2",
+    "dayjs": "^1.11.7",
+    "lodash": "^4.17.21",
+    "ts-dedent": "^2.2.0"
+  },
   "devDependencies": {
     "@ant-design/cssinjs": "^1.6.2",
     "@antscorp/eslint-config-antsomi": "1.0.4",
@@ -40,13 +47,9 @@
     "@babel/core": "^7.21.3",
     "@babel/preset-env": "^7.20.2",
     "@babel/preset-react": "^7.18.6",
-    "@commitlint/cli": "^17.5.0",
-    "@commitlint/config-conventional": "^17.4.4",
+    "@commitlint/cli": "17.5.0",
+    "@commitlint/config-conventional": "17.4.4",
     "@emotion/react": "^11.10.6",
-    "@rollup/plugin-commonjs": "^24.0.1",
-    "@rollup/plugin-image": "^3.0.2",
-    "@rollup/plugin-node-resolve": "^15.0.1",
-    "@rollup/plugin-typescript": "^11.0.0",
     "@storybook/addon-actions": "^6.5.16",
     "@storybook/addon-essentials": "^6.5.16",
     "@storybook/addon-interactions": "^6.5.16",
@@ -56,50 +59,63 @@
     "@storybook/manager-webpack5": "^6.5.16",
     "@storybook/react": "^6.5.16",
     "@storybook/testing-library": "^0.0.13",
-    "@types/jest": "^29.2.5",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^14.0.0",
+    "@types/jest": "^29.5.0",
     "@types/node": "^18.15.10",
-    "@types/react": "^18.0.29",
+    "@types/react": "^18.0.33",
     "@types/react-dom": "^18.0.11",
+    "@types/react-test-renderer": "^18.0.0",
     "@types/styled-components": "^5.1.26",
     "@typescript-eslint/eslint-plugin": "^5.55.0",
     "@typescript-eslint/parser": "^5.55.0",
     "@vitejs/plugin-react": "^3.1.0",
-    "antd": "^5.3.2",
     "auto-changelog": "^2.4.0",
     "babel-loader": "^8.3.0",
+    "clsx": "^1.2.1",
     "css-loader": "^6.7.3",
+    "date-fns": "^2.29.3",
     "eslint": "^8.36.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jsx-a11y": "^6.7.1",
+    "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.32.2",
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-storybook": "^0.6.11",
+    "file-loader": "^6.2.0",
     "husky": "^8.0.3",
+    "i18next": "^22.4.14",
+    "i18next-browser-languagedetector": "^7.0.1",
+    "jest": "^29.5.0",
+    "jest-environment-jsdom": "^29.5.0",
     "lint-staged": "^13.2.0",
+    "mini-css-extract-plugin": "^2.7.5",
     "postcss": "^8.4.21",
     "postcss-loader": "^7.1.0",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "rollup": "^3.20.0",
-    "rollup-plugin-dts": "^5.3.0",
-    "rollup-plugin-peer-deps-external": "^2.2.4",
-    "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-typescript-paths": "^1.4.0",
+    "prettier": "^2.8.7",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-fast-compare": "^3.2.1",
+    "react-i18next": "^12.2.0",
     "sass": "^1.60.0",
-    "sass-loader": "^13.2.1",
+    "sass-loader": "^13.2.2",
     "style-loader": "^3.3.2",
     "styled-components": "^5.3.9",
+    "terser-webpack-plugin": "^5.3.7",
+    "ts-jest": "^29.1.0",
     "ts-loader": "^9.4.2",
+    "ts-node": "^10.9.1",
     "tsconfig-paths-webpack-plugin": "^4.0.1",
-    "tslib": "^2.5.0",
     "typescript": "^4.9.4",
     "vite": "^4.2.1",
-    "webpack": "^5.75.0"
+    "webpack": "^5.78.0",
+    "webpack-cli": "^5.0.1"
   },
   "peerDependencies": {
+    "@antscorp/icons": ">=0.26.0",
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   }