@licklist/design 0.58.1 → 0.58.2

package/dist/events/event-venue-map/components/Scrollbars/Scrollbars.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/plugins/dist/hooks/Media/useWindowDimensions"),l=require("@licklist/plugins/dist/context/event/EventVenueMapContext"),i=require("../../utils/index.js"),o=require("../../hooks/useDrag.js"),s=require("../../../../iframe/order-process/components/BookingSummary/types/index.js");exports.Scrollbars=function(e){var n=e.stageRef,c=e.imageRef,h=e.layerRef,u=a.useWindowDimensions().width,d=t.useContext(l.EventVenueMapContext).stage,m=o.useDrag({stageRef:n,imageRef:c,layerRef:h}),g=m.onDragX,f=m.onDragY,p=s.MOBILE_WIDTH<=u;return r.createElement("div",{className:"canvas-scrollbars"},r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-horizontal"},p&&r.createElement("div",{className:"scroll-element horizontal-scroll",onPointerDown:g,style:function(){if(!n||!c||!h)return{width:0,left:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,o=i.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=o.totalLayerWidth,u=o.maxXOverflowNumber;if(Math.round(s)<=Math.round(a)||2*u>=s)return{width:0,left:0};var m=i.calculateHorizontalScrollParameters({x:e,width:a,totalLayerWidth:s});return{width:m.width,left:m.left}}()})),r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-vertical"},p&&r.createElement("div",{className:"scroll-element vertical-scroll",onPointerDown:f,style:function(){if(!n||!c||!h)return{height:0,top:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,o=i.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=o.totalLayerHeight,u=o.maxYOverflowNumber;if(Math.round(s)<=Math.round(l)||2*u>=s)return{height:0,top:0};var m=i.calculateVerticalScrollParameters({y:t,height:l,totalLayerHeight:s});return{height:m.height,top:m.top}}()})))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/plugins/dist/hooks/Media/useWindowDimensions"),l=require("../../../../iframe/order-process/components/BookingSummary/types/index.js"),i=require("@licklist/plugins/dist/context/event/EventVenueMapContext"),o=require("../../utils/index.js"),s=require("../../hooks/useDrag.js");exports.Scrollbars=function(e){var n=e.stageRef,c=e.imageRef,h=e.layerRef,u=a.useWindowDimensions().width,d=t.useContext(i.EventVenueMapContext).stage,m=s.useDrag({stageRef:n,imageRef:c,layerRef:h}),g=m.onDragX,f=m.onDragY,p=l.MOBILE_WIDTH<=u;return r.createElement("div",{className:"canvas-scrollbars"},r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-horizontal"},p&&r.createElement("div",{className:"scroll-element horizontal-scroll",onPointerDown:g,style:function(){if(!n||!c||!h)return{width:0,left:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,i=o.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=i.totalLayerWidth,u=i.maxXOverflowNumber;if(Math.round(s)<=Math.round(a)||2*u>=s)return{width:0,left:0};var m=o.calculateHorizontalScrollParameters({x:e,width:a,totalLayerWidth:s});return{width:m.width,left:m.left}}()})),r.createElement("div",{className:"scrollbar-wrapper scrollbar-wrapper-vertical"},p&&r.createElement("div",{className:"scroll-element vertical-scroll",onPointerDown:f,style:function(){if(!n||!c||!h)return{height:0,top:0};var e=d.x,t=d.y,r=n.attrs,a=r.width,l=r.height,i=o.getElementParameters({x:e,y:t,width:a,height:l,layer:h}),s=i.totalLayerHeight,u=i.maxYOverflowNumber;if(Math.round(s)<=Math.round(l)||2*u>=s)return{height:0,top:0};var m=o.calculateVerticalScrollParameters({y:t,height:l,totalLayerHeight:s});return{height:m.height,top:m.top}}()})))};

package/dist/iframe/order-process/components/BookingSummary/components/ToggleHeader/ToggleHeader.js

@@ -1 +1 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("react-i18next"),o=require("../../../../../../static/Icon.js"),a=e(require("clsx"));require("../../../../../../static/index.js");var c=require("../../types/index.js"),i=require("react-bootstrap/AccordionToggle"),s=e(require("react-bootstrap/AccordionContext"));exports.ToggleHeader=function(e){var l=e.showExpandButton,u=e.isExpanded,d=e.title,m=e.hideComponent,f=r.useTranslation("Design").t,x=t.useContext(s),p=i.useAccordionToggle(c.ACCORDION_KEY);return t.useEffect((function(){x||!u?x&&!u&&p(void 0):p(void 0)}),[u]),m?null:n.createElement("div",{onClick:function(e){return l&&p(e)},onKeyPress:function(e){return l&&p(e)},role:"button",tabIndex:0,className:"d-flex flex-column"},n.createElement("h6",{className:a("title",l&&"pointer")},n.createElement("div",{className:"d-flex w-100 align-content-center justify-content-between"},n.createElement("div",{className:"d-flex"},n.createElement("p",{className:"m-0"},d||f("yourBooking"))),l&&n.createElement("div",{className:"expand-button"},n.createElement(o.default,{type:x===c.ACCORDION_KEY?"chevron-up":"chevron-down",width:"1rem"})))),u&&n.createElement("hr",{className:"mt-3"}))};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("react"),n=e(t),r=require("react-i18next"),o=require("../../../../../../static/Icon.js"),a=e(require("clsx")),c=require("../../types/index.js");require("../../../../../../static/index.js");var i=require("react-bootstrap/AccordionToggle"),s=e(require("react-bootstrap/AccordionContext"));exports.ToggleHeader=function(e){var l=e.showExpandButton,u=e.isExpanded,d=e.title,m=e.hideComponent,f=r.useTranslation("Design").t,x=t.useContext(s),p=i.useAccordionToggle(c.ACCORDION_KEY);return t.useEffect((function(){x||!u?x&&!u&&p(void 0):p(void 0)}),[u]),m?null:n.createElement("div",{onClick:function(e){return l&&p(e)},onKeyPress:function(e){return l&&p(e)},role:"button",tabIndex:0,className:"d-flex flex-column"},n.createElement("h6",{className:a("title",l&&"pointer")},n.createElement("div",{className:"d-flex w-100 align-content-center justify-content-between"},n.createElement("div",{className:"d-flex"},n.createElement("p",{className:"m-0"},d||f("yourBooking"))),l&&n.createElement("div",{className:"expand-button"},n.createElement(o.default,{type:x===c.ACCORDION_KEY?"chevron-up":"chevron-down",width:"1rem"})))),u&&n.createElement("hr",{className:"mt-3"}))};

package/dist/notification/email-template/control/EmailTemplateControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EmailTemplateControl.d.ts","sourceRoot":"","sources":["../../../../src/notification/email-template/control/EmailTemplateControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAKnD,OAAO,EACL,cAAc,EAEf,MAAM,sEAAsE,CAAC;AAG9E,OAAO,EAAE,UAAU,EAAE,MAAM,kEAAkE,CAAC;AAM9F,OAAO,EAAE,gBAAgB,EAAE,MAAM,wEAAwE,CAAC;AAM1G,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,YAAY,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,IAAI,EAAE,MAAM,CAAC;IACb,kBAAkB,CAAC,EAAE,UAAU,EAAE,CAAC;IAClC,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,4BAA4B,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,gBAAgB,GAAG,IAAI,KAAK,MAAM,CAAC;CAC3E;AAED,eAAO,MAAM,oBAAoB,2FAgbhC,CAAC"}
+{"version":3,"file":"EmailTemplateControl.d.ts","sourceRoot":"","sources":["../../../../src/notification/email-template/control/EmailTemplateControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAKnD,OAAO,EACL,cAAc,EAEf,MAAM,sEAAsE,CAAC;AAG9E,OAAO,EAAE,UAAU,EAAE,MAAM,kEAAkE,CAAC;AAM9F,OAAO,EAAE,gBAAgB,EAAE,MAAM,wEAAwE,CAAC;AAM1G,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,YAAY,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,IAAI,EAAE,MAAM,CAAC;IACb,kBAAkB,CAAC,EAAE,UAAU,EAAE,CAAC;IAClC,iBAAiB,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACvC,4BAA4B,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,gBAAgB,GAAG,IAAI,KAAK,MAAM,CAAC;CAC3E;AAED,eAAO,MAAM,oBAAoB,2FAsahC,CAAC"}

package/dist/notification/email-template/control/EmailTemplateControl.js

@@ -1 +1 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),n=e(a),l=require("react-i18next"),r=require("react-bootstrap"),i=require("react-hook-form"),o=require("../../../file-upload/FileUpload.js"),s=e(require("react-email-editor")),m=require("@licklist/core/dist/DataMapper/Notification/TemplateOptionDataMapper"),c=require("@licklist/plugins/dist/hooks/Media/useAttachments"),u=require("@licklist/plugins/dist/hooks/Media/usePermanentImage"),d=require("@licklist/core/dist/DataMapper/Media/UploadPermanentImageDataMapper"),p=n.forwardRef((function(e,p){var g,f,v,E,h=e.setIsLoading,b=e.meta,_=e.options,y=void 0===_?[]:_,F=e.defaultAttachments,N=void 0===F?[]:F,D=e.notificationTypes,T=void 0===D?[]:D,C=e.getDefaultTemplateMetaByType,P=l.useTranslation(["Design"]).t,I=t.__read(a.useState(null),2),k=I[0],x=I[1],M=i.useFormContext(),O=M.register,q=M.setValue,R=M.formState.errors,V=M.getValues,A=M.watch,j=M.reset,w=t.__read(a.useState(!1),2),G=w[0],L=w[1],S=c.useAttachments(k),U=S.attachments,Y=S.handleAttachmentRemove,B=S.handleAttachmentUploading,J=S.isLoading,H=u.usePermanentImage(),z=H.permanentImages,K=H.handlePermanentImageRemove,Q=H.handlePermanentImageUploading,W=A("type"),X=A("id");a.useEffect((function(){var e;if(!X&&C&&W){var a=V(),n=C(W);j(t.__assign(t.__assign({},a),{meta:n})),null===(e=p.current)||void 0===e||e.loadDesign(JSON.parse(n))}}),[W]),a.useEffect((function(){q("attachmentMetadata",U)}),[U,q]),a.useEffect((function(){z.length&&q("imagesMetadata",z)}),[z,q]),a.useEffect((function(){if(N&&N.length>0){var e=V("attachments");x(e)}else x([])}),[N]),a.useEffect((function(){if(null==y?void 0:y.length){var e=y.find((function(e){return e.type===m.OPTION_TYPE.files_selector}));(null==e?void 0:e.selectedValue)&&L(!0)}}),[y]);return n.createElement(n.Fragment,null,n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,controlId:"type",xs:!0,sm:12,md:8,lg:10,xl:12},n.createElement(r.Form.Label,null,P("type")),n.createElement(r.Form.Control,t.__assign({as:"select"},O("type",{required:P("Validation:fieldRequired",{attribute:P("type")})}),{name:"type",required:!0,isInvalid:Boolean(R.type),placeholder:P("Design:type"),disabled:!!X}),n.createElement("option",{value:""},P("Design:choose")),T.map((function(e){return n.createElement("option",{key:e,value:e},P("Design:".concat(e)))}))),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(g=R.type)||void 0===g?void 0:g.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,controlId:"formGroupName",xs:!0,sm:12,md:8,lg:10,xl:12},n.createElement(r.Form.Label,null,P("templateName")),n.createElement(r.Form.Control,t.__assign({},O("name",{maxLength:255,required:P("Validation:fieldRequired",{attribute:P("name")})}),{name:"name",required:!0,isInvalid:Boolean(R.name),placeholder:P("Design:templateName")})),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(f=R.name)||void 0===f?void 0:f.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,xs:!0,sm:12,md:8,lg:10,xl:12,controlId:"formGroupSubject"},n.createElement(r.Form.Label,null,P("subject")),n.createElement(r.Form.Control,t.__assign({},O("subject",{maxLength:255,required:P("Validation:fieldRequired",{attribute:P("subject")})}),{name:"subject",required:!0,isInvalid:Boolean(R.subject),placeholder:P("Design:subject")})),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(v=R.subject)||void 0===v?void 0:v.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col},n.createElement(r.Form.Check,t.__assign({},O("isActive"),{name:"isActive",label:P("Design:active"),id:"formGroupIsActive",custom:!0})),n.createElement(r.Form.Check,t.__assign({},O("isDefault"),{name:"isDefault",label:P("Design:defaultTemplateForTheType"),id:"formGroupIsDefault",custom:!0})))),n.createElement(r.Row,{className:"mb-4"},n.createElement(r.Form.Group,{as:r.Col},n.createElement(r.Form.Label,null,P("Design:emailBody")),n.createElement("div",{className:"alert alert-warning",role:"alert"},"Due to the mail services limitations on the length of the email body that can be sent or received - maximum length is set to 65,535 characters."),n.createElement("div",{className:"email-editor ".concat(R.body&&"is-invalid")},n.createElement(s,{ref:p,onReady:function(){var e,a,n,l;h(!0),null===(e=p.current)||void 0===e||e.registerCallback("design:updated",(function(e){var t,a;null===(t=p.current)||void 0===t||t.editor.exportHtml((function(e){q("body",e.html),q("meta",JSON.stringify(e.design))})),"content:removed"===e.type&&"image"===(null===(a=e.item)||void 0===a?void 0:a.type)&&function(e){var t=e.item.values.src.url;if(!t.includes("unlayer")){var a=V("imagesMetadata");if(a){var n=a.find((function(e){return e.permanentUrl===t}));if(n)K(n.hash,d.PERMANENT_IMAGE_TYPE_TEMP);else{var l=t.split("/"),r=l[l.length-2];if(!r)return;K(r,d.PERMANENT_IMAGE_TYPE_PERMANENT)}}else{var i=t.split("/"),o=i[i.length-2];if(!o)return;K(o,d.PERMANENT_IMAGE_TYPE_PERMANENT)}}}(e)})),b&&(null===(a=p.current)||void 0===a||a.loadDesign(JSON.parse(b)),null===(n=p.current)||void 0===n||n.editor.exportHtml((function(e){q("body",e.html),q("meta",JSON.stringify(e.design))}))),h(!1),null===(l=p.current)||void 0===l||l.registerCallback("image",(function(e,a){return t.__awaiter(void 0,void 0,void 0,(function(){var n;return t.__generator(this,(function(t){switch(t.label){case 0:return[4,Q(e.attachments[0])];case 1:return n=t.sent(),a({progress:100,url:n.permanentUrl}),[2]}}))}))}))},style:{height:"50rem"}}),n.createElement("input",t.__assign({type:"hidden",name:"body"},O("body",{maxLength:{value:65535,message:P("Validation:fieldMaxLength",{attribute:P("body"),max:65535})}})))),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(E=R.body)||void 0===E?void 0:E.message))),n.createElement(r.Row,null,n.createElement(o.FileUpload,{className:"ml-4 mr-4",allowedExtensions:["jpg","jpeg","png","txt","pdf","doc"],enablePreview:!0,allowMultiple:!0,defaultFiles:U,onFilesChange:function(e){B(e)},title:P("Design:attachments"),onFileRemove:function(e,t){return Y(String(e),t)},isLoading:J})),(null==y?void 0:y.length)>0&&n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col},y.map((function(e){if(e.type===m.OPTION_TYPE.checkbox)return n.createElement(r.Form.Check,t.__assign({},O("templateOptionValues.".concat(null==e?void 0:e.id,".value")),{type:"checkbox",label:P("Design:".concat(e.name)),id:e.name+e.id,defaultChecked:"true"===e.selectedValue,custom:!0}));if(e.type===m.OPTION_TYPE.files_selector){var a=JSON.parse(e.defaultValue),l=Object.values(a),i=Object.keys(a);return n.createElement(n.Fragment,null,n.createElement(r.Form.Check,{checked:G,name:"IsIncludePDF",onChange:function(){L(!G),q("templateOptionValues.".concat(e.id,".value"),"")},label:P("Design:includePDF"),id:"formGroupIsIncludePdf",custom:!0}),G&&n.createElement(n.Fragment,null,n.createElement(r.Form.Label,{className:"mt-4"},P("Design:includeFile")),n.createElement(r.Form.Control,t.__assign({as:"select"},O("templateOptionValues.".concat(e.id,".value")),{defaultValue:e.selectedValue||""}),n.createElement("option",{value:""},P("Design:choose")),i.map((function(e,t){return n.createElement("option",{value:String(e),key:String(e)},l[t])})))))}return e.type===m.OPTION_TYPE.days_reminder?n.createElement(n.Fragment,null,n.createElement(r.Form.Label,{className:"mt-4"},P("Design:".concat(e.name))),n.createElement(r.Form.Control,t.__assign({},O("templateOptionValues.".concat(null==e?void 0:e.id,".value")),{type:"number",placeholder:P("Design:".concat(e.name)),id:e.name+e.id,defaultValue:e.selectedValue||""})),n.createElement(r.Form.Text,null,e.description)):null})))))}));p.displayName="EmailTemplateControl",exports.EmailTemplateControl=p;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var t=require("tslib"),a=require("react"),n=e(a),l=require("react-i18next"),r=require("react-bootstrap"),i=require("react-hook-form"),o=require("../../../file-upload/FileUpload.js"),s=e(require("react-email-editor")),m=require("@licklist/core/dist/DataMapper/Notification/TemplateOptionDataMapper"),c=require("@licklist/plugins/dist/hooks/Media/useAttachments"),u=require("@licklist/plugins/dist/hooks/Media/usePermanentImage"),d=require("@licklist/core/dist/DataMapper/Media/UploadPermanentImageDataMapper"),p=n.forwardRef((function(e,p){var g,f,v,E,h=e.setIsLoading,b=e.meta,_=e.options,y=void 0===_?[]:_,F=e.defaultAttachments,N=void 0===F?[]:F,D=e.notificationTypes,T=void 0===D?[]:D,C=e.getDefaultTemplateMetaByType,P=l.useTranslation(["Design"]).t,I=t.__read(a.useState(null),2),k=I[0],M=I[1],x=i.useFormContext(),O=x.register,q=x.setValue,R=x.formState.errors,V=x.getValues,A=x.watch,j=x.reset,w=t.__read(a.useState(!1),2),G=w[0],L=w[1],S=c.useAttachments(k),U=S.attachments,Y=S.handleAttachmentRemove,B=S.handleAttachmentUploading,J=S.isLoading,H=u.usePermanentImage(),z=H.permanentImages,K=H.handlePermanentImageRemove,Q=H.handlePermanentImageUploading,W=A("type"),X=A("id");a.useEffect((function(){var e;if(!X&&C&&W){var a=V(),n=C(W);j(t.__assign(t.__assign({},a),{meta:n})),null===(e=p.current)||void 0===e||e.loadDesign(JSON.parse(n))}}),[W]),a.useEffect((function(){q("attachmentMetadata",U)}),[U,q]),a.useEffect((function(){z.length&&q("imagesMetadata",z)}),[z,q]),a.useEffect((function(){if(N&&N.length>0){var e=V("attachments");M(e)}else M([])}),[N]),a.useEffect((function(){if(null==y?void 0:y.length){var e=y.find((function(e){return e.type===m.OPTION_TYPE.files_selector}));(null==e?void 0:e.selectedValue)&&L(!0)}}),[y]);return n.createElement(n.Fragment,null,n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,controlId:"type",sm:12},n.createElement(r.Form.Label,null,P("type")),n.createElement(r.Form.Control,t.__assign({as:"select"},O("type",{required:P("Validation:fieldRequired",{attribute:P("type")})}),{name:"type",required:!0,isInvalid:Boolean(R.type),placeholder:P("Design:type"),disabled:!!X}),n.createElement("option",{value:""},P("Design:choose")),T.map((function(e){return n.createElement("option",{key:e,value:e},P("Design:".concat(e)))}))),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(g=R.type)||void 0===g?void 0:g.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,controlId:"formGroupName",xs:!0,sm:12,md:8,lg:10,xl:12},n.createElement(r.Form.Label,null,P("templateName")),n.createElement(r.Form.Control,t.__assign({},O("name",{maxLength:255,required:P("Validation:fieldRequired",{attribute:P("name")})}),{name:"name",required:!0,isInvalid:Boolean(R.name),placeholder:P("Design:templateName")})),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(f=R.name)||void 0===f?void 0:f.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col,xs:!0,sm:12,md:8,lg:10,xl:12,controlId:"formGroupSubject"},n.createElement(r.Form.Label,null,P("subject")),n.createElement(r.Form.Control,t.__assign({},O("subject",{maxLength:255,required:P("Validation:fieldRequired",{attribute:P("subject")})}),{name:"subject",required:!0,isInvalid:Boolean(R.subject),placeholder:P("Design:subject")})),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(v=R.subject)||void 0===v?void 0:v.message))),n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col},n.createElement(r.Form.Check,t.__assign({},O("isActive"),{name:"isActive",label:P("Design:active"),id:"formGroupIsActive",custom:!0})),n.createElement(r.Form.Check,t.__assign({},O("isDefault"),{name:"isDefault",label:P("Design:defaultTemplateForTheType"),id:"formGroupIsDefault",custom:!0})))),n.createElement(r.Row,{className:"mb-4"},n.createElement(r.Form.Group,{as:r.Col},n.createElement(r.Form.Label,null,P("Design:emailBody")),n.createElement("div",{className:"alert alert-warning",role:"alert"},"Due to the mail services limitations on the length of the email body that can be sent or received - maximum length is set to 65,535 characters."),n.createElement("div",{className:"email-editor ".concat(R.body&&"is-invalid")},n.createElement(s,{ref:p,onReady:function(){var e,a,n,l;h(!0),null===(e=p.current)||void 0===e||e.registerCallback("design:updated",(function(e){var t,a;null===(t=p.current)||void 0===t||t.editor.exportHtml((function(e){q("body",e.html),q("meta",JSON.stringify(e.design))})),"content:removed"===e.type&&"image"===(null===(a=e.item)||void 0===a?void 0:a.type)&&function(e){var t=e.item.values.src.url;if(!t.includes("unlayer")){var a=V("imagesMetadata");if(a){var n=a.find((function(e){return e.permanentUrl===t}));if(n)K(n.hash,d.PERMANENT_IMAGE_TYPE_TEMP);else{var l=t.split("/"),r=l[l.length-2];if(!r)return;K(r,d.PERMANENT_IMAGE_TYPE_PERMANENT)}}else{var i=t.split("/"),o=i[i.length-2];if(!o)return;K(o,d.PERMANENT_IMAGE_TYPE_PERMANENT)}}}(e)})),b&&(null===(a=p.current)||void 0===a||a.loadDesign(JSON.parse(b)),null===(n=p.current)||void 0===n||n.editor.exportHtml((function(e){q("body",e.html),q("meta",JSON.stringify(e.design))}))),h(!1),null===(l=p.current)||void 0===l||l.registerCallback("image",(function(e,a){return t.__awaiter(void 0,void 0,void 0,(function(){var n;return t.__generator(this,(function(t){switch(t.label){case 0:return[4,Q(e.attachments[0])];case 1:return n=t.sent(),a({progress:100,url:n.permanentUrl}),[2]}}))}))}))},style:{height:"50rem"}}),n.createElement("input",t.__assign({type:"hidden",name:"body"},O("body",{maxLength:{value:65535,message:P("Validation:fieldMaxLength",{attribute:P("body"),max:65535})}})))),n.createElement(r.Form.Control.Feedback,{type:"invalid"},null===(E=R.body)||void 0===E?void 0:E.message))),n.createElement(r.Row,null,n.createElement(o.FileUpload,{className:"ml-4 mr-4",allowedExtensions:["jpg","jpeg","png","txt","pdf","doc"],enablePreview:!0,allowMultiple:!0,defaultFiles:U,onFilesChange:function(e){B(e)},title:P("Design:attachments"),onFileRemove:function(e,t){return Y(String(e),t)},isLoading:J})),(null==y?void 0:y.length)>0&&n.createElement(r.Row,null,n.createElement(r.Form.Group,{as:r.Col},y.map((function(e){if(e.type===m.OPTION_TYPE.checkbox)return n.createElement(r.Form.Check,t.__assign({},O("templateOptionValues.".concat(null==e?void 0:e.id,".value")),{type:"checkbox",label:P("Design:".concat(e.name)),id:e.name+e.id,defaultChecked:"true"===e.selectedValue,custom:!0}));if(e.type===m.OPTION_TYPE.files_selector){var a=JSON.parse(e.defaultValue),l=Object.values(a),i=Object.keys(a);return n.createElement(n.Fragment,null,n.createElement(r.Form.Check,{checked:G,name:"IsIncludePDF",onChange:function(){L(!G),q("templateOptionValues.".concat(e.id,".value"),"")},label:P("Design:includePDF"),id:"formGroupIsIncludePdf",custom:!0}),G&&n.createElement(n.Fragment,null,n.createElement(r.Form.Label,{className:"mt-4"},P("Design:includeFile")),n.createElement(r.Form.Control,t.__assign({as:"select"},O("templateOptionValues.".concat(e.id,".value")),{defaultValue:e.selectedValue||""}),n.createElement("option",{value:""},P("Design:choose")),i.map((function(e,t){return n.createElement("option",{value:String(e),key:String(e)},l[t])})))))}return e.type===m.OPTION_TYPE.days_reminder?n.createElement(n.Fragment,null,n.createElement(r.Form.Label,{className:"mt-4"},P("Design:".concat(e.name))),n.createElement(r.Form.Control,t.__assign({},O("templateOptionValues.".concat(null==e?void 0:e.id,".value")),{type:"number",placeholder:P("Design:".concat(e.name)),id:e.name+e.id,defaultValue:e.selectedValue||""})),n.createElement(r.Form.Text,null,e.description)):null})))))}));p.displayName="EmailTemplateControl",exports.EmailTemplateControl=p;

package/dist/sales/manual-booking/summary/ManualBookingSummary.d.ts

@@ -10,6 +10,7 @@ export interface ManualBookingSummaryProps {
     isFeeFetching: boolean;
     orderDate: string;
     relyOnPeopleType?: RelyOnPeopleType | null;
+    isMobileView?: boolean;
 }
-export declare const ManualBookingSummary: ({ eventName, orders, ordersSum, orderSumIncludingFee, isFeeFetching, orderDate, relyOnPeopleType, hasBookingCategory, }: ManualBookingSummaryProps) => JSX.Element;
+export declare const ManualBookingSummary: ({ eventName, orders, ordersSum, orderSumIncludingFee, isFeeFetching, orderDate, relyOnPeopleType, hasBookingCategory, isMobileView, }: ManualBookingSummaryProps) => JSX.Element;
 //# sourceMappingURL=ManualBookingSummary.d.ts.map

package/dist/sales/manual-booking/summary/ManualBookingSummary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ManualBookingSummary.d.ts","sourceRoot":"","sources":["../../../../src/sales/manual-booking/summary/ManualBookingSummary.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+DAA+D,CAAC;AAQnG,OAAO,EAEL,gBAAgB,EACjB,MAAM,6DAA6D,CAAC;AAIrE,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,oBAAoB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;CAC5C;AAED,eAAO,MAAM,oBAAoB,4HAS9B,yBAAyB,gBAkF3B,CAAC"}
+{"version":3,"file":"ManualBookingSummary.d.ts","sourceRoot":"","sources":["../../../../src/sales/manual-booking/summary/ManualBookingSummary.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+DAA+D,CAAC;AAQnG,OAAO,EAEL,gBAAgB,EACjB,MAAM,6DAA6D,CAAC;AAIrE,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,MAAM,CAAC;IAClB,MAAM,EAAE,kBAAkB,EAAE,CAAC;IAC7B,SAAS,EAAE,MAAM,CAAC;IAClB,oBAAoB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,kBAAkB,EAAE,OAAO,CAAC;IAC5B,aAAa,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,eAAO,MAAM,oBAAoB,0IAU9B,yBAAyB,gBAwF3B,CAAC"}

package/dist/sales/manual-booking/summary/ManualBookingSummary.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/core/dist/Config");require("../../../static/loader/LoaderIndicator.js");var l=require("../../../static/loader/BlockLoader.js"),n=require("react-i18next");require("../../../static/loader/ButtonLoader.js"),require("../../../static/loader/SnippetLoader.js"),require("../../../static/loader/PaymentLoader.js");var c=require("luxon"),i=require("@licklist/core/dist/DataMapper/Product/ProductSetDataMapper"),o=require("react-intl"),m=require("@licklist/plugins/dist/utils/relyOnPeople");exports.ManualBookingSummary=function(e){var t=e.eventName,s=e.orders,u=e.ordersSum,d=e.orderSumIncludingFee,y=e.isFeeFetching,p=e.orderDate,v=e.relyOnPeopleType,E=e.hasBookingCategory,N=n.useTranslation(["Design","Sale"]).t,g=o.useIntl().formatNumber,q=v&&v!==i.RELY_ON_PEOPLE_QUANTITY,O=c.DateTime.fromISO(p),P=O.toFormat(a.DATE_TIME_MANUAL_BOOKING_FORMAT),f=O.toFormat(a.TIME_FORMAT);return r.createElement("div",{className:"manual-booking-summary"},r.createElement("div",{className:"receipt-title"},N("Sale:receipt")),r.createElement("div",{className:"event-name border-summary-item"},t),r.createElement("div",{className:"border-summary-item"},P),r.createElement("div",{className:"border-summary-item"},f),s.length>0?r.createElement("div",{className:"summary-item-container"},s.map((function(e){var t=m.getRelyOnPeopleMultiplier({relyOnPeopleType:v,capacity:null==e?void 0:e.capacity,hasBookingCategory:E});return r.createElement("div",{key:e.id,className:"d-flex justify-content-between border-summary-item"},r.createElement("div",null,e.name),q&&!!t&&r.createElement("div",null,"x ".concat(e.quantity*t," ").concat(N("people"))),r.createElement("div",null,g(e.quantity*e.price,{style:"currency",currency:a.Currency.GBP})))})),r.createElement("div",null,r.createElement("div",{className:"total-container"},r.createElement("div",null,N("Sale:total")),r.createElement("div",{className:"total-amount"},g(u,{style:"currency",currency:a.Currency.GBP}))),d&&r.createElement("div",{className:"total-container ".concat(y?"mt-6":"mt-4")},y||!d?r.createElement(l.BlockLoader,null):r.createElement(r.Fragment,null,r.createElement("div",null,N("Sale:includingOperationalCost")),r.createElement("div",{className:"total-amount"},g(d,{style:"currency",currency:a.Currency.GBP})))))):r.createElement("div",{className:"cart-items"},r.createElement("p",{className:"empty-cart"},N("Design:emptyBasket"))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=(e=t)&&"object"==typeof e&&"default"in e?e.default:e,a=require("@licklist/core/dist/Config");require("../../../static/loader/LoaderIndicator.js");var l=require("../../../static/loader/BlockLoader.js"),n=require("react-i18next");require("../../../static/loader/ButtonLoader.js"),require("../../../static/loader/SnippetLoader.js"),require("../../../static/loader/PaymentLoader.js");var i=require("luxon"),c=require("@licklist/core/dist/DataMapper/Product/ProductSetDataMapper"),o=require("react-intl"),m=require("@licklist/plugins/dist/utils/relyOnPeople");exports.ManualBookingSummary=function(e){var t=e.eventName,s=e.orders,u=e.ordersSum,d=e.orderSumIncludingFee,y=e.isFeeFetching,p=e.orderDate,v=e.relyOnPeopleType,E=e.hasBookingCategory,N=e.isMobileView,g=n.useTranslation(["Design","Sale"]).t,q=o.useIntl().formatNumber,O=v&&v!==c.RELY_ON_PEOPLE_QUANTITY,P=i.DateTime.fromISO(p),b=P.toFormat(a.DATE_TIME_MANUAL_BOOKING_FORMAT),k=P.toFormat(a.TIME_FORMAT);return r.createElement("div",{className:N?"manual-booking-summary-mobile":"manual-booking-summary"},r.createElement("div",{className:"receipt-title"},g("Sale:receipt")),r.createElement("div",{className:"event-name border-summary-item"},t),r.createElement("div",{className:"border-summary-item"},b),r.createElement("div",{className:"border-summary-item"},k),s.length>0?r.createElement("div",{className:"summary-item-container"},s.map((function(e){var t=m.getRelyOnPeopleMultiplier({relyOnPeopleType:v,capacity:null==e?void 0:e.capacity,hasBookingCategory:E});return r.createElement("div",{key:e.id,className:"d-flex justify-content-between border-summary-item"},r.createElement("div",null,e.name),O&&!!t&&r.createElement("div",null,"x ".concat(e.quantity*t," ").concat(g("people"))),r.createElement("div",null,q(e.quantity*e.price,{style:"currency",currency:a.Currency.GBP})))})),r.createElement("div",null,r.createElement("div",{className:"total-container"},r.createElement("div",null,g("Sale:total")),r.createElement("div",{className:"total-amount"},q(u,{style:"currency",currency:a.Currency.GBP}))),d&&r.createElement("div",{className:"total-container ".concat(y?"mt-6":"mt-4")},y||!d?r.createElement(l.BlockLoader,null):r.createElement(r.Fragment,null,r.createElement("div",null,g("Sale:includingOperationalCost")),r.createElement("div",{className:"total-amount"},q(d,{style:"currency",currency:a.Currency.GBP})))))):r.createElement("div",{className:"cart-items"},r.createElement("p",{className:"empty-cart"},g("Design:emptyBasket"))))};

package/dist/static/date-range-input/DateRangeInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/static/date-range-input/DateRangeInput.tsx"],"names":[],"mappings":";AAcA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,yCAAyC,CAAC;AAEjD,KAAK,mBAAmB,GAAG;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAC1E,CAAC;AAEF,eAAO,MAAM,cAAc,yEAOxB,mBAAmB,gBA4GrB,CAAC"}
+{"version":3,"file":"DateRangeInput.d.ts","sourceRoot":"","sources":["../../../src/static/date-range-input/DateRangeInput.tsx"],"names":[],"mappings":";AAeA,OAAO,kCAAkC,CAAC;AAC1C,OAAO,yCAAyC,CAAC;AAIjD,KAAK,mBAAmB,GAAG;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;CAC1E,CAAC;AAEF,eAAO,MAAM,cAAc,yEAOxB,mBAAmB,gBA8HrB,CAAC"}

package/dist/static/date-range-input/DateRangeInput.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),n=require("react"),a=(e=n)&&"object"==typeof e&&"default"in e?e.default:e,r=require("react-i18next"),s=require("react-bootstrap"),i=require("../Icon.js"),o=require("@react-aria/utils"),u=require("react-date-range"),c=require("react-use"),l=require("./utils/index.js");require("react-date-range/dist/styles.css"),require("react-date-range/dist/theme/default.css"),require("../index.js");var d={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:function(e){var t=e.state;Object.assign(t.styles.popper,{marginLeft:"-2px",maxWidth:"unset"})},effect:function(e){var t=e.state;Object.assign(t.elements.popper.style,{maxWidth:"unset"})}};exports.DateRangeInput=function(e){var m=e.placeholder,p=e.startDate,f=e.endDate,g=e.onDateChange,D=e.months,v=void 0===D?2:D,h=e.disabled,y=r.useTranslation("Design").t,_=t.__read(n.useState([{startDate:new Date,endDate:new Date,key:"selection"}]),2),b=_[0],q=_[1],E=t.__read(n.useState(!1),2),x=E[0],w=E[1],C=o.useId(),j=n.useRef();c.useClickAway(j,(function(){return w(!1)}));return n.useEffect((function(){p&&f&&q((function(e){return[t.__assign(t.__assign({},e[0]),l.stringDatesToJSDates({startDate:p,endDate:f}))]}))}),[p,f]),a.createElement("div",null,a.createElement(s.OverlayTrigger,{show:x,overlay:a.createElement(s.Popover,{id:C,className:"rounded"},a.createElement(s.Popover.Content,{className:"shadow-lg rounded",ref:j},a.createElement(u.DateRange,{onChange:function(e){return q([e.selection])},moveRangeOnFirstSelection:!1,ranges:b,months:v,direction:"horizontal"}),a.createElement("div",{className:"mt-3 d-flex justify-content-end"},a.createElement(s.Button,{onClick:function(){g&&g({}),q((function(e){return[t.__assign(t.__assign({},e[0]),{startDate:new Date,endDate:new Date})]})),w(!1)},variant:"link"},y("clear")),a.createElement(s.Button,{onClick:function(){g&&g(l.rangeDatesToStringDates(b)),w(!1)},className:"ml-3",variant:"link"},y("apply"))))),trigger:"click",placement:"bottom",popperConfig:{modifiers:[d]}},a.createElement("div",{onClick:function(){return w((function(e){return!e}))},onKeyDown:function(){return w((function(e){return!e}))},role:"button",tabIndex:0,className:"date-range-input-wrapper"},a.createElement(s.Form.Control,{type:"input",placeholder:m,disabled:h,readOnly:!0,className:"date-range-input",value:l.stringDatesToInputValue({startDate:p,endDate:f})}),a.createElement(i.default,{type:"calendar",height:"1rem",className:"date-range-input-icon"}))))};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("tslib"),n=require("react"),r=(e=n)&&"object"==typeof e&&"default"in e?e.default:e,a=require("react-i18next"),i=require("react-bootstrap"),s=require("../Icon.js"),o=require("@react-aria/utils"),u=require("react-date-range"),c=require("react-use"),l=require("./utils/index.js"),d=require("../../iframe/order-process/components/BookingSummary/types/index.js");require("react-date-range/dist/styles.css"),require("react-date-range/dist/theme/default.css"),require("../index.js");var m={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:function(e){var t=e.state;Object.assign(t.styles.popper,{marginLeft:"-2px",maxWidth:"unset"})},effect:function(e){var t=e.state;Object.assign(t.elements.popper.style,{maxWidth:"unset"})}};exports.DateRangeInput=function(e){var f=e.placeholder,p=e.startDate,g=e.endDate,D=e.onDateChange,v=e.months,h=void 0===v?2:v,y=e.disabled,_=a.useTranslation("Design").t,E=t.__read(n.useState("horizontal"),2),w=E[0],q=E[1],b=t.__read(n.useState([{startDate:new Date,endDate:new Date,key:"selection"}]),2),x=b[0],j=b[1],k=t.__read(n.useState(!1),2),C=k[0],S=k[1],I=o.useId(),N=n.useRef();c.useClickAway(N,(function(){return S(!1)}));return n.useEffect((function(){p&&g&&j((function(e){return[t.__assign(t.__assign({},e[0]),l.stringDatesToJSDates({startDate:p,endDate:g}))]}))}),[p,g]),n.useEffect((function(){var e=function(){window.innerWidth>d.MOBILE_WIDTH?q("horizontal"):q("vertical")};return e(),window.addEventListener("resize",e),function(){window.removeEventListener("resize",e)}}),[]),r.createElement("div",null,r.createElement(i.OverlayTrigger,{show:C,overlay:r.createElement(i.Popover,{id:I,className:"rounded"},r.createElement(i.Popover.Content,{className:"shadow-lg rounded",ref:N},r.createElement(u.DateRange,{onChange:function(e){return j([e.selection])},moveRangeOnFirstSelection:!1,ranges:x,months:h,direction:w}),r.createElement("div",{className:"mt-3 d-flex justify-content-end"},r.createElement(i.Button,{onClick:function(){D&&D({}),j((function(e){return[t.__assign(t.__assign({},e[0]),{startDate:new Date,endDate:new Date})]})),S(!1)},variant:"link"},_("clear")),r.createElement(i.Button,{onClick:function(){D&&D(l.rangeDatesToStringDates(x)),S(!1)},className:"ml-3",variant:"link"},_("apply"))))),trigger:"click",placement:"bottom",popperConfig:{modifiers:[m]}},r.createElement("div",{onClick:function(){return S((function(e){return!e}))},onKeyDown:function(){return S((function(e){return!e}))},role:"button",tabIndex:0,className:"date-range-input-wrapper"},r.createElement(i.Form.Control,{type:"input",placeholder:f,disabled:y,readOnly:!0,className:"date-range-input",value:l.stringDatesToInputValue({startDate:p,endDate:g})}),r.createElement(s.default,{type:"calendar",height:"1rem",className:"date-range-input-icon"}))))};

package/dist/styles/resources-blocking/_index.scss

@@ -106,6 +106,12 @@
     align-items: center;
     gap: 0.25rem;
     margin-bottom: 0.5rem;
+
+    @include media-breakpoint-down(sm) {
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
   }
 
   .text-input.form-group {

package/dist/styles/sales/BookingFilter.scss

@@ -157,6 +157,19 @@
         margin-bottom: 0;
       }
     }
+
+    .apply-container{
+      display: flex;
+      justify-content: space-around;
+      column-gap: 2rem;
+      margin-left: 3rem;
+
+      @include media-breakpoint-down(sm) {
+        flex-direction: row;
+        margin-left: 0rem;
+        column-gap: 1rem;
+      }
+    }
   }
 
   .additional-filter-container {
@@ -175,8 +188,12 @@
       }
     }
 
-    @include media-breakpoint-between(md, lg) {
-      flex-wrap: nowrap;
+    @include media-breakpoint-down(xl) {
+      flex-wrap: wrap;
+
+      .apply-container {
+        margin-left: 4rem;
+      }
 
       .date-container {
         width: auto;
@@ -230,6 +247,11 @@
           transform: rotate(45deg);
         }
       }
+
+      @include media-breakpoint-down(sm) {
+        flex-direction: column;
+        justify-content: flex-start;
+      }
     }
   }
 }

package/dist/styles/sales/BookingTabs.scss

@@ -1,24 +1,49 @@
 .booking-tabs-pane {
   display: flex;
   flex-direction: row;
+  justify-content: space-between;
   align-items: center;
   height: 2.75rem;
   background-color: $white;
 
   .booking-tabs {
     svg {
-      g > rect:first-child {
-        fill: $white; 
+      g>rect:first-child {
+        fill: $white;
       }
     }
-    
+
     .active {
       svg {
-        g > rect:first-child {
-          fill: $blue; 
+        g>rect:first-child {
+          fill: $blue;
         }
       }
     }
+
+    @include media-breakpoint-down(sm) {
+      width: 4rem;
+    }
+  }
+
+  .content {
+    display: flex;
+    justify-content: space-between;
+    width: 85%;
+    flex-direction: row;
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      height: 4rem;
+    }
+
+    .booking {
+      @include media-breakpoint-down(sm) {
+        height: 13rem;
+      }
+    }
   }
 
   .separator {
@@ -29,6 +54,12 @@
   .children {
     flex: 1;
     margin-left: 1rem;
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+    }
   }
 
   .buttons {
@@ -61,6 +92,33 @@
         border-radius: 0.625rem;
         margin-right: 0.5rem;
       }
+      @include media-breakpoint-down(sm) {
+        width: 12.5rem;
+      }
+  
+    }
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      gap: .5rem;
+      margin-top: .5rem;
+      white-space: nowrap;
+    }
+  }
+
+  @include media-breakpoint-down(sm) {
+    display: flex;
+    align-items: start;
+    gap: 1rem;
+    margin-top: 1rem;
+    height: 100%;
+  }
+
+  .booking {
+    @include media-breakpoint-down(sm) {
+      height: 13rem;
     }
   }
 }

package/dist/styles/sales/LifeTimeSales.scss

@@ -33,6 +33,7 @@
   }
 
   @include media-breakpoint-down(sm) {
+    height: 12rem;
     &__value {
       line-height: 1rem;
       font-size: 2rem;

package/dist/styles/sales/ManualBooking.scss

@@ -361,10 +361,11 @@
   width: inherit;
 
   @include media-breakpoint-down(sm) {
-    padding: 0 0.5rem;
-    padding-top: 2rem;
+    display: none;
   }
 
+
+
   .form-control {
     margin-bottom: 1.5rem;
   }
@@ -411,6 +412,64 @@
   }
 }
 
+.manual-booking-summary-mobile {
+  display: none;
+
+  @include media-breakpoint-down(sm) {
+    display: block;
+    padding: 0 1.5rem;
+    padding-top: 2rem;
+    height: max-content;
+    margin-bottom: 1.5rem;
+    width: inherit;
+
+    .form-control {
+      margin-bottom: .5rem;
+    }
+    .receipt-title {
+      font-size: 1.125rem;
+      font-weight: 600;
+      padding-bottom: 0.4rem;
+      margin-bottom: 1rem;
+      border-bottom: 2px solid $gray-400;
+    }
+    .event-name {
+      font-size: 0.94rem;
+      font-weight: 600;
+    }
+
+    .border-summary-item {
+      padding-bottom: 0.9rem;
+      margin-bottom: 1%;
+      border-bottom: 2px solid $gray-100;
+      flex-wrap: wrap;
+    }
+
+    .total-container {
+      display: flex;
+      justify-content: space-between;
+      font-size: 1rem;
+      font-weight: 600;
+
+      @include media-breakpoint-down(lg) {
+        flex-wrap: wrap;
+      }
+      .total-amount {
+        padding-left: 1rem;
+        @include media-breakpoint-down(lg) {
+          padding-left: 0;
+        }
+      }
+    }
+
+    .summary-item-container {
+      .border-summary-item:nth-last-child(2) {
+        border-bottom: 2px solid $gray-400;
+      }
+    }
+  }
+}
+
 .menu-list-manual-booking {
   display: flex;
   align-items: center;
@@ -437,4 +496,4 @@
       color: $blue;
     }
   }
-}
+}

package/dist/styles/sales/SourceOfSales.scss

@@ -13,6 +13,9 @@
 
   &__pie-chart {
     height: 100%;
+    @include media-breakpoint-down(sm) {
+      height: 12rem;
+    }
   }
 
   .colors-0 {

package/dist/styles/snippet-templates/SnippetTemplateCard.scss

@@ -28,12 +28,13 @@ $snippet-template-card-button-transition: $product-set-card-transition !default;
   border: 1px solid #ccc;
   border-radius: $border-radius;
   height: 10rem;
-  width: 15rem;
+  min-width: 15rem;
   padding: 1rem;
 
   @include media-breakpoint-down(sm) {
     height: 100%;
     max-height: 10rem;
+    width: 100%;
   }
 
   p {
@@ -109,4 +110,4 @@ $snippet-template-card-button-transition: $product-set-card-transition !default;
   &:hover {
     border: 2px solid $blue;
   }
-}
+}

package/dist/styles/static/Tabs.scss

@@ -11,6 +11,12 @@ $tab-nav-link-active-border-bottom: 1px solid $tab-nav-link-active-color !defaul
   margin-left: -1.25rem;
   border-bottom: 1px solid $nav-tabs-border-color;
 
+  @include media-breakpoint-down(sm) {
+    display: flex;
+    flex-direction: column;
+    white-space: nowrap;
+  }
+
   .nav-link {
     color: $tab-nav-link-color;
     background-color: transparent;

package/dist/styles/themes/bookedit/_index.scss

@@ -98,7 +98,8 @@
       color: gray("600");
 
       &.sortable {
-        &::before, &::after {
+        &::before,
+        &::after {
           opacity: 1;
         }
 
@@ -132,20 +133,20 @@
     width: 2.5rem;
     height: 2.5rem;
     background-color: transparent;
-  
+
     svg {
       margin-bottom: 2.5px;
     }
 
     &:hover {
       cursor: pointer;
-      border-radius: .5rem;
+      border-radius: 0.5rem;
       background-color: lighten($primary, 40);
     }
   }
 
   .page-item {
-    margin-left: .4rem;
+    margin-left: 0.4rem;
     min-width: 15px;
     width: 2.5rem;
     height: 2.5rem;
@@ -153,7 +154,7 @@
     .page-link {
       border: 0;
       padding: 0;
-      border-radius: .5rem;
+      border-radius: 0.5rem;
       height: 100%;
       display: flex;
       align-items: center;
@@ -162,13 +163,13 @@
       color: $black;
       font-weight: 600;
       font-size: 0.875rem;
-      
+
       &:hover {
-        border-radius: .5rem;
+        border-radius: 0.5rem;
         background-color: lighten($primary, 40);
       }
     }
-    
+
     &.active {
       .page-link {
         border: 2px solid $primary;

package/dist/styles/themes/bookedit/_variables.scss

@@ -197,6 +197,7 @@ $grid-breakpoints: (
   md: 768px,
   lg: 992px,
   xl: 1200px,
+  xxl: 1500px,
 ) !default;
 
 @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
@@ -211,6 +212,7 @@ $container-max-widths: (
   md: 720px,
   lg: 960px,
   xl: 1140px,
+  xxl: 1500px,
 ) !default;
 
 @include _assert-ascending($container-max-widths, "$container-max-widths");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@licklist/design",
-  "version": "0.58.1",
+  "version": "0.58.2",
   "repository": {
     "type": "git",
     "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"

package/src/notification/email-template/control/EmailTemplateControl.tsx

@@ -201,15 +201,7 @@ export const EmailTemplateControl = React.forwardRef(
     return (
       <>
         <Row>
-          <Form.Group
-            as={Col}
-            controlId="type"
-            xs
-            sm={12}
-            md={8}
-            lg={10}
-            xl={12}
-          >
+          <Form.Group as={Col} controlId="type" sm={12}>
             <Form.Label>{t("type")}</Form.Label>
             <Form.Control
               as="select"
@@ -372,9 +364,7 @@ export const EmailTemplateControl = React.forwardRef(
                 if (option.type === OPTION_TYPE.checkbox) {
                   return (
                     <Form.Check
-                      {...register(
-                        `templateOptionValues.${option?.id}.value` as any
-                      )}
+                      {...register(`templateOptionValues.${option?.id}.value`)}
                       type="checkbox"
                       label={t(`Design:${option.name}`)}
                       id={option.name + option.id}
@@ -397,7 +387,7 @@ export const EmailTemplateControl = React.forwardRef(
                         onChange={() => {
                           setIsIncludePDF(!isIncludePDF);
                           setValue(
-                            `templateOptionValues.${option.id}.value` as any,
+                            `templateOptionValues.${option.id}.value`,
                             ""
                           );
                         }}
@@ -413,7 +403,7 @@ export const EmailTemplateControl = React.forwardRef(
                           <Form.Control
                             as="select"
                             {...register(
-                              `templateOptionValues.${option.id}.value` as any
+                              `templateOptionValues.${option.id}.value`
                             )}
                             defaultValue={option.selectedValue || ""}
                           >
@@ -442,7 +432,7 @@ export const EmailTemplateControl = React.forwardRef(
                       </Form.Label>
                       <Form.Control
                         {...register(
-                          `templateOptionValues.${option?.id}.value` as any
+                          `templateOptionValues.${option?.id}.value`
                         )}
                         type="number"
                         placeholder={t(`Design:${option.name}`)}

package/src/sales/manual-booking/summary/ManualBookingSummary.tsx

@@ -24,6 +24,7 @@ export interface ManualBookingSummaryProps {
   isFeeFetching: boolean;
   orderDate: string;
   relyOnPeopleType?: RelyOnPeopleType | null;
+  isMobileView?: boolean;
 }
 
 export const ManualBookingSummary = ({
@@ -35,6 +36,7 @@ export const ManualBookingSummary = ({
   orderDate,
   relyOnPeopleType,
   hasBookingCategory,
+  isMobileView,
 }: ManualBookingSummaryProps) => {
   const { t } = useTranslation(["Design", "Sale"]);
   const { formatNumber } = useIntl();
@@ -44,7 +46,13 @@ export const ManualBookingSummary = ({
   const date = currentDate.toFormat(DATE_TIME_MANUAL_BOOKING_FORMAT);
   const time = currentDate.toFormat(TIME_FORMAT);
   return (
-    <div className="manual-booking-summary">
+    <div
+      className={
+        isMobileView
+          ? "manual-booking-summary-mobile"
+          : "manual-booking-summary"
+      }
+    >
       <div className="receipt-title">{t("Sale:receipt")}</div>
       <div className="event-name border-summary-item">{eventName}</div>
       <div className="border-summary-item">{date}</div>

package/src/static/date-range-input/DateRangeInput.tsx

@@ -11,10 +11,13 @@ import {
   rangeDatesToStringDates,
   stringDatesToInputValue,
 } from "./utils";
+import { MOBILE_WIDTH } from "../../iframe/order-process/components/BookingSummary/types";
 
 import "react-date-range/dist/styles.css";
 import "react-date-range/dist/theme/default.css";
 
+type DateRangeDirection = "vertical" | "horizontal";
+
 type DateRangeInputProps = {
   placeholder: string;
   startDate?: string;
@@ -33,7 +36,7 @@ export const DateRangeInput = ({
   disabled,
 }: DateRangeInputProps) => {
   const { t } = useTranslation("Design");
-
+  const [direction, setDirection] = useState<DateRangeDirection>("horizontal");
   const [state, setState] = useState<Range[]>([
     {
       startDate: new Date(),
@@ -82,6 +85,24 @@ export const DateRangeInput = ({
     }
   }, [startDate, endDate]);
 
+  useEffect(() => {
+    const resizeBodyInMobile = () => {
+      if (window.innerWidth > MOBILE_WIDTH) {
+        setDirection("horizontal");
+        return;
+      }
+
+      setDirection("vertical");
+    };
+
+    resizeBodyInMobile();
+    window.addEventListener("resize", resizeBodyInMobile);
+
+    return () => {
+      window.removeEventListener("resize", resizeBodyInMobile);
+    };
+  }, []);
+
   return (
     <div>
       <OverlayTrigger
@@ -94,7 +115,7 @@ export const DateRangeInput = ({
                 moveRangeOnFirstSelection={false}
                 ranges={state}
                 months={months}
-                direction="horizontal"
+                direction={direction}
               />
               <div className="mt-3 d-flex justify-content-end">
                 <Button onClick={onReset} variant="link">

package/src/styles/resources-blocking/_index.scss

@@ -106,6 +106,12 @@
     align-items: center;
     gap: 0.25rem;
     margin-bottom: 0.5rem;
+
+    @include media-breakpoint-down(sm) {
+      justify-content: center;
+      flex-wrap: wrap;
+    }
+
   }
 
   .text-input.form-group {

package/src/styles/sales/BookingFilter.scss

@@ -157,6 +157,19 @@
         margin-bottom: 0;
       }
     }
+
+    .apply-container{
+      display: flex;
+      justify-content: space-around;
+      column-gap: 2rem;
+      margin-left: 3rem;
+
+      @include media-breakpoint-down(sm) {
+        flex-direction: row;
+        margin-left: 0rem;
+        column-gap: 1rem;
+      }
+    }
   }
 
   .additional-filter-container {
@@ -175,8 +188,12 @@
       }
     }
 
-    @include media-breakpoint-between(md, lg) {
-      flex-wrap: nowrap;
+    @include media-breakpoint-down(xl) {
+      flex-wrap: wrap;
+
+      .apply-container {
+        margin-left: 4rem;
+      }
 
       .date-container {
         width: auto;
@@ -230,6 +247,11 @@
           transform: rotate(45deg);
         }
       }
+
+      @include media-breakpoint-down(sm) {
+        flex-direction: column;
+        justify-content: flex-start;
+      }
     }
   }
 }

package/src/styles/sales/BookingTabs.scss

@@ -1,24 +1,49 @@
 .booking-tabs-pane {
   display: flex;
   flex-direction: row;
+  justify-content: space-between;
   align-items: center;
   height: 2.75rem;
   background-color: $white;
 
   .booking-tabs {
     svg {
-      g > rect:first-child {
-        fill: $white; 
+      g>rect:first-child {
+        fill: $white;
       }
     }
-    
+
     .active {
       svg {
-        g > rect:first-child {
-          fill: $blue; 
+        g>rect:first-child {
+          fill: $blue;
         }
       }
     }
+
+    @include media-breakpoint-down(sm) {
+      width: 4rem;
+    }
+  }
+
+  .content {
+    display: flex;
+    justify-content: space-between;
+    width: 85%;
+    flex-direction: row;
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      height: 4rem;
+    }
+
+    .booking {
+      @include media-breakpoint-down(sm) {
+        height: 13rem;
+      }
+    }
   }
 
   .separator {
@@ -29,6 +54,12 @@
   .children {
     flex: 1;
     margin-left: 1rem;
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+    }
   }
 
   .buttons {
@@ -61,6 +92,33 @@
         border-radius: 0.625rem;
         margin-right: 0.5rem;
       }
+      @include media-breakpoint-down(sm) {
+        width: 12.5rem;
+      }
+  
+    }
+
+    @include media-breakpoint-down(sm) {
+      display: flex;
+      flex-direction: column;
+      align-items: start;
+      gap: .5rem;
+      margin-top: .5rem;
+      white-space: nowrap;
+    }
+  }
+
+  @include media-breakpoint-down(sm) {
+    display: flex;
+    align-items: start;
+    gap: 1rem;
+    margin-top: 1rem;
+    height: 100%;
+  }
+
+  .booking {
+    @include media-breakpoint-down(sm) {
+      height: 13rem;
     }
   }
 }

package/src/styles/sales/LifeTimeSales.scss

@@ -33,6 +33,7 @@
   }
 
   @include media-breakpoint-down(sm) {
+    height: 12rem;
     &__value {
       line-height: 1rem;
       font-size: 2rem;

package/src/styles/sales/ManualBooking.scss

@@ -361,10 +361,11 @@
   width: inherit;
 
   @include media-breakpoint-down(sm) {
-    padding: 0 0.5rem;
-    padding-top: 2rem;
+    display: none;
   }
 
+
+
   .form-control {
     margin-bottom: 1.5rem;
   }
@@ -411,6 +412,64 @@
   }
 }
 
+.manual-booking-summary-mobile {
+  display: none;
+
+  @include media-breakpoint-down(sm) {
+    display: block;
+    padding: 0 1.5rem;
+    padding-top: 2rem;
+    height: max-content;
+    margin-bottom: 1.5rem;
+    width: inherit;
+
+    .form-control {
+      margin-bottom: .5rem;
+    }
+    .receipt-title {
+      font-size: 1.125rem;
+      font-weight: 600;
+      padding-bottom: 0.4rem;
+      margin-bottom: 1rem;
+      border-bottom: 2px solid $gray-400;
+    }
+    .event-name {
+      font-size: 0.94rem;
+      font-weight: 600;
+    }
+
+    .border-summary-item {
+      padding-bottom: 0.9rem;
+      margin-bottom: 1%;
+      border-bottom: 2px solid $gray-100;
+      flex-wrap: wrap;
+    }
+
+    .total-container {
+      display: flex;
+      justify-content: space-between;
+      font-size: 1rem;
+      font-weight: 600;
+
+      @include media-breakpoint-down(lg) {
+        flex-wrap: wrap;
+      }
+      .total-amount {
+        padding-left: 1rem;
+        @include media-breakpoint-down(lg) {
+          padding-left: 0;
+        }
+      }
+    }
+
+    .summary-item-container {
+      .border-summary-item:nth-last-child(2) {
+        border-bottom: 2px solid $gray-400;
+      }
+    }
+  }
+}
+
 .menu-list-manual-booking {
   display: flex;
   align-items: center;
@@ -437,4 +496,4 @@
       color: $blue;
     }
   }
-}
+}

package/src/styles/sales/SourceOfSales.scss

@@ -13,6 +13,9 @@
 
   &__pie-chart {
     height: 100%;
+    @include media-breakpoint-down(sm) {
+      height: 12rem;
+    }
   }
 
   .colors-0 {

package/src/styles/snippet-templates/SnippetTemplateCard.scss

@@ -28,12 +28,13 @@ $snippet-template-card-button-transition: $product-set-card-transition !default;
   border: 1px solid #ccc;
   border-radius: $border-radius;
   height: 10rem;
-  width: 15rem;
+  min-width: 15rem;
   padding: 1rem;
 
   @include media-breakpoint-down(sm) {
     height: 100%;
     max-height: 10rem;
+    width: 100%;
   }
 
   p {
@@ -109,4 +110,4 @@ $snippet-template-card-button-transition: $product-set-card-transition !default;
   &:hover {
     border: 2px solid $blue;
   }
-}
+}

package/src/styles/static/Tabs.scss

@@ -11,6 +11,12 @@ $tab-nav-link-active-border-bottom: 1px solid $tab-nav-link-active-color !defaul
   margin-left: -1.25rem;
   border-bottom: 1px solid $nav-tabs-border-color;
 
+  @include media-breakpoint-down(sm) {
+    display: flex;
+    flex-direction: column;
+    white-space: nowrap;
+  }
+
   .nav-link {
     color: $tab-nav-link-color;
     background-color: transparent;

package/src/styles/themes/bookedit/_index.scss

@@ -98,7 +98,8 @@
       color: gray("600");
 
       &.sortable {
-        &::before, &::after {
+        &::before,
+        &::after {
           opacity: 1;
         }
 
@@ -132,20 +133,20 @@
     width: 2.5rem;
     height: 2.5rem;
     background-color: transparent;
-  
+
     svg {
       margin-bottom: 2.5px;
     }
 
     &:hover {
       cursor: pointer;
-      border-radius: .5rem;
+      border-radius: 0.5rem;
       background-color: lighten($primary, 40);
     }
   }
 
   .page-item {
-    margin-left: .4rem;
+    margin-left: 0.4rem;
     min-width: 15px;
     width: 2.5rem;
     height: 2.5rem;
@@ -153,7 +154,7 @@
     .page-link {
       border: 0;
       padding: 0;
-      border-radius: .5rem;
+      border-radius: 0.5rem;
       height: 100%;
       display: flex;
       align-items: center;
@@ -162,13 +163,13 @@
       color: $black;
       font-weight: 600;
       font-size: 0.875rem;
-      
+
       &:hover {
-        border-radius: .5rem;
+        border-radius: 0.5rem;
         background-color: lighten($primary, 40);
       }
     }
-    
+
     &.active {
       .page-link {
         border: 2px solid $primary;

package/src/styles/themes/bookedit/_variables.scss

@@ -197,6 +197,7 @@ $grid-breakpoints: (
   md: 768px,
   lg: 992px,
   xl: 1200px,
+  xxl: 1500px,
 ) !default;
 
 @include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
@@ -211,6 +212,7 @@ $container-max-widths: (
   md: 720px,
   lg: 960px,
   xl: 1140px,
+  xxl: 1500px,
 ) !default;
 
 @include _assert-ascending($container-max-widths, "$container-max-widths");