@antscorp/antsomi-ui 1.3.3-beta.2 → 1.3.3-beta.21

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

@@ -1,143 +1,143 @@
-/* eslint-disable react/destructuring-assignment */
-// Libraries
-import React, { useState, useEffect, useCallback, useRef } from 'react';
-// Hooks
-import { useDeepCompareEffect } from '@antscorp/antsomi-ui/es/hooks';
-// Atoms
-import { Button, Icon, ScrollBox } from '@antscorp/antsomi-ui/es/components/atoms';
-// Molecules
-import { Modal, InputSearch } from '@antscorp/antsomi-ui/es/components/molecules';
-// Components
-import { IconSelectionRenderer } from './components/Icon';
-// Constants
-import { DEFAULT_UI_ICON_STYLES, LIMIT_ICONS_SHOW, LIST_ICON_BY_TYPE } from './constants';
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
-// Styled
-import { CustomButton, IconSelectionWrapper, Overlay, WrapperListItemRender, WrapperListRender, } from './styled';
-// Types
-import { isIconType } from './types';
-// Utils
-import { serializeIcon } from './utils';
-import clsx from 'clsx';
-export const IconSelection = props => {
-    var _a, _b;
-    const { labelHeadingModal = 'Icon Selection', searchPlaceholder = 'Search for icon...', wrapperClassName = '', className = '', style = {}, isOpen = false, limitShowIcon = LIMIT_ICONS_SHOW, iconTypes = ['font-awesome'], onChange, onRemoveIcon, onChangeSvg, } = props;
-    const [listIconsOriginal, setListIconsOriginal] = useState([]);
-    const [listIcons, setListIcons] = useState([]);
-    const [selectedIcon, setSelectedIcon] = useState(props.icon || '');
-    const [isOpenModal, setIsOpenModal] = useState(isOpen);
-    const [activeIcon, setActiveIcon] = useState('');
-    useDeepCompareEffect(() => {
-        const temp = Object.entries(LIST_ICON_BY_TYPE).reduce((acc, current) => {
-            const [iconType, icons] = current;
-            if (isIconType(iconType) && iconTypes.includes(iconType)) {
-                acc.push(...icons.map(icon => `${iconType} ${icon}`));
-            }
-            return acc;
-        }, []);
-        setListIconsOriginal(temp);
-        setListIcons(temp.slice(0, limitShowIcon));
-    }, [iconTypes, limitShowIcon]);
-    const iconRef = useRef(null);
-    useEffect(() => {
-        setSelectedIcon(props.icon || '');
-    }, [props.icon]);
-    const showModal = () => {
-        setIsOpenModal(true);
-    };
-    const handleCancel = () => {
-        setIsOpenModal(false);
-        setListIcons(listIconsOriginal.slice(0, limitShowIcon));
-    };
-    const handleSelectIcon = (icon) => {
-        var _a;
-        if (onChange) {
-            onChange(icon);
-        }
-        if (typeof onChangeSvg === 'function') {
-            onChangeSvg((_a = iconRef === null || iconRef === void 0 ? void 0 : iconRef.current) === null || _a === void 0 ? void 0 : _a.outerHTML);
-        }
-        setSelectedIcon(icon);
-        handleCancel();
-    };
-    const renderListIcons = (listIconsRender) => listIconsRender.map(icon => {
-        var _a;
-        const serializeResult = serializeIcon(icon);
-        if (serializeResult === null) {
-            return null;
-        }
-        const { iconType, iconName } = serializeResult;
-        return (React.createElement(WrapperListRender, { className: "ants-group", key: icon },
-            React.createElement(WrapperListItemRender, { className: "ants-hover" },
-                React.createElement(IconSelectionRenderer, Object.assign({ ref: activeIcon === iconName ? iconRef : undefined, iconType: iconType, iconName: iconName }, DEFAULT_UI_ICON_STYLES.LISTING[iconType])),
-                React.createElement(CustomButton, { onClick: () => handleSelectIcon(icon), onMouseEnter: onChangeSvg ? () => setActiveIcon(iconName) : undefined, className: "group-hover" }, "USE"),
-                React.createElement(Overlay, { className: "group-hover" })),
-            React.createElement("span", { style: {
-                    display: 'inline-block',
-                    marginTop: 5,
-                    width: '100%',
-                    fontSize: `${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.fontSize}px`,
-                } }, iconName)));
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    const handleSeachIcons = useCallback((value) => {
-        if (value && value.trim()) {
-            setListIcons(listIconsOriginal
-                .filter(icon => {
-                const serializeResult = serializeIcon(icon);
-                return (serializeResult &&
-                    serializeResult.iconName
-                        .toLocaleLowerCase()
-                        .includes(value.trim().toLocaleLowerCase()));
-            })
-                .slice(0, limitShowIcon));
-        }
-        else {
-            setListIcons(listIconsOriginal.slice(0, limitShowIcon));
-        }
-    }, [listIconsOriginal, limitShowIcon]);
-    const handleRemoveIcon = () => {
-        if (onRemoveIcon) {
-            onRemoveIcon();
-        }
-        if (typeof onChange === 'function') {
-            onChange('');
-        }
-        setSelectedIcon('');
-    };
-    const serializeSelectedIcon = serializeIcon(selectedIcon);
-    const renderSelectedIcon = () => {
-        if (serializeSelectedIcon) {
-            const { iconType, iconName } = serializeSelectedIcon;
-            return (React.createElement(IconSelectionRenderer, Object.assign({ iconType: iconType, iconName: iconName }, DEFAULT_UI_ICON_STYLES.SELECTED[iconType])));
-        }
-        return null;
-    };
-    return (React.createElement(IconSelectionWrapper, { style: style, className: clsx(wrapperClassName, className) },
-        React.createElement("div", { className: "transparent-wrapper" },
-            React.createElement("div", { style: { position: 'absolute', zIndex: 0 } }, renderSelectedIcon()),
-            serializeSelectedIcon ? (React.createElement(React.Fragment, null,
-                React.createElement(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' } }, "Change"),
-                React.createElement(Button, { onClick: handleRemoveIcon, style: { backgroundColor: '#ffffff' } },
-                    React.createElement(Icon, { type: "icon-ants-remove-trash", size: 15, style: { color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary } })))) : (React.createElement("div", { style: {
-                    display: 'flex',
-                    flexDirection: 'column',
-                    gap: '10px',
-                    alignItems: 'center',
-                    color: (_b = THEME.token) === null || _b === void 0 ? void 0 : _b.colorIcon,
-                } },
-                React.createElement(Icon, { type: "icon-ants-star", size: 30 }),
-                React.createElement(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' } }, "Select an icon")))),
-        React.createElement(Modal, { wrapClassName: "icons-selection-modal", title: React.createElement("div", { style: { display: 'flex', gap: '8px', alignItems: 'center' } },
-                React.createElement(Icon, { type: "icon-ants-emoji", size: 20 }),
-                labelHeadingModal), headerStyle: {
-                padding: '20px 20px 0',
-                border: 'none',
-            }, bodyStyle: {
-                padding: '17px 20px 20px',
-                width: 'fit-content',
-            }, width: "fit-content", footer: null, destroyOnClose: true, open: isOpenModal, onCancel: handleCancel },
-            React.createElement(InputSearch, { style: { width: 232 }, onAfterChange: handleSeachIcons, placeholder: searchPlaceholder }),
-            React.createElement("div", { style: { paddingTop: 28, width: 650 } },
-                React.createElement(ScrollBox, { height: 460, style: { display: 'flex', flexWrap: 'wrap', gap: '35px' } }, renderListIcons(listIcons))))));
-};
+/* eslint-disable react/destructuring-assignment */
+// Libraries
+import React, { useState, useEffect, useCallback, useRef } from 'react';
+// Hooks
+import { useDeepCompareEffect } from '@antscorp/antsomi-ui/es/hooks';
+// Atoms
+import { Button, Icon, ScrollBox } from '@antscorp/antsomi-ui/es/components/atoms';
+// Molecules
+import { Modal, InputSearch } from '@antscorp/antsomi-ui/es/components/molecules';
+// Components
+import { IconSelectionRenderer } from './components/Icon';
+// Constants
+import { DEFAULT_UI_ICON_STYLES, LIMIT_ICONS_SHOW, LIST_ICON_BY_TYPE } from './constants';
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+// Styled
+import { CustomButton, IconSelectionWrapper, Overlay, WrapperListItemRender, WrapperListRender, } from './styled';
+// Types
+import { isIconType } from './types';
+// Utils
+import { serializeIcon } from './utils';
+import clsx from 'clsx';
+export const IconSelection = props => {
+    var _a, _b;
+    const { labelHeadingModal = 'Icon Selection', searchPlaceholder = 'Search for icon...', wrapperClassName = '', className = '', style = {}, isOpen = false, limitShowIcon = LIMIT_ICONS_SHOW, iconTypes = ['font-awesome'], onChange, onRemoveIcon, onChangeSvg, } = props;
+    const [listIconsOriginal, setListIconsOriginal] = useState([]);
+    const [listIcons, setListIcons] = useState([]);
+    const [selectedIcon, setSelectedIcon] = useState(props.icon || '');
+    const [isOpenModal, setIsOpenModal] = useState(isOpen);
+    const [activeIcon, setActiveIcon] = useState('');
+    useDeepCompareEffect(() => {
+        const temp = Object.entries(LIST_ICON_BY_TYPE).reduce((acc, current) => {
+            const [iconType, icons] = current;
+            if (isIconType(iconType) && iconTypes.includes(iconType)) {
+                acc.push(...icons.map(icon => `${iconType} ${icon}`));
+            }
+            return acc;
+        }, []);
+        setListIconsOriginal(temp);
+        setListIcons(temp.slice(0, limitShowIcon));
+    }, [iconTypes, limitShowIcon]);
+    const iconRef = useRef(null);
+    useEffect(() => {
+        setSelectedIcon(props.icon || '');
+    }, [props.icon]);
+    const showModal = () => {
+        setIsOpenModal(true);
+    };
+    const handleCancel = () => {
+        setIsOpenModal(false);
+        setListIcons(listIconsOriginal.slice(0, limitShowIcon));
+    };
+    const handleSelectIcon = (icon) => {
+        var _a;
+        if (onChange) {
+            onChange(icon);
+        }
+        if (typeof onChangeSvg === 'function') {
+            onChangeSvg((_a = iconRef === null || iconRef === void 0 ? void 0 : iconRef.current) === null || _a === void 0 ? void 0 : _a.outerHTML);
+        }
+        setSelectedIcon(icon);
+        handleCancel();
+    };
+    const renderListIcons = (listIconsRender) => listIconsRender.map(icon => {
+        var _a;
+        const serializeResult = serializeIcon(icon);
+        if (serializeResult === null) {
+            return null;
+        }
+        const { iconType, iconName } = serializeResult;
+        return (React.createElement(WrapperListRender, { className: "ants-group", key: icon },
+            React.createElement(WrapperListItemRender, { className: "ants-hover" },
+                React.createElement(IconSelectionRenderer, Object.assign({ ref: activeIcon === iconName ? iconRef : undefined, iconType: iconType, iconName: iconName }, DEFAULT_UI_ICON_STYLES.LISTING[iconType])),
+                React.createElement(CustomButton, { onClick: () => handleSelectIcon(icon), onMouseEnter: onChangeSvg ? () => setActiveIcon(iconName) : undefined, className: "group-hover" }, "USE"),
+                React.createElement(Overlay, { className: "group-hover" })),
+            React.createElement("span", { style: {
+                    display: 'inline-block',
+                    marginTop: 5,
+                    width: '100%',
+                    fontSize: `${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.fontSize}px`,
+                } }, iconName)));
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    const handleSeachIcons = useCallback((value) => {
+        if (value && value.trim()) {
+            setListIcons(listIconsOriginal
+                .filter(icon => {
+                const serializeResult = serializeIcon(icon);
+                return (serializeResult &&
+                    serializeResult.iconName
+                        .toLocaleLowerCase()
+                        .includes(value.trim().toLocaleLowerCase()));
+            })
+                .slice(0, limitShowIcon));
+        }
+        else {
+            setListIcons(listIconsOriginal.slice(0, limitShowIcon));
+        }
+    }, [listIconsOriginal, limitShowIcon]);
+    const handleRemoveIcon = () => {
+        if (onRemoveIcon) {
+            onRemoveIcon();
+        }
+        if (typeof onChange === 'function') {
+            onChange('');
+        }
+        setSelectedIcon('');
+    };
+    const serializeSelectedIcon = serializeIcon(selectedIcon);
+    const renderSelectedIcon = () => {
+        if (serializeSelectedIcon) {
+            const { iconType, iconName } = serializeSelectedIcon;
+            return (React.createElement(IconSelectionRenderer, Object.assign({ iconType: iconType, iconName: iconName }, DEFAULT_UI_ICON_STYLES.SELECTED[iconType])));
+        }
+        return null;
+    };
+    return (React.createElement(IconSelectionWrapper, { style: style, className: clsx(wrapperClassName, className) },
+        React.createElement("div", { className: "transparent-wrapper" },
+            React.createElement("div", { style: { position: 'absolute', zIndex: 0 } }, renderSelectedIcon()),
+            serializeSelectedIcon ? (React.createElement(React.Fragment, null,
+                React.createElement(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' } }, "Change"),
+                React.createElement(Button, { onClick: handleRemoveIcon, style: { backgroundColor: '#ffffff' } },
+                    React.createElement(Icon, { type: "icon-ants-remove-trash", size: 15, style: { color: (_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary } })))) : (React.createElement("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: '10px',
+                    alignItems: 'center',
+                    color: (_b = THEME.token) === null || _b === void 0 ? void 0 : _b.colorIcon,
+                } },
+                React.createElement(Icon, { type: "icon-ants-star", size: 30 }),
+                React.createElement(Button, { onClick: showModal, style: { backgroundColor: '#ffffff' } }, "Select an icon")))),
+        React.createElement(Modal, { wrapClassName: "icons-selection-modal", title: React.createElement("div", { style: { display: 'flex', gap: '8px', alignItems: 'center' } },
+                React.createElement(Icon, { type: "icon-ants-emoji", size: 20 }),
+                labelHeadingModal), headerStyle: {
+                padding: '20px 20px 0',
+                border: 'none',
+            }, bodyStyle: {
+                padding: '17px 20px 20px',
+                width: 'fit-content',
+            }, width: "fit-content", footer: null, destroyOnClose: true, open: isOpenModal, onCancel: handleCancel },
+            React.createElement(InputSearch, { style: { width: 232 }, onAfterChange: handleSeachIcons, placeholder: searchPlaceholder }),
+            React.createElement("div", { style: { paddingTop: 28, width: 650 } },
+                React.createElement(ScrollBox, { height: 460, style: { display: 'flex', flexWrap: 'wrap', gap: '35px' } }, renderListIcons(listIcons))))));
+};

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

@@ -1,8 +1,8 @@
-/// <reference types="react" />
-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>> & {
-    Group: import("react").FC<import("antd/es/button").ButtonGroupProps>;
-}, any, {}, never>;
-export declare const Overlay: import("styled-components").StyledComponent<"div", any, {}, never>;
+/// <reference types="react" />
+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>> & {
+    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/IconSelection/styled.js

@@ -1,80 +1,80 @@
-var _a;
-// Libraries
-import { Button } from '@antscorp/antsomi-ui/es/components/atoms';
-import styled from 'styled-components';
-// Constants
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const IconSelectionWrapper = styled.div `
-  width: 100%;
-  padding: 5px;
-  aspect-ratio: 1.74;
-  border: 1px solid #f0f0f0;
-  box-sizing: border-box;
-
-  .transparent-wrapper {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 100%;
-    height: 100%;
-    gap: 15px;
-    aspect-ratio: 1.74;
-    background: url('data:image/svg+xml;base64, PHN2ZyBoZWlnaHQ9IjEwIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iMTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMCAyNTZoMjU2djI1NkgweiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMjUiIGQ9Ik0yNTYgMjU2aDI1NnYyNTZIMjU2eiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMjU2IDBoMjU2djI1NkgyNTZ6Ij48L3BhdGg+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTAgMGgyNTZ2MjU2SDB6Ij48L3BhdGg+PC9zdmc+')
-      repeat rgb(249, 251, 255);
-  }
-`;
-export const WrapperListRender = styled.div `
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: 100px;
-  height: auto;
-  text-align: center;
-
-  &:hover .ants-hover {
-    border-width: 2px;
-  }
-
-  &.ants-group:hover .group-hover {
-    opacity: 1;
-  }
-`;
-export const WrapperListItemRender = styled.div `
-  position: relative;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100px;
-  height: 100px;
-  border-width: 1px;
-  --tw-border-opacity: 1;
-  border-color: rgb(224 224 224 / var(--tw-border-opacity));
-  border-style: solid;
-  box-sizing: border-box;
-`;
-export const CustomButton = styled(Button) `
-  position: absolute !important;
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
-  z-index: 3;
-  opacity: 0;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-duration: 200ms;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-`;
-export const Overlay = styled.div `
-  position: absolute;
-  top: 0px;
-  right: 0px;
-  bottom: 0px;
-  left: 0px;
-  z-index: 2;
-  background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.bgLightTransparent};
-  opacity: 0;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
-    opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 200ms;
-`;
+var _a;
+// Libraries
+import { Button } from '@antscorp/antsomi-ui/es/components/atoms';
+import styled from 'styled-components';
+// Constants
+import { THEME } from '@antscorp/antsomi-ui/es/constants';
+export const IconSelectionWrapper = styled.div `
+  width: 100%;
+  padding: 5px;
+  aspect-ratio: 1.74;
+  border: 1px solid #f0f0f0;
+  box-sizing: border-box;
+
+  .transparent-wrapper {
+    position: relative;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    height: 100%;
+    gap: 15px;
+    aspect-ratio: 1.74;
+    background: url('data:image/svg+xml;base64, PHN2ZyBoZWlnaHQ9IjEwIiB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiB3aWR0aD0iMTAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgYXJpYS1oaWRkZW49InRydWUiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMCAyNTZoMjU2djI1NkgweiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMjUiIGQ9Ik0yNTYgMjU2aDI1NnYyNTZIMjU2eiI+PC9wYXRoPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZmlsbC1vcGFjaXR5PSIuMTI1IiBkPSJNMjU2IDBoMjU2djI1NkgyNTZ6Ij48L3BhdGg+PHBhdGggZmlsbD0iY3VycmVudENvbG9yIiBmaWxsLW9wYWNpdHk9Ii4yNSIgZD0iTTAgMGgyNTZ2MjU2SDB6Ij48L3BhdGg+PC9zdmc+')
+      repeat rgb(249, 251, 255);
+  }
+`;
+export const WrapperListRender = styled.div `
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 100px;
+  height: auto;
+  text-align: center;
+
+  &:hover .ants-hover {
+    border-width: 2px;
+  }
+
+  &.ants-group:hover .group-hover {
+    opacity: 1;
+  }
+`;
+export const WrapperListItemRender = styled.div `
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100px;
+  height: 100px;
+  border-width: 1px;
+  --tw-border-opacity: 1;
+  border-color: rgb(224 224 224 / var(--tw-border-opacity));
+  border-style: solid;
+  box-sizing: border-box;
+`;
+export const CustomButton = styled(Button) `
+  position: absolute !important;
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+  z-index: 3;
+  opacity: 0;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
+    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-duration: 200ms;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+`;
+export const Overlay = styled.div `
+  position: absolute;
+  top: 0px;
+  right: 0px;
+  bottom: 0px;
+  left: 0px;
+  z-index: 2;
+  background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.bgLightTransparent};
+  opacity: 0;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke,
+    opacity, box-shadow, transform, filter, backdrop-filter;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 200ms;
+`;

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

@@ -1,26 +1,26 @@
-import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
-import { ComponentPropsWithoutRef } from 'react';
-import { ICON_TYPE } from './constants';
-export interface IconSelectionProps {
-    wrapperClassName?: string;
-    className?: string;
-    style?: React.CSSProperties;
-    labelHeadingModal?: string;
-    searchPlaceholder?: string;
-    onChange?: (icon: string) => void;
-    onRemoveIcon?: () => void;
-    onChangeSvg?: Function;
-    icon?: string;
-    isOpen?: boolean;
-    iconTypes?: IconType[];
-    limitShowIcon?: number;
-}
-export type IconSelectionRendererProps = (({
-    iconType: typeof ICON_TYPE.FONT_AWESOME;
-} & Omit<FontAwesomeIconProps, 'icon'>) | ({
-    iconType: typeof ICON_TYPE.CUSTOM;
-} & ComponentPropsWithoutRef<'svg'>)) & {
-    iconName: string;
-};
-export type IconType = (typeof ICON_TYPE)[keyof typeof ICON_TYPE];
-export declare const isIconType: (iconType: unknown) => iconType is IconType;
+import { FontAwesomeIconProps } from '@fortawesome/react-fontawesome';
+import { ComponentPropsWithoutRef } from 'react';
+import { ICON_TYPE } from './constants';
+export interface IconSelectionProps {
+    wrapperClassName?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    labelHeadingModal?: string;
+    searchPlaceholder?: string;
+    onChange?: (icon: string) => void;
+    onRemoveIcon?: () => void;
+    onChangeSvg?: Function;
+    icon?: string;
+    isOpen?: boolean;
+    iconTypes?: IconType[];
+    limitShowIcon?: number;
+}
+export type IconSelectionRendererProps = (({
+    iconType: typeof ICON_TYPE.FONT_AWESOME;
+} & Omit<FontAwesomeIconProps, 'icon'>) | ({
+    iconType: typeof ICON_TYPE.CUSTOM;
+} & ComponentPropsWithoutRef<'svg'>)) & {
+    iconName: string;
+};
+export type IconType = (typeof ICON_TYPE)[keyof typeof ICON_TYPE];
+export declare const isIconType: (iconType: unknown) => iconType is IconType;

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

@@ -1,2 +1,2 @@
-import { ICON_TYPE } from './constants';
-export const isIconType = (iconType) => iconType === ICON_TYPE.CUSTOM || iconType === ICON_TYPE.FONT_AWESOME;
+import { ICON_TYPE } from './constants';
+export const isIconType = (iconType) => iconType === ICON_TYPE.CUSTOM || iconType === ICON_TYPE.FONT_AWESOME;

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

@@ -1,4 +1,4 @@
-export declare const serializeIcon: (icon: string) => {
-    iconType: import("./types").IconType;
-    iconName: string;
-} | null;
+export declare const serializeIcon: (icon: string) => {
+    iconType: import("./types").IconType;
+    iconName: string;
+} | null;

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

@@ -1,13 +1,13 @@
-import { FONTAWESOME_ICONS, ICON_TYPE } from './constants';
-import { isIconType } from './types';
-export const serializeIcon = (icon) => {
-    const [iconType, ...rest] = icon.split(' ');
-    if (isIconType(iconType)) {
-        return { iconType, iconName: rest.join(' ') };
-    }
-    // Handle for older data don't have icon-type prefix
-    if (FONTAWESOME_ICONS.includes(icon)) {
-        return { iconType: ICON_TYPE.FONT_AWESOME, iconName: icon };
-    }
-    return null;
-};
+import { FONTAWESOME_ICONS, ICON_TYPE } from './constants';
+import { isIconType } from './types';
+export const serializeIcon = (icon) => {
+    const [iconType, ...rest] = icon.split(' ');
+    if (isIconType(iconType)) {
+        return { iconType, iconName: rest.join(' ') };
+    }
+    // Handle for older data don't have icon-type prefix
+    if (FONTAWESOME_ICONS.includes(icon)) {
+        return { iconType: ICON_TYPE.FONT_AWESOME, iconName: icon };
+    }
+    return null;
+};

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

@@ -1,9 +1,9 @@
-import React, { ReactNode } from 'react';
-import type { InputNumberProps as AntdInputNumberProps } from 'antd';
-export interface InputNumberProps extends AntdInputNumberProps {
-    focused?: boolean;
-    errorMsg?: ReactNode;
-    label?: ReactNode;
-    disableUndo?: boolean;
-}
-export declare const InputNumber: React.FC<InputNumberProps>;
+import React, { ReactNode } from 'react';
+import type { InputNumberProps as AntdInputNumberProps } from 'antd';
+export interface InputNumberProps extends AntdInputNumberProps {
+    focused?: boolean;
+    errorMsg?: ReactNode;
+    label?: ReactNode;
+    disableUndo?: boolean;
+}
+export declare const InputNumber: React.FC<InputNumberProps>;