@bikdotai/bik-component-library 0.0.417 → 0.0.419-beta.1
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/dist/cjs/assets/icons/copy-code-icon.svg.js +1 -0
- package/dist/cjs/assets/icons/lto_icon.svg.js +1 -0
- package/dist/cjs/components/TablePagination/TablePagination.js +1 -1
- package/dist/cjs/components/add-variableV2/AddVariableV2.js +1 -1
- package/dist/cjs/components/alerts/Alert.d.ts +3 -1
- package/dist/cjs/components/alerts/Alert.js +1 -1
- package/dist/cjs/components/alerts/Alert.styled.d.ts +2 -1
- package/dist/cjs/components/alerts/Alert.styled.js +4 -4
- package/dist/cjs/components/alerts/AlertHelper.d.ts +5 -0
- package/dist/cjs/components/alerts/AlertHelper.js +1 -1
- package/dist/cjs/components/custom-date-time/CustomDateTime.js +1 -1
- package/dist/cjs/components/input/Input.js +1 -1
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts +4 -3
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/cjs/components/template-context-mapper/carousel/CarouselPreview.d.ts +12 -0
- package/dist/cjs/components/template-context-mapper/carousel/CarouselPreview.js +9 -0
- package/dist/cjs/components/template-context-mapper/carousel/CarouselPreviewCard.d.ts +10 -0
- package/dist/cjs/components/template-context-mapper/carousel/CarouselPreviewCard.js +15 -0
- package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts +15 -8
- package/dist/cjs/components/template-context-mapper/custom-hooks/useAdditionalVariables.d.ts +12 -0
- package/dist/cjs/components/template-context-mapper/custom-hooks/useAdditionalVariables.js +1 -0
- package/dist/cjs/components/template-context-mapper/modalElements/Body.js +7 -7
- package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.js +3 -3
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.d.ts +14 -0
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -0
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +2 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/Footer.d.ts +2 -1
- package/dist/cjs/components/template-context-mapper/modalElements/Footer.js +4 -4
- package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.d.ts +2 -1
- package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.d.ts +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.d.ts +0 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableEditorHeader.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.d.ts +2 -1
- package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/utils/getDataFromTemplateComponent.js +1 -1
- package/dist/cjs/components/template-context-mapper/utils/getPreviewDimension.d.ts +1 -1
- package/dist/cjs/components/template-context-mapper/utils/getPreviewDimension.js +1 -1
- package/dist/cjs/components/template-preview/TemplatePreview.d.ts +4 -2
- package/dist/cjs/components/template-preview/TemplatePreview.js +1 -1
- package/dist/cjs/components/template-preview/WhatsApp/ChatUI.style.d.ts +5 -1
- package/dist/cjs/components/template-preview/WhatsApp/ChatUI.style.js +14 -6
- package/dist/cjs/components/template-preview/WhatsApp/ChatUiV2.js +5 -5
- package/dist/cjs/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.d.ts +9 -0
- package/dist/cjs/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.js +20 -0
- package/dist/cjs/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js +4 -6
- package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.d.ts +1 -0
- package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.js +1 -1
- package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.d.ts +7 -0
- package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
- package/dist/cjs/components/template-preview/models/TemplateMeta.d.ts +1 -1
- package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts +27 -4
- package/dist/cjs/components/template-preview/models/WhatsAppTemplate.js +1 -1
- package/dist/cjs/components/template-preview/models/WhatsappCarouselTemplate.d.ts +80 -0
- package/dist/cjs/index.js +1 -1
- package/dist/esm/assets/icons/copy-code-icon.svg.js +1 -0
- package/dist/esm/assets/icons/lto_icon.svg.js +1 -0
- package/dist/esm/components/TablePagination/TablePagination.js +1 -1
- package/dist/esm/components/add-variableV2/AddVariableV2.js +1 -1
- package/dist/esm/components/alerts/Alert.d.ts +3 -1
- package/dist/esm/components/alerts/Alert.js +1 -1
- package/dist/esm/components/alerts/Alert.styled.d.ts +2 -1
- package/dist/esm/components/alerts/Alert.styled.js +5 -5
- package/dist/esm/components/alerts/AlertHelper.d.ts +5 -0
- package/dist/esm/components/alerts/AlertHelper.js +1 -1
- package/dist/esm/components/custom-date-time/CustomDateTime.js +1 -1
- package/dist/esm/components/input/Input.js +1 -1
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts +4 -3
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/esm/components/template-context-mapper/carousel/CarouselPreview.d.ts +12 -0
- package/dist/esm/components/template-context-mapper/carousel/CarouselPreview.js +9 -0
- package/dist/esm/components/template-context-mapper/carousel/CarouselPreviewCard.d.ts +10 -0
- package/dist/esm/components/template-context-mapper/carousel/CarouselPreviewCard.js +15 -0
- package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts +15 -8
- package/dist/esm/components/template-context-mapper/custom-hooks/useAdditionalVariables.d.ts +12 -0
- package/dist/esm/components/template-context-mapper/custom-hooks/useAdditionalVariables.js +1 -0
- package/dist/esm/components/template-context-mapper/modalElements/Body.js +8 -8
- package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.js +3 -3
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.d.ts +14 -0
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js +1 -0
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +2 -1
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/Footer.d.ts +2 -1
- package/dist/esm/components/template-context-mapper/modalElements/Footer.js +4 -4
- package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.d.ts +2 -1
- package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.d.ts +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.d.ts +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableEditorHeader.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.d.ts +2 -1
- package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/esm/components/template-context-mapper/utils/getDataFromTemplateComponent.js +1 -1
- package/dist/esm/components/template-context-mapper/utils/getPreviewDimension.d.ts +1 -1
- package/dist/esm/components/template-context-mapper/utils/getPreviewDimension.js +1 -1
- package/dist/esm/components/template-preview/TemplatePreview.d.ts +4 -2
- package/dist/esm/components/template-preview/TemplatePreview.js +1 -1
- package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.d.ts +5 -1
- package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.js +21 -13
- package/dist/esm/components/template-preview/WhatsApp/ChatUiV2.js +5 -5
- package/dist/esm/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.d.ts +9 -0
- package/dist/esm/components/template-preview/WhatsApp/LimitedTimeOffer/LimitedTimeOffer.index.js +20 -0
- package/dist/esm/components/template-preview/WhatsApp/WhatsAppLikePreviewV2.js +3 -5
- package/dist/esm/components/template-preview/WhatsAppTemplatePreview.d.ts +1 -0
- package/dist/esm/components/template-preview/WhatsAppTemplatePreview.js +1 -1
- package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.d.ts +7 -0
- package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
- package/dist/esm/components/template-preview/models/TemplateMeta.d.ts +1 -1
- package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts +27 -4
- package/dist/esm/components/template-preview/models/WhatsAppTemplate.js +1 -1
- package/dist/esm/components/template-preview/models/WhatsappCarouselTemplate.d.ts +80 -0
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/assets/icons/video_camcorder.svg.js +0 -1
- package/dist/esm/assets/icons/video_camcorder.svg.js +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=e(require("react"));function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},a.apply(this,arguments)}var n=e=>r.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 17 16"},e),t||(t=r.createElement("g",{fill:"#1877F2"},r.createElement("path",{d:"M2.695 2.196A.667.667 0 0 1 3.167 2h6a.667.667 0 0 1 .666.667v.667a.667.667 0 1 0 1.333 0v-.667a2 2 0 0 0-2-2h-6a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h.667a.667.667 0 0 0 0-1.333h-.667a.667.667 0 0 1-.666-.667v-6c0-.177.07-.346.195-.471Z"}),r.createElement("path",{fillRule:"evenodd",d:"M7.833 5.334a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h6a2 2 0 0 0 2-2v-6a2 2 0 0 0-2-2h-6Zm-.667 2c0-.369.299-.667.667-.667h6c.368 0 .667.298.667.667v6a.667.667 0 0 1-.667.666h-6a.667.667 0 0 1-.667-.666v-6Z",clipRule:"evenodd"}))));exports.default=n;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var a=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,a.get?a:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t,r=e(require("react"));function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e},a.apply(this,arguments)}var n=e=>r.createElement("svg",a({xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24"},e),t||(t=r.createElement("path",{fill:"#4AA189",fillRule:"evenodd",d:"M9.778 7.112a1.833 1.833 0 1 1 0-3.667 1.833 1.833 0 0 1 0 3.667ZM6.444 5.279a3.333 3.333 0 0 1 6.112-1.844A3.333 3.333 0 1 1 17.818 7.5H20a2 2 0 0 1 2 2V21.057a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9.501a2 2 0 0 1 2-2h3.293a3.32 3.32 0 0 1-.849-2.222ZM13.634 9l2.752 3.93a.75.75 0 0 0 1.228-.86L15.465 9H20a.5.5 0 0 1 .5.5v6.194h-17V9.501A.5.5 0 0 1 4 9h5.646l-2.15 3.07a.75.75 0 1 0 1.23.86l2.75-3.93h2.158ZM20.5 21.056v-2.86h-17v2.86a.5.5 0 0 0 .5.5h16a.5.5 0 0 0 .5-.5Zm-7-15.777a1.833 1.833 0 1 0 3.667 0 1.833 1.833 0 0 0-3.667 0Z",clipRule:"evenodd"})));exports.default=n;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),n=require("./TablePagination.styled.js"),a=require("../../constants/Theme.js"),i=require("../
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),s=require("../../assets/icons/chevronLeft.svg.js"),t=require("../../assets/icons/chevronRight.svg.js"),n=require("./TablePagination.styled.js"),a=require("../../constants/Theme.js"),i=require("../dropdown/Dropdown.js"),r=require("../TypographyStyle.js");exports.TablePagination=o=>{let{pageNumber:l,pageSize:c,totalRows:d,updatePageNumber:g,updatePageSize:h,hidePageSizeOptions:j}=o;const p=a.DEFAULT_THEME.colorsV2,u=(l-1)*c+1,y=(l-1)*c+c,b=Math.ceil(d/c),x=1==b;let v=[];v=b>=5?l===b?[l-4,l-3,l-2,l-1,l]:1===l?[l,l+1,l+2,l+3,l+4]:2===l?[l-1,l,l+1,l+2,l+3]:l===b-1?[l-3,l-2,l-1,l,l+1]:[l-2,l-1,l,l+1,l+2]:Array.from({length:b},((e,s)=>s+1));const m=[{label:"5 rows per page",value:"5",selected:5===c},{label:"10 rows per page",value:"10",selected:10===c},{label:"20 rows per page",value:"20",selected:20===c}];return e.jsxs(n.StyledTablePaginationContainer,{children:[!j&&e.jsx("div",{children:e.jsx(i.Dropdown,{size:"small",options:m,onSelect:h,width:"162px"})}),e.jsxs("div",Object.assign({className:"paging__container"},{children:[!j&&d&&e.jsxs(r.BodySecondary,Object.assign({style:{color:p.content.placeholder,marginRight:8}},{children:["Showing ",u,"-",y>d?d:y," of"," ",d," results"]})),e.jsxs("div",Object.assign({className:"pages__buttons-container"},{children:[!x&&e.jsx(n.StyledPagingContainer,Object.assign({active:!1,onClick:()=>{1!==l&&g(Math.max(l-1,1))},disabled:1===l},{children:e.jsx(s.default,{color:p.content.secondary,height:14,width:14})})),v.map((s=>e.jsx(n.StyledPagingContainer,Object.assign({active:s==l,onClick:()=>g(s),style:{display:1==s&&d<=c?"none":"flex"}},{children:e.jsx(r.BodySecondary,Object.assign({style:{color:s==l?p.content.primaryInverse:p.content.secondary}},{children:s}))}),s))),!x&&e.jsx(n.StyledPagingContainer,Object.assign({isLast:!0,active:!1,onClick:()=>{l!==b&&g(Math.min(l+1,b))},disabled:l===b},{children:e.jsx(t.default,{color:p.content.secondary,height:14,width:14})}))]}))]}))]})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),s=require("../../assets/icons/back_icon.svg.js"),i=require("../../assets/icons/chevronRightAlt.svg.js"),t=require("../../assets/icons/cross.svg.js"),l=require("../../assets/icons/plus.svg.js"),n=require("../../assets/icons/undo.svg.js"),r=require("react"),c=require("./AddVariableV2.styled.js"),o=require("../button/Button.js"),d=require("../icon-button/IconButton.js"),b=require("../searchBar/searchBar.js"),u=require("../tooltips/Tooltip.js"),v=require("../../constants/Theme.js"),j=require("../modals/modal.styled.js"),g=require("../switch/Switch.js"),h=require("../TypographyStyle.js");const m=r.memo((m=>{const{data:p,hasHeader:y=!0,needsBorder:x=!0,styledCloseBtn:f=!1,readonly:O=!1}=m,[S,N]=r.useState({}),[C,V]=r.useState(),[w,_]=r.useState(""),[T,B]=r.useState(""),[k,q]=r.useState(!0),L=/^[^.]*\.[^.]*$/,[F,I]=r.useState(m.data),[E,A]=r.useState(!0);r.useEffect((()=>{const e={};p.forEach((a=>{e[a.displayName]=[]})),V(e)}),[p]),r.useEffect((()=>{z(!0)}),[]),r.useEffect((()=>{z(E,!w)}),[S,w]),r.useEffect((()=>{A(!0),B(""),R([],w),V((e=>Object.assign(Object.assign({},e),{[w]:[]}))),_("");const e=m.data.map((e=>M(e))).filter((e=>null!==e));I(e),e.length>0?q(!0):q(!1)}),[m.reRender]),r.useEffect((()=>{let e=m.data;w&&(e=[S[w]]);H(e,E).length>0?q(!0):q(!1)}),[T]);const H=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return e.flatMap((e=>Object.keys(e.variables).filter((s=>{var i;return(null===(i=e.variables[s].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))&&(!a||e.variables[s].isAvailable===a)||P(e.variables[s])}))))},R=(e,a)=>{const s=p.find((e=>e.displayName===a));if(s){let i=s;e.forEach(((e,a)=>{i=i.variables[e]})),N((e=>Object.assign(Object.assign({},e),{[a]:i})))}},P=e=>{let a=!1;if(e.isSubHeader&&e.variables){const s=Object.keys(e.variables);for(let i=0;i<s.length;i++){const t=s[i];if(e.variables&&e.variables[t].displayName.toLowerCase().includes(T.toLowerCase())&&e.variables[t].isAvailable===E){a=!0;break}}}return a},z=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(A(e),e){let s=[];if(!w||a)s=m.data.map((e=>M(e))).filter((e=>null!==e));else{const e=S[w];s=m.data.filter((e=>e.displayName===w)).map((a=>M(a,e))).filter((e=>null!=e))}I(s),T&&(s=H(s,e)),s.length>0?q(!0):q(!1)}else if(I(m.data),T){H(m.data,e).length>0?q(!0):q(!1)}else q(!0)};function M(e,a){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(a)for(const i in e.variables)if(e.variables[i].displayName===a.displayName)for(const a in e.variables[i].variables)e.variables[i].variables[a].isAvailable&&(s[a]=e.variables[i].variables[a]);else e.variables[i].isSubHeader&&M(e.variables[i],a,s);else for(const a in e.variables)e.variables[a].isAvailable&&(s[a]=e.variables[a]);return 0===Object.keys(s).length?null:Object.assign(Object.assign({},e),{variables:s})}const $=e=>{const s=e.item.description;return e.readonly?a.jsx("div",{children:a.jsx(W,{item:e.item,readonly:e.readonly})}):a.jsx(a.Fragment,{children:a.jsx(u.Tooltip,Object.assign({body:"",tooltipContent:a.jsx(h.BodyCaption,Object.assign({color:v.COLORS.content.primaryInverse,style:{whiteSpace:"pre-line",padding:8}},{children:e.item.isAvailable?s?`• ${s}\n• Recommended here`:"Recommended here":"Not recommended here"})),width:300,delay:300,placement:"bottom"},{children:a.jsx("div",{children:a.jsx(W,{item:e.item})})}))})},W=e=>a.jsx(o.Button,{darkMode:m.enableVariable?m.enableVariable:e.item.isAvailable,size:"chip",disabled:!!e.readonly&&!e.item.isSubHeader,LeadingIcon:e.item.isSubHeader||e.readonly?void 0:l.default,TrailingIcon:()=>e.item.isSubHeader?a.jsx("div",Object.assign({className:"icon-trailing",style:{display:"flex"}},{children:a.jsx(i.default,{})})):a.jsx(a.Fragment,{}),buttonText:e.item.displayName}),D=(e,s)=>E&&!e.isAvailable?a.jsx(a.Fragment,{}):a.jsx("div",Object.assign({onClick:e.isSubHeader?()=>{H([e],E).length||q(!1),B("");const a=[...C[w],s];R(a,w),V((e=>Object.assign(Object.assign({},e),{[w]:a})))}:()=>{m.customTrigger?(m.customTrigger(e),m.setShowVariable(!1)):m.isEvaluationList?J(e):m.setVariableValue(m.selectWithTypes?{actualValue:e.actualValue,variableType:e.variableType,needsFetching:e.needsFetching}:e.actualValue)}},{children:a.jsx($,{item:e,readonly:O})})),G=(e,a)=>{const s=[...C[e.displayName],a];R(s,e.displayName),V((a=>Object.assign(Object.assign({},a),{[e.displayName]:s}))),_(e.displayName)},J=e=>{if(e.actualValue.match(L)){const a=e.actualValue.replace("{{","").replace("}}","").split("."),s=a[0]+`['${a[1]}']`;m.setVariableValue(m.selectWithTypes?{actualValue:s,variableType:e.variableType,needsFetching:e.needsFetching}:s)}else{const a=e.actualValueEval?e.actualValueEval:e.actualValue;m.setVariableValue(m.selectWithTypes?{actualValue:a,variableType:e.variableType,needsFetching:e.needsFetching}:a)}},K=(e,a)=>{if(m.customTrigger)m.customTrigger(e.variables[a]),m.setShowVariable(!1);else if(m.isEvaluationList){const s=e.variables[a];J(s)}else m.setVariableValue(m.selectWithTypes?{actualValue:e.variables[a].actualValue,variableType:e.variables[a].variableType,needsFetching:e.variables[a].needsFetching}:e.variables[a].actualValue)},Q=m.isModalState?void 0:{top:`${m.topPosition?m.topPosition:"small"===m.pickerSize?"300px":"60px"}`,left:`${m.leftPosition?m.leftPosition+24:430}px`};return a.jsx("div",Object.assign({id:"varList",tabIndex:-1},{children:a.jsxs(c.AddVariableStyled,Object.assign({style:Q,onClick:e=>{e.stopPropagation()},pickerSize:m.pickerSize||"large",isModalState:m.isModalState,positionStrategy:m.positionStrategy,zIndex:m.zindex,height:m.height,needsBorder:x,width:m.width},{children:[f&&a.jsx(j.CloseButtonContainer,Object.assign({onClick:()=>{m.setShowVariable(!1)},style:{zIndex:300}},{children:a.jsx(t.default,{height:20,width:20,color:v.COLORS.content.secondary})})),m.showVariable&&a.jsxs("div",Object.assign({className:"popup"},{children:[a.jsxs("div",Object.assign({className:"sticky__bar"},{children:[y&&a.jsxs("div",Object.assign({className:"header__bar"},{children:[a.jsx("div",Object.assign({className:"add__variable"},{children:"Add a new variable"})),!f&&a.jsx("div",Object.assign({onClick:()=>{m.setShowVariable(!1)},style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:a.jsx(d.IconButton,{iconButtonType:"default",Icon:t.default})}))]})),a.jsxs("div",Object.assign({className:"search__bar",onBlur:e=>{m.onSearchBlur&&m.onSearchBlur(e)}},{children:[a.jsx(b.SearchBar,{width:"100%",isEnabled:!0,onChange:e=>{B(e)},onEnter:()=>{},reset:!T,placeholder:"Search...",variant:"default"}),a.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",marginTop:8,justifyContent:"space-between"}},{children:[a.jsx(h.BodySecondary,Object.assign({style:{color:v.COLORS.content.secondary}},{children:"Show only recommended variables"})),a.jsx(g.Switch,{value:E,onValueChange:a=>e.__awaiter(void 0,void 0,void 0,(function*(){return yield z(a)}))})]}))]})),w&&C[w].length>0&&a.jsxs("div",Object.assign({className:"nav__bar"},{children:[a.jsxs("div",Object.assign({className:"left__nav"},{children:[a.jsx(d.IconButton,{Icon:s.default,style:{color:"#919191",display:"flex"},onClick:()=>{B("");const e=C[w].slice(0,-1);R(e,w),V((a=>Object.assign(Object.assign({},a),{[w]:e}))),e.length||_("")}}),a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx(h.TitleSmall,{children:S[w].displayName}),S[w].description&&a.jsx(h.BodyCaption,{children:S[w].description})]}))]})),a.jsxs("div",Object.assign({className:"right__nav"},{children:[a.jsx(d.IconButton,{Icon:n.default,style:{display:"flex"},onClick:()=>{B(""),R([],w),V((e=>Object.assign(Object.assign({},e),{[w]:[]}))),_("")}}),a.jsx("div",{children:"First page"})]}))]}))]})),!k&&a.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",marginTop:16}},{children:[a.jsx(h.TitleSmall,{children:"No results found!"}),E?a.jsx(h.BodyCaption,{children:"Sorry we could not find any recommended variables"}):a.jsx(h.BodyCaption,{children:`Sorry we could not find any results for "${T}"`})]})),a.jsx("div",Object.assign({className:"wrapper"},{children:a.jsx("div",Object.assign({className:"list__map"},{children:a.jsxs("div",Object.assign({className:"items"},{children:[!w&&F.map((e=>{let s=[];return T&&(s=Object.keys(e.variables).filter((a=>{var s;return(null===(s=e.variables[a].displayName)||void 0===s?void 0:s.toLowerCase().includes(T.toLowerCase()))||P(e.variables[a])}))),a.jsxs(a.Fragment,{children:[T?s.length>0?a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a.jsx(h.BodyCaption,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})):a.jsx(a.Fragment,{}):a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a.jsx(h.BodyCaption,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})),Object.keys(e.variables).map((s=>{var i;return T?(null===(i=e.variables[s].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))||P(e.variables[s])?a.jsx("div",Object.assign({onClick:e.variables[s].isSubHeader?()=>G(e,s):()=>K(e,s)},{children:a.jsx($,{item:e.variables[s],readonly:O})})):a.jsx(a.Fragment,{}):a.jsx("div",Object.assign({onClick:e.variables[s].isSubHeader?()=>G(e,s):()=>K(e,s)},{children:a.jsx($,{item:e.variables[s],readonly:O})}))}))]})})),w&&a.jsx("div",Object.assign({className:"list__map"},{children:a.jsx("div",Object.assign({className:"items",style:{marginTop:16}},{children:Object.keys(S[w].variables).map(((e,s)=>{var i;return T?(null===(i=S[w].variables[e].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))||P(S[w].variables[e])?D(S[w].variables[e],e):a.jsx(a.Fragment,{}):D(S[w].variables[e],e)}))}))}))]}))}))})),a.jsx("div",{className:"bottom__padding"})]}))]}))}))}),((e,a)=>e.enableVariable===a.enableVariable&&(e.leftPosition===a.leftPosition&&e.reRender===a.reRender)));exports.AddVariableV2=m;
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../_virtual/_tslib.js"),a=require("react/jsx-runtime"),s=require("../../assets/icons/back_icon.svg.js"),i=require("../../assets/icons/chevronRightAlt.svg.js"),t=require("../../assets/icons/cross.svg.js"),l=require("../../assets/icons/plus.svg.js"),n=require("../../assets/icons/undo.svg.js"),r=require("react"),c=require("./AddVariableV2.styled.js"),o=require("../button/Button.js"),d=require("../icon-button/IconButton.js"),b=require("../searchBar/searchBar.js"),u=require("../tooltips/Tooltip.js"),v=require("../../constants/Theme.js"),j=require("../modals/modal.styled.js"),g=require("../switch/Switch.js"),h=require("../TypographyStyle.js");const m=r.memo((m=>{const{data:p,hasHeader:y=!0,needsBorder:x=!0,styledCloseBtn:f=!1,readonly:O=!1}=m,[S,N]=r.useState({}),[C,V]=r.useState(),[w,_]=r.useState(""),[T,B]=r.useState(""),[k,q]=r.useState(!0),L=/^[^.]*\.[^.]*$/,[F,I]=r.useState(m.data),[E,A]=r.useState(!0);r.useEffect((()=>{const e={};p.forEach((a=>{e[a.displayName]=[]})),V(e)}),[p]),r.useEffect((()=>{z(!0)}),[]),r.useEffect((()=>{z(E,!w)}),[S,w]),r.useEffect((()=>{A(!0),B(""),R([],w),V((e=>Object.assign(Object.assign({},e),{[w]:[]}))),_("");const e=m.data.map((e=>M(e))).filter((e=>null!==e));I(e),e.length>0?q(!0):q(!1)}),[m.reRender]),r.useEffect((()=>{let e=m.data;w&&(e=[S[w]]);H(e,E).length>0?q(!0):q(!1)}),[T]);const H=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return e.flatMap((e=>Object.keys(e.variables).filter((s=>{var i;return(null===(i=e.variables[s].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))&&(!a||e.variables[s].isAvailable===a)||P(e.variables[s])}))))},R=(e,a)=>{const s=p.find((e=>e.displayName===a));if(s){let i=s;e.forEach(((e,a)=>{i=i.variables[e]})),N((e=>Object.assign(Object.assign({},e),{[a]:i})))}},P=e=>{let a=!1;if(e.isSubHeader&&e.variables){const s=Object.keys(e.variables);for(let i=0;i<s.length;i++){const t=s[i];if(e.variables&&e.variables[t].displayName.toLowerCase().includes(T.toLowerCase())&&e.variables[t].isAvailable===E){a=!0;break}}}return a},z=function(e){let a=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(A(e),e){let s=[];if(!w||a)s=m.data.map((e=>M(e))).filter((e=>null!==e));else{const e=S[w];s=m.data.filter((e=>e.displayName===w)).map((a=>M(a,e))).filter((e=>null!=e))}I(s),T&&(s=H(s,e)),s.length>0?q(!0):q(!1)}else if(I(m.data),T){H(m.data,e).length>0?q(!0):q(!1)}else q(!0)};function M(e,a){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(a)for(const i in e.variables)if(e.variables[i].displayName===a.displayName)for(const a in e.variables[i].variables)e.variables[i].variables[a].isAvailable&&(s[a]=e.variables[i].variables[a]);else e.variables[i].isSubHeader&&M(e.variables[i],a,s);else for(const a in e.variables)e.variables[a].isAvailable&&(s[a]=e.variables[a]);return 0===Object.keys(s).length?null:Object.assign(Object.assign({},e),{variables:s})}const $=e=>{const s=e.item.description;return e.readonly?a.jsx("div",{children:a.jsx(W,{item:e.item,readonly:e.readonly})}):a.jsx(a.Fragment,{children:a.jsx(u.Tooltip,Object.assign({body:"",tooltipContent:a.jsx(h.BodyCaption,Object.assign({color:v.COLORS.content.primaryInverse,style:{whiteSpace:"pre-line",padding:8}},{children:e.item.isAvailable?s?`• ${s}\n• Recommended here`:"Recommended here":"Not recommended here"})),width:300,delay:300,placement:"bottom"},{children:a.jsx("div",{children:a.jsx(W,{item:e.item})})}))})},W=e=>a.jsx(o.Button,{darkMode:m.enableVariable?m.enableVariable:e.item.isAvailable,size:"chip",disabled:!!e.readonly&&!e.item.isSubHeader,LeadingIcon:e.item.isSubHeader||e.readonly?void 0:l.default,TrailingIcon:()=>e.item.isSubHeader?a.jsx("div",Object.assign({className:"icon-trailing",style:{display:"flex"}},{children:a.jsx(i.default,{})})):a.jsx(a.Fragment,{}),buttonText:e.item.displayName}),D=(e,s)=>E&&!e.isAvailable?a.jsx(a.Fragment,{}):a.jsx("div",Object.assign({onClick:e.isSubHeader?()=>{H([e],E).length||q(!1),B("");const a=[...C[w],s];R(a,w),V((e=>Object.assign(Object.assign({},e),{[w]:a})))}:()=>{m.customTrigger?(m.customTrigger(e),m.setShowVariable(!1)):m.isEvaluationList?J(e):m.setVariableValue(m.selectWithTypes?{actualValue:e.actualValue,variableType:e.variableType,needsFetching:e.needsFetching}:e.actualValue)}},{children:a.jsx($,{item:e,readonly:O})})),G=(e,a)=>{const s=[...C[e.displayName],a];R(s,e.displayName),V((a=>Object.assign(Object.assign({},a),{[e.displayName]:s}))),_(e.displayName)},J=e=>{if(e.actualValue.match(L)){const a=e.actualValue.replace("{{","").replace("}}","").split("."),s=a[0]+`['${a[1]}']`;m.setVariableValue(m.selectWithTypes?{actualValue:s,variableType:e.variableType,needsFetching:e.needsFetching}:s)}else{const a=e.actualValueEval?e.actualValueEval:e.actualValue;m.setVariableValue(m.selectWithTypes?{actualValue:a,variableType:e.variableType,needsFetching:e.needsFetching}:a)}},K=(e,a)=>{if(m.customTrigger)console.log("props.customTrigger"),m.customTrigger(e.variables[a]),m.setShowVariable(!1);else if(m.isEvaluationList){const s=e.variables[a];J(s)}else m.setVariableValue(m.selectWithTypes?{actualValue:e.variables[a].actualValue,variableType:e.variables[a].variableType,needsFetching:e.variables[a].needsFetching}:e.variables[a].actualValue)},Q=m.isModalState?void 0:{top:`${m.topPosition?m.topPosition:"small"===m.pickerSize?"300px":"60px"}`,left:`${m.leftPosition?m.leftPosition+24:430}px`};return a.jsx("div",Object.assign({id:"varList",tabIndex:-1},{children:a.jsxs(c.AddVariableStyled,Object.assign({style:Q,onClick:e=>{e.stopPropagation()},pickerSize:m.pickerSize||"large",isModalState:m.isModalState,positionStrategy:m.positionStrategy,zIndex:m.zindex,height:m.height,needsBorder:x,width:m.width},{children:[f&&a.jsx(j.CloseButtonContainer,Object.assign({onClick:()=>{m.setShowVariable(!1)},style:{zIndex:300}},{children:a.jsx(t.default,{height:20,width:20,color:v.COLORS.content.secondary})})),m.showVariable&&a.jsxs("div",Object.assign({className:"popup"},{children:[a.jsxs("div",Object.assign({className:"sticky__bar"},{children:[y&&a.jsxs("div",Object.assign({className:"header__bar"},{children:[a.jsx("div",Object.assign({className:"add__variable"},{children:"Add a new variable"})),!f&&a.jsx("div",Object.assign({onClick:()=>{m.setShowVariable(!1)},style:{display:"flex",alignItems:"center",justifyContent:"center"}},{children:a.jsx(d.IconButton,{iconButtonType:"default",Icon:t.default})}))]})),a.jsxs("div",Object.assign({className:"search__bar",onBlur:e=>{m.onSearchBlur&&m.onSearchBlur(e)}},{children:[a.jsx(b.SearchBar,{width:"100%",isEnabled:!0,onChange:e=>{B(e)},onEnter:()=>{},reset:!T,placeholder:"Search...",variant:"default"}),a.jsxs("div",Object.assign({style:{display:"flex",alignItems:"center",marginTop:8,justifyContent:"space-between"}},{children:[a.jsx(h.BodySecondary,Object.assign({style:{color:v.COLORS.content.secondary}},{children:"Show only recommended variables"})),a.jsx(g.Switch,{value:E,onValueChange:a=>e.__awaiter(void 0,void 0,void 0,(function*(){return yield z(a)}))})]}))]})),w&&C[w].length>0&&a.jsxs("div",Object.assign({className:"nav__bar"},{children:[a.jsxs("div",Object.assign({className:"left__nav"},{children:[a.jsx(d.IconButton,{Icon:s.default,style:{color:"#919191",display:"flex"},onClick:()=>{B("");const e=C[w].slice(0,-1);R(e,w),V((a=>Object.assign(Object.assign({},a),{[w]:e}))),e.length||_("")}}),a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx(h.TitleSmall,{children:S[w].displayName}),S[w].description&&a.jsx(h.BodyCaption,{children:S[w].description})]}))]})),a.jsxs("div",Object.assign({className:"right__nav"},{children:[a.jsx(d.IconButton,{Icon:n.default,style:{display:"flex"},onClick:()=>{B(""),R([],w),V((e=>Object.assign(Object.assign({},e),{[w]:[]}))),_("")}}),a.jsx("div",{children:"First page"})]}))]}))]})),!k&&a.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",marginTop:16}},{children:[a.jsx(h.TitleSmall,{children:"No results found!"}),E?a.jsx(h.BodyCaption,{children:"Sorry we could not find any recommended variables"}):a.jsx(h.BodyCaption,{children:`Sorry we could not find any results for "${T}"`})]})),a.jsx("div",Object.assign({className:"wrapper"},{children:a.jsx("div",Object.assign({className:"list__map"},{children:a.jsxs("div",Object.assign({className:"items"},{children:[!w&&F.map((e=>{let s=[];return T&&(s=Object.keys(e.variables).filter((a=>{var s;return(null===(s=e.variables[a].displayName)||void 0===s?void 0:s.toLowerCase().includes(T.toLowerCase()))||P(e.variables[a])}))),a.jsxs(a.Fragment,{children:[T?s.length>0?a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a.jsx(h.BodyCaption,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})):a.jsx(a.Fragment,{}):a.jsxs("div",Object.assign({className:"block"},{children:[a.jsx("div",Object.assign({className:"heading__font"},{children:null==e?void 0:e.displayName})),a.jsx(h.BodyCaption,Object.assign({style:{marginBottom:8,color:"#616161"}},{children:null==e?void 0:e.description}))]})),Object.keys(e.variables).map((s=>{var i;return T?(null===(i=e.variables[s].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))||P(e.variables[s])?a.jsx("div",Object.assign({onClick:e.variables[s].isSubHeader?()=>G(e,s):()=>K(e,s)},{children:a.jsx($,{item:e.variables[s],readonly:O})})):a.jsx(a.Fragment,{}):a.jsx("div",Object.assign({onClick:e.variables[s].isSubHeader?()=>G(e,s):()=>K(e,s)},{children:a.jsx($,{item:e.variables[s],readonly:O})}))}))]})})),w&&a.jsx("div",Object.assign({className:"list__map"},{children:a.jsx("div",Object.assign({className:"items",style:{marginTop:16}},{children:Object.keys(S[w].variables).map(((e,s)=>{var i;return T?(null===(i=S[w].variables[e].displayName)||void 0===i?void 0:i.toLowerCase().includes(T.toLowerCase()))||P(S[w].variables[e])?D(S[w].variables[e],e):a.jsx(a.Fragment,{}):D(S[w].variables[e],e)}))}))}))]}))}))})),a.jsx("div",{className:"bottom__padding"})]}))]}))}))}),((e,a)=>e.enableVariable===a.enableVariable&&(e.leftPosition===a.leftPosition&&e.reRender===a.reRender)));exports.AddVariableV2=m;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { ALERT_TYPES } from "./AlertHelper";
|
|
2
|
+
import { ALERT_TYPES, CONTENT_POSITION } from "./AlertHelper";
|
|
3
3
|
export type AlertProps = {
|
|
4
4
|
type: ALERT_TYPES;
|
|
5
5
|
text: string;
|
|
@@ -9,5 +9,7 @@ export type AlertProps = {
|
|
|
9
9
|
color: string;
|
|
10
10
|
}>;
|
|
11
11
|
textColor?: string;
|
|
12
|
+
contentPosition?: CONTENT_POSITION;
|
|
13
|
+
containerStyle?: React.CSSProperties;
|
|
12
14
|
};
|
|
13
15
|
export declare const Alert: React.FC<AlertProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("./Alert.styled.js"),r=require("./AlertHelper.js"),s=require("../TypographyStyle.js");exports.Alert=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("./Alert.styled.js"),r=require("./AlertHelper.js"),s=require("../TypographyStyle.js");exports.Alert=i=>e.jsxs(t.AlertStyle,Object.assign({type:i.type,contentPosition:i.contentPosition,style:i.containerStyle},{children:[i.icon&&e.jsx("div",Object.assign({style:{display:"flex"}},{children:e.jsx(i.icon,{color:r.COLOR_CONFIG_MAP[i.type].textColor,height:20,width:20})})),e.jsx(s.BodyCaption,Object.assign({style:{color:i.textColor||r.COLOR_CONFIG_MAP[i.type].textColor,marginLeft:12}},{children:i.text}))]}));
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import { ALERT_TYPES } from "./AlertHelper";
|
|
1
|
+
import { ALERT_TYPES, CONTENT_POSITION } from "./AlertHelper";
|
|
2
2
|
export declare const AlertStyle: import("styled-components").StyledComponent<"div", any, {
|
|
3
3
|
type: ALERT_TYPES;
|
|
4
|
+
contentPosition?: CONTENT_POSITION | undefined;
|
|
4
5
|
}, never>;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("./AlertHelper.js");function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const o=r(e).default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
align-items: center;
|
|
4
|
-
justify-content:
|
|
4
|
+
justify-content: ${e=>e.contentPosition||t.CONTENT_POSITION.CENTER};
|
|
5
5
|
padding: 8px 16px;
|
|
6
|
-
background-color: ${e=>
|
|
6
|
+
background-color: ${e=>t.COLOR_CONFIG_MAP[e.type].backgroundColor};
|
|
7
7
|
border-radius: 4px;
|
|
8
|
-
border: 1px solid ${e=>
|
|
8
|
+
border: 1px solid ${e=>t.COLOR_CONFIG_MAP[e.type].borderColor};
|
|
9
9
|
`;exports.AlertStyle=o;
|
|
@@ -5,6 +5,11 @@ export declare enum ALERT_TYPES {
|
|
|
5
5
|
NEUTRAL = "Neutral",
|
|
6
6
|
BRAND = "Brand"
|
|
7
7
|
}
|
|
8
|
+
export declare enum CONTENT_POSITION {
|
|
9
|
+
START = "start",
|
|
10
|
+
CENTER = "center",
|
|
11
|
+
END = "end"
|
|
12
|
+
}
|
|
8
13
|
export declare const COLOR_CONFIG_MAP: {
|
|
9
14
|
Negative: {
|
|
10
15
|
backgroundColor: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o,r=require("../../constants/Theme.js");exports.ALERT_TYPES=void 0,(o=exports.ALERT_TYPES||(exports.ALERT_TYPES={})).NEGATIVE="Negative",o.WARNING="Warning",o.POSITIVE="Positive",o.NEUTRAL="Neutral",o.BRAND="Brand";const
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o,r,t=require("../../constants/Theme.js");exports.ALERT_TYPES=void 0,(o=exports.ALERT_TYPES||(exports.ALERT_TYPES={})).NEGATIVE="Negative",o.WARNING="Warning",o.POSITIVE="Positive",o.NEUTRAL="Neutral",o.BRAND="Brand",exports.CONTENT_POSITION=void 0,(r=exports.CONTENT_POSITION||(exports.CONTENT_POSITION={})).START="start",r.CENTER="center",r.END="end";const e={[exports.ALERT_TYPES.NEGATIVE]:{backgroundColor:t.COLORS.background.negative.light,textColor:t.COLORS.content.negative,borderColor:t.COLORS.stroke.negative.lightAlt},[exports.ALERT_TYPES.WARNING]:{backgroundColor:t.COLORS.background.warning.light,textColor:t.COLORS.content.warning,borderColor:t.COLORS.stroke.warning.lightAlt},[exports.ALERT_TYPES.POSITIVE]:{backgroundColor:t.COLORS.background.positive.light,textColor:t.COLORS.content.positive,borderColor:t.COLORS.stroke.positive.lightAlt},[exports.ALERT_TYPES.NEUTRAL]:{backgroundColor:t.COLORS.surface.subdued,textColor:t.COLORS.content.secondary,borderColor:t.COLORS.stroke.primary},[exports.ALERT_TYPES.BRAND]:{backgroundColor:t.COLORS.background.brandLight,textColor:t.COLORS.content.brand,borderColor:t.COLORS.stroke.brandLightAlt}};exports.COLOR_CONFIG_MAP=e;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("date-fns"),t=require("react"),o=require("./DateSelector/DateSelector.js"),s=require("../dropdown/DropdownPopover/index.js");require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("../zeroState/ZeroState.js");var n=require("../TypographyStyle.js");require("../../constants/Theme.js"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js");var i=require("../input/Input.js");require("../dropdown/MenuItem/MenuItem.js");var d=require("../../utils/DateUtils.js"),u=require("../../assets/icons/chevronDown.svg.js"),a=require("../../assets/icons/clock.svg.js"),l=require("./CustomDateTime.styled.js");const c=
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("date-fns"),t=require("react"),o=require("./DateSelector/DateSelector.js"),s=require("../dropdown/DropdownPopover/index.js");require("../dropdown/Dropdown.js"),require("../dropdown/ChipDropdown.js"),require("../zeroState/ZeroState.js");var n=require("../TypographyStyle.js");require("../../constants/Theme.js"),require("../dropdown/OpenedDropdown/components/description/Description.styled.js"),require("../checkBox/CheckBox.styled.js"),require("../list-item/ListItem.js"),require("../dropdown/OpenedDropdown/components/menu/FreeFormMenu.styled.js"),require("../dropdown/OpenedDropdown/components/menu/MenuItem.js"),require("../dropdown/OpenedDropdown/components/menu/MenuList.styled.js"),require("../button/Button.js"),require("../dropdown/OpenedDropdown/components/multiSelect/MultiSelectDropdownBottomBar.styled.js"),require("../dropdown/OpenedDropdown/components/OpennedDropdown.styled.js");var i=require("../input/Input.js");require("../dropdown/MenuItem/MenuItem.js");var d=require("../../utils/DateUtils.js"),u=require("../../assets/icons/chevronDown.svg.js"),a=require("../../assets/icons/clock.svg.js"),l=require("./CustomDateTime.styled.js");const c=e=>{const r=[];for(let t=0;t<2;t++)for(let o=0;o<12;o++){let s;s=0===o?"12":o<10?`0${o}`:`${o}`;const n=`${s}:00 ${0===t?"AM":"PM"}`,i=`${s}:30 ${0===t?"AM":"PM"}`;r.push({label:n,value:n,selected:n===e},{label:i,value:i,selected:i===e})}return r};exports.CustomDateTime=p=>{const[m,j]=t.useState(p.time),[D,w]=t.useState(p.date);t.useEffect((()=>{p.setError(void 0);const e=d.default.convert12HourTimeTo24Hour(m),t=r.format(new Date,"HH:mm:ss");if(r.isToday(D)&&e<t)return void p.setError("Selected time should be later than current time");p.setError(void 0);const[o,s]=e.split(":"),n=new Date(D.getTime());n.setHours(+o,+s),p.onChange(n)}),[D,m]);return e.jsxs(l.CustomDateTimeStyle,{children:[e.jsxs("div",Object.assign({style:{display:"flex",gap:16}},{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(o.default,{customDate:D,setCustomDate:w,placement:p.placement,minDate:p.minDate})})),e.jsx("div",Object.assign({style:{flex:1}},{children:e.jsx(s.DropdownPopover,Object.assign({options:c(m),onSelect:e=>{j(e.value)}},{children:e.jsx(i.Input,{value:m,leftIcon:{icon:a.default},rightIcon:{icon:u.default},onChangeText:e=>(e=>{if(d.default.timeFormatValidation(e)){const t=d.default.convert12HourTimeTo24Hour(e),o=r.format(new Date,"HH:mm:ss");if(r.isToday(D)&&t<o)return void p.setError("Selected time should be later than current time");p.setError(void 0),j(e)}else p.setError('Format of time should be "HH:MM AM" or "HH:MM PM"')})(e)})}))}))]})),p.error&&e.jsx(n.BodySecondary,Object.assign({style:{paddingTop:8}},{children:p.error}))]})};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../button/Button.js"),i=require("./Input-helper.js"),r=require("../TypographyStyle.js"),s=require("../../assets/icons/errorInfo.svg.js"),l=require("./context/InputStyleProvider.js"),o=require("./Input.styled.js");const a=t.forwardRef(((a,u)=>{var c,d,v,h,p;const{placeholder:f,leftIcon:x,rightIcon:g,labelText:j,maxCharLimit:y,isRequired:b,hintText:I,type:C,state:m,validate:w,variant:E,button:S,suffixText:O,prefixText:k,onChangeText:q,value:F,noErrorHint:H,reset:L,rangeValidation:M,noKeyDownChange:T,version:B,noMaxCharCheck:D}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},a),R=null==x?void 0:x.icon,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),n=require("../button/Button.js"),i=require("./Input-helper.js"),r=require("../TypographyStyle.js"),s=require("../../assets/icons/errorInfo.svg.js"),l=require("./context/InputStyleProvider.js"),o=require("./Input.styled.js");const a=t.forwardRef(((a,u)=>{var c,d,v,h,p;const{placeholder:f,leftIcon:x,rightIcon:g,labelText:j,maxCharLimit:y,isRequired:b,hintText:I,type:C,state:m,validate:w,variant:E,button:S,suffixText:O,prefixText:k,onChangeText:q,value:F,noErrorHint:H,reset:L,rangeValidation:M,noKeyDownChange:T,version:B,noMaxCharCheck:D}=Object.assign({maxCharLimit:0,type:"text",variant:"default"},a),R=null==x?void 0:x.icon,z=null==g?void 0:g.icon,[A,K]=t.useState(!1),[P,W]=t.useState(!1),[_,N]=t.useState(),V="small"===E?"18px":"22px",G=t.useContext(l.InputStyleContext),[J,Q]=t.useState(),U=t.useRef(null),X=null!=u?u:U;t.useEffect((()=>{Q(F)}),[F]),t.useEffect((()=>{var e;X.current&&(null===(e=a.onReferenceInit)||void 0===e||e.call(a,X.current))}),[X]),t.useEffect((()=>{const e=X.current;if(e&&["phonenumber","zip","number"].includes(C))return e.addEventListener("wheel",ee,{passive:!1}),()=>{e.removeEventListener("wheel",ee)}}),[]),t.useEffect((()=>{L&&Q("")}),[L]),t.useEffect((()=>{var e;W(!!a.isActive),a.isActive&&(null===(e=X.current)||void 0===e||e.focus())}),[a.isActive]),t.useEffect((()=>{N(a.errorMessage)}),[a.errorMessage]),t.useEffect((()=>{var e;K(!1),("invalid"===a.state||_)&&K(!0),"active"===a.state&&(null===(e=X.current)||void 0===e||e.focus())}),[a.state,_]),t.useEffect((()=>{K(!!_)}),[_]);const Y=function(e){if(i.isFunction(e)){for(var t=arguments.length,n=new Array(t>1?t-1:0),r=1;r<t;r++)n[r-1]=arguments[r];e(...n)}},Z=()=>"zip"===C?6:60,$=e=>{const t=0!==y?y:Z();if(T||q(F||"",e),D)return;const n=e.target.value;![8].includes(e.which)&&t>0&&n.length>=t&&e.preventDefault()},ee=e=>{e.preventDefault()},te=e=>{const t=e.target.value,n=0!==y?y+1:Z();if(!D&&n>0&&t.length>=n)return void e.preventDefault();q(t,e),a.textControl||Q(t);const r=w||i.validateInput;if(!r||!i.isFunction(r))return;const[s,l]=r(t,C,M);K(!s),N(a.errorMessage?a.errorMessage:l)},ne=e=>{var t;a.skipFocus||W(!0),Y(null===(t=a.onFocus)||void 0===t?void 0:t.call(a,e))},ie=e=>{var t;a.skipFocus||W(!1),Y(null===(t=a.onBlur)||void 0===t?void 0:t.call(a,e))},re=()=>{var t;return e.jsxs(e.Fragment,{children:["multiline"!==C&&e.jsx("input",{id:a.id,style:null!==(t=null==G?void 0:G.input)&&void 0!==t?t:{},ref:X,type:["phonenumber","zip","number"].includes(C)?"number":C,value:J,onFocus:e=>ne(e),onBlur:e=>ie(e),placeholder:f||"Enter here",onChange:te,onKeyDown:e=>$(e)}),"multiline"===C&&e.jsx("textarea",{value:J,ref:X,onFocus:e=>ne(e),onBlur:e=>ie(e),placeholder:f||"Enter here",onChange:te,onKeyDown:e=>$(e),maxLength:y>0?y:void 0})]})};return e.jsxs(o.RootContainer,Object.assign({width:a.width,height:a.height,state:m,type:C,style:null!==(c=null==G?void 0:G.RootContainer)&&void 0!==c?c:{}},{children:[!H&&(!!I||!!_)&&e.jsxs(o.InputFooter,Object.assign({invalid:!!_},{children:[!!_&&e.jsx(s.default,{width:16,height:16}),_||I]})),e.jsxs(o.InputWrapper,Object.assign({variant:E,state:m,width:a.width,isActive:"active"===m||P,isInvalid:A,style:null!==(d=null==G?void 0:G.InputWrapper)&&void 0!==d?d:{},version:B,height:a.height},{children:[!!R&&e.jsx(o.IconHolder,Object.assign({variant:E,iconSize:V,onClick:()=>Y(null==x?void 0:x.callback),isLeft:!0,style:null!==(v=null==G?void 0:G.IconHolder)&&void 0!==v?v:{}},{children:e.jsx(R,{})})),!!k&&e.jsx(o.PrefixHolder,Object.assign({variant:E},{children:k})),"default"===E&&e.jsx(o.InputContainer,Object.assign({height:a.height,type:a.type},{children:re()})),"small"===E&&e.jsx(o.InputContainerSmall,Object.assign({height:a.height,type:a.type},{children:re()})),!!z&&e.jsx(o.IconHolder,Object.assign({variant:E,iconSize:V,onClick:()=>Y(null==g?void 0:g.callback),isLeft:!1},{children:e.jsx(z,{})})),!!O&&e.jsx(o.SuffixHolder,Object.assign({variant:E},{children:O})),S&&S.text&&e.jsx(n.Button,{buttonText:S.text,onClick:()=>Y(null==S?void 0:S.onClick)})]})),(!!j||!!y)&&e.jsxs(o.InputHeader,Object.assign({invalid:A},{children:[e.jsxs(r.BodySecondary,{children:[j,b?e.jsx("span",{children:"*"}):""]}),y>0&&e.jsxs(o.MaxCharStyle,{children:[null!==(p=null===(h=a.value)||void 0===h?void 0:h.length)&&void 0!==p?p:0,"/",y]})]}))]}))}));a.displayName="Input",exports.Input=a;
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
import { VariableListInterfaceV2 } from "../add-variableV2/AddVariableV2";
|
|
2
|
+
import { WhatsAppCarouselTemplate, WhatsAppCarouselTemplateVariables } from "../template-preview/models/WhatsappCarouselTemplate";
|
|
2
3
|
import { CHANNEL_TYPE } from '../template-preview/models/Channels';
|
|
3
4
|
import { EmailTemplateType } from '../template-preview/models/EmailTemplate';
|
|
4
5
|
import { SMSTemplateType } from '../template-preview/models/SmsTemplate';
|
|
5
6
|
import { CUSTOM_VARIABLE, GlobalPlaceholderType } from '../template-preview/models/TemplateMeta';
|
|
6
7
|
import { ExtrasWhatsapp, POD, WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
|
|
7
8
|
export interface TemplateContextMapperProps {
|
|
8
|
-
selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
|
|
9
|
+
selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate;
|
|
9
10
|
closeDialog?: () => void;
|
|
10
11
|
showVariableMapping: boolean;
|
|
11
12
|
channel: CHANNEL_TYPE;
|
|
12
13
|
globalPlaceholders: GlobalPlaceholderType;
|
|
13
14
|
/** List of variables being used in this template */
|
|
14
|
-
templateVariables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables;
|
|
15
|
+
templateVariables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables;
|
|
15
16
|
/** Only for initial-UI-purpose for the modal */
|
|
16
17
|
htmlContent: string;
|
|
17
18
|
showOnlyContent?: boolean;
|
|
18
|
-
onTemplateSelect?(template: EmailTemplateType | SMSTemplateType | WhatsAppTemplate, variables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables, display_content?: string): string | void;
|
|
19
|
+
onTemplateSelect?(template: EmailTemplateType | SMSTemplateType | WhatsAppTemplate | WhatsAppCarouselTemplate, variables: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables, display_content?: string): string | void;
|
|
19
20
|
whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
|
|
20
21
|
zIndex?: number;
|
|
21
22
|
showVariableModal?: boolean;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("../../utils/StringUtils.js"),a=require("../modals/styledModal.js"),s=require("../template-preview/models/Channels.js"),o=require("./context/templateModalContext.js"),i=require("./modalElements/Footer.js"),r=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:u,closeDialog:c,showVariableMapping:p,channel:m,htmlContent:h,templateVariables:C,onTemplateSelect:b,globalPlaceholders:v,showOnlyContent:S,whatsappSpecificPickerMeta:g,zIndex:x,showVariableModal:E,variableList:T,discountCode:P,setDiscountCode:j,onBackPress:M,enabledCustomText:L,variableListForImage:w,showSampleValues:A,disableEditVariable:f,pod:N,extras:V}=d;var y,I,q,H;t.useEffect((()=>{F(h)}),[h]);const _=m===s.CHANNEL_TYPE.WHATSAPP&&"CAROUSEL"===(null===(I=null===(y=u.components)||void 0===y?void 0:y[1])||void 0===I?void 0:I.type),[k,D]=t.useState(m===s.CHANNEL_TYPE.EMAIL||_?"desktop":"mobile"),[O,F]=t.useState(h),[Y,B]=t.useState(!1),[W,z]=t.useState(u),[U,$]=t.useState(null!=C?C:[]),[R,G]=t.useState(!1),[J,K]=t.useState(-1);const Q=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(v)),[v]);return e.jsx(o.TemplateModalContext.Provider,Object.assign({value:{template:W,setTemplate:z,device:k,setDevice:D,display_content:O,setDisplayContent:F,originalVariableList:U,setOriginalVariableList:$,isError:Y,setIsError:B,channel:m,globalNormalizedPlaceholders:Q,templateSelectionTriggered:R,setTemplateSelectionTriggered:G,enabledCustomText:L,disableEditVariable:f,pod:N,extras:V,isWhatsappCarousel:_,selectedCarouselIndex:J,setSelectedCarouselIndex:K}},{children:S?e.jsx(r.default,{channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:x,centralContainerStyles:{width:m===s.CHANNEL_TYPE.EMAIL&&p||_?900:800},open:!0,onClose:()=>{null==c||c()},headingTitle:null==W?void 0:W.label,headingSubtitle:m===s.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(q=null==W?void 0:W.category)&&void 0!==q?q:"")} • ${null!==(H=null==W?void 0:W.templateCategory)&&void 0!==H?H:""}`:"",onBackPress:()=>{null==M||M()}},{children:[e.jsx(r.default,{showSampleValues:A,showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:g,showVariableModal:E,variableList:T,discountCode:P,setDiscountCode:j,variableListForImage:w&&(null==w?void 0:w.length)>0?w:T}),b?e.jsx(i.default,{isWhatsappCarousel:null!=_&&_,onSelect:function(){const e=null==b?void 0:b(W,U,null!=O?O:"");e?B(!!e):G(!0)}}):e.jsx(e.Fragment,{})]}))}))};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
|
|
3
|
+
import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
|
|
4
|
+
import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
|
|
5
|
+
import { WhatsAppCarouselTemplate } from "../../template-preview/models/WhatsappCarouselTemplate";
|
|
6
|
+
import { WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
|
|
7
|
+
declare const CarouselPreview: React.ForwardRefExoticComponent<{
|
|
8
|
+
channel: CHANNEL_TYPE;
|
|
9
|
+
template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null;
|
|
10
|
+
showSampleValues?: boolean | undefined;
|
|
11
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
12
|
+
export default CarouselPreview;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),a=require("./CarouselPreviewCard.js"),t=require("../../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(r);const d=i(o).default.div`
|
|
2
|
+
background-image: 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');
|
|
3
|
+
border: 1px solid ${t.COLORS.stroke.primary};
|
|
4
|
+
border-radius: 4px;
|
|
5
|
+
background-repeat: no-repeat;
|
|
6
|
+
background-position: center;
|
|
7
|
+
background-size: cover;
|
|
8
|
+
position: relative;
|
|
9
|
+
`,n=l.default.forwardRef(((o,t)=>{let{channel:i,template:l,showSampleValues:n}=o;var s,u,c;return r.useEffect((()=>{console.log("template preview uef: ",-1,l)}),[null===(s=null==l?void 0:l.components)||void 0===s?void 0:s[1].cards]),e.jsxs(d,{children:[e.jsx(a.default,{channel:i,template:l,isHeader:!0,carouselCardIndex:-1}),e.jsx("div",Object.assign({style:{display:"flex",flexDirection:"row"}},{children:null===(c=null===(u=null==l?void 0:l.components)||void 0===u?void 0:u[1].cards)||void 0===c?void 0:c.map(((r,o)=>{var t,d;const n={components:r.components,mapping:null===(d=null===(t=null==l?void 0:l.mapping)||void 0===t?void 0:t.cards)||void 0===d?void 0:d[o]};return console.log("template preview c: ",o,n),e.jsx(a.default,{channel:i,template:n,isHeader:!1,carouselCardIndex:o},o)}))}))]})}));n.displayName="CarouselPreview",exports.default=n;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
|
|
3
|
+
declare const CarouselPreviewCard: React.ForwardRefExoticComponent<{
|
|
4
|
+
channel: CHANNEL_TYPE;
|
|
5
|
+
template: any;
|
|
6
|
+
showSampleValues?: boolean | undefined;
|
|
7
|
+
isHeader?: boolean | undefined;
|
|
8
|
+
carouselCardIndex?: number | undefined;
|
|
9
|
+
} & React.RefAttributes<HTMLDivElement>>;
|
|
10
|
+
export default CarouselPreviewCard;
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),a=require("../../template-preview/TemplatePreview.js");require("../../template-preview/WhatsApp/WhatsAppLikePreview.js"),require("../../template-preview/WhatsApp/WhatsAppLikePreviewV2.js"),require("../../../constants/Theme.js"),require("../../template-preview/models/TemplateMeta.js"),require("../../template-preview/models/WhatsAppTemplate.js");var l=require("../../template-preview/models/Channels.js");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var i=s(t),p=s(r);const o=p.default.div`
|
|
2
|
+
position: relative;
|
|
3
|
+
height: ${e=>e.isHeader?"150px":"443px"};
|
|
4
|
+
width: ${e=>e.channel===l.CHANNEL_TYPE.WHATSAPP?"360px":"300px"};
|
|
5
|
+
overflow-y: auto;
|
|
6
|
+
`,n=p.default.div`
|
|
7
|
+
position: absolute;
|
|
8
|
+
flex: 1;
|
|
9
|
+
scroll-behavior: smooth;
|
|
10
|
+
left: 12px;
|
|
11
|
+
top: 8px;
|
|
12
|
+
width: calc(100% - 25px);
|
|
13
|
+
height: calc(100% - 17px);
|
|
14
|
+
overflow-y: auto;
|
|
15
|
+
`,u=i.default.forwardRef(((t,r)=>{let{channel:l,template:s,showSampleValues:i,isHeader:p,carouselCardIndex:u}=t;return e.jsx("div",{children:e.jsx(o,Object.assign({channel:l,isHeader:null!=p&&p},{children:e.jsx(n,Object.assign({ref:r},{children:e.jsx(a.TemplatePreview,{showSampleValues:i,template:s,channel:l,size:"small",hideHeader:!0,carouselCardIndex:u})}))}))})}));exports.default=u;
|
|
@@ -3,6 +3,7 @@ import { CHANNEL_TYPE } from "../../template-preview/models/Channels";
|
|
|
3
3
|
import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
|
|
4
4
|
import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
|
|
5
5
|
import { CUSTOM_VARIABLE, globalNormalizedPlaceholdersType } from "../../template-preview/models/TemplateMeta";
|
|
6
|
+
import { WhatsAppCarouselTemplate, WhatsAppCarouselTemplateVariables } from "../../template-preview/models/WhatsappCarouselTemplate";
|
|
6
7
|
import { ExtrasWhatsapp, WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
|
|
7
8
|
export type DEVICE_TYPES = 'desktop' | 'mobile';
|
|
8
9
|
export declare const TemplateModalContext: React.Context<{
|
|
@@ -10,12 +11,12 @@ export declare const TemplateModalContext: React.Context<{
|
|
|
10
11
|
setDevice?: React.Dispatch<React.SetStateAction<DEVICE_TYPES>> | undefined;
|
|
11
12
|
display_content: string | null;
|
|
12
13
|
setDisplayContent?: React.Dispatch<React.SetStateAction<string | null>> | undefined;
|
|
13
|
-
originalVariableList: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables;
|
|
14
|
-
setOriginalVariableList?: React.Dispatch<React.SetStateAction<WhatsAppTemplateVariables | CUSTOM_VARIABLE[]>> | undefined;
|
|
14
|
+
originalVariableList: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables;
|
|
15
|
+
setOriginalVariableList?: React.Dispatch<React.SetStateAction<WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables | CUSTOM_VARIABLE[]>> | undefined;
|
|
15
16
|
channel: CHANNEL_TYPE;
|
|
16
17
|
setChannel?: React.Dispatch<React.SetStateAction<CHANNEL_TYPE>> | undefined;
|
|
17
|
-
template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | null;
|
|
18
|
-
setTemplate?: React.Dispatch<React.SetStateAction<WhatsAppTemplate | EmailTemplateType | SMSTemplateType | null>> | undefined;
|
|
18
|
+
template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null;
|
|
19
|
+
setTemplate?: React.Dispatch<React.SetStateAction<WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null>> | undefined;
|
|
19
20
|
isError: boolean;
|
|
20
21
|
setIsError?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
|
|
21
22
|
globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
|
|
@@ -25,18 +26,21 @@ export declare const TemplateModalContext: React.Context<{
|
|
|
25
26
|
disableEditVariable?: boolean | undefined;
|
|
26
27
|
pod?: string | undefined;
|
|
27
28
|
extras?: ExtrasWhatsapp | undefined;
|
|
29
|
+
isWhatsappCarousel?: boolean | undefined;
|
|
30
|
+
selectedCarouselIndex?: number | undefined;
|
|
31
|
+
setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
|
|
28
32
|
}>;
|
|
29
33
|
export declare const useTemplateModalContext: () => {
|
|
30
34
|
device: DEVICE_TYPES;
|
|
31
35
|
setDevice?: React.Dispatch<React.SetStateAction<DEVICE_TYPES>> | undefined;
|
|
32
36
|
display_content: string | null;
|
|
33
37
|
setDisplayContent?: React.Dispatch<React.SetStateAction<string | null>> | undefined;
|
|
34
|
-
originalVariableList: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables;
|
|
35
|
-
setOriginalVariableList?: React.Dispatch<React.SetStateAction<WhatsAppTemplateVariables | CUSTOM_VARIABLE[]>> | undefined;
|
|
38
|
+
originalVariableList: CUSTOM_VARIABLE[] | WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables;
|
|
39
|
+
setOriginalVariableList?: React.Dispatch<React.SetStateAction<WhatsAppTemplateVariables | WhatsAppCarouselTemplateVariables | CUSTOM_VARIABLE[]>> | undefined;
|
|
36
40
|
channel: CHANNEL_TYPE;
|
|
37
41
|
setChannel?: React.Dispatch<React.SetStateAction<CHANNEL_TYPE>> | undefined;
|
|
38
|
-
template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | null;
|
|
39
|
-
setTemplate?: React.Dispatch<React.SetStateAction<WhatsAppTemplate | EmailTemplateType | SMSTemplateType | null>> | undefined;
|
|
42
|
+
template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null;
|
|
43
|
+
setTemplate?: React.Dispatch<React.SetStateAction<WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate | null>> | undefined;
|
|
40
44
|
isError: boolean;
|
|
41
45
|
setIsError?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
|
|
42
46
|
globalNormalizedPlaceholders?: globalNormalizedPlaceholdersType[] | undefined;
|
|
@@ -46,4 +50,7 @@ export declare const useTemplateModalContext: () => {
|
|
|
46
50
|
disableEditVariable?: boolean | undefined;
|
|
47
51
|
pod?: string | undefined;
|
|
48
52
|
extras?: ExtrasWhatsapp | undefined;
|
|
53
|
+
isWhatsappCarousel?: boolean | undefined;
|
|
54
|
+
selectedCarouselIndex?: number | undefined;
|
|
55
|
+
setSelectedCarouselIndex?: React.Dispatch<React.SetStateAction<number>> | undefined;
|
|
49
56
|
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
|
|
2
|
+
export type AdditionalVariableProps = {
|
|
3
|
+
variableList?: VariableListInterfaceV2[];
|
|
4
|
+
categoryDisplayName: string;
|
|
5
|
+
variableDisplayName: string;
|
|
6
|
+
variableValue: string;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* Takes the previous variable list and adds any custom variable given as prop.
|
|
10
|
+
* E.g - Custom Text, Custom URL, Static Expiry
|
|
11
|
+
*/
|
|
12
|
+
export declare const useAdditionalVariables: (props: AdditionalVariableProps) => VariableListInterfaceV2[] | undefined;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.useAdditionalVariables=a=>{const{variableList:e,categoryDisplayName:i,variableDisplayName:r,variableValue:l}=a;return e?[...e,{description:"",displayName:i,orderId:1,variables:{variableDisplayName:{description:void 0,displayName:r,actualValue:l,variableType:"any",isAvailable:!0}}}].sort(((a,e)=>a.orderId-e.orderId)):e};
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),o=require("../../template-preview/models/Channels.js"),n=require("../../../constants/Theme.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),a=require("../carousel/CarouselPreview.js"),o=require("./EditWhatsAppCarouselTemplateV2.js"),i=require("../../template-preview/models/Channels.js"),n=require("../../../constants/Theme.js"),s=require("../context/templateModalContext.js"),r=require("../utils/getVariableNameEmail.js"),d=require("../utils/highlightFor.js"),u=require("./DesktopPreview.js"),p=require("./EditWhatsAppTemplateV2.js"),c=require("./MobilePreview.js"),h=require("./VariableConnectorsPanel.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var f=m(l);const g=f.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
// height: 100%;
|
|
4
|
-
`,f
|
|
4
|
+
`,v=f.default.div`
|
|
5
5
|
padding: 16px 14px;
|
|
6
|
-
max-width:
|
|
6
|
+
max-width: 450px;
|
|
7
7
|
|
|
8
|
-
height: ${e=>e.channel===
|
|
9
|
-
overflow-y:
|
|
8
|
+
height: ${e=>e.channel===i.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
|
|
9
|
+
overflow-y: auto;
|
|
10
10
|
padding-bottom: 24px;
|
|
11
11
|
border-left: ${n.COLORS.stroke.primary} 1px solid;
|
|
12
|
-
`,
|
|
12
|
+
`,x=f.default.div`
|
|
13
13
|
padding: ${e=>e.showOnlyContent?"16px 14px":"16px 32px"};
|
|
14
14
|
flex: 1;
|
|
15
15
|
height: 475px;
|
|
16
16
|
overflow-y: auto;
|
|
17
|
-
`;exports.default=l=>{const{showVariableMapping:
|
|
17
|
+
`;exports.default=l=>{const{showVariableMapping:m,showOnlyContent:f,whatsappSpecificPickerMeta:C,showVariableModal:b,variableList:w,discountCode:j,setDiscountCode:E,variableListForImage:P,showSampleValues:A}=l,L=t.useRef(),T=t.useRef(),{device:y,display_content:M,channel:N,template:S,setTemplate:_,isWhatsappCarousel:V}=s.useTemplateModalContext();const q=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(g,{children:[e.jsx(x,Object.assign({showOnlyContent:f,showVariableMapping:m},{children:"mobile"===y?e.jsx(c.default,{ref:T,display_content:null!=M?M:"",channel:N,template:S,showSampleValues:A}):N===i.CHANNEL_TYPE.WHATSAPP&&V?e.jsx(a.default,{ref:L,channel:N,template:S,showSampleValues:A}):N!==i.CHANNEL_TYPE.MESSAGE?e.jsx(u.default,{ref:L,channel:N,display_content:null!=M?M:"",showSampleValues:A}):e.jsx(e.Fragment,{})})),m&&e.jsx(v,Object.assign({channel:N},{children:N!==i.CHANNEL_TYPE.WHATSAPP?e.jsx(h.default,{onFocus:N===i.CHANNEL_TYPE.EMAIL?function(e){var t,l,a;const o=null===document||void 0===document?void 0:document.getElementById("mobile"===y?"template_html_mobile":"template_html_desktop"),s=r.getVariableNameForEmailByIndex(e+1),u=N===i.CHANNEL_TYPE.EMAIL?null===(t=null==o?void 0:o.contentWindow)||void 0===t?void 0:t.document.getElementById(s):document.getElementById(s),p=q(u),c=null==u?void 0:u.offsetLeft;"desktop"===y?p&&L.current&&(null===(l=null==o?void 0:o.contentWindow)||void 0===l||l.scrollTo(null!=c?c:0,p),d.highlightFor(s,n.COLORS.background.warning.light,2,N,y)):p&&T.current&&(null===(a=null==o?void 0:o.contentWindow)||void 0===a||a.scrollTo(null!=c?c:0,p),d.highlightFor(s,n.COLORS.background.warning.light,2,N,y))}:void 0,showVariableModal:b,variableList:w,discountCode:j,setDiscountCode:E}):N===i.CHANNEL_TYPE.WHATSAPP&&V?e.jsx(o.default,{whatsappSpecificPickerMeta:C,template:S,showVariableModal:b,variableList:w,variableListForImage:P,discountCode:j,setDiscountCode:E}):e.jsx(p.default,{whatsappSpecificPickerMeta:C,template:S,onTemplateChange:e=>{null==_||_(e)},showVariableModal:b,variableList:w,variableListForImage:P,discountCode:j,setDiscountCode:E})}))]})};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../../assets/icons/document_pdf.svg.js"),t=require("../../../assets/icons/edit.svg.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),i=require("../../../assets/icons/document_pdf.svg.js"),t=require("../../../assets/icons/edit.svg.js"),s=require("../../../assets/icons/refresh.svg.js"),r=require("styled-components"),n=require("../../shimmer-image/ShimmerImage.js"),l=require("../../spinner/Spinner.js"),o=require("../../template-preview/models/TemplateMeta.js"),a=require("../../TypographyStyle.js"),d=require("../../../utils/StringUtils.js"),c=require("../../../constants/Theme.js"),g=require("./EditMediaV2.style.js");function h(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const u=h(r).default.div`
|
|
2
2
|
padding-left: 14px;
|
|
3
3
|
padding-right: 6px;
|
|
4
4
|
width: 44px;
|
|
5
5
|
height: 24px;
|
|
6
|
-
border-left: 1px solid ${
|
|
6
|
+
border-left: 1px solid ${c.COLORS.stroke.primary};
|
|
7
7
|
cursor: pointer;
|
|
8
|
-
`;exports.default=
|
|
8
|
+
`;exports.default=r=>{const{imageName:h,error:j,isLoading:p,mediaType:m,disableEditVariable:x,selectedVariable:y,setOpenEditMedia:O}=r,f=null==h?void 0:h[0].split("/"),v=null==f?void 0:f[f.length-1];return e.jsxs(g.Container,{children:[e.jsx(g.ImageContainer,Object.assign({error:!!j,onClick:()=>null==O?void 0:O(!0)},{children:j?e.jsx(s.default,{color:c.COLORS.content.brand,width:32,height:32}):p?e.jsx(l.Spinner,{size:"small"}):m===o.HEADER_TYPES.IMAGE?e.jsx(n.ShimmerImage,{imageUrl:null==h?void 0:h[0],width:56,height:56}):m===o.HEADER_TYPES.VIDEO?e.jsx("video",Object.assign({src:h[0],style:{width:56,height:56}},{children:e.jsx("track",{default:!0,kind:"captions",srcLang:"en",src:h[0]})})):e.jsx(i.default,{width:18,height:22,color:c.COLORS.content.placeholder})})),e.jsxs(g.RightComponent,{children:[e.jsx("div",Object.assign({style:{flex:1}},{children:h&&j?e.jsx(e.Fragment,{}):p?e.jsx(a.BodyCaption,Object.assign({style:{marginLeft:8}},{children:"Your media is getting loaded..."})):e.jsx(a.BodySecondary,Object.assign({style:{color:c.COLORS.content.primary,marginLeft:8}},{children:y||d.default.toCapitilize(null==m?void 0:m.toLowerCase())||v}))})),!!j&&e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column",marginLeft:8}},{children:[e.jsxs(a.BodySecondary,Object.assign({style:{color:c.COLORS.content.negative}},{children:["Error loading this ",null==m?void 0:m.toLowerCase(),". Retry"]})),e.jsx(a.Caption,Object.assign({style:{color:c.COLORS.content.secondary}},{children:j}))]})),!x&&!j&&!p&&e.jsx(u,Object.assign({onClick:()=>null==O?void 0:O(!0),onKeyDown:()=>null==O?void 0:O(!0),role:"presentation"},{children:e.jsx(t.default,{width:24,height:24,color:c.COLORS.content.placeholder})}))]})]})};
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { VariableListInterfaceV2 } from "../../add-variableV2";
|
|
2
|
+
import { WhatsAppPickerMeta } from "../../template-preview";
|
|
3
|
+
import { WhatsAppCarouselTemplate } from "../../template-preview/models/WhatsappCarouselTemplate";
|
|
4
|
+
export interface EditWhatsAppCarouselTemplateV2Props {
|
|
5
|
+
whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
|
|
6
|
+
template: WhatsAppCarouselTemplate;
|
|
7
|
+
showVariableModal?: boolean;
|
|
8
|
+
variableList?: VariableListInterfaceV2[];
|
|
9
|
+
variableListForImage?: VariableListInterfaceV2[];
|
|
10
|
+
discountCode?: string;
|
|
11
|
+
setDiscountCode?: (code: string) => void;
|
|
12
|
+
}
|
|
13
|
+
declare const EditWhatsAppCarouselTemplateV2: ({ template, whatsappSpecificPickerMeta, showVariableModal, variableList, variableListForImage, discountCode, setDiscountCode, }: EditWhatsAppCarouselTemplateV2Props) => import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export default EditWhatsAppCarouselTemplateV2;
|
package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppCarouselTemplateV2.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),a=require("../context/templateModalContext.js"),s=require("./EditWhatsAppTemplateV2.js"),r=require("../../TypographyStyle.js");exports.default=i=>{let{template:l,whatsappSpecificPickerMeta:o,showVariableModal:p,variableList:u,variableListForImage:d,discountCode:c,setDiscountCode:n}=i;const{selectedCarouselIndex:m,setTemplate:C}=a.useTemplateModalContext(),[x,M]=t.useState(-1==m?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)");return t.useEffect((()=>{M(-1==m?"First Message (Step 1/2)":"Carousel Cards (Step 2/2)")}),[m]),e.jsxs("div",{children:[e.jsx(r.TitleMedium,Object.assign({style:{marginLeft:10,marginBottom:10}},{children:x})),e.jsx(s.default,{whatsappSpecificPickerMeta:o,template:l,onTemplateChange:e=>{null==C||C(e)},showVariableModal:p,variableList:u,variableListForImage:d,discountCode:c,setDiscountCode:n})]})};
|
package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
import { VariableListInterfaceV2 } from "../../add-variableV2/AddVariableV2";
|
|
2
2
|
import { EmailTemplateType } from "../../template-preview/models/EmailTemplate";
|
|
3
3
|
import { SMSTemplateType } from "../../template-preview/models/SmsTemplate";
|
|
4
|
+
import { WhatsAppCarouselTemplate } from "../../template-preview/models/WhatsappCarouselTemplate";
|
|
4
5
|
import { WhatsAppPickerMeta, WhatsAppTemplate } from "../../template-preview/models/WhatsAppTemplate";
|
|
5
6
|
export interface EditWhatsAppTemplateV2Props {
|
|
6
7
|
whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
|
|
7
8
|
template: WhatsAppTemplate;
|
|
8
|
-
onTemplateChange?: (template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType) => void;
|
|
9
|
+
onTemplateChange?: (template: WhatsAppTemplate | EmailTemplateType | SMSTemplateType | WhatsAppCarouselTemplate) => void;
|
|
9
10
|
showVariableModal?: boolean;
|
|
10
11
|
variableList?: VariableListInterfaceV2[];
|
|
11
12
|
variableListForImage?: VariableListInterfaceV2[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),n=require("lodash"),o=require("react"),t=require("../../template-preview/models/WhatsAppTemplate.js"),i=require("../context/templateModalContext.js"),l=require("../custom-hooks/useAdditionalVariables.js"),a=require("../utils/getDataFromTemplateComponent.js"),s=require("./BackTrackComponent.js"),d=require("./DiscountCodeComponent.js"),r=require("./EditMediaV2.style.js"),p=require("./EditWhatsAppTemplateMediaV2.js"),c=require("./VariableConnector.js"),u=require("./VariableConnectorsPanel.js"),m=require("./VariableConnectorWhatsApp.js"),v=require("./VariableEditorHeader.js"),b=require("./WhatsAppTemplateCardButtonV2.js");exports.default=g=>{let{template:h,onTemplateChange:C,whatsappSpecificPickerMeta:f,showVariableModal:j,variableList:x,variableListForImage:T,discountCode:O,setDiscountCode:V}=g;var B,y,q,E,k,L,D,w,I,A,M,U,N,P,S,R,H,F;const{originalVariableList:_,pod:Q,extras:W,selectedCarouselIndex:Y}=i.useTemplateModalContext(),{descriptionComponents:K,urlBtns:$,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}=a.getAllDataFromTemplateComponent(h),[Z,ee]=o.useState(!1),[ne,oe]=o.useState(-1===Y?{descriptionComponents:K,urlBtns:$,qrbBtns:X,imageComponent:z,bodyVariables:G,headerVariables:J}:{});function te(e,o){var t,i,l,a,s,d,r;const p=null!=Y&&Y>-1?{components:null===(t=Object.assign({},h).components[1].cards)||void 0===t?void 0:t[Y].components,mapping:null===(i=Object.assign({},h).mapping.cards)||void 0===i?void 0:i[Y]}:Object.assign({},h),c=null==p?void 0:p.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==c&&c>-1){const n=null===(l=null==p?void 0:p.components[c].buttons)||void 0===l?void 0:l.findIndex((e=>"URL"===e.type));if(void 0!==n&&n>-1){const t="custom"===o&&"string"==typeof e,i=[...null!==(d=null===(s=null===(a=p.components)||void 0===a?void 0:a[c])||void 0===s?void 0:s.buttons)&&void 0!==d?d:[]];i[n]=Object.assign(Object.assign({},i[n]),{url:"https://d.bik.ai/{{1}}",example:[t?e:"string"!=typeof e?e.defaultValue:""]});const l=Object.assign(Object.assign({},p.components[c]),{buttons:i}),r=Object.assign(Object.assign({},p.mapping),{buttons:t?["((customBtnPlaceholder))"]:"string"!=typeof e?[e.placeHolder]:void 0});p.mapping=r;const u=[...p.components];u[c]=l,p.components=u}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(r=e.placeHolder)||void 0===r?void 0:r.slice(2,-2))?ee(!0):(ee(!1),null==V||V(""))}if(null!=Y&&Y>-1){const e=n.cloneDeep(h);e.components[1].cards[Y].components=p.components,e.mapping.cards[Y]=p.mapping,null==C||C(Object.assign({},e))}else null==C||C(p)}function ie(e,o,t){var i,l,a;const s=null!=Y&&Y>-1?{components:null===(i=Object.assign({},h).components[1].cards)||void 0===i?void 0:i[Y].components,mapping:null===(l=Object.assign({},h).mapping.cards)||void 0===l?void 0:l[Y]}:Object.assign({},h),d=null==s?void 0:s.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==d&&d>-1){const n=null===(a=null==s?void 0:s.components[d].buttons)||void 0===a?void 0:a.filter((e=>"QUICK_REPLY"===e.type));n&&(n[t]=Object.assign(Object.assign({},n[t]),{flowId:e.flowId,flowName:e.flowName}));const o=Object.assign(Object.assign({},s.components[d]),{buttons:n}),i=[...s.components];i[d]=o,s.components=i}if(null!=Y&&Y>-1){const e=n.cloneDeep(h);e.components[1].cards[Y].components=s.components,e.mapping.cards[Y]=s.mapping,null==C||C(Object.assign({},e))}else null==C||C(s)}o.useEffect((()=>{var e,n;if(null===(e=h.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))ee(!0);else{ee(!1);const e=null===(n=null==W?void 0:W.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[h]),o.useEffect((()=>{var e,n,o,t;if(console.log("right panel selectedCarouselIndex: ",Y),null!=Y&&Y>-1){const i={components:null===(n=null===(e=h.components[1])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Y].components,mapping:null===(t=null===(o=null==h?void 0:h.mapping)||void 0===o?void 0:o.cards)||void 0===t?void 0:t[Y]},{descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c}=a.getAllDataFromTemplateComponent(i);console.log("right panel descriptionComponents: ",{descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c}),oe({descriptionComponents:l,urlBtns:s,qrbBtns:d,imageComponent:r,bodyVariables:p,headerVariables:c})}else if(null!=Y&&-1===Y){const{descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l}=a.getAllDataFromTemplateComponent(h);oe({descriptionComponents:e,urlBtns:n,qrbBtns:o,imageComponent:t,bodyVariables:i,headerVariables:l})}}),[Y]);const le=l.useAdditionalVariables({variableList:x,categoryDisplayName:"Custom Variables",variableDisplayName:"Custom Text",variableValue:"{{custom.text}}"});return e.jsxs(u.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:[!!ne.mediaComponent&&e.jsx(r.EditTemplateMediaContainer,{children:e.jsx(p.default,{whatsappSpecificPickerMeta:f,mediaComponent:ne.mediaComponent,updateTemplateImageUrl:function(e,o){var t,i,l,a,s;let d;d=null!=Y&&Y>-1?{components:null===(i=null===(t=h.components[1])||void 0===t?void 0:t.cards)||void 0===i?void 0:i[Y].components,mapping:null===(a=null===(l=null==h?void 0:h.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Y]}:Object.assign({},h);const r=null===(s=null==d?void 0:d.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==r&&r>-1&&(null==d?void 0:d.components[r])){const n=Object.assign(Object.assign({},d.components[r]),{format:o,example:{header_handle:[e]}}),t=[...d.components];t[r]=n,d=Object.assign(Object.assign({},d),{components:t})}if(d.mapping&&(d.mapping=Object.assign(Object.assign({},d.mapping),{header:void 0})),null!=Y&&Y>-1){const e=n.cloneDeep(h);e.components[1].cards[Y].components=d.components,e.mapping.cards[Y]=d.mapping,null==C||C(Object.assign({},e))}else null==C||C(Object.assign({},d))},template:h,variableListForImage:T})}),(ne.bodyVariables.length>0||ne.headerVariables.length>0)&&e.jsx(v.default,{containerStyle:{paddingTop:ne.mediaComponent?24:8},headerText:"Edit variable values",subText:"Edit values for the variables used in template",toolTipInfo:"Variables are placeholder texts which can either be filled through data or custom texts. These can be edited through the dropdowns below"}),null===(B=ne.descriptionComponents)||void 0===B?void 0:B.map(((n,o)=>e.jsx(m.default,{originalVariableList:null!=Y&&Y>-1?_.cards[Y]:_,type:n.type,descriptionComponent:n.component,showVariableModal:j,variableList:x},o))),(null===(q=null===(y=ne.urlBtns[0])||void 0===y?void 0:y.component)||void 0===q?void 0:q.buttons)&&(null===(L=null===(k=null===(E=ne.urlBtns[0])||void 0===E?void 0:E.component)||void 0===k?void 0:k.buttons)||void 0===L?void 0:L.length)>0&&e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(D=null!=Y&&Y>-1?_.cards[Y].buttons:null==_?void 0:_.buttons)||void 0===D?void 0:D.map(((n,o)=>{if("URL"===n.type)return e.jsx(b.default,{variableListIndex:o,CTAoptions:null==f?void 0:f.CTAoptions,button:n,originalVariableList:null!=Y&&Y>-1?_.cards[Y]:_,updateSelectedURLTemplateBtn:te,variableList:x},`${o}`)})),(null===(I=null===(w=ne.qrbBtns[0])||void 0===w?void 0:w.component)||void 0===I?void 0:I.buttons)&&(null===(U=null===(M=null===(A=ne.qrbBtns[0])||void 0===A?void 0:A.component)||void 0===M?void 0:M.buttons)||void 0===U?void 0:U.length)>0&&(Q!==t.POD.CHATBOT?e.jsx(v.default,{headerText:"Edit buttons",subText:"Edit the chatflows triggered on clicking the buttons",toolTipInfo:"There is an option to trigger chatflows through the buttons which can keep the user engaged"}):e.jsx(s.BackTrackComponent,{backTrackMessage:null===(N=null==W?void 0:W.backTrackExtra)||void 0===N?void 0:N[0],setBackTrackMessage:null===(P=null==W?void 0:W.backTrackExtra)||void 0===P?void 0:P[1]})),null===(S=null!=Y&&Y>-1?_.cards[Y].buttons:null==_?void 0:_.buttons)||void 0===S?void 0:S.map(((n,o)=>{if("QUICK_REPLY"===n.type)return e.jsx(b.default,{variableListIndex:o,QRBoptions:null==f?void 0:f.QRBoptions,button:n,originalVariableList:null!=Y&&Y>-1?_.cards[Y]:_,updateSelectedQRBTemplateBtn:ie},`${o}`)})),Q===t.POD.CHATBOT&&Z&&e.jsx(d.DiscountCodeComponent,{discountCode:null===(R=null==W?void 0:W.discountCodeExtra)||void 0===R?void 0:R[0],setDiscountCode:null===(H=null==W?void 0:W.discountCodeExtra)||void 0===H?void 0:H[1],variableList:x}),null===(F=null!=Y&&Y>-1?_.cards[Y].buttons:null==_?void 0:_.buttons)||void 0===F?void 0:F.map(((n,o)=>{var t,i,l;if("COPY_CODE"===n.type)return e.jsx(c.default,{index:o,variable:{variableName:null!==(t=n.text)&&void 0!==t?t:"",updatedValue:null!==(i=n.buttonVariable)&&void 0!==i?i:"",type:"string",isEditableVariable:!0,index:null!==(l=n.index)&&void 0!==l?l:0},showVariableModal:!0,variableList:le,componentType:"BUTTONS"},o)}))]}))};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
export interface FooterProps {
|
|
2
|
+
isWhatsappCarousel: boolean;
|
|
2
3
|
onSelect: () => void;
|
|
3
4
|
}
|
|
4
|
-
declare const Footer: ({ onSelect }: FooterProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare const Footer: ({ isWhatsappCarousel, onSelect }: FooterProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
6
|
export default Footer;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("styled-components"),
|
|
2
|
-
background: ${
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),o=require("../../button/Button.js"),s=require("../../../constants/Theme.js"),a=require("../Badge/index.js"),n=require("../context/templateModalContext.js");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const u=l(r).default.div`
|
|
2
|
+
background: ${s.COLORS.surface.standard};
|
|
3
3
|
border-top-width: 1px;
|
|
4
|
-
border-top-color: ${
|
|
4
|
+
border-top-color: ${s.COLORS.stroke.primary};
|
|
5
5
|
box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.12);
|
|
6
6
|
width: 100%;
|
|
7
7
|
padding: 16px 24px;
|
|
@@ -10,4 +10,4 @@
|
|
|
10
10
|
gap: 12;
|
|
11
11
|
border-bottom-left-radius: 4px;
|
|
12
12
|
border-bottom-right-radius: 4px;
|
|
13
|
-
`;exports.default=
|
|
13
|
+
`;exports.default=r=>{let{isWhatsappCarousel:s,onSelect:l}=r;const{isError:d,selectedCarouselIndex:i,setSelectedCarouselIndex:c}=n.useTemplateModalContext(),[p,x]=t.useState(s?"Next":"Select template");return t.useEffect((()=>{s&&-1===i?x("Next"):s&&null!=i&&i>-1&&x("Save & Select Template")}),[i]),e.jsxs(u,{children:[d&&e.jsx(a.Badge,{errorText:"Some inputs are missing or incorrect. Please check"}),e.jsx(o.Button,{id:"select-template-btn",buttonText:p,size:s?"small":"large",onClick:function(){s&&-1===i&&c&&c(0),l()}})]})};
|