@bikdotai/bik-component-library 0.0.398 → 0.0.399-beta-styles
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/components/add-variableV2/AddVariableV2.d.ts +0 -1
- package/dist/cjs/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/cjs/components/input-with-vars/InputWithVariables.d.ts +6 -14
- package/dist/cjs/components/input-with-vars/InputWithVariables.js +3 -3
- package/dist/cjs/components/product-picker-v2/collectionScreen.d.ts +0 -2
- package/dist/cjs/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/modal.d.ts +1 -5
- package/dist/cjs/components/product-picker-v2/modal.js +1 -1
- package/dist/cjs/components/product-picker-v2/productScreen.d.ts +0 -7
- package/dist/cjs/components/product-picker-v2/productScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/searchScreen.d.ts +0 -4
- package/dist/cjs/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/cjs/components/product-picker-v2/style.d.ts +0 -2
- package/dist/cjs/components/product-picker-v2/style.js +16 -24
- package/dist/cjs/components/shimmer-image/ShimmerImage.d.ts +0 -1
- package/dist/cjs/components/shimmer-image/ShimmerImage.js +1 -1
- package/dist/cjs/components/side-modal/SideModal.d.ts +2 -4
- package/dist/cjs/components/side-modal/SideModal.js +1 -1
- package/dist/cjs/components/side-modal/SideModal.style.d.ts +1 -4
- package/dist/cjs/components/side-modal/SideModal.style.js +1 -4
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.d.ts +3 -7
- package/dist/cjs/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/cjs/components/template-context-mapper/context/templateModalContext.d.ts +1 -5
- package/dist/cjs/components/template-context-mapper/modalElements/Body.d.ts +0 -2
- package/dist/cjs/components/template-context-mapper/modalElements/Body.js +5 -5
- package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.d.ts +0 -1
- package/dist/cjs/components/template-context-mapper/modalElements/DesktopPreview.js +2 -2
- package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.d.ts +0 -3
- package/dist/cjs/components/template-context-mapper/modalElements/EditMediaV2.js +2 -2
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.d.ts +0 -2
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +1 -4
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.d.ts +0 -1
- package/dist/cjs/components/template-context-mapper/modalElements/MobilePreview.js +3 -3
- package/dist/cjs/components/template-context-mapper/modalElements/TemplateSelectModalContent.d.ts +1 -3
- package/dist/cjs/components/template-context-mapper/modalElements/TemplateSelectModalContent.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.d.ts +1 -3
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnector.js +3 -3
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/VariableConnectorsPanel.js +3 -4
- package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/cjs/components/template-preview/TemplatePreview.d.ts +1 -2
- package/dist/cjs/components/template-preview/TemplatePreview.js +1 -1
- package/dist/cjs/components/template-preview/WhatsApp/ChatUI.style.js +5 -5
- package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.d.ts +0 -1
- package/dist/cjs/components/template-preview/WhatsAppTemplatePreview.js +1 -1
- package/dist/cjs/components/template-preview/constants/regexPatterns.js +1 -1
- package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.d.ts +1 -6
- package/dist/cjs/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
- package/dist/cjs/components/template-preview/models/WhatsAppTemplate.d.ts +0 -21
- package/dist/cjs/components/template-preview/models/WhatsAppTemplate.js +1 -1
- package/dist/cjs/index.js +1 -1
- package/dist/esm/components/add-variableV2/AddVariableV2.d.ts +0 -1
- package/dist/esm/components/bik-layout/MockMenus.d.ts +1 -0
- package/dist/esm/components/input-with-vars/InputWithVariables.d.ts +6 -14
- package/dist/esm/components/input-with-vars/InputWithVariables.js +3 -3
- package/dist/esm/components/product-picker-v2/collectionScreen.d.ts +0 -2
- package/dist/esm/components/product-picker-v2/collectionScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/modal.d.ts +1 -5
- package/dist/esm/components/product-picker-v2/modal.js +1 -1
- package/dist/esm/components/product-picker-v2/productScreen.d.ts +0 -7
- package/dist/esm/components/product-picker-v2/productScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/searchScreen.d.ts +0 -4
- package/dist/esm/components/product-picker-v2/searchScreen.js +1 -1
- package/dist/esm/components/product-picker-v2/style.d.ts +0 -2
- package/dist/esm/components/product-picker-v2/style.js +12 -20
- package/dist/esm/components/shimmer-image/ShimmerImage.d.ts +0 -1
- package/dist/esm/components/shimmer-image/ShimmerImage.js +1 -1
- package/dist/esm/components/side-modal/SideModal.d.ts +2 -4
- package/dist/esm/components/side-modal/SideModal.js +1 -1
- package/dist/esm/components/side-modal/SideModal.style.d.ts +1 -4
- package/dist/esm/components/side-modal/SideModal.style.js +12 -15
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.d.ts +3 -7
- package/dist/esm/components/template-context-mapper/TemplateContextMapper.js +1 -1
- package/dist/esm/components/template-context-mapper/context/templateModalContext.d.ts +1 -5
- package/dist/esm/components/template-context-mapper/modalElements/Body.d.ts +0 -2
- package/dist/esm/components/template-context-mapper/modalElements/Body.js +4 -4
- package/dist/esm/components/template-context-mapper/modalElements/DesktopPreview.d.ts +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/DesktopPreview.js +4 -4
- package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.d.ts +0 -3
- package/dist/esm/components/template-context-mapper/modalElements/EditMediaV2.js +2 -2
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.d.ts +0 -2
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateMediaV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.d.ts +1 -4
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.d.ts +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/MobilePreview.js +4 -4
- package/dist/esm/components/template-context-mapper/modalElements/TemplateSelectModalContent.d.ts +1 -3
- package/dist/esm/components/template-context-mapper/modalElements/TemplateSelectModalContent.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.d.ts +1 -3
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnector.js +2 -2
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorWhatsApp.js +1 -1
- package/dist/esm/components/template-context-mapper/modalElements/VariableConnectorsPanel.js +3 -4
- package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/esm/components/template-preview/TemplatePreview.d.ts +1 -2
- package/dist/esm/components/template-preview/TemplatePreview.js +1 -1
- package/dist/esm/components/template-preview/WhatsApp/ChatUI.style.js +1 -1
- package/dist/esm/components/template-preview/WhatsAppTemplatePreview.d.ts +0 -1
- package/dist/esm/components/template-preview/WhatsAppTemplatePreview.js +1 -1
- package/dist/esm/components/template-preview/constants/regexPatterns.js +1 -1
- package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.d.ts +1 -6
- package/dist/esm/components/template-preview/helpers/TemplateCreatorHelper.js +1 -1
- package/dist/esm/components/template-preview/models/WhatsAppTemplate.d.ts +0 -21
- package/dist/esm/components/template-preview/models/WhatsAppTemplate.js +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/dist/cjs/components/template-context-mapper/modalElements/BackTrackComponent.d.ts +0 -4
- package/dist/cjs/components/template-context-mapper/modalElements/BackTrackComponent.js +0 -1
- package/dist/cjs/components/template-context-mapper/modalElements/DiscountCodeComponent.d.ts +0 -6
- package/dist/cjs/components/template-context-mapper/modalElements/DiscountCodeComponent.js +0 -1
- package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.d.ts +0 -11
- package/dist/cjs/components/template-context-mapper/modalElements/EditMediaModal.js +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/BackTrackComponent.d.ts +0 -4
- package/dist/esm/components/template-context-mapper/modalElements/BackTrackComponent.js +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/DiscountCodeComponent.d.ts +0 -6
- package/dist/esm/components/template-context-mapper/modalElements/DiscountCodeComponent.js +0 -1
- package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.d.ts +0 -11
- package/dist/esm/components/template-context-mapper/modalElements/EditMediaModal.js +0 -1
|
@@ -1,20 +1,12 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { Variable } from '../add-variableV2/AddVariableV2';
|
|
3
1
|
import { SelectedVariable } from '../add-variableV2/types';
|
|
4
|
-
|
|
2
|
+
export declare const InputWithVariables: (props: {
|
|
5
3
|
variablesList: any;
|
|
6
4
|
onChange: (val: SelectedVariable) => void;
|
|
7
|
-
onBlur?: (e: Event, val?: SelectedVariable | Variable) => void;
|
|
8
5
|
addVarBoxRight: string;
|
|
9
6
|
allowMix: boolean;
|
|
10
7
|
prevVariable: SelectedVariable;
|
|
11
|
-
showHelp?: boolean;
|
|
12
|
-
onlyVariables?: boolean;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
errorMessage?: string;
|
|
17
|
-
showSideModal?: boolean;
|
|
18
|
-
}
|
|
19
|
-
export declare const InputWithVariables: React.FC<InputWithVariablesProps>;
|
|
20
|
-
export {};
|
|
8
|
+
showHelp?: boolean | undefined;
|
|
9
|
+
onlyVariables?: boolean | undefined;
|
|
10
|
+
showSideModal?: boolean | undefined;
|
|
11
|
+
errorMessage?: string | undefined;
|
|
12
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../assets/icons/PlusIcon.js"),l=require("react"),r=require("styled-components"),i=require("uuid"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("../../assets/icons/PlusIcon.js"),l=require("react"),r=require("styled-components"),i=require("uuid"),d=require("../add-variableV2/AddVariableV2SideModal.js"),t=require("../add-variableV2/AddVariableV2.js"),s=require("../../constants/Theme.js"),u=require("../add-variableV2/AddVariableBox.styled.js"),o=require("../input/Input.js"),n=require("../TypographyStyle.js");function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const v=c(r).default.div`
|
|
2
2
|
margin-bottom: 16px;
|
|
3
3
|
input {
|
|
4
|
-
color: ${e=>e.isVar?
|
|
4
|
+
color: ${e=>e.isVar?s.COLORS.stroke.brand:"black"};
|
|
5
5
|
}
|
|
6
|
-
`;exports.InputWithVariables=r=>{
|
|
6
|
+
`;exports.InputWithVariables=r=>{var s;const c=l.useRef(null),[b,g]=l.useState(!1),[V]=l.useState(i.v4()),[p,h]=l.useState(),[T,j]=l.useState(r.prevVariable),[x,y]=l.useState(!1),[f,S]=l.useState(!1),[m,q]=l.useState("");return l.useEffect((()=>{p&&p.actualValue&&(r.allowMix?j((e=>({actualValue:e.actualValue+p.actualValue,variableType:"string"}))):j((e=>({actualValue:p.actualValue,variableType:p.variableType,needsFetching:p.needsFetching}))))}),[p]),l.useEffect((()=>{r.onChange(T)}),[T]),l.useEffect((()=>{(null==r?void 0:r.errorMessage)&&q(null==r?void 0:r.errorMessage)}),[null==r?void 0:r.errorMessage]),e.jsxs(v,Object.assign({isVar:/^{{.*}}$/.test(T.actualValue)},{children:[e.jsx(o.Input,{id:V,ref:c,skipFocus:!0,textControl:!0,isActive:b,value:T.actualValue,validate:e=>[!0,""],errorMessage:m,placeholder:"Add a value",onChangeText:function(e,a){if(q(""),r.onlyVariables){const e=(null==a?void 0:a.keyCode)||(null==a?void 0:a.charCode);8!=e&&46!=e||j({actualValue:"",variableType:"string"})}else r.allowMix?j({actualValue:e,variableType:"string"}):j({actualValue:e.replace(/{{.*}}/,""),variableType:"string"})},onReferenceInit:()=>{},onFocus:e=>{var a;g(!0),S(!0),"Search..."!==(null===(a=e.relatedTarget)||void 0===a?void 0:a.placeholder)||x||y(!0)},onBlur:e=>{var a,l,r,i,d,t,s;"addVar"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||"varList"===(null===(l=e.relatedTarget)||void 0===l?void 0:l.id)||(null===(i=null===(r=e.relatedTarget)||void 0===r?void 0:r.className)||void 0===i?void 0:i.includes("exlualr0"))||(null===(t=null===(d=e.relatedTarget)||void 0===d?void 0:d.className)||void 0===t?void 0:t.includes("sc-dZoequ "))?(c.current&&c.current.focus(),g(!0)):"Search..."===(null===(s=e.relatedTarget)||void 0===s?void 0:s.placeholder)?g(!0):(g(!1),y(!1),S(!1))}}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"row",justifyContent:"space-between"}},{children:[T.actualValue&&r.showHelp?e.jsx("div",Object.assign({style:{marginTop:4}},{children:e.jsx(n.BodyCaption,{children:`This value is of type ${T.variableType}`})})):e.jsx("div",{}),f&&e.jsx("div",Object.assign({style:{marginTop:m?"-24px":"0px"}},{children:e.jsx(u.AddVariableStyled,Object.assign({right:r.addVarBoxRight,id:"addVar",onClick:()=>{y(!x)}},{children:e.jsxs("div",Object.assign({className:"add"},{children:[e.jsx(a.default,{color:"white"}),e.jsx("div",Object.assign({className:"variable"},{children:"Add variable"}))]}))}))}))]})),x&&!r.showSideModal&&e.jsx(t.AddVariableV2,{data:r.variablesList,showVariable:!0,setShowVariable:()=>{y(!1)},variableValue:p,setVariableValue:h,placeholder:"",pickerSize:"large",enableVariable:!0,selectWithTypes:!0,onSearchBlur:e=>{var a,l,r,i,d,t;"varList"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||(null===(r=null===(l=e.relatedTarget)||void 0===l?void 0:l.className)||void 0===r?void 0:r.includes("exlualr0"))||(null===(d=null===(i=e.relatedTarget)||void 0===i?void 0:i.className)||void 0===d?void 0:d.includes("sc-dZoequ "))?c.current.focus():"Enter here"===(null===(t=e.relatedTarget)||void 0===t?void 0:t.placeholder)?e.relatedTarget.id!==V&&(y(!1),S(!1),g(!1)):(y(!1),S(!1),g(!1))}}),x&&r.showSideModal&&e.jsx(d.AddVariableV2SideModal,{zIndex:2e3,data:null!==(s=r.variablesList)&&void 0!==s?s:[],showVariable:x,setShowVariable:()=>{y(!1)},placeholder:"Add a variable",customTrigger:e=>{h({actualValue:e.actualValue,variableType:"string"})},onSearchBlur:e=>{var a,l,r,i,d,t;"varList"===(null===(a=e.relatedTarget)||void 0===a?void 0:a.id)||(null===(r=null===(l=e.relatedTarget)||void 0===l?void 0:l.className)||void 0===r?void 0:r.includes("exlualr0"))||(null===(d=null===(i=e.relatedTarget)||void 0===i?void 0:i.className)||void 0===d?void 0:d.includes("sc-dZoequ "))?c.current.focus():"Enter here"===(null===(t=e.relatedTarget)||void 0===t?void 0:t.placeholder)?e.relatedTarget.id!==V&&(y(!1),S(!1),g(!1)):(y(!1),S(!1),g(!1))}})]}))};
|
|
@@ -21,8 +21,6 @@ interface CollectionsScreenInterface {
|
|
|
21
21
|
setCurPage: React.Dispatch<React.SetStateAction<number>>;
|
|
22
22
|
};
|
|
23
23
|
hideCollectionCheckbox?: boolean;
|
|
24
|
-
renderWithoutModal?: boolean;
|
|
25
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
26
24
|
}
|
|
27
25
|
export declare const CollectionsScreen: (props: CollectionsScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
28
26
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronRight.svg.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/chevronRight.svg.js"),s=require("react"),i=require("../checkBox/CheckBox.js"),o=require("../icon-button/IconButton.js"),c=require("../shimmer/ShimmerComponent/BikShimmer.js"),r=require("../tag/Tag.js"),l=require("../TypographyStyle.js"),n=require("./emptyState.js"),a=require("./style.js");const d=(e,t,s)=>{if(e.length<=t)return e;const i=e.slice(0,t-1);return(s?i.slice(0,i.lastIndexOf(" ")):i)+"..."},u=s=>{const{customCollectionRestriction:c,data:n,selectedCollectionsDispatch:u,setCollectionId:h,isPartiallyChecked:C,setScreen:x,id:j,isChecked:p,isDisabled:g,hideCollectionCheckbox:m}=s;return e.jsxs(a.CollectionCardStyle,Object.assign({isDisabled:g,onClick:()=>{g||(h(j),x("products"))}},{children:[e.jsxs(a.CollectionCardInfoStyle,{children:[!m&&e.jsx(i.CheckBox,{isDisabled:g,isChecked:p,isPartiallyChecked:C,onValueChange:function(e,t,s){null==s||s.stopPropagation(),u(e?{type:"selected",data:{id:j,val:n,isRestricted:c}}:{type:"unselected",data:{id:j}}),h(e?j:"")}}),e.jsx(a.CollectionCardDetailStyle,{children:e.jsxs(a.CollectionNameHolder,{children:[e.jsx(l.TitleRegular,{children:d(n.name,40,!0)}),n.isSmartCollection?e.jsx(r.Tag,{tagText:"Smart Collection",type:"warning"}):e.jsx(e.Fragment,{})]})})]}),e.jsx(o.IconButton,{height:12,width:12,disabled:g,Icon:t.default})]}))};exports.CollectionsScreen=t=>{const{customCollectionRestriction:i,dataLoading:o,collections:r,selectedCollectionsDispatch:l,setCollectionId:a,selectedCollections:d,setScreen:h,collectionFetcher:C,collectionsDispatch:x,pagingControls:j,storeId:p,setSaveDisabled:g,hideCollectionCheckbox:m}=t,v=s.useRef(null),b=s.useRef(j.curPage),y=!!i&&(null==d?void 0:d.isCustom),[k,f]=s.useState(!1);s.useEffect((()=>{b.current=j.curPage}),[j.curPage]),s.useEffect((()=>{const e=new IntersectionObserver((e=>{e[0].isIntersecting&&b.current>0&&(g(!0),f(!0),C(b.current,p).then((e=>{x({type:"paged",data:(null==e?void 0:e.collections)||{}}),j.setCurPage(b.current+1),f(!1),g(!1)})).catch())}),{threshold:1});return v.current&&e.observe(v.current),()=>{v.current&&e.unobserve(v.current)}}),[v]);const S=e=>{var t,s;let i=0,o=0;if(d[e]){const c=null===(t=r[e])||void 0===t?void 0:t.products;c&&Object.keys(c).forEach((e=>{var t;const s=null===(t=c[e])||void 0===t?void 0:t.variants;s&&Object.keys(s).forEach((e=>i+=1))}));const l=null===(s=d[e])||void 0===s?void 0:s.products;return l&&Object.keys(l).forEach((e=>{var t;const s=null===(t=l[e])||void 0===t?void 0:t.variants;s&&Object.keys(s).forEach((e=>o+=1))})),!(i<=0&&o>0)&&(o>0&&i!==o)}return!1};return e.jsxs("div",{children:[Object.keys(r).length?Object.keys(r).map((t=>e.jsx(u,{customCollectionRestriction:i,data:r[t],isDisabled:y&&!(null==d?void 0:d[t]),isChecked:!!(null==d?void 0:d[t]),isPartiallyChecked:S(t),selectedCollectionsDispatch:l,setCollectionId:a,setScreen:h,id:t,hideCollectionCheckbox:m},t))):o?[1,2,3,4,5,6,7,8,9,10].map(((t,s)=>e.jsx("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(c.BikShimmer,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),s))):e.jsx(n.EmptyState,{title:"No collections to show",subtitle:"We couldn’t find any collection."}),e.jsx("div",{ref:v}),k&&[1,2,3,4,5].map(((t,s)=>e.jsx("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(c.BikShimmer,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),s)))]})},exports.truncate=d;
|
|
@@ -56,7 +56,7 @@ export type ProductPickerInterface = {
|
|
|
56
56
|
storeId: string;
|
|
57
57
|
selectedItems: SelectedItems;
|
|
58
58
|
onAdd: (items: SelectedItems, total: number) => void;
|
|
59
|
-
onClose
|
|
59
|
+
onClose: () => void;
|
|
60
60
|
visible: boolean;
|
|
61
61
|
zIndex?: number;
|
|
62
62
|
limit?: number;
|
|
@@ -69,10 +69,6 @@ export type ProductPickerInterface = {
|
|
|
69
69
|
title?: string;
|
|
70
70
|
postHeader?: React.ReactNode;
|
|
71
71
|
width?: string;
|
|
72
|
-
renderWithoutModal?: boolean;
|
|
73
|
-
onClickSave?: number;
|
|
74
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
75
|
-
hideProductVariants?: boolean;
|
|
76
72
|
rearrangeEnabled?: boolean;
|
|
77
73
|
} & ({
|
|
78
74
|
startupScreen: ScreenName.RearrangeProducts;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),r=require("../../assets/icons/search.svg.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react/jsx-runtime"),r=require("../../assets/icons/search.svg.js"),c=require("react"),o=require("../../constants/Theme.js"),s=require("../button/Button.js"),n=require("../input/Input.js"),l=require("../modals/styledModal.js"),i=require("../spinner/Spinner.js"),a=require("../tag/Tag.js"),d=require("./collectionScreen.js"),u=require("./productScreen.js"),h=require("./rearrangeScreen.js"),p=require("./reducers.js"),S=require("./searchScreen.js"),C=require("./selectedScreen.js"),g=require("./style.js"),x=require("./type.js");exports.ScreenName=void 0,(e=exports.ScreenName||(exports.ScreenName={})).Collections="collections",e.RearrangeProducts="rearrange",e.SelectedProducts="view",e.SearchProducts="searchProducts",e.Products="products";exports.ProductPickerModal=e=>{const{storeId:j,selectedItems:m,onClose:v,visible:b,zIndex:y,limit:P,hideCollectionCheckbox:f,hideProductCheckbox:O,outOfStockAction:R=x.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:k,selectProductsFromCustomCollection:I,hideSelectionCount:q,title:F,width:T,startupScreen:E=exports.ScreenName.Collections,rearrangeEnabled:D}=e,[N,w]=c.useReducer(p.collectionsReducer,{}),[B,A]=c.useState([exports.ScreenName.Collections,exports.ScreenName.RearrangeProducts].includes(E)?E:exports.ScreenName.Collections),[L,_]=c.useState("grid"),[M,z]=c.useState(""),[G,H]=c.useState(0),[V,$]=c.useState(!1),[K,U]=c.useState(0),[Y,J]=c.useState(""),[Q,W]=c.useState(!1),[X,Z]=c.useState(!1),[ee,te]=c.useState(),[re,ce]=c.useReducer(p.selectedColectionsReducer,Object.keys(m).length>0?m:{});c.useEffect((()=>{$(!0),Z(!0),e.collectionFetcher(G,j).then((e=>{w({type:"fetched",data:(null==e?void 0:e.collections)||{}}),$(!1),H((e=>e+1)),Z(!1)})).catch()}),[]),c.useEffect((()=>{let e=0;Object.keys(re||[]).forEach((t=>{var r;Object.keys((null===(r=re[t])||void 0===r?void 0:r.products)||[]).forEach((r=>{var c,o;Object.keys((null===(o=null===(c=re[t].products)||void 0===c?void 0:c[r])||void 0===o?void 0:o.variants)||[]).forEach((()=>{e+=1}))}))})),U(e)})),c.useEffect((()=>{var t;M&&!(null===(t=null==N?void 0:N[M])||void 0===t?void 0:t.products)&&($(!0),e.productFetcher(M,j).then((e=>{Object.keys(e).length&&w({type:"productsFetched",data:{collectionId:M,products:e}}),$(!1)})).catch())}),[M]),c.useEffect((()=>{const t=setTimeout((()=>{"rearrange"!==B&&(Y.length?(W(!0),e.searchFetcher(j,Y).then((e=>{te(Object.assign({},e)),A("searchProducts"),$(!1),W(!1)}))):A("collections"))}),800);return()=>clearTimeout(t)}),[Y]);const oe=()=>{ce({type:"reset",data:{}})};return t.jsx(l.StyledModal,Object.assign({zIndex:y,open:b,onClose:()=>{v(),oe()},headingTitle:F||("collections"===B||"products"===B?"Select Products":"view"===B?"Selected Products":"searchProducts"===B?"Searched Products":"rearrange"===B?"Rearrange Products":void 0),footerShadow:!0,centralContainerStyles:{width:T||"480px"},headerRightCustomElement:"rearrange"===B?(console.log("ignore:",_),t.jsx(t.Fragment,{})):t.jsx(t.Fragment,{}),primaryButton:{buttonText:V?"Loading...":B===exports.ScreenName.RearrangeProducts?"Done":"Add",disabled:V||K<1||P&&K>P||!1,onClick:()=>{e.onAdd(re,K),oe()}},footerLeftCustomElement:q?t.jsx(t.Fragment,{}):P&&K>P?t.jsx(a.Tag,{tagText:`You can only select ${P} products`,type:"negative"}):K>0?t.jsx(s.Button,{onClick:()=>{A(D?exports.ScreenName.RearrangeProducts:exports.ScreenName.SelectedProducts)},buttonText:`${K} products selected`,buttonType:["rearrange","view"].includes(B)?"tertiaryGray":"tertiary",disabled:["rearrange","view"].includes(B)}):t.jsx(s.Button,{disabled:!0,buttonText:`${K} products selected`,buttonType:"tertiaryGray"})},{children:t.jsxs(g.ContainerStyle,{children:[e.postHeader&&t.jsx("div",Object.assign({style:{padding:"0 24px"}},{children:e.postHeader})),!e.hideGlobalSearch&&t.jsx(t.Fragment,{children:("collections"===B||"searchProducts"===B)&&t.jsx("div",Object.assign({style:{padding:"12px 24px",borderBottom:"1px solid #E0E0E0"}},{children:t.jsx(n.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>Q?t.jsx(i.Spinner,{size:"small",color:o.COLORS.content.primary}):t.jsx(r.default,{})},id:"listInput",height:"24px",type:"text",value:Y,onChangeText:e=>{e.length&&e.trim().length?J(e):J("")}})}))}),t.jsxs(g.ScrollContainerStyle,{children:["collections"===B&&t.jsx(d.CollectionsScreen,{customCollectionRestriction:e.customCollectionRestriction,dataLoading:X,collections:N,selectedCollectionsDispatch:ce,setCollectionId:z,setScreen:A,selectedCollections:re,collectionFetcher:e.collectionFetcher,storeId:j,collectionsDispatch:w,setSaveDisabled:$,pagingControls:{curPage:G,setCurPage:H},hideCollectionCheckbox:f}),"products"===B&&M&&t.jsx(p.CollectionIdContext.Provider,Object.assign({value:M},{children:t.jsx(u.ProductsScreen,{hideInCollectionSearch:e.hideInCollectionSearch,customCollectionRestriction:e.customCollectionRestriction,productFetcher:e.productFetcher,setScreen:A,storeId:j,data:N[M],collectionsDispatch:w,selectedCollectionsDispatch:ce,selectedData:re,setSaveDisabled:$,searchInCollectionFetcher:e.searchInCollectionFetcher,hideProductCheckbox:O,outOfStockAction:R,hideVariantCheckbox:k,selectProductsFromCustomCollection:I})})),"view"===B&&t.jsx(C.SelectedScreen,{selectedCollections:re||{},selectedCollectionsDispatch:ce,setScreen:A,collections:N}),"rearrange"===B&&t.jsx(h.RearrangeScreen,{selectedCollections:re||{},selectedCollectionsDispatch:ce,setScreen:A,outOfStockAction:R,rearrangeViewType:"grid"===L?"list":"grid"}),"searchProducts"===B&&t.jsx(S.SearchScreen,{customCollectionRestriction:e.customCollectionRestriction,selectedCollections:re||{},searchedCollections:ee||{},selectedCollectionsDispatch:ce,setScreen:A,collections:N,onBackPress:()=>{J(""),te({})}})]})]})}))};
|
|
@@ -18,9 +18,6 @@ interface ProductsScreenInterface {
|
|
|
18
18
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
19
19
|
hideVariantCheckbox?: boolean;
|
|
20
20
|
selectProductsFromCustomCollection?: boolean;
|
|
21
|
-
renderWithoutModal?: boolean;
|
|
22
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
23
|
-
hideProductVariants?: boolean;
|
|
24
21
|
}
|
|
25
22
|
export declare const ProductsScreen: (props: ProductsScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
26
23
|
interface ProductGroupInterface {
|
|
@@ -35,8 +32,6 @@ interface ProductGroupInterface {
|
|
|
35
32
|
hideProductCheckbox?: boolean;
|
|
36
33
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
37
34
|
hideVariantCheckbox?: boolean;
|
|
38
|
-
hideProductVariants?: boolean;
|
|
39
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
40
35
|
}
|
|
41
36
|
export declare const ProductGroup: (props: ProductGroupInterface) => import("react/jsx-runtime").JSX.Element;
|
|
42
37
|
interface ProductCardInterface {
|
|
@@ -53,8 +48,6 @@ interface ProductCardInterface {
|
|
|
53
48
|
hideProductCheckbox?: boolean;
|
|
54
49
|
outOfStockAction?: OUT_OF_STOCK_ACTION;
|
|
55
50
|
hideVariantCheckbox?: boolean;
|
|
56
|
-
hideProductVariants?: boolean;
|
|
57
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
58
51
|
}
|
|
59
52
|
export declare const ProductCard: (props: ProductCardInterface) => import("react/jsx-runtime").JSX.Element;
|
|
60
53
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),i=require("../../assets/icons/box.svg.js"),o=require("../../assets/icons/search.svg.js"),c=require("lodash"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),i=require("../../assets/icons/box.svg.js"),o=require("../../assets/icons/search.svg.js"),c=require("lodash"),s=require("react"),r=require("../tag/Tag.js"),d=require("../../constants/Theme.js"),l=require("../checkBox/CheckBox.js"),n=require("../icon-button/IconButton.js"),a=require("../input/Input.js"),u=require("../shimmer/ShimmerComponent/BikShimmer.js"),h=require("../shimmer-image/ShimmerImage.js"),p=require("../spinner/Spinner.js"),v=require("../TypographyStyle.js"),j=require("./collectionScreen.js"),x=require("./emptyState.js"),y=require("./helpers/ProductHelper.js"),g=require("./reducers.js"),C=require("./style.js"),m=require("./type.js"),b=require("./utility.js");const k=t=>{const{collectionId:i,productId:o,data:c,selectedData:s,selectedCollectionsDispatch:r,viewOnly:d,upliftAdditions:l,isProductPartiallyChecked:n,hideProductCheckbox:a,outOfStockAction:u,hideVariantCheckbox:h}=t,p=e=>{var t,c,r,d,l,n;if(!(null===(c=null===(t=null==s?void 0:s[i])||void 0===t?void 0:t.products)||void 0===c?void 0:c[o]))return!1;return!!(null===(n=null===(l=null===(d=null===(r=null==s?void 0:s[i])||void 0===r?void 0:r.products)||void 0===d?void 0:d[o])||void 0===l?void 0:l.variants)||void 0===n?void 0:n[e])};return e.jsxs("div",{children:[e.jsx(O,{isVariant:!1,data:c,productId:o,collectionId:i,isSelected:!!(null===(j=null===(v=null==s?void 0:s[i])||void 0===v?void 0:v.products)||void 0===j?void 0:j[o]),isPartiallyChecked:n,selectedCollectionsDispatch:r,upliftAdditions:l,viewOnly:d,hideProductCheckbox:a,hideVariantCheckbox:h},o),Object.keys(c.variants||[]).map((t=>e.jsx(O,{isVariant:!0,hideVariantCheckbox:h,data:c.variants[t],variantId:t,productId:o,viewOnly:d,upliftAdditions:l,collectionId:i,isSelected:p(t),selectedCollectionsDispatch:r,outOfStockAction:u},t)))]});var v,j},O=t=>{const{isVariant:i,data:o,productId:c,collectionId:s,variantId:d,isSelected:n,selectedCollectionsDispatch:a,viewOnly:u,upliftAdditions:p,isPartiallyChecked:x,hideProductCheckbox:g,outOfStockAction:m,hideVariantCheckbox:b}=t,k=y.ProductHelper.getProductLabels(o,m);return e.jsxs(C.ProductCardStyle,Object.assign({isVariant:i},{children:[i&&!u&&!b||!i&&!u&&!g?e.jsx(l.CheckBox,{isChecked:n,isPartiallyChecked:x||!1,onValueChange:function(e){i?e?p("variantSelected",{productId:c,variantId:d,collectionId:s,variant:o}):a({type:"variantUnselected",data:{productId:c,variantId:d,collectionId:s}}):e?p("productSelected",{productId:c,collectionId:s,product:o}):a({type:"productUnselected",data:{productId:c,collectionId:s}})}}):e.jsx(e.Fragment,{}),e.jsx("div",{children:e.jsx(h.ShimmerImage,{width:40,height:40,imageUrl:o.image,alt:"Item",borderRadius:4})}),e.jsxs("div",Object.assign({style:{display:"flex",flexDirection:"column"}},{children:[e.jsx(v.TitleRegular,{children:j.truncate(o.name,40,!0)}),k?e.jsx("div",Object.assign({style:{width:90,display:"flex"}},{children:e.jsx(r.Tag,{tagText:k,type:"warning",theme:"light"})})):e.jsx(e.Fragment,{})]}))]}))};exports.ProductCard=O,exports.ProductGroup=k,exports.ProductsScreen=r=>{const h=s.useContext(g.CollectionIdContext),{data:j,collectionsDispatch:y,selectedData:O,selectedCollectionsDispatch:f,productFetcher:I,storeId:S,setScreen:P,setSaveDisabled:q,hideInCollectionSearch:E,customCollectionRestriction:T,hideProductCheckbox:w,outOfStockAction:D=m.OUT_OF_STOCK_ACTION.BLUR,hideVariantCheckbox:A=!1,selectProductsFromCustomCollection:B=!1}=r,[V,R]=s.useState(""),[F,U]=s.useState(!1),[_,H]=s.useState(j);s.useEffect((()=>{const e=setTimeout((()=>{V.length?(U(!0),r.searchInCollectionFetcher(S,h,V).then((e=>{var t;const i=c.cloneDeep(j);i.products={};for(const o of e)(null===(t=null==j?void 0:j.products)||void 0===t?void 0:t[o])&&(i.products[o]=j.products[o]);H(i),q(!1),U(!1)}))):H(j)}),800);return()=>clearTimeout(e)}),[V]);const L=!!T&&j.isSmartCollection,K=e=>{var t,i,o,c,s,r,d,l;let n=0,a=0;return!!((null===(i=null===(t=null==O?void 0:O[h])||void 0===t?void 0:t.products)||void 0===i?void 0:i[e])&&(null===(s=Object.keys((null===(c=null===(o=null==j?void 0:j.products)||void 0===o?void 0:o[e])||void 0===c?void 0:c.variants)||[]))||void 0===s||s.forEach((()=>a++)),Object.keys((null===(l=null===(d=null===(r=null==O?void 0:O[h])||void 0===r?void 0:r.products)||void 0===d?void 0:d[e])||void 0===l?void 0:l.variants)||[]).forEach((()=>n++)),n>0&&a!==n))};s.useEffect((()=>{(null==j?void 0:j.products)||N()}),[]);const N=()=>{q(!0),U(!0),I(h,S).then((e=>{Object.keys(e).length&&(y({type:"productsFetched",data:{collectionId:h,products:e}}),H(Object.assign(Object.assign({},_),{products:e}))),q(!1),U(!1)})).catch()},W=(e,t)=>{const i=b.liftTheStateUp(t,j);f({type:e,data:Object.assign(Object.assign({},i),{isRestricted:T})})};return e.jsxs("div",{children:[e.jsxs(C.ProductScreenHeader,{children:[e.jsx(n.IconButton,{Icon:t.default,height:16,onClick:()=>{P("collections")}}),e.jsx(v.BodyCaption,Object.assign({style:{color:d.COLORS.content.secondary}},{children:j.name}))]}),!E&&e.jsx("div",Object.assign({style:{padding:16,height:"76px",borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(a.Input,{noKeyDownChange:!0,noErrorHint:!0,rightIcon:{icon:()=>F&&V.length?e.jsx(p.Spinner,{size:"small",color:d.COLORS.content.primary}):e.jsx(o.default,{})},id:"listInput",height:"24px",type:"text",value:V,onChangeText:e=>{e.length&&e.trim().length?R(e):R("")},placeholder:"Search products in this collection..."})})),e.jsxs("div",{children:[Object.keys((null==_?void 0:_.products)||[]).length>0&&!L&&!V.length&&!w&&e.jsxs(C.ProductScreenCollectionCardStyle,{children:[e.jsx(l.CheckBox,{isChecked:!!(null==O?void 0:O[h]),isPartiallyChecked:(e=>{var t;let i=0,o=0;if(O[e]){const c=null==j?void 0:j.products;c&&Object.keys(c).forEach((e=>{var t;const o=null===(t=c[e])||void 0===t?void 0:t.variants;o&&Object.keys(o).forEach((e=>i+=1))}));const s=null===(t=O[e])||void 0===t?void 0:t.products;return s&&Object.keys(s).forEach((e=>{var t;const i=null===(t=s[e])||void 0===t?void 0:t.variants;i&&Object.keys(i).forEach((()=>o+=1))})),o>0&&i!==o}return!1})(h),onValueChange:function(e){f(e?{type:"selected",data:{id:h,val:j}}:{type:"unselected",data:{id:h}})}}),e.jsx("div",Object.assign({style:{width:40,height:40}},{children:e.jsx(i.default,{})})),e.jsx(v.TitleRegular,{children:"All Products"})]}),Object.keys((null==_?void 0:_.products)||[]).length?Object.keys(_.products||[]).map((t=>e.jsx(k,{outOfStockAction:D,collectionId:h,isProductPartiallyChecked:K(t),productId:t,data:_.products[t],selectedData:O,selectedCollectionsDispatch:f,viewOnly:!B&&!!L,upliftAdditions:W,hideProductCheckbox:w,hideVariantCheckbox:A},t))):F?[1,2,3,4,5,6,7,8,9,10].map(((t,i)=>e.jsx("div",Object.assign({style:{borderBottom:"1px solid #E0E0E0"}},{children:e.jsx(u.BikShimmer,{boxes:[{height:"64px",width:"100%",marginTop:"0px"}]})}),i))):e.jsx(x.EmptyState,{title:"No products to show",subtitle:V.length?"We couldn't find the product you were looking for":"We couldn’t find any product in this collection."})]})]})};
|
|
@@ -11,10 +11,6 @@ interface SearchScreenInterface {
|
|
|
11
11
|
[key: string]: Collection;
|
|
12
12
|
};
|
|
13
13
|
onBackPress: () => void;
|
|
14
|
-
hideVariantCheckbox?: boolean;
|
|
15
|
-
pickerType?: 'COLLECTION' | 'PRODUCT';
|
|
16
|
-
hideProductVariants?: boolean;
|
|
17
|
-
hideProductCheckbox?: boolean;
|
|
18
14
|
}
|
|
19
15
|
export declare const SearchScreen: (props: SearchScreenInterface) => import("react/jsx-runtime").JSX.Element;
|
|
20
16
|
export {};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("../icon-button/IconButton.js"),i=require("../TypographyStyle.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("../../assets/icons/arrow_left.svg.js"),o=require("../icon-button/IconButton.js"),i=require("../TypographyStyle.js"),l=require("./emptyState.js"),s=require("./productScreen.js"),r=require("./style.js"),c=require("./utility.js");exports.SearchScreen=d=>{const{customCollectionRestriction:n,selectedCollections:u,searchedCollections:a,selectedCollectionsDispatch:v,setScreen:j,collections:p,onBackPress:h}=d,y=(e,t)=>{var o,i,l,s,r,c,d,n,a;let v=0,j=0;return!!((null===(i=null===(o=null==u?void 0:u[e])||void 0===o?void 0:o.products)||void 0===i?void 0:i[t])&&(null===(c=Object.keys((null===(r=null===(s=null===(l=null==p?void 0:p[e])||void 0===l?void 0:l.products)||void 0===s?void 0:s[t])||void 0===r?void 0:r.variants)||[]))||void 0===c||c.forEach((()=>j++)),Object.keys((null===(a=null===(n=null===(d=null==u?void 0:u[e])||void 0===d?void 0:d.products)||void 0===n?void 0:n[t])||void 0===a?void 0:a.variants)||[]).forEach((()=>v++)),v>0&&j!==v))};return e.jsxs("div",{children:[e.jsxs(r.SelectedScreenHeader,{children:[e.jsx(o.IconButton,{Icon:t.default,onClick:()=>{j("collections"),h()}}),e.jsx(i.BodyCaption,{children:"Searched Products"})]}),e.jsx("div",{children:Object.keys(a).length?e.jsx(e.Fragment,{children:Object.keys(a).map((t=>{var o;return Object.keys((null===(o=null==a?void 0:a[t])||void 0===o?void 0:o.products)||[]).map((o=>{let i=!1;return(null==a?void 0:a.isCustom)&&(i=!0),e.jsx(s.ProductGroup,{collectionId:t,upliftAdditions:(e,o)=>((e,t,o)=>{const i=c.liftTheStateUp(o,a[e]);v({type:t,data:Object.assign(Object.assign({},i),{isRestricted:n})})})(t,e,o),productId:o,data:a[t].products[o],isProductPartiallyChecked:y(t,o),selectedData:u,selectedCollectionsDispatch:v,viewOnly:i},o)}))}))}):e.jsx(l.EmptyState,{title:"No search results found",subtitle:"We couldn’t find the product you were looking for."})})]})};
|
|
@@ -2,7 +2,6 @@ export declare const ContainerStyle: import("styled-components").StyledComponent
|
|
|
2
2
|
export declare const ScrollContainerStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
3
3
|
export declare const CollectionCardStyle: import("styled-components").StyledComponent<"div", any, {
|
|
4
4
|
isDisabled: boolean;
|
|
5
|
-
isActive: boolean;
|
|
6
5
|
}, never>;
|
|
7
6
|
export declare const CollectionCardInfoStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
7
|
export declare const CollectionCardDetailStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -10,7 +9,6 @@ export declare const ProductScreenHeader: import("styled-components").StyledComp
|
|
|
10
9
|
export declare const ProductScreenCollectionCardStyle: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
11
10
|
export declare const ProductCardStyle: import("styled-components").StyledComponent<"div", any, {
|
|
12
11
|
isVariant: boolean;
|
|
13
|
-
isActive: boolean;
|
|
14
12
|
}, never>;
|
|
15
13
|
export declare const SelectedScreenHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
16
14
|
export declare const CollectionNameHolder: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("styled-components"),t=require("../../constants/Theme.js");function i(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("styled-components"),t=require("../../constants/Theme.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=i(e);const o=l.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
background-color: white;
|
|
4
4
|
max-height: 600px;
|
|
5
5
|
min-height: 600px;
|
|
6
6
|
flex-direction: column;
|
|
7
|
-
`,l
|
|
7
|
+
`,r=l.default.div`
|
|
8
8
|
overflow-y: scroll;
|
|
9
9
|
overflow-x: hidden;
|
|
10
|
-
`,d=
|
|
10
|
+
`,d=l.default.div`
|
|
11
11
|
height: 64px;
|
|
12
|
-
background-color: ${e=>e.isDisabled?"#F0F0F0":
|
|
12
|
+
background-color: ${e=>e.isDisabled?"#F0F0F0":"white"};
|
|
13
13
|
border-bottom: 1px solid #e0e0e0;
|
|
14
14
|
padding: 12px 24px;
|
|
15
15
|
display: flex;
|
|
@@ -17,21 +17,17 @@
|
|
|
17
17
|
column-gap: 16px;
|
|
18
18
|
justify-content: space-between;
|
|
19
19
|
align-items: center;
|
|
20
|
-
|
|
21
|
-
cursor: pointer;
|
|
22
|
-
background-color: ${t.COLORS.surface.hovered};
|
|
23
|
-
}
|
|
24
|
-
`,n=o.default.div`
|
|
20
|
+
`,n=l.default.div`
|
|
25
21
|
display: flex;
|
|
26
22
|
flex-direction: row;
|
|
27
23
|
justify-content: center;
|
|
28
24
|
align-items: center;
|
|
29
25
|
column-gap: 18px;
|
|
30
|
-
`,a=
|
|
26
|
+
`,a=l.default.div`
|
|
31
27
|
display: flex;
|
|
32
28
|
flex-direction: column;
|
|
33
29
|
justify-content: center;
|
|
34
|
-
`,p=
|
|
30
|
+
`,p=l.default.div`
|
|
35
31
|
display: flex;
|
|
36
32
|
flex-direction: row;
|
|
37
33
|
max-height: 32px;
|
|
@@ -41,16 +37,16 @@
|
|
|
41
37
|
align-items: center;
|
|
42
38
|
padding: 8px 16px;
|
|
43
39
|
margin-top: 16px;
|
|
44
|
-
`,
|
|
40
|
+
`,x=l.default.div`
|
|
45
41
|
display: flex;
|
|
46
42
|
flex-direction: row;
|
|
47
43
|
column-gap: 16px;
|
|
48
44
|
padding: 12px 16px;
|
|
49
45
|
border-bottom: 1px solid #e0e0e0;
|
|
50
46
|
align-items: center;
|
|
51
|
-
`,
|
|
47
|
+
`,c=l.default.div`
|
|
52
48
|
height: 64px;
|
|
53
|
-
background-color:
|
|
49
|
+
background-color: white;
|
|
54
50
|
border-bottom: 1px solid #e0e0e0;
|
|
55
51
|
padding: 12px 16px;
|
|
56
52
|
display: flex;
|
|
@@ -59,11 +55,7 @@
|
|
|
59
55
|
justify-content: flex-start;
|
|
60
56
|
align-items: center;
|
|
61
57
|
padding-left: ${e=>e.isVariant?"42px":"16px"};
|
|
62
|
-
|
|
63
|
-
cursor: pointer;
|
|
64
|
-
background-color: ${t.COLORS.surface.hovered};
|
|
65
|
-
}
|
|
66
|
-
`,s=o.default.div`
|
|
58
|
+
`,s=l.default.div`
|
|
67
59
|
display: flex;
|
|
68
60
|
flex-direction: row;
|
|
69
61
|
max-height: 32px;
|
|
@@ -72,10 +64,10 @@
|
|
|
72
64
|
justify-content: flex-start;
|
|
73
65
|
align-items: center;
|
|
74
66
|
padding: 8px 16px;
|
|
75
|
-
`,f=
|
|
67
|
+
`,f=l.default.div`
|
|
76
68
|
display: flex;
|
|
77
69
|
flex-direction: column;
|
|
78
|
-
`,u=
|
|
70
|
+
`,u=l.default.div`
|
|
79
71
|
height: 72px;
|
|
80
72
|
background: white;
|
|
81
73
|
padding: 12px 16px;
|
|
@@ -91,14 +83,14 @@
|
|
|
91
83
|
flex-direction: column;
|
|
92
84
|
gap: 2px;
|
|
93
85
|
}
|
|
94
|
-
`,g=
|
|
86
|
+
`,g=l.default.div`
|
|
95
87
|
height: 72px;
|
|
96
88
|
width: 72px;
|
|
97
89
|
display: flex;
|
|
98
90
|
align-items: center;
|
|
99
91
|
justify-content: center;
|
|
100
92
|
margin: 16px;
|
|
101
|
-
`;
|
|
93
|
+
`;l.default.div`
|
|
102
94
|
display: flex;
|
|
103
95
|
width: 32px;
|
|
104
96
|
height: 32px;
|
|
@@ -107,4 +99,4 @@
|
|
|
107
99
|
align-items: center;
|
|
108
100
|
border: 1px solid ${t.COLORS.stroke.primary};
|
|
109
101
|
border-radius: 4px;
|
|
110
|
-
`,exports.CollectionCardDetailStyle=a,exports.CollectionCardInfoStyle=n,exports.CollectionCardStyle=d,exports.CollectionNameHolder=f,exports.ContainerStyle=
|
|
102
|
+
`,exports.CollectionCardDetailStyle=a,exports.CollectionCardInfoStyle=n,exports.CollectionCardStyle=d,exports.CollectionNameHolder=f,exports.ContainerStyle=o,exports.ProductCardStyle=c,exports.ProductScreenCollectionCardStyle=x,exports.ProductScreenHeader=p,exports.ScrollContainerStyle=r,exports.SelectedScreenHeader=s,exports.VariantCardGridStyle=g,exports.VariantCardListStyle=u;
|
|
@@ -7,5 +7,4 @@ export type ShimmerImageProps = {
|
|
|
7
7
|
borderRadius?: number;
|
|
8
8
|
defaultImageUrl?: string;
|
|
9
9
|
};
|
|
10
|
-
export declare const DEFAULT_IMAGE = "https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";
|
|
11
10
|
export declare const ShimmerImage: React.FC<ShimmerImageProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../shimmer/ShimmerComponent/BikShimmer.js");const i="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),r=require("react"),t=require("../shimmer/ShimmerComponent/BikShimmer.js");const i="https://firebasestorage.googleapis.com/v0/b/bikayi-chat.appspot.com/o/images-uid%2F9034204a-cbf9-4b93-8b28-ccf880d273f9?alt=media&token=318529b5-8df0-4644-85b0-40fff1dc1d5c";exports.ShimmerImage=s=>{let{imageUrl:a,width:o,height:l,borderRadius:d,alt:n,defaultImageUrl:m=i}=s;const[u,c]=r.useState(!0),[h,g]=r.useState(!1);return r.useEffect((()=>{const e=new Image;return e.src=a,e.onload=()=>{g(!1),c(!1)},e.onerror=()=>{g(!0),c(!1)},()=>{e.onload=null,e.onerror=null}}),[a]),e.jsxs("div",Object.assign({style:{position:"relative",width:o,height:l,borderRadius:d}},{children:[u&&e.jsx(t.BikShimmer,{boxes:[{height:`${l}px`,width:`${o}px`,marginTop:"0px"}]}),h?e.jsx("img",{src:m,alt:null!=n?n:"Image",style:{borderRadius:null!=d?d:0,display:"block",width:"100%",height:"100%"}}):e.jsx("img",{src:a,alt:null!=n?n:"Image",style:{borderRadius:null!=d?d:0,display:u?"none":"block",width:"100%",height:"100%"}})]}))};
|
|
@@ -7,11 +7,9 @@ export interface SideModalProps {
|
|
|
7
7
|
footerDirection?: 'row' | 'row-reverse';
|
|
8
8
|
hideCrossButton?: boolean;
|
|
9
9
|
width?: string;
|
|
10
|
-
saveButtonProps
|
|
11
|
-
cancelButtonProps
|
|
10
|
+
saveButtonProps: ButtonProps;
|
|
11
|
+
cancelButtonProps: ButtonProps;
|
|
12
12
|
onClose: () => void;
|
|
13
13
|
zIndex?: number;
|
|
14
|
-
hideFooter?: boolean;
|
|
15
|
-
bodyStyle?: React.CSSProperties;
|
|
16
14
|
}
|
|
17
15
|
export declare const SideModal: React.FC<SideModalProps>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react-dom"),o=require("../../assets/icons/cross.svg.js"),r=require("../button/Button.js"),s=require("../TypographyStyle.js"),i=require("./SideModal.style.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=n(t);exports.SideModal=t=>d.default.createPortal(e.jsx(i.SideModalStyle,Object.assign({zIndex:t.zIndex},{children:e.jsxs(i.SideModalContainer,Object.assign({width:t.width},{children:[e.jsxs(i.SideModalHeader,{children:[e.jsx(s.TitleMedium,{children:t.header}),!t.hideCrossButton&&e.jsx(o.default,{width:24,height:24,onClick:t.onClose})]}),e.jsx(i.SideModalBody,
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react-dom"),o=require("../../assets/icons/cross.svg.js"),r=require("../button/Button.js"),s=require("../TypographyStyle.js"),i=require("./SideModal.style.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var d=n(t);exports.SideModal=t=>d.default.createPortal(e.jsx(i.SideModalStyle,Object.assign({zIndex:t.zIndex},{children:e.jsxs(i.SideModalContainer,Object.assign({width:t.width},{children:[e.jsxs(i.SideModalHeader,{children:[e.jsx(s.TitleMedium,{children:t.header}),!t.hideCrossButton&&e.jsx(o.default,{width:24,height:24,onClick:t.onClose})]}),e.jsx(i.SideModalBody,{children:t.children}),e.jsxs(i.SideModalFooter,Object.assign({footerDirection:t.footerDirection},{children:[e.jsxs(i.FooterButtonWrapper,Object.assign({footerDirection:t.footerDirection},{children:[e.jsx(r.Button,Object.assign({},t.saveButtonProps)),e.jsx(r.Button,Object.assign({},t.cancelButtonProps))]})),t.footerCustomComponent?t.footerCustomComponent:e.jsx(e.Fragment,{})]}))]}))})),document.body);
|
|
@@ -5,10 +5,7 @@ export declare const SideModalContainer: import("styled-components").StyledCompo
|
|
|
5
5
|
width?: string | undefined;
|
|
6
6
|
}, never>;
|
|
7
7
|
export declare const SideModalHeader: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
8
|
-
export declare const SideModalBody: import("styled-components").StyledComponent<"div", any, {
|
|
9
|
-
hideFooter?: boolean | undefined;
|
|
10
|
-
bodyStyle: React.CSSProperties;
|
|
11
|
-
}, never>;
|
|
8
|
+
export declare const SideModalBody: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
12
9
|
export declare const SideModalFooter: import("styled-components").StyledComponent<"div", any, {
|
|
13
10
|
footerDirection?: "row" | "row-reverse" | undefined;
|
|
14
11
|
}, never>;
|
|
@@ -34,10 +34,7 @@
|
|
|
34
34
|
`,s=d.default.div`
|
|
35
35
|
overflow-y: auto;
|
|
36
36
|
padding: 24px;
|
|
37
|
-
height:
|
|
38
|
-
${t=>{let{bodyStyle:o}=t;return e.css`
|
|
39
|
-
${Object.keys(o).map((e=>`${e}: ${o[e]};`)).join("\n")}
|
|
40
|
-
`}}
|
|
37
|
+
height: calc(100% - 120px);
|
|
41
38
|
`,p=d.default.div`
|
|
42
39
|
height: 60px;
|
|
43
40
|
width: 100%;
|
|
@@ -3,7 +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, GlobalPlaceholderType } from '../template-preview/models/TemplateMeta';
|
|
6
|
-
import {
|
|
6
|
+
import { WhatsAppPickerMeta, WhatsAppTemplate, WhatsAppTemplateVariables } from '../template-preview/models/WhatsAppTemplate';
|
|
7
7
|
export interface TemplateContextMapperProps {
|
|
8
8
|
selectedTemplate: WhatsAppTemplate | EmailTemplateType | SMSTemplateType;
|
|
9
9
|
closeDialog?: () => void;
|
|
@@ -11,7 +11,7 @@ export interface TemplateContextMapperProps {
|
|
|
11
11
|
channel: CHANNEL_TYPE;
|
|
12
12
|
globalPlaceholders: GlobalPlaceholderType;
|
|
13
13
|
/** List of variables being used in this template */
|
|
14
|
-
templateVariables: CUSTOM_VARIABLE[]
|
|
14
|
+
templateVariables: CUSTOM_VARIABLE[];
|
|
15
15
|
/** Only for initial-UI-purpose for the modal */
|
|
16
16
|
htmlContent: string;
|
|
17
17
|
showOnlyContent?: boolean;
|
|
@@ -20,14 +20,10 @@ export interface TemplateContextMapperProps {
|
|
|
20
20
|
zIndex?: number;
|
|
21
21
|
showVariableModal?: boolean;
|
|
22
22
|
variableList?: VariableListInterfaceV2[];
|
|
23
|
-
variableListForImage?: VariableListInterfaceV2[];
|
|
24
23
|
onBackPress?: () => void;
|
|
25
24
|
discountCode?: string;
|
|
26
25
|
setDiscountCode?: (code: string) => void;
|
|
27
26
|
enabledCustomText?: boolean;
|
|
28
|
-
showSampleValues?: boolean;
|
|
29
27
|
disableEditVariable?: boolean;
|
|
30
|
-
pod?: POD;
|
|
31
|
-
extras?: Extras;
|
|
32
28
|
}
|
|
33
|
-
export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText,
|
|
29
|
+
export declare const TemplateContextMapper: ({ selectedTemplate, closeDialog, showVariableMapping, channel, htmlContent, templateVariables, onTemplateSelect, globalPlaceholders, showOnlyContent, whatsappSpecificPickerMeta, zIndex, showVariableModal, variableList, discountCode, setDiscountCode, onBackPress, enabledCustomText, disableEditVariable, }: TemplateContextMapperProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -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"),i=require("./context/templateModalContext.js"),o=require("./modalElements/Footer.js"),r=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:
|
|
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"),i=require("./context/templateModalContext.js"),o=require("./modalElements/Footer.js"),r=require("./modalElements/TemplateSelectModalContent.js"),n=require("./utils/convertPlaceholdersToBikDropdown.js");exports.TemplateContextMapper=d=>{let{selectedTemplate:c,closeDialog:u,showVariableMapping:p,channel:m,htmlContent:b,templateVariables:h,onTemplateSelect:C,globalPlaceholders:g,showOnlyContent:S,whatsappSpecificPickerMeta:T,zIndex:v,showVariableModal:E,variableList:j,discountCode:x,setDiscountCode:M,onBackPress:P,enabledCustomText:L,disableEditVariable:f}=d;var w,q;t.useEffect((()=>{V(b)}),[b]);const[y,A]=t.useState(m===s.CHANNEL_TYPE.EMAIL?"desktop":"mobile"),[N,V]=t.useState(b),[k,D]=t.useState(!1),[_,H]=t.useState(c),[I,O]=t.useState(null!=h?h:[]),[B,Y]=t.useState(!1);const z=t.useMemo((()=>n.convertPlaceholdersToBikDropdown(g)),[g]);return e.jsx(i.TemplateModalContext.Provider,Object.assign({value:{template:_,setTemplate:H,device:y,setDevice:A,display_content:N,setDisplayContent:V,originalVariableList:I,setOriginalVariableList:O,isError:k,setIsError:D,channel:m,globalNormalizedPlaceholders:z,templateSelectionTriggered:B,setTemplateSelectionTriggered:Y,enabledCustomText:L,disableEditVariable:f}},{children:S?e.jsx(r.default,{channel:s.CHANNEL_TYPE.EMAIL,hideHeader:!0}):e.jsxs(a.StyledModal,Object.assign({zIndex:v,centralContainerStyles:{width:m===s.CHANNEL_TYPE.EMAIL&&p?1e3:650},open:!0,onClose:()=>{null==u||u()},headingTitle:null==_?void 0:_.label,headingSubtitle:m===s.CHANNEL_TYPE.WHATSAPP?`${l.default.capitaliseFirstLetterOfString(null!==(w=null==_?void 0:_.category)&&void 0!==w?w:"")} • ${null!==(q=null==_?void 0:_.templateCategory)&&void 0!==q?q:""}`:"",onBackPress:()=>{null==P||P()}},{children:[e.jsx(r.default,{showVariableMapping:p,channel:m,whatsappSpecificPickerMeta:T,showVariableModal:E,variableList:j,discountCode:x,setDiscountCode:M}),C?e.jsx(o.default,{onSelect:function(){const e=null==C?void 0:C(_,I,null!=N?N:"");e?D(!!e):Y(!0)}}):e.jsx(e.Fragment,{})]}))}))};
|
|
@@ -3,7 +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 {
|
|
6
|
+
import { WhatsAppTemplate, WhatsAppTemplateVariables } from "../../template-preview/models/WhatsAppTemplate";
|
|
7
7
|
export type DEVICE_TYPES = 'desktop' | 'mobile';
|
|
8
8
|
export declare const TemplateModalContext: React.Context<{
|
|
9
9
|
device: DEVICE_TYPES;
|
|
@@ -23,8 +23,6 @@ export declare const TemplateModalContext: React.Context<{
|
|
|
23
23
|
setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
|
|
24
24
|
enabledCustomText?: boolean | undefined;
|
|
25
25
|
disableEditVariable?: boolean | undefined;
|
|
26
|
-
pod?: string | undefined;
|
|
27
|
-
extras?: Extras | undefined;
|
|
28
26
|
}>;
|
|
29
27
|
export declare const useTemplateModalContext: () => {
|
|
30
28
|
device: DEVICE_TYPES;
|
|
@@ -44,6 +42,4 @@ export declare const useTemplateModalContext: () => {
|
|
|
44
42
|
setTemplateSelectionTriggered?: React.Dispatch<React.SetStateAction<boolean>> | undefined;
|
|
45
43
|
enabledCustomText?: boolean | undefined;
|
|
46
44
|
disableEditVariable?: boolean | undefined;
|
|
47
|
-
pod?: string | undefined;
|
|
48
|
-
extras?: Extras | undefined;
|
|
49
45
|
};
|
|
@@ -6,10 +6,8 @@ export interface BodyProps {
|
|
|
6
6
|
whatsappSpecificPickerMeta?: WhatsAppPickerMeta;
|
|
7
7
|
showVariableModal?: boolean;
|
|
8
8
|
variableList?: VariableListInterfaceV2[];
|
|
9
|
-
variableListForImage?: VariableListInterfaceV2[];
|
|
10
9
|
discountCode?: string;
|
|
11
10
|
setDiscountCode?: (code: string) => void;
|
|
12
|
-
showSampleValues?: boolean;
|
|
13
11
|
}
|
|
14
12
|
declare const Body: (props: BodyProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
13
|
export default Body;
|
|
@@ -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"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("react"),l=require("styled-components"),n=require("../../template-preview/models/Channels.js"),o=require("../../../constants/Theme.js"),i=require("../context/templateModalContext.js"),a=require("../utils/getVariableNameEmail.js"),r=require("../utils/highlightFor.js"),s=require("./DesktopPreview.js"),d=require("./EditWhatsAppTemplateV2.js"),u=require("./MobilePreview.js"),c=require("./VariableConnectorsPanel.js");function p(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=p(l);const m=h.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
// height: 100%;
|
|
4
4
|
`,f=h.default.div`
|
|
5
5
|
padding: 16px 14px;
|
|
6
6
|
max-width: 350px;
|
|
7
7
|
|
|
8
|
-
height: ${e=>e.channel===
|
|
8
|
+
height: ${e=>e.channel===n.CHANNEL_TYPE.WHATSAPP?"500px":"475px"};
|
|
9
9
|
overflow-y: 'auto';
|
|
10
10
|
padding-bottom: 24px;
|
|
11
|
-
border-left: ${
|
|
12
|
-
`,
|
|
11
|
+
border-left: ${o.COLORS.stroke.primary} 1px solid;
|
|
12
|
+
`,x=h.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:p,showOnlyContent:h,whatsappSpecificPickerMeta:
|
|
17
|
+
`;exports.default=l=>{const{showVariableMapping:p,showOnlyContent:h,whatsappSpecificPickerMeta:g,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:w}=l,C=t.useRef(),E=t.useRef(),{device:y,display_content:P,channel:T,template:L,setTemplate:M}=i.useTemplateModalContext();const _=e=>{let t=0;for(;e;)t+=e.offsetTop,e=e.offsetParent;return t};return e.jsxs(m,{children:[e.jsx(x,Object.assign({showOnlyContent:h,showVariableMapping:p},{children:"mobile"===y?e.jsx(u.default,{ref:E,display_content:null!=P?P:"",channel:T,template:L}):T!==n.CHANNEL_TYPE.MESSAGE?e.jsx(s.default,{ref:C,channel:T,display_content:null!=P?P:""}):e.jsx(e.Fragment,{})})),p&&e.jsx(f,Object.assign({channel:T},{children:T!==n.CHANNEL_TYPE.WHATSAPP?e.jsx(c.default,{onFocus:T===n.CHANNEL_TYPE.EMAIL?function(e){var t,l,i;const s=null===document||void 0===document?void 0:document.getElementById("mobile"===y?"template_html_mobile":"template_html_desktop"),d=a.getVariableNameForEmailByIndex(e+1),u=T===n.CHANNEL_TYPE.EMAIL?null===(t=null==s?void 0:s.contentWindow)||void 0===t?void 0:t.document.getElementById(d):document.getElementById(d),c=_(u),p=null==u?void 0:u.offsetLeft;"desktop"===y?c&&C.current&&(null===(l=null==s?void 0:s.contentWindow)||void 0===l||l.scrollTo(null!=p?p:0,c),r.highlightFor(d,o.COLORS.background.warning.light,2,T,y)):c&&E.current&&(null===(i=null==s?void 0:s.contentWindow)||void 0===i||i.scrollTo(null!=p?p:0,c),r.highlightFor(d,o.COLORS.background.warning.light,2,T,y))}:void 0,showVariableModal:v,variableList:b,discountCode:j,setDiscountCode:w}):e.jsx(d.default,{whatsappSpecificPickerMeta:g,template:L,onTemplateChange:e=>{null==M||M(e)},showVariableModal:v,variableList:b})}))]})};
|