@antscorp/antsomi-ui 1.3.3-beta.93 → 1.3.3-beta.95

package/es/components/atoms/InputDynamic/constants.d.ts

@@ -1,71 +0,0 @@
-export declare const DATE_AND_TIME_DEFAULT: {
-    type: string;
-    config: {
-        format: string;
-        date: {
-            check: boolean;
-            value: string;
-        };
-        time: {
-            check: boolean;
-            value: string;
-            timeFormat: string;
-        };
-    };
-};
-export declare const MAP_DATA_TYPE: {
-    number: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    string: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    text: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    datetime: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    boolean: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    array_number: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    array_string: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    array_datetime: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-    object: {
-        name: string;
-        label: string;
-        translateCode: string;
-        value: string;
-    };
-};

package/es/components/atoms/InputDynamic/constants.js

@@ -1,71 +0,0 @@
-export const DATE_AND_TIME_DEFAULT = {
-    type: 'DATE_AND_TIME',
-    config: {
-        format: 'DD/MM/YYYY',
-        date: {
-            check: true,
-            value: 'long',
-        },
-        time: {
-            check: true,
-            value: 'medium',
-            timeFormat: '24',
-        },
-    },
-};
-export const MAP_DATA_TYPE = {
-    number: {
-        name: 'number',
-        label: 'Number',
-        translateCode: '',
-        value: 'number',
-    },
-    string: {
-        name: 'string',
-        label: 'String',
-        translateCode: '',
-        value: 'string',
-    },
-    text: {
-        name: 'text',
-        label: 'Text',
-        translateCode: '',
-        value: 'text',
-    },
-    datetime: {
-        name: 'datetime',
-        label: 'Datetime',
-        translateCode: '',
-        value: 'datetime',
-    },
-    boolean: {
-        name: 'boolean',
-        label: 'Boolean',
-        translateCode: '',
-        value: 'boolean',
-    },
-    array_number: {
-        name: 'array_number',
-        label: 'Array of Numbers',
-        translateCode: '',
-        value: 'array_number',
-    },
-    array_string: {
-        name: 'array_string',
-        label: 'Array of Strings',
-        translateCode: '',
-        value: 'array_string',
-    },
-    array_datetime: {
-        name: 'array_datetime',
-        label: 'Array of Datetimes',
-        translateCode: '',
-        value: 'array_datetime',
-    },
-    object: {
-        name: 'object',
-        label: 'Object',
-        translateCode: '',
-        value: 'object',
-    },
-};

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

@@ -1,2 +0,0 @@
-export { InputDynamic } from './InputDynamic';
-export type { InputDynamicProps } from './types';

package/es/components/atoms/InputDynamic/index.js

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

package/es/components/atoms/InputDynamic/styled.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-export declare const WrapperInputStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const SpanIcon: import("styled-components").StyledComponent<"span", any, {
-    isDisabled?: boolean | undefined;
-}, never>;
-export declare const InputWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
-export declare const InputShortLink: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof import("react").JSX.IntrinsicElements, any, import("../Input/Input").InputProps, any>;
-export declare const TooltipHover: import("styled-components").StyledComponent<"div", any, {
-    top: number;
-    left: number;
-    isShow: boolean;
-}, never>;
-export declare const DynamicItem: import("styled-components").StyledComponent<"div", any, {}, never>;

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

@@ -1,293 +0,0 @@
-var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r;
-// Libraries
-import styled from 'styled-components';
-import { Input } from '../Input/Input';
-// Constants
-import { THEME } from '@antscorp/antsomi-ui/es/constants';
-export const WrapperInputStyle = styled.div `
-  color: ${(_a = THEME.token) === null || _a === void 0 ? void 0 : _a.colorText};
-  position: relative;
-
-  .input-wrapper-outter {
-    position: relative;
-    max-width: 100%;
-    min-height: 22px;
-    max-height: 6rem;
-    overflow: auto;
-    padding: 5px;
-    border-bottom: 1px solid ${(_b = THEME.token) === null || _b === void 0 ? void 0 : _b.blue1};
-  }
-
-  .customize-antsomi-profile {
-    position: absolute;
-    font-size: 20px;
-    right: 4px;
-    top: 50%;
-    transform: translateY(-50%);
-    cursor: pointer;
-    color: rgb(0, 94, 184);
-  }
-
-  .styles-input-wrapper {
-    border-bottom: 1px solid ${(_c = THEME.token) === null || _c === void 0 ? void 0 : _c.blue1} !important;
-    :hover {
-      cursor: text;
-      background-color: ${(_d = THEME.token) === null || _d === void 0 ? void 0 : _d.blue};
-      border-bottom: 1px solid ${(_e = THEME.token) === null || _e === void 0 ? void 0 : _e.blue1};
-    }
-    :focus-within {
-      background-color: ${(_f = THEME.token) === null || _f === void 0 ? void 0 : _f.bw0};
-      border-bottom: 1px solid rgb(0, 94, 184);
-    }
-    :active {
-      background-color: ${(_g = THEME.token) === null || _g === void 0 ? void 0 : _g.bw0};
-      border-bottom: 1px solid rgb(0, 94, 184);
-    }
-  }
-
-  .input-error {
-    border-bottom-color: rgb(239, 51, 64);
-  }
-
-  .customize-antsomi-profile-outter {
-    position: absolute;
-    font-size: 20px;
-    right: 2.8rem;
-    top: 2.3rem;
-    transform: translateY(-50%);
-    cursor: pointer;
-    color: ${(_h = THEME.token) === null || _h === void 0 ? void 0 : _h.blue7};
-  }
-
-  .input-personal {
-    padding: 0px 4px;
-    padding-right: 32px;
-    outline: none;
-    overflow-wrap: normal;
-    overflow: hidden;
-    text-overflow: unset;
-    white-space: normal;
-    // display: inline-block;
-
-    .detect-url {
-      background-color: #e8feca;
-      display: inline;
-      position: relative;
-      cursor: pointer;
-    }
-  }
-  /*
-  $base-color: ${(_j = THEME.token) === null || _j === void 0 ? void 0 : _j.blue7};
-  $bg-base-color: #fff;
-  $border-base-color: ${(_k = THEME.token) === null || _k === void 0 ? void 0 : _k.bw3_5};
-  $bg-btn-base-color: #f4f6f8; */
-
-  .antsomi-wrapper-personalization {
-    width: 100%;
-    height: 100%;
-    background: $bg-base-color;
-    border: 1px solid $border-base-color;
-    border-radius: ${(_l = THEME.token) === null || _l === void 0 ? void 0 : _l.borderRadius}px;
-    display: flex;
-    flex-direction: column;
-    font-size: 14px;
-    font-family: Roboto, 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace;
-    // box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
-    .header {
-      padding: 13px 20px;
-      position: relative;
-
-      .title {
-        font-size: 20px;
-        font-weight: bold;
-        color: $base-color;
-      }
-
-      &:before {
-        content: '';
-        position: absolute;
-        left: 0;
-        bottom: 0;
-        height: 15px;
-        width: 95%;
-        border-bottom: 1px solid $border-base-color;
-      }
-    }
-
-    .body {
-      overflow: auto;
-      flex-grow: 1;
-      padding: 0 5px;
-
-      table {
-        width: 100%;
-        height: 100%;
-        table-layout: fixed;
-        border-collapse: collapse;
-        border-spacing: 0;
-        th,
-        td {
-          text-align: left;
-          padding: 0 15px;
-        }
-      }
-    }
-
-    .footer {
-      display: flex;
-      padding: 15px 25px;
-      justify-content: flex-end;
-    }
-  }
-
-  .btn {
-    min-width: 100px;
-    min-height: 40px;
-    border-radius: ${(_m = THEME.token) === null || _m === void 0 ? void 0 : _m.borderRadius}px;
-    outline: none;
-    border: none;
-    cursor: pointer;
-
-    &:focus {
-      outline: none !important;
-    }
-  }
-
-  .group-btn {
-    width: 222px;
-    display: flex;
-    justify-content: space-between;
-  }
-
-  .btn-default {
-    background-color: $bg-btn-base-color;
-    color: $base-color;
-    border: 1px solid #d7dfe8;
-
-    &:hover {
-      background-color: #e3e9ef;
-    }
-  }
-
-  .btn-blue {
-    background-color: $base-color;
-    color: $bg-base-color;
-    border: 1px solid #707070;
-    opacity: 0.9;
-
-    &:hover {
-      opacity: 1;
-    }
-  }
-
-  .input-outline {
-    border-top-style: hidden;
-    border-right-style: hidden;
-    border-left-style: hidden;
-    height: 27px;
-    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
-
-    &:focus {
-      outline: none;
-    }
-  }
-
-  .insert-word {
-    padding: 5px 8px;
-    color: white;
-    border: 1px solid;
-    border-radius: 20px;
-    height: 30px;
-    cursor: pointer;
-    line-height: 1px;
-    background: #bbefbe;
-
-    &.blue {
-      background: #3c39ba;
-    }
-
-    &.orange {
-      background: #fbac00;
-    }
-
-    &.violet-pc {
-      background: #6750a7;
-    }
-
-    &.disabled {
-      background: #ccc;
-    }
-    &.custom {
-      background: #bbefbe;
-      // border: 1px solid #BBEFBE;
-    }
-
-    em {
-      color: white;
-      font-style: normal;
-      font-size: 13px;
-      opacity: 0;
-      user-select: none;
-    }
-
-    &:hover {
-      em {
-        opacity: 1;
-      }
-    }
-  }
-`;
-export const SpanIcon = styled.span `
-  ${({ isDisabled }) => isDisabled && `cursor: not-allowed !important; opacity: 0.5;`}
-  font-size: 20px;
-`;
-export const InputWrapper = styled.div `
-  .input__wrapper {
-    display: flex;
-    align-items: center;
-
-    div.--default {
-      min-width: 120px;
-    }
-  }
-`;
-export const InputShortLink = styled(Input) ``;
-export const TooltipHover = styled.div `
-  position: fixed;
-  left: ${props => `${props.left}px`};
-  top: ${props => `${props.top}px`};
-
-  display: ${props => (props.isShow ? 'flex' : 'none')};
-  justify-content: center;
-  align-items: center;
-
-  background: rgba(0, 0, 0, 0.62);
-  transition: opacity 186ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,
-    transform 124ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
-  color: ${(_o = THEME.token) === null || _o === void 0 ? void 0 : _o.bw0};
-  font-size: 12px;
-  box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14),
-    0px 3px 14px 2px rgba(0, 0, 0, 0.12);
-  border-radius: 4px;
-  height: 24px;
-  width: auto;
-  z-index: 999;
-  padding: 5px 10px;
-  user-select: none;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-  box-sizing: border-box;
-`;
-export const DynamicItem = styled.div `
-  padding: 4px 16px;
-  font-size: 13px;
-  color: ${(_p = THEME.token) === null || _p === void 0 ? void 0 : _p.bw10};
-  cursor: pointer;
-  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
-
-  &:hover {
-    color: ${(_q = THEME.token) === null || _q === void 0 ? void 0 : _q.bw0};
-    background-color: ${(_r = THEME.token) === null || _r === void 0 ? void 0 : _r.colorPrimary};
-  }
-`;

package/es/components/atoms/InputDynamic/types.d.ts

@@ -1,116 +0,0 @@
-import { DisableShortLinkTypeProps } from './PopupShortLink';
-import { AllowDynamicType } from './InputDynamic';
-import { APIConfig, TDataType } from '../../molecules/AddDynamicContent';
-export type KeyTagType = 'shortlink' | 'shortlink_static';
-export type SelectedPropertiesProps = {
-    keyTag: KeyTagType;
-    link: string;
-    urlDetected: string;
-};
-export type AllowDynamicOptions = (typeof AllowDynamicType)[keyof typeof AllowDynamicType];
-export type InputDynamicProps = {
-    value: string;
-    isViewMode?: boolean;
-    isRealTime?: boolean;
-    ms?: number;
-    errors?: string[];
-    disabled?: boolean;
-    disabledOpts?: DisableShortLinkTypeProps;
-    allowDynamicOptions?: Array<AllowDynamicOptions>;
-    showIndex?: boolean;
-    showDisplayFormat?: boolean;
-    isShowCustomFunction?: boolean;
-    apiConfig?: APIConfig;
-    canMultipleLine?: boolean;
-    onError?: Function;
-    onChange: (valueOut: string) => any;
-    addMessageToQueue?: Function;
-};
-export type TOperatorValue = 'greater_than' | 'greater_than_equal' | 'less_than' | 'less_than_equal' | 'not_equals' | 'equals' | 'between' | 'exists' | 'not_exists' | 'contains' | 'doesnt_contain' | 'start_with' | 'not_start_with' | 'end_with' | 'not_end_with' | 'before_date' | 'after_date' | 'equal_time_ago' | 'not_equal_time_ago' | 'before_time_ago' | 'after_time_ago' | 'between_time_ago' | 'matches' | 'not_matches' | 'includes' | 'doesnt_include' | null;
-export type VisitorMetadata = {
-    item_type_id: string | number;
-    item_type_name: string;
-    item_property_name: string;
-};
-export type CustomerMetadata = VisitorMetadata;
-export type EventMetadata = {
-    insight_property_id: any | any[] | null;
-    insight_property_ids?: string[] | null;
-    event_action_id: string | null;
-    event_category_id: string | null;
-    event_tracking_name: string | null;
-    item_type_id: string | null;
-    item_type_name: string | null;
-    item_property_name: string | null;
-    item_property_label: string | null;
-    event_property_syntax: string | null;
-};
-export type TFilter = {
-    value: any;
-    operator: TOperatorValue;
-    data_type: TDataType;
-    column: string | null;
-    condition_type: 'comp_attr' | null;
-    value_type: 'event' | 'normal' | 'visitor' | 'customer';
-    time_unit?: 'DAY' | 'HOUR';
-    event_metadata?: EventMetadata;
-    visitor_metadata?: VisitorMetadata;
-    customer_metadata?: CustomerMetadata;
-    extend?: any;
-};
-export type TFilters = {
-    OR: {
-        AND: TFilter[];
-    }[];
-};
-export type TRanking = {
-    type: 'algorithms' | 'custom';
-    algorithms: {
-        sort: 'mix' | 'order';
-        value: {
-            value: string;
-            quantity: number;
-            by?: string;
-            last?: number;
-            to?: string;
-            sort_type?: 'desc' | 'asc';
-            [key: string]: any;
-        }[];
-        filters: string[];
-    };
-    custom: string;
-};
-export type TContentSourceGroup = {
-    groupId: string;
-    groupName: string;
-    filters: TFilters;
-    ranking: TRanking;
-    itemTypeId: number | null;
-    itemTypeName: string | null;
-    itemTypeDisplay: string | null;
-    fallback: string;
-    level?: string;
-    data?: Record<string, any>[];
-};
-export type TContentSourceSettings = {
-    groups: TContentSourceGroup[];
-    expanded: string[];
-    isLoadingDataBO: boolean;
-};
-export type DynamicContentProps = {
-    visible: boolean;
-    contentSources: TContentSourceSettings;
-    activeTagId: string;
-    defaultData: {
-        [tagId: string]: Record<string, any>;
-    };
-    journeySettings: {
-        unsubscribeSegmentType?: string | null;
-        triggerType?: string | null;
-        triggerEvent?: {
-            eventActionId: number | string;
-            eventCategoryId: number | string;
-            insightPropertyIds: any[];
-        };
-    };
-};

package/es/components/atoms/InputDynamic/utils.d.ts

@@ -1,30 +0,0 @@
-import type { AllowDynamicOptions } from './types';
-import type { DynamicContentType } from '../../molecules/AddDynamicContent';
-export declare function validateURL(string: string): boolean;
-export declare const getInsertPatternWithAppendSpaceEnd: (id: any, code: any, label: any, bgColor: any) => string;
-export declare const genShortLinkValue: (url: string, type?: string) => {
-    id: string;
-    value: string;
-    label: string;
-};
-export declare const getInsertPattern: (id: any, code: any, label: any, bgColor: any) => string;
-export declare const convertHtmlText: (htmlText: string, format: string | undefined, state: any, objectWidgetInput?: {}, type?: string, init?: string) => string;
-export declare const handleUpdateInputPersonalization: (listIconRemove: any, listBtnElement: any) => void;
-export declare function removeHtmlTag(text: any): string;
-export declare function convertBreakTag(text: any): any;
-export declare function convertDivToBreakTag(text: any): any;
-export declare const pasteHtmlAtCaret: (html: any, selectPastedContent: any, callback?: any) => void;
-export declare const getInsertLinkPatternWithAppendSpaceEnd: (id: string | number, value: string, label: string) => string;
-export declare const validateHTMLTags: {
-    escapeCustomTags(t: any): any;
-    isCustomTag(t: any): boolean;
-    isValidTag(t: any): boolean;
-};
-export declare const spacingNonTracking: (data: any) => boolean;
-export declare const initialValue: (initValue: string) => string | undefined;
-export declare const mapLabelPersonalization: (type: AllowDynamicOptions) => string;
-export declare const createElement: (element: any, attribute: any, inner: any) => any;
-export declare const DATA_ATTR_WITH_TYPE: string[];
-export declare const mapDataFormatAttribute: (dataIn: any) => any;
-export declare const regexAttrFormat: RegExp;
-export declare const getBgColorByContentSourceType: (type: DynamicContentType) => string;