@antscorp/antsomi-ui 1.3.5-beta.31 → 1.3.5-beta.310

package/es/components/organism/FilterSetting/components/common/InputCalendarBetween/index.js

@@ -0,0 +1,47 @@
+// Libraries
+import React, { useContext } from 'react';
+import moment from 'moment';
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+// Atoms
+import { Text } from '@antscorp/antsomi-ui/es/components/atoms';
+// Molecules
+import { DatePickerV2 } from '@antscorp/antsomi-ui/es/components/molecules';
+// Constants
+import { dateFormatAPI, dateFormatFE, defaultDateFormatAPI } from '../../../constants';
+// Utils
+import { getValidMomentDate } from '../../../utils';
+// Translations
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
+// Filter context
+import { FilterContext } from '../../../context';
+export const InputCalendarBetween = props => {
+    const { t } = i18nInstance;
+    const { required, focused, value, onChange } = props;
+    // Context
+    const { isFormatDateTimeMilliseconds } = useContext(FilterContext);
+    const [from, to] = value
+        .split(isFormatDateTimeMilliseconds ? ' AND ' : 'AND')
+        .map(val => (isFormatDateTimeMilliseconds ? +val : val));
+    const onChangeFrom = (_, dateString) => {
+        const momentDate = getValidMomentDate(moment(dateString));
+        const newDate = isFormatDateTimeMilliseconds
+            ? (momentDate === null || momentDate === void 0 ? void 0 : momentDate.startOf('day').valueOf()) || null
+            : (momentDate === null || momentDate === void 0 ? void 0 : momentDate.format(defaultDateFormatAPI)) || null;
+        const newValue = isFormatDateTimeMilliseconds ? `${newDate} AND ${to}` : `${newDate}AND${to}`;
+        onChange(newValue);
+    };
+    const onChangeTo = (_, dateString) => {
+        const momentDate = getValidMomentDate(moment(dateString));
+        const newDate = isFormatDateTimeMilliseconds
+            ? (momentDate === null || momentDate === void 0 ? void 0 : momentDate.endOf('day').valueOf()) || null
+            : (momentDate === null || momentDate === void 0 ? void 0 : momentDate.format('YYYY-MM-DD 23:59:59')) || null;
+        const newValue = isFormatDateTimeMilliseconds
+            ? `${from} AND ${newDate}`
+            : `${from}AND${newDate}`;
+        onChange(newValue);
+    };
+    return (React.createElement("div", { style: { display: 'flex', alignItems: 'center' } },
+        React.createElement(DatePickerV2, { focused: focused, required: required, format: dateFormatFE, value: getValidMomentDate(moment(from, !isFormatDateTimeMilliseconds ? dateFormatAPI : '')), onChange: onChangeFrom, style: { borderTop: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' } }),
+        React.createElement(Text, { style: { marginLeft: 16, marginRight: 16 } }, t(translations.and.title).toString()),
+        React.createElement(DatePickerV2, { focused: focused, required: required, format: dateFormatFE, value: getValidMomentDate(moment(to, !isFormatDateTimeMilliseconds ? dateFormatAPI : '')), onChange: onChangeTo, style: { borderTop: '0px', borderLeftWidth: '0px', borderRightWidth: '0px' } })));
+};

package/es/components/organism/FilterSetting/components/common/InputDateTimeAgo/index.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+type TimeUnit = 'DAY' | 'HOUR';
+interface InputDateTimeAgoProps {
+    value: string | number;
+    timeUnit?: TimeUnit;
+    onChangeMultipleValue: ({ value, time_unit, }: {
+        value?: InputDateTimeAgoProps['value'];
+        time_unit?: InputDateTimeAgoProps['timeUnit'];
+    }) => void;
+    required?: boolean;
+}
+export declare const InputDateTimeAgo: React.FC<InputDateTimeAgoProps>;
+export {};

package/es/components/organism/FilterSetting/components/common/InputDateTimeAgo/index.js

@@ -0,0 +1,23 @@
+/* eslint-disable @typescript-eslint/no-use-before-define */
+import React from 'react';
+import { InputNumberWithLabel as InputNumber, Select, } from '@antscorp/antsomi-ui/es/components/molecules';
+export const InputDateTimeAgo = props => {
+    const { value, timeUnit, onChangeMultipleValue, required } = props;
+    const onChangeTime = val => {
+        onChangeMultipleValue({
+            value: val,
+        });
+    };
+    const onChangeUnit = (val) => {
+        onChangeMultipleValue({
+            time_unit: val,
+        });
+    };
+    return (React.createElement("div", { style: { display: 'flex', alignItems: 'center' } },
+        React.createElement(InputNumber, { required: required, value: value, onChange: onChangeTime, width: "100%" }),
+        React.createElement(Select, { style: { marginLeft: 16, width: 96 }, value: timeUnit, onChange: onChangeUnit, options: optionsInputDateTimeAgo })));
+};
+const optionsInputDateTimeAgo = [
+    { value: 'DAY', label: 'Days' },
+    { value: 'HOUR', label: 'Hours' },
+];

package/es/components/organism/FilterSetting/components/common/InputDateTimeBetweenAgo/index.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface InputDateTimeBetweenAgoProps {
+    value: string;
+    timeUnit?: string;
+    onChange: ({ value, time_unit, }: {
+        value?: InputDateTimeBetweenAgoProps['value'];
+        time_unit?: InputDateTimeBetweenAgoProps['timeUnit'];
+    }) => void;
+}
+export declare const InputDateTimeBetweenAgo: React.FC<InputDateTimeBetweenAgoProps>;
+export {};

package/es/components/organism/FilterSetting/components/common/InputDateTimeBetweenAgo/index.js

@@ -0,0 +1,34 @@
+// Libraries
+import React from 'react';
+// Translations
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
+// Atoms
+import { Text } from '@antscorp/antsomi-ui/es/components/atoms';
+// Molecules
+import { InputNumberWithLabel as InputNumber, Select, } from '@antscorp/antsomi-ui/es/components/molecules';
+const DATE_TIME_BETWEEN_OPTIONS = [
+    { value: 'DAY', label: 'Days' },
+    { value: 'HOUR', label: 'Hours' },
+];
+export const InputDateTimeBetweenAgo = props => {
+    const { t } = i18nInstance;
+    const { value, timeUnit, onChange } = props;
+    const [from, to] = (value === null || value === void 0 ? void 0 : value.split(' AND ')) || [];
+    const onChangeFrom = val => {
+        const newValue = `${val} AND ${to}`;
+        onChange({ value: newValue });
+    };
+    const onChangeTo = val => {
+        const newValue = `${from} AND ${val}`;
+        onChange({ value: newValue });
+    };
+    const onChangeUnit = val => {
+        onChange({ time_unit: val });
+    };
+    return (React.createElement("div", { style: { display: 'flex', alignItems: 'center' } },
+        React.createElement(InputNumber, { required: true, value: from, onChange: onChangeFrom, width: "100%", min: to }),
+        React.createElement(Text, { style: { margin: '0px 16px ' } }, t(translations.and.title).toString()),
+        React.createElement(InputNumber, { required: true, value: to, onChange: onChangeTo, width: "100%", max: from }),
+        React.createElement(Select, { style: { marginLeft: 16, width: 96 }, value: timeUnit, onChange: onChangeUnit, options: Object.values(DATE_TIME_BETWEEN_OPTIONS) })));
+};

package/es/components/organism/FilterSetting/components/common/InputNumber/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface InputNumberProps {
+    value: string | number;
+    onChange: (val: InputNumberProps['value']) => void;
+}
+export declare const InputNumber: React.FC<InputNumberProps>;
+export {};

package/es/components/organism/FilterSetting/components/common/InputNumber/index.js

@@ -0,0 +1,11 @@
+// Libraries
+import React from 'react';
+// Molecules
+import { InputNumberWithLabel as InputNumberAntd } from '@antscorp/antsomi-ui/es/components/molecules';
+export const InputNumber = props => {
+    const { value, onChange } = props;
+    const onChangeValue = val => {
+        onChange(val);
+    };
+    return React.createElement(InputNumberAntd, { value: value, onChange: onChangeValue, width: "100%" });
+};

package/es/components/organism/FilterSetting/components/common/InputNumberBetween/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+interface InputNumberBetweenProps {
+    value: string;
+    onChange: (val: InputNumberBetweenProps['value']) => void;
+}
+export declare const InputNumberBetween: React.FC<InputNumberBetweenProps>;
+export {};

package/es/components/organism/FilterSetting/components/common/InputNumberBetween/index.js

@@ -0,0 +1,26 @@
+// Libraries
+import React from 'react';
+// Translations
+import i18nInstance from '@antscorp/antsomi-ui/es/locales/i18n';
+import { translations } from '@antscorp/antsomi-ui/es/locales/translations';
+// Atoms
+import { Text } from '@antscorp/antsomi-ui/es/components/atoms';
+// Molecules
+import { InputNumberWithLabel as InputNumber } from '@antscorp/antsomi-ui/es/components/molecules';
+export const InputNumberBetween = props => {
+    const { t } = i18nInstance;
+    const { value, onChange } = props;
+    const [from, to] = value.split(' AND ');
+    const onChangeFrom = (val) => {
+        const newValue = `${val} AND ${to}`;
+        onChange(newValue);
+    };
+    const onChangeTo = (val) => {
+        const newValue = `${from} AND ${val}`;
+        onChange(newValue);
+    };
+    return (React.createElement("div", { style: { display: 'flex', alignItems: 'center' } },
+        React.createElement(InputNumber, { required: true, value: from, onChange: onChangeFrom, width: "100%", max: to }),
+        React.createElement(Text, { style: { marginLeft: 16, marginRight: 16 } }, t(translations.and.title).toString()),
+        React.createElement(InputNumber, { required: true, value: to, onChange: onChangeTo, width: "100%", min: from })));
+};

package/es/components/organism/FilterSetting/components/common/InputOrSelect/index.d.ts

@@ -0,0 +1,79 @@
+import React from 'react';
+import { CustomerMetadata, EventBoFieldMetadata, VisitorMetadata } from '@antscorp/antsomi-ui/es/components/atoms/InputDynamic/types';
+type Value = string | null;
+type ValueType = 'event' | 'normal' | 'customer' | 'visitor' | string;
+type BOField = {
+    label: string;
+    value: string;
+    dataType: string;
+};
+interface InputOrSelectProps {
+    value: Value;
+    eventMetadata: EventBoFieldMetadata;
+    visitorMetadata: VisitorMetadata;
+    customerMetadata: CustomerMetadata;
+    valueType: ValueType;
+    onChangeMultipleValue: ({ value, event_metadata, visitor_metadata, customer_metadata, value_type, }: {
+        value?: InputOrSelectProps['value'];
+        event_metadata?: InputOrSelectProps['eventMetadata'];
+        visitor_metadata?: InputOrSelectProps['visitorMetadata'];
+        customer_metadata?: InputOrSelectProps['customerMetadata'];
+        value_type?: InputOrSelectProps['valueType'];
+    }) => void;
+    dataType: string | null;
+    businessObject?: Record<string, string>;
+    boFieldOptions?: BOField[];
+    useBo?: boolean;
+    hideSelectField?: boolean;
+}
+export declare const InputOrSelect: React.FC<InputOrSelectProps>;
+interface ModalSelectProps {
+    isModalVisible: boolean;
+    valueType: ValueType;
+    handleOk: ({ valueType, metaData }: {
+        valueType: any;
+        metaData: any;
+    }) => void;
+    handleCancel: () => void;
+    eventMetadata: EventBoFieldMetadata;
+    customerMetadata: CustomerMetadata;
+    visitorMetadata: VisitorMetadata;
+    businessObject?: Record<string, string>;
+    boFieldOptions?: BOField[];
+    defaultIsBo?: boolean;
+    onError?: (errorMsg: string) => void;
+}
+export declare const ModalSelect: React.FC<ModalSelectProps>;
+export declare const StyledAutoComplete: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-select/lib/Select").DefaultOptionType | import("rc-select/lib/Select").BaseOptionType = import("rc-select/lib/Select").DefaultOptionType>(props: import("antd").AutoCompleteProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<import("antd").RefSelectProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    displayName?: string | undefined;
+    Option: import("rc-select/lib/Option").OptionFC;
+    _InternalPanelDoNotUseOrYouWillBeFired: (props: import("antd/es/_util/type").AnyObject) => React.JSX.Element;
+}, any, {}, never>;
+export declare const StyledDropdown: import("styled-components").StyledComponent<"div", any, {
+    $isSearching: boolean;
+}, never>;
+export declare const StyledSelect: import("styled-components").StyledComponent<{
+    (props: import("@antscorp/antsomi-ui/es/components/molecules").SelectV2Props): React.JSX.Element;
+    defaultProps: {
+        suffixIcon: React.JSX.Element;
+        filterOption: (input: any, option: any) => boolean;
+        tagRender: (props: any) => React.JSX.Element;
+        containerStyle: {};
+        labelStyle: {};
+        clearIcon: React.JSX.Element;
+    };
+}, any, any, never>;
+export declare const StyledTreeSelect: import("styled-components").StyledComponent<(<ValueType = any, OptionType extends import("rc-tree-select/lib/TreeSelect").DefaultOptionType | import("rc-tree-select/lib/TreeSelect").BaseOptionType = import("rc-tree-select/lib/TreeSelect").DefaultOptionType>(props: import("antd").TreeSelectProps<ValueType, OptionType> & {
+    children?: React.ReactNode;
+} & React.RefAttributes<import("antd").RefSelectProps>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    displayName?: string | undefined;
+    TreeNode: React.FC<import("rc-tree-select/lib/TreeNode").TreeNodeProps>;
+    SHOW_ALL: "SHOW_ALL";
+    SHOW_PARENT: "SHOW_PARENT";
+    SHOW_CHILD: "SHOW_CHILD";
+    _InternalPanelDoNotUseOrYouWillBeFired: (props: import("antd/es/_util/type").AnyObject) => React.JSX.Element;
+}, any, {}, never>;
+export declare const StyledSearch: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<import("antd/lib/input/Search").SearchProps & React.RefAttributes<import("antd").InputRef>>, any, {}, never>;
+export {};