@antscorp/antsomi-ui 1.3.5-beta.72 → 1.3.5-beta.721

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

@@ -0,0 +1,48 @@
+import React from 'react';
+import { AccountSelectionProps } from '../AccountSelection';
+import { AccountSharingProps } from '../../organism';
+import { IHelpProps } from '../../organism/Help/types';
+import { TEnv } from '@antscorp/antsomi-ui/es/types/config';
+interface Breadcrumb {
+    title: string;
+    link?: string;
+    useExternalLink?: boolean;
+}
+export interface HeaderV2Props {
+    show?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    pageTitle?: string | React.ReactNode;
+    breadcrumbs?: Breadcrumb[];
+    showLogo?: boolean;
+    accountSelection?: Omit<AccountSelectionProps, 'onChange' | 'apiConfig'> & {
+        onSelectAccount?: (userId: string) => void;
+    };
+    helpConfig: Omit<IHelpProps, 'configs'> & {
+        configs: Omit<IHelpProps['configs'], 'portalId' | 'userId' | 'token' | 'domain' | 'domainTicket' | 'domainPlatform'>;
+    } & {
+        show?: boolean;
+    };
+    notificationConfig?: {
+        show?: boolean;
+    };
+    accountSharingConfig: Pick<AccountSharingProps, 'isShowSharing' | 'isShareAccountAccess' | 'u_ogs' | 'appCode' | 'callbackLogout' | 'callbackGetInfoAccount'> & {
+        show?: boolean;
+    };
+    useURLParam?: boolean;
+    rightContent?: React.ReactNode;
+    config?: {
+        env?: TEnv;
+        language?: string;
+        userId?: number;
+        portalId?: number;
+        token?: string;
+        appCode?: string;
+        menuCode?: string;
+        permissionDomain?: string;
+        iamDomain?: string;
+    };
+    onCLickLogo?: () => void;
+}
+export declare const HeaderV2: React.FC<HeaderV2Props>;
+export {};

package/es/components/molecules/HeaderV2/HeaderV2.js

@@ -0,0 +1,130 @@
+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, { memo, useLayoutEffect, useMemo, useState } from 'react';
+import { Link, useLocation } from 'react-router-dom';
+// Hooks
+// Styled
+import { HeaderV2Styled, LogoWrapper } from './styled';
+// Components
+import { AccountSelection } from '../AccountSelection';
+import { AccountSharing, Help, Notification, } from '../../organism';
+// Constants
+import { APP_CODES, APP_PERMISSION_DOMAIN, CDP_API, IAM_API, ISSUE_API, PERMISSION_API, PLATFORM_API, PORTALS_IDS, SOCKET_API, } from '@antscorp/antsomi-ui/es/constants';
+import { useContextSelector } from 'use-context-selector';
+import { AppConfigContext, Flex } from '../../..';
+import { isNil } from 'lodash';
+import { useCustomRouter } from '@antscorp/antsomi-ui/es/hooks';
+const SubLogoAntsomi = 'https://st-media-template.antsomi.com/icons/antsomi/antsomi.png';
+const { DATAFLOWS, APP_ANTALYSER } = APP_CODES;
+// const DOUBLE_RIGHT_POINTING = '&raquo;'
+export const HeaderV2 = memo(props => {
+    var _a;
+    const { auth, env: envContext, languageCode = 'en', appCode: contextAppCode, urlLogout: urlLogoutProvider = '', menuCode: contextMenuCode, } = useContextSelector(AppConfigContext, state => state);
+    const { search } = useLocation();
+    const { replace } = useCustomRouter();
+    // * Prefer to use Header in AppConfigContext
+    const { show = true, className, style, breadcrumbs, showLogo = false, rightContent, pageTitle = '', accountSelection = {}, helpConfig, notificationConfig = {}, accountSharingConfig, useURLParam, config, onCLickLogo, } = props;
+    /** General config for children component */
+    const { env = envContext, language = languageCode, userId = isNaN(Number(auth === null || auth === void 0 ? void 0 : auth.userId)) ? 0 : Number(auth === null || auth === void 0 ? void 0 : auth.userId), portalId = auth === null || auth === void 0 ? void 0 : auth.portalId, token = auth === null || auth === void 0 ? void 0 : auth.token, permissionDomain = PERMISSION_API, iamDomain = IAM_API, appCode = contextAppCode, menuCode = contextMenuCode, } = config || {};
+    const { currentAccount, inputStyle = 'select', onSelectAccount } = accountSelection, accountSelectionProps = __rest(accountSelection, ["currentAccount", "inputStyle", "onSelectAccount"]);
+    const urlParams = useMemo(() => new URLSearchParams(search), [search]);
+    const oidParam = urlParams.get('oid') || currentAccount || 'all';
+    const [selectedAccount, setSelectedAccount] = useState(`${useURLParam ? oidParam : `${(_a = currentAccount !== null && currentAccount !== void 0 ? currentAccount : userId) !== null && _a !== void 0 ? _a : 'all'}`}`);
+    useLayoutEffect(() => {
+        if (useURLParam)
+            setSelectedAccount(oidParam);
+    }, [oidParam, useURLParam]);
+    // Memo
+    const accountSelectionDomain = useMemo(() => {
+        var _a;
+        if (portalId !== PORTALS_IDS.SANDBOX_76753)
+            return CDP_API[env || 'development'];
+        switch (appCode) {
+            case DATAFLOWS:
+            case APP_ANTALYSER:
+                return (_a = APP_PERMISSION_DOMAIN[appCode || '']) === null || _a === void 0 ? void 0 : _a[env || ''];
+            default:
+                return CDP_API[env || 'development'];
+        }
+    }, [portalId, env, appCode]);
+    if (!env || !language || !userId || !portalId || !token)
+        return null;
+    const { show: showHelp = true, configs } = helpConfig, helpProps = __rest(helpConfig, ["show", "configs"]);
+    const { show: showNotification = true } = notificationConfig;
+    const { show: showAccountSharing = true, isShowSharing = true, isShareAccountAccess = true } = accountSharingConfig, accountSharingProps = __rest(accountSharingConfig, ["show", "isShowSharing", "isShareAccountAccess"]);
+    const accountSelectionApiConfig = {
+        domain: accountSelectionDomain,
+        permissionDomain,
+        languageCode: language,
+        userId,
+        portalId,
+        token,
+        appCode,
+        menuCode,
+    };
+    const helpConfigProps = Object.assign(Object.assign({}, configs), { portalId: portalId.toString(), userId: userId.toString(), token, domain: CDP_API[env], domainTicket: ISSUE_API[env], domainPlatform: PLATFORM_API, config: Object.assign(Object.assign({}, configs.config), { user_language: language }) });
+    const notificationConfigProps = {
+        accountId: userId,
+        networkId: portalId,
+        token,
+        lang: language,
+        permissionDomain,
+        socketDomain: SOCKET_API,
+    };
+    const accountSharingPropsFormatted = {
+        permissionDomain,
+        iamDomain,
+        accountId: userId,
+        networkId: portalId,
+        // NOTE: old edit link
+        urlEditProfile: `${permissionDomain}/${portalId}#/account/profile/`,
+        // urlEditProfile: `${permissionDomain}/${portalId}#/${userId}/permission/account?ui=drawer-detail&accountId=${userId}&tab=settings`,
+        // 6006 is storybook port so direct to sandbox page
+        urlLogout: urlLogoutProvider || window.location.origin,
+        // urlLogout: window.location.origin,
+        token,
+        lang: language,
+    };
+    const handleChangeAccount = (userId) => {
+        setSelectedAccount(userId);
+        if (useURLParam) {
+            if (userId === 'all') {
+                urlParams.delete('oid');
+            }
+            else {
+                urlParams.set('oid', userId);
+            }
+            replace({ search: urlParams.toString() });
+        }
+        onSelectAccount === null || onSelectAccount === void 0 ? void 0 : onSelectAccount(userId);
+    };
+    const QUOTE_ENTITY = React.createElement(React.Fragment, null, "\u00BB");
+    return (React.createElement(HeaderV2Styled, { "$show": show, className: className || '', style: style },
+        React.createElement("div", { className: "left-side" },
+            showLogo && (React.createElement(LogoWrapper, { className: "logo-wrapper", onClick: onCLickLogo },
+                React.createElement("img", { src: SubLogoAntsomi, alt: "Antsomi sub logo" }))),
+            React.createElement(AccountSelection, Object.assign({}, accountSelectionProps, { currentAccount: selectedAccount, apiConfig: accountSelectionApiConfig, onChange: handleChangeAccount, inputStyle: inputStyle, refreshOnSelect: true })),
+            React.createElement("div", { className: "title-container", "data-test": "page-title" },
+                breadcrumbs ? (React.createElement("div", { className: "header-breadcrumbs", "data-test": "breadcrumbs" }, breadcrumbs.map((item, index) => (React.createElement(React.Fragment, { key: `${item.title}_${item.link}` },
+                    isNil(item.useExternalLink) && !item.useExternalLink ? (React.createElement(Link, { to: item.link || '', className: "header-breadcrumbs__item" }, item.title)) : (React.createElement("a", { href: item.link, className: "header-breadcrumbs__item" }, item.title)),
+                    breadcrumbs.length === index + 1 ? null : React.createElement(React.Fragment, null,
+                        "\u2002",
+                        QUOTE_ENTITY,
+                        "\u2002")))))) : null,
+                typeof pageTitle === 'string' ? (React.createElement("div", { className: "page-title" }, pageTitle)) : (pageTitle))),
+        React.createElement("div", { "data-test": "header-menu", className: "right-side" },
+            React.createElement(Flex, { gap: 10 },
+                rightContent,
+                showHelp ? React.createElement(Help, Object.assign({ configs: helpConfigProps }, helpProps)) : null,
+                showNotification ? React.createElement(Notification, Object.assign({}, notificationConfigProps)) : null),
+            showAccountSharing ? (React.createElement(AccountSharing, Object.assign({ isShowSharing: isShowSharing, isShareAccountAccess: isShareAccountAccess }, accountSharingPropsFormatted, accountSharingProps))) : null)));
+});

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

@@ -0,0 +1 @@
+export declare const HEADER_HEIGHT = 57;

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

@@ -0,0 +1 @@
+export const HEADER_HEIGHT = 57;

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

@@ -0,0 +1 @@
+export { HeaderV2, type HeaderV2Props } from './HeaderV2';

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

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

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

@@ -0,0 +1,4 @@
+export declare const LogoWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const HeaderV2Styled: import("styled-components").StyledComponent<"div", any, {
+    $show: boolean;
+}, never>;

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

@@ -0,0 +1,77 @@
+var _a, _b, _c;
+// Libraries
+import styled from 'styled-components';
+// Constants
+import { THEME, globalToken } from '@antscorp/antsomi-ui/es/constants';
+export const LogoWrapper = styled.div `
+  height: 30px;
+  width: 30px;
+  cursor: pointer;
+
+  img {
+    height: 100%;
+    width: 100%;
+  }
+`;
+export const HeaderV2Styled = styled.div `
+  height: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.headerHeight};
+  background-color: #f6f8fc;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px 20px;
+  box-sizing: border-box;
+
+  ${props => !props.$show && 'display: none;'}
+
+  .left-side,
+  .right-side {
+    display: flex;
+    align-items: center;
+    gap: 15px;
+  }
+
+  .left-side {
+    flex: 1;
+    overflow: hidden;
+
+    .logo-wrapper {
+      flex-shrink: 0;
+    }
+
+    .title-container {
+      flex: 1;
+      min-width: 0;
+      /* &:has(.header-breadcrumbs) {
+        height: 37px;
+      } */
+      input.antsomi-input {
+        height: 23px;
+      }
+    }
+  }
+
+  .header-breadcrumbs,
+  .header-breadcrumbs__item {
+    font-size: 12px;
+    line-height: 14px;
+    font-weight: bold;
+    color: ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.bw7};
+    user-select: none;
+  }
+
+  .header-breadcrumbs__item {
+    cursor: pointer;
+    &:hover {
+      color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.colorText};
+    }
+  }
+
+  .page-title {
+    font-size: 20px;
+    line-height: 23px;
+    height: 23px;
+    font-weight: bold;
+    color: ${globalToken === null || globalToken === void 0 ? void 0 : globalToken.colorTextBase};
+  }
+`;

package/es/components/molecules/IconSelection/components/Icon/index.js

@@ -16,7 +16,7 @@ export const IconSelectionRenderer = forwardRef((props, ref) => {
     const { iconType } = props;
     if (iconType === ICON_TYPE.FONT_AWESOME) {
         const { iconName, iconType } = props, rest = __rest(props, ["iconName", "iconType"]);
-        return React.createElement(FontAwesomeIcon, Object.assign({ ref: ref }, rest, { icon: iconName.split(' ') }));
+        return (React.createElement(FontAwesomeIcon, Object.assign({ ref: ref }, rest, { icon: iconName.split(' ') })));
     }
     if (iconType === ICON_TYPE.CUSTOM) {
         const { iconName, iconType } = props, rest = __rest(props, ["iconName", "iconType"]);

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { IconProps } from '@antscorp/antsomi-ui/es/components/icons/type';
+import { IconProps } from '@antscorp/antsomi-ui/es/components/icons/types';
 export declare const CUS_ICON_MAPPING: {
     [k: string]: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 };

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

@@ -1,35 +1,35 @@
 var _a, _b, _c, _d;
-import { AddShoppingCart, DesktopWindows, FactCheck, HighlightAlt, Payment, RemoveShoppingCart, ShoppingBag, ShoppingCart, Store, WebAsset, List, ConfirmationNumber, Search, PhoneCallback, Call, HowToReg, ChatBubbleOutline, PersonAddDisabled, AssignmentInd, AccountCircle, NotificationsActive, RemoveRedEye, MobileFriendly, Category, Redeem, Preview, Interactive, Web, LocalMallIcon, } from '@antscorp/antsomi-ui/es/components/icons';
+import { AddShoppingCartIcon, DesktopWindowsIcon, FactCheckIcon, HighlightAltIcon, PaymentIcon, RemoveShoppingCartIcon, ShoppingBagIcon, ShoppingCartIcon, StoreIcon, WebAssetIcon, ListIcon, ConfirmationNumberIcon, SearchIcon, PhoneCallbackIcon, CallIcon, HowToRegIcon, ChatBubbleOutlineIcon, PersonAddDisabledIcon, AssignmentIndIcon, AccountCircleIcon, NotificationsActiveIcon, RemoveRedEyeIcon, MobileFriendlyIcon, CategoryIcon, RedeemIcon, PreviewIcon, InteractiveIcon, WebIcon, LocalMallIcon, } from '@antscorp/antsomi-ui/es/components/icons';
 import { THEME } from '@antscorp/antsomi-ui/es/constants';
 export const CUS_ICON_MAPPING = {
-    highlight_alt: HighlightAlt,
-    desktop_windows: DesktopWindows,
-    add_shopping_cart: AddShoppingCart,
-    remove_shopping_cart: RemoveShoppingCart,
-    shopping_cart: ShoppingCart,
-    fact_check: FactCheck,
-    payment: Payment,
-    shopping_bag: ShoppingBag,
-    store: Store,
-    web_asset: WebAsset,
-    search: Search,
-    list: List,
-    confirmation_number: ConfirmationNumber,
-    phone_callback: PhoneCallback,
-    call: Call,
-    how_to_reg: HowToReg,
-    chat_bubble_outline: ChatBubbleOutline,
-    person_add_disabled: PersonAddDisabled,
-    assignment_ind: AssignmentInd,
-    account_circle: AccountCircle,
-    notifications_active: NotificationsActive,
-    remove_red_eye: RemoveRedEye,
-    mobile_friendly: MobileFriendly,
-    category: Category,
-    redeem: Redeem,
-    preview: Preview,
-    interactive: Interactive,
-    web: Web,
+    highlight_alt: HighlightAltIcon,
+    desktop_windows: DesktopWindowsIcon,
+    add_shopping_cart: AddShoppingCartIcon,
+    remove_shopping_cart: RemoveShoppingCartIcon,
+    shopping_cart: ShoppingCartIcon,
+    fact_check: FactCheckIcon,
+    payment: PaymentIcon,
+    shopping_bag: ShoppingBagIcon,
+    store: StoreIcon,
+    web_asset: WebAssetIcon,
+    search: SearchIcon,
+    list: ListIcon,
+    confirmation_number: ConfirmationNumberIcon,
+    phone_callback: PhoneCallbackIcon,
+    call: CallIcon,
+    how_to_reg: HowToRegIcon,
+    chat_bubble_outline: ChatBubbleOutlineIcon,
+    person_add_disabled: PersonAddDisabledIcon,
+    assignment_ind: AssignmentIndIcon,
+    account_circle: AccountCircleIcon,
+    notifications_active: NotificationsActiveIcon,
+    remove_red_eye: RemoveRedEyeIcon,
+    mobile_friendly: MobileFriendlyIcon,
+    category: CategoryIcon,
+    redeem: RedeemIcon,
+    preview: PreviewIcon,
+    interactive: InteractiveIcon,
+    web: WebIcon,
     local_mall: LocalMallIcon,
 };
 export const ANTD_ICONS = 'StepBackwardOutlined|StepForwardOutlined|FastBackwardOutlined|FastForwardOutlined|ShrinkOutlined|ArrowsAltOutlined|DownOutlined|UpOutlined|LeftOutlined|RightOutlined|CaretUpOutlined|CaretDownOutlined|CaretLeftOutlined|CaretRightOutlined|UpCircleOutlined|DownCircleOutlined|LeftCircleOutlined|RightCircleOutlined|DoubleRightOutlined|DoubleLeftOutlined|VerticalLeftOutlined|VerticalRightOutlined|VerticalAlignTopOutlined|VerticalAlignMiddleOutlined|VerticalAlignBottomOutlined|ForwardOutlined|BackwardOutlined|RollbackOutlined|EnterOutlined|RetweetOutlined|SwapOutlined|SwapLeftOutlined|SwapRightOutlined|ArrowUpOutlined|ArrowDownOutlined|ArrowLeftOutlined|ArrowRightOutlined|PlayCircleOutlined|UpSquareOutlined|DownSquareOutlined|LeftSquareOutlined|RightSquareOutlined|LoginOutlined|LogoutOutlined|MenuFoldOutlined|MenuUnfoldOutlined|BorderBottomOutlined|BorderHorizontalOutlined|BorderInnerOutlined|BorderOuterOutlined|BorderLeftOutlined|BorderRightOutlined|BorderTopOutlined|BorderVerticleOutlined|PicCenterOutlined|PicLeftOutlined|PicRightOutlined|RadiusBottomleftOutlined|RadiusBottomrightOutlined|RadiusUpleftOutlined|RadiusUprightOutlined|FullscreenOutlined|FullscreenExitOutlined|QuestionOutlined|QuestionCircleOutlined|PlusOutlined|PlusCircleOutlined|PauseOutlined|PauseCircleOutlined|MinusOutlined|MinusCircleOutlined|PlusSquareOutlined|MinusSquareOutlined|InfoOutlined|InfoCircleOutlined|ExclamationOutlined|ExclamationCircleOutlined|CloseOutlined|CloseCircleOutlined|CloseSquareOutlined|CheckOutlined|CheckCircleOutlined|CheckSquareOutlined|ClockCircleOutlined|WarningOutlined|IssuesCloseOutlined|StopOutlined|EditOutlined|FormOutlined|CopyOutlined|ScissorOutlined|DeleteOutlined|SnippetsOutlined|DiffOutlined|HighlightOutlined|AlignCenterOutlined|AlignLeftOutlined|AlignRightOutlined|BgColorsOutlined|BoldOutlined|ItalicOutlined|UnderlineOutlined|StrikethroughOutlined|RedoOutlined|UndoOutlined|ZoomInOutlined|ZoomOutOutlined|FontColorsOutlined|FontSizeOutlined|LineHeightOutlined|DashOutlined|SmallDashOutlined|SortAscendingOutlined|SortDescendingOutlined|DragOutlined|OrderedListOutlined|UnorderedListOutlined|RadiusSettingOutlined|ColumnWidthOutlined|ColumnHeightOutlined|AreaChartOutlined|PieChartOutlined|BarChartOutlined|DotChartOutlined|LineChartOutlined|RadarChartOutlined|HeatMapOutlined|FallOutlined|RiseOutlined|StockOutlined|BoxPlotOutlined|FundOutlined|SlidersOutlined|AndroidOutlined|AppleOutlined|WindowsOutlined|IeOutlined|ChromeOutlined|GithubOutlined|AliwangwangOutlined|DingdingOutlined|WeiboSquareOutlined|WeiboCircleOutlined|TaobaoCircleOutlined|Html5Outlined|WeiboOutlined|TwitterOutlined|WechatOutlined|YoutubeOutlined|AlipayCircleOutlined|TaobaoOutlined|SkypeOutlined|QqOutlined|MediumWorkmarkOutlined|GitlabOutlined|MediumOutlined|LinkedinOutlined|GooglePlusOutlined|DropboxOutlined|FacebookOutlined|CodepenOutlined|CodeSandboxOutlined|AmazonOutlined|GoogleOutlined|CodepenCircleOutlined|AlipayOutlined|AntDesignOutlined|AntCloudOutlined|AliyunOutlined|ZhihuOutlined|SlackOutlined|SlackSquareOutlined|BehanceOutlined|BehanceSquareOutlined|DribbbleOutlined|DribbbleSquareOutlined|InstagramOutlined|YuqueOutlined|AlibabaOutlined|YahooOutlined|RedditOutlined|SketchOutlined|AccountBookOutlined|AimOutlined|AlertOutlined|ApartmentOutlined|ApiOutlined|AppstoreAddOutlined|AppstoreOutlined|AudioOutlined|AudioMutedOutlined|AuditOutlined|BankOutlined|BarcodeOutlined|BarsOutlined|BellOutlined|BlockOutlined|BookOutlined|BorderOutlined|BorderlessTableOutlined|BranchesOutlined|BugOutlined|BuildOutlined|BulbOutlined|CalculatorOutlined|CalendarOutlined|CameraOutlined|CarOutlined|CarryOutOutlined|CiCircleOutlined|CiOutlined|ClearOutlined|CloudDownloadOutlined|CloudOutlined|CloudServerOutlined|CloudSyncOutlined|CloudUploadOutlined|ClusterOutlined|CodeOutlined|CoffeeOutlined|CommentOutlined|CompassOutlined|CompressOutlined|ConsoleSqlOutlined|ContactsOutlined|ContainerOutlined|ControlOutlined|CopyrightOutlined|CreditCardOutlined|CrownOutlined|CustomerServiceOutlined|DashboardOutlined|DatabaseOutlined|DeleteColumnOutlined|DeleteRowOutlined|DeliveredProcedureOutlined|DeploymentUnitOutlined|DesktopOutlined|DingtalkOutlined|DisconnectOutlined|DislikeOutlined|DollarCircleOutlined|DollarOutlined|DownloadOutlined|EllipsisOutlined|EnvironmentOutlined|EuroCircleOutlined|EuroOutlined|ExceptionOutlined|ExpandAltOutlined|ExpandOutlined|ExperimentOutlined|ExportOutlined|EyeOutlined|EyeInvisibleOutlined|FieldBinaryOutlined|FieldNumberOutlined|FieldStringOutlined|FieldTimeOutlined|FileAddOutlined|FileDoneOutlined|FileExcelOutlined|FileExclamationOutlined|FileOutlined|FileGifOutlined|FileImageOutlined|FileJpgOutlined|FileMarkdownOutlined|FilePdfOutlined|FilePptOutlined|FileProtectOutlined|FileSearchOutlined|FileSyncOutlined|FileTextOutlined|FileUnknownOutlined|FileWordOutlined|FileZipOutlined|FilterOutlined|FireOutlined|FlagOutlined|FolderAddOutlined|FolderOutlined|FolderOpenOutlined|FolderViewOutlined|ForkOutlined|FormatPainterOutlined|FrownOutlined|FunctionOutlined|FundProjectionScreenOutlined|FundViewOutlined|FunnelPlotOutlined|GatewayOutlined|GifOutlined|GiftOutlined|GlobalOutlined|GoldOutlined|GroupOutlined|HddOutlined|HeartOutlined|HistoryOutlined|HolderOutlined|HomeOutlined|HourglassOutlined|IdcardOutlined|ImportOutlined|InboxOutlined|InsertRowAboveOutlined|InsertRowBelowOutlined|InsertRowLeftOutlined|InsertRowRightOutlined|InsuranceOutlined|InteractionOutlined|KeyOutlined|LaptopOutlined|LayoutOutlined|LikeOutlined|LineOutlined|LinkOutlined|Loading3QuartersOutlined|LoadingOutlined|LockOutlined|MacCommandOutlined|MailOutlined|ManOutlined|MedicineBoxOutlined|MehOutlined|MenuOutlined|MergeCellsOutlined|MessageOutlined|MobileOutlined|MoneyCollectOutlined|MonitorOutlined|MoreOutlined|NodeCollapseOutlined|NodeExpandOutlined|NodeIndexOutlined|NotificationOutlined|NumberOutlined|OneToOneOutlined|PaperClipOutlined|PartitionOutlined|PayCircleOutlined|PercentageOutlined|PhoneOutlined|PictureOutlined|PlaySquareOutlined|PoundCircleOutlined|PoundOutlined|PoweroffOutlined|PrinterOutlined|ProfileOutlined|ProjectOutlined|PropertySafetyOutlined|PullRequestOutlined|PushpinOutlined|QrcodeOutlined|ReadOutlined|ReconciliationOutlined|RedEnvelopeOutlined|ReloadOutlined|RestOutlined|RobotOutlined|RocketOutlined|RotateLeftOutlined|RotateRightOutlined|SafetyCertificateOutlined|SafetyOutlined|SaveOutlined|ScanOutlined|ScheduleOutlined|SearchOutlined|SecurityScanOutlined|SelectOutlined|SendOutlined|SettingOutlined|ShakeOutlined|ShareAltOutlined|ShopOutlined|ShoppingCartOutlined|ShoppingOutlined|SisternodeOutlined|SkinOutlined|SmileOutlined|SolutionOutlined|SoundOutlined|SplitCellsOutlined|StarOutlined|SubnodeOutlined|SwitcherOutlined|SyncOutlined|TableOutlined|TabletOutlined|TagOutlined|TagsOutlined|TeamOutlined|ThunderboltOutlined|ToTopOutlined|ToolOutlined|TrademarkCircleOutlined|TrademarkOutlined|TransactionOutlined|TranslationOutlined|TrophyOutlined|UngroupOutlined|UnlockOutlined|UploadOutlined|UsbOutlined|UserAddOutlined|UserDeleteOutlined|UserOutlined|UserSwitchOutlined|UsergroupAddOutlined|UsergroupDeleteOutlined|VerifiedOutlined|VideoCameraAddOutlined|VideoCameraOutlined|WalletOutlined|WhatsAppOutlined|WifiOutlined|WomanOutlined|StepBackwardFilled|StepForwardFilled|FastBackwardFilled|FastForwardFilled|CaretUpFilled|CaretDownFilled|CaretLeftFilled|CaretRightFilled|UpCircleFilled|DownCircleFilled|LeftCircleFilled|RightCircleFilled|ForwardFilled|BackwardFilled|PlayCircleFilled|UpSquareFilled|DownSquareFilled|LeftSquareFilled|RightSquareFilled|QuestionCircleFilled|PlusCircleFilled|PauseCircleFilled|MinusCircleFilled|PlusSquareFilled|MinusSquareFilled|InfoCircleFilled|ExclamationCircleFilled|CloseCircleFilled|CloseSquareFilled|CheckCircleFilled|CheckSquareFilled|ClockCircleFilled|WarningFilled|StopFilled|EditFilled|CopyFilled|DeleteFilled|SnippetsFilled|DiffFilled|HighlightFilled|PieChartFilled|BoxPlotFilled|FundFilled|SlidersFilled|AndroidFilled|AppleFilled|WindowsFilled|ChromeFilled|GithubFilled|AliwangwangFilled|WeiboSquareFilled|WeiboCircleFilled|TaobaoCircleFilled|Html5Filled|WechatFilled|YoutubeFilled|AlipayCircleFilled|SkypeFilled|GitlabFilled|LinkedinFilled|FacebookFilled|CodeSandboxCircleFilled|CodepenCircleFilled|SlackSquareFilled|BehanceSquareFilled|DribbbleSquareFilled|InstagramFilled|YuqueFilled|YahooFilled|AccountBookFilled|AlertFilled|AlipaySquareFilled|AmazonCircleFilled|AmazonSquareFilled|ApiFilled|AppstoreFilled|AudioFilled|BankFilled|BehanceCircleFilled|BellFilled|BookFilled|BugFilled|BuildFilled|BulbFilled|CalculatorFilled|CalendarFilled|CameraFilled|CarFilled|CarryOutFilled|CiCircleFilled|CloudFilled|CodeFilled|CodeSandboxSquareFilled|CodepenSquareFilled|CompassFilled|ContactsFilled|ContainerFilled|ControlFilled|CreditCardFilled|CrownFilled|CustomerServiceFilled|DashboardFilled|DatabaseFilled|DingtalkCircleFilled|DingtalkSquareFilled|DislikeFilled|DollarCircleFilled|DribbbleCircleFilled|DropboxCircleFilled|DropboxSquareFilled|EnvironmentFilled|EuroCircleFilled|ExperimentFilled|EyeFilled|EyeInvisibleFilled|FileAddFilled|FileExcelFilled|FileExclamationFilled|FileFilled|FileImageFilled|FileMarkdownFilled|FilePdfFilled|FilePptFilled|FileTextFilled|FileUnknownFilled|FileWordFilled|FileZipFilled|FilterFilled|FireFilled|FlagFilled|FolderAddFilled|FolderFilled|FolderOpenFilled|FormatPainterFilled|FrownFilled|FunnelPlotFilled|GiftFilled|GoldFilled|GoldenFilled|GoogleCircleFilled|GooglePlusCircleFilled|GooglePlusSquareFilled|GoogleSquareFilled|HddFilled|HeartFilled|HomeFilled|HourglassFilled|IdcardFilled|IeCircleFilled|IeSquareFilled|InsuranceFilled|InteractionFilled|LayoutFilled|LikeFilled|LockFilled|MacCommandFilled|MailFilled|MedicineBoxFilled|MediumCircleFilled|MediumSquareFilled|MehFilled|MessageFilled|MobileFilled|MoneyCollectFilled|NotificationFilled|PayCircleFilled|PhoneFilled|PictureFilled|PlaySquareFilled|PoundCircleFilled|PrinterFilled|ProfileFilled|ProjectFilled|PropertySafetyFilled|PushpinFilled|QqCircleFilled|QqSquareFilled|ReadFilled|ReconciliationFilled|RedEnvelopeFilled|RedditCircleFilled|RedditSquareFilled|RestFilled|RobotFilled|RocketFilled|SafetyCertificateFilled|SaveFilled|ScheduleFilled|SecurityScanFilled|SettingFilled|ShopFilled|ShoppingFilled|SignalFilled|SketchCircleFilled|SketchSquareFilled|SkinFilled|SlackCircleFilled|SmileFilled|SoundFilled|StarFilled|SwitcherFilled|TabletFilled|TagFilled|TagsFilled|TaobaoSquareFilled|ThunderboltFilled|ToolFilled|TrademarkCircleFilled|TrophyFilled|TwitterCircleFilled|TwitterSquareFilled|UnlockFilled|UsbFilled|VideoCameraFilled|WalletFilled|ZhihuCircleFilled|ZhihuSquareFilled|UpCircleTwoTone|DownCircleTwoTone|LeftCircleTwoTone|RightCircleTwoTone|PlayCircleTwoTone|UpSquareTwoTone|DownSquareTwoTone|LeftSquareTwoTone|RightSquareTwoTone|QuestionCircleTwoTone|PlusCircleTwoTone|PauseCircleTwoTone|MinusCircleTwoTone|PlusSquareTwoTone|MinusSquareTwoTone|InfoCircleTwoTone|ExclamationCircleTwoTone|CloseCircleTwoTone|CloseSquareTwoTone|CheckCircleTwoTone|CheckSquareTwoTone|ClockCircleTwoTone|WarningTwoTone|StopTwoTone|EditTwoTone|CopyTwoTone|DeleteTwoTone|SnippetsTwoTone|DiffTwoTone|HighlightTwoTone|PieChartTwoTone|BoxPlotTwoTone|FundTwoTone|SlidersTwoTone|Html5TwoTone|AccountBookTwoTone|AlertTwoTone|ApiTwoTone|AppstoreTwoTone|AudioTwoTone|BankTwoTone|BellTwoTone|BookTwoTone|BugTwoTone|BuildTwoTone|BulbTwoTone|CalculatorTwoTone|CalendarTwoTone|CameraTwoTone|CarTwoTone|CarryOutTwoTone|CiCircleTwoTone|CiTwoTone|CloudTwoTone|CodeTwoTone|CompassTwoTone|ContactsTwoTone|ContainerTwoTone|ControlTwoTone|CopyrightTwoTone|CreditCardTwoTone|CrownTwoTone|CustomerServiceTwoTone|DashboardTwoTone|DatabaseTwoTone|DislikeTwoTone|DollarCircleTwoTone|DollarTwoTone|EnvironmentTwoTone|EuroCircleTwoTone|EuroTwoTone|ExperimentTwoTone|EyeTwoTone|EyeInvisibleTwoTone|FileAddTwoTone|FileExcelTwoTone|FileExclamationTwoTone|FileTwoTone|FileImageTwoTone|FileMarkdownTwoTone|FilePdfTwoTone|FilePptTwoTone|FileTextTwoTone|FileUnknownTwoTone|FileWordTwoTone|FileZipTwoTone|FilterTwoTone|FireTwoTone|FlagTwoTone|FolderAddTwoTone|FolderTwoTone|FolderOpenTwoTone|FrownTwoTone|FunnelPlotTwoTone|GiftTwoTone|GoldTwoTone|HddTwoTone|HeartTwoTone|HomeTwoTone|HourglassTwoTone|IdcardTwoTone|InsuranceTwoTone|InteractionTwoTone|LayoutTwoTone|LikeTwoTone|LockTwoTone|MailTwoTone|MedicineBoxTwoTone|MehTwoTone|MessageTwoTone|MobileTwoTone|MoneyCollectTwoTone|NotificationTwoTone|PhoneTwoTone|PictureTwoTone|PlaySquareTwoTone|PoundCircleTwoTone|PrinterTwoTone|ProfileTwoTone|ProjectTwoTone|PropertySafetyTwoTone|PushpinTwoTone|ReconciliationTwoTone|RedEnvelopeTwoTone|RestTwoTone|RocketTwoTone|SafetyCertificateTwoTone|SaveTwoTone|ScheduleTwoTone|SecurityScanTwoTone|SettingTwoTone|ShopTwoTone|ShoppingTwoTone|SkinTwoTone|SmileTwoTone|SoundTwoTone|StarTwoTone|SwitcherTwoTone|TabletTwoTone|TagTwoTone|TagsTwoTone|ThunderboltTwoTone|ToolTwoTone|TrademarkCircleTwoTone|TrophyTwoTone|UnlockTwoTone|UsbTwoTone|VideoCameraTwoTone|WalletTwoTone'.split('|');

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

@@ -2,7 +2,7 @@
 export declare const IconSelectionWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const WrapperListRender: import("styled-components").StyledComponent<"div", any, {}, never>;
 export declare const WrapperListItemRender: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const CustomButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("antd").ButtonProps & import("react").RefAttributes<HTMLElement>> & {
+export declare const CustomButton: 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 Overlay: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -0,0 +1,19 @@
+import React from 'react';
+import { CanvasState } from './reducer';
+export type ImageResizeHandle = {
+    getBase64: (options?: any) => string | undefined;
+    replaceImageWithUrl: (imageUrl: string) => void;
+    getCurrentState: () => CanvasState;
+};
+interface ImageEditorProps {
+    className?: string;
+    width: number;
+    height: number;
+    hideAction?: boolean;
+    imageUrl?: string;
+    defaultValue?: CanvasState;
+    showSelection?: boolean;
+    style?: Omit<React.CSSProperties, 'width'>;
+}
+export declare const ImageEditor: React.ForwardRefExoticComponent<ImageEditorProps & React.RefAttributes<ImageResizeHandle>>;
+export {};