@antscorp/antsomi-ui 1.3.5-beta.258 → 1.3.5-beta.259

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/es/components/molecules/SelectEventAttribute/index.d.ts +2 -1
  2. package/es/components/molecules/SelectEventAttribute/index.js +2 -2
  3. package/es/components/organism/AlgorithmsSetting/index.js +18 -12
  4. package/package.json +1 -1
package/es/components/molecules/SelectEventAttribute/index.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import React from 'react';
1
+ import React, { CSSProperties } from 'react';
2
2
  export type EventMetadata = {
3
3
  insight_property_id: any | any[] | null;
4
4
  insight_property_ids?: string[] | null;
@@ -12,6 +12,7 @@ export type EventMetadata = {
12
12
  event_property_syntax: string | null;
13
13
  };
14
14
  interface SelectEventAttributeProps {
15
+ styleWrapper?: CSSProperties;
15
16
  eventMetadata: EventMetadata;
16
17
  isShowErrorAlert: boolean;
17
18
  journeySettings: Record<string, any>;
package/es/components/molecules/SelectEventAttribute/index.js CHANGED
@@ -43,7 +43,7 @@ export const SelectEventAttribute = memo(props => {
43
43
  // I18n
44
44
  const { t } = i18nInstance;
45
45
  // Props
46
- const { eventMetadata, journeySettings, isShowErrorAlert, onChange } = props;
46
+ const { styleWrapper = {}, eventMetadata, journeySettings, isShowErrorAlert, onChange } = props;
47
47
  // Selectors
48
48
  const { triggerEvent } = journeySettings || {};
49
49
  const serviceAuth = useSelectServiceAuth();
@@ -257,7 +257,7 @@ export const SelectEventAttribute = memo(props => {
257
257
  });
258
258
  }
259
259
  };
260
- return (React.createElement(SelectEventAttributeWrapper, null,
260
+ return (React.createElement(SelectEventAttributeWrapper, { style: styleWrapper },
261
261
  React.createElement(Select, { showSearch: true, required: true, focused: isShowErrorAlert, value: eventMetadata.event_tracking_name || undefined, loading: loading.isLoadingEvent, placeholder: t(translations.selectEvent.title).toString(), options: listEvent.map(({ value, label }) => ({ value, label })), onChange: onChangeEvent }),
262
262
  React.createElement(StyledSelect, { showSearch: true, required: true, focused: isShowErrorAlert, value: eventMetadata.insight_property_id || undefined, mode: "multiple", allowClear: true, maxTagTextLength: 18, loading: loading.isLoadingSource, placeholder: t(translations.inAnySourceOf.title).toString(), options: listSourceByEvent.map(({ value, label }) => ({ value, label })), onChange: onChangeSource }),
263
263
  React.createElement(TreeSelect, { showSearch: true,
package/es/components/organism/AlgorithmsSetting/index.js CHANGED
@@ -53,8 +53,14 @@ import { useGetListBO, useGetListAttributeBO, } from '@antscorp/antsomi-ui/es/qu
53
53
  // Selectors
54
54
  import { useSelectModeView, useSelectServiceAuth } from '../ContentSources/provider';
55
55
  const PATH = 'src/components/organism/AlgorithmsSetting/index.tsx';
56
+ const MAX_WIDTH = 150;
57
+ const limitWidthStyle = {
58
+ width: '100%',
59
+ maxWidth: `${MAX_WIDTH}px`,
60
+ };
56
61
  const styleNoBorderWFull = {
57
62
  width: '100%',
63
+ maxWidth: `${MAX_WIDTH}px`,
58
64
  borderLeftWidth: '0px',
59
65
  borderRightWidth: '0px',
60
66
  borderTop: '0px',
@@ -387,7 +393,7 @@ export const AlgorithmsSetting = (props) => {
387
393
  React.createElement(RequiredLabel, Object.assign({}, labelStyle),
388
394
  t(translations.by.title).toString(),
389
395
  char),
390
- React.createElement(StyledSelect, Object.assign({ required: true, mode: "multiple", loading: isLoadingAttribute, allowClear: true, showSearch: true, focused: isShowErrorAlert, errorArchive: errorMessage, disabled: isDisable, placeholder: t(translations.selectAField.title).toString(), style: { width: '100%' }, maxTagTextLength: 18, value: algo.by }, (((_b = algo.by) === null || _b === void 0 ? void 0 : _b.length) === MAX_RETARGET_SEARCH_BY && { open: false }), { options: buildOptionAttrArchive(listAttributeRetarget, algo.by), onChange: value => onChangeAlgorithm(algo, { by: value }) }))),
396
+ React.createElement(StyledSelect, Object.assign({ required: true, mode: "multiple", loading: isLoadingAttribute, allowClear: true, showSearch: true, focused: isShowErrorAlert, errorArchive: errorMessage, disabled: isDisable, placeholder: t(translations.selectAField.title).toString(), style: limitWidthStyle, maxTagTextLength: 18, value: algo.by }, (((_b = algo.by) === null || _b === void 0 ? void 0 : _b.length) === MAX_RETARGET_SEARCH_BY && { open: false }), { options: buildOptionAttrArchive(listAttributeRetarget, algo.by), onChange: value => onChangeAlgorithm(algo, { by: value }) }))),
391
397
  React.createElement(AlgorithmWrapper, { mode: mode },
392
398
  React.createElement(Text, Object.assign({}, labelStyle),
393
399
  t(translations.last.title).toString(),
@@ -418,7 +424,7 @@ export const AlgorithmsSetting = (props) => {
418
424
  React.createElement(RequiredLabel, Object.assign({}, labelStyle),
419
425
  t(translations.by.title).toString(),
420
426
  char),
421
- React.createElement(StyledSelect, { required: true, mode: "multiple", allowClear: true, showSearch: true, focused: isShowErrorAlert, errorArchive: errorMessage, disabled: isDisable, placeholder: t(translations.selectContent.title).toString(), style: { width: '100%' }, maxTagTextLength: 18, value: algo.by, options: SIMILAR_CONTENT_OPTIONS, onChange: value => onChangeAlgorithm(algo, { by: value }) })));
427
+ React.createElement(StyledSelect, { required: true, mode: "multiple", allowClear: true, showSearch: true, focused: isShowErrorAlert, errorArchive: errorMessage, disabled: isDisable, placeholder: t(translations.selectContent.title).toString(), style: limitWidthStyle, maxTagTextLength: 18, value: algo.by, options: SIMILAR_CONTENT_OPTIONS, onChange: value => onChangeAlgorithm(algo, { by: value }) })));
422
428
  break;
423
429
  }
424
430
  case 'distance': {
@@ -428,18 +434,18 @@ export const AlgorithmsSetting = (props) => {
428
434
  React.createElement(RequiredLabel, Object.assign({}, labelStyle),
429
435
  t(translations.by.title).toString(),
430
436
  char),
431
- React.createElement(Select, { required: true, disabled: isDisable, focused: isShowErrorAlert, loading: isLoadingAttribute, showSearch: true, placeholder: t(translations.selectAField.title).toString(), style: { width: '100%' }, value: algo.by, options: buildOptionAttrArchive(listAttribute, algo.by), onChange: value => onChangeAlgorithm(algo, { by: value }), errorArchive: errorMessage })),
437
+ React.createElement(Select, { required: true, disabled: isDisable, focused: isShowErrorAlert, loading: isLoadingAttribute, showSearch: true, placeholder: t(translations.selectAField.title).toString(), style: limitWidthStyle, value: algo.by, options: buildOptionAttrArchive(listAttribute, algo.by), onChange: value => onChangeAlgorithm(algo, { by: value }), errorArchive: errorMessage })),
432
438
  React.createElement(AlgorithmWrapper, { mode: mode },
433
439
  React.createElement("div", null),
434
440
  React.createElement(Space, { direction: "vertical", size: 10 },
435
- React.createElement(Select, { showSearch: true, defaultValue: OPERATOR_OPTIONS.GREATER_THAN.value, style: { width: '100%' }, value: algo.operator, options: Object.values(OPERATOR_OPTIONS), onChange: value => onChangeAlgorithm(algo, {
441
+ React.createElement(Select, { showSearch: true, defaultValue: OPERATOR_OPTIONS.GREATER_THAN.value, style: limitWidthStyle, value: algo.operator, options: Object.values(OPERATOR_OPTIONS), onChange: value => onChangeAlgorithm(algo, {
436
442
  operator: value,
437
443
  rangeType: ['value', 'value'],
438
444
  rangeValue: [0, 0],
439
445
  }) }),
440
446
  isOperatorInRange(algo.operator) ? (React.createElement(React.Fragment, null,
441
447
  React.createElement("div", { style: styleGrid },
442
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.rangeType[0], options: Object.values(COMPARE_TYPE), onChange: value => {
448
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.rangeType[0], options: Object.values(COMPARE_TYPE), onChange: value => {
443
449
  const toType = algo.rangeType[1];
444
450
  const [fromValue, toValue] = algo.rangeValue;
445
451
  onChangeAlgorithm(algo, { rangeType: [value, toType] });
@@ -452,7 +458,7 @@ export const AlgorithmsSetting = (props) => {
452
458
  } }),
453
459
  React.createElement(InputNumber, { width: "100%", min: 0, max: algo.rangeType[0] === COMPARE_TYPE.PERCENTAGE.value ? 100 : Infinity, required: true, defaultValue: 0, value: algo.rangeValue[0], onChange: value => onChangeAlgorithm(algo, { rangeValue: [value, algo.rangeValue[1]] }) })),
454
460
  React.createElement("div", { style: styleGrid },
455
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.rangeType[1], options: Object.values(COMPARE_TYPE), onChange: value => {
461
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.rangeType[1], options: Object.values(COMPARE_TYPE), onChange: value => {
456
462
  const fromType = algo.rangeType[0];
457
463
  const [fromValue, toValue] = algo.rangeValue;
458
464
  onChangeAlgorithm(algo, { rangeType: [fromType, value] });
@@ -464,7 +470,7 @@ export const AlgorithmsSetting = (props) => {
464
470
  }
465
471
  } }),
466
472
  React.createElement(InputNumber, { width: "100%", min: 0, max: algo.rangeType[1] === COMPARE_TYPE.PERCENTAGE.value ? 100 : Infinity, required: true, defaultValue: 0, value: algo.rangeValue[1], onChange: value => onChangeAlgorithm(algo, { rangeValue: [algo.rangeValue[0], value] }) })))) : (React.createElement("div", { style: styleGrid },
467
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.compareType, options: Object.values(COMPARE_TYPE), onChange: value => {
473
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.compareType, options: Object.values(COMPARE_TYPE), onChange: value => {
468
474
  onChangeAlgorithm(algo, { compareType: value });
469
475
  if (algo.compareValue > 100) {
470
476
  onChangeAlgorithm(algo, { compareType: value, compareValue: 100 });
@@ -475,7 +481,7 @@ export const AlgorithmsSetting = (props) => {
475
481
  React.createElement(RequiredLabel, Object.assign({}, labelStyle),
476
482
  t(translations.by.title).toString(),
477
483
  char),
478
- React.createElement(SelectEventAttribute, { isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, eventMetadata: algo.with || {}, onChange: (eventMetaData, ignoreUndoAction) => onChangeAlgorithm(algo, { with: eventMetaData }, ignoreUndoAction) }))));
484
+ React.createElement(SelectEventAttribute, { styleWrapper: { maxWidth: MAX_WIDTH }, isShowErrorAlert: isShowErrorAlert, journeySettings: journeySettings, eventMetadata: algo.with || {}, onChange: (eventMetaData, ignoreUndoAction) => onChangeAlgorithm(algo, { with: eventMetaData }, ignoreUndoAction) }))));
479
485
  break;
480
486
  }
481
487
  case 'notify': {
@@ -542,14 +548,14 @@ export const AlgorithmsSetting = (props) => {
542
548
  algo.by === 'compare_with_before' && (React.createElement(AlgorithmWrapper, { mode: mode },
543
549
  React.createElement("div", null),
544
550
  React.createElement(Space, { direction: "vertical", size: 10 },
545
- React.createElement(Select, { showSearch: true, defaultValue: OPERATOR_OPTIONS.GREATER_THAN.value, style: { width: '100%' }, value: algo.operator, options: Object.values(OPERATOR_OPTIONS), onChange: value => onChangeAlgorithm(algo, {
551
+ React.createElement(Select, { showSearch: true, defaultValue: OPERATOR_OPTIONS.GREATER_THAN.value, style: limitWidthStyle, value: algo.operator, options: Object.values(OPERATOR_OPTIONS), onChange: value => onChangeAlgorithm(algo, {
546
552
  operator: value,
547
553
  rangeType: ['value', 'value'],
548
554
  rangeValue: [0, 0],
549
555
  }) }),
550
556
  isOperatorInRange(algo.operator) ? (React.createElement(React.Fragment, null,
551
557
  React.createElement("div", { style: styleGrid },
552
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.rangeType[0], options: Object.values(COMPARE_TYPE), onChange: value => {
558
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.rangeType[0], options: Object.values(COMPARE_TYPE), onChange: value => {
553
559
  const [fromValue, toValue] = algo.rangeValue;
554
560
  onChangeAlgorithm(algo, {
555
561
  rangeType: [value, value],
@@ -558,7 +564,7 @@ export const AlgorithmsSetting = (props) => {
558
564
  } }),
559
565
  React.createElement(InputNumber, { width: "100%", min: 0, required: true, defaultValue: 0, value: algo.rangeValue[0], onChange: value => onChangeAlgorithm(algo, { rangeValue: [value, algo.rangeValue[1]] }) })),
560
566
  React.createElement("div", { style: styleGrid },
561
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.rangeType[1], options: Object.values(COMPARE_TYPE), onChange: value => {
567
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.rangeType[1], options: Object.values(COMPARE_TYPE), onChange: value => {
562
568
  const [fromValue, toValue] = algo.rangeValue;
563
569
  onChangeAlgorithm(algo, {
564
570
  rangeType: [value, value],
@@ -566,7 +572,7 @@ export const AlgorithmsSetting = (props) => {
566
572
  });
567
573
  } }),
568
574
  React.createElement(InputNumber, { width: "100%", min: 0, required: true, defaultValue: 0, value: algo.rangeValue[1], onChange: value => onChangeAlgorithm(algo, { rangeValue: [algo.rangeValue[0], value] }) })))) : (React.createElement("div", { style: styleGrid },
569
- React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: { width: '100%' }, value: algo.compareType, options: Object.values(COMPARE_TYPE), onChange: value => {
575
+ React.createElement(Select, { defaultValue: COMPARE_TYPE.VALUE.value, style: limitWidthStyle, value: algo.compareType, options: Object.values(COMPARE_TYPE), onChange: value => {
570
576
  onChangeAlgorithm(algo, { compareType: value });
571
577
  } }),
572
578
  React.createElement(InputNumber, { width: "100%", min: 0, required: true, defaultValue: 0, value: algo.compareValue, onChange: value => onChangeAlgorithm(algo, { compareValue: value }) })))))),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@antscorp/antsomi-ui",
3
- "version": "1.3.5-beta.258",
3
+ "version": "1.3.5-beta.259",
4
4
  "description": "An enterprise-class UI design language and React UI library.",
5
5
  "sideEffects": [
6
6
  "dist/*",