@capillarytech/creatives-library 9.0.42 → 9.0.44

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.
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@capillarytech/creatives-library",
3
3
  "author": "meharaj",
4
- "version": "9.0.42",
4
+ "version": "9.0.44",
5
5
  "description": "Capillary creatives ui",
6
6
  "main": "./index.js",
7
7
  "module": "./index.es.js",
@@ -84,7 +84,7 @@
84
84
  }
85
85
  }
86
86
  .cap-heading:first-of-type {
87
- margin-bottom: $CAP_SPACE_04;
87
+ margin-bottom: $CAP_SPACE_12;
88
88
  }
89
89
  }
90
90
  }
@@ -609,7 +609,11 @@
609
609
  }
610
610
 
611
611
  .accordion-content-wrapper {
612
- padding-left: $CAP_SPACE_08;
612
+ padding-left: 0;
613
+ }
614
+
615
+ .ant-collapse-body {
616
+ padding-left: 0 !important;
613
617
  }
614
618
 
615
619
  .send-test-content {
@@ -4,7 +4,7 @@
4
4
  display: flex;
5
5
  align-items: center;
6
6
  font-style: normal;
7
- font-weight: 600;
7
+ font-weight: 500;
8
8
  }
9
9
 
10
10
  .form-builder-radio-group {
@@ -80,6 +80,10 @@
80
80
  height: 42px;
81
81
  }
82
82
 
83
+ .ant-tabs-extra-content > div:first-child {
84
+ justify-content: flex-end;
85
+ }
86
+
83
87
  .ant-tabs-nav.ant-tabs-nav-animated {
84
88
  display: flex;
85
89
  }
@@ -552,7 +552,7 @@ export class Email extends React.Component { // eslint-disable-line react/prefer
552
552
  const beeJson = `BEEeditor${currentTab > 1 ? currentTab : ''}json`;
553
553
  const beeToken = `BEEeditor${currentTab > 1 ? currentTab : ''}token`;
554
554
  let beeJsonValue = '';
555
- const selectedId = _.get(this.props, 'Email.templateDetails._id', '') || _.get(this.props, 'Templates.BEETemplate.versions.base.drag_drop_id', '');
555
+ const selectedId = _.get(this.props, 'Email.templateDetails._id', '') || '';
556
556
 
557
557
  // Get beeJsonValue from template data - check multiple sources
558
558
  // First check if it's already in formData (from setEditData)
@@ -1,3 +1,5 @@
1
+ @import "~@capillarytech/cap-ui-library/styles/_variables.scss";
2
+
1
3
  .creatives-mobilepush-create {
2
4
  .mobile-push-row{
3
5
  margin-bottom: 16px;
@@ -27,21 +29,23 @@
27
29
  padding: 16px 16px 16px 0;
28
30
  border: solid 1px #D6D6D6;
29
31
  }
30
-
31
- .ant-tabs-tab {
32
- .form-tab-header{
33
- .unsupported-channel {
34
- .ant-tabs-nav & {
35
- display: none;
36
-
37
- }
38
- }
32
+ .ant-tabs-nav-list {
33
+ gap: 0 !important;
34
+ .ant-tabs-tab {
35
+ .form-tab-header{
36
+ padding: $CAP_SPACE_04 $CAP_SPACE_16;
37
+ .unsupported-channel {
38
+ .ant-tabs-nav & {
39
+ display: none;
40
+
41
+ }
42
+ }
43
+ }
39
44
  }
40
45
  }
41
46
  .tag-container{
42
47
  .ant-col{
43
48
  flex: 0 0 100%;
44
- max-width: 100%;
45
49
 
46
50
  button{
47
51
  float: right;
@@ -1,3 +1,5 @@
1
+ @import "~@capillarytech/cap-ui-library/styles/_variables.scss";
2
+
1
3
  .creatives-mobilepush-edit {
2
4
  .mobile-push-row{
3
5
  margin-bottom: 16px;
@@ -27,20 +29,23 @@
27
29
  padding: 16px 16px 16px 0;
28
30
  border: solid 1px #D6D6D6;
29
31
  }
30
- .ant-tabs-tab {
31
- .form-tab-header{
32
- .unsupported-channel {
33
- .ant-tabs-nav & {
34
- display: none;
35
-
36
- }
37
- }
32
+ .ant-tabs-nav-list {
33
+ gap: 0 !important;
34
+ .ant-tabs-tab {
35
+ .form-tab-header{
36
+ padding: $CAP_SPACE_04 $CAP_SPACE_16;
37
+ .unsupported-channel {
38
+ .ant-tabs-nav & {
39
+ display: none;
40
+
41
+ }
42
+ }
43
+ }
38
44
  }
39
45
  }
40
46
  .tag-container{
41
47
  .ant-col{
42
48
  flex: 0 0 100%;
43
- max-width: 100%;
44
49
 
45
50
  button{
46
51
  float: right;
@@ -1,7 +1,7 @@
1
1
  @import '~@capillarytech/cap-ui-library/styles/_variables.scss';
2
2
 
3
3
  .ant-tabs-content{
4
- margin-top: $CAP_SPACE_08;
4
+ margin-top: 0.171rem;
5
5
  // .creatives-templates-list.full-mode{
6
6
  .v2-pagination-container, .v2-pagination-container-half {
7
7
  .ant-tabs-tabpane-active{
@@ -1479,3 +1479,13 @@
1479
1479
  opacity: 0.4;
1480
1480
  cursor: not-allowed;
1481
1481
  }
1482
+
1483
+ .template-action-dropdown {
1484
+ min-width: 14.286rem !important;
1485
+ .template-action-menu {
1486
+ padding: 4px 0px;
1487
+ .template-action-menu-item {
1488
+ padding: 12px 24px;
1489
+ }
1490
+ }
1491
+ }
@@ -2146,15 +2146,16 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2146
2146
  if (this.props.isFullMode && !this.props.isDltFromRcs && !(this.state.hostName === HOST_GUPSHUP)) {
2147
2147
  templateData.extra.push(
2148
2148
  <CapDropdown
2149
+ rootClassName="template-action-dropdown"
2149
2150
  overlay={
2150
- <CapMenu>
2151
+ <CapMenu className="template-action-menu">
2151
2152
  {/* Phase 16: Test and Preview menu item - Show for supported channels, hide in archived mode */}
2152
2153
  {!isArchivedMode && (this.isTestAndPreviewSupported() ||
2153
2154
  (this.state.channel.toUpperCase() === WHATSAPP &&
2154
2155
  status === WHATSAPP_STATUSES.approved) || (this.state.channel.toUpperCase() === RCS &&
2155
2156
  rcsStatus === RCS_STATUSES.approved)) && (
2156
2157
  <CapMenu.Item
2157
- className={`test-and-preview-${channelLowerCase}`}
2158
+ className={`test-and-preview-${channelLowerCase} template-action-menu-item`}
2158
2159
  onClick={() => {
2159
2160
  if ([ZALO, WHATSAPP, RCS].includes(this.state.channel.toUpperCase()) || (isTraiDltFeature && this.state.channel.toUpperCase() === SMS)) {
2160
2161
  handlers.handleEditClick(undefined, template, undefined, undefined, {
@@ -2174,7 +2175,7 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2174
2175
  ) &&
2175
2176
  !isTraiDltFeature && !template.isArchived && this.gatedMenuItem({
2176
2177
  allowed: this.canPerform(PERMISSIONS.CREATIVE_CREATE),
2177
- className: `duplicate-${channelLowerCase}`,
2178
+ className: `duplicate-${channelLowerCase} template-action-menu-item`,
2178
2179
  onClick: () => this.duplicateTemplate(template),
2179
2180
  label: <FormattedMessage {...messages.duplicateButton} />,
2180
2181
  })}
@@ -2186,13 +2187,13 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2186
2187
  return !template?.isArchived
2187
2188
  ? this.gatedMenuItem({
2188
2189
  allowed: canArchive,
2189
- className: `archive-${channelLowerCase}`,
2190
+ className: `archive-${channelLowerCase} template-action-menu-item`,
2190
2191
  onClick: () => this.handleTemplateArchiveAction({ templateId: template._id, templateName: template.name }),
2191
2192
  label: <FormattedMessage {...messages.archiveButton} />,
2192
2193
  })
2193
2194
  : this.gatedMenuItem({
2194
2195
  allowed: canArchive,
2195
- className: `unarchive-${channelLowerCase}`,
2196
+ className: `unarchive-${channelLowerCase} template-action-menu-item`,
2196
2197
  onClick: () => this.handleTemplateArchiveAction({ templateId: template._id, templateName: template.name, isUnarchive: true }),
2197
2198
  label: <FormattedMessage {...messages.unarchiveButton} />,
2198
2199
  });
@@ -2205,8 +2206,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
2205
2206
  allowed: this.canPerform(PERMISSIONS.CREATIVE_DELETE),
2206
2207
  className:
2207
2208
  this.state.channel.toUpperCase() === WECHAT && !template.definition
2208
- ? `unmap-${channelLowerCase}`
2209
- : `delete-${channelLowerCase}`,
2209
+ ? `unmap-${channelLowerCase} template-action-menu-item`
2210
+ : `delete-${channelLowerCase} template-action-menu-item`,
2210
2211
  onClick: () => this.toggleDeleteTemplateModal(template),
2211
2212
  label:
2212
2213
  this.state.channel.toUpperCase() === WECHAT && !template.definition
@@ -1339,9 +1339,11 @@ Click {{unsubscribe}} to unsubscribe
1339
1339
  null,
1340
1340
  <CapDropdownComponent
1341
1341
  overlay={
1342
- <CapMenuComponent>
1342
+ <CapMenuComponent
1343
+ className="template-action-menu"
1344
+ >
1343
1345
  <withItemHOC
1344
- className="delete-whatsapp rbac-disabled"
1346
+ className="delete-whatsapp template-action-menu-item rbac-disabled"
1345
1347
  onClick={[Function]}
1346
1348
  >
1347
1349
  <CapTooltip
@@ -1364,6 +1366,7 @@ Click {{unsubscribe}} to unsubscribe
1364
1366
  </withItemHOC>
1365
1367
  </CapMenuComponent>
1366
1368
  }
1369
+ rootClassName="template-action-dropdown"
1367
1370
  >
1368
1371
  <CapIcon
1369
1372
  type="more"
@@ -1823,9 +1826,11 @@ Click {{unsubscribe}} to unsubscribe
1823
1826
  null,
1824
1827
  <CapDropdownComponent
1825
1828
  overlay={
1826
- <CapMenuComponent>
1829
+ <CapMenuComponent
1830
+ className="template-action-menu"
1831
+ >
1827
1832
  <withItemHOC
1828
- className="delete-whatsapp rbac-disabled"
1833
+ className="delete-whatsapp template-action-menu-item rbac-disabled"
1829
1834
  onClick={[Function]}
1830
1835
  >
1831
1836
  <CapTooltip
@@ -1848,6 +1853,7 @@ Click {{unsubscribe}} to unsubscribe
1848
1853
  </withItemHOC>
1849
1854
  </CapMenuComponent>
1850
1855
  }
1856
+ rootClassName="template-action-dropdown"
1851
1857
  >
1852
1858
  <CapIcon
1853
1859
  type="more"
@@ -2307,9 +2313,11 @@ Click {{unsubscribe}} to unsubscribe
2307
2313
  null,
2308
2314
  <CapDropdownComponent
2309
2315
  overlay={
2310
- <CapMenuComponent>
2316
+ <CapMenuComponent
2317
+ className="template-action-menu"
2318
+ >
2311
2319
  <withItemHOC
2312
- className="delete-whatsapp rbac-disabled"
2320
+ className="delete-whatsapp template-action-menu-item rbac-disabled"
2313
2321
  onClick={[Function]}
2314
2322
  >
2315
2323
  <CapTooltip
@@ -2332,6 +2340,7 @@ Click {{unsubscribe}} to unsubscribe
2332
2340
  </withItemHOC>
2333
2341
  </CapMenuComponent>
2334
2342
  }
2343
+ rootClassName="template-action-dropdown"
2335
2344
  >
2336
2345
  <CapIcon
2337
2346
  type="more"
@@ -2259,23 +2259,25 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
2259
2259
  />
2260
2260
  <CapRow type='flex' justify='space-between' align='middle'>
2261
2261
  {/* template category */}
2262
- <CapColumn span={11}>
2262
+ <CapColumn span={12}>
2263
2263
  {renderLabel("templateCategoryLabel")}
2264
2264
  <CapSelect
2265
2265
  id="select-whatsapp-category"
2266
2266
  options={getCategoryOptions(host)}
2267
2267
  onChange={onTemplateCategoryChange}
2268
2268
  value={templateCategory}
2269
+ className="select-whatsapp-category"
2269
2270
  />
2270
2271
  </CapColumn>
2271
2272
  {/* template media type */}
2272
- <CapColumn span={11}>
2273
+ <CapColumn span={12}>
2273
2274
  {renderLabel("mediaLabel")}
2274
2275
  <CapSelect
2275
2276
  id="select-whatsapp-media"
2276
2277
  options={mediaTypeOptions({host, templateCategory})}
2277
2278
  onChange={onTemplateMediaTypeChange}
2278
2279
  value={templateMediaType}
2280
+ className="select-whatsapp-media"
2279
2281
  />
2280
2282
  </CapColumn>
2281
2283
  </CapRow>
@@ -131,11 +131,11 @@
131
131
  width: 95%;
132
132
  }
133
133
 
134
- #select-whatsapp-category {
134
+ .select-whatsapp-category {
135
135
  padding-right: 0.357rem;
136
136
  }
137
137
 
138
- #select-whatsapp-media {
138
+ .select-whatsapp-media {
139
139
  padding-left: 0.357rem;
140
140
  }
141
141
 
@@ -277,9 +277,12 @@
277
277
  }
278
278
 
279
279
  .whatsapp-carousel-tab {
280
- .ant-tabs-tab {
281
- padding: $CAP_SPACE_08 $CAP_SPACE_20;
282
- justify-content: center;
280
+ .ant-tabs-nav-list {
281
+ gap: 0 !important;
282
+ .ant-tabs-tab {
283
+ padding: $CAP_SPACE_08 $CAP_SPACE_20;
284
+ justify-content: center;
285
+ }
283
286
  }
284
287
  .ant-tabs-extra-content {
285
288
  padding: 0;