@capillarytech/creatives-library 9.0.0 → 9.0.2-beta.0

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "9.0.0",
+  "version": "9.0.2-beta.0",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",

package/v2Components/CapDeviceContent/index.scss

@@ -33,6 +33,7 @@
     }
     .creatives-inapp-message {
         margin-top : $CAP_SPACE_12;
+        position: relative;
         .inapp-message-header {
             display: flex;
             align-items: center;
@@ -51,9 +52,9 @@
         }
         .cap-custom-image-upload {
             .dragger-button.re-upload {
-                top: 13rem;
+                top: 15.8rem;
                 position: absolute;
-                right: -1rem;
+                margin-left: 20vw;
                 color: $FONT_COLOR_05;
               }
         }

package/v2Components/FormBuilder/index.js

@@ -2671,7 +2671,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     document.querySelector(`#${parentID} #fileName`).click();
   };
   handleOk = (ev) => {
-    const id = ev.target.id;
+    // antd v6 wraps button text in a <span>; use currentTarget so the button id resolves.
+    const id = (ev.currentTarget && ev.currentTarget.id) || ev.target.id;
     this.setState({showModal: false});
     if (id === "android" && this.state.androidValid) {
       this.onSubmitWrapper({singleTab: id});
@@ -2706,7 +2707,8 @@ class FormBuilder extends React.Component { // eslint-disable-line react/prefer-
     }
   };
   handleCancel = (ev) => {
-    const id = ev.target.id;
+    // antd v6 wraps button text in a <span>; use currentTarget so the button id resolves.
+    const id = (ev.currentTarget && ev.currentTarget.id) || ev.target.id;
     this.setState({showModal: false});
     if (id === 'template-back-confirm-modal') {
       const response = {

package/v2Components/TemplatePreview/index.js

@@ -644,7 +644,7 @@ export class TemplatePreview extends React.Component { // eslint-disable-line re
                     src={smsMobileAndroid}
                     alt={this.props.intl.formatMessage(messages.previewGenerated)}
                   />
-                  <CapRow useLegacy className="msg-container sms">
+                  <CapRow className="msg-container sms">
                     <CapRow useLegacy className={"message-pop sms"}>
                       {content &&
                         content.length &&

package/v2Containers/Templates/_templates.scss

@@ -1187,6 +1187,11 @@
   gap: $CAP_SPACE_12;
   flex-shrink: 0;
   margin-right: $CAP_SPACE_32;
+
+  .archive-template-button {
+    column-gap: $CAP_SPACE_12;
+    align-items: center;
+  }
 }
 
 .archived-mode-header {

package/v2Containers/Templates/index.js

@@ -2719,7 +2719,8 @@ export class Templates extends React.Component { // eslint-disable-line react/pr
             </CapLabel>
             <CapButton
               type="primary"
-              prefix={<CapIcon type="archive" size="m" />}
+              className="archive-template-button"
+              prefix={<CapIcon type="archive" size="s" />}
               onClick={() => this.handleBulkArchiveAction({ ids: selectedIdsArrayLocal, count: selectedCountLocal, isUnarchive: isArchivedModeLocal })}
             >
               <span className="archive-btn-label">

package/v2Containers/WeChat/MapTemplates/index.js

@@ -890,7 +890,7 @@ export class MapTemplates extends React.Component { // eslint-disable-line react
     }
     
     getMappedEvent(id, event) {
-      return (this.state.map[id] && this.state.map[id][event] ?  this.state.map[id][event] : () => {});
+      return this.state.map[id]?.[event] ?? (() => {});
     }
     
     handleOnTagsContextChange = (data) => {

package/v2Containers/Whatsapp/index.js

@@ -963,18 +963,22 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
             <CapLabel>{formatMessage(messages.ctaDesc)}</CapLabel>
           </div>
           {isBtnTypeCta && (
-            <CapWhatsappCTA
-              ctaData={ctaData}
-              updateHandler={updateHandler}
-              deleteHandler={deleteHandler}
-              isEditFlow={isEditFlow}
-              hostName={host}
-              tags={tags || []}
-              injectedTags={injectedTags || {}}
-              selectedOfferDetails={selectedOfferDetails}
-              eventContextTags={eventContextTags}
-              waitEventContextTags={waitEventContextTags}
-            />
+            // Panel sits inside the radio option's <label>; preventDefault stops the
+            // <label> re-dispatching chevron-icon clicks to the radio (focus-steal → dropdown flicker).
+            <div role="presentation" onClick={(e) => e.preventDefault()}>
+              <CapWhatsappCTA
+                ctaData={ctaData}
+                updateHandler={updateHandler}
+                deleteHandler={deleteHandler}
+                isEditFlow={isEditFlow}
+                hostName={host}
+                tags={tags || []}
+                injectedTags={injectedTags || {}}
+                selectedOfferDetails={selectedOfferDetails}
+                eventContextTags={eventContextTags}
+                waitEventContextTags={waitEventContextTags}
+              />
+            </div>
           )}
         </>
       ),
@@ -990,12 +994,16 @@ const isAuthenticationTemplate = isEqual(templateCategory, WHATSAPP_CATEGORIES.a
             <CapLabel>{formatMessage(messages.quickReplyDesc)}</CapLabel>
           </div>
           {isBtnTypeQuickReply && (
-            <CapWhatsappQuickReply
-              quickReplyData={quickReplyData}
-              isEditFlow={isEditFlow}
-              renderMessageLength={renderMessageLength}
-              setQuickReplyData={setQuickReplyData}
-            />
+            // Same label-forwarding guard as the CTA panel: this is nested inside the
+            // radio option's <label>, so cancel the synthetic click it would send to the radio.
+            <div role="presentation" onClick={(e) => e.preventDefault()}>
+              <CapWhatsappQuickReply
+                quickReplyData={quickReplyData}
+                isEditFlow={isEditFlow}
+                renderMessageLength={renderMessageLength}
+                setQuickReplyData={setQuickReplyData}
+              />
+            </div>
           )}
         </>
       ),

package/v2Containers/Zalo/index.scss

@@ -34,6 +34,7 @@
 
     .zalo-warning-message-label {
       display: flex;
+      align-items: center;
     }
 
     .alert-icon-zalo {