@antscorp/antsomi-ui 1.3.5-beta.62 → 1.3.5-beta.621

package/es/components/atoms/Steps/styled.js

@@ -0,0 +1,258 @@
+var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
+import styled from 'styled-components';
+import { Steps } from 'antd';
+import { Flex } from '../Flex';
+// Constants
+import { globalToken, THEME } from '@antscorp/antsomi-ui/es/constants';
+const { red6, bw0, colorError } = globalToken || {};
+const STEP_SIZE = {
+    SMALL: 24,
+    DEFAULT: 32,
+};
+export const SelectedIcon = styled.div `
+  border: 1px solid #b8cfe6;
+  border-radius: 100%;
+  font-size: 14px;
+  line-height: 23px;
+  color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary};
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+`;
+export const ErrorIcon = styled(Flex) `
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  background-color: ${colorError};
+  width: 100%;
+  height: 100%;
+  border-radius: 100%;
+  font-size: 14px;
+`;
+export const StepsWrapper = styled(Steps) `
+  &.save-highest-step {
+    // * Steps Default
+    &.antsomi-steps:not(.antsomi-steps-dot) {
+      &.antsomi-steps-small
+        .antsomi-steps-item
+        .antsomi-steps-item-container
+        .antsomi-steps-item-icon {
+        width: ${STEP_SIZE.SMALL}px;
+        height: ${STEP_SIZE.SMALL}px;
+      }
+
+      .antsomi-steps-item {
+        & > .antsomi-steps-item-container {
+          & > .antsomi-steps-item-icon {
+            box-sizing: border-box;
+            border-radius: 100%;
+            font-size: 14px;
+            font-weight: bold;
+            display: inline-flex;
+            justify-content: center;
+            align-items: center;
+            width: ${STEP_SIZE.DEFAULT}px;
+            height: ${STEP_SIZE.DEFAULT}px;
+
+            .antsomi-steps-icon {
+              color: white;
+              width: 100%;
+              height: 100%;
+              display: flex;
+              line-height: 23px;
+              top: 0px;
+              justify-content: center;
+              align-items: center;
+            }
+          }
+
+          & > .antsomi-steps-item-content > .antsomi-steps-item-title::after {
+            height: 2px;
+            background-color: ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.bw6};
+          }
+
+          & > .antsomi-steps-item-tail::after {
+            width: 2px;
+            background-color: ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.bw6};
+          }
+        }
+
+        &:not(.antsomi-steps-item-active) > .antsomi-steps-item-container[role='button'] {
+          &:hover {
+            .antsomi-steps-item-icon {
+              background-color: white;
+            }
+            .antsomi-steps-item-content {
+              color: ${(_d = THEME.token) === null || _d === void 0 ? void 0 : _d.colorPrimary};
+            }
+          }
+        }
+
+        &.highest-step {
+          .antsomi-steps-item-container {
+            & > .antsomi-steps-item-content > .antsomi-steps-item-title::after,
+            & > .antsomi-steps-item-tail::after {
+              background-color: ${(_e = THEME.token) === null || _e === void 0 ? void 0 : _e.bw6} !important;
+            }
+          }
+        }
+
+        &.antsomi-steps-item-selectable {
+          & > .antsomi-steps-item-container {
+            & > .antsomi-steps-item-content .antsomi-steps-item-title:after {
+              background-color: ${(_f = THEME.token) === null || _f === void 0 ? void 0 : _f.colorPrimary};
+            }
+
+            .antsomi-steps-item-tail::after {
+              background-color: ${(_g = THEME.token) === null || _g === void 0 ? void 0 : _g.colorPrimary};
+            }
+          }
+        }
+
+        &.antsomi-steps-item-active {
+          & > .antsomi-steps-item-container {
+            & > .antsomi-steps-item-content > .antsomi-steps-item-title {
+              &::after {
+                ${({ isReactivate }) => { var _a; return isReactivate ? `background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary}` : ''; }};
+              }
+            }
+
+            & > .antsomi-steps-item-tail {
+              &::after {
+                ${({ isReactivate }) => { var _a; return isReactivate ? `background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary}` : ''; }};
+              }
+            }
+          }
+        }
+
+        &.antsomi-steps-next-error {
+          > .antsomi-steps-item-container
+            > .antsomi-steps-item-content
+            > .antsomi-steps-item-title::after {
+            background-color: ${red6} !important;
+          }
+        }
+
+        &.antsomi-steps-item-error {
+          > .antsomi-steps-item-container {
+            > .antsomi-steps-item-icon .antsomi-steps-icon {
+              color: ${bw0} !important;
+            }
+
+            > .antsomi-steps-item-content .antsomi-steps-item-title {
+              color: ${colorError} !important;
+            }
+          }
+        }
+      }
+    }
+
+    // * Steps dot
+    &.antsomi-steps.antsomi-steps-dot {
+      &.antsomi-steps-horizontal .antsomi-steps-item .antsomi-steps-item-container {
+        & > .antsomi-steps-item-tail::after {
+          height: 2px;
+        }
+      }
+
+      &.antsomi-steps-vertical .antsomi-steps-item .antsomi-steps-item-container {
+        & > .antsomi-steps-item-tail::after {
+          width: 2px;
+        }
+      }
+
+      &.antsomi-steps-horizontal .antsomi-steps-item-tail::after,
+      &.antsomi-steps-vertical .antsomi-steps-item-tail::after {
+        background-color: ${(_h = THEME.token) === null || _h === void 0 ? void 0 : _h.bw6};
+      }
+
+      .antsomi-steps-item-selectable > .antsomi-steps-item-container {
+        & > .antsomi-steps-item-tail::after {
+          background-color: ${(_j = THEME.token) === null || _j === void 0 ? void 0 : _j.colorPrimary};
+        }
+      }
+
+      .antsomi-steps-item-process.antsomi-steps-item-active {
+        & > .antsomi-steps-item-container {
+          & > .antsomi-steps-item-tail::after {
+            ${({ isReactivate }) => { var _a; return isReactivate ? `background-color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorPrimary}` : ''; }};
+          }
+        }
+      }
+
+      .highest-step {
+        .antsomi-steps-item-container > .antsomi-steps-item-tail::after {
+          background-color: ${(_k = THEME.token) === null || _k === void 0 ? void 0 : _k.bw6} !important;
+        }
+      }
+    }
+
+    // * Common
+    &.antsomi-steps {
+      .antsomi-steps-item-title {
+        font-size: 16px;
+        line-height: ${STEP_SIZE.DEFAULT}px;
+      }
+
+      .antsomi-steps-item-description {
+        font-size: 14px;
+      }
+
+      &.antsomi-steps-small {
+        .antsomi-steps-item-title {
+          font-size: 14px;
+          line-height: ${STEP_SIZE.SMALL}px;
+        }
+      }
+
+      .antsomi-steps-item-wait {
+        color: ${(_l = THEME.token) === null || _l === void 0 ? void 0 : _l.bw7};
+
+        & > .antsomi-steps-item-container > .antsomi-steps-item-icon {
+          background-color: ${(_m = THEME.token) === null || _m === void 0 ? void 0 : _m.bw6};
+        }
+
+        &:not(.antsomi-steps-item-error)
+          > .antsomi-steps-item-container
+          > .antsomi-steps-item-content {
+          .antsomi-steps-item-title,
+          .antsomi-steps-item-description {
+            color: inherit;
+          }
+        }
+      }
+
+      .antsomi-steps-item-process.antsomi-steps-item-active {
+        font-weight: bold;
+        color: ${(_o = THEME.token) === null || _o === void 0 ? void 0 : _o.colorPrimary};
+
+        & > .antsomi-steps-item-container {
+          & > .antsomi-steps-item-content > .antsomi-steps-item-title,
+          & > .antsomi-steps-item-content > .antsomi-steps-item-description {
+            color: inherit;
+          }
+        }
+      }
+
+      .antsomi-steps-item-selectable {
+        color: black;
+
+        & > .antsomi-steps-item-container {
+          & > .antsomi-steps-item-icon {
+            color: ${(_p = THEME.token) === null || _p === void 0 ? void 0 : _p.colorPrimary};
+          }
+
+          & > .antsomi-steps-item-content {
+            .antsomi-steps-item-title,
+            .antsomi-steps-item-description {
+              color: inherit;
+            }
+          }
+        }
+      }
+    }
+  }
+`;

package/es/components/atoms/Switch/Switch.d.ts

@@ -1,2 +1,3 @@
 /// <reference types="react" />
 export declare const Switch: import("react").ForwardRefExoticComponent<import("antd").SwitchProps & import("react").RefAttributes<HTMLElement>>;
+export type { SwitchProps } from 'antd';

package/es/components/atoms/Switch/Switch.js

@@ -1,2 +1,3 @@
 import { Switch as AntdSwitch } from 'antd';
 export const Switch = AntdSwitch;
+Switch.defaultProps = {};

package/es/components/atoms/Switch/index.d.ts

@@ -1 +1,2 @@
 export { Switch } from './Switch';
+export type { SwitchProps } from 'antd';

package/es/components/atoms/index.d.ts

@@ -1,8 +1,7 @@
-export { Button } from './Button';
 export { Divider } from './Divider';
 export { DividerPure } from './DividerPure';
 export { Input, TextArea } from './Input';
-export { InputNumber } from './InputNumber';
+export { InputNumber, FormatInputNumber } from './InputNumber';
 export { Radio, RadioGroupSub, RadioButton } from './Radio';
 export { Space } from './Space';
 export { Tag } from './Tag';
@@ -22,9 +21,7 @@ export { Steps } from './Steps';
 export { Empty } from './Empty';
 export { Icon } from './Icon';
 export { Text } from './Text';
-export { Popover } from './Popover';
 export { RequiredLabel } from './RequiredLabel';
-export { Switch } from './Switch';
 export { Slider } from './Slider';
 export { Spin } from './Spin';
 export { Alert } from './Alert';
@@ -32,11 +29,19 @@ export { ScrollBox } from './ScrollBox';
 export { Rate } from './Rate';
 export { SliderV2 } from './SliderV2';
 export { InputDynamic } from './InputDynamic';
+export { ContentEditable } from './ContentEditable';
 export * from './Flex';
-export * from './RateV2';
 export * from './PreviewTabs';
 export * from './MobileFrame';
+export * from './MobileFrameV2';
 export * from './SlideBar';
+export * from './ReactIframe';
+export * from './Scrollbars';
+export * from './Switch';
+export * from './Button';
+export * from './RateV2';
+export * from './Popover';
+export * from './Iframe';
 export type { SliderProps } from './Slider';
 export type { PaginationProps } from './Pagination';
 export type { InputDynamicProps } from './InputDynamic';

package/es/components/atoms/index.js

@@ -1,8 +1,7 @@
-export { Button } from './Button';
 export { Divider } from './Divider';
 export { DividerPure } from './DividerPure';
 export { Input, TextArea } from './Input';
-export { InputNumber } from './InputNumber';
+export { InputNumber, FormatInputNumber } from './InputNumber';
 export { Radio, RadioGroupSub, RadioButton } from './Radio';
 export { Space } from './Space';
 export { Tag } from './Tag';
@@ -22,9 +21,7 @@ export { Steps } from './Steps';
 export { Empty } from './Empty';
 export { Icon } from './Icon';
 export { Text } from './Text';
-export { Popover } from './Popover';
 export { RequiredLabel } from './RequiredLabel';
-export { Switch } from './Switch';
 export { Slider } from './Slider';
 export { Spin } from './Spin';
 export { Alert } from './Alert';
@@ -32,8 +29,16 @@ export { ScrollBox } from './ScrollBox';
 export { Rate } from './Rate';
 export { SliderV2 } from './SliderV2';
 export { InputDynamic } from './InputDynamic';
+export { ContentEditable } from './ContentEditable';
 export * from './Flex';
-export * from './RateV2';
 export * from './PreviewTabs';
 export * from './MobileFrame';
+export * from './MobileFrameV2';
 export * from './SlideBar';
+export * from './ReactIframe';
+export * from './Scrollbars';
+export * from './Switch';
+export * from './Button';
+export * from './RateV2';
+export * from './Popover';
+export * from './Iframe';

package/es/components/icons/AccountCircleIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AccountCircleIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AccountCircleIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AccountCircleIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 4c1.93 0 3.5 1.57 3.5 3.5S13.93 13 12 13s-3.5-1.57-3.5-3.5S10.07 6 12 6zm0 14c-2.03 0-4.43-.82-6.14-2.88C7.55 15.8 9.68 15 12 15s4.45.8 6.14 2.12C16.43 19.18 14.03 20 12 20z" })));
+});

package/es/components/icons/AddChartIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AddChartIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AddChartIcon.js

@@ -0,0 +1,8 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AddChartIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M13 19V14H16V19H13ZM9 19V10H12V19H9ZM5 19V12H8V19H5Z", fill: "currentColor" }),
+        React.createElement("path", { d: "M14 10V8H12V6H14V4H16V6H18V8H16V10H14Z", fill: "#005EB8" })));
+});

package/es/components/icons/AddFolderIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AddFolderIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AddFolderIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AddFolderIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M20.0156 6C21.0938 6 21.9844 6.89062 21.9844 8.01562V18C21.9844 19.125 21.0938 20.0156 20.0156 20.0156H3.98438C2.90625 20.0156 2.01562 19.125 2.01562 18V6C2.01562 4.875 2.90625 3.98438 3.98438 3.98438H9.98438L12 6H20.0156ZM20.0156 18V8.01562H11.1562L9.1875 6H3.98438V18H20.0156ZM12 14.0156V12H14.0156V9.98438H15.9844V12H18V14.0156H15.9844V15.9844H14.0156V14.0156H12Z", fill: "currentColor" })));
+});

package/es/components/icons/AddIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AddIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AddIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AddIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M18.9844 12.9844H12.9844V18.9844H11.0156V12.9844H5.01562V11.0156H11.0156V5.01562H12.9844V11.0156H18.9844V12.9844Z", fill: "currentColor" })));
+});

package/es/components/icons/AddRadiusIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AddRadiusIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AddRadiusIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AddRadiusIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 3C5.23858 3 3 5.23858 3 8V16C3 18.7614 5.23858 21 8 21H16C18.7614 21 21 18.7614 21 16V8C21 5.23858 18.7614 3 16 3H8ZM13.2 10.8H16.8C17.1183 10.8 17.4235 10.9264 17.6486 11.1515C17.8736 11.3765 18 11.6817 18 12C18 12.3183 17.8736 12.6235 17.6486 12.8485C17.4235 13.0736 17.1183 13.2 16.8 13.2H13.2V16.8C13.2 17.1183 13.0736 17.4235 12.8486 17.6485C12.6235 17.8736 12.3183 18 12 18C11.6817 18 11.3765 17.8736 11.1514 17.6485C10.9264 17.4235 10.8 17.1183 10.8 16.8V13.2H7.2C6.88174 13.2 6.57646 13.0736 6.35142 12.8485C6.12637 12.6235 6 12.3183 6 12C6 11.6817 6.12637 11.3765 6.35142 11.1515C6.57646 10.9264 6.88174 10.8 7.2 10.8H10.8V7.2C10.8 6.88174 10.9264 6.57653 11.1514 6.35149C11.3765 6.12645 11.6817 6 12 6C12.3183 6 12.6235 6.12645 12.8486 6.35149C13.0736 6.57653 13.2 6.88174 13.2 7.2V10.8Z", fill: "currentColor" })));
+});

package/es/components/icons/AddShoppingCartIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AddShoppingCartIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AddShoppingCartIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AddShoppingCartIcon = forwardRef((props, ref) => {
+    const { height, width } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M11 9h2V6h3V4h-3V1h-2v3H8v2h3v3zm-4 9c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2zm-9.83-3.25.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.86-7.01L19.42 4h-.01l-1.1 2-2.76 5H8.53l-.13-.27L6.16 6l-.95-2-.94-2H1v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.13 0-.25-.11-.25-.25z" })));
+});

package/es/components/icons/AdjustIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AdjustIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AdjustIcon.js

@@ -0,0 +1,8 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AdjustIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", fill: "currentColor" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("g", { clipPath: "url(#clip0_1_2239)" },
+            React.createElement("path", { d: "M3 17.0156H9V18.9844H3V17.0156ZM3 5.01562H12.9844V6.98438H3V5.01562ZM12.9844 21H11.0156V15H12.9844V17.0156H21V18.9844H12.9844V21ZM6.98438 9H9V15H6.98438V12.9844H3V11.0156H6.98438V9ZM21 12.9844H11.0156V11.0156H21V12.9844ZM15 9V3H17.0156V5.01562H21V6.98438H17.0156V9H15Z" }))));
+});

package/es/components/icons/AllDevicesIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AllDevicesIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AllDevicesIcon.js

@@ -0,0 +1,9 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AllDevicesIcon = forwardRef((props, ref) => {
+    // search tag: desktop, mobile
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("g", { clipPath: "url(#clip0_1_2271)" },
+            React.createElement("path", { d: "M21.9844 17.0156V9.98438H18V17.0156H21.9844ZM23.0156 8.01562C23.2969 8.01562 23.5312 8.10938 23.7188 8.29688C23.9062 8.48438 24 8.71875 24 9V18.9844C24 19.2656 23.9062 19.5156 23.7188 19.7344C23.5312 19.9219 23.2969 20.0156 23.0156 20.0156H17.0156C16.7344 20.0156 16.4844 19.9219 16.2656 19.7344C16.0781 19.5156 15.9844 19.2656 15.9844 18.9844V9C15.9844 8.71875 16.0781 8.48438 16.2656 8.29688C16.4844 8.10938 16.7344 8.01562 17.0156 8.01562H23.0156ZM3.98438 6V17.0156H14.0156V20.0156H0V17.0156H2.01562V6C2.01562 5.46875 2.20312 5 2.57812 4.59375C2.98438 4.1875 3.45312 3.98438 3.98438 3.98438H21.9844V6H3.98438Z" }))));
+});

package/es/components/icons/AllJourneyChannelsIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AllJourneyChannelsIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AllJourneyChannelsIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AllJourneyChannelsIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M20.0156 2.01562C20.5469 2.01562 21 2.21875 21.375 2.625C21.7812 3 21.9844 3.45312 21.9844 3.98438V20.0156C21.9844 20.5469 21.7812 21.0156 21.375 21.4219C21 21.7969 20.5469 21.9844 20.0156 21.9844H3.98438C3.45312 21.9844 2.98438 21.7969 2.57812 21.4219C2.20312 21.0156 2.01562 20.5469 2.01562 20.0156V3.98438C2.01562 3.45312 2.20312 3 2.57812 2.625C2.98438 2.21875 3.45312 2.01562 3.98438 2.01562H20.0156ZM20.0156 11.0156V3.98438H12.9844V11.0156H20.0156ZM11.0156 3.98438H3.98438V11.0156H11.0156V3.98438ZM3.98438 12.9844V20.0156H11.0156V12.9844H3.98438ZM12.9844 20.0156H20.0156V12.9844H12.9844V20.0156Z" })));
+});

package/es/components/icons/ArrowGrowIcon.d.ts

@@ -1,2 +1,3 @@
 import React from 'react';
-export declare const ArrowGrowIcon: (props: any) => React.JSX.Element;
+import { IconProps } from './types';
+export declare const ArrowGrowIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/ArrowGrowIcon.js

@@ -1,4 +1,8 @@
-import React from 'react';
-export const ArrowGrowIcon = props => (React.createElement("svg", Object.assign({ width: "24", height: "24", viewBox: "0 0 32 32", fill: "currentColor" }, props),
-    React.createElement("g", { transform: "scale(0.03125 0.03125)" },
-        React.createElement("path", { d: "M389.74 204.8v80.64h270.72l-476.16 476.16 57.6 57.6 476.16-476.16v270.72h80.64v-408.96z" }))));
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const ArrowGrowIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 32 32", fill: "currentColor" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("g", { transform: "scale(0.03125 0.03125)" },
+            React.createElement("path", { d: "M389.74 204.8v80.64h270.72l-476.16 476.16 57.6 57.6 476.16-476.16v270.72h80.64v-408.96z" }))));
+});

package/es/components/icons/ArrowLineIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const ArrowLineIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/ArrowLineIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const ArrowLineIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M17.3463 15.6478L6.53566 4.83719C6.31986 4.62856 6.02554 4.5 5.70118 4.5C5.03779 4.5 4.5 5.03779 4.5 5.70118C4.5 6.02554 4.62856 6.31986 4.83751 6.53599L4.83719 6.53566L15.6478 17.3463L13.4941 19.5H19.5V13.4941L17.3463 15.6478Z", fill: "currentColor" })));
+});

package/es/components/icons/AssignmentIndIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AssignmentIndIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AssignmentIndIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AssignmentIndIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M19 3h-4.18C14.4 1.84 13.3 1 12 1c-1.3 0-2.4.84-2.82 2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm0 4c1.66 0 3 1.34 3 3s-1.34 3-3 3-3-1.34-3-3 1.34-3 3-3zm6 12H6v-1.4c0-2 4-3.1 6-3.1s6 1.1 6 3.1V19z" })));
+});

package/es/components/icons/AttachmentIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const AttachmentIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AttachmentIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AttachmentIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M18.5156 15.9844V17.4844H6.98438C3.9375 17.4844 1.5 15.0469 1.5 12C1.5 8.95312 3.9375 6.51562 6.98438 6.51562H19.5C21.7031 6.51562 23.4844 8.29688 23.4844 10.5C23.4844 12.7031 21.7031 14.4844 19.5 14.4844H9C7.64062 14.4844 6.51562 13.3594 6.51562 12C6.51562 10.6406 7.64062 9.51562 9 9.51562H18.5156V11.0156H9C8.4375 11.0156 8.01562 11.4375 8.01562 12C8.01562 12.5625 8.4375 12.9844 9 12.9844H19.5C20.8594 12.9844 21.9844 11.8594 21.9844 10.5C21.9844 9.14062 20.8594 8.01562 19.5 8.01562H6.98438C4.78125 8.01562 3 9.79688 3 12C3 14.2031 4.78125 15.9844 6.98438 15.9844H18.5156Z", fill: "currentColor" })));
+});

package/es/components/icons/AudioRecordIcon.d.ts

@@ -1,2 +1,3 @@
 import React from 'react';
-export declare const AudioRecordIcon: (props: any) => React.JSX.Element;
+import { IconProps } from './types';
+export declare const AudioRecordIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/AudioRecordIcon.js

@@ -1,4 +1,8 @@
-import React from 'react';
-export const AudioRecordIcon = props => (React.createElement("svg", Object.assign({ width: "24", height: "24", viewBox: "0 0 32 32", fill: "currentColor" }, props),
-    React.createElement("g", { transform: "scale(0.03125 0.03125)" },
-        React.createElement("path", { d: "M491.5 614.72c67.2 0 122.88-55.68 122.88-122.88v-245.76c0-67.2-55.68-122.88-122.88-122.88s-122.88 55.68-122.88 122.88v245.76c0 67.2 55.68 122.88 122.88 122.88zM441.58 242.24c0-26.88 23.040-49.92 49.92-49.92s49.92 23.040 49.92 49.92l-1.92 253.44c0 26.88-21.12 49.92-48 49.92s-49.92-23.040-49.92-49.92zM708.46 491.84c0 122.88-103.68 209.28-216.96 209.28s-216.96-86.4-216.96-209.28h-69.12c0 140.16 111.36 255.36 245.76 274.56v134.4h80.64v-134.4c134.4-19.2 245.76-134.4 245.76-274.56z" }))));
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const AudioRecordIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 32 32", fill: "currentColor" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("g", { transform: "scale(0.03125 0.03125)" },
+            React.createElement("path", { d: "M491.5 614.72c67.2 0 122.88-55.68 122.88-122.88v-245.76c0-67.2-55.68-122.88-122.88-122.88s-122.88 55.68-122.88 122.88v245.76c0 67.2 55.68 122.88 122.88 122.88zM441.58 242.24c0-26.88 23.040-49.92 49.92-49.92s49.92 23.040 49.92 49.92l-1.92 253.44c0 26.88-21.12 49.92-48 49.92s-49.92-23.040-49.92-49.92zM708.46 491.84c0 122.88-103.68 209.28-216.96 209.28s-216.96-86.4-216.96-209.28h-69.12c0 140.16 111.36 255.36 245.76 274.56v134.4h80.64v-134.4c134.4-19.2 245.76-134.4 245.76-274.56z" }))));
+});

package/es/components/icons/BlockIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const BlockIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/BlockIcon.js

@@ -0,0 +1,7 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const BlockIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M15.0938 8.01562V6C15.0938 5.15625 14.7812 4.4375 14.1562 3.84375C13.5625 3.21875 12.8438 2.90625 12 2.90625C11.1562 2.90625 10.4219 3.21875 9.79688 3.84375C9.20312 4.4375 8.90625 5.15625 8.90625 6V8.01562H15.0938ZM10.5938 16.4062C11 16.8125 11.4688 17.0156 12 17.0156C12.5312 17.0156 13 16.8125 13.4062 16.4062C13.8125 16 14.0156 15.5312 14.0156 15C14.0156 14.4688 13.8125 14 13.4062 13.5938C13 13.1875 12.5312 12.9844 12 12.9844C11.4688 12.9844 11 13.1875 10.5938 13.5938C10.1875 14 9.98438 14.4688 9.98438 15C9.98438 15.5312 10.1875 16 10.5938 16.4062ZM18 8.01562C18.5312 8.01562 19 8.21875 19.4062 8.625C19.8125 9 20.0156 9.45312 20.0156 9.98438V20.0156C20.0156 20.5469 19.8125 21.0156 19.4062 21.4219C19 21.7969 18.5312 21.9844 18 21.9844H6C5.46875 21.9844 5 21.7969 4.59375 21.4219C4.1875 21.0156 3.98438 20.5469 3.98438 20.0156V9.98438C3.98438 9.45312 4.1875 9 4.59375 8.625C5 8.21875 5.46875 8.01562 6 8.01562H6.98438V6C6.98438 4.625 7.46875 3.45313 8.4375 2.48438C9.4375 1.48438 10.625 0.984375 12 0.984375C13.375 0.984375 14.5469 1.48438 15.5156 2.48438C16.5156 3.45313 17.0156 4.625 17.0156 6V8.01562H18Z", fill: "currentColor" })));
+});

package/es/components/icons/BudLightIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { IconProps } from './types';
+export declare const BudLightIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/BudLightIcon.js

@@ -0,0 +1,8 @@
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const BudLightIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("path", { d: "M9.64648 16.8982V17.6732C9.61541 18.0283 9.72655 18.3812 9.95549 18.6543C10.1844 18.9275 10.5124 19.0987 10.8675 19.1302C10.9351 19.3795 11.0829 19.5995 11.288 19.7564C11.4931 19.9134 11.7442 19.9984 12.0025 19.9984C12.2608 19.9984 12.5118 19.9134 12.717 19.7564C12.9221 19.5995 13.0699 19.3795 13.1375 19.1302C13.4925 19.0987 13.8205 18.9275 14.0495 18.6543C14.2784 18.3812 14.3896 18.0283 14.3585 17.6732V16.8982H9.64648Z", fill: "#707070" }),
+        React.createElement("path", { d: "M17.5005 9.42918C17.4979 8.70465 17.3508 7.98792 17.0677 7.32095C16.7847 6.65398 16.3715 6.05018 15.8522 5.54489C15.333 5.0396 14.7181 4.64298 14.0437 4.37825C13.3693 4.11353 12.6488 3.98601 11.9245 4.00318C10.5335 4.02855 9.20314 4.57728 8.19876 5.53995C7.19439 6.50263 6.58976 7.80851 6.50547 9.19718C6.46273 10.0824 6.64153 10.9643 7.02569 11.763C7.40984 12.5617 7.98721 13.252 8.70546 13.7712C8.99788 13.9851 9.23563 14.2651 9.39933 14.5883C9.56303 14.9115 9.64805 15.2689 9.64747 15.6312H14.3595C14.3614 15.2773 14.4396 14.9279 14.5887 14.607C14.7378 14.286 14.9543 14.0009 15.2235 13.7712C15.9328 13.2925 16.5121 12.6452 16.9095 11.8873C17.3069 11.1295 17.51 10.2848 17.5005 9.42918Z", fill: "#F5D800" })));
+});

package/es/components/icons/BugIcon.d.ts

@@ -1,2 +1,3 @@
 import React from 'react';
-export declare const BugIcon: (props: any) => React.JSX.Element;
+import { IconProps } from './types';
+export declare const BugIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;

package/es/components/icons/BugIcon.js

@@ -1,4 +1,8 @@
-import React from 'react';
-export const BugIcon = props => (React.createElement("svg", Object.assign({ width: "24", height: "24", viewBox: "0 0 32 32", fill: "currentColor" }, props),
-    React.createElement("g", { transform: "scale(0.03125 0.03125)" },
-        React.createElement("path", { d: "M819.82 348.8h-115.2c-19.2-32.64-44.16-59.52-74.88-80.64l67.2-67.2-57.6-57.6-90.24 88.32c-19.2-3.84-38.4-5.76-57.6-5.76s-38.4 1.92-57.6 5.76l-90.24-88.32-57.6 57.6 67.2 67.2c-30.72 21.12-55.68 48-74.88 80.64h-115.2v80.64h86.4c-1.92 13.44-3.84 26.88-3.84 42.24v40.32h-82.56v82.56h82.56v40.32c0 13.44 1.92 26.88 3.84 40.32h-86.4v82.56h115.2c42.24 72.96 122.88 122.88 213.12 122.88s170.88-49.92 213.12-122.88h115.2v-82.56h-86.4c1.92-13.44 3.84-26.88 3.84-40.32v-40.32h82.56v-82.56h-82.56v-40.32c0-15.36-1.92-28.8-3.84-42.24h86.4zM654.7 512v122.88c0 9.6 0 19.2-1.92 28.8l-3.84 26.88-15.36 26.88c-30.72 49.92-84.48 80.64-142.080 80.64s-111.36-30.72-142.080-80.64l-15.36-26.88-3.84-26.88c-1.92-9.6-1.92-19.2-1.92-28.8v-163.2c0-9.6 0-21.12 1.92-28.8l3.84-26.88 15.36-26.88c13.44-21.12 30.72-40.32 49.92-53.76l23.040-15.36 30.72-7.68c13.44-3.84 24.96-5.76 38.4-5.76s24.96 1.92 38.4 5.76l28.8 5.76 24.96 17.28c19.2 15.36 36.48 32.64 49.92 53.76l15.36 26.88 3.84 26.88c1.92 9.6 1.92 19.2 1.92 28.8zM408.94 594.56h165.12v80.64h-165.12zM408.94 429.44h165.12v82.56h-165.12z" }))));
+import React, { forwardRef } from 'react';
+import { useIcon } from './hooks/useIcon';
+export const BugIcon = forwardRef((props, ref) => {
+    const { width, height } = useIcon(props);
+    return (React.createElement("svg", Object.assign({ viewBox: "0 0 32 32", fill: "currentColor" }, props, { ref: ref, width: width, height: height }),
+        React.createElement("g", { transform: "scale(0.03125 0.03125)" },
+            React.createElement("path", { d: "M819.82 348.8h-115.2c-19.2-32.64-44.16-59.52-74.88-80.64l67.2-67.2-57.6-57.6-90.24 88.32c-19.2-3.84-38.4-5.76-57.6-5.76s-38.4 1.92-57.6 5.76l-90.24-88.32-57.6 57.6 67.2 67.2c-30.72 21.12-55.68 48-74.88 80.64h-115.2v80.64h86.4c-1.92 13.44-3.84 26.88-3.84 42.24v40.32h-82.56v82.56h82.56v40.32c0 13.44 1.92 26.88 3.84 40.32h-86.4v82.56h115.2c42.24 72.96 122.88 122.88 213.12 122.88s170.88-49.92 213.12-122.88h115.2v-82.56h-86.4c1.92-13.44 3.84-26.88 3.84-40.32v-40.32h82.56v-82.56h-82.56v-40.32c0-15.36-1.92-28.8-3.84-42.24h86.4zM654.7 512v122.88c0 9.6 0 19.2-1.92 28.8l-3.84 26.88-15.36 26.88c-30.72 49.92-84.48 80.64-142.080 80.64s-111.36-30.72-142.080-80.64l-15.36-26.88-3.84-26.88c-1.92-9.6-1.92-19.2-1.92-28.8v-163.2c0-9.6 0-21.12 1.92-28.8l3.84-26.88 15.36-26.88c13.44-21.12 30.72-40.32 49.92-53.76l23.040-15.36 30.72-7.68c13.44-3.84 24.96-5.76 38.4-5.76s24.96 1.92 38.4 5.76l28.8 5.76 24.96 17.28c19.2 15.36 36.48 32.64 49.92 53.76l15.36 26.88 3.84 26.88c1.92 9.6 1.92 19.2 1.92 28.8zM408.94 594.56h165.12v80.64h-165.12zM408.94 429.44h165.12v82.56h-165.12z" }))));
+});