@capillarytech/creatives-library 8.0.327 → 8.0.328

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 (45) hide show
  1. package/package.json +1 -1
  2. package/utils/tests/tagValidations.test.js +0 -34
  3. package/v2Components/CapTagList/index.js +22 -14
  4. package/v2Components/CapTagList/style.scss +0 -48
  5. package/v2Components/CapTagListWithInput/index.js +0 -4
  6. package/v2Components/CapWhatsappCTA/index.js +0 -2
  7. package/v2Components/FormBuilder/index.js +0 -7
  8. package/v2Components/HtmlEditor/HTMLEditor.js +1 -6
  9. package/v2Components/HtmlEditor/__tests__/HTMLEditor.apiErrors.test.js +0 -1
  10. package/v2Components/HtmlEditor/__tests__/HTMLEditor.test.js +2 -927
  11. package/v2Components/HtmlEditor/components/CodeEditorPane/index.js +0 -3
  12. package/v2Containers/BeeEditor/index.js +0 -3
  13. package/v2Containers/CreativesContainer/SlideBoxContent.js +1 -28
  14. package/v2Containers/CreativesContainer/index.js +7 -9
  15. package/v2Containers/Email/index.js +0 -1
  16. package/v2Containers/EmailWrapper/components/EmailHTMLEditor.js +1 -7
  17. package/v2Containers/EmailWrapper/components/EmailWrapperView.js +0 -3
  18. package/v2Containers/EmailWrapper/components/__tests__/EmailHTMLEditor.test.js +2 -20
  19. package/v2Containers/EmailWrapper/components/__tests__/EmailWrapperView.test.js +1 -16
  20. package/v2Containers/EmailWrapper/hooks/useEmailWrapper.js +0 -3
  21. package/v2Containers/EmailWrapper/index.js +0 -4
  22. package/v2Containers/EmailWrapper/tests/useEmailWrapper.edgeCases.test.js +0 -1
  23. package/v2Containers/EmailWrapper/tests/useEmailWrapper.test.js +0 -9
  24. package/v2Containers/InAppWrapper/hooks/__tests__/useInAppWrapper.test.js +0 -19
  25. package/v2Containers/InAppWrapper/hooks/useInAppWrapper.js +0 -3
  26. package/v2Containers/InAppWrapper/index.js +0 -3
  27. package/v2Containers/MobilePush/Create/index.js +0 -2
  28. package/v2Containers/MobilePush/Edit/index.js +0 -2
  29. package/v2Containers/MobilepushWrapper/index.js +1 -3
  30. package/v2Containers/Rcs/index.js +8 -2
  31. package/v2Containers/Sms/Create/index.js +0 -2
  32. package/v2Containers/Sms/Edit/index.js +0 -2
  33. package/v2Containers/SmsTrai/Edit/index.js +0 -2
  34. package/v2Containers/SmsWrapper/index.js +0 -2
  35. package/v2Containers/TagList/index.js +2 -41
  36. package/v2Containers/TagList/messages.js +0 -4
  37. package/v2Containers/TagList/tests/TagList.test.js +20 -122
  38. package/v2Containers/TagList/tests/mockdata.js +0 -17
  39. package/v2Containers/Viber/index.js +0 -5
  40. package/v2Containers/WebPush/Create/hooks/useTagManagement.js +2 -0
  41. package/v2Containers/WebPush/Create/index.js +1 -9
  42. package/v2Containers/Whatsapp/index.js +0 -5
  43. package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap +0 -20
  44. package/v2Containers/Zalo/index.js +0 -2
  45. package/v2Components/CapTagListWithInput/__tests__/CapTagListWithInput.test.js +0 -63
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capillarytech/creatives-library",
3
3
  "author": "meharaj",
4
- "version": "8.0.327",
4
+ "version": "8.0.328",
5
5
  "description": "Capillary creatives ui",
6
6
  "main": "./index.js",
7
7
  "module": "./index.es.js",
@@ -242,7 +242,6 @@ describe("validateTags", () => {
242
242
  tagsParam,
243
243
  location,
244
244
  tagModule,
245
- waitEventContextTags: {},
246
245
  });
247
246
 
248
247
  expect(result.valid).toEqual(true);
@@ -274,7 +273,6 @@ describe("validateTags", () => {
274
273
  tagsParam: tagsParamLocal,
275
274
  location,
276
275
  tagModule,
277
- waitEventContextTags: {},
278
276
  });
279
277
 
280
278
  expect(result.valid).toEqual(true);
@@ -312,7 +310,6 @@ describe("validateTags", () => {
312
310
  tagsParam: tagsParamLocal,
313
311
  location,
314
312
  tagModule,
315
- waitEventContextTags: {},
316
313
  });
317
314
 
318
315
  expect(result.valid).toEqual(false);
@@ -338,7 +335,6 @@ describe("validateTags", () => {
338
335
  tagsParam: tagsParamUnsubscribe,
339
336
  location,
340
337
  tagModule,
341
- waitEventContextTags: {},
342
338
  });
343
339
  expect(resultMissing.missingTags).toContain("unsubscribe");
344
340
  expect(resultMissing.valid).toBe(false);
@@ -349,7 +345,6 @@ describe("validateTags", () => {
349
345
  tagsParam: tagsParamUnsubscribe,
350
346
  location,
351
347
  tagModule,
352
- waitEventContextTags: {},
353
348
  });
354
349
  expect(resultSkipped.missingTags).not.toContain("unsubscribe");
355
350
  expect(resultSkipped.valid).toBe(true);
@@ -365,35 +360,6 @@ describe("validateTags", () => {
365
360
  expect(resultWhitespace.valid).toBe(true);
366
361
  expect(resultWhitespace.unsupportedTags ?? []).toEqual([]);
367
362
  });
368
-
369
- it('should treat tags from waitEventContextTags as supported', () => {
370
- const content = 'Hello {{waitEvent.orderId}}';
371
- const tagsParam = [];
372
- const injectedTagsParams = [];
373
- const location = { query: { module: 'DEFAULT' } };
374
- const tagModule = null;
375
- const waitEventContextTags = {
376
- block1: {
377
- eventName: 'Order Placed',
378
- blockName: 'Wait Block',
379
- tags: [{ tagName: 'waitEvent.orderId', label: 'Order ID' }],
380
- },
381
- };
382
-
383
- const result = validateTags({
384
- content,
385
- tagsParam,
386
- injectedTagsParams,
387
- location,
388
- tagModule,
389
- eventContextTags: [],
390
- waitEventContextTags,
391
- });
392
-
393
- expect(result.valid).toEqual(true);
394
- expect(result.missingTags).toEqual([]);
395
- expect(result.isBraceError).toEqual(false);
396
- });
397
363
  });
398
364
 
399
365
  describe('validateTags wrapper (v2 consumers)', () => {
@@ -207,7 +207,6 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
207
207
  } else {
208
208
  this.props.onSelect(selectedKeys, info);
209
209
  this.setState({visible: false});
210
- this.setState({expandedKeys: []})
211
210
  }
212
211
  } else if (info && info.selectedNodes && info.selectedNodes.length > 0 && !info.selectedNodes[0].props.isLeaf) {
213
212
  this.handleOnExpand(selectedKeys[0]);
@@ -234,13 +233,6 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
234
233
  }
235
234
  };
236
235
 
237
- /** Single-line ellipsis within popover width; full label on hover via CapTooltip. */
238
- wrapTreeTitle = (displayNode, text) => (
239
- <CapTooltip title={displayNode}>
240
- {text || displayNode}
241
- </CapTooltip>
242
- );
243
-
244
236
  renderDynamicTagFlow = () => {
245
237
  this.setState({showModal: true, visible: false});
246
238
  };
@@ -288,7 +280,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
288
280
  if (temp?.length) {
289
281
  const tagValue = (
290
282
  <CapTreeNode
291
- title={disabled ? this.wrapTreeTitle(loyaltyAttrDisableText, val?.name) : this.wrapTreeTitle(val?.name)}
283
+ title={disabled ? <CapTooltip title={loyaltyAttrDisableText}>{val?.name}</CapTooltip> : val?.name}
292
284
  tag={val}
293
285
  key={val?.incentiveSeriesId ? `${key}(${val?.incentiveSeriesId})` : `${key}`}
294
286
  disabled={disabled}
@@ -311,9 +303,17 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
311
303
  <CapTreeNode
312
304
  title={
313
305
  childDisabled ? (
314
- this.wrapTreeTitle(key === CUSTOMER_BARCODE_TAG ? customerBarcodeDisableText : loyaltyAttrDisableText, val?.desc || val?.name)
306
+ <CapTooltip
307
+ title={
308
+ key === CUSTOMER_BARCODE_TAG
309
+ ? customerBarcodeDisableText
310
+ : loyaltyAttrDisableText
311
+ }
312
+ >
313
+ {val?.desc || val?.name}
314
+ </CapTooltip>
315
315
  ) : (
316
- this.wrapTreeTitle(val?.desc || val?.name)
316
+ val?.desc || val?.name
317
317
  )
318
318
  }
319
319
  tag={val}
@@ -339,9 +339,17 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
339
339
  <CapTreeNode
340
340
  title={
341
341
  childDisabled ? (
342
- this.wrapTreeTitle(key === CUSTOMER_BARCODE_TAG ? customerBarcodeDisableText : loyaltyAttrDisableText, val?.desc || val?.name)
342
+ <CapTooltip
343
+ title={
344
+ key === CUSTOMER_BARCODE_TAG
345
+ ? customerBarcodeDisableText
346
+ : loyaltyAttrDisableText
347
+ }
348
+ >
349
+ {val?.desc || val?.name}
350
+ </CapTooltip>
343
351
  ) : (
344
- this.wrapTreeTitle(val?.desc || val?.name)
352
+ val?.desc || val?.name
345
353
  )
346
354
  }
347
355
  tag={val}
@@ -399,7 +407,7 @@ class CapTagList extends React.Component { // eslint-disable-line react/prefer-s
399
407
  },
400
408
  ];
401
409
  const contentSection = (
402
- <CapRow className="cap-tag-list-popover-inner">
410
+ <CapRow>
403
411
  <CapSpin tip={formatMessage(messages.gettingTags)} spinning={shouldShowLoading}>
404
412
  <Search
405
413
  style={{ marginBottom: 8, width: '250px'}}
@@ -1,53 +1,5 @@
1
1
  @import "~@capillarytech/cap-ui-library/styles/_variables";
2
2
 
3
- // Tag list popover: keep overlay width aligned with search (250px); tree rows ellipsis + tooltip for full text
4
- .cap-tag-list-popover-overlay.ant-popover {
5
- .ant-popover-inner-content {
6
- max-width: 20rem;
7
- box-sizing: border-box;
8
- overflow: hidden;
9
- }
10
- }
11
-
12
- .cap-tag-list-popover-inner {
13
- max-width: 20rem;
14
- min-width: 0;
15
- box-sizing: border-box;
16
-
17
- .ant-tree.cap-tree-v2.ant-tree-icon-hide {
18
- width: 100%;
19
- max-width: 100%;
20
-
21
- ul {
22
- max-width: 100%;
23
- }
24
-
25
- li {
26
- overflow: hidden;
27
- max-width: 100%;
28
- }
29
-
30
- li .ant-tree-node-content-wrapper {
31
- width: calc(100% - 3.5rem); // leave room for switcher (~24px)
32
- max-width: calc(100% - 3.5rem);
33
- overflow: hidden;
34
- vertical-align: top;
35
- box-sizing: border-box;
36
- }
37
-
38
- .cap-tag-list-tree-title-wrap {
39
- display: inline-block;
40
- width: 100%;
41
- overflow: hidden;
42
- text-overflow: ellipsis;
43
- white-space: nowrap;
44
- max-width: 100%;
45
- vertical-align: top;
46
- margin-top: 0.5rem;
47
- }
48
- }
49
- }
50
-
51
3
  @media (max-height: 25rem) {
52
4
  .ant-tree.cap-tree-v2.ant-tree-icon-hide {
53
5
  height: 8.5714rem;
@@ -27,7 +27,6 @@ export const CapTagListWithInput = (props) => {
27
27
  userLocale = 'en',
28
28
  eventContextTags = [],
29
29
  restrictPersonalization = false,
30
- waitEventContextTags = {},
31
30
  // CapInput props
32
31
  inputId,
33
32
  inputValue = '',
@@ -78,7 +77,6 @@ export const CapTagListWithInput = (props) => {
78
77
  userLocale={userLocale}
79
78
  selectedOfferDetails={selectedOfferDetails}
80
79
  eventContextTags={eventContextTags}
81
- waitEventContextTags={waitEventContextTags}
82
80
  style={tagListStyle}
83
81
  popoverPlacement={popoverPlacement}
84
82
  restrictPersonalization={restrictPersonalization}
@@ -118,7 +116,6 @@ CapTagListWithInput.propTypes = {
118
116
  userLocale: PropTypes.string,
119
117
  eventContextTags: PropTypes.array,
120
118
  restrictPersonalization: PropTypes.bool,
121
- waitEventContextTags: PropTypes.object,
122
119
 
123
120
  // CapInput props
124
121
  inputId: PropTypes.string.isRequired,
@@ -157,7 +154,6 @@ CapTagListWithInput.defaultProps = {
157
154
  userLocale: 'en',
158
155
  eventContextTags: [],
159
156
  restrictPersonalization: false,
160
- waitEventContextTags: {},
161
157
  inputValue: '',
162
158
  inputSize: 'default',
163
159
  inputRequired: false,
@@ -52,7 +52,6 @@ export const CapWhatsappCTA = (props) => {
52
52
  injectedTags = {},
53
53
  selectedOfferDetails = [],
54
54
  eventContextTags = [],
55
- waitEventContextTags = {},
56
55
  } = props;
57
56
  const { formatMessage } = intl;
58
57
  const invalidVarRegex = /{{(.*?)}}/g;
@@ -284,7 +283,6 @@ export const CapWhatsappCTA = (props) => {
284
283
  injectedTags={injectedTags}
285
284
  selectedOfferDetails={selectedOfferDetails}
286
285
  eventContextTags={eventContextTags}
287
- waitEventContextTags={waitEventContextTags}
288
286
  />
289
287
  </CapColumn>
290
288
  )}
@@ -2990,7 +2990,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
2990
2990
  selectedOfferDetails={this.props.selectedOfferDetails}
2991
2991
  eventContextTags={this.props?.eventContextTags}
2992
2992
  restrictPersonalization={this.props.restrictPersonalization}
2993
- waitEventContextTags={this.props?.waitEventContextTags}
2994
2993
  />
2995
2994
  </CapColumn>
2996
2995
  );
@@ -3020,7 +3019,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
3020
3019
  userLocale={this.props.userLocale}
3021
3020
  selectedOfferDetails={this.props.selectedOfferDetails}
3022
3021
  eventContextTags={this.props?.eventContextTags}
3023
- waitEventContextTags={this.props?.waitEventContextTags}
3024
3022
  moduleFilterEnabled={this.props.location && this.props.location.query && this.props.location.query.type !== 'embedded'}
3025
3023
  containerStyle={val.style || {}}
3026
3024
  inputProps={val.inputProps || {}}
@@ -3660,7 +3658,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
3660
3658
  channel={channel}
3661
3659
  eventContextTags={this.props?.eventContextTags}
3662
3660
  restrictPersonalization={this.props.restrictPersonalization}
3663
- waitEventContextTags={this.props?.waitEventContextTags}
3664
3661
  getPopupContainer={this.props.tagListGetPopupContainer}
3665
3662
  popoverOverlayStyle={this.props.tagListPopoverOverlayStyle}
3666
3663
  popoverOverlayClassName={this.props.tagListPopoverOverlayClassName}
@@ -3710,7 +3707,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
3710
3707
  userLocale={this.state.translationLang}
3711
3708
  selectedOfferDetails={this.props.selectedOfferDetails}
3712
3709
  eventContextTags={this.props?.eventContextTags}
3713
- waitEventContextTags={this.props?.waitEventContextTags}
3714
3710
  moduleFilterEnabled={moduleFilterEnabledForCapTagList}
3715
3711
  containerStyle={val.style || {}}
3716
3712
  inputProps={val.inputProps || {}}
@@ -4005,7 +4001,6 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
4005
4001
  onContextChange={this.props.onContextChange}
4006
4002
  moduleFilterEnabled={isModuleFilterEnabled}
4007
4003
  eventContextTags={this.props?.eventContextTags}
4008
- waitEventContextTags={this.props?.waitEventContextTags}
4009
4004
  />
4010
4005
  </CapColumn>
4011
4006
  );
@@ -4308,7 +4303,6 @@ FormBuilder.defaultProps = {
4308
4303
  userLocale: localStorage.getItem('jlocale') || 'en',
4309
4304
  showLiquidErrorInFooter: () => {},
4310
4305
  metaDataStatus: "",
4311
- waitEventContextTags: {},
4312
4306
  isTestAndPreviewMode: false, // Default to false to maintain existing behavior
4313
4307
  };
4314
4308
 
@@ -4359,7 +4353,6 @@ FormBuilder.propTypes = {
4359
4353
  moduleType: PropTypes.string.isRequired,
4360
4354
  showLiquidErrorInFooter: PropTypes.func.isRequired,
4361
4355
  eventContextTags: PropTypes.array.isRequired,
4362
- waitEventContextTags: PropTypes.object,
4363
4356
  forwardedTags: PropTypes.object.isRequired,
4364
4357
  isLoyaltyModule: PropTypes.bool.isRequired,
4365
4358
  isTestAndPreviewMode: PropTypes.bool, // Add new prop type
@@ -94,7 +94,6 @@ const HTMLEditor = forwardRef(({
94
94
  injectedTags = {},
95
95
  location,
96
96
  eventContextTags = [],
97
- waitEventContextTags,
98
97
  selectedOfferDetails = [],
99
98
  channel,
100
99
  userLocale = 'en',
@@ -362,7 +361,7 @@ const HTMLEditor = forwardRef(({
362
361
  const issueCounts = calculateIssueCounts();
363
362
  const isContentEmpty = !currentContent || currentContent.trim() === '';
364
363
 
365
- // hasErrors = only Rule Group #1 (Input & Sanitization) - gates Done/Update/Preview/Test
364
+ // hasErrors = only Rule Group #1 (Input & Sanitization) gates Done/Update/Preview/Test
366
365
  const newState = {
367
366
  isContentEmpty,
368
367
  issueCounts,
@@ -664,7 +663,6 @@ const HTMLEditor = forwardRef(({
664
663
  injectedTags={injectedTags}
665
664
  location={location}
666
665
  eventContextTags={eventContextTags}
667
- waitEventContextTags={waitEventContextTags}
668
666
  selectedOfferDetails={selectedOfferDetails}
669
667
  channel={channel}
670
668
  userLocale={userLocale}
@@ -736,7 +734,6 @@ const HTMLEditor = forwardRef(({
736
734
  injectedTags={injectedTags}
737
735
  location={location}
738
736
  eventContextTags={eventContextTags}
739
- waitEventContextTags={waitEventContextTags}
740
737
  selectedOfferDetails={selectedOfferDetails}
741
738
  channel={channel}
742
739
  userLocale={userLocale}
@@ -775,7 +772,6 @@ HTMLEditor.propTypes = {
775
772
  injectedTags: PropTypes.object,
776
773
  location: PropTypes.object,
777
774
  eventContextTags: PropTypes.array,
778
- waitEventContextTags: PropTypes.object,
779
775
  selectedOfferDetails: PropTypes.array,
780
776
  channel: PropTypes.string,
781
777
  userLocale: PropTypes.string,
@@ -809,7 +805,6 @@ HTMLEditor.defaultProps = {
809
805
  injectedTags: {},
810
806
  location: null,
811
807
  eventContextTags: [],
812
- waitEventContextTags: {},
813
808
  selectedOfferDetails: [],
814
809
  channel: null,
815
810
  userLocale: 'en',
@@ -225,7 +225,6 @@ const defaultProps = {
225
225
  injectedTags: {},
226
226
  location: { query: {} },
227
227
  eventContextTags: [],
228
- waitEventContextTags: {},
229
228
  selectedOfferDetails: [],
230
229
  channel: 'EMAIL',
231
230
  userLocale: 'en',