@antscorp/antsomi-ui 2.0.7 → 2.0.8-3.text-editor-beta.1

package/es/components/molecules/MatchAnySelect/components/ExtendValuePopup.js

@@ -1,17 +1,7 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { jsx as _jsx } from "react/jsx-runtime";
 // Libraries
 import { uniq } from 'lodash';
-import React, { useState } from 'react';
+import { useState } from 'react';
 import styled from 'styled-components';
 // Components
 import { ApplyPopupContent, Form } from '@antscorp/antsomi-ui/es/components/molecules';
@@ -25,7 +15,7 @@ import { splitTextByNewline } from '@antscorp/antsomi-ui/es/utils';
 const { borderRadius, blue1 } = globalToken || {};
 const { t } = i18nInstance;
 // Styled
-const TextArea = styled(Input.TextArea) `
+const TextArea = styled(props => _jsx(Input.TextArea, { ...props })) `
   &.antsomi-input-borderless {
     border: 1px solid ${blue1} !important;
     border-radius: ${borderRadius}px;
@@ -33,7 +23,7 @@ const TextArea = styled(Input.TextArea) `
 `;
 export const ExtendValuePopup = props => {
     // Props
-    const { children, onApply = () => { } } = props, restProps = __rest(props, ["children", "onApply"]);
+    const { children, onApply = () => { }, ...restProps } = props;
     // State
     const [state, setState] = useState({
         isOpenPopover: false,
@@ -46,7 +36,7 @@ export const ExtendValuePopup = props => {
     const extendValues = Form.useWatch('extendValues', form);
     // Handlers
     const onClosePopover = () => {
-        setState(prev => (Object.assign(Object.assign({}, prev), { isOpenPopover: false })));
+        setState(prev => ({ ...prev, isOpenPopover: false }));
         form.resetFields();
     };
     const onFinishSubmit = (values) => {
@@ -54,13 +44,10 @@ export const ExtendValuePopup = props => {
         onApply(extendValues);
         onClosePopover();
     };
-    return (React.createElement(Popover, Object.assign({ open: isOpenPopover, overlayInnerStyle: {
+    return (_jsx(Popover, { open: isOpenPopover, overlayInnerStyle: {
             padding: 0,
             width: 500,
-        }, trigger: ['click'], arrow: false, placement: "topRight", onOpenChange: () => setState(prev => (Object.assign(Object.assign({}, prev), { isOpenPopover: !isOpenPopover }))) }, restProps, { content: React.createElement(ApplyPopupContent, { title: t(translations.extendValue.title).toString(), applyButtonProps: {
-                disabled: !(extendValues === null || extendValues === void 0 ? void 0 : extendValues.trim()),
-            }, onCancel: onClosePopover, onApply: () => form.submit() },
-            React.createElement(Form, { form: form, onFinish: onFinishSubmit },
-                React.createElement(Form.Item, { noStyle: true, name: "extendValues" },
-                    React.createElement(TextArea, { autoSize: false, bordered: false, rows: 9, placeholder: t(translations.extendValue.placeholder).toString() })))) }), children));
+        }, trigger: ['click'], arrow: false, placement: "topRight", onOpenChange: () => setState(prev => ({ ...prev, isOpenPopover: !isOpenPopover })), ...restProps, content: _jsx(ApplyPopupContent, { title: t(translations.extendValue.title).toString(), applyButtonProps: {
+                disabled: !extendValues?.trim(),
+            }, onCancel: onClosePopover, onApply: () => form.submit(), children: _jsx(Form, { form: form, onFinish: onFinishSubmit, children: _jsx(Form.Item, { noStyle: true, name: "extendValues", children: _jsx(TextArea, { autoSize: false, bordered: false, rows: 9, placeholder: t(translations.extendValue.placeholder).toString() }) }) }) }), children: children }));
 };

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

@@ -6,6 +6,18 @@ export const SAMPLE_DATA = [
     {
         key: '12179',
         title: 'Untitled Project#2024-06-27 09:40:18',
+        children: [
+            {
+                key: '12180',
+                title: 'Untitled Project#2024-06-27 09:40:18',
+                children: [
+                    {
+                        key: '12181',
+                        title: 'Untitled Project#2024-06-27 09:40:18',
+                    },
+                ],
+            },
+        ],
     },
     {
         key: '11923',

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

@@ -1,12 +1,10 @@
 /// <reference types="react" />
-export declare const MatchesAnyWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const MatchesAnyWrapper: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
 export declare const TextButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/typography/Text").TextProps & import("react").RefAttributes<HTMLSpanElement>>, any, {
     disabled?: boolean | undefined;
 }, never>;
-export declare const GroupSelectButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/button/button").ButtonProps & import("react").RefAttributes<HTMLElement>> & {
-    Group: import("react").FC<import("antd/es/button").ButtonGroupProps>;
-}, any, {}, never>;
-export declare const ActionButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const GroupSelectButton: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+export declare const ActionButton: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
 export declare const StyledTree: import("styled-components").StyledComponent<(<T extends import("rc-tree").BasicDataNode | import("rc-tree/lib/interface").DataNode = import("rc-tree/lib/interface").DataNode>(props: import("antd/es/tree/Tree").TreeProps<T> & {
     children?: import("react").ReactNode;
 } & import("react").RefAttributes<import("rc-tree").default<import("rc-tree/lib/interface").DataNode>>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & {
@@ -24,6 +22,6 @@ export declare const StyledTree: import("styled-components").StyledComponent<(<T
     };
     Standard: import("react").FC<import("antd/es/tree/Tree").TreeProps<import("rc-tree/lib/interface").DataNode>>;
 }, any, {}, never>;
-export declare const TextArea: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/input").TextAreaProps & import("react").RefAttributes<import("antd/es/input/TextArea").TextAreaRef>>, any, {}, never>;
+export declare const TextArea: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
 export declare const ExtraValueLabel: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const ItemStatus: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd/es/flex/interface").FlexProps<import("antd/es/_util/type").AnyObject> & import("react").RefAttributes<HTMLElement>>, any, {}, never>;
+export declare const ItemStatus: import("styled-components").StyledComponent<(props: any) => import("react/jsx-runtime").JSX.Element, any, {}, never>;

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

@@ -1,3 +1,4 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 // Libraries
 import styled, { css } from 'styled-components';
 // Components
@@ -7,7 +8,7 @@ import { Tree } from '@antscorp/antsomi-ui/es/components/molecules';
 import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 import { EXTRA_VALUE_SHIFT_WIDTH, EXTRA_VALUE_WIDTH } from './constants';
 const { borderRadius, bw3, bw6, blue, blue1, colorPrimary, colorError } = globalToken || {};
-export const MatchesAnyWrapper = styled(Flex) `
+export const MatchesAnyWrapper = styled(props => _jsx(Flex, { ...props })) `
   width: 100%;
   height: 550px;
 
@@ -18,7 +19,7 @@ export const MatchesAnyWrapper = styled(Flex) `
       height: 50px;
       box-sizing: border-box;
       padding: 0px 15px;
-      border-bottom: 1px solid ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};
+      border-bottom: 1px solid ${globalToken?.bw3};
       gap: 10px;
 
       .antsomi-search-input {
@@ -36,7 +37,7 @@ export const MatchesAnyWrapper = styled(Flex) `
       height: 100%;
 
       &--left {
-        border-right: 1px solid ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw3};
+        border-right: 1px solid ${globalToken?.bw3};
       }
     }
 
@@ -105,6 +106,7 @@ export const MatchesAnyWrapper = styled(Flex) `
             gap: 10px;
             width: 100%;
             height: 100%;
+            user-select: text;
             overflow: auto;
 
             > .left-content {
@@ -150,7 +152,7 @@ export const MatchesAnyWrapper = styled(Flex) `
 
       &.antsomi-tree-treenode-disabled {
         .antsomi-typography {
-          color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.bw6} !important;
+          color: ${globalToken?.bw6} !important;
         }
 
         .select-button {
@@ -206,7 +208,9 @@ export const MatchesAnyWrapper = styled(Flex) `
 
       &.load-more-node {
         overflow: hidden;
-        height: 0px !important;
+        pointer-events: none;
+        background-color: #fff !important;
+        height: 5px !important;
         padding: 0px !important;
       }
     }
@@ -229,13 +233,13 @@ export const TextButton = styled(Typography.Text) `
       pointer-events: none;
     `}
 `;
-export const GroupSelectButton = styled(Button) `
+export const GroupSelectButton = styled(props => _jsx(Button, { ...props })) `
   gap: 4px !important;
   .group-name {
     font-weight: normal !important;
   }
 `;
-export const ActionButton = styled(Flex) `
+export const ActionButton = styled(props => _jsx(Flex, { ...props })) `
   height: 16px;
   width: 16px;
   opacity: 0;
@@ -247,7 +251,7 @@ export const ActionButton = styled(Flex) `
   }
 `;
 export const StyledTree = styled(Tree) ``;
-export const TextArea = styled(Input.TextArea) `
+export const TextArea = styled(props => _jsx(Input.TextArea, { ...props })) `
   &.antsomi-input-borderless {
     border: 1px solid ${blue1} !important;
     border-radius: ${borderRadius}px;
@@ -259,4 +263,4 @@ export const ExtraValueLabel = styled.div `
   align-items: center;
   justify-content: center;
 `;
-export const ItemStatus = styled(Flex) ``;
+export const ItemStatus = styled(props => _jsx(Flex, { ...props })) ``;

package/es/components/molecules/MatchAnySelect/types.d.ts

@@ -28,6 +28,12 @@ export type CustomItemRenders<TItem> = {
     error?: (item: MatchesAnyItem<TItem>) => ReactNode;
 };
 export interface MatchesAnySelectProps<TItem = any> extends Omit<SelectProps, 'onChange'> {
+    /** Maximum item can select from items list */
+    maxSelectedItem?: number;
+    /** Max character of each item selected
+     * @default 200
+     */
+    maxLengthEachItem?: number;
     /** The name of object to be displayed in Popover */
     objectName?: string;
     /** Indicates whether show the extend value button */
@@ -50,6 +56,10 @@ export interface MatchesAnySelectProps<TItem = any> extends Omit<SelectProps, 'o
     listEmptyProps?: EmptyDataProps;
     /** Empty UI for selected list items */
     selectedListEmptyProps?: EmptyDataProps;
+    /** Search value */
+    searchValue?: string;
+    /** Error message */
+    error?: string;
     /** Callback function that is called when the selected items change. */
     onChange?: (selectedItems: MatchesAnyItem<TItem>[], selectedTreeData?: MatchesAnyItem<TItem>[]) => void;
     /** Callback function that is called when the search value changes */
@@ -57,7 +67,9 @@ export interface MatchesAnySelectProps<TItem = any> extends Omit<SelectProps, 'o
     /** Callback function that is called when the user scroll */
     onLoadMore?: () => void;
 }
-export interface MatchesAnyProps<TItem = any> extends Omit<FlexProps, 'children'>, Pick<MatchesAnySelectProps<TItem>, 'objectName' | 'loading' | 'showExtendValue' | 'items' | 'selectedItems' | 'onLoadMore' | 'groupSelectProps' | 'onChangeSearch' | 'renderExtraValues' | 'customItemRenders' | 'listEmptyProps' | 'selectedListEmptyProps' | 'selectedTreeData'> {
+export interface MatchesAnyProps<TItem = any> extends Omit<FlexProps, 'children'>, Pick<MatchesAnySelectProps<TItem>, 'objectName' | 'loading' | 'showExtendValue' | 'items' | 'selectedItems' | 'onLoadMore' | 'groupSelectProps' | 'onChangeSearch' | 'renderExtraValues' | 'customItemRenders' | 'listEmptyProps' | 'selectedListEmptyProps' | 'selectedTreeData' | 'searchValue' | 'maxSelectedItem' | 'maxLengthEachItem'> {
+    /** Indicates handle search out of component */
+    isExternalSearch?: boolean;
     /**
      * Callback function that is called when the apply action is triggered.
      *

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

@@ -1,2 +1,92 @@
 import { MatchesAnyItem } from './types';
-export declare const getSelectedTreeData: (items: MatchesAnyItem<any>[], selectedItems: MatchesAnyItem<any>[], selectedTreeData?: MatchesAnyItem<any>[]) => any;
+export declare const getSelectedTreeData: (items: MatchesAnyItem<any>[], selectedItems: MatchesAnyItem<any>[], selectedTreeData?: MatchesAnyItem<any>[]) => {
+    toString: () => string;
+    charAt: (pos: number) => string;
+    charCodeAt: (index: number) => number;
+    concat: (...strings: string[]) => string;
+    indexOf: (searchString: string, position?: number | undefined) => number;
+    lastIndexOf: (searchString: string, position?: number | undefined) => number;
+    localeCompare: {
+        (that: string): number;
+        (that: string, locales?: string | string[] | undefined, options?: Intl.CollatorOptions | undefined): number;
+        (that: string, locales?: Intl.LocalesArgument, options?: Intl.CollatorOptions | undefined): number;
+    };
+    match: {
+        (regexp: string | RegExp): RegExpMatchArray | null;
+        (matcher: {
+            [Symbol.match](string: string): RegExpMatchArray | null;
+        }): RegExpMatchArray | null;
+    };
+    replace: {
+        (searchValue: string | RegExp, replaceValue: string): string;
+        (searchValue: string | RegExp, replacer: (substring: string, ...args: any[]) => string): string;
+        (searchValue: {
+            [Symbol.replace](string: string, replaceValue: string): string;
+        }, replaceValue: string): string;
+        (searchValue: {
+            [Symbol.replace](string: string, replacer: (substring: string, ...args: any[]) => string): string;
+        }, replacer: (substring: string, ...args: any[]) => string): string;
+    };
+    search: {
+        (regexp: string | RegExp): number;
+        (searcher: {
+            [Symbol.search](string: string): number;
+        }): number;
+    };
+    slice: (start?: number | undefined, end?: number | undefined) => string;
+    split: {
+        (separator: string | RegExp, limit?: number | undefined): string[];
+        (splitter: {
+            [Symbol.split](string: string, limit?: number | undefined): string[];
+        }, limit?: number | undefined): string[];
+    };
+    substring: (start: number, end?: number | undefined) => string;
+    toLowerCase: () => string;
+    toLocaleLowerCase: {
+        (locales?: string | string[] | undefined): string;
+        (locales?: Intl.LocalesArgument): string;
+    };
+    toUpperCase: () => string;
+    toLocaleUpperCase: {
+        (locales?: string | string[] | undefined): string;
+        (locales?: Intl.LocalesArgument): string;
+    };
+    trim: () => string;
+    readonly length: number;
+    substr: (from: number, length?: number | undefined) => string;
+    valueOf: () => string;
+    codePointAt: (pos: number) => number | undefined;
+    includes: (searchString: string, position?: number | undefined) => boolean;
+    endsWith: (searchString: string, endPosition?: number | undefined) => boolean;
+    normalize: {
+        (form: "NFC" | "NFD" | "NFKC" | "NFKD"): string;
+        (form?: string | undefined): string;
+    };
+    repeat: (count: number) => string;
+    startsWith: (searchString: string, position?: number | undefined) => boolean;
+    anchor: (name: string) => string;
+    big: () => string;
+    blink: () => string;
+    bold: () => string;
+    fixed: () => string;
+    fontcolor: (color: string) => string;
+    fontsize: {
+        (size: number): string;
+        (size: string): string;
+    };
+    italics: () => string;
+    link: (url: string) => string;
+    small: () => string;
+    strike: () => string;
+    sub: () => string;
+    sup: () => string;
+    padStart: (maxLength: number, fillString?: string | undefined) => string;
+    padEnd: (maxLength: number, fillString?: string | undefined) => string;
+    trimEnd: () => string;
+    trimStart: () => string;
+    trimLeft: () => string;
+    trimRight: () => string;
+    matchAll: (regexp: RegExp) => IterableIterator<RegExpExecArray>;
+    [Symbol.iterator]: () => IterableIterator<string>;
+    at: (index: number) => string | undefined;
+}[];

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

@@ -1,7 +1,24 @@
 // Libraries
 import deepmerge from 'deepmerge';
+import { isEmpty, unionBy } from 'lodash';
 // Utils
 import { flatTree } from '@antscorp/antsomi-ui/es/utils';
+/**
+ * Creates a custom merge function for tree data structures.
+ *
+ * @param {string} key - The property name used to identify unique items in the tree.
+ * @returns {Function} A function that merges two arrays of MatchesAnyItem objects.
+ *
+ * @description
+ * This function returns a merge strategy for deepmerge that:
+ * 1. Merges items from the target and source arrays based on the specified key.
+ * 2. Recursively merges nested children using the same strategy.
+ * 3. Adds new items from the source that don't exist in the target.
+ *
+ * @example
+ * const mergeStrategy = customMergeTreeData('id');
+ * const mergedData = deepmerge(targetArray, sourceArray, { arrayMerge: mergeStrategy });
+ */
 const customMergeTreeData = (key) => (target, source) => {
     const merged = target.map(item => {
         const found = source.find(s => s[key] === item[key]);
@@ -14,29 +31,38 @@ const customMergeTreeData = (key) => (target, source) => {
     return [...merged, ...newItems];
 };
 export const getSelectedTreeData = (items, selectedItems, selectedTreeData = []) => {
-    const notExtendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => !item.isExtendValue)) || [];
-    const extendValueSelectedItems = (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.filter(item => item.isExtendValue)) || [];
-    const serializeTreeData = (list) => {
-        var _a;
-        return ((_a = list
-            .filter(item => {
-            /**
-             * Checks if the given item or any of its descendants are selected.
-             *
-             * If the item has children, it flattens the children tree structure and checks if any node is selected.
-             * If the item does not have children, it directly checks if the item is in the selected items list.
-             *
-             */
-            const isSelected = item.children
-                ? flatTree(item.children, 'children').some(item => notExtendValueSelectedItems === null || notExtendValueSelectedItems === void 0 ? void 0 : notExtendValueSelectedItems.some(selectedItem => selectedItem.key === item.key))
-                : notExtendValueSelectedItems === null || notExtendValueSelectedItems === void 0 ? void 0 : notExtendValueSelectedItems.some(selectedItem => selectedItem.key === item.key);
-            return isSelected;
-        })) === null || _a === void 0 ? void 0 : _a.map(item => (Object.assign(Object.assign({}, item), (item.children && {
+    const notExtendValueSelectedItems = selectedItems?.filter(item => !item.isExtendValue) || [];
+    const extendValueSelectedItems = selectedItems?.filter(item => item.isExtendValue) || [];
+    const serializeTreeData = (list) => list
+        .filter(item => {
+        /**
+         * Checks if the given item or any of its descendants are selected.
+         *
+         * If the item has children, it flattens the children tree structure and checks if any node is selected.
+         * If the item does not have children, it directly checks if the item is in the selected items list.
+         *
+         */
+        const isSelected = item.children
+            ? flatTree(item.children, 'children').some(item => notExtendValueSelectedItems?.some(selectedItem => selectedItem.key === item.key))
+            : notExtendValueSelectedItems?.some(selectedItem => selectedItem.key === item.key);
+        return isSelected;
+    })
+        ?.map(item => ({
+        ...item,
+        ...(item.children && {
             children: serializeTreeData(item.children),
-        }))))) || [];
-    };
+        }),
+    })) || [];
     const mergeItems = deepmerge(selectedTreeData || [], items || [], {
         arrayMerge: customMergeTreeData('key'),
     });
-    return serializeTreeData(mergeItems).concat(extendValueSelectedItems);
+    // If all of items not have children then filter item is not found in list but has selected for display
+    const notFoundItems = !mergeItems.some(item => !isEmpty(item.children))
+        ? notExtendValueSelectedItems?.filter(item => !items?.some(i => i.key === item.key))
+        : [];
+    const treeData = serializeTreeData(mergeItems).concat([
+        ...notFoundItems,
+        ...extendValueSelectedItems,
+    ]);
+    return unionBy(treeData, 'key');
 };

package/es/components/molecules/Modal/Modal.js

@@ -1,5 +1,6 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 // Libraries
-import React, { memo } from 'react';
+import { memo } from 'react';
 // Atoms
 import { Button, Icon, Spin } from '@antscorp/antsomi-ui/es/components/atoms';
 // Styled
@@ -7,18 +8,18 @@ import { StyledModal, WrapperSpin } from './styled';
 export const OriginalModal = memo(props => {
     // Props
     const { loading } = props;
-    return (React.createElement(StyledModal, Object.assign({ closeIcon: React.createElement(Icon, { disabled: loading, type: "icon-ants-remove-slim", size: 15 }),
-        footer: (React.createElement(React.Fragment, null,
-            React.createElement(Button, Object.assign({ type: "primary", onClick: props.onOk }, props.okButtonProps), props.okText ? props.okText : 'OK'),
-            React.createElement(Button, Object.assign({ onClick: props.onCancel }, props.cancelButtonProps), props.cancelText ? props.cancelText : 'Cancel'))),
-        modalRender: node => loading ? (React.createElement(WrapperSpin, null,
-            React.createElement(Spin, { spinning: loading }, node))) : (node) }, props, { maskClosable: loading ? false : props.maskClosable }),
-        props.header || null,
-        props.children || null));
+    return (_jsxs(StyledModal, { closeIcon: _jsx(Icon, { disabled: loading, type: "icon-ants-remove-slim", size: 15 }),
+        footer: (_jsxs(_Fragment, { children: [_jsx(Button, { type: "primary", onClick: props.onOk, ...props.okButtonProps, children: props.okText ? props.okText : 'OK' }), _jsx(Button, { onClick: props.onCancel, ...props.cancelButtonProps, children: props.cancelText ? props.cancelText : 'Cancel' })] })),
+        modalRender: node => loading ? (_jsx(WrapperSpin, { children: _jsx(Spin, { spinning: loading, children: node }) })) : (node),
+        ...props,
+        maskClosable: loading ? false : props.maskClosable, children: [props.header || null, props.children || null] }));
 });
 OriginalModal.displayName = 'OriginalModal';
 export const Modal = OriginalModal;
-Modal.confirm = (props) => StyledModal.confirm(Object.assign({ cancelText: 'Cancel' }, props));
+Modal.confirm = (props) => StyledModal.confirm({
+    cancelText: 'Cancel',
+    ...props,
+});
 Modal.useModal = StyledModal.useModal;
 Modal.success = StyledModal.success;
 Modal.info = StyledModal.info;

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

@@ -1,4 +1,3 @@
-var _a, _b, _c, _d, _e, _f, _g;
 // Libraries
 import styled, { css } from 'styled-components';
 import { Modal as AntdModal } from 'antd';
@@ -55,21 +54,21 @@ export const StyledModal = styled(AntdModal) `
 
       .antsomi-btn {
         height: 28px;
-        border-radius: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.borderRadius}px;
-        font-size: ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.fontSize}px;
-        color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.colorPrimary};
+        border-radius: ${THEME.token?.borderRadius}px;
+        font-size: ${THEME.token?.fontSize}px;
+        color: ${THEME.token?.colorPrimary};
         font-weight: 700;
 
         &:hover {
-          color: ${(_d = THEME.token) === null || _d === void 0 ? void 0 : _d.colorTextHover};
+          color: ${THEME.token?.colorTextHover};
         }
 
         &.antsomi-btn-primary {
-          background-color: ${(_e = THEME.token) === null || _e === void 0 ? void 0 : _e.colorPrimary};
-          color: ${(_f = THEME.token) === null || _f === void 0 ? void 0 : _f.bw0};
+          background-color: ${THEME.token?.colorPrimary};
+          color: ${THEME.token?.bw0};
 
           &:hover {
-            background-color: ${(_g = THEME.token) === null || _g === void 0 ? void 0 : _g.colorTextHover};
+            background-color: ${THEME.token?.colorTextHover};
           }
         }
       }

package/es/components/molecules/ModalSelect/Card.d.ts

@@ -1,6 +1,5 @@
-import React from 'react';
 import { CardProps } from 'antd';
 import { CardDefinationProps, CardRecommendedProps } from './types';
-export declare const Card: (props: CardProps) => React.JSX.Element;
-export declare const CardDefination: (props: CardDefinationProps) => React.JSX.Element;
-export declare const CardRecommended: (props: CardRecommendedProps) => React.JSX.Element;
+export declare const Card: (props: CardProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardDefination: (props: CardDefinationProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardRecommended: (props: CardRecommendedProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/molecules/ModalSelect/Card.js

@@ -1,23 +1,14 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React, { useEffect, useRef, useState } from 'react';
+import { createElement as _createElement } from "react";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from 'react';
 import { CardDefinationContainer, CardRecommendedContainer, RecommendItem, StyledCard, } from './styled';
 import { Tooltip, Typography } from 'antd';
 import clsx from 'clsx';
 import { globalToken } from '@antscorp/antsomi-ui/es/constants';
 const { Text, Paragraph } = Typography;
 export const Card = (props) => {
-    const { children, bordered = false } = props, rest = __rest(props, ["children", "bordered"]);
-    return (React.createElement(StyledCard, Object.assign({ bordered: bordered }, rest), children));
+    const { children, bordered = false, ...rest } = props;
+    return (_jsx(StyledCard, { bordered: bordered, ...rest, children: children }));
 };
 export const CardDefination = (props) => {
     const refreshKey = useRef(0);
@@ -33,25 +24,26 @@ export const CardDefination = (props) => {
         refreshKey.current += 1;
         setExpandable(false);
     };
-    return (React.createElement(CardDefinationContainer, null,
-        title && React.createElement(Text, { className: "title" }, title),
-        description && (React.createElement(Paragraph, { key: refreshKey.current, ellipsis: Object.assign(Object.assign({ rows: 3, tooltip: true, symbol: 'View more' }, descriptionEllipsis), { expandable, onExpand: () => setIsExpanded(true) }), className: "description" },
-            description,
-            isExpanded && (React.createElement("span", { className: "antsomi-typography-collapse", onClick: handleCollapse }, "View less"))))));
+    return (_jsxs(CardDefinationContainer, { children: [title && _jsx(Text, { className: "title", children: title }), description && (_jsxs(Paragraph, { ellipsis: {
+                    rows: 3,
+                    tooltip: true,
+                    symbol: 'View more',
+                    ...descriptionEllipsis,
+                    expandable,
+                    onExpand: () => setIsExpanded(true),
+                }, className: "description", children: [description, isExpanded && (_jsx("span", { className: "antsomi-typography-collapse", onClick: handleCollapse, children: "View less" }))] }, refreshKey.current))] }));
 };
 export const CardRecommended = (props) => {
     const { title, recomendations = [] } = props;
-    return (React.createElement(CardRecommendedContainer, null,
-        title && React.createElement(Text, { className: "title" }, title),
-        React.createElement("div", { className: "recomendations" }, recomendations.map(i => {
-            const { description, className, color = globalToken === null || globalToken === void 0 ? void 0 : globalToken.blue2, bordered = false } = i;
-            const item = (React.createElement(RecommendItem, Object.assign({}, i, { key: i.key, color: color, bordered: bordered, className: clsx('item', className) })));
-            if (typeof description === 'string') {
-                return (React.createElement(Tooltip, { title: description, placement: "top" }, item));
-            }
-            if (description) {
-                return React.createElement(Tooltip, Object.assign({}, description), item);
-            }
-            return item;
-        }))));
+    return (_jsxs(CardRecommendedContainer, { children: [title && _jsx(Text, { className: "title", children: title }), _jsx("div", { className: "recomendations", children: recomendations.map(i => {
+                    const { description, className, color = globalToken?.blue2, bordered = false } = i;
+                    const item = (_createElement(RecommendItem, { ...i, key: i.key, color: color, bordered: bordered, className: clsx('item', className) }));
+                    if (typeof description === 'string') {
+                        return (_jsx(Tooltip, { title: description, placement: "top", children: item }));
+                    }
+                    if (description) {
+                        return _jsx(Tooltip, { ...description, children: item });
+                    }
+                    return item;
+                }) })] }));
 };

package/es/components/molecules/ModalSelect/ModalSelect.d.ts

@@ -1,3 +1,2 @@
-import React from 'react';
 import { ModalSelectProps } from './types';
-export declare const ModalSelect: (props: ModalSelectProps) => React.JSX.Element;
+export declare const ModalSelect: (props: ModalSelectProps) => import("react/jsx-runtime").JSX.Element;

package/es/components/molecules/ModalSelect/ModalSelect.js

@@ -1,26 +1,15 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import React, { useCallback, useEffect, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from 'react';
 import { Menu } from 'antd';
 import { StyledModal } from './styled';
 import { isFunction } from 'lodash';
 import clsx from 'clsx';
 export const ModalSelect = (props) => {
-    const { value, content, options = [], okButtonProps = {}, cancelButtonProps = {}, title, open: openProp, menuRef: menuRefProp, onChange, onOk, contentWrapperProps = {} } = props, rest = __rest(props, ["value", "content", "options", "okButtonProps", "cancelButtonProps", "title", "open", "menuRef", "onChange", "onOk", "contentWrapperProps"]);
+    const { value, content, options = [], okButtonProps = {}, cancelButtonProps = {}, title, open: openProp, menuRef: menuRefProp, onChange, onOk, contentWrapperProps = {}, ...rest } = props;
     const [selected, setSelected] = useState(null);
     const [open, setOpen] = useState(false);
     const handleSetMenuRef = useCallback((ref) => {
-        var _a;
-        if (!((_a = ref === null || ref === void 0 ? void 0 : ref.menu) === null || _a === void 0 ? void 0 : _a.list))
+        if (!ref?.menu?.list)
             return;
         if (menuRefProp) {
             menuRefProp(ref.menu.list);
@@ -50,7 +39,11 @@ export const ModalSelect = (props) => {
         if (onOk)
             onOk(e, selected);
     };
-    return (React.createElement(StyledModal, Object.assign({}, rest, { open: open, onOk: handleOk, okButtonProps: Object.assign(Object.assign({}, okButtonProps), { className: `${okButtonProps.className} ok-btn` }), cancelButtonProps: Object.assign(Object.assign({}, cancelButtonProps), { className: `${cancelButtonProps.className} cancel-btn` }), title: title || 'Select' }),
-        React.createElement(Menu, { ref: handleSetMenuRef, items: options, selectedKeys: [selected || ''], onClick: info => handleClickItem(info.key) }),
-        React.createElement("div", Object.assign({}, contentWrapperProps, { className: clsx(contentWrapperProps === null || contentWrapperProps === void 0 ? void 0 : contentWrapperProps.className, 'ModalSelect-content') }), renderContent())));
+    return (_jsxs(StyledModal, { ...rest, open: open, onOk: handleOk, okButtonProps: {
+            ...okButtonProps,
+            className: `${okButtonProps.className} ok-btn`,
+        }, cancelButtonProps: {
+            ...cancelButtonProps,
+            className: `${cancelButtonProps.className} cancel-btn`,
+        }, title: title || 'Select', children: [_jsx(Menu, { ref: handleSetMenuRef, items: options, selectedKeys: [selected || ''], onClick: info => handleClickItem(info.key) }), _jsx("div", { ...contentWrapperProps, className: clsx(contentWrapperProps?.className, 'ModalSelect-content'), children: renderContent() })] }));
 };