@capillarytech/creatives-library 7.10.51 → 7.10.53

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 (26) hide show
  1. package/containers/Assets/Gallery/tests/__snapshots__/reducer.test.js.snap +2 -0
  2. package/containers/Email/index.js +3 -2
  3. package/package.json +1 -1
  4. package/v2Components/TemplatePreview/_templatePreview.scss +17 -9
  5. package/v2Components/TemplatePreview/index.js +66 -52
  6. package/v2Components/WhatsappStatusContainer/_whatsappStatusContainer.scss +15 -0
  7. package/v2Components/WhatsappStatusContainer/index.js +58 -0
  8. package/v2Containers/Assets/Gallery/tests/__snapshots__/reducer.test.js.snap +2 -0
  9. package/v2Containers/Cap/messages.js +8 -0
  10. package/v2Containers/CreativesContainer/SlideBoxContent.js +7 -6
  11. package/v2Containers/CreativesContainer/SlideBoxHeader.js +19 -13
  12. package/v2Containers/CreativesContainer/index.js +18 -1
  13. package/v2Containers/CreativesContainer/messages.js +4 -0
  14. package/v2Containers/Email/index.js +3 -1
  15. package/v2Containers/SmsTrai/Create/constants.js +3 -7
  16. package/v2Containers/SmsTrai/Create/index.js +74 -28
  17. package/v2Containers/SmsTrai/Edit/constants.js +0 -1
  18. package/v2Containers/Templates/_templates.scss +19 -31
  19. package/v2Containers/Templates/actions.js +10 -16
  20. package/v2Containers/Templates/index.js +37 -15
  21. package/v2Containers/Whatsapp/index.js +4 -3
  22. package/v2Containers/Whatsapp/index.scss +53 -54
  23. package/v2Containers/Whatsapp/messages.js +0 -8
  24. package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap +1343 -863
  25. package/v2Containers/Whatsapp/tests/index.test.js +2 -4
  26. package/v2Containers/Whatsapp/utils.js +0 -47
package/v2Containers/Whatsapp/tests/__snapshots__/index.test.js.snap CHANGED
@@ -2024,7 +2024,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
2024
2024
  Array [
2025
2025
  Object {
2026
2026
  "defaultMessage": "Template name",
2027
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
2027
+ "id": "creatives.containersV2.templateNameLabel",
2028
2028
  },
2029
2029
  ],
2030
2030
  Array [
@@ -2036,7 +2036,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
2036
2036
  Array [
2037
2037
  Object {
2038
2038
  "defaultMessage": "Enter template name",
2039
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
2039
+ "id": "creatives.containersV2.templateNamePlaceholder",
2040
2040
  },
2041
2041
  ],
2042
2042
  Array [
@@ -2179,7 +2179,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
2179
2179
  Array [
2180
2180
  Object {
2181
2181
  "defaultMessage": "Template name",
2182
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
2182
+ "id": "creatives.containersV2.templateNameLabel",
2183
2183
  },
2184
2184
  ],
2185
2185
  Array [
@@ -2191,7 +2191,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
2191
2191
  Array [
2192
2192
  Object {
2193
2193
  "defaultMessage": "Enter template name",
2194
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
2194
+ "id": "creatives.containersV2.templateNamePlaceholder",
2195
2195
  },
2196
2196
  ],
2197
2197
  Array [
@@ -2523,13 +2523,15 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
2523
2523
  className="ant-spin-container"
2524
2524
  key="container"
2525
2525
  >
2526
- <CapRow>
2526
+ <CapRow
2527
+ className="cap-whatsapp-creatives"
2528
+ >
2527
2529
  <Row
2528
- className="cap-row-v2"
2530
+ className="cap-row-v2 cap-whatsapp-creatives"
2529
2531
  gutter={0}
2530
2532
  >
2531
2533
  <div
2532
- className="ant-row cap-row-v2"
2534
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
2533
2535
  >
2534
2536
  <CapColumn
2535
2537
  key=".0"
@@ -6973,6 +6975,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
6973
6975
  }
6974
6976
  key=".0"
6975
6977
  whatsappAccountName="WhatsppTest"
6978
+ whatsappContentLen={0}
6976
6979
  >
6977
6980
  <TemplatePreview
6978
6981
  channel="WHATSAPP"
@@ -8919,6 +8922,7 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
8919
8922
  }
8920
8923
  }
8921
8924
  whatsappAccountName="WhatsppTest"
8925
+ whatsappContentLen={0}
8922
8926
  >
8923
8927
  <CapRow>
8924
8928
  <Row
@@ -8945,7 +8949,6 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
8945
8949
  >
8946
8950
  <div
8947
8951
  className="shell-v2 align-center"
8948
- id="sms-preview"
8949
8952
  >
8950
8953
  <CapImage
8951
8954
  alt="Preview is being generated"
@@ -8958,19 +8961,19 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
8958
8961
  src="test-file-stub"
8959
8962
  />
8960
8963
  </CapImage>
8961
- <div
8964
+ <CapLabel
8962
8965
  className="whatsapp-brand-name"
8966
+ type="label1"
8963
8967
  >
8964
- WhatsppTest
8965
- </div>
8968
+ <div
8969
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
8970
+ type="label1"
8971
+ >
8972
+ WhatsppTest
8973
+ </div>
8974
+ </CapLabel>
8966
8975
  <div
8967
- className="msgContainer"
8968
- style={
8969
- Object {
8970
- "marginLeft": 28,
8971
- "maxHeight": 292,
8972
- }
8973
- }
8976
+ className="msg-container whatsapp-message-container"
8974
8977
  >
8975
8978
  <div
8976
8979
  className="message-pop align-left"
@@ -8979,46 +8982,73 @@ exports[`Creatives Whatsapp test/> Cancel Btn 1`] = `
8979
8982
  "background-color": "#efefef",
8980
8983
  "border-radius": "6px",
8981
8984
  "left": "10%",
8982
- "padding": "3.5px 0 0",
8985
+ "padding": "4px 0 0.571rem",
8983
8986
  "width": "88%",
8984
8987
  }
8985
8988
  }
8986
8989
  >
8987
- <p
8988
- style={
8989
- Object {
8990
- "color": "#2a2a2a",
8991
- "margin": "1.5px 6px 1px 7px",
8992
- }
8993
- }
8990
+ <CapLabel
8991
+ className="whatsapp-content"
8992
+ type="label1"
8994
8993
  >
8995
- <CapLabel
8996
- type="label5"
8994
+ <div
8995
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
8996
+ type="label1"
8997
8997
  >
8998
- <div
8999
- className="CapLabel-n7zsf5-0 gHdlVo"
8998
+ <CapLabel
9000
8999
  type="label5"
9001
- />
9002
- </CapLabel>
9003
- <CapLabel
9004
- type="label11"
9005
- >
9006
- <div
9007
- className="CapLabel-n7zsf5-0 jpRuDd"
9000
+ >
9001
+ <div
9002
+ className="CapLabel-n7zsf5-0 gHdlVo"
9003
+ type="label5"
9004
+ />
9005
+ </CapLabel>
9006
+ <CapLabel
9008
9007
  type="label11"
9009
- />
9010
- </CapLabel>
9011
- </p>
9012
- <div
9013
- style={
9014
- Object {
9015
- "paddingBottom": "0.571rem",
9016
- }
9017
- }
9018
- />
9008
+ >
9009
+ <div
9010
+ className="CapLabel-n7zsf5-0 jpRuDd"
9011
+ type="label11"
9012
+ />
9013
+ </CapLabel>
9014
+ </div>
9015
+ </CapLabel>
9019
9016
  </div>
9020
9017
  </div>
9021
9018
  </div>
9019
+ <CapHeading
9020
+ className="margin-t-16"
9021
+ style={
9022
+ Object {
9023
+ "textAlign": "center",
9024
+ }
9025
+ }
9026
+ type="h3"
9027
+ >
9028
+ <div
9029
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
9030
+ style={
9031
+ Object {
9032
+ "textAlign": "center",
9033
+ }
9034
+ }
9035
+ type="h3"
9036
+ >
9037
+ <FormattedMessage
9038
+ defaultMessage="1 Message ({length} characters)"
9039
+ id="app.components.TemplatePreview.whatsappMessageLength"
9040
+ values={
9041
+ Object {
9042
+ "length": 36,
9043
+ }
9044
+ }
9045
+ >
9046
+ <span>
9047
+ 1 Message (36 characters)
9048
+ </span>
9049
+ </FormattedMessage>
9050
+ </div>
9051
+ </CapHeading>
9022
9052
  </div>
9023
9053
  </div>
9024
9054
  </Col>
@@ -11163,7 +11193,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
11163
11193
  Array [
11164
11194
  Object {
11165
11195
  "defaultMessage": "Template name",
11166
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
11196
+ "id": "creatives.containersV2.templateNameLabel",
11167
11197
  },
11168
11198
  ],
11169
11199
  Array [
@@ -11175,7 +11205,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
11175
11205
  Array [
11176
11206
  Object {
11177
11207
  "defaultMessage": "Enter template name",
11178
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
11208
+ "id": "creatives.containersV2.templateNamePlaceholder",
11179
11209
  },
11180
11210
  ],
11181
11211
  Array [
@@ -11318,7 +11348,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
11318
11348
  Array [
11319
11349
  Object {
11320
11350
  "defaultMessage": "Template name",
11321
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
11351
+ "id": "creatives.containersV2.templateNameLabel",
11322
11352
  },
11323
11353
  ],
11324
11354
  Array [
@@ -11330,7 +11360,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
11330
11360
  Array [
11331
11361
  Object {
11332
11362
  "defaultMessage": "Enter template name",
11333
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
11363
+ "id": "creatives.containersV2.templateNamePlaceholder",
11334
11364
  },
11335
11365
  ],
11336
11366
  Array [
@@ -11662,13 +11692,15 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
11662
11692
  className="ant-spin-container"
11663
11693
  key="container"
11664
11694
  >
11665
- <CapRow>
11695
+ <CapRow
11696
+ className="cap-whatsapp-creatives"
11697
+ >
11666
11698
  <Row
11667
- className="cap-row-v2"
11699
+ className="cap-row-v2 cap-whatsapp-creatives"
11668
11700
  gutter={0}
11669
11701
  >
11670
11702
  <div
11671
- className="ant-row cap-row-v2"
11703
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
11672
11704
  >
11673
11705
  <CapColumn
11674
11706
  key=".0"
@@ -16112,6 +16144,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
16112
16144
  }
16113
16145
  key=".0"
16114
16146
  whatsappAccountName="WhatsppTest"
16147
+ whatsappContentLen={0}
16115
16148
  >
16116
16149
  <TemplatePreview
16117
16150
  channel="WHATSAPP"
@@ -18058,6 +18091,7 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
18058
18091
  }
18059
18092
  }
18060
18093
  whatsappAccountName="WhatsppTest"
18094
+ whatsappContentLen={0}
18061
18095
  >
18062
18096
  <CapRow>
18063
18097
  <Row
@@ -18084,7 +18118,6 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
18084
18118
  >
18085
18119
  <div
18086
18120
  className="shell-v2 align-center"
18087
- id="sms-preview"
18088
18121
  >
18089
18122
  <CapImage
18090
18123
  alt="Preview is being generated"
@@ -18097,19 +18130,19 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
18097
18130
  src="test-file-stub"
18098
18131
  />
18099
18132
  </CapImage>
18100
- <div
18133
+ <CapLabel
18101
18134
  className="whatsapp-brand-name"
18135
+ type="label1"
18102
18136
  >
18103
- WhatsppTest
18104
- </div>
18137
+ <div
18138
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
18139
+ type="label1"
18140
+ >
18141
+ WhatsppTest
18142
+ </div>
18143
+ </CapLabel>
18105
18144
  <div
18106
- className="msgContainer"
18107
- style={
18108
- Object {
18109
- "marginLeft": 28,
18110
- "maxHeight": 292,
18111
- }
18112
- }
18145
+ className="msg-container whatsapp-message-container"
18113
18146
  >
18114
18147
  <div
18115
18148
  className="message-pop align-left"
@@ -18118,46 +18151,73 @@ exports[`Creatives Whatsapp test/> should render create mode 1`] = `
18118
18151
  "background-color": "#efefef",
18119
18152
  "border-radius": "6px",
18120
18153
  "left": "10%",
18121
- "padding": "3.5px 0 0",
18154
+ "padding": "4px 0 0.571rem",
18122
18155
  "width": "88%",
18123
18156
  }
18124
18157
  }
18125
18158
  >
18126
- <p
18127
- style={
18128
- Object {
18129
- "color": "#2a2a2a",
18130
- "margin": "1.5px 6px 1px 7px",
18131
- }
18132
- }
18159
+ <CapLabel
18160
+ className="whatsapp-content"
18161
+ type="label1"
18133
18162
  >
18134
- <CapLabel
18135
- type="label5"
18163
+ <div
18164
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
18165
+ type="label1"
18136
18166
  >
18137
- <div
18138
- className="CapLabel-n7zsf5-0 gHdlVo"
18167
+ <CapLabel
18139
18168
  type="label5"
18140
- />
18141
- </CapLabel>
18142
- <CapLabel
18143
- type="label11"
18144
- >
18145
- <div
18146
- className="CapLabel-n7zsf5-0 jpRuDd"
18169
+ >
18170
+ <div
18171
+ className="CapLabel-n7zsf5-0 gHdlVo"
18172
+ type="label5"
18173
+ />
18174
+ </CapLabel>
18175
+ <CapLabel
18147
18176
  type="label11"
18148
- />
18149
- </CapLabel>
18150
- </p>
18151
- <div
18152
- style={
18153
- Object {
18154
- "paddingBottom": "0.571rem",
18155
- }
18156
- }
18157
- />
18177
+ >
18178
+ <div
18179
+ className="CapLabel-n7zsf5-0 jpRuDd"
18180
+ type="label11"
18181
+ />
18182
+ </CapLabel>
18183
+ </div>
18184
+ </CapLabel>
18158
18185
  </div>
18159
18186
  </div>
18160
18187
  </div>
18188
+ <CapHeading
18189
+ className="margin-t-16"
18190
+ style={
18191
+ Object {
18192
+ "textAlign": "center",
18193
+ }
18194
+ }
18195
+ type="h3"
18196
+ >
18197
+ <div
18198
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
18199
+ style={
18200
+ Object {
18201
+ "textAlign": "center",
18202
+ }
18203
+ }
18204
+ type="h3"
18205
+ >
18206
+ <FormattedMessage
18207
+ defaultMessage="1 Message ({length} characters)"
18208
+ id="app.components.TemplatePreview.whatsappMessageLength"
18209
+ values={
18210
+ Object {
18211
+ "length": 36,
18212
+ }
18213
+ }
18214
+ >
18215
+ <span>
18216
+ 1 Message (36 characters)
18217
+ </span>
18218
+ </FormattedMessage>
18219
+ </div>
18220
+ </CapHeading>
18161
18221
  </div>
18162
18222
  </div>
18163
18223
  </Col>
@@ -20351,7 +20411,7 @@ Click {{3}} to unsubscribe'",
20351
20411
  Array [
20352
20412
  Object {
20353
20413
  "defaultMessage": "Template name",
20354
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
20414
+ "id": "creatives.containersV2.templateNameLabel",
20355
20415
  },
20356
20416
  ],
20357
20417
  Array [
@@ -20363,7 +20423,7 @@ Click {{3}} to unsubscribe'",
20363
20423
  Array [
20364
20424
  Object {
20365
20425
  "defaultMessage": "Enter template name",
20366
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
20426
+ "id": "creatives.containersV2.templateNamePlaceholder",
20367
20427
  },
20368
20428
  ],
20369
20429
  Array [
@@ -20506,7 +20566,7 @@ Click {{3}} to unsubscribe'",
20506
20566
  Array [
20507
20567
  Object {
20508
20568
  "defaultMessage": "Template name",
20509
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
20569
+ "id": "creatives.containersV2.templateNameLabel",
20510
20570
  },
20511
20571
  ],
20512
20572
  Array [
@@ -20518,7 +20578,7 @@ Click {{3}} to unsubscribe'",
20518
20578
  Array [
20519
20579
  Object {
20520
20580
  "defaultMessage": "Enter template name",
20521
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
20581
+ "id": "creatives.containersV2.templateNamePlaceholder",
20522
20582
  },
20523
20583
  ],
20524
20584
  Array [
@@ -20664,7 +20724,7 @@ Click {{3}} to unsubscribe'",
20664
20724
  Array [
20665
20725
  Object {
20666
20726
  "defaultMessage": "Template name",
20667
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
20727
+ "id": "creatives.containersV2.templateNameLabel",
20668
20728
  },
20669
20729
  ],
20670
20730
  Array [
@@ -20676,7 +20736,7 @@ Click {{3}} to unsubscribe'",
20676
20736
  Array [
20677
20737
  Object {
20678
20738
  "defaultMessage": "Enter template name",
20679
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
20739
+ "id": "creatives.containersV2.templateNamePlaceholder",
20680
20740
  },
20681
20741
  ],
20682
20742
  Array [
@@ -21113,13 +21173,15 @@ Click {{3}} to unsubscribe'",
21113
21173
  className="ant-spin-container"
21114
21174
  key="container"
21115
21175
  >
21116
- <CapRow>
21176
+ <CapRow
21177
+ className="cap-whatsapp-creatives"
21178
+ >
21117
21179
  <Row
21118
- className="cap-row-v2"
21180
+ className="cap-row-v2 cap-whatsapp-creatives"
21119
21181
  gutter={0}
21120
21182
  >
21121
21183
  <div
21122
- className="ant-row cap-row-v2"
21184
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
21123
21185
  >
21124
21186
  <CapColumn
21125
21187
  key=".0"
@@ -22824,6 +22886,7 @@ T&C
22824
22886
  }
22825
22887
  key=".0"
22826
22888
  whatsappAccountName="WhatsppTest"
22889
+ whatsappContentLen={125}
22827
22890
  >
22828
22891
  <TemplatePreview
22829
22892
  channel="WHATSAPP"
@@ -24772,6 +24835,7 @@ T&C
24772
24835
  }
24773
24836
  }
24774
24837
  whatsappAccountName="WhatsppTest"
24838
+ whatsappContentLen={125}
24775
24839
  >
24776
24840
  <CapRow>
24777
24841
  <Row
@@ -24798,7 +24862,6 @@ T&C
24798
24862
  >
24799
24863
  <div
24800
24864
  className="shell-v2 align-center"
24801
- id="sms-preview"
24802
24865
  >
24803
24866
  <CapImage
24804
24867
  alt="Preview is being generated"
@@ -24811,19 +24874,19 @@ T&C
24811
24874
  src="test-file-stub"
24812
24875
  />
24813
24876
  </CapImage>
24814
- <div
24877
+ <CapLabel
24815
24878
  className="whatsapp-brand-name"
24879
+ type="label1"
24816
24880
  >
24817
- WhatsppTest
24818
- </div>
24881
+ <div
24882
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
24883
+ type="label1"
24884
+ >
24885
+ WhatsppTest
24886
+ </div>
24887
+ </CapLabel>
24819
24888
  <div
24820
- className="msgContainer"
24821
- style={
24822
- Object {
24823
- "marginLeft": 28,
24824
- "maxHeight": 292,
24825
- }
24826
- }
24889
+ className="msg-container whatsapp-message-container"
24827
24890
  >
24828
24891
  <div
24829
24892
  className="message-pop align-left"
@@ -24832,50 +24895,77 @@ T&C
24832
24895
  "background-color": "#efefef",
24833
24896
  "border-radius": "6px",
24834
24897
  "left": "10%",
24835
- "padding": "3.5px 0 0",
24898
+ "padding": "4px 0 0.571rem",
24836
24899
  "width": "88%",
24837
24900
  }
24838
24901
  }
24839
24902
  >
24840
- <p
24841
- style={
24842
- Object {
24843
- "color": "#2a2a2a",
24844
- "margin": "1.5px 6px 1px 7px",
24845
- }
24846
- }
24903
+ <CapLabel
24904
+ className="whatsapp-content"
24905
+ type="label1"
24847
24906
  >
24848
- <CapLabel
24849
- type="label5"
24907
+ <div
24908
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
24909
+ type="label1"
24850
24910
  >
24851
- <div
24852
- className="CapLabel-n7zsf5-0 gHdlVo"
24911
+ <CapLabel
24853
24912
  type="label5"
24854
24913
  >
24855
- Dear Customer, your500 points are about to expire. Redeem before tomorrow at nearest Vishal Mega Mart and SHOP FOR FREE!
24914
+ <div
24915
+ className="CapLabel-n7zsf5-0 gHdlVo"
24916
+ type="label5"
24917
+ >
24918
+ Dear Customer, your500 points are about to expire. Redeem before tomorrow at nearest Vishal Mega Mart and SHOP FOR FREE!
24856
24919
  T&C
24857
24920
 
24858
- </div>
24859
- </CapLabel>
24860
- <CapLabel
24861
- type="label11"
24862
- >
24863
- <div
24864
- className="CapLabel-n7zsf5-0 jpRuDd"
24921
+ </div>
24922
+ </CapLabel>
24923
+ <CapLabel
24865
24924
  type="label11"
24866
- />
24867
- </CapLabel>
24868
- </p>
24869
- <div
24870
- style={
24871
- Object {
24872
- "paddingBottom": "0.571rem",
24873
- }
24874
- }
24875
- />
24925
+ >
24926
+ <div
24927
+ className="CapLabel-n7zsf5-0 jpRuDd"
24928
+ type="label11"
24929
+ />
24930
+ </CapLabel>
24931
+ </div>
24932
+ </CapLabel>
24876
24933
  </div>
24877
24934
  </div>
24878
24935
  </div>
24936
+ <CapHeading
24937
+ className="margin-t-16"
24938
+ style={
24939
+ Object {
24940
+ "textAlign": "center",
24941
+ }
24942
+ }
24943
+ type="h3"
24944
+ >
24945
+ <div
24946
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
24947
+ style={
24948
+ Object {
24949
+ "textAlign": "center",
24950
+ }
24951
+ }
24952
+ type="h3"
24953
+ >
24954
+ <FormattedMessage
24955
+ defaultMessage="1 Message ({length} characters)"
24956
+ id="app.components.TemplatePreview.whatsappMessageLength"
24957
+ values={
24958
+ Object {
24959
+ "length": 161,
24960
+ }
24961
+ }
24962
+ >
24963
+ <span>
24964
+ 1 Message (161 characters)
24965
+ </span>
24966
+ </FormattedMessage>
24967
+ </div>
24968
+ </CapHeading>
24879
24969
  </div>
24880
24970
  </div>
24881
24971
  </Col>
@@ -27010,7 +27100,7 @@ Click {{3}} to unsubscribe'",
27010
27100
  Array [
27011
27101
  Object {
27012
27102
  "defaultMessage": "Template name",
27013
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27103
+ "id": "creatives.containersV2.templateNameLabel",
27014
27104
  },
27015
27105
  ],
27016
27106
  Array [
@@ -27022,7 +27112,7 @@ Click {{3}} to unsubscribe'",
27022
27112
  Array [
27023
27113
  Object {
27024
27114
  "defaultMessage": "Enter template name",
27025
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27115
+ "id": "creatives.containersV2.templateNamePlaceholder",
27026
27116
  },
27027
27117
  ],
27028
27118
  Array [
@@ -27165,7 +27255,7 @@ Click {{3}} to unsubscribe'",
27165
27255
  Array [
27166
27256
  Object {
27167
27257
  "defaultMessage": "Template name",
27168
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27258
+ "id": "creatives.containersV2.templateNameLabel",
27169
27259
  },
27170
27260
  ],
27171
27261
  Array [
@@ -27177,7 +27267,7 @@ Click {{3}} to unsubscribe'",
27177
27267
  Array [
27178
27268
  Object {
27179
27269
  "defaultMessage": "Enter template name",
27180
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27270
+ "id": "creatives.containersV2.templateNamePlaceholder",
27181
27271
  },
27182
27272
  ],
27183
27273
  Array [
@@ -27323,7 +27413,7 @@ Click {{3}} to unsubscribe'",
27323
27413
  Array [
27324
27414
  Object {
27325
27415
  "defaultMessage": "Template name",
27326
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27416
+ "id": "creatives.containersV2.templateNameLabel",
27327
27417
  },
27328
27418
  ],
27329
27419
  Array [
@@ -27335,7 +27425,7 @@ Click {{3}} to unsubscribe'",
27335
27425
  Array [
27336
27426
  Object {
27337
27427
  "defaultMessage": "Enter template name",
27338
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27428
+ "id": "creatives.containersV2.templateNamePlaceholder",
27339
27429
  },
27340
27430
  ],
27341
27431
  Array [
@@ -27481,7 +27571,7 @@ Click {{3}} to unsubscribe'",
27481
27571
  Array [
27482
27572
  Object {
27483
27573
  "defaultMessage": "Template name",
27484
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27574
+ "id": "creatives.containersV2.templateNameLabel",
27485
27575
  },
27486
27576
  ],
27487
27577
  Array [
@@ -27493,7 +27583,7 @@ Click {{3}} to unsubscribe'",
27493
27583
  Array [
27494
27584
  Object {
27495
27585
  "defaultMessage": "Enter template name",
27496
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27586
+ "id": "creatives.containersV2.templateNamePlaceholder",
27497
27587
  },
27498
27588
  ],
27499
27589
  Array [
@@ -27636,7 +27726,7 @@ Click {{3}} to unsubscribe'",
27636
27726
  Array [
27637
27727
  Object {
27638
27728
  "defaultMessage": "Template name",
27639
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27729
+ "id": "creatives.containersV2.templateNameLabel",
27640
27730
  },
27641
27731
  ],
27642
27732
  Array [
@@ -27648,7 +27738,7 @@ Click {{3}} to unsubscribe'",
27648
27738
  Array [
27649
27739
  Object {
27650
27740
  "defaultMessage": "Enter template name",
27651
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27741
+ "id": "creatives.containersV2.templateNamePlaceholder",
27652
27742
  },
27653
27743
  ],
27654
27744
  Array [
@@ -27803,7 +27893,7 @@ Click {{3}} to unsubscribe'",
27803
27893
  Array [
27804
27894
  Object {
27805
27895
  "defaultMessage": "Template name",
27806
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
27896
+ "id": "creatives.containersV2.templateNameLabel",
27807
27897
  },
27808
27898
  ],
27809
27899
  Array [
@@ -27815,7 +27905,7 @@ Click {{3}} to unsubscribe'",
27815
27905
  Array [
27816
27906
  Object {
27817
27907
  "defaultMessage": "Enter template name",
27818
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
27908
+ "id": "creatives.containersV2.templateNamePlaceholder",
27819
27909
  },
27820
27910
  ],
27821
27911
  Array [
@@ -28557,13 +28647,15 @@ Click {{3}} to unsubscribe'",
28557
28647
  className="ant-spin-container"
28558
28648
  key="container"
28559
28649
  >
28560
- <CapRow>
28650
+ <CapRow
28651
+ className="cap-whatsapp-creatives"
28652
+ >
28561
28653
  <Row
28562
- className="cap-row-v2"
28654
+ className="cap-row-v2 cap-whatsapp-creatives"
28563
28655
  gutter={0}
28564
28656
  >
28565
28657
  <div
28566
- className="ant-row cap-row-v2"
28658
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
28567
28659
  >
28568
28660
  <CapColumn
28569
28661
  key=".0"
@@ -30246,6 +30338,7 @@ T&C
30246
30338
  }
30247
30339
  key=".0"
30248
30340
  whatsappAccountName="WhatsppTest"
30341
+ whatsappContentLen={124}
30249
30342
  >
30250
30343
  <TemplatePreview
30251
30344
  channel="WHATSAPP"
@@ -32194,6 +32287,7 @@ T&C
32194
32287
  }
32195
32288
  }
32196
32289
  whatsappAccountName="WhatsppTest"
32290
+ whatsappContentLen={124}
32197
32291
  >
32198
32292
  <CapRow>
32199
32293
  <Row
@@ -32220,7 +32314,6 @@ T&C
32220
32314
  >
32221
32315
  <div
32222
32316
  className="shell-v2 align-center"
32223
- id="sms-preview"
32224
32317
  >
32225
32318
  <CapImage
32226
32319
  alt="Preview is being generated"
@@ -32233,19 +32326,19 @@ T&C
32233
32326
  src="test-file-stub"
32234
32327
  />
32235
32328
  </CapImage>
32236
- <div
32329
+ <CapLabel
32237
32330
  className="whatsapp-brand-name"
32331
+ type="label1"
32238
32332
  >
32239
- WhatsppTest
32240
- </div>
32333
+ <div
32334
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
32335
+ type="label1"
32336
+ >
32337
+ WhatsppTest
32338
+ </div>
32339
+ </CapLabel>
32241
32340
  <div
32242
- className="msgContainer"
32243
- style={
32244
- Object {
32245
- "marginLeft": 28,
32246
- "maxHeight": 292,
32247
- }
32248
- }
32341
+ className="msg-container whatsapp-message-container"
32249
32342
  >
32250
32343
  <div
32251
32344
  className="message-pop align-left"
@@ -32254,50 +32347,77 @@ T&C
32254
32347
  "background-color": "#efefef",
32255
32348
  "border-radius": "6px",
32256
32349
  "left": "10%",
32257
- "padding": "3.5px 0 0",
32350
+ "padding": "4px 0 0.571rem",
32258
32351
  "width": "88%",
32259
32352
  }
32260
32353
  }
32261
32354
  >
32262
- <p
32263
- style={
32264
- Object {
32265
- "color": "#2a2a2a",
32266
- "margin": "1.5px 6px 1px 7px",
32267
- }
32268
- }
32355
+ <CapLabel
32356
+ className="whatsapp-content"
32357
+ type="label1"
32269
32358
  >
32270
- <CapLabel
32271
- type="label5"
32359
+ <div
32360
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
32361
+ type="label1"
32272
32362
  >
32273
- <div
32274
- className="CapLabel-n7zsf5-0 gHdlVo"
32363
+ <CapLabel
32275
32364
  type="label5"
32276
32365
  >
32277
- Dear Customer, your{{1}} points are about to expire. Redeem before {{2}} at nearest Vishal Mega Mart and SHOP FOR FREE!
32366
+ <div
32367
+ className="CapLabel-n7zsf5-0 gHdlVo"
32368
+ type="label5"
32369
+ >
32370
+ Dear Customer, your{{1}} points are about to expire. Redeem before {{2}} at nearest Vishal Mega Mart and SHOP FOR FREE!
32278
32371
  T&C
32279
32372
 
32280
- </div>
32281
- </CapLabel>
32282
- <CapLabel
32283
- type="label11"
32284
- >
32285
- <div
32286
- className="CapLabel-n7zsf5-0 jpRuDd"
32373
+ </div>
32374
+ </CapLabel>
32375
+ <CapLabel
32287
32376
  type="label11"
32288
- />
32289
- </CapLabel>
32290
- </p>
32291
- <div
32292
- style={
32293
- Object {
32294
- "paddingBottom": "0.571rem",
32295
- }
32296
- }
32297
- />
32377
+ >
32378
+ <div
32379
+ className="CapLabel-n7zsf5-0 jpRuDd"
32380
+ type="label11"
32381
+ />
32382
+ </CapLabel>
32383
+ </div>
32384
+ </CapLabel>
32298
32385
  </div>
32299
32386
  </div>
32300
32387
  </div>
32388
+ <CapHeading
32389
+ className="margin-t-16"
32390
+ style={
32391
+ Object {
32392
+ "textAlign": "center",
32393
+ }
32394
+ }
32395
+ type="h3"
32396
+ >
32397
+ <div
32398
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
32399
+ style={
32400
+ Object {
32401
+ "textAlign": "center",
32402
+ }
32403
+ }
32404
+ type="h3"
32405
+ >
32406
+ <FormattedMessage
32407
+ defaultMessage="1 Message ({length} characters)"
32408
+ id="app.components.TemplatePreview.whatsappMessageLength"
32409
+ values={
32410
+ Object {
32411
+ "length": 160,
32412
+ }
32413
+ }
32414
+ >
32415
+ <span>
32416
+ 1 Message (160 characters)
32417
+ </span>
32418
+ </FormattedMessage>
32419
+ </div>
32420
+ </CapHeading>
32301
32421
  </div>
32302
32422
  </div>
32303
32423
  </Col>
@@ -34451,7 +34571,7 @@ Click {{3}} to unsubscribe'",
34451
34571
  Array [
34452
34572
  Object {
34453
34573
  "defaultMessage": "Template name",
34454
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
34574
+ "id": "creatives.containersV2.templateNameLabel",
34455
34575
  },
34456
34576
  ],
34457
34577
  Array [
@@ -34463,7 +34583,7 @@ Click {{3}} to unsubscribe'",
34463
34583
  Array [
34464
34584
  Object {
34465
34585
  "defaultMessage": "Enter template name",
34466
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
34586
+ "id": "creatives.containersV2.templateNamePlaceholder",
34467
34587
  },
34468
34588
  ],
34469
34589
  Array [
@@ -34606,7 +34726,7 @@ Click {{3}} to unsubscribe'",
34606
34726
  Array [
34607
34727
  Object {
34608
34728
  "defaultMessage": "Template name",
34609
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
34729
+ "id": "creatives.containersV2.templateNameLabel",
34610
34730
  },
34611
34731
  ],
34612
34732
  Array [
@@ -34618,7 +34738,7 @@ Click {{3}} to unsubscribe'",
34618
34738
  Array [
34619
34739
  Object {
34620
34740
  "defaultMessage": "Enter template name",
34621
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
34741
+ "id": "creatives.containersV2.templateNamePlaceholder",
34622
34742
  },
34623
34743
  ],
34624
34744
  Array [
@@ -34764,7 +34884,7 @@ Click {{3}} to unsubscribe'",
34764
34884
  Array [
34765
34885
  Object {
34766
34886
  "defaultMessage": "Template name",
34767
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
34887
+ "id": "creatives.containersV2.templateNameLabel",
34768
34888
  },
34769
34889
  ],
34770
34890
  Array [
@@ -34776,7 +34896,7 @@ Click {{3}} to unsubscribe'",
34776
34896
  Array [
34777
34897
  Object {
34778
34898
  "defaultMessage": "Enter template name",
34779
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
34899
+ "id": "creatives.containersV2.templateNamePlaceholder",
34780
34900
  },
34781
34901
  ],
34782
34902
  Array [
@@ -34922,7 +35042,7 @@ Click {{3}} to unsubscribe'",
34922
35042
  Array [
34923
35043
  Object {
34924
35044
  "defaultMessage": "Template name",
34925
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35045
+ "id": "creatives.containersV2.templateNameLabel",
34926
35046
  },
34927
35047
  ],
34928
35048
  Array [
@@ -34934,7 +35054,7 @@ Click {{3}} to unsubscribe'",
34934
35054
  Array [
34935
35055
  Object {
34936
35056
  "defaultMessage": "Enter template name",
34937
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35057
+ "id": "creatives.containersV2.templateNamePlaceholder",
34938
35058
  },
34939
35059
  ],
34940
35060
  Array [
@@ -35077,7 +35197,7 @@ Click {{3}} to unsubscribe'",
35077
35197
  Array [
35078
35198
  Object {
35079
35199
  "defaultMessage": "Template name",
35080
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35200
+ "id": "creatives.containersV2.templateNameLabel",
35081
35201
  },
35082
35202
  ],
35083
35203
  Array [
@@ -35089,7 +35209,7 @@ Click {{3}} to unsubscribe'",
35089
35209
  Array [
35090
35210
  Object {
35091
35211
  "defaultMessage": "Enter template name",
35092
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35212
+ "id": "creatives.containersV2.templateNamePlaceholder",
35093
35213
  },
35094
35214
  ],
35095
35215
  Array [
@@ -35244,7 +35364,7 @@ Click {{3}} to unsubscribe'",
35244
35364
  Array [
35245
35365
  Object {
35246
35366
  "defaultMessage": "Template name",
35247
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35367
+ "id": "creatives.containersV2.templateNameLabel",
35248
35368
  },
35249
35369
  ],
35250
35370
  Array [
@@ -35256,7 +35376,7 @@ Click {{3}} to unsubscribe'",
35256
35376
  Array [
35257
35377
  Object {
35258
35378
  "defaultMessage": "Enter template name",
35259
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35379
+ "id": "creatives.containersV2.templateNamePlaceholder",
35260
35380
  },
35261
35381
  ],
35262
35382
  Array [
@@ -35411,7 +35531,7 @@ Click {{3}} to unsubscribe'",
35411
35531
  Array [
35412
35532
  Object {
35413
35533
  "defaultMessage": "Template name",
35414
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35534
+ "id": "creatives.containersV2.templateNameLabel",
35415
35535
  },
35416
35536
  ],
35417
35537
  Array [
@@ -35423,7 +35543,7 @@ Click {{3}} to unsubscribe'",
35423
35543
  Array [
35424
35544
  Object {
35425
35545
  "defaultMessage": "Enter template name",
35426
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35546
+ "id": "creatives.containersV2.templateNamePlaceholder",
35427
35547
  },
35428
35548
  ],
35429
35549
  Array [
@@ -35566,7 +35686,7 @@ Click {{3}} to unsubscribe'",
35566
35686
  Array [
35567
35687
  Object {
35568
35688
  "defaultMessage": "Template name",
35569
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35689
+ "id": "creatives.containersV2.templateNameLabel",
35570
35690
  },
35571
35691
  ],
35572
35692
  Array [
@@ -35578,7 +35698,7 @@ Click {{3}} to unsubscribe'",
35578
35698
  Array [
35579
35699
  Object {
35580
35700
  "defaultMessage": "Enter template name",
35581
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35701
+ "id": "creatives.containersV2.templateNamePlaceholder",
35582
35702
  },
35583
35703
  ],
35584
35704
  Array [
@@ -35733,7 +35853,7 @@ Click {{3}} to unsubscribe'",
35733
35853
  Array [
35734
35854
  Object {
35735
35855
  "defaultMessage": "Template name",
35736
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
35856
+ "id": "creatives.containersV2.templateNameLabel",
35737
35857
  },
35738
35858
  ],
35739
35859
  Array [
@@ -35745,7 +35865,7 @@ Click {{3}} to unsubscribe'",
35745
35865
  Array [
35746
35866
  Object {
35747
35867
  "defaultMessage": "Enter template name",
35748
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
35868
+ "id": "creatives.containersV2.templateNamePlaceholder",
35749
35869
  },
35750
35870
  ],
35751
35871
  Array [
@@ -36783,13 +36903,15 @@ Click {{3}} to unsubscribe'",
36783
36903
  className="ant-spin-container"
36784
36904
  key="container"
36785
36905
  >
36786
- <CapRow>
36906
+ <CapRow
36907
+ className="cap-whatsapp-creatives"
36908
+ >
36787
36909
  <Row
36788
- className="cap-row-v2"
36910
+ className="cap-row-v2 cap-whatsapp-creatives"
36789
36911
  gutter={0}
36790
36912
  >
36791
36913
  <div
36792
- className="ant-row cap-row-v2"
36914
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
36793
36915
  >
36794
36916
  <CapColumn
36795
36917
  key=".0"
@@ -38472,6 +38594,7 @@ T&C
38472
38594
  }
38473
38595
  key=".0"
38474
38596
  whatsappAccountName="WhatsppTest"
38597
+ whatsappContentLen={124}
38475
38598
  >
38476
38599
  <TemplatePreview
38477
38600
  channel="WHATSAPP"
@@ -40420,6 +40543,7 @@ T&C
40420
40543
  }
40421
40544
  }
40422
40545
  whatsappAccountName="WhatsppTest"
40546
+ whatsappContentLen={124}
40423
40547
  >
40424
40548
  <CapRow>
40425
40549
  <Row
@@ -40446,7 +40570,6 @@ T&C
40446
40570
  >
40447
40571
  <div
40448
40572
  className="shell-v2 align-center"
40449
- id="sms-preview"
40450
40573
  >
40451
40574
  <CapImage
40452
40575
  alt="Preview is being generated"
@@ -40459,19 +40582,19 @@ T&C
40459
40582
  src="test-file-stub"
40460
40583
  />
40461
40584
  </CapImage>
40462
- <div
40585
+ <CapLabel
40463
40586
  className="whatsapp-brand-name"
40587
+ type="label1"
40464
40588
  >
40465
- WhatsppTest
40466
- </div>
40589
+ <div
40590
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
40591
+ type="label1"
40592
+ >
40593
+ WhatsppTest
40594
+ </div>
40595
+ </CapLabel>
40467
40596
  <div
40468
- className="msgContainer"
40469
- style={
40470
- Object {
40471
- "marginLeft": 28,
40472
- "maxHeight": 292,
40473
- }
40474
- }
40597
+ className="msg-container whatsapp-message-container"
40475
40598
  >
40476
40599
  <div
40477
40600
  className="message-pop align-left"
@@ -40480,50 +40603,77 @@ T&C
40480
40603
  "background-color": "#efefef",
40481
40604
  "border-radius": "6px",
40482
40605
  "left": "10%",
40483
- "padding": "3.5px 0 0",
40606
+ "padding": "4px 0 0.571rem",
40484
40607
  "width": "88%",
40485
40608
  }
40486
40609
  }
40487
40610
  >
40488
- <p
40489
- style={
40490
- Object {
40491
- "color": "#2a2a2a",
40492
- "margin": "1.5px 6px 1px 7px",
40493
- }
40494
- }
40611
+ <CapLabel
40612
+ className="whatsapp-content"
40613
+ type="label1"
40495
40614
  >
40496
- <CapLabel
40497
- type="label5"
40615
+ <div
40616
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
40617
+ type="label1"
40498
40618
  >
40499
- <div
40500
- className="CapLabel-n7zsf5-0 gHdlVo"
40619
+ <CapLabel
40501
40620
  type="label5"
40502
40621
  >
40503
- Dear Customer, your{{1}} points are about to expire. Redeem before {{2}} at nearest Vishal Mega Mart and SHOP FOR FREE!
40622
+ <div
40623
+ className="CapLabel-n7zsf5-0 gHdlVo"
40624
+ type="label5"
40625
+ >
40626
+ Dear Customer, your{{1}} points are about to expire. Redeem before {{2}} at nearest Vishal Mega Mart and SHOP FOR FREE!
40504
40627
  T&C
40505
40628
 
40506
- </div>
40507
- </CapLabel>
40508
- <CapLabel
40509
- type="label11"
40510
- >
40511
- <div
40512
- className="CapLabel-n7zsf5-0 jpRuDd"
40629
+ </div>
40630
+ </CapLabel>
40631
+ <CapLabel
40513
40632
  type="label11"
40514
- />
40515
- </CapLabel>
40516
- </p>
40517
- <div
40518
- style={
40519
- Object {
40520
- "paddingBottom": "0.571rem",
40521
- }
40522
- }
40523
- />
40633
+ >
40634
+ <div
40635
+ className="CapLabel-n7zsf5-0 jpRuDd"
40636
+ type="label11"
40637
+ />
40638
+ </CapLabel>
40639
+ </div>
40640
+ </CapLabel>
40524
40641
  </div>
40525
40642
  </div>
40526
40643
  </div>
40644
+ <CapHeading
40645
+ className="margin-t-16"
40646
+ style={
40647
+ Object {
40648
+ "textAlign": "center",
40649
+ }
40650
+ }
40651
+ type="h3"
40652
+ >
40653
+ <div
40654
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
40655
+ style={
40656
+ Object {
40657
+ "textAlign": "center",
40658
+ }
40659
+ }
40660
+ type="h3"
40661
+ >
40662
+ <FormattedMessage
40663
+ defaultMessage="1 Message ({length} characters)"
40664
+ id="app.components.TemplatePreview.whatsappMessageLength"
40665
+ values={
40666
+ Object {
40667
+ "length": 160,
40668
+ }
40669
+ }
40670
+ >
40671
+ <span>
40672
+ 1 Message (160 characters)
40673
+ </span>
40674
+ </FormattedMessage>
40675
+ </div>
40676
+ </CapHeading>
40527
40677
  </div>
40528
40678
  </div>
40529
40679
  </Col>
@@ -42700,7 +42850,7 @@ Click {{3}} to unsubscribe'",
42700
42850
  Array [
42701
42851
  Object {
42702
42852
  "defaultMessage": "Template name",
42703
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
42853
+ "id": "creatives.containersV2.templateNameLabel",
42704
42854
  },
42705
42855
  ],
42706
42856
  Array [
@@ -42712,7 +42862,7 @@ Click {{3}} to unsubscribe'",
42712
42862
  Array [
42713
42863
  Object {
42714
42864
  "defaultMessage": "Enter template name",
42715
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
42865
+ "id": "creatives.containersV2.templateNamePlaceholder",
42716
42866
  },
42717
42867
  ],
42718
42868
  Array [
@@ -42855,7 +43005,7 @@ Click {{3}} to unsubscribe'",
42855
43005
  Array [
42856
43006
  Object {
42857
43007
  "defaultMessage": "Template name",
42858
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43008
+ "id": "creatives.containersV2.templateNameLabel",
42859
43009
  },
42860
43010
  ],
42861
43011
  Array [
@@ -42867,7 +43017,7 @@ Click {{3}} to unsubscribe'",
42867
43017
  Array [
42868
43018
  Object {
42869
43019
  "defaultMessage": "Enter template name",
42870
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43020
+ "id": "creatives.containersV2.templateNamePlaceholder",
42871
43021
  },
42872
43022
  ],
42873
43023
  Array [
@@ -43013,7 +43163,7 @@ Click {{3}} to unsubscribe'",
43013
43163
  Array [
43014
43164
  Object {
43015
43165
  "defaultMessage": "Template name",
43016
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43166
+ "id": "creatives.containersV2.templateNameLabel",
43017
43167
  },
43018
43168
  ],
43019
43169
  Array [
@@ -43025,7 +43175,7 @@ Click {{3}} to unsubscribe'",
43025
43175
  Array [
43026
43176
  Object {
43027
43177
  "defaultMessage": "Enter template name",
43028
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43178
+ "id": "creatives.containersV2.templateNamePlaceholder",
43029
43179
  },
43030
43180
  ],
43031
43181
  Array [
@@ -43171,7 +43321,7 @@ Click {{3}} to unsubscribe'",
43171
43321
  Array [
43172
43322
  Object {
43173
43323
  "defaultMessage": "Template name",
43174
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43324
+ "id": "creatives.containersV2.templateNameLabel",
43175
43325
  },
43176
43326
  ],
43177
43327
  Array [
@@ -43183,7 +43333,7 @@ Click {{3}} to unsubscribe'",
43183
43333
  Array [
43184
43334
  Object {
43185
43335
  "defaultMessage": "Enter template name",
43186
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43336
+ "id": "creatives.containersV2.templateNamePlaceholder",
43187
43337
  },
43188
43338
  ],
43189
43339
  Array [
@@ -43326,7 +43476,7 @@ Click {{3}} to unsubscribe'",
43326
43476
  Array [
43327
43477
  Object {
43328
43478
  "defaultMessage": "Template name",
43329
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43479
+ "id": "creatives.containersV2.templateNameLabel",
43330
43480
  },
43331
43481
  ],
43332
43482
  Array [
@@ -43338,7 +43488,7 @@ Click {{3}} to unsubscribe'",
43338
43488
  Array [
43339
43489
  Object {
43340
43490
  "defaultMessage": "Enter template name",
43341
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43491
+ "id": "creatives.containersV2.templateNamePlaceholder",
43342
43492
  },
43343
43493
  ],
43344
43494
  Array [
@@ -43493,7 +43643,7 @@ Click {{3}} to unsubscribe'",
43493
43643
  Array [
43494
43644
  Object {
43495
43645
  "defaultMessage": "Template name",
43496
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43646
+ "id": "creatives.containersV2.templateNameLabel",
43497
43647
  },
43498
43648
  ],
43499
43649
  Array [
@@ -43505,7 +43655,7 @@ Click {{3}} to unsubscribe'",
43505
43655
  Array [
43506
43656
  Object {
43507
43657
  "defaultMessage": "Enter template name",
43508
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43658
+ "id": "creatives.containersV2.templateNamePlaceholder",
43509
43659
  },
43510
43660
  ],
43511
43661
  Array [
@@ -43660,7 +43810,7 @@ Click {{3}} to unsubscribe'",
43660
43810
  Array [
43661
43811
  Object {
43662
43812
  "defaultMessage": "Template name",
43663
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43813
+ "id": "creatives.containersV2.templateNameLabel",
43664
43814
  },
43665
43815
  ],
43666
43816
  Array [
@@ -43672,7 +43822,7 @@ Click {{3}} to unsubscribe'",
43672
43822
  Array [
43673
43823
  Object {
43674
43824
  "defaultMessage": "Enter template name",
43675
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43825
+ "id": "creatives.containersV2.templateNamePlaceholder",
43676
43826
  },
43677
43827
  ],
43678
43828
  Array [
@@ -43815,7 +43965,7 @@ Click {{3}} to unsubscribe'",
43815
43965
  Array [
43816
43966
  Object {
43817
43967
  "defaultMessage": "Template name",
43818
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
43968
+ "id": "creatives.containersV2.templateNameLabel",
43819
43969
  },
43820
43970
  ],
43821
43971
  Array [
@@ -43827,7 +43977,7 @@ Click {{3}} to unsubscribe'",
43827
43977
  Array [
43828
43978
  Object {
43829
43979
  "defaultMessage": "Enter template name",
43830
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
43980
+ "id": "creatives.containersV2.templateNamePlaceholder",
43831
43981
  },
43832
43982
  ],
43833
43983
  Array [
@@ -43982,7 +44132,7 @@ Click {{3}} to unsubscribe'",
43982
44132
  Array [
43983
44133
  Object {
43984
44134
  "defaultMessage": "Template name",
43985
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
44135
+ "id": "creatives.containersV2.templateNameLabel",
43986
44136
  },
43987
44137
  ],
43988
44138
  Array [
@@ -43994,7 +44144,7 @@ Click {{3}} to unsubscribe'",
43994
44144
  Array [
43995
44145
  Object {
43996
44146
  "defaultMessage": "Enter template name",
43997
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
44147
+ "id": "creatives.containersV2.templateNamePlaceholder",
43998
44148
  },
43999
44149
  ],
44000
44150
  Array [
@@ -44149,7 +44299,7 @@ Click {{3}} to unsubscribe'",
44149
44299
  Array [
44150
44300
  Object {
44151
44301
  "defaultMessage": "Template name",
44152
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
44302
+ "id": "creatives.containersV2.templateNameLabel",
44153
44303
  },
44154
44304
  ],
44155
44305
  Array [
@@ -44161,7 +44311,7 @@ Click {{3}} to unsubscribe'",
44161
44311
  Array [
44162
44312
  Object {
44163
44313
  "defaultMessage": "Enter template name",
44164
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
44314
+ "id": "creatives.containersV2.templateNamePlaceholder",
44165
44315
  },
44166
44316
  ],
44167
44317
  Array [
@@ -44304,7 +44454,7 @@ Click {{3}} to unsubscribe'",
44304
44454
  Array [
44305
44455
  Object {
44306
44456
  "defaultMessage": "Template name",
44307
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
44457
+ "id": "creatives.containersV2.templateNameLabel",
44308
44458
  },
44309
44459
  ],
44310
44460
  Array [
@@ -44316,7 +44466,7 @@ Click {{3}} to unsubscribe'",
44316
44466
  Array [
44317
44467
  Object {
44318
44468
  "defaultMessage": "Enter template name",
44319
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
44469
+ "id": "creatives.containersV2.templateNamePlaceholder",
44320
44470
  },
44321
44471
  ],
44322
44472
  Array [
@@ -44462,7 +44612,7 @@ Click {{3}} to unsubscribe'",
44462
44612
  Array [
44463
44613
  Object {
44464
44614
  "defaultMessage": "Template name",
44465
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
44615
+ "id": "creatives.containersV2.templateNameLabel",
44466
44616
  },
44467
44617
  ],
44468
44618
  Array [
@@ -44474,7 +44624,7 @@ Click {{3}} to unsubscribe'",
44474
44624
  Array [
44475
44625
  Object {
44476
44626
  "defaultMessage": "Enter template name",
44477
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
44627
+ "id": "creatives.containersV2.templateNamePlaceholder",
44478
44628
  },
44479
44629
  ],
44480
44630
  Array [
@@ -44620,7 +44770,7 @@ Click {{3}} to unsubscribe'",
44620
44770
  Array [
44621
44771
  Object {
44622
44772
  "defaultMessage": "Template name",
44623
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
44773
+ "id": "creatives.containersV2.templateNameLabel",
44624
44774
  },
44625
44775
  ],
44626
44776
  Array [
@@ -44632,7 +44782,7 @@ Click {{3}} to unsubscribe'",
44632
44782
  Array [
44633
44783
  Object {
44634
44784
  "defaultMessage": "Enter template name",
44635
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
44785
+ "id": "creatives.containersV2.templateNamePlaceholder",
44636
44786
  },
44637
44787
  ],
44638
44788
  Array [
@@ -46045,13 +46195,15 @@ Click {{3}} to unsubscribe'",
46045
46195
  className="ant-spin-container"
46046
46196
  key="container"
46047
46197
  >
46048
- <CapRow>
46198
+ <CapRow
46199
+ className="cap-whatsapp-creatives"
46200
+ >
46049
46201
  <Row
46050
- className="cap-row-v2"
46202
+ className="cap-row-v2 cap-whatsapp-creatives"
46051
46203
  gutter={0}
46052
46204
  >
46053
46205
  <div
46054
- className="ant-row cap-row-v2"
46206
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
46055
46207
  >
46056
46208
  <CapColumn
46057
46209
  key=".0"
@@ -47756,6 +47908,7 @@ T&C
47756
47908
  }
47757
47909
  key=".0"
47758
47910
  whatsappAccountName="WhatsppTest"
47911
+ whatsappContentLen={126}
47759
47912
  >
47760
47913
  <TemplatePreview
47761
47914
  channel="WHATSAPP"
@@ -49704,6 +49857,7 @@ T&C
49704
49857
  }
49705
49858
  }
49706
49859
  whatsappAccountName="WhatsppTest"
49860
+ whatsappContentLen={126}
49707
49861
  >
49708
49862
  <CapRow>
49709
49863
  <Row
@@ -49730,7 +49884,6 @@ T&C
49730
49884
  >
49731
49885
  <div
49732
49886
  className="shell-v2 align-center"
49733
- id="sms-preview"
49734
49887
  >
49735
49888
  <CapImage
49736
49889
  alt="Preview is being generated"
@@ -49743,19 +49896,19 @@ T&C
49743
49896
  src="test-file-stub"
49744
49897
  />
49745
49898
  </CapImage>
49746
- <div
49899
+ <CapLabel
49747
49900
  className="whatsapp-brand-name"
49901
+ type="label1"
49748
49902
  >
49749
- WhatsppTest
49750
- </div>
49903
+ <div
49904
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
49905
+ type="label1"
49906
+ >
49907
+ WhatsppTest
49908
+ </div>
49909
+ </CapLabel>
49751
49910
  <div
49752
- className="msgContainer"
49753
- style={
49754
- Object {
49755
- "marginLeft": 28,
49756
- "maxHeight": 292,
49757
- }
49758
- }
49911
+ className="msg-container whatsapp-message-container"
49759
49912
  >
49760
49913
  <div
49761
49914
  className="message-pop align-left"
@@ -49764,50 +49917,77 @@ T&C
49764
49917
  "background-color": "#efefef",
49765
49918
  "border-radius": "6px",
49766
49919
  "left": "10%",
49767
- "padding": "3.5px 0 0",
49920
+ "padding": "4px 0 0.571rem",
49768
49921
  "width": "88%",
49769
49922
  }
49770
49923
  }
49771
49924
  >
49772
- <p
49773
- style={
49774
- Object {
49775
- "color": "#2a2a2a",
49776
- "margin": "1.5px 6px 1px 7px",
49777
- }
49778
- }
49925
+ <CapLabel
49926
+ className="whatsapp-content"
49927
+ type="label1"
49779
49928
  >
49780
- <CapLabel
49781
- type="label5"
49929
+ <div
49930
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
49931
+ type="label1"
49782
49932
  >
49783
- <div
49784
- className="CapLabel-n7zsf5-0 gHdlVo"
49933
+ <CapLabel
49785
49934
  type="label5"
49786
49935
  >
49787
- Dear Customer, your5454 points are about to expire. Redeem before tomorrow at nearest Vishal Mega Mart and SHOP FOR FREE!
49936
+ <div
49937
+ className="CapLabel-n7zsf5-0 gHdlVo"
49938
+ type="label5"
49939
+ >
49940
+ Dear Customer, your5454 points are about to expire. Redeem before tomorrow at nearest Vishal Mega Mart and SHOP FOR FREE!
49788
49941
  T&C
49789
49942
 
49790
- </div>
49791
- </CapLabel>
49792
- <CapLabel
49793
- type="label11"
49794
- >
49795
- <div
49796
- className="CapLabel-n7zsf5-0 jpRuDd"
49943
+ </div>
49944
+ </CapLabel>
49945
+ <CapLabel
49797
49946
  type="label11"
49798
- />
49799
- </CapLabel>
49800
- </p>
49801
- <div
49802
- style={
49803
- Object {
49804
- "paddingBottom": "0.571rem",
49805
- }
49806
- }
49807
- />
49947
+ >
49948
+ <div
49949
+ className="CapLabel-n7zsf5-0 jpRuDd"
49950
+ type="label11"
49951
+ />
49952
+ </CapLabel>
49953
+ </div>
49954
+ </CapLabel>
49808
49955
  </div>
49809
49956
  </div>
49810
49957
  </div>
49958
+ <CapHeading
49959
+ className="margin-t-16"
49960
+ style={
49961
+ Object {
49962
+ "textAlign": "center",
49963
+ }
49964
+ }
49965
+ type="h3"
49966
+ >
49967
+ <div
49968
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
49969
+ style={
49970
+ Object {
49971
+ "textAlign": "center",
49972
+ }
49973
+ }
49974
+ type="h3"
49975
+ >
49976
+ <FormattedMessage
49977
+ defaultMessage="1 Message ({length} characters)"
49978
+ id="app.components.TemplatePreview.whatsappMessageLength"
49979
+ values={
49980
+ Object {
49981
+ "length": 162,
49982
+ }
49983
+ }
49984
+ >
49985
+ <span>
49986
+ 1 Message (162 characters)
49987
+ </span>
49988
+ </FormattedMessage>
49989
+ </div>
49990
+ </CapHeading>
49811
49991
  </div>
49812
49992
  </div>
49813
49993
  </Col>
@@ -51854,7 +52034,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
51854
52034
  Array [
51855
52035
  Object {
51856
52036
  "defaultMessage": "Template name",
51857
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
52037
+ "id": "creatives.containersV2.templateNameLabel",
51858
52038
  },
51859
52039
  ],
51860
52040
  Array [
@@ -51866,7 +52046,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
51866
52046
  Array [
51867
52047
  Object {
51868
52048
  "defaultMessage": "Enter template name",
51869
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
52049
+ "id": "creatives.containersV2.templateNamePlaceholder",
51870
52050
  },
51871
52051
  ],
51872
52052
  Array [
@@ -52009,7 +52189,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
52009
52189
  Array [
52010
52190
  Object {
52011
52191
  "defaultMessage": "Template name",
52012
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
52192
+ "id": "creatives.containersV2.templateNameLabel",
52013
52193
  },
52014
52194
  ],
52015
52195
  Array [
@@ -52021,7 +52201,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
52021
52201
  Array [
52022
52202
  Object {
52023
52203
  "defaultMessage": "Enter template name",
52024
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
52204
+ "id": "creatives.containersV2.templateNamePlaceholder",
52025
52205
  },
52026
52206
  ],
52027
52207
  Array [
@@ -52164,7 +52344,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
52164
52344
  Array [
52165
52345
  Object {
52166
52346
  "defaultMessage": "Template name",
52167
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
52347
+ "id": "creatives.containersV2.templateNameLabel",
52168
52348
  },
52169
52349
  ],
52170
52350
  Array [
@@ -52176,7 +52356,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
52176
52356
  Array [
52177
52357
  Object {
52178
52358
  "defaultMessage": "Enter template name",
52179
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
52359
+ "id": "creatives.containersV2.templateNamePlaceholder",
52180
52360
  },
52181
52361
  ],
52182
52362
  Array [
@@ -52604,13 +52784,15 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
52604
52784
  className="ant-spin-container"
52605
52785
  key="container"
52606
52786
  >
52607
- <CapRow>
52787
+ <CapRow
52788
+ className="cap-whatsapp-creatives"
52789
+ >
52608
52790
  <Row
52609
- className="cap-row-v2"
52791
+ className="cap-row-v2 cap-whatsapp-creatives"
52610
52792
  gutter={0}
52611
52793
  >
52612
52794
  <div
52613
- className="ant-row cap-row-v2"
52795
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
52614
52796
  >
52615
52797
  <CapColumn
52616
52798
  key=".0"
@@ -57054,6 +57236,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
57054
57236
  }
57055
57237
  key=".0"
57056
57238
  whatsappAccountName="WhatsppTest"
57239
+ whatsappContentLen={0}
57057
57240
  >
57058
57241
  <TemplatePreview
57059
57242
  channel="WHATSAPP"
@@ -59000,6 +59183,7 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
59000
59183
  }
59001
59184
  }
59002
59185
  whatsappAccountName="WhatsppTest"
59186
+ whatsappContentLen={0}
59003
59187
  >
59004
59188
  <CapRow>
59005
59189
  <Row
@@ -59026,7 +59210,6 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
59026
59210
  >
59027
59211
  <div
59028
59212
  className="shell-v2 align-center"
59029
- id="sms-preview"
59030
59213
  >
59031
59214
  <CapImage
59032
59215
  alt="Preview is being generated"
@@ -59039,19 +59222,19 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
59039
59222
  src="test-file-stub"
59040
59223
  />
59041
59224
  </CapImage>
59042
- <div
59225
+ <CapLabel
59043
59226
  className="whatsapp-brand-name"
59227
+ type="label1"
59044
59228
  >
59045
- WhatsppTest
59046
- </div>
59229
+ <div
59230
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
59231
+ type="label1"
59232
+ >
59233
+ WhatsppTest
59234
+ </div>
59235
+ </CapLabel>
59047
59236
  <div
59048
- className="msgContainer"
59049
- style={
59050
- Object {
59051
- "marginLeft": 28,
59052
- "maxHeight": 292,
59053
- }
59054
- }
59237
+ className="msg-container whatsapp-message-container"
59055
59238
  >
59056
59239
  <div
59057
59240
  className="message-pop align-left"
@@ -59060,46 +59243,73 @@ exports[`Creatives Whatsapp test/> template category change 1`] = `
59060
59243
  "background-color": "#efefef",
59061
59244
  "border-radius": "6px",
59062
59245
  "left": "10%",
59063
- "padding": "3.5px 0 0",
59246
+ "padding": "4px 0 0.571rem",
59064
59247
  "width": "88%",
59065
59248
  }
59066
59249
  }
59067
59250
  >
59068
- <p
59069
- style={
59070
- Object {
59071
- "color": "#2a2a2a",
59072
- "margin": "1.5px 6px 1px 7px",
59073
- }
59074
- }
59251
+ <CapLabel
59252
+ className="whatsapp-content"
59253
+ type="label1"
59075
59254
  >
59076
- <CapLabel
59077
- type="label5"
59255
+ <div
59256
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
59257
+ type="label1"
59078
59258
  >
59079
- <div
59080
- className="CapLabel-n7zsf5-0 gHdlVo"
59259
+ <CapLabel
59081
59260
  type="label5"
59082
- />
59083
- </CapLabel>
59084
- <CapLabel
59085
- type="label11"
59086
- >
59087
- <div
59088
- className="CapLabel-n7zsf5-0 jpRuDd"
59261
+ >
59262
+ <div
59263
+ className="CapLabel-n7zsf5-0 gHdlVo"
59264
+ type="label5"
59265
+ />
59266
+ </CapLabel>
59267
+ <CapLabel
59089
59268
  type="label11"
59090
- />
59091
- </CapLabel>
59092
- </p>
59093
- <div
59094
- style={
59095
- Object {
59096
- "paddingBottom": "0.571rem",
59097
- }
59098
- }
59099
- />
59269
+ >
59270
+ <div
59271
+ className="CapLabel-n7zsf5-0 jpRuDd"
59272
+ type="label11"
59273
+ />
59274
+ </CapLabel>
59275
+ </div>
59276
+ </CapLabel>
59100
59277
  </div>
59101
59278
  </div>
59102
59279
  </div>
59280
+ <CapHeading
59281
+ className="margin-t-16"
59282
+ style={
59283
+ Object {
59284
+ "textAlign": "center",
59285
+ }
59286
+ }
59287
+ type="h3"
59288
+ >
59289
+ <div
59290
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
59291
+ style={
59292
+ Object {
59293
+ "textAlign": "center",
59294
+ }
59295
+ }
59296
+ type="h3"
59297
+ >
59298
+ <FormattedMessage
59299
+ defaultMessage="1 Message ({length} characters)"
59300
+ id="app.components.TemplatePreview.whatsappMessageLength"
59301
+ values={
59302
+ Object {
59303
+ "length": 36,
59304
+ }
59305
+ }
59306
+ >
59307
+ <span>
59308
+ 1 Message (36 characters)
59309
+ </span>
59310
+ </FormattedMessage>
59311
+ </div>
59312
+ </CapHeading>
59103
59313
  </div>
59104
59314
  </div>
59105
59315
  </Col>
@@ -61220,7 +61430,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61220
61430
  Array [
61221
61431
  Object {
61222
61432
  "defaultMessage": "Template name",
61223
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
61433
+ "id": "creatives.containersV2.templateNameLabel",
61224
61434
  },
61225
61435
  ],
61226
61436
  Array [
@@ -61232,7 +61442,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61232
61442
  Array [
61233
61443
  Object {
61234
61444
  "defaultMessage": "Enter template name",
61235
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
61445
+ "id": "creatives.containersV2.templateNamePlaceholder",
61236
61446
  },
61237
61447
  ],
61238
61448
  Array [
@@ -61375,7 +61585,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61375
61585
  Array [
61376
61586
  Object {
61377
61587
  "defaultMessage": "Template name",
61378
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
61588
+ "id": "creatives.containersV2.templateNameLabel",
61379
61589
  },
61380
61590
  ],
61381
61591
  Array [
@@ -61387,7 +61597,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61387
61597
  Array [
61388
61598
  Object {
61389
61599
  "defaultMessage": "Enter template name",
61390
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
61600
+ "id": "creatives.containersV2.templateNamePlaceholder",
61391
61601
  },
61392
61602
  ],
61393
61603
  Array [
@@ -61536,7 +61746,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61536
61746
  Array [
61537
61747
  Object {
61538
61748
  "defaultMessage": "Template name",
61539
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
61749
+ "id": "creatives.containersV2.templateNameLabel",
61540
61750
  },
61541
61751
  ],
61542
61752
  Array [
@@ -61548,7 +61758,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61548
61758
  Array [
61549
61759
  Object {
61550
61760
  "defaultMessage": "Enter template name",
61551
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
61761
+ "id": "creatives.containersV2.templateNamePlaceholder",
61552
61762
  },
61553
61763
  ],
61554
61764
  Array [
@@ -61980,13 +62190,15 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
61980
62190
  className="ant-spin-container"
61981
62191
  key="container"
61982
62192
  >
61983
- <CapRow>
62193
+ <CapRow
62194
+ className="cap-whatsapp-creatives"
62195
+ >
61984
62196
  <Row
61985
- className="cap-row-v2"
62197
+ className="cap-row-v2 cap-whatsapp-creatives"
61986
62198
  gutter={0}
61987
62199
  >
61988
62200
  <div
61989
- className="ant-row cap-row-v2"
62201
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
61990
62202
  >
61991
62203
  <CapColumn
61992
62204
  key=".0"
@@ -66424,6 +66636,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
66424
66636
  }
66425
66637
  key=".0"
66426
66638
  whatsappAccountName="WhatsppTest"
66639
+ whatsappContentLen={0}
66427
66640
  >
66428
66641
  <TemplatePreview
66429
66642
  channel="WHATSAPP"
@@ -68370,6 +68583,7 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
68370
68583
  }
68371
68584
  }
68372
68585
  whatsappAccountName="WhatsppTest"
68586
+ whatsappContentLen={0}
68373
68587
  >
68374
68588
  <CapRow>
68375
68589
  <Row
@@ -68396,7 +68610,6 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
68396
68610
  >
68397
68611
  <div
68398
68612
  className="shell-v2 align-center"
68399
- id="sms-preview"
68400
68613
  >
68401
68614
  <CapImage
68402
68615
  alt="Preview is being generated"
@@ -68409,19 +68622,19 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
68409
68622
  src="test-file-stub"
68410
68623
  />
68411
68624
  </CapImage>
68412
- <div
68625
+ <CapLabel
68413
68626
  className="whatsapp-brand-name"
68627
+ type="label1"
68414
68628
  >
68415
- WhatsppTest
68416
- </div>
68629
+ <div
68630
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
68631
+ type="label1"
68632
+ >
68633
+ WhatsppTest
68634
+ </div>
68635
+ </CapLabel>
68417
68636
  <div
68418
- className="msgContainer"
68419
- style={
68420
- Object {
68421
- "marginLeft": 28,
68422
- "maxHeight": 292,
68423
- }
68424
- }
68637
+ className="msg-container whatsapp-message-container"
68425
68638
  >
68426
68639
  <div
68427
68640
  className="message-pop align-left"
@@ -68430,46 +68643,73 @@ exports[`Creatives Whatsapp test/> template message 1`] = `
68430
68643
  "background-color": "#efefef",
68431
68644
  "border-radius": "6px",
68432
68645
  "left": "10%",
68433
- "padding": "3.5px 0 0",
68646
+ "padding": "4px 0 0.571rem",
68434
68647
  "width": "88%",
68435
68648
  }
68436
68649
  }
68437
68650
  >
68438
- <p
68439
- style={
68440
- Object {
68441
- "color": "#2a2a2a",
68442
- "margin": "1.5px 6px 1px 7px",
68443
- }
68444
- }
68651
+ <CapLabel
68652
+ className="whatsapp-content"
68653
+ type="label1"
68445
68654
  >
68446
- <CapLabel
68447
- type="label5"
68655
+ <div
68656
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
68657
+ type="label1"
68448
68658
  >
68449
- <div
68450
- className="CapLabel-n7zsf5-0 gHdlVo"
68659
+ <CapLabel
68451
68660
  type="label5"
68452
- />
68453
- </CapLabel>
68454
- <CapLabel
68455
- type="label11"
68456
- >
68457
- <div
68458
- className="CapLabel-n7zsf5-0 jpRuDd"
68661
+ >
68662
+ <div
68663
+ className="CapLabel-n7zsf5-0 gHdlVo"
68664
+ type="label5"
68665
+ />
68666
+ </CapLabel>
68667
+ <CapLabel
68459
68668
  type="label11"
68460
- />
68461
- </CapLabel>
68462
- </p>
68463
- <div
68464
- style={
68465
- Object {
68466
- "paddingBottom": "0.571rem",
68467
- }
68468
- }
68469
- />
68669
+ >
68670
+ <div
68671
+ className="CapLabel-n7zsf5-0 jpRuDd"
68672
+ type="label11"
68673
+ />
68674
+ </CapLabel>
68675
+ </div>
68676
+ </CapLabel>
68470
68677
  </div>
68471
68678
  </div>
68472
68679
  </div>
68680
+ <CapHeading
68681
+ className="margin-t-16"
68682
+ style={
68683
+ Object {
68684
+ "textAlign": "center",
68685
+ }
68686
+ }
68687
+ type="h3"
68688
+ >
68689
+ <div
68690
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
68691
+ style={
68692
+ Object {
68693
+ "textAlign": "center",
68694
+ }
68695
+ }
68696
+ type="h3"
68697
+ >
68698
+ <FormattedMessage
68699
+ defaultMessage="1 Message ({length} characters)"
68700
+ id="app.components.TemplatePreview.whatsappMessageLength"
68701
+ values={
68702
+ Object {
68703
+ "length": 36,
68704
+ }
68705
+ }
68706
+ >
68707
+ <span>
68708
+ 1 Message (36 characters)
68709
+ </span>
68710
+ </FormattedMessage>
68711
+ </div>
68712
+ </CapHeading>
68473
68713
  </div>
68474
68714
  </div>
68475
68715
  </Col>
@@ -70590,7 +70830,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70590
70830
  Array [
70591
70831
  Object {
70592
70832
  "defaultMessage": "Template name",
70593
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
70833
+ "id": "creatives.containersV2.templateNameLabel",
70594
70834
  },
70595
70835
  ],
70596
70836
  Array [
@@ -70602,7 +70842,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70602
70842
  Array [
70603
70843
  Object {
70604
70844
  "defaultMessage": "Enter template name",
70605
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
70845
+ "id": "creatives.containersV2.templateNamePlaceholder",
70606
70846
  },
70607
70847
  ],
70608
70848
  Array [
@@ -70745,7 +70985,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70745
70985
  Array [
70746
70986
  Object {
70747
70987
  "defaultMessage": "Template name",
70748
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
70988
+ "id": "creatives.containersV2.templateNameLabel",
70749
70989
  },
70750
70990
  ],
70751
70991
  Array [
@@ -70757,7 +70997,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70757
70997
  Array [
70758
70998
  Object {
70759
70999
  "defaultMessage": "Enter template name",
70760
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
71000
+ "id": "creatives.containersV2.templateNamePlaceholder",
70761
71001
  },
70762
71002
  ],
70763
71003
  Array [
@@ -70906,7 +71146,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70906
71146
  Array [
70907
71147
  Object {
70908
71148
  "defaultMessage": "Template name",
70909
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
71149
+ "id": "creatives.containersV2.templateNameLabel",
70910
71150
  },
70911
71151
  ],
70912
71152
  Array [
@@ -70918,7 +71158,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
70918
71158
  Array [
70919
71159
  Object {
70920
71160
  "defaultMessage": "Enter template name",
70921
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
71161
+ "id": "creatives.containersV2.templateNamePlaceholder",
70922
71162
  },
70923
71163
  ],
70924
71164
  Array [
@@ -71061,7 +71301,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
71061
71301
  Array [
71062
71302
  Object {
71063
71303
  "defaultMessage": "Template name",
71064
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
71304
+ "id": "creatives.containersV2.templateNameLabel",
71065
71305
  },
71066
71306
  ],
71067
71307
  Array [
@@ -71073,7 +71313,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
71073
71313
  Array [
71074
71314
  Object {
71075
71315
  "defaultMessage": "Enter template name",
71076
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
71316
+ "id": "creatives.containersV2.templateNamePlaceholder",
71077
71317
  },
71078
71318
  ],
71079
71319
  Array [
@@ -71601,13 +71841,15 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
71601
71841
  className="ant-spin-container"
71602
71842
  key="container"
71603
71843
  >
71604
- <CapRow>
71844
+ <CapRow
71845
+ className="cap-whatsapp-creatives"
71846
+ >
71605
71847
  <Row
71606
- className="cap-row-v2"
71848
+ className="cap-row-v2 cap-whatsapp-creatives"
71607
71849
  gutter={0}
71608
71850
  >
71609
71851
  <div
71610
- className="ant-row cap-row-v2"
71852
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
71611
71853
  >
71612
71854
  <CapColumn
71613
71855
  key=".0"
@@ -76051,6 +76293,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
76051
76293
  }
76052
76294
  key=".0"
76053
76295
  whatsappAccountName="WhatsppTest"
76296
+ whatsappContentLen={8}
76054
76297
  >
76055
76298
  <TemplatePreview
76056
76299
  channel="WHATSAPP"
@@ -77997,6 +78240,7 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
77997
78240
  }
77998
78241
  }
77999
78242
  whatsappAccountName="WhatsppTest"
78243
+ whatsappContentLen={8}
78000
78244
  >
78001
78245
  <CapRow>
78002
78246
  <Row
@@ -78023,7 +78267,6 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
78023
78267
  >
78024
78268
  <div
78025
78269
  className="shell-v2 align-center"
78026
- id="sms-preview"
78027
78270
  >
78028
78271
  <CapImage
78029
78272
  alt="Preview is being generated"
@@ -78036,19 +78279,19 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
78036
78279
  src="test-file-stub"
78037
78280
  />
78038
78281
  </CapImage>
78039
- <div
78282
+ <CapLabel
78040
78283
  className="whatsapp-brand-name"
78284
+ type="label1"
78041
78285
  >
78042
- WhatsppTest
78043
- </div>
78286
+ <div
78287
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
78288
+ type="label1"
78289
+ >
78290
+ WhatsppTest
78291
+ </div>
78292
+ </CapLabel>
78044
78293
  <div
78045
- className="msgContainer"
78046
- style={
78047
- Object {
78048
- "marginLeft": 28,
78049
- "maxHeight": 292,
78050
- }
78051
- }
78294
+ className="msg-container whatsapp-message-container"
78052
78295
  >
78053
78296
  <div
78054
78297
  className="message-pop align-left"
@@ -78057,48 +78300,75 @@ exports[`Creatives Whatsapp test/> template message 2`] = `
78057
78300
  "background-color": "#efefef",
78058
78301
  "border-radius": "6px",
78059
78302
  "left": "10%",
78060
- "padding": "3.5px 0 0",
78303
+ "padding": "4px 0 0.571rem",
78061
78304
  "width": "88%",
78062
78305
  }
78063
78306
  }
78064
78307
  >
78065
- <p
78066
- style={
78067
- Object {
78068
- "color": "#2a2a2a",
78069
- "margin": "1.5px 6px 1px 7px",
78070
- }
78071
- }
78308
+ <CapLabel
78309
+ className="whatsapp-content"
78310
+ type="label1"
78072
78311
  >
78073
- <CapLabel
78074
- type="label5"
78312
+ <div
78313
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
78314
+ type="label1"
78075
78315
  >
78076
- <div
78077
- className="CapLabel-n7zsf5-0 gHdlVo"
78316
+ <CapLabel
78078
78317
  type="label5"
78079
78318
  >
78080
- Hi {{1}}
78081
- </div>
78082
- </CapLabel>
78083
- <CapLabel
78084
- type="label11"
78085
- >
78086
- <div
78087
- className="CapLabel-n7zsf5-0 jpRuDd"
78319
+ <div
78320
+ className="CapLabel-n7zsf5-0 gHdlVo"
78321
+ type="label5"
78322
+ >
78323
+ Hi {{1}}
78324
+ </div>
78325
+ </CapLabel>
78326
+ <CapLabel
78088
78327
  type="label11"
78089
- />
78090
- </CapLabel>
78091
- </p>
78092
- <div
78093
- style={
78094
- Object {
78095
- "paddingBottom": "0.571rem",
78096
- }
78097
- }
78098
- />
78328
+ >
78329
+ <div
78330
+ className="CapLabel-n7zsf5-0 jpRuDd"
78331
+ type="label11"
78332
+ />
78333
+ </CapLabel>
78334
+ </div>
78335
+ </CapLabel>
78099
78336
  </div>
78100
78337
  </div>
78101
78338
  </div>
78339
+ <CapHeading
78340
+ className="margin-t-16"
78341
+ style={
78342
+ Object {
78343
+ "textAlign": "center",
78344
+ }
78345
+ }
78346
+ type="h3"
78347
+ >
78348
+ <div
78349
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
78350
+ style={
78351
+ Object {
78352
+ "textAlign": "center",
78353
+ }
78354
+ }
78355
+ type="h3"
78356
+ >
78357
+ <FormattedMessage
78358
+ defaultMessage="1 Message ({length} characters)"
78359
+ id="app.components.TemplatePreview.whatsappMessageLength"
78360
+ values={
78361
+ Object {
78362
+ "length": 44,
78363
+ }
78364
+ }
78365
+ >
78366
+ <span>
78367
+ 1 Message (44 characters)
78368
+ </span>
78369
+ </FormattedMessage>
78370
+ </div>
78371
+ </CapHeading>
78102
78372
  </div>
78103
78373
  </div>
78104
78374
  </Col>
@@ -80219,7 +80489,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80219
80489
  Array [
80220
80490
  Object {
80221
80491
  "defaultMessage": "Template name",
80222
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
80492
+ "id": "creatives.containersV2.templateNameLabel",
80223
80493
  },
80224
80494
  ],
80225
80495
  Array [
@@ -80231,7 +80501,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80231
80501
  Array [
80232
80502
  Object {
80233
80503
  "defaultMessage": "Enter template name",
80234
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
80504
+ "id": "creatives.containersV2.templateNamePlaceholder",
80235
80505
  },
80236
80506
  ],
80237
80507
  Array [
@@ -80374,7 +80644,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80374
80644
  Array [
80375
80645
  Object {
80376
80646
  "defaultMessage": "Template name",
80377
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
80647
+ "id": "creatives.containersV2.templateNameLabel",
80378
80648
  },
80379
80649
  ],
80380
80650
  Array [
@@ -80386,7 +80656,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80386
80656
  Array [
80387
80657
  Object {
80388
80658
  "defaultMessage": "Enter template name",
80389
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
80659
+ "id": "creatives.containersV2.templateNamePlaceholder",
80390
80660
  },
80391
80661
  ],
80392
80662
  Array [
@@ -80535,7 +80805,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80535
80805
  Array [
80536
80806
  Object {
80537
80807
  "defaultMessage": "Template name",
80538
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
80808
+ "id": "creatives.containersV2.templateNameLabel",
80539
80809
  },
80540
80810
  ],
80541
80811
  Array [
@@ -80547,7 +80817,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80547
80817
  Array [
80548
80818
  Object {
80549
80819
  "defaultMessage": "Enter template name",
80550
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
80820
+ "id": "creatives.containersV2.templateNamePlaceholder",
80551
80821
  },
80552
80822
  ],
80553
80823
  Array [
@@ -80690,7 +80960,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80690
80960
  Array [
80691
80961
  Object {
80692
80962
  "defaultMessage": "Template name",
80693
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
80963
+ "id": "creatives.containersV2.templateNameLabel",
80694
80964
  },
80695
80965
  ],
80696
80966
  Array [
@@ -80702,7 +80972,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80702
80972
  Array [
80703
80973
  Object {
80704
80974
  "defaultMessage": "Enter template name",
80705
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
80975
+ "id": "creatives.containersV2.templateNamePlaceholder",
80706
80976
  },
80707
80977
  ],
80708
80978
  Array [
@@ -80851,7 +81121,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80851
81121
  Array [
80852
81122
  Object {
80853
81123
  "defaultMessage": "Template name",
80854
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
81124
+ "id": "creatives.containersV2.templateNameLabel",
80855
81125
  },
80856
81126
  ],
80857
81127
  Array [
@@ -80863,7 +81133,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
80863
81133
  Array [
80864
81134
  Object {
80865
81135
  "defaultMessage": "Enter template name",
80866
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
81136
+ "id": "creatives.containersV2.templateNamePlaceholder",
80867
81137
  },
80868
81138
  ],
80869
81139
  Array [
@@ -81491,13 +81761,15 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
81491
81761
  className="ant-spin-container"
81492
81762
  key="container"
81493
81763
  >
81494
- <CapRow>
81764
+ <CapRow
81765
+ className="cap-whatsapp-creatives"
81766
+ >
81495
81767
  <Row
81496
- className="cap-row-v2"
81768
+ className="cap-row-v2 cap-whatsapp-creatives"
81497
81769
  gutter={0}
81498
81770
  >
81499
81771
  <div
81500
- className="ant-row cap-row-v2"
81772
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
81501
81773
  >
81502
81774
  <CapColumn
81503
81775
  key=".0"
@@ -85935,6 +86207,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
85935
86207
  }
85936
86208
  key=".0"
85937
86209
  whatsappAccountName="WhatsppTest"
86210
+ whatsappContentLen={13}
85938
86211
  >
85939
86212
  <TemplatePreview
85940
86213
  channel="WHATSAPP"
@@ -87881,6 +88154,7 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
87881
88154
  }
87882
88155
  }
87883
88156
  whatsappAccountName="WhatsppTest"
88157
+ whatsappContentLen={13}
87884
88158
  >
87885
88159
  <CapRow>
87886
88160
  <Row
@@ -87907,7 +88181,6 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
87907
88181
  >
87908
88182
  <div
87909
88183
  className="shell-v2 align-center"
87910
- id="sms-preview"
87911
88184
  >
87912
88185
  <CapImage
87913
88186
  alt="Preview is being generated"
@@ -87920,19 +88193,19 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
87920
88193
  src="test-file-stub"
87921
88194
  />
87922
88195
  </CapImage>
87923
- <div
88196
+ <CapLabel
87924
88197
  className="whatsapp-brand-name"
88198
+ type="label1"
87925
88199
  >
87926
- WhatsppTest
87927
- </div>
88200
+ <div
88201
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
88202
+ type="label1"
88203
+ >
88204
+ WhatsppTest
88205
+ </div>
88206
+ </CapLabel>
87928
88207
  <div
87929
- className="msgContainer"
87930
- style={
87931
- Object {
87932
- "marginLeft": 28,
87933
- "maxHeight": 292,
87934
- }
87935
- }
88208
+ className="msg-container whatsapp-message-container"
87936
88209
  >
87937
88210
  <div
87938
88211
  className="message-pop align-left"
@@ -87941,48 +88214,75 @@ exports[`Creatives Whatsapp test/> template message 3`] = `
87941
88214
  "background-color": "#efefef",
87942
88215
  "border-radius": "6px",
87943
88216
  "left": "10%",
87944
- "padding": "3.5px 0 0",
88217
+ "padding": "4px 0 0.571rem",
87945
88218
  "width": "88%",
87946
88219
  }
87947
88220
  }
87948
88221
  >
87949
- <p
87950
- style={
87951
- Object {
87952
- "color": "#2a2a2a",
87953
- "margin": "1.5px 6px 1px 7px",
87954
- }
87955
- }
88222
+ <CapLabel
88223
+ className="whatsapp-content"
88224
+ type="label1"
87956
88225
  >
87957
- <CapLabel
87958
- type="label5"
88226
+ <div
88227
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
88228
+ type="label1"
87959
88229
  >
87960
- <div
87961
- className="CapLabel-n7zsf5-0 gHdlVo"
88230
+ <CapLabel
87962
88231
  type="label5"
87963
88232
  >
87964
- Hi {{1}}{{2}}
87965
- </div>
87966
- </CapLabel>
87967
- <CapLabel
87968
- type="label11"
87969
- >
87970
- <div
87971
- className="CapLabel-n7zsf5-0 jpRuDd"
88233
+ <div
88234
+ className="CapLabel-n7zsf5-0 gHdlVo"
88235
+ type="label5"
88236
+ >
88237
+ Hi {{1}}{{2}}
88238
+ </div>
88239
+ </CapLabel>
88240
+ <CapLabel
87972
88241
  type="label11"
87973
- />
87974
- </CapLabel>
87975
- </p>
87976
- <div
87977
- style={
87978
- Object {
87979
- "paddingBottom": "0.571rem",
87980
- }
87981
- }
87982
- />
88242
+ >
88243
+ <div
88244
+ className="CapLabel-n7zsf5-0 jpRuDd"
88245
+ type="label11"
88246
+ />
88247
+ </CapLabel>
88248
+ </div>
88249
+ </CapLabel>
87983
88250
  </div>
87984
88251
  </div>
87985
88252
  </div>
88253
+ <CapHeading
88254
+ className="margin-t-16"
88255
+ style={
88256
+ Object {
88257
+ "textAlign": "center",
88258
+ }
88259
+ }
88260
+ type="h3"
88261
+ >
88262
+ <div
88263
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
88264
+ style={
88265
+ Object {
88266
+ "textAlign": "center",
88267
+ }
88268
+ }
88269
+ type="h3"
88270
+ >
88271
+ <FormattedMessage
88272
+ defaultMessage="1 Message ({length} characters)"
88273
+ id="app.components.TemplatePreview.whatsappMessageLength"
88274
+ values={
88275
+ Object {
88276
+ "length": 49,
88277
+ }
88278
+ }
88279
+ >
88280
+ <span>
88281
+ 1 Message (49 characters)
88282
+ </span>
88283
+ </FormattedMessage>
88284
+ </div>
88285
+ </CapHeading>
87986
88286
  </div>
87987
88287
  </div>
87988
88288
  </Col>
@@ -90103,7 +90403,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90103
90403
  Array [
90104
90404
  Object {
90105
90405
  "defaultMessage": "Template name",
90106
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
90406
+ "id": "creatives.containersV2.templateNameLabel",
90107
90407
  },
90108
90408
  ],
90109
90409
  Array [
@@ -90115,7 +90415,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90115
90415
  Array [
90116
90416
  Object {
90117
90417
  "defaultMessage": "Enter template name",
90118
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
90418
+ "id": "creatives.containersV2.templateNamePlaceholder",
90119
90419
  },
90120
90420
  ],
90121
90421
  Array [
@@ -90258,7 +90558,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90258
90558
  Array [
90259
90559
  Object {
90260
90560
  "defaultMessage": "Template name",
90261
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
90561
+ "id": "creatives.containersV2.templateNameLabel",
90262
90562
  },
90263
90563
  ],
90264
90564
  Array [
@@ -90270,7 +90570,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90270
90570
  Array [
90271
90571
  Object {
90272
90572
  "defaultMessage": "Enter template name",
90273
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
90573
+ "id": "creatives.containersV2.templateNamePlaceholder",
90274
90574
  },
90275
90575
  ],
90276
90576
  Array [
@@ -90419,7 +90719,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90419
90719
  Array [
90420
90720
  Object {
90421
90721
  "defaultMessage": "Template name",
90422
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
90722
+ "id": "creatives.containersV2.templateNameLabel",
90423
90723
  },
90424
90724
  ],
90425
90725
  Array [
@@ -90431,7 +90731,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90431
90731
  Array [
90432
90732
  Object {
90433
90733
  "defaultMessage": "Enter template name",
90434
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
90734
+ "id": "creatives.containersV2.templateNamePlaceholder",
90435
90735
  },
90436
90736
  ],
90437
90737
  Array [
@@ -90574,7 +90874,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90574
90874
  Array [
90575
90875
  Object {
90576
90876
  "defaultMessage": "Template name",
90577
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
90877
+ "id": "creatives.containersV2.templateNameLabel",
90578
90878
  },
90579
90879
  ],
90580
90880
  Array [
@@ -90586,7 +90886,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90586
90886
  Array [
90587
90887
  Object {
90588
90888
  "defaultMessage": "Enter template name",
90589
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
90889
+ "id": "creatives.containersV2.templateNamePlaceholder",
90590
90890
  },
90591
90891
  ],
90592
90892
  Array [
@@ -90735,7 +91035,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90735
91035
  Array [
90736
91036
  Object {
90737
91037
  "defaultMessage": "Template name",
90738
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
91038
+ "id": "creatives.containersV2.templateNameLabel",
90739
91039
  },
90740
91040
  ],
90741
91041
  Array [
@@ -90747,7 +91047,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90747
91047
  Array [
90748
91048
  Object {
90749
91049
  "defaultMessage": "Enter template name",
90750
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
91050
+ "id": "creatives.containersV2.templateNamePlaceholder",
90751
91051
  },
90752
91052
  ],
90753
91053
  Array [
@@ -90896,7 +91196,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90896
91196
  Array [
90897
91197
  Object {
90898
91198
  "defaultMessage": "Template name",
90899
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
91199
+ "id": "creatives.containersV2.templateNameLabel",
90900
91200
  },
90901
91201
  ],
90902
91202
  Array [
@@ -90908,7 +91208,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
90908
91208
  Array [
90909
91209
  Object {
90910
91210
  "defaultMessage": "Enter template name",
90911
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
91211
+ "id": "creatives.containersV2.templateNamePlaceholder",
90912
91212
  },
90913
91213
  ],
90914
91214
  Array [
@@ -91636,13 +91936,15 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
91636
91936
  className="ant-spin-container"
91637
91937
  key="container"
91638
91938
  >
91639
- <CapRow>
91939
+ <CapRow
91940
+ className="cap-whatsapp-creatives"
91941
+ >
91640
91942
  <Row
91641
- className="cap-row-v2"
91943
+ className="cap-row-v2 cap-whatsapp-creatives"
91642
91944
  gutter={0}
91643
91945
  >
91644
91946
  <div
91645
- className="ant-row cap-row-v2"
91947
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
91646
91948
  >
91647
91949
  <CapColumn
91648
91950
  key=".0"
@@ -96080,6 +96382,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
96080
96382
  }
96081
96383
  key=".0"
96082
96384
  whatsappAccountName="WhatsppTest"
96385
+ whatsappContentLen={10}
96083
96386
  >
96084
96387
  <TemplatePreview
96085
96388
  channel="WHATSAPP"
@@ -98026,6 +98329,7 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
98026
98329
  }
98027
98330
  }
98028
98331
  whatsappAccountName="WhatsppTest"
98332
+ whatsappContentLen={10}
98029
98333
  >
98030
98334
  <CapRow>
98031
98335
  <Row
@@ -98052,7 +98356,6 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
98052
98356
  >
98053
98357
  <div
98054
98358
  className="shell-v2 align-center"
98055
- id="sms-preview"
98056
98359
  >
98057
98360
  <CapImage
98058
98361
  alt="Preview is being generated"
@@ -98065,19 +98368,19 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
98065
98368
  src="test-file-stub"
98066
98369
  />
98067
98370
  </CapImage>
98068
- <div
98371
+ <CapLabel
98069
98372
  className="whatsapp-brand-name"
98373
+ type="label1"
98070
98374
  >
98071
- WhatsppTest
98072
- </div>
98375
+ <div
98376
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
98377
+ type="label1"
98378
+ >
98379
+ WhatsppTest
98380
+ </div>
98381
+ </CapLabel>
98073
98382
  <div
98074
- className="msgContainer"
98075
- style={
98076
- Object {
98077
- "marginLeft": 28,
98078
- "maxHeight": 292,
98079
- }
98080
- }
98383
+ className="msg-container whatsapp-message-container"
98081
98384
  >
98082
98385
  <div
98083
98386
  className="message-pop align-left"
@@ -98086,48 +98389,75 @@ exports[`Creatives Whatsapp test/> template message 4`] = `
98086
98389
  "background-color": "#efefef",
98087
98390
  "border-radius": "6px",
98088
98391
  "left": "10%",
98089
- "padding": "3.5px 0 0",
98392
+ "padding": "4px 0 0.571rem",
98090
98393
  "width": "88%",
98091
98394
  }
98092
98395
  }
98093
98396
  >
98094
- <p
98095
- style={
98096
- Object {
98097
- "color": "#2a2a2a",
98098
- "margin": "1.5px 6px 1px 7px",
98099
- }
98100
- }
98397
+ <CapLabel
98398
+ className="whatsapp-content"
98399
+ type="label1"
98101
98400
  >
98102
- <CapLabel
98103
- type="label5"
98401
+ <div
98402
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
98403
+ type="label1"
98104
98404
  >
98105
- <div
98106
- className="CapLabel-n7zsf5-0 gHdlVo"
98405
+ <CapLabel
98107
98406
  type="label5"
98108
98407
  >
98109
- Hi {{var}}
98110
- </div>
98111
- </CapLabel>
98112
- <CapLabel
98113
- type="label11"
98114
- >
98115
- <div
98116
- className="CapLabel-n7zsf5-0 jpRuDd"
98408
+ <div
98409
+ className="CapLabel-n7zsf5-0 gHdlVo"
98410
+ type="label5"
98411
+ >
98412
+ Hi {{var}}
98413
+ </div>
98414
+ </CapLabel>
98415
+ <CapLabel
98117
98416
  type="label11"
98118
- />
98119
- </CapLabel>
98120
- </p>
98121
- <div
98122
- style={
98123
- Object {
98124
- "paddingBottom": "0.571rem",
98125
- }
98126
- }
98127
- />
98417
+ >
98418
+ <div
98419
+ className="CapLabel-n7zsf5-0 jpRuDd"
98420
+ type="label11"
98421
+ />
98422
+ </CapLabel>
98423
+ </div>
98424
+ </CapLabel>
98128
98425
  </div>
98129
98426
  </div>
98130
98427
  </div>
98428
+ <CapHeading
98429
+ className="margin-t-16"
98430
+ style={
98431
+ Object {
98432
+ "textAlign": "center",
98433
+ }
98434
+ }
98435
+ type="h3"
98436
+ >
98437
+ <div
98438
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
98439
+ style={
98440
+ Object {
98441
+ "textAlign": "center",
98442
+ }
98443
+ }
98444
+ type="h3"
98445
+ >
98446
+ <FormattedMessage
98447
+ defaultMessage="1 Message ({length} characters)"
98448
+ id="app.components.TemplatePreview.whatsappMessageLength"
98449
+ values={
98450
+ Object {
98451
+ "length": 46,
98452
+ }
98453
+ }
98454
+ >
98455
+ <span>
98456
+ 1 Message (46 characters)
98457
+ </span>
98458
+ </FormattedMessage>
98459
+ </div>
98460
+ </CapHeading>
98131
98461
  </div>
98132
98462
  </div>
98133
98463
  </Col>
@@ -100248,7 +100578,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100248
100578
  Array [
100249
100579
  Object {
100250
100580
  "defaultMessage": "Template name",
100251
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
100581
+ "id": "creatives.containersV2.templateNameLabel",
100252
100582
  },
100253
100583
  ],
100254
100584
  Array [
@@ -100260,7 +100590,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100260
100590
  Array [
100261
100591
  Object {
100262
100592
  "defaultMessage": "Enter template name",
100263
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
100593
+ "id": "creatives.containersV2.templateNamePlaceholder",
100264
100594
  },
100265
100595
  ],
100266
100596
  Array [
@@ -100403,7 +100733,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100403
100733
  Array [
100404
100734
  Object {
100405
100735
  "defaultMessage": "Template name",
100406
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
100736
+ "id": "creatives.containersV2.templateNameLabel",
100407
100737
  },
100408
100738
  ],
100409
100739
  Array [
@@ -100415,7 +100745,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100415
100745
  Array [
100416
100746
  Object {
100417
100747
  "defaultMessage": "Enter template name",
100418
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
100748
+ "id": "creatives.containersV2.templateNamePlaceholder",
100419
100749
  },
100420
100750
  ],
100421
100751
  Array [
@@ -100564,7 +100894,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100564
100894
  Array [
100565
100895
  Object {
100566
100896
  "defaultMessage": "Template name",
100567
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
100897
+ "id": "creatives.containersV2.templateNameLabel",
100568
100898
  },
100569
100899
  ],
100570
100900
  Array [
@@ -100576,7 +100906,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100576
100906
  Array [
100577
100907
  Object {
100578
100908
  "defaultMessage": "Enter template name",
100579
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
100909
+ "id": "creatives.containersV2.templateNamePlaceholder",
100580
100910
  },
100581
100911
  ],
100582
100912
  Array [
@@ -100719,7 +101049,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100719
101049
  Array [
100720
101050
  Object {
100721
101051
  "defaultMessage": "Template name",
100722
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
101052
+ "id": "creatives.containersV2.templateNameLabel",
100723
101053
  },
100724
101054
  ],
100725
101055
  Array [
@@ -100731,7 +101061,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100731
101061
  Array [
100732
101062
  Object {
100733
101063
  "defaultMessage": "Enter template name",
100734
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
101064
+ "id": "creatives.containersV2.templateNamePlaceholder",
100735
101065
  },
100736
101066
  ],
100737
101067
  Array [
@@ -100880,7 +101210,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100880
101210
  Array [
100881
101211
  Object {
100882
101212
  "defaultMessage": "Template name",
100883
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
101213
+ "id": "creatives.containersV2.templateNameLabel",
100884
101214
  },
100885
101215
  ],
100886
101216
  Array [
@@ -100892,7 +101222,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
100892
101222
  Array [
100893
101223
  Object {
100894
101224
  "defaultMessage": "Enter template name",
100895
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
101225
+ "id": "creatives.containersV2.templateNamePlaceholder",
100896
101226
  },
100897
101227
  ],
100898
101228
  Array [
@@ -101041,7 +101371,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
101041
101371
  Array [
101042
101372
  Object {
101043
101373
  "defaultMessage": "Template name",
101044
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
101374
+ "id": "creatives.containersV2.templateNameLabel",
101045
101375
  },
101046
101376
  ],
101047
101377
  Array [
@@ -101053,7 +101383,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
101053
101383
  Array [
101054
101384
  Object {
101055
101385
  "defaultMessage": "Enter template name",
101056
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
101386
+ "id": "creatives.containersV2.templateNamePlaceholder",
101057
101387
  },
101058
101388
  ],
101059
101389
  Array [
@@ -101202,7 +101532,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
101202
101532
  Array [
101203
101533
  Object {
101204
101534
  "defaultMessage": "Template name",
101205
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
101535
+ "id": "creatives.containersV2.templateNameLabel",
101206
101536
  },
101207
101537
  ],
101208
101538
  Array [
@@ -101214,7 +101544,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
101214
101544
  Array [
101215
101545
  Object {
101216
101546
  "defaultMessage": "Enter template name",
101217
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
101547
+ "id": "creatives.containersV2.templateNamePlaceholder",
101218
101548
  },
101219
101549
  ],
101220
101550
  Array [
@@ -102042,13 +102372,15 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
102042
102372
  className="ant-spin-container"
102043
102373
  key="container"
102044
102374
  >
102045
- <CapRow>
102375
+ <CapRow
102376
+ className="cap-whatsapp-creatives"
102377
+ >
102046
102378
  <Row
102047
- className="cap-row-v2"
102379
+ className="cap-row-v2 cap-whatsapp-creatives"
102048
102380
  gutter={0}
102049
102381
  >
102050
102382
  <div
102051
- className="ant-row cap-row-v2"
102383
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
102052
102384
  >
102053
102385
  <CapColumn
102054
102386
  key=".0"
@@ -106486,6 +106818,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
106486
106818
  }
106487
106819
  key=".0"
106488
106820
  whatsappAccountName="WhatsppTest"
106821
+ whatsappContentLen={21}
106489
106822
  >
106490
106823
  <TemplatePreview
106491
106824
  channel="WHATSAPP"
@@ -108432,6 +108765,7 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
108432
108765
  }
108433
108766
  }
108434
108767
  whatsappAccountName="WhatsppTest"
108768
+ whatsappContentLen={21}
108435
108769
  >
108436
108770
  <CapRow>
108437
108771
  <Row
@@ -108458,7 +108792,6 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
108458
108792
  >
108459
108793
  <div
108460
108794
  className="shell-v2 align-center"
108461
- id="sms-preview"
108462
108795
  >
108463
108796
  <CapImage
108464
108797
  alt="Preview is being generated"
@@ -108471,19 +108804,19 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
108471
108804
  src="test-file-stub"
108472
108805
  />
108473
108806
  </CapImage>
108474
- <div
108807
+ <CapLabel
108475
108808
  className="whatsapp-brand-name"
108809
+ type="label1"
108476
108810
  >
108477
- WhatsppTest
108478
- </div>
108811
+ <div
108812
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
108813
+ type="label1"
108814
+ >
108815
+ WhatsppTest
108816
+ </div>
108817
+ </CapLabel>
108479
108818
  <div
108480
- className="msgContainer"
108481
- style={
108482
- Object {
108483
- "marginLeft": 28,
108484
- "maxHeight": 292,
108485
- }
108486
- }
108819
+ className="msg-container whatsapp-message-container"
108487
108820
  >
108488
108821
  <div
108489
108822
  className="message-pop align-left"
@@ -108492,48 +108825,75 @@ exports[`Creatives Whatsapp test/> template message 5`] = `
108492
108825
  "background-color": "#efefef",
108493
108826
  "border-radius": "6px",
108494
108827
  "left": "10%",
108495
- "padding": "3.5px 0 0",
108828
+ "padding": "4px 0 0.571rem",
108496
108829
  "width": "88%",
108497
108830
  }
108498
108831
  }
108499
108832
  >
108500
- <p
108501
- style={
108502
- Object {
108503
- "color": "#2a2a2a",
108504
- "margin": "1.5px 6px 1px 7px",
108505
- }
108506
- }
108833
+ <CapLabel
108834
+ className="whatsapp-content"
108835
+ type="label1"
108507
108836
  >
108508
- <CapLabel
108509
- type="label5"
108837
+ <div
108838
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
108839
+ type="label1"
108510
108840
  >
108511
- <div
108512
- className="CapLabel-n7zsf5-0 gHdlVo"
108841
+ <CapLabel
108513
108842
  type="label5"
108514
108843
  >
108515
- Hi {{1}}, offer {{3}}
108516
- </div>
108517
- </CapLabel>
108518
- <CapLabel
108519
- type="label11"
108520
- >
108521
- <div
108522
- className="CapLabel-n7zsf5-0 jpRuDd"
108844
+ <div
108845
+ className="CapLabel-n7zsf5-0 gHdlVo"
108846
+ type="label5"
108847
+ >
108848
+ Hi {{1}}, offer {{3}}
108849
+ </div>
108850
+ </CapLabel>
108851
+ <CapLabel
108523
108852
  type="label11"
108524
- />
108525
- </CapLabel>
108526
- </p>
108527
- <div
108528
- style={
108529
- Object {
108530
- "paddingBottom": "0.571rem",
108531
- }
108532
- }
108533
- />
108853
+ >
108854
+ <div
108855
+ className="CapLabel-n7zsf5-0 jpRuDd"
108856
+ type="label11"
108857
+ />
108858
+ </CapLabel>
108859
+ </div>
108860
+ </CapLabel>
108534
108861
  </div>
108535
108862
  </div>
108536
108863
  </div>
108864
+ <CapHeading
108865
+ className="margin-t-16"
108866
+ style={
108867
+ Object {
108868
+ "textAlign": "center",
108869
+ }
108870
+ }
108871
+ type="h3"
108872
+ >
108873
+ <div
108874
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
108875
+ style={
108876
+ Object {
108877
+ "textAlign": "center",
108878
+ }
108879
+ }
108880
+ type="h3"
108881
+ >
108882
+ <FormattedMessage
108883
+ defaultMessage="1 Message ({length} characters)"
108884
+ id="app.components.TemplatePreview.whatsappMessageLength"
108885
+ values={
108886
+ Object {
108887
+ "length": 57,
108888
+ }
108889
+ }
108890
+ >
108891
+ <span>
108892
+ 1 Message (57 characters)
108893
+ </span>
108894
+ </FormattedMessage>
108895
+ </div>
108896
+ </CapHeading>
108537
108897
  </div>
108538
108898
  </div>
108539
108899
  </Col>
@@ -110654,7 +111014,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110654
111014
  Array [
110655
111015
  Object {
110656
111016
  "defaultMessage": "Template name",
110657
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111017
+ "id": "creatives.containersV2.templateNameLabel",
110658
111018
  },
110659
111019
  ],
110660
111020
  Array [
@@ -110666,7 +111026,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110666
111026
  Array [
110667
111027
  Object {
110668
111028
  "defaultMessage": "Enter template name",
110669
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111029
+ "id": "creatives.containersV2.templateNamePlaceholder",
110670
111030
  },
110671
111031
  ],
110672
111032
  Array [
@@ -110809,7 +111169,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110809
111169
  Array [
110810
111170
  Object {
110811
111171
  "defaultMessage": "Template name",
110812
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111172
+ "id": "creatives.containersV2.templateNameLabel",
110813
111173
  },
110814
111174
  ],
110815
111175
  Array [
@@ -110821,7 +111181,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110821
111181
  Array [
110822
111182
  Object {
110823
111183
  "defaultMessage": "Enter template name",
110824
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111184
+ "id": "creatives.containersV2.templateNamePlaceholder",
110825
111185
  },
110826
111186
  ],
110827
111187
  Array [
@@ -110970,7 +111330,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110970
111330
  Array [
110971
111331
  Object {
110972
111332
  "defaultMessage": "Template name",
110973
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111333
+ "id": "creatives.containersV2.templateNameLabel",
110974
111334
  },
110975
111335
  ],
110976
111336
  Array [
@@ -110982,7 +111342,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
110982
111342
  Array [
110983
111343
  Object {
110984
111344
  "defaultMessage": "Enter template name",
110985
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111345
+ "id": "creatives.containersV2.templateNamePlaceholder",
110986
111346
  },
110987
111347
  ],
110988
111348
  Array [
@@ -111125,7 +111485,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111125
111485
  Array [
111126
111486
  Object {
111127
111487
  "defaultMessage": "Template name",
111128
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111488
+ "id": "creatives.containersV2.templateNameLabel",
111129
111489
  },
111130
111490
  ],
111131
111491
  Array [
@@ -111137,7 +111497,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111137
111497
  Array [
111138
111498
  Object {
111139
111499
  "defaultMessage": "Enter template name",
111140
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111500
+ "id": "creatives.containersV2.templateNamePlaceholder",
111141
111501
  },
111142
111502
  ],
111143
111503
  Array [
@@ -111286,7 +111646,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111286
111646
  Array [
111287
111647
  Object {
111288
111648
  "defaultMessage": "Template name",
111289
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111649
+ "id": "creatives.containersV2.templateNameLabel",
111290
111650
  },
111291
111651
  ],
111292
111652
  Array [
@@ -111298,7 +111658,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111298
111658
  Array [
111299
111659
  Object {
111300
111660
  "defaultMessage": "Enter template name",
111301
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111661
+ "id": "creatives.containersV2.templateNamePlaceholder",
111302
111662
  },
111303
111663
  ],
111304
111664
  Array [
@@ -111447,7 +111807,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111447
111807
  Array [
111448
111808
  Object {
111449
111809
  "defaultMessage": "Template name",
111450
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111810
+ "id": "creatives.containersV2.templateNameLabel",
111451
111811
  },
111452
111812
  ],
111453
111813
  Array [
@@ -111459,7 +111819,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111459
111819
  Array [
111460
111820
  Object {
111461
111821
  "defaultMessage": "Enter template name",
111462
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111822
+ "id": "creatives.containersV2.templateNamePlaceholder",
111463
111823
  },
111464
111824
  ],
111465
111825
  Array [
@@ -111608,7 +111968,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111608
111968
  Array [
111609
111969
  Object {
111610
111970
  "defaultMessage": "Template name",
111611
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
111971
+ "id": "creatives.containersV2.templateNameLabel",
111612
111972
  },
111613
111973
  ],
111614
111974
  Array [
@@ -111620,7 +111980,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111620
111980
  Array [
111621
111981
  Object {
111622
111982
  "defaultMessage": "Enter template name",
111623
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
111983
+ "id": "creatives.containersV2.templateNamePlaceholder",
111624
111984
  },
111625
111985
  ],
111626
111986
  Array [
@@ -111769,7 +112129,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111769
112129
  Array [
111770
112130
  Object {
111771
112131
  "defaultMessage": "Template name",
111772
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
112132
+ "id": "creatives.containersV2.templateNameLabel",
111773
112133
  },
111774
112134
  ],
111775
112135
  Array [
@@ -111781,7 +112141,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
111781
112141
  Array [
111782
112142
  Object {
111783
112143
  "defaultMessage": "Enter template name",
111784
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
112144
+ "id": "creatives.containersV2.templateNamePlaceholder",
111785
112145
  },
111786
112146
  ],
111787
112147
  Array [
@@ -112709,13 +113069,15 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
112709
113069
  className="ant-spin-container"
112710
113070
  key="container"
112711
113071
  >
112712
- <CapRow>
113072
+ <CapRow
113073
+ className="cap-whatsapp-creatives"
113074
+ >
112713
113075
  <Row
112714
- className="cap-row-v2"
113076
+ className="cap-row-v2 cap-whatsapp-creatives"
112715
113077
  gutter={0}
112716
113078
  >
112717
113079
  <div
112718
- className="ant-row cap-row-v2"
113080
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
112719
113081
  >
112720
113082
  <CapColumn
112721
113083
  key=".0"
@@ -117153,6 +117515,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
117153
117515
  }
117154
117516
  key=".0"
117155
117517
  whatsappAccountName="WhatsppTest"
117518
+ whatsappContentLen={13}
117156
117519
  >
117157
117520
  <TemplatePreview
117158
117521
  channel="WHATSAPP"
@@ -119099,6 +119462,7 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
119099
119462
  }
119100
119463
  }
119101
119464
  whatsappAccountName="WhatsppTest"
119465
+ whatsappContentLen={13}
119102
119466
  >
119103
119467
  <CapRow>
119104
119468
  <Row
@@ -119125,7 +119489,6 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
119125
119489
  >
119126
119490
  <div
119127
119491
  className="shell-v2 align-center"
119128
- id="sms-preview"
119129
119492
  >
119130
119493
  <CapImage
119131
119494
  alt="Preview is being generated"
@@ -119138,19 +119501,19 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
119138
119501
  src="test-file-stub"
119139
119502
  />
119140
119503
  </CapImage>
119141
- <div
119504
+ <CapLabel
119142
119505
  className="whatsapp-brand-name"
119506
+ type="label1"
119143
119507
  >
119144
- WhatsppTest
119145
- </div>
119508
+ <div
119509
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
119510
+ type="label1"
119511
+ >
119512
+ WhatsppTest
119513
+ </div>
119514
+ </CapLabel>
119146
119515
  <div
119147
- className="msgContainer"
119148
- style={
119149
- Object {
119150
- "marginLeft": 28,
119151
- "maxHeight": 292,
119152
- }
119153
- }
119516
+ className="msg-container whatsapp-message-container"
119154
119517
  >
119155
119518
  <div
119156
119519
  className="message-pop align-left"
@@ -119159,48 +119522,75 @@ exports[`Creatives Whatsapp test/> template message 6`] = `
119159
119522
  "background-color": "#efefef",
119160
119523
  "border-radius": "6px",
119161
119524
  "left": "10%",
119162
- "padding": "3.5px 0 0",
119525
+ "padding": "4px 0 0.571rem",
119163
119526
  "width": "88%",
119164
119527
  }
119165
119528
  }
119166
119529
  >
119167
- <p
119168
- style={
119169
- Object {
119170
- "color": "#2a2a2a",
119171
- "margin": "1.5px 6px 1px 7px",
119172
- }
119173
- }
119530
+ <CapLabel
119531
+ className="whatsapp-content"
119532
+ type="label1"
119174
119533
  >
119175
- <CapLabel
119176
- type="label5"
119534
+ <div
119535
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
119536
+ type="label1"
119177
119537
  >
119178
- <div
119179
- className="CapLabel-n7zsf5-0 gHdlVo"
119538
+ <CapLabel
119180
119539
  type="label5"
119181
119540
  >
119182
- Hi {{1}}{{1}}
119183
- </div>
119184
- </CapLabel>
119185
- <CapLabel
119186
- type="label11"
119187
- >
119188
- <div
119189
- className="CapLabel-n7zsf5-0 jpRuDd"
119541
+ <div
119542
+ className="CapLabel-n7zsf5-0 gHdlVo"
119543
+ type="label5"
119544
+ >
119545
+ Hi {{1}}{{1}}
119546
+ </div>
119547
+ </CapLabel>
119548
+ <CapLabel
119190
119549
  type="label11"
119191
- />
119192
- </CapLabel>
119193
- </p>
119194
- <div
119195
- style={
119196
- Object {
119197
- "paddingBottom": "0.571rem",
119198
- }
119199
- }
119200
- />
119550
+ >
119551
+ <div
119552
+ className="CapLabel-n7zsf5-0 jpRuDd"
119553
+ type="label11"
119554
+ />
119555
+ </CapLabel>
119556
+ </div>
119557
+ </CapLabel>
119201
119558
  </div>
119202
119559
  </div>
119203
119560
  </div>
119561
+ <CapHeading
119562
+ className="margin-t-16"
119563
+ style={
119564
+ Object {
119565
+ "textAlign": "center",
119566
+ }
119567
+ }
119568
+ type="h3"
119569
+ >
119570
+ <div
119571
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
119572
+ style={
119573
+ Object {
119574
+ "textAlign": "center",
119575
+ }
119576
+ }
119577
+ type="h3"
119578
+ >
119579
+ <FormattedMessage
119580
+ defaultMessage="1 Message ({length} characters)"
119581
+ id="app.components.TemplatePreview.whatsappMessageLength"
119582
+ values={
119583
+ Object {
119584
+ "length": 49,
119585
+ }
119586
+ }
119587
+ >
119588
+ <span>
119589
+ 1 Message (49 characters)
119590
+ </span>
119591
+ </FormattedMessage>
119592
+ </div>
119593
+ </CapHeading>
119204
119594
  </div>
119205
119595
  </div>
119206
119596
  </Col>
@@ -121321,7 +121711,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121321
121711
  Array [
121322
121712
  Object {
121323
121713
  "defaultMessage": "Template name",
121324
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
121714
+ "id": "creatives.containersV2.templateNameLabel",
121325
121715
  },
121326
121716
  ],
121327
121717
  Array [
@@ -121333,7 +121723,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121333
121723
  Array [
121334
121724
  Object {
121335
121725
  "defaultMessage": "Enter template name",
121336
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
121726
+ "id": "creatives.containersV2.templateNamePlaceholder",
121337
121727
  },
121338
121728
  ],
121339
121729
  Array [
@@ -121476,7 +121866,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121476
121866
  Array [
121477
121867
  Object {
121478
121868
  "defaultMessage": "Template name",
121479
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
121869
+ "id": "creatives.containersV2.templateNameLabel",
121480
121870
  },
121481
121871
  ],
121482
121872
  Array [
@@ -121488,7 +121878,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121488
121878
  Array [
121489
121879
  Object {
121490
121880
  "defaultMessage": "Enter template name",
121491
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
121881
+ "id": "creatives.containersV2.templateNamePlaceholder",
121492
121882
  },
121493
121883
  ],
121494
121884
  Array [
@@ -121631,7 +122021,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121631
122021
  Array [
121632
122022
  Object {
121633
122023
  "defaultMessage": "Template name",
121634
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
122024
+ "id": "creatives.containersV2.templateNameLabel",
121635
122025
  },
121636
122026
  ],
121637
122027
  Array [
@@ -121643,7 +122033,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
121643
122033
  Array [
121644
122034
  Object {
121645
122035
  "defaultMessage": "Enter template name",
121646
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
122036
+ "id": "creatives.containersV2.templateNamePlaceholder",
121647
122037
  },
121648
122038
  ],
121649
122039
  Array [
@@ -122071,13 +122461,15 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
122071
122461
  className="ant-spin-container"
122072
122462
  key="container"
122073
122463
  >
122074
- <CapRow>
122464
+ <CapRow
122465
+ className="cap-whatsapp-creatives"
122466
+ >
122075
122467
  <Row
122076
- className="cap-row-v2"
122468
+ className="cap-row-v2 cap-whatsapp-creatives"
122077
122469
  gutter={0}
122078
122470
  >
122079
122471
  <div
122080
- className="ant-row cap-row-v2"
122472
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
122081
122473
  >
122082
122474
  <CapColumn
122083
122475
  key=".0"
@@ -126521,6 +126913,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
126521
126913
  }
126522
126914
  key=".0"
126523
126915
  whatsappAccountName="WhatsppTest"
126916
+ whatsappContentLen={0}
126524
126917
  >
126525
126918
  <TemplatePreview
126526
126919
  channel="WHATSAPP"
@@ -128467,6 +128860,7 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
128467
128860
  }
128468
128861
  }
128469
128862
  whatsappAccountName="WhatsppTest"
128863
+ whatsappContentLen={0}
128470
128864
  >
128471
128865
  <CapRow>
128472
128866
  <Row
@@ -128493,7 +128887,6 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
128493
128887
  >
128494
128888
  <div
128495
128889
  className="shell-v2 align-center"
128496
- id="sms-preview"
128497
128890
  >
128498
128891
  <CapImage
128499
128892
  alt="Preview is being generated"
@@ -128506,19 +128899,19 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
128506
128899
  src="test-file-stub"
128507
128900
  />
128508
128901
  </CapImage>
128509
- <div
128902
+ <CapLabel
128510
128903
  className="whatsapp-brand-name"
128904
+ type="label1"
128511
128905
  >
128512
- WhatsppTest
128513
- </div>
128906
+ <div
128907
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
128908
+ type="label1"
128909
+ >
128910
+ WhatsppTest
128911
+ </div>
128912
+ </CapLabel>
128514
128913
  <div
128515
- className="msgContainer"
128516
- style={
128517
- Object {
128518
- "marginLeft": 28,
128519
- "maxHeight": 292,
128520
- }
128521
- }
128914
+ className="msg-container whatsapp-message-container"
128522
128915
  >
128523
128916
  <div
128524
128917
  className="message-pop align-left"
@@ -128527,46 +128920,73 @@ exports[`Creatives Whatsapp test/> template name change 1`] = `
128527
128920
  "background-color": "#efefef",
128528
128921
  "border-radius": "6px",
128529
128922
  "left": "10%",
128530
- "padding": "3.5px 0 0",
128923
+ "padding": "4px 0 0.571rem",
128531
128924
  "width": "88%",
128532
128925
  }
128533
128926
  }
128534
128927
  >
128535
- <p
128536
- style={
128537
- Object {
128538
- "color": "#2a2a2a",
128539
- "margin": "1.5px 6px 1px 7px",
128540
- }
128541
- }
128928
+ <CapLabel
128929
+ className="whatsapp-content"
128930
+ type="label1"
128542
128931
  >
128543
- <CapLabel
128544
- type="label5"
128932
+ <div
128933
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
128934
+ type="label1"
128545
128935
  >
128546
- <div
128547
- className="CapLabel-n7zsf5-0 gHdlVo"
128936
+ <CapLabel
128548
128937
  type="label5"
128549
- />
128550
- </CapLabel>
128551
- <CapLabel
128552
- type="label11"
128553
- >
128554
- <div
128555
- className="CapLabel-n7zsf5-0 jpRuDd"
128938
+ >
128939
+ <div
128940
+ className="CapLabel-n7zsf5-0 gHdlVo"
128941
+ type="label5"
128942
+ />
128943
+ </CapLabel>
128944
+ <CapLabel
128556
128945
  type="label11"
128557
- />
128558
- </CapLabel>
128559
- </p>
128560
- <div
128561
- style={
128562
- Object {
128563
- "paddingBottom": "0.571rem",
128564
- }
128565
- }
128566
- />
128946
+ >
128947
+ <div
128948
+ className="CapLabel-n7zsf5-0 jpRuDd"
128949
+ type="label11"
128950
+ />
128951
+ </CapLabel>
128952
+ </div>
128953
+ </CapLabel>
128567
128954
  </div>
128568
128955
  </div>
128569
128956
  </div>
128957
+ <CapHeading
128958
+ className="margin-t-16"
128959
+ style={
128960
+ Object {
128961
+ "textAlign": "center",
128962
+ }
128963
+ }
128964
+ type="h3"
128965
+ >
128966
+ <div
128967
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
128968
+ style={
128969
+ Object {
128970
+ "textAlign": "center",
128971
+ }
128972
+ }
128973
+ type="h3"
128974
+ >
128975
+ <FormattedMessage
128976
+ defaultMessage="1 Message ({length} characters)"
128977
+ id="app.components.TemplatePreview.whatsappMessageLength"
128978
+ values={
128979
+ Object {
128980
+ "length": 36,
128981
+ }
128982
+ }
128983
+ >
128984
+ <span>
128985
+ 1 Message (36 characters)
128986
+ </span>
128987
+ </FormattedMessage>
128988
+ </div>
128989
+ </CapHeading>
128570
128990
  </div>
128571
128991
  </div>
128572
128992
  </Col>
@@ -130687,7 +131107,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
130687
131107
  Array [
130688
131108
  Object {
130689
131109
  "defaultMessage": "Template name",
130690
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
131110
+ "id": "creatives.containersV2.templateNameLabel",
130691
131111
  },
130692
131112
  ],
130693
131113
  Array [
@@ -130699,7 +131119,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
130699
131119
  Array [
130700
131120
  Object {
130701
131121
  "defaultMessage": "Enter template name",
130702
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
131122
+ "id": "creatives.containersV2.templateNamePlaceholder",
130703
131123
  },
130704
131124
  ],
130705
131125
  Array [
@@ -130842,7 +131262,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
130842
131262
  Array [
130843
131263
  Object {
130844
131264
  "defaultMessage": "Template name",
130845
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
131265
+ "id": "creatives.containersV2.templateNameLabel",
130846
131266
  },
130847
131267
  ],
130848
131268
  Array [
@@ -130854,7 +131274,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
130854
131274
  Array [
130855
131275
  Object {
130856
131276
  "defaultMessage": "Enter template name",
130857
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
131277
+ "id": "creatives.containersV2.templateNamePlaceholder",
130858
131278
  },
130859
131279
  ],
130860
131280
  Array [
@@ -130997,7 +131417,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
130997
131417
  Array [
130998
131418
  Object {
130999
131419
  "defaultMessage": "Template name",
131000
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
131420
+ "id": "creatives.containersV2.templateNameLabel",
131001
131421
  },
131002
131422
  ],
131003
131423
  Array [
@@ -131009,7 +131429,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
131009
131429
  Array [
131010
131430
  Object {
131011
131431
  "defaultMessage": "Enter template name",
131012
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
131432
+ "id": "creatives.containersV2.templateNamePlaceholder",
131013
131433
  },
131014
131434
  ],
131015
131435
  Array [
@@ -131158,7 +131578,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
131158
131578
  Array [
131159
131579
  Object {
131160
131580
  "defaultMessage": "Template name",
131161
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
131581
+ "id": "creatives.containersV2.templateNameLabel",
131162
131582
  },
131163
131583
  ],
131164
131584
  Array [
@@ -131170,7 +131590,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
131170
131590
  Array [
131171
131591
  Object {
131172
131592
  "defaultMessage": "Enter template name",
131173
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
131593
+ "id": "creatives.containersV2.templateNamePlaceholder",
131174
131594
  },
131175
131595
  ],
131176
131596
  Array [
@@ -131698,13 +132118,15 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
131698
132118
  className="ant-spin-container"
131699
132119
  key="container"
131700
132120
  >
131701
- <CapRow>
132121
+ <CapRow
132122
+ className="cap-whatsapp-creatives"
132123
+ >
131702
132124
  <Row
131703
- className="cap-row-v2"
132125
+ className="cap-row-v2 cap-whatsapp-creatives"
131704
132126
  gutter={0}
131705
132127
  >
131706
132128
  <div
131707
- className="ant-row cap-row-v2"
132129
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
131708
132130
  >
131709
132131
  <CapColumn
131710
132132
  key=".0"
@@ -136145,6 +136567,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
136145
136567
  }
136146
136568
  key=".0"
136147
136569
  whatsappAccountName="WhatsppTest"
136570
+ whatsappContentLen={0}
136148
136571
  >
136149
136572
  <TemplatePreview
136150
136573
  channel="WHATSAPP"
@@ -138091,6 +138514,7 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
138091
138514
  }
138092
138515
  }
138093
138516
  whatsappAccountName="WhatsppTest"
138517
+ whatsappContentLen={0}
138094
138518
  >
138095
138519
  <CapRow>
138096
138520
  <Row
@@ -138117,7 +138541,6 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
138117
138541
  >
138118
138542
  <div
138119
138543
  className="shell-v2 align-center"
138120
- id="sms-preview"
138121
138544
  >
138122
138545
  <CapImage
138123
138546
  alt="Preview is being generated"
@@ -138130,19 +138553,19 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
138130
138553
  src="test-file-stub"
138131
138554
  />
138132
138555
  </CapImage>
138133
- <div
138556
+ <CapLabel
138134
138557
  className="whatsapp-brand-name"
138558
+ type="label1"
138135
138559
  >
138136
- WhatsppTest
138137
- </div>
138560
+ <div
138561
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
138562
+ type="label1"
138563
+ >
138564
+ WhatsppTest
138565
+ </div>
138566
+ </CapLabel>
138138
138567
  <div
138139
- className="msgContainer"
138140
- style={
138141
- Object {
138142
- "marginLeft": 28,
138143
- "maxHeight": 292,
138144
- }
138145
- }
138568
+ className="msg-container whatsapp-message-container"
138146
138569
  >
138147
138570
  <div
138148
138571
  className="message-pop align-left"
@@ -138151,46 +138574,73 @@ exports[`Creatives Whatsapp test/> template name change 2`] = `
138151
138574
  "background-color": "#efefef",
138152
138575
  "border-radius": "6px",
138153
138576
  "left": "10%",
138154
- "padding": "3.5px 0 0",
138577
+ "padding": "4px 0 0.571rem",
138155
138578
  "width": "88%",
138156
138579
  }
138157
138580
  }
138158
138581
  >
138159
- <p
138160
- style={
138161
- Object {
138162
- "color": "#2a2a2a",
138163
- "margin": "1.5px 6px 1px 7px",
138164
- }
138165
- }
138582
+ <CapLabel
138583
+ className="whatsapp-content"
138584
+ type="label1"
138166
138585
  >
138167
- <CapLabel
138168
- type="label5"
138586
+ <div
138587
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
138588
+ type="label1"
138169
138589
  >
138170
- <div
138171
- className="CapLabel-n7zsf5-0 gHdlVo"
138590
+ <CapLabel
138172
138591
  type="label5"
138173
- />
138174
- </CapLabel>
138175
- <CapLabel
138176
- type="label11"
138177
- >
138178
- <div
138179
- className="CapLabel-n7zsf5-0 jpRuDd"
138592
+ >
138593
+ <div
138594
+ className="CapLabel-n7zsf5-0 gHdlVo"
138595
+ type="label5"
138596
+ />
138597
+ </CapLabel>
138598
+ <CapLabel
138180
138599
  type="label11"
138181
- />
138182
- </CapLabel>
138183
- </p>
138184
- <div
138185
- style={
138186
- Object {
138187
- "paddingBottom": "0.571rem",
138188
- }
138189
- }
138190
- />
138600
+ >
138601
+ <div
138602
+ className="CapLabel-n7zsf5-0 jpRuDd"
138603
+ type="label11"
138604
+ />
138605
+ </CapLabel>
138606
+ </div>
138607
+ </CapLabel>
138191
138608
  </div>
138192
138609
  </div>
138193
138610
  </div>
138611
+ <CapHeading
138612
+ className="margin-t-16"
138613
+ style={
138614
+ Object {
138615
+ "textAlign": "center",
138616
+ }
138617
+ }
138618
+ type="h3"
138619
+ >
138620
+ <div
138621
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
138622
+ style={
138623
+ Object {
138624
+ "textAlign": "center",
138625
+ }
138626
+ }
138627
+ type="h3"
138628
+ >
138629
+ <FormattedMessage
138630
+ defaultMessage="1 Message ({length} characters)"
138631
+ id="app.components.TemplatePreview.whatsappMessageLength"
138632
+ values={
138633
+ Object {
138634
+ "length": 36,
138635
+ }
138636
+ }
138637
+ >
138638
+ <span>
138639
+ 1 Message (36 characters)
138640
+ </span>
138641
+ </FormattedMessage>
138642
+ </div>
138643
+ </CapHeading>
138194
138644
  </div>
138195
138645
  </div>
138196
138646
  </Col>
@@ -140311,7 +140761,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140311
140761
  Array [
140312
140762
  Object {
140313
140763
  "defaultMessage": "Template name",
140314
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
140764
+ "id": "creatives.containersV2.templateNameLabel",
140315
140765
  },
140316
140766
  ],
140317
140767
  Array [
@@ -140323,7 +140773,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140323
140773
  Array [
140324
140774
  Object {
140325
140775
  "defaultMessage": "Enter template name",
140326
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
140776
+ "id": "creatives.containersV2.templateNamePlaceholder",
140327
140777
  },
140328
140778
  ],
140329
140779
  Array [
@@ -140466,7 +140916,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140466
140916
  Array [
140467
140917
  Object {
140468
140918
  "defaultMessage": "Template name",
140469
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
140919
+ "id": "creatives.containersV2.templateNameLabel",
140470
140920
  },
140471
140921
  ],
140472
140922
  Array [
@@ -140478,7 +140928,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140478
140928
  Array [
140479
140929
  Object {
140480
140930
  "defaultMessage": "Enter template name",
140481
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
140931
+ "id": "creatives.containersV2.templateNamePlaceholder",
140482
140932
  },
140483
140933
  ],
140484
140934
  Array [
@@ -140621,7 +141071,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140621
141071
  Array [
140622
141072
  Object {
140623
141073
  "defaultMessage": "Template name",
140624
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
141074
+ "id": "creatives.containersV2.templateNameLabel",
140625
141075
  },
140626
141076
  ],
140627
141077
  Array [
@@ -140633,7 +141083,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140633
141083
  Array [
140634
141084
  Object {
140635
141085
  "defaultMessage": "Enter template name",
140636
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
141086
+ "id": "creatives.containersV2.templateNamePlaceholder",
140637
141087
  },
140638
141088
  ],
140639
141089
  Array [
@@ -140782,7 +141232,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140782
141232
  Array [
140783
141233
  Object {
140784
141234
  "defaultMessage": "Template name",
140785
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
141235
+ "id": "creatives.containersV2.templateNameLabel",
140786
141236
  },
140787
141237
  ],
140788
141238
  Array [
@@ -140794,7 +141244,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140794
141244
  Array [
140795
141245
  Object {
140796
141246
  "defaultMessage": "Enter template name",
140797
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
141247
+ "id": "creatives.containersV2.templateNamePlaceholder",
140798
141248
  },
140799
141249
  ],
140800
141250
  Array [
@@ -140943,7 +141393,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140943
141393
  Array [
140944
141394
  Object {
140945
141395
  "defaultMessage": "Template name",
140946
- "id": "creatives.containersV2.Whatsapp.templateNameLabel",
141396
+ "id": "creatives.containersV2.templateNameLabel",
140947
141397
  },
140948
141398
  ],
140949
141399
  Array [
@@ -140955,7 +141405,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
140955
141405
  Array [
140956
141406
  Object {
140957
141407
  "defaultMessage": "Enter template name",
140958
- "id": "creatives.containersV2.Whatsapp.templateNamePlaceholder",
141408
+ "id": "creatives.containersV2.templateNamePlaceholder",
140959
141409
  },
140960
141410
  ],
140961
141411
  Array [
@@ -141583,13 +142033,15 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
141583
142033
  className="ant-spin-container"
141584
142034
  key="container"
141585
142035
  >
141586
- <CapRow>
142036
+ <CapRow
142037
+ className="cap-whatsapp-creatives"
142038
+ >
141587
142039
  <Row
141588
- className="cap-row-v2"
142040
+ className="cap-row-v2 cap-whatsapp-creatives"
141589
142041
  gutter={0}
141590
142042
  >
141591
142043
  <div
141592
- className="ant-row cap-row-v2"
142044
+ className="ant-row cap-row-v2 cap-whatsapp-creatives"
141593
142045
  >
141594
142046
  <CapColumn
141595
142047
  key=".0"
@@ -146030,6 +146482,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
146030
146482
  }
146031
146483
  key=".0"
146032
146484
  whatsappAccountName="WhatsppTest"
146485
+ whatsappContentLen={0}
146033
146486
  >
146034
146487
  <TemplatePreview
146035
146488
  channel="WHATSAPP"
@@ -147976,6 +148429,7 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
147976
148429
  }
147977
148430
  }
147978
148431
  whatsappAccountName="WhatsppTest"
148432
+ whatsappContentLen={0}
147979
148433
  >
147980
148434
  <CapRow>
147981
148435
  <Row
@@ -148002,7 +148456,6 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
148002
148456
  >
148003
148457
  <div
148004
148458
  className="shell-v2 align-center"
148005
- id="sms-preview"
148006
148459
  >
148007
148460
  <CapImage
148008
148461
  alt="Preview is being generated"
@@ -148015,19 +148468,19 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
148015
148468
  src="test-file-stub"
148016
148469
  />
148017
148470
  </CapImage>
148018
- <div
148471
+ <CapLabel
148019
148472
  className="whatsapp-brand-name"
148473
+ type="label1"
148020
148474
  >
148021
- WhatsppTest
148022
- </div>
148475
+ <div
148476
+ className="whatsapp-brand-name CapLabel-n7zsf5-0 bdHnKk"
148477
+ type="label1"
148478
+ >
148479
+ WhatsppTest
148480
+ </div>
148481
+ </CapLabel>
148023
148482
  <div
148024
- className="msgContainer"
148025
- style={
148026
- Object {
148027
- "marginLeft": 28,
148028
- "maxHeight": 292,
148029
- }
148030
- }
148483
+ className="msg-container whatsapp-message-container"
148031
148484
  >
148032
148485
  <div
148033
148486
  className="message-pop align-left"
@@ -148036,46 +148489,73 @@ exports[`Creatives Whatsapp test/> template name change 3`] = `
148036
148489
  "background-color": "#efefef",
148037
148490
  "border-radius": "6px",
148038
148491
  "left": "10%",
148039
- "padding": "3.5px 0 0",
148492
+ "padding": "4px 0 0.571rem",
148040
148493
  "width": "88%",
148041
148494
  }
148042
148495
  }
148043
148496
  >
148044
- <p
148045
- style={
148046
- Object {
148047
- "color": "#2a2a2a",
148048
- "margin": "1.5px 6px 1px 7px",
148049
- }
148050
- }
148497
+ <CapLabel
148498
+ className="whatsapp-content"
148499
+ type="label1"
148051
148500
  >
148052
- <CapLabel
148053
- type="label5"
148501
+ <div
148502
+ className="whatsapp-content CapLabel-n7zsf5-0 bdHnKk"
148503
+ type="label1"
148054
148504
  >
148055
- <div
148056
- className="CapLabel-n7zsf5-0 gHdlVo"
148505
+ <CapLabel
148057
148506
  type="label5"
148058
- />
148059
- </CapLabel>
148060
- <CapLabel
148061
- type="label11"
148062
- >
148063
- <div
148064
- className="CapLabel-n7zsf5-0 jpRuDd"
148507
+ >
148508
+ <div
148509
+ className="CapLabel-n7zsf5-0 gHdlVo"
148510
+ type="label5"
148511
+ />
148512
+ </CapLabel>
148513
+ <CapLabel
148065
148514
  type="label11"
148066
- />
148067
- </CapLabel>
148068
- </p>
148069
- <div
148070
- style={
148071
- Object {
148072
- "paddingBottom": "0.571rem",
148073
- }
148074
- }
148075
- />
148515
+ >
148516
+ <div
148517
+ className="CapLabel-n7zsf5-0 jpRuDd"
148518
+ type="label11"
148519
+ />
148520
+ </CapLabel>
148521
+ </div>
148522
+ </CapLabel>
148076
148523
  </div>
148077
148524
  </div>
148078
148525
  </div>
148526
+ <CapHeading
148527
+ className="margin-t-16"
148528
+ style={
148529
+ Object {
148530
+ "textAlign": "center",
148531
+ }
148532
+ }
148533
+ type="h3"
148534
+ >
148535
+ <div
148536
+ className="margin-t-16 CapHeading-vrvcag-0 kolsfA"
148537
+ style={
148538
+ Object {
148539
+ "textAlign": "center",
148540
+ }
148541
+ }
148542
+ type="h3"
148543
+ >
148544
+ <FormattedMessage
148545
+ defaultMessage="1 Message ({length} characters)"
148546
+ id="app.components.TemplatePreview.whatsappMessageLength"
148547
+ values={
148548
+ Object {
148549
+ "length": 36,
148550
+ }
148551
+ }
148552
+ >
148553
+ <span>
148554
+ 1 Message (36 characters)
148555
+ </span>
148556
+ </FormattedMessage>
148557
+ </div>
148558
+ </CapHeading>
148079
148559
  </div>
148080
148560
  </div>
148081
148561
  </Col>