@antscorp/antsomi-ui 2.0.13 → 2.0.15

package/es/components/molecules/AddDynamicContent/components/DisplayFormat/DisplayFormat.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { PayloadInfo } from '@antscorp/antsomi-ui/es/types';
 export type TDisplayFormat = 'number' | 'percentage' | 'currency' | 'datetime';
 type DisplayFormatProps = {

package/es/components/molecules/AddDynamicContent/components/DisplayFormat/DisplayFormat.js

@@ -1,5 +1,4 @@
-// Libraries
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 // Components
 import FormatDatetime from '../FormatDatetime/FormatDatetime';
 import FormatNumber from '../FormatNumber/FormatNumber';
@@ -10,10 +9,10 @@ const DisplayFormat = (props) => {
             case 'number':
             case 'percentage':
             case 'currency': {
-                return (React.createElement(FormatNumber, Object.assign({}, props.formatSettings, { onSettingsChange: props.onSettingsChange, type: props.displayFormatType, url: url, infos: infos })));
+                return (_jsx(FormatNumber, { ...props.formatSettings, onSettingsChange: props.onSettingsChange, type: props.displayFormatType, url: url, infos: infos }));
             }
             case 'datetime': {
-                return (React.createElement(FormatDatetime, Object.assign({}, props.formatSettings, { onSettingsChange: props.onSettingsChange, type: props.displayFormatType, dynamicContentType: props.dynamicContentType })));
+                return (_jsx(FormatDatetime, { ...props.formatSettings, onSettingsChange: props.onSettingsChange, type: props.displayFormatType, dynamicContentType: props.dynamicContentType }));
             }
             default: {
                 return null;

package/es/components/molecules/AddDynamicContent/components/FormatDatetime/FormatDatetime.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import dayjs from 'dayjs';
 export type TDatetimeFormatSetting = {
     hasDateFormat: boolean;
@@ -15,5 +14,5 @@ export type FormatDatetimeProps = {
     dynamicContentType?: string;
 } & TDatetimeFormatSetting;
 export declare const dateExample: dayjs.Dayjs;
-declare const FormatDatetime: ({ hasDateFormat, hasTimeFormat, dateParseFormat, timeParseFormat, dateParseOption, timeParseOption, onSettingsChange, dynamicContentType, }: FormatDatetimeProps) => React.JSX.Element;
+declare const FormatDatetime: ({ hasDateFormat, hasTimeFormat, dateParseFormat, timeParseFormat, dateParseOption, timeParseOption, onSettingsChange, dynamicContentType, }: FormatDatetimeProps) => import("react/jsx-runtime").JSX.Element;
 export default FormatDatetime;

package/es/components/molecules/AddDynamicContent/components/FormatDatetime/FormatDatetime.js

@@ -1,6 +1,4 @@
-/* eslint-disable react/no-unused-prop-types */
-// Libraries
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import dayjs from 'dayjs';
 // Locales
 import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
@@ -31,70 +29,56 @@ const FormatDatetime = ({ hasDateFormat, hasTimeFormat, dateParseFormat, timePar
     const gmtString = `GMT ${prefix}${timezone}`;
     const handleChange = (updatedSettings) => {
         if (onSettingsChange) {
-            onSettingsChange(Object.assign(Object.assign({}, updatedSettings), { type: 'datetime', language: portalLanguage }));
+            onSettingsChange({
+                ...updatedSettings,
+                type: 'datetime',
+                language: portalLanguage,
+            });
         }
     };
     const labelHours = dynamicContentType !== 'custom' ? 'HH:MM:SS' : '';
-    return (React.createElement("div", null,
-        React.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: '16px' } },
-            React.createElement(Checkbox, { checked: hasDateFormat, disabled: hasDateFormat && !hasTimeFormat, onChange: e => handleChange(Object.assign(Object.assign({}, dfSettings), { hasDateFormat: e.target.checked })) }, t(translations.dynamicContent.modal.label.datimeDisplayFormat.dateDF)),
-            React.createElement(Select, { style: { width: 190 }, disabled: !hasDateFormat, defaultValue: dateParseFormat, options: [
-                    {
-                        label: `MM/DD/YYYY ${labelHours}`,
-                        value: 'MM/DD/YYYY',
-                    },
-                    {
-                        label: `DD/MM/YYYY ${labelHours}`,
-                        value: 'DD/MM/YYYY',
-                    },
-                    {
-                        label: `YYYY/MM/DD ${labelHours}`,
-                        value: 'YYYY/MM/DD',
-                    },
-                ], onChange: value => handleChange(Object.assign(Object.assign({}, dfSettings), { dateParseFormat: value })) })),
-        React.createElement("div", { style: { marginTop: '8px' } },
-            React.createElement(RadioGroup, { disabled: !hasDateFormat, defaultValue: dateParseOption, onChange: e => handleChange(Object.assign(Object.assign({}, dfSettings), { dateParseOption: e.target.value })) },
-                React.createElement(Space, { direction: "vertical", size: 4, style: { marginLeft: '20px' } },
-                    React.createElement(Radio, { value: "short" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.short),
-                        ' - ',
-                        datetimeEx.format(transformDateFormat(dateParseFormat, 'short'))),
-                    React.createElement(Radio, { value: "medium" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.medium),
-                        ' - ',
-                        datetimeEx.format(transformDateFormat(dateParseFormat, 'medium'))),
-                    React.createElement(Radio, { value: "long" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.long),
-                        ' - ',
-                        datetimeEx.format(transformDateFormat(dateParseFormat, 'long')))))),
-        React.createElement("div", { style: { display: 'flex', alignItems: 'center', gap: '16px', marginTop: 16 } },
-            React.createElement(Checkbox, { checked: hasTimeFormat, disabled: hasTimeFormat && !hasDateFormat, onChange: e => handleChange(Object.assign(Object.assign({}, dfSettings), { hasTimeFormat: e.target.checked })) }, t(translations.dynamicContent.modal.label.datimeDisplayFormat.timeDF)),
-            React.createElement(Select, { style: { width: 190 }, disabled: !hasTimeFormat, defaultValue: timeParseFormat, options: [
-                    {
-                        label: 'AM/PM',
-                        value: '12hour',
-                    },
-                    {
-                        label: t(translations.dynamicContent.modal.label.datimeDisplayFormat.use24hour),
-                        value: '24hour',
-                    },
-                ], onChange: value => handleChange(Object.assign(Object.assign({}, dfSettings), { timeParseFormat: value })) })),
-        React.createElement("div", { style: { marginTop: '8px' } },
-            React.createElement(RadioGroup, { defaultValue: timeParseOption, disabled: !hasTimeFormat, onChange: e => handleChange(Object.assign(Object.assign({}, dfSettings), { timeParseOption: e.target.value })) },
-                React.createElement(Space, { direction: "vertical", size: 4, style: { marginLeft: '20px' } },
-                    React.createElement(Radio, { value: "short" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.short),
-                        ' - ',
-                        datetimeEx.format(timeParseFormat === '12hour' ? 'h:mm A' : 'H:mm')),
-                    React.createElement(Radio, { value: "medium" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.medium),
-                        ' - ',
-                        datetimeEx.format(timeParseFormat === '12hour' ? 'h:mm:ss A' : 'H:mm:ss')),
-                    React.createElement(Radio, { value: "long" },
-                        t(translations.dynamicContent.modal.label.datimeDisplayFormat.long),
-                        ' - ',
-                        datetimeEx.format(timeParseFormat === '12hour'
-                            ? `h:mm:ss A [${gmtString}]`
-                            : `H:mm:ss [${gmtString}]`)))))));
+    return (_jsxs("div", { children: [_jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '16px' }, children: [_jsx(Checkbox, { checked: hasDateFormat, disabled: hasDateFormat && !hasTimeFormat, onChange: e => handleChange({
+                            ...dfSettings,
+                            hasDateFormat: e.target.checked,
+                        }), children: t(translations.dynamicContent.modal.label.datimeDisplayFormat.dateDF) }), _jsx(Select, { style: { width: 190 }, disabled: !hasDateFormat, defaultValue: dateParseFormat, options: [
+                            {
+                                label: `MM/DD/YYYY ${labelHours}`,
+                                value: 'MM/DD/YYYY',
+                            },
+                            {
+                                label: `DD/MM/YYYY ${labelHours}`,
+                                value: 'DD/MM/YYYY',
+                            },
+                            {
+                                label: `YYYY/MM/DD ${labelHours}`,
+                                value: 'YYYY/MM/DD',
+                            },
+                        ], onChange: value => handleChange({
+                            ...dfSettings,
+                            dateParseFormat: value,
+                        }) })] }), _jsx("div", { style: { marginTop: '8px' }, children: _jsx(RadioGroup, { disabled: !hasDateFormat, defaultValue: dateParseOption, onChange: e => handleChange({
+                        ...dfSettings,
+                        dateParseOption: e.target.value,
+                    }), children: _jsxs(Space, { direction: "vertical", size: 4, style: { marginLeft: '20px' }, children: [_jsxs(Radio, { value: "short", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.short), ' - ', datetimeEx.format(transformDateFormat(dateParseFormat, 'short'))] }), _jsxs(Radio, { value: "medium", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.medium), ' - ', datetimeEx.format(transformDateFormat(dateParseFormat, 'medium'))] }), _jsxs(Radio, { value: "long", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.long), ' - ', datetimeEx.format(transformDateFormat(dateParseFormat, 'long'))] })] }) }) }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '16px', marginTop: 16 }, children: [_jsx(Checkbox, { checked: hasTimeFormat, disabled: hasTimeFormat && !hasDateFormat, onChange: e => handleChange({
+                            ...dfSettings,
+                            hasTimeFormat: e.target.checked,
+                        }), children: t(translations.dynamicContent.modal.label.datimeDisplayFormat.timeDF) }), _jsx(Select, { style: { width: 190 }, disabled: !hasTimeFormat, defaultValue: timeParseFormat, options: [
+                            {
+                                label: 'AM/PM',
+                                value: '12hour',
+                            },
+                            {
+                                label: t(translations.dynamicContent.modal.label.datimeDisplayFormat.use24hour),
+                                value: '24hour',
+                            },
+                        ], onChange: value => handleChange({
+                            ...dfSettings,
+                            timeParseFormat: value,
+                        }) })] }), _jsx("div", { style: { marginTop: '8px' }, children: _jsx(RadioGroup, { defaultValue: timeParseOption, disabled: !hasTimeFormat, onChange: e => handleChange({
+                        ...dfSettings,
+                        timeParseOption: e.target.value,
+                    }), children: _jsxs(Space, { direction: "vertical", size: 4, style: { marginLeft: '20px' }, children: [_jsxs(Radio, { value: "short", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.short), ' - ', datetimeEx.format(timeParseFormat === '12hour' ? 'h:mm A' : 'H:mm')] }), _jsxs(Radio, { value: "medium", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.medium), ' - ', datetimeEx.format(timeParseFormat === '12hour' ? 'h:mm:ss A' : 'H:mm:ss')] }), _jsxs(Radio, { value: "long", children: [t(translations.dynamicContent.modal.label.datimeDisplayFormat.long), ' - ', datetimeEx.format(timeParseFormat === '12hour'
+                                        ? `h:mm:ss A [${gmtString}]`
+                                        : `H:mm:ss [${gmtString}]`)] })] }) }) })] }));
 };
 export default FormatDatetime;

package/es/components/molecules/AddDynamicContent/components/FormatNumber/FormatNumber.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import { TDisplayFormat } from '../DisplayFormat';
 import { PayloadInfo } from '@antscorp/antsomi-ui/es/types';
 declare const groupingOptions: {
@@ -48,5 +47,5 @@ type FormatNumberProps = {
     infos: PayloadInfo;
     url: string;
 };
-declare const FormatNumber: (props: FormatNumberProps) => React.JSX.Element;
+declare const FormatNumber: (props: FormatNumberProps) => import("react/jsx-runtime").JSX.Element;
 export default FormatNumber;

package/es/components/molecules/AddDynamicContent/components/FormatNumber/FormatNumber.js

@@ -1,14 +1,6 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 // Libraries
-import React, { useEffect, useMemo, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 // Components
 import { Radio } from '@antscorp/antsomi-ui/es/components/atoms';
 import { Col, Row, Tooltip, Form, Select, Checkbox } from 'antd';
@@ -41,20 +33,22 @@ const FormatNumber = (props) => {
     const [isLoadingCurrencyOptions, setIsLoadingCurrencyOptions] = useState(true);
     const onChangeSettingsHandle = (settingValues) => {
         if (onSettingsChange) {
-            onSettingsChange(Object.assign(Object.assign({}, settingValues), { type: displayType }));
+            onSettingsChange({
+                ...settingValues,
+                type: displayType,
+            });
         }
     };
     useEffect(() => {
-        (() => __awaiter(void 0, void 0, void 0, function* () {
+        (async () => {
             // Regex for getting text between the last brackets (with brakets) of line
             const regex = /\(([^)]*)\)[^(]*$/;
             if (listCurrencyOptions.length) {
                 setListCurrencyOptions(prevOptions => prevOptions.map(currencyOption => {
-                    var _a;
                     // setLabel: Dollal Mỹ (USD) or Dollal Mỹ ($)
                     currencyOption.label =
                         prefixType === 'symbol'
-                            ? currencyOption.label.replace(regex, `(${(_a = Currencies[currencyOption.value]) === null || _a === void 0 ? void 0 : _a.symbol})`)
+                            ? currencyOption.label.replace(regex, `(${Currencies[currencyOption.value]?.symbol})`)
                             : currencyOption.label.replace(regex, `(${currencyOption.value})`);
                     return currencyOption;
                 }));
@@ -62,15 +56,14 @@ const FormatNumber = (props) => {
             else {
                 setIsLoadingCurrencyOptions(true);
                 try {
-                    const data = yield getCurrencyList({ lang: language, url }, infos);
+                    const data = await getCurrencyList({ lang: language, url }, infos);
                     const currencies = data.reduce((accumulate, currency) => {
-                        var _a;
                         if (Currencies[currency.code]) {
                             accumulate.push({
                                 value: currency.code,
                                 // setLabel: Dollal Mỹ (USD) or Dollal Mỹ ($)
                                 label: prefixType === 'symbol'
-                                    ? `${currency.name.replace(regex, '')} (${(_a = Currencies[currency.code]) === null || _a === void 0 ? void 0 : _a.symbol})`
+                                    ? `${currency.name.replace(regex, '')} (${Currencies[currency.code]?.symbol})`
                                     : `${currency.name.replace(regex, '')} (${currency.code})`,
                             });
                         }
@@ -88,45 +81,46 @@ const FormatNumber = (props) => {
                     setIsLoadingCurrencyOptions(false);
                 }
             }
-        }))();
+        })();
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [prefixType]);
     const listGroupingSeparatorOptions = useMemo(() => Object.values(groupingOptions)
         .sort((a, b) => a.index - b.index)
-        .map(grouping => (Object.assign(Object.assign({}, grouping), (grouping.value === decimal && { disabled: true })))), [decimal]);
+        .map(grouping => ({
+        ...grouping,
+        ...(grouping.value === decimal && { disabled: true }),
+    })), [decimal]);
     const listDecimalSeparatorOptions = useMemo(() => Object.values(decimalOptions)
         .sort((a, b) => a.index - b.index)
-        .map(decimal => (Object.assign(Object.assign({}, decimal), (decimal.value === grouping && { disabled: true })))), [grouping]);
-    return (React.createElement(Form, { style: { width: '100%', fontSize: '12px' }, labelAlign: "left" },
-        displayType === 'currency' && (React.createElement(React.Fragment, null,
-            React.createElement(Form.Item, { labelCol: { span: 8 }, wrapperCol: { span: 16 }, label: t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currency), colon: false },
-                React.createElement(Radio.Group, { value: prefixType, onChange: ({ target: { value } }) => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { prefixType: value })) },
-                    React.createElement(Radio, { style: { fontSize: 12 }, value: "code" }, t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currencyCode)),
-                    React.createElement(Radio, { style: { fontSize: 12 }, value: "symbol" }, t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currencySymbol)))),
-            React.createElement(Form.Item, { label: " ", labelCol: { span: 8 }, wrapperCol: { span: 16 }, colon: false },
-                React.createElement(Select, { style: { height: 28 }, disabled: isLoadingCurrencyOptions, options: listCurrencyOptions, value: currencyCode, onChange: value => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { currencyCode: value })), showSearch: true })))),
-        React.createElement(Form.Item, null,
-            React.createElement(Checkbox, { style: { fontSize: 12 }, checked: isCompact, onChange: ({ target: { checked } }) => {
-                    onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { isCompact: checked }));
-                } }, t(translations.dynamicContent.modal.label.formNumberDisplayFormat.compact))),
-        React.createElement(Form.Item, { label: `${t(translations.dynamicContent.modal.label.formNumberDisplayFormat.decimalPlace)} (${decimalPlaces})`, style: { marginBottom: 12 }, colon: false },
-            React.createElement("div", { style: { display: 'flex', marginLeft: 40 } },
-                React.createElement(ButtonCustom, { disabled: decimalPlaces <= 0, onClick: () => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { decimalPlaces: decimalPlaces - 1 })) }, '<< .0'),
-                React.createElement(ButtonCustom, { onClick: () => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { decimalPlaces: decimalPlaces + 1 })) }, '.00 >>'))),
-        React.createElement(Row, { gutter: 15 },
-            React.createElement(Col, { span: 12 },
-                React.createElement(Form.Item, { label: React.createElement("span", null,
-                        t(translations.dynamicContent.modal.label.formNumberDisplayFormat.grouping),
-                        React.createElement(Tooltip, { placement: "top", title: t(translations.dynamicContent.modal.label.formNumberDisplayFormat
-                                .groupingIconTooltipTitle), style: { marginLeft: 4, opacity: 0.4 } },
-                            React.createElement(FontAwesomeIcon, { icon: ['fas', 'info-circle'] }))), colon: false },
-                    React.createElement(Select, { style: { height: 28 }, value: grouping, onChange: value => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { grouping: value })), options: listGroupingSeparatorOptions }))),
-            React.createElement(Col, { span: 12 },
-                React.createElement(Form.Item, { label: React.createElement("span", null,
-                        t(translations.dynamicContent.modal.label.formNumberDisplayFormat.decimal),
-                        React.createElement(Tooltip, { placement: "top", title: t(translations.dynamicContent.modal.label.formNumberDisplayFormat
-                                .decimalIconTooltipTitle), style: { marginLeft: 4, opacity: 0.4 } },
-                            React.createElement(FontAwesomeIcon, { icon: ['fas', 'info-circle'] }))), colon: false },
-                    React.createElement(Select, { style: { height: 28 }, value: decimal, onChange: value => onChangeSettingsHandle(Object.assign(Object.assign({}, settingValues), { decimal: value })), options: listDecimalSeparatorOptions }))))));
+        .map(decimal => ({
+        ...decimal,
+        ...(decimal.value === grouping && { disabled: true }),
+    })), [grouping]);
+    return (_jsxs(Form, { style: { width: '100%', fontSize: '12px' }, labelAlign: "left", children: [displayType === 'currency' && (_jsxs(_Fragment, { children: [_jsx(Form.Item, { labelCol: { span: 8 }, wrapperCol: { span: 16 }, label: t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currency), colon: false, children: _jsxs(Radio.Group, { value: prefixType, onChange: ({ target: { value } }) => onChangeSettingsHandle({
+                                ...settingValues,
+                                prefixType: value,
+                            }), children: [_jsx(Radio, { style: { fontSize: 12 }, value: "code", children: t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currencyCode) }), _jsx(Radio, { style: { fontSize: 12 }, value: "symbol", children: t(translations.dynamicContent.modal.label.formNumberDisplayFormat.currencySymbol) })] }) }), _jsx(Form.Item, { label: " ", labelCol: { span: 8 }, wrapperCol: { span: 16 }, colon: false, children: _jsx(Select, { style: { height: 28 }, disabled: isLoadingCurrencyOptions, options: listCurrencyOptions, value: currencyCode, onChange: value => onChangeSettingsHandle({
+                                ...settingValues,
+                                currencyCode: value,
+                            }), showSearch: true }) })] })), _jsx(Form.Item, { children: _jsx(Checkbox, { style: { fontSize: 12 }, checked: isCompact, onChange: ({ target: { checked } }) => {
+                        onChangeSettingsHandle({
+                            ...settingValues,
+                            isCompact: checked,
+                        });
+                    }, children: t(translations.dynamicContent.modal.label.formNumberDisplayFormat.compact) }) }), _jsx(Form.Item, { label: `${t(translations.dynamicContent.modal.label.formNumberDisplayFormat.decimalPlace)} (${decimalPlaces})`, style: { marginBottom: 12 }, colon: false, children: _jsxs("div", { style: { display: 'flex', marginLeft: 40 }, children: [_jsx(ButtonCustom, { disabled: decimalPlaces <= 0, onClick: () => onChangeSettingsHandle({
+                                ...settingValues,
+                                decimalPlaces: decimalPlaces - 1,
+                            }), children: '<< .0' }), _jsx(ButtonCustom, { onClick: () => onChangeSettingsHandle({
+                                ...settingValues,
+                                decimalPlaces: decimalPlaces + 1,
+                            }), children: '.00 >>' })] }) }), _jsxs(Row, { gutter: 15, children: [_jsx(Col, { span: 12, children: _jsx(Form.Item, { label: _jsxs("span", { children: [t(translations.dynamicContent.modal.label.formNumberDisplayFormat.grouping), _jsx(Tooltip, { placement: "top", title: t(translations.dynamicContent.modal.label.formNumberDisplayFormat
+                                            .groupingIconTooltipTitle), style: { marginLeft: 4, opacity: 0.4 }, children: _jsx(FontAwesomeIcon, { icon: ['fas', 'info-circle'] }) })] }), colon: false, children: _jsx(Select, { style: { height: 28 }, value: grouping, onChange: value => onChangeSettingsHandle({
+                                    ...settingValues,
+                                    grouping: value,
+                                }), options: listGroupingSeparatorOptions }) }) }), _jsx(Col, { span: 12, children: _jsx(Form.Item, { label: _jsxs("span", { children: [t(translations.dynamicContent.modal.label.formNumberDisplayFormat.decimal), _jsx(Tooltip, { placement: "top", title: t(translations.dynamicContent.modal.label.formNumberDisplayFormat
+                                            .decimalIconTooltipTitle), style: { marginLeft: 4, opacity: 0.4 }, children: _jsx(FontAwesomeIcon, { icon: ['fas', 'info-circle'] }) })] }), colon: false, children: _jsx(Select, { style: { height: 28 }, value: decimal, onChange: value => onChangeSettingsHandle({
+                                    ...settingValues,
+                                    decimal: value,
+                                }), options: listDecimalSeparatorOptions }) }) })] })] }));
 };
 export default FormatNumber;

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

@@ -64,7 +64,6 @@ export function getStringFormatDateDF(formatSettings) {
     return `${dateFormat} ${timeFormat}`;
 }
 export function formatDatetimeDF(date, formatSettings) {
-    var _a, _b;
     let formatedDate = '';
     const timezone = Math.round(dayjs(date).utcOffset() / 60);
     const prefix = timezone > 0 ? '+' : '';
@@ -72,9 +71,9 @@ export function formatDatetimeDF(date, formatSettings) {
         formatedDate = dayjs(date)
             .locale(formatSettings.language || 'en')
             .format(getStringFormatDateDF(formatSettings));
-        return (_a = formatedDate.replace(/\W*(GMT)\W*/, ` GMT ${prefix}${timezone}`)) === null || _a === void 0 ? void 0 : _a.trim();
+        return formatedDate.replace(/\W*(GMT)\W*/, ` GMT ${prefix}${timezone}`)?.trim();
     }
-    return (_b = date.toString()) === null || _b === void 0 ? void 0 : _b.trim();
+    return date.toString()?.trim();
 }
 export function formatNumberDF(number, fType, fOptions = {
     grouping: ',',
@@ -176,13 +175,12 @@ export function formatNumberDF(number, fType, fOptions = {
     return html;
 }
 export function getAvailableAttrs(listAttribute) {
-    return (listAttribute === null || listAttribute === void 0 ? void 0 : listAttribute.filter(({ status }) => !ATTRIBUTE_STATUS[+status])) || [];
+    return listAttribute?.filter(({ status }) => !ATTRIBUTE_STATUS[+status]) || [];
 }
 export const regexCSType = new RegExp(/^content-source::.*/);
 export const serilizeBOAttr = (data, additionalAttrProperties) => {
-    var _a;
     const { rows = [] } = data || {};
-    return (((_a = rows[0]) === null || _a === void 0 ? void 0 : _a.properties.map((item) => {
+    return (rows[0]?.properties.map((item) => {
         const temp = {
             value: item.itemPropertyName,
             label: item.translateLabel,
@@ -190,13 +188,13 @@ export const serilizeBOAttr = (data, additionalAttrProperties) => {
             disabled: parseInt(item.status) === 4,
             dataType: item.dataType,
         };
-        additionalAttrProperties === null || additionalAttrProperties === void 0 ? void 0 : additionalAttrProperties.forEach(propName => {
+        additionalAttrProperties?.forEach(propName => {
             if (has(item, propName)) {
                 temp[propName] = item[propName];
             }
         });
         return temp;
-    })) || []);
+    }) || []);
 };
 export const serializeCSSelectedString = (value = '') => {
     const [contentSourceKey = '', groupId = '', itemTypeId] = value.split('::');
@@ -216,14 +214,13 @@ export const serilizeDynamicContentAttr = (attrs = [], language, additionalAttrP
         disabled: parseInt(attr.status) === 4,
         status: attr.status,
     };
-    additionalAttrProperties === null || additionalAttrProperties === void 0 ? void 0 : additionalAttrProperties.forEach(propName => {
+    additionalAttrProperties?.forEach(propName => {
         if (has(attr, propName))
             temp[propName] = attr[propName];
     });
     return temp;
 });
 export const serilizeEventAttr = (attrs = [], language, additionalAttrProperties) => attrs.map(row => {
-    var _a;
     const event = new ListAttribute(row);
     const temp = {
         value: `${event.id}`,
@@ -235,7 +232,7 @@ export const serilizeEventAttr = (attrs = [], language, additionalAttrProperties
         type: event.propertyType,
         children: [],
     };
-    const tempChildren = (_a = event.items) === null || _a === void 0 ? void 0 : _a.map((child) => {
+    const tempChildren = event.items?.map((child) => {
         const tempChildrenItem = {
             value: `${event.id}.${child.itemPropertyName}`,
             itemTypeId: child.itemTypeId,
@@ -250,13 +247,13 @@ export const serilizeEventAttr = (attrs = [], language, additionalAttrProperties
             type: +child.type,
             dataType: child.dataType,
         };
-        additionalAttrProperties === null || additionalAttrProperties === void 0 ? void 0 : additionalAttrProperties.forEach(propName => {
+        additionalAttrProperties?.forEach(propName => {
             if (has(child, propName))
                 set(tempChildrenItem, propName, child[propName]);
         });
         return tempChildrenItem;
     });
-    additionalAttrProperties === null || additionalAttrProperties === void 0 ? void 0 : additionalAttrProperties.forEach(propName => {
+    additionalAttrProperties?.forEach(propName => {
         if (has(event, propName))
             set(temp, propName, event[propName]);
     });
@@ -268,7 +265,7 @@ export const serilizePromotionPool = (data, additionalAttrProperties) => data.ro
         label: pool.name,
         value: pool.code,
     };
-    additionalAttrProperties === null || additionalAttrProperties === void 0 ? void 0 : additionalAttrProperties.forEach(propName => {
+    additionalAttrProperties?.forEach(propName => {
         if (has(pool, propName))
             temp[propName] = pool[propName];
     });
@@ -281,7 +278,7 @@ export const CUSTOM_TYPE = {
 };
 export const buildOptionAttrArchive = (list, selected) => {
     const arrSelected = Array.isArray(selected) ? selected : [selected];
-    const result = (list === null || list === void 0 ? void 0 : list.filter(each => parseInt(each.status) !== 4 || arrSelected.includes(each.value))) || [];
+    const result = list?.filter(each => parseInt(each.status) !== 4 || arrSelected.includes(each.value)) || [];
     return result;
 };
 export const checkStatusAttr = ({ listBO, itemTypeId, listAttribute, field, }) => {
@@ -289,14 +286,14 @@ export const checkStatusAttr = ({ listBO, itemTypeId, listAttribute, field, }) =
     let isDisable = false;
     const isEmptyField = !field || (Array.isArray(field) && !field.length);
     // If field is empty, listAttribute is empty array then return empty errorMessage
-    if (isEmptyField || !(listAttribute === null || listAttribute === void 0 ? void 0 : listAttribute.length)) {
+    if (isEmptyField || !listAttribute?.length) {
         return {
             errorMessage: '',
             isDisable: false,
         };
     }
-    const selectedAttrs = listAttribute === null || listAttribute === void 0 ? void 0 : listAttribute.filter(bo => Array.isArray(field) ? field.includes(bo.value) : bo.value === field);
-    if (!(selectedAttrs === null || selectedAttrs === void 0 ? void 0 : selectedAttrs.length)) {
+    const selectedAttrs = listAttribute?.filter(bo => Array.isArray(field) ? field.includes(bo.value) : bo.value === field);
+    if (!selectedAttrs?.length) {
         errorMessage = ATTRIBUTE_STATUS.DELETE.errorMessage;
     }
     else {
@@ -305,7 +302,7 @@ export const checkStatusAttr = ({ listBO, itemTypeId, listAttribute, field, }) =
         }
     }
     if (Array.isArray(listBO) && !!itemTypeId) {
-        const selectedBO = listBO === null || listBO === void 0 ? void 0 : listBO.find(bo => bo.value === itemTypeId);
+        const selectedBO = listBO?.find(bo => bo.value === itemTypeId);
         if (!selectedBO) {
             errorMessage = BO_STATUS.DELETE.errorMessage;
             isDisable = true;
@@ -332,7 +329,7 @@ export const buildMappingFields = (dynamicItem, isFormatNumber = false, key = ''
         return '';
     }
     const { type, attribute, index, pool } = dynamicItem;
-    if (attribute === null || attribute === void 0 ? void 0 : attribute.value) {
+    if (attribute?.value) {
         const keySurfix = isFormatNumber ? `.format("${key}")` : '';
         switch (true) {
             case type === DYNAMIC_CONTENT_TYPE.EVENT_ATTRIBUTE.value:

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

@@ -1,16 +1,4 @@
-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;
-};
-// Libraries
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Atoms
 import { Button, Icon } from '@antscorp/antsomi-ui/es/components/atoms';
 // Molecules
@@ -24,29 +12,22 @@ export const ALIGN_TYPE = {
 };
 export const AlignEdit = props => {
     const { className, style, onChange, align } = props;
-    return (React.createElement(AlignSettingWrapper, { className: className, style: style },
-        React.createElement(Button, { style: {
-                aspectRatio: 1 / 1,
-                width: 25,
-                color: align !== ALIGN_TYPE.LEFT ? '#aaaaaa' : 'inherit',
-            }, onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange(ALIGN_TYPE.LEFT) },
-            React.createElement(Icon, { type: "icon-ants-align-left" })),
-        React.createElement(Button, { style: {
-                aspectRatio: 1 / 1,
-                width: 25,
-                color: align !== ALIGN_TYPE.CENTER ? '#aaaaaa' : 'inherit',
-            }, onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange(ALIGN_TYPE.CENTER) },
-            React.createElement(Icon, { type: "icon-ants-align-center" })),
-        React.createElement(Button, { style: {
-                aspectRatio: 1 / 1,
-                width: 25,
-                color: align !== ALIGN_TYPE.RIGHT ? '#aaaaaa' : 'inherit',
-            }, onClick: () => onChange === null || onChange === void 0 ? void 0 : onChange(ALIGN_TYPE.RIGHT) },
-            React.createElement(Icon, { type: "icon-ants-align-right" }))));
+    return (_jsxs(AlignSettingWrapper, { className: className, style: style, children: [_jsx(Button, { style: {
+                    aspectRatio: 1 / 1,
+                    width: 25,
+                    color: align !== ALIGN_TYPE.LEFT ? '#aaaaaa' : 'inherit',
+                }, onClick: () => onChange?.(ALIGN_TYPE.LEFT), children: _jsx(Icon, { type: "icon-ants-align-left" }) }), _jsx(Button, { style: {
+                    aspectRatio: 1 / 1,
+                    width: 25,
+                    color: align !== ALIGN_TYPE.CENTER ? '#aaaaaa' : 'inherit',
+                }, onClick: () => onChange?.(ALIGN_TYPE.CENTER), children: _jsx(Icon, { type: "icon-ants-align-center" }) }), _jsx(Button, { style: {
+                    aspectRatio: 1 / 1,
+                    width: 25,
+                    color: align !== ALIGN_TYPE.RIGHT ? '#aaaaaa' : 'inherit',
+                }, onClick: () => onChange?.(ALIGN_TYPE.RIGHT), children: _jsx(Icon, { type: "icon-ants-align-right" }) })] }));
 };
 export const AlignSetting = props => {
     // Props
-    const { label, labelClassName } = props, restOf = __rest(props, ["label", "labelClassName"]);
-    return (React.createElement(SettingWrapper, { label: label || 'Align', labelClassName: labelClassName },
-        React.createElement(AlignEdit, Object.assign({}, restOf))));
+    const { label, labelClassName, ...restOf } = props;
+    return (_jsx(SettingWrapper, { label: label || 'Align', labelClassName: labelClassName, children: _jsx(AlignEdit, { ...restOf }) }));
 };

package/es/components/molecules/ApplyPopupContent/ApplyPopupContent.js

@@ -1,16 +1,4 @@
-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;
-};
-// Libraries
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from 'clsx';
 // Components
 import { Flex, Typography, Icon, Button, } from '@antscorp/antsomi-ui/es/components/atoms';
@@ -22,17 +10,8 @@ import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
 import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
 const { Text } = Typography;
 export const ApplyPopupContent = props => {
-    const { title, children, cancelButtonProps, applyButtonProps, footerProps, onApply, onCancel } = props, restProps = __rest(props, ["title", "children", "cancelButtonProps", "applyButtonProps", "footerProps", "onApply", "onCancel"]);
+    const { title, children, cancelButtonProps, applyButtonProps, footerProps, onApply, onCancel, ...restProps } = props;
     const { align = 'center', justify = 'flex-end' } = footerProps || {};
     const { t } = i18nInstance;
-    return (React.createElement(ContentWrapper, Object.assign({}, restProps),
-        React.createElement(Flex, { className: "content__body", vertical: true, gap: 20 },
-            React.createElement(Flex, { align: "center", justify: "space-between" },
-                React.createElement(Text, { className: "content__title", ellipsis: { tooltip: true } }, title),
-                React.createElement(CloseButton, { align: "center", justify: "center", onClick: onCancel },
-                    React.createElement(Icon, { type: "icon-ants-remove-slim" }))),
-            children),
-        React.createElement(Flex, Object.assign({}, footerProps, { align: align, justify: justify, className: clsx('content__footer', footerProps === null || footerProps === void 0 ? void 0 : footerProps.className) }),
-            React.createElement(Button, Object.assign({ onClick: onCancel }, cancelButtonProps), t(translations.cancel.title).toString()),
-            React.createElement(Button, Object.assign({ type: "primary", onClick: onApply }, applyButtonProps), t(translations.apply.title).toString()))));
+    return (_jsxs(ContentWrapper, { ...restProps, children: [_jsxs(Flex, { className: "content__body", vertical: true, gap: 20, children: [_jsxs(Flex, { align: "center", justify: "space-between", children: [_jsx(Text, { className: "content__title", ellipsis: { tooltip: true }, children: title }), _jsx(CloseButton, { align: "center", justify: "center", onClick: onCancel, children: _jsx(Icon, { type: "icon-ants-remove-slim" }) })] }), children] }), _jsxs(Flex, { ...footerProps, align: align, justify: justify, className: clsx('content__footer', footerProps?.className), children: [_jsx(Button, { onClick: onCancel, ...cancelButtonProps, children: t(translations.cancel.title).toString() }), _jsx(Button, { type: "primary", onClick: onApply, ...applyButtonProps, children: t(translations.apply.title).toString() })] })] }));
 };