@bikdotai/bik-component-library 0.0.698 → 0.0.699-beta.2
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/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/cjs/components/buttonGroup/ButtonGroup.js +1 -1
- package/dist/cjs/components/buttonGroup/ButtonGroupStyle.d.ts +1 -0
- package/dist/cjs/components/buttonGroup/ButtonGroupStyle.js +6 -4
- package/dist/cjs/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
- package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/cjs/components/template-context-mapper/utils/constants.d.ts +1 -0
- package/dist/cjs/components/template-context-mapper/utils/constants.js +1 -1
- package/dist/cjs/components/template-preview/models/TemplateMeta.d.ts +5 -0
- package/dist/cjs/components/template-preview/models/TemplateMeta.js +1 -1
- package/dist/cjs/components/text-picker/TextPickerCategoryCard.d.ts +12 -0
- package/dist/cjs/components/text-picker/TextPickerCategoryCard.js +13 -0
- package/dist/cjs/components/text-picker/TextPickerFooter.d.ts +6 -0
- package/dist/cjs/components/text-picker/TextPickerFooter.js +13 -0
- package/dist/cjs/components/text-picker/TextPickerItemRow.d.ts +11 -0
- package/dist/cjs/components/text-picker/TextPickerItemRow.js +17 -0
- package/dist/cjs/components/text-picker/TextPickerModal.d.ts +29 -0
- package/dist/cjs/components/text-picker/TextPickerModal.js +26 -0
- package/dist/cjs/components/text-picker/TextPickerSelectAllRow.d.ts +7 -0
- package/dist/cjs/components/text-picker/TextPickerSelectAllRow.js +17 -0
- package/dist/cjs/components/text-picker/index.d.ts +1 -0
- package/dist/cjs/index.d.ts +1 -0
- package/dist/cjs/index.js +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/components/EventsTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/EVENTS/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/components/IGTrigger.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts +1 -1
- package/dist/esm/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts +2 -2
- package/dist/esm/components/buttonGroup/ButtonGroup.js +1 -1
- package/dist/esm/components/buttonGroup/ButtonGroupStyle.d.ts +1 -0
- package/dist/esm/components/buttonGroup/ButtonGroupStyle.js +15 -13
- package/dist/esm/components/template-context-mapper/modalElements/EditWhatsAppTemplateV2.js +2 -2
- package/dist/esm/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js +1 -1
- package/dist/esm/components/template-context-mapper/utils/constants.d.ts +1 -0
- package/dist/esm/components/template-context-mapper/utils/constants.js +1 -1
- package/dist/esm/components/template-preview/models/TemplateMeta.d.ts +5 -0
- package/dist/esm/components/template-preview/models/TemplateMeta.js +1 -1
- package/dist/esm/components/text-picker/TextPickerCategoryCard.d.ts +12 -0
- package/dist/esm/components/text-picker/TextPickerCategoryCard.js +13 -0
- package/dist/esm/components/text-picker/TextPickerFooter.d.ts +6 -0
- package/dist/esm/components/text-picker/TextPickerFooter.js +13 -0
- package/dist/esm/components/text-picker/TextPickerItemRow.d.ts +11 -0
- package/dist/esm/components/text-picker/TextPickerItemRow.js +17 -0
- package/dist/esm/components/text-picker/TextPickerModal.d.ts +29 -0
- package/dist/esm/components/text-picker/TextPickerModal.js +26 -0
- package/dist/esm/components/text-picker/TextPickerSelectAllRow.d.ts +7 -0
- package/dist/esm/components/text-picker/TextPickerSelectAllRow.js +17 -0
- package/dist/esm/components/text-picker/index.d.ts +1 -0
- package/dist/esm/index.d.ts +1 -0
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const EventsTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default EventsTrigger;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
import { QueryBuilderNodeProps } from "../../../
|
|
2
|
+
import { QueryBuilderNodeProps } from "../../../Types/QueryBuilderNodeProps.type";
|
|
3
3
|
declare const IGTrigger: React.FC<QueryBuilderNodeProps>;
|
|
4
4
|
export default IGTrigger;
|
package/dist/cjs/components/QueryBuilder/Triggers/IG/selectors/useIGTriggerNameCacheSelector.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { QueryBuilderAPIData } from "../../../
|
|
1
|
+
import { QueryBuilderAPIData } from "../../../Types/QueryBuilderAPI.type";
|
|
2
2
|
export declare const useIGTriggerNameCacheSelector: () => QueryBuilderAPIData[];
|
package/dist/cjs/components/QueryBuilder/Triggers/components/BaseTriggerQueryBuilderNode.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { DropdownOption } from "../../../dropdown/type";
|
|
3
|
-
import { QueryBuilderProperty } from "../../
|
|
4
|
-
import { QueryBuilderNodeProps } from "../../
|
|
3
|
+
import { QueryBuilderProperty } from "../../Types/QueryBuilder.type";
|
|
4
|
+
import { QueryBuilderNodeProps } from "../../Types/QueryBuilderNodeProps.type";
|
|
5
5
|
declare const BaseTriggerQueryBuilderNode: React.FC<QueryBuilderNodeProps & {
|
|
6
6
|
cacheKey: string;
|
|
7
7
|
propertyAddBtnText: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("../../node_modules/react/jsx-runtime.js"),i=require("react"),e=require("../TypographyStyle.js"),o=require("../../constants/Theme.js"),n=require("./ButtonGroupStyle.js");exports.ButtonGroup=s=>{const[r,u]=i.useState(void 0);i.useEffect((()=>{u(s.activeButtonId||void 0)}),[null==s?void 0:s.activeButtonId]);return t.jsxRuntimeExports.jsx(n.ButtonGroupStyle,Object.assign({className:"button-group",width:s.width||"100%",gap:s.gap,size:s.size,iconPosition:s.iconPosition},{children:s.buttonGroup.map((i=>{var c,d;const a=null==i?void 0:i.icon;return t.jsxRuntimeExports.jsxs(n.Button,Object.assign({borderRadius:null!==(c=s.borderRadius)&&void 0!==c?c:"4px",matchParentWidth:null===(d=s.matchParentWidth)||void 0===d||d,className:"button",isActive:r===i.id,onClick:()=>(t=>{u(t.id),s.onButtonClick(t.id)})(i),iconPosition:s.iconPosition,size:s.size,backgroundColor:s.backgroundColor||o.COLORS.surface.subdued},{children:[(null==s?void 0:s.iconPosition)&&a&&t.jsxRuntimeExports.jsx("div",Object.assign({className:"button__image"},{children:t.jsxRuntimeExports.jsx(a,{color:r===i.id?o.COLORS.background.inverseLight:o.COLORS.content.secondary,width:(null==s?void 0:s.iconWidth)||"18px",height:(null==s?void 0:s.iconHeight)||"18px"})})),t.jsxRuntimeExports.jsx("div",Object.assign({className:"button__name"},{children:t.jsxRuntimeExports.jsx(e.BodySecondary,Object.assign({style:{color:r===i.id?o.COLORS.background.inverseLight:o.COLORS.content.secondary}},{children:i.title}))}))]}),i.id)}))}))};
|
|
@@ -2,6 +2,7 @@ export declare const ButtonGroupStyle: import("styled-components").StyledCompone
|
|
|
2
2
|
width: string | undefined;
|
|
3
3
|
size: 'small' | 'medium' | 'large';
|
|
4
4
|
gap: string | undefined;
|
|
5
|
+
iconPosition?: "left" | "right" | "top" | undefined;
|
|
5
6
|
}, never>;
|
|
6
7
|
export declare const Button: import("styled-components").StyledComponent<"div", any, {
|
|
7
8
|
isActive: boolean;
|
|
@@ -1,21 +1,23 @@
|
|
|
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 o=i(e);const
|
|
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 o=i(e);const n={small:"8px 12px",medium:"10px 12px",large:"14px 12px"},r={small:"36px",medium:"40px",large:"48px"},s=o.default.div`
|
|
2
2
|
display: flex;
|
|
3
3
|
flex-direction: row;
|
|
4
4
|
width: ${e=>e.width||"100%"};
|
|
5
|
-
height: ${e=>e.size?
|
|
5
|
+
height: ${e=>"top"===e.iconPosition?"auto":e.size?r[e.size]:"36px"};
|
|
6
|
+
min-height: ${e=>"top"===e.iconPosition?e.size?r[e.size]:"36px":"auto"};
|
|
6
7
|
gap: ${e=>e.gap||"12px"};
|
|
7
8
|
`,p=o.default.div`
|
|
8
9
|
display: flex;
|
|
9
10
|
flex-direction: ${e=>"top"!==e.iconPosition?"left"===e.iconPosition?"row":"row-reverse":"column"};
|
|
10
11
|
flex: ${e=>e.matchParentWidth?1:"unset"};
|
|
11
|
-
height: 100
|
|
12
|
+
height: ${e=>"top"===e.iconPosition?"auto":"100%"};
|
|
13
|
+
min-height: ${e=>"top"===e.iconPosition?"100%":"auto"};
|
|
12
14
|
background: ${e=>e.isActive?t.COLORS.background.brandLight:e.backgroundColor};
|
|
13
15
|
border: 1px solid
|
|
14
16
|
${e=>e.isActive?t.COLORS.background.inverseLight:t.COLORS.stroke.primary};
|
|
15
17
|
border-radius: ${e=>e.borderRadius};
|
|
16
18
|
align-items: center;
|
|
17
19
|
justify-content: center;
|
|
18
|
-
padding: ${e=>e.size?
|
|
20
|
+
padding: ${e=>e.size?n[e.size]:"8px 10px"};
|
|
19
21
|
gap: ${e=>e.iconPosition&&"top"!==e.iconPosition?"10px":"2px"};
|
|
20
22
|
.button {
|
|
21
23
|
align-items: center;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../curtain/CurtainHelper.js");var
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js");require("../../curtain/CurtainHelper.js");var t=require("../../variable-picker-v3/model.js"),n=require("lodash"),o=require("react"),i=require("styled-components"),l=require("../../input/Input.js"),a=require("../../input-with-vars/InputWithVariables.js"),s=require("../../template-preview/helpers/templateMiscHelper.js"),d=require("../../template-preview/models/TemplateMeta.js"),r=require("../../template-preview/models/WhatsAppTemplate.js"),u=require("../context/templateModalContext.js"),p=require("../utils/constants.js"),c=require("../utils/getDataFromTemplateComponent.js"),v=require("../utils/validateIsUrl.js"),m=require("../utils/validateName.js"),b=require("./BackTrackComponent.js"),g=require("./DiscountCodeComponent.js"),x=require("./EditMediaModal.js"),j=require("./EditMediaV2.js"),h=require("./EditMediaV2.style.js"),f=require("./useEditWhtasappTemplateMedia.js"),C=require("./VariableConnector.js"),T=require("./VariableConnectorsPanel.js"),E=require("./VariableConnectorWhatsApp.js"),O=require("./VariableEditorHeader.js"),y=require("./WhatsAppTemplateCardButtonV2.js");function R(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const V=R(i).default.div`
|
|
2
2
|
padding-top: 24px;
|
|
3
3
|
padding-left: 10px;
|
|
4
4
|
padding-right: 10px;
|
|
5
5
|
margin-bottom: 8px;
|
|
6
6
|
line-height: normal;
|
|
7
|
-
`;exports.default=i=>{let{template:R,onTemplateChange:B,whatsappSpecificPickerMeta:M,showVariableModal:k,variableListForImage:D,setDiscountCode:I,fileName:q,setFileName:P}=i;var L,w,A,U,N,_,H,S,F,Q,Y,W,K,$,G,X,z,J,Z,ee,ne,te,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,xe,je,he;const fe=R.isCarouselType,{originalVariableList:Ce,pod:Te,extras:Ee,selectedCarouselIndex:Oe,isProductCarouselType:ye,disableCopyCode:Re,isError:Ve,cardIndex:Be}=u.useTemplateModalContext(),{descriptionComponents:Me,urlBtns:ke,qrbBtns:De,imageComponent:Ie,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(R),we=o.useRef(null),[Ae,Ue]=o.useState(!1),[Ne,_e]=o.useState(-1===Oe?{descriptionComponents:Me,urlBtns:ke,qrbBtns:De,imageComponent:Ie,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:He,uploadMediaFiles:Se,validateMimeType:Fe}=M,Qe=f.useEditWhatsappTemplateMedia({uploadMediaLink:He,uploadMediaFiles:Se,updateTemplateImageUrl:function(e,n){var o,i,l,a,s,d,r,u;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(o=R.components[Be])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==R?void 0:R.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const t=Object.assign(Object.assign({},p.components[c]),{format:n,example:{header_handle:[e]}}),o=[...p.components];o[c]=t,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=t.cloneDeep(R);e.components[Be].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Oe]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==B||B(Object.assign({},e)),We(!0)}else null==B||B(Object.assign({},p))},validateMimeType:Fe,mediaComponent:fe?Ne.imageComponent:Ie,fileRef:we}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(q),[Ge,Xe]=o.useState();function ze(e,n,o){var i,l,a,d,r,u,p,c,v,m;const b=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R),g=t.cloneDeep(b),x="custom"===n&&"string"==typeof e,j=x?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&ye){const n=Object.assign({},R).components.map((e=>{var n;return s.isCarouselComponent(e.type)?Object.assign(Object.assign({},e),{cards:null===(n=e.cards)||void 0===n?void 0:n.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var n,t,i;if("BUTTONS"===e.type){const l=null===(n=e.buttons)||void 0===n?void 0:n.filter((e=>"URL"===e.type));let a=null!==(t=null==l?void 0:l[o])&&void 0!==t?t:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[j]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(d=null===(a=Object.assign({},R).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((n=>{var t;return Object.assign(Object.assign({},n),{buttons:null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.map(((n,t)=>t===o?x?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":n))})})),l=t.cloneDeep(R);return l.components=n,l.mapping.cards=i,void(null==B||B(Object.assign({},l)))}const h=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const t=null===(r=null==g?void 0:g.components[h].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==t?void 0:t.length)>0){const i="custom"===n&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=t[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[h]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[h]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?Ue(!0):(Ue(!1),null==I||I(""))}if(null!=Oe&&Oe>-1){const e=t.cloneDeep(R);e.components[Be].cards[Oe].components=g.components,e.mapping.cards[Oe]=g.mapping,null==B||B(Object.assign({},e))}else null==B||B(g)}function Je(e,n,o){var i,l,a,d,r,u,p;const c=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R);if(null!=Oe&&Oe>-1&&ye){const n=Object.assign({},R).components.map((n=>{var t;return s.isCarouselComponent(n.type)?Object.assign(Object.assign({},n),{cards:null===(t=n.cards)||void 0===t?void 0:t.map((n=>Object.assign(Object.assign({},n),{components:n.components.map((n=>{var t,i,l;if("BUTTONS"===n.type){const a=null===(t=null==n?void 0:n.buttons)||void 0===t?void 0:t.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==n?void 0:n.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},n),{buttons:d})}return n}))})))}):n})),i=t.cloneDeep(R);return i.components=n,void(null==B||B(Object.assign({},i)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const n=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(n){let t=n[o];t=Object.assign(Object.assign({},t),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Oe&&Oe>-1){const e=t.cloneDeep(R);e.components[Be].cards[Oe].components=c.components,null==B||B(Object.assign({},e))}else null==B||B(c)}o.useEffect((()=>{var e,n;if(null===(e=R.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))Ue(!0);else{Ue(!1);const e=null===(n=null==Ee?void 0:Ee.discountCodeExtra)||void 0===n?void 0:n[1];null==e||e("")}}),[R]),o.useEffect((()=>{var e,n,t,o;if(null!=Oe&&Oe>-1){const i={components:null===(n=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(o=null===(t=null==R?void 0:R.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);_e({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a}=c.getAllDataFromTemplateComponent(R);_e({descriptionComponents:e,urlBtns:n,qrbBtns:t,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a})}}),[Oe]),o.useEffect((()=>{var e,n,t,o;if(null!=Oe&&Oe>-1&&Ye){const i={components:null===(n=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===n?void 0:n[Oe].components,mapping:null===(o=null===(t=null==R?void 0:R.mapping)||void 0===t?void 0:t.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);_e({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}),We(!1)}}),[Ye]);o.useEffect((()=>{Ve&&Te===r.POD.CHATBOT&&(()=>{if(!q)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(q);null==P||P(null!=q?q:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Ve]);const Ze=fe?Ne.imageComponent:Ie;return Qe.openEditMedia?e.jsxRuntimeExports.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(x.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:D||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:we})})):e.jsxRuntimeExports.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!Ne.imageComponent&&!ye&&!s.isRCSChannel(null==R?void 0:R.channel)&&e.jsxRuntimeExports.jsxs(h.EditTemplateMediaContainer,{children:[e.jsxRuntimeExports.jsx(j.default,{imageName:null!==(A=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(_=null===(N=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)||void 0===N?void 0:N[0])&&void 0!==_?_:"")?null===(S=null===(H=null==Ze?void 0:Ze.example)||void 0===H?void 0:H.header_handle)||void 0===S?void 0:S[0]:(null===(Q=null===(F=null==R?void 0:R.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==R?void 0:R.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==Ie?void 0:Ie.format)==d.HEADER_TYPES.DOCUMENT?e.jsxRuntimeExports.jsx(V,{children:Te===r.POD.CHATBOT?e.jsxRuntimeExports.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var n;Xe(""),null==P||P(null!==(n=null==e?void 0:e.actualValue)&&void 0!==n?n:"")},pickerType:n.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=q?q:"",variableType:"string"},variablesList:D,showAddButton:!0}):e.jsxRuntimeExports.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}),(null===(K=Ne.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsxRuntimeExports.jsx(O.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===($=Ne.descriptionComponents)||void 0===$?void 0:$.map(((n,t)=>e.jsxRuntimeExports.jsx(E.default,{originalVariableList:null!=Oe&&Oe>-1?Ce.cards[Oe]:Ce,type:n.type,descriptionComponent:n.component,showVariableModal:k},t))),(null===(z=null===(X=null!=Oe&&Oe>-1?null===(G=Ce.cards[Oe])||void 0===G?void 0:G.buttons:null==Ce?void 0:Ce.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsxRuntimeExports.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Oe&&Oe>-1?null===(J=Ce.cards[Oe])||void 0===J?void 0:J.buttons:null==Ce?void 0:Ce.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((n,t)=>{const o=n.buttonVariable===p.STATIC_URL_VARIABLE_NAME;if("URL"===n.type)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:t,disableEdit:o,CTAoptions:null==M?void 0:M.CTAoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedURLTemplateBtn:ze},`${t}_${Oe}`)})),Te===r.POD.CHATBOT&&(null===(te=null===(ne=De[0])||void 0===ne?void 0:ne.component)||void 0===te?void 0:te.buttons)&&(null===(le=null===(ie=null===(oe=De[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Ee?void 0:Ee.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Ee?void 0:Ee.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(ue=null===(re=null!=Oe&&Oe>-1?null===(de=Ce.cards[Oe])||void 0===de?void 0:de.buttons:null==Ce?void 0:Ce.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsxRuntimeExports.jsx(O.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.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Ee?void 0:Ee.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Ee?void 0:Ee.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(be=null===(me=null!=Oe&&Oe>-1?null===(ve=Ce.cards[Oe])||void 0===ve?void 0:ve.buttons:null==Ce?void 0:Ce.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((n,t)=>{if("QUICK_REPLY"===n.type&&Te!==r.POD.CHATBOT)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:t,QRBoptions:null==M?void 0:M.QRBoptions,button:n,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedQRBTemplateBtn:Je},`${t}_${Oe}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsxRuntimeExports.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Ee?void 0:Ee.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(xe=null==Ee?void 0:Ee.discountCodeExtra)||void 0===xe?void 0:xe[1]}),null===(he=null!=Oe&&Oe>-1?null===(je=Ce.cards[Oe])||void 0===je?void 0:je.buttons:null==Ce?void 0:Ce.buttons)||void 0===he?void 0:he.map(((n,t)=>{var o,i,a,s,d;if("COPY_CODE"===n.type)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Re?e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsxRuntimeExports.jsx(l.Input,{state:"disabled",labelText:null!==(o=n.text)&&void 0!==o?o:"Copy Code",value:null!==(i=n.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsxRuntimeExports.jsx(C.default,{index:t,variable:{variableName:null!==(a=n.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=n.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=n.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:n.type},t)})}))]}))};
|
|
7
|
+
`;exports.default=i=>{let{template:R,onTemplateChange:B,whatsappSpecificPickerMeta:M,showVariableModal:k,variableListForImage:I,setDiscountCode:D,fileName:q,setFileName:P}=i;var L,U,A,w,_,N,S,H,F,Q,Y,W,K,$,G,X,z,J,Z,ee,te,ne,oe,ie,le,ae,se,de,re,ue,pe,ce,ve,me,be,ge,xe,je,he;const fe=R.isCarouselType,{originalVariableList:Ce,pod:Te,extras:Ee,selectedCarouselIndex:Oe,isProductCarouselType:ye,disableCopyCode:Re,isError:Ve,cardIndex:Be}=u.useTemplateModalContext(),{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:De,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}=c.getAllDataFromTemplateComponent(R),Ue=o.useRef(null),[Ae,we]=o.useState(!1),[_e,Ne]=o.useState(-1===Oe?{descriptionComponents:Me,urlBtns:ke,qrbBtns:Ie,imageComponent:De,bodyVariables:qe,headerVariables:Pe,titleVariables:Le}:{}),{uploadMediaLink:Se,uploadMediaFiles:He,validateMimeType:Fe}=M,Qe=f.useEditWhatsappTemplateMedia({uploadMediaLink:Se,uploadMediaFiles:He,updateTemplateImageUrl:function(e,t){var o,i,l,a,s,d,r,u;let p;p=null!=Oe&&Oe>-1?{components:null===(i=null===(o=R.components[Be])||void 0===o?void 0:o.cards)||void 0===i?void 0:i[Oe].components,mapping:null===(a=null===(l=null==R?void 0:R.mapping)||void 0===l?void 0:l.cards)||void 0===a?void 0:a[Oe]}:Object.assign({},R);const c=null===(s=null==p?void 0:p.components)||void 0===s?void 0:s.findIndex((e=>{if("HEADER"===e.type&&"NONE"!==e.format&&"TEXT"!==e.format)return!0}));if(void 0!==c&&c>-1&&(null==p?void 0:p.components[c])){const n=Object.assign(Object.assign({},p.components[c]),{format:t,example:{header_handle:[e]}}),o=[...p.components];o[c]=n,p=Object.assign(Object.assign({},p),{components:o})}p.mapping&&(p.mapping=Object.assign(Object.assign({},p.mapping),{header:void 0}));if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=p.components,(null===(d=null==e?void 0:e.mapping)||void 0===d?void 0:d.cards)&&(null===(r=null==e?void 0:e.mapping)||void 0===r?void 0:r.cards.length)>0&&(e.mapping.cards[Oe]=null!==(u=p.mapping)&&void 0!==u?u:{}),null==B||B(Object.assign({},e)),We(!0)}else null==B||B(Object.assign({},p))},validateMimeType:Fe,mediaComponent:fe?_e.imageComponent:De,fileRef:Ue}),[Ye,We]=o.useState(!1),[Ke,$e]=o.useState(q),[Ge,Xe]=o.useState();function ze(e,t,o){var i,l,a,d,r,u,p,c,v,m;const b=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R),g=n.cloneDeep(b),x="custom"===t&&"string"==typeof e,j=x?e:"string"!=typeof e?e.defaultValue?e.defaultValue:"https://d.bik.ai/":"https://d.bik.ai";if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((e=>{var t;return s.isCarouselComponent(e.type)?Object.assign(Object.assign({},e),{cards:null===(t=e.cards)||void 0===t?void 0:t.map((e=>Object.assign(Object.assign({},e),{components:e.components.map((e=>{var t,n,i;if("BUTTONS"===e.type){const l=null===(t=e.buttons)||void 0===t?void 0:t.filter((e=>"URL"===e.type));let a=null!==(n=null==l?void 0:l[o])&&void 0!==n?n:{};a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[j]});const s=null===(i=e.buttons)||void 0===i?void 0:i.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e));return Object.assign(Object.assign({},e),{buttons:s})}return e}))})))}):e})),i=null===(d=null===(a=Object.assign({},R).mapping)||void 0===a?void 0:a.cards)||void 0===d?void 0:d.map((t=>{var n;return Object.assign(Object.assign({},t),{buttons:null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.map(((t,n)=>n===o?x?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"":t))})})),l=n.cloneDeep(R);return l.components=t,l.mapping.cards=i,void(null==B||B(Object.assign({},l)))}const h=null==g?void 0:g.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==h&&h>-1){const n=null===(r=null==g?void 0:g.components[h].buttons)||void 0===r?void 0:r.filter((e=>"URL"===e.type));if((null==n?void 0:n.length)>0){const i="custom"===t&&"string"==typeof e,l=i?e:"string"!=typeof e&&e.defaultValue?e.defaultValue:"https://d.bik.ai/";let a=n[o];a=Object.assign(Object.assign({},a),{url:"https://d.bik.ai/{{1}}",example:[l]});const s=[...null!==(c=null===(p=null===(u=g.components)||void 0===u?void 0:u[h])||void 0===p?void 0:p.buttons)&&void 0!==c?c:[]].map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==a?void 0:a.text)?a:e)),d=Object.assign(Object.assign({},g.components[h]),{buttons:s}),r=null===(v=g.mapping)||void 0===v?void 0:v.buttons;r&&r.length>0&&(r[o]=i?"((customBtnPlaceholder))":"string"!=typeof e?e.placeHolder:"");const m=Object.assign(Object.assign({},g.mapping),{buttons:r});g.mapping=m;const b=[...g.components];b[h]=d,g.components=b}}if("string"!=typeof e){"checkout.checkoutUrl"===(null===(m=e.placeHolder)||void 0===m?void 0:m.slice(2,-2))?we(!0):(we(!1),null==D||D(""))}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=g.components,e.mapping.cards[Oe]=g.mapping,null==B||B(Object.assign({},e))}else null==B||B(g)}function Je(e,t,o){var i,l,a,d,r,u,p;const c=null!=Oe&&Oe>-1?{components:null===(i=Object.assign({},R).components[Be].cards)||void 0===i?void 0:i[Oe].components,mapping:null===(l=Object.assign({},R).mapping.cards)||void 0===l?void 0:l[Oe]}:Object.assign({},R);if(null!=Oe&&Oe>-1&&ye){const t=Object.assign({},R).components.map((t=>{var n;return s.isCarouselComponent(t.type)?Object.assign(Object.assign({},t),{cards:null===(n=t.cards)||void 0===n?void 0:n.map((t=>Object.assign(Object.assign({},t),{components:t.components.map((t=>{var n,i,l;if("BUTTONS"===t.type){const a=null===(n=null==t?void 0:t.buttons)||void 0===n?void 0:n.filter((e=>"QUICK_REPLY"===e.type));let s=null!==(i=null==a?void 0:a[o])&&void 0!==i?i:{};s=Object.assign(Object.assign({},s),{flowId:e.flowId,flowName:e.flowName});const d=null===(l=null==t?void 0:t.buttons)||void 0===l?void 0:l.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==s?void 0:s.text)?s:e));return Object.assign(Object.assign({},t),{buttons:d})}return t}))})))}):t})),i=n.cloneDeep(R);return i.components=t,void(null==B||B(Object.assign({},i)))}const v=null==c?void 0:c.components.findIndex((e=>"BUTTONS"===e.type));if(void 0!==v&&v>-1){const t=null===(d=null===(a=null==c?void 0:c.components[v])||void 0===a?void 0:a.buttons)||void 0===d?void 0:d.filter((e=>"QUICK_REPLY"===e.type));if(t){let n=t[o];n=Object.assign(Object.assign({},n),{flowId:e.flowId,flowName:e.flowName});const i=[...null!==(p=null===(u=null===(r=c.components)||void 0===r?void 0:r[v])||void 0===u?void 0:u.buttons)&&void 0!==p?p:[]].map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==n?void 0:n.text)?n:e)),l=Object.assign(Object.assign({},c.components[v]),{buttons:i}),a=[...c.components];a[v]=l,c.components=a}}if(null!=Oe&&Oe>-1){const e=n.cloneDeep(R);e.components[Be].cards[Oe].components=c.components,null==B||B(Object.assign({},e))}else null==B||B(c)}o.useEffect((()=>{var e,t;if(null===(e=R.mapping.buttons)||void 0===e?void 0:e.find((e=>"checkout.checkoutUrl"===e.slice(2,-2))))we(!0);else{we(!1);const e=null===(t=null==Ee?void 0:Ee.discountCodeExtra)||void 0===t?void 0:t[1];null==e||e("")}}),[R]),o.useEffect((()=>{var e,t,n,o;if(null!=Oe&&Oe>-1){const i={components:null===(t=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Oe].components,mapping:null===(o=null===(n=null==R?void 0:R.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p})}else if(null!=Oe&&-1===Oe){const{descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a}=c.getAllDataFromTemplateComponent(R);Ne({descriptionComponents:e,urlBtns:t,qrbBtns:n,imageComponent:o,bodyVariables:i,headerVariables:l,titleVariables:a})}}),[Oe]),o.useEffect((()=>{var e,t,n,o;if(null!=Oe&&Oe>-1&&Ye){const i={components:null===(t=null===(e=R.components[Be])||void 0===e?void 0:e.cards)||void 0===t?void 0:t[Oe].components,mapping:null===(o=null===(n=null==R?void 0:R.mapping)||void 0===n?void 0:n.cards)||void 0===o?void 0:o[Oe]},{descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}=c.getAllDataFromTemplateComponent(i);Ne({descriptionComponents:l,urlBtns:a,qrbBtns:s,imageComponent:d,bodyVariables:r,headerVariables:u,titleVariables:p}),We(!1)}}),[Ye]);o.useEffect((()=>{Ve&&Te===r.POD.CHATBOT&&(()=>{if(!q)return void Xe("PDF name is Required");const e=m.validateInputNameChatbot(q);null==P||P(null!=q?q:""),Xe(e?"Please enter a valid PDF name":void 0)})()}),[Ve]);const Ze=fe?_e.imageComponent:De;return Qe.openEditMedia?e.jsxRuntimeExports.jsx(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460}},{children:e.jsxRuntimeExports.jsx(x.default,{mediaComponentFormat:null!==(L=Ze.format)&&void 0!==L?L:d.HEADER_TYPES.IMAGE,uploadMedia:Qe.uploadMedia,variableListForImage:I||[],useEditWhatsappTemplateMediaResponse:Qe,setOpenEditMedia:Qe.setOpenEditMedia,openEditMedia:Qe.openEditMedia,editIconRef:Qe.editIconRef,fileRef:Ue})})):e.jsxRuntimeExports.jsxs(T.Container,Object.assign({style:{flexDirection:"column",width:400,maxHeight:460,minWidth:ye?"420px":"auto"}},{children:[!!_e.imageComponent&&!ye&&!s.isRCSChannel(null==R?void 0:R.channel)&&e.jsxRuntimeExports.jsxs(h.EditTemplateMediaContainer,{children:[e.jsxRuntimeExports.jsx(j.default,{imageName:null!==(A=null===(U=null==Ze?void 0:Ze.example)||void 0===U?void 0:U.header_handle)&&void 0!==A?A:[],handleImageChange:Qe.handleImageChange,mediaType:null==Ze?void 0:Ze.format,error:Qe.error,isLoading:Qe.loading,setOpenEditMedia:Qe.setOpenEditMedia,selectedVariable:v.isVariable(null!==(N=null===(_=null===(w=null==Ze?void 0:Ze.example)||void 0===w?void 0:w.header_handle)||void 0===_?void 0:_[0])&&void 0!==N?N:"")?null===(H=null===(S=null==Ze?void 0:Ze.example)||void 0===S?void 0:S.header_handle)||void 0===H?void 0:H[0]:(null===(Q=null===(F=null==R?void 0:R.mapping)||void 0===F?void 0:F.header)||void 0===Q?void 0:Q[0])?null===(W=null===(Y=null==R?void 0:R.mapping)||void 0===Y?void 0:Y.header)||void 0===W?void 0:W[0]:Qe.selectedVariable}),(null==De?void 0:De.format)==d.HEADER_TYPES.DOCUMENT?e.jsxRuntimeExports.jsx(V,{children:Te===r.POD.CHATBOT?e.jsxRuntimeExports.jsx(a.InputWithVariables,{labelText:"PDF Name",placeHolder:"Enter the name",errorMessage:Ge||void 0,onChange:e=>{var t;Xe(""),null==P||P(null!==(t=null==e?void 0:e.actualValue)&&void 0!==t?t:"")},pickerType:t.PickerType.EMBEDDED,noMaxCharCheck:!0,allowMix:!0,showVarHeader:!0,varHeaderText:"Select variable",prevVariable:{actualValue:null!=q?q:"",variableType:"string"},variablesList:I,showAddButton:!0}):e.jsxRuntimeExports.jsx(l.Input,{labelText:"PDF Name",placeholder:"Enter the name",value:Ke,errorMessage:Ge||void 0,onBlur:()=>{if(!Ke)return null==P||P(""),void Xe("PDF name is Required");const e=m.validateInputName(Ke);null==P||P(Ke),Xe(e?"Please enter a valid PDF name":void 0)},onChangeText:e=>{Xe(""),$e(e)}})}):e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{})]}),(null===(K=_e.bodyVariables)||void 0===K?void 0:K.length)>0&&e.jsxRuntimeExports.jsx(O.default,{containerStyle:{paddingTop:_e.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===($=_e.descriptionComponents)||void 0===$?void 0:$.map(((t,n)=>e.jsxRuntimeExports.jsx(E.default,{originalVariableList:null!=Oe&&Oe>-1?Ce.cards[Oe]:Ce,type:t.type,descriptionComponent:t.component,showVariableModal:k},n))),(null===(z=null===(X=null!=Oe&&Oe>-1?null===(G=Ce.cards[Oe])||void 0===G?void 0:G.buttons:null==Ce?void 0:Ce.buttons)||void 0===X?void 0:X.filter((e=>"URL"===e.type)))||void 0===z?void 0:z.length)>0&&e.jsxRuntimeExports.jsx(O.default,{headerText:"Edit buttons",subText:"Edit the link connected to the CTA button"}),null===(ee=null===(Z=null!=Oe&&Oe>-1?null===(J=Ce.cards[Oe])||void 0===J?void 0:J.buttons:null==Ce?void 0:Ce.buttons)||void 0===Z?void 0:Z.filter((e=>Te===r.POD.CHATBOT||"URL"===e.type)))||void 0===ee?void 0:ee.map(((t,n)=>{const o=t.buttonVariable===p.STATIC_URL_VARIABLE_NAME,i=t.buttonVariable===p.UNSUBSCRIBE_URL_VARIABLE;if("URL"===t.type)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:n,disableEdit:o||i,CTAoptions:null==M?void 0:M.CTAoptions,button:t,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedURLTemplateBtn:ze},`${n}_${Oe}`)})),Te===r.POD.CHATBOT&&(null===(ne=null===(te=Ie[0])||void 0===te?void 0:te.component)||void 0===ne?void 0:ne.buttons)&&(null===(le=null===(ie=null===(oe=Ie[0])||void 0===oe?void 0:oe.component)||void 0===ie?void 0:ie.buttons)||void 0===le?void 0:le.length)>0&&e.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(ae=null==Ee?void 0:Ee.backTrackExtra)||void 0===ae?void 0:ae[0],setBackTrackMessage:null===(se=null==Ee?void 0:Ee.backTrackExtra)||void 0===se?void 0:se[1]}),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(ue=null===(re=null!=Oe&&Oe>-1?null===(de=Ce.cards[Oe])||void 0===de?void 0:de.buttons:null==Ce?void 0:Ce.buttons)||void 0===re?void 0:re.filter((e=>"QUICK_REPLY"===e.type)))||void 0===ue?void 0:ue.length)>0&&(Te!==r.POD.CHATBOT?e.jsxRuntimeExports.jsx(O.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.jsxRuntimeExports.jsx(b.BackTrackComponent,{backTrackMessage:null===(pe=null==Ee?void 0:Ee.backTrackExtra)||void 0===pe?void 0:pe[0],setBackTrackMessage:null===(ce=null==Ee?void 0:Ee.backTrackExtra)||void 0===ce?void 0:ce[1]})),!s.isRCSChannel(null==R?void 0:R.channel)&&(null===(be=null===(me=null!=Oe&&Oe>-1?null===(ve=Ce.cards[Oe])||void 0===ve?void 0:ve.buttons:null==Ce?void 0:Ce.buttons)||void 0===me?void 0:me.filter((e=>"QUICK_REPLY"===e.type)))||void 0===be?void 0:be.map(((t,n)=>{if("QUICK_REPLY"===t.type&&Te!==r.POD.CHATBOT)return e.jsxRuntimeExports.jsx(y.default,{variableListIndex:n,QRBoptions:null==M?void 0:M.QRBoptions,button:t,currentVariableList:null!=Oe&&Oe>-1?Object.assign({},Ce.cards[Oe]):Object.assign({},Ce),updateSelectedQRBTemplateBtn:Je},`${n}_${Oe}`)}))),Te===r.POD.CHATBOT&&Ae&&e.jsxRuntimeExports.jsx(g.DiscountCodeComponent,{discountCode:null===(ge=null==Ee?void 0:Ee.discountCodeExtra)||void 0===ge?void 0:ge[0],setDiscountCode:null===(xe=null==Ee?void 0:Ee.discountCodeExtra)||void 0===xe?void 0:xe[1]}),null===(he=null!=Oe&&Oe>-1?null===(je=Ce.cards[Oe])||void 0===je?void 0:je.buttons:null==Ce?void 0:Ce.buttons)||void 0===he?void 0:he.map(((t,n)=>{var o,i,a,s,d;if("COPY_CODE"===t.type)return e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:Re?e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:20,borderRadius:4,padding:"8px 10px"}},{children:e.jsxRuntimeExports.jsx(l.Input,{state:"disabled",labelText:null!==(o=t.text)&&void 0!==o?o:"Copy Code",value:null!==(i=t.buttonVariable)&&void 0!==i?i:"",onChangeText:()=>{}})})):e.jsxRuntimeExports.jsx(C.default,{index:n,variable:{variableName:null!==(a=t.text)&&void 0!==a?a:"Copy Code",updatedValue:null!==(s=t.buttonVariable)&&void 0!==s?s:"",type:"string",isEditableVariable:!0,index:null!==(d=t.index)&&void 0!==d?d:0},showVariableModal:!0,componentType:"BUTTONS",buttonType:t.type},n)})}))]}))};
|
package/dist/cjs/components/template-context-mapper/modalElements/WhatsAppTemplateCardButtonV2.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("lodash"),l=require("react"),s=require("../../dropdown/Dropdown.js"),a=require("../../input/Input.js"),n=require("../../template-preview/constants/regexPatterns.js"),i=require("../../template-preview/models/TemplateMeta.js"),o=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../../TypographyStyle.js"),u=require("../../../constants/Theme.js"),c=require("../context/templateModalContext.js"),d=require("../utils/constants.js"),b=require("../utils/validateIsUrl.js"),p=require("./VariableConnector.js");exports.default=j=>{let{variableListIndex:m,button:v,updateSelectedURLTemplateBtn:
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../../node_modules/react/jsx-runtime.js"),t=require("lodash"),l=require("react"),s=require("../../dropdown/Dropdown.js"),a=require("../../input/Input.js"),n=require("../../template-preview/constants/regexPatterns.js"),i=require("../../template-preview/models/TemplateMeta.js"),o=require("../../template-preview/models/WhatsAppTemplate.js"),r=require("../../TypographyStyle.js"),u=require("../../../constants/Theme.js"),c=require("../context/templateModalContext.js"),d=require("../utils/constants.js"),b=require("../utils/validateIsUrl.js"),p=require("./VariableConnector.js");exports.default=j=>{let{variableListIndex:m,button:v,updateSelectedURLTemplateBtn:O,updateSelectedQRBTemplateBtn:x,currentVariableList:g,CTAoptions:R,QRBoptions:f,disableEdit:y}=j;var L,U,T,h,E;const[I,_]=l.useState(""),[C,V]=l.useState(),q=null==R?void 0:R.map((e=>Object.assign(Object.assign({},e),{selected:(null==C?void 0:C.value)===e.value&&C.label===e.label}))),P=null==f?void 0:f.map((e=>Object.assign(Object.assign({},e),{selected:(null==C?void 0:C.value)===e.value}))),{isError:S,disableEditVariable:N,pod:w,selectedCarouselIndex:B,originalVariableList:A,setOriginalVariableList:H,isProductCarouselType:M,ctaOptionsErrors:Q,setCtaOptionsErrors:k}=c.useTemplateModalContext();function D(e){if(_(e),null!=B&&B>-1&&M){const l=t.cloneDeep(A);if("URL"===v.type){const t=l.cards.map((t=>{let l=t.buttons.filter((e=>"URL"===e.type))[m];l=Object.assign(Object.assign({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=t.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e));return Object.assign(Object.assign({},t),{buttons:s})}));null==H||H((e=>Object.assign(Object.assign({},e),{cards:t}))),null==O||O(`https://${e}`,"custom",m)}return}let l=g.buttons.filter((e=>"URL"===e.type))[m];l=Object.assign(Object.assign({},l),{buttonVariable:"((customPlaceholderName))",example:[`https://${e}`]});const s=g.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==l?void 0:l.text)?l:e)),a=Object.assign({},null!=B&&B>-1?A.cards[B]:A);if(a.buttons=s,null!=B&&B>-1){const e=[...A.cards];e[B]=a,null==H||H((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==H||H((e=>Object.assign(Object.assign({},e),{buttons:[...s]})));null==O||O(`https://${e}`,"custom",m)}return l.useEffect((()=>{var e,t;if(v.buttonVariable===d.UNSUBSCRIBE_URL_VARIABLE)return V(i.UNSUBSCRIBE_URL_OPTION),void _((null===(e=v.example)||void 0===e?void 0:e[0].split("https://")[1])||"");if(v.buttonVariable&&n.editableVarPattern.test(v.buttonVariable))v.buttonVariable===d.STATIC_URL_VARIABLE_NAME?V(i.STATIC_URL_CTA_OPTION):V(i.CUSTOM_URL_NAME),_((null===(t=v.example)||void 0===t?void 0:t[0].split("https://")[1])||"");else{let e=-1;const t="URL"===v.type?R:f;e="URL"===v.type?t.findIndex((e=>e.placeHolder===v.buttonVariable)):t.findIndex((e=>e.label===v.flowName)),e>-1?V(t[e]):null==k||k((e=>Object.assign(Object.assign({},e),{[m]:"Required field!"})))}}),[]),w!==o.POD.CHATBOT?e.jsxRuntimeExports.jsxs(p.Container,{children:[e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:8}},{children:e.jsxRuntimeExports.jsxs(r.BodySecondary,Object.assign({style:{color:u.COLORS.content.primary}},{children:[v.text," button"]}))})),e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:12}},{children:e.jsxRuntimeExports.jsx(s.Dropdown,{disabled:N||y,truncatedText:!1,options:"URL"===v.type?"static_link"===(null==C?void 0:C.value)?[i.STATIC_URL_CTA_OPTION]:q:P,isSearchable:!0,onSelect:function(e,l){null==k||k((e=>(delete e[m],Object.assign({},e))));const s=e;V(s);const a=("URL"===v.type?R:f).find((e=>e.placeHolder===s.placeHolder));if(a)if("custom_link"!==a.value){if(null!=B&&B>-1&&M){const e=t.cloneDeep(A);if("URL"===v.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"URL"===e.type))[m];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder});const l=e.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==O||O({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",m),null==H||H((e=>Object.assign(Object.assign({},e),{cards:t})))}else if("QUICK_REPLY"===v.type){const t=e.cards.map((e=>{let t=e.buttons.filter((e=>"QUICK_REPLY"===e.type))[m];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value});const l=e.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e));return Object.assign(Object.assign({},e),{buttons:l})}));null==x||x({flowName:s.label,flowId:s.value},"placeholder",m),null==H||H((e=>Object.assign(Object.assign({},e),{cards:t})))}return}let e;if("URL"===v.type){let t=g.buttons.filter((e=>"URL"===e.type))[m];t=Object.assign(Object.assign({},t),{buttonVariable:s.placeHolder,example:[(null==s?void 0:s.value)||"https://d.bik.ai/"]}),e=g.buttons.map((e=>"URL"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==O||O({defaultValue:a.value,placeHolder:a.placeHolder},"placeholder",m)}else{let t=g.buttons.filter((e=>"QUICK_REPLY"===e.type))[m];t=Object.assign(Object.assign({},t),{flowName:s.label,flowId:s.value}),e=g.buttons.map((e=>"QUICK_REPLY"===e.type&&(null==e?void 0:e.text)===(null==t?void 0:t.text)?t:e)),null==x||x({flowName:s.label,flowId:s.value},"placeholder",m)}const l=Object.assign({},null!=B&&B>-1?A.cards[B]:A);if(l.buttons=e,null!=B&&B>-1){const e=[...A.cards];e[B]=l,null==H||H((t=>Object.assign(Object.assign({},t),{cards:e})))}else null==H||H((t=>Object.assign(Object.assign({},t),{buttons:[...e]})))}else D("")},defaultOptions:C?[Object.assign(Object.assign({},C),{selected:!0})]:[],error:S?null==Q?void 0:Q[m]:void 0})})),("custom_link"===(null==C?void 0:C.value)||"static_link"===(null==C?void 0:C.value))&&e.jsxRuntimeExports.jsx("div",Object.assign({style:{marginBottom:20}},{children:e.jsxRuntimeExports.jsx(a.Input,{state:N||y?"disabled":"none",errorMessage:S?I?b.validateIsUrl(I)?"":"Enter valid URL":"Required field":"",value:I,prefixText:"https://",placeholder:"Enter custom URL here",onChangeText:D,maxCharLimit:2e3})}))]}):e.jsxRuntimeExports.jsx(p.default,{index:m,variable:{variableName:null!==(L=v.text)&&void 0!==L?L:"",updatedValue:"((customPlaceholderName))"===v.buttonVariable?`${null===(U=v.example)||void 0===U?void 0:U[0]}`:null!==(T=v.buttonVariable)&&void 0!==T?T:"",type:"link",isEditableVariable:!0,index:null!==(h=v.index)&&void 0!==h?h:0,queryParams:null!==(E=v.queryParams)&&void 0!==E?E:[]},showVariableModal:!0,componentType:"BUTTONS",buttonType:v.type,CTAoptions:R})};
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
export declare const BACKGROUND_PREVIEW_IMAGE = "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";
|
|
2
2
|
export declare const STATIC_URL_VARIABLE_NAME = "((staticPlaceholderName))";
|
|
3
|
+
export declare const UNSUBSCRIBE_URL_VARIABLE = "{{unsubscribeUrl}}";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.BACKGROUND_PREVIEW_IMAGE="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",exports.STATIC_URL_VARIABLE_NAME="((staticPlaceholderName))";
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});exports.BACKGROUND_PREVIEW_IMAGE="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",exports.STATIC_URL_VARIABLE_NAME="((staticPlaceholderName))",exports.UNSUBSCRIBE_URL_VARIABLE="{{unsubscribeUrl}}";
|
|
@@ -60,6 +60,11 @@ export declare const STATIC_URL_CTA_OPTION: {
|
|
|
60
60
|
value: string;
|
|
61
61
|
placeHolder: string;
|
|
62
62
|
};
|
|
63
|
+
export declare const UNSUBSCRIBE_URL_OPTION: {
|
|
64
|
+
label: string;
|
|
65
|
+
value: string;
|
|
66
|
+
placeHolder: string;
|
|
67
|
+
};
|
|
63
68
|
export type GlobalPlaceholderType = {
|
|
64
69
|
MARKETING: {
|
|
65
70
|
customer: baseAPITemplateVariableType[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var E,T,e,A;Object.defineProperty(exports,"__esModule",{value:!0}),exports.TEMPLATE_EDITOR=void 0,(E=exports.TEMPLATE_EDITOR||(exports.TEMPLATE_EDITOR={})).SEND_GRID="sendgrid",E.BEE="bee",exports.TEMPLATE_STATUS=void 0,(T=exports.TEMPLATE_STATUS||(exports.TEMPLATE_STATUS={})).APPROVED="APPROVED",T.DISABLED="DISABLED",T.FLAGGED="FLAGGED",T.PENDING="PENDING",T.DRAFT="DRAFT",T.REJECTED="REJECTED",T.PENDING_DELETION="PENDING_DELETION",T.IN_REVIEW="IN REVIEW",T.PAUSED="PAUSED",T.ACTIVE="ACTIVE",T.LIBRARY="LIBRARY",exports.HEADER_TYPES=void 0,(e=exports.HEADER_TYPES||(exports.HEADER_TYPES={})).NONE="NONE",e.TEXT="TEXT",e.IMAGE="IMAGE",e.VIDEO="VIDEO",e.DOCUMENT="DOCUMENT",exports.ACTIONS_TYPES=void 0,(A=exports.ACTIONS_TYPES||(exports.ACTIONS_TYPES={})).NONE="NONE",A.CTA_BTN="CTA_BTN",A.QUICK_REPLY="QUICK_REPLY";exports.CUSTOM_URL_NAME={value:"custom_link",label:"Custom URL",placeHolder:"custom placeholder"},exports.STATIC_URL_CTA_OPTION={label:"Custom URL (No tracking)",value:"static_link",placeHolder:"{{staticUrl}}"};
|
|
1
|
+
"use strict";var E,T,e,A;Object.defineProperty(exports,"__esModule",{value:!0}),exports.TEMPLATE_EDITOR=void 0,(E=exports.TEMPLATE_EDITOR||(exports.TEMPLATE_EDITOR={})).SEND_GRID="sendgrid",E.BEE="bee",exports.TEMPLATE_STATUS=void 0,(T=exports.TEMPLATE_STATUS||(exports.TEMPLATE_STATUS={})).APPROVED="APPROVED",T.DISABLED="DISABLED",T.FLAGGED="FLAGGED",T.PENDING="PENDING",T.DRAFT="DRAFT",T.REJECTED="REJECTED",T.PENDING_DELETION="PENDING_DELETION",T.IN_REVIEW="IN REVIEW",T.PAUSED="PAUSED",T.ACTIVE="ACTIVE",T.LIBRARY="LIBRARY",exports.HEADER_TYPES=void 0,(e=exports.HEADER_TYPES||(exports.HEADER_TYPES={})).NONE="NONE",e.TEXT="TEXT",e.IMAGE="IMAGE",e.VIDEO="VIDEO",e.DOCUMENT="DOCUMENT",exports.ACTIONS_TYPES=void 0,(A=exports.ACTIONS_TYPES||(exports.ACTIONS_TYPES={})).NONE="NONE",A.CTA_BTN="CTA_BTN",A.QUICK_REPLY="QUICK_REPLY";exports.CUSTOM_URL_NAME={value:"custom_link",label:"Custom URL",placeHolder:"custom placeholder"},exports.STATIC_URL_CTA_OPTION={label:"Custom URL (No tracking)",value:"static_link",placeHolder:"{{staticUrl}}"},exports.UNSUBSCRIBE_URL_OPTION={label:"Unsubscribe URL",value:"{{unsubscribeUrl}}",placeHolder:"{{unsubscribeUrl}}"};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface TextPickerCategoryCardProps {
|
|
3
|
+
id: string;
|
|
4
|
+
name: string;
|
|
5
|
+
itemsCount: number;
|
|
6
|
+
selectedCount: number;
|
|
7
|
+
isChecked: boolean;
|
|
8
|
+
isPartiallyChecked: boolean;
|
|
9
|
+
onCheck: (checked: boolean, e?: React.MouseEvent) => void;
|
|
10
|
+
onClick: (e: React.MouseEvent) => void;
|
|
11
|
+
}
|
|
12
|
+
export declare const TextPickerCategoryCard: React.FC<TextPickerCategoryCardProps>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("styled-components"),s=require("../../constants/Theme.js"),r=require("../checkBox/CheckBox.js"),i=require("../icon-button/IconButton.js"),o=require("../tag/Tag.js"),n=require("../TypographyStyle.js"),c=require("../../assets/icons/chevronRight.svg.js");function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}const l=a(t).default.div`
|
|
2
|
+
height: 64px;
|
|
3
|
+
background-color: ${e=>{let{isSelected:t,isActive:r}=e;return t?s.COLORS.background.positive.light:r?s.COLORS.surface.hovered:s.COLORS.surface.standard}};
|
|
4
|
+
border-bottom: 1px solid ${s.COLORS.stroke.primary};
|
|
5
|
+
padding: 12px 24px;
|
|
6
|
+
display: flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
cursor: pointer;
|
|
9
|
+
transition: background 0.2s;
|
|
10
|
+
&:hover {
|
|
11
|
+
background-color: ${e=>{let{isSelected:t}=e;return t?s.COLORS.background.positive.light:s.COLORS.surface.hovered}};
|
|
12
|
+
}
|
|
13
|
+
`;exports.TextPickerCategoryCard=t=>{let{id:a,name:u,itemsCount:d,selectedCount:x,isChecked:p,isPartiallyChecked:g,onCheck:h,onClick:j}=t;return e.jsxRuntimeExports.jsxs(l,Object.assign({isActive:p||g,isSelected:p,onClick:j},{children:[e.jsxRuntimeExports.jsx(r.CheckBox,{isChecked:p||g,isPartiallyChecked:g&&!p,onValueChange:function(e,t,s){null==s||s.stopPropagation(),h(e,s)},style:{marginRight:16}}),e.jsxRuntimeExports.jsxs("div",Object.assign({style:{flex:1,display:"flex",flexDirection:"column"}},{children:[e.jsxRuntimeExports.jsx(n.BodyPrimary,{children:u}),e.jsxRuntimeExports.jsxs(n.BodyCaption,Object.assign({style:{color:s.COLORS.text.secondary,fontSize:13}},{children:[d," document",1!==d?"s":""]}))]})),!!x&&e.jsxRuntimeExports.jsx(o.Tag,{tagText:`${x} selected`,type:"positive",style:{marginLeft:12}}),e.jsxRuntimeExports.jsx(i.IconButton,{Icon:c.default,height:16,width:16,style:{marginLeft:8}})]}))};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("styled-components"),n=require("../../constants/Theme.js"),s=require("../tag/Tag.js"),r=require("../TypographyStyle.js");function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=i(t);const c=o.default.div`
|
|
2
|
+
box-sizing: border-box;
|
|
3
|
+
width: 100%;
|
|
4
|
+
margin: 0;
|
|
5
|
+
display: flex;
|
|
6
|
+
justify-content: flex-start;
|
|
7
|
+
align-items: center;
|
|
8
|
+
`,a=o.default.div`
|
|
9
|
+
display: flex;
|
|
10
|
+
align-items: center;
|
|
11
|
+
`,l=o.default(r.BodySecondary)`
|
|
12
|
+
color: ${e=>{let{$isInactive:t}=e;return t?n.COLORS.content.inactive:n.COLORS.content.brand}};
|
|
13
|
+
`;exports.TextPickerFooter=t=>{let{totalSelected:n,maxDocuments:r}=t;const i=r!==1/0&&n>=r;return e.jsxRuntimeExports.jsx(c,{children:e.jsxRuntimeExports.jsx(a,{children:i?e.jsxRuntimeExports.jsx(s.Tag,{tagText:`You can only select ${r} documents`,type:"negative"}):e.jsxRuntimeExports.jsx(l,Object.assign({$isInactive:0===n},{children:r!==1/0?`${n}/${r} documents selected`:`${n} documents selected`}))})})};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface TextPickerItemRowProps {
|
|
3
|
+
item: {
|
|
4
|
+
id: string;
|
|
5
|
+
name: string;
|
|
6
|
+
};
|
|
7
|
+
selected: boolean;
|
|
8
|
+
onCheck: (checked: boolean) => void;
|
|
9
|
+
onClick: () => void;
|
|
10
|
+
}
|
|
11
|
+
export declare const TextPickerItemRow: React.FC<TextPickerItemRowProps>;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("styled-components"),r=require("../../constants/Theme.js"),s=require("../checkBox/CheckBox.js"),i=require("../TypographyStyle.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=n(t);const c=o.default.div`
|
|
2
|
+
min-height: 48px;
|
|
3
|
+
background: ${e=>{let{selected:t}=e;return t?r.COLORS.surface.hovered:r.COLORS.surface.standard}};
|
|
4
|
+
border-bottom: 1px solid ${r.COLORS.stroke.primary};
|
|
5
|
+
padding: 12px 24px;
|
|
6
|
+
display: flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
cursor: pointer;
|
|
9
|
+
`,d=o.default.div`
|
|
10
|
+
margin-right: 16px;
|
|
11
|
+
display: flex;
|
|
12
|
+
flex-direction: column;
|
|
13
|
+
justify-content: center;
|
|
14
|
+
align-items: center;
|
|
15
|
+
`,l=o.default.div`
|
|
16
|
+
flex: 1;
|
|
17
|
+
`;exports.TextPickerItemRow=t=>{let{item:r,selected:n,onCheck:o,onClick:a}=t;return e.jsxRuntimeExports.jsxs(c,Object.assign({selected:n,onClick:a},{children:[e.jsxRuntimeExports.jsx(d,Object.assign({onClick:e=>e.stopPropagation()},{children:e.jsxRuntimeExports.jsx(s.CheckBox,{isChecked:n,onValueChange:o})})),e.jsxRuntimeExports.jsx(l,{children:e.jsxRuntimeExports.jsx(i.BodyPrimary,{children:r.name})})]}))};
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import type { ButtonProps } from '../button/model';
|
|
3
|
+
export interface TextPickerCategory {
|
|
4
|
+
id: string;
|
|
5
|
+
name: string;
|
|
6
|
+
items: {
|
|
7
|
+
id: string;
|
|
8
|
+
name: string;
|
|
9
|
+
}[];
|
|
10
|
+
}
|
|
11
|
+
export interface TextPickerProps {
|
|
12
|
+
visible: boolean;
|
|
13
|
+
categories: TextPickerCategory[];
|
|
14
|
+
selectedItems: {
|
|
15
|
+
[categoryId: string]: string[];
|
|
16
|
+
};
|
|
17
|
+
onAdd: (selected: {
|
|
18
|
+
[categoryId: string]: string[];
|
|
19
|
+
}) => void;
|
|
20
|
+
onClose?: () => void;
|
|
21
|
+
title?: string;
|
|
22
|
+
subtitle?: string;
|
|
23
|
+
width?: string;
|
|
24
|
+
zIndex?: number;
|
|
25
|
+
maxDocuments?: number;
|
|
26
|
+
primaryButton?: ButtonProps;
|
|
27
|
+
secondaryButton?: ButtonProps;
|
|
28
|
+
}
|
|
29
|
+
export declare const TextPickerModal: React.FC<TextPickerProps>;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("../../assets/icons/arrow_left.svg.js"),i=require("react"),r=require("styled-components"),n=require("../../constants/Theme.js"),s=require("../icon-button/IconButton.js"),o=require("../input/Input.js"),l=require("../modals/styledModal.js"),d=require("../TypographyStyle.js"),a=require("./TextPickerCategoryCard.js"),u=require("./TextPickerFooter.js"),c=require("./TextPickerItemRow.js"),x=require("./TextPickerSelectAllRow.js");function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=m(r);const j=p.default.div`
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: column;
|
|
4
|
+
height: 100%;
|
|
5
|
+
`,h=p.default.div`
|
|
6
|
+
padding: 12px 24px;
|
|
7
|
+
border-bottom: 1px solid ${n.COLORS.stroke.primary};
|
|
8
|
+
`,g=p.default.div`
|
|
9
|
+
flex: 1;
|
|
10
|
+
overflow-y: auto;
|
|
11
|
+
min-height: 0;
|
|
12
|
+
`,v=p.default.div`
|
|
13
|
+
display: flex;
|
|
14
|
+
align-items: center;
|
|
15
|
+
padding: 0 24px;
|
|
16
|
+
background: ${n.COLORS.surface.subdued};
|
|
17
|
+
border-bottom: 1px solid ${n.COLORS.stroke.primary};
|
|
18
|
+
`,y=p.default.div`
|
|
19
|
+
flex: 1;
|
|
20
|
+
display: flex;
|
|
21
|
+
align-items: center;
|
|
22
|
+
justify-content: center;
|
|
23
|
+
color: ${n.COLORS.content.secondary};
|
|
24
|
+
text-align: center;
|
|
25
|
+
padding: 32px;
|
|
26
|
+
`;exports.TextPickerModal=r=>{var m,p;const{visible:C,categories:f,selectedItems:R,onAdd:b,onClose:k,title:O="Select Text",subtitle:E,width:S="640px",zIndex:T}=r,w=null!==(m=r.maxDocuments)&&void 0!==m?m:1/0,[L,q]=i.useState("categories"),[B,P]=i.useState(""),[I,A]=i.useState(R),[F,$]=i.useState(null),M=f.filter((e=>e.name.toLowerCase().includes(B.toLowerCase()))),_=F?F.items.filter((e=>e.name.toLowerCase().includes(B.toLowerCase()))):[],D=Object.values(I).reduce(((e,t)=>e+t.length),0),z=E||"",N=e=>{var t;return e.items.length>0&&(null===(t=I[e.id])||void 0===t?void 0:t.length)===e.items.length},G=e=>{var t;return!!(null===(t=I[e.id])||void 0===t?void 0:t.length)&&I[e.id].length<e.items.length},H=()=>{var e;return!!F&&_.length>0&&(null===(e=I[F.id])||void 0===e?void 0:e.length)===_.length},J=(e,t)=>{F&&A((i=>{const r=i[F.id]||[];return t&&D>=w?i:Object.assign(Object.assign({},i),{[F.id]:t?[...r,e]:r.filter((t=>t!==e))})}))};return e.jsxRuntimeExports.jsx(l.StyledModal,Object.assign({open:C,onClose:k,headingTitle:O,headingSubtitle:z,centralContainerStyles:{width:S,zIndex:T},hideCrossButton:!1,primaryButton:r.primaryButton?Object.assign(Object.assign({},r.primaryButton),{buttonText:r.primaryButton.isLoading?"Loading...":r.primaryButton.buttonText||"Add",disabled:null!==(p=r.primaryButton.disabled)&&void 0!==p&&p||0===D||w!==1/0&&D>=w,onClick:r.primaryButton.onClick||(()=>b(I))}):{buttonText:"Add",disabled:0===D||w!==1/0&&D>=w,onClick:()=>b(I)},footerLeftCustomElement:e.jsxRuntimeExports.jsx(u.TextPickerFooter,{totalSelected:D,maxDocuments:w}),footerContainerStyle:{borderTop:`1px solid ${n.COLORS.stroke.primary}`,background:n.COLORS.surface.standard},modalBodyStyles:{overflow:"hidden",display:"flex",flexDirection:"column",flex:1},wrapperStyle:{height:"calc(100vh - 168px)"}},{children:e.jsxRuntimeExports.jsx(j,{children:"categories"===L?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(h,{children:e.jsxRuntimeExports.jsx(o.Input,{placeholder:"Search ...",value:B,onChangeText:P,height:"40px"})}),e.jsxRuntimeExports.jsx(g,{children:0===M.length?e.jsxRuntimeExports.jsx(y,{children:"No categories found. Try a different search."}):M.map((t=>{var i;return e.jsxRuntimeExports.jsx(a.TextPickerCategoryCard,{id:t.id,name:t.name,itemsCount:t.items.length,selectedCount:(null===(i=I[t.id])||void 0===i?void 0:i.length)||0,isChecked:N(t),isPartiallyChecked:G(t)&&!N(t),onCheck:(e,i)=>((e,t,i)=>{i&&i.stopPropagation(),A((i=>Object.assign(Object.assign({},i),{[e.id]:t?e.items.map((e=>e.id)):[]})))})(t,e,i),onClick:()=>(e=>{$(e),q("items"),P("")})(t)},t.id)}))})]}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs(v,{children:[e.jsxRuntimeExports.jsx(s.IconButton,{Icon:t.default,height:16,width:16,onClick:()=>{q("categories"),$(null),P("")},style:{marginRight:8},"aria-label":"Back"}),e.jsxRuntimeExports.jsx(d.BodyCaption,Object.assign({style:{color:n.COLORS.content.secondary}},{children:null==F?void 0:F.name}))]}),e.jsxRuntimeExports.jsx(h,{children:e.jsxRuntimeExports.jsx(o.Input,{placeholder:"Search ...",value:B,onChangeText:P,height:"40px"})}),e.jsxRuntimeExports.jsx(g,{children:0===_.length?e.jsxRuntimeExports.jsx(y,{children:"No items found. Try a different search."}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(x.TextPickerSelectAllRow,{isChecked:H(),isPartiallyChecked:(()=>{var e;return!!F&&!!(null===(e=I[F.id])||void 0===e?void 0:e.length)&&I[F.id].length<_.length})()&&!H(),onCheck:e=>{F&&A((t=>e?Object.assign(Object.assign({},t),{[F.id]:_.map((e=>e.id))}):Object.assign(Object.assign({},t),{[F.id]:[]})))}}),_.map((t=>{var i;return e.jsxRuntimeExports.jsx(c.TextPickerItemRow,{item:t,selected:(null===(i=I[F.id])||void 0===i?void 0:i.includes(t.id))||!1,onCheck:e=>J(t.id,e),onClick:()=>{var e;return J(t.id,!(null===(e=I[F.id])||void 0===e?void 0:e.includes(t.id)))}},t.id)}))]})})]})})}))};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("../../node_modules/react/jsx-runtime.js"),t=require("styled-components"),r=require("../../constants/Theme.js"),s=require("../checkBox/CheckBox.js"),i=require("../TypographyStyle.js");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=n(t);const o=l.default.div`
|
|
2
|
+
background: ${e=>{let{isActive:t}=e;return t?r.COLORS.surface.hovered:r.COLORS.surface.subdued}};
|
|
3
|
+
border-bottom: 1px solid ${r.COLORS.stroke.primary};
|
|
4
|
+
padding: 12px 24px;
|
|
5
|
+
display: flex;
|
|
6
|
+
align-items: center;
|
|
7
|
+
cursor: default;
|
|
8
|
+
flex-direction: row;
|
|
9
|
+
justify-content: center;
|
|
10
|
+
align-items: center;
|
|
11
|
+
|
|
12
|
+
`,c=l.default.div`
|
|
13
|
+
display: flex;
|
|
14
|
+
margin-right: 16px;
|
|
15
|
+
`,d=l.default.div`
|
|
16
|
+
flex: 1;
|
|
17
|
+
`;exports.TextPickerSelectAllRow=t=>{let{isChecked:r,isPartiallyChecked:n,onCheck:l}=t;return e.jsxRuntimeExports.jsxs(o,Object.assign({isActive:r||n},{children:[e.jsxRuntimeExports.jsx(c,{children:e.jsxRuntimeExports.jsx(s.CheckBox,{isChecked:r||n,isPartiallyChecked:n&&!r,onValueChange:l})}),e.jsxRuntimeExports.jsx(d,{children:e.jsxRuntimeExports.jsx(i.BodyPrimary,{children:"Select All"})})]}))};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './TextPickerModal';
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -95,3 +95,4 @@ export * from './components/data-source-panel';
|
|
|
95
95
|
export * from './components/unsatisfactory-response-list/UnsatisfactoryResponseList';
|
|
96
96
|
export * from './components/unsatisfactory-response-list/UnsatisfactoryCountIntentWiseModal';
|
|
97
97
|
export * from './components/data-source-panel/model';
|
|
98
|
+
export * from './components/text-picker';
|