diff --git a/client/dist/js/bundle.js b/client/dist/js/bundle.js index 1637478f..5f414b99 100644 --- a/client/dist/js/bundle.js +++ b/client/dist/js/bundle.js @@ -1 +1,8452 @@ -!function(){"use strict";var e={2038:function(e,t,n){var r=a(n(4121)),o=a(n(1240));function a(e){return e&&e.__esModule?e:{default:e}}window.document.addEventListener("DOMContentLoaded",(()=>{(0,r.default)(),(0,o.default)()}))},4121:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=y(n(5207)),o=y(n(584)),a=y(n(7105)),l=y(n(6721)),i=y(n(2512)),s=y(n(5563)),d=y(n(5297)),u=y(n(7651)),c=y(n(1305)),f=y(n(7660)),p=y(n(7333)),m=y(n(2382)),g=y(n(8953)),h=y(n(1950)),b=y(n(6573));function y(e){return e&&e.__esModule?e:{default:e}}t.default=()=>{r.default.component.registerMany({ElementEditor:l.default,ElementToolbar:s.default,ElementAddNewButton:d.default,ElementList:i.default,Element:o.default,ElementActions:a.default,ElementHeader:u.default,ElementContent:c.default,ElementSummary:f.default,ElementInlineEditForm:p.default,AddElementPopover:m.default,HoverBar:g.default,DragPositionIndicator:h.default,TextCheckboxGroupField:b.default})}},1240:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=c(n(5207)),o=c(n(2977)),a=c(n(3337)),l=c(n(4)),i=c(n(9283)),s=c(n(8501)),d=c(n(2221)),u=c(n(5904));function c(e){return e&&e.__esModule?e:{default:e}}t.default=()=>{r.default.transform("elemental-fieldgroup",(e=>{e.component("FieldGroup.HistoryViewer.VersionDetail",o.default,"HistoricElement")}),{after:"field-holders"}),r.default.transform("blocks-history-revert",(e=>{e.component("HistoryViewerToolbar.VersionedAdmin.HistoryViewer.Element.HistoryViewerVersionDetail",a.default,"BlockRevertRequest")})),r.default.transform("element-actions",(e=>{e.component("ElementActions",s.default,"ElementActionsWithSave"),e.component("ElementActions",d.default,"ElementActionsWithPublish"),e.component("ElementActions",u.default,"ElementActionsWithUnpublish"),e.component("ElementActions",i.default,"ElementActionsWithDuplicate"),e.component("ElementActions",l.default,"ElementActionsWithArchive")}))}},26:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=s(n(1594)),o=s(n(6935)),a=s(n(6923)),l=n(3556),i=n(9791);function s(e){return e&&e.__esModule?e:{default:e}}const d=e=>{const{className:t,title:n,label:o}=e,i={className:(0,a.default)(t,"dropdown-item"),...e};return r.default.createElement(l.DropdownItem,i,o||n)};d.propTypes={disabled:o.default.bool,className:o.default.string,onClick:o.default.func,title:o.default.string,name:o.default.string,type:i.elementTypeType,active:o.default.bool,label:o.default.string},d.defaultProps={disabled:!1};t.default=d},4:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=f(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=c(n(26)),a=c(n(5815)),l=n(6721),i=c(n(5609)),s=c(n(6177)),d=n(1135),u=c(n(4014));function c(e){return e&&e.__esModule?e:{default:e}}function f(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(f=function(e){return e?n:t})(e)}const p=e=>t=>{const{fetchElements:n}=(0,r.useContext)(l.ElementEditorContext),c=void 0!==t.element.canDelete&&!t.element.canDelete,f=a.default._t("ElementArchiveAction.ARCHIVE","Archive"),p={label:f,title:c?a.default._t("ElementArchiveAction.ARCHIVE_PERMISSION_DENY","Archive, insufficient permissions"):f,disabled:c,className:"element-editor__actions-archive",onClick:e=>{e.stopPropagation();const r=t.element.isPublished;let o=a.default._t("ElementArchiveAction.CONFIRM_DELETE","Are you sure you want to send this block to the archive?");if(r&&(o=a.default._t("ElementArchiveAction.CONFIRM_DELETE_AND_UNPUBLISH","Warning: This block will be unpublished before being sent to the archive. Are you sure you want to proceed?")),!window.confirm(o))return;const l=t.element.id,c=`${(0,d.getConfig)().controllerLink.replace(/\/$/,"")}/api/delete`;i.default.post(c,{id:l},{"X-SecurityID":s.default.get("SecurityID")}).then((()=>n())).catch((async e=>{const t=await(0,u.default)(e);window.jQuery.noticeAdd({text:t,stay:!0,type:"error"})}))},toggle:t.toggle};return r.default.createElement(e,t,t.children,r.default.createElement(o.default,p))};t.Component=p;t.default=p},9283:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=f(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=c(n(26)),a=c(n(5815)),l=n(6721),i=c(n(5609)),s=c(n(6177)),d=n(1135),u=c(n(4014));function c(e){return e&&e.__esModule?e:{default:e}}function f(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(f=function(e){return e?n:t})(e)}const p=e=>t=>{const{fetchElements:n}=(0,r.useContext)(l.ElementEditorContext);if(t.type.broken)return r.default.createElement(e,t);const c=void 0!==t.element.canCreate&&!t.element.canCreate,f=a.default._t("ElementArchiveAction.DUPLICATE","Duplicate"),p={label:f,title:c?a.default._t("ElementArchiveAction.DUPLICATE_PERMISSION_DENY","Duplicate, insufficient permissions"):f,disabled:c,className:"element-editor__actions-duplicate",onClick:e=>{e.stopPropagation();const r=t.element.id,o=`${(0,d.getConfig)().controllerLink.replace(/\/$/,"")}/api/duplicate`;i.default.post(o,{id:r},{"X-SecurityID":s.default.get("SecurityID")}).then((()=>n())).catch((async e=>{const t=await(0,u.default)(e);window.jQuery.noticeAdd({text:t,stay:!0,type:"error"})}))},toggle:t.toggle};return r.default.createElement(e,t,t.children,r.default.createElement(o.default,p))};t.Component=p;t.default=p},2221:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=i(n(26)),a=i(n(5815)),l=n(584);function i(e){return e&&e.__esModule?e:{default:e}}function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}const d=e=>t=>{const{formDirty:n,onPublishButtonClick:i}=(0,r.useContext)(l.ElementContext),{element:s}=t,d=void 0!==t.element.canPublish&&!t.element.canPublish,u=a.default._t("ElementArchiveAction.PUBLISH","Publish"),c={label:u,title:d?a.default._t("ElementArchiveAction.PUBLISH_PERMISSION_DENY","Publish, insufficient permissions"):u,disabled:d,className:"element-editor__actions-publish",onClick:e=>{e.stopPropagation(),i()},toggle:t.toggle};return t.type.broken?r.default.createElement(e,t):r.default.createElement(e,t,t.children,(n||!s.isLiveVersion)&&r.default.createElement(o.default,c))};t.Component=d;t.default=d},8501:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=i(n(26)),a=i(n(5815)),l=n(584);function i(e){return e&&e.__esModule?e:{default:e}}function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}const d=e=>t=>{const{onSaveButtonClick:n,formDirty:i}=(0,r.useContext)(l.ElementContext),s={title:a.default._t("ElementSaveAction.SAVE","Save"),className:"element-editor__actions-save",onClick:e=>{e.stopPropagation(),n()},toggle:t.toggle};return!t.expandable||t.type.broken?r.default.createElement(e,t):r.default.createElement(e,t,t.children,i&&r.default.createElement(o.default,s))};t.Component=d;t.default=d},5904:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=c(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=u(n(26)),a=u(n(5815)),l=u(n(5609)),i=n(6721),s=u(n(6177)),d=n(1135);function u(e){return e&&e.__esModule?e:{default:e}}function c(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(c=function(e){return e?n:t})(e)}const f=e=>t=>{const{fetchElements:n}=(0,r.useContext)(i.ElementEditorContext);if(t.type.broken)return r.default.createElement(e,t);const u=(e,t,n)=>{const r=a.default.inject(a.default._t("ElementHeader.NOTITLE","Untitled {type} block"),{type:e}),o=a.default.inject(a.default._t("ElementUnpublishAction.SUCCESS_NOTIFICATION","Removed '{title}' from the published page"),{title:t||r}),l=a.default.inject(a.default._t("ElementUnpublishAction.ERROR_NOTIFICATION","Error unpublishing '{title}'"),{title:t||r});window.jQuery.noticeAdd({text:n?o:l,stay:!1,type:n?"success":"error"})},c=void 0!==t.element.canUnpublish&&!t.element.canUnpublish,f=a.default._t("ElementArchiveAction.UNPUBLISH","Unpublish"),p={label:f,title:c?a.default._t("ElementArchiveAction.UNPUBLISH_PERMISSION_DENY","Unpublish, insufficient permissions"):f,disabled:c,className:"element-editor__actions-unpublish",onClick:e=>{e.stopPropagation(),(()=>{const e=t.element.id,r=`${(0,d.getConfig)().controllerLink.replace(/\/$/,"")}/api/unpublish`;l.default.post(r,{id:e},{"X-SecurityID":s.default.get("SecurityID")}).then((()=>n())).then((()=>u(t.type.title,t.element.title,!0))).catch((()=>u(t.type.title,t.element.title,!1)))})()},toggle:t.toggle};return r.default.createElement(e,t,t.children,t.element.isPublished&&r.default.createElement(o.default,p))};t.Component=f;t.default=f},2382:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=y(n(1594)),o=h(n(6935)),a=n(9040),l=n(9367),i=h(n(6923)),s=y(n(8918)),d=n(5207),u=n(9791),c=h(n(5815)),f=h(n(5609)),p=h(n(6177)),m=n(6721),g=h(n(4014));function h(e){return e&&e.__esModule?e:{default:e}}function b(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(b=function(e){return e?n:t})(e)}function y(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=b(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}class v extends r.Component{constructor(e){super(e),this.handleToggle=this.handleToggle.bind(this),v.contextType=m.ElementEditorContext}getElementButtonClickHandler(e){return t=>{t.preventDefault();const n=`${p.default.getSection("DNADesign\\Elemental\\Controllers\\ElementalAreaController").controllerLink}/api/create`;f.default.post(n,{elementClass:e.class,elementalAreaID:this.props.areaId,insertAfterElementID:this.props.insertAfterElement},{"X-SecurityID":p.default.get("SecurityID")}).then((()=>{const{fetchElements:e}=this.context;return e()})).then((()=>{const e=window.jQuery(".cms-preview");e.entwine("ss.preview")._loadUrl(e.find("iframe").attr("src"))})).catch((async e=>{const t=await(0,g.default)(e);this.props.actions.toasts.error(t)})),this.handleToggle()}}handleToggle(){const{toggle:e}=this.props;e()}render(){const{PopoverOptionSetComponent:e,elementTypes:t,container:n,extraClass:o,isOpen:a,placement:l,target:s}=this.props,d=(0,i.default)("element-editor-add-element",o),u=t.map((e=>({content:e.title,key:e.name,className:(0,i.default)(e.icon,"btn--icon-xl","element-editor-add-element__button"),onClick:this.getElementButtonClickHandler(e)})));return r.default.createElement(e,{buttons:u,searchPlaceholder:c.default._t("ElementAddElementPopover.SEARCH_BLOCKS","Search blocks"),extraClass:d,container:n,isOpen:a,placement:l,target:s,toggle:this.handleToggle})}}t.Component=v,v.propTypes={container:o.default.oneOfType([o.default.string,o.default.func,o.default.object]),elementTypes:o.default.arrayOf(u.elementTypeType).isRequired,extraClass:o.default.oneOfType([o.default.string,o.default.array,o.default.object]),isOpen:o.default.bool.isRequired,placement:o.default.string,target:o.default.oneOfType([o.default.string,o.default.func,o.default.object]).isRequired,toggle:o.default.func.isRequired,areaId:o.default.number.isRequired,insertAfterElement:o.default.oneOfType([o.default.number,o.default.string])};const E=(0,d.inject)(["PopoverOptionSet"],(e=>({PopoverOptionSetComponent:e})),(()=>"ElementEditor"))(v);t.default=(0,l.compose)((0,a.connect)(null,(function(e){return{actions:{toasts:(0,l.bindActionCreators)(s,e)}}})))(E)},5297:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=u(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=d(n(6935)),a=n(3556),l=d(n(5815)),i=n(9791),s=n(5207);function d(e){return e&&e.__esModule?e:{default:e}}function u(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(u=function(e){return e?n:t})(e)}class c extends r.Component{constructor(e){super(e),this.toggle=this.toggle.bind(this),this.state={popoverOpen:!1}}toggle(){this.setState((e=>({popoverOpen:!e.popoverOpen})))}render(){const{AddElementPopoverComponent:e,elementTypes:t,areaId:n}=this.props,o={id:`ElementalArea${n}_AddButton`,color:"primary",onClick:this.toggle,className:"font-icon-plus"};return r.default.createElement("div",null,r.default.createElement(a.Button,o,l.default._t("ElementAddNewButton.ADD_BLOCK","Add block")),r.default.createElement(e,{placement:"bottom-start",target:o.id,isOpen:this.state.popoverOpen,elementTypes:t,toggle:this.toggle,areaId:n,insertAfterElement:0}))}}t.Component=c,c.defaultProps={},c.propTypes={elementTypes:o.default.arrayOf(i.elementTypeType).isRequired,areaId:o.default.number.isRequired};t.default=(0,s.inject)(["AddElementPopover"],(e=>({AddElementPopoverComponent:e})),(()=>"ElementEditor.ElementList.AddNewButton"))(c)},1305:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r,o=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),a=(r=n(6935))&&r.__esModule?r:{default:r},l=n(5207),i=n(9367);function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}class d extends o.PureComponent{render(){const{id:e,fileUrl:t,fileTitle:n,content:r,previewExpanded:a,InlineEditFormComponent:l,SummaryComponent:i,activeTab:s,onFormInit:d,handleLoadingError:u,formDirty:c,broken:f,onFormSchemaSubmitResponse:p,ensureFormRendered:m,formHasRendered:g}=this.props,h=!a&&(m||g),b={"element-editor-editform--collapsed":!a,"element-editor-editform--rendered-not-visible":h};return o.default.createElement("div",{className:"element-editor-content"},!a&&o.default.createElement(i,{content:r,fileUrl:t,fileTitle:n,broken:f}),(a||m||g)&&o.default.createElement(l,{extraClass:b,onClick:e=>e.stopPropagation(),elementId:e,activeTab:s,onFormInit:d,handleLoadingError:u,onFormSchemaSubmitResponse:p,notVisible:h}),c&&o.default.createElement("input",{type:"hidden",name:"change-tracker",className:"element-form-dirty-state",value:"1"}))}}t.Component=d,d.propTypes={id:a.default.number,content:a.default.string,fileUrl:a.default.string,fileTitle:a.default.string,previewExpanded:a.default.bool,SummaryComponent:a.default.elementType,InlineEditFormComponent:a.default.elementType,handleLoadingError:a.default.func,broken:a.default.bool,onFormSchemaSubmitResponse:a.default.func,onFormInit:a.default.func,ensureFormRendered:a.default.bool,formHasRendered:a.default.bool,formDirty:a.default.object},d.defaultProps={};t.default=(0,i.compose)((0,l.inject)(["ElementSummary","ElementInlineEditForm"],((e,t)=>({SummaryComponent:e,InlineEditFormComponent:t})),(()=>"ElementEditor.ElementList.Element")))(d)},1950:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=o(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},a=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in e)if("default"!==l&&{}.hasOwnProperty.call(e,l)){var i=a?Object.getOwnPropertyDescriptor(e,l):null;i&&(i.get||i.set)?Object.defineProperty(r,l,i):r[l]=e[l]}return r.default=e,n&&n.set(e,r),r}(n(1594));function o(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(o=function(e){return e?n:t})(e)}class a extends r.PureComponent{render(){return r.default.createElement("div",{className:"elemental-editor-drag-indicator"},r.default.createElement("div",{className:"elemental-editor-drag-indicator__ball"}))}}t.default=a},584:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.ElementContext=t.Component=void 0;var r=S(n(1594)),o=C(n(6935)),a=n(455),l=n(9791),i=n(9367),s=n(5207),d=C(n(5815)),u=C(n(6923)),c=n(9040),f=n(5381),p=n(2153),m=n(7785),g=S(n(5034)),h=n(1820),b=n(8724),y=n(9306),v=S(n(8918)),E=n(9077),_=n(6721),O=n(1135),D=C(n(5609)),T=C(n(6177));function C(e){return e&&e.__esModule?e:{default:e}}function P(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(P=function(e){return e?n:t})(e)}function S(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=P(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}const k=t.ElementContext=(0,r.createContext)(null),w=e=>{const[t,n]=(0,r.useState)(!1),[o,a]=(0,r.useState)(""),[l,i]=(0,r.useState)(!1),[s,c]=(0,r.useState)(e.element.title),[f,p]=(0,r.useState)(!1),[m,g]=(0,r.useState)(!1),[h,y]=(0,r.useState)(!1),[v,E]=(0,r.useState)(!1),[C,P]=(0,r.useState)(!1),[S,w]=(0,r.useState)(!1),[I,j]=(0,r.useState)(!1),[M,A]=(0,r.useState)(!1),{fetchElements:R}=(0,r.useContext)(_.ElementEditorContext);(0,r.useEffect)((()=>{void 0!==e.formDirty&&!M&&A(!0)}),[e.formDirty]),(0,r.useEffect)((()=>{e.onChangeHasUnsavedChanges(M)}),[M]),(0,r.useEffect)((()=>{e.saveElement&&M&&!m&&g(!0)}),[e.saveElement,M,e.increment]),(0,r.useEffect)((()=>{e.connectDragPreview&&e.connectDragPreview((0,b.getEmptyImage)(),{captureDraggingState:!0})}),[]),(0,r.useEffect)((()=>{f&&S&&(p(!1),M?(e.submitForm(),E(!0)):y(!0))}),[f,S]),(0,r.useEffect)((()=>{I&&(j(!1),e.dispatchAddFormChanged())}),[I]);const x=()=>d.default.inject(d.default._t("ElementHeader.NOTITLE","Untitled {type} block"),{type:e.type.title}),N=t=>{(t=>{const n=s||x();if(t){const t=d.default.inject(d.default._t("ElementPublishAction.ERROR_NOTIFICATION","Error publishing '{title}'"),{title:n});e.actions.toasts.error(t)}else{const t=d.default.inject(d.default._t("ElementPublishAction.SUCCESS_NOTIFICATION","Published '{title}' successfully"),{title:n});e.actions.toasts.success(t)}})(t),y(!1),E(!1),R().then((()=>{setTimeout((()=>e.dispatchRemoveFormChanged()),250)}))};(0,r.useEffect)((()=>{S&&m&&(e.submitForm(),g(!1))}),[S,m]),(0,r.useEffect)((()=>{if(S&&h){const t=`${(0,O.getConfig)().controllerLink.replace(/\/$/,"")}/api/publish`;D.default.post(t,{id:e.element.id},{"X-SecurityID":T.default.get("SecurityID")}).then((()=>N(!1))).catch((()=>N(!0)))}}),[S,h]);const B=t=>{const{tabSetName:n,onActivateTab:r}=e;if(o||a(t),t||o)r(n,t||o);else{r(n,"Main")}},L=r=>{const{type:o,link:a}=e;o.broken||("button"!==r.target.type?!o.inlineEditable||l?window.location=a:n(!t):r.stopPropagation())},{element:W,type:F,areaId:U,HeaderComponent:H,ContentComponent:$,link:q,activeTab:V,connectDragSource:K,connectDropTarget:X,isDragging:Q,isOver:Y,onDragEnd:G,formDirty:J}=e;if(!W.id)return null;const z=(0,u.default)("element-editor__element",{"element-editor__element--broken":F.broken,"element-editor__element--expandable":F.inlineEditable&&!F.broken,"element-editor__element--dragging":Q,"element-editor__element--dragged-over":Y},(()=>{const{element:t}=e,n="element-editor__element";return t.isPublished?t.isPublished&&!t.isLiveVersion?`${n}--modified`:`${n}--published`:`${n}--draft`})()),Z={formDirty:J,onPublishButtonClick:()=>{p(!0),P(!0)},onSaveButtonClick:()=>{P(!0),g(!0)}},ee=X(r.default.createElement("div",{className:z,onClick:L,onKeyUp:e=>{const{nodeName:t}=e.target;" "!==e.key&&"Enter"!==e.key||["input","textarea"].includes(t.toLowerCase())||L(e)},role:"button",tabIndex:0,title:(e=>e.broken?d.default._t("ElementalElement.ARCHIVE_BROKEN","Archive this block"):d.default.inject(d.default._t("ElementalElement.TITLE","Edit this {type} block"),{type:e.title}))(F),key:W.id},r.default.createElement(k.Provider,{value:Z},r.default.createElement(H,{element:W,type:F,areaId:U,expandable:F.inlineEditable,link:q,previewExpanded:t,handleEditTabsClick:t=>{const{activeTab:r}=e;t===r||l||(n(!0),B(t))},activeTab:V,disableTooltip:Q,onDragEnd:G}),r.default.createElement($,{id:W.id,fileUrl:W.blockSchema.fileURL,fileTitle:W.blockSchema.fileTitle,content:((e,t)=>t.broken?e.title?d.default.inject(d.default._t("ElementalElement.BROKEN_DESCRIPTION_TITLE",'This block had the title "{title}". It is broken and will not display on the front-end. You can archive it to remove it from this elemental area.'),{title:e.title}):d.default._t("ElementalElement.BROKEN_DESCRIPTION","This block is broken and will not display on the front-end. You can archive it to remove it from this elemental area."):e.blockSchema.content)(W,F),previewExpanded:t&&!Q,ensureFormRendered:C,formHasRendered:S,activeTab:V,handleLoadingError:()=>{i(!0)},broken:F.broken,onFormSchemaSubmitResponse:(t,r)=>{if(t.id.match(/\/schema\/elemental-area\/([0-9]+)/))return e.type.inlineEditable&&n(!0),j(!0),v&&E(!1),void e.onAfterSubmitResponse(!1);A(!1),c(r),v&&(E(!1),y(!0)),h||v||(t=>{const n=t||x(),r=d.default.inject(d.default._t("ElementSaveAction.SUCCESS_NOTIFICATION","Saved '{title}' successfully"),{title:n});e.actions.toasts.success(r)})(r),e.onAfterSubmitResponse(!0),R()},onFormInit:()=>(e=>{B(e),w(!0)})(V)}))));return t?ee:K(ee)};t.Component=w,w.propTypes={element:a.elementType,type:l.elementTypeType.isRequired,areaId:o.default.number.isRequired,link:o.default.string.isRequired,activeTab:o.default.string,tabSetName:o.default.string,onActivateTab:o.default.func,connectDragSource:o.default.func.isRequired,connectDragPreview:o.default.func.isRequired,connectDropTarget:o.default.func.isRequired,isDragging:o.default.bool.isRequired,isOver:o.default.bool.isRequired,onDragOver:o.default.func,onDragEnd:o.default.func,onDragStart:o.default.func,saveElement:o.default.bool.isRequired,onBeforeSubmitForm:o.default.func.isRequired,onAfterSubmitResponse:o.default.func.isRequired,increment:o.default.number.isRequired},w.defaultProps={element:null};const I={drop(e,t,n){const{element:r}=e;return{target:r.id,dropSpot:(0,y.isOverTop)(t,n)?"top":"bottom"}},hover(e,t,n){const{element:r,onDragOver:o}=e;o&&o(r,(0,y.isOverTop)(t,n))}};t.default=(0,i.compose)((0,h.DropTarget)("element",I,((e,t)=>({connectDropTarget:e.dropTarget(),isOver:t.isOver()}))),(0,h.DragSource)("element",y.elementDragSource,((e,t)=>({connectDragSource:e.dragSource(),connectDragPreview:e.dragPreview(),isDragging:t.isDragging()}))),(0,c.connect)((function(e,t){const n=t.element.id,r=(0,p.loadElementFormStateName)(n),o=(0,m.loadElementSchemaValue)("schemaUrl",n),a=e.form&&e.form.formSchemas[o]&&e.form.formSchemas[o].schema&&e.form.formSchemas[o].schema.fields.find((e=>"Tabs"===e.component)),l=a&&a.id,i=`element.${r}__${l}`,s=e.unsavedForms.find((e=>e.name===`element.${r}`));return{tabSetName:l,activeTab:e.tabs&&e.tabs.fields&&e.tabs.fields[i]&&e.tabs.fields[i].activeTab,formDirty:s}}),(function(e,t){const n=(0,p.loadElementFormStateName)(t.element.id);return{onActivateTab(t,r){e(g.activateTab(`element.${n}__${t}`,r))},submitForm(){t.onBeforeSubmitForm(t.element.id),e((0,f.submit)(`element.${n}`))},dispatchAddFormChanged(){e((0,E.addFormChanged)(`element.${n}`))},dispatchRemoveFormChanged(){e((0,E.removeFormChanged)(`element.${n}`))},actions:{toasts:(0,i.bindActionCreators)(v,e)}}})),(0,s.inject)(["ElementHeader","ElementContent"],((e,t)=>({HeaderComponent:e,ContentComponent:t})),(()=>"ElementEditor.ElementList.Element")))(w)},7105:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=f(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=c(n(6935)),a=n(9367),l=n(3556),i=n(5207),s=n(455),d=n(9791),u=c(n(26));function c(e){return e&&e.__esModule?e:{default:e}}function f(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(f=function(e){return e?n:t})(e)}class p extends r.Component{constructor(e){super(e),this.handleEditTabsClick=this.handleEditTabsClick.bind(this)}handleEditTabsClick(e){const{handleEditTabsClick:t}=this.props;t(e.target.name)}renderEditTabs(){const{editTabs:e,activeTab:t,type:n,expandable:o}=this.props;return!n.broken&&o&&e&&e.length?e.map((e=>{let{name:o,title:a}=e;return r.default.createElement(u.default,{key:o,name:o,title:a,type:n,onClick:this.handleEditTabsClick,active:o===t})})):null}renderDivider(){const{children:e,editTabs:t,expandable:n}=this.props;return n&&t&&t.length&&0!==r.default.Children.count(e)?r.default.createElement(l.DropdownItem,{divider:!0,role:"separator"}):null}render(){const{children:e,id:t,ActionMenuComponent:n}=this.props;return r.default.createElement(n,{id:`element-editor-actions-${t}`,className:"element-editor-header__actions-dropdown",dropdownMenuProps:{right:!0},dropdownToggleClassNames:["element-editor-header__actions-toggle","btn","btn-sm","btn--no-text","font-icon-dot-3"]},this.renderEditTabs(),this.renderDivider(),e)}}t.Component=p,p.propTypes={element:s.elementType,type:d.elementTypeType.isRequired,areaId:o.default.number.isRequired,activeTab:o.default.string,editTabs:o.default.arrayOf(o.default.shape({title:o.default.string,name:o.default.string})),handleEditTabsClick:o.default.func.isRequired,expandable:o.default.bool},p.defaultProps={editTabs:[],expandable:!0};t.default=(0,a.compose)((0,i.inject)(["ActionMenu"],(e=>({ActionMenuComponent:e})),(()=>"ElementEditor.ElementList.Element")))(p)},920:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=c(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=u(n(6935)),a=u(n(7651)),l=n(1820),i=n(455),s=n(9791),d=n(1135);function u(e){return e&&e.__esModule?e:{default:e}}function c(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(c=function(e){return e?n:t})(e)}class f extends r.Component{render(){const{isDragging:e,element:t,elementTypes:n,currentOffset:o}=this.props;if(!e||!o)return null;const{x:l,y:i}=o,s=`translate(${l}px, ${i}px)`,u={transform:s,WebkitTransform:s},c=(0,d.getElementTypeConfig)(t,n);return r.default.createElement("div",{className:"element-editor-drag-preview",style:u},r.default.createElement(a.default,{element:t,type:c,simple:!0}))}}f.propTypes={element:i.elementType,elementTypes:o.default.arrayOf(s.elementTypeType),isDragging:o.default.bool,currentOffset:o.default.shape({x:o.default.number.isRequired,y:o.default.number.isRequired})};t.default=(0,l.DragLayer)((e=>({element:e.getItem(),currentOffset:e.getSourceClientOffset(),isDragging:e.isDragging()})))(f)},6721:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.ElementEditorContext=t.Component=void 0;var r=v(n(1594)),o=b(n(6935)),a=n(9040),l=n(5207),i=n(9367),s=n(9791),d=n(1820),u=b(n(920)),c=b(n(5799)),f=b(n(5609)),p=b(n(6177)),m=n(1135),g=v(n(8918)),h=b(n(4014));function b(e){return e&&e.__esModule?e:{default:e}}function y(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(y=function(e){return e?n:t})(e)}function v(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=y(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}const E=t.ElementEditorContext=(0,r.createContext)(null);class _ extends r.PureComponent{constructor(e){super(e),this.state={dragTargetElementId:null,dragSpot:null,elements:null,isLoading:!0},this.handleDragOver=this.handleDragOver.bind(this),this.handleDragEnd=this.handleDragEnd.bind(this),this.fetchElements=this.fetchElements.bind(this)}handleDragOver(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;const n=!!e&&e.id;this.setState({dragTargetElementId:n,dragSpot:!1===t?"bottom":"top"})}handleDragEnd(e,t){const n=`${(0,m.getConfig)().controllerLink.replace(/\/$/,"")}/api/sort`;f.default.post(n,{id:e,afterBlockID:t},{"X-SecurityID":p.default.get("SecurityID")}).then((()=>this.fetchElements())).catch((async e=>{const t=await(0,h.default)(e);this.props.actions.toasts.error(t)})),this.setState({dragTargetElementId:null,dragSpot:null})}fetchElements(){(!(arguments.length>0&&void 0!==arguments[0])||arguments[0])&&this.setState((e=>({...e,isLoading:!0})));const e=`${(0,m.getConfig)().controllerLink.replace(/\/$/,"")}/api/readElements/${this.props.areaId}`;return f.default.get(e).then((async e=>{const t=await e.json();this.setState((e=>({...e,elements:t,isLoading:!1})));const n=window.jQuery(".cms-preview");n&&n.entwine("ss.preview")._loadUrl(n.find("iframe").attr("src"))})).catch((async e=>{this.setState({elements:[],isLoading:!1});const t=await(0,h.default)(e);this.props.actions.toasts.error(t)}))}render(){const{ToolbarComponent:e,ListComponent:t,areaId:n,elementTypes:o,isDraggingOver:a,connectDropTarget:l,allowedElements:i,sharedObject:s,isLoading:d}=this.props,{dragTargetElementId:c,dragSpot:f,elements:p}=this.state;if(null===p)return this.fetchElements(!1),null;const m=i.map((e=>o.find((t=>t.class===e)))),g={fetchElements:this.fetchElements};return l(r.default.createElement("div",{className:"element-editor"},r.default.createElement(E.Provider,{value:g},r.default.createElement(e,{elementTypes:m,areaId:n,onDragOver:this.handleDragOver}),r.default.createElement(t,{allowedElementTypes:m,elementTypes:o,areaId:n,onDragOver:this.handleDragOver,onDragStart:this.handleDragStart,onDragEnd:this.handleDragEnd,dragSpot:f,isDraggingOver:a,dragTargetElementId:c,sharedObject:s,elements:p,isLoading:d}),r.default.createElement(u.default,{elementTypes:o}))))}}t.Component=_,_.propTypes={elementTypes:o.default.arrayOf(s.elementTypeType).isRequired,allowedElements:o.default.arrayOf(o.default.string).isRequired,areaId:o.default.number.isRequired,actions:o.default.shape({handleSortBlock:o.default.func})};const O=[c.default,(0,d.DropTarget)("element",{},((e,t)=>({connectDropTarget:e.dropTarget(),isDraggingOver:t.isOver()}))),(0,l.inject)(["ElementToolbar","ElementList"],((e,t)=>({ToolbarComponent:e,ListComponent:t})),(()=>"ElementEditor"))];t.default=(0,i.compose)((0,a.connect)(null,(function(e){return{actions:{toasts:(0,i.bindActionCreators)(g,e)}}})),...O)(_)},2512:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=g(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=m(n(6935)),a=n(455),l=n(9791),i=n(9367),s=n(5207),d=m(n(6923)),u=m(n(5815)),c=n(1820),f=n(9306),p=n(1135);function m(e){return e&&e.__esModule?e:{default:e}}function g(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(g=function(e){return e?n:t})(e)}class h extends r.Component{constructor(e){super(e),this.resetState=this.resetState.bind(this),this.handleBeforeSubmitForm=this.handleBeforeSubmitForm.bind(this),this.handleAfterSubmitResponse=this.handleAfterSubmitResponse.bind(this),this.state={saveAllElements:!1,increment:0,hasUnsavedChangesBlockIDs:{},validBlockIDs:{}},this.props.sharedObject.setState=this.setState.bind(this)}componentDidMount(){this.resetState({},!0)}componentDidUpdate(e,t){if(this.props.elements)if(this.props.elements===e.elements){if(this.state.saveAllElements){const e=this.props.elements.map((e=>parseInt(e.id,10))).filter((e=>this.state.hasUnsavedChangesBlockIDs[e]));let n=!0;for(let t=0;tthis.state.validBlockIDs[e])),r={success:n,reason:n?"":"invalid"};this.props.sharedObject.entwineResolve(r),this.resetState(t,n),this.setState({saveAllElements:!1})}}}else this.resetState(t,!1)}resetState(e,t){const n={},r={};(this.props.elements||[]).forEach((o=>{const a=parseInt(o.id,10);t?n[a]=!1:e.hasUnsavedChangesBlockIDs.hasOwnProperty(a)?n[a]=e.hasUnsavedChangesBlockIDs[a]:n[a]=!1,r[a]=null})),this.setState({hasUnsavedChangesBlockIDs:n,validBlockIDs:r})}handleChangeHasUnsavedChanges(e,t){this.setState((n=>({hasUnsavedChangesBlockIDs:{...n.hasUnsavedChangesBlockIDs,[e]:t}})))}handleBeforeSubmitForm(e){this.setState((t=>({validBlockIDs:{...t.validBlockIDs,[e]:null}})))}handleAfterSubmitResponse(e,t){this.setState((n=>({hasUnsavedChangesBlockIDs:{...n.hasUnsavedChangesBlockIDs,[e]:!t},validBlockIDs:{...n.validBlockIDs,[e]:t}})))}getDragIndicatorIndex(){const{dragTargetElementId:e,draggedItem:t,elements:n,dragSpot:r}=this.props;return(0,f.getDragIndicatorIndex)(n.map((e=>e.id)),e,t&&t.id,r)}renderBlocks(){const{ElementComponent:e,HoverBarComponent:t,DragIndicatorComponent:n,elements:o,allowedElementTypes:a,elementTypes:l,areaId:i,onDragEnd:s,onDragOver:d,onDragStart:c,isDraggingOver:f}=this.props;if(0===o.length)return r.default.createElement("div",null,u.default._t("ElementList.ADD_BLOCKS","Add blocks to place your content"));let m=o.map((n=>{const o=this.state.saveAllElements&&this.state.hasUnsavedChangesBlockIDs[n.id]&&null===this.state.validBlockIDs[n.id];return r.default.createElement("div",{key:n.id},r.default.createElement(e,{element:n,areaId:i,type:(0,p.getElementTypeConfig)(n,l),link:n.blockSchema.actions.edit,onDragOver:d,onDragEnd:s,onDragStart:c,saveElement:o,onChangeHasUnsavedChanges:e=>this.handleChangeHasUnsavedChanges(n.id,e),onBeforeSubmitForm:()=>this.handleBeforeSubmitForm(n.id),onAfterSubmitResponse:e=>this.handleAfterSubmitResponse(n.id,e),increment:this.state.increment}),f||r.default.createElement(t,{key:`create-after-${n.id}`,areaId:i,elementId:n.id,elementTypes:a}))}));f||(m=[r.default.createElement(t,{key:0,areaId:i,elementId:0,elementTypes:a})].concat(m));const g=this.getDragIndicatorIndex();return f&&null!==g&&m.splice(g,0,r.default.createElement(n,{key:"DropIndicator"})),m}renderLoading(){const{isLoading:e,LoadingComponent:t}=this.props;return e?r.default.createElement(t,null):null}render(){const{elements:e}=this.props,t=(0,d.default)("elemental-editor-list",{"elemental-editor-list--empty":!e||!e.length});return this.props.connectDropTarget(r.default.createElement("div",{className:t},this.renderLoading(),this.renderBlocks()))}}t.Component=h,h.propTypes={elements:o.default.arrayOf(a.elementType).isRequired,elementTypes:o.default.arrayOf(l.elementTypeType).isRequired,allowedElementTypes:o.default.arrayOf(l.elementTypeType).isRequired,areaId:o.default.number.isRequired,dragTargetElementId:o.default.oneOfType([o.default.number,o.default.bool]),onDragOver:o.default.func,onDragStart:o.default.func,onDragEnd:o.default.func,sharedObject:o.default.object.isRequired},h.defaultProps={sharedObject:{entwineResolve:()=>{},setState:null},elements:[],isLoading:!1};const b={drop(e,t){const{elements:n}=e,r=t.getDropResult();if(!r)return{};const o=(0,f.getDragIndicatorIndex)(n.map((e=>e.id)),r.target,t.getItem(),r.dropSpot),a=n[o-1]?n[o-1].id:"0";return{...r,dropAfterID:a}}};t.default=(0,i.compose)((0,c.DropTarget)("element",b,((e,t)=>({connectDropTarget:e.dropTarget(),draggedItem:t.getItem()}))),(0,s.inject)(["Element","Loading","HoverBar","DragPositionIndicator"],((e,t,n,r)=>({ElementComponent:e,LoadingComponent:t,HoverBarComponent:n,DragIndicatorComponent:r})),(()=>"ElementEditor.ElementList")))(h)},7651:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=h(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=g(n(6935)),a=n(3556),l=n(455),i=n(9791),s=n(9367),d=n(5207),u=g(n(5815)),c=g(n(6923)),f=n(1820),p=n(9306),m=n(8724);function g(e){return e&&e.__esModule?e:{default:e}}function h(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(h=function(e){return e?n:t})(e)}class b extends r.Component{constructor(e){super(e),this.toggle=this.toggle.bind(this),this.state={tooltipOpen:!1}}componentDidMount(){const{connectDragPreview:e}=this.props;e&&e((0,m.getEmptyImage)(),{captureDraggingState:!0})}componentDidUpdate(){const{tooltipOpen:e}=this.state,{disableTooltip:t}=this.props;e&&t&&this.setState({tooltipOpen:!1})}getBlockTitle(e,t){return t.broken?u.default.inject(u.default._t("ElementHeader.BROKEN","This element is of obsolete type {type}."),{type:t.obsoleteClassName}):e.title?e.title:u.default.inject(u.default._t("ElementHeader.NOTITLE","Untitled {type} block"),{type:t.title})}toggle(){this.setState((e=>({tooltipOpen:!e.tooltipOpen})))}renderVersionedStateMessage(){const{element:{isLiveVersion:e,isPublished:t}}=this.props;if(t&&e)return null;let n="";const o=["element-editor-header__version-state"];return t?e||(n=u.default._t("ElementHeader.STATE_MODIFIED","Item has unpublished changes"),o.push("element-editor-header__version-state--modified")):(n=u.default._t("ElementHeader.STATE_DRAFT","Item has not been published yet"),o.push("element-editor-header__version-state--draft")),r.default.createElement("span",{className:(0,c.default)(o),title:n})}renderStatusFlagBadges(){const e=this.props.element.statusFlags;if(!e)return null;const t=[];for(let[n,o]of Object.entries(e))n=`badge status-${n}`,"string"==typeof o&&(o={text:o}),o.title||(o.title=""),t.push(r.default.createElement("span",{key:n,className:n,title:o.title},o.text));return t}render(){const{connectDragSource:e,element:t,type:n,areaId:o,previewExpanded:l,simple:i,disableTooltip:s,activeTab:d,expandable:f,ElementActionsComponent:p,handleEditTabsClick:m}=this.props,g=this.getBlockTitle(t,n),h=(0,c.default)({"element-editor-header__title":!0,"element-editor-header__title--none":!t.title}),b=u.default._t("ElementHeader.EXPAND","Show editable fields"),y=(0,c.default)("element-editor-header",{"element-editor-header--simple":i}),v=(0,c.default)("element-editor-header__icon-container",{"element-editor-header__icon-container--broken":n.broken}),E=(0,c.default)("element-editor-header__expand",{"font-icon-right-open-big":!f,"font-icon-up-open-big":f&&l,"font-icon-down-open-big":f&&!l}),_=`element-icon-${t.id}`,O=r.default.createElement("div",{className:y},r.default.createElement("div",{className:"element-editor-header__drag-handle"},r.default.createElement("i",{className:"font-icon-drag-handle"})),r.default.createElement("div",{className:"element-editor-header__info"},r.default.createElement("div",{className:v},r.default.createElement("i",{className:n.icon,id:_}),this.renderVersionedStateMessage(),!n.broken&&!i&&r.default.createElement(a.Tooltip,{placement:"top",isOpen:this.state.tooltipOpen&&!s,target:_,toggle:this.toggle},n.title)),r.default.createElement("h3",{className:h},g),this.renderStatusFlagBadges()),!i&&r.default.createElement("div",{className:"element-editor-header__actions"},r.default.createElement("div",{role:"none",onClick:e=>e.stopPropagation()},r.default.createElement(p,{element:t,type:n,areaId:o,activeTab:d,editTabs:n.editTabs,handleEditTabsClick:m,expandable:f})),!n.broken&&r.default.createElement("i",{className:E,title:b})));return l?e(O):O}}t.Component=b,b.propTypes={element:l.elementType.isRequired,type:i.elementTypeType.isRequired,areaId:o.default.number,activeTab:o.default.string,simple:o.default.bool,ElementActionsComponent:o.default.elementType,previewExpanded:o.default.bool,disableTooltip:o.default.bool,connectDragSource:o.default.func.isRequired,connectDragPreview:o.default.func.isRequired,onDragEnd:o.default.func},b.defaultProps={expandable:!0};t.default=(0,s.compose)((0,f.DragSource)("element",p.elementDragSource,(e=>({connectDragSource:e.dragSource(),connectDragPreview:e.dragPreview()}))),(0,d.inject)(["ElementActions"],(e=>({ElementActionsComponent:e})),(()=>"ElementEditor.ElementList.Element")))(b)},8953:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=t.Component=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=d(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=s(n(6935)),a=n(5207),l=n(9791),i=s(n(5815));function s(e){return e&&e.__esModule?e:{default:e}}function d(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(d=function(e){return e?n:t})(e)}const u=(0,s(n(7577)).default)("element-editor__hover-bar");function c(e){let{AddElementPopoverComponent:t,elementTypes:n,elementId:o,areaId:a,popoverOpen:l,onToggle:s}=e;const d=`${u("-line")} font-icon-plus-circled`,c=i.default._t("ElementAddNewButton.ADD_BLOCK","Add block"),f={className:u("-area",{"-area--focus":l}),onClick:s,"aria-label":c,title:c,id:`AddBlockHoverBarArea_${a}_${o}`};return r.default.createElement("div",{className:u(""),id:`AddBlockHoverBar_${a}_${o}`},r.default.createElement("button",f,r.default.createElement("span",{className:u("-area-inner")},r.default.createElement("span",{className:d}))),r.default.createElement(t,{placement:"bottom",target:`AddBlockHoverBarArea_${a}_${o}`,isOpen:l,elementTypes:n,toggle:s,container:`#AddBlockHoverBar_${a}_${o}`,areaId:a,insertAfterElement:o}))}class f extends r.Component{constructor(e){super(e),this.toggle=this.toggle.bind(this),this.state={popoverOpen:!1}}toggle(){this.setState((e=>({popoverOpen:!e.popoverOpen})))}render(){const e={...this.state,...this.props,onToggle:this.toggle};return r.default.createElement(c,e)}}t.Component=f,f.propTypes={elementTypes:o.default.arrayOf(l.elementTypeType).isRequired,elementId:o.default.oneOfType([o.default.string,o.default.number]).isRequired,areaId:o.default.oneOfType([o.default.number,o.default.string]).isRequired};t.default=(0,a.inject)(["AddElementPopover"],(e=>({AddElementPopoverComponent:e})),(()=>"ElementEditor.ElementList.HoverBar"))(f)},7333:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=f(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=c(n(6935)),a=c(n(6923)),l=c(n(55)),i=n(7785),s=c(n(5815)),d=n(2153),u=n(9040);function c(e){return e&&e.__esModule?e:{default:e}}function f(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(f=function(e){return e?n:t})(e)}function p(){return p=Object.assign?Object.assign.bind():function(e){for(var t=1;t{t.match(/PageElements_[0-9]+_Title/)&&(r=e[t])})),n().then((e=>this.props.onFormSchemaSubmitResponse(e,r)))}render(){const{elementId:e,extraClass:t,onClick:n,onFormInit:o,formHasState:s,notVisible:d}=this.props,{loadingError:u}=this.state,c=(0,a.default)("element-editor-editform",t),f={formTag:"form",schemaUrl:(0,i.loadElementSchemaValue)("schemaUrl",e),identifier:"element",refetchSchemaOnMount:!s,onLoadingError:this.handleLoadingError,onSubmit:this.handleSubmit};u&&(f.loading=!1),"function"==typeof o&&(f.onReduxFormInit=o);const m={};return d&&(m["aria-hidden"]="true"),r.default.createElement("div",p({className:c,onClick:n,role:"presentation"},m),r.default.createElement(l.default,f))}}m.propTypes={extraClass:o.default.oneOfType([o.default.string,o.default.object]),onClick:o.default.func,elementId:o.default.string,handleLoadingError:o.default.func,onFormSchemaSubmitResponse:o.default.func,notVisible:o.default.bool};t.default=(0,u.connect)((function(e,t){const n=(0,d.loadElementFormStateName)(t.elementId);return{formHasState:e.form.formState&&e.form.formState.element&&!!e.form.formState.element[n]}}))(m)},7660:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=s(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),o=i(n(6935)),a=i(n(6923)),l=i(n(5815));function i(e){return e&&e.__esModule?e:{default:e}}function s(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(s=function(e){return e?n:t})(e)}class d extends r.PureComponent{render(){const{fileUrl:e,fileTitle:t,content:n,broken:o}=this.props,i=l.default._t("ElementSummary.NO_PREVIEW","No preview available"),s=(0,a.default)("element-editor-summary__content",{"element-editor-summary__content--broken":o});return r.default.createElement("div",{className:"element-editor-summary"},e&&r.default.createElement("img",{className:"element-editor-summary__thumbnail-image",src:e,alt:t}),(n||!e)&&r.default.createElement("p",{className:s},n||i))}}d.defaultProps={},d.propTypes={content:o.default.string,fileUrl:o.default.string,fileTitle:o.default.string,broken:o.default.bool};t.default=d},5563:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r,o=function(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};var n=d(t);if(n&&n.has(e))return n.get(e);var r={__proto__:null},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var a in e)if("default"!==a&&{}.hasOwnProperty.call(e,a)){var l=o?Object.getOwnPropertyDescriptor(e,a):null;l&&(l.get||l.set)?Object.defineProperty(r,a,l):r[a]=e[a]}return r.default=e,n&&n.set(e,r),r}(n(1594)),a=(r=n(6935))&&r.__esModule?r:{default:r},l=n(5207),i=n(9791),s=n(1820);function d(e){if("function"!=typeof WeakMap)return null;var t=new WeakMap,n=new WeakMap;return(d=function(e){return e?n:t})(e)}class u extends o.PureComponent{render(){const{AddNewButtonComponent:e,elementTypes:t,areaId:n,connectDropTarget:r}=this.props;return r(o.default.createElement("div",{className:"element-editor__toolbar"},o.default.createElement(e,{elementTypes:t,areaId:n})))}}u.defaultProps={},u.propTypes={elementTypes:a.default.arrayOf(i.elementTypeType).isRequired,areaId:a.default.number.isRequired,AddNewButtonComponent:a.default.elementType.isRequired,connectDropTarget:a.default.func.isRequired,onDragOver:a.default.func,onDragDrop:a.default.func};const c={hover(e){const{onDragOver:t}=e;t&&t()}};t.default=(0,s.DropTarget)("element",c,(e=>({connectDropTarget:e.dropTarget()})))((0,l.inject)(["ElementAddNewButton"],(e=>({AddNewButtonComponent:e})),(()=>"ElementEditor.ElementToolbar"))(u))},2977:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=l(n(1594)),o=l(n(5815)),a=l(n(6923));function l(e){return e&&e.__esModule?e:{default:e}}t.default=e=>class extends e{getClassName(){const e=[super.getClassName()];return this.props.data.ElementID&&e.unshift("elemental-area__element--historic-inner"),(0,a.default)(e)}render(){const e=this.getLegend(),t=this.props.data.tag||"div",n=this.getClassName(),{data:a}=this.props;return a.ElementID?r.default.createElement(t,{className:n},e,r.default.createElement("div",{className:"elemental-preview elemental-preview--historic"},a.ElementEditLink&&r.default.createElement("a",{className:"elemental-preview__link",href:a.ElementEditLink},r.default.createElement("span",{className:"elemental-preview__link-text"},o.default._t("HistoricElementView.VIEW_BLOCK_HISTORY","Block history")),r.default.createElement("i",{className:"font-icon-angle-right btn--icon-lg elemental-preview__link-caret"})),r.default.createElement("div",{className:"elemental-preview__icon"},r.default.createElement("i",{className:a.ElementIcon})),r.default.createElement("div",{className:"elemental-preview__detail"},r.default.createElement("h3",null,a.ElementTitle," ",r.default.createElement("small",null,a.ElementType)))),this.props.children):super.render()}}},6573:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=l(n(1594)),o=n(3556),a=l(n(2623));function l(e){return e&&e.__esModule?e:{default:e}}t.default=(0,a.default)((e=>{const{children:t}=e,n=r.default.Children.toArray(r.default.Children.map(t,((t,n)=>{const o={};return 0===n?(o.id=e.id,o.title=null):1===n&&(o.noHolder=!0),r.default.cloneElement(t,o)})));return e.readOnly?r.default.createElement("div",{className:"text-checkbox-group-field--read-only"},n):1===n.length?n[0]:r.default.createElement(o.InputGroup,{className:"text-checkbox-group-field"},n[0],r.default.createElement(o.InputGroupAddon,{addonType:"append"},r.default.createElement(o.InputGroupText,null,n[1])))}))},51:function(e,t,n){var r=d(n(1669)),o=d(n(1594)),a=n(5145),l=n(5207),i=n(1135),s=n(5381);function d(e){return e&&e.__esModule?e:{default:e}}const u=()=>{setTimeout((()=>{const{store:e}=window.ss;e&&e.dispatch((0,s.destroy)(...Object.keys(e.getState().form.formState.element||{}).map((e=>`element.${e}`))))}),0)};r.default.entwine("ss",(e=>{e(".js-injector-boot .element-editor__container").entwine({ReactRoot:null,AreaIDsSharedObject:{},Increment:0,onmatch(){const e=(0,l.loadComponent)("ElementEditor",{}),t=this.data("schema"),n=(0,i.getConfig)().elementTypes,r=t["elemental-area-id"],s=this.getAreaIDsSharedObject();s.hasOwnProperty(r)||(s[r]={entwineResolve:null,setState:null});const d={areaId:r,allowedElements:t["allowed-elements"],elementTypes:n,sharedObject:s[r]};let u=this.getReactRoot();u||(u=(0,a.createRoot)(this[0]),this.setReactRoot(u)),u.render(o.default.createElement(e,d))},onunmatch(){e(".cms-edit-form").data("hasValidationErrors")||u(),this.unmountComponent()},unmountComponent(){const e=this.getReactRoot();e&&(e.unmount(),this.setReactRoot(null))},"from .cms-edit-form":{onbeforesubmitform(e,t){if(!t||this.is(".elemental-area--read-only"))return;let n;const r=new Promise((e=>{n=e}));t.promises.push(r),t.onAjaxSuccessCallbacks.push(this.unmountComponent.bind(this));const o=this.data("schema")["elemental-area-id"],a=this.getAreaIDsSharedObject()[o],l=this.getIncrement()+1;this.setIncrement(l),a.entwineResolve=n,a.setState({saveAllElements:!0,increment:l})},onaftersubmitform(t,n){const r=JSON.parse(n.xhr.responseText).ValidationResult;JSON.parse(r.replace(/<\/?script[^>]*?>/g,"")).isValid?(e(".cms-edit-form").data("hasValidationErrors",!1),u()):e(".cms-edit-form").data("hasValidationErrors",!0)}}}),e(".js-injector-boot .element-editor__container .element-form-dirty-state").entwine({onmatch(){e(".cms-edit-form").trigger("change")},onunmatch(){e(".cms-edit-form").trigger("change")}}),e(".cms-edit-form").entwine({getChangeTrackerOptions(){const t=void 0===this.entwineData("ChangeTrackerOptions");let n=this._super();return t&&(n=e.extend({},n),n.ignoreFieldSelector+=", .elementalarea :input:not(.element-form-dirty-state)",this.setChangeTrackerOptions(n)),n}})}))},9306:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.isOverTop=t.getDragIndicatorIndex=t.elementDragSource=void 0;var r=n(4518);t.isOverTop=(e,t)=>{const n=e.getClientOffset(),o=(0,r.findDOMNode)(t).getBoundingClientRect();return n.y{if(null===t||!n)return null;let o=t?e.findIndex((e=>e===t)):0;const a=e.findIndex((e=>e===n));return"bottom"===r&&(o+=1),a===o||a+1===o?null:o};t.elementDragSource={beginDrag(e){return e.element},endDrag(e,t){const{onDragEnd:n}=e,r=t.getDropResult();if(!n||!r||!r.dropAfterID)return;const o=t.getItem().id,{dropAfterID:a}=r;o!==a&&n(o,a)}}},7577:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r,o=(r=n(6923))&&r.__esModule?r:{default:r};t.default=e=>function(){const t=t=>`${e}${t}`;for(var n=arguments.length,r=new Array(n),a=0;a!(!e&&""!==e)&&("object"==typeof e?Array.isArray(e)?e.map(t):Object.entries(e).reduce(((e,n)=>{let[r,o]=n;return Object.assign({},e,{[t(r)]:o})}),{}):t(e))));return(0,o.default)(...l)}},1135:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.getElementTypeConfig=t.getConfig=void 0;var r,o=(r=n(6177))&&r.__esModule?r:{default:r};const a=()=>o.default.getSection("DNADesign\\Elemental\\Controllers\\ElementalAreaController");t.getConfig=a;t.getElementTypeConfig=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;const n=e.blockSchema.typeName;let r=(Array.isArray(t)?t:a().elementTypes).find((e=>e.class===n||e.name===n));return e.obsoleteClassName&&(r=Object.assign({obsoleteClassName:e.obsoleteClassName},r),Object.preventExtensions(r)),r}},2153:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.loadElementFormStateName=void 0;var r,o=(r=n(6177))&&r.__esModule?r:{default:r};t.loadElementFormStateName=function(){let e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;const t=o.default.getSection("DNADesign\\Elemental\\Controllers\\ElementalAreaController").form.elementForm.formNameTemplate;return e?t.replace("{id}",e):t}},7785:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.loadElementSchemaValue=void 0;var r,o=(r=n(6177))&&r.__esModule?r:{default:r};t.loadElementSchemaValue=function(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;const n=o.default.getSection("DNADesign\\Elemental\\Controllers\\ElementalAreaController").form.elementForm[e]||"";return t?`${n}/${t}`:n}},3337:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.default=void 0;var r=i(n(1594)),o=i(n(5609)),a=n(1135),l=i(n(6177));function i(e){return e&&e.__esModule?e:{default:e}}t.default=e=>t=>{const n={...t};return n.hasOwnProperty("actions")||(n.actions={}),n.actions.revertToVersion=(e,t,n,r)=>{const i=`${(0,a.getConfig)().controllerLink.replace(/\/$/,"")}/api/revert`;return o.default.post(i,{id:e,fromVersion:t,fromStage:n,toStage:r},{"X-SecurityID":l.default.get("SecurityID")})},r.default.createElement(e,n)}},455:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.elementType=void 0;var r,o=(r=n(6935))&&r.__esModule?r:{default:r};t.elementType=o.default.shape({id:o.default.number,title:o.default.string,blockSchema:o.default.object,inlineEditable:o.default.bool,published:o.default.bool,liveVersion:o.default.bool,version:o.default.number})},9791:function(e,t,n){Object.defineProperty(t,"__esModule",{value:!0}),t.elementTypeType=void 0;var r,o=(r=n(6935))&&r.__esModule?r:{default:r};t.elementTypeType=o.default.shape({name:o.default.string,title:o.default.string,icon:o.default.string,inlineEditable:o.default.bool,editTabs:o.default.arrayOf(o.default.shape({title:o.default.string,name:o.default.string})),config:o.default.object})},5609:function(e){e.exports=Backend},6177:function(e){e.exports=Config},2623:function(e){e.exports=FieldHolder},55:function(e){e.exports=FormBuilderLoader},5207:function(e){e.exports=Injector},6935:function(e){e.exports=PropTypes},1594:function(e){e.exports=React},1820:function(e){e.exports=ReactDND},8724:function(e){e.exports=ReactDNDHtml5Backend},4518:function(e){e.exports=ReactDom},5145:function(e){e.exports=ReactDomClient},9040:function(e){e.exports=ReactRedux},3556:function(e){e.exports=Reactstrap},9367:function(e){e.exports=Redux},5381:function(e){e.exports=ReduxForm},5034:function(e){e.exports=TabsActions},8918:function(e){e.exports=ToastsActions},9077:function(e){e.exports=UnsavedFormsActions},6923:function(e){e.exports=classnames},4014:function(e){e.exports=getJsonErrorMessage},5815:function(e){e.exports=i18n},1669:function(e){e.exports=jQuery},5799:function(e){e.exports=withDragDropContext}},t={};function n(r){var o=t[r];if(void 0!==o)return o.exports;var a=t[r]={exports:{}};return e[r](a,a.exports,n),a.exports}n(51),n(2038)}(); \ No newline at end of file +/******/ (function() { // webpackBootstrap +/******/ "use strict"; +/******/ var __webpack_modules__ = ({ + +/***/ "./node_modules/@dnd-kit/accessibility/dist/accessibility.esm.js": +/*!***********************************************************************!*\ + !*** ./node_modules/@dnd-kit/accessibility/dist/accessibility.esm.js ***! + \***********************************************************************/ +/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { + +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ HiddenText: function() { return /* binding */ HiddenText; }, +/* harmony export */ LiveRegion: function() { return /* binding */ LiveRegion; }, +/* harmony export */ useAnnouncement: function() { return /* binding */ useAnnouncement; } +/* harmony export */ }); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); + + +const hiddenStyles = { + display: 'none' +}; +function HiddenText(_ref) { + let { + id, + value + } = _ref; + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { + id: id, + style: hiddenStyles + }, value); +} + +function LiveRegion(_ref) { + let { + id, + announcement, + ariaLiveType = "assertive" + } = _ref; + // Hide element visually but keep it readable by screen readers + const visuallyHidden = { + position: 'fixed', + top: 0, + left: 0, + width: 1, + height: 1, + margin: -1, + border: 0, + padding: 0, + overflow: 'hidden', + clip: 'rect(0 0 0 0)', + clipPath: 'inset(100%)', + whiteSpace: 'nowrap' + }; + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", { + id: id, + style: visuallyHidden, + role: "status", + "aria-live": ariaLiveType, + "aria-atomic": true + }, announcement); +} + +function useAnnouncement() { + const [announcement, setAnnouncement] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''); + const announce = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(value => { + if (value != null) { + setAnnouncement(value); + } + }, []); + return { + announce, + announcement + }; +} + + +//# sourceMappingURL=accessibility.esm.js.map + + +/***/ }), + +/***/ "./node_modules/@dnd-kit/core/dist/core.esm.js": +/*!*****************************************************!*\ + !*** ./node_modules/@dnd-kit/core/dist/core.esm.js ***! + \*****************************************************/ +/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { + +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ AutoScrollActivator: function() { return /* binding */ AutoScrollActivator; }, +/* harmony export */ DndContext: function() { return /* binding */ DndContext; }, +/* harmony export */ DragOverlay: function() { return /* binding */ DragOverlay; }, +/* harmony export */ KeyboardCode: function() { return /* binding */ KeyboardCode; }, +/* harmony export */ KeyboardSensor: function() { return /* binding */ KeyboardSensor; }, +/* harmony export */ MeasuringFrequency: function() { return /* binding */ MeasuringFrequency; }, +/* harmony export */ MeasuringStrategy: function() { return /* binding */ MeasuringStrategy; }, +/* harmony export */ MouseSensor: function() { return /* binding */ MouseSensor; }, +/* harmony export */ PointerSensor: function() { return /* binding */ PointerSensor; }, +/* harmony export */ TouchSensor: function() { return /* binding */ TouchSensor; }, +/* harmony export */ TraversalOrder: function() { return /* binding */ TraversalOrder; }, +/* harmony export */ applyModifiers: function() { return /* binding */ applyModifiers; }, +/* harmony export */ closestCenter: function() { return /* binding */ closestCenter; }, +/* harmony export */ closestCorners: function() { return /* binding */ closestCorners; }, +/* harmony export */ defaultAnnouncements: function() { return /* binding */ defaultAnnouncements; }, +/* harmony export */ defaultCoordinates: function() { return /* binding */ defaultCoordinates; }, +/* harmony export */ defaultDropAnimation: function() { return /* binding */ defaultDropAnimationConfiguration; }, +/* harmony export */ defaultDropAnimationSideEffects: function() { return /* binding */ defaultDropAnimationSideEffects; }, +/* harmony export */ defaultKeyboardCoordinateGetter: function() { return /* binding */ defaultKeyboardCoordinateGetter; }, +/* harmony export */ defaultScreenReaderInstructions: function() { return /* binding */ defaultScreenReaderInstructions; }, +/* harmony export */ getClientRect: function() { return /* binding */ getClientRect; }, +/* harmony export */ getFirstCollision: function() { return /* binding */ getFirstCollision; }, +/* harmony export */ getScrollableAncestors: function() { return /* binding */ getScrollableAncestors; }, +/* harmony export */ pointerWithin: function() { return /* binding */ pointerWithin; }, +/* harmony export */ rectIntersection: function() { return /* binding */ rectIntersection; }, +/* harmony export */ useDndContext: function() { return /* binding */ useDndContext; }, +/* harmony export */ useDndMonitor: function() { return /* binding */ useDndMonitor; }, +/* harmony export */ useDraggable: function() { return /* binding */ useDraggable; }, +/* harmony export */ useDroppable: function() { return /* binding */ useDroppable; }, +/* harmony export */ useSensor: function() { return /* binding */ useSensor; }, +/* harmony export */ useSensors: function() { return /* binding */ useSensors; } +/* harmony export */ }); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); +/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "react-dom"); +/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react_dom__WEBPACK_IMPORTED_MODULE_1__); +/* harmony import */ var _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dnd-kit/utilities */ "./node_modules/@dnd-kit/utilities/dist/utilities.esm.js"); +/* harmony import */ var _dnd_kit_accessibility__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @dnd-kit/accessibility */ "./node_modules/@dnd-kit/accessibility/dist/accessibility.esm.js"); + + + + + +const DndMonitorContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)(null); + +function useDndMonitor(listener) { + const registerListener = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(DndMonitorContext); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (!registerListener) { + throw new Error('useDndMonitor must be used within a children of '); + } + + const unsubscribe = registerListener(listener); + return unsubscribe; + }, [listener, registerListener]); +} + +function useDndMonitorProvider() { + const [listeners] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(() => new Set()); + const registerListener = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(listener => { + listeners.add(listener); + return () => listeners.delete(listener); + }, [listeners]); + const dispatch = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(_ref => { + let { + type, + event + } = _ref; + listeners.forEach(listener => { + var _listener$type; + + return (_listener$type = listener[type]) == null ? void 0 : _listener$type.call(listener, event); + }); + }, [listeners]); + return [dispatch, registerListener]; +} + +const defaultScreenReaderInstructions = { + draggable: "\n To pick up a draggable item, press the space bar.\n While dragging, use the arrow keys to move the item.\n Press space again to drop the item in its new position, or press escape to cancel.\n " +}; +const defaultAnnouncements = { + onDragStart(_ref) { + let { + active + } = _ref; + return "Picked up draggable item " + active.id + "."; + }, + + onDragOver(_ref2) { + let { + active, + over + } = _ref2; + + if (over) { + return "Draggable item " + active.id + " was moved over droppable area " + over.id + "."; + } + + return "Draggable item " + active.id + " is no longer over a droppable area."; + }, + + onDragEnd(_ref3) { + let { + active, + over + } = _ref3; + + if (over) { + return "Draggable item " + active.id + " was dropped over droppable area " + over.id; + } + + return "Draggable item " + active.id + " was dropped."; + }, + + onDragCancel(_ref4) { + let { + active + } = _ref4; + return "Dragging was cancelled. Draggable item " + active.id + " was dropped."; + } + +}; + +function Accessibility(_ref) { + let { + announcements = defaultAnnouncements, + container, + hiddenTextDescribedById, + screenReaderInstructions = defaultScreenReaderInstructions + } = _ref; + const { + announce, + announcement + } = (0,_dnd_kit_accessibility__WEBPACK_IMPORTED_MODULE_3__.useAnnouncement)(); + const liveRegionId = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useUniqueId)("DndLiveRegion"); + const [mounted, setMounted] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + setMounted(true); + }, []); + useDndMonitor((0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + onDragStart(_ref2) { + let { + active + } = _ref2; + announce(announcements.onDragStart({ + active + })); + }, + + onDragMove(_ref3) { + let { + active, + over + } = _ref3; + + if (announcements.onDragMove) { + announce(announcements.onDragMove({ + active, + over + })); + } + }, + + onDragOver(_ref4) { + let { + active, + over + } = _ref4; + announce(announcements.onDragOver({ + active, + over + })); + }, + + onDragEnd(_ref5) { + let { + active, + over + } = _ref5; + announce(announcements.onDragEnd({ + active, + over + })); + }, + + onDragCancel(_ref6) { + let { + active, + over + } = _ref6; + announce(announcements.onDragCancel({ + active, + over + })); + } + + }), [announce, announcements])); + + if (!mounted) { + return null; + } + + const markup = react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dnd_kit_accessibility__WEBPACK_IMPORTED_MODULE_3__.HiddenText, { + id: hiddenTextDescribedById, + value: screenReaderInstructions.draggable + }), react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_dnd_kit_accessibility__WEBPACK_IMPORTED_MODULE_3__.LiveRegion, { + id: liveRegionId, + announcement: announcement + })); + return container ? (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)(markup, container) : markup; +} + +var Action; + +(function (Action) { + Action["DragStart"] = "dragStart"; + Action["DragMove"] = "dragMove"; + Action["DragEnd"] = "dragEnd"; + Action["DragCancel"] = "dragCancel"; + Action["DragOver"] = "dragOver"; + Action["RegisterDroppable"] = "registerDroppable"; + Action["SetDroppableDisabled"] = "setDroppableDisabled"; + Action["UnregisterDroppable"] = "unregisterDroppable"; +})(Action || (Action = {})); + +function noop() {} + +function useSensor(sensor, options) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + sensor, + options: options != null ? options : {} + }), // eslint-disable-next-line react-hooks/exhaustive-deps + [sensor, options]); +} + +function useSensors() { + for (var _len = arguments.length, sensors = new Array(_len), _key = 0; _key < _len; _key++) { + sensors[_key] = arguments[_key]; + } + + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => [...sensors].filter(sensor => sensor != null), // eslint-disable-next-line react-hooks/exhaustive-deps + [...sensors]); +} + +const defaultCoordinates = /*#__PURE__*/Object.freeze({ + x: 0, + y: 0 +}); + +/** + * Returns the distance between two points + */ +function distanceBetween(p1, p2) { + return Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2)); +} + +function getRelativeTransformOrigin(event, rect) { + const eventCoordinates = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getEventCoordinates)(event); + + if (!eventCoordinates) { + return '0 0'; + } + + const transformOrigin = { + x: (eventCoordinates.x - rect.left) / rect.width * 100, + y: (eventCoordinates.y - rect.top) / rect.height * 100 + }; + return transformOrigin.x + "% " + transformOrigin.y + "%"; +} + +/** + * Sort collisions from smallest to greatest value + */ +function sortCollisionsAsc(_ref, _ref2) { + let { + data: { + value: a + } + } = _ref; + let { + data: { + value: b + } + } = _ref2; + return a - b; +} +/** + * Sort collisions from greatest to smallest value + */ + +function sortCollisionsDesc(_ref3, _ref4) { + let { + data: { + value: a + } + } = _ref3; + let { + data: { + value: b + } + } = _ref4; + return b - a; +} +/** + * Returns the coordinates of the corners of a given rectangle: + * [TopLeft {x, y}, TopRight {x, y}, BottomLeft {x, y}, BottomRight {x, y}] + */ + +function cornersOfRectangle(_ref5) { + let { + left, + top, + height, + width + } = _ref5; + return [{ + x: left, + y: top + }, { + x: left + width, + y: top + }, { + x: left, + y: top + height + }, { + x: left + width, + y: top + height + }]; +} +function getFirstCollision(collisions, property) { + if (!collisions || collisions.length === 0) { + return null; + } + + const [firstCollision] = collisions; + return property ? firstCollision[property] : firstCollision; +} + +/** + * Returns the coordinates of the center of a given ClientRect + */ + +function centerOfRectangle(rect, left, top) { + if (left === void 0) { + left = rect.left; + } + + if (top === void 0) { + top = rect.top; + } + + return { + x: left + rect.width * 0.5, + y: top + rect.height * 0.5 + }; +} +/** + * Returns the closest rectangles from an array of rectangles to the center of a given + * rectangle. + */ + + +const closestCenter = _ref => { + let { + collisionRect, + droppableRects, + droppableContainers + } = _ref; + const centerRect = centerOfRectangle(collisionRect, collisionRect.left, collisionRect.top); + const collisions = []; + + for (const droppableContainer of droppableContainers) { + const { + id + } = droppableContainer; + const rect = droppableRects.get(id); + + if (rect) { + const distBetween = distanceBetween(centerOfRectangle(rect), centerRect); + collisions.push({ + id, + data: { + droppableContainer, + value: distBetween + } + }); + } + } + + return collisions.sort(sortCollisionsAsc); +}; + +/** + * Returns the closest rectangles from an array of rectangles to the corners of + * another rectangle. + */ + +const closestCorners = _ref => { + let { + collisionRect, + droppableRects, + droppableContainers + } = _ref; + const corners = cornersOfRectangle(collisionRect); + const collisions = []; + + for (const droppableContainer of droppableContainers) { + const { + id + } = droppableContainer; + const rect = droppableRects.get(id); + + if (rect) { + const rectCorners = cornersOfRectangle(rect); + const distances = corners.reduce((accumulator, corner, index) => { + return accumulator + distanceBetween(rectCorners[index], corner); + }, 0); + const effectiveDistance = Number((distances / 4).toFixed(4)); + collisions.push({ + id, + data: { + droppableContainer, + value: effectiveDistance + } + }); + } + } + + return collisions.sort(sortCollisionsAsc); +}; + +/** + * Returns the intersecting rectangle area between two rectangles + */ + +function getIntersectionRatio(entry, target) { + const top = Math.max(target.top, entry.top); + const left = Math.max(target.left, entry.left); + const right = Math.min(target.left + target.width, entry.left + entry.width); + const bottom = Math.min(target.top + target.height, entry.top + entry.height); + const width = right - left; + const height = bottom - top; + + if (left < right && top < bottom) { + const targetArea = target.width * target.height; + const entryArea = entry.width * entry.height; + const intersectionArea = width * height; + const intersectionRatio = intersectionArea / (targetArea + entryArea - intersectionArea); + return Number(intersectionRatio.toFixed(4)); + } // Rectangles do not overlap, or overlap has an area of zero (edge/corner overlap) + + + return 0; +} +/** + * Returns the rectangles that has the greatest intersection area with a given + * rectangle in an array of rectangles. + */ + +const rectIntersection = _ref => { + let { + collisionRect, + droppableRects, + droppableContainers + } = _ref; + const collisions = []; + + for (const droppableContainer of droppableContainers) { + const { + id + } = droppableContainer; + const rect = droppableRects.get(id); + + if (rect) { + const intersectionRatio = getIntersectionRatio(rect, collisionRect); + + if (intersectionRatio > 0) { + collisions.push({ + id, + data: { + droppableContainer, + value: intersectionRatio + } + }); + } + } + } + + return collisions.sort(sortCollisionsDesc); +}; + +/** + * Check if a given point is contained within a bounding rectangle + */ + +function isPointWithinRect(point, rect) { + const { + top, + left, + bottom, + right + } = rect; + return top <= point.y && point.y <= bottom && left <= point.x && point.x <= right; +} +/** + * Returns the rectangles that the pointer is hovering over + */ + + +const pointerWithin = _ref => { + let { + droppableContainers, + droppableRects, + pointerCoordinates + } = _ref; + + if (!pointerCoordinates) { + return []; + } + + const collisions = []; + + for (const droppableContainer of droppableContainers) { + const { + id + } = droppableContainer; + const rect = droppableRects.get(id); + + if (rect && isPointWithinRect(pointerCoordinates, rect)) { + /* There may be more than a single rectangle intersecting + * with the pointer coordinates. In order to sort the + * colliding rectangles, we measure the distance between + * the pointer and the corners of the intersecting rectangle + */ + const corners = cornersOfRectangle(rect); + const distances = corners.reduce((accumulator, corner) => { + return accumulator + distanceBetween(pointerCoordinates, corner); + }, 0); + const effectiveDistance = Number((distances / 4).toFixed(4)); + collisions.push({ + id, + data: { + droppableContainer, + value: effectiveDistance + } + }); + } + } + + return collisions.sort(sortCollisionsAsc); +}; + +function adjustScale(transform, rect1, rect2) { + return { ...transform, + scaleX: rect1 && rect2 ? rect1.width / rect2.width : 1, + scaleY: rect1 && rect2 ? rect1.height / rect2.height : 1 + }; +} + +function getRectDelta(rect1, rect2) { + return rect1 && rect2 ? { + x: rect1.left - rect2.left, + y: rect1.top - rect2.top + } : defaultCoordinates; +} + +function createRectAdjustmentFn(modifier) { + return function adjustClientRect(rect) { + for (var _len = arguments.length, adjustments = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + adjustments[_key - 1] = arguments[_key]; + } + + return adjustments.reduce((acc, adjustment) => ({ ...acc, + top: acc.top + modifier * adjustment.y, + bottom: acc.bottom + modifier * adjustment.y, + left: acc.left + modifier * adjustment.x, + right: acc.right + modifier * adjustment.x + }), { ...rect + }); + }; +} +const getAdjustedRect = /*#__PURE__*/createRectAdjustmentFn(1); + +function parseTransform(transform) { + if (transform.startsWith('matrix3d(')) { + const transformArray = transform.slice(9, -1).split(/, /); + return { + x: +transformArray[12], + y: +transformArray[13], + scaleX: +transformArray[0], + scaleY: +transformArray[5] + }; + } else if (transform.startsWith('matrix(')) { + const transformArray = transform.slice(7, -1).split(/, /); + return { + x: +transformArray[4], + y: +transformArray[5], + scaleX: +transformArray[0], + scaleY: +transformArray[3] + }; + } + + return null; +} + +function inverseTransform(rect, transform, transformOrigin) { + const parsedTransform = parseTransform(transform); + + if (!parsedTransform) { + return rect; + } + + const { + scaleX, + scaleY, + x: translateX, + y: translateY + } = parsedTransform; + const x = rect.left - translateX - (1 - scaleX) * parseFloat(transformOrigin); + const y = rect.top - translateY - (1 - scaleY) * parseFloat(transformOrigin.slice(transformOrigin.indexOf(' ') + 1)); + const w = scaleX ? rect.width / scaleX : rect.width; + const h = scaleY ? rect.height / scaleY : rect.height; + return { + width: w, + height: h, + top: y, + right: x + w, + bottom: y + h, + left: x + }; +} + +const defaultOptions = { + ignoreTransform: false +}; +/** + * Returns the bounding client rect of an element relative to the viewport. + */ + +function getClientRect(element, options) { + if (options === void 0) { + options = defaultOptions; + } + + let rect = element.getBoundingClientRect(); + + if (options.ignoreTransform) { + const { + transform, + transformOrigin + } = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(element).getComputedStyle(element); + + if (transform) { + rect = inverseTransform(rect, transform, transformOrigin); + } + } + + const { + top, + left, + width, + height, + bottom, + right + } = rect; + return { + top, + left, + width, + height, + bottom, + right + }; +} +/** + * Returns the bounding client rect of an element relative to the viewport. + * + * @remarks + * The ClientRect returned by this method does not take into account transforms + * applied to the element it measures. + * + */ + +function getTransformAgnosticClientRect(element) { + return getClientRect(element, { + ignoreTransform: true + }); +} + +function getWindowClientRect(element) { + const width = element.innerWidth; + const height = element.innerHeight; + return { + top: 0, + left: 0, + right: width, + bottom: height, + width, + height + }; +} + +function isFixed(node, computedStyle) { + if (computedStyle === void 0) { + computedStyle = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(node).getComputedStyle(node); + } + + return computedStyle.position === 'fixed'; +} + +function isScrollable(element, computedStyle) { + if (computedStyle === void 0) { + computedStyle = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(element).getComputedStyle(element); + } + + const overflowRegex = /(auto|scroll|overlay)/; + const properties = ['overflow', 'overflowX', 'overflowY']; + return properties.some(property => { + const value = computedStyle[property]; + return typeof value === 'string' ? overflowRegex.test(value) : false; + }); +} + +function getScrollableAncestors(element, limit) { + const scrollParents = []; + + function findScrollableAncestors(node) { + if (limit != null && scrollParents.length >= limit) { + return scrollParents; + } + + if (!node) { + return scrollParents; + } + + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isDocument)(node) && node.scrollingElement != null && !scrollParents.includes(node.scrollingElement)) { + scrollParents.push(node.scrollingElement); + return scrollParents; + } + + if (!(0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isHTMLElement)(node) || (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isSVGElement)(node)) { + return scrollParents; + } + + if (scrollParents.includes(node)) { + return scrollParents; + } + + const computedStyle = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(element).getComputedStyle(node); + + if (node !== element) { + if (isScrollable(node, computedStyle)) { + scrollParents.push(node); + } + } + + if (isFixed(node, computedStyle)) { + return scrollParents; + } + + return findScrollableAncestors(node.parentNode); + } + + if (!element) { + return scrollParents; + } + + return findScrollableAncestors(element); +} +function getFirstScrollableAncestor(node) { + const [firstScrollableAncestor] = getScrollableAncestors(node, 1); + return firstScrollableAncestor != null ? firstScrollableAncestor : null; +} + +function getScrollableElement(element) { + if (!_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.canUseDOM || !element) { + return null; + } + + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isWindow)(element)) { + return element; + } + + if (!(0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isNode)(element)) { + return null; + } + + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isDocument)(element) || element === (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(element).scrollingElement) { + return window; + } + + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isHTMLElement)(element)) { + return element; + } + + return null; +} + +function getScrollXCoordinate(element) { + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isWindow)(element)) { + return element.scrollX; + } + + return element.scrollLeft; +} +function getScrollYCoordinate(element) { + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isWindow)(element)) { + return element.scrollY; + } + + return element.scrollTop; +} +function getScrollCoordinates(element) { + return { + x: getScrollXCoordinate(element), + y: getScrollYCoordinate(element) + }; +} + +var Direction; + +(function (Direction) { + Direction[Direction["Forward"] = 1] = "Forward"; + Direction[Direction["Backward"] = -1] = "Backward"; +})(Direction || (Direction = {})); + +function isDocumentScrollingElement(element) { + if (!_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.canUseDOM || !element) { + return false; + } + + return element === document.scrollingElement; +} + +function getScrollPosition(scrollingContainer) { + const minScroll = { + x: 0, + y: 0 + }; + const dimensions = isDocumentScrollingElement(scrollingContainer) ? { + height: window.innerHeight, + width: window.innerWidth + } : { + height: scrollingContainer.clientHeight, + width: scrollingContainer.clientWidth + }; + const maxScroll = { + x: scrollingContainer.scrollWidth - dimensions.width, + y: scrollingContainer.scrollHeight - dimensions.height + }; + const isTop = scrollingContainer.scrollTop <= minScroll.y; + const isLeft = scrollingContainer.scrollLeft <= minScroll.x; + const isBottom = scrollingContainer.scrollTop >= maxScroll.y; + const isRight = scrollingContainer.scrollLeft >= maxScroll.x; + return { + isTop, + isLeft, + isBottom, + isRight, + maxScroll, + minScroll + }; +} + +const defaultThreshold = { + x: 0.2, + y: 0.2 +}; +function getScrollDirectionAndSpeed(scrollContainer, scrollContainerRect, _ref, acceleration, thresholdPercentage) { + let { + top, + left, + right, + bottom + } = _ref; + + if (acceleration === void 0) { + acceleration = 10; + } + + if (thresholdPercentage === void 0) { + thresholdPercentage = defaultThreshold; + } + + const { + isTop, + isBottom, + isLeft, + isRight + } = getScrollPosition(scrollContainer); + const direction = { + x: 0, + y: 0 + }; + const speed = { + x: 0, + y: 0 + }; + const threshold = { + height: scrollContainerRect.height * thresholdPercentage.y, + width: scrollContainerRect.width * thresholdPercentage.x + }; + + if (!isTop && top <= scrollContainerRect.top + threshold.height) { + // Scroll Up + direction.y = Direction.Backward; + speed.y = acceleration * Math.abs((scrollContainerRect.top + threshold.height - top) / threshold.height); + } else if (!isBottom && bottom >= scrollContainerRect.bottom - threshold.height) { + // Scroll Down + direction.y = Direction.Forward; + speed.y = acceleration * Math.abs((scrollContainerRect.bottom - threshold.height - bottom) / threshold.height); + } + + if (!isRight && right >= scrollContainerRect.right - threshold.width) { + // Scroll Right + direction.x = Direction.Forward; + speed.x = acceleration * Math.abs((scrollContainerRect.right - threshold.width - right) / threshold.width); + } else if (!isLeft && left <= scrollContainerRect.left + threshold.width) { + // Scroll Left + direction.x = Direction.Backward; + speed.x = acceleration * Math.abs((scrollContainerRect.left + threshold.width - left) / threshold.width); + } + + return { + direction, + speed + }; +} + +function getScrollElementRect(element) { + if (element === document.scrollingElement) { + const { + innerWidth, + innerHeight + } = window; + return { + top: 0, + left: 0, + right: innerWidth, + bottom: innerHeight, + width: innerWidth, + height: innerHeight + }; + } + + const { + top, + left, + right, + bottom + } = element.getBoundingClientRect(); + return { + top, + left, + right, + bottom, + width: element.clientWidth, + height: element.clientHeight + }; +} + +function getScrollOffsets(scrollableAncestors) { + return scrollableAncestors.reduce((acc, node) => { + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)(acc, getScrollCoordinates(node)); + }, defaultCoordinates); +} +function getScrollXOffset(scrollableAncestors) { + return scrollableAncestors.reduce((acc, node) => { + return acc + getScrollXCoordinate(node); + }, 0); +} +function getScrollYOffset(scrollableAncestors) { + return scrollableAncestors.reduce((acc, node) => { + return acc + getScrollYCoordinate(node); + }, 0); +} + +function scrollIntoViewIfNeeded(element, measure) { + if (measure === void 0) { + measure = getClientRect; + } + + if (!element) { + return; + } + + const { + top, + left, + bottom, + right + } = measure(element); + const firstScrollableAncestor = getFirstScrollableAncestor(element); + + if (!firstScrollableAncestor) { + return; + } + + if (bottom <= 0 || right <= 0 || top >= window.innerHeight || left >= window.innerWidth) { + element.scrollIntoView({ + block: 'center', + inline: 'center' + }); + } +} + +const properties = [['x', ['left', 'right'], getScrollXOffset], ['y', ['top', 'bottom'], getScrollYOffset]]; +class Rect { + constructor(rect, element) { + this.rect = void 0; + this.width = void 0; + this.height = void 0; + this.top = void 0; + this.bottom = void 0; + this.right = void 0; + this.left = void 0; + const scrollableAncestors = getScrollableAncestors(element); + const scrollOffsets = getScrollOffsets(scrollableAncestors); + this.rect = { ...rect + }; + this.width = rect.width; + this.height = rect.height; + + for (const [axis, keys, getScrollOffset] of properties) { + for (const key of keys) { + Object.defineProperty(this, key, { + get: () => { + const currentOffsets = getScrollOffset(scrollableAncestors); + const scrollOffsetsDeltla = scrollOffsets[axis] - currentOffsets; + return this.rect[key] + scrollOffsetsDeltla; + }, + enumerable: true + }); + } + } + + Object.defineProperty(this, 'rect', { + enumerable: false + }); + } + +} + +class Listeners { + constructor(target) { + this.target = void 0; + this.listeners = []; + + this.removeAll = () => { + this.listeners.forEach(listener => { + var _this$target; + + return (_this$target = this.target) == null ? void 0 : _this$target.removeEventListener(...listener); + }); + }; + + this.target = target; + } + + add(eventName, handler, options) { + var _this$target2; + + (_this$target2 = this.target) == null ? void 0 : _this$target2.addEventListener(eventName, handler, options); + this.listeners.push([eventName, handler, options]); + } + +} + +function getEventListenerTarget(target) { + // If the `event.target` element is removed from the document events will still be targeted + // at it, and hence won't always bubble up to the window or document anymore. + // If there is any risk of an element being removed while it is being dragged, + // the best practice is to attach the event listeners directly to the target. + // https://developer.mozilla.org/en-US/docs/Web/API/EventTarget + const { + EventTarget + } = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(target); + return target instanceof EventTarget ? target : (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(target); +} + +function hasExceededDistance(delta, measurement) { + const dx = Math.abs(delta.x); + const dy = Math.abs(delta.y); + + if (typeof measurement === 'number') { + return Math.sqrt(dx ** 2 + dy ** 2) > measurement; + } + + if ('x' in measurement && 'y' in measurement) { + return dx > measurement.x && dy > measurement.y; + } + + if ('x' in measurement) { + return dx > measurement.x; + } + + if ('y' in measurement) { + return dy > measurement.y; + } + + return false; +} + +var EventName; + +(function (EventName) { + EventName["Click"] = "click"; + EventName["DragStart"] = "dragstart"; + EventName["Keydown"] = "keydown"; + EventName["ContextMenu"] = "contextmenu"; + EventName["Resize"] = "resize"; + EventName["SelectionChange"] = "selectionchange"; + EventName["VisibilityChange"] = "visibilitychange"; +})(EventName || (EventName = {})); + +function preventDefault(event) { + event.preventDefault(); +} +function stopPropagation(event) { + event.stopPropagation(); +} + +var KeyboardCode; + +(function (KeyboardCode) { + KeyboardCode["Space"] = "Space"; + KeyboardCode["Down"] = "ArrowDown"; + KeyboardCode["Right"] = "ArrowRight"; + KeyboardCode["Left"] = "ArrowLeft"; + KeyboardCode["Up"] = "ArrowUp"; + KeyboardCode["Esc"] = "Escape"; + KeyboardCode["Enter"] = "Enter"; + KeyboardCode["Tab"] = "Tab"; +})(KeyboardCode || (KeyboardCode = {})); + +const defaultKeyboardCodes = { + start: [KeyboardCode.Space, KeyboardCode.Enter], + cancel: [KeyboardCode.Esc], + end: [KeyboardCode.Space, KeyboardCode.Enter, KeyboardCode.Tab] +}; +const defaultKeyboardCoordinateGetter = (event, _ref) => { + let { + currentCoordinates + } = _ref; + + switch (event.code) { + case KeyboardCode.Right: + return { ...currentCoordinates, + x: currentCoordinates.x + 25 + }; + + case KeyboardCode.Left: + return { ...currentCoordinates, + x: currentCoordinates.x - 25 + }; + + case KeyboardCode.Down: + return { ...currentCoordinates, + y: currentCoordinates.y + 25 + }; + + case KeyboardCode.Up: + return { ...currentCoordinates, + y: currentCoordinates.y - 25 + }; + } + + return undefined; +}; + +class KeyboardSensor { + constructor(props) { + this.props = void 0; + this.autoScrollEnabled = false; + this.referenceCoordinates = void 0; + this.listeners = void 0; + this.windowListeners = void 0; + this.props = props; + const { + event: { + target + } + } = props; + this.props = props; + this.listeners = new Listeners((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(target)); + this.windowListeners = new Listeners((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(target)); + this.handleKeyDown = this.handleKeyDown.bind(this); + this.handleCancel = this.handleCancel.bind(this); + this.attach(); + } + + attach() { + this.handleStart(); + this.windowListeners.add(EventName.Resize, this.handleCancel); + this.windowListeners.add(EventName.VisibilityChange, this.handleCancel); + setTimeout(() => this.listeners.add(EventName.Keydown, this.handleKeyDown)); + } + + handleStart() { + const { + activeNode, + onStart + } = this.props; + const node = activeNode.node.current; + + if (node) { + scrollIntoViewIfNeeded(node); + } + + onStart(defaultCoordinates); + } + + handleKeyDown(event) { + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isKeyboardEvent)(event)) { + const { + active, + context, + options + } = this.props; + const { + keyboardCodes = defaultKeyboardCodes, + coordinateGetter = defaultKeyboardCoordinateGetter, + scrollBehavior = 'smooth' + } = options; + const { + code + } = event; + + if (keyboardCodes.end.includes(code)) { + this.handleEnd(event); + return; + } + + if (keyboardCodes.cancel.includes(code)) { + this.handleCancel(event); + return; + } + + const { + collisionRect + } = context.current; + const currentCoordinates = collisionRect ? { + x: collisionRect.left, + y: collisionRect.top + } : defaultCoordinates; + + if (!this.referenceCoordinates) { + this.referenceCoordinates = currentCoordinates; + } + + const newCoordinates = coordinateGetter(event, { + active, + context: context.current, + currentCoordinates + }); + + if (newCoordinates) { + const coordinatesDelta = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.subtract)(newCoordinates, currentCoordinates); + const scrollDelta = { + x: 0, + y: 0 + }; + const { + scrollableAncestors + } = context.current; + + for (const scrollContainer of scrollableAncestors) { + const direction = event.code; + const { + isTop, + isRight, + isLeft, + isBottom, + maxScroll, + minScroll + } = getScrollPosition(scrollContainer); + const scrollElementRect = getScrollElementRect(scrollContainer); + const clampedCoordinates = { + x: Math.min(direction === KeyboardCode.Right ? scrollElementRect.right - scrollElementRect.width / 2 : scrollElementRect.right, Math.max(direction === KeyboardCode.Right ? scrollElementRect.left : scrollElementRect.left + scrollElementRect.width / 2, newCoordinates.x)), + y: Math.min(direction === KeyboardCode.Down ? scrollElementRect.bottom - scrollElementRect.height / 2 : scrollElementRect.bottom, Math.max(direction === KeyboardCode.Down ? scrollElementRect.top : scrollElementRect.top + scrollElementRect.height / 2, newCoordinates.y)) + }; + const canScrollX = direction === KeyboardCode.Right && !isRight || direction === KeyboardCode.Left && !isLeft; + const canScrollY = direction === KeyboardCode.Down && !isBottom || direction === KeyboardCode.Up && !isTop; + + if (canScrollX && clampedCoordinates.x !== newCoordinates.x) { + const newScrollCoordinates = scrollContainer.scrollLeft + coordinatesDelta.x; + const canScrollToNewCoordinates = direction === KeyboardCode.Right && newScrollCoordinates <= maxScroll.x || direction === KeyboardCode.Left && newScrollCoordinates >= minScroll.x; + + if (canScrollToNewCoordinates && !coordinatesDelta.y) { + // We don't need to update coordinates, the scroll adjustment alone will trigger + // logic to auto-detect the new container we are over + scrollContainer.scrollTo({ + left: newScrollCoordinates, + behavior: scrollBehavior + }); + return; + } + + if (canScrollToNewCoordinates) { + scrollDelta.x = scrollContainer.scrollLeft - newScrollCoordinates; + } else { + scrollDelta.x = direction === KeyboardCode.Right ? scrollContainer.scrollLeft - maxScroll.x : scrollContainer.scrollLeft - minScroll.x; + } + + if (scrollDelta.x) { + scrollContainer.scrollBy({ + left: -scrollDelta.x, + behavior: scrollBehavior + }); + } + + break; + } else if (canScrollY && clampedCoordinates.y !== newCoordinates.y) { + const newScrollCoordinates = scrollContainer.scrollTop + coordinatesDelta.y; + const canScrollToNewCoordinates = direction === KeyboardCode.Down && newScrollCoordinates <= maxScroll.y || direction === KeyboardCode.Up && newScrollCoordinates >= minScroll.y; + + if (canScrollToNewCoordinates && !coordinatesDelta.x) { + // We don't need to update coordinates, the scroll adjustment alone will trigger + // logic to auto-detect the new container we are over + scrollContainer.scrollTo({ + top: newScrollCoordinates, + behavior: scrollBehavior + }); + return; + } + + if (canScrollToNewCoordinates) { + scrollDelta.y = scrollContainer.scrollTop - newScrollCoordinates; + } else { + scrollDelta.y = direction === KeyboardCode.Down ? scrollContainer.scrollTop - maxScroll.y : scrollContainer.scrollTop - minScroll.y; + } + + if (scrollDelta.y) { + scrollContainer.scrollBy({ + top: -scrollDelta.y, + behavior: scrollBehavior + }); + } + + break; + } + } + + this.handleMove(event, (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.subtract)(newCoordinates, this.referenceCoordinates), scrollDelta)); + } + } + } + + handleMove(event, coordinates) { + const { + onMove + } = this.props; + event.preventDefault(); + onMove(coordinates); + } + + handleEnd(event) { + const { + onEnd + } = this.props; + event.preventDefault(); + this.detach(); + onEnd(); + } + + handleCancel(event) { + const { + onCancel + } = this.props; + event.preventDefault(); + this.detach(); + onCancel(); + } + + detach() { + this.listeners.removeAll(); + this.windowListeners.removeAll(); + } + +} +KeyboardSensor.activators = [{ + eventName: 'onKeyDown', + handler: (event, _ref, _ref2) => { + let { + keyboardCodes = defaultKeyboardCodes, + onActivation + } = _ref; + let { + active + } = _ref2; + const { + code + } = event.nativeEvent; + + if (keyboardCodes.start.includes(code)) { + const activator = active.activatorNode.current; + + if (activator && event.target !== activator) { + return false; + } + + event.preventDefault(); + onActivation == null ? void 0 : onActivation({ + event: event.nativeEvent + }); + return true; + } + + return false; + } +}]; + +function isDistanceConstraint(constraint) { + return Boolean(constraint && 'distance' in constraint); +} + +function isDelayConstraint(constraint) { + return Boolean(constraint && 'delay' in constraint); +} + +class AbstractPointerSensor { + constructor(props, events, listenerTarget) { + var _getEventCoordinates; + + if (listenerTarget === void 0) { + listenerTarget = getEventListenerTarget(props.event.target); + } + + this.props = void 0; + this.events = void 0; + this.autoScrollEnabled = true; + this.document = void 0; + this.activated = false; + this.initialCoordinates = void 0; + this.timeoutId = null; + this.listeners = void 0; + this.documentListeners = void 0; + this.windowListeners = void 0; + this.props = props; + this.events = events; + const { + event + } = props; + const { + target + } = event; + this.props = props; + this.events = events; + this.document = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(target); + this.documentListeners = new Listeners(this.document); + this.listeners = new Listeners(listenerTarget); + this.windowListeners = new Listeners((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(target)); + this.initialCoordinates = (_getEventCoordinates = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getEventCoordinates)(event)) != null ? _getEventCoordinates : defaultCoordinates; + this.handleStart = this.handleStart.bind(this); + this.handleMove = this.handleMove.bind(this); + this.handleEnd = this.handleEnd.bind(this); + this.handleCancel = this.handleCancel.bind(this); + this.handleKeydown = this.handleKeydown.bind(this); + this.removeTextSelection = this.removeTextSelection.bind(this); + this.attach(); + } + + attach() { + const { + events, + props: { + options: { + activationConstraint, + bypassActivationConstraint + } + } + } = this; + this.listeners.add(events.move.name, this.handleMove, { + passive: false + }); + this.listeners.add(events.end.name, this.handleEnd); + + if (events.cancel) { + this.listeners.add(events.cancel.name, this.handleCancel); + } + + this.windowListeners.add(EventName.Resize, this.handleCancel); + this.windowListeners.add(EventName.DragStart, preventDefault); + this.windowListeners.add(EventName.VisibilityChange, this.handleCancel); + this.windowListeners.add(EventName.ContextMenu, preventDefault); + this.documentListeners.add(EventName.Keydown, this.handleKeydown); + + if (activationConstraint) { + if (bypassActivationConstraint != null && bypassActivationConstraint({ + event: this.props.event, + activeNode: this.props.activeNode, + options: this.props.options + })) { + return this.handleStart(); + } + + if (isDelayConstraint(activationConstraint)) { + this.timeoutId = setTimeout(this.handleStart, activationConstraint.delay); + this.handlePending(activationConstraint); + return; + } + + if (isDistanceConstraint(activationConstraint)) { + this.handlePending(activationConstraint); + return; + } + } + + this.handleStart(); + } + + detach() { + this.listeners.removeAll(); + this.windowListeners.removeAll(); // Wait until the next event loop before removing document listeners + // This is necessary because we listen for `click` and `selection` events on the document + + setTimeout(this.documentListeners.removeAll, 50); + + if (this.timeoutId !== null) { + clearTimeout(this.timeoutId); + this.timeoutId = null; + } + } + + handlePending(constraint, offset) { + const { + active, + onPending + } = this.props; + onPending(active, constraint, this.initialCoordinates, offset); + } + + handleStart() { + const { + initialCoordinates + } = this; + const { + onStart + } = this.props; + + if (initialCoordinates) { + this.activated = true; // Stop propagation of click events once activation constraints are met + + this.documentListeners.add(EventName.Click, stopPropagation, { + capture: true + }); // Remove any text selection from the document + + this.removeTextSelection(); // Prevent further text selection while dragging + + this.documentListeners.add(EventName.SelectionChange, this.removeTextSelection); + onStart(initialCoordinates); + } + } + + handleMove(event) { + var _getEventCoordinates2; + + const { + activated, + initialCoordinates, + props + } = this; + const { + onMove, + options: { + activationConstraint + } + } = props; + + if (!initialCoordinates) { + return; + } + + const coordinates = (_getEventCoordinates2 = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getEventCoordinates)(event)) != null ? _getEventCoordinates2 : defaultCoordinates; + const delta = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.subtract)(initialCoordinates, coordinates); // Constraint validation + + if (!activated && activationConstraint) { + if (isDistanceConstraint(activationConstraint)) { + if (activationConstraint.tolerance != null && hasExceededDistance(delta, activationConstraint.tolerance)) { + return this.handleCancel(); + } + + if (hasExceededDistance(delta, activationConstraint.distance)) { + return this.handleStart(); + } + } + + if (isDelayConstraint(activationConstraint)) { + if (hasExceededDistance(delta, activationConstraint.tolerance)) { + return this.handleCancel(); + } + } + + this.handlePending(activationConstraint, delta); + return; + } + + if (event.cancelable) { + event.preventDefault(); + } + + onMove(coordinates); + } + + handleEnd() { + const { + onAbort, + onEnd + } = this.props; + this.detach(); + + if (!this.activated) { + onAbort(this.props.active); + } + + onEnd(); + } + + handleCancel() { + const { + onAbort, + onCancel + } = this.props; + this.detach(); + + if (!this.activated) { + onAbort(this.props.active); + } + + onCancel(); + } + + handleKeydown(event) { + if (event.code === KeyboardCode.Esc) { + this.handleCancel(); + } + } + + removeTextSelection() { + var _this$document$getSel; + + (_this$document$getSel = this.document.getSelection()) == null ? void 0 : _this$document$getSel.removeAllRanges(); + } + +} + +const events = { + cancel: { + name: 'pointercancel' + }, + move: { + name: 'pointermove' + }, + end: { + name: 'pointerup' + } +}; +class PointerSensor extends AbstractPointerSensor { + constructor(props) { + const { + event + } = props; // Pointer events stop firing if the target is unmounted while dragging + // Therefore we attach listeners to the owner document instead + + const listenerTarget = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(event.target); + super(props, events, listenerTarget); + } + +} +PointerSensor.activators = [{ + eventName: 'onPointerDown', + handler: (_ref, _ref2) => { + let { + nativeEvent: event + } = _ref; + let { + onActivation + } = _ref2; + + if (!event.isPrimary || event.button !== 0) { + return false; + } + + onActivation == null ? void 0 : onActivation({ + event + }); + return true; + } +}]; + +const events$1 = { + move: { + name: 'mousemove' + }, + end: { + name: 'mouseup' + } +}; +var MouseButton; + +(function (MouseButton) { + MouseButton[MouseButton["RightClick"] = 2] = "RightClick"; +})(MouseButton || (MouseButton = {})); + +class MouseSensor extends AbstractPointerSensor { + constructor(props) { + super(props, events$1, (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getOwnerDocument)(props.event.target)); + } + +} +MouseSensor.activators = [{ + eventName: 'onMouseDown', + handler: (_ref, _ref2) => { + let { + nativeEvent: event + } = _ref; + let { + onActivation + } = _ref2; + + if (event.button === MouseButton.RightClick) { + return false; + } + + onActivation == null ? void 0 : onActivation({ + event + }); + return true; + } +}]; + +const events$2 = { + cancel: { + name: 'touchcancel' + }, + move: { + name: 'touchmove' + }, + end: { + name: 'touchend' + } +}; +class TouchSensor extends AbstractPointerSensor { + constructor(props) { + super(props, events$2); + } + + static setup() { + // Adding a non-capture and non-passive `touchmove` listener in order + // to force `event.preventDefault()` calls to work in dynamically added + // touchmove event handlers. This is required for iOS Safari. + window.addEventListener(events$2.move.name, noop, { + capture: false, + passive: false + }); + return function teardown() { + window.removeEventListener(events$2.move.name, noop); + }; // We create a new handler because the teardown function of another sensor + // could remove our event listener if we use a referentially equal listener. + + function noop() {} + } + +} +TouchSensor.activators = [{ + eventName: 'onTouchStart', + handler: (_ref, _ref2) => { + let { + nativeEvent: event + } = _ref; + let { + onActivation + } = _ref2; + const { + touches + } = event; + + if (touches.length > 1) { + return false; + } + + onActivation == null ? void 0 : onActivation({ + event + }); + return true; + } +}]; + +var AutoScrollActivator; + +(function (AutoScrollActivator) { + AutoScrollActivator[AutoScrollActivator["Pointer"] = 0] = "Pointer"; + AutoScrollActivator[AutoScrollActivator["DraggableRect"] = 1] = "DraggableRect"; +})(AutoScrollActivator || (AutoScrollActivator = {})); + +var TraversalOrder; + +(function (TraversalOrder) { + TraversalOrder[TraversalOrder["TreeOrder"] = 0] = "TreeOrder"; + TraversalOrder[TraversalOrder["ReversedTreeOrder"] = 1] = "ReversedTreeOrder"; +})(TraversalOrder || (TraversalOrder = {})); + +function useAutoScroller(_ref) { + let { + acceleration, + activator = AutoScrollActivator.Pointer, + canScroll, + draggingRect, + enabled, + interval = 5, + order = TraversalOrder.TreeOrder, + pointerCoordinates, + scrollableAncestors, + scrollableAncestorRects, + delta, + threshold + } = _ref; + const scrollIntent = useScrollIntent({ + delta, + disabled: !enabled + }); + const [setAutoScrollInterval, clearAutoScrollInterval] = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useInterval)(); + const scrollSpeed = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + x: 0, + y: 0 + }); + const scrollDirection = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + x: 0, + y: 0 + }); + const rect = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + switch (activator) { + case AutoScrollActivator.Pointer: + return pointerCoordinates ? { + top: pointerCoordinates.y, + bottom: pointerCoordinates.y, + left: pointerCoordinates.x, + right: pointerCoordinates.x + } : null; + + case AutoScrollActivator.DraggableRect: + return draggingRect; + } + }, [activator, draggingRect, pointerCoordinates]); + const scrollContainerRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const autoScroll = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => { + const scrollContainer = scrollContainerRef.current; + + if (!scrollContainer) { + return; + } + + const scrollLeft = scrollSpeed.current.x * scrollDirection.current.x; + const scrollTop = scrollSpeed.current.y * scrollDirection.current.y; + scrollContainer.scrollBy(scrollLeft, scrollTop); + }, []); + const sortedScrollableAncestors = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => order === TraversalOrder.TreeOrder ? [...scrollableAncestors].reverse() : scrollableAncestors, [order, scrollableAncestors]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (!enabled || !scrollableAncestors.length || !rect) { + clearAutoScrollInterval(); + return; + } + + for (const scrollContainer of sortedScrollableAncestors) { + if ((canScroll == null ? void 0 : canScroll(scrollContainer)) === false) { + continue; + } + + const index = scrollableAncestors.indexOf(scrollContainer); + const scrollContainerRect = scrollableAncestorRects[index]; + + if (!scrollContainerRect) { + continue; + } + + const { + direction, + speed + } = getScrollDirectionAndSpeed(scrollContainer, scrollContainerRect, rect, acceleration, threshold); + + for (const axis of ['x', 'y']) { + if (!scrollIntent[axis][direction[axis]]) { + speed[axis] = 0; + direction[axis] = 0; + } + } + + if (speed.x > 0 || speed.y > 0) { + clearAutoScrollInterval(); + scrollContainerRef.current = scrollContainer; + setAutoScrollInterval(autoScroll, interval); + scrollSpeed.current = speed; + scrollDirection.current = direction; + return; + } + } + + scrollSpeed.current = { + x: 0, + y: 0 + }; + scrollDirection.current = { + x: 0, + y: 0 + }; + clearAutoScrollInterval(); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [acceleration, autoScroll, canScroll, clearAutoScrollInterval, enabled, interval, // eslint-disable-next-line react-hooks/exhaustive-deps + JSON.stringify(rect), // eslint-disable-next-line react-hooks/exhaustive-deps + JSON.stringify(scrollIntent), setAutoScrollInterval, scrollableAncestors, sortedScrollableAncestors, scrollableAncestorRects, // eslint-disable-next-line react-hooks/exhaustive-deps + JSON.stringify(threshold)]); +} +const defaultScrollIntent = { + x: { + [Direction.Backward]: false, + [Direction.Forward]: false + }, + y: { + [Direction.Backward]: false, + [Direction.Forward]: false + } +}; + +function useScrollIntent(_ref2) { + let { + delta, + disabled + } = _ref2; + const previousDelta = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.usePrevious)(delta); + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLazyMemo)(previousIntent => { + if (disabled || !previousDelta || !previousIntent) { + // Reset scroll intent tracking when auto-scrolling is disabled + return defaultScrollIntent; + } + + const direction = { + x: Math.sign(delta.x - previousDelta.x), + y: Math.sign(delta.y - previousDelta.y) + }; // Keep track of the user intent to scroll in each direction for both axis + + return { + x: { + [Direction.Backward]: previousIntent.x[Direction.Backward] || direction.x === -1, + [Direction.Forward]: previousIntent.x[Direction.Forward] || direction.x === 1 + }, + y: { + [Direction.Backward]: previousIntent.y[Direction.Backward] || direction.y === -1, + [Direction.Forward]: previousIntent.y[Direction.Forward] || direction.y === 1 + } + }; + }, [disabled, delta, previousDelta]); +} + +function useCachedNode(draggableNodes, id) { + const draggableNode = id != null ? draggableNodes.get(id) : undefined; + const node = draggableNode ? draggableNode.node.current : null; + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLazyMemo)(cachedNode => { + var _ref; + + if (id == null) { + return null; + } // In some cases, the draggable node can unmount while dragging + // This is the case for virtualized lists. In those situations, + // we fall back to the last known value for that node. + + + return (_ref = node != null ? node : cachedNode) != null ? _ref : null; + }, [node, id]); +} + +function useCombineActivators(sensors, getSyntheticHandler) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => sensors.reduce((accumulator, sensor) => { + const { + sensor: Sensor + } = sensor; + const sensorActivators = Sensor.activators.map(activator => ({ + eventName: activator.eventName, + handler: getSyntheticHandler(activator.handler, sensor) + })); + return [...accumulator, ...sensorActivators]; + }, []), [sensors, getSyntheticHandler]); +} + +var MeasuringStrategy; + +(function (MeasuringStrategy) { + MeasuringStrategy[MeasuringStrategy["Always"] = 0] = "Always"; + MeasuringStrategy[MeasuringStrategy["BeforeDragging"] = 1] = "BeforeDragging"; + MeasuringStrategy[MeasuringStrategy["WhileDragging"] = 2] = "WhileDragging"; +})(MeasuringStrategy || (MeasuringStrategy = {})); + +var MeasuringFrequency; + +(function (MeasuringFrequency) { + MeasuringFrequency["Optimized"] = "optimized"; +})(MeasuringFrequency || (MeasuringFrequency = {})); + +const defaultValue = /*#__PURE__*/new Map(); +function useDroppableMeasuring(containers, _ref) { + let { + dragging, + dependencies, + config + } = _ref; + const [queue, setQueue] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const { + frequency, + measure, + strategy + } = config; + const containersRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(containers); + const disabled = isDisabled(); + const disabledRef = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLatestValue)(disabled); + const measureDroppableContainers = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (ids) { + if (ids === void 0) { + ids = []; + } + + if (disabledRef.current) { + return; + } + + setQueue(value => { + if (value === null) { + return ids; + } + + return value.concat(ids.filter(id => !value.includes(id))); + }); + }, [disabledRef]); + const timeoutId = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const droppableRects = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLazyMemo)(previousValue => { + if (disabled && !dragging) { + return defaultValue; + } + + if (!previousValue || previousValue === defaultValue || containersRef.current !== containers || queue != null) { + const map = new Map(); + + for (let container of containers) { + if (!container) { + continue; + } + + if (queue && queue.length > 0 && !queue.includes(container.id) && container.rect.current) { + // This container does not need to be re-measured + map.set(container.id, container.rect.current); + continue; + } + + const node = container.node.current; + const rect = node ? new Rect(measure(node), node) : null; + container.rect.current = rect; + + if (rect) { + map.set(container.id, rect); + } + } + + return map; + } + + return previousValue; + }, [containers, queue, dragging, disabled, measure]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + containersRef.current = containers; + }, [containers]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (disabled) { + return; + } + + measureDroppableContainers(); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [dragging, disabled]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (queue && queue.length > 0) { + setQueue(null); + } + }, //eslint-disable-next-line react-hooks/exhaustive-deps + [JSON.stringify(queue)]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (disabled || typeof frequency !== 'number' || timeoutId.current !== null) { + return; + } + + timeoutId.current = setTimeout(() => { + measureDroppableContainers(); + timeoutId.current = null; + }, frequency); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [frequency, disabled, measureDroppableContainers, ...dependencies]); + return { + droppableRects, + measureDroppableContainers, + measuringScheduled: queue != null + }; + + function isDisabled() { + switch (strategy) { + case MeasuringStrategy.Always: + return false; + + case MeasuringStrategy.BeforeDragging: + return dragging; + + default: + return !dragging; + } + } +} + +function useInitialValue(value, computeFn) { + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLazyMemo)(previousValue => { + if (!value) { + return null; + } + + if (previousValue) { + return previousValue; + } + + return typeof computeFn === 'function' ? computeFn(value) : value; + }, [computeFn, value]); +} + +function useInitialRect(node, measure) { + return useInitialValue(node, measure); +} + +/** + * Returns a new MutationObserver instance. + * If `MutationObserver` is undefined in the execution environment, returns `undefined`. + */ + +function useMutationObserver(_ref) { + let { + callback, + disabled + } = _ref; + const handleMutations = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useEvent)(callback); + const mutationObserver = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + if (disabled || typeof window === 'undefined' || typeof window.MutationObserver === 'undefined') { + return undefined; + } + + const { + MutationObserver + } = window; + return new MutationObserver(handleMutations); + }, [handleMutations, disabled]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + return () => mutationObserver == null ? void 0 : mutationObserver.disconnect(); + }, [mutationObserver]); + return mutationObserver; +} + +/** + * Returns a new ResizeObserver instance bound to the `onResize` callback. + * If `ResizeObserver` is undefined in the execution environment, returns `undefined`. + */ + +function useResizeObserver(_ref) { + let { + callback, + disabled + } = _ref; + const handleResize = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useEvent)(callback); + const resizeObserver = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + if (disabled || typeof window === 'undefined' || typeof window.ResizeObserver === 'undefined') { + return undefined; + } + + const { + ResizeObserver + } = window; + return new ResizeObserver(handleResize); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [disabled]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + return () => resizeObserver == null ? void 0 : resizeObserver.disconnect(); + }, [resizeObserver]); + return resizeObserver; +} + +function defaultMeasure(element) { + return new Rect(getClientRect(element), element); +} + +function useRect(element, measure, fallbackRect) { + if (measure === void 0) { + measure = defaultMeasure; + } + + const [rect, setRect] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + + function measureRect() { + setRect(currentRect => { + if (!element) { + return null; + } + + if (element.isConnected === false) { + var _ref; + + // Fall back to last rect we measured if the element is + // no longer connected to the DOM. + return (_ref = currentRect != null ? currentRect : fallbackRect) != null ? _ref : null; + } + + const newRect = measure(element); + + if (JSON.stringify(currentRect) === JSON.stringify(newRect)) { + return currentRect; + } + + return newRect; + }); + } + + const mutationObserver = useMutationObserver({ + callback(records) { + if (!element) { + return; + } + + for (const record of records) { + const { + type, + target + } = record; + + if (type === 'childList' && target instanceof HTMLElement && target.contains(element)) { + measureRect(); + break; + } + } + } + + }); + const resizeObserver = useResizeObserver({ + callback: measureRect + }); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + measureRect(); + + if (element) { + resizeObserver == null ? void 0 : resizeObserver.observe(element); + mutationObserver == null ? void 0 : mutationObserver.observe(document.body, { + childList: true, + subtree: true + }); + } else { + resizeObserver == null ? void 0 : resizeObserver.disconnect(); + mutationObserver == null ? void 0 : mutationObserver.disconnect(); + } + }, [element]); + return rect; +} + +function useRectDelta(rect) { + const initialRect = useInitialValue(rect); + return getRectDelta(rect, initialRect); +} + +const defaultValue$1 = []; +function useScrollableAncestors(node) { + const previousNode = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(node); + const ancestors = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLazyMemo)(previousValue => { + if (!node) { + return defaultValue$1; + } + + if (previousValue && previousValue !== defaultValue$1 && node && previousNode.current && node.parentNode === previousNode.current.parentNode) { + return previousValue; + } + + return getScrollableAncestors(node); + }, [node]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + previousNode.current = node; + }, [node]); + return ancestors; +} + +function useScrollOffsets(elements) { + const [scrollCoordinates, setScrollCoordinates] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const prevElements = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(elements); // To-do: Throttle the handleScroll callback + + const handleScroll = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(event => { + const scrollingElement = getScrollableElement(event.target); + + if (!scrollingElement) { + return; + } + + setScrollCoordinates(scrollCoordinates => { + if (!scrollCoordinates) { + return null; + } + + scrollCoordinates.set(scrollingElement, getScrollCoordinates(scrollingElement)); + return new Map(scrollCoordinates); + }); + }, []); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + const previousElements = prevElements.current; + + if (elements !== previousElements) { + cleanup(previousElements); + const entries = elements.map(element => { + const scrollableElement = getScrollableElement(element); + + if (scrollableElement) { + scrollableElement.addEventListener('scroll', handleScroll, { + passive: true + }); + return [scrollableElement, getScrollCoordinates(scrollableElement)]; + } + + return null; + }).filter(entry => entry != null); + setScrollCoordinates(entries.length ? new Map(entries) : null); + prevElements.current = elements; + } + + return () => { + cleanup(elements); + cleanup(previousElements); + }; + + function cleanup(elements) { + elements.forEach(element => { + const scrollableElement = getScrollableElement(element); + scrollableElement == null ? void 0 : scrollableElement.removeEventListener('scroll', handleScroll); + }); + } + }, [handleScroll, elements]); + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + if (elements.length) { + return scrollCoordinates ? Array.from(scrollCoordinates.values()).reduce((acc, coordinates) => (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)(acc, coordinates), defaultCoordinates) : getScrollOffsets(elements); + } + + return defaultCoordinates; + }, [elements, scrollCoordinates]); +} + +function useScrollOffsetsDelta(scrollOffsets, dependencies) { + if (dependencies === void 0) { + dependencies = []; + } + + const initialScrollOffsets = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + initialScrollOffsets.current = null; + }, // eslint-disable-next-line react-hooks/exhaustive-deps + dependencies); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + const hasScrollOffsets = scrollOffsets !== defaultCoordinates; + + if (hasScrollOffsets && !initialScrollOffsets.current) { + initialScrollOffsets.current = scrollOffsets; + } + + if (!hasScrollOffsets && initialScrollOffsets.current) { + initialScrollOffsets.current = null; + } + }, [scrollOffsets]); + return initialScrollOffsets.current ? (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.subtract)(scrollOffsets, initialScrollOffsets.current) : defaultCoordinates; +} + +function useSensorSetup(sensors) { + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (!_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.canUseDOM) { + return; + } + + const teardownFns = sensors.map(_ref => { + let { + sensor + } = _ref; + return sensor.setup == null ? void 0 : sensor.setup(); + }); + return () => { + for (const teardown of teardownFns) { + teardown == null ? void 0 : teardown(); + } + }; + }, // TO-DO: Sensors length could theoretically change which would not be a valid dependency + // eslint-disable-next-line react-hooks/exhaustive-deps + sensors.map(_ref2 => { + let { + sensor + } = _ref2; + return sensor; + })); +} + +function useSyntheticListeners(listeners, id) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + return listeners.reduce((acc, _ref) => { + let { + eventName, + handler + } = _ref; + + acc[eventName] = event => { + handler(event, id); + }; + + return acc; + }, {}); + }, [listeners, id]); +} + +function useWindowRect(element) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => element ? getWindowClientRect(element) : null, [element]); +} + +const defaultValue$2 = []; +function useRects(elements, measure) { + if (measure === void 0) { + measure = getClientRect; + } + + const [firstElement] = elements; + const windowRect = useWindowRect(firstElement ? (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(firstElement) : null); + const [rects, setRects] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(defaultValue$2); + + function measureRects() { + setRects(() => { + if (!elements.length) { + return defaultValue$2; + } + + return elements.map(element => isDocumentScrollingElement(element) ? windowRect : new Rect(measure(element), element)); + }); + } + + const resizeObserver = useResizeObserver({ + callback: measureRects + }); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + resizeObserver == null ? void 0 : resizeObserver.disconnect(); + measureRects(); + elements.forEach(element => resizeObserver == null ? void 0 : resizeObserver.observe(element)); + }, [elements]); + return rects; +} + +function getMeasurableNode(node) { + if (!node) { + return null; + } + + if (node.children.length > 1) { + return node; + } + + const firstChild = node.children[0]; + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isHTMLElement)(firstChild) ? firstChild : node; +} + +function useDragOverlayMeasuring(_ref) { + let { + measure + } = _ref; + const [rect, setRect] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const handleResize = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(entries => { + for (const { + target + } of entries) { + if ((0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isHTMLElement)(target)) { + setRect(rect => { + const newRect = measure(target); + return rect ? { ...rect, + width: newRect.width, + height: newRect.height + } : newRect; + }); + break; + } + } + }, [measure]); + const resizeObserver = useResizeObserver({ + callback: handleResize + }); + const handleNodeChange = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(element => { + const node = getMeasurableNode(element); + resizeObserver == null ? void 0 : resizeObserver.disconnect(); + + if (node) { + resizeObserver == null ? void 0 : resizeObserver.observe(node); + } + + setRect(node ? measure(node) : null); + }, [measure, resizeObserver]); + const [nodeRef, setRef] = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useNodeRef)(handleNodeChange); + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + nodeRef, + rect, + setRef + }), [rect, nodeRef, setRef]); +} + +const defaultSensors = [{ + sensor: PointerSensor, + options: {} +}, { + sensor: KeyboardSensor, + options: {} +}]; +const defaultData = { + current: {} +}; +const defaultMeasuringConfiguration = { + draggable: { + measure: getTransformAgnosticClientRect + }, + droppable: { + measure: getTransformAgnosticClientRect, + strategy: MeasuringStrategy.WhileDragging, + frequency: MeasuringFrequency.Optimized + }, + dragOverlay: { + measure: getClientRect + } +}; + +class DroppableContainersMap extends Map { + get(id) { + var _super$get; + + return id != null ? (_super$get = super.get(id)) != null ? _super$get : undefined : undefined; + } + + toArray() { + return Array.from(this.values()); + } + + getEnabled() { + return this.toArray().filter(_ref => { + let { + disabled + } = _ref; + return !disabled; + }); + } + + getNodeFor(id) { + var _this$get$node$curren, _this$get; + + return (_this$get$node$curren = (_this$get = this.get(id)) == null ? void 0 : _this$get.node.current) != null ? _this$get$node$curren : undefined; + } + +} + +const defaultPublicContext = { + activatorEvent: null, + active: null, + activeNode: null, + activeNodeRect: null, + collisions: null, + containerNodeRect: null, + draggableNodes: /*#__PURE__*/new Map(), + droppableRects: /*#__PURE__*/new Map(), + droppableContainers: /*#__PURE__*/new DroppableContainersMap(), + over: null, + dragOverlay: { + nodeRef: { + current: null + }, + rect: null, + setRef: noop + }, + scrollableAncestors: [], + scrollableAncestorRects: [], + measuringConfiguration: defaultMeasuringConfiguration, + measureDroppableContainers: noop, + windowRect: null, + measuringScheduled: false +}; +const defaultInternalContext = { + activatorEvent: null, + activators: [], + active: null, + activeNodeRect: null, + ariaDescribedById: { + draggable: '' + }, + dispatch: noop, + draggableNodes: /*#__PURE__*/new Map(), + over: null, + measureDroppableContainers: noop +}; +const InternalContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)(defaultInternalContext); +const PublicContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)(defaultPublicContext); + +function getInitialState() { + return { + draggable: { + active: null, + initialCoordinates: { + x: 0, + y: 0 + }, + nodes: new Map(), + translate: { + x: 0, + y: 0 + } + }, + droppable: { + containers: new DroppableContainersMap() + } + }; +} +function reducer(state, action) { + switch (action.type) { + case Action.DragStart: + return { ...state, + draggable: { ...state.draggable, + initialCoordinates: action.initialCoordinates, + active: action.active + } + }; + + case Action.DragMove: + if (state.draggable.active == null) { + return state; + } + + return { ...state, + draggable: { ...state.draggable, + translate: { + x: action.coordinates.x - state.draggable.initialCoordinates.x, + y: action.coordinates.y - state.draggable.initialCoordinates.y + } + } + }; + + case Action.DragEnd: + case Action.DragCancel: + return { ...state, + draggable: { ...state.draggable, + active: null, + initialCoordinates: { + x: 0, + y: 0 + }, + translate: { + x: 0, + y: 0 + } + } + }; + + case Action.RegisterDroppable: + { + const { + element + } = action; + const { + id + } = element; + const containers = new DroppableContainersMap(state.droppable.containers); + containers.set(id, element); + return { ...state, + droppable: { ...state.droppable, + containers + } + }; + } + + case Action.SetDroppableDisabled: + { + const { + id, + key, + disabled + } = action; + const element = state.droppable.containers.get(id); + + if (!element || key !== element.key) { + return state; + } + + const containers = new DroppableContainersMap(state.droppable.containers); + containers.set(id, { ...element, + disabled + }); + return { ...state, + droppable: { ...state.droppable, + containers + } + }; + } + + case Action.UnregisterDroppable: + { + const { + id, + key + } = action; + const element = state.droppable.containers.get(id); + + if (!element || key !== element.key) { + return state; + } + + const containers = new DroppableContainersMap(state.droppable.containers); + containers.delete(id); + return { ...state, + droppable: { ...state.droppable, + containers + } + }; + } + + default: + { + return state; + } + } +} + +function RestoreFocus(_ref) { + let { + disabled + } = _ref; + const { + active, + activatorEvent, + draggableNodes + } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(InternalContext); + const previousActivatorEvent = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.usePrevious)(activatorEvent); + const previousActiveId = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.usePrevious)(active == null ? void 0 : active.id); // Restore keyboard focus on the activator node + + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (disabled) { + return; + } + + if (!activatorEvent && previousActivatorEvent && previousActiveId != null) { + if (!(0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isKeyboardEvent)(previousActivatorEvent)) { + return; + } + + if (document.activeElement === previousActivatorEvent.target) { + // No need to restore focus + return; + } + + const draggableNode = draggableNodes.get(previousActiveId); + + if (!draggableNode) { + return; + } + + const { + activatorNode, + node + } = draggableNode; + + if (!activatorNode.current && !node.current) { + return; + } + + requestAnimationFrame(() => { + for (const element of [activatorNode.current, node.current]) { + if (!element) { + continue; + } + + const focusableNode = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.findFirstFocusableNode)(element); + + if (focusableNode) { + focusableNode.focus(); + break; + } + } + }); + } + }, [activatorEvent, disabled, draggableNodes, previousActiveId, previousActivatorEvent]); + return null; +} + +function applyModifiers(modifiers, _ref) { + let { + transform, + ...args + } = _ref; + return modifiers != null && modifiers.length ? modifiers.reduce((accumulator, modifier) => { + return modifier({ + transform: accumulator, + ...args + }); + }, transform) : transform; +} + +function useMeasuringConfiguration(config) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + draggable: { ...defaultMeasuringConfiguration.draggable, + ...(config == null ? void 0 : config.draggable) + }, + droppable: { ...defaultMeasuringConfiguration.droppable, + ...(config == null ? void 0 : config.droppable) + }, + dragOverlay: { ...defaultMeasuringConfiguration.dragOverlay, + ...(config == null ? void 0 : config.dragOverlay) + } + }), // eslint-disable-next-line react-hooks/exhaustive-deps + [config == null ? void 0 : config.draggable, config == null ? void 0 : config.droppable, config == null ? void 0 : config.dragOverlay]); +} + +function useLayoutShiftScrollCompensation(_ref) { + let { + activeNode, + measure, + initialRect, + config = true + } = _ref; + const initialized = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(false); + const { + x, + y + } = typeof config === 'boolean' ? { + x: config, + y: config + } : config; + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + const disabled = !x && !y; + + if (disabled || !activeNode) { + initialized.current = false; + return; + } + + if (initialized.current || !initialRect) { + // Return early if layout shift scroll compensation was already attempted + // or if there is no initialRect to compare to. + return; + } // Get the most up to date node ref for the active draggable + + + const node = activeNode == null ? void 0 : activeNode.node.current; + + if (!node || node.isConnected === false) { + // Return early if there is no attached node ref or if the node is + // disconnected from the document. + return; + } + + const rect = measure(node); + const rectDelta = getRectDelta(rect, initialRect); + + if (!x) { + rectDelta.x = 0; + } + + if (!y) { + rectDelta.y = 0; + } // Only perform layout shift scroll compensation once + + + initialized.current = true; + + if (Math.abs(rectDelta.x) > 0 || Math.abs(rectDelta.y) > 0) { + const firstScrollableAncestor = getFirstScrollableAncestor(node); + + if (firstScrollableAncestor) { + firstScrollableAncestor.scrollBy({ + top: rectDelta.y, + left: rectDelta.x + }); + } + } + }, [activeNode, x, y, initialRect, measure]); +} + +const ActiveDraggableContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)({ ...defaultCoordinates, + scaleX: 1, + scaleY: 1 +}); +var Status; + +(function (Status) { + Status[Status["Uninitialized"] = 0] = "Uninitialized"; + Status[Status["Initializing"] = 1] = "Initializing"; + Status[Status["Initialized"] = 2] = "Initialized"; +})(Status || (Status = {})); + +const DndContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.memo)(function DndContext(_ref) { + var _sensorContext$curren, _dragOverlay$nodeRef$, _dragOverlay$rect, _over$rect; + + let { + id, + accessibility, + autoScroll = true, + children, + sensors = defaultSensors, + collisionDetection = rectIntersection, + measuring, + modifiers, + ...props + } = _ref; + const store = (0,react__WEBPACK_IMPORTED_MODULE_0__.useReducer)(reducer, undefined, getInitialState); + const [state, dispatch] = store; + const [dispatchMonitorEvent, registerMonitorListener] = useDndMonitorProvider(); + const [status, setStatus] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(Status.Uninitialized); + const isInitialized = status === Status.Initialized; + const { + draggable: { + active: activeId, + nodes: draggableNodes, + translate + }, + droppable: { + containers: droppableContainers + } + } = state; + const node = activeId != null ? draggableNodes.get(activeId) : null; + const activeRects = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + initial: null, + translated: null + }); + const active = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + var _node$data; + + return activeId != null ? { + id: activeId, + // It's possible for the active node to unmount while dragging + data: (_node$data = node == null ? void 0 : node.data) != null ? _node$data : defaultData, + rect: activeRects + } : null; + }, [activeId, node]); + const activeRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const [activeSensor, setActiveSensor] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const [activatorEvent, setActivatorEvent] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const latestProps = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLatestValue)(props, Object.values(props)); + const draggableDescribedById = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useUniqueId)("DndDescribedBy", id); + const enabledDroppableContainers = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => droppableContainers.getEnabled(), [droppableContainers]); + const measuringConfiguration = useMeasuringConfiguration(measuring); + const { + droppableRects, + measureDroppableContainers, + measuringScheduled + } = useDroppableMeasuring(enabledDroppableContainers, { + dragging: isInitialized, + dependencies: [translate.x, translate.y], + config: measuringConfiguration.droppable + }); + const activeNode = useCachedNode(draggableNodes, activeId); + const activationCoordinates = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => activatorEvent ? (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getEventCoordinates)(activatorEvent) : null, [activatorEvent]); + const autoScrollOptions = getAutoScrollerOptions(); + const initialActiveNodeRect = useInitialRect(activeNode, measuringConfiguration.draggable.measure); + useLayoutShiftScrollCompensation({ + activeNode: activeId != null ? draggableNodes.get(activeId) : null, + config: autoScrollOptions.layoutShiftCompensation, + initialRect: initialActiveNodeRect, + measure: measuringConfiguration.draggable.measure + }); + const activeNodeRect = useRect(activeNode, measuringConfiguration.draggable.measure, initialActiveNodeRect); + const containerNodeRect = useRect(activeNode ? activeNode.parentElement : null); + const sensorContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + activatorEvent: null, + active: null, + activeNode, + collisionRect: null, + collisions: null, + droppableRects, + draggableNodes, + draggingNode: null, + draggingNodeRect: null, + droppableContainers, + over: null, + scrollableAncestors: [], + scrollAdjustedTranslate: null + }); + const overNode = droppableContainers.getNodeFor((_sensorContext$curren = sensorContext.current.over) == null ? void 0 : _sensorContext$curren.id); + const dragOverlay = useDragOverlayMeasuring({ + measure: measuringConfiguration.dragOverlay.measure + }); // Use the rect of the drag overlay if it is mounted + + const draggingNode = (_dragOverlay$nodeRef$ = dragOverlay.nodeRef.current) != null ? _dragOverlay$nodeRef$ : activeNode; + const draggingNodeRect = isInitialized ? (_dragOverlay$rect = dragOverlay.rect) != null ? _dragOverlay$rect : activeNodeRect : null; + const usesDragOverlay = Boolean(dragOverlay.nodeRef.current && dragOverlay.rect); // The delta between the previous and new position of the draggable node + // is only relevant when there is no drag overlay + + const nodeRectDelta = useRectDelta(usesDragOverlay ? null : activeNodeRect); // Get the window rect of the dragging node + + const windowRect = useWindowRect(draggingNode ? (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(draggingNode) : null); // Get scrollable ancestors of the dragging node + + const scrollableAncestors = useScrollableAncestors(isInitialized ? overNode != null ? overNode : activeNode : null); + const scrollableAncestorRects = useRects(scrollableAncestors); // Apply modifiers + + const modifiedTranslate = applyModifiers(modifiers, { + transform: { + x: translate.x - nodeRectDelta.x, + y: translate.y - nodeRectDelta.y, + scaleX: 1, + scaleY: 1 + }, + activatorEvent, + active, + activeNodeRect, + containerNodeRect, + draggingNodeRect, + over: sensorContext.current.over, + overlayNodeRect: dragOverlay.rect, + scrollableAncestors, + scrollableAncestorRects, + windowRect + }); + const pointerCoordinates = activationCoordinates ? (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)(activationCoordinates, translate) : null; + const scrollOffsets = useScrollOffsets(scrollableAncestors); // Represents the scroll delta since dragging was initiated + + const scrollAdjustment = useScrollOffsetsDelta(scrollOffsets); // Represents the scroll delta since the last time the active node rect was measured + + const activeNodeScrollDelta = useScrollOffsetsDelta(scrollOffsets, [activeNodeRect]); + const scrollAdjustedTranslate = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)(modifiedTranslate, scrollAdjustment); + const collisionRect = draggingNodeRect ? getAdjustedRect(draggingNodeRect, modifiedTranslate) : null; + const collisions = active && collisionRect ? collisionDetection({ + active, + collisionRect, + droppableRects, + droppableContainers: enabledDroppableContainers, + pointerCoordinates + }) : null; + const overId = getFirstCollision(collisions, 'id'); + const [over, setOver] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); // When there is no drag overlay used, we need to account for the + // window scroll delta + + const appliedTranslate = usesDragOverlay ? modifiedTranslate : (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.add)(modifiedTranslate, activeNodeScrollDelta); + const transform = adjustScale(appliedTranslate, (_over$rect = over == null ? void 0 : over.rect) != null ? _over$rect : null, activeNodeRect); + const activeSensorRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const instantiateSensor = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((event, _ref2) => { + let { + sensor: Sensor, + options + } = _ref2; + + if (activeRef.current == null) { + return; + } + + const activeNode = draggableNodes.get(activeRef.current); + + if (!activeNode) { + return; + } + + const activatorEvent = event.nativeEvent; + const sensorInstance = new Sensor({ + active: activeRef.current, + activeNode, + event: activatorEvent, + options, + // Sensors need to be instantiated with refs for arguments that change over time + // otherwise they are frozen in time with the stale arguments + context: sensorContext, + + onAbort(id) { + const draggableNode = draggableNodes.get(id); + + if (!draggableNode) { + return; + } + + const { + onDragAbort + } = latestProps.current; + const event = { + id + }; + onDragAbort == null ? void 0 : onDragAbort(event); + dispatchMonitorEvent({ + type: 'onDragAbort', + event + }); + }, + + onPending(id, constraint, initialCoordinates, offset) { + const draggableNode = draggableNodes.get(id); + + if (!draggableNode) { + return; + } + + const { + onDragPending + } = latestProps.current; + const event = { + id, + constraint, + initialCoordinates, + offset + }; + onDragPending == null ? void 0 : onDragPending(event); + dispatchMonitorEvent({ + type: 'onDragPending', + event + }); + }, + + onStart(initialCoordinates) { + const id = activeRef.current; + + if (id == null) { + return; + } + + const draggableNode = draggableNodes.get(id); + + if (!draggableNode) { + return; + } + + const { + onDragStart + } = latestProps.current; + const event = { + activatorEvent, + active: { + id, + data: draggableNode.data, + rect: activeRects + } + }; + (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.unstable_batchedUpdates)(() => { + onDragStart == null ? void 0 : onDragStart(event); + setStatus(Status.Initializing); + dispatch({ + type: Action.DragStart, + initialCoordinates, + active: id + }); + dispatchMonitorEvent({ + type: 'onDragStart', + event + }); + setActiveSensor(activeSensorRef.current); + setActivatorEvent(activatorEvent); + }); + }, + + onMove(coordinates) { + dispatch({ + type: Action.DragMove, + coordinates + }); + }, + + onEnd: createHandler(Action.DragEnd), + onCancel: createHandler(Action.DragCancel) + }); + activeSensorRef.current = sensorInstance; + + function createHandler(type) { + return async function handler() { + const { + active, + collisions, + over, + scrollAdjustedTranslate + } = sensorContext.current; + let event = null; + + if (active && scrollAdjustedTranslate) { + const { + cancelDrop + } = latestProps.current; + event = { + activatorEvent, + active: active, + collisions, + delta: scrollAdjustedTranslate, + over + }; + + if (type === Action.DragEnd && typeof cancelDrop === 'function') { + const shouldCancel = await Promise.resolve(cancelDrop(event)); + + if (shouldCancel) { + type = Action.DragCancel; + } + } + } + + activeRef.current = null; + (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.unstable_batchedUpdates)(() => { + dispatch({ + type + }); + setStatus(Status.Uninitialized); + setOver(null); + setActiveSensor(null); + setActivatorEvent(null); + activeSensorRef.current = null; + const eventName = type === Action.DragEnd ? 'onDragEnd' : 'onDragCancel'; + + if (event) { + const handler = latestProps.current[eventName]; + handler == null ? void 0 : handler(event); + dispatchMonitorEvent({ + type: eventName, + event + }); + } + }); + }; + } + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [draggableNodes]); + const bindActivatorToSensorInstantiator = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((handler, sensor) => { + return (event, active) => { + const nativeEvent = event.nativeEvent; + const activeDraggableNode = draggableNodes.get(active); + + if ( // Another sensor is already instantiating + activeRef.current !== null || // No active draggable + !activeDraggableNode || // Event has already been captured + nativeEvent.dndKit || nativeEvent.defaultPrevented) { + return; + } + + const activationContext = { + active: activeDraggableNode + }; + const shouldActivate = handler(event, sensor.options, activationContext); + + if (shouldActivate === true) { + nativeEvent.dndKit = { + capturedBy: sensor.sensor + }; + activeRef.current = active; + instantiateSensor(event, sensor); + } + }; + }, [draggableNodes, instantiateSensor]); + const activators = useCombineActivators(sensors, bindActivatorToSensorInstantiator); + useSensorSetup(sensors); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + if (activeNodeRect && status === Status.Initializing) { + setStatus(Status.Initialized); + } + }, [activeNodeRect, status]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + const { + onDragMove + } = latestProps.current; + const { + active, + activatorEvent, + collisions, + over + } = sensorContext.current; + + if (!active || !activatorEvent) { + return; + } + + const event = { + active, + activatorEvent, + collisions, + delta: { + x: scrollAdjustedTranslate.x, + y: scrollAdjustedTranslate.y + }, + over + }; + (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.unstable_batchedUpdates)(() => { + onDragMove == null ? void 0 : onDragMove(event); + dispatchMonitorEvent({ + type: 'onDragMove', + event + }); + }); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [scrollAdjustedTranslate.x, scrollAdjustedTranslate.y]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + const { + active, + activatorEvent, + collisions, + droppableContainers, + scrollAdjustedTranslate + } = sensorContext.current; + + if (!active || activeRef.current == null || !activatorEvent || !scrollAdjustedTranslate) { + return; + } + + const { + onDragOver + } = latestProps.current; + const overContainer = droppableContainers.get(overId); + const over = overContainer && overContainer.rect.current ? { + id: overContainer.id, + rect: overContainer.rect.current, + data: overContainer.data, + disabled: overContainer.disabled + } : null; + const event = { + active, + activatorEvent, + collisions, + delta: { + x: scrollAdjustedTranslate.x, + y: scrollAdjustedTranslate.y + }, + over + }; + (0,react_dom__WEBPACK_IMPORTED_MODULE_1__.unstable_batchedUpdates)(() => { + setOver(over); + onDragOver == null ? void 0 : onDragOver(event); + dispatchMonitorEvent({ + type: 'onDragOver', + event + }); + }); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [overId]); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + sensorContext.current = { + activatorEvent, + active, + activeNode, + collisionRect, + collisions, + droppableRects, + draggableNodes, + draggingNode, + draggingNodeRect, + droppableContainers, + over, + scrollableAncestors, + scrollAdjustedTranslate + }; + activeRects.current = { + initial: draggingNodeRect, + translated: collisionRect + }; + }, [active, activeNode, collisions, collisionRect, draggableNodes, draggingNode, draggingNodeRect, droppableRects, droppableContainers, over, scrollableAncestors, scrollAdjustedTranslate]); + useAutoScroller({ ...autoScrollOptions, + delta: translate, + draggingRect: collisionRect, + pointerCoordinates, + scrollableAncestors, + scrollableAncestorRects + }); + const publicContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + const context = { + active, + activeNode, + activeNodeRect, + activatorEvent, + collisions, + containerNodeRect, + dragOverlay, + draggableNodes, + droppableContainers, + droppableRects, + over, + measureDroppableContainers, + scrollableAncestors, + scrollableAncestorRects, + measuringConfiguration, + measuringScheduled, + windowRect + }; + return context; + }, [active, activeNode, activeNodeRect, activatorEvent, collisions, containerNodeRect, dragOverlay, draggableNodes, droppableContainers, droppableRects, over, measureDroppableContainers, scrollableAncestors, scrollableAncestorRects, measuringConfiguration, measuringScheduled, windowRect]); + const internalContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + const context = { + activatorEvent, + activators, + active, + activeNodeRect, + ariaDescribedById: { + draggable: draggableDescribedById + }, + dispatch, + draggableNodes, + over, + measureDroppableContainers + }; + return context; + }, [activatorEvent, activators, active, activeNodeRect, dispatch, draggableDescribedById, draggableNodes, over, measureDroppableContainers]); + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(DndMonitorContext.Provider, { + value: registerMonitorListener + }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(InternalContext.Provider, { + value: internalContext + }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(PublicContext.Provider, { + value: publicContext + }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ActiveDraggableContext.Provider, { + value: transform + }, children)), react__WEBPACK_IMPORTED_MODULE_0___default().createElement(RestoreFocus, { + disabled: (accessibility == null ? void 0 : accessibility.restoreFocus) === false + })), react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Accessibility, { ...accessibility, + hiddenTextDescribedById: draggableDescribedById + })); + + function getAutoScrollerOptions() { + const activeSensorDisablesAutoscroll = (activeSensor == null ? void 0 : activeSensor.autoScrollEnabled) === false; + const autoScrollGloballyDisabled = typeof autoScroll === 'object' ? autoScroll.enabled === false : autoScroll === false; + const enabled = isInitialized && !activeSensorDisablesAutoscroll && !autoScrollGloballyDisabled; + + if (typeof autoScroll === 'object') { + return { ...autoScroll, + enabled + }; + } + + return { + enabled + }; + } +}); + +const NullContext = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.createContext)(null); +const defaultRole = 'button'; +const ID_PREFIX = 'Draggable'; +function useDraggable(_ref) { + let { + id, + data, + disabled = false, + attributes + } = _ref; + const key = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useUniqueId)(ID_PREFIX); + const { + activators, + activatorEvent, + active, + activeNodeRect, + ariaDescribedById, + draggableNodes, + over + } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(InternalContext); + const { + role = defaultRole, + roleDescription = 'draggable', + tabIndex = 0 + } = attributes != null ? attributes : {}; + const isDragging = (active == null ? void 0 : active.id) === id; + const transform = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(isDragging ? ActiveDraggableContext : NullContext); + const [node, setNodeRef] = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useNodeRef)(); + const [activatorNode, setActivatorNodeRef] = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useNodeRef)(); + const listeners = useSyntheticListeners(activators, id); + const dataRef = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLatestValue)(data); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + draggableNodes.set(id, { + id, + key, + node, + activatorNode, + data: dataRef + }); + return () => { + const node = draggableNodes.get(id); + + if (node && node.key === key) { + draggableNodes.delete(id); + } + }; + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [draggableNodes, id]); + const memoizedAttributes = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + role, + tabIndex, + 'aria-disabled': disabled, + 'aria-pressed': isDragging && role === defaultRole ? true : undefined, + 'aria-roledescription': roleDescription, + 'aria-describedby': ariaDescribedById.draggable + }), [disabled, role, tabIndex, isDragging, roleDescription, ariaDescribedById.draggable]); + return { + active, + activatorEvent, + activeNodeRect, + attributes: memoizedAttributes, + isDragging, + listeners: disabled ? undefined : listeners, + node, + over, + setNodeRef, + setActivatorNodeRef, + transform + }; +} + +function useDndContext() { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(PublicContext); +} + +const ID_PREFIX$1 = 'Droppable'; +const defaultResizeObserverConfig = { + timeout: 25 +}; +function useDroppable(_ref) { + let { + data, + disabled = false, + id, + resizeObserverConfig + } = _ref; + const key = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useUniqueId)(ID_PREFIX$1); + const { + active, + dispatch, + over, + measureDroppableContainers + } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(InternalContext); + const previous = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + disabled + }); + const resizeObserverConnected = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(false); + const rect = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const callbackId = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const { + disabled: resizeObserverDisabled, + updateMeasurementsFor, + timeout: resizeObserverTimeout + } = { ...defaultResizeObserverConfig, + ...resizeObserverConfig + }; + const ids = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLatestValue)(updateMeasurementsFor != null ? updateMeasurementsFor : id); + const handleResize = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => { + if (!resizeObserverConnected.current) { + // ResizeObserver invokes the `handleResize` callback as soon as `observe` is called, + // assuming the element is rendered and displayed. + resizeObserverConnected.current = true; + return; + } + + if (callbackId.current != null) { + clearTimeout(callbackId.current); + } + + callbackId.current = setTimeout(() => { + measureDroppableContainers(Array.isArray(ids.current) ? ids.current : [ids.current]); + callbackId.current = null; + }, resizeObserverTimeout); + }, //eslint-disable-next-line react-hooks/exhaustive-deps + [resizeObserverTimeout]); + const resizeObserver = useResizeObserver({ + callback: handleResize, + disabled: resizeObserverDisabled || !active + }); + const handleNodeChange = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((newElement, previousElement) => { + if (!resizeObserver) { + return; + } + + if (previousElement) { + resizeObserver.unobserve(previousElement); + resizeObserverConnected.current = false; + } + + if (newElement) { + resizeObserver.observe(newElement); + } + }, [resizeObserver]); + const [nodeRef, setNodeRef] = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useNodeRef)(handleNodeChange); + const dataRef = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useLatestValue)(data); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (!resizeObserver || !nodeRef.current) { + return; + } + + resizeObserver.disconnect(); + resizeObserverConnected.current = false; + resizeObserver.observe(nodeRef.current); + }, [nodeRef, resizeObserver]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + dispatch({ + type: Action.RegisterDroppable, + element: { + id, + key, + disabled, + node: nodeRef, + rect, + data: dataRef + } + }); + return () => dispatch({ + type: Action.UnregisterDroppable, + key, + id + }); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [id]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (disabled !== previous.current.disabled) { + dispatch({ + type: Action.SetDroppableDisabled, + id, + key, + disabled + }); + previous.current.disabled = disabled; + } + }, [id, key, disabled, dispatch]); + return { + active, + rect, + isOver: (over == null ? void 0 : over.id) === id, + node: nodeRef, + over, + setNodeRef + }; +} + +function AnimationManager(_ref) { + let { + animation, + children + } = _ref; + const [clonedChildren, setClonedChildren] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const [element, setElement] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const previousChildren = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.usePrevious)(children); + + if (!children && !clonedChildren && previousChildren) { + setClonedChildren(previousChildren); + } + + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + if (!element) { + return; + } + + const key = clonedChildren == null ? void 0 : clonedChildren.key; + const id = clonedChildren == null ? void 0 : clonedChildren.props.id; + + if (key == null || id == null) { + setClonedChildren(null); + return; + } + + Promise.resolve(animation(id, element)).then(() => { + setClonedChildren(null); + }); + }, [animation, clonedChildren, element]); + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, children, clonedChildren ? (0,react__WEBPACK_IMPORTED_MODULE_0__.cloneElement)(clonedChildren, { + ref: setElement + }) : null); +} + +const defaultTransform = { + x: 0, + y: 0, + scaleX: 1, + scaleY: 1 +}; +function NullifiedContextProvider(_ref) { + let { + children + } = _ref; + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(InternalContext.Provider, { + value: defaultInternalContext + }, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(ActiveDraggableContext.Provider, { + value: defaultTransform + }, children)); +} + +const baseStyles = { + position: 'fixed', + touchAction: 'none' +}; + +const defaultTransition = activatorEvent => { + const isKeyboardActivator = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isKeyboardEvent)(activatorEvent); + return isKeyboardActivator ? 'transform 250ms ease' : undefined; +}; + +const PositionedOverlay = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)((_ref, ref) => { + let { + as, + activatorEvent, + adjustScale, + children, + className, + rect, + style, + transform, + transition = defaultTransition + } = _ref; + + if (!rect) { + return null; + } + + const scaleAdjustedTransform = adjustScale ? transform : { ...transform, + scaleX: 1, + scaleY: 1 + }; + const styles = { ...baseStyles, + width: rect.width, + height: rect.height, + top: rect.top, + left: rect.left, + transform: _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.CSS.Transform.toString(scaleAdjustedTransform), + transformOrigin: adjustScale && activatorEvent ? getRelativeTransformOrigin(activatorEvent, rect) : undefined, + transition: typeof transition === 'function' ? transition(activatorEvent) : transition, + ...style + }; + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(as, { + className, + style: styles, + ref + }, children); +}); + +const defaultDropAnimationSideEffects = options => _ref => { + let { + active, + dragOverlay + } = _ref; + const originalStyles = {}; + const { + styles, + className + } = options; + + if (styles != null && styles.active) { + for (const [key, value] of Object.entries(styles.active)) { + if (value === undefined) { + continue; + } + + originalStyles[key] = active.node.style.getPropertyValue(key); + active.node.style.setProperty(key, value); + } + } + + if (styles != null && styles.dragOverlay) { + for (const [key, value] of Object.entries(styles.dragOverlay)) { + if (value === undefined) { + continue; + } + + dragOverlay.node.style.setProperty(key, value); + } + } + + if (className != null && className.active) { + active.node.classList.add(className.active); + } + + if (className != null && className.dragOverlay) { + dragOverlay.node.classList.add(className.dragOverlay); + } + + return function cleanup() { + for (const [key, value] of Object.entries(originalStyles)) { + active.node.style.setProperty(key, value); + } + + if (className != null && className.active) { + active.node.classList.remove(className.active); + } + }; +}; + +const defaultKeyframeResolver = _ref2 => { + let { + transform: { + initial, + final + } + } = _ref2; + return [{ + transform: _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.CSS.Transform.toString(initial) + }, { + transform: _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.CSS.Transform.toString(final) + }]; +}; + +const defaultDropAnimationConfiguration = { + duration: 250, + easing: 'ease', + keyframes: defaultKeyframeResolver, + sideEffects: /*#__PURE__*/defaultDropAnimationSideEffects({ + styles: { + active: { + opacity: '0' + } + } + }) +}; +function useDropAnimation(_ref3) { + let { + config, + draggableNodes, + droppableContainers, + measuringConfiguration + } = _ref3; + return (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useEvent)((id, node) => { + if (config === null) { + return; + } + + const activeDraggable = draggableNodes.get(id); + + if (!activeDraggable) { + return; + } + + const activeNode = activeDraggable.node.current; + + if (!activeNode) { + return; + } + + const measurableNode = getMeasurableNode(node); + + if (!measurableNode) { + return; + } + + const { + transform + } = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.getWindow)(node).getComputedStyle(node); + const parsedTransform = parseTransform(transform); + + if (!parsedTransform) { + return; + } + + const animation = typeof config === 'function' ? config : createDefaultDropAnimation(config); + scrollIntoViewIfNeeded(activeNode, measuringConfiguration.draggable.measure); + return animation({ + active: { + id, + data: activeDraggable.data, + node: activeNode, + rect: measuringConfiguration.draggable.measure(activeNode) + }, + draggableNodes, + dragOverlay: { + node, + rect: measuringConfiguration.dragOverlay.measure(measurableNode) + }, + droppableContainers, + measuringConfiguration, + transform: parsedTransform + }); + }); +} + +function createDefaultDropAnimation(options) { + const { + duration, + easing, + sideEffects, + keyframes + } = { ...defaultDropAnimationConfiguration, + ...options + }; + return _ref4 => { + let { + active, + dragOverlay, + transform, + ...rest + } = _ref4; + + if (!duration) { + // Do not animate if animation duration is zero. + return; + } + + const delta = { + x: dragOverlay.rect.left - active.rect.left, + y: dragOverlay.rect.top - active.rect.top + }; + const scale = { + scaleX: transform.scaleX !== 1 ? active.rect.width * transform.scaleX / dragOverlay.rect.width : 1, + scaleY: transform.scaleY !== 1 ? active.rect.height * transform.scaleY / dragOverlay.rect.height : 1 + }; + const finalTransform = { + x: transform.x - delta.x, + y: transform.y - delta.y, + ...scale + }; + const animationKeyframes = keyframes({ ...rest, + active, + dragOverlay, + transform: { + initial: transform, + final: finalTransform + } + }); + const [firstKeyframe] = animationKeyframes; + const lastKeyframe = animationKeyframes[animationKeyframes.length - 1]; + + if (JSON.stringify(firstKeyframe) === JSON.stringify(lastKeyframe)) { + // The start and end keyframes are the same, infer that there is no animation needed. + return; + } + + const cleanup = sideEffects == null ? void 0 : sideEffects({ + active, + dragOverlay, + ...rest + }); + const animation = dragOverlay.node.animate(animationKeyframes, { + duration, + easing, + fill: 'forwards' + }); + return new Promise(resolve => { + animation.onfinish = () => { + cleanup == null ? void 0 : cleanup(); + resolve(); + }; + }); + }; +} + +let key = 0; +function useKey(id) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + if (id == null) { + return; + } + + key++; + return key; + }, [id]); +} + +const DragOverlay = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().memo(_ref => { + let { + adjustScale = false, + children, + dropAnimation: dropAnimationConfig, + style, + transition, + modifiers, + wrapperElement = 'div', + className, + zIndex = 999 + } = _ref; + const { + activatorEvent, + active, + activeNodeRect, + containerNodeRect, + draggableNodes, + droppableContainers, + dragOverlay, + over, + measuringConfiguration, + scrollableAncestors, + scrollableAncestorRects, + windowRect + } = useDndContext(); + const transform = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(ActiveDraggableContext); + const key = useKey(active == null ? void 0 : active.id); + const modifiedTransform = applyModifiers(modifiers, { + activatorEvent, + active, + activeNodeRect, + containerNodeRect, + draggingNodeRect: dragOverlay.rect, + over, + overlayNodeRect: dragOverlay.rect, + scrollableAncestors, + scrollableAncestorRects, + transform, + windowRect + }); + const initialRect = useInitialValue(activeNodeRect); + const dropAnimation = useDropAnimation({ + config: dropAnimationConfig, + draggableNodes, + droppableContainers, + measuringConfiguration + }); // We need to wait for the active node to be measured before connecting the drag overlay ref + // otherwise collisions can be computed against a mispositioned drag overlay + + const ref = initialRect ? dragOverlay.setRef : undefined; + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(NullifiedContextProvider, null, react__WEBPACK_IMPORTED_MODULE_0___default().createElement(AnimationManager, { + animation: dropAnimation + }, active && key ? react__WEBPACK_IMPORTED_MODULE_0___default().createElement(PositionedOverlay, { + key: key, + id: active.id, + ref: ref, + as: wrapperElement, + activatorEvent: activatorEvent, + adjustScale: adjustScale, + className: className, + transition: transition, + rect: initialRect, + style: { + zIndex, + ...style + }, + transform: modifiedTransform + }, children) : null)); +}); + + +//# sourceMappingURL=core.esm.js.map + + +/***/ }), + +/***/ "./node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js": +/*!***************************************************************!*\ + !*** ./node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { + +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ createSnapModifier: function() { return /* binding */ createSnapModifier; }, +/* harmony export */ restrictToFirstScrollableAncestor: function() { return /* binding */ restrictToFirstScrollableAncestor; }, +/* harmony export */ restrictToHorizontalAxis: function() { return /* binding */ restrictToHorizontalAxis; }, +/* harmony export */ restrictToParentElement: function() { return /* binding */ restrictToParentElement; }, +/* harmony export */ restrictToVerticalAxis: function() { return /* binding */ restrictToVerticalAxis; }, +/* harmony export */ restrictToWindowEdges: function() { return /* binding */ restrictToWindowEdges; }, +/* harmony export */ snapCenterToCursor: function() { return /* binding */ snapCenterToCursor; } +/* harmony export */ }); +/* harmony import */ var _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @dnd-kit/utilities */ "./node_modules/@dnd-kit/utilities/dist/utilities.esm.js"); + + +function createSnapModifier(gridSize) { + return _ref => { + let { + transform + } = _ref; + return { ...transform, + x: Math.ceil(transform.x / gridSize) * gridSize, + y: Math.ceil(transform.y / gridSize) * gridSize + }; + }; +} + +const restrictToHorizontalAxis = _ref => { + let { + transform + } = _ref; + return { ...transform, + y: 0 + }; +}; + +function restrictToBoundingRect(transform, rect, boundingRect) { + const value = { ...transform + }; + + if (rect.top + transform.y <= boundingRect.top) { + value.y = boundingRect.top - rect.top; + } else if (rect.bottom + transform.y >= boundingRect.top + boundingRect.height) { + value.y = boundingRect.top + boundingRect.height - rect.bottom; + } + + if (rect.left + transform.x <= boundingRect.left) { + value.x = boundingRect.left - rect.left; + } else if (rect.right + transform.x >= boundingRect.left + boundingRect.width) { + value.x = boundingRect.left + boundingRect.width - rect.right; + } + + return value; +} + +const restrictToParentElement = _ref => { + let { + containerNodeRect, + draggingNodeRect, + transform + } = _ref; + + if (!draggingNodeRect || !containerNodeRect) { + return transform; + } + + return restrictToBoundingRect(transform, draggingNodeRect, containerNodeRect); +}; + +const restrictToFirstScrollableAncestor = _ref => { + let { + draggingNodeRect, + transform, + scrollableAncestorRects + } = _ref; + const firstScrollableAncestorRect = scrollableAncestorRects[0]; + + if (!draggingNodeRect || !firstScrollableAncestorRect) { + return transform; + } + + return restrictToBoundingRect(transform, draggingNodeRect, firstScrollableAncestorRect); +}; + +const restrictToVerticalAxis = _ref => { + let { + transform + } = _ref; + return { ...transform, + x: 0 + }; +}; + +const restrictToWindowEdges = _ref => { + let { + transform, + draggingNodeRect, + windowRect + } = _ref; + + if (!draggingNodeRect || !windowRect) { + return transform; + } + + return restrictToBoundingRect(transform, draggingNodeRect, windowRect); +}; + +const snapCenterToCursor = _ref => { + let { + activatorEvent, + draggingNodeRect, + transform + } = _ref; + + if (draggingNodeRect && activatorEvent) { + const activatorCoordinates = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_0__.getEventCoordinates)(activatorEvent); + + if (!activatorCoordinates) { + return transform; + } + + const offsetX = activatorCoordinates.x - draggingNodeRect.left; + const offsetY = activatorCoordinates.y - draggingNodeRect.top; + return { ...transform, + x: transform.x + offsetX - draggingNodeRect.width / 2, + y: transform.y + offsetY - draggingNodeRect.height / 2 + }; + } + + return transform; +}; + + +//# sourceMappingURL=modifiers.esm.js.map + + +/***/ }), + +/***/ "./node_modules/@dnd-kit/sortable/dist/sortable.esm.js": +/*!*************************************************************!*\ + !*** ./node_modules/@dnd-kit/sortable/dist/sortable.esm.js ***! + \*************************************************************/ +/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { + +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ SortableContext: function() { return /* binding */ SortableContext; }, +/* harmony export */ arrayMove: function() { return /* binding */ arrayMove; }, +/* harmony export */ arraySwap: function() { return /* binding */ arraySwap; }, +/* harmony export */ defaultAnimateLayoutChanges: function() { return /* binding */ defaultAnimateLayoutChanges; }, +/* harmony export */ defaultNewIndexGetter: function() { return /* binding */ defaultNewIndexGetter; }, +/* harmony export */ hasSortableData: function() { return /* binding */ hasSortableData; }, +/* harmony export */ horizontalListSortingStrategy: function() { return /* binding */ horizontalListSortingStrategy; }, +/* harmony export */ rectSortingStrategy: function() { return /* binding */ rectSortingStrategy; }, +/* harmony export */ rectSwappingStrategy: function() { return /* binding */ rectSwappingStrategy; }, +/* harmony export */ sortableKeyboardCoordinates: function() { return /* binding */ sortableKeyboardCoordinates; }, +/* harmony export */ useSortable: function() { return /* binding */ useSortable; }, +/* harmony export */ verticalListSortingStrategy: function() { return /* binding */ verticalListSortingStrategy; } +/* harmony export */ }); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); +/* harmony import */ var _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @dnd-kit/core */ "./node_modules/@dnd-kit/core/dist/core.esm.js"); +/* harmony import */ var _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @dnd-kit/utilities */ "./node_modules/@dnd-kit/utilities/dist/utilities.esm.js"); + + + + +/** + * Move an array item to a different position. Returns a new array with the item moved to the new position. + */ +function arrayMove(array, from, to) { + const newArray = array.slice(); + newArray.splice(to < 0 ? newArray.length + to : to, 0, newArray.splice(from, 1)[0]); + return newArray; +} + +/** + * Swap an array item to a different position. Returns a new array with the item swapped to the new position. + */ +function arraySwap(array, from, to) { + const newArray = array.slice(); + newArray[from] = array[to]; + newArray[to] = array[from]; + return newArray; +} + +function getSortedRects(items, rects) { + return items.reduce((accumulator, id, index) => { + const rect = rects.get(id); + + if (rect) { + accumulator[index] = rect; + } + + return accumulator; + }, Array(items.length)); +} + +function isValidIndex(index) { + return index !== null && index >= 0; +} + +function itemsEqual(a, b) { + if (a === b) { + return true; + } + + if (a.length !== b.length) { + return false; + } + + for (let i = 0; i < a.length; i++) { + if (a[i] !== b[i]) { + return false; + } + } + + return true; +} + +function normalizeDisabled(disabled) { + if (typeof disabled === 'boolean') { + return { + draggable: disabled, + droppable: disabled + }; + } + + return disabled; +} + +// To-do: We should be calculating scale transformation +const defaultScale = { + scaleX: 1, + scaleY: 1 +}; +const horizontalListSortingStrategy = _ref => { + var _rects$activeIndex; + + let { + rects, + activeNodeRect: fallbackActiveRect, + activeIndex, + overIndex, + index + } = _ref; + const activeNodeRect = (_rects$activeIndex = rects[activeIndex]) != null ? _rects$activeIndex : fallbackActiveRect; + + if (!activeNodeRect) { + return null; + } + + const itemGap = getItemGap(rects, index, activeIndex); + + if (index === activeIndex) { + const newIndexRect = rects[overIndex]; + + if (!newIndexRect) { + return null; + } + + return { + x: activeIndex < overIndex ? newIndexRect.left + newIndexRect.width - (activeNodeRect.left + activeNodeRect.width) : newIndexRect.left - activeNodeRect.left, + y: 0, + ...defaultScale + }; + } + + if (index > activeIndex && index <= overIndex) { + return { + x: -activeNodeRect.width - itemGap, + y: 0, + ...defaultScale + }; + } + + if (index < activeIndex && index >= overIndex) { + return { + x: activeNodeRect.width + itemGap, + y: 0, + ...defaultScale + }; + } + + return { + x: 0, + y: 0, + ...defaultScale + }; +}; + +function getItemGap(rects, index, activeIndex) { + const currentRect = rects[index]; + const previousRect = rects[index - 1]; + const nextRect = rects[index + 1]; + + if (!currentRect || !previousRect && !nextRect) { + return 0; + } + + if (activeIndex < index) { + return previousRect ? currentRect.left - (previousRect.left + previousRect.width) : nextRect.left - (currentRect.left + currentRect.width); + } + + return nextRect ? nextRect.left - (currentRect.left + currentRect.width) : currentRect.left - (previousRect.left + previousRect.width); +} + +const rectSortingStrategy = _ref => { + let { + rects, + activeIndex, + overIndex, + index + } = _ref; + const newRects = arrayMove(rects, overIndex, activeIndex); + const oldRect = rects[index]; + const newRect = newRects[index]; + + if (!newRect || !oldRect) { + return null; + } + + return { + x: newRect.left - oldRect.left, + y: newRect.top - oldRect.top, + scaleX: newRect.width / oldRect.width, + scaleY: newRect.height / oldRect.height + }; +}; + +const rectSwappingStrategy = _ref => { + let { + activeIndex, + index, + rects, + overIndex + } = _ref; + let oldRect; + let newRect; + + if (index === activeIndex) { + oldRect = rects[index]; + newRect = rects[overIndex]; + } + + if (index === overIndex) { + oldRect = rects[index]; + newRect = rects[activeIndex]; + } + + if (!newRect || !oldRect) { + return null; + } + + return { + x: newRect.left - oldRect.left, + y: newRect.top - oldRect.top, + scaleX: newRect.width / oldRect.width, + scaleY: newRect.height / oldRect.height + }; +}; + +// To-do: We should be calculating scale transformation +const defaultScale$1 = { + scaleX: 1, + scaleY: 1 +}; +const verticalListSortingStrategy = _ref => { + var _rects$activeIndex; + + let { + activeIndex, + activeNodeRect: fallbackActiveRect, + index, + rects, + overIndex + } = _ref; + const activeNodeRect = (_rects$activeIndex = rects[activeIndex]) != null ? _rects$activeIndex : fallbackActiveRect; + + if (!activeNodeRect) { + return null; + } + + if (index === activeIndex) { + const overIndexRect = rects[overIndex]; + + if (!overIndexRect) { + return null; + } + + return { + x: 0, + y: activeIndex < overIndex ? overIndexRect.top + overIndexRect.height - (activeNodeRect.top + activeNodeRect.height) : overIndexRect.top - activeNodeRect.top, + ...defaultScale$1 + }; + } + + const itemGap = getItemGap$1(rects, index, activeIndex); + + if (index > activeIndex && index <= overIndex) { + return { + x: 0, + y: -activeNodeRect.height - itemGap, + ...defaultScale$1 + }; + } + + if (index < activeIndex && index >= overIndex) { + return { + x: 0, + y: activeNodeRect.height + itemGap, + ...defaultScale$1 + }; + } + + return { + x: 0, + y: 0, + ...defaultScale$1 + }; +}; + +function getItemGap$1(clientRects, index, activeIndex) { + const currentRect = clientRects[index]; + const previousRect = clientRects[index - 1]; + const nextRect = clientRects[index + 1]; + + if (!currentRect) { + return 0; + } + + if (activeIndex < index) { + return previousRect ? currentRect.top - (previousRect.top + previousRect.height) : nextRect ? nextRect.top - (currentRect.top + currentRect.height) : 0; + } + + return nextRect ? nextRect.top - (currentRect.top + currentRect.height) : previousRect ? currentRect.top - (previousRect.top + previousRect.height) : 0; +} + +const ID_PREFIX = 'Sortable'; +const Context = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createContext({ + activeIndex: -1, + containerId: ID_PREFIX, + disableTransforms: false, + items: [], + overIndex: -1, + useDragOverlay: false, + sortedRects: [], + strategy: rectSortingStrategy, + disabled: { + draggable: false, + droppable: false + } +}); +function SortableContext(_ref) { + let { + children, + id, + items: userDefinedItems, + strategy = rectSortingStrategy, + disabled: disabledProp = false + } = _ref; + const { + active, + dragOverlay, + droppableRects, + over, + measureDroppableContainers + } = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.useDndContext)(); + const containerId = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useUniqueId)(ID_PREFIX, id); + const useDragOverlay = Boolean(dragOverlay.rect !== null); + const items = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => userDefinedItems.map(item => typeof item === 'object' && 'id' in item ? item.id : item), [userDefinedItems]); + const isDragging = active != null; + const activeIndex = active ? items.indexOf(active.id) : -1; + const overIndex = over ? items.indexOf(over.id) : -1; + const previousItemsRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(items); + const itemsHaveChanged = !itemsEqual(items, previousItemsRef.current); + const disableTransforms = overIndex !== -1 && activeIndex === -1 || itemsHaveChanged; + const disabled = normalizeDisabled(disabledProp); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + if (itemsHaveChanged && isDragging) { + measureDroppableContainers(items); + } + }, [itemsHaveChanged, items, isDragging, measureDroppableContainers]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + previousItemsRef.current = items; + }, [items]); + const contextValue = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + activeIndex, + containerId, + disabled, + disableTransforms, + items, + overIndex, + useDragOverlay, + sortedRects: getSortedRects(items, droppableRects), + strategy + }), // eslint-disable-next-line react-hooks/exhaustive-deps + [activeIndex, containerId, disabled.draggable, disabled.droppable, disableTransforms, items, overIndex, droppableRects, useDragOverlay, strategy]); + return react__WEBPACK_IMPORTED_MODULE_0___default().createElement(Context.Provider, { + value: contextValue + }, children); +} + +const defaultNewIndexGetter = _ref => { + let { + id, + items, + activeIndex, + overIndex + } = _ref; + return arrayMove(items, activeIndex, overIndex).indexOf(id); +}; +const defaultAnimateLayoutChanges = _ref2 => { + let { + containerId, + isSorting, + wasDragging, + index, + items, + newIndex, + previousItems, + previousContainerId, + transition + } = _ref2; + + if (!transition || !wasDragging) { + return false; + } + + if (previousItems !== items && index === newIndex) { + return false; + } + + if (isSorting) { + return true; + } + + return newIndex !== index && containerId === previousContainerId; +}; +const defaultTransition = { + duration: 200, + easing: 'ease' +}; +const transitionProperty = 'transform'; +const disabledTransition = /*#__PURE__*/_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.CSS.Transition.toString({ + property: transitionProperty, + duration: 0, + easing: 'linear' +}); +const defaultAttributes = { + roleDescription: 'sortable' +}; + +/* + * When the index of an item changes while sorting, + * we need to temporarily disable the transforms + */ + +function useDerivedTransform(_ref) { + let { + disabled, + index, + node, + rect + } = _ref; + const [derivedTransform, setDerivedtransform] = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(null); + const previousIndex = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(index); + (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useIsomorphicLayoutEffect)(() => { + if (!disabled && index !== previousIndex.current && node.current) { + const initial = rect.current; + + if (initial) { + const current = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.getClientRect)(node.current, { + ignoreTransform: true + }); + const delta = { + x: initial.left - current.left, + y: initial.top - current.top, + scaleX: initial.width / current.width, + scaleY: initial.height / current.height + }; + + if (delta.x || delta.y) { + setDerivedtransform(delta); + } + } + } + + if (index !== previousIndex.current) { + previousIndex.current = index; + } + }, [disabled, index, node, rect]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (derivedTransform) { + setDerivedtransform(null); + } + }, [derivedTransform]); + return derivedTransform; +} + +function useSortable(_ref) { + let { + animateLayoutChanges = defaultAnimateLayoutChanges, + attributes: userDefinedAttributes, + disabled: localDisabled, + data: customData, + getNewIndex = defaultNewIndexGetter, + id, + strategy: localStrategy, + resizeObserverConfig, + transition = defaultTransition + } = _ref; + const { + items, + containerId, + activeIndex, + disabled: globalDisabled, + disableTransforms, + sortedRects, + overIndex, + useDragOverlay, + strategy: globalStrategy + } = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(Context); + const disabled = normalizeLocalDisabled(localDisabled, globalDisabled); + const index = items.indexOf(id); + const data = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => ({ + sortable: { + containerId, + index, + items + }, + ...customData + }), [containerId, customData, index, items]); + const itemsAfterCurrentSortable = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => items.slice(items.indexOf(id)), [items, id]); + const { + rect, + node, + isOver, + setNodeRef: setDroppableNodeRef + } = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.useDroppable)({ + id, + data, + disabled: disabled.droppable, + resizeObserverConfig: { + updateMeasurementsFor: itemsAfterCurrentSortable, + ...resizeObserverConfig + } + }); + const { + active, + activatorEvent, + activeNodeRect, + attributes, + setNodeRef: setDraggableNodeRef, + listeners, + isDragging, + over, + setActivatorNodeRef, + transform + } = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.useDraggable)({ + id, + data, + attributes: { ...defaultAttributes, + ...userDefinedAttributes + }, + disabled: disabled.draggable + }); + const setNodeRef = (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.useCombinedRefs)(setDroppableNodeRef, setDraggableNodeRef); + const isSorting = Boolean(active); + const displaceItem = isSorting && !disableTransforms && isValidIndex(activeIndex) && isValidIndex(overIndex); + const shouldDisplaceDragSource = !useDragOverlay && isDragging; + const dragSourceDisplacement = shouldDisplaceDragSource && displaceItem ? transform : null; + const strategy = localStrategy != null ? localStrategy : globalStrategy; + const finalTransform = displaceItem ? dragSourceDisplacement != null ? dragSourceDisplacement : strategy({ + rects: sortedRects, + activeNodeRect, + activeIndex, + overIndex, + index + }) : null; + const newIndex = isValidIndex(activeIndex) && isValidIndex(overIndex) ? getNewIndex({ + id, + items, + activeIndex, + overIndex + }) : index; + const activeId = active == null ? void 0 : active.id; + const previous = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)({ + activeId, + items, + newIndex, + containerId + }); + const itemsHaveChanged = items !== previous.current.items; + const shouldAnimateLayoutChanges = animateLayoutChanges({ + active, + containerId, + isDragging, + isSorting, + id, + index, + items, + newIndex: previous.current.newIndex, + previousItems: previous.current.items, + previousContainerId: previous.current.containerId, + transition, + wasDragging: previous.current.activeId != null + }); + const derivedTransform = useDerivedTransform({ + disabled: !shouldAnimateLayoutChanges, + index, + node, + rect + }); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (isSorting && previous.current.newIndex !== newIndex) { + previous.current.newIndex = newIndex; + } + + if (containerId !== previous.current.containerId) { + previous.current.containerId = containerId; + } + + if (items !== previous.current.items) { + previous.current.items = items; + } + }, [isSorting, newIndex, containerId, items]); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + if (activeId === previous.current.activeId) { + return; + } + + if (activeId != null && previous.current.activeId == null) { + previous.current.activeId = activeId; + return; + } + + const timeoutId = setTimeout(() => { + previous.current.activeId = activeId; + }, 50); + return () => clearTimeout(timeoutId); + }, [activeId]); + return { + active, + activeIndex, + attributes, + data, + rect, + index, + newIndex, + items, + isOver, + isSorting, + isDragging, + listeners, + node, + overIndex, + over, + setNodeRef, + setActivatorNodeRef, + setDroppableNodeRef, + setDraggableNodeRef, + transform: derivedTransform != null ? derivedTransform : finalTransform, + transition: getTransition() + }; + + function getTransition() { + if ( // Temporarily disable transitions for a single frame to set up derived transforms + derivedTransform || // Or to prevent items jumping to back to their "new" position when items change + itemsHaveChanged && previous.current.newIndex === index) { + return disabledTransition; + } + + if (shouldDisplaceDragSource && !(0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.isKeyboardEvent)(activatorEvent) || !transition) { + return undefined; + } + + if (isSorting || shouldAnimateLayoutChanges) { + return _dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.CSS.Transition.toString({ ...transition, + property: transitionProperty + }); + } + + return undefined; + } +} + +function normalizeLocalDisabled(localDisabled, globalDisabled) { + var _localDisabled$dragga, _localDisabled$droppa; + + if (typeof localDisabled === 'boolean') { + return { + draggable: localDisabled, + // Backwards compatibility + droppable: false + }; + } + + return { + draggable: (_localDisabled$dragga = localDisabled == null ? void 0 : localDisabled.draggable) != null ? _localDisabled$dragga : globalDisabled.draggable, + droppable: (_localDisabled$droppa = localDisabled == null ? void 0 : localDisabled.droppable) != null ? _localDisabled$droppa : globalDisabled.droppable + }; +} + +function hasSortableData(entry) { + if (!entry) { + return false; + } + + const data = entry.data.current; + + if (data && 'sortable' in data && typeof data.sortable === 'object' && 'containerId' in data.sortable && 'items' in data.sortable && 'index' in data.sortable) { + return true; + } + + return false; +} + +const directions = [_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Down, _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Right, _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Up, _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Left]; +const sortableKeyboardCoordinates = (event, _ref) => { + let { + context: { + active, + collisionRect, + droppableRects, + droppableContainers, + over, + scrollableAncestors + } + } = _ref; + + if (directions.includes(event.code)) { + event.preventDefault(); + + if (!active || !collisionRect) { + return; + } + + const filteredContainers = []; + droppableContainers.getEnabled().forEach(entry => { + if (!entry || entry != null && entry.disabled) { + return; + } + + const rect = droppableRects.get(entry.id); + + if (!rect) { + return; + } + + switch (event.code) { + case _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Down: + if (collisionRect.top < rect.top) { + filteredContainers.push(entry); + } + + break; + + case _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Up: + if (collisionRect.top > rect.top) { + filteredContainers.push(entry); + } + + break; + + case _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Left: + if (collisionRect.left > rect.left) { + filteredContainers.push(entry); + } + + break; + + case _dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.KeyboardCode.Right: + if (collisionRect.left < rect.left) { + filteredContainers.push(entry); + } + + break; + } + }); + const collisions = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.closestCorners)({ + active, + collisionRect: collisionRect, + droppableRects, + droppableContainers: filteredContainers, + pointerCoordinates: null + }); + let closestId = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.getFirstCollision)(collisions, 'id'); + + if (closestId === (over == null ? void 0 : over.id) && collisions.length > 1) { + closestId = collisions[1].id; + } + + if (closestId != null) { + const activeDroppable = droppableContainers.get(active.id); + const newDroppable = droppableContainers.get(closestId); + const newRect = newDroppable ? droppableRects.get(newDroppable.id) : null; + const newNode = newDroppable == null ? void 0 : newDroppable.node.current; + + if (newNode && newRect && activeDroppable && newDroppable) { + const newScrollAncestors = (0,_dnd_kit_core__WEBPACK_IMPORTED_MODULE_1__.getScrollableAncestors)(newNode); + const hasDifferentScrollAncestors = newScrollAncestors.some((element, index) => scrollableAncestors[index] !== element); + const hasSameContainer = isSameContainer(activeDroppable, newDroppable); + const isAfterActive = isAfter(activeDroppable, newDroppable); + const offset = hasDifferentScrollAncestors || !hasSameContainer ? { + x: 0, + y: 0 + } : { + x: isAfterActive ? collisionRect.width - newRect.width : 0, + y: isAfterActive ? collisionRect.height - newRect.height : 0 + }; + const rectCoordinates = { + x: newRect.left, + y: newRect.top + }; + const newCoordinates = offset.x && offset.y ? rectCoordinates : (0,_dnd_kit_utilities__WEBPACK_IMPORTED_MODULE_2__.subtract)(rectCoordinates, offset); + return newCoordinates; + } + } + } + + return undefined; +}; + +function isSameContainer(a, b) { + if (!hasSortableData(a) || !hasSortableData(b)) { + return false; + } + + return a.data.current.sortable.containerId === b.data.current.sortable.containerId; +} + +function isAfter(a, b) { + if (!hasSortableData(a) || !hasSortableData(b)) { + return false; + } + + if (!isSameContainer(a, b)) { + return false; + } + + return a.data.current.sortable.index < b.data.current.sortable.index; +} + + +//# sourceMappingURL=sortable.esm.js.map + + +/***/ }), + +/***/ "./node_modules/@dnd-kit/utilities/dist/utilities.esm.js": +/*!***************************************************************!*\ + !*** ./node_modules/@dnd-kit/utilities/dist/utilities.esm.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) { + +__webpack_require__.r(__webpack_exports__); +/* harmony export */ __webpack_require__.d(__webpack_exports__, { +/* harmony export */ CSS: function() { return /* binding */ CSS; }, +/* harmony export */ add: function() { return /* binding */ add; }, +/* harmony export */ canUseDOM: function() { return /* binding */ canUseDOM; }, +/* harmony export */ findFirstFocusableNode: function() { return /* binding */ findFirstFocusableNode; }, +/* harmony export */ getEventCoordinates: function() { return /* binding */ getEventCoordinates; }, +/* harmony export */ getOwnerDocument: function() { return /* binding */ getOwnerDocument; }, +/* harmony export */ getWindow: function() { return /* binding */ getWindow; }, +/* harmony export */ hasViewportRelativeCoordinates: function() { return /* binding */ hasViewportRelativeCoordinates; }, +/* harmony export */ isDocument: function() { return /* binding */ isDocument; }, +/* harmony export */ isHTMLElement: function() { return /* binding */ isHTMLElement; }, +/* harmony export */ isKeyboardEvent: function() { return /* binding */ isKeyboardEvent; }, +/* harmony export */ isNode: function() { return /* binding */ isNode; }, +/* harmony export */ isSVGElement: function() { return /* binding */ isSVGElement; }, +/* harmony export */ isTouchEvent: function() { return /* binding */ isTouchEvent; }, +/* harmony export */ isWindow: function() { return /* binding */ isWindow; }, +/* harmony export */ subtract: function() { return /* binding */ subtract; }, +/* harmony export */ useCombinedRefs: function() { return /* binding */ useCombinedRefs; }, +/* harmony export */ useEvent: function() { return /* binding */ useEvent; }, +/* harmony export */ useInterval: function() { return /* binding */ useInterval; }, +/* harmony export */ useIsomorphicLayoutEffect: function() { return /* binding */ useIsomorphicLayoutEffect; }, +/* harmony export */ useLatestValue: function() { return /* binding */ useLatestValue; }, +/* harmony export */ useLazyMemo: function() { return /* binding */ useLazyMemo; }, +/* harmony export */ useNodeRef: function() { return /* binding */ useNodeRef; }, +/* harmony export */ usePrevious: function() { return /* binding */ usePrevious; }, +/* harmony export */ useUniqueId: function() { return /* binding */ useUniqueId; } +/* harmony export */ }); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react"); +/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__); + + +function useCombinedRefs() { + for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) { + refs[_key] = arguments[_key]; + } + + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => node => { + refs.forEach(ref => ref(node)); + }, // eslint-disable-next-line react-hooks/exhaustive-deps + refs); +} + +// https://github.com/facebook/react/blob/master/packages/shared/ExecutionEnvironment.js +const canUseDOM = typeof window !== 'undefined' && typeof window.document !== 'undefined' && typeof window.document.createElement !== 'undefined'; + +function isWindow(element) { + const elementString = Object.prototype.toString.call(element); + return elementString === '[object Window]' || // In Electron context the Window object serializes to [object global] + elementString === '[object global]'; +} + +function isNode(node) { + return 'nodeType' in node; +} + +function getWindow(target) { + var _target$ownerDocument, _target$ownerDocument2; + + if (!target) { + return window; + } + + if (isWindow(target)) { + return target; + } + + if (!isNode(target)) { + return window; + } + + return (_target$ownerDocument = (_target$ownerDocument2 = target.ownerDocument) == null ? void 0 : _target$ownerDocument2.defaultView) != null ? _target$ownerDocument : window; +} + +function isDocument(node) { + const { + Document + } = getWindow(node); + return node instanceof Document; +} + +function isHTMLElement(node) { + if (isWindow(node)) { + return false; + } + + return node instanceof getWindow(node).HTMLElement; +} + +function isSVGElement(node) { + return node instanceof getWindow(node).SVGElement; +} + +function getOwnerDocument(target) { + if (!target) { + return document; + } + + if (isWindow(target)) { + return target.document; + } + + if (!isNode(target)) { + return document; + } + + if (isDocument(target)) { + return target; + } + + if (isHTMLElement(target) || isSVGElement(target)) { + return target.ownerDocument; + } + + return document; +} + +/** + * A hook that resolves to useEffect on the server and useLayoutEffect on the client + * @param callback {function} Callback function that is invoked when the dependencies of the hook change + */ + +const useIsomorphicLayoutEffect = canUseDOM ? react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect : react__WEBPACK_IMPORTED_MODULE_0__.useEffect; + +function useEvent(handler) { + const handlerRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(handler); + useIsomorphicLayoutEffect(() => { + handlerRef.current = handler; + }); + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () { + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + return handlerRef.current == null ? void 0 : handlerRef.current(...args); + }, []); +} + +function useInterval() { + const intervalRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const set = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)((listener, duration) => { + intervalRef.current = setInterval(listener, duration); + }, []); + const clear = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(() => { + if (intervalRef.current !== null) { + clearInterval(intervalRef.current); + intervalRef.current = null; + } + }, []); + return [set, clear]; +} + +function useLatestValue(value, dependencies) { + if (dependencies === void 0) { + dependencies = [value]; + } + + const valueRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(value); + useIsomorphicLayoutEffect(() => { + if (valueRef.current !== value) { + valueRef.current = value; + } + }, dependencies); + return valueRef; +} + +function useLazyMemo(callback, dependencies) { + const valueRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(); + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + const newValue = callback(valueRef.current); + valueRef.current = newValue; + return newValue; + }, // eslint-disable-next-line react-hooks/exhaustive-deps + [...dependencies]); +} + +function useNodeRef(onChange) { + const onChangeHandler = useEvent(onChange); + const node = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null); + const setNodeRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(element => { + if (element !== node.current) { + onChangeHandler == null ? void 0 : onChangeHandler(element, node.current); + } + + node.current = element; + }, //eslint-disable-next-line + []); + return [node, setNodeRef]; +} + +function usePrevious(value) { + const ref = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(); + (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(() => { + ref.current = value; + }, [value]); + return ref.current; +} + +let ids = {}; +function useUniqueId(prefix, value) { + return (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(() => { + if (value) { + return value; + } + + const id = ids[prefix] == null ? 0 : ids[prefix] + 1; + ids[prefix] = id; + return prefix + "-" + id; + }, [prefix, value]); +} + +function createAdjustmentFn(modifier) { + return function (object) { + for (var _len = arguments.length, adjustments = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + adjustments[_key - 1] = arguments[_key]; + } + + return adjustments.reduce((accumulator, adjustment) => { + const entries = Object.entries(adjustment); + + for (const [key, valueAdjustment] of entries) { + const value = accumulator[key]; + + if (value != null) { + accumulator[key] = value + modifier * valueAdjustment; + } + } + + return accumulator; + }, { ...object + }); + }; +} + +const add = /*#__PURE__*/createAdjustmentFn(1); +const subtract = /*#__PURE__*/createAdjustmentFn(-1); + +function hasViewportRelativeCoordinates(event) { + return 'clientX' in event && 'clientY' in event; +} + +function isKeyboardEvent(event) { + if (!event) { + return false; + } + + const { + KeyboardEvent + } = getWindow(event.target); + return KeyboardEvent && event instanceof KeyboardEvent; +} + +function isTouchEvent(event) { + if (!event) { + return false; + } + + const { + TouchEvent + } = getWindow(event.target); + return TouchEvent && event instanceof TouchEvent; +} + +/** + * Returns the normalized x and y coordinates for mouse and touch events. + */ + +function getEventCoordinates(event) { + if (isTouchEvent(event)) { + if (event.touches && event.touches.length) { + const { + clientX: x, + clientY: y + } = event.touches[0]; + return { + x, + y + }; + } else if (event.changedTouches && event.changedTouches.length) { + const { + clientX: x, + clientY: y + } = event.changedTouches[0]; + return { + x, + y + }; + } + } + + if (hasViewportRelativeCoordinates(event)) { + return { + x: event.clientX, + y: event.clientY + }; + } + + return null; +} + +const CSS = /*#__PURE__*/Object.freeze({ + Translate: { + toString(transform) { + if (!transform) { + return; + } + + const { + x, + y + } = transform; + return "translate3d(" + (x ? Math.round(x) : 0) + "px, " + (y ? Math.round(y) : 0) + "px, 0)"; + } + + }, + Scale: { + toString(transform) { + if (!transform) { + return; + } + + const { + scaleX, + scaleY + } = transform; + return "scaleX(" + scaleX + ") scaleY(" + scaleY + ")"; + } + + }, + Transform: { + toString(transform) { + if (!transform) { + return; + } + + return [CSS.Translate.toString(transform), CSS.Scale.toString(transform)].join(' '); + } + + }, + Transition: { + toString(_ref) { + let { + property, + duration, + easing + } = _ref; + return property + " " + duration + "ms " + easing; + } + + } +}); + +const SELECTOR = 'a,frame,iframe,input:not([type=hidden]):not(:disabled),select:not(:disabled),textarea:not(:disabled),button:not(:disabled),*[tabindex]'; +function findFirstFocusableNode(element) { + if (element.matches(SELECTOR)) { + return element; + } + + return element.querySelector(SELECTOR); +} + + +//# sourceMappingURL=utilities.esm.js.map + + +/***/ }), + +/***/ "./client/src/boot/index.js": +/*!**********************************!*\ + !*** ./client/src/boot/index.js ***! + \**********************************/ +/***/ (function(__unused_webpack_module, __unused_webpack_exports, __webpack_require__) { + + + +var _registerComponents = _interopRequireDefault(__webpack_require__(/*! boot/registerComponents */ "./client/src/boot/registerComponents.js")); +var _registerTransforms = _interopRequireDefault(__webpack_require__(/*! boot/registerTransforms */ "./client/src/boot/registerTransforms.js")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +window.document.addEventListener('DOMContentLoaded', () => { + (0, _registerComponents.default)(); + (0, _registerTransforms.default)(); +}); + +/***/ }), + +/***/ "./client/src/boot/registerComponents.js": +/*!***********************************************!*\ + !*** ./client/src/boot/registerComponents.js ***! + \***********************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _Injector = _interopRequireDefault(__webpack_require__(/*! lib/Injector */ "lib/Injector")); +var _Element = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/Element */ "./client/src/components/ElementEditor/Element.js")); +var _ElementActions = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/ElementActions */ "./client/src/components/ElementEditor/ElementActions.js")); +var _ElementEditor = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js")); +var _ElementList = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/ElementList */ "./client/src/components/ElementEditor/ElementList.js")); +var _Toolbar = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/Toolbar */ "./client/src/components/ElementEditor/Toolbar.js")); +var _AddNewButton = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/AddNewButton */ "./client/src/components/ElementEditor/AddNewButton.js")); +var _Header = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/Header */ "./client/src/components/ElementEditor/Header.js")); +var _Content = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/Content */ "./client/src/components/ElementEditor/Content.js")); +var _Summary = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/Summary */ "./client/src/components/ElementEditor/Summary.js")); +var _InlineEditForm = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/InlineEditForm */ "./client/src/components/ElementEditor/InlineEditForm.js")); +var _AddElementPopover = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/AddElementPopover */ "./client/src/components/ElementEditor/AddElementPopover.js")); +var _HoverBar = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/HoverBar */ "./client/src/components/ElementEditor/HoverBar.js")); +var _DragPositionIndicator = _interopRequireDefault(__webpack_require__(/*! components/ElementEditor/DragPositionIndicator */ "./client/src/components/ElementEditor/DragPositionIndicator.js")); +var _TextCheckboxGroupField = _interopRequireDefault(__webpack_require__(/*! components/TextCheckboxGroupField/TextCheckboxGroupField */ "./client/src/components/TextCheckboxGroupField/TextCheckboxGroupField.js")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +var _default = () => { + _Injector.default.component.registerMany({ + ElementEditor: _ElementEditor.default, + ElementToolbar: _Toolbar.default, + ElementAddNewButton: _AddNewButton.default, + ElementList: _ElementList.default, + Element: _Element.default, + ElementActions: _ElementActions.default, + ElementHeader: _Header.default, + ElementContent: _Content.default, + ElementSummary: _Summary.default, + ElementInlineEditForm: _InlineEditForm.default, + AddElementPopover: _AddElementPopover.default, + HoverBar: _HoverBar.default, + DragPositionIndicator: _DragPositionIndicator.default, + TextCheckboxGroupField: _TextCheckboxGroupField.default + }); +}; +exports["default"] = _default; + +/***/ }), + +/***/ "./client/src/boot/registerTransforms.js": +/*!***********************************************!*\ + !*** ./client/src/boot/registerTransforms.js ***! + \***********************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _Injector = _interopRequireDefault(__webpack_require__(/*! lib/Injector */ "lib/Injector")); +var _HistoricElementView = _interopRequireDefault(__webpack_require__(/*! components/HistoricElementView/HistoricElementView */ "./client/src/components/HistoricElementView/HistoricElementView.js")); +var _revertToBlockVersionRequest = _interopRequireDefault(__webpack_require__(/*! state/history/revertToBlockVersionRequest */ "./client/src/state/history/revertToBlockVersionRequest.js")); +var _ArchiveAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/ArchiveAction */ "./client/src/components/ElementActions/ArchiveAction.js")); +var _DuplicateAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/DuplicateAction */ "./client/src/components/ElementActions/DuplicateAction.js")); +var _SaveAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/SaveAction */ "./client/src/components/ElementActions/SaveAction.js")); +var _PublishAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/PublishAction */ "./client/src/components/ElementActions/PublishAction.js")); +var _UnpublishAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/UnpublishAction */ "./client/src/components/ElementActions/UnpublishAction.js")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +var _default = () => { + _Injector.default.transform('elemental-fieldgroup', updater => { + updater.component('FieldGroup.HistoryViewer.VersionDetail', _HistoricElementView.default, 'HistoricElement'); + }, { + after: 'field-holders' + }); + _Injector.default.transform('blocks-history-revert', updater => { + updater.component('HistoryViewerToolbar.VersionedAdmin.HistoryViewer.Element.HistoryViewerVersionDetail', _revertToBlockVersionRequest.default, 'BlockRevertRequest'); + }); + _Injector.default.transform('element-actions', updater => { + updater.component('ElementActions', _SaveAction.default, 'ElementActionsWithSave'); + updater.component('ElementActions', _PublishAction.default, 'ElementActionsWithPublish'); + updater.component('ElementActions', _UnpublishAction.default, 'ElementActionsWithUnpublish'); + updater.component('ElementActions', _DuplicateAction.default, 'ElementActionsWithDuplicate'); + updater.component('ElementActions', _ArchiveAction.default, 'ElementActionsWithArchive'); + }); +}; +exports["default"] = _default; + +/***/ }), + +/***/ "./client/src/components/ElementActions/AbstractAction.js": +/*!****************************************************************!*\ + !*** ./client/src/components/ElementActions/AbstractAction.js ***! + \****************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var _reactstrap = __webpack_require__(/*! reactstrap */ "reactstrap"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const AbstractAction = props => { + const { + className, + title, + label + } = props; + const itemProps = { + className: (0, _classnames.default)(className, 'dropdown-item'), + ...props + }; + return _react.default.createElement(_reactstrap.DropdownItem, itemProps, label || title); +}; +AbstractAction.propTypes = { + disabled: _propTypes.default.bool, + className: _propTypes.default.string, + onClick: _propTypes.default.func, + title: _propTypes.default.string, + name: _propTypes.default.string, + type: _elementTypeType.elementTypeType, + active: _propTypes.default.bool, + label: _propTypes.default.string +}; +AbstractAction.defaultProps = { + disabled: false +}; +var _default = exports["default"] = AbstractAction; + +/***/ }), + +/***/ "./client/src/components/ElementActions/ArchiveAction.js": +/*!***************************************************************!*\ + !*** ./client/src/components/ElementActions/ArchiveAction.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _ElementEditor = __webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js"); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var _getJsonErrorMessage = _interopRequireDefault(__webpack_require__(/*! lib/getJsonErrorMessage */ "lib/getJsonErrorMessage")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const ArchiveAction = MenuComponent => props => { + const { + fetchElements + } = (0, _react.useContext)(_ElementEditor.ElementEditorContext); + const handleClick = event => { + event.stopPropagation(); + const isPublished = props.element.isPublished; + let archiveMessage = _i18n.default._t('ElementArchiveAction.CONFIRM_DELETE', 'Are you sure you want to send this block to the archive?'); + if (isPublished) { + archiveMessage = _i18n.default._t('ElementArchiveAction.CONFIRM_DELETE_AND_UNPUBLISH', 'Warning: This block will be unpublished before being sent to the archive. Are you sure you want to proceed?'); + } + if (!window.confirm(archiveMessage)) { + return; + } + const id = props.element.id; + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/delete`; + _Backend.default.post(url, { + id + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => fetchElements()).catch(async err => { + const message = await (0, _getJsonErrorMessage.default)(err); + window.jQuery.noticeAdd({ + text: message, + stay: true, + type: 'error' + }); + }); + }; + const disabled = props.element.canDelete !== undefined && !props.element.canDelete; + const label = _i18n.default._t('ElementArchiveAction.ARCHIVE', 'Archive'); + const title = disabled ? _i18n.default._t('ElementArchiveAction.ARCHIVE_PERMISSION_DENY', 'Archive, insufficient permissions') : label; + const newProps = { + label, + title, + disabled, + className: 'element-editor__actions-archive', + onClick: handleClick, + toggle: props.toggle + }; + return _react.default.createElement(MenuComponent, props, props.children, _react.default.createElement(_AbstractAction.default, newProps)); +}; +exports.Component = ArchiveAction; +var _default = exports["default"] = ArchiveAction; + +/***/ }), + +/***/ "./client/src/components/ElementActions/DuplicateAction.js": +/*!*****************************************************************!*\ + !*** ./client/src/components/ElementActions/DuplicateAction.js ***! + \*****************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _ElementEditor = __webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js"); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var _getJsonErrorMessage = _interopRequireDefault(__webpack_require__(/*! lib/getJsonErrorMessage */ "lib/getJsonErrorMessage")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const DuplicateAction = MenuComponent => props => { + const { + fetchElements + } = (0, _react.useContext)(_ElementEditor.ElementEditorContext); + if (props.type.broken) { + return _react.default.createElement(MenuComponent, props); + } + const handleClick = event => { + event.stopPropagation(); + const id = props.element.id; + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/duplicate`; + _Backend.default.post(url, { + id + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => fetchElements()).catch(async err => { + const message = await (0, _getJsonErrorMessage.default)(err); + window.jQuery.noticeAdd({ + text: message, + stay: true, + type: 'error' + }); + }); + }; + const disabled = props.element.canCreate !== undefined && !props.element.canCreate; + const label = _i18n.default._t('ElementArchiveAction.DUPLICATE', 'Duplicate'); + const title = disabled ? _i18n.default._t('ElementArchiveAction.DUPLICATE_PERMISSION_DENY', 'Duplicate, insufficient permissions') : label; + const newProps = { + label, + title, + disabled, + className: 'element-editor__actions-duplicate', + onClick: handleClick, + toggle: props.toggle + }; + return _react.default.createElement(MenuComponent, props, props.children, _react.default.createElement(_AbstractAction.default, newProps)); +}; +exports.Component = DuplicateAction; +var _default = exports["default"] = DuplicateAction; + +/***/ }), + +/***/ "./client/src/components/ElementActions/PublishAction.js": +/*!***************************************************************!*\ + !*** ./client/src/components/ElementActions/PublishAction.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _Element = __webpack_require__(/*! components/ElementEditor/Element */ "./client/src/components/ElementEditor/Element.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const PublishAction = MenuComponent => props => { + const { + formDirty, + onPublishButtonClick + } = (0, _react.useContext)(_Element.ElementContext); + const { + element + } = props; + const handleClick = event => { + event.stopPropagation(); + onPublishButtonClick(); + }; + const disabled = props.element.canPublish !== undefined && !props.element.canPublish; + const label = _i18n.default._t('ElementArchiveAction.PUBLISH', 'Publish'); + const title = disabled ? _i18n.default._t('ElementArchiveAction.PUBLISH_PERMISSION_DENY', 'Publish, insufficient permissions') : label; + const newProps = { + label, + title, + disabled, + className: 'element-editor__actions-publish', + onClick: handleClick, + toggle: props.toggle + }; + if (props.type.broken) { + return _react.default.createElement(MenuComponent, props); + } + return _react.default.createElement(MenuComponent, props, props.children, (formDirty || !element.isLiveVersion) && _react.default.createElement(_AbstractAction.default, newProps)); +}; +exports.Component = PublishAction; +var _default = exports["default"] = PublishAction; + +/***/ }), + +/***/ "./client/src/components/ElementActions/SaveAction.js": +/*!************************************************************!*\ + !*** ./client/src/components/ElementActions/SaveAction.js ***! + \************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _Element = __webpack_require__(/*! components/ElementEditor/Element */ "./client/src/components/ElementEditor/Element.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const SaveAction = MenuComponent => props => { + const { + onSaveButtonClick, + formDirty + } = (0, _react.useContext)(_Element.ElementContext); + const handleClick = event => { + event.stopPropagation(); + onSaveButtonClick(); + }; + const newProps = { + title: _i18n.default._t('ElementSaveAction.SAVE', 'Save'), + className: 'element-editor__actions-save', + onClick: handleClick, + toggle: props.toggle + }; + if (!props.expandable || props.type.broken) { + return _react.default.createElement(MenuComponent, props); + } + return _react.default.createElement(MenuComponent, props, props.children, formDirty && _react.default.createElement(_AbstractAction.default, newProps)); +}; +exports.Component = SaveAction; +var _default = exports["default"] = SaveAction; + +/***/ }), + +/***/ "./client/src/components/ElementActions/UnpublishAction.js": +/*!*****************************************************************!*\ + !*** ./client/src/components/ElementActions/UnpublishAction.js ***! + \*****************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _ElementEditor = __webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js"); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const UnpublishAction = MenuComponent => props => { + const { + fetchElements + } = (0, _react.useContext)(_ElementEditor.ElementEditorContext); + if (props.type.broken) { + return _react.default.createElement(MenuComponent, props); + } + const reportUnpublicationStatus = (type, title, success) => { + const noTitle = _i18n.default.inject(_i18n.default._t('ElementHeader.NOTITLE', 'Untitled {type} block'), { + type + }); + const successMessage = _i18n.default.inject(_i18n.default._t('ElementUnpublishAction.SUCCESS_NOTIFICATION', 'Removed \'{title}\' from the published page'), { + title: title || noTitle + }); + const errorMessage = _i18n.default.inject(_i18n.default._t('ElementUnpublishAction.ERROR_NOTIFICATION', 'Error unpublishing \'{title}\''), { + title: title || noTitle + }); + window.jQuery.noticeAdd({ + text: success ? successMessage : errorMessage, + stay: false, + type: success ? 'success' : 'error' + }); + }; + const unpublishElement = () => { + const id = props.element.id; + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/unpublish`; + return _Backend.default.post(url, { + id + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => fetchElements()).then(() => reportUnpublicationStatus(props.type.title, props.element.title, true)).catch(() => reportUnpublicationStatus(props.type.title, props.element.title, false)); + }; + const handleClick = event => { + event.stopPropagation(); + unpublishElement(); + }; + const disabled = props.element.canUnpublish !== undefined && !props.element.canUnpublish; + const label = _i18n.default._t('ElementArchiveAction.UNPUBLISH', 'Unpublish'); + const title = disabled ? _i18n.default._t('ElementArchiveAction.UNPUBLISH_PERMISSION_DENY', 'Unpublish, insufficient permissions') : label; + const newProps = { + label, + title, + disabled, + className: 'element-editor__actions-unpublish', + onClick: handleClick, + toggle: props.toggle + }; + return _react.default.createElement(MenuComponent, props, props.children, props.element.isPublished && _react.default.createElement(_AbstractAction.default, newProps)); +}; +exports.Component = UnpublishAction; +var _default = exports["default"] = UnpublishAction; + +/***/ }), + +/***/ "./client/src/components/ElementEditor/AddElementPopover.js": +/*!******************************************************************!*\ + !*** ./client/src/components/ElementEditor/AddElementPopover.js ***! + \******************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _reactRedux = __webpack_require__(/*! react-redux */ "react-redux"); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var toastsActions = _interopRequireWildcard(__webpack_require__(/*! state/toasts/ToastsActions */ "state/toasts/ToastsActions")); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +var _ElementEditor = __webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js"); +var _getJsonErrorMessage = _interopRequireDefault(__webpack_require__(/*! lib/getJsonErrorMessage */ "lib/getJsonErrorMessage")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class AddElementPopover extends _react.Component { + constructor(props) { + super(props); + this.handleToggle = this.handleToggle.bind(this); + AddElementPopover.contextType = _ElementEditor.ElementEditorContext; + } + getElementButtonClickHandler(elementType) { + return event => { + event.preventDefault(); + const sectionConfigKey = 'DNADesign\\Elemental\\Controllers\\ElementalAreaController'; + const url = `${_Config.default.getSection(sectionConfigKey).controllerLink}/api/create`; + _Backend.default.post(url, { + elementClass: elementType.class, + elementalAreaID: this.props.areaId, + insertAfterElementID: this.props.insertAfterElement + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => { + const { + fetchElements + } = this.context; + return fetchElements(); + }).then(() => { + const preview = window.jQuery('.cms-preview'); + preview.entwine('ss.preview')._loadUrl(preview.find('iframe').attr('src')); + }).catch(async err => { + const message = await (0, _getJsonErrorMessage.default)(err); + this.props.actions.toasts.error(message); + }); + this.handleToggle(); + }; + } + handleToggle() { + const { + toggle + } = this.props; + toggle(); + } + render() { + const { + PopoverOptionSetComponent, + elementTypes, + container, + extraClass, + isOpen, + placement, + target + } = this.props; + const popoverClassNames = (0, _classnames.default)('element-editor-add-element', extraClass); + const buttons = elementTypes.map(elementType => ({ + content: elementType.title, + key: elementType.name, + className: (0, _classnames.default)(elementType.icon, 'btn--icon-xl', 'element-editor-add-element__button'), + onClick: this.getElementButtonClickHandler(elementType) + })); + return _react.default.createElement(PopoverOptionSetComponent, { + buttons: buttons, + searchPlaceholder: _i18n.default._t('ElementAddElementPopover.SEARCH_BLOCKS', 'Search blocks'), + extraClass: popoverClassNames, + container: container, + isOpen: isOpen, + placement: placement, + target: target, + toggle: this.handleToggle + }); + } +} +exports.Component = AddElementPopover; +AddElementPopover.propTypes = { + container: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func, _propTypes.default.object]), + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + extraClass: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.array, _propTypes.default.object]), + isOpen: _propTypes.default.bool.isRequired, + placement: _propTypes.default.string, + target: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.func, _propTypes.default.object]).isRequired, + toggle: _propTypes.default.func.isRequired, + areaId: _propTypes.default.number.isRequired, + insertAfterElement: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]) +}; +function mapDispatchToProps(dispatch) { + return { + actions: { + toasts: (0, _redux.bindActionCreators)(toastsActions, dispatch) + } + }; +} +const InjectedComponent = (0, _Injector.inject)(['PopoverOptionSet'], PopoverOptionSetComponent => ({ + PopoverOptionSetComponent +}), () => 'ElementEditor')(AddElementPopover); +var _default = exports["default"] = (0, _redux.compose)((0, _reactRedux.connect)(null, mapDispatchToProps))(InjectedComponent); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/AddNewButton.js": +/*!*************************************************************!*\ + !*** ./client/src/components/ElementEditor/AddNewButton.js ***! + \*************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _reactstrap = __webpack_require__(/*! reactstrap */ "reactstrap"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class AddNewButton extends _react.Component { + constructor(props) { + super(props); + this.toggle = this.toggle.bind(this); + this.state = { + popoverOpen: false + }; + } + toggle() { + this.setState(prevState => ({ + popoverOpen: !prevState.popoverOpen + })); + } + render() { + const { + AddElementPopoverComponent, + elementTypes, + areaId + } = this.props; + const buttonAttributes = { + id: `ElementalArea${areaId}_AddButton`, + color: 'primary', + onClick: this.toggle, + className: 'font-icon-plus' + }; + return _react.default.createElement("div", null, _react.default.createElement(_reactstrap.Button, buttonAttributes, _i18n.default._t('ElementAddNewButton.ADD_BLOCK', 'Add block')), _react.default.createElement(AddElementPopoverComponent, { + placement: "bottom-start", + target: buttonAttributes.id, + isOpen: this.state.popoverOpen, + elementTypes: elementTypes, + toggle: this.toggle, + areaId: areaId, + insertAfterElement: 0 + })); + } +} +exports.Component = AddNewButton; +AddNewButton.defaultProps = {}; +AddNewButton.propTypes = { + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + areaId: _propTypes.default.number.isRequired +}; +var _default = exports["default"] = (0, _Injector.inject)(['AddElementPopover'], AddElementPopoverComponent => ({ + AddElementPopoverComponent +}), () => 'ElementEditor.ElementList.AddNewButton')(AddNewButton); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/Content.js": +/*!********************************************************!*\ + !*** ./client/src/components/ElementEditor/Content.js ***! + \********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _redux = __webpack_require__(/*! redux */ "redux"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class Content extends _react.PureComponent { + render() { + const { + id, + fileUrl, + fileTitle, + content, + previewExpanded, + InlineEditFormComponent, + SummaryComponent, + activeTab, + onFormInit, + handleLoadingError, + formDirty, + broken, + onFormSchemaSubmitResponse, + ensureFormRendered, + formHasRendered + } = this.props; + const notVisible = !previewExpanded && (ensureFormRendered || formHasRendered); + const extraClass = { + 'element-editor-editform--collapsed': !previewExpanded, + 'element-editor-editform--rendered-not-visible': notVisible + }; + return _react.default.createElement("div", { + className: "element-editor-content" + }, !previewExpanded && _react.default.createElement(SummaryComponent, { + content: content, + fileUrl: fileUrl, + fileTitle: fileTitle, + broken: broken + }), (previewExpanded || ensureFormRendered || formHasRendered) && _react.default.createElement(InlineEditFormComponent, { + extraClass: extraClass, + onClick: event => event.stopPropagation(), + elementId: id, + activeTab: activeTab, + onFormInit: onFormInit, + handleLoadingError: handleLoadingError, + onFormSchemaSubmitResponse: onFormSchemaSubmitResponse, + notVisible: notVisible + }), formDirty && _react.default.createElement("input", { + type: "hidden", + name: "change-tracker", + className: "element-form-dirty-state", + value: "1" + })); + } +} +exports.Component = Content; +Content.propTypes = { + id: _propTypes.default.number, + content: _propTypes.default.string, + fileUrl: _propTypes.default.string, + fileTitle: _propTypes.default.string, + previewExpanded: _propTypes.default.bool, + SummaryComponent: _propTypes.default.elementType, + InlineEditFormComponent: _propTypes.default.elementType, + handleLoadingError: _propTypes.default.func, + broken: _propTypes.default.bool, + onFormSchemaSubmitResponse: _propTypes.default.func, + onFormInit: _propTypes.default.func, + ensureFormRendered: _propTypes.default.bool, + formHasRendered: _propTypes.default.bool, + formDirty: _propTypes.default.object +}; +Content.defaultProps = {}; +var _default = exports["default"] = (0, _redux.compose)((0, _Injector.inject)(['ElementSummary', 'ElementInlineEditForm'], (SummaryComponent, InlineEditFormComponent) => ({ + SummaryComponent, + InlineEditFormComponent +}), () => 'ElementEditor.ElementList.Element'))(Content); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/DragPositionIndicator.js": +/*!**********************************************************************!*\ + !*** ./client/src/components/ElementEditor/DragPositionIndicator.js ***! + \**********************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class DragPositionIndicator extends _react.PureComponent { + render() { + return _react.default.createElement("div", { + className: "elemental-editor-drag-indicator" + }, _react.default.createElement("div", { + className: "elemental-editor-drag-indicator__ball" + })); + } +} +var _default = exports["default"] = DragPositionIndicator; + +/***/ }), + +/***/ "./client/src/components/ElementEditor/Element.js": +/*!********************************************************!*\ + !*** ./client/src/components/ElementEditor/Element.js ***! + \********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.ElementContext = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _elementType = __webpack_require__(/*! types/elementType */ "./client/src/types/elementType.js"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var _reactRedux = __webpack_require__(/*! react-redux */ "react-redux"); +var _reduxForm = __webpack_require__(/*! redux-form */ "redux-form"); +var _loadElementFormStateName = __webpack_require__(/*! state/editor/loadElementFormStateName */ "./client/src/state/editor/loadElementFormStateName.js"); +var _loadElementSchemaValue = __webpack_require__(/*! state/editor/loadElementSchemaValue */ "./client/src/state/editor/loadElementSchemaValue.js"); +var TabsActions = _interopRequireWildcard(__webpack_require__(/*! state/tabs/TabsActions */ "state/tabs/TabsActions")); +var _sortable = __webpack_require__(/*! @dnd-kit/sortable */ "./node_modules/@dnd-kit/sortable/dist/sortable.esm.js"); +var _utilities = __webpack_require__(/*! @dnd-kit/utilities */ "./node_modules/@dnd-kit/utilities/dist/utilities.esm.js"); +var toastsActions = _interopRequireWildcard(__webpack_require__(/*! state/toasts/ToastsActions */ "state/toasts/ToastsActions")); +var _UnsavedFormsActions = __webpack_require__(/*! state/unsavedForms/UnsavedFormsActions */ "state/unsavedForms/UnsavedFormsActions"); +var _ElementEditor = __webpack_require__(/*! components/ElementEditor/ElementEditor */ "./client/src/components/ElementEditor/ElementEditor.js"); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +const ElementContext = exports.ElementContext = (0, _react.createContext)(null); +const Element = props => { + const [previewExpanded, setPreviewExpanded] = (0, _react.useState)(false); + const [initialTab, setInitialTab] = (0, _react.useState)(''); + const [loadingError, setLoadingError] = (0, _react.useState)(false); + const [newTitle, setNewTitle] = (0, _react.useState)(props.element.title); + const [justClickedPublishButton, setJustClickedPublishButton] = (0, _react.useState)(false); + const [doSaveElement, setDoSaveElement] = (0, _react.useState)(false); + const [doPublishElement, setDoPublishElement] = (0, _react.useState)(false); + const [doPublishElementAfterSave, setDoPublishElementAfterSave] = (0, _react.useState)(false); + const [ensureFormRendered, setEnsureFormRendered] = (0, _react.useState)(false); + const [formHasRendered, setFormHasRendered] = (0, _react.useState)(false); + const [doDispatchAddFormChanged, setDoDispatchAddFormChanged] = (0, _react.useState)(false); + const [hasUnsavedChanges, setHasUnsavedChanges] = (0, _react.useState)(false); + const { + fetchElements + } = (0, _react.useContext)(_ElementEditor.ElementEditorContext); + const { + attributes, + listeners, + setNodeRef, + transform, + transition, + isDragging, + isOver, + over + } = (0, _sortable.useSortable)({ + id: props.element.id + }); + const style = { + transform: _utilities.CSS.Transform.toString(transform), + transition + }; + (0, _react.useEffect)(() => { + const formDirty = typeof props.formDirty !== 'undefined'; + if (formDirty && !hasUnsavedChanges) { + setHasUnsavedChanges(true); + } + }, [props.formDirty]); + (0, _react.useEffect)(() => { + props.onChangeHasUnsavedChanges(hasUnsavedChanges); + }, [hasUnsavedChanges]); + (0, _react.useEffect)(() => { + if (props.saveElement && hasUnsavedChanges && !doSaveElement) { + setDoSaveElement(true); + } + }, [props.saveElement, hasUnsavedChanges, props.increment]); + (0, _react.useEffect)(() => { + if (justClickedPublishButton && formHasRendered) { + setJustClickedPublishButton(false); + if (hasUnsavedChanges) { + props.submitForm(); + setDoPublishElementAfterSave(true); + } else { + setDoPublishElement(true); + } + } + }, [justClickedPublishButton, formHasRendered]); + (0, _react.useEffect)(() => { + if (doDispatchAddFormChanged) { + setDoDispatchAddFormChanged(false); + props.dispatchAddFormChanged(); + } + }, [doDispatchAddFormChanged]); + const getNoTitle = () => _i18n.default.inject(_i18n.default._t('ElementHeader.NOTITLE', 'Untitled {type} block'), { + type: props.type.title + }); + const showSavedElementToast = elementTitle => { + const title = elementTitle || getNoTitle(); + const message = _i18n.default.inject(_i18n.default._t('ElementSaveAction.SUCCESS_NOTIFICATION', 'Saved \'{title}\' successfully'), { + title + }); + props.actions.toasts.success(message); + }; + const showPublishedElementToast = wasError => { + const title = newTitle || getNoTitle(); + if (wasError) { + const message = _i18n.default.inject(_i18n.default._t('ElementPublishAction.ERROR_NOTIFICATION', 'Error publishing \'{title}\''), { + title + }); + props.actions.toasts.error(message); + } else { + const message = _i18n.default.inject(_i18n.default._t('ElementPublishAction.SUCCESS_NOTIFICATION', 'Published \'{title}\' successfully'), { + title + }); + props.actions.toasts.success(message); + } + }; + const handleAfterPublish = wasError => { + showPublishedElementToast(wasError); + setDoPublishElement(false); + setDoPublishElementAfterSave(false); + fetchElements().then(() => { + setTimeout(() => props.dispatchRemoveFormChanged(), 250); + }); + }; + (0, _react.useEffect)(() => { + if (formHasRendered && doSaveElement) { + props.submitForm(); + setDoSaveElement(false); + } + }, [formHasRendered, doSaveElement]); + (0, _react.useEffect)(() => { + if (formHasRendered && doPublishElement) { + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/publish`; + _Backend.default.post(url, { + id: props.element.id + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => handleAfterPublish(false)).catch(() => handleAfterPublish(true)); + } + }, [formHasRendered, doPublishElement]); + const getVersionedStateClassName = () => { + const { + element + } = props; + const baseClassName = 'element-editor__element'; + if (!element.isPublished) { + return `${baseClassName}--draft`; + } + if (element.isPublished && !element.isLiveVersion) { + return `${baseClassName}--modified`; + } + return `${baseClassName}--published`; + }; + const getLinkTitle = type => { + if (type.broken) { + return _i18n.default._t('ElementalElement.ARCHIVE_BROKEN', 'Archive this block'); + } + return _i18n.default.inject(_i18n.default._t('ElementalElement.TITLE', 'Edit this {type} block'), { + type: type.title + }); + }; + const getSummary = (element, type) => { + if (type.broken) { + return element.title ? _i18n.default.inject(_i18n.default._t('ElementalElement.BROKEN_DESCRIPTION_TITLE', 'This block had the title "{title}". It is broken and will not display on the front-end. You can archive it to remove it from this elemental area.'), { + title: element.title + }) : _i18n.default._t('ElementalElement.BROKEN_DESCRIPTION', 'This block is broken and will not display on the front-end. You can archive it to remove it from this elemental area.'); + } + return element.blockSchema.content; + }; + const handleLoadingError = () => { + setLoadingError(true); + }; + const updateFormTab = activeTab => { + const { + tabSetName, + onActivateTab + } = props; + if (!initialTab) { + setInitialTab(activeTab); + } + if (activeTab || initialTab) { + onActivateTab(tabSetName, activeTab || initialTab); + } else { + const defaultFirstTab = 'Main'; + onActivateTab(tabSetName, defaultFirstTab); + } + }; + const handleTabClick = toBeActiveTab => { + const { + activeTab + } = props; + if (toBeActiveTab !== activeTab && !loadingError) { + setPreviewExpanded(true); + updateFormTab(toBeActiveTab); + } + }; + const handleExpand = event => { + const { + type, + link + } = props; + if (type.broken) { + return; + } + if (event.target.type === 'button') { + event.stopPropagation(); + return; + } + if (type.inlineEditable && !loadingError) { + setPreviewExpanded(!previewExpanded); + return; + } + window.location = link; + }; + const handleKeyUp = event => { + const { + nodeName + } = event.target; + if ((event.key === ' ' || event.key === 'Enter') && !['input', 'textarea'].includes(nodeName.toLowerCase())) { + handleExpand(event); + } + }; + const handleSaveButtonClick = () => { + setEnsureFormRendered(true); + setDoSaveElement(true); + }; + const handlePublishButtonClick = () => { + setJustClickedPublishButton(true); + setEnsureFormRendered(true); + }; + const handleFormInit = activeTab => { + updateFormTab(activeTab); + setFormHasRendered(true); + }; + const handleFormSchemaSubmitResponse = (formSchema, title) => { + const hasValidationErrors = formSchema.id.match(/\/schema\/elemental-area\/([0-9]+)/); + if (hasValidationErrors) { + if (props.type.inlineEditable) { + setPreviewExpanded(true); + } + setDoDispatchAddFormChanged(true); + if (doPublishElementAfterSave) { + setDoPublishElementAfterSave(false); + } + props.onAfterSubmitResponse(false); + return; + } + setHasUnsavedChanges(false); + setNewTitle(title); + if (doPublishElementAfterSave) { + setDoPublishElementAfterSave(false); + setDoPublishElement(true); + } + if (!doPublishElement && !doPublishElementAfterSave) { + showSavedElementToast(title); + } + props.onAfterSubmitResponse(true); + fetchElements(); + }; + const { + element, + type, + areaId, + HeaderComponent, + ContentComponent, + link, + activeTab, + formDirty + } = props; + if (!element.id) { + return null; + } + const elementClassNames = (0, _classnames.default)('element-editor__element', { + 'element-editor__element--broken': type.broken, + 'element-editor__element--expandable': type.inlineEditable && !type.broken, + 'element-editor__element--dragging': isDragging, + 'element-editor__element--dragged-over': isOver + }, getVersionedStateClassName()); + const providerValue = { + formDirty, + onPublishButtonClick: handlePublishButtonClick, + onSaveButtonClick: handleSaveButtonClick + }; + const content = _react.default.createElement("div", _extends({ + className: elementClassNames, + onClick: handleExpand, + onKeyUp: handleKeyUp, + role: "button", + tabIndex: 0, + title: getLinkTitle(type), + key: element.id, + ref: setNodeRef + }, attributes, listeners, { + style: style + }), _react.default.createElement(ElementContext.Provider, { + value: providerValue + }, _react.default.createElement(HeaderComponent, { + element: element, + type: type, + areaId: areaId, + expandable: type.inlineEditable, + link: link, + previewExpanded: previewExpanded, + handleEditTabsClick: handleTabClick, + activeTab: activeTab, + disableTooltip: isDragging + }), _react.default.createElement(ContentComponent, { + id: element.id, + fileUrl: element.blockSchema.fileURL, + fileTitle: element.blockSchema.fileTitle, + content: getSummary(element, type), + previewExpanded: previewExpanded && !isDragging, + ensureFormRendered: ensureFormRendered, + formHasRendered: formHasRendered, + activeTab: activeTab, + handleLoadingError: handleLoadingError, + broken: type.broken, + onFormSchemaSubmitResponse: handleFormSchemaSubmitResponse, + onFormInit: () => handleFormInit(activeTab) + }))); + return content; +}; +exports.Component = Element; +function mapStateToProps(state, ownProps) { + const elementId = ownProps.element.id; + const elementName = (0, _loadElementFormStateName.loadElementFormStateName)(elementId); + const elementFormSchema = (0, _loadElementSchemaValue.loadElementSchemaValue)('schemaUrl', elementId); + const filterFieldsForTabs = field => field.component === 'Tabs'; + const tabSet = state.form && state.form.formSchemas[elementFormSchema] && state.form.formSchemas[elementFormSchema].schema && state.form.formSchemas[elementFormSchema].schema.fields.find(filterFieldsForTabs); + const tabSetName = tabSet && tabSet.id; + const uniqueFieldId = `element.${elementName}__${tabSetName}`; + const formDirty = state.unsavedForms.find(unsaved => unsaved.name === `element.${elementName}`); + const activeTab = state.tabs && state.tabs.fields && state.tabs.fields[uniqueFieldId] && state.tabs.fields[uniqueFieldId].activeTab; + return { + tabSetName, + activeTab, + formDirty + }; +} +function mapDispatchToProps(dispatch, ownProps) { + const elementName = (0, _loadElementFormStateName.loadElementFormStateName)(ownProps.element.id); + return { + onActivateTab(tabSetName, activeTabName) { + dispatch(TabsActions.activateTab(`element.${elementName}__${tabSetName}`, activeTabName)); + }, + submitForm() { + ownProps.onBeforeSubmitForm(ownProps.element.id); + dispatch((0, _reduxForm.submit)(`element.${elementName}`)); + }, + dispatchAddFormChanged() { + dispatch((0, _UnsavedFormsActions.addFormChanged)(`element.${elementName}`)); + }, + dispatchRemoveFormChanged() { + dispatch((0, _UnsavedFormsActions.removeFormChanged)(`element.${elementName}`)); + }, + actions: { + toasts: (0, _redux.bindActionCreators)(toastsActions, dispatch) + } + }; +} +Element.propTypes = { + element: _elementType.elementType, + type: _elementTypeType.elementTypeType.isRequired, + areaId: _propTypes.default.number.isRequired, + link: _propTypes.default.string.isRequired, + activeTab: _propTypes.default.string, + tabSetName: _propTypes.default.string, + onActivateTab: _propTypes.default.func, + isOver: _propTypes.default.bool.isRequired, + saveElement: _propTypes.default.bool.isRequired, + onBeforeSubmitForm: _propTypes.default.func.isRequired, + onAfterSubmitResponse: _propTypes.default.func.isRequired, + increment: _propTypes.default.number.isRequired +}; +Element.defaultProps = { + element: null +}; +var _default = exports["default"] = (0, _redux.compose)((0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps), (0, _Injector.inject)(['ElementHeader', 'ElementContent'], (HeaderComponent, ContentComponent) => ({ + HeaderComponent, + ContentComponent +}), () => 'ElementEditor.ElementList.Element'))(Element); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/ElementActions.js": +/*!***************************************************************!*\ + !*** ./client/src/components/ElementEditor/ElementActions.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _reactstrap = __webpack_require__(/*! reactstrap */ "reactstrap"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _elementType = __webpack_require__(/*! types/elementType */ "./client/src/types/elementType.js"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _AbstractAction = _interopRequireDefault(__webpack_require__(/*! components/ElementActions/AbstractAction */ "./client/src/components/ElementActions/AbstractAction.js")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class ElementActions extends _react.Component { + constructor(props) { + super(props); + this.handleEditTabsClick = this.handleEditTabsClick.bind(this); + } + handleEditTabsClick(event) { + const { + handleEditTabsClick + } = this.props; + handleEditTabsClick(event.target.name); + } + renderEditTabs() { + const { + editTabs, + activeTab, + type, + expandable + } = this.props; + if (type.broken || !expandable || !editTabs || !editTabs.length) { + return null; + } + return editTabs.map(_ref => { + let { + name, + title + } = _ref; + return _react.default.createElement(_AbstractAction.default, { + key: name, + name: name, + title: title, + type: type, + onClick: this.handleEditTabsClick, + active: name === activeTab + }); + }); + } + renderDivider() { + const { + children, + editTabs, + expandable + } = this.props; + if (!expandable || !editTabs || !editTabs.length || _react.default.Children.count(children) === 0) { + return null; + } + return _react.default.createElement(_reactstrap.DropdownItem, { + divider: true, + role: "separator" + }); + } + render() { + const { + children, + id, + ActionMenuComponent + } = this.props; + const dropdownToggleClassNames = ['element-editor-header__actions-toggle', 'btn', 'btn-sm', 'btn--no-text', 'font-icon-dot-3']; + return _react.default.createElement(ActionMenuComponent, { + id: `element-editor-actions-${id}`, + className: "element-editor-header__actions-dropdown", + dropdownMenuProps: { + right: true + }, + dropdownToggleClassNames: dropdownToggleClassNames + }, this.renderEditTabs(), this.renderDivider(), children); + } +} +exports.Component = ElementActions; +ElementActions.propTypes = { + element: _elementType.elementType, + type: _elementTypeType.elementTypeType.isRequired, + areaId: _propTypes.default.number.isRequired, + activeTab: _propTypes.default.string, + editTabs: _propTypes.default.arrayOf(_propTypes.default.shape({ + title: _propTypes.default.string, + name: _propTypes.default.string + })), + handleEditTabsClick: _propTypes.default.func.isRequired, + expandable: _propTypes.default.bool +}; +ElementActions.defaultProps = { + editTabs: [], + expandable: true +}; +var _default = exports["default"] = (0, _redux.compose)((0, _Injector.inject)(['ActionMenu'], ActionMenuComponent => ({ + ActionMenuComponent +}), () => 'ElementEditor.ElementList.Element'))(ElementActions); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/ElementEditor.js": +/*!**************************************************************!*\ + !*** ./client/src/components/ElementEditor/ElementEditor.js ***! + \**************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.ElementEditorContext = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _reactRedux = __webpack_require__(/*! react-redux */ "react-redux"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _withDragDropContext = _interopRequireDefault(__webpack_require__(/*! lib/withDragDropContext */ "lib/withDragDropContext")); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var toastsActions = _interopRequireWildcard(__webpack_require__(/*! state/toasts/ToastsActions */ "state/toasts/ToastsActions")); +var _getJsonErrorMessage = _interopRequireDefault(__webpack_require__(/*! lib/getJsonErrorMessage */ "lib/getJsonErrorMessage")); +var _sortable = __webpack_require__(/*! @dnd-kit/sortable */ "./node_modules/@dnd-kit/sortable/dist/sortable.esm.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const ElementEditorContext = exports.ElementEditorContext = (0, _react.createContext)(null); +class ElementEditor extends _react.PureComponent { + constructor(props) { + super(props); + this.state = { + dragTargetElementId: null, + dragSpot: null, + elements: null, + isLoading: true + }; + this.handleDragStart = this.handleDragStart.bind(this); + this.handleDragEnd = this.handleDragEnd.bind(this); + this.fetchElements = this.fetchElements.bind(this); + } + handleDragStart(event) { + const { + active + } = event; + this.setState({ + dragging: active.id + }); + } + handleDragEnd(event) { + const { + active, + over + } = event; + const { + elements + } = this.state; + if (active.id === over.id) { + this.setState({ + dragging: false + }); + return; + } + const elementIDs = elements.map(e => e.id); + const fromIndex = elementIDs.indexOf(active.id); + const toIndex = elementIDs.indexOf(over.id); + const sortedElementIDs = (0, _sortable.arrayMove)(elementIDs, fromIndex, toIndex); + const afterBlockID = toIndex > 0 ? sortedElementIDs[toIndex - 1] : 0; + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/sort`; + _Backend.default.post(url, { + id: active.id, + afterBlockID + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }).then(() => this.fetchElements()).catch(async err => { + const message = await (0, _getJsonErrorMessage.default)(err); + this.props.actions.toasts.error(message); + }); + this.setState({ + dragging: false + }); + } + fetchElements() { + let doSetLoadingState = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true; + if (doSetLoadingState) { + this.setState(prevState => ({ + ...prevState, + isLoading: true + })); + } + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/readElements/${this.props.areaId}`; + return _Backend.default.get(url).then(async response => { + const responseJson = await response.json(); + this.setState(prevState => ({ + ...prevState, + elements: responseJson, + isLoading: false + })); + const preview = window.jQuery('.cms-preview'); + if (preview) { + preview.entwine('ss.preview')._loadUrl(preview.find('iframe').attr('src')); + } + }).catch(async err => { + this.setState({ + elements: [], + isLoading: false + }); + const message = await (0, _getJsonErrorMessage.default)(err); + this.props.actions.toasts.error(message); + }); + } + render() { + const { + ToolbarComponent, + ListComponent, + areaId, + elementTypes, + allowedElements, + sharedObject, + isLoading + } = this.props; + const { + dragging, + elements + } = this.state; + if (elements === null) { + this.fetchElements(false); + return null; + } + const allowedElementTypes = allowedElements.map(className => elementTypes.find(type => type.class === className)); + const providerValue = { + fetchElements: this.fetchElements + }; + return _react.default.createElement("div", { + className: "element-editor" + }, _react.default.createElement(ElementEditorContext.Provider, { + value: providerValue + }, _react.default.createElement(ToolbarComponent, { + elementTypes: allowedElementTypes, + areaId: areaId + }), _react.default.createElement(ListComponent, { + allowedElementTypes: allowedElementTypes, + elementTypes: elementTypes, + areaId: areaId, + onDragStart: this.handleDragStart, + onDragEnd: this.handleDragEnd, + dragging: dragging, + sharedObject: sharedObject, + elements: elements, + isLoading: isLoading + }))); + } +} +exports.Component = ElementEditor; +ElementEditor.propTypes = { + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + allowedElements: _propTypes.default.arrayOf(_propTypes.default.string).isRequired, + areaId: _propTypes.default.number.isRequired, + actions: _propTypes.default.shape({ + handleSortBlock: _propTypes.default.func + }) +}; +const params = [_withDragDropContext.default, (0, _Injector.inject)(['ElementToolbar', 'ElementList'], (ToolbarComponent, ListComponent) => ({ + ToolbarComponent, + ListComponent +}), () => 'ElementEditor')]; +function mapDispatchToProps(dispatch) { + return { + actions: { + toasts: (0, _redux.bindActionCreators)(toastsActions, dispatch) + } + }; +} +var _default = exports["default"] = (0, _redux.compose)((0, _reactRedux.connect)(null, mapDispatchToProps), ...params)(ElementEditor); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/ElementList.js": +/*!************************************************************!*\ + !*** ./client/src/components/ElementEditor/ElementList.js ***! + \************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _elementType = __webpack_require__(/*! types/elementType */ "./client/src/types/elementType.js"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _core = __webpack_require__(/*! @dnd-kit/core */ "./node_modules/@dnd-kit/core/dist/core.esm.js"); +var _sortable = __webpack_require__(/*! @dnd-kit/sortable */ "./node_modules/@dnd-kit/sortable/dist/sortable.esm.js"); +var _modifiers = __webpack_require__(/*! @dnd-kit/modifiers */ "./node_modules/@dnd-kit/modifiers/dist/modifiers.esm.js"); +var _dragHelpers = __webpack_require__(/*! lib/dragHelpers */ "./client/src/lib/dragHelpers.js"); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class ElementList extends _react.Component { + constructor(props) { + super(props); + this.resetState = this.resetState.bind(this); + this.handleBeforeSubmitForm = this.handleBeforeSubmitForm.bind(this); + this.handleAfterSubmitResponse = this.handleAfterSubmitResponse.bind(this); + this.state = { + saveAllElements: false, + increment: 0, + hasUnsavedChangesBlockIDs: {}, + validBlockIDs: {} + }; + this.props.sharedObject.setState = this.setState.bind(this); + } + componentDidMount() { + this.resetState({}, true); + } + componentDidUpdate(prevProps, prevState) { + if (!this.props.elements) { + return; + } + if (this.props.elements !== prevProps.elements) { + this.resetState(prevState, false); + return; + } + if (this.state.saveAllElements) { + const unsavedChangesBlockIDs = this.props.elements.map(block => parseInt(block.id, 10)).filter(blockID => this.state.hasUnsavedChangesBlockIDs[blockID]); + let allValidated = true; + for (let i = 0; i < unsavedChangesBlockIDs.length; i++) { + const blockID = unsavedChangesBlockIDs[i]; + if (this.state.validBlockIDs[blockID] === null) { + allValidated = false; + break; + } + } + if (allValidated) { + const allValid = unsavedChangesBlockIDs.every(blockID => this.state.validBlockIDs[blockID]); + const result = { + success: allValid, + reason: allValid ? '' : 'invalid' + }; + this.props.sharedObject.entwineResolve(result); + this.resetState(prevState, allValid); + this.setState({ + saveAllElements: false + }); + } + } + } + resetState(prevState, resetHasUnsavedChangesBlockIDs) { + const hasUnsavedChangesBlockIDs = {}; + const validBlockIDs = {}; + const elements = this.props.elements || []; + elements.forEach(element => { + const blockID = parseInt(element.id, 10); + if (resetHasUnsavedChangesBlockIDs) { + hasUnsavedChangesBlockIDs[blockID] = false; + } else if (prevState.hasUnsavedChangesBlockIDs.hasOwnProperty(blockID)) { + hasUnsavedChangesBlockIDs[blockID] = prevState.hasUnsavedChangesBlockIDs[blockID]; + } else { + hasUnsavedChangesBlockIDs[blockID] = false; + } + validBlockIDs[blockID] = null; + }); + this.setState({ + hasUnsavedChangesBlockIDs, + validBlockIDs + }); + } + handleChangeHasUnsavedChanges(elementID, hasUnsavedChanges) { + this.setState(prevState => ({ + hasUnsavedChangesBlockIDs: { + ...prevState.hasUnsavedChangesBlockIDs, + [elementID]: hasUnsavedChanges + } + })); + } + handleBeforeSubmitForm(elementID) { + this.setState(prevState => ({ + validBlockIDs: { + ...prevState.validBlockIDs, + [elementID]: null + } + })); + } + handleAfterSubmitResponse(elementID, valid) { + this.setState(prevState => ({ + hasUnsavedChangesBlockIDs: { + ...prevState.hasUnsavedChangesBlockIDs, + [elementID]: !valid + }, + validBlockIDs: { + ...prevState.validBlockIDs, + [elementID]: valid + } + })); + } + getDragIndicatorIndex() { + const { + dragTargetElementId, + draggedItem, + elements, + dragSpot + } = this.props; + return (0, _dragHelpers.getDragIndicatorIndex)(elements.map(element => element.id), dragTargetElementId, draggedItem && draggedItem.id, dragSpot); + } + renderBlocks() { + const { + ElementComponent, + HoverBarComponent, + DragIndicatorComponent, + elements, + allowedElementTypes, + elementTypes, + areaId, + onDragEnd, + onDragStart, + dragging + } = this.props; + if (elements.length === 0) { + return _react.default.createElement("div", null, _i18n.default._t('ElementList.ADD_BLOCKS', 'Add blocks to place your content')); + } + let output = elements.map(element => { + const saveElement = this.state.saveAllElements && this.state.hasUnsavedChangesBlockIDs[element.id] && this.state.validBlockIDs[element.id] === null; + return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(ElementComponent, { + key: element.id, + element: element, + areaId: areaId, + type: (0, _elementConfig.getElementTypeConfig)(element, elementTypes), + link: element.blockSchema.actions.edit, + saveElement: saveElement, + onChangeHasUnsavedChanges: hasUnsavedChanges => this.handleChangeHasUnsavedChanges(element.id, hasUnsavedChanges), + onBeforeSubmitForm: () => this.handleBeforeSubmitForm(element.id), + onAfterSubmitResponse: valid => this.handleAfterSubmitResponse(element.id, valid), + increment: this.state.increment + }), dragging === false && _react.default.createElement(HoverBarComponent, { + key: `create-after-${element.id}`, + areaId: areaId, + elementId: element.id, + elementTypes: allowedElementTypes + })); + }); + if (dragging === false) { + output = [_react.default.createElement(HoverBarComponent, { + key: 0, + areaId: areaId, + elementId: 0, + elementTypes: allowedElementTypes + })].concat(output); + } + const dragIndicatorIndex = this.getDragIndicatorIndex(); + if (dragging !== false && dragIndicatorIndex !== null) { + output.splice(dragIndicatorIndex, 0, _react.default.createElement(DragIndicatorComponent, { + key: "DropIndicator" + })); + } + return _react.default.createElement(_core.DndContext, { + modifiers: [_modifiers.restrictToVerticalAxis, _modifiers.restrictToParentElement], + collisionDetection: _core.closestCenter, + onDragStart: onDragStart, + onDragEnd: onDragEnd + }, _react.default.createElement(_sortable.SortableContext, { + items: elements.map(element => element.id), + strategy: _sortable.verticalListSortingStrategy + }, output)); + } + renderLoading() { + const { + isLoading, + LoadingComponent + } = this.props; + if (isLoading) { + return _react.default.createElement(LoadingComponent, null); + } + return null; + } + render() { + const { + elements + } = this.props; + const listClassNames = (0, _classnames.default)('elemental-editor-list', { + 'elemental-editor-list--empty': !elements || !elements.length + }); + return _react.default.createElement("div", { + className: listClassNames + }, this.renderLoading(), this.renderBlocks()); + } +} +exports.Component = ElementList; +ElementList.propTypes = { + elements: _propTypes.default.arrayOf(_elementType.elementType).isRequired, + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + allowedElementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + areaId: _propTypes.default.number.isRequired, + dragTargetElementId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.bool]), + onDragStart: _propTypes.default.func, + onDragEnd: _propTypes.default.func, + dragging: _propTypes.default.oneOf([_propTypes.default.bool, _propTypes.default.number]), + sharedObject: _propTypes.default.object.isRequired +}; +ElementList.defaultProps = { + sharedObject: { + entwineResolve: () => {}, + setState: null + }, + elements: [], + isLoading: false +}; +var _default = exports["default"] = (0, _redux.compose)((0, _Injector.inject)(['Element', 'Loading', 'HoverBar', 'DragPositionIndicator'], (ElementComponent, LoadingComponent, HoverBarComponent, DragIndicatorComponent) => ({ + ElementComponent, + LoadingComponent, + HoverBarComponent, + DragIndicatorComponent +}), () => 'ElementEditor.ElementList'))(ElementList); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/Header.js": +/*!*******************************************************!*\ + !*** ./client/src/components/ElementEditor/Header.js ***! + \*******************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _reactstrap = __webpack_require__(/*! reactstrap */ "reactstrap"); +var _elementType = __webpack_require__(/*! types/elementType */ "./client/src/types/elementType.js"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _redux = __webpack_require__(/*! redux */ "redux"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class Header extends _react.Component { + constructor(props) { + super(props); + this.toggle = this.toggle.bind(this); + this.state = { + tooltipOpen: false + }; + } + componentDidUpdate() { + const { + tooltipOpen + } = this.state; + const { + disableTooltip + } = this.props; + if (tooltipOpen && disableTooltip) { + this.setState({ + tooltipOpen: false + }); + } + } + getBlockTitle(element, type) { + if (type.broken) { + return _i18n.default.inject(_i18n.default._t('ElementHeader.BROKEN', 'This element is of obsolete type {type}.'), { + type: type.obsoleteClassName + }); + } + if (element.title) { + return element.title; + } + return _i18n.default.inject(_i18n.default._t('ElementHeader.NOTITLE', 'Untitled {type} block'), { + type: type.title + }); + } + toggle() { + this.setState(prevState => ({ + tooltipOpen: !prevState.tooltipOpen + })); + } + renderVersionedStateMessage() { + const { + element: { + isLiveVersion, + isPublished + } + } = this.props; + if (isPublished && isLiveVersion) { + return null; + } + let versionStateButtonTitle = ''; + const stateClassNames = ['element-editor-header__version-state']; + if (!isPublished) { + versionStateButtonTitle = _i18n.default._t('ElementHeader.STATE_DRAFT', 'Item has not been published yet'); + stateClassNames.push('element-editor-header__version-state--draft'); + } else if (!isLiveVersion) { + versionStateButtonTitle = _i18n.default._t('ElementHeader.STATE_MODIFIED', 'Item has unpublished changes'); + stateClassNames.push('element-editor-header__version-state--modified'); + } + return _react.default.createElement("span", { + className: (0, _classnames.default)(stateClassNames), + title: versionStateButtonTitle + }); + } + renderStatusFlagBadges() { + const statusFlags = this.props.element.statusFlags; + if (!statusFlags) { + return null; + } + const badges = []; + for (let [cssClasses, data] of Object.entries(statusFlags)) { + cssClasses = `badge status-${cssClasses}`; + if (typeof data === 'string') { + data = { + text: data + }; + } + if (!data.title) { + data.title = ''; + } + badges.push(_react.default.createElement("span", { + key: cssClasses, + className: cssClasses, + title: data.title + }, data.text)); + } + return badges; + } + render() { + const { + element, + type, + areaId, + previewExpanded, + simple, + disableTooltip, + activeTab, + expandable, + ElementActionsComponent, + handleEditTabsClick + } = this.props; + const title = this.getBlockTitle(element, type); + const titleClasses = (0, _classnames.default)({ + 'element-editor-header__title': true, + 'element-editor-header__title--none': !element.title + }); + const expandTitle = _i18n.default._t('ElementHeader.EXPAND', 'Show editable fields'); + const containerClasses = (0, _classnames.default)('element-editor-header', { + 'element-editor-header--simple': simple + }); + const iconContainerClasses = (0, _classnames.default)('element-editor-header__icon-container', { + 'element-editor-header__icon-container--broken': type.broken + }); + const expandCaretClasses = (0, _classnames.default)('element-editor-header__expand', { + 'font-icon-right-open-big': !expandable, + 'font-icon-up-open-big': expandable && previewExpanded, + 'font-icon-down-open-big': expandable && !previewExpanded + }); + const blockIconId = `element-icon-${element.id}`; + const content = _react.default.createElement("div", { + className: containerClasses + }, _react.default.createElement("div", { + className: "element-editor-header__drag-handle" + }, _react.default.createElement("i", { + className: "font-icon-drag-handle" + })), _react.default.createElement("div", { + className: "element-editor-header__info" + }, _react.default.createElement("div", { + className: iconContainerClasses + }, _react.default.createElement("i", { + className: type.icon, + id: blockIconId + }), this.renderVersionedStateMessage(), !type.broken && !simple && _react.default.createElement(_reactstrap.Tooltip, { + placement: "top", + isOpen: this.state.tooltipOpen && !disableTooltip, + target: blockIconId, + toggle: this.toggle + }, type.title)), _react.default.createElement("h3", { + className: titleClasses + }, title), this.renderStatusFlagBadges()), !simple && _react.default.createElement("div", { + className: "element-editor-header__actions" + }, _react.default.createElement("div", { + role: "none", + onClick: event => event.stopPropagation() + }, _react.default.createElement(ElementActionsComponent, { + element: element, + type: type, + areaId: areaId, + activeTab: activeTab, + editTabs: type.editTabs, + handleEditTabsClick: handleEditTabsClick, + expandable: expandable + })), !type.broken && _react.default.createElement("i", { + className: expandCaretClasses, + title: expandTitle + }))); + return content; + } +} +exports.Component = Header; +Header.propTypes = { + element: _elementType.elementType.isRequired, + type: _elementTypeType.elementTypeType.isRequired, + areaId: _propTypes.default.number, + activeTab: _propTypes.default.string, + simple: _propTypes.default.bool, + ElementActionsComponent: _propTypes.default.elementType, + previewExpanded: _propTypes.default.bool, + disableTooltip: _propTypes.default.bool +}; +Header.defaultProps = { + expandable: true +}; +var _default = exports["default"] = (0, _redux.compose)((0, _Injector.inject)(['ElementActions'], ElementActionsComponent => ({ + ElementActionsComponent +}), () => 'ElementEditor.ElementList.Element'))(Header); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/HoverBar.js": +/*!*********************************************************!*\ + !*** ./client/src/components/ElementEditor/HoverBar.js ***! + \*********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = exports.Component = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _prefixClassNames = _interopRequireDefault(__webpack_require__(/*! ../../lib/prefixClassNames */ "./client/src/lib/prefixClassNames.js")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +const classNames = (0, _prefixClassNames.default)('element-editor__hover-bar'); +function StatelessHoverBar(_ref) { + let { + AddElementPopoverComponent, + elementTypes, + elementId, + areaId, + popoverOpen, + onToggle + } = _ref; + const lineClasses = `${classNames('-line')} font-icon-plus-circled`; + const label = _i18n.default._t('ElementAddNewButton.ADD_BLOCK', 'Add block'); + const btnProps = { + className: classNames('-area', { + '-area--focus': popoverOpen + }), + onClick: onToggle, + 'aria-label': label, + title: label, + id: `AddBlockHoverBarArea_${areaId}_${elementId}` + }; + return _react.default.createElement("div", { + className: classNames(''), + id: `AddBlockHoverBar_${areaId}_${elementId}` + }, _react.default.createElement("button", btnProps, _react.default.createElement("span", { + className: classNames('-area-inner') + }, _react.default.createElement("span", { + className: lineClasses + }))), _react.default.createElement(AddElementPopoverComponent, { + placement: "bottom", + target: `AddBlockHoverBarArea_${areaId}_${elementId}`, + isOpen: popoverOpen, + elementTypes: elementTypes, + toggle: onToggle, + container: `#AddBlockHoverBar_${areaId}_${elementId}`, + areaId: areaId, + insertAfterElement: elementId + })); +} +class HoverBar extends _react.Component { + constructor(props) { + super(props); + this.toggle = this.toggle.bind(this); + this.state = { + popoverOpen: false + }; + } + toggle() { + this.setState(prevState => ({ + popoverOpen: !prevState.popoverOpen + })); + } + render() { + const props = { + ...this.state, + ...this.props, + onToggle: this.toggle + }; + return _react.default.createElement(StatelessHoverBar, props); + } +} +exports.Component = HoverBar; +HoverBar.propTypes = { + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + elementId: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired, + areaId: _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]).isRequired +}; +var _default = exports["default"] = (0, _Injector.inject)(['AddElementPopover'], AddElementPopoverComponent => ({ + AddElementPopoverComponent +}), () => 'ElementEditor.ElementList.HoverBar')(HoverBar); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/InlineEditForm.js": +/*!***************************************************************!*\ + !*** ./client/src/components/ElementEditor/InlineEditForm.js ***! + \***************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var _FormBuilderLoader = _interopRequireDefault(__webpack_require__(/*! containers/FormBuilderLoader/FormBuilderLoader */ "containers/FormBuilderLoader/FormBuilderLoader")); +var _loadElementSchemaValue = __webpack_require__(/*! state/editor/loadElementSchemaValue */ "./client/src/state/editor/loadElementSchemaValue.js"); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _loadElementFormStateName = __webpack_require__(/*! state/editor/loadElementFormStateName */ "./client/src/state/editor/loadElementFormStateName.js"); +var _reactRedux = __webpack_require__(/*! react-redux */ "react-redux"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } +class InlineEditForm extends _react.PureComponent { + constructor(props) { + super(props); + this.handleLoadingError = this.handleLoadingError.bind(this); + this.handleSubmit = this.handleSubmit.bind(this); + this.state = { + loadingError: null + }; + } + handleLoadingError() { + const { + jQuery: $ + } = window; + const { + handleLoadingError + } = this.props; + this.setState({ + loadingError: true + }); + $.noticeAdd({ + text: _i18n.default.inject(_i18n.default._t('ElementEditForm.ERROR_NOTIFICATION', 'Error displaying the edit form for this block')), + stay: true, + type: 'notice' + }); + handleLoadingError(); + } + handleSubmit(data, action, submitFn) { + let title = ''; + Object.keys(data).forEach(key => { + if (key.match(/PageElements_[0-9]+_Title/)) { + title = data[key]; + } + }); + return submitFn().then(formSchema => this.props.onFormSchemaSubmitResponse(formSchema, title)); + } + render() { + const { + elementId, + extraClass, + onClick, + onFormInit, + formHasState, + notVisible + } = this.props; + const { + loadingError + } = this.state; + const classNames = (0, _classnames.default)('element-editor-editform', extraClass); + const schemaUrl = (0, _loadElementSchemaValue.loadElementSchemaValue)('schemaUrl', elementId); + const formTag = 'form'; + const formProps = { + formTag, + schemaUrl, + identifier: 'element', + refetchSchemaOnMount: !formHasState, + onLoadingError: this.handleLoadingError, + onSubmit: this.handleSubmit + }; + if (loadingError) { + formProps.loading = false; + } + if (typeof onFormInit === 'function') { + formProps.onReduxFormInit = onFormInit; + } + const extraAttrs = {}; + if (notVisible) { + extraAttrs['aria-hidden'] = 'true'; + } + return _react.default.createElement("div", _extends({ + className: classNames, + onClick: onClick, + role: "presentation" + }, extraAttrs), _react.default.createElement(_FormBuilderLoader.default, formProps)); + } +} +InlineEditForm.propTypes = { + extraClass: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.object]), + onClick: _propTypes.default.func, + elementId: _propTypes.default.string, + handleLoadingError: _propTypes.default.func, + onFormSchemaSubmitResponse: _propTypes.default.func, + notVisible: _propTypes.default.bool +}; +function mapStateToProps(state, ownProps) { + const formName = (0, _loadElementFormStateName.loadElementFormStateName)(ownProps.elementId); + return { + formHasState: state.form.formState && state.form.formState.element && !!state.form.formState.element[formName] + }; +} +var _default = exports["default"] = (0, _reactRedux.connect)(mapStateToProps)(InlineEditForm); + +/***/ }), + +/***/ "./client/src/components/ElementEditor/Summary.js": +/*!********************************************************!*\ + !*** ./client/src/components/ElementEditor/Summary.js ***! + \********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class Summary extends _react.PureComponent { + render() { + const { + fileUrl, + fileTitle, + content, + broken + } = this.props; + const noContent = _i18n.default._t('ElementSummary.NO_PREVIEW', 'No preview available'); + const summaryClassNames = (0, _classnames.default)('element-editor-summary__content', { + 'element-editor-summary__content--broken': broken + }); + return _react.default.createElement("div", { + className: "element-editor-summary" + }, fileUrl && _react.default.createElement("img", { + className: "element-editor-summary__thumbnail-image", + src: fileUrl, + alt: fileTitle + }), (content || !fileUrl) && _react.default.createElement("p", { + className: summaryClassNames + }, content || noContent)); + } +} +Summary.defaultProps = {}; +Summary.propTypes = { + content: _propTypes.default.string, + fileUrl: _propTypes.default.string, + fileTitle: _propTypes.default.string, + broken: _propTypes.default.bool +}; +var _default = exports["default"] = Summary; + +/***/ }), + +/***/ "./client/src/components/ElementEditor/Toolbar.js": +/*!********************************************************!*\ + !*** ./client/src/components/ElementEditor/Toolbar.js ***! + \********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireWildcard(__webpack_require__(/*! react */ "react")); +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _elementTypeType = __webpack_require__(/*! types/elementTypeType */ "./client/src/types/elementTypeType.js"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); } +function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; } +class Toolbar extends _react.PureComponent { + render() { + const { + AddNewButtonComponent, + elementTypes, + areaId + } = this.props; + return _react.default.createElement("div", { + className: "element-editor__toolbar" + }, _react.default.createElement(AddNewButtonComponent, { + elementTypes: elementTypes, + areaId: areaId + })); + } +} +Toolbar.defaultProps = {}; +Toolbar.propTypes = { + elementTypes: _propTypes.default.arrayOf(_elementTypeType.elementTypeType).isRequired, + areaId: _propTypes.default.number.isRequired, + AddNewButtonComponent: _propTypes.default.elementType.isRequired, + onDragDrop: _propTypes.default.func +}; +var _default = exports["default"] = (0, _Injector.inject)(['ElementAddNewButton'], AddNewButtonComponent => ({ + AddNewButtonComponent +}), () => 'ElementEditor.ElementToolbar')(Toolbar); + +/***/ }), + +/***/ "./client/src/components/HistoricElementView/HistoricElementView.js": +/*!**************************************************************************!*\ + !*** ./client/src/components/HistoricElementView/HistoricElementView.js ***! + \**************************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); +var _i18n = _interopRequireDefault(__webpack_require__(/*! i18n */ "i18n")); +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const ElementalAreaHistoryFactory = FieldGroup => class HistoricElementView extends FieldGroup { + getClassName() { + const classlist = [super.getClassName()]; + if (this.props.data.ElementID) { + classlist.unshift('elemental-area__element--historic-inner'); + } + return (0, _classnames.default)(classlist); + } + render() { + const legend = this.getLegend(); + const Tag = this.props.data.tag || 'div'; + const classNames = this.getClassName(); + const { + data + } = this.props; + if (!data.ElementID) { + return super.render(); + } + return _react.default.createElement(Tag, { + className: classNames + }, legend, _react.default.createElement("div", { + className: "elemental-preview elemental-preview--historic" + }, data.ElementEditLink && _react.default.createElement("a", { + className: "elemental-preview__link", + href: data.ElementEditLink + }, _react.default.createElement("span", { + className: "elemental-preview__link-text" + }, _i18n.default._t('HistoricElementView.VIEW_BLOCK_HISTORY', 'Block history')), _react.default.createElement("i", { + className: "font-icon-angle-right btn--icon-lg elemental-preview__link-caret" + })), _react.default.createElement("div", { + className: "elemental-preview__icon" + }, _react.default.createElement("i", { + className: data.ElementIcon + })), _react.default.createElement("div", { + className: "elemental-preview__detail" + }, _react.default.createElement("h3", null, data.ElementTitle, " ", _react.default.createElement("small", null, data.ElementType)))), this.props.children); + } +}; +var _default = exports["default"] = ElementalAreaHistoryFactory; + +/***/ }), + +/***/ "./client/src/components/TextCheckboxGroupField/TextCheckboxGroupField.js": +/*!********************************************************************************!*\ + !*** ./client/src/components/TextCheckboxGroupField/TextCheckboxGroupField.js ***! + \********************************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); +var _reactstrap = __webpack_require__(/*! reactstrap */ "reactstrap"); +var _FieldHolder = _interopRequireDefault(__webpack_require__(/*! components/FieldHolder/FieldHolder */ "components/FieldHolder/FieldHolder")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const TextCheckboxGroupField = props => { + const { + children + } = props; + const childrenWithProps = _react.default.Children.toArray(_react.default.Children.map(children, (child, index) => { + const additionalProps = {}; + if (index === 0) { + additionalProps.id = props.id; + additionalProps.title = null; + } else if (index === 1) { + additionalProps.noHolder = true; + } + return _react.default.cloneElement(child, additionalProps); + })); + if (props.readOnly) { + return _react.default.createElement("div", { + className: "text-checkbox-group-field--read-only" + }, childrenWithProps); + } + if (childrenWithProps.length === 1) { + return childrenWithProps[0]; + } + return _react.default.createElement(_reactstrap.InputGroup, { + className: "text-checkbox-group-field" + }, childrenWithProps[0], _react.default.createElement(_reactstrap.InputGroupAddon, { + addonType: "append" + }, _react.default.createElement(_reactstrap.InputGroupText, null, childrenWithProps[1]))); +}; +var _default = exports["default"] = (0, _FieldHolder.default)(TextCheckboxGroupField); + +/***/ }), + +/***/ "./client/src/legacy/ElementEditor/entwine.js": +/*!****************************************************!*\ + !*** ./client/src/legacy/ElementEditor/entwine.js ***! + \****************************************************/ +/***/ (function(__unused_webpack_module, __unused_webpack_exports, __webpack_require__) { + + + +var _jquery = _interopRequireDefault(__webpack_require__(/*! jquery */ "jquery")); +var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); +var _client = __webpack_require__(/*! react-dom/client */ "react-dom/client"); +var _Injector = __webpack_require__(/*! lib/Injector */ "lib/Injector"); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var _reduxForm = __webpack_require__(/*! redux-form */ "redux-form"); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const resetStores = () => { + setTimeout(() => { + const { + store + } = window.ss; + if (!store) { + return; + } + store.dispatch((0, _reduxForm.destroy)(...Object.keys(store.getState().form.formState.element || {}).map(name => `element.${name}`))); + }, 0); +}; +_jquery.default.entwine('ss', $ => { + $('.js-injector-boot .element-editor__container').entwine({ + ReactRoot: null, + AreaIDsSharedObject: {}, + Increment: 0, + onmatch() { + const context = {}; + const ElementEditorComponent = (0, _Injector.loadComponent)('ElementEditor', context); + const schemaData = this.data('schema'); + const elementTypes = (0, _elementConfig.getConfig)().elementTypes; + const areaID = schemaData['elemental-area-id']; + const areaIDsSharedObject = this.getAreaIDsSharedObject(); + if (!areaIDsSharedObject.hasOwnProperty(areaID)) { + areaIDsSharedObject[areaID] = { + entwineResolve: null, + setState: null + }; + } + const props = { + areaId: areaID, + allowedElements: schemaData['allowed-elements'], + elementTypes, + sharedObject: areaIDsSharedObject[areaID] + }; + let root = this.getReactRoot(); + if (!root) { + root = (0, _client.createRoot)(this[0]); + this.setReactRoot(root); + } + root.render(_react.default.createElement(ElementEditorComponent, props)); + }, + onunmatch() { + if (!$('.cms-edit-form').data('hasValidationErrors')) { + resetStores(); + } + this.unmountComponent(); + }, + unmountComponent() { + const root = this.getReactRoot(); + if (root) { + root.unmount(); + this.setReactRoot(null); + } + }, + 'from .cms-edit-form': { + onbeforesubmitform(event, data) { + if (!data || this.is('.elemental-area--read-only')) { + return; + } + let entwineResolve; + const entwinePromise = new Promise(resolve => { + entwineResolve = resolve; + }); + data.promises.push(entwinePromise); + data.onAjaxSuccessCallbacks.push(this.unmountComponent.bind(this)); + const areaID = this.data('schema')['elemental-area-id']; + const areaIDsSharedObject = this.getAreaIDsSharedObject(); + const sharedObject = areaIDsSharedObject[areaID]; + const increment = this.getIncrement() + 1; + this.setIncrement(increment); + sharedObject.entwineResolve = entwineResolve; + sharedObject.setState({ + saveAllElements: true, + increment + }); + }, + onaftersubmitform(event, data) { + const validationResultPjax = JSON.parse(data.xhr.responseText).ValidationResult; + const validationResult = JSON.parse(validationResultPjax.replace(/<\/?script[^>]*?>/g, '')); + if (validationResult.isValid) { + $('.cms-edit-form').data('hasValidationErrors', false); + resetStores(); + } else { + $('.cms-edit-form').data('hasValidationErrors', true); + } + } + } + }); + $('.js-injector-boot .element-editor__container .element-form-dirty-state').entwine({ + onmatch() { + $('.cms-edit-form').trigger('change'); + }, + onunmatch() { + $('.cms-edit-form').trigger('change'); + } + }); + $('.cms-edit-form').entwine({ + getChangeTrackerOptions() { + const isDefault = this.entwineData('ChangeTrackerOptions') === undefined; + let opts = this._super(); + if (isDefault) { + opts = $.extend({}, opts); + opts.ignoreFieldSelector += ', .elementalarea :input:not(.element-form-dirty-state)'; + this.setChangeTrackerOptions(opts); + } + return opts; + } + }); +}); + +/***/ }), + +/***/ "./client/src/lib/dragHelpers.js": +/*!***************************************!*\ + !*** ./client/src/lib/dragHelpers.js ***! + \***************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.isOverTop = exports.getDragIndicatorIndex = exports.elementDragSource = void 0; +var _reactDom = __webpack_require__(/*! react-dom */ "react-dom"); +const isOverTop = (monitor, component) => { + const clientOffset = monitor.getClientOffset(); + const componentRect = (0, _reactDom.findDOMNode)(component).getBoundingClientRect(); + return clientOffset.y < componentRect.y + componentRect.height / 2; +}; +exports.isOverTop = isOverTop; +const getDragIndicatorIndex = (items, dragTarget, draggedItem, dragSpot) => { + if (dragTarget === null || !draggedItem) { + return null; + } + let targetIndex = dragTarget ? items.findIndex(element => element === dragTarget) : 0; + const sourceIndex = items.findIndex(item => item === draggedItem); + if (dragSpot === 'bottom') { + targetIndex += 1; + } + if (sourceIndex === targetIndex || sourceIndex + 1 === targetIndex) { + return null; + } + return targetIndex; +}; +exports.getDragIndicatorIndex = getDragIndicatorIndex; +const elementDragSource = exports.elementDragSource = { + beginDrag(props) { + return props.element; + }, + endDrag(props, monitor) { + const { + onDragEnd + } = props; + const dropResult = monitor.getDropResult(); + if (!onDragEnd || !dropResult || !dropResult.dropAfterID) { + return; + } + const itemID = monitor.getItem().id; + const { + dropAfterID + } = dropResult; + if (itemID !== dropAfterID) { + onDragEnd(itemID, dropAfterID); + } + } +}; + +/***/ }), + +/***/ "./client/src/lib/prefixClassNames.js": +/*!********************************************!*\ + !*** ./client/src/lib/prefixClassNames.js ***! + \********************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _classnames = _interopRequireDefault(__webpack_require__(/*! classnames */ "classnames")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const prefixClassNames = cssPrefix => function () { + const prefix = str => `${cssPrefix}${str}`; + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + const prefixArgs = args.map(arg => { + if (!arg && arg !== '') { + return false; + } + if (typeof arg === 'object') { + return Array.isArray(arg) ? arg.map(prefix) : Object.entries(arg).reduce((accumulator, _ref) => { + let [key, value] = _ref; + return Object.assign({}, accumulator, { + [prefix(key)]: value + }); + }, {}); + } + return prefix(arg); + }); + return (0, _classnames.default)(...prefixArgs); +}; +var _default = exports["default"] = prefixClassNames; + +/***/ }), + +/***/ "./client/src/state/editor/elementConfig.js": +/*!**************************************************!*\ + !*** ./client/src/state/editor/elementConfig.js ***! + \**************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.getElementTypeConfig = exports.getConfig = void 0; +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const getConfig = () => _Config.default.getSection('DNADesign\\Elemental\\Controllers\\ElementalAreaController'); +exports.getConfig = getConfig; +const getElementTypeConfig = function (element) { + let typeConfig = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; + const elementType = element.blockSchema.typeName; + const types = Array.isArray(typeConfig) ? typeConfig : getConfig().elementTypes; + let type = types.find(value => value.class === elementType || value.name === elementType); + if (element.obsoleteClassName) { + type = Object.assign({ + obsoleteClassName: element.obsoleteClassName + }, type); + Object.preventExtensions(type); + } + return type; +}; +exports.getElementTypeConfig = getElementTypeConfig; + +/***/ }), + +/***/ "./client/src/state/editor/loadElementFormStateName.js": +/*!*************************************************************!*\ + !*** ./client/src/state/editor/loadElementFormStateName.js ***! + \*************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.loadElementFormStateName = void 0; +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const loadElementFormStateName = function () { + let elementId = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null; + const sectionKey = 'DNADesign\\Elemental\\Controllers\\ElementalAreaController'; + const section = _Config.default.getSection(sectionKey); + const formNameTemplate = section.form.elementForm.formNameTemplate; + if (elementId) { + return formNameTemplate.replace('{id}', elementId); + } + return formNameTemplate; +}; +exports.loadElementFormStateName = loadElementFormStateName; + +/***/ }), + +/***/ "./client/src/state/editor/loadElementSchemaValue.js": +/*!***********************************************************!*\ + !*** ./client/src/state/editor/loadElementSchemaValue.js ***! + \***********************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.loadElementSchemaValue = void 0; +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const loadElementSchemaValue = function (key) { + let elementId = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null; + const sectionKey = 'DNADesign\\Elemental\\Controllers\\ElementalAreaController'; + const section = _Config.default.getSection(sectionKey); + const schemaValue = section.form.elementForm[key] || ''; + if (elementId) { + return `${schemaValue}/${elementId}`; + } + return schemaValue; +}; +exports.loadElementSchemaValue = loadElementSchemaValue; + +/***/ }), + +/***/ "./client/src/state/history/revertToBlockVersionRequest.js": +/*!*****************************************************************!*\ + !*** ./client/src/state/history/revertToBlockVersionRequest.js ***! + \*****************************************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports["default"] = void 0; +var _react = _interopRequireDefault(__webpack_require__(/*! react */ "react")); +var _Backend = _interopRequireDefault(__webpack_require__(/*! lib/Backend */ "lib/Backend")); +var _elementConfig = __webpack_require__(/*! state/editor/elementConfig */ "./client/src/state/editor/elementConfig.js"); +var _Config = _interopRequireDefault(__webpack_require__(/*! lib/Config */ "lib/Config")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const revertToBlockVersionRequest = HistoryViewerVersionDetailComponent => props => { + const newProps = { + ...props + }; + if (!newProps.hasOwnProperty('actions')) { + newProps.actions = {}; + } + newProps.actions.revertToVersion = (id, fromVersion, fromStage, toStage) => { + const url = `${(0, _elementConfig.getConfig)().controllerLink.replace(/\/$/, '')}/api/revert`; + return _Backend.default.post(url, { + id, + fromVersion, + fromStage, + toStage + }, { + 'X-SecurityID': _Config.default.get('SecurityID') + }); + }; + return _react.default.createElement(HistoryViewerVersionDetailComponent, newProps); +}; +var _default = exports["default"] = revertToBlockVersionRequest; + +/***/ }), + +/***/ "./client/src/types/elementType.js": +/*!*****************************************!*\ + !*** ./client/src/types/elementType.js ***! + \*****************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.elementType = void 0; +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const elementType = exports.elementType = _propTypes.default.shape({ + id: _propTypes.default.number, + title: _propTypes.default.string, + blockSchema: _propTypes.default.object, + inlineEditable: _propTypes.default.bool, + published: _propTypes.default.bool, + liveVersion: _propTypes.default.bool, + version: _propTypes.default.number +}); + +/***/ }), + +/***/ "./client/src/types/elementTypeType.js": +/*!*********************************************!*\ + !*** ./client/src/types/elementTypeType.js ***! + \*********************************************/ +/***/ (function(__unused_webpack_module, exports, __webpack_require__) { + + + +Object.defineProperty(exports, "__esModule", ({ + value: true +})); +exports.elementTypeType = void 0; +var _propTypes = _interopRequireDefault(__webpack_require__(/*! prop-types */ "prop-types")); +function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; } +const elementTypeType = exports.elementTypeType = _propTypes.default.shape({ + name: _propTypes.default.string, + title: _propTypes.default.string, + icon: _propTypes.default.string, + inlineEditable: _propTypes.default.bool, + editTabs: _propTypes.default.arrayOf(_propTypes.default.shape({ + title: _propTypes.default.string, + name: _propTypes.default.string + })), + config: _propTypes.default.object +}); + +/***/ }), + +/***/ "lib/Backend": +/*!**************************!*\ + !*** external "Backend" ***! + \**************************/ +/***/ (function(module) { + +module.exports = Backend; + +/***/ }), + +/***/ "lib/Config": +/*!*************************!*\ + !*** external "Config" ***! + \*************************/ +/***/ (function(module) { + +module.exports = Config; + +/***/ }), + +/***/ "components/FieldHolder/FieldHolder": +/*!******************************!*\ + !*** external "FieldHolder" ***! + \******************************/ +/***/ (function(module) { + +module.exports = FieldHolder; + +/***/ }), + +/***/ "containers/FormBuilderLoader/FormBuilderLoader": +/*!************************************!*\ + !*** external "FormBuilderLoader" ***! + \************************************/ +/***/ (function(module) { + +module.exports = FormBuilderLoader; + +/***/ }), + +/***/ "lib/Injector": +/*!***************************!*\ + !*** external "Injector" ***! + \***************************/ +/***/ (function(module) { + +module.exports = Injector; + +/***/ }), + +/***/ "prop-types": +/*!****************************!*\ + !*** external "PropTypes" ***! + \****************************/ +/***/ (function(module) { + +module.exports = PropTypes; + +/***/ }), + +/***/ "react": +/*!************************!*\ + !*** external "React" ***! + \************************/ +/***/ (function(module) { + +module.exports = React; + +/***/ }), + +/***/ "react-dom": +/*!***************************!*\ + !*** external "ReactDom" ***! + \***************************/ +/***/ (function(module) { + +module.exports = ReactDom; + +/***/ }), + +/***/ "react-dom/client": +/*!*********************************!*\ + !*** external "ReactDomClient" ***! + \*********************************/ +/***/ (function(module) { + +module.exports = ReactDomClient; + +/***/ }), + +/***/ "react-redux": +/*!*****************************!*\ + !*** external "ReactRedux" ***! + \*****************************/ +/***/ (function(module) { + +module.exports = ReactRedux; + +/***/ }), + +/***/ "reactstrap": +/*!*****************************!*\ + !*** external "Reactstrap" ***! + \*****************************/ +/***/ (function(module) { + +module.exports = Reactstrap; + +/***/ }), + +/***/ "redux": +/*!************************!*\ + !*** external "Redux" ***! + \************************/ +/***/ (function(module) { + +module.exports = Redux; + +/***/ }), + +/***/ "redux-form": +/*!****************************!*\ + !*** external "ReduxForm" ***! + \****************************/ +/***/ (function(module) { + +module.exports = ReduxForm; + +/***/ }), + +/***/ "state/tabs/TabsActions": +/*!******************************!*\ + !*** external "TabsActions" ***! + \******************************/ +/***/ (function(module) { + +module.exports = TabsActions; + +/***/ }), + +/***/ "state/toasts/ToastsActions": +/*!********************************!*\ + !*** external "ToastsActions" ***! + \********************************/ +/***/ (function(module) { + +module.exports = ToastsActions; + +/***/ }), + +/***/ "state/unsavedForms/UnsavedFormsActions": +/*!**************************************!*\ + !*** external "UnsavedFormsActions" ***! + \**************************************/ +/***/ (function(module) { + +module.exports = UnsavedFormsActions; + +/***/ }), + +/***/ "classnames": +/*!*****************************!*\ + !*** external "classnames" ***! + \*****************************/ +/***/ (function(module) { + +module.exports = classnames; + +/***/ }), + +/***/ "lib/getJsonErrorMessage": +/*!**************************************!*\ + !*** external "getJsonErrorMessage" ***! + \**************************************/ +/***/ (function(module) { + +module.exports = getJsonErrorMessage; + +/***/ }), + +/***/ "i18n": +/*!***********************!*\ + !*** external "i18n" ***! + \***********************/ +/***/ (function(module) { + +module.exports = i18n; + +/***/ }), + +/***/ "jquery": +/*!*************************!*\ + !*** external "jQuery" ***! + \*************************/ +/***/ (function(module) { + +module.exports = jQuery; + +/***/ }), + +/***/ "lib/withDragDropContext": +/*!**************************************!*\ + !*** external "withDragDropContext" ***! + \**************************************/ +/***/ (function(module) { + +module.exports = withDragDropContext; + +/***/ }) + +/******/ }); +/************************************************************************/ +/******/ // The module cache +/******/ var __webpack_module_cache__ = {}; +/******/ +/******/ // The require function +/******/ function __webpack_require__(moduleId) { +/******/ // Check if module is in cache +/******/ var cachedModule = __webpack_module_cache__[moduleId]; +/******/ if (cachedModule !== undefined) { +/******/ return cachedModule.exports; +/******/ } +/******/ // Create a new module (and put it into the cache) +/******/ var module = __webpack_module_cache__[moduleId] = { +/******/ // no module.id needed +/******/ // no module.loaded needed +/******/ exports: {} +/******/ }; +/******/ +/******/ // Execute the module function +/******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__); +/******/ +/******/ // Return the exports of the module +/******/ return module.exports; +/******/ } +/******/ +/************************************************************************/ +/******/ /* webpack/runtime/compat get default export */ +/******/ !function() { +/******/ // getDefaultExport function for compatibility with non-harmony modules +/******/ __webpack_require__.n = function(module) { +/******/ var getter = module && module.__esModule ? +/******/ function() { return module['default']; } : +/******/ function() { return module; }; +/******/ __webpack_require__.d(getter, { a: getter }); +/******/ return getter; +/******/ }; +/******/ }(); +/******/ +/******/ /* webpack/runtime/define property getters */ +/******/ !function() { +/******/ // define getter functions for harmony exports +/******/ __webpack_require__.d = function(exports, definition) { +/******/ for(var key in definition) { +/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) { +/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] }); +/******/ } +/******/ } +/******/ }; +/******/ }(); +/******/ +/******/ /* webpack/runtime/hasOwnProperty shorthand */ +/******/ !function() { +/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); } +/******/ }(); +/******/ +/******/ /* webpack/runtime/make namespace object */ +/******/ !function() { +/******/ // define __esModule on exports +/******/ __webpack_require__.r = function(exports) { +/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) { +/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' }); +/******/ } +/******/ Object.defineProperty(exports, '__esModule', { value: true }); +/******/ }; +/******/ }(); +/******/ +/************************************************************************/ +var __webpack_exports__ = {}; +// This entry needs to be wrapped in an IIFE because it needs to be isolated against other modules in the chunk. +!function() { +/*!**************************************!*\ + !*** ./client/src/bundles/bundle.js ***! + \**************************************/ + + +__webpack_require__(/*! legacy/ElementEditor/entwine */ "./client/src/legacy/ElementEditor/entwine.js"); +__webpack_require__(/*! boot */ "./client/src/boot/index.js"); +}(); +/******/ })() +; +//# sourceMappingURL=bundle.js.map \ No newline at end of file diff --git a/client/dist/styles/bundle.css b/client/dist/styles/bundle.css index 7a0a90a2..f3c82cf7 100644 --- a/client/dist/styles/bundle.css +++ b/client/dist/styles/bundle.css @@ -1 +1,478 @@ -.elemental-edit{display:flex;color:inherit}.elemental-edit:hover,.elemental-edit:focus{text-decoration:none;color:inherit}.elemental-editor .col-EditorPreview{padding-left:0}.elemental-preview__detail{display:inline-block;margin-left:.76925rem;margin-top:1px}.elemental-preview__detail h3{font-weight:400;line-height:26px;margin:0;-webkit-font-smoothing:antialiased}.elemental-preview__detail p{align-items:center;display:flex;margin-bottom:0;margin-top:6px}.elemental-preview__detail small{color:rgb(86.4147727273,107.0511363636,140.5852272727);font-size:13px}.elemental-preview__thumbnail-image{margin-right:.76925rem}.elemental-preview__thumbnail-image img{border-radius:.192rem}.elemental-preview__thumbnail-image--placeholder{border-radius:0;height:36px;margin-left:-4px}.elemental-preview__icon{color:rgb(86.4147727273,107.0511363636,140.5852272727);display:inline-block;flex-direction:row;font-size:2.3rem;width:28px;vertical-align:top;margin-top:-1px}.ss-gridfield-orderable.elemental-editor .col-reorder .handle{opacity:.5;padding:22px 0 0}.ss-gridfield-orderable.elemental-editor .col-reorder .handle .icon{font-size:1.3em}.elemental-editor .ss-gridfield-item:hover .handle{opacity:1}.elemental-editor .grid-field__table{margin-bottom:12px}@media(max-width: 991.98px){.elemental-editor .grid-field__table .col-EditorPreview{display:table-cell}}.elemental-report__grid-field .element-editor-header__version-state{bottom:9px;left:14px}.element-editor .form-group:nth-child(1n){display:block}@media(min-width: 992px){.element-editor .form-group:nth-child(1n) .form__field-label,.element-editor .form-group:nth-child(1n) .form__field-holder{flex:0 0 83.33333333%;max-width:83.33333333%;margin-left:0}}.elemental-block__history-tab{margin-top:-1.5385rem}.cms-edit-form .fieldgroup.elemental-area__element--historic{margin-left:0;margin-right:0}.cms-edit-form .fieldgroup.elemental-area__element--historic.form-group{border-top:1px solid rgb(218.7079545455,224.0352272727,232.6920454545)}.cms-edit-form .fieldgroup.elemental-area__element--historic .form__field-holder{flex:0 0 100%;max-width:100%}.elemental-preview{line-height:20px}.elemental-preview--historic{margin-bottom:1rem}.elemental-preview__link{float:right;margin-top:4px}.elemental-preview__link:hover{text-decoration:none}.elemental-preview__link:hover .elemental-preview__link-text{text-decoration:underline}.elemental-preview__link-caret{display:block;float:right;margin-top:-2px;margin-left:2px}div.elemental-area__element--historic.elemental-area__element--historic-inner{background:rgba(0,0,0,0);border:0;padding-left:0;padding-right:0;padding-top:1.5385rem}.elemental-area--read-only{border-bottom:1px solid rgb(218.7079545455,224.0352272727,232.6920454545);margin:2.30775rem -1.5385rem}.history-viewer__version-detail fieldset{overflow:visible}.elemental-report__grid-field .ss-gridfield-item td:first-child{width:1px}.elemental-report__grid-field .col-Icon{font-size:1.5rem}.elemental-report__grid-field .element-item--draft,.elemental-report__grid-field .element-item--modified{bottom:8px;left:14px;height:6px;width:6px}.textcheckboxgroup .input-group-append .form-check-input{margin-left:0;position:relative}.element-editor .action-menu .dropdown-item.disabled{font-style:italic;pointer-events:initial;cursor:not-allowed;color:rgb(111.3181818182,132.4090909091,166.6818181818)}.elemental-editor__add-new-block-control{width:20rem}.elemental-editor__add-new-block-control a{line-height:1.85em}.element-editor__element{border-bottom:1px solid rgb(218.7079545455,224.0352272727,232.6920454545);color:inherit;cursor:pointer;min-height:8rem;padding:.9231rem 1.5385rem 1.8462rem}.element-editor__element:focus,.element-editor__element:hover{box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1);outline-width:0}.element-editor__element:hover .element-editor-header__drag-handle{display:block}.element-editor__element--broken{cursor:default}.element-editor__element--dragging{opacity:.3;cursor:grabbing}.elemental-editor-list{background-color:#fff;border-top:1px solid rgb(218.7079545455,224.0352272727,232.6920454545);margin-left:-1.5385rem;margin-right:-1.5385rem;min-height:calc(8rem + 1px);position:relative;margin-bottom:1.5385rem}.elemental-editor-list--empty{border-bottom:1px solid rgb(218.7079545455,224.0352272727,232.6920454545);display:flex;align-items:center;justify-content:center}.element-editor-editform{margin-top:.76925rem;cursor:auto;margin-bottom:-1rem}.element-editor-editform .mce-tinymce{box-sizing:border-box}.element-editor-editform__form{width:100%}.element-editor-editform .element-editor-editform__form .form-group .form__field-holder{flex:1 0 100%;max-width:900px}.element-editor-editform--rendered-not-visible{position:absolute;top:-9999px;left:-9999px}.element-editor-editform .btn--hidden{display:none}.element-editor-editform .text-checkbox-group-field{align-items:flex-start}.element-editor-editform .text-checkbox-group-field .form-group{margin-bottom:0;flex:auto}.element-editor-header{display:flex;align-items:center;justify-content:space-between}.element-editor-header__title{font-size:15px;font-weight:400;margin:0 0 0 .76925rem;-webkit-font-smoothing:antialiased;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor-header__title--none{font-style:italic;color:rgb(111.3181818182,132.4090909091,166.6818181818)}.element-editor-header__info,.element-editor-header__actions{align-items:center;display:flex;flex-grow:1}.element-editor-header__info{max-width:calc(100% - 60px)}.element-editor-header__info .badge{padding:2px 3px 2px 4px;margin-left:.5rem}.element-editor-header__actions{justify-content:flex-end}.element-editor-header__actions-toggle{padding-top:3px;padding-bottom:3px}.element-editor-header__icon-container{margin-left:-2px;color:rgb(86.4147727273,107.0511363636,140.5852272727);font-size:2.154rem;height:28px;line-height:1.5rem}.element-editor-header__icon-container--broken{color:#da273b}.element-editor-header__expand{font-size:1.1rem;margin-left:3px;width:unset}.element-editor-header__version-state{border:1px solid #cf3f00;border-radius:100%;bottom:6px;box-shadow:0 0 1px .5px #fff;display:block;height:8px;left:22px;position:relative;width:8px;z-index:1}.element-editor-header__version-state--draft{background-color:#ff7f22}.element-editor-header__version-state--modified{background-color:#fff7f0}.element-editor-header__drag-handle{display:none;position:absolute;left:5px;cursor:grab}.element-editor-header--simple .element-editor-header__drag-handle{display:block}.element-editor-header--simple .element-editor-header__info{width:460px}.element-editor-header .dropdown-item.active{cursor:default}.element-editor-summary{display:flex;margin-top:.9231rem;margin-left:36px;align-items:center;min-height:2em}.element-editor-summary__thumbnail-image{border-radius:.1536rem;height:36px;margin:-.6154rem .9231rem -.6154rem 0}.element-editor-summary__content{color:rgb(86.4147727273,107.0511363636,140.5852272727);line-height:1.3;margin-bottom:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.element-editor-summary__content--broken{overflow:visible;white-space:normal}.element-editor__toolbar{margin-bottom:1rem}.element-editor__hover-bar{height:0;display:flex;width:100%;position:relative;align-items:center}.element-editor__hover-bar-area{background-color:rgba(0,0,0,0);min-height:1.8462rem;width:100%;margin:0;padding:0;border:0;outline:none;transition:all ease .2s;position:relative}.element-editor__hover-bar-area:hover,.element-editor__hover-bar-area:focus,.element-editor__hover-bar-area--focus{outline:none}.element-editor__hover-bar-area:hover .element-editor__hover-bar-area-inner,.element-editor__hover-bar-area:focus .element-editor__hover-bar-area-inner,.element-editor__hover-bar-area--focus .element-editor__hover-bar-area-inner{margin:0 20px}.element-editor__hover-bar-area:hover .element-editor__hover-bar-line,.element-editor__hover-bar-area:focus .element-editor__hover-bar-line,.element-editor__hover-bar-area--focus .element-editor__hover-bar-line{opacity:1;border-radius:5px;max-height:5px}.element-editor__hover-bar-area:hover .element-editor__hover-bar-line:before,.element-editor__hover-bar-area:focus .element-editor__hover-bar-line:before,.element-editor__hover-bar-area--focus .element-editor__hover-bar-line:before{transform:translateY(calc(3px - 50%)) scale(1)}.element-editor__hover-bar-area-inner{margin:0;display:block;position:relative;transition:all ease .2s}.element-editor__hover-bar-line{background-color:#005ae1;transition:all ease .2s;opacity:0;align-self:center;width:100%;border:0;position:absolute;display:flex;justify-content:flex-end;padding:0;top:50%;transform:translateY(-66%);max-height:0;border-radius:0}.element-editor__hover-bar-line:before{font-size:1.5rem;background-image:radial-gradient(#fff 50%, transparent 50%);position:relative;z-index:2;margin-right:50%;right:-0.5em;display:block;height:1em;transform:translateY(calc(-1px - 50%)) scale(0);transition:all ease .2s;color:#005ae1}.elemental-editor-drag-indicator{height:3px;margin:-2px 0 -1px;background-color:#29abe2}.elemental-editor-drag-indicator__ball{position:relative;height:7px;width:7px;top:-2px;left:-3px;border-radius:3.5px;background-color:#29abe2}.element-editor--dragging{cursor:grabbing}.element-editor-drag-preview{top:0;left:0;position:fixed;pointer-events:none;z-index:100;background-color:#fff;border:1px solid rgb(206.0738636364,213.2556818182,224.9261363636);padding:.9231rem 1.5385rem;box-shadow:0 2px 5px 0 rgba(0,0,0,.1),0 2px 10px 0 rgba(0,0,0,.1)}.text-checkbox-group-field .form-check{display:inline;padding-left:0;margin-bottom:0}.text-checkbox-group-field--read-only{display:flex}.text-checkbox-group-field--read-only :first-child{flex:1}.text-checkbox-group-field--read-only .show-title{font-style:italic} +/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************!*\ + !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[0].use[3]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[4]!./client/src/styles/bundle.scss ***! + \*****************************************************************************************************************************************************************************************************************************************************************************************************************************/ +.elemental-edit { + display: flex; + color: inherit; +} +.elemental-edit:hover, .elemental-edit:focus { + text-decoration: none; + color: inherit; +} + +.elemental-editor .col-EditorPreview { + padding-left: 0; +} + +.elemental-preview__detail { + display: inline-block; + margin-left: 0.76925rem; + margin-top: 1px; +} +.elemental-preview__detail h3 { + font-weight: 400; + line-height: 26px; + margin: 0; + -webkit-font-smoothing: antialiased; +} +.elemental-preview__detail p { + align-items: center; + display: flex; + margin-bottom: 0; + margin-top: 6px; +} +.elemental-preview__detail small { + color: rgb(86.4147727273, 107.0511363636, 140.5852272727); + font-size: 13px; +} + +.elemental-preview__thumbnail-image { + margin-right: 0.76925rem; +} +.elemental-preview__thumbnail-image img { + border-radius: 0.192rem; +} + +.elemental-preview__thumbnail-image--placeholder { + border-radius: 0; + height: 36px; + margin-left: -4px; +} + +.elemental-preview__icon { + color: rgb(86.4147727273, 107.0511363636, 140.5852272727); + display: inline-block; + flex-direction: row; + font-size: 2.3rem; + width: 28px; + vertical-align: top; + margin-top: -1px; +} + +.ss-gridfield-orderable.elemental-editor .col-reorder .handle { + opacity: 0.5; + padding: 22px 0 0; +} +.ss-gridfield-orderable.elemental-editor .col-reorder .handle .icon { + font-size: 1.3em; +} + +.elemental-editor .ss-gridfield-item:hover .handle { + opacity: 1; +} +.elemental-editor .grid-field__table { + margin-bottom: 12px; +} +@media (max-width: 991.98px) { + .elemental-editor .grid-field__table .col-EditorPreview { + display: table-cell; + } +} + +.elemental-report__grid-field .element-editor-header__version-state { + bottom: 9px; + left: 14px; +} + +.element-editor .form-group:nth-child(1n) { + display: block; +} +@media (min-width: 992px) { + .element-editor .form-group:nth-child(1n) .form__field-label, + .element-editor .form-group:nth-child(1n) .form__field-holder { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; + margin-left: 0; + } +} + +.elemental-block__history-tab { + margin-top: -1.5385rem; +} + +.cms-edit-form .fieldgroup.elemental-area__element--historic { + margin-left: 0; + margin-right: 0; +} +.cms-edit-form .fieldgroup.elemental-area__element--historic.form-group { + border-top: 1px solid rgb(218.7079545455, 224.0352272727, 232.6920454545); +} +.cms-edit-form .fieldgroup.elemental-area__element--historic .form__field-holder { + flex: 0 0 100%; + max-width: 100%; +} + +.elemental-preview { + line-height: 20px; +} + +.elemental-preview--historic { + margin-bottom: 1rem; +} + +.elemental-preview__link { + float: right; + margin-top: 4px; +} +.elemental-preview__link:hover { + text-decoration: none; +} +.elemental-preview__link:hover .elemental-preview__link-text { + text-decoration: underline; +} +.elemental-preview__link-caret { + display: block; + float: right; + margin-top: -2px; + margin-left: 2px; +} + +div.elemental-area__element--historic.elemental-area__element--historic-inner { + background: transparent; + border: 0; + padding-left: 0; + padding-right: 0; + padding-top: 1.5385rem; +} + +.elemental-area--read-only { + border-bottom: 1px solid rgb(218.7079545455, 224.0352272727, 232.6920454545); + margin: 2.30775rem -1.5385rem; +} + +.history-viewer__version-detail fieldset { + overflow: visible; +} + +.elemental-report__grid-field .ss-gridfield-item td:first-child { + width: 1px; +} + +.elemental-report__grid-field .col-Icon { + font-size: 1.5rem; +} + +.elemental-report__grid-field .element-item--draft, +.elemental-report__grid-field .element-item--modified { + bottom: 8px; + left: 14px; + height: 6px; + width: 6px; +} + +.textcheckboxgroup .input-group-append .form-check-input { + margin-left: 0; + position: relative; +} + +.element-editor .action-menu .dropdown-item.disabled { + font-style: italic; + pointer-events: initial; + cursor: not-allowed; + color: rgb(111.3181818182, 132.4090909091, 166.6818181818); +} + +.elemental-editor__add-new-block-control { + width: 20rem; +} +.elemental-editor__add-new-block-control a { + line-height: 1.85em; +} + +.element-editor__element { + border-bottom: 1px solid rgb(218.7079545455, 224.0352272727, 232.6920454545); + color: inherit; + cursor: pointer; + min-height: 8rem; + padding: 0.9231rem 1.5385rem 1.8462rem; +} +.element-editor__element:focus, .element-editor__element:hover { + box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1), 0 2px 10px 0 rgba(0, 0, 0, 0.1); + outline-width: 0; +} +.element-editor__element:hover .element-editor-header__drag-handle { + display: block; +} +.element-editor__element--broken { + cursor: default; +} +.element-editor__element--dragging { + opacity: 0.3; + cursor: grabbing; +} + +.elemental-editor-list { + background-color: #fff; + border-top: 1px solid rgb(218.7079545455, 224.0352272727, 232.6920454545); + margin-left: -1.5385rem; + margin-right: -1.5385rem; + min-height: calc(8rem + 1px); + position: relative; + margin-bottom: 1.5385rem; +} +.elemental-editor-list--empty { + border-bottom: 1px solid rgb(218.7079545455, 224.0352272727, 232.6920454545); + display: flex; + align-items: center; + justify-content: center; +} + +.element-editor-editform { + margin-top: 0.76925rem; + cursor: auto; + margin-bottom: -1rem; +} +.element-editor-editform .mce-tinymce { + box-sizing: border-box; +} +.element-editor-editform__form { + width: 100%; +} +.element-editor-editform .element-editor-editform__form .form-group .form__field-holder { + flex: 1 0 100%; + max-width: 900px; +} +.element-editor-editform--rendered-not-visible { + position: absolute; + top: -9999px; + left: -9999px; +} +.element-editor-editform .btn--hidden { + display: none; +} +.element-editor-editform .text-checkbox-group-field { + align-items: flex-start; +} +.element-editor-editform .text-checkbox-group-field .form-group { + margin-bottom: 0; + flex: auto; +} + +.element-editor-header { + display: flex; + align-items: center; + justify-content: space-between; +} +.element-editor-header__title { + font-size: 15px; + font-weight: 400; + margin: 0 0 0 0.76925rem; + -webkit-font-smoothing: antialiased; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.element-editor-header__title--none { + font-style: italic; + color: rgb(111.3181818182, 132.4090909091, 166.6818181818); +} +.element-editor-header__info, .element-editor-header__actions { + align-items: center; + display: flex; + flex-grow: 1; +} +.element-editor-header__info { + max-width: calc(100% - 60px); +} +.element-editor-header__info .badge { + padding: 2px 3px 2px 4px; + margin-left: 0.5rem; +} +.element-editor-header__actions { + justify-content: flex-end; +} +.element-editor-header__actions-toggle { + padding-top: 3px; + padding-bottom: 3px; +} +.element-editor-header__icon-container { + margin-left: -2px; + color: rgb(86.4147727273, 107.0511363636, 140.5852272727); + font-size: 2.154rem; + height: 28px; + line-height: 1.5rem; +} +.element-editor-header__icon-container--broken { + color: #da273b; +} +.element-editor-header__expand { + font-size: 1.1rem; + margin-left: 3px; + width: unset; +} +.element-editor-header__version-state { + border: 1px solid #cf3f00; + border-radius: 100%; + bottom: 6px; + box-shadow: 0 0 1px 0.5px #fff; + display: block; + height: 8px; + left: 22px; + position: relative; + width: 8px; + z-index: 1; +} +.element-editor-header__version-state--draft { + background-color: #ff7f22; +} +.element-editor-header__version-state--modified { + background-color: #fff7f0; +} +.element-editor-header__drag-handle { + display: none; + position: absolute; + left: 5px; + cursor: grab; +} +.element-editor-header--simple .element-editor-header__drag-handle { + display: block; +} +.element-editor-header--simple .element-editor-header__info { + width: 460px; +} +.element-editor-header .dropdown-item.active { + cursor: default; +} + +.element-editor-summary { + display: flex; + margin-top: 0.9231rem; + margin-left: 36px; + align-items: center; + min-height: 2em; +} +.element-editor-summary__thumbnail-image { + border-radius: 0.1536rem; + height: 36px; + margin: -0.6154rem 0.9231rem -0.6154rem 0; +} +.element-editor-summary__content { + color: rgb(86.4147727273, 107.0511363636, 140.5852272727); + line-height: 1.3; + margin-bottom: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} +.element-editor-summary__content--broken { + overflow: visible; + white-space: normal; +} + +.element-editor__toolbar { + margin-bottom: 1rem; +} + +.element-editor__hover-bar { + height: 0; + display: flex; + width: 100%; + position: relative; + align-items: center; +} +.element-editor__hover-bar-area { + background-color: transparent; + min-height: 1.8462rem; + width: 100%; + margin: 0; + padding: 0; + border: 0; + outline: none; + transition: all ease 0.2s; + position: relative; +} +.element-editor__hover-bar-area:hover, .element-editor__hover-bar-area:focus, .element-editor__hover-bar-area--focus { + outline: none; +} +.element-editor__hover-bar-area:hover .element-editor__hover-bar-area-inner, .element-editor__hover-bar-area:focus .element-editor__hover-bar-area-inner, .element-editor__hover-bar-area--focus .element-editor__hover-bar-area-inner { + margin: 0 20px; +} +.element-editor__hover-bar-area:hover .element-editor__hover-bar-line, .element-editor__hover-bar-area:focus .element-editor__hover-bar-line, .element-editor__hover-bar-area--focus .element-editor__hover-bar-line { + opacity: 1; + border-radius: 5px; + max-height: 5px; +} +.element-editor__hover-bar-area:hover .element-editor__hover-bar-line:before, .element-editor__hover-bar-area:focus .element-editor__hover-bar-line:before, .element-editor__hover-bar-area--focus .element-editor__hover-bar-line:before { + transform: translateY(calc(3px - 50%)) scale(1); +} +.element-editor__hover-bar-area-inner { + margin: 0; + display: block; + position: relative; + transition: all ease 0.2s; +} +.element-editor__hover-bar-line { + background-color: #005ae1; + transition: all ease 0.2s; + opacity: 0; + align-self: center; + width: 100%; + border: 0; + position: absolute; + display: flex; + justify-content: flex-end; + padding: 0; + top: 50%; + transform: translateY(-66%); + max-height: 0; + border-radius: 0; +} +.element-editor__hover-bar-line:before { + font-size: 1.5rem; + background-image: radial-gradient(#fff 50%, transparent 50%); + position: relative; + z-index: 2; + margin-right: 50%; + right: -0.5em; + display: block; + height: 1em; + transform: translateY(calc(-1px - 50%)) scale(0); + transition: all ease 0.2s; + color: #005ae1; +} + +.elemental-editor-drag-indicator { + height: 3px; + margin: -2px 0 -1px; + background-color: #29abe2; +} +.elemental-editor-drag-indicator__ball { + position: relative; + height: 7px; + width: 7px; + top: -2px; + left: -3px; + border-radius: 3.5px; + background-color: #29abe2; +} + +.element-editor--dragging { + cursor: grabbing; +} + +.text-checkbox-group-field .form-check { + display: inline; + padding-left: 0; + margin-bottom: 0; +} +.text-checkbox-group-field--read-only { + display: flex; +} +.text-checkbox-group-field--read-only :first-child { + flex: 1; +} +.text-checkbox-group-field--read-only .show-title { + font-style: italic; +} + +/*# sourceMappingURL=bundle.css.map*/ \ No newline at end of file diff --git a/client/src/components/ElementEditor/Element.js b/client/src/components/ElementEditor/Element.js index b0db95eb..6e17127c 100644 --- a/client/src/components/ElementEditor/Element.js +++ b/client/src/components/ElementEditor/Element.js @@ -13,9 +13,8 @@ import { submit } from 'redux-form'; import { loadElementFormStateName } from 'state/editor/loadElementFormStateName'; import { loadElementSchemaValue } from 'state/editor/loadElementSchemaValue'; import * as TabsActions from 'state/tabs/TabsActions'; -import { DragSource, DropTarget } from 'react-dnd'; -import { getEmptyImage } from 'react-dnd-html5-backend'; -import { elementDragSource, isOverTop } from 'lib/dragHelpers'; +import { useSortable } from '@dnd-kit/sortable'; +import { CSS } from '@dnd-kit/utilities'; import * as toastsActions from 'state/toasts/ToastsActions'; import { addFormChanged, removeFormChanged } from 'state/unsavedForms/UnsavedFormsActions'; import { ElementEditorContext } from 'components/ElementEditor/ElementEditor'; @@ -43,6 +42,21 @@ const Element = (props) => { const [doDispatchAddFormChanged, setDoDispatchAddFormChanged] = useState(false); const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false); const { fetchElements } = useContext(ElementEditorContext); + const { + attributes, + listeners, + setNodeRef, + transform, + transition, + isDragging, + isOver, + over, + } = useSortable({ id: props.element.id }); + + const style = { + transform: CSS.Transform.toString(transform), + transition, + }; useEffect(() => { // Note that formDirty from redux can be set to undefined after failed validation @@ -65,18 +79,6 @@ const Element = (props) => { } }, [props.saveElement, hasUnsavedChanges, props.increment]); - useEffect(() => { - if (props.connectDragPreview) { - // Use empty image as a drag preview so browsers don't draw it - // and we can draw whatever we want on the custom drag layer instead. - props.connectDragPreview(getEmptyImage(), { - // IE fallback: specify that we'd rather screenshot the node - // when it already knows it's being dragged so we can hide it with CSS. - captureDraggingState: true, - }); - } - }, []); - useEffect(() => { if (justClickedPublishButton && formHasRendered) { setJustClickedPublishButton(false); @@ -363,11 +365,6 @@ const Element = (props) => { ContentComponent, link, activeTab, - connectDragSource, - connectDropTarget, - isDragging, - isOver, - onDragEnd, formDirty, } = props; @@ -393,7 +390,7 @@ const Element = (props) => { onSaveButtonClick: handleSaveButtonClick, }; - const content = connectDropTarget(
{ tabIndex={0} title={getLinkTitle(type)} key={element.id} + // sortable properties + ref={setNodeRef} + {...attributes} + {...listeners} + style={style} > { handleEditTabsClick={handleTabClick} activeTab={activeTab} disableTooltip={isDragging} - onDragEnd={onDragEnd} /> { onFormInit={() => handleFormInit(activeTab)} /> -
); - - if (!previewExpanded) { - return connectDragSource(content); - } + ; return content; }; @@ -508,14 +505,7 @@ Element.propTypes = { activeTab: PropTypes.string, tabSetName: PropTypes.string, onActivateTab: PropTypes.func, - connectDragSource: PropTypes.func.isRequired, - connectDragPreview: PropTypes.func.isRequired, - connectDropTarget: PropTypes.func.isRequired, - isDragging: PropTypes.bool.isRequired, isOver: PropTypes.bool.isRequired, - onDragOver: PropTypes.func, // eslint-disable-line react/no-unused-prop-types - onDragEnd: PropTypes.func, // eslint-disable-line react/no-unused-prop-types - onDragStart: PropTypes.func, // eslint-disable-line react/no-unused-prop-types saveElement: PropTypes.bool.isRequired, onBeforeSubmitForm: PropTypes.func.isRequired, // eslint-disable-line react/no-unused-prop-types onAfterSubmitResponse: PropTypes.func.isRequired, @@ -529,35 +519,7 @@ Element.defaultProps = { export { Element as Component }; -const elementTarget = { - drop(props, monitor, component) { - const { element } = props; - - return { - target: element.id, - dropSpot: isOverTop(monitor, component) ? 'top' : 'bottom', - }; - }, - - hover(props, monitor, component) { - const { element, onDragOver } = props; - - if (onDragOver) { - onDragOver(element, isOverTop(monitor, component)); - } - }, -}; - export default compose( - DropTarget('element', elementTarget, (connector, monitor) => ({ - connectDropTarget: connector.dropTarget(), - isOver: monitor.isOver(), - })), - DragSource('element', elementDragSource, (connector, monitor) => ({ - connectDragSource: connector.dragSource(), - connectDragPreview: connector.dragPreview(), - isDragging: monitor.isDragging(), - })), connect(mapStateToProps, mapDispatchToProps), inject( ['ElementHeader', 'ElementContent'], diff --git a/client/src/components/ElementEditor/ElementDragPreview.js b/client/src/components/ElementEditor/ElementDragPreview.js deleted file mode 100644 index a37abb9f..00000000 --- a/client/src/components/ElementEditor/ElementDragPreview.js +++ /dev/null @@ -1,52 +0,0 @@ -import React, { Component } from 'react'; -import PropTypes from 'prop-types'; -import Header from 'components/ElementEditor/Header'; -import { DragLayer } from 'react-dnd'; -import { elementType } from 'types/elementType'; -import { elementTypeType } from 'types/elementTypeType'; -import { getElementTypeConfig } from 'state/editor/elementConfig'; - -// eslint-disable-next-line react/prefer-stateless-function -class ElementDragPreview extends Component { - render() { - const { isDragging, element, elementTypes, currentOffset } = this.props; - - if (!isDragging || !currentOffset) { - return null; - } - - const { x, y } = currentOffset; - const transform = `translate(${x}px, ${y}px)`; - const style = { - transform, - WebkitTransform: transform, - }; - const type = getElementTypeConfig(element, elementTypes); - - return ( -
-
-
- ); - } -} - -ElementDragPreview.propTypes = { - element: elementType, - elementTypes: PropTypes.arrayOf(elementTypeType), - isDragging: PropTypes.bool, - currentOffset: PropTypes.shape({ - x: PropTypes.number.isRequired, - y: PropTypes.number.isRequired, - }), -}; - -export default DragLayer(monitor => ({ - element: monitor.getItem(), - currentOffset: monitor.getSourceClientOffset(), - isDragging: monitor.isDragging(), -}))(ElementDragPreview); diff --git a/client/src/components/ElementEditor/ElementDragPreview.scss b/client/src/components/ElementEditor/ElementDragPreview.scss deleted file mode 100644 index 89bd0888..00000000 --- a/client/src/components/ElementEditor/ElementDragPreview.scss +++ /dev/null @@ -1,11 +0,0 @@ -.element-editor-drag-preview { - top: 0; - left: 0; - position: fixed; - pointer-events: none; - z-index: 100; // Higher than CMS tree view - background-color: $white; - border: 1px solid $border-color; - padding: $spacer-sm $panel-padding-x; - box-shadow: $z-depth-1; -} diff --git a/client/src/components/ElementEditor/ElementEditor.js b/client/src/components/ElementEditor/ElementEditor.js index 02dc5b6b..d827b7ff 100644 --- a/client/src/components/ElementEditor/ElementEditor.js +++ b/client/src/components/ElementEditor/ElementEditor.js @@ -5,14 +5,13 @@ import { connect } from 'react-redux'; import { inject } from 'lib/Injector'; import { bindActionCreators, compose } from 'redux'; import { elementTypeType } from 'types/elementTypeType'; -import { DropTarget } from 'react-dnd'; -import ElementDragPreview from 'components/ElementEditor/ElementDragPreview'; import withDragDropContext from 'lib/withDragDropContext'; import backend from 'lib/Backend'; import Config from 'lib/Config'; import { getConfig } from 'state/editor/elementConfig'; import * as toastsActions from 'state/toasts/ToastsActions'; import getJsonErrorMessage from 'lib/getJsonErrorMessage'; +import { arrayMove } from '@dnd-kit/sortable'; export const ElementEditorContext = createContext(null); @@ -31,40 +30,47 @@ class ElementEditor extends PureComponent { isLoading: true, }; - this.handleDragOver = this.handleDragOver.bind(this); + this.handleDragStart = this.handleDragStart.bind(this); this.handleDragEnd = this.handleDragEnd.bind(this); this.fetchElements = this.fetchElements.bind(this); } /** - * Hook for ReactDND triggered by hovering over a drag _target_. - * - * This tracks the current hover target and whether it's above the top half of the target - * or the bottom half. - * - * @param element - * @param isOverTop + * Hook triggered when a draggable is picked up. */ - handleDragOver(element = null, isOverTop = null) { - const id = element ? element.id : false; - + handleDragStart(event) { + const { active } = event; this.setState({ - dragTargetElementId: id, - dragSpot: isOverTop === false ? 'bottom' : 'top', + dragging: active.id, }); } /** - * Hook for ReactDND triggered when a drag source is dropped onto a drag target. - * - * @param sourceId - * @param afterId + * Hook triggered when a draggable is dropped onto a drop target. */ - handleDragEnd(sourceId, afterId) { + handleDragEnd(event) { + const { active, over } = event; + const { elements } = this.state; + + // This happens if letting go of the draggable where it started. + if (active.id === over.id) { + this.setState({ + dragging: false, + }); + return; + } + + // Find out where the new block will be moved to + const elementIDs = elements.map(e => e.id); + const fromIndex = elementIDs.indexOf(active.id); + const toIndex = elementIDs.indexOf(over.id); + const sortedElementIDs = arrayMove(elementIDs, fromIndex, toIndex); + const afterBlockID = toIndex > 0 ? sortedElementIDs[toIndex - 1] : 0; + const url = `${getConfig().controllerLink.replace(/\/$/, '')}/api/sort`; backend.post(url, { - id: sourceId, - afterBlockID: afterId, + id: active.id, + afterBlockID, }, { 'X-SecurityID': Config.get('SecurityID') }) @@ -75,8 +81,7 @@ class ElementEditor extends PureComponent { }); this.setState({ - dragTargetElementId: null, - dragSpot: null, + dragging: false, }); } @@ -121,13 +126,11 @@ class ElementEditor extends PureComponent { ListComponent, areaId, elementTypes, - isDraggingOver, - connectDropTarget, allowedElements, sharedObject, isLoading, } = this.props; - const { dragTargetElementId, dragSpot, elements } = this.state; + const { dragging, elements } = this.state; if (elements === null) { this.fetchElements(false); @@ -146,32 +149,25 @@ class ElementEditor extends PureComponent { fetchElements: this.fetchElements, }; - return connectDropTarget( -
- - - - - -
- ); + return
+ + + + +
; } } @@ -188,10 +184,6 @@ export { ElementEditor as Component }; const params = [ withDragDropContext, - DropTarget('element', {}, (connector, monitor) => ({ - connectDropTarget: connector.dropTarget(), - isDraggingOver: monitor.isOver(), // isDragging is not available on DropTargetMonitor - })), inject( ['ElementToolbar', 'ElementList'], (ToolbarComponent, ListComponent) => ({ diff --git a/client/src/components/ElementEditor/ElementList.js b/client/src/components/ElementEditor/ElementList.js index 39b4b204..65767305 100644 --- a/client/src/components/ElementEditor/ElementList.js +++ b/client/src/components/ElementEditor/ElementList.js @@ -6,7 +6,9 @@ import { compose } from 'redux'; import { inject } from 'lib/Injector'; import classNames from 'classnames'; import i18n from 'i18n'; -import { DropTarget } from 'react-dnd'; +import { DndContext, closestCenter, PointerSensor, useSensor, useSensors } from '@dnd-kit/core'; +import { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'; +import { restrictToVerticalAxis, restrictToParentElement } from '@dnd-kit/modifiers'; import { getDragIndicatorIndex } from 'lib/dragHelpers'; import { getElementTypeConfig } from 'state/editor/elementConfig'; @@ -150,9 +152,8 @@ class ElementList extends Component { elementTypes, areaId, onDragEnd, - onDragOver, onDragStart, - isDraggingOver, + dragging, } = this.props; if (elements.length === 0) { @@ -163,32 +164,30 @@ class ElementList extends Component { const saveElement = this.state.saveAllElements && this.state.hasUnsavedChangesBlockIDs[element.id] && this.state.validBlockIDs[element.id] === null; - return
+ return <> this.handleChangeHasUnsavedChanges(element.id, hasUnsavedChanges)} onBeforeSubmitForm={() => this.handleBeforeSubmitForm(element.id)} onAfterSubmitResponse={(valid) => this.handleAfterSubmitResponse(element.id, valid)} increment={this.state.increment} /> - {isDraggingOver || } -
; + ; }); // Add a insert point above the first block for consistency - if (!isDraggingOver) { + if (dragging === false) { output = [ ); } - return output; + return + element.id)} + strategy={verticalListSortingStrategy} + > + {output} + + ; } /** @@ -232,12 +245,10 @@ class ElementList extends Component { { 'elemental-editor-list--empty': !elements || !elements.length } ); - return this.props.connectDropTarget( -
- {this.renderLoading()} - {this.renderBlocks()} -
- ); + return
+ {this.renderLoading()} + {this.renderBlocks()} +
; } } @@ -247,9 +258,9 @@ ElementList.propTypes = { allowedElementTypes: PropTypes.arrayOf(elementTypeType).isRequired, areaId: PropTypes.number.isRequired, dragTargetElementId: PropTypes.oneOfType([PropTypes.number, PropTypes.bool]), - onDragOver: PropTypes.func, onDragStart: PropTypes.func, onDragEnd: PropTypes.func, + dragging: PropTypes.oneOf([PropTypes.bool, PropTypes.number]), sharedObject: PropTypes.object.isRequired, }; @@ -264,35 +275,7 @@ ElementList.defaultProps = { export { ElementList as Component }; -const elementListTarget = { - drop(props, monitor) { - const { elements } = props; - const elementTargetDropResult = monitor.getDropResult(); - - if (!elementTargetDropResult) { - return {}; - } - - const dropIndex = getDragIndicatorIndex( - elements.map(element => element.id), - elementTargetDropResult.target, - monitor.getItem(), - elementTargetDropResult.dropSpot, - ); - const dropAfterID = elements[dropIndex - 1] ? elements[dropIndex - 1].id : '0'; - - return { - ...elementTargetDropResult, - dropAfterID, - }; - }, -}; - export default compose( - DropTarget('element', elementListTarget, (connector, monitor) => ({ - connectDropTarget: connector.dropTarget(), - draggedItem: monitor.getItem(), - })), inject( ['Element', 'Loading', 'HoverBar', 'DragPositionIndicator'], (ElementComponent, LoadingComponent, HoverBarComponent, DragIndicatorComponent) => ({ diff --git a/client/src/components/ElementEditor/Header.js b/client/src/components/ElementEditor/Header.js index 44b8d533..29ac0a3d 100644 --- a/client/src/components/ElementEditor/Header.js +++ b/client/src/components/ElementEditor/Header.js @@ -7,9 +7,6 @@ import { compose } from 'redux'; import { inject } from 'lib/Injector'; import i18n from 'i18n'; import classNames from 'classnames'; -import { DragSource } from 'react-dnd'; -import { elementDragSource } from 'lib/dragHelpers'; -import { getEmptyImage } from 'react-dnd-html5-backend'; class Header extends Component { constructor(props) { @@ -22,19 +19,6 @@ class Header extends Component { }; } - componentDidMount() { - const { connectDragPreview } = this.props; - if (connectDragPreview) { - // Use empty image as a drag preview so browsers don't draw it - // and we can draw whatever we want on the custom drag layer instead. - connectDragPreview(getEmptyImage(), { - // IE fallback: specify that we'd rather screenshot the node - // when it already knows it's being dragged so we can hide it with CSS. - captureDraggingState: true, - }); - } - } - componentDidUpdate() { const { tooltipOpen } = this.state; const { disableTooltip } = this.props; @@ -136,7 +120,7 @@ class Header extends Component { render() { const { - connectDragSource, + // connectDragSource, element, type, areaId, @@ -214,10 +198,6 @@ class Header extends Component { ); - if (previewExpanded) { - return connectDragSource(content); - } - return content; } } @@ -231,9 +211,6 @@ Header.propTypes = { ElementActionsComponent: PropTypes.elementType, previewExpanded: PropTypes.bool, disableTooltip: PropTypes.bool, - connectDragSource: PropTypes.func.isRequired, - connectDragPreview: PropTypes.func.isRequired, - onDragEnd: PropTypes.func, // eslint-disable-line react/no-unused-prop-types }; Header.defaultProps = { @@ -243,10 +220,6 @@ Header.defaultProps = { export { Header as Component }; export default compose( - DragSource('element', elementDragSource, connector => ({ - connectDragSource: connector.dragSource(), - connectDragPreview: connector.dragPreview(), - })), inject( ['ElementActions'], (ElementActionsComponent) => ({ diff --git a/client/src/components/ElementEditor/Toolbar.js b/client/src/components/ElementEditor/Toolbar.js index fc942fc6..870ebcc5 100644 --- a/client/src/components/ElementEditor/Toolbar.js +++ b/client/src/components/ElementEditor/Toolbar.js @@ -2,20 +2,17 @@ import React, { PureComponent } from 'react'; import PropTypes from 'prop-types'; import { inject } from 'lib/Injector'; import { elementTypeType } from 'types/elementTypeType'; -import { DropTarget } from 'react-dnd'; // eslint-disable-next-line react/prefer-stateless-function class Toolbar extends PureComponent { render() { - const { AddNewButtonComponent, elementTypes, areaId, connectDropTarget } = this.props; - return connectDropTarget( -
- -
- ); + const { AddNewButtonComponent, elementTypes, areaId, } = this.props; + return
+ +
; } } @@ -24,26 +21,13 @@ Toolbar.propTypes = { elementTypes: PropTypes.arrayOf(elementTypeType).isRequired, areaId: PropTypes.number.isRequired, AddNewButtonComponent: PropTypes.elementType.isRequired, - connectDropTarget: PropTypes.func.isRequired, - onDragOver: PropTypes.func, // eslint-disable-line react/no-unused-prop-types onDragDrop: PropTypes.func, // eslint-disable-line react/no-unused-prop-types }; -const toolbarTarget = { - hover(props) { - const { onDragOver } = props; - if (onDragOver) { - onDragOver(); - } - } -}; - -export default DropTarget('element', toolbarTarget, connect => ({ - connectDropTarget: connect.dropTarget(), -}))(inject( +export default inject( ['ElementAddNewButton'], (AddNewButtonComponent) => ({ AddNewButtonComponent, }), () => 'ElementEditor.ElementToolbar' -)(Toolbar)); +)(Toolbar); diff --git a/client/src/styles/bundle.scss b/client/src/styles/bundle.scss index f71f1893..7ec9cd1e 100644 --- a/client/src/styles/bundle.scss +++ b/client/src/styles/bundle.scss @@ -22,5 +22,4 @@ @import "../components/ElementEditor/HoverBar"; @import "../components/ElementEditor/DragPositionIndicator"; @import "../components/ElementEditor/ElementEditor"; -@import "../components/ElementEditor/ElementDragPreview"; @import "../components/TextCheckboxGroupField/TextCheckboxGroupField"; diff --git a/package.json b/package.json index 6bc28364..41949edd 100644 --- a/package.json +++ b/package.json @@ -33,13 +33,14 @@ }, "homepage": "https://github.com/dnadesign/silverstripe-elemental#readme", "dependencies": { + "@dnd-kit/core": "^6.3.1", + "@dnd-kit/modifiers": "^9.0.0", + "@dnd-kit/sortable": "^10.0.0", "@popperjs/core": "^2.11.6", "bootstrap": "^4.6.2", "classnames": "^2.3.2", "prop-types": "^15.8.1", "react": "^18.2.0", - "react-dnd": "^5.0.0", - "react-dnd-html5-backend": "^5.0.1", "react-dom": "^18.2.0", "react-redux": "^8.0.4", "reactstrap": "^8.9.0", diff --git a/yarn.lock b/yarn.lock index 98ea88c1..cbf36b29 100644 --- a/yarn.lock +++ b/yarn.lock @@ -993,6 +993,45 @@ resolved "https://registry.yarnpkg.com/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz#1d572bfbbe14b7704e0ba0f39b74815b84870d70" integrity sha512-dBVuXR082gk3jsFp7Rd/JI4kytwGHecnCoTtXFb7DB6CNHp4rg5k1bhg0nWdLGLnOV71lmDzGQaLMy8iPLY0pw== +"@dnd-kit/accessibility@^3.1.1": + version "3.1.1" + resolved "https://registry.yarnpkg.com/@dnd-kit/accessibility/-/accessibility-3.1.1.tgz#3b4202bd6bb370a0730f6734867785919beac6af" + integrity sha512-2P+YgaXF+gRsIihwwY1gCsQSYnu9Zyj2py8kY5fFvUM1qm2WA2u639R6YNVfU4GWr+ZM5mqEsfHZZLoRONbemw== + dependencies: + tslib "^2.0.0" + +"@dnd-kit/core@^6.3.1": + version "6.3.1" + resolved "https://registry.yarnpkg.com/@dnd-kit/core/-/core-6.3.1.tgz#4c36406a62c7baac499726f899935f93f0e6d003" + integrity sha512-xkGBRQQab4RLwgXxoqETICr6S5JlogafbhNsidmrkVv2YRs5MLwpjoF2qpiGjQt8S9AoxtIV603s0GIUpY5eYQ== + dependencies: + "@dnd-kit/accessibility" "^3.1.1" + "@dnd-kit/utilities" "^3.2.2" + tslib "^2.0.0" + +"@dnd-kit/modifiers@^9.0.0": + version "9.0.0" + resolved "https://registry.yarnpkg.com/@dnd-kit/modifiers/-/modifiers-9.0.0.tgz#96a0280c77b10c716ef79d9792ce7ad04370771d" + integrity sha512-ybiLc66qRGuZoC20wdSSG6pDXFikui/dCNGthxv4Ndy8ylErY0N3KVxY2bgo7AWwIbxDmXDg3ylAFmnrjcbVvw== + dependencies: + "@dnd-kit/utilities" "^3.2.2" + tslib "^2.0.0" + +"@dnd-kit/sortable@^10.0.0": + version "10.0.0" + resolved "https://registry.yarnpkg.com/@dnd-kit/sortable/-/sortable-10.0.0.tgz#1f9382b90d835cd5c65d92824fa9dafb78c4c3e8" + integrity sha512-+xqhmIIzvAYMGfBYYnbKuNicfSsk4RksY2XdmJhT+HAC01nix6fHCztU68jooFiMUB01Ky3F0FyOvhG/BZrWkg== + dependencies: + "@dnd-kit/utilities" "^3.2.2" + tslib "^2.0.0" + +"@dnd-kit/utilities@^3.2.2": + version "3.2.2" + resolved "https://registry.yarnpkg.com/@dnd-kit/utilities/-/utilities-3.2.2.tgz#5a32b6af356dc5f74d61b37d6f7129a4040ced7b" + integrity sha512-+MKAJEOfaBe5SmV6t34p80MMKhjvUz0vRrvVJbPT0WElzaOJ/1xs+D+KDv+tD/NE5ujfrChEcshd4fLn0wpiqg== + dependencies: + tslib "^2.0.0" + "@dual-bundle/import-meta-resolve@^4.1.0": version "4.1.0" resolved "https://registry.yarnpkg.com/@dual-bundle/import-meta-resolve/-/import-meta-resolve-4.1.0.tgz#519c1549b0e147759e7825701ecffd25e5819f7b" @@ -2311,7 +2350,7 @@ arraybuffer.prototype.slice@^1.0.3: is-array-buffer "^3.0.4" is-shared-array-buffer "^1.0.2" -asap@^2.0.0, asap@^2.0.6, asap@~2.0.3: +asap@^2.0.0: version "2.0.6" resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46" integrity sha512-BSHWgDSAiKs50o2Re8ppvp3seVHXSRM44cdSsT9FfNEUUZLOGWVCsiWaRPWM1Znn+mqZ1OfVZ3z3DWEzSp7hRA== @@ -2331,11 +2370,6 @@ asynckit@^0.4.0: resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79" integrity sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q== -autobind-decorator@^2.1.0: - version "2.4.0" - resolved "https://registry.yarnpkg.com/autobind-decorator/-/autobind-decorator-2.4.0.tgz#ea9e1c98708cf3b5b356f7cf9f10f265ff18239c" - integrity sha512-OGYhWUO72V6DafbF8PM8rm3EPbfuyMZcJhtm5/n26IDwO18pohE4eNazLoCGhPiXOCD0gEGmrbU3849QvM8bbw== - autoprefixer@^10.4.13: version "10.4.20" resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-10.4.20.tgz#5caec14d43976ef42e32dcb4bd62878e96be5b3b" @@ -2460,14 +2494,6 @@ babel-preset-jest@^29.6.3: babel-plugin-jest-hoist "^29.6.3" babel-preset-current-node-syntax "^1.0.0" -babel-runtime@^6.26.0: - version "6.26.0" - resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe" - integrity sha512-ITKNuq2wKlW1fJg9sSW52eepoYgZBggvOAHC0u/CYu/qxQ9EVzThCgR69BnSXLHjy2f7SY5zaQ4yt7H9ZVxY2g== - dependencies: - core-js "^2.4.0" - regenerator-runtime "^0.11.0" - balanced-match@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee" @@ -2619,11 +2645,6 @@ chalk@^4.0.0, chalk@^4.1.0, chalk@^4.1.2: ansi-styles "^4.1.0" supports-color "^7.1.0" -change-emitter@^0.1.2: - version "0.1.6" - resolved "https://registry.yarnpkg.com/change-emitter/-/change-emitter-0.1.6.tgz#e8b2fe3d7f1ab7d69a32199aff91ea6931409515" - integrity sha512-YXzt1cQ4a2jqazhcuSWEOc1K2q8g9H6eWNsyZgi640LDzRWVQ2eDe+Y/kVdftH+vYdPF2rgDb3dLdpxE1jvAxw== - char-regex@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/char-regex/-/char-regex-1.0.2.tgz#d744358226217f981ed58f479b1d6bcc29545dcf" @@ -2843,16 +2864,6 @@ core-js-compat@^3.38.0, core-js-compat@^3.38.1: dependencies: browserslist "^4.24.2" -core-js@^1.0.0: - version "1.2.7" - resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636" - integrity sha512-ZiPp9pZlgxpWRu0M+YWbm6+aQ84XEfH1JRXvfOc/fILWI0VKhLC2LX13X1NYq4fULzLMq7Hfh43CSo2/aIaUPA== - -core-js@^2.4.0: - version "2.6.12" - resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.12.tgz#d9333dfa7b065e347cc5682219d6f690859cc2ec" - integrity sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ== - core-js@^3.26.0: version "3.39.0" resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.39.0.tgz#57f7647f4d2d030c32a72ea23a0555b2eaa30f83" @@ -3150,16 +3161,6 @@ dir-glob@^3.0.1: dependencies: path-type "^4.0.0" -dnd-core@^4.0.5: - version "4.0.5" - resolved "https://registry.yarnpkg.com/dnd-core/-/dnd-core-4.0.5.tgz#3b83d138d0d5e265c73ec978dec5e1ed441dc665" - integrity sha512-GSyGmfGom9oyTFJ4Ll/95Dn3ZDvPkrgINwfeOd+gTI0RGIN1TcTGChrHnIHF3A3e1PymyEKZg+3ouN3w2uIJGQ== - dependencies: - asap "^2.0.6" - invariant "^2.2.4" - lodash "^4.17.10" - redux "^4.0.0" - doctrine@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/doctrine/-/doctrine-2.1.0.tgz#5cd01fc101621b42c4cd7f5d1a66243716d3f39d" @@ -3223,7 +3224,7 @@ emojis-list@^3.0.0: resolved "https://registry.yarnpkg.com/emojis-list/-/emojis-list-3.0.0.tgz#5570662046ad29e2e916e71aae260abdff4f6a78" integrity sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q== -encoding@^0.1.11, encoding@^0.1.13: +encoding@^0.1.13: version "0.1.13" resolved "https://registry.yarnpkg.com/encoding/-/encoding-0.1.13.tgz#56574afdd791f54a8e9b2785c0582a2d26210fa9" integrity sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A== @@ -3758,19 +3759,6 @@ fb-watchman@^2.0.0: dependencies: bser "2.1.1" -fbjs@^0.8.1: - version "0.8.18" - resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.18.tgz#9835e0addb9aca2eff53295cd79ca1cfc7c9662a" - integrity sha512-EQaWFK+fEPSoibjNy8IxUtaFOMXcWsY0JaVrQoZR9zC8N2Ygf9iDITPWjUTVIax95b6I742JFLqASHfsag/vKA== - dependencies: - core-js "^1.0.0" - isomorphic-fetch "^2.1.1" - loose-envify "^1.0.0" - object-assign "^4.1.0" - promise "^7.1.1" - setimmediate "^1.0.5" - ua-parser-js "^0.7.30" - file-entry-cache@^6.0.1: version "6.0.1" resolved "https://registry.yarnpkg.com/file-entry-cache/-/file-entry-cache-6.0.1.tgz#211b2dd9659cb0394b073e7323ac3c933d522027" @@ -4138,11 +4126,6 @@ hasown@^2.0.0, hasown@^2.0.1, hasown@^2.0.2: dependencies: function-bind "^1.1.2" -hoist-non-react-statics@^2.3.1, hoist-non-react-statics@^2.5.0: - version "2.5.5" - resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.5.tgz#c5903cf409c0dfd908f388e619d86b9c1174cb47" - integrity sha512-rqcy4pJo55FTTLWt+bU8ukscqHeE/e9KWvsOW2b/a3afxQZhwkQdT1rPPCJ0rYXdj4vNcasY8zHTH+jF/qStxw== - hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2: version "3.3.2" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" @@ -4336,7 +4319,7 @@ interpret@^3.1.1: resolved "https://registry.yarnpkg.com/interpret/-/interpret-3.1.1.tgz#5be0ceed67ca79c6c4bc5cf0d7ee843dcea110c4" integrity sha512-6xwYfHbajpoF0xLW+iwLkhwgvLoZDfjYfoFNu8ftMoXINzwuymNLd9u/KmwtdT2GbR+/Cz66otEGEVVUHX9QLQ== -invariant@^2.1.0, invariant@^2.2.4: +invariant@^2.2.4: version "2.2.4" resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6" integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA== @@ -4542,11 +4525,6 @@ is-shared-array-buffer@^1.0.2, is-shared-array-buffer@^1.0.3: dependencies: call-bind "^1.0.7" -is-stream@^1.0.1: - version "1.1.0" - resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44" - integrity sha512-uQPm8kcs47jx38atAcWTVxyltQYoPT68y9aWYdV6yWXSyW8mzSat0TL6CiWdZeCdF3KrAvpVtnHbTv4RN+rqdQ== - is-stream@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-2.0.1.tgz#fac1e3d53b97ad5a9d0ae9cef2389f5810a5c077" @@ -4608,14 +4586,6 @@ isobject@^3.0.1: resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" integrity sha512-WhB9zCku7EGTj/HQQRz5aUQEUeoQZH2bWcltRErOpymJ4boYE6wL9Tbr23krRPSZ+C5zqNSrSw+Cc7sZZ4b7vg== -isomorphic-fetch@^2.1.1: - version "2.2.1" - resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9" - integrity sha512-9c4TNAKYXM5PRyVcwUZrF3W09nQ+sO7+jydgs4ZGW9dhsLG2VOlISJABombdQqQRXCwuYG3sYV/puGf5rp0qmA== - dependencies: - node-fetch "^1.0.1" - whatwg-fetch ">=0.10.0" - istanbul-lib-coverage@^3.0.0, istanbul-lib-coverage@^3.2.0: version "3.2.2" resolved "https://registry.yarnpkg.com/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz#2d166c4b0644d43a39f04bf6c2edd1e585f31756" @@ -5431,7 +5401,7 @@ lodash.truncate@^4.4.2: resolved "https://registry.yarnpkg.com/lodash.truncate/-/lodash.truncate-4.4.2.tgz#5a350da0b1113b837ecfffd5812cbe58d6eae193" integrity sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw== -lodash@^4.17.10, lodash@^4.17.15, lodash@^4.17.21: +lodash@^4.17.15, lodash@^4.17.21: version "4.17.21" resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.21.tgz#679591c564c3bffaae8454cf0b3df370c3d6911c" integrity sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg== @@ -5735,14 +5705,6 @@ node-addon-api@^7.0.0: resolved "https://registry.yarnpkg.com/node-addon-api/-/node-addon-api-7.1.1.tgz#1aba6693b0f255258a049d621329329322aad558" integrity sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ== -node-fetch@^1.0.1: - version "1.7.3" - resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef" - integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ== - dependencies: - encoding "^0.1.11" - is-stream "^1.0.1" - node-gyp@^9.0.0, node-gyp@^9.1.0: version "9.4.1" resolved "https://registry.yarnpkg.com/node-gyp/-/node-gyp-9.4.1.tgz#8a1023e0d6766ecb52764cc3a734b36ff275e185" @@ -5992,7 +5954,7 @@ nwsapi@^2.2.2: resolved "https://registry.yarnpkg.com/nwsapi/-/nwsapi-2.2.13.tgz#e56b4e98960e7a040e5474536587e599c4ff4655" integrity sha512-cTGB9ptp9dY9A5VbMSe7fQBcl/tt22Vcqdq8+eN93rblOuE0aCFu4aZ2vMwct/2t+lFnosm8RkQW1I0Omb1UtQ== -object-assign@^4.1.0, object-assign@^4.1.1: +object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" integrity sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg== @@ -6429,13 +6391,6 @@ promise-retry@^2.0.1: err-code "^2.0.2" retry "^0.12.0" -promise@^7.1.1: - version "7.3.1" - resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf" - integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg== - dependencies: - asap "~2.0.3" - prompts@^2.0.1: version "2.4.2" resolved "https://registry.yarnpkg.com/prompts/-/prompts-2.4.2.tgz#7b57e73b3a48029ad10ebd44f74b01722a4cb069" @@ -6499,28 +6454,6 @@ randombytes@^2.1.0: dependencies: safe-buffer "^5.1.0" -react-dnd-html5-backend@^5.0.1: - version "5.0.1" - resolved "https://registry.yarnpkg.com/react-dnd-html5-backend/-/react-dnd-html5-backend-5.0.1.tgz#0b578d79c5c01317c70414c8d717f632b919d4f1" - integrity sha512-TLEjqDMUHRJAgRvdX2L0ssnF6bL30cVkxwO6+OkxWCoPJoiyS6Y6pl4LRidOjJ7CpeMTKeawFdIlbuezHL4oeQ== - dependencies: - autobind-decorator "^2.1.0" - dnd-core "^4.0.5" - lodash "^4.17.10" - shallowequal "^1.0.2" - -react-dnd@^5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/react-dnd/-/react-dnd-5.0.0.tgz#c4a17c70109e456dad8906be838e6ee8f32b06b5" - integrity sha512-y7qOPo4N7050p5WNli5XNfE5Ij3tl8Gw+Q6jhS0tABO3sCFZzCNKUCMUk7qTQd3t/MMDn2+Ck6xJgsGv+9Qi1A== - dependencies: - dnd-core "^4.0.5" - hoist-non-react-statics "^2.5.0" - invariant "^2.1.0" - lodash "^4.17.10" - recompose "^0.27.1" - shallowequal "^1.0.2" - react-dom@^18.2.0: version "18.3.1" resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-18.3.1.tgz#c2265d79511b57d479b3dd3fdfa51536494c5cb4" @@ -6544,7 +6477,7 @@ react-is@^18.0.0: resolved "https://registry.yarnpkg.com/react-is/-/react-is-18.3.1.tgz#e83557dc12eae63a99e003a46388b1dcbb44db7e" integrity sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg== -react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4: +react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA== @@ -6663,18 +6596,6 @@ rechoir@^0.8.0: dependencies: resolve "^1.20.0" -recompose@^0.27.1: - version "0.27.1" - resolved "https://registry.yarnpkg.com/recompose/-/recompose-0.27.1.tgz#1a49e931f183634516633bbb4f4edbfd3f38a7ba" - integrity sha512-p7xsyi/rfNjHfdP7vPU02uSFa+Q1eHhjKrvO+3+kRP4Ortj+MxEmpmd+UQtBGM2D2iNAjzNI5rCyBKp9Ob5McA== - dependencies: - babel-runtime "^6.26.0" - change-emitter "^0.1.2" - fbjs "^0.8.1" - hoist-non-react-statics "^2.3.1" - react-lifecycles-compat "^3.0.2" - symbol-observable "^1.0.4" - redux-form@^8.3.8: version "8.3.10" resolved "https://registry.yarnpkg.com/redux-form/-/redux-form-8.3.10.tgz#335657fafd4b26b91b4ce65371cd9dabe3648158" @@ -6689,7 +6610,7 @@ redux-form@^8.3.8: prop-types "^15.6.1" react-is "^16.4.2" -redux@^4.0.0, redux@^4.2.0: +redux@^4.2.0: version "4.2.1" resolved "https://registry.yarnpkg.com/redux/-/redux-4.2.1.tgz#c08f4306826c49b5e9dc901dee0452ea8fce6197" integrity sha512-LAUYz4lc+Do8/g7aeRa8JkyDErK6ekstQaqWQrNRW//MY1TvCEpMtpTWvlQ+FPbWCx+Xixu/6SHt5N0HR+SB4w== @@ -6721,11 +6642,6 @@ regenerate@^1.4.2: resolved "https://registry.yarnpkg.com/regenerate/-/regenerate-1.4.2.tgz#b9346d8827e8f5a32f7ba29637d398b69014848a" integrity sha512-zrceR/XhGYU/d/opr2EKO7aRHUeiBI8qjtfHqADTwZd6Szfy16la6kqD0MIUs5z5hx6AaKa+PixpPrR289+I0A== -regenerator-runtime@^0.11.0: - version "0.11.1" - resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9" - integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg== - regenerator-runtime@^0.14.0: version "0.14.1" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz#356ade10263f685dda125100cd862c1db895327f" @@ -7001,11 +6917,6 @@ set-function-name@^2.0.1, set-function-name@^2.0.2: functions-have-names "^1.2.3" has-property-descriptors "^1.0.2" -setimmediate@^1.0.5: - version "1.0.5" - resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285" - integrity sha512-MATJdZp8sLqDl/68LfQmbP8zKPLQNV6BIZoIgrscFDQ+RsvK/BxeDQOgyxKKoh0y/8h3BqVFnCqQ/gd+reiIXA== - shallow-clone@^3.0.0: version "3.0.1" resolved "https://registry.yarnpkg.com/shallow-clone/-/shallow-clone-3.0.1.tgz#8f2981ad92531f55035b01fb230769a40e02efa3" @@ -7013,11 +6924,6 @@ shallow-clone@^3.0.0: dependencies: kind-of "^6.0.2" -shallowequal@^1.0.2: - version "1.1.0" - resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8" - integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ== - shebang-command@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/shebang-command/-/shebang-command-2.0.0.tgz#ccd0af4f8835fbdc265b82461aaf0c36663f34ea" @@ -7421,11 +7327,6 @@ svg-tags@^1.0.0: resolved "https://registry.yarnpkg.com/svg-tags/-/svg-tags-1.0.0.tgz#58f71cee3bd519b59d4b2a843b6c7de64ac04764" integrity sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA== -symbol-observable@^1.0.4: - version "1.2.0" - resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804" - integrity sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ== - symbol-tree@^3.2.4: version "3.2.4" resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2" @@ -7548,6 +7449,11 @@ tsconfig-paths@^3.15.0: minimist "^1.2.6" strip-bom "^3.0.0" +tslib@^2.0.0: + version "2.8.1" + resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.8.1.tgz#612efe4ed235d567e8aba5f2a5fab70280ade83f" + integrity sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w== + type-check@^0.4.0, type-check@~0.4.0: version "0.4.0" resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1" @@ -7619,11 +7525,6 @@ typed-styles@^0.0.7: resolved "https://registry.yarnpkg.com/typed-styles/-/typed-styles-0.0.7.tgz#93392a008794c4595119ff62dde6809dbc40a3d9" integrity sha512-pzP0PWoZUhsECYjABgCGQlRGL1n7tOHsgwYv3oIiEpJwGhFTuty/YNeduxQYzXXa3Ge5BdT6sHYIQYpl4uJ+5Q== -ua-parser-js@^0.7.30: - version "0.7.39" - resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.39.tgz#c71efb46ebeabc461c4612d22d54f88880fabe7e" - integrity sha512-IZ6acm6RhQHNibSt7+c09hhvsKy9WUr4DVbeq9U8o71qxyYtJpQeDxQnMrVqnIFMLcQjHO0I9wgfO2vIahht4w== - uc.micro@^1.0.1, uc.micro@^1.0.5: version "1.0.6" resolved "https://registry.yarnpkg.com/uc.micro/-/uc.micro-1.0.6.tgz#9c411a802a409a91fc6cf74081baba34b24499ac" @@ -7876,11 +7777,6 @@ whatwg-encoding@^2.0.0: dependencies: iconv-lite "0.6.3" -whatwg-fetch@>=0.10.0: - version "3.6.20" - resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.6.20.tgz#580ce6d791facec91d37c72890995a0b48d31c70" - integrity sha512-EqhiFU6daOA8kpjOWTL0olhVOF3i7OrFzSYiGsEMB8GcXS+RrzauAERX65xMeNWVqxA6HXH2m69Z9LaKKdisfg== - whatwg-mimetype@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz#5fa1a7623867ff1af6ca3dc72ad6b8a4208beba7"