@bikdotai/bik-component-library 0.0.511-beta.tcm-7 → 0.0.511-beta.tcm-8
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("styled-components"),i=require("../../carousel-preview/CarouselPreview.js"),l=require("./EditWhatsAppCarouselTemplateV2.js"),o=require("../../template-preview/models/Channels.js"),n=require("../../TypographyStyle.js"),s=require("../../../constants/Theme.js"),r=require("../context/templateModalContext.js"),d=require("../utils/getVariableNameEmail.js"),p=require("../utils/highlightFor.js"),u=require("./DesktopPreview.js"),c=require("./EditWhatsAppTemplateV2.js"),h=require("./MobilePreview.js"),m=require("./VariableConnectorsPanel.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("styled-components"),i=require("../../carousel-preview/CarouselPreview.js"),l=require("./EditWhatsAppCarouselTemplateV2.js"),o=require("../../template-preview/models/Channels.js"),n=require("../../TypographyStyle.js"),s=require("../../../constants/Theme.js"),r=require("../context/templateModalContext.js"),d=require("../utils/getVariableNameEmail.js"),p=require("../utils/highlightFor.js"),u=require("./DesktopPreview.js"),c=require("./EditWhatsAppTemplateV2.js"),h=require("./MobilePreview.js"),m=require("./VariableConnectorsPanel.js");function v(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var b=v(a);const C=b.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
// height: 100%;
|
|
4
|
-
`,b
|
|
4
|
+
`,f=b.default.div`
|
|
5
5
|
padding: 16px 14px;
|
|
6
6
|
max-width: ${e=>e.channel===o.CHANNEL_TYPE.EMAIL?"400px":"450px"};
|
|
7
7
|
|
|
@@ -10,11 +10,12 @@
|
|
|
10
10
|
padding-bottom: 24px;
|
|
11
11
|
border-left: ${s.COLORS.stroke.primary} 1px solid;
|
|
12
12
|
border-top: ${e=>e.isWhatsappCarousel?`${s.COLORS.stroke.primary} 1px solid`:void 0};
|
|
13
|
-
|
|
13
|
+
${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
|
|
14
|
+
`,g=b.default.div`
|
|
14
15
|
padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
|
|
15
16
|
flex: 1;
|
|
16
17
|
height: ${e=>e.isWhatsappCarousel||e.hideDeviceContainerInPreview?"500px":"475px"};
|
|
17
18
|
overflow-y: auto;
|
|
18
19
|
background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===o.CHANNEL_TYPE.WHATSAPP?"url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f');":"none"};
|
|
19
20
|
display: ${e=>e.hideDeviceContainerInPreview&&e.channel===o.CHANNEL_TYPE.WHATSAPP?"flex":"initial"};
|
|
20
|
-
`;exports.default=a=>{const{showVariableMapping:v,showOnlyContent:
|
|
21
|
+
`;exports.default=a=>{const{showVariableMapping:v,showOnlyContent:b,whatsappSpecificPickerMeta:w,showVariableModal:x,variableList:P,discountCode:E,setDiscountCode:j,variableListForImage:y,showSampleValues:A,fileName:T,setFileName:L}=a,N=t.useRef(),S=t.useRef(),{device:M,display_content:_,channel:O,template:V,setTemplate:W,isWhatsappCarousel:H,isProductCarouselType:q,hideDeviceContainerInPreview:I}=r.useTemplateModalContext();const k=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(C,{children:[e.jsx(g,Object.assign({showOnlyContent:b,showVariableMapping:v,isWhatsappCarousel:H,hideDeviceContainerInPreview:I,channel:O},{children:"mobile"===M?e.jsx(h.default,{ref:S,display_content:null!=_?_:"",channel:O,template:V,showSampleValues:A}):O===o.CHANNEL_TYPE.WHATSAPP&&H?e.jsx(i.CarouselPreview,{ref:N,channel:O,template:V,showSampleValues:A,isPreview:!1}):O!==o.CHANNEL_TYPE.MESSAGE?e.jsx(u.default,{ref:N,channel:O,display_content:null!=_?_:"",showSampleValues:A}):e.jsx(e.Fragment,{})})),(q||v)&&e.jsx(f,Object.assign({channel:O,isWhatsappCarousel:H,showVariableMapping:!0},{children:O!==o.CHANNEL_TYPE.WHATSAPP?e.jsx(m.default,{onFocus:O===o.CHANNEL_TYPE.EMAIL?function(e){var t,a,i;const l=null===document||void 0===document?void 0:document.getElementById("mobile"===M?"template_html_mobile":"template_html_desktop"),n=d.getVariableNameForEmailByIndex(e+1),r=O===o.CHANNEL_TYPE.EMAIL?null===(t=null==l?void 0:l.contentWindow)||void 0===t?void 0:t.document.getElementById(n):document.getElementById(n),u=k(r),c=null==r?void 0:r.offsetLeft;"desktop"===M?u&&N.current&&(null===(a=null==l?void 0:l.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,u),p.highlightFor(n,s.COLORS.background.warning.light,2,O,M)):u&&S.current&&(null===(i=null==l?void 0:l.contentWindow)||void 0===i||i.scrollTo(null!=c?c:0,u),p.highlightFor(n,s.COLORS.background.warning.light,2,O,M))}:void 0,showVariableModal:x,variableList:P,discountCode:E,setDiscountCode:j}):O===o.CHANNEL_TYPE.WHATSAPP&&H?e.jsx(l.default,{whatsappSpecificPickerMeta:w,template:V,showVariableModal:x,variableList:P,variableListForImage:y,discountCode:E,setDiscountCode:j}):e.jsx(c.default,{whatsappSpecificPickerMeta:w,template:V,onTemplateChange:e=>{null==W||W(e)},showVariableModal:x,variableList:P,variableListForImage:y,discountCode:E,setDiscountCode:j,fileName:T,setFileName:L})})),!v&&!q&&e.jsx(f,{children:e.jsx(n.BodySecondary,Object.assign({color:s.COLORS.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{jsxs as e,jsx as
|
|
1
|
+
import{jsxs as e,jsx as t,Fragment as o}from"react/jsx-runtime";import{useRef as i}from"react";import a from"styled-components";import{CarouselPreview as l}from"../../carousel-preview/CarouselPreview.js";import n from"./EditWhatsAppCarouselTemplateV2.js";import{CHANNEL_TYPE as r}from"../../template-preview/models/Channels.js";import{BodySecondary as s}from"../../TypographyStyle.js";import{COLORS as p}from"../../../constants/Theme.js";import{useTemplateModalContext as d}from"../context/templateModalContext.js";import{getVariableNameForEmailByIndex as m}from"../utils/getVariableNameEmail.js";import{highlightFor as c}from"../utils/highlightFor.js";import h from"./DesktopPreview.js";import u from"./EditWhatsAppTemplateV2.js";import f from"./MobilePreview.js";import b from"./VariableConnectorsPanel.js";const v=a.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
// height: 100%;
|
|
4
4
|
`,w=a.div`
|
|
@@ -10,6 +10,7 @@ import{jsxs as e,jsx as o,Fragment as t}from"react/jsx-runtime";import{useRef as
|
|
|
10
10
|
padding-bottom: 24px;
|
|
11
11
|
border-left: ${p.stroke.primary} 1px solid;
|
|
12
12
|
border-top: ${e=>e.isWhatsappCarousel?`${p.stroke.primary} 1px solid`:void 0};
|
|
13
|
+
${e=>!e.showVariableMapping&&"width: 340px; height: 500px"};
|
|
13
14
|
`,g=a.div`
|
|
14
15
|
padding: ${e=>e.isWhatsappCarousel?void 0:e.showOnlyContent?"16px 14px":"16px 32px"};
|
|
15
16
|
flex: 1;
|
|
@@ -17,4 +18,4 @@ import{jsxs as e,jsx as o,Fragment as t}from"react/jsx-runtime";import{useRef as
|
|
|
17
18
|
overflow-y: auto;
|
|
18
19
|
background-image: ${e=>e.hideDeviceContainerInPreview&&e.channel===r.WHATSAPP?"url('https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F341dba50-e84e-4457-b5b5-d9d8a0b95a73?alt=media&token=6fd32f23-8bb2-4980-bbee-bef39b38fd9f');":"none"};
|
|
19
20
|
display: ${e=>e.hideDeviceContainerInPreview&&e.channel===r.WHATSAPP?"flex":"initial"};
|
|
20
|
-
`,C=a=>{const{showVariableMapping:C,showOnlyContent:P,whatsappSpecificPickerMeta:x,showVariableModal:y,variableList:A,discountCode:S,setDiscountCode:
|
|
21
|
+
`,C=a=>{const{showVariableMapping:C,showOnlyContent:P,whatsappSpecificPickerMeta:x,showVariableModal:y,variableList:A,discountCode:S,setDiscountCode:M,variableListForImage:W,showSampleValues:j,fileName:T,setFileName:V}=a,k=i(),I=i(),{device:E,display_content:L,channel:D,template:$,setTemplate:F,isWhatsappCarousel:_,isProductCarouselType:H,hideDeviceContainerInPreview:O}=d();const N=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e(v,{children:[t(g,Object.assign({showOnlyContent:P,showVariableMapping:C,isWhatsappCarousel:_,hideDeviceContainerInPreview:O,channel:D},{children:"mobile"===E?t(f,{ref:I,display_content:null!=L?L:"",channel:D,template:$,showSampleValues:j}):D===r.WHATSAPP&&_?t(l,{ref:k,channel:D,template:$,showSampleValues:j,isPreview:!1}):D!==r.MESSAGE?t(h,{ref:k,channel:D,display_content:null!=L?L:"",showSampleValues:j}):t(o,{})})),(H||C)&&t(w,Object.assign({channel:D,isWhatsappCarousel:_,showVariableMapping:!0},{children:D!==r.WHATSAPP?t(b,{onFocus:D===r.EMAIL?function(e){var t,o,i;const a=null===document||void 0===document?void 0:document.getElementById("mobile"===E?"template_html_mobile":"template_html_desktop"),l=m(e+1),n=D===r.EMAIL?null===(t=null==a?void 0:a.contentWindow)||void 0===t?void 0:t.document.getElementById(l):document.getElementById(l),s=N(n),d=null==n?void 0:n.offsetLeft;"desktop"===E?s&&k.current&&(null===(o=null==a?void 0:a.contentWindow)||void 0===o||o.scrollTo(null!=d?d:0,s),c(l,p.background.warning.light,2,D,E)):s&&I.current&&(null===(i=null==a?void 0:a.contentWindow)||void 0===i||i.scrollTo(null!=d?d:0,s),c(l,p.background.warning.light,2,D,E))}:void 0,showVariableModal:y,variableList:A,discountCode:S,setDiscountCode:M}):D===r.WHATSAPP&&_?t(n,{whatsappSpecificPickerMeta:x,template:$,showVariableModal:y,variableList:A,variableListForImage:W,discountCode:S,setDiscountCode:M}):t(u,{whatsappSpecificPickerMeta:x,template:$,onTemplateChange:e=>{null==F||F(e)},showVariableModal:y,variableList:A,variableListForImage:W,discountCode:S,setDiscountCode:M,fileName:T,setFileName:V})})),!C&&!H&&t(w,{children:t(s,Object.assign({color:p.content.secondary,style:{fontStyle:"italic"}},{children:"Click on ‘Select template’ below to use it"}))})]})};export{C as default};
|