@innovastudio/contentbuilder 1.5.219 → 1.5.220

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/package.json +1 -1
  2. package/public/contentbuilder/contentbuilder.esm.js +75 -33
  3. package/public/contentbuilder/contentbuilder.min.js +1 -1
  4. package/public/contentbuilder/lang/en.js +14 -0
  5. package/public/contentbuilder/lang/fr.js +14 -0
  6. package/readme.txt +1 -1
package/public/contentbuilder/contentbuilder.min.js CHANGED
@@ -25,7 +25,7 @@ var ContentBuilder=function(){"use strict";function t(t,e){e+="";return(Array.is
25
25
  * Released under the MIT license
26
26
  *
27
27
  * Date: 2021-06-12T08:00:17.411Z
28
- */(e)}},!1));const p=document.querySelector(".is-design-list");let g=e.opts.snippetPath,m=e.opts.snippetJSON.snippets,f=e.opts.slider;if(null!=f)if("slick"===f){const t=t=>"glide"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else if("glide"===f){const t=t=>"slick"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else if("all"===f);else{const t=t=>"glide"!==t.type&&"slick"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else{var y=!0;if(e.win.jQuery&&e.win.jQuery.fn.slick&&(y=!1),y){const t=m.filter((t=>"slick"!==t.type));m=[...t]}if(!e.win.Glide){const t=m.filter((t=>!(t.glide||"glide"===t.type)));m=[...t]}e.opts.snippetJSON.snippets=[...m]}if(!e.win.FormViewer){const t=m.filter((t=>!("form"===t.type)));m=[...t]}e.opts.snippetJSON.snippets=[...m];const v=(e.opts.emailMode?e.opts.defaultEmailSnippetCategory:e.opts.defaultSnippetCategory)+"";let w,x,k=1;if(e.opts.snippetJSON.snippets.forEach((e=>{e.id=k;const i=t(e,v)?"":" hide";s.appendHtml(p,'<div data-drag-id="'+(k-1)+'" class="snippet-item'+i+'" role="listitem" data-id="'+e.id+'" data-cat="'+e.category+'"><img alt="'+n.out("Snippet")+'" loading="lazy" src="'+g+e.thumbnail+'"><span class="is-overlay"></span></div>'),k++})),e.iframeDragDrop||new Bt(p,{group:{name:"shared",pull:"clone",put:!1},sort:!1,animation:150,onChoose:t=>{const i='\n <style id="css-scale">\n .sortable-ghost {\n height: 50px;\n }\n .sortable-ghost * {\n display: none\n }\n </style>\n ';if(x=t.item.offsetHeight,e.iframe){const t=e.contentStuff.querySelector("#css-scale");t&&t.parentNode.removeChild(t),e.contentStuff.insertAdjacentHTML("afterbegin",i)}else{const t=e.builderStuff.querySelector("#css-scale");t&&t.parentNode.removeChild(t),e.builderStuff.insertAdjacentHTML("afterbegin",i)}e.uo.saveForUndo(!0),e.sectionDropSetup(),e.util.clearPops(),e.hideElementTools()},onClone:t=>{var e=t.clone;let i=e.querySelector("img");i.style.opacity=1e-4,e.style.height=x+"px";let n=(new Date).getTime(),o=i.src.includes("?")?"&":"?";i.src=i.src+o+n,i.style.opacity=""},onMove:()=>{let t=e.doc.querySelector(".row-add-initial");if(t&&(t.style.display="none"),e.page&&".is-wrapper"===e.page){const t=e.doc.querySelector(e.page);t&&(t.style.marginLeft="")}},onSort:t=>{if(!e.canvas)return;let i=t.originalEvent.clientX,n=t.originalEvent.clientY;const o=e.doc.querySelector("[data-new-dummy]");if(o){const t=o.parentNode,e=t.getBoundingClientRect();o.offsetWidth;let s=(i-o.offsetWidth/2-e.left)/t.offsetWidth*100,l=(n-o.offsetHeight/2-e.top)/t.offsetHeight*100;l<0&&(l=15),o.style.top=l+"%",o.style.left=s+"%",o.removeAttribute("data-new-dummy")}},onStart:()=>{w=null;const t=e.doc.querySelector(".builder-active");t&&(w=t,s.removeClass(w,"builder-active"));let i=document.querySelector(".is-sidebar-overlay");i&&(i.style.display="none")},onEnd:()=>{let t=document.querySelector(".is-sidebar-overlay");t&&(t.style.display="block"),n.checkEmpty();let i=e.doc.querySelector(".row-add-initial");i&&(i.style.display=""),w&&s.addClass(w,"builder-active")},onUnchoose:()=>{setTimeout((()=>{if(e.sortableOnCanvas&&(e.sortableOnCanvas.forEach((t=>{t&&t.destroy()})),e.sortableOnCanvas=[]),e.sortableOnPage&&(e.sortableOnPage.destroy(),e.sortableOnPage=null),e.doc.querySelectorAll(".block-dummy").forEach((t=>t.parentNode.removeChild(t))),e.page&&".is-wrapper"===e.page){const t=e.doc.querySelector(e.page);t&&(t.style.marginLeft="")}}),10)}}),"#divSnippetList"===e.opts.snippetList){const t=d.querySelector("#divSnippetHandle");s.addEventListener(t,"click",(()=>{ks(e),n.clearActiveCell(),n.clearControls()}));const o=window.innerWidth;(e.opts.snippetOpen||i)&&o>=960&&(d.style.cssText="transition: all ease 0.8s;",setTimeout((function(){ks(e)}),100),setTimeout((function(){d.style.cssText=""}),1300))}};function ks(t){const e=t.dom;let i=document.querySelector("#divSnippetList");const n=i.querySelector("#divSnippetHandle");e.hasClass(i,"active")?(e.removeClass(i,"active"),"right"===t.opts.sidePanel?n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-left"></use></svg>':n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-right"></use></svg>',setTimeout((()=>{i.querySelector(".is-design-list").style.display="none"}),300)):(i.querySelector(".is-design-list").style.display="block",setTimeout((()=>{e.addClass(i,"active"),"right"===t.opts.sidePanel?n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-right"></use></svg>':n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-left"></use></svg>'}),10))}function Ss(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,n)}return i}function _s(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?Ss(Object(i),!0).forEach((function(e){As(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):Ss(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function Cs(t){return Cs="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},Cs(t)}function Es(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function As(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function Ls(t){return function(t){if(Array.isArray(t))return Ts(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return Ts(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);"Object"===i&&t.constructor&&(i=t.constructor.name);if("Map"===i||"Set"===i)return Array.from(t);if("Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i))return Ts(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Ts(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,n=new Array(e);i<e;i++)n[i]=t[i];return n}var Ms="undefined"!=typeof window&&void 0!==window.document,qs=Ms?window:{},Rs=!(!Ms||!qs.document.documentElement)&&"ontouchstart"in qs.document.documentElement,Is=!!Ms&&"PointerEvent"in qs,Os="cropper",Ns="all",$s="crop",Ps="move",Ds="zoom",Bs="e",Hs="w",zs="s",Fs="n",Us="ne",js="nw",Ws="se",Vs="sw",Gs="".concat(Os,"-crop"),Ys="".concat(Os,"-disabled"),Xs="".concat(Os,"-hidden"),Ks="".concat(Os,"-hide"),Zs="".concat(Os,"-invisible"),Js="".concat(Os,"-modal"),Qs="".concat(Os,"-move"),tl="".concat(Os,"Action"),el="".concat(Os,"Preview"),il="crop",nl="move",ol="none",sl="crop",ll="cropend",al="cropmove",rl="cropstart",cl="dblclick",ul=Is?"pointerdown":Rs?"touchstart":"mousedown",dl=Is?"pointermove":Rs?"touchmove":"mousemove",hl=Is?"pointerup pointercancel":Rs?"touchend touchcancel":"mouseup",bl="ready",pl="resize",gl="wheel",ml="zoom",fl="image/jpeg",yl=/^e|w|s|n|se|sw|ne|nw|all|crop|move|zoom$/,vl=/^data:/,wl=/^data:image\/jpeg;base64,/,xl=/^img|canvas$/i,kl={viewMode:0,dragMode:il,initialAspectRatio:NaN,aspectRatio:NaN,data:null,preview:"",responsive:!0,restore:!0,checkCrossOrigin:!0,checkOrientation:!0,modal:!0,guides:!0,center:!0,highlight:!0,background:!0,autoCrop:!0,autoCropArea:.8,movable:!0,rotatable:!0,scalable:!0,zoomable:!0,zoomOnTouch:!0,zoomOnWheel:!0,wheelZoomRatio:.1,cropBoxMovable:!0,cropBoxResizable:!0,toggleDragModeOnDblclick:!0,minCanvasWidth:0,minCanvasHeight:0,minCropBoxWidth:0,minCropBoxHeight:0,minContainerWidth:200,minContainerHeight:100,ready:null,cropstart:null,cropmove:null,cropend:null,crop:null,zoom:null},Sl=Number.isNaN||qs.isNaN;function _l(t){return"number"==typeof t&&!Sl(t)}var Cl=function(t){return t>0&&t<1/0};function El(t){return void 0===t}function Al(t){return"object"===Cs(t)&&null!==t}var Ll=Object.prototype.hasOwnProperty;function Tl(t){if(!Al(t))return!1;try{var e=t.constructor,i=e.prototype;return e&&i&&Ll.call(i,"isPrototypeOf")}catch(t){return!1}}function Ml(t){return"function"==typeof t}var ql=Array.prototype.slice;function Rl(t){return Array.from?Array.from(t):ql.call(t)}function Il(t,e){return t&&Ml(e)&&(Array.isArray(t)||_l(t.length)?Rl(t).forEach((function(i,n){e.call(t,i,n,t)})):Al(t)&&Object.keys(t).forEach((function(i){e.call(t,t[i],i,t)}))),t}var Ol=Object.assign||function(t){for(var e=arguments.length,i=new Array(e>1?e-1:0),n=1;n<e;n++)i[n-1]=arguments[n];return Al(t)&&i.length>0&&i.forEach((function(e){Al(e)&&Object.keys(e).forEach((function(i){t[i]=e[i]}))})),t},Nl=/\.\d*(?:0|9){12}\d*$/;function $l(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1e11;return Nl.test(t)?Math.round(t*e)/e:t}var Pl=/^width|height|left|top|marginLeft|marginTop$/;function Dl(t,e){var i=t.style;Il(e,(function(t,e){Pl.test(e)&&_l(t)&&(t="".concat(t,"px")),i[e]=t}))}function Bl(t,e){if(e)if(_l(t.length))Il(t,(function(t){Bl(t,e)}));else if(t.classList)t.classList.add(e);else{var i=t.className.trim();i?i.indexOf(e)<0&&(t.className="".concat(i," ").concat(e)):t.className=e}}function Hl(t,e){e&&(_l(t.length)?Il(t,(function(t){Hl(t,e)})):t.classList?t.classList.remove(e):t.className.indexOf(e)>=0&&(t.className=t.className.replace(e,"")))}function zl(t,e,i){e&&(_l(t.length)?Il(t,(function(t){zl(t,e,i)})):i?Bl(t,e):Hl(t,e))}var Fl=/([a-z\d])([A-Z])/g;function Ul(t){return t.replace(Fl,"$1-$2").toLowerCase()}function jl(t,e){return Al(t[e])?t[e]:t.dataset?t.dataset[e]:t.getAttribute("data-".concat(Ul(e)))}function Wl(t,e,i){Al(i)?t[e]=i:t.dataset?t.dataset[e]=i:t.setAttribute("data-".concat(Ul(e)),i)}var Vl=/\s\s*/,Gl=function(){var t=!1;if(Ms){var e=!1,i=function(){},n=Object.defineProperty({},"once",{get:function(){return t=!0,e},set:function(t){e=t}});qs.addEventListener("test",i,n),qs.removeEventListener("test",i,n)}return t}();function Yl(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=i;e.trim().split(Vl).forEach((function(e){if(!Gl){var s=t.listeners;s&&s[e]&&s[e][i]&&(o=s[e][i],delete s[e][i],0===Object.keys(s[e]).length&&delete s[e],0===Object.keys(s).length&&delete t.listeners)}t.removeEventListener(e,o,n)}))}function Xl(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=i;e.trim().split(Vl).forEach((function(e){if(n.once&&!Gl){var s=t.listeners,l=void 0===s?{}:s;o=function(){delete l[e][i],t.removeEventListener(e,o,n);for(var s=arguments.length,a=new Array(s),r=0;r<s;r++)a[r]=arguments[r];i.apply(t,a)},l[e]||(l[e]={}),l[e][i]&&t.removeEventListener(e,l[e][i],n),l[e][i]=o,t.listeners=l}t.addEventListener(e,o,n)}))}function Kl(t,e,i){var n;return Ml(Event)&&Ml(CustomEvent)?n=new CustomEvent(e,{detail:i,bubbles:!0,cancelable:!0}):(n=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,i),t.dispatchEvent(n)}function Zl(t){var e=t.getBoundingClientRect();return{left:e.left+(window.pageXOffset-document.documentElement.clientLeft),top:e.top+(window.pageYOffset-document.documentElement.clientTop)}}var Jl=qs.location,Ql=/^(\w+:)\/\/([^:/?#]*):?(\d*)/i;function ta(t){var e=t.match(Ql);return null!==e&&(e[1]!==Jl.protocol||e[2]!==Jl.hostname||e[3]!==Jl.port)}function ea(t){var e="timestamp=".concat((new Date).getTime());return t+(-1===t.indexOf("?")?"?":"&")+e}function ia(t){var e=t.rotate,i=t.scaleX,n=t.scaleY,o=t.translateX,s=t.translateY,l=[];_l(o)&&0!==o&&l.push("translateX(".concat(o,"px)")),_l(s)&&0!==s&&l.push("translateY(".concat(s,"px)")),_l(e)&&0!==e&&l.push("rotate(".concat(e,"deg)")),_l(i)&&1!==i&&l.push("scaleX(".concat(i,")")),_l(n)&&1!==n&&l.push("scaleY(".concat(n,")"));var a=l.length?l.join(" "):"none";return{WebkitTransform:a,msTransform:a,transform:a}}function na(t,e){var i=t.pageX,n=t.pageY,o={endX:i,endY:n};return e?o:_s({startX:i,startY:n},o)}function oa(t){var e=t.aspectRatio,i=t.height,n=t.width,o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"contain",s=Cl(n),l=Cl(i);if(s&&l){var a=i*e;"contain"===o&&a>n||"cover"===o&&a<n?i=n/e:n=i*e}else s?i=n/e:l&&(n=i*e);return{width:n,height:i}}var sa=String.fromCharCode;var la=/^data:.*,/;function aa(t){var e,i=new DataView(t);try{var n,o,s;if(255===i.getUint8(0)&&216===i.getUint8(1))for(var l=i.byteLength,a=2;a+1<l;){if(255===i.getUint8(a)&&225===i.getUint8(a+1)){o=a;break}a+=1}if(o){var r=o+10;if("Exif"===function(t,e,i){var n="";i+=e;for(var o=e;o<i;o+=1)n+=sa(t.getUint8(o));return n}(i,o+4,4)){var c=i.getUint16(r);if(((n=18761===c)||19789===c)&&42===i.getUint16(r+2,n)){var u=i.getUint32(r+4,n);u>=8&&(s=r+u)}}}if(s){var d,h,b=i.getUint16(s,n);for(h=0;h<b;h+=1)if(d=s+12*h+2,274===i.getUint16(d,n)){d+=8,e=i.getUint16(d,n),i.setUint16(d,1,n);break}}}catch(t){e=1}return e}var ra={render:function(){this.initContainer(),this.initCanvas(),this.initCropBox(),this.renderCanvas(),this.cropped&&this.renderCropBox()},initContainer:function(){var t=this.element,e=this.options,i=this.container,n=this.cropper,o=Number(e.minContainerWidth),s=Number(e.minContainerHeight);Bl(n,Xs),Hl(t,Xs);var l={width:Math.max(i.offsetWidth,o>=0?o:200),height:Math.max(i.offsetHeight,s>=0?s:100)};this.containerData=l,Dl(n,{width:l.width,height:l.height}),Bl(t,Xs),Hl(n,Xs)},initCanvas:function(){var t=this.containerData,e=this.imageData,i=this.options.viewMode,n=Math.abs(e.rotate)%180==90,o=n?e.naturalHeight:e.naturalWidth,s=n?e.naturalWidth:e.naturalHeight,l=o/s,a=t.width,r=t.height;t.height*l>t.width?3===i?a=t.height*l:r=t.width/l:3===i?r=t.width/l:a=t.height*l;var c={aspectRatio:l,naturalWidth:o,naturalHeight:s,width:a,height:r};this.canvasData=c,this.limited=1===i||2===i,this.limitCanvas(!0,!0),c.width=Math.min(Math.max(c.width,c.minWidth),c.maxWidth),c.height=Math.min(Math.max(c.height,c.minHeight),c.maxHeight),c.left=(t.width-c.width)/2,c.top=(t.height-c.height)/2,c.oldLeft=c.left,c.oldTop=c.top,this.initialCanvasData=Ol({},c)},limitCanvas:function(t,e){var i=this.options,n=this.containerData,o=this.canvasData,s=this.cropBoxData,l=i.viewMode,a=o.aspectRatio,r=this.cropped&&s;if(t){var c=Number(i.minCanvasWidth)||0,u=Number(i.minCanvasHeight)||0;l>1?(c=Math.max(c,n.width),u=Math.max(u,n.height),3===l&&(u*a>c?c=u*a:u=c/a)):l>0&&(c?c=Math.max(c,r?s.width:0):u?u=Math.max(u,r?s.height:0):r&&(c=s.width,(u=s.height)*a>c?c=u*a:u=c/a));var d=oa({aspectRatio:a,width:c,height:u});c=d.width,u=d.height,o.minWidth=c,o.minHeight=u,o.maxWidth=1/0,o.maxHeight=1/0}if(e)if(l>(r?0:1)){var h=n.width-o.width,b=n.height-o.height;o.minLeft=Math.min(0,h),o.minTop=Math.min(0,b),o.maxLeft=Math.max(0,h),o.maxTop=Math.max(0,b),r&&this.limited&&(o.minLeft=Math.min(s.left,s.left+(s.width-o.width)),o.minTop=Math.min(s.top,s.top+(s.height-o.height)),o.maxLeft=s.left,o.maxTop=s.top,2===l&&(o.width>=n.width&&(o.minLeft=Math.min(0,h),o.maxLeft=Math.max(0,h)),o.height>=n.height&&(o.minTop=Math.min(0,b),o.maxTop=Math.max(0,b))))}else o.minLeft=-o.width,o.minTop=-o.height,o.maxLeft=n.width,o.maxTop=n.height},renderCanvas:function(t,e){var i=this.canvasData,n=this.imageData;if(e){var o=function(t){var e=t.width,i=t.height,n=t.degree;if(90==(n=Math.abs(n)%180))return{width:i,height:e};var o=n%90*Math.PI/180,s=Math.sin(o),l=Math.cos(o),a=e*l+i*s,r=e*s+i*l;return n>90?{width:r,height:a}:{width:a,height:r}}({width:n.naturalWidth*Math.abs(n.scaleX||1),height:n.naturalHeight*Math.abs(n.scaleY||1),degree:n.rotate||0}),s=o.width,l=o.height,a=i.width*(s/i.naturalWidth),r=i.height*(l/i.naturalHeight);i.left-=(a-i.width)/2,i.top-=(r-i.height)/2,i.width=a,i.height=r,i.aspectRatio=s/l,i.naturalWidth=s,i.naturalHeight=l,this.limitCanvas(!0,!1)}(i.width>i.maxWidth||i.width<i.minWidth)&&(i.left=i.oldLeft),(i.height>i.maxHeight||i.height<i.minHeight)&&(i.top=i.oldTop),i.width=Math.min(Math.max(i.width,i.minWidth),i.maxWidth),i.height=Math.min(Math.max(i.height,i.minHeight),i.maxHeight),this.limitCanvas(!1,!0),i.left=Math.min(Math.max(i.left,i.minLeft),i.maxLeft),i.top=Math.min(Math.max(i.top,i.minTop),i.maxTop),i.oldLeft=i.left,i.oldTop=i.top,Dl(this.canvas,Ol({width:i.width,height:i.height},ia({translateX:i.left,translateY:i.top}))),this.renderImage(t),this.cropped&&this.limited&&this.limitCropBox(!0,!0)},renderImage:function(t){var e=this.canvasData,i=this.imageData,n=i.naturalWidth*(e.width/e.naturalWidth),o=i.naturalHeight*(e.height/e.naturalHeight);Ol(i,{width:n,height:o,left:(e.width-n)/2,top:(e.height-o)/2}),Dl(this.image,Ol({width:i.width,height:i.height},ia(Ol({translateX:i.left,translateY:i.top},i)))),t&&this.output()},initCropBox:function(){var t=this.options,e=this.canvasData,i=t.aspectRatio||t.initialAspectRatio,n=Number(t.autoCropArea)||.8,o={width:e.width,height:e.height};i&&(e.height*i>e.width?o.height=o.width/i:o.width=o.height*i),this.cropBoxData=o,this.limitCropBox(!0,!0),o.width=Math.min(Math.max(o.width,o.minWidth),o.maxWidth),o.height=Math.min(Math.max(o.height,o.minHeight),o.maxHeight),o.width=Math.max(o.minWidth,o.width*n),o.height=Math.max(o.minHeight,o.height*n),o.left=e.left+(e.width-o.width)/2,o.top=e.top+(e.height-o.height)/2,o.oldLeft=o.left,o.oldTop=o.top,this.initialCropBoxData=Ol({},o)},limitCropBox:function(t,e){var i=this.options,n=this.containerData,o=this.canvasData,s=this.cropBoxData,l=this.limited,a=i.aspectRatio;if(t){var r=Number(i.minCropBoxWidth)||0,c=Number(i.minCropBoxHeight)||0,u=l?Math.min(n.width,o.width,o.width+o.left,n.width-o.left):n.width,d=l?Math.min(n.height,o.height,o.height+o.top,n.height-o.top):n.height;r=Math.min(r,n.width),c=Math.min(c,n.height),a&&(r&&c?c*a>r?c=r/a:r=c*a:r?c=r/a:c&&(r=c*a),d*a>u?d=u/a:u=d*a),s.minWidth=Math.min(r,u),s.minHeight=Math.min(c,d),s.maxWidth=u,s.maxHeight=d}e&&(l?(s.minLeft=Math.max(0,o.left),s.minTop=Math.max(0,o.top),s.maxLeft=Math.min(n.width,o.left+o.width)-s.width,s.maxTop=Math.min(n.height,o.top+o.height)-s.height):(s.minLeft=0,s.minTop=0,s.maxLeft=n.width-s.width,s.maxTop=n.height-s.height))},renderCropBox:function(){var t=this.options,e=this.containerData,i=this.cropBoxData;(i.width>i.maxWidth||i.width<i.minWidth)&&(i.left=i.oldLeft),(i.height>i.maxHeight||i.height<i.minHeight)&&(i.top=i.oldTop),i.width=Math.min(Math.max(i.width,i.minWidth),i.maxWidth),i.height=Math.min(Math.max(i.height,i.minHeight),i.maxHeight),this.limitCropBox(!1,!0),i.left=Math.min(Math.max(i.left,i.minLeft),i.maxLeft),i.top=Math.min(Math.max(i.top,i.minTop),i.maxTop),i.oldLeft=i.left,i.oldTop=i.top,t.movable&&t.cropBoxMovable&&Wl(this.face,tl,i.width>=e.width&&i.height>=e.height?Ps:Ns),Dl(this.cropBox,Ol({width:i.width,height:i.height},ia({translateX:i.left,translateY:i.top}))),this.cropped&&this.limited&&this.limitCanvas(!0,!0),this.disabled||this.output()},output:function(){this.preview(),Kl(this.element,sl,this.getData())}},ca={initPreview:function(){var t=this.element,e=this.crossOrigin,i=this.options.preview,n=e?this.crossOriginUrl:this.url,o=t.alt||"The image to preview",s=document.createElement("img");if(e&&(s.crossOrigin=e),s.src=n,s.alt=o,this.viewBox.appendChild(s),this.viewBoxImage=s,i){var l=i;"string"==typeof i?l=t.ownerDocument.querySelectorAll(i):i.querySelector&&(l=[i]),this.previews=l,Il(l,(function(t){var i=document.createElement("img");Wl(t,el,{width:t.offsetWidth,height:t.offsetHeight,html:t.innerHTML}),e&&(i.crossOrigin=e),i.src=n,i.alt=o,i.style.cssText='display:block;width:100%;height:auto;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;image-orientation:0deg!important;"',t.innerHTML="",t.appendChild(i)}))}},resetPreview:function(){Il(this.previews,(function(t){var e=jl(t,el);Dl(t,{width:e.width,height:e.height}),t.innerHTML=e.html,function(t,e){if(Al(t[e]))try{delete t[e]}catch(i){t[e]=void 0}else if(t.dataset)try{delete t.dataset[e]}catch(i){t.dataset[e]=void 0}else t.removeAttribute("data-".concat(Ul(e)))}(t,el)}))},preview:function(){var t=this.imageData,e=this.canvasData,i=this.cropBoxData,n=i.width,o=i.height,s=t.width,l=t.height,a=i.left-e.left-t.left,r=i.top-e.top-t.top;this.cropped&&!this.disabled&&(Dl(this.viewBoxImage,Ol({width:s,height:l},ia(Ol({translateX:-a,translateY:-r},t)))),Il(this.previews,(function(e){var i=jl(e,el),c=i.width,u=i.height,d=c,h=u,b=1;n&&(h=o*(b=c/n)),o&&h>u&&(d=n*(b=u/o),h=u),Dl(e,{width:d,height:h}),Dl(e.getElementsByTagName("img")[0],Ol({width:s*b,height:l*b},ia(Ol({translateX:-a*b,translateY:-r*b},t))))})))}},ua={bind:function(){var t=this.element,e=this.options,i=this.cropper;Ml(e.cropstart)&&Xl(t,rl,e.cropstart),Ml(e.cropmove)&&Xl(t,al,e.cropmove),Ml(e.cropend)&&Xl(t,ll,e.cropend),Ml(e.crop)&&Xl(t,sl,e.crop),Ml(e.zoom)&&Xl(t,ml,e.zoom),Xl(i,ul,this.onCropStart=this.cropStart.bind(this)),e.zoomable&&e.zoomOnWheel&&Xl(i,gl,this.onWheel=this.wheel.bind(this),{passive:!1,capture:!0}),e.toggleDragModeOnDblclick&&Xl(i,cl,this.onDblclick=this.dblclick.bind(this)),Xl(t.ownerDocument,dl,this.onCropMove=this.cropMove.bind(this)),Xl(t.ownerDocument,hl,this.onCropEnd=this.cropEnd.bind(this)),e.responsive&&Xl(window,pl,this.onResize=this.resize.bind(this))},unbind:function(){var t=this.element,e=this.options,i=this.cropper;Ml(e.cropstart)&&Yl(t,rl,e.cropstart),Ml(e.cropmove)&&Yl(t,al,e.cropmove),Ml(e.cropend)&&Yl(t,ll,e.cropend),Ml(e.crop)&&Yl(t,sl,e.crop),Ml(e.zoom)&&Yl(t,ml,e.zoom),Yl(i,ul,this.onCropStart),e.zoomable&&e.zoomOnWheel&&Yl(i,gl,this.onWheel,{passive:!1,capture:!0}),e.toggleDragModeOnDblclick&&Yl(i,cl,this.onDblclick),Yl(t.ownerDocument,dl,this.onCropMove),Yl(t.ownerDocument,hl,this.onCropEnd),e.responsive&&Yl(window,pl,this.onResize)}},da={resize:function(){if(!this.disabled){var t,e,i=this.options,n=this.container,o=this.containerData,s=n.offsetWidth/o.width,l=n.offsetHeight/o.height,a=Math.abs(s-1)>Math.abs(l-1)?s:l;if(1!==a)i.restore&&(t=this.getCanvasData(),e=this.getCropBoxData()),this.render(),i.restore&&(this.setCanvasData(Il(t,(function(e,i){t[i]=e*a}))),this.setCropBoxData(Il(e,(function(t,i){e[i]=t*a}))))}},dblclick:function(){var t,e;this.disabled||this.options.dragMode===ol||this.setDragMode((t=this.dragBox,e=Gs,(t.classList?t.classList.contains(e):t.className.indexOf(e)>-1)?nl:il))},wheel:function(t){var e=this,i=Number(this.options.wheelZoomRatio)||.1,n=1;this.disabled||(t.preventDefault(),this.wheeling||(this.wheeling=!0,setTimeout((function(){e.wheeling=!1}),50),t.deltaY?n=t.deltaY>0?1:-1:t.wheelDelta?n=-t.wheelDelta/120:t.detail&&(n=t.detail>0?1:-1),this.zoom(-n*i,t)))},cropStart:function(t){var e=t.buttons,i=t.button;if(!(this.disabled||("mousedown"===t.type||"pointerdown"===t.type&&"mouse"===t.pointerType)&&(_l(e)&&1!==e||_l(i)&&0!==i||t.ctrlKey))){var n,o=this.options,s=this.pointers;t.changedTouches?Il(t.changedTouches,(function(t){s[t.identifier]=na(t)})):s[t.pointerId||0]=na(t),n=Object.keys(s).length>1&&o.zoomable&&o.zoomOnTouch?Ds:jl(t.target,tl),yl.test(n)&&!1!==Kl(this.element,rl,{originalEvent:t,action:n})&&(t.preventDefault(),this.action=n,this.cropping=!1,n===$s&&(this.cropping=!0,Bl(this.dragBox,Js)))}},cropMove:function(t){var e=this.action;if(!this.disabled&&e){var i=this.pointers;t.preventDefault(),!1!==Kl(this.element,al,{originalEvent:t,action:e})&&(t.changedTouches?Il(t.changedTouches,(function(t){Ol(i[t.identifier]||{},na(t,!0))})):Ol(i[t.pointerId||0]||{},na(t,!0)),this.change(t))}},cropEnd:function(t){if(!this.disabled){var e=this.action,i=this.pointers;t.changedTouches?Il(t.changedTouches,(function(t){delete i[t.identifier]})):delete i[t.pointerId||0],e&&(t.preventDefault(),Object.keys(i).length||(this.action=""),this.cropping&&(this.cropping=!1,zl(this.dragBox,Js,this.cropped&&this.options.modal)),Kl(this.element,ll,{originalEvent:t,action:e}))}}},ha={change:function(t){var e,i=this.options,n=this.canvasData,o=this.containerData,s=this.cropBoxData,l=this.pointers,a=this.action,r=i.aspectRatio,c=s.left,u=s.top,d=s.width,h=s.height,b=c+d,p=u+h,g=0,m=0,f=o.width,y=o.height,v=!0;!r&&t.shiftKey&&(r=d&&h?d/h:1),this.limited&&(g=s.minLeft,m=s.minTop,f=g+Math.min(o.width,n.width,n.left+n.width),y=m+Math.min(o.height,n.height,n.top+n.height));var w=l[Object.keys(l)[0]],x={x:w.endX-w.startX,y:w.endY-w.startY},k=function(t){switch(t){case Bs:b+x.x>f&&(x.x=f-b);break;case Hs:c+x.x<g&&(x.x=g-c);break;case Fs:u+x.y<m&&(x.y=m-u);break;case zs:p+x.y>y&&(x.y=y-p)}};switch(a){case Ns:c+=x.x,u+=x.y;break;case Bs:if(x.x>=0&&(b>=f||r&&(u<=m||p>=y))){v=!1;break}k(Bs),(d+=x.x)<0&&(a=Hs,c-=d=-d),r&&(h=d/r,u+=(s.height-h)/2);break;case Fs:if(x.y<=0&&(u<=m||r&&(c<=g||b>=f))){v=!1;break}k(Fs),h-=x.y,u+=x.y,h<0&&(a=zs,u-=h=-h),r&&(d=h*r,c+=(s.width-d)/2);break;case Hs:if(x.x<=0&&(c<=g||r&&(u<=m||p>=y))){v=!1;break}k(Hs),d-=x.x,c+=x.x,d<0&&(a=Bs,c-=d=-d),r&&(h=d/r,u+=(s.height-h)/2);break;case zs:if(x.y>=0&&(p>=y||r&&(c<=g||b>=f))){v=!1;break}k(zs),(h+=x.y)<0&&(a=Fs,u-=h=-h),r&&(d=h*r,c+=(s.width-d)/2);break;case Us:if(r){if(x.y<=0&&(u<=m||b>=f)){v=!1;break}k(Fs),h-=x.y,u+=x.y,d=h*r}else k(Fs),k(Bs),x.x>=0?b<f?d+=x.x:x.y<=0&&u<=m&&(v=!1):d+=x.x,x.y<=0?u>m&&(h-=x.y,u+=x.y):(h-=x.y,u+=x.y);d<0&&h<0?(a=Vs,u-=h=-h,c-=d=-d):d<0?(a=js,c-=d=-d):h<0&&(a=Ws,u-=h=-h);break;case js:if(r){if(x.y<=0&&(u<=m||c<=g)){v=!1;break}k(Fs),h-=x.y,u+=x.y,d=h*r,c+=s.width-d}else k(Fs),k(Hs),x.x<=0?c>g?(d-=x.x,c+=x.x):x.y<=0&&u<=m&&(v=!1):(d-=x.x,c+=x.x),x.y<=0?u>m&&(h-=x.y,u+=x.y):(h-=x.y,u+=x.y);d<0&&h<0?(a=Ws,u-=h=-h,c-=d=-d):d<0?(a=Us,c-=d=-d):h<0&&(a=Vs,u-=h=-h);break;case Vs:if(r){if(x.x<=0&&(c<=g||p>=y)){v=!1;break}k(Hs),d-=x.x,c+=x.x,h=d/r}else k(zs),k(Hs),x.x<=0?c>g?(d-=x.x,c+=x.x):x.y>=0&&p>=y&&(v=!1):(d-=x.x,c+=x.x),x.y>=0?p<y&&(h+=x.y):h+=x.y;d<0&&h<0?(a=Us,u-=h=-h,c-=d=-d):d<0?(a=Ws,c-=d=-d):h<0&&(a=js,u-=h=-h);break;case Ws:if(r){if(x.x>=0&&(b>=f||p>=y)){v=!1;break}k(Bs),h=(d+=x.x)/r}else k(zs),k(Bs),x.x>=0?b<f?d+=x.x:x.y>=0&&p>=y&&(v=!1):d+=x.x,x.y>=0?p<y&&(h+=x.y):h+=x.y;d<0&&h<0?(a=js,u-=h=-h,c-=d=-d):d<0?(a=Vs,c-=d=-d):h<0&&(a=Us,u-=h=-h);break;case Ps:this.move(x.x,x.y),v=!1;break;case Ds:this.zoom(function(t){var e=_s({},t),i=0;return Il(t,(function(t,n){delete e[n],Il(e,(function(e){var n=Math.abs(t.startX-e.startX),o=Math.abs(t.startY-e.startY),s=Math.abs(t.endX-e.endX),l=Math.abs(t.endY-e.endY),a=Math.sqrt(n*n+o*o),r=(Math.sqrt(s*s+l*l)-a)/a;Math.abs(r)>Math.abs(i)&&(i=r)}))})),i}(l),t),v=!1;break;case $s:if(!x.x||!x.y){v=!1;break}e=Zl(this.cropper),c=w.startX-e.left,u=w.startY-e.top,d=s.minWidth,h=s.minHeight,x.x>0?a=x.y>0?Ws:Us:x.x<0&&(c-=d,a=x.y>0?Vs:js),x.y<0&&(u-=h),this.cropped||(Hl(this.cropBox,Xs),this.cropped=!0,this.limited&&this.limitCropBox(!0,!0))}v&&(s.width=d,s.height=h,s.left=c,s.top=u,this.action=a,this.renderCropBox()),Il(l,(function(t){t.startX=t.endX,t.startY=t.endY}))}},ba={crop:function(){return!this.ready||this.cropped||this.disabled||(this.cropped=!0,this.limitCropBox(!0,!0),this.options.modal&&Bl(this.dragBox,Js),Hl(this.cropBox,Xs),this.setCropBoxData(this.initialCropBoxData)),this},reset:function(){return this.ready&&!this.disabled&&(this.imageData=Ol({},this.initialImageData),this.canvasData=Ol({},this.initialCanvasData),this.cropBoxData=Ol({},this.initialCropBoxData),this.renderCanvas(),this.cropped&&this.renderCropBox()),this},clear:function(){return this.cropped&&!this.disabled&&(Ol(this.cropBoxData,{left:0,top:0,width:0,height:0}),this.cropped=!1,this.renderCropBox(),this.limitCanvas(!0,!0),this.renderCanvas(),Hl(this.dragBox,Js),Bl(this.cropBox,Xs)),this},replace:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return!this.disabled&&t&&(this.isImg&&(this.element.src=t),e?(this.url=t,this.image.src=t,this.ready&&(this.viewBoxImage.src=t,Il(this.previews,(function(e){e.getElementsByTagName("img")[0].src=t})))):(this.isImg&&(this.replaced=!0),this.options.data=null,this.uncreate(),this.load(t))),this},enable:function(){return this.ready&&this.disabled&&(this.disabled=!1,Hl(this.cropper,Ys)),this},disable:function(){return this.ready&&!this.disabled&&(this.disabled=!0,Bl(this.cropper,Ys)),this},destroy:function(){var t=this.element;return t[Os]?(t[Os]=void 0,this.isImg&&this.replaced&&(t.src=this.originalUrl),this.uncreate(),this):this},move:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.canvasData,n=i.left,o=i.top;return this.moveTo(El(t)?t:n+Number(t),El(e)?e:o+Number(e))},moveTo:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.canvasData,n=!1;return t=Number(t),e=Number(e),this.ready&&!this.disabled&&this.options.movable&&(_l(t)&&(i.left=t,n=!0),_l(e)&&(i.top=e,n=!0),n&&this.renderCanvas(!0)),this},zoom:function(t,e){var i=this.canvasData;return t=(t=Number(t))<0?1/(1-t):1+t,this.zoomTo(i.width*t/i.naturalWidth,null,e)},zoomTo:function(t,e,i){var n=this.options,o=this.canvasData,s=o.width,l=o.height,a=o.naturalWidth,r=o.naturalHeight;if((t=Number(t))>=0&&this.ready&&!this.disabled&&n.zoomable){var c=a*t,u=r*t;if(!1===Kl(this.element,ml,{ratio:t,oldRatio:s/a,originalEvent:i}))return this;if(i){var d=this.pointers,h=Zl(this.cropper),b=d&&Object.keys(d).length?function(t){var e=0,i=0,n=0;return Il(t,(function(t){var o=t.startX,s=t.startY;e+=o,i+=s,n+=1})),{pageX:e/=n,pageY:i/=n}}(d):{pageX:i.pageX,pageY:i.pageY};o.left-=(c-s)*((b.pageX-h.left-o.left)/s),o.top-=(u-l)*((b.pageY-h.top-o.top)/l)}else Tl(e)&&_l(e.x)&&_l(e.y)?(o.left-=(c-s)*((e.x-o.left)/s),o.top-=(u-l)*((e.y-o.top)/l)):(o.left-=(c-s)/2,o.top-=(u-l)/2);o.width=c,o.height=u,this.renderCanvas(!0)}return this},rotate:function(t){return this.rotateTo((this.imageData.rotate||0)+Number(t))},rotateTo:function(t){return _l(t=Number(t))&&this.ready&&!this.disabled&&this.options.rotatable&&(this.imageData.rotate=t%360,this.renderCanvas(!0,!0)),this},scaleX:function(t){var e=this.imageData.scaleY;return this.scale(t,_l(e)?e:1)},scaleY:function(t){var e=this.imageData.scaleX;return this.scale(_l(e)?e:1,t)},scale:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.imageData,n=!1;return t=Number(t),e=Number(e),this.ready&&!this.disabled&&this.options.scalable&&(_l(t)&&(i.scaleX=t,n=!0),_l(e)&&(i.scaleY=e,n=!0),n&&this.renderCanvas(!0,!0)),this},getData:function(){var t,e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],i=this.options,n=this.imageData,o=this.canvasData,s=this.cropBoxData;if(this.ready&&this.cropped){t={x:s.left-o.left,y:s.top-o.top,width:s.width,height:s.height};var l=n.width/n.naturalWidth;if(Il(t,(function(e,i){t[i]=e/l})),e){var a=Math.round(t.y+t.height),r=Math.round(t.x+t.width);t.x=Math.round(t.x),t.y=Math.round(t.y),t.width=r-t.x,t.height=a-t.y}}else t={x:0,y:0,width:0,height:0};return i.rotatable&&(t.rotate=n.rotate||0),i.scalable&&(t.scaleX=n.scaleX||1,t.scaleY=n.scaleY||1),t},setData:function(t){var e=this.options,i=this.imageData,n=this.canvasData,o={};if(this.ready&&!this.disabled&&Tl(t)){var s=!1;e.rotatable&&_l(t.rotate)&&t.rotate!==i.rotate&&(i.rotate=t.rotate,s=!0),e.scalable&&(_l(t.scaleX)&&t.scaleX!==i.scaleX&&(i.scaleX=t.scaleX,s=!0),_l(t.scaleY)&&t.scaleY!==i.scaleY&&(i.scaleY=t.scaleY,s=!0)),s&&this.renderCanvas(!0,!0);var l=i.width/i.naturalWidth;_l(t.x)&&(o.left=t.x*l+n.left),_l(t.y)&&(o.top=t.y*l+n.top),_l(t.width)&&(o.width=t.width*l),_l(t.height)&&(o.height=t.height*l),this.setCropBoxData(o)}return this},getContainerData:function(){return this.ready?Ol({},this.containerData):{}},getImageData:function(){return this.sized?Ol({},this.imageData):{}},getCanvasData:function(){var t=this.canvasData,e={};return this.ready&&Il(["left","top","width","height","naturalWidth","naturalHeight"],(function(i){e[i]=t[i]})),e},setCanvasData:function(t){var e=this.canvasData,i=e.aspectRatio;return this.ready&&!this.disabled&&Tl(t)&&(_l(t.left)&&(e.left=t.left),_l(t.top)&&(e.top=t.top),_l(t.width)?(e.width=t.width,e.height=t.width/i):_l(t.height)&&(e.height=t.height,e.width=t.height*i),this.renderCanvas(!0)),this},getCropBoxData:function(){var t,e=this.cropBoxData;return this.ready&&this.cropped&&(t={left:e.left,top:e.top,width:e.width,height:e.height}),t||{}},setCropBoxData:function(t){var e,i,n=this.cropBoxData,o=this.options.aspectRatio;return this.ready&&this.cropped&&!this.disabled&&Tl(t)&&(_l(t.left)&&(n.left=t.left),_l(t.top)&&(n.top=t.top),_l(t.width)&&t.width!==n.width&&(e=!0,n.width=t.width),_l(t.height)&&t.height!==n.height&&(i=!0,n.height=t.height),o&&(e?n.height=n.width/o:i&&(n.width=n.height*o)),this.renderCropBox()),this},getCroppedCanvas:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.ready||!window.HTMLCanvasElement)return null;var e=this.canvasData,i=function(t,e,i,n){var o=e.aspectRatio,s=e.naturalWidth,l=e.naturalHeight,a=e.rotate,r=void 0===a?0:a,c=e.scaleX,u=void 0===c?1:c,d=e.scaleY,h=void 0===d?1:d,b=i.aspectRatio,p=i.naturalWidth,g=i.naturalHeight,m=n.fillColor,f=void 0===m?"transparent":m,y=n.imageSmoothingEnabled,v=void 0===y||y,w=n.imageSmoothingQuality,x=void 0===w?"low":w,k=n.maxWidth,S=void 0===k?1/0:k,_=n.maxHeight,C=void 0===_?1/0:_,E=n.minWidth,A=void 0===E?0:E,L=n.minHeight,T=void 0===L?0:L,M=document.createElement("canvas"),q=M.getContext("2d"),R=oa({aspectRatio:b,width:S,height:C}),I=oa({aspectRatio:b,width:A,height:T},"cover"),O=Math.min(R.width,Math.max(I.width,p)),N=Math.min(R.height,Math.max(I.height,g)),$=oa({aspectRatio:o,width:S,height:C}),P=oa({aspectRatio:o,width:A,height:T},"cover"),D=Math.min($.width,Math.max(P.width,s)),B=Math.min($.height,Math.max(P.height,l)),H=[-D/2,-B/2,D,B];return M.width=$l(O),M.height=$l(N),q.fillStyle=f,q.fillRect(0,0,O,N),q.save(),q.translate(O/2,N/2),q.rotate(r*Math.PI/180),q.scale(u,h),q.imageSmoothingEnabled=v,q.imageSmoothingQuality=x,q.drawImage.apply(q,[t].concat(Ls(H.map((function(t){return Math.floor($l(t))}))))),q.restore(),M}(this.image,this.imageData,e,t);if(!this.cropped)return i;var n=this.getData(),o=n.x,s=n.y,l=n.width,a=n.height,r=i.width/Math.floor(e.naturalWidth);1!==r&&(o*=r,s*=r,l*=r,a*=r);var c=l/a,u=oa({aspectRatio:c,width:t.maxWidth||1/0,height:t.maxHeight||1/0}),d=oa({aspectRatio:c,width:t.minWidth||0,height:t.minHeight||0},"cover"),h=oa({aspectRatio:c,width:t.width||(1!==r?i.width:l),height:t.height||(1!==r?i.height:a)}),b=h.width,p=h.height;b=Math.min(u.width,Math.max(d.width,b)),p=Math.min(u.height,Math.max(d.height,p));var g=document.createElement("canvas"),m=g.getContext("2d");g.width=$l(b),g.height=$l(p),m.fillStyle=t.fillColor||"transparent",m.fillRect(0,0,b,p);var f=t.imageSmoothingEnabled,y=void 0===f||f,v=t.imageSmoothingQuality;m.imageSmoothingEnabled=y,v&&(m.imageSmoothingQuality=v);var w,x,k,S,_,C,E=i.width,A=i.height,L=o,T=s;L<=-l||L>E?(L=0,w=0,k=0,_=0):L<=0?(k=-L,L=0,_=w=Math.min(E,l+L)):L<=E&&(k=0,_=w=Math.min(l,E-L)),w<=0||T<=-a||T>A?(T=0,x=0,S=0,C=0):T<=0?(S=-T,T=0,C=x=Math.min(A,a+T)):T<=A&&(S=0,C=x=Math.min(a,A-T));var M=[L,T,w,x];if(_>0&&C>0){var q=b/l;M.push(k*q,S*q,_*q,C*q)}return m.drawImage.apply(m,[i].concat(Ls(M.map((function(t){return Math.floor($l(t))}))))),g},setAspectRatio:function(t){var e=this.options;return this.disabled||El(t)||(e.aspectRatio=Math.max(0,t)||NaN,this.ready&&(this.initCropBox(),this.cropped&&this.renderCropBox())),this},setDragMode:function(t){var e=this.options,i=this.dragBox,n=this.face;if(this.ready&&!this.disabled){var o=t===il,s=e.movable&&t===nl;t=o||s?t:ol,e.dragMode=t,Wl(i,tl,t),zl(i,Gs,o),zl(i,Qs,s),e.cropBoxMovable||(Wl(n,tl,t),zl(n,Gs,o),zl(n,Qs,s))}return this}},pa=qs.Cropper,ga=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),!e||!xl.test(e.tagName))throw new Error("The first argument is required and must be an <img> or <canvas> element.");this.element=e,this.options=Ol({},kl,Tl(i)&&i),this.cropped=!1,this.disabled=!1,this.pointers={},this.ready=!1,this.reloading=!1,this.replaced=!1,this.sized=!1,this.sizing=!1,this.init()}var e,i,n;return e=t,i=[{key:"init",value:function(){var t,e=this.element,i=e.tagName.toLowerCase();if(!e[Os]){if(e[Os]=this,"img"===i){if(this.isImg=!0,t=e.getAttribute("src")||"",this.originalUrl=t,!t)return;t=e.src}else"canvas"===i&&window.HTMLCanvasElement&&(t=e.toDataURL());this.load(t)}}},{key:"load",value:function(t){var e=this;if(t){this.url=t,this.imageData={};var i=this.element,n=this.options;if(n.rotatable||n.scalable||(n.checkOrientation=!1),n.checkOrientation&&window.ArrayBuffer)if(vl.test(t))wl.test(t)?this.read((o=t.replace(la,""),s=atob(o),l=new ArrayBuffer(s.length),Il(a=new Uint8Array(l),(function(t,e){a[e]=s.charCodeAt(e)})),l)):this.clone();else{var o,s,l,a,r=new XMLHttpRequest,c=this.clone.bind(this);this.reloading=!0,this.xhr=r,r.onabort=c,r.onerror=c,r.ontimeout=c,r.onprogress=function(){r.getResponseHeader("content-type")!==fl&&r.abort()},r.onload=function(){e.read(r.response)},r.onloadend=function(){e.reloading=!1,e.xhr=null},n.checkCrossOrigin&&ta(t)&&i.crossOrigin&&(t=ea(t)),r.open("GET",t,!0),r.responseType="arraybuffer",r.withCredentials="use-credentials"===i.crossOrigin,r.send()}else this.clone()}}},{key:"read",value:function(t){var e=this.options,i=this.imageData,n=aa(t),o=0,s=1,l=1;if(n>1){this.url=function(t,e){for(var i=[],n=new Uint8Array(t);n.length>0;)i.push(sa.apply(null,Rl(n.subarray(0,8192)))),n=n.subarray(8192);return"data:".concat(e,";base64,").concat(btoa(i.join("")))}(t,fl);var a=function(t){var e=0,i=1,n=1;switch(t){case 2:i=-1;break;case 3:e=-180;break;case 4:n=-1;break;case 5:e=90,n=-1;break;case 6:e=90;break;case 7:e=90,i=-1;break;case 8:e=-90}return{rotate:e,scaleX:i,scaleY:n}}(n);o=a.rotate,s=a.scaleX,l=a.scaleY}e.rotatable&&(i.rotate=o),e.scalable&&(i.scaleX=s,i.scaleY=l),this.clone()}},{key:"clone",value:function(){var t=this.element,e=this.url,i=t.crossOrigin,n=e;this.options.checkCrossOrigin&&ta(e)&&(i||(i="anonymous"),n=ea(e)),this.crossOrigin=i,this.crossOriginUrl=n;var o=document.createElement("img");i&&(o.crossOrigin=i),o.src=n||e,o.alt=t.alt||"The image to crop",this.image=o,o.onload=this.start.bind(this),o.onerror=this.stop.bind(this),Bl(o,Ks),t.parentNode.insertBefore(o,t.nextSibling)}},{key:"start",value:function(){var t=this,e=this.image;e.onload=null,e.onerror=null,this.sizing=!0;var i=qs.navigator&&/(?:iPad|iPhone|iPod).*?AppleWebKit/i.test(qs.navigator.userAgent),n=function(e,i){Ol(t.imageData,{naturalWidth:e,naturalHeight:i,aspectRatio:e/i}),t.initialImageData=Ol({},t.imageData),t.sizing=!1,t.sized=!0,t.build()};if(!e.naturalWidth||i){var o=document.createElement("img"),s=document.body||document.documentElement;this.sizingImage=o,o.onload=function(){n(o.width,o.height),i||s.removeChild(o)},o.src=e.src,i||(o.style.cssText="left:0;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;opacity:0;position:absolute;top:0;z-index:-1;",s.appendChild(o))}else n(e.naturalWidth,e.naturalHeight)}},{key:"stop",value:function(){var t=this.image;t.onload=null,t.onerror=null,t.parentNode.removeChild(t),this.image=null}},{key:"build",value:function(){if(this.sized&&!this.ready){var t=this.element,e=this.options,i=this.image,n=t.parentNode,o=document.createElement("div");o.innerHTML='<div class="cropper-container" touch-action="none"><div class="cropper-wrap-box"><div class="cropper-canvas"></div></div><div class="cropper-drag-box"></div><div class="cropper-crop-box"><span class="cropper-view-box"></span><span class="cropper-dashed dashed-h"></span><span class="cropper-dashed dashed-v"></span><span class="cropper-center"></span><span class="cropper-face"></span><span class="cropper-line line-e" data-cropper-action="e"></span><span class="cropper-line line-n" data-cropper-action="n"></span><span class="cropper-line line-w" data-cropper-action="w"></span><span class="cropper-line line-s" data-cropper-action="s"></span><span class="cropper-point point-e" data-cropper-action="e"></span><span class="cropper-point point-n" data-cropper-action="n"></span><span class="cropper-point point-w" data-cropper-action="w"></span><span class="cropper-point point-s" data-cropper-action="s"></span><span class="cropper-point point-ne" data-cropper-action="ne"></span><span class="cropper-point point-nw" data-cropper-action="nw"></span><span class="cropper-point point-sw" data-cropper-action="sw"></span><span class="cropper-point point-se" data-cropper-action="se"></span></div></div>';var s=o.querySelector(".".concat(Os,"-container")),l=s.querySelector(".".concat(Os,"-canvas")),a=s.querySelector(".".concat(Os,"-drag-box")),r=s.querySelector(".".concat(Os,"-crop-box")),c=r.querySelector(".".concat(Os,"-face"));this.container=n,this.cropper=s,this.canvas=l,this.dragBox=a,this.cropBox=r,this.viewBox=s.querySelector(".".concat(Os,"-view-box")),this.face=c,l.appendChild(i),Bl(t,Xs),n.insertBefore(s,t.nextSibling),this.isImg||Hl(i,Ks),this.initPreview(),this.bind(),e.initialAspectRatio=Math.max(0,e.initialAspectRatio)||NaN,e.aspectRatio=Math.max(0,e.aspectRatio)||NaN,e.viewMode=Math.max(0,Math.min(3,Math.round(e.viewMode)))||0,Bl(r,Xs),e.guides||Bl(r.getElementsByClassName("".concat(Os,"-dashed")),Xs),e.center||Bl(r.getElementsByClassName("".concat(Os,"-center")),Xs),e.background&&Bl(s,"".concat(Os,"-bg")),e.highlight||Bl(c,Zs),e.cropBoxMovable&&(Bl(c,Qs),Wl(c,tl,Ns)),e.cropBoxResizable||(Bl(r.getElementsByClassName("".concat(Os,"-line")),Xs),Bl(r.getElementsByClassName("".concat(Os,"-point")),Xs)),this.render(),this.ready=!0,this.setDragMode(e.dragMode),e.autoCrop&&this.crop(),this.setData(e.data),Ml(e.ready)&&Xl(t,bl,e.ready,{once:!0}),Kl(t,bl)}}},{key:"unbuild",value:function(){this.ready&&(this.ready=!1,this.unbind(),this.resetPreview(),this.cropper.parentNode.removeChild(this.cropper),Hl(this.element,Xs))}},{key:"uncreate",value:function(){this.ready?(this.unbuild(),this.ready=!1,this.cropped=!1):this.sizing?(this.sizingImage.onload=null,this.sizing=!1,this.sized=!1):this.reloading?(this.xhr.onabort=null,this.xhr.abort()):this.image&&this.stop()}}],n=[{key:"noConflict",value:function(){return window.Cropper=pa,t}},{key:"setDefaults",value:function(t){Ol(kl,Tl(t)&&t)}}],i&&Es(e.prototype,i),n&&Es(e,n),t}();Ol(ga.prototype,ra,ca,ua,da,ha,ba);const ma=1,fa={exposure:[-100,100],contrast:[-100,100],highlights:[-100,100],shadows:[-100,100],saturation:[-100,100],temperature:[-100,100],tint:[-100,100],clarity:[-100,100],sharpen:[0,100]};function ya(t,e,i){return t=Number(t),Number.isFinite(t)?Math.min(i,Math.max(e,t)):null}function va(t){if(t&&"object"==typeof t&&!Object.isFrozen(t)){Object.freeze(t);for(const e of Object.keys(t))va(t[e])}return t}function wa(t){return void 0===t?void 0:JSON.parse(JSON.stringify(t))}function xa(t,e){if(!Number.isFinite(t)||!Number.isFinite(e)||t<1||e<1)throw new Error("createRecipe: valid source dimensions required");return va({v:ma,source:{w:Math.round(t),h:Math.round(e)}})}function ka(t){const e=wa(t)||{},i=[];if("number"!=typeof e.v&&(e.v=ma),e.source&&Number.isFinite(e.source.w)&&Number.isFinite(e.source.h)||(i.push("missing source dimensions"),e.source={w:1,h:1,...e.source||{}}),e.geometry){const t=e.geometry;if(void 0!==t.rotate90){const e=ya(Math.round(t.rotate90),0,3);null===e?delete t.rotate90:t.rotate90=e}if(void 0!==t.straighten){const e=ya(t.straighten,-45,45);null===e?delete t.straighten:t.straighten=e}if(void 0!==t.flipH&&(t.flipH=!!t.flipH),void 0!==t.flipV&&(t.flipV=!!t.flipV),t.crop){const e=t.crop,n=ya(e.x,0,1),o=ya(e.y,0,1);let s=ya(e.w,0,1),l=ya(e.h,0,1);null===n||null===o||null===s||null===l||0===s||0===l?(i.push("malformed crop dropped"),delete t.crop):(s=Math.min(s,1-n),l=Math.min(l,1-o),t.crop={...e,x:n,y:o,w:s,h:l})}}if(e.adjust)for(const[t,[i,n]]of Object.entries(fa))if(void 0!==e.adjust[t]){const o=ya(e.adjust[t],i,n);null===o?delete e.adjust[t]:e.adjust[t]=o}return void 0!==e.effects&&(Array.isArray(e.effects)?(e.effects=e.effects.filter((t=>!(!t||"string"!=typeof t.type||!t.type)||(i.push("effect without type dropped"),!1))),0===e.effects.length&&delete e.effects):(i.push("effects not an array; dropped"),delete e.effects)),e.__warnings=i,0===i.length&&delete e.__warnings,e}function Sa(t){const e=wa(t);delete e.__warnings;const i=JSON.stringify(e);if(i.length>65536)throw new Error("recipe exceeds 65536 bytes");return i}function _a(t){let e;try{e="string"==typeof t?JSON.parse(t):t}catch{return null}return va(ka(e))}class Ca{constructor(t){this.stack=[t],this.pointer=0}get current(){return this.stack[this.pointer]}get canUndo(){return this.pointer>0}get canRedo(){return this.pointer<this.stack.length-1}push(t){return this.stack=this.stack.slice(0,this.pointer+1),this.stack.push(t),this.pointer++,t}undo(){return this.canUndo&&this.pointer--,this.current}redo(){return this.canRedo&&this.pointer++,this.current}reset(){return this.pointer=0,this.current}}const Ea="kanvas-look:";function Aa(t,e,i=Math.random){const n="string"==typeof e?Ta(e):e;if(!n||"look"!==n.kind)throw new Error("applyLook: not a look");return function(t,e){const i=wa(t);return e(i),va(ka(i))}(t,(t=>{n.adjust&&(t.adjust=wa(n.adjust)),n.effects&&(t.effects=wa(n.effects).map((t=>("grain"===t.type&&void 0===t.seed&&(t.seed=Math.floor(4294967295*i())),t)))),n.name&&(t.meta={...t.meta||{},look:n.name})}))}function La(t){return Ea+function(t){const e=(new TextEncoder).encode(t);let i="";for(const t of e)i+=String.fromCharCode(t);return("function"==typeof btoa?btoa(i):Buffer.from(e).toString("base64")).replace(/\+/g,"-").replace(/\//g,"_").replace(/=+$/,"")}(JSON.stringify(t))}function Ta(t){if("string"!=typeof t||!t.startsWith(Ea))return null;try{const e=JSON.parse(function(t){const e=t.replace(/-/g,"+").replace(/_/g,"/"),i="function"==typeof atob?atob(e):Buffer.from(e,"base64").toString("binary"),n=Uint8Array.from(i,(t=>t.charCodeAt(0)));return(new TextDecoder).decode(n)}(t.slice(Ea.length)));return e&&"look"===e.kind?va(e):null}catch{return null}}const Ma=Math.PI/180;function qa(t){if("string"!=typeof t)return null;const e=t.match(/^(\d+(?:\.\d+)?)[:x\/](\d+(?:\.\d+)?)$/);if(!e)return null;const i=parseFloat(e[1]),n=parseFloat(e[2]);return n>0?i/n:null}function Ra(t,e={}){const i=e.rotate90||0,n=e.straighten||0,o=function(t,e,i=0){return i%2==1?{w:e,h:t}:{w:t,h:e}}(t.w,t.h,i),s=function(t,e,i){const n=Math.abs(t)*Ma;if(0===n)return 1;const o=Math.cos(n),s=Math.sin(n);return o+Math.max(e/i,i/e)*s}(n,o.w,o.h),l=function(t,e,i){const n=t||{x:0,y:0,w:1,h:1},o=Math.round(n.x*e),s=Math.round(n.y*i),l=Math.max(1,Math.round(n.w*e)),a=Math.max(1,Math.round(n.h*i));return{x:Math.min(o,e-1),y:Math.min(s,i-1),w:Math.min(l,e-o),h:Math.min(a,i-s)}}(e.crop,o.w,o.h);return{frame:o,rotate90:i,flipH:!!e.flipH,flipV:!!e.flipV,straighten:n,zoom:s,cropPx:l,outW:l.w,outH:l.h}}function Ia(t){if("string"!=typeof t)return t;const e=t.match(/^(\d+(?:\.\d+)?):(\d+(?:\.\d+)?)$/);return e?`${e[2]}:${e[1]}`:t}const Oa=.2126,Na=.7152,$a=.0722,Pa=40;function Da(t,e,i){const n=Math.min(1,Math.max(0,(i-t)/(e-t)));return n*n*(3-2*n)}function Ba(t){return!t||Object.entries(t).every((([t,e])=>"number"!=typeof e||0===e))}function Ha(t,e={}){if(Ba(e))return t;const{data:i}=t,n=function(t={}){const e=t.exposure||0,i=t.contrast||0,n=t.highlights||0,o=t.shadows||0,s=Math.pow(2,e/100*2),l=1+i/100,a=new Uint8ClampedArray(256);for(let t=0;t<256;t++){let e=t/255;e*=s,e=(e-.5)*l+.5,0!==n&&(e+=n/100*.35*Da(.5,1,e)*(1-e)),0!==o&&(e+=o/100*.35*(1-Da(0,.5,e))*(1-e)*Math.min(1,8*e)),a[t]=Math.round(255*Math.min(1,Math.max(0,e)))}return a}(e),o=e.saturation||0,s=e.temperature||0,l=e.tint||0,a=1+o/100,r=s/100*Pa,c=l/100*Pa,u=0!==o,d=0!==s||0!==l;for(let t=0;t<i.length;t+=4){let e=n[i[t]],o=n[i[t+1]],s=n[i[t+2]];if(u){const t=Oa*e+Na*o+$a*s;e=t+(e-t)*a,o=t+(o-t)*a,s=t+(s-t)*a}d&&(e+=r+.5*c,s-=r-.5*c,o-=c),i[t]=e<0?0:e>255?255:e,i[t+1]=o<0?0:o>255?255:o,i[t+2]=s<0?0:s>255?255:s}return t}function za(t){let e=0;const i=[];for(const n of t.split(/\r?\n/)){const t=n.trim();if(!t||t.startsWith("#"))continue;if(/^TITLE/i.test(t)||/^DOMAIN_/i.test(t))continue;if(/^LUT_1D_SIZE/i.test(t))throw new Error("1D LUTs not supported (3D required)");const o=t.match(/^LUT_3D_SIZE\s+(\d+)/i);if(o){e=parseInt(o[1],10);continue}const s=t.split(/\s+/);if(s.length>=3){const t=parseFloat(s[0]),e=parseFloat(s[1]),n=parseFloat(s[2]);Number.isFinite(t)&&Number.isFinite(e)&&Number.isFinite(n)&&i.push(t,e,n)}}if(!e)throw new Error(".cube missing LUT_3D_SIZE");if(i.length!==e*e*e*3)throw new Error(`.cube expected ${e**3} entries, got ${i.length/3}`);return{size:e,data:Float32Array.from(i)}}function Fa(t,e,i,n,o){const s=t.size,l=t.data,a=s-1;let r=e*a,c=i*a,u=n*a,d=Math.floor(r),h=Math.floor(c),b=Math.floor(u);d>=a&&(d=a-1),h>=a&&(h=a-1),b>=a&&(b=a-1);const p=r-d,g=c-h,m=u-b,f=3*s,y=s*s*3,v=3*d+h*f+b*y,w={c000:v,c100:v+3,c010:v+f,c001:v+y,c110:v+3+f,c101:v+3+y,c011:v+f+y,c111:v+3+f+y};let x,k,S,_,C,E,A,L;p>=g?g>=m?(x=w.c000,k=w.c100,S=w.c110,_=w.c111,C=1-p,E=p-g,A=g-m,L=m):p>=m?(x=w.c000,k=w.c100,S=w.c101,_=w.c111,C=1-p,E=p-m,A=m-g,L=g):(x=w.c000,k=w.c001,S=w.c101,_=w.c111,C=1-m,E=m-p,A=p-g,L=g):m>=g?(x=w.c000,k=w.c001,S=w.c011,_=w.c111,C=1-m,E=m-g,A=g-p,L=p):m>=p?(x=w.c000,k=w.c010,S=w.c011,_=w.c111,C=1-g,E=g-m,A=m-p,L=p):(x=w.c000,k=w.c010,S=w.c110,_=w.c111,C=1-g,E=g-p,A=p-m,L=m),o[0]=l[x]*C+l[k]*E+l[S]*A+l[_]*L,o[1]=l[x+1]*C+l[k+1]*E+l[S+1]*A+l[_+1]*L,o[2]=l[x+2]*C+l[k+2]*E+l[S+2]*A+l[_+2]*L}function Ua(t,e,i=1){if(i<=0)return t;const{data:n}=t,o=[0,0,0],s=1/255,l=Math.min(1,i),a=1-l;for(let t=0;t<n.length;t+=4)Fa(e,n[t]*s,n[t+1]*s,n[t+2]*s,o),n[t]=n[t]*a+255*o[0]*l,n[t+1]=n[t+1]*a+255*o[1]*l,n[t+2]=n[t+2]*a+255*o[2]*l;return t}const ja=t=>t<0?0:t>1?1:t,Wa=([t,e,i])=>.2126*t+.7152*e+.0722*i,Va=(t,e,i)=>{const n=ja((i-t)/(e-t));return n*n*(3-2*n)};function Ga([t,e,i]){const n=Math.max(t,e,i),o=n-Math.min(t,e,i);let s=0;0!==o&&(s=n===t?(e-i)/o%6:n===e?(i-t)/o+2:(t-e)/o+4,s*=60,s<0&&(s+=360));return[s,0===n?0:o/n,n]}function Ya([t,e,i]){const n=i*e,o=(t%360+360)%360/60,s=n*(1-Math.abs(o%2-1));let l;l=o<1?[n,s,0]:o<2?[s,n,0]:o<3?[0,n,s]:o<4?[0,s,n]:o<5?[s,0,n]:[n,0,s];const a=i-n;return[l[0]+a,l[1]+a,l[2]+a]}const Xa=(t,e)=>([i,n,o])=>[ja(i*(1+.4*t)),ja(n*(1-.2*e)),ja(o*(1-.4*t))],Ka=(t,e=.435)=>i=>i.map((i=>ja((i-e)*t+e))),Za=t=>e=>{const i=Wa(e);return e.map((e=>ja(i+(e-i)*t)))},Ja=(t,e,i)=>n=>n.map(((n,o)=>{let s=n*i[o]+t[o]*(1-n);return s=ja(s),Math.pow(s,1/e[o])})),Qa=(t,e=.6)=>i=>i.map((i=>{if(i<=e)return i;const n=(i-e)/(1-e);return ja(e+(1+t)*n/(1+t*n)*(1-e))})),tr=t=>e=>e.map((e=>ja(t+e*(1-t)))),er=(t,e,i,n,o=.5)=>s=>{const l=Wa(s),a=Ya([t,1,1]),r=Ya([i,1,1]),c=Va(0,.22,l)*(1-Va(.9,1,l)),u=(1-Va(0,o+.25,l))*e*c,d=Va(o-.25,1,l)*n*c;let h=s.map(((t,e)=>t+2*(a[e]-.5)*u*(.3+.7*(1-l))));h=h.map(((t,e)=>t+2*(r[e]-.5)*d*(.3+.7*l)));const b=Wa(h),p=l-b;return h.map((t=>ja(t+p)))},ir=(t,e,i,n=0)=>o=>{const[s,l,a]=Ga(o);if(l<.02)return o;const r=Math.max(0,1-function(t,e){return Math.abs(((t-e)%360+540)%360-180)}(s,t)/e),c=r*r*(3-2*r),u=ja(l*((t,e,i)=>t+(e-t)*i)(1,i,c));return Ya([s+n*c,u,a]).map(ja)},nr=t=>([e,i,n])=>[ja(e*(1-t)+i*t*.7+n*t*.3),ja(i*(1-.6*t)+e*t*.35+n*t*.25),ja(n*(1-t)+i*t*.65+e*t*.35)],or=t=>e=>{const[i,n,o]=Ga(e);if(n<.02)return e;return Ya([i,ja(n*(1+t*(1-n))),o]).map(ja)},sr=t=>e=>e.map((e=>ja(e*e*(1+t)/(e+t)))),lr=(t,e=.45)=>{const i=i=>1/(1+Math.exp(-t*(i-e))),n=i(0),o=i(1);return t=>t.map((t=>ja((i(t)-n)/(o-n))))},ar=(t,e,i)=>{const n=t+e+i;return o=>{const s=ja((o[0]*t+o[1]*e+o[2]*i)/n);return[s,s,s]}},rr=(t,e=.65)=>i=>{const n=Wa(i),o=Va(e,1,n)*t;return i.map((t=>ja(t+(n-t)*o)))},cr=(...t)=>e=>t.reduce(((t,e)=>e(t)),e),ur=[{id:"deep-harbor",label:"Deep Harbor",category:"Film",intensity:50,fn:cr(Xa(-.012,-.004),Ka(1.15,.4),Qa(.55,.52),er(185,.12,200,.045,.42),ir(200,70,1.08,6),ir(60,40,.8,-6),Za(.85),Ja([0,.004,.008],[1,1,1],[.995,1,1]),nr(.04))},{id:"ivory-bloom",label:"Ivory Bloom",category:"Film",intensity:50,fn:cr(Ja([.02,.02,.022],[1.12,1.12,1.1],[1,1,1]),Ka(.9,.55),Za(.82),er(210,.025,45,.045,.55),Qa(.5,.5),rr(.4,.55),nr(.045))},{id:"northlight",label:"Northlight",category:"Film",intensity:50,fn:cr(sr(.04),Xa(-.018,-.004),Ka(1.04,.48),Za(.9),er(220,.05,210,.03,.5),ir(30,40,1.08,0),Qa(.3,.65),rr(.22,.7),nr(.04))},{id:"tungsten-bloom",label:"Tungsten Bloom",category:"Film",intensity:50,fn:cr(tr(.03),Xa(.06,.012),Ka(1.02,.48),er(30,.05,42,.08,.55),ir(215,60,.85,5),Qa(.45,.55),rr(.25,.62),or(.08),nr(.05))},{id:"velvet-meadow",label:"Velvet Meadow",category:"Film",intensity:50,fn:cr(sr(.07),Ka(1.16,.44),or(.35),ir(0,35,1.15,3),ir(130,50,1.2,-8),ir(215,55,1.1,0),Qa(.3,.68),rr(.2,.78),nr(.045))},{id:"atelier",label:"Atelier",category:"Portrait",intensity:50,fn:cr(sr(.025),Ka(1.07,.46),ir(28,40,1,0),or(.06),Qa(.3,.68),nr(.025))},{id:"porcelain",label:"Porcelain",category:"Portrait",intensity:50,fn:cr(Ja([.012,.012,.014],[1.06,1.06,1.05],[1,1,1]),Ka(1.02,.5),ir(28,40,.95,0),rr(.25,.68),Qa(.35,.6),nr(.03))},{id:"rosewood",label:"Rosewood",category:"Portrait",intensity:50,fn:cr(Xa(.018,.01),sr(.035),Ka(1.06,.47),Za(.88),er(350,.03,30,.04,.5),ir(28,36,1.06,0),ir(130,60,.75,8),ir(215,60,.8,0),rr(.22,.68),nr(.04))},{id:"vista-vivid",label:"Vista Vivid",category:"Landscape",intensity:50,fn:cr(sr(.035),Ka(1.1,.46),or(.28),ir(215,55,1.15,-3),ir(125,55,1.12,-5),ir(28,35,1,0),rr(.15,.78),Qa(.3,.66),nr(.035))},{id:"bw-standard",label:"Standard",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46))},{id:"bw-soft",label:"Soft",category:"B&W",intensity:100,hidden:!0,fn:cr(ar(.2126,.7152,.0722),lr(2.2,.44))},{id:"bw-deep",label:"Deep",category:"B&W",intensity:100,fn:cr(ar(.3,.6,.1),lr(4,.5))},{id:"bw-warmtone",label:"Warmtone",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46),er(35,.025,42,.045,.5))},{id:"bw-cooltone",label:"Cooltone",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46),er(225,.04,220,.02,.45))},{id:"silver-mist",label:"Silver Mist",category:"B&W",intensity:100,fn:cr(ar(.22,.7,.08),tr(.07),Ka(.92,.5),Qa(.5,.5))},{id:"emerald-noir",label:"Emerald Noir",category:"Creative",intensity:70,fn:cr(sr(.05),Ka(1.1,.45),Za(.82),er(155,.09,90,.04,.48),ir(28,32,1.12,0),Qa(.4,.58),nr(.05))},{id:"pastel-air",label:"Pastel Air",category:"Creative",intensity:75,fn:cr(Ja([.018,.018,.02],[1.1,1.1,1.08],[1,1,1]),Ka(.92,.54),Za(.85),er(330,.03,210,.035,.55),rr(.3,.6),Qa(.45,.52),nr(.04))},{id:"sunprint",label:"Sunprint",category:"Creative",intensity:65,fn:cr(Xa(.04,.008),sr(.045),Ka(1.12,.46),ir(15,45,1.2,5),ir(215,55,.75,10),er(25,.05,40,.08,.5),or(.1),rr(.2,.68),Qa(.35,.58),nr(.05))}],dr=33;function hr(t,e,i){return.2126*t+.7152*e+.0722*i}function br(t,e=.72,i=.22){return t<=e?t:e+(1-Math.exp(-(t-e)/i))*i*((1-e)/i)}function pr(t,e){return t+e*Math.sin((t-.5)*Math.PI)*(t*(1-t))*4*.25}function gr(t,e,i,n,o){const s=hr(t,e,i),l=Math.pow(1-s,2),a=Math.pow(s,2);return[t+n[0]*l+o[0]*a,e+n[1]*l+o[1]*a,i+n[2]*l+o[2]*a]}function mr(t,e){return t*(1-e)+e}const fr={"film-warm":(t,e,i)=>(t=br(pr(mr(t,.025),.1)),e=br(pr(mr(e,.022),.1)),i=br(pr(mr(i,.03),.08)),[t,e,i]=gr(t,e,i,[-.01,.004,.022],[.03,.012,-.02]),[t,e,i]=function(t,e,i,n){const o=Math.max(t,e,i),s=Math.min(t,e,i),l=0===o?0:(o-s)/o,a=1-n*l*l;return[t*a,e*a,i*a]}(t,e,i,.1),[t,e,i]),"film-muted":(t,e,i)=>{const n=hr(t,e,i),o=.78;return e=n+(e-n)*o,i=n+(i-n)*o,t=br(mr(t=n+(t-n)*o,.045),.68,.26),e=br(mr(e,.045),.68,.26),i=br(mr(i,.05),.68,.26),[t,e,i]=gr(t,e,i,[-.006,.002,.014],[.008,.006,0]),[t,e,i]},"mono-classic":(t,e,i)=>{let n=.45*t+.45*e+.1*i;return n=pr(n,.22),n=br(mr(n,.02)),[n,n,n]}};for(const t of ur)fr[t.id]=(e,i,n)=>t.fn([e,i,n]);const yr=ur.find((t=>"bw-soft"===t.id));yr&&(fr["mono-classic"]=(t,e,i)=>yr.fn([t,e,i]));const vr=new Map;function wr(t){if(vr.has(t))return vr.get(t);const e=fr[t];if(!e)return null;const i=function(t,e){const i=new Float32Array(t*t*t*3),n=1/(t-1);let o=0;for(let s=0;s<t;s++)for(let l=0;l<t;l++)for(let a=0;a<t;a++){const t=e(a*n,l*n,s*n);i[o++]=Math.min(1,Math.max(0,t[0])),i[o++]=Math.min(1,Math.max(0,t[1])),i[o++]=Math.min(1,Math.max(0,t[2]))}return{size:t,data:i}}(dr,e);return vr.set(t,i),i}function xr(t,e){if(fr[t])throw new Error(`"${t}" is a reserved built-in id`);vr.set(t,e)}function kr(t){return t&&"object"==typeof t&&t.data?t:"string"==typeof t&&(wr(t)||vr.get(t))||null}const Sr="x-cube:",_r=new Map,Cr=new Map;function Er(t){const e=String(t).split(/[?#]/)[0].replace(/^[a-z]+:\/\/[^/]+/i,"").replace(/\.cube$/i,"").replace(/^[./]+/,"");return Sr+e}function Ar(t){return Sr+String(t).toLowerCase().trim().replace(/\s+/g,"-")}function Lr(t){let e=t;if("string"==typeof e)e={url:e};else if(Array.isArray(e)){const[t,i,n]=e;e={url:t,intensity:i,label:n}}if(!e||"object"!=typeof e)return null;if(!e.url&&!e.cube&&!e.lut)return null;const i=e.url?Er(e.url):Ar(e.label||"preset"),n=Number.isFinite(e.intensity)?Math.max(0,Math.min(100,e.intensity)):80;return{id:i,label:e.label||(e.url?(o=e.url,(String(o).split(/[?#]/)[0].split("/").pop()||"Preset").replace(/\.cube$/i,"").replace(/[-_]+/g," ").replace(/\b\w/g,(t=>t.toUpperCase()))):i.slice(Sr.length)),category:e.category||"Other",url:e.url||null,intensity:n,state:"idle",error:null};var o}async function Tr(t,e={}){let i=t;if("string"==typeof t){const e=await fetch(t);if(!e.ok)throw new Error(`presets: ${t} — HTTP ${e.status}`);i=await e.json()}const n=function(t){if(!t)return[];let e=[];if(Array.isArray(t))e=t.map(Lr);else if("object"==typeof t)for(const[i,n]of Object.entries(t))for(const t of n||[]){const n=Lr(t);n&&(n.category="Other"===n.category?i:n.category),e.push(n)}return e.filter(Boolean)}(i);for(const t of n)_r.set(t.id,_r.get(t.id)||t);for(const t of Array.isArray(i)?i:[]){if("string"==typeof t||!t)continue;if(!t.cube&&!t.lut)continue;const e=t.url?Er(t.url):Ar(t.label||"preset"),i=_r.get(e);if(i&&"ready"!==i.state)try{xr(e,t.lut||za(t.cube)),i.state="ready"}catch(t){i.state="error",i.error=t.message}}return e.eager&&await Promise.all(n.map((t=>Mr(t.id)))),n.map((t=>_r.get(t.id)||t))}function Mr(t){const e=_r.get(t);if(!e)return Promise.resolve(kr(t));const i=kr(t);if(i)return e.state="ready",Promise.resolve(i);if("error"===e.state)return Promise.resolve(null);if(Cr.has(t))return Cr.get(t);if(!e.url)return Promise.resolve(null);e.state="loading";const n=(async()=>{try{const i=await fetch(e.url);if(!i.ok)throw new Error(`HTTP ${i.status}`);const n=za(await i.text());return xr(t,n),e.state="ready",n}catch(t){return e.state="error",e.error=t.message,console.warn(`kanvas: preset "${e.label}" (${e.url}) failed — ${e.error}`),null}finally{Cr.delete(t)}})();return Cr.set(t,n),n}function qr(t,e,i,n,o){const s=1/(o+o+1);for(let l=0;l<n;l++){const n=l*i;let a=t[n]*(o+1);for(let e=0;e<o;e++)a+=t[n+Math.min(e,i-1)];for(let l=0;l<i;l++){a+=t[n+Math.min(l+o,i-1)]-t[n+Math.max(l-o-1,0)],e[n+l]=a*s}}}function Rr(t,e,i,n,o){const s=1/(o+o+1);for(let l=0;l<i;l++){let a=t[l]*(o+1);for(let e=0;e<o;e++)a+=t[l+Math.min(e,n-1)*i];for(let r=0;r<n;r++){a+=t[l+Math.min(r+o,n-1)*i]-t[l+Math.max(r-o-1,0)*i],e[l+r*i]=a*s}}}function Ir(t,e,i,n){if(n<.5)return t;const o=Math.max(1,Math.round(n/1.732)),s=new Float32Array(t.length);for(let n=0;n<3;n++)qr(t,s,e,i,o),Rr(s,t,e,i,o);return t}function Or(t){const{data:e,width:i,height:n}=t,o=new Float32Array(i*n);for(let t=0,i=0;t<e.length;t+=4,i++)o[i]=.2126*e[t]+.7152*e[t+1]+.0722*e[t+2];return o}const Nr=new Map;function $r(t,e){if("string"!=typeof t||!t)throw new Error("effect type required");if(Nr.has(t))throw new Error(`effect "${t}" already registered`);Nr.set(t,e)}function Pr(t,e,i={}){const n=t.width||t.videoWidth||t.naturalWidth,o=t.height||t.videoHeight||t.naturalHeight,s=Ra({w:n,h:o},e.geometry);let l=s.outW,a=s.outH,r=1;i.maxSize&&Math.max(l,a)>i.maxSize&&(r=i.maxSize/Math.max(l,a),l=Math.max(1,Math.round(l*r)),a=Math.max(1,Math.round(a*r)));const c=function(t,e){if("undefined"!=typeof OffscreenCanvas)return new OffscreenCanvas(t,e);const i=document.createElement("canvas");return i.width=t,i.height=e,i}(l,a),u=c.getContext("2d");u.imageSmoothingQuality="high",u.save(),u.scale(r,r),u.translate(-s.cropPx.x,-s.cropPx.y),u.translate(s.frame.w/2,s.frame.h/2),u.rotate(s.straighten*Math.PI/180),u.scale(s.zoom,s.zoom),u.scale(s.flipH?-1:1,s.flipV?-1:1),u.rotate(s.rotate90*Math.PI/2),u.drawImage(t,-n/2,-o/2),u.restore();const d=!Ba(e.adjust),h=(e.effects||[]).filter((t=>!1!==t.enabled));if(d||h.length){let t=u.getImageData(0,0,l,a);const i={width:l,height:a,diagonal:Math.hypot(l,a)};d&&(Ha(t,e.adjust),e.adjust.clarity&&function(t,e,i){if(!e)return t;const{data:n,width:o,height:s}=t,l=Or(t),a=Ir(Float32Array.from(l),o,s,.01*i),r=e/100*.9;for(let t=0,e=0;t<n.length;t+=4,e++){const i=l[e];if(i<=0)continue;const o=i/255,s=4*o*(1-o),c=i+r*(i-a[e])*s,u=Math.max(0,c)/i;n[t]=Math.min(255,n[t]*u),n[t+1]=Math.min(255,n[t+1]*u),n[t+2]=Math.min(255,n[t+2]*u)}}(t,e.adjust.clarity,i.diagonal),e.adjust.sharpen&&function(t,e,i){if(!e)return t;const{data:n,width:o,height:s}=t,l=Or(t),a=Math.max(.6,8e-4*i),r=Ir(Float32Array.from(l),o,s,a),c=e/100*1.2;for(let t=0,e=0;t<n.length;t+=4,e++){const i=l[e];if(i<=0)continue;const o=i+c*(i-r[e]),s=Math.max(0,o)/i;n[t]=Math.min(255,n[t]*s),n[t+1]=Math.min(255,n[t+1]*s),n[t+2]=Math.min(255,n[t+2]*s)}}(t,e.adjust.sharpen,i.diagonal)),t=function(t,e,i){let n=t;for(const t of e){if(!1===t.enabled)continue;const e=Nr.get(t.type);e?n=e(n,t,i)||n:console.warn(`kanvas: unknown effect "${t.type}" skipped (preserved in recipe)`)}return n}(t,h,i),u.putImageData(t,0,0)}return c}const Dr=64,Br="#version 300 es\nvoid main() {\n vec2 v = vec2(float((gl_VertexID << 1) & 2), float(gl_VertexID & 2));\n gl_Position = vec4(v * 2.0 - 1.0, 0.0, 1.0);\n}",Hr=`#version 300 es\nprecision highp float;\nuniform sampler2D uTex;\nuniform vec2 uRes;\nuniform int uMode; /* 0 = linear, 1 = zoom */\nuniform vec2 uDir; /* unit direction (linear) */\nuniform float uLen; /* blur length in px (linear) */\nuniform vec2 uCenter; /* zoom center in px */\nuniform float uAmount; /* zoom amount 0..1 */\nuniform int uSteps;\nuniform vec4 uFocus; /* cx, cy, inner, outer (px) */\nuniform int uHasFocus;\nout vec4 outColor;\nconst int MAX_STEPS = ${Dr};\nvoid main() {\n vec2 p = gl_FragCoord.xy;\n ivec2 ip = ivec2(p);\n vec4 orig = texelFetch(uTex, ip, 0);\n vec3 acc = vec3(0.0);\n float n = 0.0;\n float denom = float(uSteps - 1);\n for (int s = 0; s < MAX_STEPS; s++) {\n if (s >= uSteps) break;\n float f = float(s) / denom;\n vec2 sp = (uMode == 0)\n ? p + uDir * ((f - 0.5) * uLen)\n : uCenter + (p - uCenter) * (1.0 - uAmount * f);\n if (sp.x < 0.0 || sp.y < 0.0 || sp.x >= uRes.x || sp.y >= uRes.y) continue;\n acc += texelFetch(uTex, ivec2(sp), 0).rgb;\n n += 1.0;\n }\n vec3 blurred = n > 0.0 ? acc / n : orig.rgb;\n float m = 0.0;\n if (uHasFocus == 1) {\n float d = distance(p, uFocus.xy);\n if (d <= uFocus.z) {\n m = 1.0;\n } else if (d < uFocus.w) {\n float t = (d - uFocus.z) / (uFocus.w - uFocus.z);\n m = 1.0 - t * t * (3.0 - 2.0 * t);\n }\n }\n outColor = vec4(mix(blurred, orig.rgb, m), orig.a);\n}`;let zr=null;function Fr(t,e){const i=function(){if(null!==zr)return zr;try{let t=null;"undefined"!=typeof OffscreenCanvas?t=new OffscreenCanvas(4,4):"undefined"!=typeof document&&(t=document.createElement("canvas"));const e=t&&t.getContext("webgl2",{alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!1,preserveDrawingBuffer:!1});if(!e)return zr=!1,zr;const i=(t,i)=>{const n=e.createShader(t);if(e.shaderSource(n,i),e.compileShader(n),!e.getShaderParameter(n,e.COMPILE_STATUS))throw new Error(String(e.getShaderInfoLog(n)));return n},n=e.createProgram();if(e.attachShader(n,i(e.VERTEX_SHADER,Br)),e.attachShader(n,i(e.FRAGMENT_SHADER,Hr)),e.linkProgram(n),!e.getProgramParameter(n,e.LINK_STATUS))throw new Error(String(e.getProgramInfoLog(n)));e.useProgram(n);const o=e.createTexture();e.bindTexture(e.TEXTURE_2D,o),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,!1),e.pixelStorei(e.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1);const s=["uTex","uRes","uMode","uDir","uLen","uCenter","uAmount","uSteps","uFocus","uHasFocus"],l={};for(const t of s)l[t]=e.getUniformLocation(n,t);e.uniform1i(l.uTex,0),zr={gl:e,canvas:t,prog:n,tex:o,loc:l}}catch{zr=!1}return zr}();if(!i)return!1;const{gl:n,canvas:o,tex:s,loc:l}=i,{width:a,height:r}=t;try{o.width===a&&o.height===r||(o.width=a,o.height=r),n.viewport(0,0,a,r),n.bindTexture(n.TEXTURE_2D,s),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,a,r,0,n.RGBA,n.UNSIGNED_BYTE,t.data),n.uniform2f(l.uRes,a,r),n.uniform1i(l.uMode,"zoom"===e.mode?1:0),n.uniform2f(l.uDir,e.dx||0,e.dy||0),n.uniform1f(l.uLen,e.lengthPx||0),n.uniform2f(l.uCenter,e.cx||0,e.cy||0),n.uniform1f(l.uAmount,e.amount||0),n.uniform1i(l.uSteps,Math.min(Dr,Math.max(2,e.steps))),e.focus?(n.uniform4f(l.uFocus,e.focus.cx,e.focus.cy,e.focus.inner,e.focus.outer),n.uniform1i(l.uHasFocus,1)):n.uniform1i(l.uHasFocus,0),n.drawArrays(n.TRIANGLES,0,3);const i=new Uint8Array(a*r*4);return n.readPixels(0,0,a,r,n.RGBA,n.UNSIGNED_BYTE,i),t.data.set(i),!0}catch{return zr=!1,!1}}function Ur(t,e,i){if(!t)return null;const n=(void 0===t.cx?.5:t.cx)*e,o=(void 0===t.cy?.5:t.cy)*i,s=(void 0===t.radius?.25:t.radius)*Math.min(e,i);return{cx:n,cy:o,inner:s,outer:s*(1+2*Math.max(.001,void 0===t.feather?.5:t.feather))}}function jr(t,e){const i=kr(e.lut);if(!i)return console.warn(`kanvas: LUT "${e.lut}" not found; skipped`),t;return Ua(t,i,void 0===e.intensity?1:e.intensity)}function Wr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=void 0===e.size?.5:e.size,s=function(t){let e=t>>>0;return function(){e|=0,e=e+1831565813|0;let t=Math.imul(e^e>>>15,1|e);return t=t+Math.imul(t^t>>>7,61|t)^t,((t^t>>>14)>>>0)/4294967296}}(void 0===e.seed?1:e.seed),{data:l,width:a,height:r}=t,c=Math.max(1,Math.round((.4+1.6*o)*i.diagonal/1600)),u=Math.ceil(a/c),d=Math.ceil(r/c),h=new Float32Array(u*d);for(let t=0;t<h.length;t++)h[t]=2*s()-1;const b=34*n;for(let t=0;t<r;t++){const e=t/c,i=Math.min(d-1,Math.floor(e)),n=e-i,o=Math.min(d-1,i+1);for(let e=0;e<a;e++){const s=e/c,r=Math.min(u-1,Math.floor(s)),d=s-r,p=Math.min(u-1,r+1),g=h[i*u+r]*(1-d)*(1-n)+h[i*u+p]*d*(1-n)+h[o*u+r]*(1-d)*n+h[o*u+p]*d*n,m=4*(t*a+e),f=(.2126*l[m]+.7152*l[m+1]+.0722*l[m+2])/255,y=(f<.6?1:Math.max(0,1-(f-.6)/.38))*Math.min(1,f/.08);if(0===y)continue;const v=g*b*y;l[m]=Math.min(255,Math.max(0,l[m]+v)),l[m+1]=Math.min(255,Math.max(0,l[m+1]+v)),l[m+2]=Math.min(255,Math.max(0,l[m+2]+v))}}return t}function Vr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=255*(void 0===e.threshold?.85:e.threshold),s=(void 0===e.radius?.015:e.radius)*i.diagonal,[l,a,r]=function(t){const e=(t%360+360)%360/60,i=1-Math.abs(e%2-1);let n=0,o=0,s=0;return[n,o,s]=e<1?[1,i,0]:e<2?[i,1,0]:e<3?[0,1,i]:e<4?[0,i,1]:e<5?[i,0,1]:[1,0,i],[n,o,s]}(void 0===e.hue?20:e.hue),{data:c,width:u,height:d}=t,h=Or(t),b=new Float32Array(h.length);for(let t=0;t<h.length;t++)b[t]=h[t]>o?(h[t]-o)/(255-o):0;Ir(b,u,d,s);for(let t=0,e=0;t<c.length;t+=4,e++){const i=b[e]*n;i<=.002||(c[t]=255-(255-c[t])*(1-i*l),c[t+1]=255-(255-c[t+1])*(1-i*a),c[t+2]=255-(255-c[t+2])*(1-i*r))}return t}function Gr(t,e,i){const n=e.exposure||0;if(!n)return t;const{data:o,width:s,height:l}=t,a=Ur(e,s,l);if(!a)return t;const{cx:r,cy:c,inner:u,outer:d}=a,h=n/100*2,b=new Float32Array(257);for(let t=0;t<=256;t++)b[t]=Math.pow(2,h*(t/256));const p=Math.max(0,Math.floor(r-d)),g=Math.min(s-1,Math.ceil(r+d)),m=Math.max(0,Math.floor(c-d)),f=Math.min(l-1,Math.ceil(c+d)),y=d-u;for(let t=m;t<=f;t++){const e=t-c;for(let i=p;i<=g;i++){const n=Math.hypot(i-r,e);let l;if(n<=u)l=1;else{if(n>=d)continue;{const t=(n-u)/y;l=1-t*t*(3-2*t)}}const a=b[256*l|0],c=4*(t*s+i),h=o[c]*a,p=o[c+1]*a,g=o[c+2]*a;o[c]=h>255?255:h,o[c+1]=p>255?255:p,o[c+2]=g>255?255:g}}return t}function Yr(t,e,i){if(!t)return null;const n=(void 0===t.cx?.5:t.cx)*e,o=(void 0===t.cy?.5:t.cy)*i,s=(void 0===t.radius?.25:t.radius)*Math.min(e,i),l=Math.max(.001,void 0===t.feather?.5:t.feather),a=s,r=s*(1+2*l);return(t,e)=>{const i=Math.hypot(t-n,e-o);if(i<=a)return 1;if(i>=r)return 0;const s=(i-a)/(r-a);return 1-s*s*(3-2*s)}}function Xr(t,e,i){const{data:n,width:o,height:s}=t,{R:l,G:a,B:r}=e;for(let t=0,e=0;t<s;t++)for(let s=0;s<o;s++,e++){const o=i?i(s,t):0,c=4*e;n[c]=n[c]*o+l[e]*(1-o),n[c+1]=n[c+1]*o+a[e]*(1-o),n[c+2]=n[c+2]*o+r[e]*(1-o)}return t}function Kr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=n*i.diagonal,{width:s,height:l}=t,a=function(t){const{data:e,width:i,height:n}=t,o=i*n,s=new Float32Array(o),l=new Float32Array(o),a=new Float32Array(o);for(let t=0,i=0;t<e.length;t+=4,i++)s[i]=e[t],l[i]=e[t+1],a[i]=e[t+2];return{R:s,G:l,B:a}}(t);return Ir(a.R,s,l,o),Ir(a.G,s,l,o),Ir(a.B,s,l,o),Xr(t,a,Yr(e.focus,s,l))}function Zr(t,e,i,n){const{data:o,width:s,height:l}=t,a=new Uint8ClampedArray(o),r=new Float32Array(s*l),c=new Float32Array(s*l),u=new Float32Array(s*l);for(let t=0,e=0;t<l;t++)for(let n=0;n<s;n++,e++){let o=0,d=0,h=0,b=0;if(i(n,t,((t,e)=>{const i=Math.round(t),n=Math.round(e);if(i<0||n<0||i>=s||n>=l)return;const r=4*(n*s+i);o+=a[r],d+=a[r+1],h+=a[r+2],b++})),0===b){const t=4*e;r[e]=a[t],c[e]=a[t+1],u[e]=a[t+2]}else r[e]=o/b,c[e]=d/b,u[e]=h/b}return Xr(t,{R:r,G:c,B:u},Yr(n,s,l))}function Jr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=n*i.diagonal,s=Math.min(48,Math.max(4,Math.round(o/2))),l=(e.angle||0)*Math.PI/180,a=Math.cos(l),r=Math.sin(l);return Fr(t,{mode:"linear",dx:a,dy:r,lengthPx:o,steps:s,focus:Ur(e.focus,t.width,t.height)})?t:Zr(t,0,((t,e,i)=>{for(let n=0;n<s;n++){const l=(n/(s-1)-.5)*o;i(t+a*l,e+r*l)}}),e.focus)}function Qr(t,e,i){const n=e.amount||0;if(n<=0)return t;const{width:o,height:s}=t,l=(void 0===e.cx?.5:e.cx)*o,a=(void 0===e.cy?.5:e.cy)*s,r=Math.min(48,Math.max(4,Math.round(n*i.diagonal/2))),c=e.focus?{cx:void 0===e.cx?.5:e.cx,cy:void 0===e.cy?.5:e.cy,...e.focus}:void 0;return Fr(t,{mode:"zoom",cx:l,cy:a,amount:n,steps:r,focus:Ur(c,o,s)})?t:Zr(t,0,((t,e,i)=>{for(let o=0;o<r;o++){const s=1-n*(o/(r-1));i(l+(t-l)*s,a+(e-a)*s)}}),c)}let tc=!1;tc||(tc=!0,$r("lut",jr),$r("radial",Gr),$r("grain",Wr),$r("halation",Vr),$r("blur-soft",Kr),$r("blur-linear",Jr),$r("blur-zoom",Qr));const ec=24;function ic(t,e,i,n=12){const{x:o,y:s,w:l,h:a}=t,r=Math.abs(e-o)<=n,c=Math.abs(e-(o+l))<=n,u=Math.abs(i-s)<=n,d=Math.abs(i-(s+a))<=n,h=e>=o-n&&e<=o+l+n,b=i>=s-n&&i<=s+a+n;return u&&r?"nw":u&&c?"ne":d&&r?"sw":d&&c?"se":u&&h?"n":d&&h?"s":r&&b?"w":c&&b?"e":e>o&&e<o+l&&i>s&&i<s+a?"move":null}function nc(t,e,i,n){const o=Math.min(Math.max(t.x+e,0),n.w-t.w),s=Math.min(Math.max(t.y+i,0),n.h-t.h);return{...t,x:o,y:s}}const oc={nw:"nwse-resize",se:"nwse-resize",ne:"nesw-resize",sw:"nesw-resize",n:"ns-resize",s:"ns-resize",e:"ew-resize",w:"ew-resize",move:"move"};class sc{constructor(t,e){this.canvas=t,this.ctx=t.getContext("2d"),this.onChange=e||(()=>{}),this.rect=null,this.aspect=null,this.drag=null,t.addEventListener("pointerdown",(t=>this._down(t))),t.addEventListener("pointermove",(t=>this._move(t))),t.addEventListener("pointerup",(t=>this._up(t))),t.addEventListener("pointercancel",(t=>this._up(t)))}get bounds(){return{w:this.canvas.width,h:this.canvas.height}}setRect(t){const e=this.bounds;this.rect=t?nc({...t},0,0,e):{x:0,y:0,w:e.w,h:e.h},this.draw()}setAspect(t){this.aspect=t||null,this.aspect&&this.rect&&(this.rect=function(t,e,i,n=ec){if(!e)return t;const o=t.x+t.w/2,s=t.y+t.h/2;let l=t.w,a=l/e;a>t.h&&(a=t.h,l=a*e);const r=2*Math.min(o,i.w-o),c=2*Math.min(s,i.h-s);return l>r&&(l=r,a=l/e),a>c&&(a=c,l=a*e),a<n&&(a=n,l=a*e,l>r&&(l=r,a=l/e)),l<n&&(l=n,a=l/e,a>c&&(a=c,l=a*e)),nc({x:o-l/2,y:s-a/2,w:l,h:a},0,0,i)}(this.rect,this.aspect,this.bounds),this.onChange(this.rect)),this.draw()}_pos(t){const e=this.canvas.getBoundingClientRect();return{x:(t.clientX-e.left)*(this.canvas.width/e.width),y:(t.clientY-e.top)*(this.canvas.height/e.height)}}_down(t){if(!this.rect)return;const e=this._pos(t),i=ic(this.rect,e.x,e.y);i&&(this.canvas.setPointerCapture(t.pointerId),this.drag={handle:i,last:e},t.preventDefault())}_move(t){const e=this._pos(t);if(!this.drag){const t=this.rect&&ic(this.rect,e.x,e.y);return void(this.canvas.style.cursor=t?oc[t]:"crosshair")}const{handle:i,last:n}=this.drag;this.rect="move"===i?nc(this.rect,e.x-n.x,e.y-n.y,this.bounds):function(t,e,i,n,o){const{aspect:s=null,minSize:l=ec,bounds:a}=o,r=e.includes("w"),c=e.includes("e"),u=e.includes("n"),d=e.includes("s");if((r||c)&&(u||d)){const e=r?t.x+t.w:t.x,o=u?t.y+t.h:t.y,c=r?e:a.w-e,d=u?o:a.h-o;let h=Math.abs(i-e),b=Math.abs(n-o);return s?(h=Math.max(h,b*s),b=h/s,h>c&&(h=c,b=h/s),b>d&&(b=d,h=b*s),h<l&&(h=l,b=h/s),b<l&&(b=l,h=b*s),h=Math.min(h,c),b=Math.min(b,d)):(h=Math.min(Math.max(h,l),c),b=Math.min(Math.max(b,l),d)),{...t,x:r?e-h:e,y:u?o-b:o,w:h,h:b}}let{x:h,y:b,w:p,h:g}=t;if(c||r){const e=r?h+p:h,n=r?e:a.w-e;if(p=Math.min(Math.max(Math.abs(i-e),l),n),h=r?e-p:e,s){const i=t.y+t.h/2;g=p/s;const n=2*Math.min(i,a.h-i);g>n&&(g=n,p=g*s,h=r?e-p:e),g<l&&(g=l,p=g*s,h=r?e-p:e),b=i-g/2}}else{const e=u?b+g:b,i=u?e:a.h-e;if(g=Math.min(Math.max(Math.abs(n-e),l),i),b=u?e-g:e,s){const i=t.x+t.w/2;p=g*s;const n=2*Math.min(i,a.w-i);p>n&&(p=n,g=p/s,b=u?e-g:e),p<l&&(p=l,g=p/s,b=u?e-g:e),h=i-p/2}}return{...t,x:h,y:b,w:p,h:g}}(this.rect,i,e.x,e.y,{aspect:this.aspect,bounds:this.bounds}),this.drag.last=e,this.onChange(this.rect),this.draw()}_up(t){this.drag&&(this.drag=null,this.onChange(this.rect),this.draw())}draw(){const{ctx:t,rect:e}=this,{w:i,h:n}=this.bounds;if(t.clearRect(0,0,i,n),!e)return;t.fillStyle="rgba(0,0,0,0.55)",t.beginPath(),t.rect(0,0,i,n),t.rect(e.x,e.y,e.w,e.h),t.fill("evenodd"),t.strokeStyle="rgba(255,255,255,0.9)",t.lineWidth=1,t.strokeRect(e.x+.5,e.y+.5,e.w-1,e.h-1),t.strokeStyle="rgba(255,255,255,0.28)",t.beginPath();for(let i=1;i<3;i++)t.moveTo(e.x+e.w*i/3,e.y),t.lineTo(e.x+e.w*i/3,e.y+e.h),t.moveTo(e.x,e.y+e.h*i/3),t.lineTo(e.x+e.w,e.y+e.h*i/3);t.stroke(),t.fillStyle="#ffffff";const o=[[e.x,e.y],[e.x+e.w/2,e.y],[e.x+e.w,e.y],[e.x,e.y+e.h/2],[e.x+e.w,e.y+e.h/2],[e.x,e.y+e.h],[e.x+e.w/2,e.y+e.h],[e.x+e.w,e.y+e.h]];for(const[e,i]of o)t.fillRect(e-3.5,i-3.5,7,7)}}function lc(t,e,i){const n=document.createElement(t);return e&&(n.className=e),i?.appendChild(n),n}const ac=t=>`<svg class="kanvas-i" viewBox="0 0 24 24" aria-hidden="true">${t}</svg>`,rc=ac('<path d="M6 2v16h16M2 6h16v16"/>'),cc=ac('<path d="M21 12a9 9 0 11-3-6.7M21 3v5h-5"/>'),uc=ac('<path d="M12 3v18M8 7l-5 5 5 5M16 7l5 5-5 5"/>'),dc=ac('<path d="M3 12h18M7 8l5-5 5 5M7 16l5 5 5-5"/>'),hc={id:"",label:"None",state:"ready"},bc="Basic",pc=[{id:"film-warm",label:"Film Warm",category:bc,intensity:80,state:"ready"},{id:"film-muted",label:"Film Muted",category:bc,intensity:80,state:"ready"},{id:"mono-classic",label:"Mono Classic",category:bc,intensity:100,state:"ready"},...ur.filter((t=>!t.hidden)).map((({id:t,label:e,category:i,intensity:n})=>({id:t,label:e,category:i,intensity:n}))).map((t=>({...t,state:"ready"})))],gc=[{k:"exposure",n:"Exposure",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"contrast",n:"Contrast",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"highlights",n:"Highlights",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"shadows",n:"Shadows",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"saturation",n:"Saturation",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"clarity",n:"Clarity",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"sharpen",n:"Sharpen",min:0,max:100,d:0,g:"adjust",t:"adjust"},{k:"lookInt",n:"Intensity",min:0,max:100,d:80,g:"look",t:"look"},{k:"grain",n:"Grain",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"grainSize",n:"Grain size",min:0,max:100,d:50,g:"fx",t:"fx"},{k:"halation",n:"Halation",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"motion",n:"Motion",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"motionAngle",n:"Angle",min:0,max:180,d:0,g:"fx",t:"fx"},{k:"motionFeather",n:"Focus feather",min:0,max:100,d:50,g:"fx",t:"fx"},{k:"radialAmount",n:"Amount",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"radialFeather",n:"Feather",min:0,max:100,d:50,g:"adjust",t:"adjust"}];class mc{constructor(t){const e="string"==typeof t.container?document.querySelector(t.container):t.container;if(!e)throw new Error("KanvasEditor: container not found");if(this.t="function"==typeof t.t?t.t:t=>t,this.onChange=t.onChange,this.onLoad=t.onLoad,this.onHistory=t.onHistory,this.onApply=t.onApply,this.onCancel=t.onCancel,this.maxPreview=t.maxPreview||1400,this.aspectPresets=t.aspectPresets||["free","1:1","4:5","3:2","4:3","16:9"],this.bitmap=null,this.history=null,this.sourceName="image",this._cropMode=!1,this._comparing=!1,this._renderQueued=!1,this._exportOpts={},this._ctl={},this._thumbs={},this._toastTimer=0,this._customLuts=[],this._presets=[],this._cat=null,this._builtins=!1!==t.builtins,this._loadCube=!1!==t.loadCube,this._myLooks=!1!==t.myLooks,this._thumbSrc=null,this._thumbObserver=null,this.onLooksChange=t.onLooksChange,this._looks=[],Array.isArray(t.looks))this._looks=t.looks.map((t=>"string"==typeof t?Ta(t):t)).filter(Boolean);else try{this._looks=JSON.parse(localStorage.getItem("kanvas.looks")||"[]")}catch{this._looks=[]}this._userScale=null,this._pan={x:0,y:0},this._fitScale=1,this._fullOut=null,this._regionEdit=null,this._ui=this._defaultUiState(),this._build(e),this.setTheme(t.theme||"light"),t.title&&(this._els.title.textContent=t.title),this._els.header.hidden=!t.header,t.presets&&Tr(t.presets).then((t=>{this._presets=t,this._rebuildReel(),this._drawThumbs()})).catch((t=>{console.warn("kanvas: presets could not be loaded —",t.message)}))}async load(t,e={}){try{this.bitmap=await mc.loadBitmap(t,this.t)}catch(t){throw this._toast(t.message),t}"string"==typeof t?this.sourceName=t.split("/").pop()?.split("?")[0]||"image":t instanceof File&&(this.sourceName=t.name);let i=xa(this.bitmap.width,this.bitmap.height);if(e.recipe){const t=_a(e.recipe);t&&(i=ka({...JSON.parse(Sa(t)),source:{w:this.bitmap.width,h:this.bitmap.height}}),Object.freeze(i))}return this.history=new Ca(i),this._syncUiFromRecipe(i),this._resetZoom(),this._els.empty.hidden=!0,this._els.tools.hidden=!1,this._els.viewwrap.hidden=!1,this._exitCrop(),this._requestRender(),this._drawThumbs(),this._notifyHistory(),this.onLoad?.({name:this.sourceName,width:this.bitmap.width,height:this.bitmap.height}),this}getRecipe(){return this.history?Sa(this.history.current):null}setTheme(t){this._els.root.setAttribute("data-kanvas-theme",t)}compare(t){if(this.bitmap&&this.history&&!this._cropMode)if(this._comparing=!!t,this._els.badge.hidden=!t,t){const t=this.history.current,e=ka({v:1,source:t.source,geometry:t.geometry?{...t.geometry}:void 0});this._requestRender(Object.freeze(e))}else this._requestRender()}async export(t={}){if(!this.bitmap||!this.history)throw new Error("KanvasEditor: no image loaded");const e=await async function(t,e,i={}){const n=i.format||"image/jpeg",o=void 0===i.quality?.92:i.quality,s=Pr(t,e,{maxSize:i.maxSize});return{blob:s.convertToBlob?await s.convertToBlob({type:n,quality:o}):await new Promise((t=>s.toBlob(t,n,o))),width:s.width,height:s.height,recipe:e}}(this.bitmap,this.history.current,t),i=await new Promise((t=>{const i=new FileReader;i.onload=()=>t(i.result),i.readAsDataURL(e.blob)}));return{blob:e.blob,dataUrl:i,recipe:Sa(this.history.current),width:e.width,height:e.height}}undo(){this.history?.canUndo&&(this._exitCrop(),this._exitRegionEdit(),this._syncUiFromRecipe(this.history.undo()),this._requestRender(),this._notifyHistory())}redo(){this.history?.canRedo&&(this._exitCrop(),this._exitRegionEdit(),this._syncUiFromRecipe(this.history.redo()),this._requestRender(),this._notifyHistory())}reset(){this.bitmap&&this.history&&(this._exitCrop(),this._exitRegionEdit(),this._resetZoom(),this._syncUiFromRecipe(this.history.push(xa(this.bitmap.width,this.bitmap.height))),this._requestRender(),this._notifyHistory())}destroy(){document.removeEventListener("keydown",this._onKey),document.removeEventListener("keyup",this._onKeyUp),this._resizeObs?.disconnect(),this._els.root.remove(),this.bitmap=null,this.history=null}saveLook(t){if(!this.history)return null;const e=function(t,e){const i={v:ma,kind:"look",name:String(t||"")};return e.adjust&&Object.keys(e.adjust).length&&(i.adjust=wa(e.adjust)),e.effects&&e.effects.length&&(i.effects=wa(e.effects).map((t=>("grain"===t.type&&delete t.seed,t)))),va(i)}(t,this.history.current);return this._looks=[...this._looks.filter((t=>t.name!==e.name)),e],this._persistLooks(),this._renderLookChips?.(),e}applyLookNow(t){if(!this.bitmap||!this.history)return!1;try{const e=Aa(this.history.current,t);return this.history.push(e),this._syncUiFromRecipe(e),this._requestRender(),this.onChange?.(Sa(e)),this._notifyHistory(),!0}catch{return!1}}clearTreatment(){if(!this.bitmap||!this.history)return;this._exitRegionEdit();const t=this._ui;for(const e of gc)t[e.k]=e.d;t.temperature=0,t.tint=0,t.look="",t.motionFocus=null,t.radialRegion=null,t.lookName="",this._syncControls(),this._commit(),this._drawThumbs()}getLooks(){return[...this._looks]}removeLook(t){this._looks=this._looks.filter((e=>e.name!==t)),this._persistLooks(),this._renderLookChips?.()}_persistLooks(){if(this.onLooksChange)this.onLooksChange(this.getLooks());else try{localStorage.setItem("kanvas.looks",JSON.stringify(this._looks))}catch{}}async _clipboard(t){try{return await navigator.clipboard.writeText(t),!0}catch{return!1}}copyEdits(){return this.getRecipe()}applyEdits(t){if(!this.bitmap||!this.history)return!1;const e=_a(t);if(!e)return!1;const i=ka({...JSON.parse(Sa(e)),source:{w:this.bitmap.width,h:this.bitmap.height}});return Object.freeze(i),this.history.push(i),this._syncUiFromRecipe(i),this._requestRender(),this.onChange?.(Sa(i)),this._notifyHistory(),!0}static async loadBitmap(t,e=(t=>t)){if("undefined"!=typeof ImageBitmap&&t instanceof ImageBitmap)return t;if(t instanceof Blob)return createImageBitmap(t);const i="string"==typeof t?t:t instanceof HTMLImageElement?t.currentSrc||t.src:null;if(!i)throw new Error("KanvasEditor: unsupported source");if(i.startsWith("data:")||i.startsWith("blob:")){const t=await(await fetch(i)).blob();return createImageBitmap(t)}const n=new Image;return n.crossOrigin="anonymous",await new Promise(((t,o)=>{n.onload=t,n.onerror=()=>o(new Error(e("Could not load the image.")+" "+i+" — "+e("For images on another domain the server must send CORS headers (Access-Control-Allow-Origin), or editing and export are blocked by the browser."))),n.src=i})),createImageBitmap(n)}static open(t){return new Promise(((e,i)=>{const n=lc("div","kanvas-modal-backdrop",document.body);let o=!1;const s=t=>{o||(o=!0,l.destroy(),n.remove(),e(t))},l=new mc({container:n,theme:t.theme,title:t.title,header:!0,onCancel:()=>s(null),onApply:async e=>{try{if(t.upload){l._setBusy(l.t("Saving…"));const i=await t.upload(e.blob,{recipe:e.recipe,width:e.width,height:e.height});e.url="string"==typeof i?i:i?.url}s(e)}catch(t){l._setBusy(null),i(t),s(null)}}});n.addEventListener("pointerdown",(t=>{t.target===n&&s(null)})),l._exportOpts=t.export||{},l.load(t.src,{recipe:t.recipe}).catch((t=>{setTimeout((()=>s(null)),2200),i(t)}))}))}_defaultUiState(){const t={rotate90:0,flipH:!1,flipV:!1,straighten:0,crop:null,temperature:0,tint:0,look:"",lookName:"",motionFocus:null,radialRegion:null,grainSeed:Math.floor(4294967295*Math.random())};for(const e of gc)t[e.k]=e.d;return t}_buildRecipe(){const t=this._ui,e=this.bitmap,i={v:1,source:{w:e.width,h:e.height}},n={};t.rotate90&&(n.rotate90=t.rotate90),t.flipH&&(n.flipH=!0),t.flipV&&(n.flipV=!0),t.straighten&&(n.straighten=t.straighten),t.crop&&(n.crop={...t.crop}),Object.keys(n).length&&(i.geometry=n);const o={};for(const e of["exposure","contrast","highlights","shadows","saturation","clarity","sharpen","temperature","tint"])t[e]&&(o[e]=t[e]);Object.keys(o).length&&(i.adjust=o),t.lookName&&(i.meta={look:t.lookName});const s=[];if(t.radialRegion&&t.radialAmount&&s.push({type:"radial",...t.radialRegion,feather:t.radialFeather/100,exposure:t.radialAmount}),t.look&&s.push({type:"lut",lut:t.look,intensity:t.lookInt/100}),t.motion){const e={type:"blur-linear",angle:t.motionAngle,amount:t.motion/100*.06};t.motionFocus&&(e.focus={...t.motionFocus,feather:t.motionFeather/100}),s.push(e)}return t.halation&&s.push({type:"halation",amount:t.halation/100}),t.grain&&s.push({type:"grain",amount:t.grain/100*.6,size:t.grainSize/100,seed:t.grainSeed}),s.length&&(i.effects=s),Object.freeze(ka(i))}_syncUiFromRecipe(t){const e=this._ui,i=t.geometry||{},n=t.adjust||{},o=t.effects||[];e.rotate90=i.rotate90||0,e.flipH=!!i.flipH,e.flipV=!!i.flipV,e.straighten=i.straighten||0,e.crop=i.crop?{...i.crop}:null;for(const t of["exposure","contrast","highlights","shadows","saturation","clarity","sharpen","temperature","tint"])e[t]=n[t]||0;e.lookName=t.meta?.look||"";const s=o.find((t=>"lut"===t.type));e.look=s?s.lut:"",e.lookInt=s?Math.round(100*(s.intensity??1)):80;const l=o.find((t=>"grain"===t.type));e.grain=l?Math.round(l.amount/.6*100):0,e.grainSize=l?Math.round(100*(l.size??.5)):50,void 0!==l?.seed&&(e.grainSeed=l.seed);const a=o.find((t=>"halation"===t.type));e.halation=a?Math.round(100*a.amount):0;const r=o.find((t=>"blur-linear"===t.type));e.motion=r?Math.round(r.amount/.06*100):0,e.motionAngle=r&&r.angle||0,r?.focus?(e.motionFocus={cx:r.focus.cx??.5,cy:r.focus.cy??.5,radius:r.focus.radius??.25},e.motionFeather=Math.round(100*(r.focus.feather??.5))):(e.motionFocus=null,e.motionFeather=50);const c=o.find((t=>"radial"===t.type));c?(e.radialRegion={cx:c.cx??.5,cy:c.cy??.5,radius:c.radius??.25},e.radialAmount=Math.round(c.exposure??0),e.radialFeather=Math.round(100*(c.feather??.5))):(e.radialRegion=null,e.radialAmount=0,e.radialFeather=50),"focus"!==this._regionEdit||e.motionFocus||this._exitRegionEdit(),"radial"!==this._regionEdit||e.radialRegion||this._exitRegionEdit(),this._syncControls()}_commit(){if(!this.bitmap||!this.history)return;const t=this._buildRecipe();Sa(t)!==Sa(this.history.current)&&(this.history.push(t),this.onChange?.(Sa(t)),this._notifyHistory()),this._requestRender()}_preview(){this._requestRender(this._buildRecipe())}_notifyHistory(){this._renderLookChips?.(),this.onHistory?.({canUndo:!!this.history?.canUndo,canRedo:!!this.history?.canRedo})}_requestRender(t){this._renderQueued||(this._renderQueued=!0,requestAnimationFrame((()=>{if(this._renderQueued=!1,!this.bitmap||!this.history)return;let e=t||this.history.current;if(this._cropMode){const t=e.geometry?{...e.geometry}:{};delete t.crop,e=ka({...JSON.parse(Sa(e)),geometry:Object.keys(t).length?t:void 0})}const i=Ra({w:this.bitmap.width,h:this.bitmap.height},e.geometry||{});this._fullOut={w:i.outW,h:i.outH};const n=this._userScale?Math.min(4096,Math.max(i.outW,i.outH)):this.maxPreview,o=Pr(this.bitmap,e,{maxSize:n}),s=this._els.view;if(s.width=o.width,s.height=o.height,s.getContext("2d")?.drawImage(o,0,0),this._fitView(),this._cropMode){const t=this._els.overlay;t.width=o.width,t.height=o.height,this._cropper.draw()}this._regionEdit&&this._drawRegionOverlay()})))}_resetZoom(){this._userScale=null,this._pan={x:0,y:0}}_setZoom(t,e,i){const n=this._els.view.getBoundingClientRect(),o=this._userScale??this._fitScale;let s=Math.min(8,Math.max(this._fitScale,t));const l=null===this._userScale,a=e-(n.left+n.width/2),r=i-(n.top+n.height/2);this._pan.x=this._pan.x+a*(1-s/o),this._pan.y=this._pan.y+r*(1-s/o),s<=1.02*this._fitScale?(this._userScale=null,this._pan={x:0,y:0}):this._userScale=s;const c=null===this._userScale;this._fitView(),l!==c&&this._requestRender()}_fitView(){const t=this._els.stage,e=this._els.view;if(!e.width||!e.height)return;const i=Math.max(50,t.clientWidth-36),n=Math.max(50,t.clientHeight-36-52),o=this._fullOut||{w:e.width,h:e.height},s=Math.min(i/e.width,n/e.height,1);this._fitScale=s*e.width/o.w;const l=this._userScale??this._fitScale,a=l*o.w/e.width,r=e.width*a,c=e.height*a,u=Math.max(0,(r-i)/2+24),d=Math.max(0,(c-n)/2+24);this._pan.x=Math.min(u,Math.max(-u,this._pan.x)),this._pan.y=Math.min(d,Math.max(-d,this._pan.y)),this._els.viewwrap.style.transform=`translate(${Math.round(this._pan.x)}px, ${Math.round(this._pan.y)}px)`,e.style.width=Math.round(r)+"px",e.style.height=Math.round(c)+"px",e.style.imageRendering=l>1.5?"pixelated":"auto",e.style.cursor=this._cropMode?"":this._userScale?"grab":"",this._els.zoomChip&&(this._els.zoomChip.textContent=this._userScale?Math.round(100*l)+"%":this.t("Fit"),this._els.zoomChip.hidden=!this.bitmap),e.style.maxWidth="none",e.style.maxHeight="none",e.style.minWidth="0",e.style.minHeight="0";const h=this._els.overlay;h.style.maxWidth="none",h.style.maxHeight="none"}_thumbBase(){if(!this.bitmap)return null;if(this._thumbSrc)return this._thumbSrc;const t=120,e=document.createElement("canvas");e.width=t,e.height=84;const i=e.getContext("2d"),n=Math.max(t/this.bitmap.width,84/this.bitmap.height);return i.drawImage(this.bitmap,(t-this.bitmap.width*n)/2,(84-this.bitmap.height*n)/2,this.bitmap.width*n,this.bitmap.height*n),this._thumbSrc=i.getImageData(0,0,t,84),this._thumbSrc}_drawThumb(t){const e=this._thumbs[t.id],i=this._thumbBase();if(!e||!i)return;const n=new ImageData(new Uint8ClampedArray(i.data),i.width,i.height),o=t.id?kr(t.id):null;o&&Ua(n,o,.9),e.classList.toggle("kanvas-pending",!!t.id&&!o),e.getContext("2d")?.putImageData(n,0,0)}_drawThumbs(){if(this.bitmap){this._thumbSrc=null;for(const t of this._visibleEntries())this._drawThumb(t)}}_setBusy(t){this._els.busy.hidden=!t,t&&(this._els.busy.textContent=t)}_toast(t){const e=this._els.toast;e.textContent=t,e.classList.add("kanvas-on"),clearTimeout(this._toastTimer),this._toastTimer=window.setTimeout((()=>e.classList.remove("kanvas-on")),2e3)}_build(t){this._els={};const e=this._els.root=lc("div","kanvas-editor",t),i=this._els.header=lc("div","kanvas-header",e);this._els.title=lc("span","kanvas-title",i),this._els.title.textContent=this.t("Edit image");const n=lc("button","kanvas-btn",i);n.textContent=this.t("Cancel"),n.addEventListener("click",(()=>this.onCancel?.()));const o=lc("button","kanvas-btn kanvas-solid",i);o.textContent=this.t("OK"),o.addEventListener("click",(async()=>{if(this.bitmap){o.setAttribute("disabled",""),this._setBusy(this.t("Rendering…"));try{const t=await this.export(this._exportOpts);this._setBusy(null),this.onApply?.(t)}finally{o.removeAttribute("disabled")}}else this.onCancel?.()}));const s=lc("div","kanvas-body",e);this._buildStage(s),this._buildPanel(s),this._onKey=t=>{if(this._regionEdit&&("Escape"===t.key||"Enter"===t.key))return t.preventDefault(),this._exitRegionEdit(),void this._requestRender();this._cropMode&&"Enter"===t.key&&(t.preventDefault(),this._applyCrop()),this._cropMode&&"Escape"===t.key&&(t.preventDefault(),this._exitCrop(),this._requestRender()),"\\"!==t.key||t.repeat||this.compare(!0),(t.ctrlKey||t.metaKey)&&"z"===t.key.toLowerCase()&&(t.preventDefault(),t.shiftKey?this.redo():this.undo())},this._onKeyUp=t=>{"\\"===t.key&&this.compare(!1)},document.addEventListener("keydown",this._onKey),document.addEventListener("keyup",this._onKeyUp)}_buildStage(t){const e=this._els.stage=lc("div","kanvas-stage",t),i=this._els.viewwrap=lc("div","kanvas-viewwrap",e);i.hidden=!0;const n=this._els.view=lc("canvas","kanvas-view",i);(this._els.overlay=lc("canvas","kanvas-overlay",i)).hidden=!0;const o=this._els.empty=lc("div","kanvas-empty",e);lc("h2","",o).textContent=this.t("Click or drop an image to start");lc("p","",o).textContent=this.t("Crop it, set white balance, adjust, pick a look, then save the result.");const s=lc("button","kanvas-btn kanvas-solid",o);s.textContent=this.t("Open image");const l=lc("input","",e);l.type="file",l.accept="image/*",l.hidden=!0,s.addEventListener("click",(()=>l.click())),l.addEventListener("change",(()=>{l.files?.[0]&&this.load(l.files[0])})),this._els.file=l;for(const t of["dragenter","dragover"])e.addEventListener(t,(t=>{t.preventDefault(),e.classList.add("kanvas-dropping")}));for(const t of["dragleave","drop"])e.addEventListener(t,(t=>{t.preventDefault(),e.classList.remove("kanvas-dropping")}));e.addEventListener("drop",(t=>{const e=t.dataTransfer?.files?.[0];e&&this.load(e)})),this._resizeObs=new ResizeObserver((()=>this._fitView())),this._resizeObs.observe(e);const a=this._els.badge=lc("div","kanvas-compare-badge",e);a.textContent=this.t("original"),a.hidden=!0;(this._els.busy=lc("div","kanvas-busy",e)).hidden=!0,this._els.toast=lc("div","kanvas-toast",e);(this._els.overlay2=lc("canvas","kanvas-overlay kanvas-overlay2",i)).hidden=!0;const r=this._els.zoomChip=lc("button","kanvas-zoom",e);r.textContent=this.t("Fit"),r.hidden=!0,r.title=this.t("Click: toggle 100% / fit. Wheel on the photo zooms, drag pans."),r.addEventListener("click",(()=>{if(!this.bitmap)return;const t=n.getBoundingClientRect();this._userScale?(this._resetZoom(),this._fitView(),this._requestRender()):this._setZoom(1,t.left+t.width/2,t.top+t.height/2)})),e.addEventListener("wheel",(t=>{if(!this.bitmap)return;t.preventDefault();const e=this._userScale??this._fitScale;this._setZoom(e*Math.exp(.0016*-t.deltaY),t.clientX,t.clientY)}),{passive:!1}),n.addEventListener("dblclick",(t=>{this.bitmap&&(this._userScale?(this._resetZoom(),this._fitView(),this._requestRender()):this._setZoom(1,t.clientX,t.clientY))}));let c=null;n.addEventListener("pointerdown",(t=>{this._cropMode||(this._userScale?(c={x:t.clientX,y:t.clientY},n.setPointerCapture(t.pointerId),n.style.cursor="grabbing"):this.compare(!0))})),n.addEventListener("pointermove",(t=>{c&&(this._pan.x+=t.clientX-c.x,this._pan.y+=t.clientY-c.y,c={x:t.clientX,y:t.clientY},this._fitView())}));const u=()=>{c?(c=null,n.style.cursor="grab"):this._comparing&&this.compare(!1)};n.addEventListener("pointerup",u),n.addEventListener("pointerleave",u),this._buildRegionOverlay(),this._buildTools(e)}_buildTools(t){const e=this._els.tools=lc("div","kanvas-tools",t);e.hidden=!0;const i=this._els.cropBtn=lc("button","",e);i.innerHTML=rc+this.t("Crop"),i.setAttribute("aria-pressed","false");const n=this._els.cropSet=lc("span","kanvas-cropset",e),o=this._els.aspectSel=lc("select","kanvas-sel",n);o.setAttribute("aria-label",this.t("Aspect ratio"));for(const t of this.aspectPresets){const e=lc("option","",o);e.value=t,e.textContent="free"===t?this.t("Free"):t}const s=lc("button","kanvas-apply",n);s.textContent=this.t("Apply");const l=lc("button","",n);l.textContent=this.t("Cancel");const a=this._els.cropClear=lc("button","",n);a.textContent=this.t("Clear"),a.hidden=!0,lc("span","kanvas-div",e);const r=lc("button","",e);r.innerHTML=cc+this.t("Rotate 90°");const c=this._els.flipH=lc("button","",e);c.innerHTML=uc+this.t("Flip H"),c.setAttribute("aria-pressed","false");const u=this._els.flipV=lc("button","",e);u.innerHTML=dc+this.t("Flip V"),u.setAttribute("aria-pressed","false"),lc("span","kanvas-div",e);const d=lc("span","kanvas-straight",e);d.append(this.t("Straighten"));const h=lc("span","kanvas-strack",d);lc("span","kanvas-bar",h),lc("span","kanvas-tick",h);const b=lc("span","kanvas-fill",h),p=lc("input","",h);p.type="range",p.min="-15",p.max="15",p.step="0.1",p.value="0",p.setAttribute("aria-label",this.t("Straighten"));const g=lc("b","",d);g.textContent="0";const m=()=>{const t=this._ui.straighten;g.textContent=(t>0?"+":"")+t.toFixed(1).replace(/\.0$/,"");const e=(t+15)/30*100;b.style.left=Math.min(50,e)+"%",b.style.width=Math.abs(e-50)+"%"};this._strUI=m,this._strInput=p,p.addEventListener("input",(()=>{this._ui.straighten=parseFloat(p.value),m(),this.bitmap&&this._preview()})),p.addEventListener("change",(()=>{this.bitmap&&this._commit()})),this._cropper=new sc(this._els.overlay,(()=>{})),i.addEventListener("click",(()=>this._cropMode?(this._exitCrop(),this._requestRender()):this._enterCrop())),s.addEventListener("click",(()=>this._applyCrop())),l.addEventListener("click",(()=>{this._exitCrop(),this._requestRender()})),a.addEventListener("click",(()=>{this._ui.crop=null,this._exitCrop(),this._commit()})),o.addEventListener("change",(()=>{if(!this._cropMode)return;const t=qa(o.value),e=this._els.overlay;if(t&&this._cropper.rect&&this._cropper.rect.w>=e.width-1&&this._cropper.rect.h>=e.height-1){const i=function(t,e,i){if(!t||t<=0)return{x:0,y:0,w:1,h:1};const n=e/i;let o,s;return t>n?(o=1,s=n/t):(s=1,o=t/n),{x:(1-o)/2,y:(1-s)/2,w:o,h:s}}(t,e.width,e.height);this._cropper.setRect({x:i.x*e.width,y:i.y*e.height,w:i.w*e.width,h:i.h*e.height})}this._cropper.setAspect(t)})),r.addEventListener("click",(()=>{var t;this._exitCrop(),this._exitRegionEdit(),this._resetZoom(),this._ui.rotate90=(this._ui.rotate90+1)%4,this._ui.crop=(t=this._ui.crop)?{...t,x:1-(t.y+t.h),y:t.x,w:t.h,h:t.w,aspect:Ia(t.aspect)}:t,this.bitmap&&(this._commit(),this._drawThumbs()),this._syncControls()})),c.addEventListener("click",(()=>{var t;this._exitCrop(),this._ui.flipH=!this._ui.flipH,this._ui.crop=(t=this._ui.crop)?{...t,x:1-(t.x+t.w)}:t,this.bitmap&&this._commit(),this._syncControls()})),u.addEventListener("click",(()=>{var t;this._exitCrop(),this._ui.flipV=!this._ui.flipV,this._ui.crop=(t=this._ui.crop)?{...t,y:1-(t.y+t.h)}:t,this.bitmap&&this._commit(),this._syncControls()}))}_region(){return"focus"===this._regionEdit?this._ui.motionFocus:"radial"===this._regionEdit?this._ui.radialRegion:null}_regionFeather(){return("radial"===this._regionEdit?this._ui.radialFeather:this._ui.motionFeather)/100}_buildRegionOverlay(){const t=this._els.overlay2;let e=null;const i=e=>{const i=t.getBoundingClientRect();return{x:(e.clientX-i.left)*(t.width/i.width),y:(e.clientY-i.top)*(t.height/i.height)}},n=()=>{const e=this._region();return e&&{cx:e.cx*t.width,cy:e.cy*t.height,r:e.radius*Math.min(t.width,t.height)}};t.addEventListener("pointerdown",(o=>{const s=n();if(!s)return;const l=i(o),a=Math.hypot(l.x-s.cx,l.y-s.cy);e={kind:Math.abs(a-s.r)<16?"resize":"move"},t.setPointerCapture(o.pointerId),"move"===e.kind&&this._regionMoveTo(l),o.preventDefault()})),t.addEventListener("pointermove",(o=>{const s=n();if(!s)return;const l=i(o);if(e)if("move"===e.kind)this._regionMoveTo(l);else{const e=this._region();e.radius=Math.min(.9,Math.max(.04,Math.hypot(l.x-e.cx*t.width,l.y-e.cy*t.height)/Math.min(t.width,t.height))),this._drawRegionOverlay(),this._preview()}else{const e=Math.hypot(l.x-s.cx,l.y-s.cy);t.style.cursor=Math.abs(e-s.r)<16?"ew-resize":"move"}}));const o=()=>{e&&(e=null,this._commit())};t.addEventListener("pointerup",o),t.addEventListener("pointercancel",o)}_regionMoveTo(t){const e=this._els.overlay2,i=this._region();i&&(i.cx=Math.min(1,Math.max(0,t.x/e.width)),i.cy=Math.min(1,Math.max(0,t.y/e.height)),this._drawRegionOverlay(),this._preview())}_drawRegionOverlay(){if(!this._regionEdit)return;const t=this._els.overlay2,e=this._els.view;t.width===e.width&&t.height===e.height||(t.width=e.width,t.height=e.height);const i=t.getContext("2d"),n=this._region();if(!i||!n)return;const o=t.width,s=t.height,l=n.cx*o,a=n.cy*s,r=n.radius*Math.min(o,s),c=r*(1+2*this._regionFeather()),u=Math.max(1,o/700);if(i.clearRect(0,0,o,s),i.strokeStyle="rgba(255,255,255,0.95)",i.lineWidth=1.6*u,i.shadowColor="rgba(0,0,0,0.45)",i.shadowBlur=3*u,i.beginPath(),i.arc(l,a,r,0,2*Math.PI),i.stroke(),i.setLineDash([5*u,5*u]),i.lineWidth=u,i.strokeStyle="rgba(255,255,255,0.6)",i.beginPath(),i.arc(l,a,c,0,2*Math.PI),i.stroke(),i.setLineDash([]),i.shadowBlur=0,i.fillStyle="rgba(255,255,255,0.95)",i.beginPath(),i.arc(l,a,3*u,0,2*Math.PI),i.fill(),"radial"===this._regionEdit){const t=this._ui.radialAmount;t&&(i.font=`${Math.max(11,11*u)}px system-ui, sans-serif`,i.fillStyle="rgba(255,255,255,0.9)",i.textAlign="center",i.fillText((t>0?"+":"")+t,l,a-8*u))}}_enterRegionEdit(t){this.bitmap&&this._regionEdit!==t&&(this._exitCrop(),"focus"!==t||this._ui.motionFocus||(this._ui.motionFocus={cx:.5,cy:.4,radius:.25},this._ui.motion||(this._ui.motion=35)),"radial"!==t||this._ui.radialRegion||(this._ui.radialRegion={cx:.5,cy:.45,radius:.22},this._ui.radialAmount||(this._ui.radialAmount=30)),this._regionEdit=t,this._els.overlay2.hidden=!1,this._syncControls(),this._commit(),requestAnimationFrame((()=>this._drawRegionOverlay())))}_exitRegionEdit(){this._regionEdit&&(this._regionEdit=null,this._els.overlay2.hidden=!0,this._syncRegionUi())}_syncRegionUi(){const t=!!this._ui.motionFocus;this._els.focusBtn?.setAttribute("aria-pressed",String("focus"===this._regionEdit)),this._els.focusRemove&&(this._els.focusRemove.hidden=!t);const e=this._ctl.motionFeather;e&&(e.el.style.display=t?"":"none");const i=!!this._ui.radialRegion;this._els.radialBtn?.setAttribute("aria-pressed",String("radial"===this._regionEdit)),this._els.radialRemove&&(this._els.radialRemove.hidden=!i);for(const t of["radialAmount","radialFeather"]){const e=this._ctl[t];e&&(e.el.style.display=i?"":"none")}}_buildPanel(t){const e=lc("div","kanvas-panel",t),i=lc("div","kanvas-tabs",e);i.setAttribute("role","tablist");const n={};this._dots={};for(const[t,e]of[["adjust","Adjust"],["fx","Effects"]]){const o=lc("button","",i);o.setAttribute("role","tab"),o.setAttribute("aria-selected","adjust"===t?"true":"false"),o.append(this.t(e)),this._dots[t]=lc("i","kanvas-dot",o),o.addEventListener("click",(()=>{for(const t of i.children)t.setAttribute("aria-selected",t===o?"true":"false");for(const[e,i]of Object.entries(n))i.classList.toggle("kanvas-on",e===t)}))}const o=n.adjust=lc("div","kanvas-pane kanvas-on",e);lc("p","kanvas-grp",o).textContent=this.t("White balance"),this._buildWbPad(o);lc("p","kanvas-grp kanvas-mt",o).textContent=this.t("Adjust");const s=lc("div","",o),l=n.fx=lc("div","kanvas-pane",e);lc("p","kanvas-grp",l).textContent=this.t("Look"),this._buildReel(l);const a=lc("div","",l);this._myLooks&&this._buildMyLooks(l,a);lc("p","kanvas-grp kanvas-mt",l).textContent=this.t("Effects");const r=lc("div","",l);lc("p","kanvas-hint",l).innerHTML=this.t("Hold the backslash key or press-and-hold the photo to see the original.")+" "+this.t("Wheel zooms to real pixels, drag pans, double-click toggles 100%.")+" "+this.t("Double-click a control name to reset it.")+" "+this.t("Enter applies a crop, Esc cancels, Ctrl+Z undoes.");const c={adjust:s,look:a,fx:r};for(const t of gc)this._buildSlider(c[t.t],t);const u=lc("div","kanvas-focusrow",r);r.insertBefore(u,this._ctl.motionFeather.el);const d=this._els.focusBtn=lc("button","kanvas-btn",u);d.textContent=this.t("Focus area"),d.setAttribute("aria-pressed","false"),d.title=this.t("Keep a region sharp while the rest streaks — drag it on the photo"),d.addEventListener("click",(()=>"focus"===this._regionEdit?(this._exitRegionEdit(),this._requestRender()):this._enterRegionEdit("focus")));const h=this._els.focusRemove=lc("button","kanvas-btn",u);h.textContent=this.t("Remove"),h.hidden=!0,h.addEventListener("click",(()=>{this._ui.motionFocus=null,this._exitRegionEdit(),this._commit(),this._syncControls()}));const b=this._els.radialGrp=lc("p","kanvas-grp kanvas-mt",s);b.textContent=this.t("Local light"),s.insertBefore(b,this._ctl.radialAmount.el);const p=lc("div","kanvas-focusrow",s);s.insertBefore(p,this._ctl.radialAmount.el);const g=this._els.radialBtn=lc("button","kanvas-btn",p);g.textContent=this.t("Radial light"),g.setAttribute("aria-pressed","false"),g.title=this.t("Brighten or darken one area — drag the circle on the photo"),g.addEventListener("click",(()=>"radial"===this._regionEdit?(this._exitRegionEdit(),this._requestRender()):this._enterRegionEdit("radial")));const m=this._els.radialRemove=lc("button","kanvas-btn",p);m.textContent=this.t("Remove"),m.hidden=!0,m.addEventListener("click",(()=>{this._ui.radialRegion=null,this._ui.radialAmount=0,this._exitRegionEdit(),this._commit(),this._syncControls()})),this._syncRegionUi()}_buildMyLooks(t,e){lc("p","kanvas-grp kanvas-mt",t).textContent=this.t("My looks");const i=lc("div","kanvas-chips",t),n=lc("div","kanvas-focusrow",t),o=lc("button","kanvas-btn",n);o.textContent=this.t("Save look…"),o.title=this.t("Save the current treatment (color + effects) for reuse");const s=lc("button","kanvas-btn",n);s.textContent=this.t("Import…"),s.title=this.t("Paste a shared look string");const l=lc("div","kanvas-inline-form",t);l.hidden=!0;const a=lc("input","kanvas-field",l),r=lc("button","kanvas-btn kanvas-solid",l);r.textContent=this.t("OK");const c=lc("button","kanvas-btn",l);c.textContent=this.t("Cancel");let u=null;const d=(t,e,i)=>{u=t,a.placeholder=e,a.value=i||"",l.hidden=!1,a.focus(),a.select()},h=()=>{l.hidden=!0,u=null};c.addEventListener("click",h),a.addEventListener("keydown",(t=>{"Enter"===t.key&&(t.preventDefault(),r.click()),"Escape"===t.key&&(t.preventDefault(),h()),t.stopPropagation()})),r.addEventListener("click",(()=>{const t=a.value.trim();if(t){if("save"===u)this.saveLook(t),this._toast(this.t("Look saved"));else if("import"===u){const e=Ta(t);if(!e)return void this._toast(this.t("Not a valid look string"));this._looks=[...this._looks.filter((t=>t.name!==e.name)),e],this._persistLooks(),this._renderLookChips(),this.bitmap&&this.applyLookNow(e),this._toast(this.t("Look added"))}h()}})),o.addEventListener("click",(()=>{this.bitmap?d("save",this.t("Name this look"),this.t("Look")+" "+(this._looks.length+1)):this._toast(this.t("Open an image first"))})),s.addEventListener("click",(()=>d("import","kanvas-look:…",""))),this._renderLookChips=()=>{if(i.textContent="",!this._looks.length){return void(lc("span","kanvas-chips-empty",i).textContent=this.t("Nothing saved yet."))}const t=this.history?.current?.meta?.look;for(const e of this._looks){const n=!!e.name&&e.name===t,o=lc("span","kanvas-chip",i),s=lc("button","kanvas-chip-name",o);s.textContent=e.name||this.t("Look"),s.setAttribute("aria-pressed",String(n)),s.title=n?this.t("This look is on the photo — click to take it back off"):this.t("Apply this look"),s.addEventListener("click",(()=>{if(this.bitmap)return n?(this.clearTreatment(),void this._toast(this.t("Look removed — crop and framing kept"))):void(this.applyLookNow(e)?this._toast(this.t("Look applied")):this._toast(this.t("Could not apply this look")));this._toast(this.t("Open an image first"))}));const l=lc("button","kanvas-chip-icon",o);l.textContent="⧉",l.title=this.t("Copy shareable string"),l.addEventListener("click",(async()=>{await this._clipboard(La(e))?this._toast(this.t("Look string copied — share it anywhere")):this._toast(this.t("Clipboard blocked by the browser"))}));const a=lc("button","kanvas-chip-icon",o);a.textContent="×",a.title=this.t("Remove"),a.addEventListener("click",(()=>{this.removeLook(e.name),this._toast(this.t("Look removed"))}))}},this._renderLookChips()}_buildSlider(t,e){const i=lc("div","kanvas-ctl",t),n=lc("div","kanvas-top",i),o=lc("label","",n);o.textContent=this.t(e.n);const s=lc("span","kanvas-val",n),l=lc("div","kanvas-track",i);lc("span","kanvas-bar",l);const a=lc("span","kanvas-tick",l),r=lc("span","kanvas-fill",l),c=lc("input","",l);c.type="range",c.min=String(e.min),c.max=String(e.max),c.step="1",c.value=String(e.d),c.setAttribute("aria-label",this.t(e.n)),this._ctl[e.k]={el:i,inp:c,val:s,fill:r,tick:a,def:e},c.addEventListener("input",(()=>{this._ui[e.k]=+c.value,this._syncSlider(e.k),("motionFeather"===e.k&&"focus"===this._regionEdit||("radialFeather"===e.k||"radialAmount"===e.k)&&"radial"===this._regionEdit)&&this._drawRegionOverlay(),this.bitmap&&this._preview()})),c.addEventListener("change",(()=>{this.bitmap&&this._commit()})),o.addEventListener("dblclick",(()=>{this._ui[e.k]=e.d,c.value=String(e.d),this._syncSlider(e.k),this.bitmap&&this._commit()})),this._syncSlider(e.k)}_syncSlider(t){const e=this._ctl[t];if(!e)return;const{min:i,max:n,d:o}=e.def,s=this._ui[t],l=i<0,a=l?50:0,r=(s-i)/(n-i)*100;e.tick.style.display=l?"block":"none",e.tick.style.left=a+"%";const c=Math.min(a,r),u=Math.max(a,r);e.fill.style.left=c+"%",e.fill.style.width=u-c+"%",e.val.textContent=(l&&s>0?"+":"")+s,e.el.classList.toggle("kanvas-dirty",s!==o),this._syncDots()}_syncDots(){const t={adjust:!1,fx:!1};for(const e of gc)("motionFeather"!==e.k||this._ui.motionFocus)&&("radialAmount"!==e.k&&"radialFeather"!==e.k||this._ui.radialRegion)&&"look"!==e.g&&this._ui[e.k]!==e.d&&(t[e.g]=!0);this._ui.motionFocus&&(t.fx=!0),this._ui.radialRegion&&(t.adjust=!0),0===this._ui.temperature&&0===this._ui.tint||(t.adjust=!0);for(const[e,i]of Object.entries(this._dots||{}))i.classList.toggle("kanvas-on",!!t[e])}_buildWbPad(t){const e=lc("div","kanvas-pad",t);lc("span","kanvas-cx",e),lc("span","kanvas-cy",e);const i=this._els.knob=lc("span","kanvas-knob",e);i.style.left="50%",i.style.top="50%";const n=lc("div","kanvas-wbrow",t),o=lc("div","kanvas-rd",n);lc("span","",o).textContent=this.t("Temp"),this._els.wbT=lc("b","",o);const s=lc("div","kanvas-rd",n);lc("span","",s).textContent=this.t("Tint"),this._els.wbN=lc("b","",s);const l=lc("button","kanvas-btn",n);l.textContent=this.t("Reset"),l.addEventListener("click",(()=>{this._ui.temperature=0,this._ui.tint=0,this._syncWb(),this.bitmap&&this._commit()}));let a=!1;const r=(t,i)=>{const n=e.getBoundingClientRect(),o=Math.min(1,Math.max(0,(t.clientX-n.left)/n.width)),s=Math.min(1,Math.max(0,(t.clientY-n.top)/n.height));this._ui.temperature=Math.round(200*(o-.5)),this._ui.tint=Math.round(200*(.5-s)),this._syncWb(),this.bitmap&&(i?this._commit():this._preview())};e.addEventListener("pointerdown",(t=>{a=!0,e.setPointerCapture(t.pointerId),r(t,!1)})),e.addEventListener("pointermove",(t=>{a&&r(t,!1)})),e.addEventListener("pointerup",(t=>{a&&(a=!1,r(t,!0))})),this._syncWb()}_syncWb(){const t=t=>(t>0?"+":"")+Math.round(t);this._els.wbT.textContent=t(this._ui.temperature),this._els.wbN.textContent=t(this._ui.tint),this._els.knob.style.left=50+this._ui.temperature/2+"%",this._els.knob.style.top=50-this._ui.tint/2+"%",this._syncDots()}_buildReel(t){if(this._els.cats=lc("div","kanvas-cats",t),this._els.reel=lc("div","kanvas-reel",t),this._rebuildReel(),!this._loadCube)return;const e=lc("div","kanvas-focusrow",t),i=lc("button","kanvas-btn",e);i.textContent=this.t("Load .cube…"),i.title=this.t("Add a standard 3D LUT file to the reel (this session)");const n=lc("input","",e);n.type="file",n.accept=".cube,.CUBE",n.hidden=!0,i.addEventListener("click",(()=>n.click())),n.addEventListener("change",(async()=>{const t=n.files?.[0];if(n.value="",t)try{const e=za(await t.text()),i=t.name.replace(/\.cube$/i,""),n="x-cube:"+i;xr(n,e),this._customLuts.some((t=>t.id===n))||this._customLuts.push({id:n,label:i,category:"Imported",intensity:80,state:"ready"}),this._cat="Imported",this._rebuildReel(),this._drawThumbs(),this._ui.look=n,this._syncLooks(),this.bitmap&&this._commit(),this._toast(this.t("LUT added to the reel (this session)"))}catch(t){this._toast(this.t("Not a valid .cube LUT:")+" "+t.message)}}))}_reelEntries(){return[...this._builtins?pc:[],...this._presets,...this._customLuts]}_categories(){const t=[];for(const e of this._reelEntries()){const i=e.category||"Other";t.includes(i)||t.push(i)}return t}_visibleEntries(){const t=this._cat;return[hc,...this._reelEntries().filter((e=>(e.category||"Other")===t))]}_rebuildReel(){const t=this._categories();this._cat&&t.includes(this._cat)||(this._cat=t[0]||null);const e=this._els.cats;e.textContent="",e.hidden=t.length<2;for(const i of t){const t=this._reelEntries().filter((t=>(t.category||"Other")===i&&t.id)).length,n=lc("button","kanvas-cat",e);n.setAttribute("aria-pressed",String(i===this._cat)),n.textContent=this.t(i);lc("span","kanvas-catn",n).textContent=String(t),n.addEventListener("click",(()=>{this._cat!==i&&(this._cat=i,this._rebuildReel(),this._drawThumbs())}))}const i=this._els.reel;i.textContent="",this._thumbObserver?.disconnect();for(const t of this._visibleEntries()){const e=lc("button","kanvas-look",i);e.dataset.id=t.id,e.setAttribute("aria-pressed",String(t.id===this._ui.look)),"error"===t.state&&(e.disabled=!0,e.title=this.t("Could not load this LUT")+" — "+t.error);const n=lc("canvas","",e);n.width=120,n.height=84;lc("span","",e).textContent=this.t(t.label),this._thumbs[t.id]=n,e.addEventListener("click",(async()=>{this._ui.look=t.id,this._ui.lookInt=t.id?t.intensity??80:80,this._syncLooks(),this._ctl.lookInt&&(this._ctl.lookInt.inp.value=String(this._ui.lookInt),this._syncSlider("lookInt")),t.id&&await Mr(t.id),this._drawThumb(t),this.bitmap&&this._commit()}))}this._observeThumbs()}_observeThumbs(){if("undefined"==typeof IntersectionObserver){for(const t of this._visibleEntries())this._loadThumb(t);return}const t=this._els.reel,e=new Map(this._visibleEntries().map((t=>[t.id,t])));this._thumbObserver=new IntersectionObserver(((t,i)=>{for(const n of t){if(!n.isIntersecting)continue;i.unobserve(n.target);const t=e.get(n.target.dataset.id||"");t&&this._loadThumb(t)}}),{root:t.closest(".kanvas-pane")||null,rootMargin:"200px"});for(const e of t.children)this._thumbObserver.observe(e)}async _loadThumb(t){if(t.id&&"ready"!==t.state)if(await Mr(t.id),"error"!==t.state)this._drawThumb(t);else{const e=this._els.reel?.querySelector(`[data-id="${CSS.escape(t.id)}"]`);e&&(e.disabled=!0,e.title=`Could not load this LUT — ${t.error}`)}else this._drawThumb(t)}_revealLook(){const t=this._ui.look;if(!t)return;const e=this._reelEntries().find((e=>e.id===t)),i=e&&(e.category||"Other");i&&i!==this._cat&&(this._cat=i,this._rebuildReel(),this._drawThumbs())}_syncLooks(){this._revealLook();for(const t of this._els.reel?.children||[])t.setAttribute("aria-pressed",String(t.dataset.id===this._ui.look))}_syncControls(){for(const t of gc)this._ctl[t.k].inp.value=String(this._ui[t.k]),this._syncSlider(t.k);this._syncWb(),this._syncLooks(),this._els.flipH.setAttribute("aria-pressed",String(this._ui.flipH)),this._els.flipV.setAttribute("aria-pressed",String(this._ui.flipV)),this._strInput.value=String(this._ui.straighten),this._strUI(),this._syncRegionUi()}_enterCrop(){this.bitmap&&!this._cropMode&&(this._exitRegionEdit(),this._cropMode=!0,this._els.cropBtn.setAttribute("aria-pressed","true"),this._els.cropSet.classList.add("kanvas-on"),this._els.cropClear.hidden=!this._ui.crop,this._els.overlay.hidden=!1,this._requestRender(),requestAnimationFrame((()=>{const t=this._els.overlay,e=this._els.aspectSel,i=this._ui;i.crop?(this._cropper.setRect({x:i.crop.x*t.width,y:i.crop.y*t.height,w:i.crop.w*t.width,h:i.crop.h*t.height}),e.value=i.crop.aspect&&this.aspectPresets.includes(i.crop.aspect)?i.crop.aspect:"free"):(this._cropper.setRect(null),e.value="free"),this._cropper.setAspect(qa(e.value))})))}_exitCrop(){this._cropMode&&(this._cropMode=!1,this._els.cropBtn.setAttribute("aria-pressed","false"),this._els.cropSet.classList.remove("kanvas-on"),this._els.overlay.hidden=!0)}_applyCrop(){if(!this._cropMode||!this._cropper.rect)return;const t=this._els.overlay,e=this._cropper.rect;e.x<1&&e.y<1&&e.w>t.width-2&&e.h>t.height-2?this._ui.crop=null:this._ui.crop={x:e.x/t.width,y:e.y/t.height,w:e.w/t.width,h:e.h/t.height,aspect:this._els.aspectSel.value},this._exitCrop(),this._commit()}}const fc=["free","1:1","4:3","3:4","3:2","2:3","16:9"],yc={jpg:"image/jpeg",jpeg:"image/jpeg",png:"image/png",webp:"image/webp"},vc='<svg class="cb-ike-i" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v18"/><path d="M4 6h5v12H4zM15 6h5v12h-5z"/></svg>',wc=t=>`<svg class="cb-ike-i" aria-hidden="true"><use xlink:href="#${t}"></use></svg>`;function xc(t,e){const i=t.builder,n=i.util,o=i.dom,s=i.builderStuff,l=i.activeImage;if(!l)return;if(i.onImageEditClick){if(!i.onImageEditClick(l))return}const a=t.kanvasState||(t.kanvasState={modal:null,editor:null});a.modal||(o.appendHtml(s,function(t,e){return`\n <div class="is-modal imageedit-kanvas" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="cb-ike-bar">\n <span class="cb-ike-spacer"></span>\n <button type="button" class="cb-ike-compare" title="${e.out("Hold to see the original")}">${vc}<span>${e.out("Compare")}</span></button>\n <span class="cb-ike-sep"></span>\n <span class="cb-ike-hist">\n <button type="button" class="cb-ike-undo" title="${e.out("Undo")}" aria-label="${e.out("Undo")}" disabled>${wc("icon-undo")}</button>\n <button type="button" class="cb-ike-redo" title="${e.out("Redo")}" aria-label="${e.out("Redo")}" disabled>${wc("icon-redo")}</button>\n <button type="button" class="cb-ike-reset" title="${e.out("Reset")}" aria-label="${e.out("Reset")}">${wc("icon-reload")}</button>\n </span>\n <button type="button" title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button type="button" title="${e.out("Apply")}" class="input-ok classic-primary">${e.out("Apply")}</button>\n </div>\n <div class="cb-ike-host"></div>\n </div>\n </div>`}(0,n)),a.modal=s.querySelector(".imageedit-kanvas"),function(t,e){const i=t.builder,n=i.util,o=i.dom,s=e.modal,l=s.querySelector(".cb-ike-compare"),a=()=>{o.addClass(l,"on"),e.editor&&e.editor.compare(!0)},r=()=>{o.removeClass(l,"on"),e.editor&&e.editor.compare(!1)};o.addEventListener(l,"pointerdown",a),o.addEventListener(l,"pointerup",r),o.addEventListener(l,"pointerleave",r),o.addEventListener(l,"keydown",(t=>{32!==t.which&&13!==t.which||a()})),o.addEventListener(l,"keyup",(t=>{32!==t.which&&13!==t.which||r()})),o.addEventListener(s.querySelector(".cb-ike-undo"),"click",(()=>e.editor&&e.editor.undo())),o.addEventListener(s.querySelector(".cb-ike-redo"),"click",(()=>e.editor&&e.editor.redo())),o.addEventListener(s.querySelector(".cb-ike-reset"),"click",(()=>e.editor&&e.editor.reset())),o.addEventListener(s.querySelector(".input-cancel"),"click",(()=>Cc(t,e))),o.addEventListener(s.querySelector(".input-ok"),"click",(async()=>{if(e.editor&&!e.saving){e.saving=!0,_c(e,!0);try{await async function(t,e){const i=t.builder,n=i.util,o=i.dom,s=i.activeImage;i.uo.saveForUndo();const{ext:l,mime:a}=function(t){let e="";const i=t.getAttribute("src")||"";if(-1===i.indexOf("base64")){const t=i.substring(i.lastIndexOf("/")+1).split("?")[0];e=t.substr(t.lastIndexOf(".")+1).toLowerCase()}else if(t.getAttribute("data-filename")){const i=t.getAttribute("data-filename");e=i.substr(i.lastIndexOf(".")+1).toLowerCase()}else{const t=i.match(/^data:image\/(.*?);base64,/);t&&(e=t[1].toLowerCase())}"jpe"===e&&(e="jpg");const n=yc[e];return n?{ext:e,mime:n}:{ext:"png",mime:"image/png"}}(s),r=i.opts.imageEditorQuality||.92,c=await e.editor.export({format:a,quality:r}),u=function(t,e,i,n){let o;const s=t.getAttribute("src")||"";if(-1===s.indexOf("base64")){const t=s.substring(s.lastIndexOf("/")+1).split("?")[0];o=n.baseName(t)}else o=t.getAttribute("data-filename")?n.baseName(t.getAttribute("data-filename")):i.makeId();-1!==o.indexOf("-edit")&&(o=o.substr(0,o.indexOf("-edit")));let l=o+"-edit"+i.makeId();return l=l.replaceAll("%20","-"),l+"."+e}(s,l,n,o),d=i.onImageUpload||i.opts.onImageUpload;d?s.setAttribute("src",await function(t,e,i){return new Promise(((n,o)=>{const s=t.opts.onAssetUpload;let l=!1;const a=e=>{l||(l=!0,t.onAssetUpload=null,t.opts.onAssetUpload=s,e?n(e):o(new Error(t.util.out("Upload file failed."))))};t.onAssetUpload=a,t.opts.onAssetUpload=a;try{e({target:{files:[i]}})}catch(t){a(null)}}))}(i,d,new File([c.blob],u,{type:a}))):s.src=c.dataUrl;s.setAttribute("data-filename",u),t.refreshIfIsModule(s),i.opts.onChange(),i.elmTool.refresh(),i.onImageChange&&i.onImageChange()}(t,e),Cc(t,e)}catch(t){n.showMessage(t.message)}e.saving=!1,_c(e,!1)}}))}(t,a));const r=a.modal;a.trigger=e,a.onKeyCapture=t=>{if(!a.editor)return;if((t.ctrlKey||t.metaKey)&&(90===t.which||89===t.which))return t.preventDefault(),t.stopImmediatePropagation(),void(89===t.which||t.shiftKey?a.editor.redo():a.editor.undo());if(27===t.which){if(a.saving)return t.preventDefault(),void t.stopImmediatePropagation();const e=r.querySelector(".kanvas-tools > button");e&&"true"===e.getAttribute("aria-pressed")&&(t.preventDefault(),t.stopImmediatePropagation(),e.click())}},document.addEventListener("keydown",a.onKeyCapture,!0);const c=r.querySelector(".cb-ike-host");c.innerHTML="";const u=a.editor=new mc({container:c,header:!1,t:t=>n.out(t),aspectPresets:fc,presets:i.opts.imageEditorPresets||null,builtins:!0,loadCube:!0===i.opts.imageEditorLoadCube,myLooks:!0===i.opts.imageEditorMyLooks,onHistory:({canUndo:t,canRedo:e})=>{a.canUndo=t,a.canRedo=e,Sc(a)}});n.showModal(r,!0,(()=>{Cc(t,a,!1)})),e&&e.setAttribute("data-focus",!0);let d=l.getAttribute("src");-1===d.indexOf("base64")&&(d+=(-1===d.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`),u.load(d).catch((e=>{Cc(t,a),n.showMessage(e.message)}))}function kc(t,e){e?t.removeAttribute("disabled"):t.setAttribute("disabled","")}function Sc(t){kc(t.modal.querySelector(".cb-ike-undo"),!t.saving&&t.canUndo),kc(t.modal.querySelector(".cb-ike-redo"),!t.saving&&t.canRedo)}function _c(t,e){const i=t.modal.querySelector(".cb-ike-bar");i.setAttribute("aria-busy",e?"true":"false");const n=i.querySelectorAll(".cb-ike-compare, .cb-ike-reset, .input-cancel, .input-ok");Array.prototype.forEach.call(n,(t=>{e?t.setAttribute("disabled",""):t.removeAttribute("disabled")})),Sc(t)}function Cc(t,e,i=!0){e.editor&&(e.editor.destroy(),e.editor=null),e.onKeyCapture&&(document.removeEventListener("keydown",e.onKeyCapture,!0),e.onKeyCapture=null);const n=e.modal.querySelector(".cb-ike-host");n&&(n.innerHTML=""),e.canUndo=e.canRedo=!1,e.saving=!1,_c(e,!1),i&&t.builder.util.hideModal(e.modal),e.trigger&&(e.trigger.removeAttribute("data-focus"),e.trigger.focus(),e.trigger=null)}class Ec{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector("#divImageTool");if(!n){let o=`\n <div id="divImageTool" class="is-tool">\n <div role="button" tabindex="0" class="image-embed" style="${this.builder.opts.imageEmbed?"":"display:none;"}width:40px;height:40px;overflow:hidden;">\n <div style="position:absolute;width:100%;height:100%;">\n <svg class="is-icon-flex" style="position: absolute;top: 13px;left: 15px;width: 16px;height: 16px;"><use xlink:href="#ion-image"></use></svg>\n </div>\n <input title="${e.out("Change Image")}" data-title="${e.out("Change Image")}" id="fileEmbedImage" type="file" accept="image/*" style="position:absolute;top:-20px;left:0;width:40px;height:60px;opacity: 0;cursor: pointer;"/>\n </div>\n <button tabindex="0" title="${e.out("Link")}" data-title="${e.out("Link")}" class="image-link" style="width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;transform:rotate(45deg)"><use xlink:href="#icon-link2"></use></svg></button> \n <button tabindex="0" title="${e.out("Select")}" data-title="${e.out("Select")}" class="open-asset" style="display:none;width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-folder2"></use></svg></button> \n <button tabindex="0" title="${e.out("Edit")}" data-title="${e.out("Edit")}" class="image-edit" style="width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg></button>\n </div>\n <div id="divImageProgress">\n <div>\n <div class="dot"></div>\n <div class="dot"></div>\n <div class="dot"></div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector("#divImageTool"),this.imageTool=n;let s=n.querySelector("#fileEmbedImage");i.addEventListener(s,"change",(async e=>{this.builder.uo.saveForUndo();let i=this.builder.activeImage,o=1;const l=document.querySelector(".is-content-view");if(l){const t=window.getComputedStyle(l).transform;if(t.startsWith("matrix(")){const e=new DOMMatrix(t);0===e.b&&0===e.c&&e.a===e.d&&(o=e.a)}}let a=t.querySelector("#divImageProgress");a.style.display="table",a.style.width=i.offsetWidth*this.builder.opts.zoom*o+"px",a.style.height=i.offsetHeight*this.builder.opts.zoom*o+"px";const r=this.builder.util.getElementPosition(i);let c=r.top+window.pageYOffset,u=r.left+window.pageXOffset;a.style.top=c+"px",a.style.left=u+"px";const d=async t=>{let e=t.target.files[0];return new Promise((i=>{this.builder.opts.onAssetUpload=t=>{i({url:t,name:e.name,size:e.size})},this.builder.opts.onImageUpload(t)}))};if(this.builder.opts.onImageUpload){const t=await d(e);return i.setAttribute("src",t.url),a.style.display="none",s=n.querySelector("#fileEmbedImage"),s.value="",this.refreshIfIsModule(i),this.startImageMonitor(i),this.builder.opts.onChange(),this.builder.elmTool.refresh(),void(this.builder.onImageChange&&this.builder.onImageChange())}})),this.builder.opts.onImageBrowseClick&&(s=n.querySelector(".image-embed"),i.addEventListener(s,"click",(t=>(this.builder.opts.onImageBrowseClick(),t.preventDefault(),!1))));const l=n.querySelector(".image-link");i.addEventListener(l,"click",(()=>{this.renderPanel();let n=t.querySelector(".imagelink");if(this.builder.opts.onImageSettingClick)return this.builder.opts.onImageSettingClick(),!1;let o,s=this.builder.activeImage;"a"===s.parentNode.tagName.toLowerCase()&&1===s.parentNode.childElementCount&&(o=s.parentNode);let a=s.getAttribute("src"),r=s.getAttribute("alt"),c=n.querySelector(".input-src");-1===a.indexOf("base64")?c.value=a:c.value="[Image Data]";let u=n.querySelector(".input-title");u.value=r;let d=n.querySelector(".input-link");d.value="";let h=n.querySelector(".input-newwindow");h.checked=!1;let b=n.querySelector(".input-openlightbox");if(b.checked=!1,o){if(d.value=o.getAttribute("href"),""===r){let t=o.getAttribute("title");t&&(u.value=t)}var p=o.getAttribute("target");h.checked="_blank"===p,i.hasClass(o,"is-lightbox")?b.checked=!0:b.checked=!1}e.showModal(n,!0,(()=>{l.removeAttribute("data-focus"),l.focus()}),!0),l.setAttribute("data-focus",!0),c.focus()}));const a=n.querySelector(".open-asset");this.builder.opts.onImageSelectClick||this.builder.opts.imageselect?(a.style.display="block",i.addEventListener(a,"click",(()=>{let t=this.builder.activeImage,e=t?t.getAttribute("src"):"";this.builder.openImageSelect((t=>{this.builder.uo.saveForUndo();let e=this.builder.activeImage;e.addEventListener("load",(()=>{this.builder.activeModule?(this.refreshIfIsModule(this.builder.activeModule),this.builder.activeModule.click()):(this.repositionImageTool(),this.builder.elmTool.repositionElementTool())})),e.setAttribute("src",t),this.builder.opts.onChange(),this.builder.opts.onRender(),this.builder.onImageChange&&this.builder.onImageChange()}),e)}))):a.style.display="none";const r=n.querySelector(".image-edit");i.addEventListener(r,"click",(()=>{if("kanvas"===this.builder.opts.imageEditor)return void xc(this,r);this.renderPanel();let i=t.querySelector(".imageedit"),n=this.builder.activeImage,o=i.querySelector(".imageedit-preview");o.innerHTML='<img style="max-width:100%;object-fit:contain;height:100%;"/>';let s=i.querySelector("img");if(this.builder.onImageEditClick){if(!this.builder.onImageEditClick(n,s))return}e.showModal(i,!0,(()=>{r.removeAttribute("data-focus"),r.focus()})),r.setAttribute("data-focus",!0);if(o.style.height="",n.offsetWidth<800&&n.offsetHeight<550)o.style.width=n.offsetWidth+"px";else{800*n.offsetHeight/n.offsetWidth<=550?o.style.width="800px":o.style.height="550px"}window.innerHeight<=800&&(o.style.height="350px"),-1===n.src.indexOf("base64")?s.src=n.src+(-1===n.src.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`:s.src=n.src,this.builder.setCropperConfig?this.cropper=new ga(s,this.builder.setCropperConfig):this.cropper=new ga(s,{zoomable:!1})}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".imagelink")){let n=`\n <div class="is-modal imageedit" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="imageedit-crop" style="display:flex;height:80px;align-items:center;align-self:flex-start;">\n <button title="5x5" data-crop-size="1" style="width: 60px;height: 60px;">5x5</button>\n <button title="4x3" data-crop-size="1.33333" style="width: 60px;height: 45px;">4x3</button>\n <button title="3x4" data-crop-size="0.75" style="width: 45px;height: 60px;">3x4</button>\n <button title="6x4" data-crop-size="1.5" style="width: 60px;height: 40px;">6x4</button>\n <button title="4x6" data-crop-size="0.6666" style="width: 40px;height: 60px;">4x6</button>\n <button title="16x9" data-crop-size="1.77" style="width: 60px;height: 35px;">16x9</button>\n <button title="${e.out("Free")}" data-crop-size="" style="width: 60px;height: 45px;">${e.out("Free")}</button>\n </div>\n <div class="imageedit-preview" style="max-width:1000px;width:100%;max-height:550px;">\n </div>\n <div style="margin-top:15px;text-align:right;align-self:flex-end;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Apply")}" class="input-ok classic-primary">${e.out("Apply")}</button>\n </div>\n </div>\n </div>\n \n <div class="is-modal imagelink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form">\n\n <div class="cb-field">\n <label for="inpImageLinkSource">${e.out("Source")}:</label>\n <div class="image-src">\n <input id="inpImageLinkSource" class="input-src" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n\n <div class="image-larger1 is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetImageUpload" method="post" action="${this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="border-radius:1px;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;">\n\t\t\t\t <input id="hidRefId1" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage1" name="fileImage" type="file" accept="image/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe id="frameTargetImageUpload" name="frameTargetImageUpload" tabindex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <label for="inpImageLinkTitle">${e.out("Title")}:</label>\n <input id="inpImageLinkTitle" class="input-title" type="text"/>\n </div>\n\n <div class="cb-field">\n <label for="inpImageLinkLink">${e.out("Link")}:</label>\n <div class="image-link">\n <input id="inpImageLinkLink" class="input-link" type="text"/>\n <button title="${e.out("Select")}" class="input-select2" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n \n <button title="${e.out(this.builder.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:50px">${this.builder.opts.otherSelectIcon}</button>\n \n <div class="image-larger2 is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetImageUpload" method="post" action="${this.builder.opts.fileHandler?this.builder.opts.fileHandler:this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="border-radius:1px;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;">\n\t\t\t\t <input id="hidRefId2" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage2" name="fileImage" type="file" accept="*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <label class="label-checkbox">\n <input class="input-newwindow" id="__input_newwindow2" type="checkbox" /> ${e.out("Open new window")}\n </label>\n <label class="label-checkbox mt-1" id="lblImageLinkOpenLightbox" style="${this.builder.useLightbox?"":"display:none"}">\n <input class="input-openlightbox" id="__input_openlightbox2" type="checkbox" /> ${e.out("Open in a lightbox (for image, video or Youtube)")}\n </label>\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);let o=t.querySelector(".imagelink");if(this.builder.opts.onOtherSelectClick||this.builder.opts.otherSelect){o.querySelector(".input-select-other").style.display="block";const n=o.querySelector(".input-select-other");n&&i.addEventListener(n,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:o.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(o.querySelector(".image-larger1").style.display="none",o.querySelector(".image-larger2").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none",o.querySelector(".input-select2").style.display="none");let s=o.querySelector(".input-cancel");i.addEventListener(s,"click",(()=>{e.hideModal(o)})),s=o.querySelector(".input-ok"),i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo();let t,n=this.builder.activeImage;"a"===n.parentNode.tagName.toLowerCase()&&1===n.parentNode.childElementCount&&(t=n.parentNode);let s=o.querySelector(".input-src").value,l=o.querySelector(".input-title").value,a=o.querySelector(".input-link").value;-1===s.indexOf("[Image Data]")&&n.setAttribute("src",s),n.setAttribute("alt",l),""!==a?t?(t.setAttribute("href",a),t.setAttribute("title",l),o.querySelector(".input-newwindow").checked?t.setAttribute("target","_blank"):t.removeAttribute("target"),o.querySelector(".input-openlightbox").checked?i.addClass(t,"is-lightbox"):i.removeClass(t,"is-lightbox")):(t=i.createElement("a"),t.setAttribute("href",a),t.setAttribute("title",l),t.innerHTML=n.outerHTML,o.querySelector(".input-newwindow").checked?t.setAttribute("target","_blank"):t.removeAttribute("target"),o.querySelector(".input-openlightbox").checked?i.addClass(t,"is-lightbox"):i.removeClass(t,"is-lightbox"),n.outerHTML=t.outerHTML):t&&(t.outerHTML=t.innerHTML),this.refreshIfIsModule(n),this.builder.opts.onChange(),this.builder.opts.onRender(),e.hideModal(o),this.builder.elmTool.refresh(),this.builder.onImageChange&&this.builder.onImageChange()}));let l=o.querySelector(".image-src");if(this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const n=o.querySelector(".input-select");n&&i.addEventListener(n,"click",(()=>{if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-src"),theTrigger:n});else{let i=t.querySelector(".is-modal.imageselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-src"),this.builder.targetCallback=null,this.builder.targetAssetType="image"}));const s=o.querySelector(".input-select2");s&&i.addEventListener(s,"click",(()=>{if(this.builder.opts.onFileSelectClick)this.builder.opts.onFileSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:s}),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all";else if(""!==this.builder.opts.fileselect){let i=t.querySelector(".is-modal.fileselect"),n=i.querySelector("iframe");this.builder.opts.assetRefresh&&(n.src=this.builder.opts.fileselect,this.builder.opts.assetRefresh=!1),"about:blank"===n.src&&(n.src=this.builder.opts.fileselect),e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all"}else if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:s}),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="media";else{let i=t.querySelector(".is-modal.imageselect"),n=i.querySelector("iframe");this.builder.opts.assetRefresh&&(n.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===n.src&&(n.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="media"}}))}else i.removeClass(l,"image-select");let a=o.querySelector("#fileImage1");i.addEventListener(a,"change",(t=>{let e=a;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId1").value=this.builder.opts.customval,this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),a.value=""}));let r=o.querySelector("#fileImage2");i.addEventListener(r,"change",(t=>{let e=r;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId2").value=this.builder.opts.customval,this.builder.opts.onFileUpload?this.builder.opts.onFileUpload(t):this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),r.value=""}));let c=t.querySelector(".imageedit"),u=c.querySelector(".imageedit-crop").querySelectorAll("button");Array.prototype.forEach.call(u,(t=>{i.addEventListener(t,"click",(()=>{let e=1*t.getAttribute("data-crop-size");this.cropper.setAspectRatio(e)}))}));let d=c.querySelector(".input-cancel");i.addEventListener(d,"click",(()=>{e.hideModal(c)})),s=c.querySelector(".input-ok"),i.addEventListener(s,"click",(async()=>{this.builder.uo.saveForUndo();let t=this.builder.activeImage;if(this.builder.opts.onImageUpload){let n,o,s,l,a,r=t.getAttribute("src");if(-1===r.indexOf("base64")){let t=r.substring(r.lastIndexOf("/")+1);n=i.baseName(t),o=t.substr(t.lastIndexOf(".")+1).toLowerCase()}else if(t.getAttribute("data-filename")){let e=t.getAttribute("data-filename");n=i.baseName(e),o=e.substr(e.lastIndexOf(".")+1).toLowerCase()}else{n=e.makeId(),o="png";const t=r.match(/^data:image\/(.*?);base64,/);t&&(o=t[1])}-1!==n.indexOf("-edit")&&(n=n.substr(0,n.indexOf("-edit"))),s=n+"-edit"+e.makeId(),s=s.replaceAll("%20","-"),l=s+"."+o,a="jpg"===o||"jpeg"===o||"webm"===o||"webp"===o?this.cropper.getCroppedCanvas({fillColor:"#fff",imageSmoothingEnabled:!0,imageSmoothingQuality:"high"}).toDataURL("image/jpeg"):this.cropper.getCroppedCanvas({}).toDataURL();const u=t=>({jpg:"image/jpeg",jpeg:"image/jpeg",png:"image/png",gif:"image/gif",webp:"image/webp",svg:"image/svg+xml",pdf:"application/pdf",txt:"text/plain",mp3:"audio/mpeg",mp4:"video/mp4",mov:"video/quicktime",wav:"audio/wav",json:"application/json"}[t.split(".").pop().toLowerCase()]||"application/octet-stream"),d=(t,e)=>{const i=u(e),n=atob(t.split(",")[1]),o=new Uint8Array(n.length);for(let t=0;t<n.length;t++)o[t]=n.charCodeAt(t);return new File([o],e,{type:i})},h=t=>new Promise((e=>{this.builder.opts.onAssetUpload=i=>{e({url:i,name:t.name,size:t.size})};const i={target:{files:[t]}};this.builder.opts.onImageUpload(i)})),b=d(a,l),p=await h(b);return t.setAttribute("src",p.url),this.refreshIfIsModule(t),this.builder.opts.onChange(),e.hideModal(c),this.builder.elmTool.refresh(),void(this.builder.onImageChange&&this.builder.onImageChange())}let n=t.getAttribute("data-filename"),o="jpg";if(n)o=n.substr(n.lastIndexOf(".")+1).toLowerCase();else{let e=t.src;e.indexOf("/")>-1?t.setAttribute("data-filename",e.substr(e.lastIndexOf("/")+1)):t.setAttribute("data-filename",e),o=e.substr(e.lastIndexOf(".")+1).toLowerCase()}if(this.builder.opts.imageRenameOnEdit){let n="";if(-1===t.src.indexOf("base64")){let e=t.getAttribute("src"),o=e.substring(e.lastIndexOf("/")+1);n=i.baseName(o)}else n=i.baseName(t.getAttribute("data-filename"));let s="";-1!==n.indexOf("-edit")&&(n=n.substr(0,n.indexOf("-edit"))),s=n+"-edit"+e.makeId(),s=s.replaceAll("%20","-"),t.setAttribute("data-filename",s+"."+o)}t.src="jpg"===o||"jpeg"===o||"webm"===o||"webp"===o?this.cropper.getCroppedCanvas({fillColor:"#fff",imageSmoothingEnabled:!0,imageSmoothingQuality:"high"}).toDataURL("image/jpeg"):this.cropper.getCroppedCanvas({}).toDataURL(),this.refreshIfIsModule(t),this.builder.opts.onChange(),e.hideModal(c),this.builder.elmTool.refresh(),this.builder.onImageChange&&this.builder.onImageChange()}))}}startImageMonitor(t){let e;e=new MutationObserver((t=>{t.forEach((t=>{"src"===t.attributeName&&(this.builder.onImageSrcChange&&this.builder.onImageSrcChange(),e&&e.disconnect())}))})),e.observe(t,{attributes:!0})}open(){const t=this.builder.builderStuff,e=this.builder.util;if(this.renderPanel(),this.builder.opts.onImageSettingClick)return this.builder.opts.onImageSettingClick(),!1;const i=t.querySelector(".imagelink");let n=this.builder.activeImage,o=n.closest("a"),s=n.getAttribute("src"),l=n.getAttribute("alt"),a=i.querySelector(".input-src");-1===s.indexOf("base64")?a.value=s:a.value="[Image Data]";let r=i.querySelector(".input-title");r.value=l;let c=i.querySelector(".input-link");c.value="";let u=i.querySelector(".input-newwindow");u.checked=!1;let d=i.querySelector(".input-openlightbox");if(d.checked=!1,o){if(c.value=o.getAttribute("href"),""===l){let t=o.getAttribute("title");t&&(r.value=t)}var h=o.getAttribute("target");u.checked="_blank"===h,o.classList.contains("is-lightbox")?d.checked=!0:d.checked=!1}e.showModal(i,!0,(()=>{}),!0),a.focus()}edit(){const t=this.builder.builderStuff,e=this.builder.util;if("kanvas"===this.builder.opts.imageEditor)return void xc(this);this.renderPanel();const i=t.querySelector(".imageedit");let n=this.builder.activeImage,o=i.querySelector(".imageedit-preview");o.innerHTML='<img style="max-width:100%;object-fit:contain;height:100%;"/>';let s=i.querySelector("img");if(this.builder.onImageEditClick){if(!this.builder.onImageEditClick(n,s))return}e.showModal(i,!0,(()=>{}));if(o.style.height="",n.offsetWidth<800&&n.offsetHeight<550)o.style.width=n.offsetWidth+"px";else{800*n.offsetHeight/n.offsetWidth<=550?o.style.width="800px":o.style.height="550px"}window.innerHeight<=800&&(o.style.height="350px"),-1===n.src.indexOf("base64")?s.src=n.src+(-1===n.src.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`:s.src=n.src,this.builder.setCropperConfig?this.cropper=new ga(s,this.builder.setCropperConfig):this.cropper=new ga(s,{zoomable:!1})}refreshIfIsModule(t){const e=this.builder.dom,i=this.builder.util;if(e.parentsHasAttribute(t,"data-html")){if(this.imageTool&&(this.imageTool.style.display=""),t.hasAttribute("data-sync")){let e=t.getAttribute("data-src"),i=t.getAttribute("data-filename");if(e){let n=t;for(;!n.getAttribute("data-html");)n=n.parentNode;let o=n.querySelectorAll("img");Array.prototype.forEach.call(o,(n=>{n.src===e&&(n.src=t.src,n.removeAttribute("data-src"),n.setAttribute("data-filename",i))})),t.removeAttribute("data-src")}}setTimeout((()=>{i.refreshModule(),this.imageTool&&(this.imageTool.style.display="")}),1e3)}else t.onload=()=>{this.refresh()}}refresh(){const t=this.builder.util,e=this.builder.dom;if(this.builder.activeImage){let i=this.imageTool;i.style.display="",setTimeout((()=>{let n=this.builder.activeImage;if(!n)return;e.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=t.getElementPosition(n);let s=o.scaleX;i.style.display="flex";let l=i.offsetWidth,a=n.offsetWidth*s*this.builder.opts.zoom,r=o.top+window.pageYOffset,c=o.left+window.pageXOffset,u=c+(a/2-l/2);const d=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;l+c>d&&(u=n.getBoundingClientRect().left+t)}else l+c>d&&(u=n.getBoundingClientRect().left);i.style.top=r+"px",i.style.left=u+"px",0===n.offsetWidth&&(i.style.display="",this.builder.activeImage=null),t.repositionColumnTool()}),0)}}repositionImageTool(){const t=this.builder.util,e=this.builder.dom;if(this.builder.activeImage){let i=this.imageTool;if(!i)return;let n=this.builder.activeImage;e.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=t.getElementPosition(n);let s=o.scaleX,l=this.getScale(n).scaleX,a=this.getScale(n).scaleX;i.style.display="flex";let r=i.offsetWidth,c=n.offsetWidth*l*s*this.builder.opts.zoom,u=(n.offsetHeight*a*s*this.builder.opts.zoom-n.offsetHeight*s*this.builder.opts.zoom)/2,d=o.top+window.pageYOffset+u,h=o.left+window.pageXOffset,b=h+(c/2-r/2);const p=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;r+h>p&&(b=n.getBoundingClientRect().left+t)}else r+h>p&&(b=n.getBoundingClientRect().left);i.style.top=d+"px",i.style.left=b+"px"}}hideImageTool(){let t=this.imageTool;t&&(t.style.display="")}getScale(t){const e=window.getComputedStyle(t).transform;if(!e||"none"===e)return{scaleX:1,scaleY:1};const i=new DOMMatrix(e);return{scaleX:i.a,scaleY:i.d}}resolveTarget(t,e){if(!e||"img"===e.tagName.toLowerCase())return e;if(!this.builder.resolveImageFromPoint)return e;return this.builder.resolveImageFromPoint(t)||e}click(t){const e=this.builder.util,i=this.builder.dom;let n=t.target;if(n.closest("[data-html]"))return this.builder.activeImage=null,void this.hideImageTool();if(n=this.resolveTarget(t,n),"img"===n.tagName.toLowerCase()){let o=!1;if(n.hasAttribute("data-fixed")&&(o=!0),o)this.builder.activeImage=null,this.hideImageTool();else{this.builder.activeImage=n,i.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=e.getElementPosition(n);let s=o.scaleX,l=this.getScale(n).scaleX,a=this.getScale(n).scaleX;this.renderTool();let r=this.imageTool;r.style.display="flex";const c=this.builder.imageToolMinimal,u=r.querySelector(".image-link"),d=r.querySelector(".image-edit");u&&(u.style.display=c?"none":""),d&&(d.style.display=c?"none":"");let h=r.offsetWidth,b=n.offsetWidth*l*s*this.builder.opts.zoom,p=(n.offsetHeight*a*s*this.builder.opts.zoom-n.offsetHeight*s*this.builder.opts.zoom)/2,g=o.top+window.pageYOffset+p,m=o.left+window.pageXOffset,f=m+(b/2-h/2);const y=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;h+m>y&&(f=n.getBoundingClientRect().left+t)}else h+m>y&&(f=n.getBoundingClientRect().left);r.style.top=g+"px",r.style.left=f+"px";const v=t=>{let e=t.target;e&&(e.closest("#divImageTool")||e.closest(".is-modal")||e.closest(".keep-selection")||e.closest(".sl-wrapper")||e.closest(".sl-overlay")||e.closest(".sl-close")||e.closest("img")||this.resolveTarget(t,e)!==e||(this.hideImageTool(),document.removeEventListener("click",v),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",v),this.builder.handleImageToolClickOut_=!1))};if(this.builder.handleImageToolClickOut_||(document.addEventListener("click",v),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",v),this.builder.handleImageToolClickOut_=!0),this.builder.canvas);else{let e=!1;t.screenX&&0!==t.screenX&&t.screenY&&0!==t.screenY||(e=!0),e&&this.hideImageTool()}}}else this.builder.activeImage=null}}const Ac=".is-modal.buttoneditor",Lc=[{id:"style",label:"Style"},{id:"presets",label:"Presets"},{id:"saved",label:"Saved"}],Tc={none:"None",sm:"S",normal:"M",md:"MD",lg:"LG",xl:"XL","2xl":"2XL","3xl":"3XL",full:"Full"};class Mc{constructor(t){this.builder=t,this.util=t.util,this.dom=t.dom,this.builderStuff=t.builderStuff;let e=this.builderStuff.querySelector(Ac);if(e)return void(this.buttonModal=e);const i=this.util,n=this.dom,o=Lc.map(((t,e)=>`<button type="button" role="tab" id="cbbe-tab-${t.id}" data-tab="${t.id}" aria-controls="cbbe-panel-${t.id}" aria-selected="${0===e?"true":"false"}" tabindex="${0===e?"0":"-1"}">${i.out(t.label)}</button>`)).join(""),s=`\n <div class="is-modal is-modal-content buttoneditor" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${i.out("Button")}\n <button type="button" class="is-modal-close" tabindex="-1" title="${i.out("Close")}">&#10005;</button>\n </div>\n <div class="buttoneditor-inner">\n <div class="cb-tabs" role="tablist" aria-label="${i.out("Button")}">${o}</div>\n <div class="buttoneditor-panels">\n <div class="buttoneditor-panel on" role="tabpanel" id="cbbe-panel-style" aria-labelledby="cbbe-tab-style" data-tab="style" tabindex="0">${this.stylePanelHtml()}</div>\n <div class="buttoneditor-panel" role="tabpanel" id="cbbe-panel-presets" aria-labelledby="cbbe-tab-presets" data-tab="presets" tabindex="0"></div>\n <div class="buttoneditor-panel" role="tabpanel" id="cbbe-panel-saved" aria-labelledby="cbbe-tab-saved" data-tab="saved" tabindex="0">\n <button type="button" class="buttoneditor-savebtn">${i.out("Save current button")}</button>\n <div class="buttoneditor-savedlist buttoneditor-gallery buttoneditor-saved is-container"></div>\n </div>\n </div>\n </div>\n </div>`;n.appendHtml(this.builderStuff,s),e=this.builderStuff.querySelector(Ac),this.buttonModal=e,n.addEventListener(e.querySelector(".is-modal-close"),"click",(()=>{n.removeClass(e,"active")})),this.tabs=n.accessibleTabs(e.querySelector(".cb-tabs"),(t=>this.selectTab(t))),e.querySelector(".buttoneditor-savebtn").addEventListener("click",(()=>this.saveCurrent())),this.wireControls(e),this.renderPresets(),this.renderSaved(),new vs({selector:`${Ac} .is-draggable`})}stylePanelHtml(){const t=t=>this.util.out(t),e=(t,e)=>'<div class="buttoneditor-seg">'+e.map((([e,i,n])=>`<button type="button" data-cmd="${t}" data-val="${e}"${n||""}>${i}</button>`)).join("")+"</div>",i=e=>`<div class="buttoneditor-step">\n <button type="button" data-cmd="${e}-dec" title="${t("Less")}">&minus;</button>\n <span class="buttoneditor-stepval" data-field="${e}">&ndash;</span>\n <button type="button" data-cmd="${e}-inc" title="${t("More")}">+</button>\n </div>`,n=(t,e)=>`<button type="button" class="buttoneditor-swatch" data-cmd="${t}" title="${e}"><span></span></button>`,o='<option value="">&ndash;</option>'+be.map((t=>`<option value="${t}">${t}</option>`)).join(""),s='<option value="">&ndash;</option>'+pe.map((t=>`<option value="${t}">${t}</option>`)).join("");return`\n <div class="buttoneditor-field">\n <label class="buttoneditor-label" for="cbbe2-href">${t("Link")}</label>\n <input id="cbbe2-href" data-cmd="href" type="text" placeholder="https://..." />\n <label class="buttoneditor-check"><input type="checkbox" data-cmd="newtab" /> ${t("Open in new tab")}</label>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Colors")}</div>\n <div class="buttoneditor-seg buttoneditor-colorstate">\n <button type="button" data-cmd="colorstate" data-val="normal" class="on">${t("Normal")}</button>\n <button type="button" data-cmd="colorstate" data-val="hover">${t("Hover")}</button>\n </div>\n <div class="buttoneditor-colors" data-state="normal">\n <div class="buttoneditor-swrow">${n("color-bg",t("Background Color"))}<span>${t("Background")}</span></div>\n <div class="buttoneditor-swrow">${n("color-text",t("Text Color"))}<span>${t("Text")}</span></div>\n <div class="buttoneditor-swrow buttoneditor-swrow-seg"><span>${t("Border")}</span>${e("border-style",[["transparent",t("Transparent")],["current",t("Current")]])}</div>\n </div>\n <div class="buttoneditor-colors" data-state="hover" style="display:none">\n <div class="buttoneditor-swrow">${n("hover-bg",t("Background Color"))}<span>${t("Background")}</span></div>\n <div class="buttoneditor-swrow">${n("hover-text",t("Text Color"))}<span>${t("Text")}</span></div>\n <div class="buttoneditor-swrow">${n("hover-border",t("Border Color"))}<span>${t("Border")}</span></div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Size")}</div>\n ${e("size",[["small",t("S")],["medium",t("M")],["large",t("L")]])}\n <div class="buttoneditor-row">\n <div class="buttoneditor-sub"><span>${t("Padding X")}</span>${i("px")}</div>\n <div class="buttoneditor-sub"><span>${t("Padding Y")}</span>${i("py")}</div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Shape")}</div>\n ${e("radius",he.map((t=>[t,Tc[t]||t])))}\n </div>\n\n <div class="buttoneditor-row">\n <div class="buttoneditor-field buttoneditor-half">\n <div class="buttoneditor-label">${t("Border")}</div>\n ${e("border-width",[["0",t("None")],["1","1px"," data-lc"],["2","2px"," data-lc"]])}\n </div>\n <div class="buttoneditor-field buttoneditor-half">\n <div class="buttoneditor-label">${t("Width")}</div>\n ${e("width",[["auto",t("Auto")],["full",t("Full")]])}\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Text")}</div>\n <div class="buttoneditor-seg buttoneditor-toggle">\n <button type="button" data-cmd="bold" title="${t("Bold")}" style="font-family:serif">B</button>\n <button type="button" data-cmd="uppercase" title="${t("Upper/Lower")}" style="font-family:serif">Aa</button>\n <button type="button" data-cmd="underline" title="${t("Underline")}" style="font-family:serif;text-decoration:underline">U</button>\n </div>\n <div class="buttoneditor-row">\n <div class="buttoneditor-sub"><span>${t("Font Size")}</span><select data-cmd="fontsize">${o}</select></div>\n <div class="buttoneditor-sub"><span>${t("Letter Spacing")}</span><select data-cmd="tracking">${s}</select></div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Margin")}</div>\n <div class="buttoneditor-margins">\n <label>${t("Top")}<input type="number" min="0" max="5" data-cmd="margin" data-val="top" /></label>\n <label>${t("Right")}<input type="number" min="0" max="5" data-cmd="margin" data-val="right" /></label>\n <label>${t("Bottom")}<input type="number" min="0" max="5" data-cmd="margin" data-val="bottom" /></label>\n <label>${t("Left")}<input type="number" min="0" max="5" data-cmd="margin" data-val="left" /></label>\n </div>\n </div>`}wireControls(t){t.addEventListener("click",(t=>{const e=t.target.closest("[data-cmd]");if(!e)return;const i=e.getAttribute("data-cmd");"color-bg"!==i&&"color-text"!==i&&"hover-bg"!==i&&"hover-text"!==i&&"hover-border"!==i?"colorstate"!==i?"href"!==i&&"newtab"!==i&&"fontsize"!==i&&"tracking"!==i&&"margin"!==i&&this.command(i,e.getAttribute("data-val")):this.setColorState(e.getAttribute("data-val")):this.openColor(i,e)})),t.querySelector('[data-cmd="href"]').addEventListener("input",(t=>this.commandInput("href",t.target.value))),t.querySelector('[data-cmd="newtab"]').addEventListener("change",(t=>this.commandInput("newtab",t.target.checked))),t.querySelector('[data-cmd="fontsize"]').addEventListener("change",(t=>this.commandInput("fontsize",t.target.value))),t.querySelector('[data-cmd="tracking"]').addEventListener("change",(t=>this.commandInput("tracking",t.target.value))),t.querySelectorAll('[data-cmd="margin"]').forEach((t=>{t.addEventListener("change",(t=>this.commandInput("margin",t.target.value,t.target.getAttribute("data-val"))))}))}command(t,e){const i=this.getButton();if(!i)return;this.builder.uo.saveForUndo();const n=xe(i);switch(t){case"size":!function(t,e){const i=ue[e];i&&(fe(t,"px-"),fe(t,"py-"),fe(t,"pt-"),fe(t,"pb-"),fe(t,"size-"),fe(t,"leading-"),t.classList.add("px-"+i.px),t.classList.add("py-"+i.py),t.classList.add("size-"+i.size),t.classList.add("leading-"+i.leading),Ae(t))}(i,e);break;case"px-dec":Le(i,(null==n.px?0:n.px)-1);break;case"px-inc":Le(i,(null==n.px?0:n.px)+1);break;case"py-dec":Te(i,(null==n.py?0:n.py)-1);break;case"py-inc":Te(i,(null==n.py?0:n.py)+1);break;case"radius":!function(t,e){t.classList.remove("rounded"),fe(t,"rounded-"),"normal"===e?t.classList.add("rounded"):e&&t.classList.add("rounded-"+e),Ae(t)}(i,e);break;case"border-width":!function(t,e){t.classList.remove("border-0"),t.classList.remove("border-2"),t.classList.remove("border"),0===e?t.classList.add("border-0"):1===e?t.classList.add("border"):2===e&&t.classList.add("border-2"),Ae(t)}(i,parseInt(e,10));break;case"border-style":!function(t,e){t.classList.remove("border-transparent"),t.classList.remove("border-current"),"transparent"===e?t.classList.add("border-transparent"):"current"===e&&t.classList.add("border-current"),Ae(t)}(i,n.borderStyle===e?"":e);break;case"width":!function(t,e){"auto"===e?(t.classList.remove("flex"),t.classList.remove("justify-center"),t.classList.remove("items-center"),t.classList.remove("w-full"),t.classList.add("inline-block"),t.style.width=""):"full"===e&&(t.classList.remove("inline-block"),t.classList.add("flex"),t.classList.add("justify-center"),t.classList.add("items-center"),t.style.width="100%"),Ae(t)}(i,e);break;case"bold":!function(t,e){t.classList.remove("font-semibold"),t.classList.remove("font-normal"),t.classList.add(e?"font-semibold":"font-normal"),Ae(t)}(i,!n.bold);break;case"uppercase":!function(t,e){e?t.classList.add("uppercase"):t.classList.remove("uppercase"),Ae(t)}(i,!n.uppercase);break;case"underline":!function(t,e){t.classList.remove("underline"),t.classList.remove("no-underline"),t.classList.add(e?"underline":"no-underline"),Ae(t)}(i,!n.underline);break;default:return}this.builder.opts.onChange(),this.realtime()}commandInput(t,e,i){const n=this.getButton();n&&(this.builder.uo.saveForUndo(),"href"===t?function(t,e){"a"===t.tagName.toLowerCase()&&t.setAttribute("href",e)}(n,e):"newtab"===t?function(t,e){e?t.setAttribute("target","_blank"):t.removeAttribute("target")}(n,e):"fontsize"===t?function(t,e){fe(t,"size-"),e&&t.classList.add("size-"+e),Ae(t)}(n,""===e?"":parseInt(e,10)):"tracking"===t?""!==e&&function(t,e){fe(t,"tracking-"),t.classList.add("tracking-"+e),Ae(t)}(n,parseInt(e,10)):"margin"===t&&function(t,e,i){const n=me[e];n&&(fe(t,n),t.classList.add(n+we(i,5)),Ae(t))}(n,i,""===e?0:parseInt(e,10)),this.builder.opts.onChange(),this.realtime())}openColor(t,e){const i=this.getButton();if(!i)return;this.builder.uo.saveForUndo(!0);const n=this.dom;let o="";"color-bg"===t?o=i.style.backgroundColor||n.getStyle(i,"background-color"):"color-text"===t?o=i.style.color||n.getStyle(i,"color"):"hover-bg"===t?o=xe(i).hoverBg:"hover-text"===t?o=xe(i).hoverColor:"hover-border"===t&&(o=xe(i).hoverBorder),e.setAttribute("data-focus",!0),this.builder.colorPicker.open((e=>{const i=this.getButton();i&&("color-bg"===t?function(t,e){t.style.backgroundColor=e,""===e?t.removeAttribute("data-bg"):t.setAttribute("data-bg",e),fe(t,"bg-"),Ae(t)}(i,e):"color-text"===t?function(t,e){t.style.color=e,fe(t,"text-"),Ae(t)}(i,e):"hover-bg"===t?Oe(i,"bg",e):"hover-text"===t?Oe(i,"color",e):"hover-border"===t&&Oe(i,"border",e),this.builder.opts.onChange(),this.realtime())}),o,(()=>{e.removeAttribute("data-focus"),e.focus()}))}setColorState(t){const e=this.buttonModal;e.querySelectorAll('.buttoneditor-colorstate [data-cmd="colorstate"]').forEach((e=>{e.classList.toggle("on",e.getAttribute("data-val")===t)})),e.querySelectorAll(".buttoneditor-colors").forEach((e=>{e.style.display=e.getAttribute("data-state")===t?"":"none"}))}renderPresets(){const t=this.buttonModal.querySelector('.buttoneditor-panel[data-tab="presets"]');if(!t)return;let e='<div class="buttoneditor-gallery is-container">';Be.forEach((t=>{const i=function(t){const{type:e="outline",shape:i="rounded",size:n="medium",text:o="Button",color:s,bg:l,hoverBg:a,hoverColor:r,hoverBorder:c,borderColor:u,customClasses:d="",href:h="#"}=t,b=ue[n]||ue.medium,p=`py-${b.py} px-${b.px} size-${b.size} leading-${b.leading}`;let g=`transition-all inline-block whitespace-nowrap cursor-pointer no-underline border-2 border-solid mt-2 mb-1 font-normal tracking-normal ${de[i]||""} ${p} ${d}`.trim();if(/\bunderline\b/.test(d)&&(g=g.replace(/\bno-underline\b/,"").trim()),"outline2"===e){g+=" "+(u?"":"border-current hover:border-current");const t=s?`style="color: ${s};"`:"";return{html:`<a href="${h}" role="button" class="${g}"${t?" "+t:""}>${o}</a>`}}if("outline"===e)g+=" border-current hover:border-transparent";else{if("solid"!==e)return;g+=" border-transparent hover:border-transparent"}let m="<a\n";m+=` href="${h}"\n`,m+=' role="button"\n',m+=` class="${g}"\n`;const f=[],y=[];return s&&f.push(`color: ${s}`),l&&f.push(`background-color: ${l}`),l&&a&&(f.push(`${re.bg}: ${a}`),y.push("bg")),r&&(f.push(`${re.color}: ${r}`),y.push("color")),c&&(f.push(`${re.border}: ${c}`),y.push("border")),f.length&&(m+=` style="${f.join("; ")};"`),y.length&&(m+=`\n ${le}="${y.join(" ")}"`),m+=">\n",m+=` ${o}\n`,m+="</a>",{html:m}}(t);i&&i.html&&(e+=i.html)})),e+="</div>",t.innerHTML=e,t.querySelectorAll(".buttoneditor-gallery a").forEach((t=>{t.addEventListener("click",(e=>{e.preventDefault();const i=this.getButton();i&&(this.builder.uo.saveForUndo(),De(i,t),this.builder.opts.onChange(),this.realtime())}))}))}renderSaved(){const t=this.buttonModal.querySelector(".buttoneditor-savedlist");if(!t)return;const e=t=>this.util.out(t),i=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");let n="";for(const t of i){const i=t.hover?` ${le}="${t.hover}"`:"",o=t.bg?` data-bg="${t.bg}"`:"",s=t.hoverBg?` data-hover-bg="${t.hoverBg}"`:"";n+=`<a data-id="${t.id}"${o}${s}${i} class="${t.className}" href="#" role="button" style="${t.cssText}">Button<span class="buttoneditor-remove" title="${e("Remove")}">&times;</span></a>`}t.innerHTML=n,t.querySelectorAll("a").forEach((t=>{t.addEventListener("click",(e=>{if(e.target.closest(".buttoneditor-remove"))return;const i=this.getButton();i&&(this.builder.uo.saveForUndo(),De(i,t),this.builder.opts.onChange(),this.realtime(),e.preventDefault())}))})),t.querySelectorAll(".buttoneditor-remove").forEach((t=>{t.addEventListener("click",(t=>{const e=parseInt(t.target.closest("a").getAttribute("data-id"),10);let i=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");i=i.filter((t=>t.id!==e)),i.forEach(((t,e)=>{t.id=e})),localStorage.setItem("_savedbuttons",JSON.stringify(i)),this.renderSaved(),t.stopImmediatePropagation(),t.preventDefault()}))}))}saveCurrent(){const t=this.getButton();if(!t)return;const e=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");t.classList.remove("active"),t.classList.remove("elm-active"),e.push({id:e.length,className:t.className,cssText:t.style.cssText,hover:t.getAttribute(le)||"",bg:t.getAttribute("data-bg")||"",hoverBg:t.getAttribute("data-hover-bg")||""}),localStorage.setItem("_savedbuttons",JSON.stringify(e)),this.renderSaved()}selectTab(t){this.buttonModal.querySelectorAll(".buttoneditor-panel").forEach((e=>e.classList.toggle("on",e.getAttribute("data-tab")===t)))}getButton(){return this.builder.activeButton||this.builder.activeLinkButton||this.builder.activeLink}open(){this.util.showModal(this.buttonModal,!1),this.applyPosition(),this.tabs?this.tabs.select(Lc[0].id):this.selectTab(Lc[0].id),this.setColorState("normal"),this.renderSaved(),this.realtime()}applyPosition(){this.util.applyModalPosition(this.buttonModal,this.builder.opts.buttonEditorPosition)}hide(){this.dom.removeClass(this.buttonModal,"active")}realtime(){const t=this.getButton();if(!t)return;const e=this.dom,i=this.buttonModal,n=xe(t);this.syncSeg("size",n.sizeKey),this.syncSeg("radius",n.radius),this.syncSeg("border-width",null==n.borderWidth?null:String(n.borderWidth)),this.syncSeg("border-style",n.borderStyle),this.syncSeg("width",n.widthMode),this.syncStep("px",n.px),this.syncStep("py",n.py),this.syncToggle("bold",n.bold),this.syncToggle("uppercase",n.uppercase),this.syncToggle("underline",n.underline);const o=i.querySelector('[data-cmd="fontsize"]');o&&(o.value=null==n.fontSize?"":String(n.fontSize));const s=i.querySelector('[data-cmd="tracking"]');s&&(s.value=null==n.tracking?"":String(n.tracking)),["top","right","bottom","left"].forEach((t=>{const e=i.querySelector(`[data-cmd="margin"][data-val="${t}"]`);e&&document.activeElement!==e&&(e.value=null==n.margin[t]?"":n.margin[t])}));const l=i.querySelector('[data-cmd="href"]');l&&document.activeElement!==l&&(l.value=n.href);const a=i.querySelector('[data-cmd="newtab"]');a&&(a.checked=n.newTab),this.paintSwatch("color-bg",e.getStyle(t,"background-color")),this.paintSwatch("color-text",e.getStyle(t,"color")),this.paintSwatch("hover-bg",n.hoverBg),this.paintSwatch("hover-text",n.hoverColor),this.paintSwatch("hover-border",n.hoverBorder)}syncSeg(t,e){this.buttonModal.querySelectorAll(`[data-cmd="${t}"]`).forEach((t=>{t.classList.toggle("on",null!=e&&t.getAttribute("data-val")===e)}))}syncStep(t,e){const i=this.buttonModal.querySelector(`.buttoneditor-stepval[data-field="${t}"]`);i&&(i.textContent=null==e?"–":e)}syncToggle(t,e){const i=this.buttonModal.querySelector(`[data-cmd="${t}"]`);i&&i.classList.toggle("on",!!e)}paintSwatch(t,e){const i=this.buttonModal.querySelector(`.buttoneditor-swatch[data-cmd="${t}"]`);if(!i)return;const n=i.querySelector("span"),o=!e||"transparent"===e||"rgba(0, 0, 0, 0)"===e;i.classList.toggle("is-empty",o),n&&(n.style.background=o?"":e)}}class qc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector("#divLinkTool");if(!o){let s=`<div id="divLinkTool" class="is-tool">\n <button title="${i.out("Edit Button")}" data-title="${i.out("Edit Button")}" class="link-button-edit" style="display:none;">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg>\n </button>\n <button title="${i.out("Link")}" data-title="${i.out("Link")}" class="link-edit">\n <svg class="is-icon-flex" style="width:17px;height:17px;transform:rotate(45deg)"><use xlink:href="#icon-link2"></use></svg>\n </button>\n <button title="${i.out("Duplicate")}" data-title="${i.out("Duplicate")}" class="link-duplicate">\n <svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-duplicate3"></use></svg>\n </button>\n <button title="${i.out("Delete")}" data-title="${i.out("Delete")}" class="link-remove">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector("#divLinkTool"):t.querySelector("#divLinkTool"),this.linkTool=o;let l=o.querySelector(".link-edit");n.addEventListener(l,"click",(()=>{this.editLink()}));let a=o.querySelector(".link-button-edit");n.addEventListener(a,"click",(()=>{this.editButton()}));let r=o.querySelector(".link-duplicate");n.addEventListener(r,"click",(()=>{if(this.builder.activeLink)if(this.builder.uo.saveForUndo(),this.builder.opts.emailMode){for(var t=this.builder.activeLink;"table"!==t.tagName.toLowerCase()&&!n.hasClass(t,"button");)t=t.parentNode;let e=t=t.parentNode;const i=e.cloneNode(!0);let o=i.querySelector(".icon-active");o&&n.removeClass(o,"icon-active"),i.style.paddingRight="15px",e.parentNode.insertBefore(i,e),this.showTool(this.builder.activeLink)}else{const t=this.builder.activeLink.cloneNode(!0);let e=t.querySelector(".icon-active");e&&n.removeClass(e,"icon-active"),this.builder.activeLink.parentNode.insertBefore(t,this.builder.activeLink),this.showTool(this.builder.activeLink)}}));let c=o.querySelector(".link-remove");n.addEventListener(c,"click",(()=>{if(this.builder.uo.saveForUndo(),this.builder.opts.emailMode){for(var t=this.builder.activeLink;"table"!==t.tagName.toLowerCase()&&!n.hasClass(t,"button");)t=t.parentNode;let e=t=t.parentNode;e&&e.parentNode.removeChild(e),o.style.display=""}else this.builder.activeLink&&this.builder.activeLink.parentNode.removeChild(this.builder.activeLink),o.style.display="";this.builder.activeLink.querySelector(".icon-active")&&(this.builder.activeIcon=null)}))}}renderButtonPanel(){this.builder.builderStuff.querySelector(".is-modal.buttoneditor")||(this.buttonEditor=new Mc(this.builder))}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.createlink");if(!n){let o=`\n <div class="is-modal createlink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form">\n <div class="cb-field">\n <label for="inpCreateLinkUrl">${e.out("Link")}:</label>\n <div class="link-src">\n <input id="inpCreateLinkUrl" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select">\n ${this.builder.opts.selectIcon}\n </button>\n <button title="${e.out(this.builder.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:50px">\n ${this.builder.opts.otherSelectIcon}\n </button>\n <div class="div-anyfile-upload is-btn classic" style="position: relative; flex: 0 0 auto; width: 50px; height: var(--cb-field-height); box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetAnyfileUpload" method="post" action="${this.builder.opts.fileHandler}" enctype="multipart/form-data" style="overflow:hidden;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:1px;display:flex;align-items: center;justify-content: center;">\n <input class="input-anyfile-customval" name="hidRefId" type="hidden" value="${this.builder.customval}" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input type="file" onclick="blur()" tabindex="0" class="input-anyfile-upload" name="fileImage" accept="*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;"/>\n </form>\n <iframe tabindex="-1" id="frameTargetAnyfileUpload" name="frameTargetAnyfileUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n <div class="cb-field">\n <label class="label-checkbox">\n <input class="input-newwindow" id="__input_newwindow" type="checkbox" /> ${e.out("Open new window")}\n </label>\n <label class="label-checkbox" id="lblOpenLightbox" style="${this.builder.useLightbox?"":"display:none"}">\n <input class="input-openlightbox" id="__input_openlightbox" type="checkbox" /> ${e.out("Open in a lightbox (for image, video or Youtube)")}\n </label>\n </div>\n <div class="cb-field">\n <label id="lblCreateLinkText" for="inpCreateLinkText">${e.out("Text")}:</label>\n <input id="inpCreateLinkText" class="input-text" type="text"/>\n </div>\n <div class="cb-field">\n <label for="inpCreateLinkTitle">${e.out("Title")}:</label>\n <input id="inpCreateLinkTitle" class="input-title" type="text"/>\n </div>\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.createlink"),this.modal=n,""!==this.builder.opts.fileHandler||this.builder.opts.onFileUpload||(t.querySelector(".div-anyfile-upload").style.display="none");let s=t.querySelector(".input-anyfile-upload");i.addEventListener(s,"change",(t=>{let e=s;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),this.builder.opts.onFileUpload?this.builder.opts.onFileUpload(t):n.submit(),s.value=""}));let l=n.querySelector(".input-ok");i.addEventListener(l,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeLink;if(t){let o=n.querySelector(".input-url").value,s=n.querySelector(".input-title").value,l=n.querySelector(".input-text").value;if(""===l&&(l=o),"inscribe"===this.builder.opts.engine&&!this.builder.activeIcon){const a=this.builder.editingEngine.active;if(a&&t.isConnected){if(i.selectElementContents(t),""!==o){const t={target:n.querySelector(".input-newwindow").checked?"_blank":"",title:s||"",class:n.querySelector(".input-openlightbox").checked?"is-lightbox":""},r=a.link(o,t);r&&l&&r.textContent!==l&&(r.textContent=l),this.builder.opts.onChange(),e.hideModal(n),r&&r.isConnected&&(a.focus(),i.selectElementContents(r),e.saveSelection())}else a.unlink(),this.hideTool(),this.builder.opts.onChange(),e.hideModal(n);return}}if(""!==o)t.setAttribute("href",o),n.querySelector(".input-newwindow").checked?t.setAttribute("target","_blank"):t.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(t,"is-lightbox"):i.removeClass(t,"is-lightbox"),this.builder.activeIcon||(t.innerHTML=l),t.setAttribute("title",s);else if(this.hideTool(),this.builder.activeIcon){this.builder.activeIcon.setAttribute("dummy-sel",""),t.outerHTML=this.builder.activeIcon.outerHTML;let e=this.builder.doc.querySelector("[dummy-sel]");e.removeAttribute("dummy-sel"),this.builder.activeIcon=e,this.builder.activeIcon.click()}else t.outerHTML=t.innerHTML;this.builder.opts.onChange()}else{e.restoreSelection();let t=n.querySelector(".input-url").value,o=n.querySelector(".input-title").value,s=n.querySelector(".input-text").value;if(""===s&&(s=t),""!==t){if("inscribe"===this.builder.opts.engine&&!this.builder.activeIcon&&!this.builder.activeSvg){const l=this.builder.editingEngine.active;if(l){const a={};let r;return n.querySelector(".input-newwindow").checked&&(a.target="_blank"),o&&(a.title=o),n.querySelector(".input-openlightbox").checked&&(a.class="is-lightbox"),r=l.hasLiveSelection()?l.link(t,a):l.insertLink(t,s,a),this.builder.opts.onChange(),this.builder.opts.onRender(),e.hideModal(n),void(r&&r.isConnected&&(l.focus(),i.selectElementContents(r),e.saveSelection()))}}let l;if(this.builder.uo.saveForUndo(),this.builder.activeIcon){let s=this.builder.activeIcon.outerHTML;this.builder.activeIcon.outerHTML=`<a dummy-sel="1" href="${t}">${s}</a>`,l=this.builder.doc.querySelector("[dummy-sel]"),l.removeAttribute("dummy-sel"),n.querySelector(".input-newwindow").checked?l.setAttribute("target","_blank"):l.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(l,"is-lightbox"):i.removeClass(l,"is-lightbox"),l.setAttribute("title",o),this.builder.activeIcon=l.childNodes[0],e.appleMobile||(this.builder.activeIcon.click(),i.selectElementContents(this.builder.activeIcon),this.builder.doc.selection?this.builder.doc.selection.empty():window.getSelection().removeAllRanges())}else{const e=this.builder.selectionText,l=this.builder.selectionElm;let a;if(e){a=e;const l=a.getRangeAt(0),r=l.extractContents(),c=this.builder.doc.createElement("a");c.setAttribute("href",t),c.setAttribute("title",o),n.querySelector(".input-newwindow").checked?c.setAttribute("target","_blank"):c.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(c,"is-lightbox"):i.removeClass(c,"is-lightbox"),c.appendChild(r),l.insertNode(c),c.innerHTML=s,a.selectAllChildren(c)}else if(l){a=l,l.innerHTML=`<a class="dummylink" href="dummy">${s}</a>`;let e=this.builder.doc.querySelector(".dummylink");e.setAttribute("href",t),e.setAttribute("title",o),n.querySelector(".input-newwindow").checked?e.setAttribute("target","_blank"):e.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(e,"is-lightbox"):i.removeClass(e,"is-lightbox"),i.selectElementContents(e),i.removeClass(e,"dummylink")}}}e.saveSelection(),this.builder.opts.onChange(),this.builder.opts.onRender()}e.hideModal(n)}));let a=n.querySelector(".input-cancel");if(i.addEventListener(a,"click",(()=>{e.hideModal(n),e.appleMobile||e.restoreSelection()})),this.builder.opts.onOtherSelectClick||""!==this.builder.opts.otherSelect){n.querySelector(".input-select-other").style.display="block";let o=n.querySelector(".input-select-other");i.addEventListener(o,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:n.querySelector(".input-url"),theTrigger:n.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{o.removeAttribute("data-focus"),o.focus()}),!1,this.builder.assetPanelFullScreen),o.setAttribute("data-focus",!0)}this.builder.targetInput=n.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}if(this.builder.opts.onFileSelectClick||""!==this.builder.opts.fileselect){n.querySelector(".input-select").style.display="block",n.querySelector(".input-url").style.width="444px";let o=n.querySelector(".input-select");i.addEventListener(o,"click",(()=>{if(this.builder.opts.onFileSelectClick)this.builder.opts.onFileSelectClick({targetInput:n.querySelector(".input-url"),theTrigger:n.querySelector(".input-select")});else{let i=t.querySelector(".is-modal.fileselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.fileselect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.fileselect),e.showModal(i,!1,null,!1,this.builder.assetPanelFullScreen)}this.builder.targetInput=n.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="all"}))}else n.querySelector(".input-select").style.display="none",n.querySelector(".input-url").style.width="100%"}}click(t,e){const i=this.builder.dom;let n=!1;t.hasAttribute("data-html")&&(n=!0);let o=!1;t.hasAttribute("data-noedit")&&(o=!0);let s=!1;t.hasAttribute("data-protected")&&(s=!0);const l=e.target;if(this.builder.activeLink=null,this.builder.activeLinkButton=null,("a"===l.tagName.toLowerCase()||i.parentsHasTag(l,"a"))&&!n&&!o&&!s){if(l.childNodes.length>0&&l.childNodes[0].tagName&&"i"===l.childNodes[0].tagName.toLowerCase()&&1===l.childNodes.length&&""===l.childNodes[0].innerHTML){const t=document.querySelectorAll(".icon-active");Array.prototype.forEach.call(t,(t=>{i.removeClass(t,"icon-active")})),i.addClass(l.childNodes[0],"icon-active"),i.selectElementContents(l.childNodes[0]),this.builder.activeIcon=l.childNodes[0]}if("img"===l.tagName.toLowerCase())return;let t,n;if("a"===l.tagName.toLowerCase())t=l;else{let e=l;for(;"a"!==e.tagName.toLowerCase();)e=e.parentNode;t=e}this.builder.activeLink=t;let o=i.getStyle(t,"display");"inline-block"!==o&&"block"!==o&&"flex"!==o||(n=!0),n&&(this.builder.activeLinkButton=t),this.showTool(t),e.preventDefault()}}showTool(t){this.renderTool();const e=this.linkTool,i=this.builder.dom;let n,o;"inline"===i.getStyle(t,"display")&!this.builder.activeIcon?(e.querySelector(".link-duplicate").style.display="none",e.querySelector(".link-remove").style.display="none"):(e.querySelector(".link-duplicate").style.display="block",e.querySelector(".link-remove").style.display="block"),this.builder.useButtonPlugin?e.querySelector(".link-button-edit").style.display="none":t&&this.builder.activeLinkButton?e.querySelector(".link-button-edit").style.display="block":e.querySelector(".link-button-edit").style.display="none",this.buttonEditor&&i.hasClass(this.buttonEditor.buttonModal,"active")&&this.buttonEditor.realtime(),o=t.getBoundingClientRect().top+this.builder.win.pageYOffset,this.builder.activeIcon&&(o=this.builder.activeIcon.getBoundingClientRect().top+this.builder.win.pageYOffset),n=t.getBoundingClientRect().left,e.style.display="flex";const s=e.offsetWidth,l=e.offsetHeight;e.style.top=o-l-3+"px",e.style.left=n+t.offsetWidth*this.builder.opts.zoom-s+"px";const a=t=>{const e=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let i=t.target;i&&(i.closest("#divLinkTool")||i.closest(".is-modal")||i.closest(".keep-selection")||i.closest("a")||e||(this.hideTool(),this.buttonEditor&&this.buttonEditor.hide(),document.removeEventListener("click",a),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",a),this.builder.handleLinkButtonClick_=!1))};this.builder.handleLinkButtonClick_||(document.addEventListener("click",a),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",a),this.builder.handleLinkButtonClick_=!0)}hideTool(){this.linkTool&&(this.linkTool.style.display="")}editButton(){this.builder.opts.onButtonEdit?this.builder.opts.onButtonEdit(this.builder.activeLinkButton||this.builder.activeLink):(this.renderButtonPanel(),this.buttonEditor.open())}createLink(){this.renderPanel();const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(e.getSelection(),"inscribe"===this.builder.opts.engine){const t=this.builder.editingEngine.active;let e=t?t.linkElement():null;if(!e){const t=this.builder.selection;if(t&&t.length)for(const i of t){let t=i&&i.startContainer;t&&3===t.nodeType&&(t=t.parentNode);const n=t&&t.closest?t.closest("a"):null;if(n&&n.closest(".is-builder")){e=n;break}}}this.builder.activeLink=e||null}let n=i.getSelected(),o=t.querySelector(".is-modal.createlink");o.querySelector(".input-url").value="",o.querySelector(".input-newwindow").checked=!1,o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value="",o.querySelector(".input-text").value="",o.querySelector("#lblCreateLinkText").style.display="",o.querySelector("#inpCreateLinkText").style.display="";let s=this.builder.activeLink;if(s){let t=s.getAttribute("href"),e=s.getAttribute("target"),n=s.getAttribute("title"),l=s.innerHTML;o.querySelector(".input-url").value=t,o.querySelector(".input-newwindow").checked="_blank"===e,i.hasClass(s,"is-lightbox")?o.querySelector(".input-openlightbox").checked=!0:o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value=n,o.querySelector(".input-text").value=l}else o.querySelector(".input-text").value=n,this.builder.activeIcon&&(o.querySelector("#lblCreateLinkText").style.display="none",o.querySelector("#inpCreateLinkText").style.display="none");e.showModal(o,!0,(()=>{e.appleMobile||e.restoreSelection()}),!0),o.querySelector(".input-url").focus()}editLink(){this.renderPanel();const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=this.builder.activeLink,o=t.querySelector(".is-modal.createlink"),s=n.querySelector("i");o.querySelector("#lblCreateLinkText").style.display="",o.querySelector("#inpCreateLinkText").style.display="",1===n.childElementCount&&s&&i.hasClass(s,"icon")&&(o.querySelector("#lblCreateLinkText").style.display="none",o.querySelector("#inpCreateLinkText").style.display="none");let l=n.getAttribute("href"),a=n.getAttribute("target"),r=n.getAttribute("title"),c=n.innerHTML;o.querySelector(".input-url").value=l,o.querySelector(".input-newwindow").checked="_blank"===a,i.hasClass(n,"is-lightbox")?o.querySelector(".input-openlightbox").checked=!0:o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value=r,o.querySelector(".input-text").value=c,e.showModal(o,!0,null,!0),o.querySelector(".input-url").focus()}}class Rc{constructor(t){this.builder=t}renderTool(){const t=this.builder.util,e=this.builder.builderStuff,i=this.builder.contentStuff,n=this.builder.dom;this.dom=n,this.builderStuff=e;let o=e.querySelector("#divButtonTool");if(!o){let s=`<div id="divButtonTool" class="is-tool">\n <button title="${t.out("Edit Button")}" data-title="${t.out("Edit Button")}" class="button-edit">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg>\n </button>\n <button title="${t.out("Duplicate")}" data-title="${t.out("Duplicate")}" class="button-duplicate">\n <svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-duplicate3"></use></svg>\n </button>\n <button title="${t.out("Delete")}" data-title="${t.out("Delete")}" class="button-remove">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;n.appendHtml(e,s),o=this.builder.iframe?i.querySelector("#divButtonTool"):e.querySelector("#divButtonTool"),this.buttonTool=o;let l=o.querySelector(".button-edit");n.addEventListener(l,"click",(()=>{this.editButton()}));let a=o.querySelector(".button-duplicate");n.addEventListener(a,"click",(()=>{if(this.builder.activeButton){this.builder.uo.saveForUndo();const t=this.builder.activeButton.cloneNode(!0);let e=t.querySelector(".elm-active");e&&n.removeClass(e,"elm-active"),this.builder.activeButton.parentNode.insertBefore(t,this.builder.activeButton),this.showTool(this.builder.activeButton)}}));let r=o.querySelector(".button-remove");n.addEventListener(r,"click",(()=>{this.builder.uo.saveForUndo(),this.builder.activeButton&&this.builder.activeButton.parentNode.removeChild(this.builder.activeButton),o.style.display="",this.builder.activeButton=null}))}}renderPanel(){this.builderStuff.querySelector(".is-modal.buttoneditor")||(this.buttonEditor=new Mc(this.builder))}click(t,e){let i=!1;t.hasAttribute("data-html")&&(i=!0);let n=!1;t.hasAttribute("data-noedit")&&(n=!0);let o=!1;t.hasAttribute("data-protected")&&(o=!0);const s=e.target;this.builder.activeButton=null;const l=s.closest("button");if(l&&!i&&!n&&!o){this.builder.activeButton=l,this.renderTool(),this.showTool(l);const t=e=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=e.target;n&&(n.closest("#divButtonTool")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("button")||i||(this.hideTool(),this.buttonEditor&&this.buttonEditor.hide(),document.removeEventListener("click",t),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",t),this.builder.handleButtonClick_=!1))};this.builder.handleButtonClick_||(document.addEventListener("click",t),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",t),this.builder.handleButtonClick_=!0),e.preventDefault()}}editButton(){this.builder.opts.onButtonEdit?this.builder.opts.onButtonEdit(this.builder.activeButton):(this.renderPanel(),this.buttonEditor.open())}showTool(t){const e=this.builder.dom;this.buttonEditor&&e.hasClass(this.buttonEditor.buttonModal,"active")&&this.buttonEditor.realtime();const i=this.buttonTool;let n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left;i.style.display="flex";const s=i.offsetWidth,l=i.offsetHeight;i.style.top=n-l-3+"px",i.style.left=o+t.offsetWidth*this.builder.opts.zoom-s+"px"}hideTool(){this.buttonTool&&(this.buttonTool.style.display="")}}class Ic{constructor(t){this.builder=t}renderTool(){if(this.spacerTool)return;const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-spacer-tool");if(!o){let s=`\n <div id="divSpacerTool" class="is-tool is-spacer-tool">\n <button title="${i.out("Decrease")}" data-value="-"><svg class="is-icon-flex"><use xlink:href="#icon-minus2"></use></svg></button>\n <button title="${i.out("Increase")}" data-value="+" style="border-left: none;"><svg class="is-icon-flex"><use xlink:href="#icon-plus"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-spacer-tool"):t.querySelector(".is-spacer-tool"),this.spacerTool=o;const l=o.querySelectorAll("button");Array.prototype.forEach.call(l,(t=>{n.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-value");let i=this.builder.activeSpacer;"-"===e?n.hasClass(i,"height-300")?(n.removeClass(i,"height-300"),n.addClass(i,"height-280")):n.hasClass(i,"height-280")?(n.removeClass(i,"height-280"),n.addClass(i,"height-260")):n.hasClass(i,"height-260")?(n.removeClass(i,"height-260"),n.addClass(i,"height-240")):n.hasClass(i,"height-240")?(n.removeClass(i,"height-240"),n.addClass(i,"height-220")):n.hasClass(i,"height-220")?(n.removeClass(i,"height-220"),n.addClass(i,"height-200")):n.hasClass(i,"height-200")?(n.removeClass(i,"height-200"),n.addClass(i,"height-180")):n.hasClass(i,"height-180")?(n.removeClass(i,"height-180"),n.addClass(i,"height-160")):n.hasClass(i,"height-160")?(n.removeClass(i,"height-160"),n.addClass(i,"height-140")):n.hasClass(i,"height-140")?(n.removeClass(i,"height-140"),n.addClass(i,"height-120")):n.hasClass(i,"height-120")?(n.removeClass(i,"height-120"),n.addClass(i,"height-100")):n.hasClass(i,"height-100")?(n.removeClass(i,"height-100"),n.addClass(i,"height-80")):n.hasClass(i,"height-80")?(n.removeClass(i,"height-80"),n.addClass(i,"height-60")):n.hasClass(i,"height-60")?(n.removeClass(i,"height-60"),n.addClass(i,"height-40")):n.hasClass(i,"height-40")&&(n.removeClass(i,"height-40"),n.addClass(i,"height-20")):n.hasClass(i,"height-20")?(n.removeClass(i,"height-20"),n.addClass(i,"height-40")):n.hasClass(i,"height-40")?(n.removeClass(i,"height-40"),n.addClass(i,"height-60")):n.hasClass(i,"height-60")?(n.removeClass(i,"height-60"),n.addClass(i,"height-80")):n.hasClass(i,"height-80")?(n.removeClass(i,"height-80"),n.addClass(i,"height-100")):n.hasClass(i,"height-100")?(n.removeClass(i,"height-100"),n.addClass(i,"height-120")):n.hasClass(i,"height-120")?(n.removeClass(i,"height-120"),n.addClass(i,"height-140")):n.hasClass(i,"height-140")?(n.removeClass(i,"height-140"),n.addClass(i,"height-160")):n.hasClass(i,"height-160")?(n.removeClass(i,"height-160"),n.addClass(i,"height-180")):n.hasClass(i,"height-180")?(n.removeClass(i,"height-180"),n.addClass(i,"height-200")):n.hasClass(i,"height-200")?(n.removeClass(i,"height-200"),n.addClass(i,"height-220")):n.hasClass(i,"height-220")?(n.removeClass(i,"height-220"),n.addClass(i,"height-240")):n.hasClass(i,"height-240")?(n.removeClass(i,"height-240"),n.addClass(i,"height-260")):n.hasClass(i,"height-260")?(n.removeClass(i,"height-260"),n.addClass(i,"height-280")):n.hasClass(i,"height-280")&&(n.removeClass(i,"height-280"),n.addClass(i,"height-300")),this.showTool(i),this.builder.opts.onChange(),this.builder.onSpacerChange&&this.builder.onSpacerChange()}))}))}}click(t){const e=this.builder.dom,i=t.target;e.hasClass(i,"spacer")?(this.builder.activeSpacer=i,document.selection?document.selection.empty():window.getSelection().removeAllRanges(),this.showTool(i)):this.hideTool()}showTool(t){this.renderTool();let e=t.getBoundingClientRect().top+this.builder.win.pageYOffset,i=t.getBoundingClientRect().left;this.spacerTool.style.display="flex";const n=this.spacerTool.offsetWidth,o=this.spacerTool.offsetHeight;this.spacerTool.style.top=e+(t.offsetHeight*this.builder.opts.zoom-o)/2+"px",this.spacerTool.style.left=i+(t.offsetWidth*this.builder.opts.zoom-n)/2+"px"}hideTool(){this.spacerTool&&(this.spacerTool.style.display="")}}const Oc=new ze;class Nc{constructor(t={}){let e={element:document};Object.assign(this,e,t);const i=()=>{let t=this.element.querySelectorAll(".is-tabs-more");Array.prototype.forEach.call(t,(t=>{t.style.display="none",t.setAttribute("aria-expanded",!1)})),document.removeEventListener("click",n)},n=t=>{t.target.closest(".is-tab-more")||t.target.closest("[data-menu]")||i()},o=t=>{const e=t.parentNode.getAttribute("data-group"),o=t.getAttribute("data-menu");if(o){document.addEventListener("click",n),t.setAttribute("aria-expanded",!0),this.element.querySelector("#"+o).style.display="block";let i=this.element.querySelector('.is-tabs-more[data-group="'+e+'"] > li.active');if(i)i.focus();else{this.element.querySelector('.is-tabs-more[data-group="'+e+'"]').focus()}return!1}if(Oc.hasClass(t,"active"))return!1;const s=t.getAttribute("data-content");if(!s)return!1;let l=this.element.querySelectorAll('.is-tabs[data-group="'+e+'"] > a');Array.prototype.forEach.call(l,(t=>{Oc.removeClass(t,"active")})),l=this.element.querySelectorAll('.is-tabs-more[data-group="'+e+'"] > li'),Array.prototype.forEach.call(l,(t=>{Oc.removeClass(t,"active")})),Oc.addClass(t,"active");let a=this.element.querySelectorAll('.is-tab-content[data-group="'+e+'"]');Array.prototype.forEach.call(a,(t=>{t.style.display="none",Oc.removeClass(t,"active")}));const r=this.element.querySelector("#"+s);r.style.display="flex",Oc.addClass(r,"active");const c=this.element.querySelector(".is-tabs-more");return c&&(c.style.display="none"),i(),this.setupTabKey(r),!1};let s=this.element.querySelectorAll(".is-tabs a");Array.prototype.forEach.call(s,(t=>{t.addEventListener("keydown",(e=>{if(e.preventDefault(),39===e.which&&e.target.nextElementSibling)e.target.nextElementSibling.focus();else if(37===e.which&&e.target.previousElementSibling)e.target.previousElementSibling.focus();else if(13===e.keyCode||32===e.keyCode)o(e.target);else if(9===e.which&&!e.shiftKey){let e=[];const i=t.parentNode.getAttribute("data-group");if(t.parentNode.parentNode.querySelector('.is-tab-content[data-group="'+i+'"].active').querySelectorAll('.is-tabs.active, a[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex]').forEach((t=>{e.push(t)})),0===e.length)return;e[0].focus()}})),t.addEventListener("click",(t=>{t.preventDefault(),o(t.target)}))}));const l=this.element.querySelectorAll(".is-tabs-more");Array.prototype.forEach.call(l,(t=>{t.addEventListener("keydown",(e=>{e.preventDefault(),40===e.keyCode&&e.target.nextElementSibling?t.querySelector("li").focus():27===e.keyCode&&i()}))})),s=this.element.querySelectorAll(".is-tabs-more li"),Array.prototype.forEach.call(s,(t=>{t.addEventListener("keydown",(e=>{if(e.preventDefault(),e.stopImmediatePropagation(),38===e.keyCode&&e.target.previousElementSibling)e.target.previousElementSibling.focus();else if(40===e.keyCode&&e.target.nextElementSibling)e.target.nextElementSibling.focus();else if(27===e.keyCode)i();else if((13===e.keyCode||32===e.keyCode)&&(o(e.target),e.target.closest(".is-tabs-more"))){const e=t.parentNode.getAttribute("id"),i=this.element.querySelector('.is-tabs a[data-menu="'+e+'"]');i&&i.focus()}})),t.addEventListener("click",(e=>{if(e.preventDefault(),o(e.target),e.target.closest(".is-tabs-more")){const e=t.parentNode.getAttribute("id"),i=this.element.querySelector('.is-tabs a[data-menu="'+e+'"]');i&&i.focus()}}))}))}setupTabKey(t){let e=[];if(t.querySelectorAll('.is-tabs.active, a[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex]').forEach((t=>{e.push(t)})),0===e.length)return;let i=e[0];e[e.length-1].addEventListener("keydown",(e=>{if(9===e.which&&!e.shiftKey){e.preventDefault();let i=t.getAttribute("id");const n=this.element.querySelector('li[data-content="'+i+'"],a[data-content="'+i+'"]');if(n.closest(".is-tabs-more")){i=n.parentNode.getAttribute("id");const t=this.element.querySelector('.is-tabs a[data-menu="'+i+'"]');t&&t.focus()}else n.focus()}})),i.addEventListener("keydown",(e=>{if(9===e.which&&e.shiftKey){e.preventDefault();let i=t.getAttribute("id");const n=this.element.querySelector('li[data-content="'+i+'"],a[data-content="'+i+'"]');if(n.closest(".is-tabs-more")){i=n.parentNode.getAttribute("id");const t=this.element.querySelector('.is-tabs a[data-menu="'+i+'"]');t&&t.focus()}else n.focus()}}))}}class $c{constructor(t,e){this.runtime=t,this.builder=e}t(t){return null==t?t:this.builder&&"function"==typeof this.builder.out?this.builder.out(t):t}generateForm(t,e,i){const n=this.runtime.getPlugin(t);if(!n)return this.createEmptyForm();if(!n.settings&&!n.editor)return this.createEmptyForm();n.settings||(n.settings={});const o=document.createElement("div");o.className="cb-settings-form";const s=this.getCurrentValues(e,n.settings);n.settings._groups?this.generateGroupedForm(o,n.settings,s):this.generateFlatForm(o,n.settings,s),o._cbBaseValues=this.getBaseValues(n.settings,s);const l=()=>this.updateConditionalFields(o);return l(),o.addEventListener("input",l),o.addEventListener("change",l),"function"==typeof i&&o.addEventListener("input",(()=>{const t=this.getFormValues(o);i(t,e)})),o}generateFlatForm(t,e,i){Object.keys(e).forEach((n=>{if(n.startsWith("_"))return;const o=e[n];if(o.hidden)return;const s=this.createField(n,o,i[n]);t.appendChild(s)}))}generateGroupedForm(t,e,i){(e._groups||[]).forEach((n=>{const o=document.createElement("div");o.className="cb-settings-group";const s=document.createElement("h3");s.className="cb-settings-group-title",s.style.cssText="font-size: 16px;font-weight: 400;",s.textContent=this.t(n.label),o.appendChild(s),n.fields.forEach((t=>{const n=e[t];if(!n)return;if(n.hidden)return;const s=this.createField(t,n,i[t]);o.appendChild(s)})),t.appendChild(o)}))}updateConditionalFields(t){const e=t.querySelectorAll("[data-depends-on]");if(!e.length)return;const i=Object.assign({},t._cbBaseValues,this.getFormValues(t));e.forEach((t=>{const e=t._cbDependsOn||this.parseDependsOn(t.getAttribute("data-depends-on"));t.style.display=this.matchesDependsOn(e,i)?"":"none"})),t.querySelectorAll(".cb-settings-group").forEach((t=>{const e=t.querySelectorAll(".cb-settings-field");if(!e.length)return;const i=Array.prototype.some.call(e,(t=>"none"!==t.style.display));t.style.display=i?"":"none"}))}getBaseValues(t,e){const i={};return t?(Object.keys(t).forEach((e=>{e.startsWith("_")||t[e]&&void 0!==t[e].default&&(i[e]=t[e].default)})),Object.assign(i,e)):i}parseDependsOn(t){try{return JSON.parse(t)}catch(t){return null}}matchesDependsOn(t,e){if(!t)return!0;return(Array.isArray(t)?t:[t]).every((t=>{if(!t||!t.field)return!0;if(!(t.field in e))return!0;const i=e[t.field];return"not"in t?!this.dependsOnValueMatches(t.not,i):"value"in t?this.dependsOnValueMatches(t.value,i):void 0!==i&&""!==i&&!1!==i&&"false"!==i}))}dependsOnValueMatches(t,e){return(Array.isArray(t)?t:[t]).some((t=>String(t)===String(e)))}createField(t,e,i){const n=document.createElement("div");n.className="cb-settings-field",n.style.marginBottom="10px",n.setAttribute("data-field",t),e.dependsOn&&(n.setAttribute("data-depends-on",JSON.stringify(e.dependsOn)),n._cbDependsOn=e.dependsOn,n.style.display="none");const o=document.createElement("label");o.className="cb-settings-label",o.textContent=this.t(e.label||t);const s=this.createInput(t,e,i);return n.appendChild(s),n}createInput(t,e,i){const n=void 0!==i?i:e.default;switch(e.type){case"number":return this.createNumberInput(t,e,n);case"boolean":return this.createCheckboxInput(t,e,n);case"select":return this.createSelectInput(t,e,n);case"radio":return this.createRadioInput(t,e,n);case"textarea":return this.createTextareaInput(t,e,n);case"color":return this.createColorInput(t,e,n);case"range":return this.createRangeInput(t,e,n);default:return this.createTextInput(t,e,n)}}createTextInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("input");if(s.type="text",s.name=t,s.value=i||"",e.placeholder&&(s.placeholder=this.t(e.placeholder)),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createNumberInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),e.unit&&(o.textContent+=` (${e.unit})`),n.appendChild(o);const s=document.createElement("input");if(s.type="number",s.style.cssText="width: 100px;",s.name=t,s.value=void 0!==i?i:e.default,void 0!==e.min&&(s.min=e.min),void 0!==e.max&&(s.max=e.max),void 0!==e.step&&(s.step=e.step),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createCheckboxInput(t,e,i){const n=document.createElement("label");n.className="label checkbox";const o=document.createElement("div"),s=document.createElement("input");s.type="checkbox",s.name=t,s.checked=void 0!==i?i:e.default;const l=document.createElement("span");if(l.textContent=this.t(e.label||t),n.appendChild(s),n.appendChild(l),o.appendChild(n),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),o.appendChild(t)}return n}createSelectInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createTextNode(this.t(e.label||t));n.appendChild(o);const s=document.createElement("select");if(s.name=t,e.options.forEach((t=>{const e=document.createElement("option");e.value=t.value,e.textContent=this.t(t.label),t.value===i&&(e.selected=!0),s.appendChild(e)})),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createRadioInput(t,e,i){const n=document.createElement("div"),o=document.createElement("div");if(o.textContent=this.t(e.label||t),o.style.cssText="margin-bottom: 8px;font-weight: 590;",n.appendChild(o),e.options.forEach((e=>{const o=document.createElement("label");o.className="label checkbox";const s=document.createElement("input");s.type="radio",s.name=t,s.value=e.value,s.checked=e.value===i;const l=document.createElement("span");l.textContent=this.t(e.label),o.appendChild(s),o.appendChild(l),n.appendChild(o)})),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createTextareaInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("textarea");if(s.name=t,s.value=i||"",s.rows=e.rows||4,e.placeholder&&(s.placeholder=this.t(e.placeholder)),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}hexToRgba(t){if(/^rgba?\(/i.test(t))return t;3!==(t=t.replace(/^#/,"")).length&&4!==t.length||(t=t.split("").map((t=>t+t)).join(""));return`rgba(${parseInt(t.substring(0,2),16)}, ${parseInt(t.substring(2,4),16)}, ${parseInt(t.substring(4,6),16)}, ${8===t.length?parseInt(t.substring(6,8),16)/255:1})`}toHex(t){const e=document.createElement("canvas").getContext("2d");e.fillStyle=t;const i=e.fillStyle;if(i.startsWith("#"))return i;const n=i.match(/\d+(\.\d+)?/g).map(Number),[o,s,l,a=1]=n,r=[o,s,l].map((t=>t.toString(16).padStart(2,"0"))).join(""),c=Math.round(255*a).toString(16).padStart(2,"0");return a<1?`#${r}${c}`:`#${r}`}createColorInput(t,e,i){const n=document.createElement("div"),o=document.createElement("label");o.className="label",o.style.cursor="pointer";const s=document.createElement("div");s.textContent=this.t(e.label||t),o.appendChild(s);const l=document.createElement("input");l.type="hidden",l.name=t,l.value=i||e.default||"#000000";const a=document.createElement("div");a.className="group",a.style.cssText="width: 52px; margin:0; overflow: visible;";const r=document.createElement("button");r.type="button",r.title=this.t(e.label||"Color"),r.className="btn-color is-btn-color",r.style.backgroundColor=this.hexToRgba(l.value),r.setAttribute("aria-label",`Choose color for ${this.t(e.label||t)}`);if(r.addEventListener("click",(t=>{t.preventDefault(),this.builder.openColorPicker(l.value,(t=>{const e=this.toHex(t);l.value=e,r.style.backgroundColor=t,l.dispatchEvent(new Event("input",{bubbles:!0}))}),r)})),o.addEventListener("click",(t=>{t.target!==o&&t.target!==s||r.click()})),a.appendChild(r),o.appendChild(l),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),o.appendChild(t)}return n.appendChild(o),n.appendChild(a),n}createColorInput2(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("input");if(s.type="color",s.name=t,s.style.cssText="width:40px;height:40px",s.value=i||e.default||"#000000",n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createRangeInput(t,e,i){const n=document.createElement("label");n.className="label";const o=void 0!==i?i:e.default,s=document.createElement("div");s.textContent=this.t(e.label||t)+": "+o+(e.unit||""),n.appendChild(s);const l=document.createElement("input");if(l.type="range",l.className="is-rangeslider",l.name=t,void 0!==e.min&&(l.min=e.min),void 0!==e.max&&(l.max=e.max),void 0!==e.step&&(l.step=e.step),l.value=o,l.addEventListener("input",(()=>{s.textContent=this.t(e.label||t)+": "+l.value+(e.unit||"")})),n.appendChild(l),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}getCurrentValues(t,e){const i={};return e?(Object.keys(e).forEach((n=>{if(n.startsWith("_"))return;const o="data-cb-"+n.replace(/([A-Z])/g,"-$1").toLowerCase(),s=t.getAttribute(o);null!==s&&(i[n]=this.parseValue(s,e[n].type))})),i):i}parseValue(t,e){switch(e){case"number":return parseFloat(t);case"boolean":return"true"===t;default:return t}}getFormValues(t){const e={};return t.querySelectorAll("input, select, textarea").forEach((t=>{const i=t.name;i&&("checkbox"===t.type?e[i]=t.checked:"radio"===t.type?t.checked&&(e[i]=t.value):e[i]=t.value)})),e}applyValues(t,e){Object.keys(e).forEach((i=>{const n="data-cb-"+i.replace(/([A-Z])/g,"-$1").toLowerCase();t.setAttribute(n,e[i])}))}createEmptyForm(){const t=document.createElement("div");return t.className="cb-settings-form",t.innerHTML="<p>This plugin has no configurable settings.</p>",t}}class Pc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-plugin-tool");if(!o){let s=`\n <div class="is-tool is-plugin-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-plugin-tool"):t.querySelector(".is-plugin-tool"),this.pluginTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.pluginModal&&this.pluginModal.classList.contains("active")?this.hidePluginEditor():(this.renderPanel(),this.showPluginEditor()),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.pluginsettings");if(!n){let o=`\n <div class="is-modal is-modal-content pluginsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n <span>${e.out("Plugin Settings")}</span>\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="is-modal-controls" style="box-sizing:border-box;padding:30px;overflow-y: auto;">\n <div class="is-tabs" data-group="table">\n <a title="${e.out("Style")}" id="tabTableGeneral" href="" data-content="divTableGeneral" class="active">${e.out("Style")}</a>\n <a title="${e.out("Layout")}" id="tabTableLayout" href="" data-content="divTableLayout">${e.out("Layout")}</a>\n </div>\n <div id="divTableGeneral" class="is-tab-content active" tabindex="-1" data-group="table" style="display:block">\n\n <div style="display:flex;padding-bottom:12px">\n <div style="padding-right:15px">\n <div>${e.out("Background")}:</div>\n <div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor is-btn-color"></button>\n </div>\n </div>\n <div>\n <div>${e.out("Text Color")}:</div>\n <div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor is-btn-color"></button>\n </div>\n </div>\n </div>\n\n <div style="padding-bottom:12px;">\n <div>${e.out("Border Thickness")}:</div>\n <div>\n <select id="selCellBorderWidth" style="width:120px;"><option value="0">No Border</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select> \n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Border Color")}:</div>\n <div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor is-btn-color"></button>\n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Apply To")}:</div>\n <div>\n <select id="selTableApplyTo" style="width:120px;">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option> \n <option value="currentcell">${e.out("Current Cell")}</option> \n </select>\n </div>\n </div>\n\n </div>\n\n <div id="divTableLayout" class="is-tab-content" tabindex="-1" data-group="table">\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Insert Row")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Above")}" data-table-cmd="rowabove" title="${e.out("Above")}" style="margin-right:15px"> ${e.out("Above")} </button>\n <button class="classic" title="${e.out("Below")}" data-table-cmd="rowbelow" title="${e.out("Below")}" style=""> ${e.out("Below")} </button>\n </div> \n </div>\n \n <div style="padding-bottom:15px;">\n <div>${e.out("Insert Column")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Left")}" data-table-cmd="columnleft" title="${e.out("Left")}" style="margin-right:15px"> ${e.out("Left")} </button> \n <button class="classic" title="${e.out("Right")}" data-table-cmd="columnright" title="${e.out("Right")}" style=""> ${e.out("Right")} </button> \n </div> \n </div>\n\n <div style="padding-bottom:15px;">\n <button class="classic" title="${e.out("Delete Row")}" data-table-cmd="delrow" title="Delete Row" style=""> ${e.out("Delete Row")} </button> \n </div>\n\n <div style="padding-bottom:15px;"> \n <button class="classic" title="${e.out("Delete Column")}" data-table-cmd="delcolumn" title="Delete Column" style=""> ${e.out("Delete Column")} </button> \n </div>\n \n <div> \n <button class="classic" title="${e.out("Merge Cell")}" data-table-cmd="mergecell" style="">${e.out("Merge Cell")}</button> \n </div>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.pluginsettings"),this.pluginModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo(),this.builder.opts.onChange(),e.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{e.hideModal(n)})),new Nc({element:n}),new vs({selector:".is-modal.pluginsettings .is-draggable"})}}showPluginEditor(){const t=this.pluginModal;this.builder.util.showModal(t),this.builder.util.applyModalPosition(t,this.builder.opts.pluginSettingsPosition),this.realtime();const e=t=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=t.target,o=!document.contains(n);this.builder.doc.activeElement&&this.builder.doc.activeElement.closest(".is-modal")||n&&(n.closest(".is-plugin-tool")||n.closest(".is-sidebar")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("[data-cb-type]")||i||o||(this.hidePluginEditor(),document.removeEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",e),this.builder.handlePluginClick_=!1),n.closest("[data-cb-type]")&&this.realtime())};this.builder.handlePluginClick_||(this.builder.handlePluginClick_=!0,setTimeout((()=>{document.addEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",e)}),0))}hidePluginEditor(){const t=this.pluginModal;this.builder.destroyPanelEditors&&this.builder.destroyPanelEditors(),t&&this.builder.util.hideModal(t)}realtime(){const t=this.builder.util,e=this.pluginModal;let i=this.builder.activePlugin;const n=this.builder.win.builderRuntime;if(i&&n){const o=i.getAttribute("data-cb-type"),s=n.getPlugin(o);if(!s){const t=n.pluginManager;return void(t&&t.loadPlugin&&t.loadPlugin(o).then((t=>{t&&this.builder.activePlugin===i&&this.realtime()})))}let l=t.out(s.displayName||s.name);e.querySelector(".is-modal-bar > span").innerHTML=l;const a=e.querySelector(".is-modal-controls");this.builder.destroyPanelEditors&&this.builder.destroyPanelEditors(),a.innerHTML="";const r=document.createElement("div");r.classList.add("submain"),a.appendChild(r),this.currentElement=i,this.generator=new $c(n,this.builder);const c=s&&s.editor&&s.editor.openContentEditor;if(c){const t=i.getAttribute("data-cb-original-content");let e=document.querySelector(".editable-clone");e&&e.remove(),e=i.cloneNode(!1),e.innerHTML=t,e.className="editable-clone",e.style.display="none",document.body.appendChild(e);const o=e.cloneNode(!1),l=s.editor.openContentEditor(e,this.builder,(async()=>{this.builder.uo.saveForUndo(),i.setAttribute("data-cb-original-content",e.innerHTML);const t=((t,e)=>{const i=[];for(const n of Object.keys(t.dataset))n in e.dataset&&t.dataset[n]!==e.dataset[n]&&i.push(n);return i})(o,e);for(const n of t)i.dataset[n]=e.dataset[n];i.innerHTML=e.innerHTML,e.remove(),await n.reinitialize(i.parentElement),this.builder.onChange(),this.builder.enableEditableRegions(i)}));r.appendChild(l)}this.currentForm=this.generator.generateForm(o,i,(()=>{this.builder.uo.saveForUndo(),this.applyChanges(n)})),c&&(this.currentForm.style.marginTop="20px"),r.appendChild(this.currentForm)}}async applyChanges(t){if(!this.currentElement||!this.currentForm)return;const e=this.generator.getFormValues(this.currentForm);this.generator.applyValues(this.currentElement,e);const i=this.currentElement.parentElement||this.currentElement.closest(".is-wrapper");await t.reinitialize(i),this.builder.opts.onChange()}click(t){const e=t.target.closest("[data-cb-type]");if(e){if(this.builder.activePlugin=e,!this.builder.isContentBox){this.renderTool(),this.pluginTool.style.display="flex";let t=this.pluginTool.offsetWidth,i=this.pluginTool.offsetHeight;const n=e.getBoundingClientRect(),o=this.builder.win.pageYOffset,s=window.innerWidth;let l,a;if("SPAN"===e.tagName){const r=e.getClientRects(),c=r.length?r[r.length-1]:n;a=c.right-9,l=n.top+o-i-2,n.top-i-2<0&&(l=n.bottom+o+2),a+t>s-4&&(a=Math.max(2,c.right-t))}else{let i=e.offsetWidth*this.builder.opts.zoom;l=n.top+o,a=n.left-2+(i-t),t+a>s&&(a=n.left)}this.pluginTool.style.top=l+"px",this.pluginTool.style.left=a+"px"}}else this.builder.activePlugin=null,this.pluginTool&&(this.pluginTool.style.display="")}}class Dc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;this.dom=n;let o=t.querySelector(".is-module-tool");if(!o){let s=`\n <div class="is-tool is-module-tool">\n <button class="btn-module-refresh" title="${i.out("Refresh")}" data-title="${i.out("Refresh")}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-reload"></use></svg></button>\n <button class="btn-module-settings" title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-module-tool"):t.querySelector(".is-module-tool"),this.moduleTool=o;const l=o.querySelector(".btn-module-settings");l.addEventListener("click",(async()=>{this.edit(l)}));o.querySelector(".btn-module-refresh").addEventListener("click",(async()=>{let t=this.builder.activeModule;t.click(),i.refreshModuleLayout(t)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.custommodule");if(!n){let o=`\n\n <input id="hidContentModuleCode" type="hidden" />\n <input id="hidContentModuleSettings" type="hidden" />\n \n <div class="is-modal custommodule" tabindex="-1" role="dialog" aria-modal="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Module Settings")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <iframe tabindex="0" style="position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:90px solid transparent;border-top:40px solid transparent;margin:0;box-sizing:border-box;" src="about:blank"></iframe>\n <div style="width:100%;height:90px;padding: 20px; box-sizing: border-box;position:absolute;left:0;bottom:0;overflow:hidden;text-align:right">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div> \n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.custommodule"),this.moduleModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{let i=n.querySelector("iframe");if(!i.contentWindow.construct)return;{const t=i.contentWindow.construct();if("object"==typeof t&&null!==t&&t.error)return void alert(t.error)}this.builder.uo.saveForUndo();let o=this.builder.activeModule;o.setAttribute("data-html",encodeURIComponent(t.querySelector("#hidContentModuleCode").value)),o.setAttribute("data-settings",encodeURIComponent(t.querySelector("#hidContentModuleSettings").value));let s=t.querySelector("#hidContentModuleCode").value;s=s.replace(/{id}/g,e.makeId()),s=s.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),o.innerHTML="";var l=document.createRange();l.setStart(o,0),o.appendChild(l.createContextualFragment(s));let a=o.querySelectorAll("[data-subblock]");var r=1;Array.prototype.forEach.call(a,(t=>{o.getAttribute("data-html-"+r)&&(t.innerHTML=decodeURIComponent(o.getAttribute("data-html-"+r))),r++}));let c=this.builder.doc.querySelector(".builder-active");c&&this.builder.applyBehaviorOn(c);o.querySelectorAll(".grid-sortable").forEach((t=>{new Bt(t,{animation:600,dragClass:"hide-drag-class",onStart:()=>{this.builder.uo.saveForUndo()},onSort:()=>{if(t.closest("[data-html]")){const e=t.closest("[data-html]"),i=encodeURIComponent(e.innerHTML);e.setAttribute("data-html",i),this.builder.opts.onChange()}}})})),this.builder.opts.onChange(),this.builder.opts.onRender(),this.builder.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{this.builder.hideModal(n)})),new vs({selector:".is-modal.custommodule .is-draggable"})}}async edit(t){const e=this.builder.util,i=this.builder.dom;this.renderPanel();let n=this.builder.activeModule;const o=this.moduleModal;i.removeAttributes(this.builder.doc.querySelectorAll("[data-module-active]"),"data-module-active"),n.setAttribute("data-module-active","1");var s=n.getAttribute("data-module"),l=n.getAttribute("data-module-desc");o.querySelector(".is-modal-bar").innerHTML=l?e.out(l)+`<button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">\n <svg class="is-icon-flex" style="width:30px;height:30px;"><use xlink:href="#ion-ios-close-empty"></use></svg>\n </button>`:e.out("Module Settings")+`<button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">\n <svg class="is-icon-flex" style="width:30px;height:30px;"><use xlink:href="#ion-ios-close-empty"></use></svg>\n </button>`;var a=n.getAttribute("data-dialog-width");a&&""!==a||(a="900px");var r=n.getAttribute("data-dialog-height");r&&""!==r||(r="570px"),"slider-builder"===s&&(o.querySelector("div:not(.is-modal-overlay)").style.width="90vw",a="1500px",r="80vh"),o.querySelector("div:not(.is-modal-overlay)").style.width="90vw",o.querySelector("div:not(.is-modal-overlay)").style.maxWidth=a,o.querySelector("div:not(.is-modal-overlay)").style.height=r,n.getAttribute("data-theme-light")||"form-builder"===s?o.classList.add("theme-light"):o.classList.remove("theme-light");let c=o.querySelector(".is-modal-close");i.addEventListener(c,"click",(()=>{e.hideModal(o)}));var u=1;const d=n.querySelectorAll("[data-subblock]");if(Array.prototype.forEach.call(d,(t=>{if(i.hasClass(t.parentNode,"glide__slide--clone"))return;let e=t.innerHTML;n.setAttribute("data-html-"+u,encodeURIComponent(e)),u++})),"side"===n.getAttribute("data-panel")&&this.builder.controlPanel);else{let i=o.querySelector("iframe");i.style.opacity=.001,e.showModal(o,!0,(()=>{t&&(t.removeAttribute("data-focus"),t.focus())})),t&&t.setAttribute("data-focus",!0);let n=await fetch(this.builder.opts.modulePath+s+".html");n=await n.text(),n=n.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),n=n.replace(/="assets\//g,'="'+this.builder.settings.assetPath),i.srcdoc=n,setTimeout((()=>{i.style.opacity=""}),1)}}click(t){let e=!1;if(t.hasAttribute("data-module")&&(e=!0),e){this.builder.activeModule=t,this.renderTool(),this.moduleTool.style.display="flex";const e=this.moduleTool.querySelector(".btn-module-settings");"side"===t.getAttribute("data-panel")&&this.builder.controlPanel?e.style.display="none":e.style.display="",this.repositionModuleTool();"button"===this.builder.doc.activeElement.tagName.toLowerCase()&&(this.moduleTool&&(this.moduleTool.style.display=""),setTimeout((()=>{this.builder.colTool.lockIndicator.style.display=""}),0))}else this.builder.activeModule=null,this.moduleTool&&(this.moduleTool.style.display="")}repositionModuleTool(){if(!this.builder.activeModule)return;if("flex"!==this.moduleTool.style.display)return;let t=this.builder.activeModule,e=this.moduleTool.offsetWidth,i=t.offsetWidth*this.builder.opts.zoom,n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left-2;o+=i-e;e+o>window.innerWidth&&(o=t.getBoundingClientRect().left),this.moduleTool.style.top=n+"px",this.moduleTool.style.left=o+"px"}}class Bc{constructor(t){this.builder=t,this.renderTool()}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-code-tool");if(!o){let s=`\n <div class="is-tool is-code-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-code-tool"):t.querySelector(".is-code-tool"),this.codeTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.edit(l)}))}}edit(){const t=this.builder.builderStuff,e=this.builder.dom;let i=this.builder.activeCodeBlock;this.builder.htmlutil.renderPanel();let n=t.querySelector("#tmp_buildercontent");n&&n.parentNode.removeChild(n),e.appendHtml(t,'<div id="tmp_buildercontent" style="position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;visibility:hidden;"></div>'),n=t.querySelector("#tmp_buildercontent");let o=1;const s=i.querySelectorAll("is-builder");Array.prototype.forEach.call(s,(s=>{let l=s.innerHTML;n=t.querySelector("#tmp_buildercontent"),n.innerHTML=l;let a=n.querySelectorAll(".elm-active");e.removeClasses(a,"elm-active"),a=n.querySelectorAll(".elm-inspected"),e.removeClasses(a,"elm-inspected"),a=n.querySelectorAll(".cell-active"),e.removeClasses(a,"cell-active"),a=n.querySelectorAll(".row-active"),e.removeClasses(a,"row-active"),a=n.querySelectorAll(".row-outline"),e.removeClasses(a,"row-outline"),a=n.querySelectorAll(".row-outline"),e.removeClasses(a,"row-outline"),a=n.querySelectorAll("[data-click]"),e.removeAttributes(a,"data-click"),a=n.querySelectorAll("[contenteditable]"),e.removeAttributes(a,"contenteditable"),a=n.querySelectorAll("[data-module-active]"),e.removeAttributes(a,"data-module-active"),e.removeElements(n.querySelectorAll(".is-row-tool")),e.removeElements(n.querySelectorAll(".is-col-tool")),e.removeElements(n.querySelectorAll(".is-rowadd-tool")),e.removeElements(n.querySelectorAll(".ovl")),e.removeElements(n.querySelectorAll(".row-add-initial")),a=n.querySelectorAll("[data-keep]"),e.removeAttributes(a,"data-keep"),l=n.innerHTML.trim(),l=l.replace(/<font/g,"<span").replace(/<\/font/g,"</span"),i.setAttribute("data-html-"+o,encodeURIComponent(l)),o++}));let l,a=decodeURIComponent(i.getAttribute("data-html"));a=a.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),n.parentNode.removeChild(n),l=this.builder.opts.htmlSyntaxHighlighting?t.querySelector(".viewhtmlmonaco"):t.querySelector(".viewhtml");let r=l.querySelector("textarea");a=a.replaceAll("{id}","__id__"),a=(0,Eo.html)(a),a=a.replaceAll("__id__","{id}"),r.value=a,this.builder.htmlutil.view("code")}click(t){let e=!1;if(t.hasAttribute("data-html")&&!t.hasAttribute("data-module")&&(e=!0),e){this.builder.activeCodeBlock=t;let e=t;this.renderTool(),this.codeTool.style.display="flex";let i=this.codeTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left-2;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.codeTool.style.top=o+"px",this.codeTool.style.left=s+"px"}else this.builder.activeCodeBlock=null,this.codeTool&&(this.codeTool.style.display="")}}class Hc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-iframe-tool");if(!o){let s=`\n <div class="is-tool is-iframe-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-iframe-tool"):t.querySelector(".is-iframe-tool"),this.iframeTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.renderPanel();const t=this.iframeModal;let e=this.builder.activeIframe,n=e.src;const o=t.querySelector(".input-src"),s=t.querySelector(".input-embedcode");o.value="",s.value="",i.showModal(t,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),null!=/^.*\/\/www.youtube.com\/embed\//.exec(n)||null!=/^.*\/\/player.vimeo.com\/video\//.exec(n)?(s.style.display="none",o.style.display="block",o.value=n,o.focus()):(o.style.display="none",s.style.display="block",s.value=e.outerHTML,s.focus()),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.iframelink");if(!n){let o=`\n <div class="is-modal iframelink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <input class="input-src" id="__iframelink_input_src" type="text" placeholder="Source" style="width:100%;margin-bottom:12px;"/>\n <textarea class="input-embedcode" id="__iframelink_input_embedcode" type="text" placeholder="Embed Code" style="width:100%;height:300px;margin-bottom:12px;display:none;"></textarea>\n <div style="text-align:right">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.iframelink"),this.iframeModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeIframe,i=t.parentNode;if(""!==n.querySelector(".input-src").value){var o=n.querySelector(".input-src").value,s=/^http[s]?:\/\/(((www.youtube.com\/watch\?(feature=player_detailpage&)?)v=)|(youtu.be\/))([^#&?]*)/.exec(o),l=/^.*(vimeo\.com\/)((channels\/[A-z]+\/)|(groups\/[A-z]+\/videos\/)|(video\/))?([0-9]+)\/?/.exec(o);if(null===s&&null===l||-1!==o.indexOf("player.vimeo.com")||-1!==o.indexOf("youtube.com/embed/"))t.src=o;else{if(null!=s&&s.length>=7)o="https://www.youtube.com/embed/"+s[6]+"?rel=0";if(null!=l&&l.length>=7)o="https://player.vimeo.com/video/"+l[6];t.src=o}this.builder.opts.onChange()}else{const o=n.querySelector(".input-embedcode"),s=o.value;if(-1===s.toLowerCase().indexOf("<iframe"))return void(alert(e.out("Please enter <iframe> element."))||o.focus());""!==s&&(t.outerHTML=s),this.builder.activeIframe=i.querySelector("iframe");let l=this.builder.doc.querySelector(".builder-active");l&&this.builder.applyBehaviorOn(l),this.builder.opts.onChange(),this.builder.onIframeChange&&this.builder.onIframeChange()}e.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{e.hideModal(n)}))}}click(t){const e=this.builder.dom;if(!e.hasClass(t.target,"ovl")||!t.target.parentNode.querySelector("audio"))if(e.hasClass(t.target,"ovl")){t.target.style.display="none",this.builder.activeIframe=t.target.parentNode.querySelector("iframe");let e=this.builder.activeIframe;this.renderTool(),this.iframeTool.style.display="flex";let i=this.iframeTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left-2;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.iframeTool.style.top=o+"px",this.iframeTool.style.left=s+"px"}else{let t=this.builder.doc.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display="block"})),this.builder.activeIframe=null,this.iframeTool&&(this.iframeTool.style.display="")}}}function zc(t){return t%2==0}function Fc(t,e,i){if("currentcell"===i)return e?[e]:[];const n=[],o=e?e.parentNode:null,s=e?function(t,e,i){let n=0,o=!1;for(let t=0;t<e.cells.length;t++)o||(n+=e.cells[t].colSpan),i===e.cells[t]&&(o=!0);return n-=i.colSpan-1,n-1}(0,o,e):-1;for(let e=0;e<t.rows.length;e++){const l=t.rows[e];for(let t=0;t<l.cells.length;t++){const a=l.cells[t];("table"===i||"evenrows"===i&&zc(e+1)||"oddrows"===i&&!zc(e+1)||"currentrow"===i&&l===o||"currentcol"===i&&t===s)&&n.push(a)}}return n}function Uc(t){t.opts&&t.opts.onChange&&t.opts.onChange()}function jc(t,e,i,n,o){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.backgroundColor=o})),Uc(t))}function Wc(t,e,i,n,o){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.color=o})),Uc(t))}function Vc(t,e,i,n,o,s){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.borderWidth=s+"px",t.style.borderStyle="solid",t.style.borderColor=o})),Uc(t))}function Gc(t,e,i,n,o,s){if(!e||!i)return;t.uo.saveForUndo();const l="0"===String(o);Fc(e,i,n).forEach((t=>{l?(t.style.borderWidth="",t.style.borderStyle="",t.style.borderColor=""):(t.style.borderWidth=o+"px",t.style.borderStyle="solid",t.style.borderColor=s)})),Uc(t)}class Yc{constructor(t){this.builder=t,this.modal=null,this._target={table:null,cell:null},this._onTrack=t=>this._track(t)}get isOpen(){return this.modal&&this.modal.classList.contains("active")}_render(){if(this.modal)return;const t=this.builder,e=t.util,i=t.dom,n=`\n <div class="is-modal is-modal-content edittablestyle" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${e.out("Table")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="ts-body">\n <div class="ts-row">\n <div class="ts-field w-full">\n <div class="ts-label">${e.out("Background")}</div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor cb-colorbtn"><span></span></button>\n </div>\n <div class="ts-field w-full">\n <div class="ts-label">${e.out("Text Color")}</div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor cb-colorbtn"><span></span></button>\n </div>\n </div>\n\n <div class="ts-sep"></div>\n\n <div class="ts-label">${e.out("Border")}</div>\n <div class="ts-borderrow">\n <div class="ts-seg" role="group" aria-label="${e.out("Border Thickness")}">\n <button type="button" class="tbw-seg on" data-value="0">${e.out("None")}</button>\n <button type="button" class="tbw-seg" data-value="1">1</button>\n <button type="button" class="tbw-seg" data-value="2">2</button>\n <button type="button" class="tbw-seg" data-value="3">3</button>\n </div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor cb-colorbtn"><span></span></button>\n </div>\n <select class="input-table-borderwidth" style="display:none"><option value="0">${e.out("No Border")}</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>\n\n <div class="ts-sep"></div>\n\n <div class="ts-field">\n <div class="ts-label">${e.out("Apply To")}</div>\n <select class="input-table-applyto">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option>\n <option value="currentcell">${e.out("Current Cell")}</option>\n </select>\n </div>\n </div>\n </div>`;i.appendHtml(t.builderStuff,n),this.modal=t.builderStuff.querySelector(".is-modal.edittablestyle");const o=()=>this.modal.querySelector(".input-table-applyto").value,s=this.modal.querySelector(".input-table-bordercolor"),l=this.modal.querySelector(".input-table-borderwidth"),a=(i,n,o)=>{const s=this._target;s.table&&s.cell&&(i.setAttribute("data-focus",!0),t.colorPicker.open((t=>{o(this._target,t),e.paintColorButton(i,t)}),n(),(()=>{i.removeAttribute("data-focus"),i.focus()})))},r=this.modal.querySelector(".input-table-bgcolor");r.addEventListener("click",(()=>a(r,(()=>r.querySelector("span").style.backgroundColor),((e,i)=>jc(t,e.table,e.cell,o(),i)))));const c=this.modal.querySelector(".input-table-textcolor");c.addEventListener("click",(()=>a(c,(()=>c.querySelector("span").style.backgroundColor),((e,i)=>Wc(t,e.table,e.cell,o(),i))))),s.addEventListener("click",(()=>a(s,(()=>s.querySelector("span").style.backgroundColor),((e,i)=>{let n=l.value;"0"===n&&(l.value="1",n="1"),Vc(t,e.table,e.cell,o(),i,n)})))),l.addEventListener("change",(()=>{const i=this._target;if(!i.table||!i.cell)return;let n=s.querySelector("span").style.backgroundColor||"#000000";Gc(t,i.table,i.cell,o(),l.value,n),"0"===l.value&&e.paintColorButton(s,"")})),this.modal.querySelectorAll(".tbw-seg").forEach((t=>{t.addEventListener("click",(()=>{this.modal.querySelectorAll(".tbw-seg").forEach((t=>t.classList.remove("on"))),t.classList.add("on"),l.value=t.getAttribute("data-value"),l.dispatchEvent(new Event("change"))}))})),this.modal.querySelector(".is-modal-close").addEventListener("click",(()=>this.hide())),new vs({selector:".is-modal.edittablestyle .is-draggable"})}open(t){this._render();const e=t&&t()||{table:null,cell:null};this._target={table:e.table||null,cell:e.cell||null},this.builder.util.showModal(this.modal),this.realtime(),this._bindTracking()}hide(){this._unbindTracking(),this.modal&&this.builder.util.hideModal(this.modal)}setTarget(t,e){this._target={table:t||null,cell:e||null},this.realtime()}realtime(){if(!this.isOpen)return;const t=this._target&&this._target.cell,e=this.builder.util,i=t=>this.modal.querySelector(t);t?(e.paintColorButton(i(".input-table-bgcolor"),t.style.backgroundColor),e.paintColorButton(i(".input-table-textcolor"),t.style.color),e.paintColorButton(i(".input-table-bordercolor"),t.style.borderColor),i(".input-table-borderwidth").value=parseInt(t.style.borderWidth,10)||0):(e.paintColorButton(i(".input-table-bgcolor"),""),e.paintColorButton(i(".input-table-textcolor"),""),e.paintColorButton(i(".input-table-bordercolor"),""),i(".input-table-borderwidth").value=0);const n=String(i(".input-table-borderwidth").value||0);this.modal.querySelectorAll(".tbw-seg").forEach((t=>t.classList.toggle("on",t.getAttribute("data-value")===n)))}_track(t){const e=t.target;if(!e||!e.closest)return;const i=e.closest("td,th"),n=e.closest("table");if(n&&i&&n.closest(".is-builder"))return void this.setTarget(n,i);const o=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");n||o||e.closest(".is-modal")||e.closest(".is-sidebar")||e.closest(".is-rte-table-tool")||e.closest(".keep-selection")||this.hide()}_bindTracking(){this._tracking||(this._tracking=!0,this.builder.doc.addEventListener("click",this._onTrack),this.builder.doc!==document&&document.addEventListener("click",this._onTrack))}_unbindTracking(){this._tracking&&(this._tracking=!1,this.builder.doc.removeEventListener("click",this._onTrack),this.builder.doc!==document&&document.removeEventListener("click",this._onTrack))}}class Xc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-table-tool");if(!o){let s=`\n <div class="is-tool is-table-tool">\n <button title="${i.out("Settings")}" style="width:35px;height:35px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-table-tool"):t.querySelector(".is-table-tool"),this.tableTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.tableModal&&this.tableModal.classList.contains("active")?this.hideTableEditor():(this.renderPanel(),this.showTableEditor())}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.edittable");if(!n){let o=`\n <div class="is-modal is-modal-content edittable" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${e.out("Table")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div style="padding:0">\n <div class="is-tabs" data-group="table">\n <a title="${e.out("Style")}" id="tabTableGeneral" href="" data-content="divTableGeneral" class="active">${e.out("Style")}</a>\n <a title="${e.out("Layout")}" id="tabTableLayout" href="" data-content="divTableLayout">${e.out("Layout")}</a>\n </div>\n <div id="divTableGeneral" class="is-tab-content active" tabindex="-1" data-group="table" style="display:block">\n\n <div style="display:flex;padding-bottom:12px">\n <div style="padding-right:15px">\n <div>${e.out("Background")}:</div>\n <div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor is-btn-color"></button>\n </div>\n </div>\n <div>\n <div>${e.out("Text Color")}:</div>\n <div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor is-btn-color"></button>\n </div>\n </div>\n </div>\n\n <div style="padding-bottom:12px;">\n <div>${e.out("Border Thickness")}:</div>\n <div>\n <select id="selCellBorderWidth" style="width:120px;"><option value="0">No Border</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select> \n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Border Color")}:</div>\n <div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor is-btn-color"></button>\n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Apply To")}:</div>\n <div>\n <select id="selTableApplyTo" style="width:120px;">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option> \n <option value="currentcell">${e.out("Current Cell")}</option> \n </select>\n </div>\n </div>\n\n </div>\n\n <div id="divTableLayout" class="is-tab-content" tabindex="-1" data-group="table">\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Insert Row")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Above")}" data-table-cmd="rowabove" title="${e.out("Above")}" style="margin-right:15px"> ${e.out("Above")} </button>\n <button class="classic" title="${e.out("Below")}" data-table-cmd="rowbelow" title="${e.out("Below")}" style=""> ${e.out("Below")} </button>\n </div> \n </div>\n \n <div style="padding-bottom:15px;">\n <div>${e.out("Insert Column")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Left")}" data-table-cmd="columnleft" title="${e.out("Left")}" style="margin-right:15px"> ${e.out("Left")} </button> \n <button class="classic" title="${e.out("Right")}" data-table-cmd="columnright" title="${e.out("Right")}" style=""> ${e.out("Right")} </button> \n </div> \n </div>\n\n <div style="padding-bottom:15px;">\n <button class="classic" title="${e.out("Delete Row")}" data-table-cmd="delrow" title="Delete Row" style=""> ${e.out("Delete Row")} </button> \n </div>\n\n <div style="padding-bottom:15px;"> \n <button class="classic" title="${e.out("Delete Column")}" data-table-cmd="delcolumn" title="Delete Column" style=""> ${e.out("Delete Column")} </button> \n </div>\n \n <div> \n <button class="classic" title="${e.out("Merge Cell")}" data-table-cmd="mergecell" style="">${e.out("Merge Cell")}</button> \n </div>\n </div>\n </div>\n </div>\n \n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.edittable"),this.tableModal=n;const s=n.querySelector(".input-table-bgcolor");s.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selTableApplyTo").value;jc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t),e.style.backgroundColor=t}),s.style.backgroundColor,(()=>{s.removeAttribute("data-focus"),s.focus()})),s.setAttribute("data-focus",!0)}));const l=n.querySelector(".input-table-textcolor");l.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selTableApplyTo").value;Wc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t),e.style.backgroundColor=t}),l.style.backgroundColor,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}));const a=n.querySelector(".input-table-bordercolor");a.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selCellBorderWidth").value;"0"===i&&(n.querySelector("#selCellBorderWidth").value=1,i="1");let o=n.querySelector("#selTableApplyTo").value;Vc(this.builder,this.builder.activeTable,this.builder.activeTd,o,t,i),e.style.backgroundColor=t}),a.style.backgroundColor,(()=>{a.removeAttribute("data-focus"),a.focus()})),a.setAttribute("data-focus",!0)}));let r=n.querySelector("#selCellBorderWidth");r.addEventListener("change",(()=>{if(!this.builder.activeTd)return;let t=r.value,e=n.querySelector(".input-table-bordercolor").style.backgroundColor;""===e&&(e="#000000");let i=n.querySelector("#selTableApplyTo").value;Gc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t,e),"0"===t&&(n.querySelector(".input-table-bordercolor").style.backgroundColor="")}));let c=n.querySelector('[data-table-cmd="rowabove"]');c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=t.insertRow(e.rowIndex);for(var n=0;n<e.cells.length;n++){var o=i.insertCell(i.cells.length);this.builder.activeTd.getAttribute("style")&&o.setAttribute("style",this.builder.activeTd.getAttribute("style")),o.style.verticalAlign="top",o.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="rowbelow"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=t.insertRow(e.rowIndex+1);for(var n=0;n<e.cells.length;n++){var o=i.insertCell(i.cells.length);this.builder.activeTd.getAttribute("style")&&o.setAttribute("style",this.builder.activeTd.getAttribute("style")),o.style.verticalAlign="top",o.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="columnleft"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++){var n=t.rows[i].insertCell(e);this.builder.activeTd.getAttribute("style")&&n.setAttribute("style",this.builder.activeTd.getAttribute("style")),n.style.verticalAlign="top",n.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="columnright"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++){var n=t.rows[i].insertCell(e+1);this.builder.activeTd.getAttribute("style")&&n.setAttribute("style",this.builder.activeTd.getAttribute("style")),n.style.verticalAlign="top",n.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="delrow"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode;t.deleteRow(e.rowIndex),this.builder.activeTable=null,this.builder.activeTd=null,0===t.rows.length&&t.parentNode.removeChild(t),this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="delcolumn"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++)t.rows[i].deleteCell(e);this.builder.activeTable=null,this.builder.activeTd=null,0===t.rows[0].cells.length&&t.parentNode.removeChild(t),this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="mergecell"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=this.builder.activeTd;i.colSpan=i.colSpan+1,i.cellIndex+1<t.rows[e.rowIndex].cells.length&&t.rows[e.rowIndex].deleteCell(i.cellIndex+1),this.builder.opts.onChange()}));let u=n.querySelector(".is-modal-close");i.addEventListener(u,"click",(()=>{i.removeClass(n,"active")})),new Nc({element:n}),new vs({selector:".is-modal.edittable .is-draggable"})}}showTableEditor(){const t=this.tableModal;this.builder.util.showModal(t),this.realtime();const e=t=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=t.target;n&&(n.closest(".is-table-tool")||n.closest(".is-sidebar")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("table")||i||(this.hideTableEditor(),document.removeEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",e),this.builder.handleTableClick_=!1),n.closest("table")&&this.realtime())};this.builder.handleTableClick_||(document.addEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",e),this.builder.handleTableClick_=!0)}hideTableEditor(){const t=this.tableModal;t&&this.builder.util.hideModal(t)}realtime(){const t=this.tableModal;if(t.classList.contains("active")&&this.builder.activeTable){let e=this.builder.activeTd;e&&(t.querySelector(".input-table-bgcolor").style.backgroundColor=e.style.backgroundColor,t.querySelector(".input-table-textcolor").style.backgroundColor=e.style.color,t.querySelector(".input-table-bordercolor").style.backgroundColor=e.style.borderColor,t.querySelector("#selCellBorderWidth").value=parseInt(e.style.borderWidth))}else t.querySelector(".input-table-bgcolor").style.backgroundColor="",t.querySelector(".input-table-textcolor").style.backgroundColor="",t.querySelector(".input-table-bordercolor").style.backgroundColor="",t.querySelector("#selCellBorderWidth").value=0}click(t){const e=this.builder.dom;let i=t.target;if(!i)return;const n=i.closest("table");if(n){let t=i.closest("td");if(e.hasClass(n,"default")){this.builder.activeTd=t,this.builder.activeTable=n,this.renderTool(),this.tableTool.style.display="flex";let e=this.tableTool.offsetWidth,i=n.offsetWidth*this.builder.opts.zoom,o=n.getBoundingClientRect().top+this.builder.win.pageYOffset,s=n.getBoundingClientRect().left-2;s+=i-e;e+s>window.innerWidth&&(s=n.getBoundingClientRect().left),this.tableTool.style.top=o+"px",this.tableTool.style.left=s+"px"}else this.builder.activeTd=null,this.builder.activeTable=null,this.tableTool&&(this.tableTool.style.display="")}else this.builder.activeTd=null,this.builder.activeTable=null,this.tableTool&&(this.tableTool.style.display="")}}class Kc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-video-tool");if(!o){let s=`\n <div class="is-tool is-video-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-video-tool"):t.querySelector(".is-video-tool"),this.videoTool=o;let l=this.videoTool.querySelector("button");n.addEventListener(l,"click",(()=>{this.renderPanel();const t=this.videoModal;let e=this.builder.activeVideo,n=e.querySelector("source"),o="";n&&(o=n.getAttribute("src")),o.startsWith("data:")&&(this.builder.base64Data=o,o="[Image Data]"),t.querySelector(".input-url").value=o;const s=t.querySelector(".input-video-controls");e.hasAttribute("controls")?s.checked=!0:s.checked=!1;const a=t.querySelector(".input-video-loop");e.hasAttribute("loop")?a.checked=!0:a.checked=!1;const r=t.querySelector(".input-video-autoplay");e.hasAttribute("autoplay")?r.checked=!0:r.checked=!1;const c=t.querySelector(".input-video-muted");e.hasAttribute("muted")?c.checked=!0:c.checked=!1,i.showModal(t,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".is-modal.videolink")){let n=`\n <div class="is-modal videolink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <label for="inpVideoLinkSource" style="display:block">${e.out("Source")}:</label>\n <div class="video-url">\n <input id="inpVideoLinkSource" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="video-larger1 input-upload is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetVideoUpload" method="post" action="${this.builder.opts.videoHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;">\n <input id="hidRefId5" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input title="${e.out("Select")}" id="fileVideo1" name="fileImage" type="file" accept="video/mp4" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="0" id="frameTargetVideoUpload" name="frameTargetVideoUpload" tabIndex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n \n <label class="label-checkbox" style="display:block;margin-top:14px;">\n <input class="input-video-controls" id="__input_video_controls" type="checkbox" /> ${e.out("Show Controls")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-loop" id="__input_video_loop" type="checkbox" /> ${e.out("Loop")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-autoplay" id="__input_video_autoplay" type="checkbox" /> ${e.out("Autoplay")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-muted" id="__input_video_muted" type="checkbox" /> ${e.out("Muted")}&nbsp;\n </label>\n \n <div style="text-align:right;margin-top:14px;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);const o=t.querySelector(".is-modal.videolink");this.videoModal=o,""!==this.builder.opts.videoHandler||this.builder.opts.onVideoUpload||(o.querySelector(".video-larger1").style.display="none"),this.builder.opts.onVideoSelectClick||""!==this.builder.opts.videoSelect||(o.querySelector(".input-select").style.display="none");let s=o.querySelector(".input-select");s&&i.addEventListener(s,"click",(async()=>{if(this.builder.opts.onVideoSelectClick)this.builder.opts.onVideoSelectClick({targetInput:o.querySelector(".input-url"),theTrigger:s});else{let i=t.querySelector(".is-modal.videoselect"),n=i.querySelector("iframe");if(this.builder.opts.assetManagerBasePath){let t;this.builder.opts.assetRefresh&&(t=this.builder.opts.videoSelect),"about:blank"===n.src&&(t=this.builder.opts.videoSelect);let e=await fetch(t);e=await e.text(),e=e.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),e=e.replace(/<head>/i,'<head><base href="'+this.builder.opts.assetManagerBasePath+'">'),e=e.replace(/="assets\//g,'="'+this.builder.opts.assetPath),n.srcdoc=e}else this.builder.opts.assetRefresh&&(n.src=this.builder.opts.videoSelect),"about:blank"===n.src&&(n.src=this.builder.opts.videoSelect);e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="video"}));let l=o.querySelector("#fileVideo1");i.addEventListener(l,"change",(t=>{let e=l;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId5").value=this.builder.opts.customval,this.builder.opts.onVideoUpload?this.builder.opts.onVideoUpload(t):n.submit(),l.value=""}));let a=o.querySelector(".input-ok");i.addEventListener(a,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeVideo;if(o.querySelector(".input-video-controls").checked?t.setAttribute("controls",""):t.removeAttribute("controls"),o.querySelector(".input-video-loop").checked?t.setAttribute("loop",""):t.removeAttribute("loop"),o.querySelector(".input-video-autoplay").checked?t.setAttribute("autoplay",""):t.removeAttribute("autoplay"),o.querySelector(".input-video-muted").checked?t.setAttribute("muted",""):t.removeAttribute("muted"),""!==o.querySelector(".input-url").value){let e=o.querySelector(".input-url").value;"[Image Data]"===e&&(e=this.builder.base64Data,this.builder.base64Data="");let i=t.querySelector("source");e!==i.getAttribute("src")&&(i&&i.setAttribute("src",e),setTimeout((function(){t.pause(),t.load()}),100)),this.builder.opts.onChange()}this.builder.hideModal(o),this.builder.onVideoChange&&this.builder.onVideoChange()}));let r=o.querySelector(".input-cancel");i.addEventListener(r,"click",(()=>{this.builder.base64Data="",this.builder.hideModal(o)}))}}click(t){let e=t.target;if("video"===e.tagName.toLowerCase()){if(e.closest("[data-html]"))return void(this.builder.activeVideo=null);this.renderTool();const t=this.videoTool;this.builder.activeVideo=e,t.style.display="flex";let i=t.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),t.style.top=o+"px",t.style.left=s+"px"}else this.builder.activeVideo=null,this.videoTool&&(this.videoTool.style.display="")}repositionVideoTool(){let t=this.builder.activeVideo;if(!t)return;if(!this.videoTool)return;this.videoTool.style.display="flex";let e=this.videoTool.offsetWidth,i=t.offsetWidth*this.builder.opts.zoom,n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left;o+=i-e;e+o>window.innerWidth&&(o=t.getBoundingClientRect().left),this.videoTool.style.top=n+"px",this.videoTool.style.left=o+"px"}}class Zc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-audio-tool");if(!o){let s=`\n <div class="is-tool is-audio-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-audio-tool"):t.querySelector(".is-audio-tool"),this.audioTool=o;let l=this.audioTool.querySelector("button");n.addEventListener(l,"click",(()=>{let t=this.builder.activeAudio.querySelector("source"),e="";t&&(e=t.getAttribute("src")),this.renderPanel();const n=this.audioModal;e.startsWith("data:")&&(this.builder.base64Data=e,e="[Image Data]"),n.querySelector(".input-url").value=e,i.showModal(n,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".is-modal.audiolink")){let n=`\n <div class="is-modal audiolink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <label for="inpAudioLinkSource" style="display:block">${e.out("Source")}:</label>\n <div class="audio-url">\n <input id="inpAudioLinkSource" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="audio-file-upload input-upload is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetAudioUpload" method="post" action="${this.builder.opts.audioHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;">\n <input id="hidRefAudio" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input title="${e.out("Select")}" id="fileAudio1" name="fileImage" type="file" accept="audio/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="0" id="frameTargetAudioUpload" name="frameTargetAudioUpload" tabIndex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n \n <div style="text-align:right;margin-top:14px;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);const o=t.querySelector(".is-modal.audiolink");this.audioModal=o,""!==this.builder.opts.audioHandler||this.builder.opts.onAudioUpload||(o.querySelector(".audio-file-upload").style.display="none"),this.builder.opts.onAudioSelectClick||""!==this.builder.opts.audioSelect||(o.querySelector(".input-select").style.display="none");let s=o.querySelector(".input-select");s&&i.addEventListener(s,"click",(async()=>{if(this.builder.opts.onAudioSelectClick)this.builder.opts.onAudioSelectClick({targetInput:o.querySelector(".input-url"),theTrigger:s});else{let i=t.querySelector(".is-modal.audioselect"),n=i.querySelector("iframe");if(this.builder.opts.assetManagerBasePath){let t;this.builder.opts.assetRefresh&&(t=this.builder.opts.audioSelect),"about:blank"===n.src&&(t=this.builder.opts.audioSelect);let e=await fetch(t);e=await e.text(),e=e.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),e=e.replace(/<head>/i,'<head><base href="'+this.builder.opts.assetManagerBasePath+'">'),e=e.replace(/="assets\//g,'="'+this.builder.opts.assetPath),n.srcdoc=e}else this.builder.opts.assetRefresh&&(n.src=this.builder.opts.audioSelect),"about:blank"===n.src&&(n.src=this.builder.opts.audioSelect);e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="audio"}));let l=o.querySelector("#fileAudio1");i.addEventListener(l,"change",(t=>{let e=l;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefAudio").value=this.builder.opts.customval,this.builder.opts.onAudioUpload?this.builder.opts.onAudioUpload(t):n.submit(),l.value=""}));let a=o.querySelector(".input-ok");i.addEventListener(a,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeAudio;if(""!==o.querySelector(".input-url").value){let e=o.querySelector(".input-url").value;"[Image Data]"===e&&(e=this.builder.base64Data,this.builder.base64Data="");let i=t.querySelector("source");e!==i.getAttribute("src")&&(i&&i.setAttribute("src",e),setTimeout((function(){t.pause(),t.load()}),100)),this.builder.opts.onChange()}this.builder.hideModal(o)}));let r=o.querySelector(".input-cancel");i.addEventListener(r,"click",(()=>{this.builder.base64Data="",this.builder.hideModal(o)}))}}click(t){if(this.builder.dom.hasClass(t.target,"ovl")&&t.target.parentNode.querySelector("audio")){t.target.style.display="none";let e=t.target.parentNode.querySelector("audio");this.builder.activeAudio=e,this.renderTool(),this.audioTool.style.display="flex";let i=this.audioTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.audioTool.style.top=o+"px",this.audioTool.style.left=s+"px"}else this.builder.activeAudio=null,this.audioTool&&(this.audioTool.style.display="")}}class Jc{constructor(t){this.builder=t;const e=this.builder.dom;this.dom=e;const i=this.builder.util;this.util=i;const n=this.builder.builderStuff;this.builderStuff=n;const o=this.builder.contentStuff;this.contentStuff=o,this.renderTool()}renderTool(){const t=this.builderStuff,e=this.contentStuff,i=this.dom,n=this.util;let o=t.querySelector(".is-svg-tool");if(!o){let s=`\n <div class="is-tool is-svg-tool">\n <button class="btn-svg-settings" title="${n.out("Settings")}" data-title="${n.out("Settings")}"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;i.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-svg-tool"):t.querySelector(".is-svg-tool"),this.svgTool=o;const l=o.querySelector(".btn-svg-settings");l.addEventListener("click",(async()=>{this.edit(l)}))}}renderPanel(){const t=this.util,e=this.builderStuff,i=this.builder.dom;this.dom=i;let n=e.querySelector(".is-modal.svgsettings");if(!n){let o=`\n\n <div class="is-modal svgsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content scroll cb-form">\n <div class="cb-field">\n <label for="inpSvgCode">${t.out("Embed SVG")}:</label>\n <div class="audio-url">\n <textarea id="inpSvgCode" class="input-url"></textarea>\n </div>\n </div>\n <div class="cb-actions">\n <button title="${t.out("Cancel")}" class="input-cancel classic-secondary">${t.out("Cancel")}</button>\n <button title="${t.out("Ok")}" class="input-ok classic-primary">${t.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(e,o),n=e.querySelector(".is-modal.svgsettings"),this.svgModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{const e=n.querySelector("#inpSvgCode"),o=(new DOMParser).parseFromString(e.value,"text/html"),s=o.querySelector("svg");if(!s)return;s.classList.add("svgdummy"),this.builder.uo.saveForUndo();let l=this.builder.activeSvg;l?l.outerHTML=o.body.innerHTML:this.builder.util.pasteHtmlAtCaret(o.body.innerHTML,!0);let a=this.builder.doc.querySelector(".svgdummy");a&&(a.classList.remove("svgdummy"),this.builder.activeSvg=a,i.selectElementContents(a),t.saveSelection()),this.builder.opts.onChange(),this.builder.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{this.builder.hideModal(n)}))}}async edit(t){this.renderPanel();const e=this.svgModal,i=this.dom;let n=e.querySelector(".is-modal-close");i.addEventListener(n,"click",(()=>{this.util.hideModal(e)})),this.util.showModal(e,!0,(()=>{t&&(t.removeAttribute("data-focus"),t.focus())})),t&&t.setAttribute("data-focus",!0);const o=e.querySelector("#inpSvgCode");o.value="";let s=this.builder.activeSvg;s&&(o.value=s.outerHTML),o.focus()}click(t){const e=t.target.closest("svg");e?(this.builder.activeSvg=e,document.selection?document.selection.empty():window.getSelection().removeAllRanges(),this.builder.doc.querySelectorAll(".icon-active").forEach((t=>t.classList.remove("icon-active"))),e.classList.add("icon-active"),this.showTool(e)):(this.builder.activeSvg=null,this.hideTool())}showTool(){this.svgTool.style.display="flex",this.repositionModuleTool()}hideTool(){this.svgTool.style.display=""}repositionModuleTool(){if(!this.builder.activeSvg)return;if(!this.svgTool)return;if("flex"!==this.svgTool.style.display)return;let t,e,i=this.builder.activeSvg,n=this.svgTool.offsetWidth,o=i.getBoundingClientRect().width;o<200?(e=i.getBoundingClientRect().left+o,t=i.getBoundingClientRect().top+this.builder.win.pageYOffset):(e=i.getBoundingClientRect().left+o-n,t=i.getBoundingClientRect().top+this.builder.win.pageYOffset+3),this.svgTool.style.top=t+"px",this.svgTool.style.left=e+"px"}}class Qc{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=this.builder.dom;this.dom=n,this.hyperlink=new qc(t),this.button=new Rc(t),this.image=new Ec(t),this.spacer=new Ic(t),this.plugin=new Pc(t),this.module=new Dc(t),this.code=new Bc(t),this.iframe=new Hc(t),this.table=new Xc(t),this.video=new Kc(t),this.audio=new Zc(t),this.svg=new Jc(t)}applyBehavior(t){const e=this.dom;let i=!1;t.hasAttribute("data-html")&&(i=!0);let n=!1;t.hasAttribute("data-noedit")&&(n=!0);let o=!1;if(t.hasAttribute("data-protected")&&(o=!0),i||n||o){if(n){let e=t.querySelectorAll("[contenteditable]");Array.prototype.forEach.call(e,(t=>{t.contentEditable=!1}))}return}const s=t.querySelectorAll("[data-cb-type]");Array.prototype.forEach.call(s,(t=>{t.contentEditable=!1}));let l=t.querySelectorAll(".is-social");Array.prototype.forEach.call(l,(t=>{t.contentEditable=!1}));let a=t.querySelectorAll(".spacer");Array.prototype.forEach.call(a,(t=>{t.contentEditable=!1}));let r=t.querySelectorAll("hr");Array.prototype.forEach.call(r,(t=>{t.contentEditable=!1}));let c=t.querySelectorAll("a");Array.prototype.forEach.call(c,(i=>{"inline-block"===e.getStyle(i,"display")&&(i.contentEditable=!0,i.parentNode!==t&&(i.parentNode.contentEditable=!1))}));let u=t.querySelectorAll(".embed-responsive");Array.prototype.forEach.call(u,(t=>{let i=t.querySelector(".ovl");i||(e.appendHtml(t,'<div class="ovl" style="position:absolute;background:#fff;opacity:0.01;cursor:pointer;top:0;left:0px;width:100%;height:100%;z-index:1"></div>'),i=t.querySelector(".ovl"),e.addEventListener(i,"click",(()=>{let t=document.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display="block"})),i.style.display="none"})))}));let d=t.querySelectorAll("audio");Array.prototype.forEach.call(d,(t=>{if(t.closest("[data-cb-type]"))return;let i=t.parentNode.querySelector(".ovl");i||(e.appendHtml(t.parentNode,'<div class="ovl" style="position:absolute;background:#fff;opacity:0.01;cursor:pointer;top:0;left:0px;width:100%;height:100%;z-index:1"></div>'),i=t.parentNode.querySelector(".ovl"),e.addEventListener(i,"click",(()=>{let t=document.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display=""})),i.style.display="none"}))),setTimeout((()=>{i.closest(".elm-active")?i.click():i.style.display=""}),300)}))}click(t,e){const i=this.dom,n=e.target;let o=!1;t.hasAttribute("data-noedit")&&(o=!0);let s=!1;t.hasAttribute("data-protected")&&(s=!0);let l=!1,a=!1;t.hasAttribute("data-html")&&(l=!0,i.parentsHasAttribute(n,"data-subblock")&&(a=!0));if(n.closest("[data-cb-type]")&&(l=!0,a=n.closest(".is-subblock")),!l&&!o&&!s||a){this.builder.doc.querySelectorAll(".icon-active").forEach((t=>t.classList.remove("icon-active"))),this.builder.activeIcon=null,"i"===n.tagName.toLowerCase()&&""===n.innerHTML&&(n.classList.add("icon-active"),i.selectElementContents(n),this.builder.activeIcon=n,document.selection?document.selection.empty():window.getSelection().removeAllRanges()),this.image.click(e),this.button.click(t,e),this.hyperlink.click(t,e),"a"!==n.tagName.toLowerCase()&&!i.parentsHasTag(n,"a")||l||e.preventDefault(),this.iframe.click(e),this.video.click(e),this.audio.click(e),this.spacer.click(e),this.svg.click(e)}else if(this.util.hideControls(),"img"===e.target.tagName.toLowerCase()&&e.target.hasAttribute("data-image-embed")){if(this.image.click(e),e.target.hasAttribute("data-sync")){let t=e.target;t.setAttribute("data-src",t.src)}}else"img"===e.target.tagName.toLowerCase()&&t.hasAttribute("data-image-allowed")&&this.image.click(e);this.code.click(t,e),this.module.click(t,e),this.plugin.click(e)}}class tu{constructor(t){this.builder=t,this.grid=new fs(t),this.renderRowMore()}render(t){const e=this.builder.dom,n=this.builder.util,o=this.builder.builderStuff;let s=t.querySelector(".is-row-tool");if(!s){let l=`<div class="is-tool is-row-tool" style="${this.builder.rowTool||""===this.builder.rowTool?"":"display:none;"}">\n <div title="${n.out("Move")}" role="button" tabindex="-1" class="row-handle" style="${this.builder.rowHandle?"":"display:none;"}width:100%;cursor:move;text-align:center;"><svg class="is-icon-flex"><use xlink:href="#ion-move"></use></svg></div>\n <button type="button" tabindex="-1" title="${n.out("More")}" class="row-more"><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-dots2"></use></svg></button>\n <button type="button" tabindex="-1" title="${n.out("Grid Editor")}" class="row-grideditor"><svg class="is-icon-flex"><use xlink:href="#ion-grid"></use></svg></button>\n <button type="button" tabindex="-1" title="${n.out("Delete")}" class="row-remove"><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-trash2"></use></svg></button>\n </div>\n <div class="is-tool is-col-tool">\n <button type="button" tabindex="-1" title="${n.out("Add")}" class="cell-add">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-plus"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${n.out("More")}" class="cell-more">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-dots2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${n.out("Delete")}" class="cell-remove">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;e.appendHtml(t,l),s=t.querySelector(".is-row-tool");let a=s.querySelectorAll("[title]");Array.prototype.forEach.call(a,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}));let r=t.querySelector(".is-col-tool");a=r.querySelectorAll("[title]"),Array.prototype.forEach.call(a,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}));const c=r.querySelector(".cell-add");c&&e.addEventListener(c,"click",(t=>{if(t.preventDefault(),t.stopImmediatePropagation(),!n.cellSelected())return;const s=window.innerHeight,l=n.getElementPosition(c);let a=l.top,r=l.left;i(this.builder);let u=this.builder.builderStuff.querySelector(".is-pop.quickadd");u.querySelector(".is-pop-tabs").style.display="flex",n.showPop(u,!1,c);const d=u.offsetHeight;s-a>d?(u.style.top=a+window.pageYOffset+35+"px",u.style.left=r+"px",e.removeClass(u,"arrow-bottom"),e.removeClass(u,"arrow-right"),e.removeClass(u,"arrow-left"),e.removeClass(u,"center"),e.addClass(u,"arrow-top"),e.addClass(u,"left")):(u.style.top=a+window.pageYOffset-d-8+"px",u.style.left=r+"px",e.removeClass(u,"arrow-top"),e.removeClass(u,"arrow-right"),e.removeClass(u,"arrow-left"),e.removeClass(u,"center"),e.addClass(u,"arrow-bottom"),e.addClass(u,"left")),"left"===u.querySelector(".active").getAttribute("data-value")?u.setAttribute("data-mode","cell-left"):u.setAttribute("data-mode","cell-right"),u.classList.remove("simple");const h=t=>{let e=t.target;if(e&&!(e.closest(".quickadd")||e.closest(".row-add")||e.closest(".is-rowadd-tool")||e.closest(".cell-add")||e.closest(".elm-add")||e.closest(".row-add-initial"))){const t=o.querySelector(".quickadd");n.hidePop(t),document.removeEventListener("click",h),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",h),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",h),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",h),this.builder.handleQuickAddClickOut_=!0)}));const u=r.querySelector(".cell-more");u&&e.addEventListener(u,"click",(t=>{t.preventDefault(),t.stopImmediatePropagation();let i=n.cellSelected();if(!i)return;const s=window.innerHeight,l=n.getElementPosition(u);let a=l.top,r=l.left;this.builder.colTool.renderColMore();const c=o.querySelector(".columnmore");setTimeout((()=>{n.showPop(c,!1,u),this.builder.colTool.refreshColumnMoreState();const t=c.offsetHeight;s-a>t?(c.style.top=a+window.pageYOffset+35+"px",c.style.left=r-7+"px",e.removeClass(c,"arrow-bottom"),e.removeClass(c,"arrow-right"),e.removeClass(c,"arrow-left"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.addClass(c,"arrow-top"),e.addClass(c,"left")):(c.style.top=a+window.pageYOffset-t-8+"px",c.style.left=r-7+"px",e.removeClass(c,"arrow-top"),e.removeClass(c,"arrow-right"),e.removeClass(c,"arrow-left"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.addClass(c,"arrow-bottom"),e.addClass(c,"left"))}),0);const d=c.querySelector(".cell-locking");i.hasAttribute("data-noedit")?e.addClass(d,"on"):e.removeClass(d,"on");const h=c.querySelector(".cell-increase"),b=c.querySelector(".cell-decrease"),p=c.querySelector(".cell-prev"),g=c.querySelector(".cell-next"),m=c.querySelector(".cell-up"),f=c.querySelector(".cell-down"),y=c.querySelector(".cell-duplicate"),v=c.querySelector(".cell-locking"),w=c.querySelector(".is-separator");if(i.closest("[nogrid]")){p&&(p.style.display="none"),g&&(g.style.display="none"),m&&(m.style.display="none"),f&&(f.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),y&&(y.style.display="none"),p&&p.setAttribute("disabled","disabled"),g&&g.setAttribute("disabled","disabled"),m&&m.setAttribute("disabled","disabled"),f&&f.setAttribute("disabled","disabled"),h&&h.setAttribute("disabled","disabled"),b&&b.setAttribute("disabled","disabled"),y&&y.setAttribute("disabled","disabled");let t=c.querySelector(".cell-html");t&&(t.style.display=""),i.getAttribute("data-html")&&(c.querySelector(".cell-html").style.display="none",this.columnTool.querySelector(".cell-more").style.display="none",c.querySelector(".cell-html").setAttribute("disabled","disabled"),this.columnTool.querySelector(".cell-more").setAttribute("disabled","disabled"))}else{p&&(p.style.display=""),g&&(g.style.display=""),m&&(m.style.display=""),f&&(f.style.display=""),h&&(h.style.display=""),b&&(b.style.display=""),y&&(y.style.display=""),p&&p.removeAttribute("disabled"),g&&g.removeAttribute("disabled"),m&&m.removeAttribute("disabled"),f&&f.removeAttribute("disabled"),h&&h.removeAttribute("disabled"),b&&b.removeAttribute("disabled"),y&&y.removeAttribute("disabled");let t=c.querySelector(".cell-html");t&&(t.style.display="",t.removeAttribute("disabled"));let e=i.parentNode,n=3;e.querySelector(".is-row-overlay")&&(n=4),e.childElementCount-n==1?(p&&(p.style.display="none"),g&&(g.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),p&&p.setAttribute("disabled","disabled"),g&&g.setAttribute("disabled","disabled"),h&&h.setAttribute("disabled","disabled"),b&&b.setAttribute("disabled","disabled")):(p&&(p.style.display=""),g&&(g.style.display=""),h&&(h.style.display=""),b&&(b.style.display=""),p&&p.removeAttribute("disabled"),g&&g.removeAttribute("disabled"),h&&h.removeAttribute("disabled"),b&&b.removeAttribute("disabled"));let o=y;i.getAttribute("data-html")?(t&&(t.style.display="none",t.setAttribute("disabled","disabled")),o&&(o.style.display="none",o.setAttribute("disabled","disabled"))):(t&&(t.style.display="",t.removeAttribute("disabled")),o&&(o.style.display="",o.removeAttribute("disabled")))}i.classList.contains("column-lock")?(p&&(p.style.display="none"),g&&(g.style.display="none"),m&&(m.style.display="none"),f&&(f.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),y&&(y.style.display="none"),w&&(w.style.display="none"),v&&(v.style.display="none")):(w&&(w.style.display=""),v&&(v.style.display=""))}));const d=r.querySelector(".cell-remove");d&&e.addEventListener(d,"click",(()=>{new fs(this.builder).removeColumn(),n.clearControls(),n.clearModals(),this.builder.onSelectChange&&this.builder.onSelectChange()}));let h=s.querySelector(".row-grideditor");h&&e.addEventListener(h,"click",(()=>{this.showGridEditor()}));const b=s.querySelector(".row-more");b&&e.addEventListener(b,"click",(t=>{let i;t.preventDefault(),t.stopImmediatePropagation();let o=n.cellSelected();if(i=o?o.parentNode:n.rowSelected(),!i)return;e.removeClass(i,"row-outline"),n.hideColumnTool();const s=window.innerHeight,l=n.getElementPosition(b);let a=l.top,r=l.left;this.renderRowMore();const c=this.rowMore;setTimeout((()=>{n.showPop(c,!1,b),this.refreshRowMoreState();const t=c.offsetHeight;e.removeClass(c,"arrow-bottom"),e.removeClass(c,"arrow-left"),e.removeClass(c,"arrow-right"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.removeClass(c,"left"),"right"===this.builder.opts.rowTool?(c.style.left=r-c.offsetWidth-10+"px",e.addClass(c,"arrow-right"),e.addClass(c,"left")):(c.style.left=r+35+"px",e.addClass(c,"arrow-left"),e.addClass(c,"left")),c.style.top=s-a>t?a+window.pageYOffset-8+"px":a+window.pageYOffset-t+b.offsetHeight+"px"}),0);let u=c.querySelector(".row-html"),d=c.querySelector(".row-duplicate");i.querySelector("[data-html]")?(u&&(u.style.display="none"),d&&(d.style.display="none")):(u&&(u.style.display=""),d&&(d.style.display=""));let h=!1;i.querySelectorAll("[data-noedit]").forEach((t=>{t.hasAttribute("data-html")||(h=!0)}));const p=c.querySelector(".row-locking");h?e.addClass(p,"on"):e.removeClass(p,"on")}));let p=s.querySelector(".row-remove");p&&e.addEventListener(p,"click",(()=>{this.grid.removeRow(),n.clearControls(),n.clearModals(),this.builder.onSelectChange&&this.builder.onSelectChange()}))}}refreshRowMoreState(){const t=this.rowMore||this.builder.builderStuff.querySelector(".rowmore");if(!t||!this.grid)return;const e=(e,i)=>{const n=t.querySelector(e);n&&(n.disabled=!i)};e(".row-up",this.grid.canMoveRowUp()),e(".row-down",this.grid.canMoveRowDown())}renderRowMore(){const t=this.builder,e=this.builder.builderStuff,i=this.builder.util,n=this.builder.dom;let o=e.querySelector(".rowmore");if(!o){let s=["moveup","movedown","duplicate","html","separator","lock","settings"];t.rowMoreButtons&&(s=t.rowMoreButtons);const l={moveup:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Move Up")}" class="row-up"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${i.out("Move Up")}</button>`,movedown:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Move Down")}" class="row-down"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${i.out("Move Down")}</button>`,duplicate:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Duplicate")}" class="row-duplicate"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${i.out("Duplicate")}</button>`,html:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("HTML")}" class="row-html">\n <span><svg class="is-icon-flex" style="margin-right:-3px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></span>${i.out("HTML")}\n </button>`,separator:'<div class="is-separator"></div>',lock:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Lock")}" class="row-locking"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-lock"></use></svg></span>${i.out("Lock")}</button>`,settings:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Settings")}" class="row-settings"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${i.out("Settings")}</button>`};let a=`<div class="is-pop rowmore" style="z-index:10002;" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${s.filter((e=>!(!t.opts.rowHtmlEditor&&"html"===e))).map((t=>l[t]||"")).join("")}\n </div>\n </div>\n `;n.appendHtml(e,a),o=e.querySelector(".rowmore"),this.rowMore=o;let r=o.querySelector(".row-settings");r&&n.addEventListener(r,"click",(()=>{if(this.builder.controlPanel)return this.builder.controlpanel.select("row",!0),void i.hidePop(this.rowMore);this.renderPanel();const t=this.rowSettings,n=this.rowOverlay();n&&(this.readRowStyles(n),i.saveSelection(),i.showModal(t,!1,(()=>{"flex"===e.querySelector(".is-rte-tool").style.display&&i.restoreSelection()})),i.hidePop(this.rowMore))})),r=o.querySelector(".row-up"),r&&n.addEventListener(r,"click",(()=>{this.grid.moveRowUp(),this.refreshRowMoreState()})),r=o.querySelector(".row-down"),r&&n.addEventListener(r,"click",(()=>{this.grid.moveRowDown(),this.refreshRowMoreState()})),r=o.querySelector(".row-duplicate"),r&&n.addEventListener(r,"click",(()=>{this.grid.duplicateRow(),i.hidePop(o),i.hideColumnTool(),i.clearControls()})),r=o.querySelector(".row-html"),r&&n.addEventListener(r,"click",(()=>{let e,n=i.cellSelected();if(e=n?n.parentNode:i.rowSelected(),!e)return;new us(t).view("row")}));const c=o.querySelector(".row-locking");c&&n.addEventListener(c,"click",(e=>{let s=i.rowSelected();if(!s)return;let l=!1;s.querySelectorAll("[data-noedit]").forEach((t=>{t.hasAttribute("data-html")||(l=!0)})),l?(Array.from(s.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-col-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-row-overlay")||(e.removeAttribute("data-noedit"),e.contentEditable=!0,t.colTool.showHideLockIndicator(e),t.element.applyBehavior(e))})),n.removeClass(c,"on")):(Array.from(s.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-col-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-row-overlay")||(e.setAttribute("data-noedit",""),e.contentEditable=!1,i.clearActiveElement(!0),t.colTool.showHideLockIndicator(e),t.element.applyBehavior(e))})),n.addClass(c,"on")),i.hidePop(o),e.preventDefault()}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.rowsettings");if(!n){let o=function(t,e){return`\n <div class="is-modal rowsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Row Settings")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Row Settings")}">\n <button type="button" role="tab" id="tabRowGeneral" data-tab="divRowGeneral" aria-controls="divRowGeneral" aria-selected="true" tabindex="0">${e.out("General")}</button>\n <button type="button" role="tab" id="tabRowMore" data-tab="divRowMore" aria-controls="divRowMore" aria-selected="false" tabindex="-1">${e.out("More")}</button>\n </div>\n\n <div id="divRowGeneral" class="is-tab-content" role="tabpanel" aria-labelledby="tabRowGeneral" data-group="rowsettings" style="display:flex" tabindex="-1">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-cs-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="cb-cs-seg-btn on" data-fill="color">${e.out("Color")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-row-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-row-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="cell-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-cell-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${t.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-row-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-row-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkRowGrayscale" class="chk-row-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n \x3c!-- Wrap Columns (Breakpoint): hidden like the legacy dialog (not in use).\n Kept in the DOM so the #rdoColMdWrap/#rdoColSmWrap/#rdoColXsWrap hooks exist. --\x3e\n <div class="div-row-wrapcolumns" style="display:none;flex-direction:column;padding-bottom:7px">\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Wrap Columns (Breakpoint)")}:</div>\n <div style="padding-top:3px;padding-bottom:5px;display:flex;align-items: center;">\n <label class="flex mr-3" title="${e.out("Tablet (Landscape)")}">\n <input type="radio" id="rdoColMdWrap" name="boxWrap" value="md">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px;transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n <label class="flex mr-3" title="${e.out("Tablet (Portrait)")}">\n <input type="radio" id="rdoColSmWrap" name="boxWrap" value="sm">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n <label class="flex" title="${e.out("Mobile")}">\n <input type="radio" id="rdoColXsWrap" name="boxWrap" value="xs">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n </div>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — it\n scopes the three per-device controls below (visibility, columns\n per line, reverse). Flat section (no box); heading + note convey it. --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-cs-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this row")}</span>\n <label class="switch"><input id="chkRowVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden"><span>${e.out("Hidden")}</span></button>\n </div>\n\n <div class="div-colsperline cb-field">\n <span class="cb-grouplabel">${e.out("Columns per Line")}</span>\n <select class="input-numofcols" id="__input_numofcols" style="display:none">\n <option value="">Default</option>\n <option value="2">2 columns per row</option>\n <option value="3">3 columns per row</option>\n <option value="4">4 columns per row</option>\n <option value="5">5 columns per row</option>\n <option value="6">6 columns per row</option>\n </select>\n <div class="cb-cs-colsperline">\n <button title="1" class="input-colsperline on" data-value="1">1</button>\n <button title="2" class="input-colsperline" data-value="2">2</button>\n <button title="3" class="input-colsperline" data-value="3">3</button>\n <button title="4" class="input-colsperline" data-value="4">4</button>\n <button title="5" class="input-colsperline" data-value="5">5</button>\n <button title="6" class="input-colsperline" data-value="6">6</button>\n <button title="${e.out("Default")}" class="input-colsperline cb-cs-colsperline-default" data-value="">${e.out("Default")}</button>\n </div>\n </div>\n\n <div id="divReverseColumns" class="cb-switchrow" style="margin-bottom:0">\n <span class="lbl">${e.out("Reverse Columns")}</span>\n <label class="switch"><input id="chkReverseColumns" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n </div>\n\n <div id="divRowMore" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabRowMore" data-group="rowsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpRowId">${e.out("Add Row ID")}:</label>\n <input id="inpRowId" class="input-row-id cb-cs-mono" type="text" onkeypress="return /[0-9a-zA-Z_]/i.test(event.key)" placeholder="${e.out("e.g. hero-row")}">\n <p class="cb-cs-hint">${e.out("A unique id for anchors or custom scripts.")}</p>\n </div>\n\n <div class="cb-field">\n <label>${e.out("Add Css Classes")}:</label>\n <div data-row-class-chips></div>\n \x3c!-- hook kept for readRowStyles + the change handler; hidden, driven by the chip field --\x3e\n <input id="inpRowCssClasses" class="input-row-classes" type="text" style="display:none">\n <p class="cb-cs-hint">${e.out("Space-separated classes applied to the row element.")}</p>\n </div>\n\n </div>\n\n </div>\n\n </div>\n </div>\n `}(this.builder,e);i.appendHtml(t,o),n=t.querySelector(".is-modal.rowsettings"),this.rowSettings=n,i.accessibleTabs(n.querySelector(".cb-tabs"),((t,e)=>{n.querySelectorAll('.is-tab-content[data-group="rowsettings"]').forEach((t=>{t.style.display="none"}));const i=n.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex")}));const s=document.querySelector(".is-modal.imagesource"),l=document.querySelector(".is-modal.imageadjust"),a=document.querySelector(".is-modal.imageadjust2");this.imageSource=s,this.imageAdjust=l,this.imageAdjust2=a,this.divRowGeneral=n.querySelector("#divRowGeneral");const r=n.querySelector(".div-colsperline");this.builder.enableColumnsPerLine||(r.style.display="none");let c=n.querySelector(".input-row-bgcolor");c.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{const i=this.rowOverlay();if(i){if(i.style.backgroundColor=t,e.paintColorButton(c,t),""!==t){n.querySelector(".input-row-gradient").style.backgroundImage="",i.style.backgroundImage=""}this.builder.opts.onChange()}}),n.querySelector(".input-row-bgcolor span").style.backgroundColor,(()=>{c.removeAttribute("data-focus"),c.focus()}),c,!0),c.setAttribute("data-focus",!0)}));const u=n.querySelector(".input-cell-bgimage");u&&i.addEventListener(u,"click",(()=>{const t=this.rowOverlay();if(!t)return;let e="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(e=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.builder.colTool.openImagePicker(e,(t=>{const e=this.rowOverlay();if(!e)return;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=n.querySelector(".cell-bgimage-preview"),o=this.rowSettings.querySelector(".input-row-bgimageadjust"),s=this.rowSettings.querySelector(".input-row-bgremove");o.style.display="none",s.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):i.innerHTML="",this.builder.opts.onChange()}),u)}));const d=n.querySelector(".input-row-bgimageadjust");d&&i.addEventListener(d,"click",(()=>{const t=this.rowOverlay();t&&this.builder.colTool.openImageAdjust(t,d)}));let h=n.querySelector(".input-row-bgremove");h&&i.addEventListener(h,"click",(()=>{const t=this.rowOverlay();if(!t)return;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const e=n.querySelector(".cell-bgimage-preview"),i=this.rowSettings.querySelector(".input-row-bgimageadjust"),o=this.rowSettings.querySelector(".input-row-bgremove");i.style.display="none",o.style.display="none",e.innerHTML="",this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divRowGeneral.querySelector(".input-select").style.display="none");const b=this.divRowGeneral.querySelector(".input-select");this.builder.renderSelectAsset(b,"image",(t=>{const e=this.rowOverlay();if(!e)return;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=n.querySelector(".cell-bgimage-preview"),o=this.rowSettings.querySelector(".input-row-bgimageadjust"),s=this.rowSettings.querySelector(".input-row-bgremove");o.style.display="none",s.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):i.innerHTML="",this.builder.opts.onChange()}));const p=this.builder.gradientpicker();let g=n.querySelector(".input-row-gradient");g.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const t=this.rowOverlay();t&&(p.open(t,(()=>{this.rowSettings.querySelector(".input-row-bgimageadjust").style.display="none";this.rowSettings.querySelector(".input-row-bgremove").style.display="none";this.rowSettings.querySelector(".cell-bgimage-preview").innerHTML="";if(this.imageSource.querySelector(".input-src").value="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=this.rowSettings.querySelector(".input-row-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}}),(t=>{g.removeAttribute("data-focus"),g.focus()}),g,!0),g.setAttribute("data-focus",!0))}));const m=n.querySelector(".chk-row-grayscale");m.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t=this.rowOverlay();t&&(m.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),this.builder.opts.onChange())}));let f=n.querySelectorAll(".input-device");f.forEach((t=>{t.addEventListener("click",(()=>{let i=e.rowSelected();i&&(n.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(i))}))}));let y=n.querySelector(".input-visible"),v=n.querySelector(".input-hidden");y.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?t.classList.remove("xs-hidden"):"sm"===o?t.classList.remove("sm-hidden"):"md"===o?t.classList.remove("md-hidden"):""===o&&t.classList.remove("desktop-hidden"),y.classList.add("on"),v.classList.remove("on"),this.builder.opts.onChange()})),v.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?t.classList.add("xs-hidden"):"sm"===o?t.classList.add("sm-hidden"):"md"===o?t.classList.add("md-hidden"):""===o&&t.classList.add("desktop-hidden"),y.classList.remove("on"),v.classList.add("on"),this.builder.opts.onChange()})),f=n.querySelectorAll(".input-colsperline"),f.forEach((t=>{t.addEventListener("click",(()=>{let i=e.rowSelected();if(!i)return;this.builder.uo.saveForUndo(),n.querySelectorAll(".input-colsperline").forEach((t=>{t.classList.remove("on")})),t.classList.add("on");let o=t.getAttribute("data-value"),s=n.querySelector(".div-target"),l=this.builder.responsive.readTarget(s);"xs"===l?(i.classList.remove("xs-items-1"),i.classList.remove("xs-items-2"),i.classList.remove("xs-items-3"),i.classList.remove("xs-items-4"),i.classList.remove("xs-items-5"),i.classList.remove("xs-items-6"),""!==o&&i.classList.add(`xs-items-${o}`)):"sm"===l?(i.classList.remove("sm-items-1"),i.classList.remove("sm-items-2"),i.classList.remove("sm-items-3"),i.classList.remove("sm-items-4"),i.classList.remove("sm-items-5"),i.classList.remove("sm-items-6"),""!==o&&i.classList.add(`sm-items-${o}`)):"md"===l?(i.classList.remove("md-items-1"),i.classList.remove("md-items-2"),i.classList.remove("md-items-3"),i.classList.remove("md-items-4"),i.classList.remove("md-items-5"),i.classList.remove("md-items-6"),""!==o&&i.classList.add(`md-items-${o}`)):""===l&&(i.classList.remove("desktop-items-1"),i.classList.remove("desktop-items-2"),i.classList.remove("desktop-items-3"),i.classList.remove("desktop-items-4"),i.classList.remove("desktop-items-5"),i.classList.remove("desktop-items-6"),""!==o&&i.classList.add(`desktop-items-${o}`)),this.builder.settings.onChange()}))}));const w=n.querySelector("#chkReverseColumns");w.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo();let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?w.checked?t.classList.add("xs-column-reverse"):t.classList.remove("xs-column-reverse"):"sm"===o?w.checked?t.classList.add("sm-column-reverse"):t.classList.remove("sm-column-reverse"):"md"===o?w.checked?t.classList.add("md-column-reverse"):t.classList.remove("md-column-reverse"):""===o&&(w.checked?t.classList.add("desktop-column-reverse"):t.classList.remove("desktop-column-reverse")),this.builder.settings.onChange()}));let x=n.querySelector(".input-row-id");x.addEventListener("change",(()=>{let t=e.rowSelected();t&&(this.builder.uo.saveForUndo(),""!==x.value?t.setAttribute("id",x.value):t.removeAttribute("id"),this.builder.opts.onChange())}));let k=n.querySelector(".input-row-classes");k.addEventListener("change",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo();let i=[],n=t.getAttribute("data-class");n&&(i=n.split(" "));let o=[],s=k.value;o=s.split(" "),i.forEach((e=>{o.includes(e)||t.classList.remove(e)})),o.forEach((e=>{""!==e&&t.classList.add(e)})),t.setAttribute("data-class",s),""===t.getAttribute("data-class")&&t.removeAttribute("data-class"),this.builder.opts.onChange()})),new Nc({element:n}),new vs({selector:".is-modal.rowsettings .is-draggable"}),function(t){const e=t.rowSettings;if(!e)return;const i=t.builder.util,n=e.querySelectorAll(".cb-cs-seg-btn"),o=e.querySelectorAll(".cb-cs-fill"),s=t=>{n.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),o.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))};t._showRowFill=s,n.forEach((t=>{t.addEventListener("click",(()=>s(t.getAttribute("data-fill"))))}));const l=e.querySelector("#chkRowVisible"),a=e.querySelector(".input-visible"),r=e.querySelector(".input-hidden"),c=()=>{l&&a&&(l.checked=a.classList.contains("on"))};t._syncRowVisSwitch=c,l&&l.addEventListener("change",(()=>{l.checked?a&&a.click():r&&r.click()})),e.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(c,0)))}));const u=e.querySelector("[data-row-class-chips]"),d=e.querySelector(".input-row-classes");u&&d&&(t._rowClassChips=i.chipField(u,{placeholder:i.out("Add class…"),removeTitle:i.out("Remove"),onChange:t=>{d.value=t.join(" "),d.dispatchEvent(new Event("change",{bubbles:!0}))}}))}(this)}}realtimeVisibility(t,e){if(!this.rowSettings)return;if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.rowSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.rowSettings.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.rowSettings.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.rowSettings.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.rowSettings.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.rowSettings.querySelector(".div-target"),n=this.rowSettings.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),this.rowSettings.querySelectorAll(".input-colsperline").forEach((t=>{t.classList.remove("on")}));let l=!1;"xs"===o?(l=t.classList.contains("xs-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="none",t.classList.contains("xs-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("xs-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("xs-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("xs-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("xs-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("xs-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"),e||this.builder.livePreview.resizePreview(375)):"sm"===o?(l=t.classList.contains("sm-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("sm-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("sm-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("sm-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("sm-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("sm-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("sm-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(768)):"md"===o?(l=t.classList.contains("md-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("md-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("md-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("md-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("md-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("md-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("md-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(1024)):(l=t.classList.contains("desktop-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("desktop-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("desktop-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("desktop-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("desktop-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("desktop-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("desktop-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(1920));this.rowSettings.querySelector("#chkReverseColumns").checked=l}moveRowUp(){this.grid.moveRowUp()}moveRowDown(){this.grid.moveRowDown()}duplicateRow(){this.grid.duplicateRow()}removeRow(){this.grid.removeRow()}hideGridEditor(){const t=this.builder.builderStuff.querySelector(".grideditor");if(!t)return;t.classList.remove("active");this.builder.doc.querySelectorAll(this.builder.opts.container).forEach((t=>{t.removeAttribute("grideditor")}))}showGridEditor(){const t=this.builder.builderStuff,e=this.builder.util,i=t.querySelector(".grideditor");if(!i)return;const n=t=>{let e=t.target;e&&(e.closest(".rte-grideditor")||e.closest(".grideditor")||e.closest(".is-modal")||e.closest(".keep-selection")||e.closest(".is-sidebar")||e.closest(".is-rte-tool")||e.closest(".is-rte-pop")||e.closest(".is-elementrte-tool")||e.closest(".is-builder")||e.closest(".is-pop")||(this.hideGridEditor(),document.removeEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",n),this.builder.handleGridToolClickOut_=!1))};if(i.classList.contains("active"))return this.hideGridEditor(),document.removeEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",n),void(this.builder.handleGridToolClickOut_=!1);e.showModal(i);this.builder.doc.querySelectorAll(this.builder.opts.container).forEach((t=>{t.setAttribute("grideditor","")})),this.builder.handleGridToolClickOut_||(document.addEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",n),this.builder.handleGridToolClickOut_=!0)}readRowStyles(t){const e=this.builder.util;if(!this.rowSettings)return;e.clearActiveElement();let i=t.style.backgroundColor,n=this.rowSettings.querySelector(".input-row-bgcolor");i?e.paintColorButton(n,i):e.paintColorButton(n,"");let o="";const s=this.rowSettings.querySelector(".cell-bgimage-preview"),l=this.rowSettings.querySelector(".input-row-bgimageadjust");l.style.display="none";const a=this.rowSettings.querySelector(".input-row-bgremove");a.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(o=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),s.innerHTML=`<img src="${o}">`,l.style.display="flex",a.style.display="flex"):s.innerHTML="";let r=this.rowSettings.querySelector(".input-row-gradient");if(r.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;r.style.backgroundImage=e}const c=this.rowSettings.querySelector(".chk-row-grayscale");c.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(c.checked=!0);let u=t.parentNode;this.realtimeVisibility(u,!0);const d=this.rowSettings.querySelector("#divReverseColumns");let h=3;u.querySelector(".is-row-overlay")&&(h=4),u.childElementCount-h>1?d.style.display="flex":d.style.display="none";let b=this.rowSettings.querySelector(".input-row-id");b.value="";const p=u.getAttribute("id");p&&(b.value=p);let g=this.rowSettings.querySelector(".input-row-classes");g.value="";const m=u.getAttribute("data-class");g.value=m,function(t,e){if(!t.rowSettings||!e)return;let i="color";const n=e.style.backgroundImage;n&&-1!==n.indexOf("url(")?i="image":n&&n.includes("linear")&&(i="gradient"),t._showRowFill&&t._showRowFill(i),t._syncRowVisSwitch&&t._syncRowVisSwitch(),t._rowClassChips&&t._rowClassChips.set(e.getAttribute("data-class")||"")}(this,t)}rowOverlay(){const t=this.builder.util,e=this.builder.dom;let i=t.rowSelected();if(!i)return!1;let n=i.querySelector(".is-row-overlay");return n||(e.appendHtml(i,'<div class="is-row-overlay"></div>'),n=i.querySelector(".is-row-overlay")),i.classList.add("relative"),n}}class eu{constructor(t){this.builder=t;const e=this.builder.dom;this.dom=e}render(t){const e=this.dom,n=this.builder.util,o=this.builder.builderStuff;let s=t.querySelector(".is-rowadd-tool");if(!s){const i=`<div class="is-rowadd-tool" style="height:0">\n <button type="button" tabindex="-1" title="${n.out("Add")}" title="${n.out("Add")}" style="outline:none;line-height:1;margin:0;padding:0;cursor:pointer;background-color:rgba(255,255,255,0.9);"><svg class="is-icon-flex" style="fill:rgba(0, 0, 0, 0.8);width:17px;height:17px;"><use xlink:href="#ion-ios-plus-empty"></use></svg></button>\n </div>`;e.appendHtml(t,i),s=t.querySelector(".is-rowadd-tool");let o=s.querySelectorAll("[title]");Array.prototype.forEach.call(o,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}))}let l=s.querySelector("button");e.addEventListener(l,"click",(t=>{t.preventDefault(),t.stopImmediatePropagation();const s=i(this.builder);s.querySelector(".is-pop-tabs").style.display="none";const a=window.innerHeight,r=n.getElementPosition(l);let c=r.top,u=r.left;n.showPop(s,!1,l);const d=s.offsetWidth,h=s.offsetHeight;a-c>h?(s.style.top=c+window.pageYOffset+27+"px",s.style.left=u-d/2+7+"px",e.removeClass(s,"arrow-bottom"),e.removeClass(s,"arrow-right"),e.removeClass(s,"arrow-left"),e.removeClass(s,"center"),e.addClass(s,"arrow-top"),e.addClass(s,"center")):(s.style.top=c+window.pageYOffset-h-8+"px",s.style.left=u-d/2+7+"px",e.removeClass(s,"arrow-top"),e.removeClass(s,"arrow-right"),e.removeClass(s,"arrow-left"),e.removeClass(s,"center"),e.addClass(s,"arrow-bottom"),e.addClass(s,"center")),s.setAttribute("data-mode","row"),s.classList.remove("simple");const b=t=>{let e=t.target;if(e&&!(e.closest(".quickadd")||e.closest(".row-add")||e.closest(".is-rowadd-tool")||e.closest(".cell-add")||e.closest(".elm-add")||e.closest(".row-add-initial"))){const t=o.querySelector(".quickadd");n.hidePop(t),document.removeEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",b),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",b),this.builder.handleQuickAddClickOut_=!0)}))}}class iu{constructor(t){this.builder=t,this.grid=new fs(t);const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=this.builder.dom;if(this.dom=n,!i.querySelector(".is-pop.imageadjust")){let t=`\n <div class="is-modal imageadjust" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content" style="max-width:420px;">\n <div class="is-modal-bar is-draggable">\n ${e.out("Background Image Adjustments")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:25px;">\n\n <div class="div-target" style="display: flex;justify-content: flex-end;padding: 5px 0 0;">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px;transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:13px;height:13px"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n\n <div class="cb-grouplabel">${e.out("Scale")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="100" max="500" value="0" class="image-scale-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Horizontal")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="0" max="100" value="0" class="image-hor-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Vertical")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="0" max="100" value="0" class="image-vert-slider is-rangeslider">\n </div>\n\n <div style="padding-bottom:3px;padding-top: 10px;display:flex;justify-content:right;align-items:center;">\n <button title="${e.out("Reset")}" class="image-reset" style="display:flex;width:30px;height:30px;"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n\n </div>\n\n </div>\n </div> \n\n <div class="is-modal imageadjust2" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content" style="max-width:420px;">\n <div class="is-modal-bar is-draggable">\n ${e.out("Background Image Adjustments")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:25px;">\n\n <div class="cb-grouplabel">${e.out("Scale")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="100" max="500" value="0" class="image-scale-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px">${e.out("Horizontal")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="-150" max="150" value="0" class="image-hor-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px">${e.out("Vertical")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="-150" max="150" value="0" class="image-vert-slider is-rangeslider">\n </div>\n\n <div style="padding-bottom:3px;padding-top: 10px;display:flex;justify-content:right;align-items:center;">\n <button title="${e.out("Reset")}" class="image-reset" style="display:flex;width:30px;height:30px;"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n\n </div>\n </div> \n\n <div class="is-modal imagesource" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form" style="max-width:550px;">\n\n <div class="cb-field">\n <label for="inpCellImageBgSource">${e.out("Source")}:</label>\n <div class="image-src">\n <input id="inpCellImageBgSource" class="input-src" type="text">\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="image-larger3 input-upload" style="position: relative; flex: 0 0 auto;box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetCellImageUpload" method="post" action="${this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="position:absolute;display:flex;justify-content: center;align-items: center;top:0;left:0;width:100%;height:100%;">\n <input id="hidRefId3" name="hidRefId" type="hidden" value="">\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage3" name="fileImage" type="file" accept="image/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="-1" tabIndex="0" id="frameTargetCellImageUpload" name="frameTargetCellImageUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n\n </div>\n </div>\n\n <div class="is-locked-indicator">\n <svg class="is-icon-flex"><use xlink:href="#icon-lock"></use></svg>\n </div>\n `;n.appendHtml(i,t),this.builder.iframe?this.lockIndicator=this.builder.contentStuff.querySelector(".is-locked-indicator"):this.lockIndicator=i.querySelector(".is-locked-indicator");const o=document.querySelector(".is-modal.imagesource"),s=document.querySelector(".is-modal.imageadjust"),l=document.querySelector(".is-modal.imageadjust2");this.imageSource=o,this.imageAdjust=s,this.imageAdjust2=l,""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(o.querySelector(".image-larger3").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none");let a=o.querySelector(".image-src");if(this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const t=o.querySelector(".input-select");t&&n.addEventListener(t,"click",(()=>{if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-src"),theTrigger:t});else{let n=i.querySelector(".is-modal.imageselect"),o=n.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(n,!1,(()=>{t.removeAttribute("data-focus"),t.focus()}),!1,this.builder.assetPanelFullScreen),t.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-src"),this.builder.targetCallback=null,this.builder.targetAssetType="image"}))}else n.removeClass(a,"image-select");let r=o.querySelector("#fileImage3");n.addEventListener(r,"change",(t=>{let e=r;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let i=e;n.addClass(i,"please-wait"),o.querySelector("#hidRefId3").value=this.builder.opts.customval,this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):i.submit(),r.value=""}));const c=o.querySelector(".input-ok");n.addEventListener(c,"click",(()=>{const t=this.imageSource.querySelector(".input-src").value;this.builder.imageSelectedCallback&&this.builder.imageSelectedCallback(t),this.builder.hideModal(o)}));const u=o.querySelector(".input-cancel");n.addEventListener(u,"click",(()=>{this.builder.hideModal(o)}));const d=s.querySelector(".image-scale-slider");d.onfocus=()=>{this.builder.uo.saveForUndo(!0)},d.oninput=()=>{let t=d.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let t=e.getAttribute("data-bg-xs");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-xs",i.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let t=e.getAttribute("data-bg-sm");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-sm",i.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let t=e.getAttribute("data-bg-md");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-md",i.style.cssText)}else e.style.backgroundSize=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},d.onchange=()=>{(document.querySelector(".content-preview.is-screen-375.active")||document.querySelector(".content-preview.is-screen-768.active")||document.querySelector(".content-preview.is-screen-1024.active"))&&(d.value=0),this.builder.opts.onChange()};const h=l.querySelector(".image-scale-slider");h.onfocus=()=>{this.builder.uo.saveForUndo(!0)},h.oninput=()=>{let t=this.builder.elementSelected,e=h.value;this.scaleWidth?(t.style.width=e+"%",t.style.height=100*e/h.min+"%"):(t.style.height=e+"%",t.style.width=100*e/h.min+"%"),t.setAttribute("data-scale",e)},h.onchange=()=>{this.builder.opts.onChange()};const b=s.querySelector(".image-hor-slider");b.onfocus=()=>{this.builder.uo.saveForUndo(!0)},b.oninput=()=>{let t=b.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let i=e.getAttribute("data-bg-xs");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-xs",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let i=e.getAttribute("data-bg-sm");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-sm",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let i=e.getAttribute("data-bg-md");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-md",n.style.cssText)}else e.style.backgroundPositionX=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},b.onchange=()=>{this.builder.win.adjustBgPos&&this.builder.win.adjustBgPos(),this.builder.opts.onChange()};const p=l.querySelector(".image-hor-slider");p.onfocus=()=>{this.builder.uo.saveForUndo(!0)},p.oninput=()=>{let t=this.builder.elementSelected,e=parseFloat(p.value);t.style.left=`${e}%`,t.style.right="",t.setAttribute("data-x",e)},p.onchange=()=>{this.builder.opts.onChange()};const g=s.querySelector(".image-vert-slider");g.onfocus=()=>{this.builder.uo.saveForUndo(!0)},g.oninput=()=>{let t=g.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let i=e.getAttribute("data-bg-xs");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-xs",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let i=e.getAttribute("data-bg-sm");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-sm",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let i=e.getAttribute("data-bg-md");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-md",n.style.cssText)}else e.style.backgroundPositionY=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},g.onchange=()=>{this.builder.win.adjustBgPos&&this.builder.win.adjustBgPos(),this.builder.opts.onChange()};const m=l.querySelector(".image-vert-slider");m.onfocus=()=>{this.builder.uo.saveForUndo(!0)},m.oninput=()=>{let t=this.builder.elementSelected,e=parseFloat(m.value);t.style.top=`${e}%`,t.style.bottom="",t.setAttribute("data-y",e)},m.onchange=()=>{this.builder.opts.onChange()};s.querySelector(".image-reset").addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.elementSelected;this.resetImage(t),this.builder.opts.onChange()}));l.querySelector(".image-reset").addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.elementSelected;this.resetImage2(t),this.builder.opts.onChange()}));this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on");i.querySelector(".is-modal.content-preview").classList.contains("active")||this.builder.openPreview(),this.realtimeImageAdjust(),this.readImageAdjust(this.builder.elementSelected,this.useTarget)}))}))}this.renderColMore()}refreshColumnMoreState(){const t=this.builder.builderStuff.querySelector(".columnmore");if(!t||!this.grid)return;const e=(e,i)=>{const n=t.querySelector(e);n&&(n.disabled=!i)};e(".cell-prev",this.grid.canMoveColumnPrevious()),e(".cell-next",this.grid.canMoveColumnNext()),e(".cell-up",this.grid.canMoveColumnUp()),e(".cell-down",this.grid.canMoveColumnDown())}renderColMore(){const t=this.builder,e=this.builder.builderStuff,i=this.builder.util,n=this.builder.dom;this.grid=new fs(t);let o=e.querySelector(".is-pop.columnmore");if(!o){let s=["moveleft","moveright","moveup","movedown","increase","decrease","duplicate","html","separator","lock","settings"];t.columnMoreButtons&&(s=t.columnMoreButtons);const l={moveleft:`<button type="button" title="${i.out("Move Left")}" class="cell-prev" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-left"></use></svg></span>${i.out("Move Left")}</button>`,moveright:`<button type="button" title="${i.out("Move Right")}" class="cell-next" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-right"></use></svg></span>${i.out("Move Right")}</button>`,moveup:`<button type="button" title="${i.out("Move Up")}" class="cell-up" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${i.out("Move Up")}</button>`,movedown:`<button type="button" title="${i.out("Move Down")}" class="cell-down" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${i.out("Move Down")}</button>`,increase:`<button type="button" title="${i.out("Increase")}" class="cell-increase" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-increase"></use></svg></span>${i.out("Increase")}</button>`,decrease:`<button type="button" title="${i.out("Decrease")}" class="cell-decrease" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-decrease"></use></svg></span>${i.out("Decrease")}</button>`,duplicate:`<button type="button" title="${i.out("Duplicate")}" class="cell-duplicate" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${i.out("Duplicate")}</button>`,html:`<button type="button" title="${i.out("HTML")}" class="cell-html" style="flex: 1 1 calc(50% - 10px);">\n <span><svg class="is-icon-flex" style="margin-right:-3px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></span>${i.out("HTML")}\n </button>`,separator:'<div class="is-separator"></div>',lock:`<button type="button" title="${i.out("Lock")}" class="cell-locking" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-lock"></use></svg></span>${i.out("Lock")}</button>`,settings:`<button type="button" title="${i.out("Settings")}" class="cell-settings" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${i.out("Settings")}</button>`};let a,r=`\n <div class="is-pop columnmore" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${s.filter((e=>!(!t.opts.columnHtmlEditor&&"html"===e))).map((t=>l[t]||"")).join("")}\n </div>\n </div>\n `;n.appendHtml(e,r),o=e.querySelector(".columnmore"),this.columnMore=o,a=o.querySelector(".cell-prev"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnPrevious(),this.refreshColumnMoreState()})),a=o.querySelector(".cell-next"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnNext(),this.refreshColumnMoreState()})),a=o.querySelector(".cell-up"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnUp(),i.clearControls()})),a=o.querySelector(".cell-down"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnDown(),i.clearControls()})),a=o.querySelector(".cell-increase"),n.addEventListener(a,"click",(()=>{const t=i.cellSelected();if(!t)return;const e=t.parentNode;if(!this.builder.useDefaultGrid){let t=!1;Array.from(e.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-col-tool")||e.style.width&&(t=!0)})),t&&(Array.from(e.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||(t.style.width="",t.style.flex="",t.style.height="",t.style.minHeight="")})),i.fixLayout(e))}this.grid.increaseColumn(),Array.from(t.parentNode.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||t.getAttribute("data-module")&&i.refreshModuleLayout(t)}))})),a=o.querySelector(".cell-decrease"),n.addEventListener(a,"click",(()=>{const t=i.cellSelected();if(!t)return;const e=t.parentNode;if(!this.builder.useDefaultGrid){let t=!1;Array.from(e.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-col-tool")||e.style.width&&(t=!0)})),t&&(Array.from(e.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||(t.style.width="",t.style.flex="",t.style.height="",t.style.minHeight="")})),i.fixLayout(e))}this.grid.decreaseColumn(),Array.from(t.parentNode.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||t.getAttribute("data-module")&&i.refreshModuleLayout(t)}))})),a=o.querySelector(".cell-duplicate"),n.addEventListener(a,"click",(()=>{this.grid.duplicateColumn(),i.hidePop(this.columnMore),i.clearControls()})),a=o.querySelector(".cell-html"),a&&n.addEventListener(a,"click",(()=>{if(!i.cellSelected())return;new us(this.builder).view("cell")}));const c=o.querySelector(".cell-locking");c&&n.addEventListener(c,"click",(t=>{let e=i.cellSelected();e&&(e.hasAttribute("data-noedit")?(e.removeAttribute("data-noedit"),e.contentEditable=!0,n.removeClass(c,"on")):(e.setAttribute("data-noedit",""),e.contentEditable=!1,n.addClass(c,"on"),this.util.clearActiveElement(!0)),this.showHideLockIndicator(e),this.builder.element.applyBehavior(e),i.hidePop(this.columnMore),t.preventDefault())})),a=o.querySelector(".cell-settings"),a&&n.addEventListener(a,"click",(()=>{if(this.builder.controlPanel)return this.builder.controlpanel.select("column",!0),void i.hidePop(this.columnMore);this.renderPanel();const t=this.cellSettings;let n=i.cellSelected();n&&(this.readCellStyles(n),i.saveSelection(),i.showModal(t,!1,(()=>{"flex"===e.querySelector(".is-rte-tool").style.display&&i.restoreSelection()})),i.hidePop(this.columnMore))}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom,n=t.querySelector(".is-modal.imagesource"),o=t.querySelector(".is-modal.imageadjust"),s=t.querySelector(".is-modal.imageadjust2");this.imageSource=n,this.imageAdjust=o,this.imageAdjust2=s;let l=t.querySelector(".is-modal.columnsettings");if(!l){let n=function(t,e){const i=t.useLightbox,n=t.useCssClasses;return`\n <div class="is-modal columnsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Column Settings")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Column Settings")}">\n <button type="button" role="tab" id="tabCellGeneral" data-tab="divCellGeneral" aria-controls="divCellGeneral" aria-selected="true" tabindex="0">${e.out("General")}</button>\n <button type="button" role="tab" id="tabCellContent" data-tab="divCellContent" aria-controls="divCellContent" aria-selected="false" tabindex="-1">${e.out("Content")}</button>\n ${i?`\n <button type="button" role="tab" id="tabCellClick" data-tab="divCellClick" aria-controls="divCellClick" aria-selected="false" tabindex="-1">${e.out("On Click")}</button>\n `:""}\n <button type="button" role="tab" id="tabCellMore" data-tab="divCellMore" aria-controls="divCellMore" aria-selected="false" tabindex="-1">${e.out("More")}</button>\n </div>\n\n <div id="divCellGeneral" class="is-tab-content" role="tabpanel" aria-labelledby="tabCellGeneral" data-group="cellsettings" style="display:flex" tabindex="-1">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-cs-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="cb-cs-seg-btn on" data-fill="color">${e.out("Color")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-cell-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-cell-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="cell-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-cell-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${t.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-cell-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-cell-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Text Color")}</span>\n <div class="div-content-textcolor cb-cs-chips">\n <button title="${e.out("Dark")}" class="input-cell-textcolor" data-command="dark"><span>${e.out("Dark")}</span></button>\n <button title="${e.out("Light")}" class="input-cell-textcolor" data-command="light"><span>${e.out("Light")}</span></button>\n <button title="${e.out("Default")}" class="input-cell-textcolor" data-command=""><span>${e.out("Default")}</span></button>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkCellGrayscale" class="chk-cell-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — here it\n scopes the column's per-device visibility. Flat section (no box);\n heading + note convey the per-device scope (mirrors Row Settings). --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-cs-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this column")}</span>\n <label class="switch"><input id="chkCellVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden"><span>${e.out("Hidden")}</span></button>\n </div>\n\n \x3c!-- Hidden like the legacy dialog (not in use); kept only so the shared readCellStyles/handler have their hook element. --\x3e\n <div style="display:none"><input id="chkHideColumnOnMobile" class="chk-cell-hideonmobile" type="checkbox" /></div>\n\n </div>\n\n <div id="divCellContent" class="is-tab-content" role="tabpanel" aria-labelledby="tabCellContent" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Spacing")}</span>\n <span class="cb-cs-readout cb-cs-padding-readout is-default"></span>\n </div>\n\n <div class="div-content-padding-pos cb-cs-sidepad" style="${n?"":"display:none"}">\n <div class="cb-cs-mpad" role="group" aria-label="${e.out("Padding")}">\n <button title="${e.out("Top")}" class="input-cell-padding-pos on" data-command="top"><span></span></button>\n <button title="${e.out("Left")}" class="input-cell-padding-pos on" data-command="left"><span></span></button>\n <span class="cb-cs-mpad-mid"></span>\n <button title="${e.out("Right")}" class="input-cell-padding-pos on" data-command="right"><span></span></button>\n <button title="${e.out("Bottom")}" class="input-cell-padding-pos on" data-command="bottom"><span></span></button>\n </div>\n <div class="cb-cs-axis">\n <button title="${e.out("All")}" class="input-cell-padding-pos" data-command="all">${e.out("All")}</button>\n <button title="x" class="input-cell-padding-pos" data-command="x">X</button>\n <button title="y" class="input-cell-padding-pos" data-command="y">Y</button>\n </div>\n </div>\n\n <div class="div-content-padding cb-cs-chiprow">\n <div class="cb-cs-chipset" style="${n?"display:none":""}">\n <button title="0" class="input-cell-padding" data-command="0">0</button>\n <button title="10" class="input-cell-padding" data-command="10">10</button>\n <button title="20" class="input-cell-padding" data-command="20">20</button>\n <button title="30" class="input-cell-padding" data-command="30">30</button>\n <button title="40" class="input-cell-padding" data-command="40">40</button>\n <button title="50" class="input-cell-padding" data-command="50">50</button>\n <button title="60" class="input-cell-padding" data-command="60">60</button>\n </div>\n\n <div class="cb-cs-chipset" style="${n?"":"display:none"}">\n <button title="0" class="input-cell-padding" data-command="0">0</button>\n <button title="10" class="input-cell-padding" data-command="1">10</button>\n <button title="20" class="input-cell-padding" data-command="2">20</button>\n <button title="30" class="input-cell-padding" data-command="3">30</button>\n <button title="40" class="input-cell-padding" data-command="4">40</button>\n <button title="50" class="input-cell-padding" data-command="5">50</button>\n <button title="60" class="input-cell-padding" data-command="6">60</button>\n <button title="70" class="input-cell-padding" data-command="7">70</button>\n <button title="80" class="input-cell-padding" data-command="8">80</button>\n <button title="90" class="input-cell-padding" data-command="9">90</button>\n <button title="100" class="input-cell-padding" data-command="10">100</button>\n <button title="110" class="input-cell-padding" data-command="11">110</button>\n <button title="120" class="input-cell-padding" data-command="12">120</button>\n <button title="140" class="input-cell-padding" data-command="14">140</button>\n <button title="160" class="input-cell-padding" data-command="16">160</button>\n <button title="${e.out("Clear")}" class="input-cell-padding cb-cs-chip-clear" data-command=""><svg class="is-icon-flex" style="flex:none;width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n <p class="cb-cs-hint">${e.out("Empty keeps the column's default padding.")}</p>\n </div>\n\n \x3c!-- Min Height: hidden — rarely used and better set from another panel.\n Kept in the DOM so the shared .input-cell-height handlers don't null-error.\n TO RESTORE: delete the style="display:none" on the wrapper below. --\x3e\n <div style="display:none">\n <div class="is-separator"></div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Min Height")}</span>\n <div class="div-content-height cb-cs-heightrow">\n <div class="cb-cs-stepper">\n <button title="${e.out("Decrease")}" class="input-cell-height" data-command="-">&#8722;</button>\n <button title="${e.out("Increase")}" class="input-cell-height" data-command="+">+</button>\n </div>\n <div class="cb-cs-presets">\n <button title="300" class="input-cell-height" data-command="300">300</button>\n <button title="400" class="input-cell-height" data-command="400">400</button>\n <button title="500" class="input-cell-height" data-command="500">500</button>\n <button title="600" class="input-cell-height" data-command="600">600</button>\n <button title="700" class="input-cell-height" data-command="700">700</button>\n <button title="${e.out("Clear")}" class="input-cell-height cb-cs-chip-clear" data-command=""><svg class="is-icon-flex" style="flex:none;width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n </div>\n </div>\n\n <div class="is-separator"></div>\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Content Alignment")}</span>\n <span class="cb-cs-readout cb-cs-posval"></span>\n </div>\n <div class="cb-cs-padwrap">\n <div class="div-content-position cb-cs-pad" role="radiogroup" aria-label="${e.out("Content Alignment")}" tabindex="0">\n <div class="cbpad-fill"></div>\n <div class="cbpad-marker"><i></i><i></i></div>\n <button class="cmd-content-pos" data-pos="topleft" title="${e.out("Top Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="topcenter" title="${e.out("Top Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="topright" title="${e.out("Top Right")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="centerleft" title="${e.out("Center Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="center" title="${e.out("Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="centerright" title="${e.out("Center Right")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomleft" title="${e.out("Bottom Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomcenter" title="${e.out("Bottom Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomright" title="${e.out("Bottom Right")}" type="button"></button>\n </div>\n <button title="${e.out("Clear")}" class="cmd-content-pos cb-cs-pos-clear" data-pos="">${e.out("Clear")}</button>\n </div>\n <p class="cb-cs-hint">${e.out("Arrow keys move the selection.")}</p>\n </div>\n\n </div>\n\n <div id="divCellClick" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabCellClick" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpCellLinkSource">${e.out("Open on click")}:</label>\n <div class="image-src">\n <input id="inpCellLinkSource" class="input-src" type="text" placeholder="${e.out("Link, image, or video URL")}">\n <button title="${e.out("Select")}" class="input-select" style="flex:none;width:40px;">${t.opts.selectIcon}</button>\n\n <button title="${e.out(t.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:40px;">\n ${t.opts.otherSelectIcon}\n </button>\n\n <div class="image-larger4 is-btn classic" style="position: relative; flex: 0 0 auto; width: 40px; height: var(--cb-field-height); box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetLinkUpload" method="post" action="${t.opts.largerImageHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;width:100%;height:100%;border-radius:1px;display:flex;align-items: center;justify-content: center;">\n <input id="hidRefId4" name="hidRefId" type="hidden" value="">\n\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage4" name="fileImage" type="file" accept="image/*,video/mp4" style="position:absolute;top:-30px;left:0;width:100%;height:68px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="-1" id="frameTargetLinkUpload" name="frameTargetLinkUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n <p class="cb-cs-hint">${e.out("Turns the whole column into a link or lightbox trigger. Leave empty for no action.")}</p>\n </div>\n\n <div class="cb-field" style="align-items:flex-start">\n <button class="input-testclick classic-primary">${e.out("Test")}</button>\n </div>\n\n <p class="cb-cs-hint">${e.out("You can test the On-Click action on page if you lock the column by clicking the lock button")} <svg class="is-icon-flex"><use xlink:href="#icon-lock"></use></svg>.</p>\n\n </div>\n\n <div id="divCellMore" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabCellMore" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpCellId">${e.out("Add Column ID")}:</label>\n <input id="inpCellId" class="input-cell-id cb-cs-mono" type="text" onkeypress="return /[0-9a-zA-Z_]/i.test(event.key)" placeholder="${e.out("e.g. hero-left")}">\n <p class="cb-cs-hint">${e.out("A unique id for anchors or custom scripts.")}</p>\n </div>\n\n <div class="cb-field">\n <label>${e.out("Add Css Classes")}:</label>\n <div data-cell-class-chips></div>\n \x3c!-- hook kept for readCellStyles + the change handler; hidden, driven by the chip field --\x3e\n <input id="inpCellCssClasses" class="input-cell-classes" type="text" style="display:none">\n <p class="cb-cs-hint">${e.out("Space-separated classes applied to the column element.")}</p>\n </div>\n\n </div>\n\n </div>\n\n </div>\n </div>\n `}(this.builder,e);i.appendHtml(t,n),l=t.querySelector(".is-modal.columnsettings"),this.cellSettings=l,i.accessibleTabs(l.querySelector(".cb-tabs"),((t,e)=>{l.querySelectorAll('.is-tab-content[data-group="cellsettings"]').forEach((t=>{t.style.display="none"}));const i=l.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex")})),this.divCellClick=l.querySelector("#divCellClick"),this.divCellGeneral=l.querySelector("#divCellGeneral");let o=l.querySelector(".input-cell-id");o.addEventListener("change",(()=>{let t=e.cellSelected();t&&(this.builder.uo.saveForUndo(),""!==o.value?t.setAttribute("id",o.value):t.removeAttribute("id"),this.builder.opts.onChange())}));let s=l.querySelector(".input-cell-classes");s.addEventListener("change",(()=>{let t=e.cellSelected();if(!t)return;this.builder.uo.saveForUndo();let i=[],n=t.getAttribute("data-class");n&&(i=n.split(" "));let o=[],l=s.value;o=l.split(" "),i.forEach((e=>{o.includes(e)||t.classList.remove(e)})),o.forEach((e=>{""!==e&&t.classList.add(e)})),t.setAttribute("data-class",l),""===t.getAttribute("data-class")&&t.removeAttribute("data-class"),this.builder.opts.onChange()}));let a=l.querySelector(".input-cell-bgcolor");a.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{let i=e.cellSelected();if(i.style.backgroundColor=t,e.paintColorButton(a,t),""!==t){l.querySelector(".input-cell-gradient").style.backgroundImage="",i.style.backgroundImage=""}this.builder.opts.onChange()}),l.querySelector(".input-cell-bgcolor span").style.backgroundColor,(()=>{a.removeAttribute("data-focus"),a.focus()}),a,!0),a.setAttribute("data-focus",!0)}));const r=l.querySelector(".input-cell-bgimage");r&&i.addEventListener(r,"click",(()=>{let t=e.cellSelected();if(!t)return;let i="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(i=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.openImagePicker(i,(t=>{let i=e.cellSelected();if(!i)return;this.builder.uo.saveForUndo(),i.style.backgroundImage=`url("${t}")`,i.style.backgroundSize="cover",i.style.backgroundRepeat="no-repeat";const n=l.querySelector(".cell-bgimage-preview"),o=this.cellSettings.querySelector(".input-cell-bgimageadjust"),s=this.cellSettings.querySelector(".input-cell-bgremove");o.style.display="none",s.style.display="none",""!==t?(n.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):n.innerHTML="",this.builder.opts.onChange()}),r)}));const c=l.querySelector(".input-cell-bgimageadjust");c&&i.addEventListener(c,"click",(()=>{let t=e.cellSelected();t&&this.openImageAdjust(t,c)}));let u=l.querySelector(".input-cell-bgremove");u&&i.addEventListener(u,"click",(()=>{let t=e.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const i=l.querySelector(".cell-bgimage-preview"),n=this.cellSettings.querySelector(".input-cell-bgimageadjust"),o=this.cellSettings.querySelector(".input-cell-bgremove");n.style.display="none",o.style.display="none",i.innerHTML="",this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divCellGeneral.querySelector(".input-select").style.display="none");const d=this.divCellGeneral.querySelector(".input-select");this.builder.renderSelectAsset(d,"image",(t=>{let i=e.cellSelected();if(!i)return;this.builder.uo.saveForUndo(),i.style.backgroundImage=`url("${t}")`,i.style.backgroundSize="cover",i.style.backgroundRepeat="no-repeat";const n=l.querySelector(".cell-bgimage-preview"),o=this.cellSettings.querySelector(".input-cell-bgimageadjust"),s=this.cellSettings.querySelector(".input-cell-bgremove");o.style.display="none",s.style.display="none",""!==t?(n.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):n.innerHTML="",this.builder.opts.onChange()}));let h=l.querySelectorAll(".input-row-enlarge");Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected().parentNode;i.removeClass(o,"expand-10"),i.removeClass(o,"expand-20"),i.removeClass(o,"expand-30"),i.removeClass(o,"expand-40"),i.removeClass(o,"expand-50"),i.removeClass(o,"expand-60"),i.addClass(o,"expand-"+n),this.builder.opts.onChange()}))}));const b=this.builder.gradientpicker();let p=l.querySelector(".input-cell-gradient");p.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);let t=e.cellSelected();b.open(t,(()=>{this.cellSettings.querySelector(".input-cell-bgimageadjust").style.display="none";this.cellSettings.querySelector(".input-cell-bgremove").style.display="none";this.cellSettings.querySelector(".cell-bgimage-preview").innerHTML="";if(this.imageSource.querySelector(".input-src").value="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=l.querySelector(".input-cell-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}}),(t=>{p.removeAttribute("data-focus"),p.focus()}),p,!0),p.setAttribute("data-focus",!0)})),h=l.querySelectorAll(".input-cell-textcolor"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected();"dark"===n?(i.removeClass(o,"is-light-text"),i.addClass(o,"is-dark-text")):"light"===n?(i.removeClass(o,"is-dark-text"),i.addClass(o,"is-light-text")):(i.removeClass(o,"is-dark-text"),i.removeClass(o,"is-light-text"));let s=o.querySelectorAll("*");Array.prototype.forEach.call(s,(t=>{t.style.color&&(t.style.color="")})),this.builder.opts.onChange()}))})),h=l.querySelectorAll(".input-cell-padding-pos"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{let e=t.getAttribute("data-command"),n=this.cellSettings.querySelectorAll(".input-cell-padding-pos");Array.prototype.forEach.call(n,(t=>{i.removeClass(t,"on")})),"all"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="top"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="left"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="right"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="bottom"]'),"on")):"x"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="left"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="right"]'),"on")):"y"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="top"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="bottom"]'),"on")):i.addClass(t,"on");let o=this.cellSettings.querySelectorAll(".input-cell-padding");Array.prototype.forEach.call(o,(t=>{i.removeClass(t,"on")}))}))})),h=l.querySelectorAll(".input-cell-padding"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected(),s=this.cellSettings.querySelectorAll(".input-cell-padding");if(Array.prototype.forEach.call(s,(t=>{i.removeClass(t,"on")})),this.builder.useCssClasses){let e;i.removeClass(o,"padding-0"),i.removeClass(o,"padding-10"),i.removeClass(o,"padding-20"),i.removeClass(o,"padding-30"),i.removeClass(o,"padding-40"),i.removeClass(o,"padding-50"),i.removeClass(o,"padding-60");let s=this.cellSettings.querySelectorAll(".input-cell-padding-pos.on");if(2===s.length)if(e=s[0].getAttribute("data-command"),"left"===e){let t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.x;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.x[`px_${n}`])}else{let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.y;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.y[`py_${n}`])}else if(4===s.length){let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.all;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.x;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.y;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.all[`p_${n}`])}else if(e=s[0].getAttribute("data-command"),"top"===e){let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.top[`pt_${n}`])}else if("bottom"===e){let t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.bottom[`pb_${n}`])}else if("left"===e){let t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.left[`pl_${n}`])}else if("right"===e){let t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.right[`pr_${n}`])}i.addClass(t,"on")}else i.removeClass(o,"padding-0"),i.removeClass(o,"padding-10"),i.removeClass(o,"padding-20"),i.removeClass(o,"padding-30"),i.removeClass(o,"padding-40"),i.removeClass(o,"padding-50"),i.removeClass(o,"padding-60"),""!==n&&(i.addClass(o,"padding-"+n),i.addClass(t,"on"));this.builder.opts.onChange()}))}));const g=l.querySelector(".chk-cell-grayscale");i.addEventListener(g,"click",(()=>{this.builder.uo.saveForUndo();let t=e.cellSelected();g.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),this.builder.opts.onChange()}));const m=l.querySelector(".chk-cell-hideonmobile");if(i.addEventListener(m,"click",(()=>{this.builder.uo.saveForUndo();let t=e.cellSelected();m.checked?t.classList.add("hideonmobile"):t.classList.remove("hideonmobile"),this.builder.opts.onChange()})),h=l.querySelectorAll(".input-cell-height"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{let n=this.builder.colHeight;this.builder.uo.saveForUndo();let o=t.getAttribute("data-command"),s=e.cellSelected(),l=this.cellSettings.querySelectorAll(".input-cell-height");if(Array.prototype.forEach.call(l,(t=>{i.removeClass(t,"on")})),""===o)Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)}));else if("-"===o){let t=s.offsetHeight;Array.prototype.forEach.call(n,(e=>{if(t-e>0&&t-e<=50)if(Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+e),300===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');i.addClass(t,"on")}else if(400===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');i.addClass(t,"on")}else if(500===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');i.addClass(t,"on")}else if(600===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');i.addClass(t,"on")}else if(700===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');i.addClass(t,"on")}}))}else if("+"===o){let t=s.offsetHeight;Array.prototype.forEach.call(n,(e=>{if(e-t>0&&e-t<=50)if(Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+e),300===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');i.addClass(t,"on")}else if(400===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');i.addClass(t,"on")}else if(500===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');i.addClass(t,"on")}else if(600===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');i.addClass(t,"on")}else if(700===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');i.addClass(t,"on")}}))}else Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+o),i.addClass(t,"on");this.builder.opts.onChange()}))})),h=l.querySelectorAll(".cmd-content-pos"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-pos"),o=e.cellSelected();const s=this.cellSettings.querySelectorAll(".cmd-content-pos");if(Array.prototype.forEach.call(s,(t=>{i.removeClass(t,"on")})),this.builder.useCssClasses)if(""!==n){let e=this.builder.cssClasses.display;if(i.addCssClass(o,e.flex,e),e=this.builder.cssClasses.flexDirection,i.addCssClass(o,e.column,e),"topleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("topcenter"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("topright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}if("centerleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("center"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("centerright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}if("bottomleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("bottomcenter"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("bottomright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}o.style.justifyContent="",o.style.alignItems=""}else i.removeCssClasses(o,this.builder.cssClasses.display),i.removeCssClasses(o,this.builder.cssClasses.flexDirection),i.removeCssClasses(o,this.builder.cssClasses.justifyContent),i.removeCssClasses(o,this.builder.cssClasses.alignItems),o.style.display="",o.style.flexDirection="",o.style.justifyContent="",o.style.alignItems="";else o.style.display="flex",o.style.flexDirection="column","topleft"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="flex-start",i.addClass(t,"on")),"topcenter"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="center",i.addClass(t,"on")),"topright"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="flex-end",i.addClass(t,"on")),"centerleft"===n&&(o.style.justifyContent="center",o.style.alignItems="flex-start",i.addClass(t,"on")),"center"===n&&(o.style.justifyContent="center",o.style.alignItems="center",i.addClass(t,"on")),"centerright"===n&&(o.style.justifyContent="center",o.style.alignItems="flex-end",i.addClass(t,"on")),"bottomleft"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="flex-start",i.addClass(t,"on")),"bottomcenter"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="center",i.addClass(t,"on")),"bottomright"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="flex-end",i.addClass(t,"on"));this.builder.opts.onChange()}))})),this.builder.opts.onOtherSelectClick||""!==this.builder.opts.otherSelect){this.cellSettings.querySelector(".input-select-other").style.display="flex";let n=this.cellSettings.querySelector(".input-select-other");i.addEventListener(n,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:this.cellSettings.querySelector(".input-src"),theTrigger:this.cellSettings.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=this.cellSettings.querySelector(".input-src"),this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}if(""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(this.cellSettings.querySelector(".image-larger4").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divCellClick.querySelector(".input-select").style.display="none"),this.builder.opts.onMediaSelectClick||this.builder.opts.mediaSelect||this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const n=this.cellSettings.querySelector(".input-src");u=this.divCellClick.querySelector(".input-select"),u&&i.addEventListener(u,"click",(()=>{if(this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media",this.builder.opts.onMediaSelectClick)this.builder.opts.onMediaSelectClick({targetInput:n,theTrigger:u});else if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:n,theTrigger:u});else if(this.builder.opts.mediaSelect){let i=t.querySelector(".is-modal.mediaselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.mediaSelect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.mediaSelect),e.showModal(i,!1,(()=>{u.removeAttribute("data-focus"),u.focus()}),!1,this.builder.assetPanelFullScreen),u.setAttribute("data-focus",!0),this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media"}else if(this.builder.opts.imageselect){let i=t.querySelector(".is-modal.imageselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{u.removeAttribute("data-focus"),u.focus()}),!1,this.builder.assetPanelFullScreen),u.setAttribute("data-focus",!0),this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media"}}))}const f=this.cellSettings.querySelector(".input-src");i.observeElement(f,"value",(()=>{this.applyClick()}));let y=this.cellSettings.querySelector("#fileImage4");i.addEventListener(y,"change",(t=>{let e=y;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),this.cellSettings.querySelector("#hidRefId4").value=this.builder.opts.customval,this.builder.opts.onMediaUpload?this.builder.opts.onMediaUpload(t):this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),y.value=""}));const v=this.cellSettings.querySelector(".input-src");v.addEventListener("focus",(()=>{this.builder.uo.saveForUndo(!0)})),v.addEventListener("keyup",(()=>{let t=this.util.cellSelected();t&&(""===v.value?(i.removeClass(t,"block-click"),t.removeAttribute("data-modal-url")):(i.addClass(t,"block-click"),t.setAttribute("data-modal-url",v.value)),this.builder.opts.onChange())})),this.cellSettings.querySelector(".input-testclick").addEventListener("click",(()=>{let t=this.util.cellSelected();t&&""!==v.value&&this.builder.openMedia(t)})),this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{let e=this.util.cellSelected();e&&(this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(e))}))}));let w=this.cellSettings.querySelector(".input-visible"),x=this.cellSettings.querySelector(".input-hidden");const k=(t,e)=>t.querySelectorAll(`.${e}-hidden`).length>0;w.addEventListener("click",(()=>{let t=this.util.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=this.cellSettings.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.remove("xs-hidden"):"sm"===i?(t.classList.remove("sm-hidden"),k(t.parentNode,"sm")||t.parentNode.classList.remove("sm-autofit")):"md"===i?(t.classList.remove("md-hidden"),k(t.parentNode,"md")||t.parentNode.classList.remove("md-autofit")):""===i&&(t.classList.remove("desktop-hidden"),k(t.parentNode,"desktop")||t.parentNode.classList.remove("desktop-autofit")),w.classList.add("on"),x.classList.remove("on"),this.builder.opts.onChange()})),x.addEventListener("click",(()=>{let t=this.util.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=this.cellSettings.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.add("xs-hidden"):"sm"===i?(t.classList.add("sm-hidden"),t.parentNode.classList.add("sm-autofit")):"md"===i?(t.classList.add("md-hidden"),t.parentNode.classList.add("md-autofit")):""===i&&(t.classList.add("desktop-hidden"),t.parentNode.classList.add("desktop-autofit")),w.classList.remove("on"),x.classList.add("on"),this.builder.opts.onChange()})),new Nc({element:l}),new vs({selector:".is-modal.columnsettings .is-draggable"}),function(t){const e=t.cellSettings;if(!e)return;const i=t.util,n=e.querySelectorAll(".cb-cs-seg-btn"),o=e.querySelectorAll(".cb-cs-fill"),s=t=>{n.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),o.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))};t._showColumnFill=s,n.forEach((t=>{t.addEventListener("click",(()=>s(t.getAttribute("data-fill"))))}));const l=e.querySelectorAll(".div-content-textcolor .input-cell-textcolor");l.forEach((t=>{t.addEventListener("click",(()=>{l.forEach((t=>t.classList.remove("on"))),t.classList.add("on")}))}));const a=e.querySelector("#chkCellVisible"),r=e.querySelector(".input-visible"),c=e.querySelector(".input-hidden"),u=()=>{a&&r&&(a.checked=r.classList.contains("on"))};t._syncVisSwitch=u,a&&a.addEventListener("change",(()=>{a.checked?r&&r.click():c&&c.click()})),e.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(u,0)))}));const d=e.querySelector(".cb-cs-padding-readout");t._syncPaddingDefault=()=>{if(!d)return;const t=e.querySelector(".input-cell-padding.on");t&&""!==t.getAttribute("data-command")?(d.classList.remove("is-default"),d.textContent=t.textContent.trim()+"px"):(d.classList.add("is-default"),d.textContent=i.out("Default"))},e.querySelectorAll(".input-cell-padding").forEach((e=>{e.addEventListener("click",(()=>t._syncPaddingDefault()))}));const h=e.querySelector(".cb-cs-pad");if(h){const n=h.querySelector(".cbpad-fill"),o=h.querySelector(".cbpad-marker"),s=e.querySelector(".cb-cs-posval"),l=Array.prototype.slice.call(h.querySelectorAll(".cmd-content-pos")),a=t=>{const e=t%3,i=Math.floor(t/3),a=100/3;n&&(n.style.left=e*a+"%",n.style.top=i*a+"%",n.style.opacity="1"),o&&(o.style.left=(e+.5)*a+"%",o.style.top=(i+.5)*a+"%",o.style.opacity="1"),s&&(s.textContent=l[t]&&l[t].getAttribute("title")||"")};t._placeColumnPos=t=>{null==t||t<0?(n&&(n.style.opacity="0"),o&&(o.style.opacity="0"),s&&(s.textContent=i.out("Default"))):a(t)},l.forEach(((t,e)=>t.addEventListener("click",(()=>a(e))))),h.addEventListener("keydown",(t=>{let e=l.findIndex((t=>t.classList.contains("on")));e<0&&(e=4);let i=e%3,n=Math.floor(e/3),o=!0;if("ArrowLeft"===t.key?i=Math.max(0,i-1):"ArrowRight"===t.key?i=Math.min(2,i+1):"ArrowUp"===t.key?n=Math.max(0,n-1):"ArrowDown"===t.key?n=Math.min(2,n+1):o=!1,o){t.preventDefault();const e=l[3*n+i];e&&e.click()}}));const r=e.querySelector('.cmd-content-pos[data-pos=""]');r&&r.addEventListener("click",(()=>t._placeColumnPos(-1)))}const b=e.querySelector("[data-cell-class-chips]"),p=e.querySelector(".input-cell-classes");b&&p&&(t._cellClassChips=i.chipField(b,{placeholder:i.out("Add class…"),removeTitle:i.out("Remove"),onChange:t=>{p.value=t.join(" "),p.dispatchEvent(new Event("change",{bubbles:!0}))}}))}(this)}}moveColumnLeft(){this.grid.moveColumnPrevious()}moveColumnRight(){this.grid.moveColumnNext()}duplicateColumn(){this.grid.duplicateColumn()}removeColumn(){this.grid.removeColumn()}moveColumnUp(){this.grid.moveColumnUp()}moveColumnDown(){this.grid.moveColumnDown()}applyClick(){const t=this.dom;let e=this.util.cellSelected();if(!e)return;const i=this.cellSettings.querySelector(".input-src");let n=e.getAttribute("data-modal-url");n||(n=""),n!==i.value&&(this.builder.uo.saveForUndo(),t.addClass(e,"block-click"),e.setAttribute("data-modal-url",i.value),this.builder.opts.onChange())}readCellStyles(t){const e=this.dom;this.util.clearActiveElement();let i=t.style.backgroundColor,n=this.cellSettings.querySelector(".input-cell-bgcolor");i?this.util.paintColorButton(n,i):this.util.paintColorButton(n,"");let o="";const s=this.cellSettings.querySelector(".cell-bgimage-preview"),l=this.cellSettings.querySelector(".input-cell-bgimageadjust");l.style.display="none";const a=this.cellSettings.querySelector(".input-cell-bgremove");a.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(o=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),s.innerHTML=`<img src="${o}">`,l.style.display="flex",a.style.display="flex"):s.innerHTML="";let r=this.cellSettings.querySelector(".input-cell-gradient");if(r.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;r.style.backgroundImage=e}const c=this.cellSettings.querySelector(".input-src");c.value="";let u=t.getAttribute("data-modal-url");u&&(c.value=u);let d=this.cellSettings.querySelectorAll(".input-cell-padding");if(Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")})),e.hasClass(t,"padding-0")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="0"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-10")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="10"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-20")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="20"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-30")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="30"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-40")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="40"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-50")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="50"');e.addClass(t,"on")}const h=this.cellSettings.querySelector(".chk-cell-grayscale");h.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(h.checked=!0);const b=this.cellSettings.querySelector(".chk-cell-hideonmobile");b.checked=!1,t.classList.contains("hideonmobile")&&(b.checked=!0),d=this.cellSettings.querySelectorAll(".input-cell-height"),Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")}));let p=0,g=this.builder.colHeight;if(Array.prototype.forEach.call(g,(i=>{e.hasClass(t,"min-height-"+i)&&(p=i)})),300===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');e.addClass(t,"on")}else if(400===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');e.addClass(t,"on")}else if(500===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');e.addClass(t,"on")}else if(600===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');e.addClass(t,"on")}else if(700===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');e.addClass(t,"on")}d=this.cellSettings.querySelectorAll(".cmd-content-pos"),Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")}));let m=t.style.alignItems,f=t.style.justifyContent,y="";if("flex-start"===f?"flex-start"===m?y="topleft":"center"===m?y="topcenter":"flex-end"===m&&(y="topright"):"center"===f?"flex-start"===m?y="centerleft":"center"===m?y="center":"flex-end"===m&&(y="centerright"):"flex-end"===f&&("flex-start"===m?y="bottomleft":"center"===m?y="bottomcenter":"flex-end"===m&&(y="bottomright")),"topleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topleft"');e.addClass(t,"on")}else if("topcenter"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topcenter"');e.addClass(t,"on")}else if("topright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topright"');e.addClass(t,"on")}else if("centerleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="centerleft"');e.addClass(t,"on")}else if("center"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="center"');e.addClass(t,"on")}else if("centerright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="centerright"');e.addClass(t,"on")}else if("bottomleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomleft"');e.addClass(t,"on")}else if("bottomcenter"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomcenter"');e.addClass(t,"on")}else if("bottomright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomright"');e.addClass(t,"on")}this.realtimeVisibility(t,!0);let v=this.cellSettings.querySelector(".input-cell-id");v.value="";const w=t.getAttribute("id");w&&(v.value=w);let x=this.cellSettings.querySelector(".input-cell-classes");x.value="";const k=t.getAttribute("data-class");x.value=k,function(t,e){const i=t.cellSettings;if(!i||!e)return;let n="color";const o=e.style.backgroundImage;if(o&&-1!==o.indexOf("url(")?n="image":o&&o.includes("linear")&&(n="gradient"),t._showColumnFill&&t._showColumnFill(n),i.querySelectorAll(".div-content-textcolor .input-cell-textcolor").forEach((t=>{const i=t.getAttribute("data-command");let n;n="dark"===i?e.classList.contains("is-dark-text"):"light"===i?e.classList.contains("is-light-text"):!e.classList.contains("is-dark-text")&&!e.classList.contains("is-light-text"),t.classList.toggle("on",n)})),t._syncVisSwitch&&t._syncVisSwitch(),t._syncPaddingDefault&&t._syncPaddingDefault(),t._cellClassChips&&t._cellClassChips.set(e.getAttribute("data-class")||""),t._placeColumnPos){const e=Array.prototype.slice.call(i.querySelectorAll(".cb-cs-pad .cmd-content-pos")),n=i.querySelector(".cb-cs-pad .cmd-content-pos.on");t._placeColumnPos(n?e.indexOf(n):-1)}}(this,t)}realtimeVisibility(t,e){if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.cellSettings.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.cellSettings.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.cellSettings.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.cellSettings.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.cellSettings.querySelector(".div-target"),n=this.cellSettings.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),"xs"===o?e||this.builder.livePreview.resizePreview(375):"sm"===o?e||this.builder.livePreview.resizePreview(768):"md"===o?e||this.builder.livePreview.resizePreview(1024):e||this.builder.livePreview.resizePreview(1920)}openImagePicker(t,e,i){const n=this.imageSource;n.querySelector(".input-src").value=t,this.builder.imageSelectedCallback=e,n.style.zIndex="10005",this.util.showModal(n,!1,(()=>{i&&(i.removeAttribute("data-focus"),i.focus())}),!1,this.builder.assetPanelFullScreen),i&&i.setAttribute("data-focus",!0)}readImageAdjust(t,e){const i=this.imageAdjust,n=i.querySelector(".image-scale-slider"),o=i.querySelector(".image-hor-slider"),s=i.querySelector(".image-vert-slider");n.value=100,o.value=0,s.value=0,n.disabled=!1,e&&(o.value=50,s.value=60);let l=document.createElement("div");if(document.querySelector(".content-preview.is-screen-375.active")&&e){let e=t.getAttribute("data-bg-xs");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else if(document.querySelector(".content-preview.is-screen-768.active")&&e){let e=t.getAttribute("data-bg-sm");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else if(document.querySelector(".content-preview.is-screen-1024.active")&&e){let e=t.getAttribute("data-bg-md");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else l.style.cssText=t.style.cssText,n.disabled=!1,n.style.opacity="";if(l.style.backgroundSize){let t,e=l.style.backgroundSize;t=isNaN(parseInt(e))?100:parseInt(e),-1!==e.indexOf("%")&&(n.value=t)}if(l.style.backgroundPositionX){let t,e=l.style.backgroundPositionX;t=isNaN(parseInt(e))?0:parseInt(e),-1!==e.indexOf("%")&&(o.value=t)}if(l.style.backgroundPositionY){let t,e=l.style.backgroundPositionY;t=isNaN(parseInt(e))?0:parseInt(e),-1!==e.indexOf("%")&&(s.value=t)}this.builder.elementSelected=t}openImageAdjust(t,e,i){this.useTarget=!!i;const n=this.imageAdjust.querySelector(".div-target");n.style.display=i?"flex":"none";const o=this.builderStuff.querySelector(".is-modal.content-preview");this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),o.classList.contains("active")||this.imageAdjust.querySelector('.input-device[data-value=""]').classList.add("on"),this.readImageAdjust(t,i),this.imageAdjust.style.zIndex="10005",this.util.showModal(this.imageAdjust,!1,(()=>{e&&(e.removeAttribute("data-focus"),e.focus())})),e&&e.setAttribute("data-focus",!0),this.realtimeImageAdjust(!0)}realtimeImageAdjust(t){if(t){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.imageAdjust.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.imageAdjust.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.imageAdjust.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.imageAdjust.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let e=this.imageAdjust.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t||this.builder.livePreview.resizePreview(375):"sm"===i?t||this.builder.livePreview.resizePreview(768):"md"===i?t||this.builder.livePreview.resizePreview(1024):t||this.builder.livePreview.resizePreview(1920)}resetImage(t){const e=this.imageAdjust,i=e.querySelector(".image-scale-slider"),n=e.querySelector(".image-hor-slider"),o=e.querySelector(".image-vert-slider");n.value=50,o.value=60,i.value=0,(t.classList.contains("cell-active")||t.classList.contains("is-row-overlay"))&&(n.value=0,o.value=0),t.style.backgroundPositionX="",t.style.backgroundPositionY="",t.style.backgroundSize="cover",t.style.left="",t.style.top="",t.style.width="",t.style.height="",t.removeAttribute("data-x"),t.removeAttribute("data-y"),t.removeAttribute("data-scale"),t.removeAttribute("data-bg-xs"),t.removeAttribute("data-bg-sm"),t.removeAttribute("data-bg-md")}resetImage2(t){const e=this.imageAdjust2,i=e.querySelector(".image-scale-slider"),n=e.querySelector(".image-hor-slider"),o=e.querySelector(".image-vert-slider");let s,l,a=t.parentNode.offsetWidth,r=t.parentNode.offsetHeight;l=new Image,l.src=t.style.backgroundImage.replace(/"/g,"").replace(/url\(|\)$/gi,""),l.onload=()=>{if(s={width:l.naturalWidth,height:l.naturalHeight},this.dimension=s,a/r<=s.width/s.height){this.scaleWidth=!0,this.scaleHeight=!1;let e=r*(s.width/s.height);e=e/a*100,t.style.width||(t.style.width=e+"%",t.style.height=""),i.min=e;let l=.5*-(e-100);n.value=l,t.style.left=l+"%",t.setAttribute("data-x",l),o.value=0,t.style.top="0%",t.setAttribute("data-y",0),i.value=e,t.style.width=e+"%",t.setAttribute("data-scale",e),t.style.height="100%"}else{this.scaleHeight=!0,this.scaleWidth=!1;let e=a*(s.height/s.width);e=e/r*100,t.style.height||(t.style.height=e+"%",t.style.width=""),i.min=e;let l=.6*-(e-100);o.value=l,t.style.top=l+"%",t.setAttribute("data-y",l),n.value=0,t.style.left="0%",t.setAttribute("data-x",0),i.value=e,t.style.height=e+"%",t.setAttribute("data-scale",e),t.style.width="100%"}}}openImageAdjust2(t,e){const i=this.imageAdjust2,n=i.querySelector(".image-scale-slider"),o=i.querySelector(".image-hor-slider"),s=i.querySelector(".image-vert-slider");n.value=0,o.value=0,s.value=15;const l=t.getAttribute("data-scale");l&&(n.value=l);const a=t.getAttribute("data-x");a&&(o.value=a);const r=t.getAttribute("data-y");r&&(s.value=r);let c,u,d=t.parentNode.offsetWidth,h=t.parentNode.offsetHeight;u=new Image,u.src=t.style.backgroundImage.replace(/"/g,"").replace(/url\(|\)$/gi,""),u.onload=()=>{if(c={width:u.naturalWidth,height:u.naturalHeight},this.dimension=c,d/h<=c.width/c.height){this.scaleWidth=!0,this.scaleHeight=!1;let e=h*(c.width/c.height);e=e/d*100,t.style.width||(t.style.width=e+"%",t.style.height=""),n.min=e,a||(o.value=.5*-(e-100),t.style.left=.5*-(e-100)+"%",s.value=0);t.getAttribute("data-scale")||(n.value=e)}else{this.scaleHeight=!0,this.scaleWidth=!1;let e=d*(c.height/c.width);e=e/h*100,t.style.height||(t.style.height=e+"%",t.style.width=""),n.min=e,r||(s.value=.6*-(e-100),t.style.top=.6*-(e-100)+"%",o.value=0);t.getAttribute("data-scale")||(n.value=e)}},this.builder.elementSelected=t,i.style.zIndex="10005",this.util.showModal(i,!1,(()=>{e&&(e.removeAttribute("data-focus"),e.focus())})),e&&e.setAttribute("data-focus",!0)}showHideLockIndicator(t){const e=this.lockIndicator;if(t.hasAttribute("data-noedit")){let i,n;this.builder.iframe?(i=t.getBoundingClientRect().top+this.builder.win.pageYOffset,n=t.getBoundingClientRect().left+this.builder.win.pageXOffset):(i=t.getBoundingClientRect().top+window.pageYOffset,n=t.getBoundingClientRect().left+window.pageXOffset);const o=t.offsetWidth*this.builder.zoom;e.style.display="flex",e.style.top=i+4+"px",e.style.left=n+o-33+"px"}else e.style.display=""}click(t){if(this.columnTool=t.parentNode.querySelector(":scope > .is-col-tool"),!this.columnTool)return;this.columnTool.style.left=t.offsetLeft+"px",this.columnTool.style.top=t.offsetTop+"px";const e=this.columnTool.querySelector(".cell-add"),i=this.columnTool.querySelector(".cell-remove"),n=this.columnTool.querySelector(".cell-more");t.closest("[nogrid]")?(e.style.display="none",i.style.display="none",e.setAttribute("disabled","disabled"),i.setAttribute("disabled","disabled"),t.getAttribute("data-html")&&(n.style.display="none",n.setAttribute("disabled","disabled"))):(e.style.display="",i.style.display="",e.removeAttribute("disabled"),i.removeAttribute("disabled"));let o=t.parentNode;if(o.hasAttribute("data-protected")){o.querySelector(".is-row-tool").style.display="none",this.columnTool.style.display="none";let t=o.querySelector(".is-rowadd-tool");t&&(t.style.display="none")}else{this.columnTool.style.display="",t.closest("[data-protected]")?(e.style.display="none",i.style.display="none",n.style.display="none"):(e.style.display="",i.style.display="",n.style.display="")}t.classList.contains("column-lock")&&(e.style.display="none",i.style.display="none")}}const nu=new ze;class ou{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;let n=i.querySelector(".editstyles");if(!n){let t=`\n <div class="is-modal is-modal-content editstyles" role="dialog" aria-modal="true" aria-label="${e.out("Style")}">\n <div class="is-modal-bar is-draggable">\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="editstyles-body">\n <div class="cb-field cb-field-grow">\n <label class="cb-grouplabel" for="inpElmInlineStyle">${e.out("Style")}</label>\n <textarea id="inpElmInlineStyle" spellcheck="false" aria-label="${e.out("Style")}"></textarea>\n </div>\n <div class="cb-field">\n <label class="cb-grouplabel" for="inpElmClassName">${e.out("Class")}</label>\n <input type="text" id="inpElmClassName" value="" spellcheck="false" aria-label="${e.out("Class")}" />\n </div>\n </div>\n </div>\n `;nu.appendHtml(i,t),n=i.querySelector(".editstyles"),new vs({selector:".is-modal.editstyles .is-draggable"});let o=n.querySelector(".is-modal-close");nu.addEventListener(o,"click",(()=>{nu.removeClass(n,"active");var t=this.builderStuff.querySelector(".elementstyles");if(!nu.hasClass(t,"active")){let t=document.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(t,(t=>{t.removeAttribute("data-saveforundo")})),t=document.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(t,(t=>{nu.removeClass(t,"elm-inspected")}))}}));let s=n.querySelector("#inpElmClassName");s.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=n.querySelector("#inpElmClassName").value,i=!1;nu.hasClass(t,"elm-active")&&(i=!0);let o=!1;nu.hasClass(t,"elm-active")&&(o=!0);let s=!1;nu.hasClass(t,"row-active")&&(s=!0),t.setAttribute("class",e),i&&nu.addClass(t,"elm-active"),o&&nu.addClass(t,"cell-active"),s&&nu.addClass(t,"row-active"),nu.addClass(t,"elm-inspected"),this.builder.opts.onChange()})),s=n.querySelector("#inpElmInlineStyle"),s.addEventListener("keyup",(()=>{this.builder.inspectedElement.style.cssText=n.querySelector("#inpElmInlineStyle").value,this.builder.opts.onChange()}))}this.modalStyles=n}toggleStyleEditor(){nu.hasClass(this.modalStyles,"active")?nu.removeClass(this.modalStyles,"active"):nu.addClass(this.modalStyles,"active")}refresh(){if(!this.builder.inspectedElement)return;this.modalStyles.querySelector("#inpElmInlineStyle").value=this.builder.inspectedElement.style.cssText;let t=this.builder.inspectedElement.getAttribute("class");t&&(t=t.replace("elm-active",""),t=t.replace("cell-active",""),t=t.replace("row-active",""),t=t.replace("elm-inspected",""),t=t.replace(" "," ").trim()),this.modalStyles.querySelector("#inpElmClassName").value=t}}const su=new ze;class lu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);let o=i.querySelector("#divElementGeneral");this.panelStuff=o;const s=`\n <div class="cb-elmgeneral">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="on" data-fill="color">${e.out("Color")}</button>\n <button type="button" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-elm-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-elm-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="elm-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-elm-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${this.builder.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-elm-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-elm-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkElmGrayscale" class="chk-elm-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — here it\n scopes the element's per-device visibility (mirrors Column/Row). --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this element")}</span>\n <label class="switch"><input id="chkElmVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on" data-value="sm"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden" data-value="xs"><span>${e.out("Hidden")}</span></button>\n </div>\n\n </div>\n `;su.appendHtml(o,s);let l=o.querySelector(".input-elm-bgcolor");l.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{let i=this.builder.inspectedElement;if(i.style.backgroundColor=t,e.paintColorButton(l,t),""!==t){o.querySelector(".input-elm-gradient").style.backgroundImage="",i.style.backgroundImage=""}n.refresh(),this.builder.opts.onChange()}),o.querySelector(".input-elm-bgcolor span").style.backgroundColor,(()=>{l.removeAttribute("data-focus"),l.focus()}),l,!0),l.setAttribute("data-focus",!0)}));const a=this.builder.gradientpicker();let r=o.querySelector(".input-elm-gradient");r.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),a.open(this.builder.inspectedElement,(()=>{let t=this.builder.inspectedElement;if(t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=o.querySelector(".input-elm-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}n.refresh()}),(t=>{t&&n.refresh(),r.removeAttribute("data-focus"),r.focus()}),r,!0),r.setAttribute("data-focus",!0)}));const c=o.querySelector(".input-elm-bgimage");c&&su.addEventListener(c,"click",(()=>{const t=this.builder.inspectedElement;let e="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(e=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.builder.colTool.openImagePicker(e,(t=>{this.builder.uo.saveForUndo();const e=this.builder.inspectedElement;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=o.querySelector(".elm-bgimage-preview"),s=this.panelStuff.querySelector(".input-elm-bgimageadjust"),l=this.panelStuff.querySelector(".input-elm-bgremove");s.style.display="none",l.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,s.style.display="flex",l.style.display="flex"):i.innerHTML="",n.refresh(),this.builder.opts.onChange()}),c)}));const u=o.querySelector(".input-elm-bgimageadjust");u&&su.addEventListener(u,"click",(()=>{const t=this.builder.inspectedElement;this.builder.colTool.openImageAdjust(t,u)}));const d=o.querySelector(".input-elm-bgremove");d&&su.addEventListener(d,"click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const e=o.querySelector(".elm-bgimage-preview"),i=this.panelStuff.querySelector(".input-elm-bgimageadjust"),s=this.panelStuff.querySelector(".input-elm-bgremove");i.style.display="none",s.style.display="none",e.innerHTML="",n.refresh(),this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none");const h=o.querySelector(".input-select");this.builder.renderSelectAsset(h,"image",(t=>{const e=this.builder.inspectedElement;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=o.querySelector(".elm-bgimage-preview"),s=this.panelStuff.querySelector(".input-elm-bgimageadjust"),l=this.panelStuff.querySelector(".input-elm-bgremove");s.style.display="none",l.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,s.style.display="flex",l.style.display="flex"):i.innerHTML="",n.refresh(),this.builder.opts.onChange()}));const b=o.querySelector(".chk-elm-grayscale");b.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t=this.builder.inspectedElement;b.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),n.refresh(),this.builder.opts.onChange()})),o.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{const e=this.builder.inspectedElement;o.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(e)}))}));let p=o.querySelector(".input-visible"),g=o.querySelector(".input-hidden");p.addEventListener("click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=o.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.remove("xs-hidden"):"sm"===i?t.classList.remove("sm-hidden"):"md"===i?t.classList.remove("md-hidden"):""===i&&t.classList.remove("desktop-hidden"),p.classList.add("on"),g.classList.remove("on"),this.builder.opts.onChange()})),g.addEventListener("click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=o.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.add("xs-hidden"):"sm"===i?t.classList.add("sm-hidden"):"md"===i?t.classList.add("md-hidden"):""===i&&t.classList.add("desktop-hidden"),p.classList.remove("on"),g.classList.add("on"),this.builder.opts.onChange()}));const m=o.querySelectorAll(".cb-seg > button"),f=o.querySelectorAll(".cb-cs-fill");this._showElmFill=t=>{m.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),f.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))},m.forEach((t=>{t.addEventListener("click",(()=>this._showElmFill(t.getAttribute("data-fill"))))}));const y=o.querySelector("#chkElmVisible");this._syncElmVisSwitch=()=>{y&&p&&(y.checked=p.classList.contains("on"))},y&&y.addEventListener("change",(()=>{y.checked?p.click():g.click()})),o.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(this._syncElmVisSwitch,0)))}))}readElementStyles(t){let e=this.panelStuff,i=t.style.backgroundColor,n=e.querySelector(".input-elm-bgcolor");i?this.builder.util.paintColorButton(n,i):this.builder.util.paintColorButton(n,"");let o=e.querySelector(".input-elm-gradient");if(o.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;o.style.backgroundImage=e}let s="";const l=e.querySelector(".elm-bgimage-preview"),a=e.querySelector(".input-elm-bgimageadjust");a.style.display="none";const r=e.querySelector(".input-elm-bgremove");r.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(s=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),l.innerHTML=`<img src="${s}">`,a.style.display="flex",r.style.display="flex"):l.innerHTML="";const c=e.querySelector(".chk-elm-grayscale");c.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(c.checked=!0);let u="color";const d=t.style.backgroundImage;d&&-1!==d.indexOf("url(")?u="image":d&&d.includes("linear")&&(u="gradient"),this._showElmFill&&this._showElmFill(u),this.realtimeVisibility(t,!0),this._syncElmVisSwitch&&this._syncElmVisSwitch()}realtimeVisibility(t,e){if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.panelStuff.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.panelStuff.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.panelStuff.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.panelStuff.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.panelStuff.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.panelStuff.querySelector(".div-target"),n=this.panelStuff.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),"xs"===o?e||this.builder.livePreview.resizePreview(375):"sm"===o?e||this.builder.livePreview.resizePreview(768):"md"===o?e||this.builder.livePreview.resizePreview(1024):e||this.builder.livePreview.resizePreview(1920)}}const au=new ze;class ru{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);let o=i.querySelector("#divElementBox");this.panelStuff=o;const s='\n <option value="px">px</option>\n <option value="em">em</option>\n <option value="vw">vw</option>\n <option value="vh">vh</option>\n <option value="%">%</option>',l=`\n <div class="cb-elmbox">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Size")}</span>\n\n <div class="cb-eb-sizefield">\n <span class="cb-field-label">${e.out("Width")}</span>\n <div class="cb-seg" data-for="width" role="group" aria-label="${e.out("Width")}">\n <button type="button" class="on" data-mode="auto">${e.out("Auto")}</button>\n <button type="button" data-mode="full">${e.out("Full")}</button>\n <button type="button" data-mode="fixed">${e.out("Fixed")}</button>\n </div>\n <div class="cb-eb-reveal cb-eb-width-fixed" style="display:none">\n <div class="cb-dim">\n <input type="text" id="inpElmWidth" value="" placeholder="${e.out("value")}"/>\n <span class="cb-dim-sep"></span>\n <select id="inpElmWidthUnit">${s}</select>\n </div>\n </div>\n </div>\n\n <div class="cb-eb-sizefield" style="margin-top:12px">\n <span class="cb-field-label">${e.out("Height")}</span>\n <div class="cb-seg" data-for="height" role="group" aria-label="${e.out("Height")}">\n <button type="button" class="on" data-mode="auto">${e.out("Auto")}</button>\n <button type="button" data-mode="screen">${e.out("Screen")}</button>\n <button type="button" data-mode="fixed">${e.out("Fixed")}</button>\n </div>\n <div class="cb-eb-reveal cb-eb-height-fixed" style="display:none">\n <div class="cb-dim">\n <input type="text" id="inpElmHeight" value="" placeholder="${e.out("value")}"/>\n <span class="cb-dim-sep"></span>\n <select id="inpElmHeightUnit">${s}</select>\n </div>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Constraints")}</span>\n <div class="cb-eb-grid2">\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Min Width")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMinWidth" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMinWidthUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Max Width")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMaxWidth" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMaxWidthUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Min Height")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMinHeight" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMinHeightUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Max Height")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMaxHeight" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMaxHeightUnit">${s}</select></div></label>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Overflow")}</span>\n <div class="cb-eb-fld">\n <span class="cb-field-label">${e.out("Horizontal")}</span>\n <div class="cb-seg" data-for="overflowx" role="group" aria-label="${e.out("Overflow x")}">\n <button type="button" class="on" data-val="">${e.out("Default")}</button>\n <button type="button" data-val="auto">${e.out("Auto")}</button>\n <button type="button" data-val="hidden">${e.out("Hidden")}</button>\n </div>\n </div>\n <div class="cb-eb-fld" style="margin-top:10px">\n <span class="cb-field-label">${e.out("Vertical")}</span>\n <div class="cb-seg" data-for="overflowy" role="group" aria-label="${e.out("Overflow y")}">\n <button type="button" class="on" data-val="">${e.out("Default")}</button>\n <button type="button" data-val="auto">${e.out("Auto")}</button>\n <button type="button" data-val="hidden">${e.out("Hidden")}</button>\n </div>\n </div>\n </div>\n\n </div>\n `;au.appendHtml(o,l);let a=o.querySelector("#inpElmMaxWidth");a.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),a.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxWidth").value,i=o.querySelector("#inpElmMaxWidthUnit").value;isNaN(e)||""===e?t.style.maxWidth="":t.style.maxWidth=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMaxWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxWidth").value,i=o.querySelector("#inpElmMaxWidthUnit").value;isNaN(e)||""===e?t.style.maxWidth="":t.style.maxWidth=e+i,n.refresh(),this.builder.opts.onChange()}));let r=o.querySelector("#inpElmMaxHeight");r.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),r.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxHeight").value,i=o.querySelector("#inpElmMaxHeightUnit").value;isNaN(e)||""===e?t.style.maxHeight="":t.style.maxHeight=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMaxHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxHeight").value,i=o.querySelector("#inpElmMaxHeightUnit").value;isNaN(e)||""===e?t.style.maxHeight="":t.style.maxHeight=e+i,n.refresh(),this.builder.opts.onChange()}));let c=o.querySelector("#inpElmMinWidth");c.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),c.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinWidth").value,i=o.querySelector("#inpElmMinWidthUnit").value;isNaN(e)||""===e?t.style.minWidth="":t.style.minWidth=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMinWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinWidth").value,i=o.querySelector("#inpElmMinWidthUnit").value;isNaN(e)||""===e?t.style.minWidth="":t.style.minWidth=e+i,n.refresh(),this.builder.opts.onChange()}));let u=o.querySelector("#inpElmMinHeight");u.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),u.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinHeight").value,i=o.querySelector("#inpElmMinHeightUnit").value;isNaN(e)||""===e?t.style.minHeight="":t.style.minHeight=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMinHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinHeight").value,i=o.querySelector("#inpElmMinHeightUnit").value;isNaN(e)||""===e?t.style.minHeight="":t.style.minHeight=e+i,n.refresh(),this.builder.opts.onChange()}));let d=o.querySelector("#inpElmWidth");d.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),d.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmWidth").value,i=o.querySelector("#inpElmWidthUnit").value;isNaN(e)||""===e?t.style.width="":t.style.width=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmWidth").value,i=o.querySelector("#inpElmWidthUnit").value;isNaN(e)||""===e?t.style.width="":t.style.width=e+i,n.refresh(),this.builder.opts.onChange()}));let h=o.querySelector("#inpElmHeight");h.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),h.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmHeight").value,i=o.querySelector("#inpElmHeightUnit").value;isNaN(e)||""===e?t.style.height="":t.style.height=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmHeight").value,i=o.querySelector("#inpElmHeightUnit").value;isNaN(e)||""===e?t.style.height="":t.style.height=e+i,n.refresh(),this.builder.opts.onChange()}));const b=(t,e,i)=>{const s=o.querySelector(`.cb-seg[data-for="${t}"]`),l=o.querySelector(`.cb-eb-${t}-fixed`),a=o.querySelector("width"===t?"#inpElmWidth":"#inpElmHeight"),r=o.querySelector("width"===t?"#inpElmWidthUnit":"#inpElmHeightUnit"),c=t;if(s.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-mode")===e))),l.style.display="fixed"===e?"":"none",!i)return;this.builder.uo.saveForUndo();const u=this.builder.inspectedElement;if("auto"===e)u.style[c]="",a.value="";else if("full"===e)u.style[c]="100%",a.value="100",r.value="%";else if("screen"===e)u.style[c]="100vh",a.value="100",r.value="vh";else if("fixed"===e){const t=a.value;isNaN(t)||""===t||(u.style[c]=t+r.value),setTimeout((()=>a.focus()),0)}n.refresh(),this.builder.opts.onChange()};this._setSizeMode=b,["width","height"].forEach((t=>{o.querySelectorAll(`.cb-seg[data-for="${t}"] button`).forEach((e=>{e.addEventListener("click",(()=>b(t,e.getAttribute("data-mode"),!0)))}))}));const p=(t,e,i)=>{if(o.querySelector(`.cb-seg[data-for="overflow${t}"]`).querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===e))),!i)return;this.builder.uo.saveForUndo();const s=this.builder.inspectedElement;"x"===t?s.style.overflowX=e:s.style.overflowY=e,n.refresh(),this.builder.opts.onChange()};this._setOverflow=p,["x","y"].forEach((t=>{o.querySelectorAll(`.cb-seg[data-for="overflow${t}"] button`).forEach((e=>{e.addEventListener("click",(()=>p(t,e.getAttribute("data-val"),!0)))}))}))}readElementStyles(t){let e=this.panelStuff;const i=e.querySelector("#inpElmMaxWidth"),n=e.querySelector("#inpElmMaxWidthUnit");i.value="",n.value="px";let o=t.style.maxWidth,s=parseInt(o);isNaN(s)||(-1!==o.indexOf("%")&&(n.value="%"),-1!==o.indexOf("px")&&(n.value="px"),-1!==o.indexOf("vw")&&(n.value="vw"),-1!==o.indexOf("vh")&&(n.value="vh"),-1!==o.indexOf("em")&&(n.value="em"),i.value=s);const l=e.querySelector("#inpElmMaxHeight"),a=e.querySelector("#inpElmMaxHeightUnit");l.value="",a.value="px",o=t.style.maxHeight;let r=parseInt(o);isNaN(r)||(-1!==o.indexOf("%")&&(a.value="%"),-1!==o.indexOf("px")&&(a.value="px"),-1!==o.indexOf("vw")&&(a.value="vw"),-1!==o.indexOf("vh")&&(a.value="vh"),-1!==o.indexOf("em")&&(a.value="em"),l.value=r);const c=e.querySelector("#inpElmMinWidth"),u=e.querySelector("#inpElmMinWidthUnit");c.value="",u.value="px",o=t.style.minWidth;let d=parseInt(o);isNaN(d)||(-1!==o.indexOf("%")&&(u.value="%"),-1!==o.indexOf("px")&&(u.value="px"),-1!==o.indexOf("vw")&&(u.value="vw"),-1!==o.indexOf("vh")&&(u.value="vh"),-1!==o.indexOf("em")&&(u.value="em"),c.value=d);const h=e.querySelector("#inpElmMinHeight"),b=e.querySelector("#inpElmMinHeightUnit");h.value="",b.value="px",o=t.style.minHeight;let p=parseInt(o);isNaN(p)||(-1!==o.indexOf("%")&&(b.value="%"),-1!==o.indexOf("px")&&(b.value="px"),-1!==o.indexOf("vw")&&(b.value="vw"),-1!==o.indexOf("vh")&&(b.value="vh"),-1!==o.indexOf("em")&&(b.value="em"),h.value=p);const g=e.querySelector("#inpElmWidth"),m=e.querySelector("#inpElmWidthUnit");g.value="",m.value="px",o=t.style.width;let f=parseInt(o);isNaN(f)||(-1!==o.indexOf("%")&&(m.value="%"),-1!==o.indexOf("px")&&(m.value="px"),-1!==o.indexOf("vw")&&(m.value="vw"),-1!==o.indexOf("vh")&&(m.value="vh"),-1!==o.indexOf("em")&&(m.value="em"),g.value=f);const y=e.querySelector("#inpElmHeight"),v=e.querySelector("#inpElmHeightUnit");y.value="",v.value="px",o=t.style.height;let w=parseInt(o);isNaN(w)||(-1!==o.indexOf("%")&&(v.value="%"),-1!==o.indexOf("px")&&(v.value="px"),-1!==o.indexOf("vw")&&(v.value="vw"),-1!==o.indexOf("vh")&&(v.value="vh"),-1!==o.indexOf("em")&&(v.value="em"),y.value=w);const x=t.style.width;this._setSizeMode&&this._setSizeMode("width",""===x||"auto"===x?"auto":"100%"===x?"full":"fixed",!1);const k=t.style.height;this._setSizeMode&&this._setSizeMode("height",""===k||"auto"===k?"auto":"100vh"===k?"screen":"fixed",!1),this._setOverflow&&(this._setOverflow("x",t.style.overflowX||"",!1),this._setOverflow("y",t.style.overflowY||"",!1))}}const cu=new ze,uu=["top","left","right","bottom"],du=t=>t.charAt(0).toUpperCase()+t.slice(1),hu=["%","vw","vh","em","px"];class bu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i,this.elementStyleEditor=new ou(t);let n=i.querySelector("#divElementSpacing");this.panelStuff=n,this.units={padding:"px",margin:"px"},this.linked={padding:!1,margin:!1},this.scrub=null;const o=`\n <div class="cb-elmspacing">\n ${this.crossHtml("padding",e.out("Padding"),["px","em","%"])}\n ${this.crossHtml("margin",e.out("Margin"),["px","em","%","auto"])}\n <p class="cb-sp-note">${e.out("Drag a field up or down, or type a value.")}</p>\n </div>\n `;cu.appendHtml(n,o),["padding","margin"].forEach((t=>this.wireCross(t)))}crossHtml(t,e,i){const n="padding"===t?"inpElmPadding":"inpElmMargin",o=i.map(((t,e)=>`<button type="button" data-unit="${t}"${0===e?' class="on"':""}>${t}</button>`)).join("");return`\n <div class="cb-field">\n <span class="cb-grouplabel">${e}</span>\n <div class="cb-sp-pad" data-prop="${t}">\n ${uu.map((t=>`\n <div class="cb-sp-field" data-side="${t}">\n <input type="text" class="cb-sp-value" id="${n}${du(t)}" data-side="${t}" inputmode="numeric" autocomplete="off" spellcheck="false" title="${this.util.out(du(t))}" aria-label="${this.util.out(du(t))}">\n </div>`)).join("")}\n <div class="cb-sp-box">\n <button class="cb-sp-link" type="button" aria-pressed="false" title="${this.util.out("Apply to all sides")}"><svg class="is-icon-flex"><use xlink:href="#icon-link3"></use></svg></button>\n <span class="cb-sp-caption"></span>\n </div>\n </div>\n <div class="cb-seg is-inline cb-sp-unit" data-prop="${t}" role="group" aria-label="${e} ${this.util.out("unit")}">${o}</div>\n </div>`}wireCross(t){const e=this.panelStuff,i=e.querySelector(`.cb-sp-pad[data-prop="${t}"]`);uu.forEach((e=>{const n=i.querySelector(`.cb-sp-value[data-side="${e}"]`);this.bindField(t,e,n)}));const n=i.querySelector(".cb-sp-link");n.addEventListener("click",(()=>{this.linked[t]=!this.linked[t],n.classList.toggle("active",this.linked[t]),n.setAttribute("aria-pressed",this.linked[t]?"true":"false"),i.classList.toggle("linked",this.linked[t])}));e.querySelector(`.cb-sp-unit[data-prop="${t}"]`).querySelectorAll("button").forEach((e=>{e.addEventListener("click",(()=>this.setUnit(t,e.getAttribute("data-unit"),!0)))}))}bindField(t,e,i){const n=this.panelStuff.ownerDocument;i.addEventListener("click",(()=>this.builder.uo.saveForUndo())),i.addEventListener("keyup",(n=>{"ArrowUp"!==n.key&&"ArrowDown"!==n.key&&"auto"!==this.units[t]&&this.applyValue(t,e,i.value,{undo:!1})})),i.addEventListener("change",(()=>{"auto"!==this.units[t]&&this.applyValue(t,e,i.value,{undo:!1})})),i.addEventListener("keydown",(n=>{if("auto"!==this.units[t]&&("ArrowUp"===n.key||"ArrowDown"===n.key)){n.preventDefault();const o=parseFloat(i.value)||0;i.value=String(Math.max(0,o+("ArrowUp"===n.key?1:-1))),this.applyValue(t,e,i.value,{undo:!0})}})),i.addEventListener("pointerdown",(o=>{0===o.button&&this.builder.inspectedElement&&"auto"!==this.units[t]&&(n.activeElement!==i&&o.preventDefault(),this.scrub={prop:t,side:e,input:i,x:o.clientX,y:o.clientY,start:parseFloat(i.value)||0,moved:!1,undo:!0},i.setPointerCapture(o.pointerId))})),i.addEventListener("pointermove",(n=>{const o=this.scrub;if(!o||o.input!==i)return;const s=n.clientX-o.x,l=o.y-n.clientY;if(!o.moved){if(Math.abs(s)<3&&Math.abs(l)<3)return;o.moved=!0,this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`).classList.add("scrubbing")}const a=Math.abs(l)>=Math.abs(s)?l:s;i.value=String(Math.max(0,Math.round(o.start+a/2))),this.applyValue(t,e,i.value,{undo:o.undo,notify:!1}),o.undo=!1}));const o=e=>{const n=this.scrub;n&&n.input===i&&(this.scrub=null,this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`).classList.remove("scrubbing"),i.hasPointerCapture(e.pointerId)&&i.releasePointerCapture(e.pointerId),n.moved?n.undo||this.builder.opts.onChange():(i.focus(),i.select()))};i.addEventListener("pointerup",o),i.addEventListener("pointercancel",o)}applyValue(t,e,i,{undo:n=!0,notify:o=!0}={}){const s=this.builder.inspectedElement;if(!s)return;n&&this.builder.uo.saveForUndo();const l=this.units[t],a=String(i).trim(),r=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`);(this.linked[t]?uu:[e]).forEach((i=>{const n=t+du(i);"auto"===a?s.style[n]="auto":""===a||isNaN(a)?s.style[n]="":s.style[n]=a+l,this.linked[t]&&i!==e&&(r.querySelector(`.cb-sp-value[data-side="${i}"]`).value=a)})),this.elementStyleEditor.refresh(),o&&this.builder.opts.onChange()}setUnit(t,e,i){this.units[t]=e;this.panelStuff.querySelector(`.cb-sp-unit[data-prop="${t}"]`).querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-unit")===e)));const n=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`);if(n.classList.toggle("is-auto","auto"===e),!i)return;this.builder.uo.saveForUndo();const o=this.builder.inspectedElement;o&&(uu.forEach((i=>{const s=n.querySelector(`.cb-sp-value[data-side="${i}"]`),l=t+du(i);if("auto"===e)o.style[l]="auto",s.value="auto";else{const t=s.value.trim();""===t||"auto"===t||isNaN(t)?(o.style[l]="",s.value=""):o.style[l]=t+e}})),this.elementStyleEditor.refresh(),this.builder.opts.onChange())}detectUnit(t){for(let e=0;e<hu.length;e++)if(-1!==t.indexOf(hu[e]))return hu[e];return"px"}readElementStyles(t){const e=(t.tagName||"element").toLowerCase();["padding","margin"].forEach((i=>{const n=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${i}"]`);n.querySelector(".cb-sp-caption").textContent=e;const o={};let s=null,l=0,a=0;uu.forEach((e=>{const n=t.style[i+du(e)];if(n&&-1!==n.indexOf("auto"))o[e]={auto:!0},l++,a++;else{const t=parseFloat(n);if(isNaN(t))o[e]={};else{const i=this.detectUnit(n);o[e]={num:t,unit:i},s||(s=i),a++}}}));const r="margin"===i&&a>0&&l===uu.length?"auto":s||"px";this.setUnit(i,r,!1),uu.forEach((t=>{const e=n.querySelector(`.cb-sp-value[data-side="${t}"]`),i=o[t];e.placeholder="0","auto"===r||i.auto?e.value="auto":e.value=void 0!==i.num?String(i.num):""}))}))}}const pu=new ze,gu={all:{w:"borderWidth",s:"borderStyle",c:"borderColor"},top:{w:"borderTopWidth",s:"borderTopStyle",c:"borderTopColor"},right:{w:"borderRightWidth",s:"borderRightStyle",c:"borderRightColor"},bottom:{w:"borderBottomWidth",s:"borderBottomStyle",c:"borderBottomColor"},left:{w:"borderLeftWidth",s:"borderLeftStyle",c:"borderLeftColor"}},mu=["Top","Right","Bottom","Left"],fu=["px","em","vw","vh"];class yu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementBorder"),this.target="all",this.nowLabels={all:e.out("All sides"),top:e.out("Top"),right:e.out("Right"),bottom:e.out("Bottom"),left:e.out("Left")};const i=fu.map((t=>`<option value="${t}">${t}</option>`)).join(""),n=`\n <div class="cb-elmborder">\n\n <div class="cb-field">\n <div class="cb-bd-head">\n <span class="cb-grouplabel">${e.out("Sides")}</span>\n <span class="cb-bd-now"></span>\n </div>\n <div class="cb-bd-sbox">\n <div class="cb-bd-rect" data-sel="all">\n <span class="cb-bd-ez t" data-edge="top" title="${e.out("Border Top")}"></span>\n <span class="cb-bd-ez r" data-edge="right" title="${e.out("Border Right")}"></span>\n <span class="cb-bd-ez b" data-edge="bottom" title="${e.out("Border Bottom")}"></span>\n <span class="cb-bd-ez l" data-edge="left" title="${e.out("Border Left")}"></span>\n <button type="button" class="cb-bd-all on" data-all>${e.out("All")}</button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-field-label">${e.out("Style")}</span><span class="cb-readout" data-readout="style"></span></div>\n <div class="cb-seg" data-style role="group" aria-label="${e.out("Border Style")}">\n <button type="button" data-val="" title="${e.out("None")}"><span class="cb-bd-none">${e.out("None")}</span></button>\n <button type="button" data-val="solid" title="${e.out("Solid")}"><span class="cb-bd-line"></span></button>\n <button type="button" data-val="dashed" title="${e.out("Dashed")}"><span class="cb-bd-line is-dashed"></span></button>\n <button type="button" data-val="dotted" title="${e.out("Dotted")}"><span class="cb-bd-line is-dotted"></span></button>\n </div>\n </div>\n\n <div class="cb-field cb-bd-wc" data-wc>\n <div class="cb-bd-wcgrid">\n <div class="cb-bd-fld">\n <span class="cb-field-label">${e.out("Width")}</span>\n <div class="cb-dim">\n <input type="text" class="cb-bd-width" value="" placeholder="0">\n <span class="cb-dim-sep"></span>\n <select class="cb-bd-unit">${i}</select>\n </div>\n </div>\n <div class="cb-bd-fld">\n <span class="cb-field-label">${e.out("Color")}</span>\n <button title="${e.out("Border Color")}" class="cb-bd-color cb-colorbtn"><span></span></button>\n </div>\n </div>\n </div>\n\n </div>\n `;pu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.rect=t.querySelector(".cb-bd-rect"),this.nowLabel=t.querySelector(".cb-bd-now"),this.styleSeg=t.querySelector("[data-style]"),this._styleReadout=this.util.bindReadout(this.styleSeg,t.querySelector('[data-readout="style"]')),this.widthInput=t.querySelector(".cb-bd-width"),this.unitSel=t.querySelector(".cb-bd-unit"),this.colorBtn=t.querySelector(".cb-bd-color"),this.wcWrap=t.querySelector("[data-wc]"),this.allBtn=t.querySelector("[data-all]"),this.allBtn.addEventListener("click",(()=>this.selectTarget("all"))),t.querySelectorAll(".cb-bd-ez").forEach((t=>t.addEventListener("click",(()=>this.selectTarget(t.getAttribute("data-edge")))))),this.styleSeg.querySelectorAll("button").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-val");""!==e&&""===this.widthInput.value.trim()&&(this.widthInput.value="1"),this.setStyleActive(e),this.applyBorder()}))})),this.widthInput.addEventListener("click",(()=>this.builder.uo.saveForUndo())),this.widthInput.addEventListener("keyup",(()=>this.applyBorder())),this.widthInput.addEventListener("change",(()=>this.applyBorder())),this.unitSel.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.applyBorder()})),this.colorBtn.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const t=this.colorBtn.querySelector("span"),e=t.style.background||t.style.backgroundColor;this.builder.colorPicker.open((t=>{this.elm().style[gu[this.target].c]=t,this.util.paintColorButton(this.colorBtn,t),this.done()}),e,(()=>{this.colorBtn.removeAttribute("data-focus"),this.colorBtn.focus()}),this.colorBtn),this.colorBtn.setAttribute("data-focus",!0)}))}currentStyle(){const t=this.styleSeg.querySelector("button.on");return t?t.getAttribute("data-val"):""}setStyleActive(t){this.styleSeg.querySelectorAll("button").forEach((e=>e.classList.toggle("on",e.getAttribute("data-val")===t))),this._styleReadout&&this._styleReadout(),this.wcWrap.classList.toggle("is-off",""===t),this.wcWrap.inert=""===t}selectTarget(t){this.target=t,this.rect.dataset.sel=t,this.allBtn.classList.toggle("on","all"===t),this.nowLabel.textContent=this.nowLabels[t]||"",this.readTarget()}applyBorder(){const t=this.elm();if(!t)return;const e=gu[this.target],i=this.currentStyle();if(""===i)"all"===this.target&&(mu.forEach((e=>{t.style["border"+e+"Width"]="",t.style["border"+e+"Style"]="",t.style["border"+e+"Color"]=""})),t.style.border=""),t.style[e.w]="",t.style[e.s]="",t.style[e.c]="";else{t.style[e.s]=i;const n=this.widthInput.value.trim();t.style[e.w]=""===n||isNaN(n)?"":n+(this.unitSel.value||"px")}this.done()}readTarget(){const t=this.elm(),e=gu[this.target],i=t&&t.style[e.w]||"",n=t&&t.style[e.s]||"",o=t&&t.style[e.c]||"";let s="";-1!==n.indexOf("solid")?s="solid":-1!==n.indexOf("dashed")?s="dashed":-1!==n.indexOf("dotted")&&(s="dotted"),this.setStyleActive(s);const l=parseFloat(i);this.widthInput.value=isNaN(l)?"":l;let a="px";fu.forEach((t=>{-1!==i.indexOf(t)&&(a=t)})),this.unitSel.value=a,this.util.paintColorButton(this.colorBtn,o)}readElementStyles(){this.selectTarget("all")}}const vu=new ze,wu=t=>"700"===t||"bold"===t||parseInt(t,10)>=600;class xu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);this.elementStyleEditor=n;let o=i.querySelector("#divElementText");this.panelStuff=o;const s=["px","em","pt","%","vw","vh","vmin","vmax"].map((t=>`<option value="${t}">${t}</option>`)).join(""),l=[["",e.out("Default")],["100","Thin 100"],["200","Extra Light 200"],["300","Light 300"],["400","Regular 400"],["500","Medium 500"],["600","Semibold 600"],["700","Bold 700"],["800","Extrabold 800"],["900","Black 900"]].map((([t,e])=>`<option value="${t}">${e}</option>`)).join(""),a=`\n <div class="cb-elmtext">\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Color")}</span>\n <button title="${e.out("Text Color")}" class="input-elm-color cb-colorbtn"><span></span></button>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Font Size")}</span>\n <div class="cb-dim">\n <input type="text" id="inpElmFontSize" value="" placeholder="—">\n <span class="cb-dim-sep"></span>\n <select id="inpElmFontSizeUnit">${s}</select>\n </div>\n </div>\n </div>\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Font Weight")}</span>\n <div class="cb-tx-sel"><select id="inpElmFontWeight">${l}</select></div>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Line Height")}</span>\n <div class="cb-dim">\n <input type="text" id="inpElmLineHeight" value="" placeholder="—">\n <span class="cb-dim-sep"></span>\n <select id="inpElmLineHeightUnit"><option value="">—</option><option value="px">px</option><option value="pt">pt</option></select>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-grouplabel">${e.out("Alignment")}</span><span class="cb-readout" data-readout="align"></span></div>\n <div class="cb-seg" data-for="align" role="group" aria-label="${e.out("Text Align")}">\n <button type="button" data-val="left" title="${e.out("Left")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-left"></use></svg></button>\n <button type="button" data-val="center" title="${e.out("Center")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-center"></use></svg></button>\n <button type="button" data-val="right" title="${e.out("Right")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-right"></use></svg></button>\n <button type="button" data-val="justify" title="${e.out("Full")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-full"></use></svg></button>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-grouplabel">${e.out("Style")}</span><span class="cb-readout" data-readout="txstyle"></span></div>\n <div class="cb-tx-toggles">\n <button type="button" class="cb-tx-tg cb-tx-b" data-bold title="${e.out("Bold")}">B</button>\n <button type="button" class="cb-tx-tg cb-tx-i" data-italic title="${e.out("Italic")}">I</button>\n <button type="button" class="cb-tx-tg cb-tx-u" data-deco="underline" title="${e.out("Underline")}">U</button>\n <button type="button" class="cb-tx-tg cb-tx-s" data-deco="line-through" title="${e.out("Line Through")}">S</button>\n <span class="cb-tx-divider"></span>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="uppercase" title="${e.out("Uppercase")}">AB</button>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="lowercase" title="${e.out("Lowercase")}">ab</button>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="capitalize" title="${e.out("Capitalize")}">Ab</button>\n </div>\n </div>\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Letter Spacing")}</span>\n <div class="cb-dim"><input type="text" id="inpElmLetterSpacing" value="" placeholder="0"><span class="cb-dim-sep"></span><span class="cb-dim-u">px</span></div>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Word Spacing")}</span>\n <div class="cb-dim"><input type="text" id="inpElmWordSpacing" value="" placeholder="0"><span class="cb-dim-sep"></span><span class="cb-dim-u">px</span></div>\n </div>\n </div>\n\n </div>\n `;vu.appendHtml(o,a),this.bindColor(),this.bindAlign(),this.bindWeight(),this.bindStyleToggles(),this.bindDimInputs()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}bindColor(){const t=this.panelStuff.querySelector(".input-elm-color");t.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const e=t.querySelector("span").style.background||t.querySelector("span").style.backgroundColor;this.builder.colorPicker.open((e=>{this.elm().style.color=e,this.util.paintColorButton(t,e),this.done()}),e,(()=>{t.removeAttribute("data-focus"),t.focus()}),t),t.setAttribute("data-focus",!0)}))}bindAlign(){const t=this.panelStuff.querySelector('.cb-seg[data-for="align"]'),e=this.util.bindReadout(t,this.panelStuff.querySelector('[data-readout="align"]'));this._setAlign=(i,n)=>{t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===i))),e(),n&&(this.builder.uo.saveForUndo(),this.elm().style.textAlign=i,this.done())},t.querySelectorAll("button").forEach((t=>{t.addEventListener("click",(()=>{const e=t.getAttribute("data-val");this._setAlign(t.classList.contains("on")?"":e,!0)}))}))}bindWeight(){const t=this.panelStuff.querySelector("#inpElmFontWeight"),e=this.panelStuff.querySelector("[data-bold]");this._setWeight=(i,n)=>{t.value=i,e.classList.toggle("on",wu(i)),this._styleReadout&&this._styleReadout(),n&&(this.builder.uo.saveForUndo(),this.elm().style.fontWeight=i,this.done())},t.addEventListener("change",(()=>this._setWeight(t.value,!0))),e.addEventListener("click",(()=>this._setWeight(wu(t.value)?"":"700",!0)))}bindStyleToggles(){const t=this.panelStuff;this._styleReadout=this.util.bindReadout(t.querySelector(".cb-tx-toggles"),t.querySelector('[data-readout="txstyle"]'));const e=t.querySelector("[data-italic]");e.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t="italic"===this.elm().style.fontStyle;this.elm().style.fontStyle=t?"":"italic",e.classList.toggle("on",!t),this._styleReadout(),this.done()})),t.querySelectorAll("[data-deco]").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-deco"),i=-1!==(this.elm().style.textDecoration||this.elm().style.textDecorationLine||"").indexOf(e)?"":e;this.elm().style.textDecoration=i,this._syncDeco(i),this.done()}))})),t.querySelectorAll("[data-case]").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-case"),i=this.elm().style.textTransform===e?"":e;this.elm().style.textTransform=i,this._syncCase(i),this.done()}))}))}_syncDeco(t){this.panelStuff.querySelectorAll("[data-deco]").forEach((e=>e.classList.toggle("on",e.getAttribute("data-deco")===t&&""!==t))),this._styleReadout&&this._styleReadout()}_syncCase(t){this.panelStuff.querySelectorAll("[data-case]").forEach((e=>e.classList.toggle("on",e.getAttribute("data-case")===t&&""!==t))),this._styleReadout&&this._styleReadout()}bindDimInputs(){const t=this.panelStuff,e=(e,i)=>{const n=t.querySelector("#"+e);n.addEventListener("click",(()=>this.builder.uo.saveForUndo())),n.addEventListener("keyup",i),n.addEventListener("change",i)},i=()=>{const e=this.elm(),i=t.querySelector("#inpElmFontSize").value,n=t.querySelector("#inpElmFontSizeUnit");if(""===i)return e.style.fontSize="",void this.done();if(isNaN(i))e.style.fontSize="";else{e.style.fontSize=i+(n.value||"px");(this.builder.opts.fontSizeClassValues||[]).forEach((t=>vu.removeClass(e,"size-"+t)))}this.done()};e("inpElmFontSize",i),t.querySelector("#inpElmFontSizeUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo(),i()}));const n=()=>{const e=this.elm(),i=t.querySelector("#inpElmLineHeight").value,n=t.querySelector("#inpElmLineHeightUnit").value;e.style.lineHeight=isNaN(i)||""===i?"":i+n,this.done()};e("inpElmLineHeight",n),t.querySelector("#inpElmLineHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo(),n()})),e("inpElmLetterSpacing",(()=>{const e=this.elm(),i=t.querySelector("#inpElmLetterSpacing").value;e.style.letterSpacing=isNaN(i)||""===i?"":i+"px",this.done()})),e("inpElmWordSpacing",(()=>{const e=this.elm(),i=t.querySelector("#inpElmWordSpacing").value;e.style.wordSpacing=isNaN(i)||""===i?"":i+"px",this.done()}))}readElementStyles(t){const e=this.panelStuff;this.util.paintColorButton(e.querySelector(".input-elm-color"),t.style.color||""),this._setAlign&&this._setAlign(t.style.textAlign||"",!1);const i=parseFloat(t.style.fontSize);e.querySelector("#inpElmFontSize").value=isNaN(i)?"":i;const n=t.style.fontSize||"";let o="px";["%","vmin","vmax","vw","vh","em","pt","px"].forEach((t=>{-1!==n.indexOf(t)&&(o=t)})),e.querySelector("#inpElmFontSizeUnit").value=o;let s=t.style.fontWeight||"";"normal"===s?s="400":"bold"===s&&(s="700"),this._setWeight&&this._setWeight(-1!==["","100","200","300","400","500","600","700","800","900"].indexOf(s)?s:"",!1),e.querySelector("[data-italic]").classList.toggle("on","italic"===t.style.fontStyle),this._syncDeco(t.style.textDecoration&&-1!==t.style.textDecoration.indexOf("underline")?"underline":t.style.textDecoration&&-1!==t.style.textDecoration.indexOf("line-through")?"line-through":""),this._syncCase(t.style.textTransform||"");const l=t.style.lineHeight||"",a=parseFloat(l);e.querySelector("#inpElmLineHeight").value=isNaN(a)?"":a,e.querySelector("#inpElmLineHeightUnit").value=-1!==l.indexOf("px")?"px":-1!==l.indexOf("pt")?"pt":"";const r=parseFloat(t.style.letterSpacing);e.querySelector("#inpElmLetterSpacing").value=isNaN(r)?"":r;const c=parseFloat(t.style.wordSpacing);e.querySelector("#inpElmWordSpacing").value=isNaN(c)?"":c}}const ku=new ze,Su={all:"borderRadius",tl:"borderTopLeftRadius",tr:"borderTopRightRadius",bl:"borderBottomLeftRadius",br:"borderBottomRightRadius"},_u=[["tl","Top Left"],["tr","Top Right"],["bl","Bottom Left"],["br","Bottom Right"]],Cu=["px","em","rem","%"],Eu={px:60,em:5,rem:5,"%":50};class Au{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementCorner"),this.target="all",this.unit="px",this.nowLabels={all:e.out("All corners"),tl:e.out("Top Left"),tr:e.out("Top Right"),bl:e.out("Bottom Left"),br:e.out("Bottom Right")};const i=Cu.map((t=>`<option value="${t}">${t}</option>`)).join(""),n=_u.map((([t,i])=>`<span class="cb-cn-handle ${t} on" data-c="${t}" title="${e.out(i)}"></span>`)).join(""),o=`\n <div class="cb-elmcorner">\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Corners")}</span>\n <span class="cb-subnote cb-cn-now"></span>\n </div>\n <div class="cb-cn-box">\n <div class="cb-cn-rect">\n ${n}\n <button type="button" class="cb-cn-all on" data-all>${e.out("All")}</button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Radius")}</span>\n <div class="cb-cn-radiusrow">\n <div class="cb-dim cb-cn-dim">\n <input type="text" class="cb-cn-value" value="" placeholder="0" inputmode="numeric" autocomplete="off">\n <span class="cb-dim-sep"></span>\n <select class="cb-cn-unit">${i}</select>\n </div>\n <input type="range" class="cb-slider cb-cn-slider" min="0" max="60" step="1" value="0" aria-label="${e.out("Radius")}">\n </div>\n </div>\n\n </div>\n `;ku.appendHtml(this.panelStuff,o),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff;this.rect=t.querySelector(".cb-cn-rect"),this.nowLabel=t.querySelector(".cb-cn-now"),this.valueInput=t.querySelector(".cb-cn-value"),this.unitSel=t.querySelector(".cb-cn-unit"),this.slider=t.querySelector(".cb-cn-slider"),this.allBtn=t.querySelector("[data-all]"),this.handles=[...t.querySelectorAll(".cb-cn-handle")],this.allBtn.addEventListener("click",(()=>this.selectTarget("all"))),this.handles.forEach((t=>t.addEventListener("click",(()=>this.selectTarget(t.getAttribute("data-c")))))),this.valueInput.addEventListener("click",(()=>this.builder.uo.saveForUndo())),this.valueInput.addEventListener("keyup",(()=>{this.applyRadius(!0),this.syncSlider()})),this.valueInput.addEventListener("change",(()=>{this.applyRadius(!0),this.syncSlider()})),this.slider.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),this.slider.addEventListener("input",(()=>{this.valueInput.value=this.slider.value,this.applyRadius(!1)})),this.slider.addEventListener("change",(()=>this.builder.opts.onChange())),this.unitSel.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.unit=this.unitSel.value,this.slider.max=Eu[this.unit]||60,this.applyRadius(!0),this.syncSlider()}))}selectTarget(t){this.target=t,this.allBtn.classList.toggle("on","all"===t),this.handles.forEach((e=>e.classList.toggle("on","all"===t||e.getAttribute("data-c")===t))),this.nowLabel.textContent=this.nowLabels[t]||"",this.readTarget()}applyRadius(t){const e=this.elm();if(!e)return;const i=Su[this.target],n=this.valueInput.value.trim();e.style[i]=""===n||isNaN(n)?"":n+this.unit,this.updatePreview(),this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}syncSlider(){const t=parseFloat(this.valueInput.value);this.slider.value=isNaN(t)?0:Math.min(t,parseFloat(this.slider.max))}updatePreview(){const t=this.elm();if(!t||!this.rect)return;const e=t.style.borderRadius,i=i=>t.style["border"+i+"Radius"]||e||"0";this.rect.style.borderRadius=`${i("TopLeft")} ${i("TopRight")} ${i("BottomRight")} ${i("BottomLeft")}`}detectUnit(t){return-1!==t.indexOf("%")?"%":-1!==t.indexOf("rem")?"rem":-1!==t.indexOf("em")?"em":"px"}readTarget(){const t=this.elm(),e=t&&t.style[Su[this.target]]||"",i=parseFloat(e);this.unit=isNaN(i)?"px":this.detectUnit(e),this.unitSel.value=this.unit,this.slider.max=Eu[this.unit]||60,this.valueInput.value=isNaN(i)?"":i,this.syncSlider(),this.updatePreview()}readElementStyles(){this.selectTarget("all")}}const Lu=new ze,Tu=[["x","Offset X",-50,50],["y","Offset Y",-50,50],["blur","Blur",0,50],["spread","Spread",-20,40]],Mu={x:"xu",y:"yu",blur:"bu",spread:"su"},qu="rgba(0, 0, 0, 0.2)";class Ru{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementShadow"),this.layers=[],this.sel=-1;const i=(this.builder.opts.shadowTemplates||[]).map(((t,i)=>`<button type="button" class="cb-sh-preset" data-preset="${i}" title="${e.out("Apply Shadow")} ${i+1}" style="box-shadow:${t}"></button>`)).join(""),n=`\n <div class="cb-elmshadow">\n\n <div class="cb-sh-preview"><div class="cb-sh-card" data-card></div></div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Presets")}</span>\n <div class="cb-sh-presets" data-presets>${i}</div>\n </div>\n\n <div class="cb-field">\n <div class="cb-sh-lhead">\n <span>${e.out("Shadows")}</span>\n <div class="cb-sh-lactions">\n <button type="button" class="cb-sh-clear" data-clear title="${e.out("Clear")}"><svg class="is-icon-flex"><use xlink:href="#icon-eraser"></use></svg></button>\n <button type="button" class="cb-sh-add" data-add><span class="cb-sh-plus">+</span> ${e.out("Add")}</button>\n </div>\n </div>\n <div class="cb-sh-list" data-list></div>\n </div>\n\n <div class="cb-sh-editor" data-editor>\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Type")}</span>\n <div class="cb-seg" data-type role="group" aria-label="${e.out("Outer/Inner Shadow")}">\n <button type="button" data-t="0">${e.out("Outset")}</button>\n <button type="button" data-t="1">${e.out("Inset")}</button>\n </div>\n </div>\n ${Tu.map((([t,i,n,o])=>{return s=t,l=i,a=n,r=o,`\n <div class="cb-field">\n <span class="cb-field-label">${e.out(l)}</span>\n <div class="cb-sh-bsrow">\n <div class="cb-dim cb-sh-bsdim"><input type="text" data-k="${s}" inputmode="numeric" autocomplete="off"><span class="cb-dim-sep"></span><select data-u="${s}"><option value="px">px</option><option value="em">em</option></select></div>\n <input type="range" class="cb-slider cb-sh-slider" min="${a}" max="${r}" step="1" data-s="${s}">\n </div>\n </div>`;var s,l,a,r})).join("")}\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Shadow Color")}</span>\n <div class="cb-sh-colorrow">\n <button title="${e.out("Shadow Color")}" class="cb-sh-color cb-colorbtn"><span></span></button>\n <button type="button" class="cb-sh-reset" data-reset title="${e.out("Reset offset, blur and spread")}">${e.out("Reset")}</button>\n </div>\n </div>\n </div>\n\n </div>\n `;Lu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff;this.card=t.querySelector("[data-card]"),this.list=t.querySelector("[data-list]"),this.editor=t.querySelector("[data-editor]"),this.colorBtn=t.querySelector(".cb-sh-color"),t.querySelector("[data-presets]").addEventListener("click",(t=>{const e=t.target.closest("[data-preset]");if(!e)return;const i=(this.builder.opts.shadowTemplates||[])[+e.getAttribute("data-preset")];if(!i)return;this.builder.uo.saveForUndo();const n=this.parseLayer(i);this.sel<0||!this.layers.length?(this.layers.push(n),this.sel=this.layers.length-1):this.layers[this.sel]=n,this.refresh(!0)})),this.list.addEventListener("click",(t=>{const e=t.target.closest("[data-del]");if(e)return t.stopPropagation(),this.builder.uo.saveForUndo(),this.layers.splice(+e.getAttribute("data-del"),1),this.sel>=this.layers.length&&(this.sel=this.layers.length-1),void this.refresh(!0);const i=t.target.closest("[data-i]");i&&(this.sel=+i.getAttribute("data-i"),this.markSelected(),this.loadEditor())})),t.querySelector("[data-clear]").addEventListener("click",(()=>{this.layers.length&&(this.builder.uo.saveForUndo(),this.layers=[],this.sel=-1,this.refresh(!0))})),t.querySelector("[data-reset]").addEventListener("click",(()=>{if(this.sel<0)return;this.builder.uo.saveForUndo();const t=this.layers[this.sel];t.x=0,t.y=0,t.blur=0,t.spread=0,this.loadEditor(),this.apply(!0),this.syncRow(this.sel)})),t.querySelector("[data-add]").addEventListener("click",(()=>{this.builder.uo.saveForUndo(),this.layers.push({inset:0,x:0,xu:"px",y:4,yu:"px",blur:12,bu:"px",spread:0,su:"px",color:qu}),this.sel=this.layers.length-1,this.refresh(!0)})),t.querySelectorAll("[data-type] button").forEach((t=>t.addEventListener("click",(()=>{this.sel<0||(this.builder.uo.saveForUndo(),this.layers[this.sel].inset=+t.getAttribute("data-t"),this.setTypeActive(this.layers[this.sel].inset),this.apply(!0),this.syncRow(this.sel))})))),Tu.forEach((([e])=>{const i=t.querySelector(`[data-k="${e}"]`),n=t.querySelector(`[data-s="${e}"]`),o=t.querySelector(`[data-u="${e}"]`);i.addEventListener("click",(()=>this.builder.uo.saveForUndo()));const s=()=>{this.sel<0||(this.layers[this.sel][e]=parseFloat(i.value)||0,n.value=this.layers[this.sel][e],this.apply(!0),this.syncRow(this.sel))};i.addEventListener("keyup",s),i.addEventListener("change",s),n.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),n.addEventListener("input",(()=>{this.sel<0||(this.layers[this.sel][e]=parseFloat(n.value)||0,i.value=n.value,this.apply(!1),this.syncRow(this.sel))})),n.addEventListener("change",(()=>this.builder.opts.onChange())),o.addEventListener("change",(()=>{this.sel<0||(this.builder.uo.saveForUndo(),this.layers[this.sel][Mu[e]]=o.value,this.apply(!0))}))})),this.colorBtn.addEventListener("click",(()=>{if(this.sel<0)return;this.builder.uo.saveForUndo(!0);const t=this.colorBtn.querySelector("span"),e=t.style.background||t.style.backgroundColor;this.builder.colorPicker.open((t=>{this.layers[this.sel].color=t||qu,this.util.paintColorButton(this.colorBtn,this.layers[this.sel].color),this.apply(!0),this.syncRow(this.sel)}),e,(()=>{this.colorBtn.removeAttribute("data-focus"),this.colorBtn.focus()}),this.colorBtn),this.colorBtn.setAttribute("data-focus",!0)}))}compose(){return this.layers.map((t=>{const e=[];return t.inset&&e.push("inset"),e.push(`${t.x}${t.xu}`,`${t.y}${t.yu}`,`${t.blur}${t.bu}`,`${t.spread}${t.su}`),t.color&&e.push(t.color),e.join(" ")})).join(", ")}apply(t){const e=this.elm();e&&(e.style.boxShadow=this.compose()),this.updatePreview(),this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}updatePreview(){this.card&&(this.card.style.boxShadow=this.compose())}refresh(t){this.renderList(),this.loadEditor(),this.apply(t)}renderList(){this.layers.length?this.list.innerHTML=this.layers.map(((t,e)=>`\n <div class="cb-sh-layer ${e===this.sel?"on":""}" data-i="${e}">\n <span class="cb-sh-dot" style="background:${t.color}"></span>\n <span class="cb-sh-ltype">${t.inset?this.util.out("Inset"):this.util.out("Outset")}</span>\n <span class="cb-sh-lvals">${t.x} ${t.y} ${t.blur} ${t.spread}</span>\n <button type="button" class="cb-sh-del" data-del="${e}" title="${this.util.out("Remove")}">&#10005;</button>\n </div>`)).join(""):this.list.innerHTML=`<div class="cb-sh-empty">${this.util.out("No shadow — pick a preset or Add.")}</div>`}markSelected(){this.list.querySelectorAll(".cb-sh-layer").forEach((t=>t.classList.toggle("on",+t.getAttribute("data-i")===this.sel)))}syncRow(t){const e=this.list.querySelector(`[data-i="${t}"]`),i=this.layers[t];e&&i&&(e.querySelector(".cb-sh-dot").style.background=i.color,e.querySelector(".cb-sh-ltype").textContent=i.inset?this.util.out("Inset"):this.util.out("Outset"),e.querySelector(".cb-sh-lvals").textContent=`${i.x} ${i.y} ${i.blur} ${i.spread}`)}setTypeActive(t){this.panelStuff.querySelectorAll("[data-type] button").forEach((e=>e.classList.toggle("on",+e.getAttribute("data-t")==(t?1:0))))}loadEditor(){const t=this.layers[this.sel];this.editor.classList.toggle("is-off",!t),this.editor.inert=!t,t&&(this.setTypeActive(t.inset),Tu.forEach((([e])=>{this.panelStuff.querySelector(`[data-k="${e}"]`).value=t[e],this.panelStuff.querySelector(`[data-s="${e}"]`).value=t[e],this.panelStuff.querySelector(`[data-u="${e}"]`).value=t[Mu[e]]})),this.util.paintColorButton(this.colorBtn,t.color))}parseBoxShadow(t){const e=[];let i=0,n="";for(const o of t)"("===o?i++:")"===o&&i--,","===o&&0===i?(e.push(n),n=""):n+=o;return n.trim()&&e.push(n),e.map((t=>this.parseLayer(t))).filter(Boolean)}parseLayer(t){let e=(t||"").trim();if(!e)return null;let i=0;/\binset\b/.test(e)&&(i=1,e=e.replace(/\binset\b/," "));let n="";const o=e.match(/rgba?\([^)]*\)|hsla?\([^)]*\)|#[0-9a-fA-F]{3,8}/);o&&(n=o[0].replace(/\s+/g,""),e=e.replace(o[0]," "));const s=e.trim().split(/\s+/).filter(Boolean),l=t=>{const e=void 0!==t?String(t).match(/^(-?[\d.]+)([a-z%]*)$/):null;return e?{v:parseFloat(e[1])||0,u:e[2]||"px"}:{v:0,u:"px"}},a=l(s[0]),r=l(s[1]),c=l(s[2]),u=l(s[3]);return{inset:i,x:a.v,xu:a.u,y:r.v,yu:r.u,blur:c.v,bu:c.u,spread:u.v,su:u.u,color:n||qu}}readElementStyles(t){const e=t&&t.style.boxShadow||"";this.layers=e?this.parseBoxShadow(e):[],this.sel=this.layers.length?0:-1,this.renderList(),this.loadEditor(),this.updatePreview()}}const Iu=new ze,Ou=t=>t.charAt(0).toUpperCase()+t.slice(1),Nu=["top","left","right","bottom"],$u=["px","em","vw","vh","%"],Pu=[["row","Row","→"],["row-reverse","Row reverse","←"],["column","Column","↓"],["column-reverse","Column reverse","↑"]],Du=[["flex-start","Start"],["center","Center"],["flex-end","End"],["space-between","Space between"],["space-around","Space around"]],Bu=[["flex-start","Start"],["center","Center"],["flex-end","End"],["stretch","Stretch"],["baseline","Baseline"]],Hu=[["nowrap","No wrap"],["wrap","Wrap"],["wrap-reverse","Reverse"]],zu=[["flex-start","Start"],["center","Center"],["flex-end","End"],["stretch","Stretch"],["space-between","Space between"],["space-around","Space around"]],Fu=[["none","None"],["left","Left"],["right","Right"]],Uu={direction:"flexDirection",justify:"justifyContent",align:"alignItems",wrap:"flexWrap",aligncontent:"alignContent",float:"cssFloat"};class ju{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementLayout"),this.offUnit="px",this.scrub=null,this.readoutUpdate={};const i=t=>`<span class="cb-lo-ga${"stretch"===t?" is-stretch":""}" style="align-items:${"baseline"===t?"flex-end":t}"><i></i><i></i><i></i></span>`,n=(t,i,n)=>`<div class="cb-seg" data-seg="${t}" role="group">${i.map((t=>`<button type="button" data-v="${t[0]}" title="${e.out(t[1])}">${n?n(t[0]):t[2]?`<span class="cb-lo-arrow">${t[2]}</span>`:e.out(t[1])}</button>`)).join("")}</div>`,o=(t,i)=>`<div class="cb-fhead"><span class="cb-field-label">${e.out(i)}</span><span class="cb-readout" data-readout="${t}"></span></div>`,s=`\n <div class="cb-elmlayout">\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Display")}</span>\n <div class="cb-lo-sel"><select id="inpElmDisplay">\n <option value="">${e.out("Default")}</option>\n <option value="block">Block</option><option value="inline-block">Inline block</option>\n <option value="inline">Inline</option><option value="flex">Flex</option><option value="none">None</option>\n </select></div>\n </div>\n\n <div class="cb-lo-reveal" data-flex style="display:none">\n <div class="cb-lo-seclabel">${e.out("Flex")}</div>\n <div class="cb-field">${o("direction","Direction")}${n("direction",Pu,null)}</div>\n <div class="cb-field">${o("justify","Justify Content")}${n("justify",Du,(t=>`<span class="cb-lo-gj" style="justify-content:${t}"><i></i><i></i><i></i></span>`))}</div>\n <div class="cb-field">${o("align","Align Items")}${n("align",Bu,i)}</div>\n <div class="cb-field"><span class="cb-field-label">${e.out("Wrap")}</span>${n("wrap",Hu,null)}</div>\n <div class="cb-field" data-acwrap style="display:none">${o("aligncontent","Align Content")}${n("aligncontent",zu,i)}</div>\n </div>\n\n <div class="cb-lo-sep"></div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Position")}</span>\n <div class="cb-lo-sel"><select id="inpElmPosition">\n <option value="">${e.out("Static")}</option>\n <option value="relative">Relative</option><option value="absolute">Absolute</option>\n <option value="fixed">Fixed</option><option value="sticky">Sticky</option>\n </select></div>\n </div>\n\n <div class="cb-lo-reveal" data-pos style="display:none">\n <div class="cb-lo-seclabel">${e.out("Offsets")}</div>\n <div class="cb-lo-cross">\n ${Nu.map((t=>`<div class="cb-lo-field" data-side="${t}"><input type="text" class="cb-lo-value" id="inpElm${Ou(t)}" data-side="${t}" inputmode="numeric" autocomplete="off" spellcheck="false" title="${e.out(Ou(t))}"></div>`)).join("")}\n <div class="cb-lo-box"><span class="cb-lo-caption"></span></div>\n </div>\n <div class="cb-seg is-inline cb-lo-unit" data-unit role="group" aria-label="${e.out("Unit")}">${$u.map(((t,e)=>`<button type="button" data-u="${t}"${0===e?' class="on"':""}>${t}</button>`)).join("")}</div>\n </div>\n\n <div class="cb-field"><span class="cb-field-label">${e.out("Float")}</span>${n("float",Fu,null)}</div>\n\n </div>\n `;Iu.appendHtml(this.panelStuff,s),this.wire()}elm(){return this.builder.inspectedElement}done(t=!0){this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.cross=t.querySelector(".cb-lo-cross");const e=t.querySelector("#inpElmDisplay");e.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.elm().style.display=e.value,t.querySelector("[data-flex]").style.display="flex"===e.value?"":"none",this.done()}));const i=t.querySelector("#inpElmPosition");i.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.elm().style.position=i.value,t.querySelector("[data-pos]").style.display=i.value&&"static"!==i.value?"":"none",this.done()})),t.querySelectorAll("[data-seg]").forEach((e=>{const i=e.getAttribute("data-seg"),n=t.querySelector(`[data-readout="${i}"]`);n&&(this.readoutUpdate[i]=this.util.bindReadout(e,n)),e.querySelectorAll("button").forEach((n=>n.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const o=n.classList.contains("on")?"":n.getAttribute("data-v");e.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t===n&&""!==o))),this.elm().style[Uu[i]]=o,"wrap"===i&&(t.querySelector("[data-acwrap]").style.display=o&&"nowrap"!==o?"":"none"),this.readoutUpdate[i]&&this.readoutUpdate[i](),this.done()}))))})),Nu.forEach((e=>this.bindOffset(t.querySelector(`#inpElm${Ou(e)}`),e))),t.querySelectorAll("[data-unit] button").forEach((t=>t.addEventListener("click",(()=>this.setOffUnit(t.getAttribute("data-u"),!0)))))}applyOffset(t,{undo:e=!1,notify:i=!0}={}){const n=this.elm();if(!n)return;e&&this.builder.uo.saveForUndo();const o=this.panelStuff.querySelector(`#inpElm${Ou(t)}`).value.trim();n.style[t]=""===o||isNaN(o)?"":o+this.offUnit,this.done(i)}setOffUnit(t,e){this.offUnit=t,this.panelStuff.querySelectorAll("[data-unit] button").forEach((e=>e.classList.toggle("on",e.getAttribute("data-u")===t))),e&&(this.builder.uo.saveForUndo(),Nu.forEach((t=>this.applyOffset(t,{undo:!1,notify:!1}))),this.builder.opts.onChange())}bindOffset(t,e){const i=this.panelStuff.ownerDocument;t.addEventListener("click",(()=>this.builder.uo.saveForUndo())),t.addEventListener("keyup",(t=>{"ArrowUp"!==t.key&&"ArrowDown"!==t.key&&this.applyOffset(e)})),t.addEventListener("change",(()=>this.applyOffset(e))),t.addEventListener("keydown",(i=>{"ArrowUp"!==i.key&&"ArrowDown"!==i.key||(i.preventDefault(),t.value=String((parseFloat(t.value)||0)+("ArrowUp"===i.key?1:-1)),this.applyOffset(e,{undo:!0}))})),t.addEventListener("pointerdown",(n=>{0===n.button&&this.elm()&&(i.activeElement!==t&&n.preventDefault(),this.scrub={input:t,side:e,x:n.clientX,y:n.clientY,start:parseFloat(t.value)||0,moved:!1,undo:!0},t.setPointerCapture(n.pointerId))})),t.addEventListener("pointermove",(i=>{const n=this.scrub;if(!n||n.input!==t)return;const o=i.clientX-n.x,s=n.y-i.clientY;if(!n.moved){if(Math.abs(o)<3&&Math.abs(s)<3)return;n.moved=!0,this.cross.classList.add("is-scrubbing")}const l=Math.abs(s)>=Math.abs(o)?s:o;t.value=String(Math.round(n.start+l/2)),this.applyOffset(e,{undo:n.undo,notify:!1}),n.undo=!1}));const n=e=>{const i=this.scrub;i&&i.input===t&&(this.scrub=null,this.cross.classList.remove("is-scrubbing"),t.hasPointerCapture(e.pointerId)&&t.releasePointerCapture(e.pointerId),i.moved?this.builder.opts.onChange():(t.focus(),t.select()))};t.addEventListener("pointerup",n),t.addEventListener("pointercancel",n)}markSeg(t,e){this.panelStuff.querySelectorAll(`[data-seg="${t}"] button`).forEach((t=>t.classList.toggle("on",t.getAttribute("data-v")===e&&!!e))),this.readoutUpdate[t]&&this.readoutUpdate[t]()}readElementStyles(t){const e=this.panelStuff,i=t.style.display||"";e.querySelector("#inpElmDisplay").value=i,e.querySelector("[data-flex]").style.display="flex"===i?"":"none",this.markSeg("direction",t.style.flexDirection),this.markSeg("justify",t.style.justifyContent),this.markSeg("align",t.style.alignItems),this.markSeg("wrap",t.style.flexWrap),this.markSeg("aligncontent",t.style.alignContent),e.querySelector("[data-acwrap]").style.display=t.style.flexWrap&&"nowrap"!==t.style.flexWrap?"":"none";const n=t.style.position||"";e.querySelector("#inpElmPosition").value=n,e.querySelector("[data-pos]").style.display=n&&"static"!==n?"":"none",e.querySelector(".cb-lo-caption").textContent=(t.tagName||"element").toLowerCase();let o=null;Nu.forEach((i=>{const n=t.style[i]||"",s=parseFloat(n);e.querySelector(`#inpElm${Ou(i)}`).value=isNaN(s)?"":s,isNaN(s)||o||$u.forEach((t=>{-1!==n.indexOf(t)&&(o=t)}))})),this.setOffUnit(o||"px",!1),this.markSeg("float",t.style.cssFloat||t.style.float)}}const Wu=new ze,Vu=[{key:"blur",label:"Blur",min:0,max:20,def:0,cssUnit:"px",suffix:"px"},{key:"brightness",label:"Brightness",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"contrast",label:"Contrast",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"grayscale",label:"Grayscale",min:0,max:100,def:0,cssUnit:"%",suffix:"%"},{key:"saturate",label:"Saturate",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"hue-rotate",label:"Hue",min:0,max:360,def:0,cssUnit:"deg",suffix:"°"},{key:"invert",label:"Invert",min:0,max:100,def:0,cssUnit:"%",suffix:"%"},{key:"sepia",label:"Sepia",min:0,max:100,def:0,cssUnit:"%",suffix:"%"}];class Gu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementEffect");const i=Vu.map((t=>`\n <div class="cb-fx-row" data-row="${t.key}">\n <span class="cb-fx-rlabel">${e.out(t.label)}</span>\n <input type="range" class="cb-slider cb-fx-slider" data-f="${t.key}" min="${t.min}" max="${t.max}" step="1" value="${t.def}" aria-label="${e.out(t.label)}">\n <span class="cb-fx-rval" data-v="${t.key}"></span>\n </div>`)).join(""),n=`\n <div class="cb-elmeffect">\n\n <div class="cb-fx-field">\n <div class="cb-fhead">\n <span class="cb-field-label">${e.out("Opacity")}</span>\n <span class="cb-readout" data-opacity-v></span>\n </div>\n <input type="range" class="cb-slider" data-opacity min="0" max="100" step="1" value="100" aria-label="${e.out("Opacity")}">\n </div>\n\n <div class="cb-fx-sep"></div>\n\n <div class="cb-fx-seclabel">\n <span>${e.out("Filters")}</span>\n <button type="button" class="cb-fx-reset" data-reset>${e.out("Reset")}</button>\n </div>\n\n <div class="cb-fx-rows">${i}</div>\n\n </div>\n `;Wu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.opacity=t.querySelector("[data-opacity]"),this.opacityV=t.querySelector("[data-opacity-v]"),this.opacity.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),this.opacity.addEventListener("input",(()=>this.applyOpacity())),this.opacity.addEventListener("change",(()=>this.builder.opts.onChange())),Vu.forEach((e=>{const i=t.querySelector(`[data-f="${e.key}"]`);i.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),i.addEventListener("input",(()=>{this.syncRow(e),this.applyFilter()})),i.addEventListener("change",(()=>this.builder.opts.onChange()))})),t.querySelector("[data-reset]").addEventListener("click",(()=>{""!==this.composeFilter()&&(this.builder.uo.saveForUndo(),Vu.forEach((e=>{t.querySelector(`[data-f="${e.key}"]`).value=e.def,this.syncRow(e)})),this.applyFilter())}))}syncRow(t){const e=this.panelStuff,i=parseInt(e.querySelector(`[data-f="${t.key}"]`).value,10);e.querySelector(`[data-v="${t.key}"]`).textContent=i+t.suffix,e.querySelector(`[data-row="${t.key}"]`).classList.toggle("is-active",i!==t.def)}applyOpacity(){const t=this.elm();if(!t)return;const e=parseInt(this.opacity.value,10);this.opacityV.textContent=e+"%",t.style.opacity=100===e?"":String(e/100),this.done()}composeFilter(){const t=this.panelStuff,e=[];return Vu.forEach((i=>{const n=parseInt(t.querySelector(`[data-f="${i.key}"]`).value,10);n!==i.def&&e.push(`${i.key}(${n}${i.cssUnit})`)})),e.join(" ")}applyFilter(){const t=this.elm();if(!t)return;const e=this.composeFilter();t.style.filter=e,this.done()}readElementStyles(t){const e=this.panelStuff,i=parseFloat(t.style.opacity),n=isNaN(i)?100:Math.round(100*i);this.opacity.value=n,this.opacityV.textContent=n+"%";const o=t.style.filter||"";Vu.forEach((t=>{let i=t.def;const n=o.match(new RegExp(t.key+"\\(\\s*([-\\d.]+)\\s*(%|px|deg)?\\s*\\)"));if(n){let e=parseFloat(n[1]);"%"===t.cssUnit&&(void 0===n[2]||""===n[2])&&e<=3&&(e*=100),isNaN(e)||(i=Math.round(e))}e.querySelector(`[data-f="${t.key}"]`).value=i,this.syncRow(t)}))}}const Yu=new ze;class Xu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.panelStuff=this.builderStuff.querySelector("#divElementMore");const i=`\n <div class="cb-elmmore">\n\n <div class="cb-field">\n <label class="cb-field-label" for="inpElmId">${e.out("Element ID")}</label>\n <div class="cb-mo-id">\n <span class="cb-mo-hash">#</span>\n <input type="text" id="inpElmId" spellcheck="false" placeholder="${e.out("none")}">\n </div>\n </div>\n\n <div class="cb-field">\n <label class="cb-field-label">${e.out("CSS classes")}</label>\n <div data-chips></div>\n <div class="cb-mo-hint">${e.out("Press Enter or space to add. Click × to remove.")}</div>\n </div>\n\n </div>\n `;Yu.appendHtml(this.panelStuff,i),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff,e=t.querySelector("#inpElmId");e.addEventListener("change",(()=>{const t=this.elm();this.builder.uo.saveForUndo(),""!==e.value.trim()?t.setAttribute("id",e.value.trim()):t.removeAttribute("id"),this.builder.opts.onChange()})),this.chips=this.util.chipField(t.querySelector("[data-chips]"),{placeholder:this.util.out("Add class…"),removeTitle:this.util.out("Remove"),onChange:t=>this.applyClasses(t)})}applyClasses(t){const e=this.elm();if(!e)return;this.builder.uo.saveForUndo();let i=[];const n=e.getAttribute("data-class");n&&(i=n.split(" ")),i.forEach((i=>{""===i||t.includes(i)||e.classList.remove(i)})),t.forEach((t=>{""!==t&&e.classList.add(t)}));const o=t.join(" ");e.setAttribute("data-class",o),""===e.getAttribute("data-class")&&e.removeAttribute("data-class"),this.builder.opts.onChange()}readElementStyles(t){this.panelStuff.querySelector("#inpElmId").value=t.getAttribute("id")||"",this.chips.set(t.getAttribute("data-class")||"")}}const Ku=new ze;class Zu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;let n=i.querySelector("#divElementAnimation");this.panelStuff=n;const o=`\n <div style="margin-top:13px;font-weight:bold;">${e.out("Animate")}</div>\n\n <div class="is-settings" style="width:100%;">\n <div style="display:flex">\n <select id="selElmAnim">\n <option value=""></option>\n <option value="fade">fade</option>\n <option value="fade-up">fade-up</option>\n <option value="fade-down">fade-down</option>\n <option value="fade-left">fade-left</option>\n <option value="fade-right">fade-right</option>\n <option value="fade-up-right">fade-up-right</option>\n <option value="fade-up-left">fade-up-left</option>\n <option value="fade-down-right">fade-down-right</option>\n <option value="fade-down-left">fade-down-left</option>\n <option value="flip-up">flip-up</option>\n <option value="flip-down">flip-down</option>\n <option value="flip-left">flip-left</option>\n <option value="flip-right">flip-right</option>\n <option value="slide-up">slide-up</option>\n <option value="slide-down">slide-down</option>\n <option value="slide-left">slide-left</option>\n <option value="slide-right">slide-right</option>\n <option value="zoom-in">zoom-in</option>\n <option value="zoom-in-up">zoom-in-up</option>\n <option value="zoom-in-down">zoom-in-down</option>\n <option value="zoom-in-left">zoom-in-left</option>\n <option value="zoom-in-right">zoom-in-right</option>\n <option value="zoom-out">zoom-out</option>\n <option value="zoom-out-up">zoom-out-up</option>\n <option value="zoom-out-down">zoom-out-down</option>\n <option value="zoom-out-left">zoom-out-left</option>\n <option value="zoom-out-right">zoom-out-right</option>\n </select>\n </div>\n </div>\n\n <div class="is-settings" style="width:110px;">\n <div> ${e.out("Delay")}:</div>\n <div>\n <select id="selElmAnimDelay">\n <option value=""></option>\n <option value="0">0</option>\n <option value="100">100</option>\n <option value="200">200</option>\n <option value="300">300</option>\n <option value="400">400</option>\n <option value="500">500</option>\n <option value="600">600</option>\n <option value="700">700</option>\n <option value="800">800</option>\n <option value="900">900</option>\n <option value="1000">1000</option>\n <option value="1100">1100</option>\n <option value="1200">1200</option>\n <option value="1300">1300</option>\n <option value="1400">1400</option>\n <option value="1500">1500</option>\n <option value="1600">1600</option>\n <option value="1700">1700</option>\n <option value="1800">1800</option>\n <option value="1900">1900</option>\n <option value="2000">2000</option>\n <option value="2100">2100</option>\n <option value="2200">2200</option>\n <option value="2300">2300</option>\n <option value="2400">2400</option>\n <option value="2500">2500</option>\n <option value="2600">2600</option>\n <option value="2700">2700</option>\n <option value="2800">2800</option>\n <option value="2900">2900</option>\n <option value="3000">3000</option>\n </select> &nbsp;ms\n </div>\n </div>\n\n <div class="is-settings" style="width:110px;">\n <div> ${e.out("Duration")}:</div>\n <div>\n <select id="selElmAnimDuration">\n <option value=""></option>\n <option value="0">0</option>\n <option value="100">100</option>\n <option value="200">200</option>\n <option value="300">300</option>\n <option value="400">400</option>\n <option value="500">500</option>\n <option value="600">600</option>\n <option value="700">700</option>\n <option value="800">800</option>\n <option value="900">900</option>\n <option value="1000">1000</option>\n <option value="1100">1100</option>\n <option value="1200">1200</option>\n <option value="1300">1300</option>\n <option value="1400">1400</option>\n <option value="1500">1500</option>\n <option value="1600">1600</option>\n <option value="1700">1700</option>\n <option value="1800">1800</option>\n <option value="1900">1900</option>\n <option value="2000">2000</option>\n <option value="2100">2100</option>\n <option value="2200">2200</option>\n <option value="2300">2300</option>\n <option value="2400">2400</option>\n <option value="2500">2500</option>\n <option value="2600">2600</option>\n <option value="2700">2700</option>\n <option value="2800">2800</option>\n <option value="2900">2900</option>\n <option value="3000">3000</option>\n </select> &nbsp;ms\n </div>\n </div>\n\n <div class="is-settings" style="width:100%;">\n <div style="margin-top:15px">\n <label for="chkAnimateOnce"><input type="checkbox" id="chkAnimateOnce" value=""> ${e.out("Animate Once")} </label>\n </div>\n </div>\n\n <div class="is-settings" style="width:100%;">\n <div style="display:flex">\n <button title="${e.out("Test")}" id="btnPreviewAnim" class="classic" value=""> ${e.out("TEST")} </button>\n </div>\n </div>\n `;Ku.appendHtml(n,o);let s=n.querySelector("#selElmAnim");s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnim").value;""===e?t.removeAttribute("data-aos"):(t.setAttribute("data-aos",e),n.querySelector("#btnPreviewAnim").click()),this.builder.opts.onChange()})),s=n.querySelector("#selElmAnimDelay"),s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnimDelay").value;""===e?t.removeAttribute("data-aos-delay"):t.setAttribute("data-aos-delay",e),this.builder.opts.onChange()})),s=n.querySelector("#selElmAnimDuration"),s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnimDuration").value;""===e?t.removeAttribute("data-aos-duration"):t.setAttribute("data-aos-duration",e),this.builder.opts.onChange()}));let l=n.querySelector("#chkAnimateOnce");l.addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement;n.querySelector("#chkAnimateOnce").checked?t.setAttribute("data-aos-once","true"):t.removeAttribute("data-aos-once"),this.builder.opts.onChange()})),l=n.querySelector("#btnPreviewAnim"),l.addEventListener("click",(()=>{let t=this.builder.inspectedElement,e=t.getAttribute("data-aos-duration");t.removeAttribute("data-aos-duration"),t.style.visibility="hidden",window.AOS&&window.AOS.init({duration:1}),Ku.removeClass(t,"aos-init"),Ku.removeClass(t,"aos-animate"),setTimeout((function(){t.style.visibility="",window.AOS&&window.AOS.init({duration:1200}),e&&t.setAttribute("data-aos-duration",e)}),10)}))}readElementStyles(t){this.panelStuff.querySelector("#selElmAnimDelay").value="";let e=t.getAttribute("data-aos-delay");this.panelStuff.querySelector("#selElmAnimDelay").value=e,this.panelStuff.querySelector("#selElmAnimDuration").value="",e=t.getAttribute("data-aos-duration"),this.panelStuff.querySelector("#selElmAnimDuration").value=e,this.panelStuff.querySelector("#chkAnimateOnce").checked=!1;let i=t.getAttribute("data-aos-once");i&&"true"===i&&(this.panelStuff.querySelector("#chkAnimateOnce").checked=!0),this.panelStuff.querySelector("#selElmAnim").value="",e=t.getAttribute("data-aos"),this.panelStuff.querySelector("#selElmAnim").value=e}}const Ju=new ze;let Qu=[];class td{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i}renderPanel(){const t=this.util,e=this.builderStuff,i=this.builder;let n=e.querySelector(".elementstyles");if(!n){let o=`\n <div class="is-modal is-modal-content elementstyles" style="display:none;" tabindex="-1" role="dialog" aria-hidden="true">\n\n <div class="is-modal-bar is-draggable" draggable="">\n <span>${t.out("Element")}</span>\n <button type="button" tabindex="-1" title="${t.out("Close")}" class="is-modal-close">&#10005;</button>\n </div>\n\n <div class="elm-dock">\n\n <div class="elm-list"></div>\n\n <div class="cb-tabs-scroller">\n <div class="cb-tabs cb-tabs-scroll" role="tablist" aria-label="${t.out("Element styles")}" data-group="element">\n <button type="button" role="tab" id="tabElementGeneral" data-tab="divElementGeneral" aria-controls="divElementGeneral" aria-selected="true" tabindex="0">${t.out("General")}</button>\n <button type="button" role="tab" id="tabElementBox" data-tab="divElementBox" aria-controls="divElementBox" aria-selected="false" tabindex="-1">${t.out("Box")}</button>\n <button type="button" role="tab" id="tabElementSpacing" data-tab="divElementSpacing" aria-controls="divElementSpacing" aria-selected="false" tabindex="-1">${t.out("Spacing")}</button>\n <button type="button" role="tab" id="tabElementText" data-tab="divElementText" aria-controls="divElementText" aria-selected="false" tabindex="-1">${t.out("Text")}</button>\n <button type="button" role="tab" id="tabElementBorder" data-tab="divElementBorder" aria-controls="divElementBorder" aria-selected="false" tabindex="-1">${t.out("Border")}</button>\n <button type="button" role="tab" id="tabElementCorner" data-tab="divElementCorner" aria-controls="divElementCorner" aria-selected="false" tabindex="-1">${t.out("Corners")}</button>\n <button type="button" role="tab" id="tabElementShadow" data-tab="divElementShadow" aria-controls="divElementShadow" aria-selected="false" tabindex="-1">${t.out("Shadow")}</button>\n <button type="button" role="tab" id="tabElementLayout" data-tab="divElementLayout" aria-controls="divElementLayout" aria-selected="false" tabindex="-1">${t.out("Layout")}</button>\n <button type="button" role="tab" id="tabElementEffect" data-tab="divElementEffect" aria-controls="divElementEffect" aria-selected="false" tabindex="-1">${t.out("Effects")}</button>\n \x3c!--<button type="button" role="tab" id="tabElementAttribute" data-tab="divElementAttribute" aria-controls="divElementAttribute" aria-selected="false" tabindex="-1" style="display:none">${t.out("Attributes")}</button>--\x3e\n ${!0===this.builder.opts.elementAnimate?`<button type="button" role="tab" id="tabElementAnimation" data-tab="divElementAnimation" aria-controls="divElementAnimation" aria-selected="false" tabindex="-1">${t.out("Animation")}</button>`:""}\n <button type="button" role="tab" id="tabElementMore" data-tab="divElementMore" aria-controls="divElementMore" aria-selected="false" tabindex="-1">${t.out("More")}</button>\n </div>\n <button type="button" class="cb-tabs-arrow cb-tabs-arrow--prev" aria-hidden="true" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"/></svg></button>\n <button type="button" class="cb-tabs-arrow cb-tabs-arrow--next" aria-hidden="true" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18l6-6-6-6"/></svg></button>\n </div>\n\n <div class="elm-dock-content">\n\n <div id="divElementGeneral" class="is-tab-content active" role="tabpanel" aria-labelledby="tabElementGeneral" tabindex="-1" data-group="element" style="display:flex;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n <div id="divElementBox" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementBox" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementSpacing" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementSpacing" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementBorder" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementBorder" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementText" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementText" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementCorner" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementCorner" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementShadow" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementShadow" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n <div id="divElementLayout" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementLayout" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementEffect" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementEffect" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n \x3c!--<div id="divElementAttribute" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementAttribute" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>--\x3e\n \n <div id="divElementAnimation" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementAnimation" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementMore" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementMore" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n </div>\n\n <div class="elm-dock-foot">\n <button type="button" title="${t.out("css")}" class="elm-editstyle classic">${t.out("css")}</button>\n </div>\n\n </div>\n </div>\n `;Ju.appendHtml(e,o),this.elementStyleEditor=new ou(i),n=e.querySelector(".elementstyles");let s=n.querySelector(".is-modal-close");Ju.addEventListener(s,"click",(()=>{this.hidePanel()})),s=n.querySelector(".elm-editstyle"),Ju.addEventListener(s,"click",(()=>{this.elementStyleEditor.toggleStyleEditor()})),this.panel=n;const l=new ru(i);this.elementBoxStyles=l;const a=new lu(i);this.elementGeneralStyles=a;const r=new bu(i);this.elementSpacingStyles=r;const c=new yu(i);this.elementBorderStyles=c;const u=new xu(i);this.elementTextStyles=u;const d=new Au(i);this.elementCornerStyles=d;const h=new Ru(i);this.elementShadowStyles=h;const b=new ju(i);this.elementLayoutStyles=b;const p=new Gu(i);this.elementEffectStyles=p;const g=new Xu(i);this.elementMoreStyles=g;const m=new Zu(i);this.elementAnimationStyles=m,this.tabs=Ju.accessibleTabs(this.panel.querySelector(".cb-tabs"),((t,e)=>{this.panel.querySelectorAll('.is-tab-content[data-group="element"]').forEach((t=>{t.style.display="none",Ju.removeClass(t,"active")}));const i=this.panel.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex",Ju.addClass(i,"active"))})),Ju.scrollableTabs(this.panel.querySelector(".cb-tabs-scroller")),new vs({selector:".is-modal.elementstyles .is-draggable"})}this.panel=n}click(){this.panel&&(Ju.hasClass(this.panel,"active")||Ju.hasClass(this.elementStyleEditor.modalStyles,"active"))&&this.inspect(this.builder.inspectedElement)}inspect(t){this.elementGeneralStyles.readElementStyles(t),this.elementBoxStyles.readElementStyles(t),this.elementSpacingStyles.readElementStyles(t),this.elementBorderStyles.readElementStyles(t),this.elementTextStyles.readElementStyles(t),this.elementCornerStyles.readElementStyles(t),this.elementShadowStyles.readElementStyles(t),this.elementLayoutStyles.readElementStyles(t),this.elementEffectStyles.readElementStyles(t),this.elementMoreStyles.readElementStyles(t),this.elementAnimationStyles.readElementStyles(t);let e=this.panel,i=this.builder.doc.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(i,(t=>{t.removeAttribute("data-saveforundo")})),t.setAttribute("data-saveforundo",""),i=this.builder.doc.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(i,(t=>{Ju.removeClass(t,"elm-inspected")})),setTimeout((()=>{Ju.addClass(t,"elm-inspected")}),10),e.querySelector(".elm-list").innerHTML="";let n=t,o=0;for(Qu=[];!Ju.hasClass(n,"is-builder")&&(Qu.push(n),n)&&n.tagName;){var s=n.tagName.toLowerCase(),l=Ju.createElement("a");l.setAttribute("data-index",o),o++,l.setAttribute("href","#"),l.innerHTML=s,""===e.querySelector(".elm-list").innerHTML?(Ju.addClass(l,"active"),e.querySelector(".elm-list").insertAdjacentHTML("afterbegin",l.outerHTML)):(e.querySelector(".elm-list").insertAdjacentHTML("afterbegin","&nbsp;>&nbsp; "),e.querySelector(".elm-list").insertAdjacentHTML("afterbegin",l.outerHTML)),n=n.parentNode}const a=e.querySelectorAll(".elm-list a");Array.prototype.forEach.call(a,(t=>{Ju.addEventListener(t,"click",(e=>{let i=t.getAttribute("data-index");this.builder.inspectedElement=Qu[i],this.inspect(Qu[i]),this.builder.doc.querySelector(".elm-inspected.elm-active")||(this.builderStuff.querySelector(".is-element-tool").style.display="none"),e.preventDefault(),e.stopImmediatePropagation()}))})),this.elementStyleEditor.refresh()}showPanel(){this.renderPanel();var t=this.panel;t.style.display="",this.util.applyModalPosition(t,this.builder.opts.elementEditorPosition),Ju.addClass(t,"active"),t.setAttribute("aria-hidden","false");let e=t.querySelector(".is-tab-content.active");e.focus(),this.builder.tabs.setupTabKey(e),this.escBound||(this.escBound=!0,t.addEventListener("keydown",(t=>{27===t.keyCode&&this.hidePanel()}))),this.inspect(this.builder.inspectedElement)}hidePanel(){var t=this.panel;if(!t)return;Ju.removeClass(t,"active"),t.setAttribute("aria-hidden","true");let e=this.builder.doc.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(e,(t=>{t.removeAttribute("data-saveforundo")})),e=this.builder.doc.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(e,(t=>{Ju.removeClass(t,"elm-inspected")}))}}class ed{constructor(t){this.builder=t;const e=this.builder.util,n=this.builder.builderStuff;this.util=e,this.builderStuff=n;const o=this.builder.dom;this.dom=o;const s=new td(t);this.elementPanel=s;let l=n.querySelector(".is-element-tool"),a=n.querySelector(".elmmore");if(!l){let i=["moveup","movedown","duplicate","settings"];t.elementMoreButtons&&(i=t.elementMoreButtons);const s={moveup:`<button type="button" title="${e.out("Move Up")}" class="elm-up" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${e.out("Move Up")}</button>`,movedown:`<button type="button" title="${e.out("Move Down")}" class="elm-down" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${e.out("Move Down")}</button>`,duplicate:`<button type="button" title="${e.out("Duplicate")}" class="elm-duplicate" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${e.out("Duplicate")}</button>`,settings:`<button type="button" title="${e.out("Settings")}" class="elm-settings" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${e.out("Settings")}</button>`};let r=i.filter((e=>!(!t.opts.elementEditor&&"settings"===e))).map((t=>s[t]||"")).join(""),c=`<div class="is-tool is-element-tool">\n <button type="button" tabindex="-1" title="${e.out("Add")}" class="elm-add">\n <svg class="is-icon-flex" style="width:14px;height:14px;color:#111"><use xlink:href="#icon-plus"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("More")}" class="elm-more">\n <svg class="is-icon-flex" style="width:17px;height:17px;color:#111"><use xlink:href="#icon-dots2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("Delete")}" class="elm-remove">\n <svg class="is-icon-flex" style="width:15px;height:15px;color:#111"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("Settings")}" class="elm-settings">\n <svg class="is-icon-flex"><use xlink:href="#ion-ios-gear"></use></svg>\n </button>\n </div>\n\n <div class="is-pop elmmore" style="z-index:10002;" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${r}\n </div>\n </div>\n `;o.appendHtml(n,c),l=this.builder.iframe?this.builder.contentStuff.querySelector(".is-element-tool"):n.querySelector(".is-element-tool"),a=n.querySelector(".elmmore");let u=l.querySelectorAll("[title]");Array.prototype.forEach.call(u,(t=>{t.setAttribute("data-title",t.getAttribute("title"))}))}this.elementTool=l,this.elementMore=a;const r=l.querySelector(".elm-add");o.addEventListener(r,"click",(()=>{const s=i(t);s.querySelector(".is-pop-tabs").style.display="none";const l=window.innerHeight,a=this.builder.util.getElementPosition(r);let c=a.top,u=a.left;e.showPop(s,!1,r);const d=s.offsetWidth,h=s.offsetHeight;l-c>h?(s.style.top=c+window.pageYOffset+42+"px",s.style.left=u-d/2+10+"px",o.removeClass(s,"arrow-bottom"),o.removeClass(s,"arrow-right"),o.removeClass(s,"arrow-left"),o.removeClass(s,"center"),o.addClass(s,"arrow-top"),o.addClass(s,"center")):(s.style.top=c+window.pageYOffset-h-8+"px",s.style.left=u-d/2+10+"px",o.removeClass(s,"arrow-top"),o.removeClass(s,"arrow-right"),o.removeClass(s,"arrow-left"),o.removeClass(s,"center"),o.addClass(s,"arrow-bottom"),o.addClass(s,"center")),s.setAttribute("data-mode","elm");t.activeElement&&t.activeElement.closest(".is-subblock")?s.classList.add("simple"):s.classList.remove("simple");const b=t=>{let i=t.target;if(i&&!(i.closest(".quickadd")||i.closest(".row-add")||i.closest(".is-rowadd-tool")||i.closest(".cell-add")||i.closest(".elm-add")||i.closest(".row-add-initial"))){const t=n.querySelector(".quickadd");e.hidePop(t),document.removeEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",b),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",b),this.builder.handleQuickAddClickOut_=!0)}));const c=l.querySelector(".elm-remove");o.addEventListener(c,"click",(()=>{e.confirm(e.out("Are you sure you want to delete this element?"),(t=>{if(t){this.builder.uo.saveForUndo();let t=this.builder.activeElement,n=!1;t.closest(".is-subblock")&&(n=!0);if(t.closest("[data-cb-type]")&&n)return t.remove(),this.elementTool.style.display="none",this.builder.opts.onChange(),void(this.builder.onSelectChange&&this.builder.onSelectChange());let s=t.parentNode;t.remove();let l=o.elementChildren(s);s.classList.contains("cell-active")||0!==l.length||s.remove(),this.elementTool.style.display="none";let a=this.builder.activeCol;if(a){let t=a.parentNode;0===a.childElementCount&&4===t.childElementCount?(t.parentNode.removeChild(t),e.checkEmpty()):0===a.childElementCount&&(t.removeChild(a),e.fixLayout(t))}const r=this.builder.doc.querySelectorAll(".is-subblock");if(Array.prototype.forEach.call(r,(t=>{const e=o.elementChildren(t);let i=!0;e.forEach((()=>{i=!1})),i&&(t.innerHTML='<div class="spacer height-40" contentEditable="false"></div>')})),e.clearControls(),n){let t=this.builder.activeCol,n=t.querySelectorAll("[data-subblock]");var i=1;Array.prototype.forEach.call(n,(e=>{if(e.closest(".glide__slide--clone"))return;let n=e.innerHTML;t.setAttribute("data-html-"+i,encodeURIComponent(n)),i++})),e.refreshModuleLayout(t)}this.builder.opts.onChange(),this.builder.onSelectChange&&this.builder.onSelectChange()}}))}));const u=l.querySelector(".elm-more");o.addEventListener(u,"click",(()=>{const t=window.innerHeight,i=a.querySelector(".elm-settings");this.builder.activeElement.hasAttribute("data-cb-type")?i.style.display="none":i.style.display="";const n=this.builder.util.getElementPosition(u);let s=n.top,l=n.left;e.showPop(a,!1,u);const r=a.offsetWidth,c=a.offsetHeight;t-s>c?(a.style.top=s+window.pageYOffset+42+"px",a.style.left=l-r/2+10+"px",o.removeClass(a,"arrow-bottom"),o.removeClass(a,"arrow-right"),o.removeClass(a,"arrow-left"),o.removeClass(a,"center"),o.addClass(a,"arrow-top"),o.addClass(a,"center")):(a.style.top=s+window.pageYOffset-c-8+"px",a.style.left=l-r/2+10+"px",o.removeClass(a,"arrow-top"),o.removeClass(a,"arrow-right"),o.removeClass(a,"arrow-left"),o.removeClass(a,"center"),o.addClass(a,"arrow-bottom"),o.addClass(a,"center"))}));const d=a.querySelector(".elm-up");o.addEventListener(d,"click",(()=>{let t=this.builder.activeElement;if(t.previousElementSibling)this.builder.uo.saveForUndo(),t.parentNode.insertBefore(t,t.previousElementSibling),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange();else{let e=t;for(;!o.hasClass(e.parentNode,"cell-active")&&!e.parentNode.hasAttribute("data-subblock");)e=e.parentNode;e.previousElementSibling&&e!==t&&(this.builder.uo.saveForUndo(),e.parentNode.insertBefore(e,e.previousElementSibling),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange())}}));const h=a.querySelector(".elm-down");o.addEventListener(h,"click",(()=>{let t=this.builder.activeElement;if(t.nextElementSibling)this.builder.uo.saveForUndo(),t.parentNode.insertBefore(t.nextElementSibling,t),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange();else{let e=t;for(;!o.hasClass(e.parentNode,"cell-active")&&!e.parentNode.hasAttribute("data-subblock");)e=e.parentNode;e.nextElementSibling&&e!==t&&(this.builder.uo.saveForUndo(),e.parentNode.insertBefore(e.nextElementSibling,e),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange())}}));const b=a.querySelector(".elm-duplicate");o.addEventListener(b,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeElement;const e=t.cloneNode(!0);o.moveAfter(e,t),setTimeout((()=>{e.click(),this.position(e);let t=this.builder.doc.querySelector(".builder-active");t&&this.builder.applyBehaviorOn(t),this.builder.opts.onChange(),this.builder.reinitPlugins(e.parentNode)}),100)}));const p=l.querySelector(".elm-settings");p&&o.addEventListener(p,"click",(()=>{e.hidePop(a),this.elementPanel.showPanel()}));const g=a.querySelector(".elm-settings");g&&o.addEventListener(g,"click",(()=>{e.hidePop(a),this.elementPanel.showPanel()}))}hide(){const t=this.dom;this.elementTool.style.display="";let e=this.builder.doc.querySelectorAll(".elm-active");Array.prototype.forEach.call(e,(e=>{t.removeClass(e,"elm-active")}))}position(){const t=this.dom;let e=this.elementTool,i=this.elementMore;t.addClass(i,"transition1");let n=e.querySelector(".elm-more");const o=window.innerHeight,s=this.builder.util.getElementPosition(n);let l=s.top,a=s.left;const r=e.querySelector(".elm-more");this.util.showPop(i,!1,r);const c=i.offsetWidth,u=i.offsetHeight;o-l>u?(i.style.top=l+window.pageYOffset+27+"px",i.style.left=a-c/2+10+"px",t.removeClass(i,"arrow-bottom"),t.removeClass(i,"arrow-right"),t.removeClass(i,"arrow-left"),t.removeClass(i,"center"),t.addClass(i,"arrow-top"),t.addClass(i,"center")):(i.style.top=l+window.pageYOffset-u-8+"px",i.style.left=a-c/2+10+"px",t.removeClass(i,"arrow-top"),t.removeClass(i,"arrow-right"),t.removeClass(i,"arrow-left"),t.removeClass(i,"center"),t.addClass(i,"arrow-bottom"),t.addClass(i,"center")),setTimeout((()=>{t.removeClass(i,"transition1")}),300)}click(t,e){const i=this.dom,n=e.target;this.elementTool.style.display="none";let o=this.builder.doc.querySelectorAll(".elm-active");Array.prototype.forEach.call(o,(t=>{i.removeClass(t,"elm-active")}));let s=null,l=!1;t.hasAttribute("data-noedit")&&(l=!0);let a=!1;t.hasAttribute("data-protected")&&(a=!0);let r=!1;t.hasAttribute("data-html")&&(r=!0);let c=!1;n.closest(".is-subblock")&&!n.classList.contains("is-subblock")&&(c=!0);let u=!1;n.closest("span[data-cb-type]")&&(u=!0);const d=n.closest("[data-cb-type]"),h=n.closest("[data-cb-code]");if((r||l||a||u)&&!c);else if(h&&!c)s=h;else if(d&&!c)s=d;else{const t=n.tagName.toLowerCase();if(n.classList.contains("cell-active")||"h1"!==t&&"h2"!==t&&"h3"!==t&&"h4"!==t&&"h5"!==t&&"h6"!==t&&"p"!==t&&"div"!==t&&"pre"!==t&&"blockquote"!==t&&"li"!==t&&"img"!==t&&"iframe"!==t)if(i.hasClass(n,"cell-active")||n.hasAttribute("data-subblock"));else if(i.hasClass(n,"cell-active")||n.parentNode.hasAttribute("data-subblock"))s=n;else{let t=n;for(;"BODY"!==t.tagName&&"HTML"!==t.tagName;){let e=t.tagName.toLowerCase();if(i.hasClass(t,"spacer")||"h1"===e||"h2"===e||"h3"===e||"h4"===e||"h5"===e||"h6"===e||"p"===e||"pre"===e||"blockquote"===e||"li"===e||"img"===e||"iframe"===e){s=t;break}if(i.hasClass(t.parentNode,"cell-active")||t.parentNode.hasAttribute("data-subblock")){s=t;break}t=t.parentNode}}else if(s=n,"img"===t){i.hasClass(n.parentNode,"img-circular")&&(s=n.parentNode),i.getParentByTag(n,"a")&&(s=n.parentNode)}}if(s&&s.classList.contains("ovl")&&this.builder.activeIframe?s=this.builder.activeIframe.closest(".embed-responsive"):s&&s.classList.contains("ovl")&&s.parentNode.querySelector("audio")&&(s=s.parentNode),this.builder.activeElement=s,s){let t=s;this.pos(),t.setAttribute("data-cb-nohighlight",""),"none"===this.builder.win.getComputedStyle(t).backgroundImage&&t.removeAttribute("data-cb-nohighlight"),i.addClass(t,"elm-active")}this.builder.inspectedElement=e.target,this.elementPanel.click(e)}refresh(){if(this.builder.activeElement){this.elementTool.style.display="",setTimeout((()=>{this.pos()}),300)}}repositionElementTool(t){if(this.builder.activeElement)try{if(t){"flex"===this.elementTool.style.display&&this.pos()}else this.pos()}catch(t){}}pos(){let t=this.elementTool,e=this.builder.activeElement;if(!e)return;const i=e.closest("[data-edit-actions]");if(i){if((i.dataset.editActions||"").includes("no-add"))return}if(e.closest(".is-dock"))return;let n,o;this.builder.iframe?(n=e.getBoundingClientRect().top+this.builder.win.pageYOffset,o=e.getBoundingClientRect().left+this.builder.win.pageXOffset):(n=e.getBoundingClientRect().top+window.pageYOffset,o=e.getBoundingClientRect().left+window.pageXOffset);const s=e.offsetWidth*this.builder.opts.zoom,l=e.offsetHeight*this.builder.opts.zoom;t.style.display="flex",t.style.top=n+l+"px",t.style.left=o+s-t.offsetWidth+"px";const a=window.innerWidth;o+s>a&&(t.style.left=a-t.offsetWidth+"px")}}const id=new ze;class nd{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff,n=this.builder.dom;this.dom=n;let o="";if(this.builder.themes){o='<div class="div-themes" style="margin-top:3px">';let t=0;this.builder.themes.forEach((i=>{""===i[1]?o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};border:rgba(0,0,0,0.15) 1px solid;"></button>`:"light"===i[1]?o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};border:rgb(132 132 132 / 16%) 1px solid;"></button>`:o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};"></button>`,t++})),o+="</div>"}let s=i.querySelector(".viewconfig");if(!s){let l=function(t,e,i){const n=t.isTouchSupport?"display:none":"",o=t.themes&&t.themes.length>0,s="#divSnippetList"===t.opts.snippetList,l=(t,e,i,n,o="")=>`\n <div class="cb-field" ${o}>\n <span class="cb-grouplabel">${t}</span>\n <div class="cb-seg" data-seg-for="${e}" role="group" aria-label="${t}">\n ${n.map((t=>`<button type="button" data-val="${t[0]}">${t[1]}</button>`)).join("")}\n </div>\n <select class="${e}" id="${i}" style="display:none">\n ${n.map((t=>`<option value="${t[0]}">${t[1]}</option>`)).join("")}\n </select>\n </div>`,a=(t,e,i,n,o="",s="")=>`\n <div class="cb-field" ${s?`id="${s}"`:""} ${o}>\n <span class="cb-grouplabel">${t}</span>\n <div class="cb-sel">\n <select class="${e}" id="${i}">\n ${n.map((t=>`<option value="${t[0]}">${t[1]}</option>`)).join("")}\n </select>\n </div>\n </div>`,r=(t,e,i,n="",o="")=>`\n <div class="cb-switchrow ${n}" ${o}>\n <span class="lbl">${t}</span>\n <label class="switch"><input class="${e}" id="${i}" type="checkbox"><span class="slider"></span></label>\n </div>`;return`\n <div class="is-modal viewconfig" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Preferences")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Preferences")}">\n <button type="button" role="tab" id="tabPrefInterface" data-tab="divPrefInterface" aria-controls="divPrefInterface" aria-selected="true" tabindex="0">${e.out("Interface")}</button>\n <button type="button" role="tab" id="tabPrefGuides" data-tab="divPrefGuides" aria-controls="divPrefGuides" aria-selected="false" tabindex="-1">${e.out("Guides & Tools")}</button>\n <button type="button" role="tab" id="tabPrefEditing" data-tab="divPrefEditing" aria-controls="divPrefEditing" aria-selected="false" tabindex="-1">${e.out("Snippets & Editing")}</button>\n </div>\n\n <div id="divPrefInterface" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefInterface" data-group="preferences" style="display:block" tabindex="-1">\n ${o?`\n <div class="cb-field" style="${n}">\n <span class="cb-grouplabel">${e.out("Theme")}</span>\n ${i}\n </div>`:""}\n <div class="cb-pref-row2">\n ${a(e.out("Builder Mode"),"select-buildermode","__select_builderode",[["",e.out("Default")],["minimal",e.out("Minimal")],["clean",e.out("Clean")]],"","divBuilderMode")}\n ${l(e.out("Tool Style"),"select-toolstyle","__select_toolstyle",[["",e.out("Colored")],["gray",e.out("Mono")]])}\n </div>\n <div class="cb-pref-row2">\n ${l(e.out("Toolbar visibility"),"select-editingtoolbardisplay","__select_editingtoolbardisplay",[["auto",e.out("Auto")],["always",e.out("Always Visible")]])}\n ${a(e.out("Toolbar position"),"select-editingtoolbar","__select_editingtoolbar",[["topfull",e.out("Top (Full Width)")],["top",e.out("Top")],["left",e.out("Left")],["right",e.out("Right")]],`style="${n}"`)}\n </div>\n </div>\n\n <div id="divPrefGuides" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefGuides" data-group="preferences" style="display:none" tabindex="-1">\n <div class="cb-pref-row2">\n ${l(e.out("Outline Mode"),"select-outlinemode","__select_outlinemode",[["",e.out("Row & column")],["row",e.out("Row only")]],'id="divOutlineMode"')}\n ${l(e.out("Outline Style"),"select-outlinestyle","__select_outlinestyle",[["",e.out("Colored")],["grayoutline",e.out("Gray")]])}\n </div>\n <div class="cb-field" style="max-width:230px">\n <span class="cb-grouplabel">${e.out("Row Tool Position")}</span>\n <div class="cb-seg" data-seg-for="select-rowtool" role="group" aria-label="${e.out("Row Tool Position")}">\n <button type="button" data-val="right">${e.out("Right")}</button>\n <button type="button" data-val="left">${e.out("Left")}</button>\n </div>\n <select class="select-rowtool" id="__select_rowtool" style="display:none">\n <option value="right">${e.out("Right")}</option>\n <option value="left">${e.out("Left")}</option>\n </select>\n </div>\n\n <div class="cb-pref-sep"></div>\n <div class="cb-pref-grouphead">${e.out("Hide on canvas")}</div>\n ${r(e.out("Outline"),"input-hiderowcoloutline","__input_hiderowcoloutline")}\n ${r(e.out("Column Tool"),"input-hidecelltool","__input_hidecelltool","",'id="divHideCellTool"')}\n ${r(e.out("Snippet (+) Tool"),"input-hidesnippetaddtool","__input_hidesnippetaddtool")}\n ${r(e.out("Element tool"),"input-hideelementtool","__input_hideelementtool")}\n ${r(e.out("Element highlight"),"input-hideelementhighlight","__input_hideelementhighlight")}\n </div>\n\n <div id="divPrefEditing" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefEditing" data-group="preferences" style="display:none" tabindex="-1">\n <div class="cb-pref-grouphead">${e.out("Snippets")}</div>\n ${r(e.out("Open snippets sidebar on start"),"input-opensnippets","__input_opensnippets","option-opensnippets",'style="margin-bottom:14px"')}\n ${l(e.out("Snippets sidebar visibility"),"select-snippetssidebardisplay","__select_snippetssidebardisplay",[["auto",e.out("Auto")],["always",e.out("Always Visible")]],s?'style="max-width:280px"':'style="display:none"')}\n\n <div class="cb-pref-sep"></div>\n <div class="cb-pref-grouphead">${e.out("Editing")}</div>\n <div class="cb-pref-row2">\n ${a(e.out("Paste result"),"select-pasteresult","__select_pasteresult",[["auto",e.out("Auto")],["html-without-styles",e.out("HTML (without styles)")],["html",e.out("HTML (with styles)")],["text",e.out("Text only")]])}\n ${l(e.out("HTML View"),"select-htmlview","__select_htmlview",[["shorten",e.out("Shorten HTML")],["actual",e.out("Actual")]])}\n </div>\n </div>\n\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>`}(t,e,o);n.appendHtml(i,l),s=i.querySelector(".viewconfig"),"#divSnippetList"===t.opts.snippetList&&t.opts.snippetJSON.snippets.length>0||(s.querySelector(".option-opensnippets").style.display="none");let a=s.querySelector(".input-cancel");if(n.addEventListener(a,"click",(()=>{e.hideModal(s)})),a=s.querySelector(".input-ok"),n.addEventListener(a,"click",(()=>{this.update(),e.hideModal(s)})),null!==localStorage.getItem("_hiderowcoloutline")&&("1"===localStorage.getItem("_hiderowcoloutline")?this.builder.opts.rowcolOutline=!1:this.builder.opts.rowcolOutline=!0),this.setOutline(!this.builder.opts.rowcolOutline),null!==localStorage.getItem("_outlinemode")&&(this.builder.opts.outlineMode=localStorage.getItem("_outlinemode")),this.setOutlineMode(this.builder.opts.outlineMode),null!==localStorage.getItem("_outlinestyle")&&(this.builder.opts.outlineStyle=localStorage.getItem("_outlinestyle")),this.setOutlineStyle(this.builder.opts.outlineStyle),null!==localStorage.getItem("_pasteresult")&&(this.builder.opts.paste=localStorage.getItem("_pasteresult")),null!==localStorage.getItem("_htmlview")){let t=localStorage.getItem("_htmlview");this.builder.opts.shortenHTML="shorten"===t}if(null!==localStorage.getItem("_hidecelltool")&&("1"===localStorage.getItem("_hidecelltool")?this.builder.opts.columnTool=!1:this.builder.opts.columnTool=!0),this.setColumnTool(!this.builder.opts.columnTool),null!==localStorage.getItem("_hidesnippetaddtool")&&("1"===localStorage.getItem("_hidesnippetaddtool")?this.builder.opts.snippetAddTool=!1:this.builder.opts.snippetAddTool=!0),this.setSnippetAddTool(!this.builder.opts.snippetAddTool),null!==localStorage.getItem("_hideelementtool")&&("1"===localStorage.getItem("_hideelementtool")?this.builder.opts.elementTool=!1:this.builder.opts.elementTool=!0),this.setElementTool(!this.builder.opts.elementTool),null!==localStorage.getItem("_hideelementhighlight")&&("1"===localStorage.getItem("_hideelementhighlight")?this.builder.opts.elementHighlight=!1:this.builder.opts.elementHighlight=!0),this.setElementHighlight(!this.builder.opts.elementHighlight),null!==localStorage.getItem("_opensnippets")&&("1"===localStorage.getItem("_opensnippets")?this.builder.opts.snippetOpen=!0:this.builder.opts.snippetOpen=!1),null!==localStorage.getItem("_buildermode")&&(this.builder.opts.builderMode=localStorage.getItem("_buildermode")),this.setBuilderMode(this.builder.opts.builderMode),null!==localStorage.getItem("_rowtool")&&(this.builder.opts.rowTool=localStorage.getItem("_rowtool")),this.setRowToolPosition(this.builder.opts.rowTool),null!==localStorage.getItem("_toolstyle")&&(this.builder.opts.toolStyle=localStorage.getItem("_toolstyle")),this.setToolStyle(this.builder.opts.toolStyle),null!==localStorage.getItem("_editingtoolbardisplay")&&(this.builder.opts.toolbarDisplay=localStorage.getItem("_editingtoolbardisplay")),null!==localStorage.getItem("_snippetssidebardisplay")&&(this.builder.opts.snippetsSidebarDisplay=localStorage.getItem("_snippetssidebardisplay")),null!=localStorage.getItem("_editingtoolbar")&&(this.builder.opts.toolbar=localStorage.getItem("_editingtoolbar")),this.setToolbar(this.builder.opts.toolbar),null!=localStorage.getItem("_theme")){const t=localStorage.getItem("_theme");if(this.builder.themeIndex=t,this.builder.themes&&this.builder.themes.length>0){const e=this.builder.themes[t];e&&(this.builder.setUIColor(e[1],e[2]),this.builder.renderIframeLater=!0)}}else this.builder.setUIColor("",""),this.builder.renderIframeLater=!0;this.builder.renderIframeLater||e.getUIStyles(),this.builder.opts.emailMode&&(this.builder.opts.outlineMode="row",this.builder.opts.columnTool=!1,this.builder.opts.builderMode="",null!=localStorage.getItem("_outlinemode")&&localStorage.setItem("_outlinemode","row"),null!==localStorage.getItem("_hidecelltool")&&localStorage.setItem("_hidecelltool","1"),null!==localStorage.getItem("_buildermode")&&localStorage.setItem("_buildermode",""),this.setColumnTool(!0),this.setBuilderMode(""),this.setEmailMode(),i.querySelector("#divHideCellTool").style.display="none",i.querySelector("#divOutlineMode").style.display="none",i.querySelector("#divBuilderMode").style.display="none")}this.config=s,function(t){const e=t.config;if(!e)return;id.accessibleTabs(e.querySelector(".cb-tabs"),((t,i)=>{e.querySelectorAll('.is-tab-content[data-group="preferences"]').forEach((t=>{t.style.display="none"}));const n=e.querySelector("#"+i.getAttribute("aria-controls"));n&&(n.style.display="block")})),e.querySelectorAll(".cb-seg[data-seg-for]").forEach((t=>{const i=e.querySelector("."+t.getAttribute("data-seg-for"));i&&t.querySelectorAll("button").forEach((e=>{e.addEventListener("click",(()=>{i.value=e.getAttribute("data-val"),t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t===e)))}))}))}));const i=e.querySelector(".is-modal-close");i&&i.addEventListener("click",(()=>t.builder.util.hideModal(e)))}(this);const l=document.querySelectorAll(".input-setcolor");l.forEach((t=>{t.addEventListener("click",(e=>{const i=t.getAttribute("data-index"),n=this.builder.themes[i];this.builder.setUIColor(n[1],n[2]),this.builder.themeIndex=i,l.forEach((e=>e.classList.toggle("on",e===t))),e.preventDefault(),e.stopImmediatePropagation()}))}))}view(){const t=new He(this.builder);let e=this.config;t.showModal(e,!1,null,!1),this.builder.opts.rowcolOutline?e.querySelector(".input-hiderowcoloutline").checked=!1:e.querySelector(".input-hiderowcoloutline").checked=!0,this.builder.opts.columnTool?e.querySelector(".input-hidecelltool").checked=!1:e.querySelector(".input-hidecelltool").checked=!0,this.builder.opts.snippetAddTool?e.querySelector(".input-hidesnippetaddtool").checked=!1:e.querySelector(".input-hidesnippetaddtool").checked=!0,this.builder.opts.elementTool?e.querySelector(".input-hideelementtool").checked=!1:e.querySelector(".input-hideelementtool").checked=!0,this.builder.opts.elementHighlight?e.querySelector(".input-hideelementhighlight").checked=!1:e.querySelector(".input-hideelementhighlight").checked=!0,this.builder.opts.snippetOpen?e.querySelector(".input-opensnippets").checked=!0:e.querySelector(".input-opensnippets").checked=!1,this.config.querySelector(".select-buildermode").value=this.builder.opts.builderMode,this.config.querySelector(".select-rowtool").value=this.builder.opts.rowTool,this.config.querySelector(".select-outlinemode").value=this.builder.opts.outlineMode,this.config.querySelector(".select-outlinestyle").value=this.builder.opts.outlineStyle,this.config.querySelector(".select-toolstyle").value=this.builder.opts.toolStyle,this.config.querySelector(".select-pasteresult").value=this.builder.opts.paste,this.config.querySelector(".select-editingtoolbardisplay").value=this.builder.opts.toolbarDisplay,this.config.querySelector(".select-editingtoolbar").value=this.builder.opts.toolbar,this.config.querySelector(".select-snippetssidebardisplay").value=this.builder.opts.snippetsSidebarDisplay,this.builder.opts.shortenHTML?this.config.querySelector(".select-htmlview").value="shorten":this.config.querySelector(".select-htmlview").value="actual",function(t){const e=t.config;if(!e)return;e.querySelectorAll(".cb-seg[data-seg-for]").forEach((t=>{const i=e.querySelector("."+t.getAttribute("data-seg-for"));i&&t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===i.value)))}));const i=String(t.builder.themeIndex);e.querySelectorAll(".input-setcolor").forEach((t=>t.classList.toggle("on",t.getAttribute("data-index")===i)))}(this)}update(){let t=this.config.querySelector(".input-hiderowcoloutline").checked;t?(this.builder.opts.rowcolOutline=!1,localStorage.setItem("_hiderowcoloutline","1")):(this.builder.opts.rowcolOutline=!0,localStorage.setItem("_hiderowcoloutline","0")),this.setOutline(t),this.config.querySelector(".input-hidecelltool").checked?(this.builder.opts.columnTool=!1,localStorage.setItem("_hidecelltool","1"),this.setColumnTool(!0)):(this.builder.opts.columnTool=!0,localStorage.setItem("_hidecelltool","0"),this.setColumnTool(!1)),this.config.querySelector(".input-hidesnippetaddtool").checked?(this.builder.opts.snippetAddTool=!1,localStorage.setItem("_hidesnippetaddtool","1"),this.setSnippetAddTool(!0)):(this.builder.opts.snippetAddTool=!0,localStorage.setItem("_hidesnippetaddtool","0"),this.setSnippetAddTool(!1)),this.config.querySelector(".input-hideelementtool").checked?(this.builder.opts.elementTool=!1,localStorage.setItem("_hideelementtool","1"),this.setElementTool(!0)):(this.builder.opts.elementTool=!0,localStorage.setItem("_hideelementtool","0"),this.setElementTool(!1)),this.config.querySelector(".input-hideelementhighlight").checked?(this.builder.opts.elementHighlight=!1,localStorage.setItem("_hideelementhighlight","1"),this.setElementHighlight(!0)):(this.builder.opts.elementHighlight=!0,localStorage.setItem("_hideelementhighlight","0"),this.setElementHighlight(!1)),this.config.querySelector(".input-opensnippets").checked?(this.builder.opts.snippetOpen=!0,localStorage.setItem("_opensnippets","1")):(this.builder.opts.snippetOpen=!1,localStorage.setItem("_opensnippets","0"));let e=this.config.querySelector(".select-buildermode").value;this.builder.opts.builderMode=e,localStorage.setItem("_buildermode",e),this.setBuilderMode(e);let i=this.config.querySelector(".select-rowtool").value;this.builder.opts.rowTool=i,localStorage.setItem("_rowtool",i),this.setRowToolPosition(i);let n=this.config.querySelector(".select-outlinemode").value;this.builder.opts.outlineMode=n,localStorage.setItem("_outlinemode",n),this.setOutlineMode(n);let o=this.config.querySelector(".select-outlinestyle").value;this.builder.opts.outlineStyle=o,localStorage.setItem("_outlinestyle",o),this.setOutlineStyle(o);let s=this.config.querySelector(".select-toolstyle").value;this.builder.opts.toolStyle=s,localStorage.setItem("_toolstyle",s),this.setToolStyle(s);let l=this.config.querySelector(".select-pasteresult").value;this.builder.opts.paste=l,localStorage.setItem("_pasteresult",l);let a=this.config.querySelector(".select-editingtoolbardisplay").value;this.builder.opts.toolbarDisplay=a,localStorage.setItem("_editingtoolbardisplay",a);let r=this.config.querySelector(".select-snippetssidebardisplay").value;this.builder.opts.snippetsSidebarDisplay=r,localStorage.setItem("_snippetssidebardisplay",r);let c=this.config.querySelector(".select-editingtoolbar").value;this.builder.opts.toolbar=c,localStorage.setItem("_editingtoolbar",c),this.setToolbar(c);let u=this.config.querySelector(".select-htmlview").value;if(this.builder.opts.shortenHTML="shorten"===u,localStorage.setItem("_htmlview",u),this.builder.themes){const t=this.builder.themeIndex;this.builder.themeIndex&&localStorage.setItem("_theme",t)}let d=this.builder.builderStuff.querySelectorAll(".is-rte-pop");Array.prototype.forEach.call(d,(t=>{t.style.display=""}))}setToolbar(t){const e=this.dom,i=this.builder.builderStuff,n=this.builder.contentStuff;"topfull"===t?(i.setAttribute("toolbarfull",""),i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),this.builder.iframe&&(n.removeAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"top"===t?(i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.removeAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"left"===t?(i.setAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.setAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"right"===t&&(i.setAttribute("toolbarright",""),i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.setAttribute("toolbarright",""),n.removeAttribute("toolbarleft","")));const o=i.querySelector(".is-rte-tool"),s=i.querySelector(".rte-more-options"),l=i.querySelector(".elementrte-more-options");o&&this.builder.rte.positionToolbar(),s&&(e.removeClass(s,"active"),e.addClass(s,"deactive"),e.removeClass(l,"active"),e.addClass(l,"deactive"))}setEmailMode(){if(this.builder.builderStuff.setAttribute("emailmode",""),this.builder.iframe){this.builder.contentStuff.setAttribute("emailmode","")}}setElementTool(t){const e=this.builder.builderStuff;if(t?e.setAttribute("hideelementtool",""):e.removeAttribute("hideelementtool",""),this.builder.iframe){const e=this.builder.contentStuff;t?e.setAttribute("hideelementtool",""):e.removeAttribute("hideelementtool","")}}setElementHighlight(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hideelementhighlight",""):e.removeAttribute("hideelementhighlight","")}))}setOutlineStyle(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"grayoutline"===t?e.setAttribute("grayoutline",""):e.removeAttribute("grayoutline")}))}setColumnTool(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);t?Array.prototype.forEach.call(e,(t=>{t.setAttribute("hidecolumntool","")})):Array.prototype.forEach.call(e,(t=>{t.removeAttribute("hidecolumntool")}))}setSnippetAddTool(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hidesnippetaddtool",""):e.removeAttribute("hidesnippetaddtool","")}))}setToolStyle(t){const e=this.builder.builderStuff;if("gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray",""),this.builder.iframe){const e=this.builder.contentStuff;"gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray","")}const i=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(i,(e=>{"gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray")}))}setOutlineMode(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"row"===t?e.setAttribute("rowoutline",""):e.removeAttribute("rowoutline")}))}setOutline(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hideoutline",""):e.removeAttribute("hideoutline")}))}setRowToolPosition(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"right"===t?e.removeAttribute("leftrowtool"):e.setAttribute("leftrowtool","")}))}setBuilderMode(t){const e=this.builder.builderStuff;if(""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal")),this.builder.iframe){const e=this.builder.contentStuff;""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal"))}const i=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(i,(e=>{""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal"))}))}initBuilder(t){const e=this.builder.opts.builderMode;""===e?(t.removeAttribute("minimal"),t.removeAttribute("clean")):"minimal"===e?(t.setAttribute("minimal",""),t.removeAttribute("clean")):"clean"===e&&(t.setAttribute("clean",""),t.removeAttribute("minimal"));"right"===this.builder.opts.rowTool?t.removeAttribute("leftrowtool"):t.setAttribute("leftrowtool","");!this.builder.opts.rowcolOutline?t.setAttribute("hideoutline",""):t.removeAttribute("hideoutline");"row"===this.builder.opts.outlineMode?t.setAttribute("rowoutline",""):t.removeAttribute("rowoutline");"gray"===this.builder.opts.toolStyle?t.setAttribute("gray",""):t.removeAttribute("gray");!this.builder.opts.snippetAddTool?t.setAttribute("hidesnippetaddtool",""):t.removeAttribute("hidesnippetaddtool","");"grayoutline"===this.builder.opts.outlineStyle?t.setAttribute("grayoutline",""):t.removeAttribute("grayoutline");!this.builder.opts.elementHighlight?t.setAttribute("hideelementhighlight",""):t.removeAttribute("hideelementhighlight","")}}
28
+ */(e)}},!1));const p=document.querySelector(".is-design-list");let g=e.opts.snippetPath,m=e.opts.snippetJSON.snippets,f=e.opts.slider;if(null!=f)if("slick"===f){const t=t=>"glide"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else if("glide"===f){const t=t=>"slick"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else if("all"===f);else{const t=t=>"glide"!==t.type&&"slick"!==t.type;m=m.filter(t),e.opts.snippetJSON.snippets=m}else{var y=!0;if(e.win.jQuery&&e.win.jQuery.fn.slick&&(y=!1),y){const t=m.filter((t=>"slick"!==t.type));m=[...t]}if(!e.win.Glide){const t=m.filter((t=>!(t.glide||"glide"===t.type)));m=[...t]}e.opts.snippetJSON.snippets=[...m]}if(!e.win.FormViewer){const t=m.filter((t=>!("form"===t.type)));m=[...t]}e.opts.snippetJSON.snippets=[...m];const v=(e.opts.emailMode?e.opts.defaultEmailSnippetCategory:e.opts.defaultSnippetCategory)+"";let w,x,k=1;if(e.opts.snippetJSON.snippets.forEach((e=>{e.id=k;const i=t(e,v)?"":" hide";s.appendHtml(p,'<div data-drag-id="'+(k-1)+'" class="snippet-item'+i+'" role="listitem" data-id="'+e.id+'" data-cat="'+e.category+'"><img alt="'+n.out("Snippet")+'" loading="lazy" src="'+g+e.thumbnail+'"><span class="is-overlay"></span></div>'),k++})),e.iframeDragDrop||new Bt(p,{group:{name:"shared",pull:"clone",put:!1},sort:!1,animation:150,onChoose:t=>{const i='\n <style id="css-scale">\n .sortable-ghost {\n height: 50px;\n }\n .sortable-ghost * {\n display: none\n }\n </style>\n ';if(x=t.item.offsetHeight,e.iframe){const t=e.contentStuff.querySelector("#css-scale");t&&t.parentNode.removeChild(t),e.contentStuff.insertAdjacentHTML("afterbegin",i)}else{const t=e.builderStuff.querySelector("#css-scale");t&&t.parentNode.removeChild(t),e.builderStuff.insertAdjacentHTML("afterbegin",i)}e.uo.saveForUndo(!0),e.sectionDropSetup(),e.util.clearPops(),e.hideElementTools()},onClone:t=>{var e=t.clone;let i=e.querySelector("img");i.style.opacity=1e-4,e.style.height=x+"px";let n=(new Date).getTime(),o=i.src.includes("?")?"&":"?";i.src=i.src+o+n,i.style.opacity=""},onMove:()=>{let t=e.doc.querySelector(".row-add-initial");if(t&&(t.style.display="none"),e.page&&".is-wrapper"===e.page){const t=e.doc.querySelector(e.page);t&&(t.style.marginLeft="")}},onSort:t=>{if(!e.canvas)return;let i=t.originalEvent.clientX,n=t.originalEvent.clientY;const o=e.doc.querySelector("[data-new-dummy]");if(o){const t=o.parentNode,e=t.getBoundingClientRect();o.offsetWidth;let s=(i-o.offsetWidth/2-e.left)/t.offsetWidth*100,l=(n-o.offsetHeight/2-e.top)/t.offsetHeight*100;l<0&&(l=15),o.style.top=l+"%",o.style.left=s+"%",o.removeAttribute("data-new-dummy")}},onStart:()=>{w=null;const t=e.doc.querySelector(".builder-active");t&&(w=t,s.removeClass(w,"builder-active"));let i=document.querySelector(".is-sidebar-overlay");i&&(i.style.display="none")},onEnd:()=>{let t=document.querySelector(".is-sidebar-overlay");t&&(t.style.display="block"),n.checkEmpty();let i=e.doc.querySelector(".row-add-initial");i&&(i.style.display=""),w&&s.addClass(w,"builder-active")},onUnchoose:()=>{setTimeout((()=>{if(e.sortableOnCanvas&&(e.sortableOnCanvas.forEach((t=>{t&&t.destroy()})),e.sortableOnCanvas=[]),e.sortableOnPage&&(e.sortableOnPage.destroy(),e.sortableOnPage=null),e.doc.querySelectorAll(".block-dummy").forEach((t=>t.parentNode.removeChild(t))),e.page&&".is-wrapper"===e.page){const t=e.doc.querySelector(e.page);t&&(t.style.marginLeft="")}}),10)}}),"#divSnippetList"===e.opts.snippetList){const t=d.querySelector("#divSnippetHandle");s.addEventListener(t,"click",(()=>{ks(e),n.clearActiveCell(),n.clearControls()}));const o=window.innerWidth;(e.opts.snippetOpen||i)&&o>=960&&(d.style.cssText="transition: all ease 0.8s;",setTimeout((function(){ks(e)}),100),setTimeout((function(){d.style.cssText=""}),1300))}};function ks(t){const e=t.dom;let i=document.querySelector("#divSnippetList");const n=i.querySelector("#divSnippetHandle");e.hasClass(i,"active")?(e.removeClass(i,"active"),"right"===t.opts.sidePanel?n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-left"></use></svg>':n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-right"></use></svg>',setTimeout((()=>{i.querySelector(".is-design-list").style.display="none"}),300)):(i.querySelector(".is-design-list").style.display="block",setTimeout((()=>{e.addClass(i,"active"),"right"===t.opts.sidePanel?n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-right"></use></svg>':n.innerHTML='<svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#ion-ios-arrow-left"></use></svg>'}),10))}function Ss(t,e){var i=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),i.push.apply(i,n)}return i}function _s(t){for(var e=1;e<arguments.length;e++){var i=null!=arguments[e]?arguments[e]:{};e%2?Ss(Object(i),!0).forEach((function(e){As(t,e,i[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(i)):Ss(Object(i)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(i,e))}))}return t}function Cs(t){return Cs="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},Cs(t)}function Es(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function As(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function Ls(t){return function(t){if(Array.isArray(t))return Ts(t)}(t)||function(t){if("undefined"!=typeof Symbol&&null!=t[Symbol.iterator]||null!=t["@@iterator"])return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return Ts(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);"Object"===i&&t.constructor&&(i=t.constructor.name);if("Map"===i||"Set"===i)return Array.from(t);if("Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i))return Ts(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function Ts(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,n=new Array(e);i<e;i++)n[i]=t[i];return n}var Ms="undefined"!=typeof window&&void 0!==window.document,qs=Ms?window:{},Rs=!(!Ms||!qs.document.documentElement)&&"ontouchstart"in qs.document.documentElement,Is=!!Ms&&"PointerEvent"in qs,Os="cropper",Ns="all",$s="crop",Ps="move",Ds="zoom",Bs="e",Hs="w",zs="s",Fs="n",Us="ne",js="nw",Ws="se",Vs="sw",Gs="".concat(Os,"-crop"),Ys="".concat(Os,"-disabled"),Xs="".concat(Os,"-hidden"),Ks="".concat(Os,"-hide"),Zs="".concat(Os,"-invisible"),Js="".concat(Os,"-modal"),Qs="".concat(Os,"-move"),tl="".concat(Os,"Action"),el="".concat(Os,"Preview"),il="crop",nl="move",ol="none",sl="crop",ll="cropend",al="cropmove",rl="cropstart",cl="dblclick",ul=Is?"pointerdown":Rs?"touchstart":"mousedown",dl=Is?"pointermove":Rs?"touchmove":"mousemove",hl=Is?"pointerup pointercancel":Rs?"touchend touchcancel":"mouseup",bl="ready",pl="resize",gl="wheel",ml="zoom",fl="image/jpeg",yl=/^e|w|s|n|se|sw|ne|nw|all|crop|move|zoom$/,vl=/^data:/,wl=/^data:image\/jpeg;base64,/,xl=/^img|canvas$/i,kl={viewMode:0,dragMode:il,initialAspectRatio:NaN,aspectRatio:NaN,data:null,preview:"",responsive:!0,restore:!0,checkCrossOrigin:!0,checkOrientation:!0,modal:!0,guides:!0,center:!0,highlight:!0,background:!0,autoCrop:!0,autoCropArea:.8,movable:!0,rotatable:!0,scalable:!0,zoomable:!0,zoomOnTouch:!0,zoomOnWheel:!0,wheelZoomRatio:.1,cropBoxMovable:!0,cropBoxResizable:!0,toggleDragModeOnDblclick:!0,minCanvasWidth:0,minCanvasHeight:0,minCropBoxWidth:0,minCropBoxHeight:0,minContainerWidth:200,minContainerHeight:100,ready:null,cropstart:null,cropmove:null,cropend:null,crop:null,zoom:null},Sl=Number.isNaN||qs.isNaN;function _l(t){return"number"==typeof t&&!Sl(t)}var Cl=function(t){return t>0&&t<1/0};function El(t){return void 0===t}function Al(t){return"object"===Cs(t)&&null!==t}var Ll=Object.prototype.hasOwnProperty;function Tl(t){if(!Al(t))return!1;try{var e=t.constructor,i=e.prototype;return e&&i&&Ll.call(i,"isPrototypeOf")}catch(t){return!1}}function Ml(t){return"function"==typeof t}var ql=Array.prototype.slice;function Rl(t){return Array.from?Array.from(t):ql.call(t)}function Il(t,e){return t&&Ml(e)&&(Array.isArray(t)||_l(t.length)?Rl(t).forEach((function(i,n){e.call(t,i,n,t)})):Al(t)&&Object.keys(t).forEach((function(i){e.call(t,t[i],i,t)}))),t}var Ol=Object.assign||function(t){for(var e=arguments.length,i=new Array(e>1?e-1:0),n=1;n<e;n++)i[n-1]=arguments[n];return Al(t)&&i.length>0&&i.forEach((function(e){Al(e)&&Object.keys(e).forEach((function(i){t[i]=e[i]}))})),t},Nl=/\.\d*(?:0|9){12}\d*$/;function $l(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:1e11;return Nl.test(t)?Math.round(t*e)/e:t}var Pl=/^width|height|left|top|marginLeft|marginTop$/;function Dl(t,e){var i=t.style;Il(e,(function(t,e){Pl.test(e)&&_l(t)&&(t="".concat(t,"px")),i[e]=t}))}function Bl(t,e){if(e)if(_l(t.length))Il(t,(function(t){Bl(t,e)}));else if(t.classList)t.classList.add(e);else{var i=t.className.trim();i?i.indexOf(e)<0&&(t.className="".concat(i," ").concat(e)):t.className=e}}function Hl(t,e){e&&(_l(t.length)?Il(t,(function(t){Hl(t,e)})):t.classList?t.classList.remove(e):t.className.indexOf(e)>=0&&(t.className=t.className.replace(e,"")))}function zl(t,e,i){e&&(_l(t.length)?Il(t,(function(t){zl(t,e,i)})):i?Bl(t,e):Hl(t,e))}var Fl=/([a-z\d])([A-Z])/g;function Ul(t){return t.replace(Fl,"$1-$2").toLowerCase()}function jl(t,e){return Al(t[e])?t[e]:t.dataset?t.dataset[e]:t.getAttribute("data-".concat(Ul(e)))}function Wl(t,e,i){Al(i)?t[e]=i:t.dataset?t.dataset[e]=i:t.setAttribute("data-".concat(Ul(e)),i)}var Vl=/\s\s*/,Gl=function(){var t=!1;if(Ms){var e=!1,i=function(){},n=Object.defineProperty({},"once",{get:function(){return t=!0,e},set:function(t){e=t}});qs.addEventListener("test",i,n),qs.removeEventListener("test",i,n)}return t}();function Yl(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=i;e.trim().split(Vl).forEach((function(e){if(!Gl){var s=t.listeners;s&&s[e]&&s[e][i]&&(o=s[e][i],delete s[e][i],0===Object.keys(s[e]).length&&delete s[e],0===Object.keys(s).length&&delete t.listeners)}t.removeEventListener(e,o,n)}))}function Xl(t,e,i){var n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{},o=i;e.trim().split(Vl).forEach((function(e){if(n.once&&!Gl){var s=t.listeners,l=void 0===s?{}:s;o=function(){delete l[e][i],t.removeEventListener(e,o,n);for(var s=arguments.length,a=new Array(s),r=0;r<s;r++)a[r]=arguments[r];i.apply(t,a)},l[e]||(l[e]={}),l[e][i]&&t.removeEventListener(e,l[e][i],n),l[e][i]=o,t.listeners=l}t.addEventListener(e,o,n)}))}function Kl(t,e,i){var n;return Ml(Event)&&Ml(CustomEvent)?n=new CustomEvent(e,{detail:i,bubbles:!0,cancelable:!0}):(n=document.createEvent("CustomEvent")).initCustomEvent(e,!0,!0,i),t.dispatchEvent(n)}function Zl(t){var e=t.getBoundingClientRect();return{left:e.left+(window.pageXOffset-document.documentElement.clientLeft),top:e.top+(window.pageYOffset-document.documentElement.clientTop)}}var Jl=qs.location,Ql=/^(\w+:)\/\/([^:/?#]*):?(\d*)/i;function ta(t){var e=t.match(Ql);return null!==e&&(e[1]!==Jl.protocol||e[2]!==Jl.hostname||e[3]!==Jl.port)}function ea(t){var e="timestamp=".concat((new Date).getTime());return t+(-1===t.indexOf("?")?"?":"&")+e}function ia(t){var e=t.rotate,i=t.scaleX,n=t.scaleY,o=t.translateX,s=t.translateY,l=[];_l(o)&&0!==o&&l.push("translateX(".concat(o,"px)")),_l(s)&&0!==s&&l.push("translateY(".concat(s,"px)")),_l(e)&&0!==e&&l.push("rotate(".concat(e,"deg)")),_l(i)&&1!==i&&l.push("scaleX(".concat(i,")")),_l(n)&&1!==n&&l.push("scaleY(".concat(n,")"));var a=l.length?l.join(" "):"none";return{WebkitTransform:a,msTransform:a,transform:a}}function na(t,e){var i=t.pageX,n=t.pageY,o={endX:i,endY:n};return e?o:_s({startX:i,startY:n},o)}function oa(t){var e=t.aspectRatio,i=t.height,n=t.width,o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:"contain",s=Cl(n),l=Cl(i);if(s&&l){var a=i*e;"contain"===o&&a>n||"cover"===o&&a<n?i=n/e:n=i*e}else s?i=n/e:l&&(n=i*e);return{width:n,height:i}}var sa=String.fromCharCode;var la=/^data:.*,/;function aa(t){var e,i=new DataView(t);try{var n,o,s;if(255===i.getUint8(0)&&216===i.getUint8(1))for(var l=i.byteLength,a=2;a+1<l;){if(255===i.getUint8(a)&&225===i.getUint8(a+1)){o=a;break}a+=1}if(o){var r=o+10;if("Exif"===function(t,e,i){var n="";i+=e;for(var o=e;o<i;o+=1)n+=sa(t.getUint8(o));return n}(i,o+4,4)){var c=i.getUint16(r);if(((n=18761===c)||19789===c)&&42===i.getUint16(r+2,n)){var u=i.getUint32(r+4,n);u>=8&&(s=r+u)}}}if(s){var d,h,b=i.getUint16(s,n);for(h=0;h<b;h+=1)if(d=s+12*h+2,274===i.getUint16(d,n)){d+=8,e=i.getUint16(d,n),i.setUint16(d,1,n);break}}}catch(t){e=1}return e}var ra={render:function(){this.initContainer(),this.initCanvas(),this.initCropBox(),this.renderCanvas(),this.cropped&&this.renderCropBox()},initContainer:function(){var t=this.element,e=this.options,i=this.container,n=this.cropper,o=Number(e.minContainerWidth),s=Number(e.minContainerHeight);Bl(n,Xs),Hl(t,Xs);var l={width:Math.max(i.offsetWidth,o>=0?o:200),height:Math.max(i.offsetHeight,s>=0?s:100)};this.containerData=l,Dl(n,{width:l.width,height:l.height}),Bl(t,Xs),Hl(n,Xs)},initCanvas:function(){var t=this.containerData,e=this.imageData,i=this.options.viewMode,n=Math.abs(e.rotate)%180==90,o=n?e.naturalHeight:e.naturalWidth,s=n?e.naturalWidth:e.naturalHeight,l=o/s,a=t.width,r=t.height;t.height*l>t.width?3===i?a=t.height*l:r=t.width/l:3===i?r=t.width/l:a=t.height*l;var c={aspectRatio:l,naturalWidth:o,naturalHeight:s,width:a,height:r};this.canvasData=c,this.limited=1===i||2===i,this.limitCanvas(!0,!0),c.width=Math.min(Math.max(c.width,c.minWidth),c.maxWidth),c.height=Math.min(Math.max(c.height,c.minHeight),c.maxHeight),c.left=(t.width-c.width)/2,c.top=(t.height-c.height)/2,c.oldLeft=c.left,c.oldTop=c.top,this.initialCanvasData=Ol({},c)},limitCanvas:function(t,e){var i=this.options,n=this.containerData,o=this.canvasData,s=this.cropBoxData,l=i.viewMode,a=o.aspectRatio,r=this.cropped&&s;if(t){var c=Number(i.minCanvasWidth)||0,u=Number(i.minCanvasHeight)||0;l>1?(c=Math.max(c,n.width),u=Math.max(u,n.height),3===l&&(u*a>c?c=u*a:u=c/a)):l>0&&(c?c=Math.max(c,r?s.width:0):u?u=Math.max(u,r?s.height:0):r&&(c=s.width,(u=s.height)*a>c?c=u*a:u=c/a));var d=oa({aspectRatio:a,width:c,height:u});c=d.width,u=d.height,o.minWidth=c,o.minHeight=u,o.maxWidth=1/0,o.maxHeight=1/0}if(e)if(l>(r?0:1)){var h=n.width-o.width,b=n.height-o.height;o.minLeft=Math.min(0,h),o.minTop=Math.min(0,b),o.maxLeft=Math.max(0,h),o.maxTop=Math.max(0,b),r&&this.limited&&(o.minLeft=Math.min(s.left,s.left+(s.width-o.width)),o.minTop=Math.min(s.top,s.top+(s.height-o.height)),o.maxLeft=s.left,o.maxTop=s.top,2===l&&(o.width>=n.width&&(o.minLeft=Math.min(0,h),o.maxLeft=Math.max(0,h)),o.height>=n.height&&(o.minTop=Math.min(0,b),o.maxTop=Math.max(0,b))))}else o.minLeft=-o.width,o.minTop=-o.height,o.maxLeft=n.width,o.maxTop=n.height},renderCanvas:function(t,e){var i=this.canvasData,n=this.imageData;if(e){var o=function(t){var e=t.width,i=t.height,n=t.degree;if(90==(n=Math.abs(n)%180))return{width:i,height:e};var o=n%90*Math.PI/180,s=Math.sin(o),l=Math.cos(o),a=e*l+i*s,r=e*s+i*l;return n>90?{width:r,height:a}:{width:a,height:r}}({width:n.naturalWidth*Math.abs(n.scaleX||1),height:n.naturalHeight*Math.abs(n.scaleY||1),degree:n.rotate||0}),s=o.width,l=o.height,a=i.width*(s/i.naturalWidth),r=i.height*(l/i.naturalHeight);i.left-=(a-i.width)/2,i.top-=(r-i.height)/2,i.width=a,i.height=r,i.aspectRatio=s/l,i.naturalWidth=s,i.naturalHeight=l,this.limitCanvas(!0,!1)}(i.width>i.maxWidth||i.width<i.minWidth)&&(i.left=i.oldLeft),(i.height>i.maxHeight||i.height<i.minHeight)&&(i.top=i.oldTop),i.width=Math.min(Math.max(i.width,i.minWidth),i.maxWidth),i.height=Math.min(Math.max(i.height,i.minHeight),i.maxHeight),this.limitCanvas(!1,!0),i.left=Math.min(Math.max(i.left,i.minLeft),i.maxLeft),i.top=Math.min(Math.max(i.top,i.minTop),i.maxTop),i.oldLeft=i.left,i.oldTop=i.top,Dl(this.canvas,Ol({width:i.width,height:i.height},ia({translateX:i.left,translateY:i.top}))),this.renderImage(t),this.cropped&&this.limited&&this.limitCropBox(!0,!0)},renderImage:function(t){var e=this.canvasData,i=this.imageData,n=i.naturalWidth*(e.width/e.naturalWidth),o=i.naturalHeight*(e.height/e.naturalHeight);Ol(i,{width:n,height:o,left:(e.width-n)/2,top:(e.height-o)/2}),Dl(this.image,Ol({width:i.width,height:i.height},ia(Ol({translateX:i.left,translateY:i.top},i)))),t&&this.output()},initCropBox:function(){var t=this.options,e=this.canvasData,i=t.aspectRatio||t.initialAspectRatio,n=Number(t.autoCropArea)||.8,o={width:e.width,height:e.height};i&&(e.height*i>e.width?o.height=o.width/i:o.width=o.height*i),this.cropBoxData=o,this.limitCropBox(!0,!0),o.width=Math.min(Math.max(o.width,o.minWidth),o.maxWidth),o.height=Math.min(Math.max(o.height,o.minHeight),o.maxHeight),o.width=Math.max(o.minWidth,o.width*n),o.height=Math.max(o.minHeight,o.height*n),o.left=e.left+(e.width-o.width)/2,o.top=e.top+(e.height-o.height)/2,o.oldLeft=o.left,o.oldTop=o.top,this.initialCropBoxData=Ol({},o)},limitCropBox:function(t,e){var i=this.options,n=this.containerData,o=this.canvasData,s=this.cropBoxData,l=this.limited,a=i.aspectRatio;if(t){var r=Number(i.minCropBoxWidth)||0,c=Number(i.minCropBoxHeight)||0,u=l?Math.min(n.width,o.width,o.width+o.left,n.width-o.left):n.width,d=l?Math.min(n.height,o.height,o.height+o.top,n.height-o.top):n.height;r=Math.min(r,n.width),c=Math.min(c,n.height),a&&(r&&c?c*a>r?c=r/a:r=c*a:r?c=r/a:c&&(r=c*a),d*a>u?d=u/a:u=d*a),s.minWidth=Math.min(r,u),s.minHeight=Math.min(c,d),s.maxWidth=u,s.maxHeight=d}e&&(l?(s.minLeft=Math.max(0,o.left),s.minTop=Math.max(0,o.top),s.maxLeft=Math.min(n.width,o.left+o.width)-s.width,s.maxTop=Math.min(n.height,o.top+o.height)-s.height):(s.minLeft=0,s.minTop=0,s.maxLeft=n.width-s.width,s.maxTop=n.height-s.height))},renderCropBox:function(){var t=this.options,e=this.containerData,i=this.cropBoxData;(i.width>i.maxWidth||i.width<i.minWidth)&&(i.left=i.oldLeft),(i.height>i.maxHeight||i.height<i.minHeight)&&(i.top=i.oldTop),i.width=Math.min(Math.max(i.width,i.minWidth),i.maxWidth),i.height=Math.min(Math.max(i.height,i.minHeight),i.maxHeight),this.limitCropBox(!1,!0),i.left=Math.min(Math.max(i.left,i.minLeft),i.maxLeft),i.top=Math.min(Math.max(i.top,i.minTop),i.maxTop),i.oldLeft=i.left,i.oldTop=i.top,t.movable&&t.cropBoxMovable&&Wl(this.face,tl,i.width>=e.width&&i.height>=e.height?Ps:Ns),Dl(this.cropBox,Ol({width:i.width,height:i.height},ia({translateX:i.left,translateY:i.top}))),this.cropped&&this.limited&&this.limitCanvas(!0,!0),this.disabled||this.output()},output:function(){this.preview(),Kl(this.element,sl,this.getData())}},ca={initPreview:function(){var t=this.element,e=this.crossOrigin,i=this.options.preview,n=e?this.crossOriginUrl:this.url,o=t.alt||"The image to preview",s=document.createElement("img");if(e&&(s.crossOrigin=e),s.src=n,s.alt=o,this.viewBox.appendChild(s),this.viewBoxImage=s,i){var l=i;"string"==typeof i?l=t.ownerDocument.querySelectorAll(i):i.querySelector&&(l=[i]),this.previews=l,Il(l,(function(t){var i=document.createElement("img");Wl(t,el,{width:t.offsetWidth,height:t.offsetHeight,html:t.innerHTML}),e&&(i.crossOrigin=e),i.src=n,i.alt=o,i.style.cssText='display:block;width:100%;height:auto;min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;image-orientation:0deg!important;"',t.innerHTML="",t.appendChild(i)}))}},resetPreview:function(){Il(this.previews,(function(t){var e=jl(t,el);Dl(t,{width:e.width,height:e.height}),t.innerHTML=e.html,function(t,e){if(Al(t[e]))try{delete t[e]}catch(i){t[e]=void 0}else if(t.dataset)try{delete t.dataset[e]}catch(i){t.dataset[e]=void 0}else t.removeAttribute("data-".concat(Ul(e)))}(t,el)}))},preview:function(){var t=this.imageData,e=this.canvasData,i=this.cropBoxData,n=i.width,o=i.height,s=t.width,l=t.height,a=i.left-e.left-t.left,r=i.top-e.top-t.top;this.cropped&&!this.disabled&&(Dl(this.viewBoxImage,Ol({width:s,height:l},ia(Ol({translateX:-a,translateY:-r},t)))),Il(this.previews,(function(e){var i=jl(e,el),c=i.width,u=i.height,d=c,h=u,b=1;n&&(h=o*(b=c/n)),o&&h>u&&(d=n*(b=u/o),h=u),Dl(e,{width:d,height:h}),Dl(e.getElementsByTagName("img")[0],Ol({width:s*b,height:l*b},ia(Ol({translateX:-a*b,translateY:-r*b},t))))})))}},ua={bind:function(){var t=this.element,e=this.options,i=this.cropper;Ml(e.cropstart)&&Xl(t,rl,e.cropstart),Ml(e.cropmove)&&Xl(t,al,e.cropmove),Ml(e.cropend)&&Xl(t,ll,e.cropend),Ml(e.crop)&&Xl(t,sl,e.crop),Ml(e.zoom)&&Xl(t,ml,e.zoom),Xl(i,ul,this.onCropStart=this.cropStart.bind(this)),e.zoomable&&e.zoomOnWheel&&Xl(i,gl,this.onWheel=this.wheel.bind(this),{passive:!1,capture:!0}),e.toggleDragModeOnDblclick&&Xl(i,cl,this.onDblclick=this.dblclick.bind(this)),Xl(t.ownerDocument,dl,this.onCropMove=this.cropMove.bind(this)),Xl(t.ownerDocument,hl,this.onCropEnd=this.cropEnd.bind(this)),e.responsive&&Xl(window,pl,this.onResize=this.resize.bind(this))},unbind:function(){var t=this.element,e=this.options,i=this.cropper;Ml(e.cropstart)&&Yl(t,rl,e.cropstart),Ml(e.cropmove)&&Yl(t,al,e.cropmove),Ml(e.cropend)&&Yl(t,ll,e.cropend),Ml(e.crop)&&Yl(t,sl,e.crop),Ml(e.zoom)&&Yl(t,ml,e.zoom),Yl(i,ul,this.onCropStart),e.zoomable&&e.zoomOnWheel&&Yl(i,gl,this.onWheel,{passive:!1,capture:!0}),e.toggleDragModeOnDblclick&&Yl(i,cl,this.onDblclick),Yl(t.ownerDocument,dl,this.onCropMove),Yl(t.ownerDocument,hl,this.onCropEnd),e.responsive&&Yl(window,pl,this.onResize)}},da={resize:function(){if(!this.disabled){var t,e,i=this.options,n=this.container,o=this.containerData,s=n.offsetWidth/o.width,l=n.offsetHeight/o.height,a=Math.abs(s-1)>Math.abs(l-1)?s:l;if(1!==a)i.restore&&(t=this.getCanvasData(),e=this.getCropBoxData()),this.render(),i.restore&&(this.setCanvasData(Il(t,(function(e,i){t[i]=e*a}))),this.setCropBoxData(Il(e,(function(t,i){e[i]=t*a}))))}},dblclick:function(){var t,e;this.disabled||this.options.dragMode===ol||this.setDragMode((t=this.dragBox,e=Gs,(t.classList?t.classList.contains(e):t.className.indexOf(e)>-1)?nl:il))},wheel:function(t){var e=this,i=Number(this.options.wheelZoomRatio)||.1,n=1;this.disabled||(t.preventDefault(),this.wheeling||(this.wheeling=!0,setTimeout((function(){e.wheeling=!1}),50),t.deltaY?n=t.deltaY>0?1:-1:t.wheelDelta?n=-t.wheelDelta/120:t.detail&&(n=t.detail>0?1:-1),this.zoom(-n*i,t)))},cropStart:function(t){var e=t.buttons,i=t.button;if(!(this.disabled||("mousedown"===t.type||"pointerdown"===t.type&&"mouse"===t.pointerType)&&(_l(e)&&1!==e||_l(i)&&0!==i||t.ctrlKey))){var n,o=this.options,s=this.pointers;t.changedTouches?Il(t.changedTouches,(function(t){s[t.identifier]=na(t)})):s[t.pointerId||0]=na(t),n=Object.keys(s).length>1&&o.zoomable&&o.zoomOnTouch?Ds:jl(t.target,tl),yl.test(n)&&!1!==Kl(this.element,rl,{originalEvent:t,action:n})&&(t.preventDefault(),this.action=n,this.cropping=!1,n===$s&&(this.cropping=!0,Bl(this.dragBox,Js)))}},cropMove:function(t){var e=this.action;if(!this.disabled&&e){var i=this.pointers;t.preventDefault(),!1!==Kl(this.element,al,{originalEvent:t,action:e})&&(t.changedTouches?Il(t.changedTouches,(function(t){Ol(i[t.identifier]||{},na(t,!0))})):Ol(i[t.pointerId||0]||{},na(t,!0)),this.change(t))}},cropEnd:function(t){if(!this.disabled){var e=this.action,i=this.pointers;t.changedTouches?Il(t.changedTouches,(function(t){delete i[t.identifier]})):delete i[t.pointerId||0],e&&(t.preventDefault(),Object.keys(i).length||(this.action=""),this.cropping&&(this.cropping=!1,zl(this.dragBox,Js,this.cropped&&this.options.modal)),Kl(this.element,ll,{originalEvent:t,action:e}))}}},ha={change:function(t){var e,i=this.options,n=this.canvasData,o=this.containerData,s=this.cropBoxData,l=this.pointers,a=this.action,r=i.aspectRatio,c=s.left,u=s.top,d=s.width,h=s.height,b=c+d,p=u+h,g=0,m=0,f=o.width,y=o.height,v=!0;!r&&t.shiftKey&&(r=d&&h?d/h:1),this.limited&&(g=s.minLeft,m=s.minTop,f=g+Math.min(o.width,n.width,n.left+n.width),y=m+Math.min(o.height,n.height,n.top+n.height));var w=l[Object.keys(l)[0]],x={x:w.endX-w.startX,y:w.endY-w.startY},k=function(t){switch(t){case Bs:b+x.x>f&&(x.x=f-b);break;case Hs:c+x.x<g&&(x.x=g-c);break;case Fs:u+x.y<m&&(x.y=m-u);break;case zs:p+x.y>y&&(x.y=y-p)}};switch(a){case Ns:c+=x.x,u+=x.y;break;case Bs:if(x.x>=0&&(b>=f||r&&(u<=m||p>=y))){v=!1;break}k(Bs),(d+=x.x)<0&&(a=Hs,c-=d=-d),r&&(h=d/r,u+=(s.height-h)/2);break;case Fs:if(x.y<=0&&(u<=m||r&&(c<=g||b>=f))){v=!1;break}k(Fs),h-=x.y,u+=x.y,h<0&&(a=zs,u-=h=-h),r&&(d=h*r,c+=(s.width-d)/2);break;case Hs:if(x.x<=0&&(c<=g||r&&(u<=m||p>=y))){v=!1;break}k(Hs),d-=x.x,c+=x.x,d<0&&(a=Bs,c-=d=-d),r&&(h=d/r,u+=(s.height-h)/2);break;case zs:if(x.y>=0&&(p>=y||r&&(c<=g||b>=f))){v=!1;break}k(zs),(h+=x.y)<0&&(a=Fs,u-=h=-h),r&&(d=h*r,c+=(s.width-d)/2);break;case Us:if(r){if(x.y<=0&&(u<=m||b>=f)){v=!1;break}k(Fs),h-=x.y,u+=x.y,d=h*r}else k(Fs),k(Bs),x.x>=0?b<f?d+=x.x:x.y<=0&&u<=m&&(v=!1):d+=x.x,x.y<=0?u>m&&(h-=x.y,u+=x.y):(h-=x.y,u+=x.y);d<0&&h<0?(a=Vs,u-=h=-h,c-=d=-d):d<0?(a=js,c-=d=-d):h<0&&(a=Ws,u-=h=-h);break;case js:if(r){if(x.y<=0&&(u<=m||c<=g)){v=!1;break}k(Fs),h-=x.y,u+=x.y,d=h*r,c+=s.width-d}else k(Fs),k(Hs),x.x<=0?c>g?(d-=x.x,c+=x.x):x.y<=0&&u<=m&&(v=!1):(d-=x.x,c+=x.x),x.y<=0?u>m&&(h-=x.y,u+=x.y):(h-=x.y,u+=x.y);d<0&&h<0?(a=Ws,u-=h=-h,c-=d=-d):d<0?(a=Us,c-=d=-d):h<0&&(a=Vs,u-=h=-h);break;case Vs:if(r){if(x.x<=0&&(c<=g||p>=y)){v=!1;break}k(Hs),d-=x.x,c+=x.x,h=d/r}else k(zs),k(Hs),x.x<=0?c>g?(d-=x.x,c+=x.x):x.y>=0&&p>=y&&(v=!1):(d-=x.x,c+=x.x),x.y>=0?p<y&&(h+=x.y):h+=x.y;d<0&&h<0?(a=Us,u-=h=-h,c-=d=-d):d<0?(a=Ws,c-=d=-d):h<0&&(a=js,u-=h=-h);break;case Ws:if(r){if(x.x>=0&&(b>=f||p>=y)){v=!1;break}k(Bs),h=(d+=x.x)/r}else k(zs),k(Bs),x.x>=0?b<f?d+=x.x:x.y>=0&&p>=y&&(v=!1):d+=x.x,x.y>=0?p<y&&(h+=x.y):h+=x.y;d<0&&h<0?(a=js,u-=h=-h,c-=d=-d):d<0?(a=Vs,c-=d=-d):h<0&&(a=Us,u-=h=-h);break;case Ps:this.move(x.x,x.y),v=!1;break;case Ds:this.zoom(function(t){var e=_s({},t),i=0;return Il(t,(function(t,n){delete e[n],Il(e,(function(e){var n=Math.abs(t.startX-e.startX),o=Math.abs(t.startY-e.startY),s=Math.abs(t.endX-e.endX),l=Math.abs(t.endY-e.endY),a=Math.sqrt(n*n+o*o),r=(Math.sqrt(s*s+l*l)-a)/a;Math.abs(r)>Math.abs(i)&&(i=r)}))})),i}(l),t),v=!1;break;case $s:if(!x.x||!x.y){v=!1;break}e=Zl(this.cropper),c=w.startX-e.left,u=w.startY-e.top,d=s.minWidth,h=s.minHeight,x.x>0?a=x.y>0?Ws:Us:x.x<0&&(c-=d,a=x.y>0?Vs:js),x.y<0&&(u-=h),this.cropped||(Hl(this.cropBox,Xs),this.cropped=!0,this.limited&&this.limitCropBox(!0,!0))}v&&(s.width=d,s.height=h,s.left=c,s.top=u,this.action=a,this.renderCropBox()),Il(l,(function(t){t.startX=t.endX,t.startY=t.endY}))}},ba={crop:function(){return!this.ready||this.cropped||this.disabled||(this.cropped=!0,this.limitCropBox(!0,!0),this.options.modal&&Bl(this.dragBox,Js),Hl(this.cropBox,Xs),this.setCropBoxData(this.initialCropBoxData)),this},reset:function(){return this.ready&&!this.disabled&&(this.imageData=Ol({},this.initialImageData),this.canvasData=Ol({},this.initialCanvasData),this.cropBoxData=Ol({},this.initialCropBoxData),this.renderCanvas(),this.cropped&&this.renderCropBox()),this},clear:function(){return this.cropped&&!this.disabled&&(Ol(this.cropBoxData,{left:0,top:0,width:0,height:0}),this.cropped=!1,this.renderCropBox(),this.limitCanvas(!0,!0),this.renderCanvas(),Hl(this.dragBox,Js),Bl(this.cropBox,Xs)),this},replace:function(t){var e=arguments.length>1&&void 0!==arguments[1]&&arguments[1];return!this.disabled&&t&&(this.isImg&&(this.element.src=t),e?(this.url=t,this.image.src=t,this.ready&&(this.viewBoxImage.src=t,Il(this.previews,(function(e){e.getElementsByTagName("img")[0].src=t})))):(this.isImg&&(this.replaced=!0),this.options.data=null,this.uncreate(),this.load(t))),this},enable:function(){return this.ready&&this.disabled&&(this.disabled=!1,Hl(this.cropper,Ys)),this},disable:function(){return this.ready&&!this.disabled&&(this.disabled=!0,Bl(this.cropper,Ys)),this},destroy:function(){var t=this.element;return t[Os]?(t[Os]=void 0,this.isImg&&this.replaced&&(t.src=this.originalUrl),this.uncreate(),this):this},move:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.canvasData,n=i.left,o=i.top;return this.moveTo(El(t)?t:n+Number(t),El(e)?e:o+Number(e))},moveTo:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.canvasData,n=!1;return t=Number(t),e=Number(e),this.ready&&!this.disabled&&this.options.movable&&(_l(t)&&(i.left=t,n=!0),_l(e)&&(i.top=e,n=!0),n&&this.renderCanvas(!0)),this},zoom:function(t,e){var i=this.canvasData;return t=(t=Number(t))<0?1/(1-t):1+t,this.zoomTo(i.width*t/i.naturalWidth,null,e)},zoomTo:function(t,e,i){var n=this.options,o=this.canvasData,s=o.width,l=o.height,a=o.naturalWidth,r=o.naturalHeight;if((t=Number(t))>=0&&this.ready&&!this.disabled&&n.zoomable){var c=a*t,u=r*t;if(!1===Kl(this.element,ml,{ratio:t,oldRatio:s/a,originalEvent:i}))return this;if(i){var d=this.pointers,h=Zl(this.cropper),b=d&&Object.keys(d).length?function(t){var e=0,i=0,n=0;return Il(t,(function(t){var o=t.startX,s=t.startY;e+=o,i+=s,n+=1})),{pageX:e/=n,pageY:i/=n}}(d):{pageX:i.pageX,pageY:i.pageY};o.left-=(c-s)*((b.pageX-h.left-o.left)/s),o.top-=(u-l)*((b.pageY-h.top-o.top)/l)}else Tl(e)&&_l(e.x)&&_l(e.y)?(o.left-=(c-s)*((e.x-o.left)/s),o.top-=(u-l)*((e.y-o.top)/l)):(o.left-=(c-s)/2,o.top-=(u-l)/2);o.width=c,o.height=u,this.renderCanvas(!0)}return this},rotate:function(t){return this.rotateTo((this.imageData.rotate||0)+Number(t))},rotateTo:function(t){return _l(t=Number(t))&&this.ready&&!this.disabled&&this.options.rotatable&&(this.imageData.rotate=t%360,this.renderCanvas(!0,!0)),this},scaleX:function(t){var e=this.imageData.scaleY;return this.scale(t,_l(e)?e:1)},scaleY:function(t){var e=this.imageData.scaleX;return this.scale(_l(e)?e:1,t)},scale:function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:t,i=this.imageData,n=!1;return t=Number(t),e=Number(e),this.ready&&!this.disabled&&this.options.scalable&&(_l(t)&&(i.scaleX=t,n=!0),_l(e)&&(i.scaleY=e,n=!0),n&&this.renderCanvas(!0,!0)),this},getData:function(){var t,e=arguments.length>0&&void 0!==arguments[0]&&arguments[0],i=this.options,n=this.imageData,o=this.canvasData,s=this.cropBoxData;if(this.ready&&this.cropped){t={x:s.left-o.left,y:s.top-o.top,width:s.width,height:s.height};var l=n.width/n.naturalWidth;if(Il(t,(function(e,i){t[i]=e/l})),e){var a=Math.round(t.y+t.height),r=Math.round(t.x+t.width);t.x=Math.round(t.x),t.y=Math.round(t.y),t.width=r-t.x,t.height=a-t.y}}else t={x:0,y:0,width:0,height:0};return i.rotatable&&(t.rotate=n.rotate||0),i.scalable&&(t.scaleX=n.scaleX||1,t.scaleY=n.scaleY||1),t},setData:function(t){var e=this.options,i=this.imageData,n=this.canvasData,o={};if(this.ready&&!this.disabled&&Tl(t)){var s=!1;e.rotatable&&_l(t.rotate)&&t.rotate!==i.rotate&&(i.rotate=t.rotate,s=!0),e.scalable&&(_l(t.scaleX)&&t.scaleX!==i.scaleX&&(i.scaleX=t.scaleX,s=!0),_l(t.scaleY)&&t.scaleY!==i.scaleY&&(i.scaleY=t.scaleY,s=!0)),s&&this.renderCanvas(!0,!0);var l=i.width/i.naturalWidth;_l(t.x)&&(o.left=t.x*l+n.left),_l(t.y)&&(o.top=t.y*l+n.top),_l(t.width)&&(o.width=t.width*l),_l(t.height)&&(o.height=t.height*l),this.setCropBoxData(o)}return this},getContainerData:function(){return this.ready?Ol({},this.containerData):{}},getImageData:function(){return this.sized?Ol({},this.imageData):{}},getCanvasData:function(){var t=this.canvasData,e={};return this.ready&&Il(["left","top","width","height","naturalWidth","naturalHeight"],(function(i){e[i]=t[i]})),e},setCanvasData:function(t){var e=this.canvasData,i=e.aspectRatio;return this.ready&&!this.disabled&&Tl(t)&&(_l(t.left)&&(e.left=t.left),_l(t.top)&&(e.top=t.top),_l(t.width)?(e.width=t.width,e.height=t.width/i):_l(t.height)&&(e.height=t.height,e.width=t.height*i),this.renderCanvas(!0)),this},getCropBoxData:function(){var t,e=this.cropBoxData;return this.ready&&this.cropped&&(t={left:e.left,top:e.top,width:e.width,height:e.height}),t||{}},setCropBoxData:function(t){var e,i,n=this.cropBoxData,o=this.options.aspectRatio;return this.ready&&this.cropped&&!this.disabled&&Tl(t)&&(_l(t.left)&&(n.left=t.left),_l(t.top)&&(n.top=t.top),_l(t.width)&&t.width!==n.width&&(e=!0,n.width=t.width),_l(t.height)&&t.height!==n.height&&(i=!0,n.height=t.height),o&&(e?n.height=n.width/o:i&&(n.width=n.height*o)),this.renderCropBox()),this},getCroppedCanvas:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(!this.ready||!window.HTMLCanvasElement)return null;var e=this.canvasData,i=function(t,e,i,n){var o=e.aspectRatio,s=e.naturalWidth,l=e.naturalHeight,a=e.rotate,r=void 0===a?0:a,c=e.scaleX,u=void 0===c?1:c,d=e.scaleY,h=void 0===d?1:d,b=i.aspectRatio,p=i.naturalWidth,g=i.naturalHeight,m=n.fillColor,f=void 0===m?"transparent":m,y=n.imageSmoothingEnabled,v=void 0===y||y,w=n.imageSmoothingQuality,x=void 0===w?"low":w,k=n.maxWidth,S=void 0===k?1/0:k,_=n.maxHeight,C=void 0===_?1/0:_,E=n.minWidth,A=void 0===E?0:E,L=n.minHeight,T=void 0===L?0:L,M=document.createElement("canvas"),q=M.getContext("2d"),R=oa({aspectRatio:b,width:S,height:C}),I=oa({aspectRatio:b,width:A,height:T},"cover"),O=Math.min(R.width,Math.max(I.width,p)),N=Math.min(R.height,Math.max(I.height,g)),$=oa({aspectRatio:o,width:S,height:C}),P=oa({aspectRatio:o,width:A,height:T},"cover"),D=Math.min($.width,Math.max(P.width,s)),B=Math.min($.height,Math.max(P.height,l)),H=[-D/2,-B/2,D,B];return M.width=$l(O),M.height=$l(N),q.fillStyle=f,q.fillRect(0,0,O,N),q.save(),q.translate(O/2,N/2),q.rotate(r*Math.PI/180),q.scale(u,h),q.imageSmoothingEnabled=v,q.imageSmoothingQuality=x,q.drawImage.apply(q,[t].concat(Ls(H.map((function(t){return Math.floor($l(t))}))))),q.restore(),M}(this.image,this.imageData,e,t);if(!this.cropped)return i;var n=this.getData(),o=n.x,s=n.y,l=n.width,a=n.height,r=i.width/Math.floor(e.naturalWidth);1!==r&&(o*=r,s*=r,l*=r,a*=r);var c=l/a,u=oa({aspectRatio:c,width:t.maxWidth||1/0,height:t.maxHeight||1/0}),d=oa({aspectRatio:c,width:t.minWidth||0,height:t.minHeight||0},"cover"),h=oa({aspectRatio:c,width:t.width||(1!==r?i.width:l),height:t.height||(1!==r?i.height:a)}),b=h.width,p=h.height;b=Math.min(u.width,Math.max(d.width,b)),p=Math.min(u.height,Math.max(d.height,p));var g=document.createElement("canvas"),m=g.getContext("2d");g.width=$l(b),g.height=$l(p),m.fillStyle=t.fillColor||"transparent",m.fillRect(0,0,b,p);var f=t.imageSmoothingEnabled,y=void 0===f||f,v=t.imageSmoothingQuality;m.imageSmoothingEnabled=y,v&&(m.imageSmoothingQuality=v);var w,x,k,S,_,C,E=i.width,A=i.height,L=o,T=s;L<=-l||L>E?(L=0,w=0,k=0,_=0):L<=0?(k=-L,L=0,_=w=Math.min(E,l+L)):L<=E&&(k=0,_=w=Math.min(l,E-L)),w<=0||T<=-a||T>A?(T=0,x=0,S=0,C=0):T<=0?(S=-T,T=0,C=x=Math.min(A,a+T)):T<=A&&(S=0,C=x=Math.min(a,A-T));var M=[L,T,w,x];if(_>0&&C>0){var q=b/l;M.push(k*q,S*q,_*q,C*q)}return m.drawImage.apply(m,[i].concat(Ls(M.map((function(t){return Math.floor($l(t))}))))),g},setAspectRatio:function(t){var e=this.options;return this.disabled||El(t)||(e.aspectRatio=Math.max(0,t)||NaN,this.ready&&(this.initCropBox(),this.cropped&&this.renderCropBox())),this},setDragMode:function(t){var e=this.options,i=this.dragBox,n=this.face;if(this.ready&&!this.disabled){var o=t===il,s=e.movable&&t===nl;t=o||s?t:ol,e.dragMode=t,Wl(i,tl,t),zl(i,Gs,o),zl(i,Qs,s),e.cropBoxMovable||(Wl(n,tl,t),zl(n,Gs,o),zl(n,Qs,s))}return this}},pa=qs.Cropper,ga=function(){function t(e){var i=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};if(function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),!e||!xl.test(e.tagName))throw new Error("The first argument is required and must be an <img> or <canvas> element.");this.element=e,this.options=Ol({},kl,Tl(i)&&i),this.cropped=!1,this.disabled=!1,this.pointers={},this.ready=!1,this.reloading=!1,this.replaced=!1,this.sized=!1,this.sizing=!1,this.init()}var e,i,n;return e=t,i=[{key:"init",value:function(){var t,e=this.element,i=e.tagName.toLowerCase();if(!e[Os]){if(e[Os]=this,"img"===i){if(this.isImg=!0,t=e.getAttribute("src")||"",this.originalUrl=t,!t)return;t=e.src}else"canvas"===i&&window.HTMLCanvasElement&&(t=e.toDataURL());this.load(t)}}},{key:"load",value:function(t){var e=this;if(t){this.url=t,this.imageData={};var i=this.element,n=this.options;if(n.rotatable||n.scalable||(n.checkOrientation=!1),n.checkOrientation&&window.ArrayBuffer)if(vl.test(t))wl.test(t)?this.read((o=t.replace(la,""),s=atob(o),l=new ArrayBuffer(s.length),Il(a=new Uint8Array(l),(function(t,e){a[e]=s.charCodeAt(e)})),l)):this.clone();else{var o,s,l,a,r=new XMLHttpRequest,c=this.clone.bind(this);this.reloading=!0,this.xhr=r,r.onabort=c,r.onerror=c,r.ontimeout=c,r.onprogress=function(){r.getResponseHeader("content-type")!==fl&&r.abort()},r.onload=function(){e.read(r.response)},r.onloadend=function(){e.reloading=!1,e.xhr=null},n.checkCrossOrigin&&ta(t)&&i.crossOrigin&&(t=ea(t)),r.open("GET",t,!0),r.responseType="arraybuffer",r.withCredentials="use-credentials"===i.crossOrigin,r.send()}else this.clone()}}},{key:"read",value:function(t){var e=this.options,i=this.imageData,n=aa(t),o=0,s=1,l=1;if(n>1){this.url=function(t,e){for(var i=[],n=new Uint8Array(t);n.length>0;)i.push(sa.apply(null,Rl(n.subarray(0,8192)))),n=n.subarray(8192);return"data:".concat(e,";base64,").concat(btoa(i.join("")))}(t,fl);var a=function(t){var e=0,i=1,n=1;switch(t){case 2:i=-1;break;case 3:e=-180;break;case 4:n=-1;break;case 5:e=90,n=-1;break;case 6:e=90;break;case 7:e=90,i=-1;break;case 8:e=-90}return{rotate:e,scaleX:i,scaleY:n}}(n);o=a.rotate,s=a.scaleX,l=a.scaleY}e.rotatable&&(i.rotate=o),e.scalable&&(i.scaleX=s,i.scaleY=l),this.clone()}},{key:"clone",value:function(){var t=this.element,e=this.url,i=t.crossOrigin,n=e;this.options.checkCrossOrigin&&ta(e)&&(i||(i="anonymous"),n=ea(e)),this.crossOrigin=i,this.crossOriginUrl=n;var o=document.createElement("img");i&&(o.crossOrigin=i),o.src=n||e,o.alt=t.alt||"The image to crop",this.image=o,o.onload=this.start.bind(this),o.onerror=this.stop.bind(this),Bl(o,Ks),t.parentNode.insertBefore(o,t.nextSibling)}},{key:"start",value:function(){var t=this,e=this.image;e.onload=null,e.onerror=null,this.sizing=!0;var i=qs.navigator&&/(?:iPad|iPhone|iPod).*?AppleWebKit/i.test(qs.navigator.userAgent),n=function(e,i){Ol(t.imageData,{naturalWidth:e,naturalHeight:i,aspectRatio:e/i}),t.initialImageData=Ol({},t.imageData),t.sizing=!1,t.sized=!0,t.build()};if(!e.naturalWidth||i){var o=document.createElement("img"),s=document.body||document.documentElement;this.sizingImage=o,o.onload=function(){n(o.width,o.height),i||s.removeChild(o)},o.src=e.src,i||(o.style.cssText="left:0;max-height:none!important;max-width:none!important;min-height:0!important;min-width:0!important;opacity:0;position:absolute;top:0;z-index:-1;",s.appendChild(o))}else n(e.naturalWidth,e.naturalHeight)}},{key:"stop",value:function(){var t=this.image;t.onload=null,t.onerror=null,t.parentNode.removeChild(t),this.image=null}},{key:"build",value:function(){if(this.sized&&!this.ready){var t=this.element,e=this.options,i=this.image,n=t.parentNode,o=document.createElement("div");o.innerHTML='<div class="cropper-container" touch-action="none"><div class="cropper-wrap-box"><div class="cropper-canvas"></div></div><div class="cropper-drag-box"></div><div class="cropper-crop-box"><span class="cropper-view-box"></span><span class="cropper-dashed dashed-h"></span><span class="cropper-dashed dashed-v"></span><span class="cropper-center"></span><span class="cropper-face"></span><span class="cropper-line line-e" data-cropper-action="e"></span><span class="cropper-line line-n" data-cropper-action="n"></span><span class="cropper-line line-w" data-cropper-action="w"></span><span class="cropper-line line-s" data-cropper-action="s"></span><span class="cropper-point point-e" data-cropper-action="e"></span><span class="cropper-point point-n" data-cropper-action="n"></span><span class="cropper-point point-w" data-cropper-action="w"></span><span class="cropper-point point-s" data-cropper-action="s"></span><span class="cropper-point point-ne" data-cropper-action="ne"></span><span class="cropper-point point-nw" data-cropper-action="nw"></span><span class="cropper-point point-sw" data-cropper-action="sw"></span><span class="cropper-point point-se" data-cropper-action="se"></span></div></div>';var s=o.querySelector(".".concat(Os,"-container")),l=s.querySelector(".".concat(Os,"-canvas")),a=s.querySelector(".".concat(Os,"-drag-box")),r=s.querySelector(".".concat(Os,"-crop-box")),c=r.querySelector(".".concat(Os,"-face"));this.container=n,this.cropper=s,this.canvas=l,this.dragBox=a,this.cropBox=r,this.viewBox=s.querySelector(".".concat(Os,"-view-box")),this.face=c,l.appendChild(i),Bl(t,Xs),n.insertBefore(s,t.nextSibling),this.isImg||Hl(i,Ks),this.initPreview(),this.bind(),e.initialAspectRatio=Math.max(0,e.initialAspectRatio)||NaN,e.aspectRatio=Math.max(0,e.aspectRatio)||NaN,e.viewMode=Math.max(0,Math.min(3,Math.round(e.viewMode)))||0,Bl(r,Xs),e.guides||Bl(r.getElementsByClassName("".concat(Os,"-dashed")),Xs),e.center||Bl(r.getElementsByClassName("".concat(Os,"-center")),Xs),e.background&&Bl(s,"".concat(Os,"-bg")),e.highlight||Bl(c,Zs),e.cropBoxMovable&&(Bl(c,Qs),Wl(c,tl,Ns)),e.cropBoxResizable||(Bl(r.getElementsByClassName("".concat(Os,"-line")),Xs),Bl(r.getElementsByClassName("".concat(Os,"-point")),Xs)),this.render(),this.ready=!0,this.setDragMode(e.dragMode),e.autoCrop&&this.crop(),this.setData(e.data),Ml(e.ready)&&Xl(t,bl,e.ready,{once:!0}),Kl(t,bl)}}},{key:"unbuild",value:function(){this.ready&&(this.ready=!1,this.unbind(),this.resetPreview(),this.cropper.parentNode.removeChild(this.cropper),Hl(this.element,Xs))}},{key:"uncreate",value:function(){this.ready?(this.unbuild(),this.ready=!1,this.cropped=!1):this.sizing?(this.sizingImage.onload=null,this.sizing=!1,this.sized=!1):this.reloading?(this.xhr.onabort=null,this.xhr.abort()):this.image&&this.stop()}}],n=[{key:"noConflict",value:function(){return window.Cropper=pa,t}},{key:"setDefaults",value:function(t){Ol(kl,Tl(t)&&t)}}],i&&Es(e.prototype,i),n&&Es(e,n),t}();Ol(ga.prototype,ra,ca,ua,da,ha,ba);const ma=1,fa={exposure:[-100,100],contrast:[-100,100],highlights:[-100,100],shadows:[-100,100],saturation:[-100,100],temperature:[-100,100],tint:[-100,100],clarity:[-100,100],sharpen:[0,100]};function ya(t,e,i){return t=Number(t),Number.isFinite(t)?Math.min(i,Math.max(e,t)):null}function va(t){if(t&&"object"==typeof t&&!Object.isFrozen(t)){Object.freeze(t);for(const e of Object.keys(t))va(t[e])}return t}function wa(t){return void 0===t?void 0:JSON.parse(JSON.stringify(t))}function xa(t,e){if(!Number.isFinite(t)||!Number.isFinite(e)||t<1||e<1)throw new Error("createRecipe: valid source dimensions required");return va({v:ma,source:{w:Math.round(t),h:Math.round(e)}})}function ka(t){const e=wa(t)||{},i=[];if("number"!=typeof e.v&&(e.v=ma),e.source&&Number.isFinite(e.source.w)&&Number.isFinite(e.source.h)||(i.push("missing source dimensions"),e.source={w:1,h:1,...e.source||{}}),e.geometry){const t=e.geometry;if(void 0!==t.rotate90){const e=ya(Math.round(t.rotate90),0,3);null===e?delete t.rotate90:t.rotate90=e}if(void 0!==t.straighten){const e=ya(t.straighten,-45,45);null===e?delete t.straighten:t.straighten=e}if(void 0!==t.flipH&&(t.flipH=!!t.flipH),void 0!==t.flipV&&(t.flipV=!!t.flipV),t.crop){const e=t.crop,n=ya(e.x,0,1),o=ya(e.y,0,1);let s=ya(e.w,0,1),l=ya(e.h,0,1);null===n||null===o||null===s||null===l||0===s||0===l?(i.push("malformed crop dropped"),delete t.crop):(s=Math.min(s,1-n),l=Math.min(l,1-o),t.crop={...e,x:n,y:o,w:s,h:l})}}if(e.adjust)for(const[t,[i,n]]of Object.entries(fa))if(void 0!==e.adjust[t]){const o=ya(e.adjust[t],i,n);null===o?delete e.adjust[t]:e.adjust[t]=o}return void 0!==e.effects&&(Array.isArray(e.effects)?(e.effects=e.effects.filter((t=>!(!t||"string"!=typeof t.type||!t.type)||(i.push("effect without type dropped"),!1))),0===e.effects.length&&delete e.effects):(i.push("effects not an array; dropped"),delete e.effects)),e.__warnings=i,0===i.length&&delete e.__warnings,e}function Sa(t){const e=wa(t);delete e.__warnings;const i=JSON.stringify(e);if(i.length>65536)throw new Error("recipe exceeds 65536 bytes");return i}function _a(t){let e;try{e="string"==typeof t?JSON.parse(t):t}catch{return null}return va(ka(e))}class Ca{constructor(t){this.stack=[t],this.pointer=0}get current(){return this.stack[this.pointer]}get canUndo(){return this.pointer>0}get canRedo(){return this.pointer<this.stack.length-1}push(t){return this.stack=this.stack.slice(0,this.pointer+1),this.stack.push(t),this.pointer++,t}undo(){return this.canUndo&&this.pointer--,this.current}redo(){return this.canRedo&&this.pointer++,this.current}reset(){return this.pointer=0,this.current}}const Ea="kanvas-look:";function Aa(t,e,i=Math.random){const n="string"==typeof e?Ta(e):e;if(!n||"look"!==n.kind)throw new Error("applyLook: not a look");return function(t,e){const i=wa(t);return e(i),va(ka(i))}(t,(t=>{n.adjust&&(t.adjust=wa(n.adjust)),n.effects&&(t.effects=wa(n.effects).map((t=>("grain"===t.type&&void 0===t.seed&&(t.seed=Math.floor(4294967295*i())),t)))),n.name&&(t.meta={...t.meta||{},look:n.name})}))}function La(t){return Ea+function(t){const e=(new TextEncoder).encode(t);let i="";for(const t of e)i+=String.fromCharCode(t);return("function"==typeof btoa?btoa(i):Buffer.from(e).toString("base64")).replace(/\+/g,"-").replace(/\//g,"_").replace(/=+$/,"")}(JSON.stringify(t))}function Ta(t){if("string"!=typeof t||!t.startsWith(Ea))return null;try{const e=JSON.parse(function(t){const e=t.replace(/-/g,"+").replace(/_/g,"/"),i="function"==typeof atob?atob(e):Buffer.from(e,"base64").toString("binary"),n=Uint8Array.from(i,(t=>t.charCodeAt(0)));return(new TextDecoder).decode(n)}(t.slice(Ea.length)));return e&&"look"===e.kind?va(e):null}catch{return null}}const Ma=Math.PI/180;function qa(t){if("string"!=typeof t)return null;const e=t.match(/^(\d+(?:\.\d+)?)[:x\/](\d+(?:\.\d+)?)$/);if(!e)return null;const i=parseFloat(e[1]),n=parseFloat(e[2]);return n>0?i/n:null}function Ra(t,e={}){const i=e.rotate90||0,n=e.straighten||0,o=function(t,e,i=0){return i%2==1?{w:e,h:t}:{w:t,h:e}}(t.w,t.h,i),s=function(t,e,i){const n=Math.abs(t)*Ma;if(0===n)return 1;const o=Math.cos(n),s=Math.sin(n);return o+Math.max(e/i,i/e)*s}(n,o.w,o.h),l=function(t,e,i){const n=t||{x:0,y:0,w:1,h:1},o=Math.round(n.x*e),s=Math.round(n.y*i),l=Math.max(1,Math.round(n.w*e)),a=Math.max(1,Math.round(n.h*i));return{x:Math.min(o,e-1),y:Math.min(s,i-1),w:Math.min(l,e-o),h:Math.min(a,i-s)}}(e.crop,o.w,o.h);return{frame:o,rotate90:i,flipH:!!e.flipH,flipV:!!e.flipV,straighten:n,zoom:s,cropPx:l,outW:l.w,outH:l.h}}function Ia(t){if("string"!=typeof t)return t;const e=t.match(/^(\d+(?:\.\d+)?):(\d+(?:\.\d+)?)$/);return e?`${e[2]}:${e[1]}`:t}const Oa=.2126,Na=.7152,$a=.0722,Pa=40;function Da(t,e,i){const n=Math.min(1,Math.max(0,(i-t)/(e-t)));return n*n*(3-2*n)}function Ba(t){return!t||Object.entries(t).every((([t,e])=>"number"!=typeof e||0===e))}function Ha(t,e={}){if(Ba(e))return t;const{data:i}=t,n=function(t={}){const e=t.exposure||0,i=t.contrast||0,n=t.highlights||0,o=t.shadows||0,s=Math.pow(2,e/100*2),l=1+i/100,a=new Uint8ClampedArray(256);for(let t=0;t<256;t++){let e=t/255;e*=s,e=(e-.5)*l+.5,0!==n&&(e+=n/100*.35*Da(.5,1,e)*(1-e)),0!==o&&(e+=o/100*.35*(1-Da(0,.5,e))*(1-e)*Math.min(1,8*e)),a[t]=Math.round(255*Math.min(1,Math.max(0,e)))}return a}(e),o=e.saturation||0,s=e.temperature||0,l=e.tint||0,a=1+o/100,r=s/100*Pa,c=l/100*Pa,u=0!==o,d=0!==s||0!==l;for(let t=0;t<i.length;t+=4){let e=n[i[t]],o=n[i[t+1]],s=n[i[t+2]];if(u){const t=Oa*e+Na*o+$a*s;e=t+(e-t)*a,o=t+(o-t)*a,s=t+(s-t)*a}d&&(e+=r+.5*c,s-=r-.5*c,o-=c),i[t]=e<0?0:e>255?255:e,i[t+1]=o<0?0:o>255?255:o,i[t+2]=s<0?0:s>255?255:s}return t}function za(t){let e=0;const i=[];for(const n of t.split(/\r?\n/)){const t=n.trim();if(!t||t.startsWith("#"))continue;if(/^TITLE/i.test(t)||/^DOMAIN_/i.test(t))continue;if(/^LUT_1D_SIZE/i.test(t))throw new Error("1D LUTs not supported (3D required)");const o=t.match(/^LUT_3D_SIZE\s+(\d+)/i);if(o){e=parseInt(o[1],10);continue}const s=t.split(/\s+/);if(s.length>=3){const t=parseFloat(s[0]),e=parseFloat(s[1]),n=parseFloat(s[2]);Number.isFinite(t)&&Number.isFinite(e)&&Number.isFinite(n)&&i.push(t,e,n)}}if(!e)throw new Error(".cube missing LUT_3D_SIZE");if(i.length!==e*e*e*3)throw new Error(`.cube expected ${e**3} entries, got ${i.length/3}`);return{size:e,data:Float32Array.from(i)}}function Fa(t,e,i,n,o){const s=t.size,l=t.data,a=s-1;let r=e*a,c=i*a,u=n*a,d=Math.floor(r),h=Math.floor(c),b=Math.floor(u);d>=a&&(d=a-1),h>=a&&(h=a-1),b>=a&&(b=a-1);const p=r-d,g=c-h,m=u-b,f=3*s,y=s*s*3,v=3*d+h*f+b*y,w={c000:v,c100:v+3,c010:v+f,c001:v+y,c110:v+3+f,c101:v+3+y,c011:v+f+y,c111:v+3+f+y};let x,k,S,_,C,E,A,L;p>=g?g>=m?(x=w.c000,k=w.c100,S=w.c110,_=w.c111,C=1-p,E=p-g,A=g-m,L=m):p>=m?(x=w.c000,k=w.c100,S=w.c101,_=w.c111,C=1-p,E=p-m,A=m-g,L=g):(x=w.c000,k=w.c001,S=w.c101,_=w.c111,C=1-m,E=m-p,A=p-g,L=g):m>=g?(x=w.c000,k=w.c001,S=w.c011,_=w.c111,C=1-m,E=m-g,A=g-p,L=p):m>=p?(x=w.c000,k=w.c010,S=w.c011,_=w.c111,C=1-g,E=g-m,A=m-p,L=p):(x=w.c000,k=w.c010,S=w.c110,_=w.c111,C=1-g,E=g-p,A=p-m,L=m),o[0]=l[x]*C+l[k]*E+l[S]*A+l[_]*L,o[1]=l[x+1]*C+l[k+1]*E+l[S+1]*A+l[_+1]*L,o[2]=l[x+2]*C+l[k+2]*E+l[S+2]*A+l[_+2]*L}function Ua(t,e,i=1){if(i<=0)return t;const{data:n}=t,o=[0,0,0],s=1/255,l=Math.min(1,i),a=1-l;for(let t=0;t<n.length;t+=4)Fa(e,n[t]*s,n[t+1]*s,n[t+2]*s,o),n[t]=n[t]*a+255*o[0]*l,n[t+1]=n[t+1]*a+255*o[1]*l,n[t+2]=n[t+2]*a+255*o[2]*l;return t}const ja=t=>t<0?0:t>1?1:t,Wa=([t,e,i])=>.2126*t+.7152*e+.0722*i,Va=(t,e,i)=>{const n=ja((i-t)/(e-t));return n*n*(3-2*n)};function Ga([t,e,i]){const n=Math.max(t,e,i),o=n-Math.min(t,e,i);let s=0;0!==o&&(s=n===t?(e-i)/o%6:n===e?(i-t)/o+2:(t-e)/o+4,s*=60,s<0&&(s+=360));return[s,0===n?0:o/n,n]}function Ya([t,e,i]){const n=i*e,o=(t%360+360)%360/60,s=n*(1-Math.abs(o%2-1));let l;l=o<1?[n,s,0]:o<2?[s,n,0]:o<3?[0,n,s]:o<4?[0,s,n]:o<5?[s,0,n]:[n,0,s];const a=i-n;return[l[0]+a,l[1]+a,l[2]+a]}const Xa=(t,e)=>([i,n,o])=>[ja(i*(1+.4*t)),ja(n*(1-.2*e)),ja(o*(1-.4*t))],Ka=(t,e=.435)=>i=>i.map((i=>ja((i-e)*t+e))),Za=t=>e=>{const i=Wa(e);return e.map((e=>ja(i+(e-i)*t)))},Ja=(t,e,i)=>n=>n.map(((n,o)=>{let s=n*i[o]+t[o]*(1-n);return s=ja(s),Math.pow(s,1/e[o])})),Qa=(t,e=.6)=>i=>i.map((i=>{if(i<=e)return i;const n=(i-e)/(1-e);return ja(e+(1+t)*n/(1+t*n)*(1-e))})),tr=t=>e=>e.map((e=>ja(t+e*(1-t)))),er=(t,e,i,n,o=.5)=>s=>{const l=Wa(s),a=Ya([t,1,1]),r=Ya([i,1,1]),c=Va(0,.22,l)*(1-Va(.9,1,l)),u=(1-Va(0,o+.25,l))*e*c,d=Va(o-.25,1,l)*n*c;let h=s.map(((t,e)=>t+2*(a[e]-.5)*u*(.3+.7*(1-l))));h=h.map(((t,e)=>t+2*(r[e]-.5)*d*(.3+.7*l)));const b=Wa(h),p=l-b;return h.map((t=>ja(t+p)))},ir=(t,e,i,n=0)=>o=>{const[s,l,a]=Ga(o);if(l<.02)return o;const r=Math.max(0,1-function(t,e){return Math.abs(((t-e)%360+540)%360-180)}(s,t)/e),c=r*r*(3-2*r),u=ja(l*((t,e,i)=>t+(e-t)*i)(1,i,c));return Ya([s+n*c,u,a]).map(ja)},nr=t=>([e,i,n])=>[ja(e*(1-t)+i*t*.7+n*t*.3),ja(i*(1-.6*t)+e*t*.35+n*t*.25),ja(n*(1-t)+i*t*.65+e*t*.35)],or=t=>e=>{const[i,n,o]=Ga(e);if(n<.02)return e;return Ya([i,ja(n*(1+t*(1-n))),o]).map(ja)},sr=t=>e=>e.map((e=>ja(e*e*(1+t)/(e+t)))),lr=(t,e=.45)=>{const i=i=>1/(1+Math.exp(-t*(i-e))),n=i(0),o=i(1);return t=>t.map((t=>ja((i(t)-n)/(o-n))))},ar=(t,e,i)=>{const n=t+e+i;return o=>{const s=ja((o[0]*t+o[1]*e+o[2]*i)/n);return[s,s,s]}},rr=(t,e=.65)=>i=>{const n=Wa(i),o=Va(e,1,n)*t;return i.map((t=>ja(t+(n-t)*o)))},cr=(...t)=>e=>t.reduce(((t,e)=>e(t)),e),ur=[{id:"deep-harbor",label:"Deep Harbor",category:"Film",intensity:50,fn:cr(Xa(-.012,-.004),Ka(1.15,.4),Qa(.55,.52),er(185,.12,200,.045,.42),ir(200,70,1.08,6),ir(60,40,.8,-6),Za(.85),Ja([0,.004,.008],[1,1,1],[.995,1,1]),nr(.04))},{id:"ivory-bloom",label:"Ivory Bloom",category:"Film",intensity:50,fn:cr(Ja([.02,.02,.022],[1.12,1.12,1.1],[1,1,1]),Ka(.9,.55),Za(.82),er(210,.025,45,.045,.55),Qa(.5,.5),rr(.4,.55),nr(.045))},{id:"northlight",label:"Northlight",category:"Film",intensity:50,fn:cr(sr(.04),Xa(-.018,-.004),Ka(1.04,.48),Za(.9),er(220,.05,210,.03,.5),ir(30,40,1.08,0),Qa(.3,.65),rr(.22,.7),nr(.04))},{id:"tungsten-bloom",label:"Tungsten Bloom",category:"Film",intensity:50,fn:cr(tr(.03),Xa(.06,.012),Ka(1.02,.48),er(30,.05,42,.08,.55),ir(215,60,.85,5),Qa(.45,.55),rr(.25,.62),or(.08),nr(.05))},{id:"velvet-meadow",label:"Velvet Meadow",category:"Film",intensity:50,fn:cr(sr(.07),Ka(1.16,.44),or(.35),ir(0,35,1.15,3),ir(130,50,1.2,-8),ir(215,55,1.1,0),Qa(.3,.68),rr(.2,.78),nr(.045))},{id:"atelier",label:"Atelier",category:"Portrait",intensity:50,fn:cr(sr(.025),Ka(1.07,.46),ir(28,40,1,0),or(.06),Qa(.3,.68),nr(.025))},{id:"porcelain",label:"Porcelain",category:"Portrait",intensity:50,fn:cr(Ja([.012,.012,.014],[1.06,1.06,1.05],[1,1,1]),Ka(1.02,.5),ir(28,40,.95,0),rr(.25,.68),Qa(.35,.6),nr(.03))},{id:"rosewood",label:"Rosewood",category:"Portrait",intensity:50,fn:cr(Xa(.018,.01),sr(.035),Ka(1.06,.47),Za(.88),er(350,.03,30,.04,.5),ir(28,36,1.06,0),ir(130,60,.75,8),ir(215,60,.8,0),rr(.22,.68),nr(.04))},{id:"vista-vivid",label:"Vista Vivid",category:"Landscape",intensity:50,fn:cr(sr(.035),Ka(1.1,.46),or(.28),ir(215,55,1.15,-3),ir(125,55,1.12,-5),ir(28,35,1,0),rr(.15,.78),Qa(.3,.66),nr(.035))},{id:"bw-standard",label:"Standard",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46))},{id:"bw-soft",label:"Soft",category:"B&W",intensity:100,hidden:!0,fn:cr(ar(.2126,.7152,.0722),lr(2.2,.44))},{id:"bw-deep",label:"Deep",category:"B&W",intensity:100,fn:cr(ar(.3,.6,.1),lr(4,.5))},{id:"bw-warmtone",label:"Warmtone",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46),er(35,.025,42,.045,.5))},{id:"bw-cooltone",label:"Cooltone",category:"B&W",intensity:100,fn:cr(ar(.2126,.7152,.0722),lr(3.2,.46),er(225,.04,220,.02,.45))},{id:"silver-mist",label:"Silver Mist",category:"B&W",intensity:100,fn:cr(ar(.22,.7,.08),tr(.07),Ka(.92,.5),Qa(.5,.5))},{id:"emerald-noir",label:"Emerald Noir",category:"Creative",intensity:70,fn:cr(sr(.05),Ka(1.1,.45),Za(.82),er(155,.09,90,.04,.48),ir(28,32,1.12,0),Qa(.4,.58),nr(.05))},{id:"pastel-air",label:"Pastel Air",category:"Creative",intensity:75,fn:cr(Ja([.018,.018,.02],[1.1,1.1,1.08],[1,1,1]),Ka(.92,.54),Za(.85),er(330,.03,210,.035,.55),rr(.3,.6),Qa(.45,.52),nr(.04))},{id:"sunprint",label:"Sunprint",category:"Creative",intensity:65,fn:cr(Xa(.04,.008),sr(.045),Ka(1.12,.46),ir(15,45,1.2,5),ir(215,55,.75,10),er(25,.05,40,.08,.5),or(.1),rr(.2,.68),Qa(.35,.58),nr(.05))}],dr=33;function hr(t,e,i){return.2126*t+.7152*e+.0722*i}function br(t,e=.72,i=.22){return t<=e?t:e+(1-Math.exp(-(t-e)/i))*i*((1-e)/i)}function pr(t,e){return t+e*Math.sin((t-.5)*Math.PI)*(t*(1-t))*4*.25}function gr(t,e,i,n,o){const s=hr(t,e,i),l=Math.pow(1-s,2),a=Math.pow(s,2);return[t+n[0]*l+o[0]*a,e+n[1]*l+o[1]*a,i+n[2]*l+o[2]*a]}function mr(t,e){return t*(1-e)+e}const fr={"film-warm":(t,e,i)=>(t=br(pr(mr(t,.025),.1)),e=br(pr(mr(e,.022),.1)),i=br(pr(mr(i,.03),.08)),[t,e,i]=gr(t,e,i,[-.01,.004,.022],[.03,.012,-.02]),[t,e,i]=function(t,e,i,n){const o=Math.max(t,e,i),s=Math.min(t,e,i),l=0===o?0:(o-s)/o,a=1-n*l*l;return[t*a,e*a,i*a]}(t,e,i,.1),[t,e,i]),"film-muted":(t,e,i)=>{const n=hr(t,e,i),o=.78;return e=n+(e-n)*o,i=n+(i-n)*o,t=br(mr(t=n+(t-n)*o,.045),.68,.26),e=br(mr(e,.045),.68,.26),i=br(mr(i,.05),.68,.26),[t,e,i]=gr(t,e,i,[-.006,.002,.014],[.008,.006,0]),[t,e,i]},"mono-classic":(t,e,i)=>{let n=.45*t+.45*e+.1*i;return n=pr(n,.22),n=br(mr(n,.02)),[n,n,n]}};for(const t of ur)fr[t.id]=(e,i,n)=>t.fn([e,i,n]);const yr=ur.find((t=>"bw-soft"===t.id));yr&&(fr["mono-classic"]=(t,e,i)=>yr.fn([t,e,i]));const vr=new Map;function wr(t){if(vr.has(t))return vr.get(t);const e=fr[t];if(!e)return null;const i=function(t,e){const i=new Float32Array(t*t*t*3),n=1/(t-1);let o=0;for(let s=0;s<t;s++)for(let l=0;l<t;l++)for(let a=0;a<t;a++){const t=e(a*n,l*n,s*n);i[o++]=Math.min(1,Math.max(0,t[0])),i[o++]=Math.min(1,Math.max(0,t[1])),i[o++]=Math.min(1,Math.max(0,t[2]))}return{size:t,data:i}}(dr,e);return vr.set(t,i),i}function xr(t,e){if(fr[t])throw new Error(`"${t}" is a reserved built-in id`);vr.set(t,e)}function kr(t){return t&&"object"==typeof t&&t.data?t:"string"==typeof t&&(wr(t)||vr.get(t))||null}const Sr="x-cube:",_r=new Map,Cr=new Map;function Er(t){const e=String(t).split(/[?#]/)[0].replace(/^[a-z]+:\/\/[^/]+/i,"").replace(/\.cube$/i,"").replace(/^[./]+/,"");return Sr+e}function Ar(t){return Sr+String(t).toLowerCase().trim().replace(/\s+/g,"-")}function Lr(t){let e=t;if("string"==typeof e)e={url:e};else if(Array.isArray(e)){const[t,i,n]=e;e={url:t,intensity:i,label:n}}if(!e||"object"!=typeof e)return null;if(!e.url&&!e.cube&&!e.lut)return null;const i=e.url?Er(e.url):Ar(e.label||"preset"),n=Number.isFinite(e.intensity)?Math.max(0,Math.min(100,e.intensity)):80;return{id:i,label:e.label||(e.url?(o=e.url,(String(o).split(/[?#]/)[0].split("/").pop()||"Preset").replace(/\.cube$/i,"").replace(/[-_]+/g," ").replace(/\b\w/g,(t=>t.toUpperCase()))):i.slice(Sr.length)),category:e.category||"Other",url:e.url||null,intensity:n,state:"idle",error:null};var o}async function Tr(t,e={}){let i=t;if("string"==typeof t){const e=await fetch(t);if(!e.ok)throw new Error(`presets: ${t} — HTTP ${e.status}`);i=await e.json()}const n=function(t){if(!t)return[];let e=[];if(Array.isArray(t))e=t.map(Lr);else if("object"==typeof t)for(const[i,n]of Object.entries(t))for(const t of n||[]){const n=Lr(t);n&&(n.category="Other"===n.category?i:n.category),e.push(n)}return e.filter(Boolean)}(i);for(const t of n)_r.set(t.id,_r.get(t.id)||t);for(const t of Array.isArray(i)?i:[]){if("string"==typeof t||!t)continue;if(!t.cube&&!t.lut)continue;const e=t.url?Er(t.url):Ar(t.label||"preset"),i=_r.get(e);if(i&&"ready"!==i.state)try{xr(e,t.lut||za(t.cube)),i.state="ready"}catch(t){i.state="error",i.error=t.message}}return e.eager&&await Promise.all(n.map((t=>Mr(t.id)))),n.map((t=>_r.get(t.id)||t))}function Mr(t){const e=_r.get(t);if(!e)return Promise.resolve(kr(t));const i=kr(t);if(i)return e.state="ready",Promise.resolve(i);if("error"===e.state)return Promise.resolve(null);if(Cr.has(t))return Cr.get(t);if(!e.url)return Promise.resolve(null);e.state="loading";const n=(async()=>{try{const i=await fetch(e.url);if(!i.ok)throw new Error(`HTTP ${i.status}`);const n=za(await i.text());return xr(t,n),e.state="ready",n}catch(t){return e.state="error",e.error=t.message,console.warn(`kanvas: preset "${e.label}" (${e.url}) failed — ${e.error}`),null}finally{Cr.delete(t)}})();return Cr.set(t,n),n}function qr(t,e,i,n,o){const s=1/(o+o+1);for(let l=0;l<n;l++){const n=l*i;let a=t[n]*(o+1);for(let e=0;e<o;e++)a+=t[n+Math.min(e,i-1)];for(let l=0;l<i;l++){a+=t[n+Math.min(l+o,i-1)]-t[n+Math.max(l-o-1,0)],e[n+l]=a*s}}}function Rr(t,e,i,n,o){const s=1/(o+o+1);for(let l=0;l<i;l++){let a=t[l]*(o+1);for(let e=0;e<o;e++)a+=t[l+Math.min(e,n-1)*i];for(let r=0;r<n;r++){a+=t[l+Math.min(r+o,n-1)*i]-t[l+Math.max(r-o-1,0)*i],e[l+r*i]=a*s}}}function Ir(t,e,i,n){if(n<.5)return t;const o=Math.max(1,Math.round(n/1.732)),s=new Float32Array(t.length);for(let n=0;n<3;n++)qr(t,s,e,i,o),Rr(s,t,e,i,o);return t}function Or(t){const{data:e,width:i,height:n}=t,o=new Float32Array(i*n);for(let t=0,i=0;t<e.length;t+=4,i++)o[i]=.2126*e[t]+.7152*e[t+1]+.0722*e[t+2];return o}const Nr=new Map;function $r(t,e){if("string"!=typeof t||!t)throw new Error("effect type required");if(Nr.has(t))throw new Error(`effect "${t}" already registered`);Nr.set(t,e)}function Pr(t,e,i={}){const n=t.width||t.videoWidth||t.naturalWidth,o=t.height||t.videoHeight||t.naturalHeight,s=Ra({w:n,h:o},e.geometry);let l=s.outW,a=s.outH,r=1;i.maxSize&&Math.max(l,a)>i.maxSize&&(r=i.maxSize/Math.max(l,a),l=Math.max(1,Math.round(l*r)),a=Math.max(1,Math.round(a*r)));const c=function(t,e){if("undefined"!=typeof OffscreenCanvas)return new OffscreenCanvas(t,e);const i=document.createElement("canvas");return i.width=t,i.height=e,i}(l,a),u=c.getContext("2d");u.imageSmoothingQuality="high",u.save(),u.scale(r,r),u.translate(-s.cropPx.x,-s.cropPx.y),u.translate(s.frame.w/2,s.frame.h/2),u.rotate(s.straighten*Math.PI/180),u.scale(s.zoom,s.zoom),u.scale(s.flipH?-1:1,s.flipV?-1:1),u.rotate(s.rotate90*Math.PI/2),u.drawImage(t,-n/2,-o/2),u.restore();const d=!Ba(e.adjust),h=(e.effects||[]).filter((t=>!1!==t.enabled));if(d||h.length){let t=u.getImageData(0,0,l,a);const i={width:l,height:a,diagonal:Math.hypot(l,a)};d&&(Ha(t,e.adjust),e.adjust.clarity&&function(t,e,i){if(!e)return t;const{data:n,width:o,height:s}=t,l=Or(t),a=Ir(Float32Array.from(l),o,s,.01*i),r=e/100*.9;for(let t=0,e=0;t<n.length;t+=4,e++){const i=l[e];if(i<=0)continue;const o=i/255,s=4*o*(1-o),c=i+r*(i-a[e])*s,u=Math.max(0,c)/i;n[t]=Math.min(255,n[t]*u),n[t+1]=Math.min(255,n[t+1]*u),n[t+2]=Math.min(255,n[t+2]*u)}}(t,e.adjust.clarity,i.diagonal),e.adjust.sharpen&&function(t,e,i){if(!e)return t;const{data:n,width:o,height:s}=t,l=Or(t),a=Math.max(.6,8e-4*i),r=Ir(Float32Array.from(l),o,s,a),c=e/100*1.2;for(let t=0,e=0;t<n.length;t+=4,e++){const i=l[e];if(i<=0)continue;const o=i+c*(i-r[e]),s=Math.max(0,o)/i;n[t]=Math.min(255,n[t]*s),n[t+1]=Math.min(255,n[t+1]*s),n[t+2]=Math.min(255,n[t+2]*s)}}(t,e.adjust.sharpen,i.diagonal)),t=function(t,e,i){let n=t;for(const t of e){if(!1===t.enabled)continue;const e=Nr.get(t.type);e?n=e(n,t,i)||n:console.warn(`kanvas: unknown effect "${t.type}" skipped (preserved in recipe)`)}return n}(t,h,i),u.putImageData(t,0,0)}return c}const Dr=64,Br="#version 300 es\nvoid main() {\n vec2 v = vec2(float((gl_VertexID << 1) & 2), float(gl_VertexID & 2));\n gl_Position = vec4(v * 2.0 - 1.0, 0.0, 1.0);\n}",Hr=`#version 300 es\nprecision highp float;\nuniform sampler2D uTex;\nuniform vec2 uRes;\nuniform int uMode; /* 0 = linear, 1 = zoom */\nuniform vec2 uDir; /* unit direction (linear) */\nuniform float uLen; /* blur length in px (linear) */\nuniform vec2 uCenter; /* zoom center in px */\nuniform float uAmount; /* zoom amount 0..1 */\nuniform int uSteps;\nuniform vec4 uFocus; /* cx, cy, inner, outer (px) */\nuniform int uHasFocus;\nout vec4 outColor;\nconst int MAX_STEPS = ${Dr};\nvoid main() {\n vec2 p = gl_FragCoord.xy;\n ivec2 ip = ivec2(p);\n vec4 orig = texelFetch(uTex, ip, 0);\n vec3 acc = vec3(0.0);\n float n = 0.0;\n float denom = float(uSteps - 1);\n for (int s = 0; s < MAX_STEPS; s++) {\n if (s >= uSteps) break;\n float f = float(s) / denom;\n vec2 sp = (uMode == 0)\n ? p + uDir * ((f - 0.5) * uLen)\n : uCenter + (p - uCenter) * (1.0 - uAmount * f);\n if (sp.x < 0.0 || sp.y < 0.0 || sp.x >= uRes.x || sp.y >= uRes.y) continue;\n acc += texelFetch(uTex, ivec2(sp), 0).rgb;\n n += 1.0;\n }\n vec3 blurred = n > 0.0 ? acc / n : orig.rgb;\n float m = 0.0;\n if (uHasFocus == 1) {\n float d = distance(p, uFocus.xy);\n if (d <= uFocus.z) {\n m = 1.0;\n } else if (d < uFocus.w) {\n float t = (d - uFocus.z) / (uFocus.w - uFocus.z);\n m = 1.0 - t * t * (3.0 - 2.0 * t);\n }\n }\n outColor = vec4(mix(blurred, orig.rgb, m), orig.a);\n}`;let zr=null;function Fr(t,e){const i=function(){if(null!==zr)return zr;try{let t=null;"undefined"!=typeof OffscreenCanvas?t=new OffscreenCanvas(4,4):"undefined"!=typeof document&&(t=document.createElement("canvas"));const e=t&&t.getContext("webgl2",{alpha:!0,antialias:!1,depth:!1,stencil:!1,premultipliedAlpha:!1,preserveDrawingBuffer:!1});if(!e)return zr=!1,zr;const i=(t,i)=>{const n=e.createShader(t);if(e.shaderSource(n,i),e.compileShader(n),!e.getShaderParameter(n,e.COMPILE_STATUS))throw new Error(String(e.getShaderInfoLog(n)));return n},n=e.createProgram();if(e.attachShader(n,i(e.VERTEX_SHADER,Br)),e.attachShader(n,i(e.FRAGMENT_SHADER,Hr)),e.linkProgram(n),!e.getProgramParameter(n,e.LINK_STATUS))throw new Error(String(e.getProgramInfoLog(n)));e.useProgram(n);const o=e.createTexture();e.bindTexture(e.TEXTURE_2D,o),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MIN_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_MAG_FILTER,e.NEAREST),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_S,e.CLAMP_TO_EDGE),e.texParameteri(e.TEXTURE_2D,e.TEXTURE_WRAP_T,e.CLAMP_TO_EDGE),e.pixelStorei(e.UNPACK_FLIP_Y_WEBGL,!1),e.pixelStorei(e.UNPACK_PREMULTIPLY_ALPHA_WEBGL,!1);const s=["uTex","uRes","uMode","uDir","uLen","uCenter","uAmount","uSteps","uFocus","uHasFocus"],l={};for(const t of s)l[t]=e.getUniformLocation(n,t);e.uniform1i(l.uTex,0),zr={gl:e,canvas:t,prog:n,tex:o,loc:l}}catch{zr=!1}return zr}();if(!i)return!1;const{gl:n,canvas:o,tex:s,loc:l}=i,{width:a,height:r}=t;try{o.width===a&&o.height===r||(o.width=a,o.height=r),n.viewport(0,0,a,r),n.bindTexture(n.TEXTURE_2D,s),n.texImage2D(n.TEXTURE_2D,0,n.RGBA,a,r,0,n.RGBA,n.UNSIGNED_BYTE,t.data),n.uniform2f(l.uRes,a,r),n.uniform1i(l.uMode,"zoom"===e.mode?1:0),n.uniform2f(l.uDir,e.dx||0,e.dy||0),n.uniform1f(l.uLen,e.lengthPx||0),n.uniform2f(l.uCenter,e.cx||0,e.cy||0),n.uniform1f(l.uAmount,e.amount||0),n.uniform1i(l.uSteps,Math.min(Dr,Math.max(2,e.steps))),e.focus?(n.uniform4f(l.uFocus,e.focus.cx,e.focus.cy,e.focus.inner,e.focus.outer),n.uniform1i(l.uHasFocus,1)):n.uniform1i(l.uHasFocus,0),n.drawArrays(n.TRIANGLES,0,3);const i=new Uint8Array(a*r*4);return n.readPixels(0,0,a,r,n.RGBA,n.UNSIGNED_BYTE,i),t.data.set(i),!0}catch{return zr=!1,!1}}function Ur(t,e,i){if(!t)return null;const n=(void 0===t.cx?.5:t.cx)*e,o=(void 0===t.cy?.5:t.cy)*i,s=(void 0===t.radius?.25:t.radius)*Math.min(e,i);return{cx:n,cy:o,inner:s,outer:s*(1+2*Math.max(.001,void 0===t.feather?.5:t.feather))}}function jr(t,e){const i=kr(e.lut);if(!i)return console.warn(`kanvas: LUT "${e.lut}" not found; skipped`),t;return Ua(t,i,void 0===e.intensity?1:e.intensity)}function Wr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=void 0===e.size?.5:e.size,s=function(t){let e=t>>>0;return function(){e|=0,e=e+1831565813|0;let t=Math.imul(e^e>>>15,1|e);return t=t+Math.imul(t^t>>>7,61|t)^t,((t^t>>>14)>>>0)/4294967296}}(void 0===e.seed?1:e.seed),{data:l,width:a,height:r}=t,c=Math.max(1,Math.round((.4+1.6*o)*i.diagonal/1600)),u=Math.ceil(a/c),d=Math.ceil(r/c),h=new Float32Array(u*d);for(let t=0;t<h.length;t++)h[t]=2*s()-1;const b=34*n;for(let t=0;t<r;t++){const e=t/c,i=Math.min(d-1,Math.floor(e)),n=e-i,o=Math.min(d-1,i+1);for(let e=0;e<a;e++){const s=e/c,r=Math.min(u-1,Math.floor(s)),d=s-r,p=Math.min(u-1,r+1),g=h[i*u+r]*(1-d)*(1-n)+h[i*u+p]*d*(1-n)+h[o*u+r]*(1-d)*n+h[o*u+p]*d*n,m=4*(t*a+e),f=(.2126*l[m]+.7152*l[m+1]+.0722*l[m+2])/255,y=(f<.6?1:Math.max(0,1-(f-.6)/.38))*Math.min(1,f/.08);if(0===y)continue;const v=g*b*y;l[m]=Math.min(255,Math.max(0,l[m]+v)),l[m+1]=Math.min(255,Math.max(0,l[m+1]+v)),l[m+2]=Math.min(255,Math.max(0,l[m+2]+v))}}return t}function Vr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=255*(void 0===e.threshold?.85:e.threshold),s=(void 0===e.radius?.015:e.radius)*i.diagonal,[l,a,r]=function(t){const e=(t%360+360)%360/60,i=1-Math.abs(e%2-1);let n=0,o=0,s=0;return[n,o,s]=e<1?[1,i,0]:e<2?[i,1,0]:e<3?[0,1,i]:e<4?[0,i,1]:e<5?[i,0,1]:[1,0,i],[n,o,s]}(void 0===e.hue?20:e.hue),{data:c,width:u,height:d}=t,h=Or(t),b=new Float32Array(h.length);for(let t=0;t<h.length;t++)b[t]=h[t]>o?(h[t]-o)/(255-o):0;Ir(b,u,d,s);for(let t=0,e=0;t<c.length;t+=4,e++){const i=b[e]*n;i<=.002||(c[t]=255-(255-c[t])*(1-i*l),c[t+1]=255-(255-c[t+1])*(1-i*a),c[t+2]=255-(255-c[t+2])*(1-i*r))}return t}function Gr(t,e,i){const n=e.exposure||0;if(!n)return t;const{data:o,width:s,height:l}=t,a=Ur(e,s,l);if(!a)return t;const{cx:r,cy:c,inner:u,outer:d}=a,h=n/100*2,b=new Float32Array(257);for(let t=0;t<=256;t++)b[t]=Math.pow(2,h*(t/256));const p=Math.max(0,Math.floor(r-d)),g=Math.min(s-1,Math.ceil(r+d)),m=Math.max(0,Math.floor(c-d)),f=Math.min(l-1,Math.ceil(c+d)),y=d-u;for(let t=m;t<=f;t++){const e=t-c;for(let i=p;i<=g;i++){const n=Math.hypot(i-r,e);let l;if(n<=u)l=1;else{if(n>=d)continue;{const t=(n-u)/y;l=1-t*t*(3-2*t)}}const a=b[256*l|0],c=4*(t*s+i),h=o[c]*a,p=o[c+1]*a,g=o[c+2]*a;o[c]=h>255?255:h,o[c+1]=p>255?255:p,o[c+2]=g>255?255:g}}return t}function Yr(t,e,i){if(!t)return null;const n=(void 0===t.cx?.5:t.cx)*e,o=(void 0===t.cy?.5:t.cy)*i,s=(void 0===t.radius?.25:t.radius)*Math.min(e,i),l=Math.max(.001,void 0===t.feather?.5:t.feather),a=s,r=s*(1+2*l);return(t,e)=>{const i=Math.hypot(t-n,e-o);if(i<=a)return 1;if(i>=r)return 0;const s=(i-a)/(r-a);return 1-s*s*(3-2*s)}}function Xr(t,e,i){const{data:n,width:o,height:s}=t,{R:l,G:a,B:r}=e;for(let t=0,e=0;t<s;t++)for(let s=0;s<o;s++,e++){const o=i?i(s,t):0,c=4*e;n[c]=n[c]*o+l[e]*(1-o),n[c+1]=n[c+1]*o+a[e]*(1-o),n[c+2]=n[c+2]*o+r[e]*(1-o)}return t}function Kr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=n*i.diagonal,{width:s,height:l}=t,a=function(t){const{data:e,width:i,height:n}=t,o=i*n,s=new Float32Array(o),l=new Float32Array(o),a=new Float32Array(o);for(let t=0,i=0;t<e.length;t+=4,i++)s[i]=e[t],l[i]=e[t+1],a[i]=e[t+2];return{R:s,G:l,B:a}}(t);return Ir(a.R,s,l,o),Ir(a.G,s,l,o),Ir(a.B,s,l,o),Xr(t,a,Yr(e.focus,s,l))}function Zr(t,e,i,n){const{data:o,width:s,height:l}=t,a=new Uint8ClampedArray(o),r=new Float32Array(s*l),c=new Float32Array(s*l),u=new Float32Array(s*l);for(let t=0,e=0;t<l;t++)for(let n=0;n<s;n++,e++){let o=0,d=0,h=0,b=0;if(i(n,t,((t,e)=>{const i=Math.round(t),n=Math.round(e);if(i<0||n<0||i>=s||n>=l)return;const r=4*(n*s+i);o+=a[r],d+=a[r+1],h+=a[r+2],b++})),0===b){const t=4*e;r[e]=a[t],c[e]=a[t+1],u[e]=a[t+2]}else r[e]=o/b,c[e]=d/b,u[e]=h/b}return Xr(t,{R:r,G:c,B:u},Yr(n,s,l))}function Jr(t,e,i){const n=e.amount||0;if(n<=0)return t;const o=n*i.diagonal,s=Math.min(48,Math.max(4,Math.round(o/2))),l=(e.angle||0)*Math.PI/180,a=Math.cos(l),r=Math.sin(l);return Fr(t,{mode:"linear",dx:a,dy:r,lengthPx:o,steps:s,focus:Ur(e.focus,t.width,t.height)})?t:Zr(t,0,((t,e,i)=>{for(let n=0;n<s;n++){const l=(n/(s-1)-.5)*o;i(t+a*l,e+r*l)}}),e.focus)}function Qr(t,e,i){const n=e.amount||0;if(n<=0)return t;const{width:o,height:s}=t,l=(void 0===e.cx?.5:e.cx)*o,a=(void 0===e.cy?.5:e.cy)*s,r=Math.min(48,Math.max(4,Math.round(n*i.diagonal/2))),c=e.focus?{cx:void 0===e.cx?.5:e.cx,cy:void 0===e.cy?.5:e.cy,...e.focus}:void 0;return Fr(t,{mode:"zoom",cx:l,cy:a,amount:n,steps:r,focus:Ur(c,o,s)})?t:Zr(t,0,((t,e,i)=>{for(let o=0;o<r;o++){const s=1-n*(o/(r-1));i(l+(t-l)*s,a+(e-a)*s)}}),c)}let tc=!1;tc||(tc=!0,$r("lut",jr),$r("radial",Gr),$r("grain",Wr),$r("halation",Vr),$r("blur-soft",Kr),$r("blur-linear",Jr),$r("blur-zoom",Qr));const ec=24;function ic(t,e,i,n=12){const{x:o,y:s,w:l,h:a}=t,r=Math.abs(e-o)<=n,c=Math.abs(e-(o+l))<=n,u=Math.abs(i-s)<=n,d=Math.abs(i-(s+a))<=n,h=e>=o-n&&e<=o+l+n,b=i>=s-n&&i<=s+a+n;return u&&r?"nw":u&&c?"ne":d&&r?"sw":d&&c?"se":u&&h?"n":d&&h?"s":r&&b?"w":c&&b?"e":e>o&&e<o+l&&i>s&&i<s+a?"move":null}function nc(t,e,i,n){const o=Math.min(Math.max(t.x+e,0),n.w-t.w),s=Math.min(Math.max(t.y+i,0),n.h-t.h);return{...t,x:o,y:s}}const oc={nw:"nwse-resize",se:"nwse-resize",ne:"nesw-resize",sw:"nesw-resize",n:"ns-resize",s:"ns-resize",e:"ew-resize",w:"ew-resize",move:"move"};class sc{constructor(t,e){this.canvas=t,this.ctx=t.getContext("2d"),this.onChange=e||(()=>{}),this.rect=null,this.aspect=null,this.drag=null,t.addEventListener("pointerdown",(t=>this._down(t))),t.addEventListener("pointermove",(t=>this._move(t))),t.addEventListener("pointerup",(t=>this._up(t))),t.addEventListener("pointercancel",(t=>this._up(t)))}get bounds(){return{w:this.canvas.width,h:this.canvas.height}}setRect(t){const e=this.bounds;this.rect=t?nc({...t},0,0,e):{x:0,y:0,w:e.w,h:e.h},this.draw()}setAspect(t){this.aspect=t||null,this.aspect&&this.rect&&(this.rect=function(t,e,i,n=ec){if(!e)return t;const o=t.x+t.w/2,s=t.y+t.h/2;let l=t.w,a=l/e;a>t.h&&(a=t.h,l=a*e);const r=2*Math.min(o,i.w-o),c=2*Math.min(s,i.h-s);return l>r&&(l=r,a=l/e),a>c&&(a=c,l=a*e),a<n&&(a=n,l=a*e,l>r&&(l=r,a=l/e)),l<n&&(l=n,a=l/e,a>c&&(a=c,l=a*e)),nc({x:o-l/2,y:s-a/2,w:l,h:a},0,0,i)}(this.rect,this.aspect,this.bounds),this.onChange(this.rect)),this.draw()}_pos(t){const e=this.canvas.getBoundingClientRect();return{x:(t.clientX-e.left)*(this.canvas.width/e.width),y:(t.clientY-e.top)*(this.canvas.height/e.height)}}_down(t){if(!this.rect)return;const e=this._pos(t),i=ic(this.rect,e.x,e.y);i&&(this.canvas.setPointerCapture(t.pointerId),this.drag={handle:i,last:e},t.preventDefault())}_move(t){const e=this._pos(t);if(!this.drag){const t=this.rect&&ic(this.rect,e.x,e.y);return void(this.canvas.style.cursor=t?oc[t]:"crosshair")}const{handle:i,last:n}=this.drag;this.rect="move"===i?nc(this.rect,e.x-n.x,e.y-n.y,this.bounds):function(t,e,i,n,o){const{aspect:s=null,minSize:l=ec,bounds:a}=o,r=e.includes("w"),c=e.includes("e"),u=e.includes("n"),d=e.includes("s");if((r||c)&&(u||d)){const e=r?t.x+t.w:t.x,o=u?t.y+t.h:t.y,c=r?e:a.w-e,d=u?o:a.h-o;let h=Math.abs(i-e),b=Math.abs(n-o);return s?(h=Math.max(h,b*s),b=h/s,h>c&&(h=c,b=h/s),b>d&&(b=d,h=b*s),h<l&&(h=l,b=h/s),b<l&&(b=l,h=b*s),h=Math.min(h,c),b=Math.min(b,d)):(h=Math.min(Math.max(h,l),c),b=Math.min(Math.max(b,l),d)),{...t,x:r?e-h:e,y:u?o-b:o,w:h,h:b}}let{x:h,y:b,w:p,h:g}=t;if(c||r){const e=r?h+p:h,n=r?e:a.w-e;if(p=Math.min(Math.max(Math.abs(i-e),l),n),h=r?e-p:e,s){const i=t.y+t.h/2;g=p/s;const n=2*Math.min(i,a.h-i);g>n&&(g=n,p=g*s,h=r?e-p:e),g<l&&(g=l,p=g*s,h=r?e-p:e),b=i-g/2}}else{const e=u?b+g:b,i=u?e:a.h-e;if(g=Math.min(Math.max(Math.abs(n-e),l),i),b=u?e-g:e,s){const i=t.x+t.w/2;p=g*s;const n=2*Math.min(i,a.w-i);p>n&&(p=n,g=p/s,b=u?e-g:e),p<l&&(p=l,g=p/s,b=u?e-g:e),h=i-p/2}}return{...t,x:h,y:b,w:p,h:g}}(this.rect,i,e.x,e.y,{aspect:this.aspect,bounds:this.bounds}),this.drag.last=e,this.onChange(this.rect),this.draw()}_up(t){this.drag&&(this.drag=null,this.onChange(this.rect),this.draw())}draw(){const{ctx:t,rect:e}=this,{w:i,h:n}=this.bounds;if(t.clearRect(0,0,i,n),!e)return;t.fillStyle="rgba(0,0,0,0.55)",t.beginPath(),t.rect(0,0,i,n),t.rect(e.x,e.y,e.w,e.h),t.fill("evenodd"),t.strokeStyle="rgba(255,255,255,0.9)",t.lineWidth=1,t.strokeRect(e.x+.5,e.y+.5,e.w-1,e.h-1),t.strokeStyle="rgba(255,255,255,0.28)",t.beginPath();for(let i=1;i<3;i++)t.moveTo(e.x+e.w*i/3,e.y),t.lineTo(e.x+e.w*i/3,e.y+e.h),t.moveTo(e.x,e.y+e.h*i/3),t.lineTo(e.x+e.w,e.y+e.h*i/3);t.stroke(),t.fillStyle="#ffffff";const o=[[e.x,e.y],[e.x+e.w/2,e.y],[e.x+e.w,e.y],[e.x,e.y+e.h/2],[e.x+e.w,e.y+e.h/2],[e.x,e.y+e.h],[e.x+e.w/2,e.y+e.h],[e.x+e.w,e.y+e.h]];for(const[e,i]of o)t.fillRect(e-3.5,i-3.5,7,7)}}function lc(t,e,i){const n=document.createElement(t);return e&&(n.className=e),i?.appendChild(n),n}const ac=t=>`<svg class="kanvas-i" viewBox="0 0 24 24" aria-hidden="true">${t}</svg>`,rc=ac('<path d="M6 2v16h16M2 6h16v16"/>'),cc=ac('<path d="M21 12a9 9 0 11-3-6.7M21 3v5h-5"/>'),uc=ac('<path d="M12 3v18M8 7l-5 5 5 5M16 7l5 5-5 5"/>'),dc=ac('<path d="M3 12h18M7 8l5-5 5 5M7 16l5 5 5-5"/>'),hc={id:"",label:"None",state:"ready"},bc="Basic",pc=[{id:"film-warm",label:"Film Warm",category:bc,intensity:80,state:"ready"},{id:"film-muted",label:"Film Muted",category:bc,intensity:80,state:"ready"},{id:"mono-classic",label:"Mono Classic",category:bc,intensity:100,state:"ready"},...ur.filter((t=>!t.hidden)).map((({id:t,label:e,category:i,intensity:n})=>({id:t,label:e,category:i,intensity:n}))).map((t=>({...t,state:"ready"})))],gc=[{k:"exposure",n:"Exposure",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"contrast",n:"Contrast",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"highlights",n:"Highlights",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"shadows",n:"Shadows",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"saturation",n:"Saturation",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"clarity",n:"Clarity",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"sharpen",n:"Sharpen",min:0,max:100,d:0,g:"adjust",t:"adjust"},{k:"lookInt",n:"Intensity",min:0,max:100,d:80,g:"look",t:"look"},{k:"grain",n:"Grain",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"grainSize",n:"Grain size",min:0,max:100,d:50,g:"fx",t:"fx"},{k:"halation",n:"Halation",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"motion",n:"Motion",min:0,max:100,d:0,g:"fx",t:"fx"},{k:"motionAngle",n:"Angle",min:0,max:180,d:0,g:"fx",t:"fx"},{k:"motionFeather",n:"Focus feather",min:0,max:100,d:50,g:"fx",t:"fx"},{k:"radialAmount",n:"Amount",min:-100,max:100,d:0,g:"adjust",t:"adjust"},{k:"radialFeather",n:"Feather",min:0,max:100,d:50,g:"adjust",t:"adjust"}];class mc{constructor(t){const e="string"==typeof t.container?document.querySelector(t.container):t.container;if(!e)throw new Error("KanvasEditor: container not found");if(this.t="function"==typeof t.t?t.t:t=>t,this.onChange=t.onChange,this.onLoad=t.onLoad,this.onHistory=t.onHistory,this.onApply=t.onApply,this.onCancel=t.onCancel,this.maxPreview=t.maxPreview||1400,this.aspectPresets=t.aspectPresets||["free","1:1","4:5","3:2","4:3","16:9"],this.bitmap=null,this.history=null,this.sourceName="image",this._cropMode=!1,this._comparing=!1,this._renderQueued=!1,this._exportOpts={},this._ctl={},this._thumbs={},this._toastTimer=0,this._customLuts=[],this._presets=[],this._cat=null,this._builtins=!1!==t.builtins,this._loadCube=!1!==t.loadCube,this._myLooks=!1!==t.myLooks,this._thumbSrc=null,this._thumbObserver=null,this.onLooksChange=t.onLooksChange,this._looks=[],Array.isArray(t.looks))this._looks=t.looks.map((t=>"string"==typeof t?Ta(t):t)).filter(Boolean);else try{this._looks=JSON.parse(localStorage.getItem("kanvas.looks")||"[]")}catch{this._looks=[]}this._userScale=null,this._pan={x:0,y:0},this._fitScale=1,this._fullOut=null,this._regionEdit=null,this._ui=this._defaultUiState(),this._build(e),this.setTheme(t.theme||"light"),t.title&&(this._els.title.textContent=t.title),this._els.header.hidden=!t.header,t.presets&&Tr(t.presets).then((t=>{this._presets=t,this._rebuildReel(),this._drawThumbs()})).catch((t=>{console.warn("kanvas: presets could not be loaded —",t.message)}))}async load(t,e={}){try{this.bitmap=await mc.loadBitmap(t,this.t)}catch(t){throw this._toast(t.message),t}"string"==typeof t?this.sourceName=t.split("/").pop()?.split("?")[0]||"image":t instanceof File&&(this.sourceName=t.name);let i=xa(this.bitmap.width,this.bitmap.height);if(e.recipe){const t=_a(e.recipe);t&&(i=ka({...JSON.parse(Sa(t)),source:{w:this.bitmap.width,h:this.bitmap.height}}),Object.freeze(i))}return this.history=new Ca(i),this._syncUiFromRecipe(i),this._resetZoom(),this._els.empty.hidden=!0,this._els.tools.hidden=!1,this._els.viewwrap.hidden=!1,this._exitCrop(),this._requestRender(),this._drawThumbs(),this._notifyHistory(),this.onLoad?.({name:this.sourceName,width:this.bitmap.width,height:this.bitmap.height}),this}getRecipe(){return this.history?Sa(this.history.current):null}setTheme(t){this._els.root.setAttribute("data-kanvas-theme",t)}compare(t){if(this.bitmap&&this.history&&!this._cropMode)if(this._comparing=!!t,this._els.badge.hidden=!t,t){const t=this.history.current,e=ka({v:1,source:t.source,geometry:t.geometry?{...t.geometry}:void 0});this._requestRender(Object.freeze(e))}else this._requestRender()}async export(t={}){if(!this.bitmap||!this.history)throw new Error("KanvasEditor: no image loaded");const e=await async function(t,e,i={}){const n=i.format||"image/jpeg",o=void 0===i.quality?.92:i.quality,s=Pr(t,e,{maxSize:i.maxSize});return{blob:s.convertToBlob?await s.convertToBlob({type:n,quality:o}):await new Promise((t=>s.toBlob(t,n,o))),width:s.width,height:s.height,recipe:e}}(this.bitmap,this.history.current,t),i=await new Promise((t=>{const i=new FileReader;i.onload=()=>t(i.result),i.readAsDataURL(e.blob)}));return{blob:e.blob,dataUrl:i,recipe:Sa(this.history.current),width:e.width,height:e.height}}undo(){this.history?.canUndo&&(this._exitCrop(),this._exitRegionEdit(),this._syncUiFromRecipe(this.history.undo()),this._requestRender(),this._notifyHistory())}redo(){this.history?.canRedo&&(this._exitCrop(),this._exitRegionEdit(),this._syncUiFromRecipe(this.history.redo()),this._requestRender(),this._notifyHistory())}reset(){this.bitmap&&this.history&&(this._exitCrop(),this._exitRegionEdit(),this._resetZoom(),this._syncUiFromRecipe(this.history.push(xa(this.bitmap.width,this.bitmap.height))),this._requestRender(),this._notifyHistory())}destroy(){document.removeEventListener("keydown",this._onKey),document.removeEventListener("keyup",this._onKeyUp),this._resizeObs?.disconnect(),this._els.root.remove(),this.bitmap=null,this.history=null}saveLook(t){if(!this.history)return null;const e=function(t,e){const i={v:ma,kind:"look",name:String(t||"")};return e.adjust&&Object.keys(e.adjust).length&&(i.adjust=wa(e.adjust)),e.effects&&e.effects.length&&(i.effects=wa(e.effects).map((t=>("grain"===t.type&&delete t.seed,t)))),va(i)}(t,this.history.current);return this._looks=[...this._looks.filter((t=>t.name!==e.name)),e],this._persistLooks(),this._renderLookChips?.(),e}applyLookNow(t){if(!this.bitmap||!this.history)return!1;try{const e=Aa(this.history.current,t);return this.history.push(e),this._syncUiFromRecipe(e),this._requestRender(),this.onChange?.(Sa(e)),this._notifyHistory(),!0}catch{return!1}}clearTreatment(){if(!this.bitmap||!this.history)return;this._exitRegionEdit();const t=this._ui;for(const e of gc)t[e.k]=e.d;t.temperature=0,t.tint=0,t.look="",t.motionFocus=null,t.radialRegion=null,t.lookName="",this._syncControls(),this._commit(),this._drawThumbs()}getLooks(){return[...this._looks]}removeLook(t){this._looks=this._looks.filter((e=>e.name!==t)),this._persistLooks(),this._renderLookChips?.()}_persistLooks(){if(this.onLooksChange)this.onLooksChange(this.getLooks());else try{localStorage.setItem("kanvas.looks",JSON.stringify(this._looks))}catch{}}async _clipboard(t){try{return await navigator.clipboard.writeText(t),!0}catch{return!1}}copyEdits(){return this.getRecipe()}applyEdits(t){if(!this.bitmap||!this.history)return!1;const e=_a(t);if(!e)return!1;const i=ka({...JSON.parse(Sa(e)),source:{w:this.bitmap.width,h:this.bitmap.height}});return Object.freeze(i),this.history.push(i),this._syncUiFromRecipe(i),this._requestRender(),this.onChange?.(Sa(i)),this._notifyHistory(),!0}static async loadBitmap(t,e=(t=>t)){if("undefined"!=typeof ImageBitmap&&t instanceof ImageBitmap)return t;if(t instanceof Blob)return createImageBitmap(t);const i="string"==typeof t?t:t instanceof HTMLImageElement?t.currentSrc||t.src:null;if(!i)throw new Error("KanvasEditor: unsupported source");if(i.startsWith("data:")||i.startsWith("blob:")){const t=await(await fetch(i)).blob();return createImageBitmap(t)}const n=new Image;return n.crossOrigin="anonymous",await new Promise(((t,o)=>{n.onload=t,n.onerror=()=>o(new Error(e("Could not load the image.")+" "+i+" — "+e("For images on another domain the server must send CORS headers (Access-Control-Allow-Origin), or editing and export are blocked by the browser."))),n.src=i})),createImageBitmap(n)}static open(t){return new Promise(((e,i)=>{const n=lc("div","kanvas-modal-backdrop",document.body);let o=!1;const s=t=>{o||(o=!0,l.destroy(),n.remove(),e(t))},l=new mc({container:n,theme:t.theme,title:t.title,header:!0,onCancel:()=>s(null),onApply:async e=>{try{if(t.upload){l._setBusy(l.t("Saving…"));const i=await t.upload(e.blob,{recipe:e.recipe,width:e.width,height:e.height});e.url="string"==typeof i?i:i?.url}s(e)}catch(t){l._setBusy(null),i(t),s(null)}}});n.addEventListener("pointerdown",(t=>{t.target===n&&s(null)})),l._exportOpts=t.export||{},l.load(t.src,{recipe:t.recipe}).catch((t=>{setTimeout((()=>s(null)),2200),i(t)}))}))}_defaultUiState(){const t={rotate90:0,flipH:!1,flipV:!1,straighten:0,crop:null,temperature:0,tint:0,look:"",lookName:"",motionFocus:null,radialRegion:null,grainSeed:Math.floor(4294967295*Math.random())};for(const e of gc)t[e.k]=e.d;return t}_buildRecipe(){const t=this._ui,e=this.bitmap,i={v:1,source:{w:e.width,h:e.height}},n={};t.rotate90&&(n.rotate90=t.rotate90),t.flipH&&(n.flipH=!0),t.flipV&&(n.flipV=!0),t.straighten&&(n.straighten=t.straighten),t.crop&&(n.crop={...t.crop}),Object.keys(n).length&&(i.geometry=n);const o={};for(const e of["exposure","contrast","highlights","shadows","saturation","clarity","sharpen","temperature","tint"])t[e]&&(o[e]=t[e]);Object.keys(o).length&&(i.adjust=o),t.lookName&&(i.meta={look:t.lookName});const s=[];if(t.radialRegion&&t.radialAmount&&s.push({type:"radial",...t.radialRegion,feather:t.radialFeather/100,exposure:t.radialAmount}),t.look&&s.push({type:"lut",lut:t.look,intensity:t.lookInt/100}),t.motion){const e={type:"blur-linear",angle:t.motionAngle,amount:t.motion/100*.06};t.motionFocus&&(e.focus={...t.motionFocus,feather:t.motionFeather/100}),s.push(e)}return t.halation&&s.push({type:"halation",amount:t.halation/100}),t.grain&&s.push({type:"grain",amount:t.grain/100*.6,size:t.grainSize/100,seed:t.grainSeed}),s.length&&(i.effects=s),Object.freeze(ka(i))}_syncUiFromRecipe(t){const e=this._ui,i=t.geometry||{},n=t.adjust||{},o=t.effects||[];e.rotate90=i.rotate90||0,e.flipH=!!i.flipH,e.flipV=!!i.flipV,e.straighten=i.straighten||0,e.crop=i.crop?{...i.crop}:null;for(const t of["exposure","contrast","highlights","shadows","saturation","clarity","sharpen","temperature","tint"])e[t]=n[t]||0;e.lookName=t.meta?.look||"";const s=o.find((t=>"lut"===t.type));e.look=s?s.lut:"",e.lookInt=s?Math.round(100*(s.intensity??1)):80;const l=o.find((t=>"grain"===t.type));e.grain=l?Math.round(l.amount/.6*100):0,e.grainSize=l?Math.round(100*(l.size??.5)):50,void 0!==l?.seed&&(e.grainSeed=l.seed);const a=o.find((t=>"halation"===t.type));e.halation=a?Math.round(100*a.amount):0;const r=o.find((t=>"blur-linear"===t.type));e.motion=r?Math.round(r.amount/.06*100):0,e.motionAngle=r&&r.angle||0,r?.focus?(e.motionFocus={cx:r.focus.cx??.5,cy:r.focus.cy??.5,radius:r.focus.radius??.25},e.motionFeather=Math.round(100*(r.focus.feather??.5))):(e.motionFocus=null,e.motionFeather=50);const c=o.find((t=>"radial"===t.type));c?(e.radialRegion={cx:c.cx??.5,cy:c.cy??.5,radius:c.radius??.25},e.radialAmount=Math.round(c.exposure??0),e.radialFeather=Math.round(100*(c.feather??.5))):(e.radialRegion=null,e.radialAmount=0,e.radialFeather=50),"focus"!==this._regionEdit||e.motionFocus||this._exitRegionEdit(),"radial"!==this._regionEdit||e.radialRegion||this._exitRegionEdit(),this._syncControls()}_commit(){if(!this.bitmap||!this.history)return;const t=this._buildRecipe();Sa(t)!==Sa(this.history.current)&&(this.history.push(t),this.onChange?.(Sa(t)),this._notifyHistory()),this._requestRender()}_preview(){this._requestRender(this._buildRecipe())}_notifyHistory(){this._renderLookChips?.(),this.onHistory?.({canUndo:!!this.history?.canUndo,canRedo:!!this.history?.canRedo})}_requestRender(t){this._renderQueued||(this._renderQueued=!0,requestAnimationFrame((()=>{if(this._renderQueued=!1,!this.bitmap||!this.history)return;let e=t||this.history.current;if(this._cropMode){const t=e.geometry?{...e.geometry}:{};delete t.crop,e=ka({...JSON.parse(Sa(e)),geometry:Object.keys(t).length?t:void 0})}const i=Ra({w:this.bitmap.width,h:this.bitmap.height},e.geometry||{});this._fullOut={w:i.outW,h:i.outH};const n=this._userScale?Math.min(4096,Math.max(i.outW,i.outH)):this.maxPreview,o=Pr(this.bitmap,e,{maxSize:n}),s=this._els.view;if(s.width=o.width,s.height=o.height,s.getContext("2d")?.drawImage(o,0,0),this._fitView(),this._cropMode){const t=this._els.overlay;t.width=o.width,t.height=o.height,this._cropper.draw()}this._regionEdit&&this._drawRegionOverlay()})))}_resetZoom(){this._userScale=null,this._pan={x:0,y:0}}_setZoom(t,e,i){const n=this._els.view.getBoundingClientRect(),o=this._userScale??this._fitScale;let s=Math.min(8,Math.max(this._fitScale,t));const l=null===this._userScale,a=e-(n.left+n.width/2),r=i-(n.top+n.height/2);this._pan.x=this._pan.x+a*(1-s/o),this._pan.y=this._pan.y+r*(1-s/o),s<=1.02*this._fitScale?(this._userScale=null,this._pan={x:0,y:0}):this._userScale=s;const c=null===this._userScale;this._fitView(),l!==c&&this._requestRender()}_fitView(){const t=this._els.stage,e=this._els.view;if(!e.width||!e.height)return;const i=Math.max(50,t.clientWidth-36),n=Math.max(50,t.clientHeight-36-52),o=this._fullOut||{w:e.width,h:e.height},s=Math.min(i/e.width,n/e.height,1);this._fitScale=s*e.width/o.w;const l=this._userScale??this._fitScale,a=l*o.w/e.width,r=e.width*a,c=e.height*a,u=Math.max(0,(r-i)/2+24),d=Math.max(0,(c-n)/2+24);this._pan.x=Math.min(u,Math.max(-u,this._pan.x)),this._pan.y=Math.min(d,Math.max(-d,this._pan.y)),this._els.viewwrap.style.transform=`translate(${Math.round(this._pan.x)}px, ${Math.round(this._pan.y)}px)`,e.style.width=Math.round(r)+"px",e.style.height=Math.round(c)+"px",e.style.imageRendering=l>1.5?"pixelated":"auto",e.style.cursor=this._cropMode?"":this._userScale?"grab":"",this._els.zoomChip&&(this._els.zoomChip.textContent=this._userScale?Math.round(100*l)+"%":this.t("Fit"),this._els.zoomChip.hidden=!this.bitmap),e.style.maxWidth="none",e.style.maxHeight="none",e.style.minWidth="0",e.style.minHeight="0";const h=this._els.overlay;h.style.maxWidth="none",h.style.maxHeight="none"}_thumbBase(){if(!this.bitmap)return null;if(this._thumbSrc)return this._thumbSrc;const t=120,e=document.createElement("canvas");e.width=t,e.height=84;const i=e.getContext("2d"),n=Math.max(t/this.bitmap.width,84/this.bitmap.height);return i.drawImage(this.bitmap,(t-this.bitmap.width*n)/2,(84-this.bitmap.height*n)/2,this.bitmap.width*n,this.bitmap.height*n),this._thumbSrc=i.getImageData(0,0,t,84),this._thumbSrc}_drawThumb(t){const e=this._thumbs[t.id],i=this._thumbBase();if(!e||!i)return;const n=new ImageData(new Uint8ClampedArray(i.data),i.width,i.height),o=t.id?kr(t.id):null;o&&Ua(n,o,.9),e.classList.toggle("kanvas-pending",!!t.id&&!o),e.getContext("2d")?.putImageData(n,0,0)}_drawThumbs(){if(this.bitmap){this._thumbSrc=null;for(const t of this._visibleEntries())this._drawThumb(t)}}_setBusy(t){this._els.busy.hidden=!t,t&&(this._els.busy.textContent=t)}_toast(t){const e=this._els.toast;e.textContent=t,e.classList.add("kanvas-on"),clearTimeout(this._toastTimer),this._toastTimer=window.setTimeout((()=>e.classList.remove("kanvas-on")),2e3)}_build(t){this._els={};const e=this._els.root=lc("div","kanvas-editor",t),i=this._els.header=lc("div","kanvas-header",e);this._els.title=lc("span","kanvas-title",i),this._els.title.textContent=this.t("Edit image");const n=lc("button","kanvas-btn",i);n.textContent=this.t("Cancel"),n.addEventListener("click",(()=>this.onCancel?.()));const o=lc("button","kanvas-btn kanvas-solid",i);o.textContent=this.t("OK"),o.addEventListener("click",(async()=>{if(this.bitmap){o.setAttribute("disabled",""),this._setBusy(this.t("Rendering…"));try{const t=await this.export(this._exportOpts);this._setBusy(null),this.onApply?.(t)}finally{o.removeAttribute("disabled")}}else this.onCancel?.()}));const s=lc("div","kanvas-body",e);this._buildStage(s),this._buildPanel(s),this._onKey=t=>{if(this._regionEdit&&("Escape"===t.key||"Enter"===t.key))return t.preventDefault(),this._exitRegionEdit(),void this._requestRender();this._cropMode&&"Enter"===t.key&&(t.preventDefault(),this._applyCrop()),this._cropMode&&"Escape"===t.key&&(t.preventDefault(),this._exitCrop(),this._requestRender()),"\\"!==t.key||t.repeat||this.compare(!0),(t.ctrlKey||t.metaKey)&&"z"===t.key.toLowerCase()&&(t.preventDefault(),t.shiftKey?this.redo():this.undo())},this._onKeyUp=t=>{"\\"===t.key&&this.compare(!1)},document.addEventListener("keydown",this._onKey),document.addEventListener("keyup",this._onKeyUp)}_buildStage(t){const e=this._els.stage=lc("div","kanvas-stage",t),i=this._els.viewwrap=lc("div","kanvas-viewwrap",e);i.hidden=!0;const n=this._els.view=lc("canvas","kanvas-view",i);(this._els.overlay=lc("canvas","kanvas-overlay",i)).hidden=!0;const o=this._els.empty=lc("div","kanvas-empty",e);lc("h2","",o).textContent=this.t("Click or drop an image to start");lc("p","",o).textContent=this.t("Crop it, set white balance, adjust, pick a look, then save the result.");const s=lc("button","kanvas-btn kanvas-solid",o);s.textContent=this.t("Open image");const l=lc("input","",e);l.type="file",l.accept="image/*",l.hidden=!0,s.addEventListener("click",(()=>l.click())),l.addEventListener("change",(()=>{l.files?.[0]&&this.load(l.files[0])})),this._els.file=l;for(const t of["dragenter","dragover"])e.addEventListener(t,(t=>{t.preventDefault(),e.classList.add("kanvas-dropping")}));for(const t of["dragleave","drop"])e.addEventListener(t,(t=>{t.preventDefault(),e.classList.remove("kanvas-dropping")}));e.addEventListener("drop",(t=>{const e=t.dataTransfer?.files?.[0];e&&this.load(e)})),this._resizeObs=new ResizeObserver((()=>this._fitView())),this._resizeObs.observe(e);const a=this._els.badge=lc("div","kanvas-compare-badge",e);a.textContent=this.t("original"),a.hidden=!0;(this._els.busy=lc("div","kanvas-busy",e)).hidden=!0,this._els.toast=lc("div","kanvas-toast",e);(this._els.overlay2=lc("canvas","kanvas-overlay kanvas-overlay2",i)).hidden=!0;const r=this._els.zoomChip=lc("button","kanvas-zoom",e);r.textContent=this.t("Fit"),r.hidden=!0,r.title=this.t("Click: toggle 100% / fit. Wheel on the photo zooms, drag pans."),r.addEventListener("click",(()=>{if(!this.bitmap)return;const t=n.getBoundingClientRect();this._userScale?(this._resetZoom(),this._fitView(),this._requestRender()):this._setZoom(1,t.left+t.width/2,t.top+t.height/2)})),e.addEventListener("wheel",(t=>{if(!this.bitmap)return;t.preventDefault();const e=this._userScale??this._fitScale;this._setZoom(e*Math.exp(.0016*-t.deltaY),t.clientX,t.clientY)}),{passive:!1}),n.addEventListener("dblclick",(t=>{this.bitmap&&(this._userScale?(this._resetZoom(),this._fitView(),this._requestRender()):this._setZoom(1,t.clientX,t.clientY))}));let c=null;n.addEventListener("pointerdown",(t=>{this._cropMode||(this._userScale?(c={x:t.clientX,y:t.clientY},n.setPointerCapture(t.pointerId),n.style.cursor="grabbing"):this.compare(!0))})),n.addEventListener("pointermove",(t=>{c&&(this._pan.x+=t.clientX-c.x,this._pan.y+=t.clientY-c.y,c={x:t.clientX,y:t.clientY},this._fitView())}));const u=()=>{c?(c=null,n.style.cursor="grab"):this._comparing&&this.compare(!1)};n.addEventListener("pointerup",u),n.addEventListener("pointerleave",u),this._buildRegionOverlay(),this._buildTools(e)}_buildTools(t){const e=this._els.tools=lc("div","kanvas-tools",t);e.hidden=!0;const i=this._els.cropBtn=lc("button","",e);i.innerHTML=rc+this.t("Crop"),i.setAttribute("aria-pressed","false");const n=this._els.cropSet=lc("span","kanvas-cropset",e),o=this._els.aspectSel=lc("select","kanvas-sel",n);o.setAttribute("aria-label",this.t("Aspect ratio"));for(const t of this.aspectPresets){const e=lc("option","",o);e.value=t,e.textContent="free"===t?this.t("Free"):t}const s=lc("button","kanvas-apply",n);s.textContent=this.t("Apply");const l=lc("button","",n);l.textContent=this.t("Cancel");const a=this._els.cropClear=lc("button","",n);a.textContent=this.t("Clear"),a.hidden=!0,lc("span","kanvas-div",e);const r=lc("button","",e);r.innerHTML=cc+this.t("Rotate 90°");const c=this._els.flipH=lc("button","",e);c.innerHTML=uc+this.t("Flip H"),c.setAttribute("aria-pressed","false");const u=this._els.flipV=lc("button","",e);u.innerHTML=dc+this.t("Flip V"),u.setAttribute("aria-pressed","false"),lc("span","kanvas-div",e);const d=lc("span","kanvas-straight",e);d.append(this.t("Straighten"));const h=lc("span","kanvas-strack",d);lc("span","kanvas-bar",h),lc("span","kanvas-tick",h);const b=lc("span","kanvas-fill",h),p=lc("input","",h);p.type="range",p.min="-15",p.max="15",p.step="0.1",p.value="0",p.setAttribute("aria-label",this.t("Straighten"));const g=lc("b","",d);g.textContent="0";const m=()=>{const t=this._ui.straighten;g.textContent=(t>0?"+":"")+t.toFixed(1).replace(/\.0$/,"");const e=(t+15)/30*100;b.style.left=Math.min(50,e)+"%",b.style.width=Math.abs(e-50)+"%"};this._strUI=m,this._strInput=p,p.addEventListener("input",(()=>{this._ui.straighten=parseFloat(p.value),m(),this.bitmap&&this._preview()})),p.addEventListener("change",(()=>{this.bitmap&&this._commit()})),this._cropper=new sc(this._els.overlay,(()=>{})),i.addEventListener("click",(()=>this._cropMode?(this._exitCrop(),this._requestRender()):this._enterCrop())),s.addEventListener("click",(()=>this._applyCrop())),l.addEventListener("click",(()=>{this._exitCrop(),this._requestRender()})),a.addEventListener("click",(()=>{this._ui.crop=null,this._exitCrop(),this._commit()})),o.addEventListener("change",(()=>{if(!this._cropMode)return;const t=qa(o.value),e=this._els.overlay;if(t&&this._cropper.rect&&this._cropper.rect.w>=e.width-1&&this._cropper.rect.h>=e.height-1){const i=function(t,e,i){if(!t||t<=0)return{x:0,y:0,w:1,h:1};const n=e/i;let o,s;return t>n?(o=1,s=n/t):(s=1,o=t/n),{x:(1-o)/2,y:(1-s)/2,w:o,h:s}}(t,e.width,e.height);this._cropper.setRect({x:i.x*e.width,y:i.y*e.height,w:i.w*e.width,h:i.h*e.height})}this._cropper.setAspect(t)})),r.addEventListener("click",(()=>{var t;this._exitCrop(),this._exitRegionEdit(),this._resetZoom(),this._ui.rotate90=(this._ui.rotate90+1)%4,this._ui.crop=(t=this._ui.crop)?{...t,x:1-(t.y+t.h),y:t.x,w:t.h,h:t.w,aspect:Ia(t.aspect)}:t,this.bitmap&&(this._commit(),this._drawThumbs()),this._syncControls()})),c.addEventListener("click",(()=>{var t;this._exitCrop(),this._ui.flipH=!this._ui.flipH,this._ui.crop=(t=this._ui.crop)?{...t,x:1-(t.x+t.w)}:t,this.bitmap&&this._commit(),this._syncControls()})),u.addEventListener("click",(()=>{var t;this._exitCrop(),this._ui.flipV=!this._ui.flipV,this._ui.crop=(t=this._ui.crop)?{...t,y:1-(t.y+t.h)}:t,this.bitmap&&this._commit(),this._syncControls()}))}_region(){return"focus"===this._regionEdit?this._ui.motionFocus:"radial"===this._regionEdit?this._ui.radialRegion:null}_regionFeather(){return("radial"===this._regionEdit?this._ui.radialFeather:this._ui.motionFeather)/100}_buildRegionOverlay(){const t=this._els.overlay2;let e=null;const i=e=>{const i=t.getBoundingClientRect();return{x:(e.clientX-i.left)*(t.width/i.width),y:(e.clientY-i.top)*(t.height/i.height)}},n=()=>{const e=this._region();return e&&{cx:e.cx*t.width,cy:e.cy*t.height,r:e.radius*Math.min(t.width,t.height)}};t.addEventListener("pointerdown",(o=>{const s=n();if(!s)return;const l=i(o),a=Math.hypot(l.x-s.cx,l.y-s.cy);e={kind:Math.abs(a-s.r)<16?"resize":"move"},t.setPointerCapture(o.pointerId),"move"===e.kind&&this._regionMoveTo(l),o.preventDefault()})),t.addEventListener("pointermove",(o=>{const s=n();if(!s)return;const l=i(o);if(e)if("move"===e.kind)this._regionMoveTo(l);else{const e=this._region();e.radius=Math.min(.9,Math.max(.04,Math.hypot(l.x-e.cx*t.width,l.y-e.cy*t.height)/Math.min(t.width,t.height))),this._drawRegionOverlay(),this._preview()}else{const e=Math.hypot(l.x-s.cx,l.y-s.cy);t.style.cursor=Math.abs(e-s.r)<16?"ew-resize":"move"}}));const o=()=>{e&&(e=null,this._commit())};t.addEventListener("pointerup",o),t.addEventListener("pointercancel",o)}_regionMoveTo(t){const e=this._els.overlay2,i=this._region();i&&(i.cx=Math.min(1,Math.max(0,t.x/e.width)),i.cy=Math.min(1,Math.max(0,t.y/e.height)),this._drawRegionOverlay(),this._preview())}_drawRegionOverlay(){if(!this._regionEdit)return;const t=this._els.overlay2,e=this._els.view;t.width===e.width&&t.height===e.height||(t.width=e.width,t.height=e.height);const i=t.getContext("2d"),n=this._region();if(!i||!n)return;const o=t.width,s=t.height,l=n.cx*o,a=n.cy*s,r=n.radius*Math.min(o,s),c=r*(1+2*this._regionFeather()),u=Math.max(1,o/700);if(i.clearRect(0,0,o,s),i.strokeStyle="rgba(255,255,255,0.95)",i.lineWidth=1.6*u,i.shadowColor="rgba(0,0,0,0.45)",i.shadowBlur=3*u,i.beginPath(),i.arc(l,a,r,0,2*Math.PI),i.stroke(),i.setLineDash([5*u,5*u]),i.lineWidth=u,i.strokeStyle="rgba(255,255,255,0.6)",i.beginPath(),i.arc(l,a,c,0,2*Math.PI),i.stroke(),i.setLineDash([]),i.shadowBlur=0,i.fillStyle="rgba(255,255,255,0.95)",i.beginPath(),i.arc(l,a,3*u,0,2*Math.PI),i.fill(),"radial"===this._regionEdit){const t=this._ui.radialAmount;t&&(i.font=`${Math.max(11,11*u)}px system-ui, sans-serif`,i.fillStyle="rgba(255,255,255,0.9)",i.textAlign="center",i.fillText((t>0?"+":"")+t,l,a-8*u))}}_enterRegionEdit(t){this.bitmap&&this._regionEdit!==t&&(this._exitCrop(),"focus"!==t||this._ui.motionFocus||(this._ui.motionFocus={cx:.5,cy:.4,radius:.25},this._ui.motion||(this._ui.motion=35)),"radial"!==t||this._ui.radialRegion||(this._ui.radialRegion={cx:.5,cy:.45,radius:.22},this._ui.radialAmount||(this._ui.radialAmount=30)),this._regionEdit=t,this._els.overlay2.hidden=!1,this._syncControls(),this._commit(),requestAnimationFrame((()=>this._drawRegionOverlay())))}_exitRegionEdit(){this._regionEdit&&(this._regionEdit=null,this._els.overlay2.hidden=!0,this._syncRegionUi())}_syncRegionUi(){const t=!!this._ui.motionFocus;this._els.focusBtn?.setAttribute("aria-pressed",String("focus"===this._regionEdit)),this._els.focusRemove&&(this._els.focusRemove.hidden=!t);const e=this._ctl.motionFeather;e&&(e.el.style.display=t?"":"none");const i=!!this._ui.radialRegion;this._els.radialBtn?.setAttribute("aria-pressed",String("radial"===this._regionEdit)),this._els.radialRemove&&(this._els.radialRemove.hidden=!i);for(const t of["radialAmount","radialFeather"]){const e=this._ctl[t];e&&(e.el.style.display=i?"":"none")}}_buildPanel(t){const e=lc("div","kanvas-panel",t),i=lc("div","kanvas-tabs",e);i.setAttribute("role","tablist");const n={};this._dots={};for(const[t,e]of[["adjust","Adjust"],["fx","Effects"]]){const o=lc("button","",i);o.setAttribute("role","tab"),o.setAttribute("aria-selected","adjust"===t?"true":"false"),o.append(this.t(e)),this._dots[t]=lc("i","kanvas-dot",o),o.addEventListener("click",(()=>{for(const t of i.children)t.setAttribute("aria-selected",t===o?"true":"false");for(const[e,i]of Object.entries(n))i.classList.toggle("kanvas-on",e===t)}))}const o=n.adjust=lc("div","kanvas-pane kanvas-on",e);lc("p","kanvas-grp",o).textContent=this.t("White balance"),this._buildWbPad(o);lc("p","kanvas-grp kanvas-mt",o).textContent=this.t("Adjust");const s=lc("div","",o),l=n.fx=lc("div","kanvas-pane",e);lc("p","kanvas-grp",l).textContent=this.t("Look"),this._buildReel(l);const a=lc("div","",l);this._myLooks&&this._buildMyLooks(l,a);lc("p","kanvas-grp kanvas-mt",l).textContent=this.t("Effects");const r=lc("div","",l);lc("p","kanvas-hint",l).innerHTML=this.t("Hold the backslash key or press-and-hold the photo to see the original.")+" "+this.t("Wheel zooms to real pixels, drag pans, double-click toggles 100%.")+" "+this.t("Double-click a control name to reset it.")+" "+this.t("Enter applies a crop, Esc cancels, Ctrl+Z undoes.");const c={adjust:s,look:a,fx:r};for(const t of gc)this._buildSlider(c[t.t],t);const u=lc("div","kanvas-focusrow",r);r.insertBefore(u,this._ctl.motionFeather.el);const d=this._els.focusBtn=lc("button","kanvas-btn",u);d.textContent=this.t("Focus area"),d.setAttribute("aria-pressed","false"),d.title=this.t("Keep a region sharp while the rest streaks — drag it on the photo"),d.addEventListener("click",(()=>"focus"===this._regionEdit?(this._exitRegionEdit(),this._requestRender()):this._enterRegionEdit("focus")));const h=this._els.focusRemove=lc("button","kanvas-btn",u);h.textContent=this.t("Remove"),h.hidden=!0,h.addEventListener("click",(()=>{this._ui.motionFocus=null,this._exitRegionEdit(),this._commit(),this._syncControls()}));const b=this._els.radialGrp=lc("p","kanvas-grp kanvas-mt",s);b.textContent=this.t("Local light"),s.insertBefore(b,this._ctl.radialAmount.el);const p=lc("div","kanvas-focusrow",s);s.insertBefore(p,this._ctl.radialAmount.el);const g=this._els.radialBtn=lc("button","kanvas-btn",p);g.textContent=this.t("Radial light"),g.setAttribute("aria-pressed","false"),g.title=this.t("Brighten or darken one area — drag the circle on the photo"),g.addEventListener("click",(()=>"radial"===this._regionEdit?(this._exitRegionEdit(),this._requestRender()):this._enterRegionEdit("radial")));const m=this._els.radialRemove=lc("button","kanvas-btn",p);m.textContent=this.t("Remove"),m.hidden=!0,m.addEventListener("click",(()=>{this._ui.radialRegion=null,this._ui.radialAmount=0,this._exitRegionEdit(),this._commit(),this._syncControls()})),this._syncRegionUi()}_buildMyLooks(t,e){lc("p","kanvas-grp kanvas-mt",t).textContent=this.t("My looks");const i=lc("div","kanvas-chips",t),n=lc("div","kanvas-focusrow",t),o=lc("button","kanvas-btn",n);o.textContent=this.t("Save look…"),o.title=this.t("Save the current treatment (color + effects) for reuse");const s=lc("button","kanvas-btn",n);s.textContent=this.t("Import…"),s.title=this.t("Paste a shared look string");const l=lc("div","kanvas-inline-form",t);l.hidden=!0;const a=lc("input","kanvas-field",l),r=lc("button","kanvas-btn kanvas-solid",l);r.textContent=this.t("OK");const c=lc("button","kanvas-btn",l);c.textContent=this.t("Cancel");let u=null;const d=(t,e,i)=>{u=t,a.placeholder=e,a.value=i||"",l.hidden=!1,a.focus(),a.select()},h=()=>{l.hidden=!0,u=null};c.addEventListener("click",h),a.addEventListener("keydown",(t=>{"Enter"===t.key&&(t.preventDefault(),r.click()),"Escape"===t.key&&(t.preventDefault(),h()),t.stopPropagation()})),r.addEventListener("click",(()=>{const t=a.value.trim();if(t){if("save"===u)this.saveLook(t),this._toast(this.t("Look saved"));else if("import"===u){const e=Ta(t);if(!e)return void this._toast(this.t("Not a valid look string"));this._looks=[...this._looks.filter((t=>t.name!==e.name)),e],this._persistLooks(),this._renderLookChips(),this.bitmap&&this.applyLookNow(e),this._toast(this.t("Look added"))}h()}})),o.addEventListener("click",(()=>{this.bitmap?d("save",this.t("Name this look"),this.t("Look")+" "+(this._looks.length+1)):this._toast(this.t("Open an image first"))})),s.addEventListener("click",(()=>d("import","kanvas-look:…",""))),this._renderLookChips=()=>{if(i.textContent="",!this._looks.length){return void(lc("span","kanvas-chips-empty",i).textContent=this.t("Nothing saved yet."))}const t=this.history?.current?.meta?.look;for(const e of this._looks){const n=!!e.name&&e.name===t,o=lc("span","kanvas-chip",i),s=lc("button","kanvas-chip-name",o);s.textContent=e.name||this.t("Look"),s.setAttribute("aria-pressed",String(n)),s.title=n?this.t("This look is on the photo — click to take it back off"):this.t("Apply this look"),s.addEventListener("click",(()=>{if(this.bitmap)return n?(this.clearTreatment(),void this._toast(this.t("Look removed — crop and framing kept"))):void(this.applyLookNow(e)?this._toast(this.t("Look applied")):this._toast(this.t("Could not apply this look")));this._toast(this.t("Open an image first"))}));const l=lc("button","kanvas-chip-icon",o);l.textContent="⧉",l.title=this.t("Copy shareable string"),l.addEventListener("click",(async()=>{await this._clipboard(La(e))?this._toast(this.t("Look string copied — share it anywhere")):this._toast(this.t("Clipboard blocked by the browser"))}));const a=lc("button","kanvas-chip-icon",o);a.textContent="×",a.title=this.t("Remove"),a.addEventListener("click",(()=>{this.removeLook(e.name),this._toast(this.t("Look removed"))}))}},this._renderLookChips()}_buildSlider(t,e){const i=lc("div","kanvas-ctl",t),n=lc("div","kanvas-top",i),o=lc("label","",n);o.textContent=this.t(e.n);const s=lc("span","kanvas-val",n),l=lc("div","kanvas-track",i);lc("span","kanvas-bar",l);const a=lc("span","kanvas-tick",l),r=lc("span","kanvas-fill",l),c=lc("input","",l);c.type="range",c.min=String(e.min),c.max=String(e.max),c.step="1",c.value=String(e.d),c.setAttribute("aria-label",this.t(e.n)),this._ctl[e.k]={el:i,inp:c,val:s,fill:r,tick:a,def:e},c.addEventListener("input",(()=>{this._ui[e.k]=+c.value,this._syncSlider(e.k),("motionFeather"===e.k&&"focus"===this._regionEdit||("radialFeather"===e.k||"radialAmount"===e.k)&&"radial"===this._regionEdit)&&this._drawRegionOverlay(),this.bitmap&&this._preview()})),c.addEventListener("change",(()=>{this.bitmap&&this._commit()})),o.addEventListener("dblclick",(()=>{this._ui[e.k]=e.d,c.value=String(e.d),this._syncSlider(e.k),this.bitmap&&this._commit()})),this._syncSlider(e.k)}_syncSlider(t){const e=this._ctl[t];if(!e)return;const{min:i,max:n,d:o}=e.def,s=this._ui[t],l=i<0,a=l?50:0,r=(s-i)/(n-i)*100;e.tick.style.display=l?"block":"none",e.tick.style.left=a+"%";const c=Math.min(a,r),u=Math.max(a,r);e.fill.style.left=c+"%",e.fill.style.width=u-c+"%",e.val.textContent=(l&&s>0?"+":"")+s,e.el.classList.toggle("kanvas-dirty",s!==o),this._syncDots()}_syncDots(){const t={adjust:!1,fx:!1};for(const e of gc)("motionFeather"!==e.k||this._ui.motionFocus)&&("radialAmount"!==e.k&&"radialFeather"!==e.k||this._ui.radialRegion)&&"look"!==e.g&&this._ui[e.k]!==e.d&&(t[e.g]=!0);this._ui.motionFocus&&(t.fx=!0),this._ui.radialRegion&&(t.adjust=!0),0===this._ui.temperature&&0===this._ui.tint||(t.adjust=!0);for(const[e,i]of Object.entries(this._dots||{}))i.classList.toggle("kanvas-on",!!t[e])}_buildWbPad(t){const e=lc("div","kanvas-pad",t);lc("span","kanvas-cx",e),lc("span","kanvas-cy",e);const i=this._els.knob=lc("span","kanvas-knob",e);i.style.left="50%",i.style.top="50%";const n=lc("div","kanvas-wbrow",t),o=lc("div","kanvas-rd",n);lc("span","",o).textContent=this.t("Temp"),this._els.wbT=lc("b","",o);const s=lc("div","kanvas-rd",n);lc("span","",s).textContent=this.t("Tint"),this._els.wbN=lc("b","",s);const l=lc("button","kanvas-btn",n);l.textContent=this.t("Reset"),l.addEventListener("click",(()=>{this._ui.temperature=0,this._ui.tint=0,this._syncWb(),this.bitmap&&this._commit()}));let a=!1;const r=(t,i)=>{const n=e.getBoundingClientRect(),o=Math.min(1,Math.max(0,(t.clientX-n.left)/n.width)),s=Math.min(1,Math.max(0,(t.clientY-n.top)/n.height));this._ui.temperature=Math.round(200*(o-.5)),this._ui.tint=Math.round(200*(.5-s)),this._syncWb(),this.bitmap&&(i?this._commit():this._preview())};e.addEventListener("pointerdown",(t=>{a=!0,e.setPointerCapture(t.pointerId),r(t,!1)})),e.addEventListener("pointermove",(t=>{a&&r(t,!1)})),e.addEventListener("pointerup",(t=>{a&&(a=!1,r(t,!0))})),this._syncWb()}_syncWb(){const t=t=>(t>0?"+":"")+Math.round(t);this._els.wbT.textContent=t(this._ui.temperature),this._els.wbN.textContent=t(this._ui.tint),this._els.knob.style.left=50+this._ui.temperature/2+"%",this._els.knob.style.top=50-this._ui.tint/2+"%",this._syncDots()}_buildReel(t){if(this._els.cats=lc("div","kanvas-cats",t),this._els.reel=lc("div","kanvas-reel",t),this._rebuildReel(),!this._loadCube)return;const e=lc("div","kanvas-focusrow",t),i=lc("button","kanvas-btn",e);i.textContent=this.t("Load .cube…"),i.title=this.t("Add a standard 3D LUT file to the reel (this session)");const n=lc("input","",e);n.type="file",n.accept=".cube,.CUBE",n.hidden=!0,i.addEventListener("click",(()=>n.click())),n.addEventListener("change",(async()=>{const t=n.files?.[0];if(n.value="",t)try{const e=za(await t.text()),i=t.name.replace(/\.cube$/i,""),n="x-cube:"+i;xr(n,e),this._customLuts.some((t=>t.id===n))||this._customLuts.push({id:n,label:i,category:"Imported",intensity:80,state:"ready"}),this._cat="Imported",this._rebuildReel(),this._drawThumbs(),this._ui.look=n,this._syncLooks(),this.bitmap&&this._commit(),this._toast(this.t("LUT added to the reel (this session)"))}catch(t){this._toast(this.t("Not a valid .cube LUT:")+" "+t.message)}}))}_reelEntries(){return[...this._builtins?pc:[],...this._presets,...this._customLuts]}_categories(){const t=[];for(const e of this._reelEntries()){const i=e.category||"Other";t.includes(i)||t.push(i)}return t}_visibleEntries(){const t=this._cat;return[hc,...this._reelEntries().filter((e=>(e.category||"Other")===t))]}_rebuildReel(){const t=this._categories();this._cat&&t.includes(this._cat)||(this._cat=t[0]||null);const e=this._els.cats;e.textContent="",e.hidden=t.length<2;for(const i of t){const t=this._reelEntries().filter((t=>(t.category||"Other")===i&&t.id)).length,n=lc("button","kanvas-cat",e);n.setAttribute("aria-pressed",String(i===this._cat)),n.textContent=this.t(i);lc("span","kanvas-catn",n).textContent=String(t),n.addEventListener("click",(()=>{this._cat!==i&&(this._cat=i,this._rebuildReel(),this._drawThumbs())}))}const i=this._els.reel;i.textContent="",this._thumbObserver?.disconnect();for(const t of this._visibleEntries()){const e=lc("button","kanvas-look",i);e.dataset.id=t.id,e.setAttribute("aria-pressed",String(t.id===this._ui.look)),"error"===t.state&&(e.disabled=!0,e.title=this.t("Could not load this LUT")+" — "+t.error);const n=lc("canvas","",e);n.width=120,n.height=84;lc("span","",e).textContent=this.t(t.label),this._thumbs[t.id]=n,e.addEventListener("click",(async()=>{this._ui.look=t.id,this._ui.lookInt=t.id?t.intensity??80:80,this._syncLooks(),this._ctl.lookInt&&(this._ctl.lookInt.inp.value=String(this._ui.lookInt),this._syncSlider("lookInt")),t.id&&await Mr(t.id),this._drawThumb(t),this.bitmap&&this._commit()}))}this._observeThumbs()}_observeThumbs(){if("undefined"==typeof IntersectionObserver){for(const t of this._visibleEntries())this._loadThumb(t);return}const t=this._els.reel,e=new Map(this._visibleEntries().map((t=>[t.id,t])));this._thumbObserver=new IntersectionObserver(((t,i)=>{for(const n of t){if(!n.isIntersecting)continue;i.unobserve(n.target);const t=e.get(n.target.dataset.id||"");t&&this._loadThumb(t)}}),{root:t.closest(".kanvas-pane")||null,rootMargin:"200px"});for(const e of t.children)this._thumbObserver.observe(e)}async _loadThumb(t){if(t.id&&"ready"!==t.state)if(await Mr(t.id),"error"!==t.state)this._drawThumb(t);else{const e=this._els.reel?.querySelector(`[data-id="${CSS.escape(t.id)}"]`);e&&(e.disabled=!0,e.title=`Could not load this LUT — ${t.error}`)}else this._drawThumb(t)}_revealLook(){const t=this._ui.look;if(!t)return;const e=this._reelEntries().find((e=>e.id===t)),i=e&&(e.category||"Other");i&&i!==this._cat&&(this._cat=i,this._rebuildReel(),this._drawThumbs())}_syncLooks(){this._revealLook();for(const t of this._els.reel?.children||[])t.setAttribute("aria-pressed",String(t.dataset.id===this._ui.look))}_syncControls(){for(const t of gc)this._ctl[t.k].inp.value=String(this._ui[t.k]),this._syncSlider(t.k);this._syncWb(),this._syncLooks(),this._els.flipH.setAttribute("aria-pressed",String(this._ui.flipH)),this._els.flipV.setAttribute("aria-pressed",String(this._ui.flipV)),this._strInput.value=String(this._ui.straighten),this._strUI(),this._syncRegionUi()}_enterCrop(){this.bitmap&&!this._cropMode&&(this._exitRegionEdit(),this._cropMode=!0,this._els.cropBtn.setAttribute("aria-pressed","true"),this._els.cropSet.classList.add("kanvas-on"),this._els.cropClear.hidden=!this._ui.crop,this._els.overlay.hidden=!1,this._requestRender(),requestAnimationFrame((()=>{const t=this._els.overlay,e=this._els.aspectSel,i=this._ui;i.crop?(this._cropper.setRect({x:i.crop.x*t.width,y:i.crop.y*t.height,w:i.crop.w*t.width,h:i.crop.h*t.height}),e.value=i.crop.aspect&&this.aspectPresets.includes(i.crop.aspect)?i.crop.aspect:"free"):(this._cropper.setRect(null),e.value="free"),this._cropper.setAspect(qa(e.value))})))}_exitCrop(){this._cropMode&&(this._cropMode=!1,this._els.cropBtn.setAttribute("aria-pressed","false"),this._els.cropSet.classList.remove("kanvas-on"),this._els.overlay.hidden=!0)}_applyCrop(){if(!this._cropMode||!this._cropper.rect)return;const t=this._els.overlay,e=this._cropper.rect;e.x<1&&e.y<1&&e.w>t.width-2&&e.h>t.height-2?this._ui.crop=null:this._ui.crop={x:e.x/t.width,y:e.y/t.height,w:e.w/t.width,h:e.h/t.height,aspect:this._els.aspectSel.value},this._exitCrop(),this._commit()}}const fc=["free","1:1","4:3","3:4","3:2","2:3","16:9"],yc={jpg:"image/jpeg",jpeg:"image/jpeg",png:"image/png",webp:"image/webp"},vc='<svg class="cb-ike-i" viewBox="0 0 24 24" aria-hidden="true"><path d="M12 3v18"/><path d="M4 6h5v12H4zM15 6h5v12h-5z"/></svg>',wc=t=>`<svg class="cb-ike-i" aria-hidden="true"><use xlink:href="#${t}"></use></svg>`;function xc(t,e){const i=t.builder,n=i.util,o=i.dom,s=i.builderStuff,l=i.activeImage;if(!l)return;if(i.onImageEditClick){if(!i.onImageEditClick(l))return}const a=t.kanvasState||(t.kanvasState={modal:null,editor:null});a.modal||(o.appendHtml(s,function(t,e){return`\n <div class="is-modal imageedit-kanvas" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="cb-ike-bar">\n <span class="cb-ike-spacer"></span>\n <button type="button" class="cb-ike-compare" title="${e.out("Hold to see the original")}">${vc}<span>${e.out("Compare")}</span></button>\n <span class="cb-ike-sep"></span>\n <span class="cb-ike-hist">\n <button type="button" class="cb-ike-undo" title="${e.out("Undo")}" aria-label="${e.out("Undo")}" disabled>${wc("icon-undo")}</button>\n <button type="button" class="cb-ike-redo" title="${e.out("Redo")}" aria-label="${e.out("Redo")}" disabled>${wc("icon-redo")}</button>\n <button type="button" class="cb-ike-reset" title="${e.out("Reset")}" aria-label="${e.out("Reset")}">${wc("icon-reload")}</button>\n </span>\n <button type="button" title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button type="button" title="${e.out("Apply")}" class="input-ok classic-primary">${e.out("Apply")}</button>\n </div>\n <div class="cb-ike-host"></div>\n </div>\n </div>`}(0,n)),a.modal=s.querySelector(".imageedit-kanvas"),function(t,e){const i=t.builder,n=i.util,o=i.dom,s=e.modal,l=s.querySelector(".cb-ike-compare"),a=()=>{o.addClass(l,"on"),e.editor&&e.editor.compare(!0)},r=()=>{o.removeClass(l,"on"),e.editor&&e.editor.compare(!1)};o.addEventListener(l,"pointerdown",a),o.addEventListener(l,"pointerup",r),o.addEventListener(l,"pointerleave",r),o.addEventListener(l,"keydown",(t=>{32!==t.which&&13!==t.which||a()})),o.addEventListener(l,"keyup",(t=>{32!==t.which&&13!==t.which||r()})),o.addEventListener(s.querySelector(".cb-ike-undo"),"click",(()=>e.editor&&e.editor.undo())),o.addEventListener(s.querySelector(".cb-ike-redo"),"click",(()=>e.editor&&e.editor.redo())),o.addEventListener(s.querySelector(".cb-ike-reset"),"click",(()=>e.editor&&e.editor.reset())),o.addEventListener(s.querySelector(".input-cancel"),"click",(()=>Cc(t,e))),o.addEventListener(s.querySelector(".input-ok"),"click",(async()=>{if(e.editor&&!e.saving){e.saving=!0,_c(e,!0);try{await async function(t,e){const i=t.builder,n=i.util,o=i.dom,s=i.activeImage;i.uo.saveForUndo();const{ext:l,mime:a}=function(t){let e="";const i=t.getAttribute("src")||"";if(-1===i.indexOf("base64")){const t=i.substring(i.lastIndexOf("/")+1).split("?")[0];e=t.substr(t.lastIndexOf(".")+1).toLowerCase()}else if(t.getAttribute("data-filename")){const i=t.getAttribute("data-filename");e=i.substr(i.lastIndexOf(".")+1).toLowerCase()}else{const t=i.match(/^data:image\/(.*?);base64,/);t&&(e=t[1].toLowerCase())}"jpe"===e&&(e="jpg");const n=yc[e];return n?{ext:e,mime:n}:{ext:"png",mime:"image/png"}}(s),r=i.opts.imageEditorQuality||.92,c=await e.editor.export({format:a,quality:r}),u=function(t,e,i,n){let o;const s=t.getAttribute("src")||"";if(-1===s.indexOf("base64")){const t=s.substring(s.lastIndexOf("/")+1).split("?")[0];o=n.baseName(t)}else o=t.getAttribute("data-filename")?n.baseName(t.getAttribute("data-filename")):i.makeId();-1!==o.indexOf("-edit")&&(o=o.substr(0,o.indexOf("-edit")));let l=o+"-edit"+i.makeId();return l=l.replaceAll("%20","-"),l+"."+e}(s,l,n,o),d=i.onImageUpload||i.opts.onImageUpload;d?s.setAttribute("src",await function(t,e,i){return new Promise(((n,o)=>{const s=t.opts.onAssetUpload;let l=!1;const a=e=>{l||(l=!0,t.onAssetUpload=null,t.opts.onAssetUpload=s,e?n(e):o(new Error(t.util.out("Upload file failed."))))};t.onAssetUpload=a,t.opts.onAssetUpload=a;try{e({target:{files:[i]}})}catch(t){a(null)}}))}(i,d,new File([c.blob],u,{type:a}))):s.src=c.dataUrl;s.setAttribute("data-filename",u),t.refreshIfIsModule(s),i.opts.onChange(),i.elmTool.refresh(),i.onImageChange&&i.onImageChange()}(t,e),Cc(t,e)}catch(t){n.showMessage(t.message)}e.saving=!1,_c(e,!1)}}))}(t,a));const r=a.modal;a.trigger=e,a.onKeyCapture=t=>{if(!a.editor)return;if((t.ctrlKey||t.metaKey)&&(90===t.which||89===t.which))return t.preventDefault(),t.stopImmediatePropagation(),void(89===t.which||t.shiftKey?a.editor.redo():a.editor.undo());if(27===t.which){if(a.saving)return t.preventDefault(),void t.stopImmediatePropagation();const e=r.querySelector(".kanvas-tools > button");e&&"true"===e.getAttribute("aria-pressed")&&(t.preventDefault(),t.stopImmediatePropagation(),e.click())}},document.addEventListener("keydown",a.onKeyCapture,!0);const c=r.querySelector(".cb-ike-host");c.innerHTML="";const u=a.editor=new mc({container:c,header:!1,t:t=>n.out(t),aspectPresets:fc,presets:i.opts.imageEditorPresets||null,builtins:!0,loadCube:!0===i.opts.imageEditorLoadCube,myLooks:!0===i.opts.imageEditorMyLooks,onHistory:({canUndo:t,canRedo:e})=>{a.canUndo=t,a.canRedo=e,Sc(a)}});n.showModal(r,!0,(()=>{Cc(t,a,!1)})),e&&e.setAttribute("data-focus",!0);let d=l.getAttribute("src");-1===d.indexOf("base64")&&(d+=(-1===d.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`),u.load(d).catch((e=>{Cc(t,a),n.showMessage(e.message)}))}function kc(t,e){e?t.removeAttribute("disabled"):t.setAttribute("disabled","")}function Sc(t){kc(t.modal.querySelector(".cb-ike-undo"),!t.saving&&t.canUndo),kc(t.modal.querySelector(".cb-ike-redo"),!t.saving&&t.canRedo)}function _c(t,e){const i=t.modal.querySelector(".cb-ike-bar");i.setAttribute("aria-busy",e?"true":"false");const n=i.querySelectorAll(".cb-ike-compare, .cb-ike-reset, .input-cancel, .input-ok");Array.prototype.forEach.call(n,(t=>{e?t.setAttribute("disabled",""):t.removeAttribute("disabled")})),Sc(t)}function Cc(t,e,i=!0){e.editor&&(e.editor.destroy(),e.editor=null),e.onKeyCapture&&(document.removeEventListener("keydown",e.onKeyCapture,!0),e.onKeyCapture=null);const n=e.modal.querySelector(".cb-ike-host");n&&(n.innerHTML=""),e.canUndo=e.canRedo=!1,e.saving=!1,_c(e,!1),i&&t.builder.util.hideModal(e.modal),e.trigger&&(e.trigger.removeAttribute("data-focus"),e.trigger.focus(),e.trigger=null)}class Ec{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector("#divImageTool");if(!n){let o=`\n <div id="divImageTool" class="is-tool">\n <div role="button" tabindex="0" class="image-embed" style="${this.builder.opts.imageEmbed?"":"display:none;"}width:40px;height:40px;overflow:hidden;">\n <div style="position:absolute;width:100%;height:100%;">\n <svg class="is-icon-flex" style="position: absolute;top: 13px;left: 15px;width: 16px;height: 16px;"><use xlink:href="#ion-image"></use></svg>\n </div>\n <input title="${e.out("Change Image")}" data-title="${e.out("Change Image")}" id="fileEmbedImage" type="file" accept="image/*" style="position:absolute;top:-20px;left:0;width:40px;height:60px;opacity: 0;cursor: pointer;"/>\n </div>\n <button tabindex="0" title="${e.out("Link")}" data-title="${e.out("Link")}" class="image-link" style="width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;transform:rotate(45deg)"><use xlink:href="#icon-link2"></use></svg></button> \n <button tabindex="0" title="${e.out("Select")}" data-title="${e.out("Select")}" class="open-asset" style="display:none;width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-folder2"></use></svg></button> \n <button tabindex="0" title="${e.out("Edit")}" data-title="${e.out("Edit")}" class="image-edit" style="width:40px;height:40px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg></button>\n </div>\n <div id="divImageProgress">\n <div>\n <div class="dot"></div>\n <div class="dot"></div>\n <div class="dot"></div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector("#divImageTool"),this.imageTool=n;let s=n.querySelector("#fileEmbedImage");i.addEventListener(s,"change",(async e=>{this.builder.uo.saveForUndo();let i=this.builder.activeImage,o=1;const l=document.querySelector(".is-content-view");if(l){const t=window.getComputedStyle(l).transform;if(t.startsWith("matrix(")){const e=new DOMMatrix(t);0===e.b&&0===e.c&&e.a===e.d&&(o=e.a)}}let a=t.querySelector("#divImageProgress");a.style.display="table",a.style.width=i.offsetWidth*this.builder.opts.zoom*o+"px",a.style.height=i.offsetHeight*this.builder.opts.zoom*o+"px";const r=this.builder.util.getElementPosition(i);let c=r.top+window.pageYOffset,u=r.left+window.pageXOffset;a.style.top=c+"px",a.style.left=u+"px";const d=async t=>{let e=t.target.files[0];return new Promise((i=>{this.builder.opts.onAssetUpload=t=>{i({url:t,name:e.name,size:e.size})},this.builder.opts.onImageUpload(t)}))};if(this.builder.opts.onImageUpload){const t=await d(e);return i.setAttribute("src",t.url),a.style.display="none",s=n.querySelector("#fileEmbedImage"),s.value="",this.refreshIfIsModule(i),this.startImageMonitor(i),this.builder.opts.onChange(),this.builder.elmTool.refresh(),void(this.builder.onImageChange&&this.builder.onImageChange())}})),this.builder.opts.onImageBrowseClick&&(s=n.querySelector(".image-embed"),i.addEventListener(s,"click",(t=>(this.builder.opts.onImageBrowseClick(),t.preventDefault(),!1))));const l=n.querySelector(".image-link");i.addEventListener(l,"click",(()=>{this.renderPanel();let n=t.querySelector(".imagelink");if(this.builder.opts.onImageSettingClick)return this.builder.opts.onImageSettingClick(),!1;let o,s=this.builder.activeImage;"a"===s.parentNode.tagName.toLowerCase()&&1===s.parentNode.childElementCount&&(o=s.parentNode);let a=s.getAttribute("src"),r=s.getAttribute("alt"),c=n.querySelector(".input-src");-1===a.indexOf("base64")?c.value=a:c.value="[Image Data]";let u=n.querySelector(".input-title");u.value=r;let d=n.querySelector(".input-link");d.value="";let h=n.querySelector(".input-newwindow");h.checked=!1;let b=n.querySelector(".input-openlightbox");if(b.checked=!1,o){if(d.value=o.getAttribute("href"),""===r){let t=o.getAttribute("title");t&&(u.value=t)}var p=o.getAttribute("target");h.checked="_blank"===p,i.hasClass(o,"is-lightbox")?b.checked=!0:b.checked=!1}e.showModal(n,!0,(()=>{l.removeAttribute("data-focus"),l.focus()}),!0),l.setAttribute("data-focus",!0),c.focus()}));const a=n.querySelector(".open-asset");this.builder.opts.onImageSelectClick||this.builder.opts.imageselect?(a.style.display="block",i.addEventListener(a,"click",(()=>{let t=this.builder.activeImage,e=t?t.getAttribute("src"):"";this.builder.openImageSelect((t=>{this.builder.uo.saveForUndo();let e=this.builder.activeImage;e.addEventListener("load",(()=>{this.builder.activeModule?(this.refreshIfIsModule(this.builder.activeModule),this.builder.activeModule.click()):(this.repositionImageTool(),this.builder.elmTool.repositionElementTool())})),e.setAttribute("src",t),this.builder.opts.onChange(),this.builder.opts.onRender(),this.builder.onImageChange&&this.builder.onImageChange()}),e)}))):a.style.display="none";const r=n.querySelector(".image-edit");i.addEventListener(r,"click",(()=>{if("kanvas"===this.builder.opts.imageEditor)return void xc(this,r);this.renderPanel();let i=t.querySelector(".imageedit"),n=this.builder.activeImage,o=i.querySelector(".imageedit-preview");o.innerHTML='<img style="max-width:100%;object-fit:contain;height:100%;"/>';let s=i.querySelector("img");if(this.builder.onImageEditClick){if(!this.builder.onImageEditClick(n,s))return}e.showModal(i,!0,(()=>{r.removeAttribute("data-focus"),r.focus()})),r.setAttribute("data-focus",!0);if(o.style.height="",n.offsetWidth<800&&n.offsetHeight<550)o.style.width=n.offsetWidth+"px";else{800*n.offsetHeight/n.offsetWidth<=550?o.style.width="800px":o.style.height="550px"}window.innerHeight<=800&&(o.style.height="350px"),-1===n.src.indexOf("base64")?s.src=n.src+(-1===n.src.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`:s.src=n.src,this.builder.setCropperConfig?this.cropper=new ga(s,this.builder.setCropperConfig):this.cropper=new ga(s,{zoomable:!1})}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".imagelink")){let n=`\n <div class="is-modal imageedit" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="imageedit-crop" style="display:flex;height:80px;align-items:center;align-self:flex-start;">\n <button title="5x5" data-crop-size="1" style="width: 60px;height: 60px;">5x5</button>\n <button title="4x3" data-crop-size="1.33333" style="width: 60px;height: 45px;">4x3</button>\n <button title="3x4" data-crop-size="0.75" style="width: 45px;height: 60px;">3x4</button>\n <button title="6x4" data-crop-size="1.5" style="width: 60px;height: 40px;">6x4</button>\n <button title="4x6" data-crop-size="0.6666" style="width: 40px;height: 60px;">4x6</button>\n <button title="16x9" data-crop-size="1.77" style="width: 60px;height: 35px;">16x9</button>\n <button title="${e.out("Free")}" data-crop-size="" style="width: 60px;height: 45px;">${e.out("Free")}</button>\n </div>\n <div class="imageedit-preview" style="max-width:1000px;width:100%;max-height:550px;">\n </div>\n <div style="margin-top:15px;text-align:right;align-self:flex-end;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Apply")}" class="input-ok classic-primary">${e.out("Apply")}</button>\n </div>\n </div>\n </div>\n \n <div class="is-modal imagelink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form">\n\n <div class="cb-field">\n <label for="inpImageLinkSource">${e.out("Source")}:</label>\n <div class="image-src">\n <input id="inpImageLinkSource" class="input-src" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n\n <div class="image-larger1 is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetImageUpload" method="post" action="${this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="border-radius:1px;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;">\n\t\t\t\t <input id="hidRefId1" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage1" name="fileImage" type="file" accept="image/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe id="frameTargetImageUpload" name="frameTargetImageUpload" tabindex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <label for="inpImageLinkTitle">${e.out("Title")}:</label>\n <input id="inpImageLinkTitle" class="input-title" type="text"/>\n </div>\n\n <div class="cb-field">\n <label for="inpImageLinkLink">${e.out("Link")}:</label>\n <div class="image-link">\n <input id="inpImageLinkLink" class="input-link" type="text"/>\n <button title="${e.out("Select")}" class="input-select2" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n \n <button title="${e.out(this.builder.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:50px">${this.builder.opts.otherSelectIcon}</button>\n \n <div class="image-larger2 is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetImageUpload" method="post" action="${this.builder.opts.fileHandler?this.builder.opts.fileHandler:this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="border-radius:1px;position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;">\n\t\t\t\t <input id="hidRefId2" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage2" name="fileImage" type="file" accept="*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <label class="label-checkbox">\n <input class="input-newwindow" id="__input_newwindow2" type="checkbox" /> ${e.out("Open in new tab")}\n </label>\n <label class="label-checkbox mt-1" id="lblImageLinkOpenLightbox" style="${this.builder.useLightbox?"":"display:none"}">\n <input class="input-openlightbox" id="__input_openlightbox2" type="checkbox" /> ${e.out("Open in a lightbox")}\n </label>\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);let o=t.querySelector(".imagelink");if(this.builder.opts.onOtherSelectClick||this.builder.opts.otherSelect){o.querySelector(".input-select-other").style.display="block";const n=o.querySelector(".input-select-other");n&&i.addEventListener(n,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:o.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(o.querySelector(".image-larger1").style.display="none",o.querySelector(".image-larger2").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none",o.querySelector(".input-select2").style.display="none");let s=o.querySelector(".input-cancel");i.addEventListener(s,"click",(()=>{e.hideModal(o)})),s=o.querySelector(".input-ok"),i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo();let t,n=this.builder.activeImage;"a"===n.parentNode.tagName.toLowerCase()&&1===n.parentNode.childElementCount&&(t=n.parentNode);let s=o.querySelector(".input-src").value,l=o.querySelector(".input-title").value,a=o.querySelector(".input-link").value;-1===s.indexOf("[Image Data]")&&n.setAttribute("src",s),n.setAttribute("alt",l),""!==a?t?(t.setAttribute("href",a),t.setAttribute("title",l),o.querySelector(".input-newwindow").checked?t.setAttribute("target","_blank"):t.removeAttribute("target"),o.querySelector(".input-openlightbox").checked?i.addClass(t,"is-lightbox"):i.removeClass(t,"is-lightbox")):(t=i.createElement("a"),t.setAttribute("href",a),t.setAttribute("title",l),t.innerHTML=n.outerHTML,o.querySelector(".input-newwindow").checked?t.setAttribute("target","_blank"):t.removeAttribute("target"),o.querySelector(".input-openlightbox").checked?i.addClass(t,"is-lightbox"):i.removeClass(t,"is-lightbox"),n.outerHTML=t.outerHTML):t&&(t.outerHTML=t.innerHTML),this.refreshIfIsModule(n),this.builder.opts.onChange(),this.builder.opts.onRender(),e.hideModal(o),this.builder.elmTool.refresh(),this.builder.onImageChange&&this.builder.onImageChange()}));let l=o.querySelector(".image-src");if(this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const n=o.querySelector(".input-select");n&&i.addEventListener(n,"click",(()=>{if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-src"),theTrigger:n});else{let i=t.querySelector(".is-modal.imageselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-src"),this.builder.targetCallback=null,this.builder.targetAssetType="image"}));const s=o.querySelector(".input-select2");s&&i.addEventListener(s,"click",(()=>{if(this.builder.opts.onFileSelectClick)this.builder.opts.onFileSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:s}),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all";else if(""!==this.builder.opts.fileselect){let i=t.querySelector(".is-modal.fileselect"),n=i.querySelector("iframe");this.builder.opts.assetRefresh&&(n.src=this.builder.opts.fileselect,this.builder.opts.assetRefresh=!1),"about:blank"===n.src&&(n.src=this.builder.opts.fileselect),e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="all"}else if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-link"),theTrigger:s}),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="media";else{let i=t.querySelector(".is-modal.imageselect"),n=i.querySelector("iframe");this.builder.opts.assetRefresh&&(n.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===n.src&&(n.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0),this.builder.targetInput=o.querySelector(".input-link"),this.builder.targetCallback=null,this.builder.targetAssetType="media"}}))}else i.removeClass(l,"image-select");let a=o.querySelector("#fileImage1");i.addEventListener(a,"change",(t=>{let e=a;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId1").value=this.builder.opts.customval,this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),a.value=""}));let r=o.querySelector("#fileImage2");i.addEventListener(r,"change",(t=>{let e=r;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId2").value=this.builder.opts.customval,this.builder.opts.onFileUpload?this.builder.opts.onFileUpload(t):this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),r.value=""}));let c=t.querySelector(".imageedit"),u=c.querySelector(".imageedit-crop").querySelectorAll("button");Array.prototype.forEach.call(u,(t=>{i.addEventListener(t,"click",(()=>{let e=1*t.getAttribute("data-crop-size");this.cropper.setAspectRatio(e)}))}));let d=c.querySelector(".input-cancel");i.addEventListener(d,"click",(()=>{e.hideModal(c)})),s=c.querySelector(".input-ok"),i.addEventListener(s,"click",(async()=>{this.builder.uo.saveForUndo();let t=this.builder.activeImage;if(this.builder.opts.onImageUpload){let n,o,s,l,a,r=t.getAttribute("src");if(-1===r.indexOf("base64")){let t=r.substring(r.lastIndexOf("/")+1);n=i.baseName(t),o=t.substr(t.lastIndexOf(".")+1).toLowerCase()}else if(t.getAttribute("data-filename")){let e=t.getAttribute("data-filename");n=i.baseName(e),o=e.substr(e.lastIndexOf(".")+1).toLowerCase()}else{n=e.makeId(),o="png";const t=r.match(/^data:image\/(.*?);base64,/);t&&(o=t[1])}-1!==n.indexOf("-edit")&&(n=n.substr(0,n.indexOf("-edit"))),s=n+"-edit"+e.makeId(),s=s.replaceAll("%20","-"),l=s+"."+o,a="jpg"===o||"jpeg"===o||"webm"===o||"webp"===o?this.cropper.getCroppedCanvas({fillColor:"#fff",imageSmoothingEnabled:!0,imageSmoothingQuality:"high"}).toDataURL("image/jpeg"):this.cropper.getCroppedCanvas({}).toDataURL();const u=t=>({jpg:"image/jpeg",jpeg:"image/jpeg",png:"image/png",gif:"image/gif",webp:"image/webp",svg:"image/svg+xml",pdf:"application/pdf",txt:"text/plain",mp3:"audio/mpeg",mp4:"video/mp4",mov:"video/quicktime",wav:"audio/wav",json:"application/json"}[t.split(".").pop().toLowerCase()]||"application/octet-stream"),d=(t,e)=>{const i=u(e),n=atob(t.split(",")[1]),o=new Uint8Array(n.length);for(let t=0;t<n.length;t++)o[t]=n.charCodeAt(t);return new File([o],e,{type:i})},h=t=>new Promise((e=>{this.builder.opts.onAssetUpload=i=>{e({url:i,name:t.name,size:t.size})};const i={target:{files:[t]}};this.builder.opts.onImageUpload(i)})),b=d(a,l),p=await h(b);return t.setAttribute("src",p.url),this.refreshIfIsModule(t),this.builder.opts.onChange(),e.hideModal(c),this.builder.elmTool.refresh(),void(this.builder.onImageChange&&this.builder.onImageChange())}let n=t.getAttribute("data-filename"),o="jpg";if(n)o=n.substr(n.lastIndexOf(".")+1).toLowerCase();else{let e=t.src;e.indexOf("/")>-1?t.setAttribute("data-filename",e.substr(e.lastIndexOf("/")+1)):t.setAttribute("data-filename",e),o=e.substr(e.lastIndexOf(".")+1).toLowerCase()}if(this.builder.opts.imageRenameOnEdit){let n="";if(-1===t.src.indexOf("base64")){let e=t.getAttribute("src"),o=e.substring(e.lastIndexOf("/")+1);n=i.baseName(o)}else n=i.baseName(t.getAttribute("data-filename"));let s="";-1!==n.indexOf("-edit")&&(n=n.substr(0,n.indexOf("-edit"))),s=n+"-edit"+e.makeId(),s=s.replaceAll("%20","-"),t.setAttribute("data-filename",s+"."+o)}t.src="jpg"===o||"jpeg"===o||"webm"===o||"webp"===o?this.cropper.getCroppedCanvas({fillColor:"#fff",imageSmoothingEnabled:!0,imageSmoothingQuality:"high"}).toDataURL("image/jpeg"):this.cropper.getCroppedCanvas({}).toDataURL(),this.refreshIfIsModule(t),this.builder.opts.onChange(),e.hideModal(c),this.builder.elmTool.refresh(),this.builder.onImageChange&&this.builder.onImageChange()}))}}startImageMonitor(t){let e;e=new MutationObserver((t=>{t.forEach((t=>{"src"===t.attributeName&&(this.builder.onImageSrcChange&&this.builder.onImageSrcChange(),e&&e.disconnect())}))})),e.observe(t,{attributes:!0})}open(){const t=this.builder.builderStuff,e=this.builder.util;if(this.renderPanel(),this.builder.opts.onImageSettingClick)return this.builder.opts.onImageSettingClick(),!1;const i=t.querySelector(".imagelink");let n=this.builder.activeImage,o=n.closest("a"),s=n.getAttribute("src"),l=n.getAttribute("alt"),a=i.querySelector(".input-src");-1===s.indexOf("base64")?a.value=s:a.value="[Image Data]";let r=i.querySelector(".input-title");r.value=l;let c=i.querySelector(".input-link");c.value="";let u=i.querySelector(".input-newwindow");u.checked=!1;let d=i.querySelector(".input-openlightbox");if(d.checked=!1,o){if(c.value=o.getAttribute("href"),""===l){let t=o.getAttribute("title");t&&(r.value=t)}var h=o.getAttribute("target");u.checked="_blank"===h,o.classList.contains("is-lightbox")?d.checked=!0:d.checked=!1}e.showModal(i,!0,(()=>{}),!0),a.focus()}edit(){const t=this.builder.builderStuff,e=this.builder.util;if("kanvas"===this.builder.opts.imageEditor)return void xc(this);this.renderPanel();const i=t.querySelector(".imageedit");let n=this.builder.activeImage,o=i.querySelector(".imageedit-preview");o.innerHTML='<img style="max-width:100%;object-fit:contain;height:100%;"/>';let s=i.querySelector("img");if(this.builder.onImageEditClick){if(!this.builder.onImageEditClick(n,s))return}e.showModal(i,!0,(()=>{}));if(o.style.height="",n.offsetWidth<800&&n.offsetHeight<550)o.style.width=n.offsetWidth+"px";else{800*n.offsetHeight/n.offsetWidth<=550?o.style.width="800px":o.style.height="550px"}window.innerHeight<=800&&(o.style.height="350px"),-1===n.src.indexOf("base64")?s.src=n.src+(-1===n.src.indexOf("?")?"?":"&")+`timestamp=${(new Date).getTime()}`:s.src=n.src,this.builder.setCropperConfig?this.cropper=new ga(s,this.builder.setCropperConfig):this.cropper=new ga(s,{zoomable:!1})}refreshIfIsModule(t){const e=this.builder.dom,i=this.builder.util;if(e.parentsHasAttribute(t,"data-html")){if(this.imageTool&&(this.imageTool.style.display=""),t.hasAttribute("data-sync")){let e=t.getAttribute("data-src"),i=t.getAttribute("data-filename");if(e){let n=t;for(;!n.getAttribute("data-html");)n=n.parentNode;let o=n.querySelectorAll("img");Array.prototype.forEach.call(o,(n=>{n.src===e&&(n.src=t.src,n.removeAttribute("data-src"),n.setAttribute("data-filename",i))})),t.removeAttribute("data-src")}}setTimeout((()=>{i.refreshModule(),this.imageTool&&(this.imageTool.style.display="")}),1e3)}else t.onload=()=>{this.refresh()}}refresh(){const t=this.builder.util,e=this.builder.dom;if(this.builder.activeImage){let i=this.imageTool;i.style.display="",setTimeout((()=>{let n=this.builder.activeImage;if(!n)return;e.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=t.getElementPosition(n);let s=o.scaleX;i.style.display="flex";let l=i.offsetWidth,a=n.offsetWidth*s*this.builder.opts.zoom,r=o.top+window.pageYOffset,c=o.left+window.pageXOffset,u=c+(a/2-l/2);const d=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;l+c>d&&(u=n.getBoundingClientRect().left+t)}else l+c>d&&(u=n.getBoundingClientRect().left);i.style.top=r+"px",i.style.left=u+"px",0===n.offsetWidth&&(i.style.display="",this.builder.activeImage=null),t.repositionColumnTool()}),0)}}repositionImageTool(){const t=this.builder.util,e=this.builder.dom;if(this.builder.activeImage){let i=this.imageTool;if(!i)return;let n=this.builder.activeImage;e.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=t.getElementPosition(n);let s=o.scaleX,l=this.getScale(n).scaleX,a=this.getScale(n).scaleX;i.style.display="flex";let r=i.offsetWidth,c=n.offsetWidth*l*s*this.builder.opts.zoom,u=(n.offsetHeight*a*s*this.builder.opts.zoom-n.offsetHeight*s*this.builder.opts.zoom)/2,d=o.top+window.pageYOffset+u,h=o.left+window.pageXOffset,b=h+(c/2-r/2);const p=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;r+h>p&&(b=n.getBoundingClientRect().left+t)}else r+h>p&&(b=n.getBoundingClientRect().left);i.style.top=d+"px",i.style.left=b+"px"}}hideImageTool(){let t=this.imageTool;t&&(t.style.display="")}getScale(t){const e=window.getComputedStyle(t).transform;if(!e||"none"===e)return{scaleX:1,scaleY:1};const i=new DOMMatrix(e);return{scaleX:i.a,scaleY:i.d}}resolveTarget(t,e){if(!e||"img"===e.tagName.toLowerCase())return e;if(!this.builder.resolveImageFromPoint)return e;return this.builder.resolveImageFromPoint(t)||e}click(t){const e=this.builder.util,i=this.builder.dom;let n=t.target;if(n.closest("[data-html]"))return this.builder.activeImage=null,void this.hideImageTool();if(n=this.resolveTarget(t,n),"img"===n.tagName.toLowerCase()){let o=!1;if(n.hasAttribute("data-fixed")&&(o=!0),o)this.builder.activeImage=null,this.hideImageTool();else{this.builder.activeImage=n,i.hasClass(n.parentNode,"img-circular")&&(n=n.parentNode);const o=e.getElementPosition(n);let s=o.scaleX,l=this.getScale(n).scaleX,a=this.getScale(n).scaleX;this.renderTool();let r=this.imageTool;r.style.display="flex";const c=this.builder.imageToolMinimal,u=r.querySelector(".image-link"),d=r.querySelector(".image-edit");u&&(u.style.display=c?"none":""),d&&(d.style.display=c?"none":"");let h=r.offsetWidth,b=n.offsetWidth*l*s*this.builder.opts.zoom,p=(n.offsetHeight*a*s*this.builder.opts.zoom-n.offsetHeight*s*this.builder.opts.zoom)/2,g=o.top+window.pageYOffset+p,m=o.left+window.pageXOffset,f=m+(b/2-h/2);const y=window.innerWidth;if(this.builder.iframe){let t=this.builder.iframe.getBoundingClientRect().left+window.pageXOffset;h+m>y&&(f=n.getBoundingClientRect().left+t)}else h+m>y&&(f=n.getBoundingClientRect().left);r.style.top=g+"px",r.style.left=f+"px";const v=t=>{let e=t.target;e&&(e.closest("#divImageTool")||e.closest(".is-modal")||e.closest(".keep-selection")||e.closest(".sl-wrapper")||e.closest(".sl-overlay")||e.closest(".sl-close")||e.closest("img")||this.resolveTarget(t,e)!==e||(this.hideImageTool(),document.removeEventListener("click",v),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",v),this.builder.handleImageToolClickOut_=!1))};if(this.builder.handleImageToolClickOut_||(document.addEventListener("click",v),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",v),this.builder.handleImageToolClickOut_=!0),this.builder.canvas);else{let e=!1;t.screenX&&0!==t.screenX&&t.screenY&&0!==t.screenY||(e=!0),e&&this.hideImageTool()}}}else this.builder.activeImage=null}}const Ac=".is-modal.buttoneditor",Lc=[{id:"style",label:"Style"},{id:"presets",label:"Presets"},{id:"saved",label:"Saved"}],Tc={none:"None",sm:"S",normal:"M",md:"MD",lg:"LG",xl:"XL","2xl":"2XL","3xl":"3XL",full:"Full"};class Mc{constructor(t){this.builder=t,this.util=t.util,this.dom=t.dom,this.builderStuff=t.builderStuff;let e=this.builderStuff.querySelector(Ac);if(e)return void(this.buttonModal=e);const i=this.util,n=this.dom,o=Lc.map(((t,e)=>`<button type="button" role="tab" id="cbbe-tab-${t.id}" data-tab="${t.id}" aria-controls="cbbe-panel-${t.id}" aria-selected="${0===e?"true":"false"}" tabindex="${0===e?"0":"-1"}">${i.out(t.label)}</button>`)).join(""),s=`\n <div class="is-modal is-modal-content buttoneditor" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${i.out("Button")}\n <button type="button" class="is-modal-close" tabindex="-1" title="${i.out("Close")}">&#10005;</button>\n </div>\n <div class="buttoneditor-inner">\n <div class="cb-tabs" role="tablist" aria-label="${i.out("Button")}">${o}</div>\n <div class="buttoneditor-panels">\n <div class="buttoneditor-panel on" role="tabpanel" id="cbbe-panel-style" aria-labelledby="cbbe-tab-style" data-tab="style" tabindex="0">${this.stylePanelHtml()}</div>\n <div class="buttoneditor-panel" role="tabpanel" id="cbbe-panel-presets" aria-labelledby="cbbe-tab-presets" data-tab="presets" tabindex="0"></div>\n <div class="buttoneditor-panel" role="tabpanel" id="cbbe-panel-saved" aria-labelledby="cbbe-tab-saved" data-tab="saved" tabindex="0">\n <button type="button" class="buttoneditor-savebtn">${i.out("Save current button")}</button>\n <div class="buttoneditor-savedlist buttoneditor-gallery buttoneditor-saved is-container"></div>\n </div>\n </div>\n </div>\n </div>`;n.appendHtml(this.builderStuff,s),e=this.builderStuff.querySelector(Ac),this.buttonModal=e,n.addEventListener(e.querySelector(".is-modal-close"),"click",(()=>{n.removeClass(e,"active")})),this.tabs=n.accessibleTabs(e.querySelector(".cb-tabs"),(t=>this.selectTab(t))),e.querySelector(".buttoneditor-savebtn").addEventListener("click",(()=>this.saveCurrent())),this.wireControls(e),this.renderPresets(),this.renderSaved(),new vs({selector:`${Ac} .is-draggable`})}stylePanelHtml(){const t=t=>this.util.out(t),e=(t,e)=>'<div class="buttoneditor-seg">'+e.map((([e,i,n])=>`<button type="button" data-cmd="${t}" data-val="${e}"${n||""}>${i}</button>`)).join("")+"</div>",i=e=>`<div class="buttoneditor-step">\n <button type="button" data-cmd="${e}-dec" title="${t("Less")}">&minus;</button>\n <span class="buttoneditor-stepval" data-field="${e}">&ndash;</span>\n <button type="button" data-cmd="${e}-inc" title="${t("More")}">+</button>\n </div>`,n=(t,e)=>`<button type="button" class="buttoneditor-swatch" data-cmd="${t}" title="${e}"><span></span></button>`,o='<option value="">&ndash;</option>'+be.map((t=>`<option value="${t}">${t}</option>`)).join(""),s='<option value="">&ndash;</option>'+pe.map((t=>`<option value="${t}">${t}</option>`)).join("");return`\n <div class="buttoneditor-field">\n <label class="buttoneditor-label" for="cbbe2-href">${t("Link")}</label>\n <input id="cbbe2-href" data-cmd="href" type="text" placeholder="https://..." />\n <label class="buttoneditor-check"><input type="checkbox" data-cmd="newtab" /> ${t("Open in new tab")}</label>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Colors")}</div>\n <div class="buttoneditor-seg buttoneditor-colorstate">\n <button type="button" data-cmd="colorstate" data-val="normal" class="on">${t("Normal")}</button>\n <button type="button" data-cmd="colorstate" data-val="hover">${t("Hover")}</button>\n </div>\n <div class="buttoneditor-colors" data-state="normal">\n <div class="buttoneditor-swrow">${n("color-bg",t("Background Color"))}<span>${t("Background")}</span></div>\n <div class="buttoneditor-swrow">${n("color-text",t("Text Color"))}<span>${t("Text")}</span></div>\n <div class="buttoneditor-swrow buttoneditor-swrow-seg"><span>${t("Border")}</span>${e("border-style",[["transparent",t("Transparent")],["current",t("Current")]])}</div>\n </div>\n <div class="buttoneditor-colors" data-state="hover" style="display:none">\n <div class="buttoneditor-swrow">${n("hover-bg",t("Background Color"))}<span>${t("Background")}</span></div>\n <div class="buttoneditor-swrow">${n("hover-text",t("Text Color"))}<span>${t("Text")}</span></div>\n <div class="buttoneditor-swrow">${n("hover-border",t("Border Color"))}<span>${t("Border")}</span></div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Size")}</div>\n ${e("size",[["small",t("S")],["medium",t("M")],["large",t("L")]])}\n <div class="buttoneditor-row">\n <div class="buttoneditor-sub"><span>${t("Padding X")}</span>${i("px")}</div>\n <div class="buttoneditor-sub"><span>${t("Padding Y")}</span>${i("py")}</div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Shape")}</div>\n ${e("radius",he.map((t=>[t,Tc[t]||t])))}\n </div>\n\n <div class="buttoneditor-row">\n <div class="buttoneditor-field buttoneditor-half">\n <div class="buttoneditor-label">${t("Border")}</div>\n ${e("border-width",[["0",t("None")],["1","1px"," data-lc"],["2","2px"," data-lc"]])}\n </div>\n <div class="buttoneditor-field buttoneditor-half">\n <div class="buttoneditor-label">${t("Width")}</div>\n ${e("width",[["auto",t("Auto")],["full",t("Full")]])}\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Text")}</div>\n <div class="buttoneditor-seg buttoneditor-toggle">\n <button type="button" data-cmd="bold" title="${t("Bold")}" style="font-family:serif">B</button>\n <button type="button" data-cmd="uppercase" title="${t("Upper/Lower")}" style="font-family:serif">Aa</button>\n <button type="button" data-cmd="underline" title="${t("Underline")}" style="font-family:serif;text-decoration:underline">U</button>\n </div>\n <div class="buttoneditor-row">\n <div class="buttoneditor-sub"><span>${t("Font Size")}</span><select data-cmd="fontsize">${o}</select></div>\n <div class="buttoneditor-sub"><span>${t("Letter Spacing")}</span><select data-cmd="tracking">${s}</select></div>\n </div>\n </div>\n\n <div class="buttoneditor-field">\n <div class="buttoneditor-label">${t("Margin")}</div>\n <div class="buttoneditor-margins">\n <label>${t("Top")}<input type="number" min="0" max="5" data-cmd="margin" data-val="top" /></label>\n <label>${t("Right")}<input type="number" min="0" max="5" data-cmd="margin" data-val="right" /></label>\n <label>${t("Bottom")}<input type="number" min="0" max="5" data-cmd="margin" data-val="bottom" /></label>\n <label>${t("Left")}<input type="number" min="0" max="5" data-cmd="margin" data-val="left" /></label>\n </div>\n </div>`}wireControls(t){t.addEventListener("click",(t=>{const e=t.target.closest("[data-cmd]");if(!e)return;const i=e.getAttribute("data-cmd");"color-bg"!==i&&"color-text"!==i&&"hover-bg"!==i&&"hover-text"!==i&&"hover-border"!==i?"colorstate"!==i?"href"!==i&&"newtab"!==i&&"fontsize"!==i&&"tracking"!==i&&"margin"!==i&&this.command(i,e.getAttribute("data-val")):this.setColorState(e.getAttribute("data-val")):this.openColor(i,e)})),t.querySelector('[data-cmd="href"]').addEventListener("input",(t=>this.commandInput("href",t.target.value))),t.querySelector('[data-cmd="newtab"]').addEventListener("change",(t=>this.commandInput("newtab",t.target.checked))),t.querySelector('[data-cmd="fontsize"]').addEventListener("change",(t=>this.commandInput("fontsize",t.target.value))),t.querySelector('[data-cmd="tracking"]').addEventListener("change",(t=>this.commandInput("tracking",t.target.value))),t.querySelectorAll('[data-cmd="margin"]').forEach((t=>{t.addEventListener("change",(t=>this.commandInput("margin",t.target.value,t.target.getAttribute("data-val"))))}))}command(t,e){const i=this.getButton();if(!i)return;this.builder.uo.saveForUndo();const n=xe(i);switch(t){case"size":!function(t,e){const i=ue[e];i&&(fe(t,"px-"),fe(t,"py-"),fe(t,"pt-"),fe(t,"pb-"),fe(t,"size-"),fe(t,"leading-"),t.classList.add("px-"+i.px),t.classList.add("py-"+i.py),t.classList.add("size-"+i.size),t.classList.add("leading-"+i.leading),Ae(t))}(i,e);break;case"px-dec":Le(i,(null==n.px?0:n.px)-1);break;case"px-inc":Le(i,(null==n.px?0:n.px)+1);break;case"py-dec":Te(i,(null==n.py?0:n.py)-1);break;case"py-inc":Te(i,(null==n.py?0:n.py)+1);break;case"radius":!function(t,e){t.classList.remove("rounded"),fe(t,"rounded-"),"normal"===e?t.classList.add("rounded"):e&&t.classList.add("rounded-"+e),Ae(t)}(i,e);break;case"border-width":!function(t,e){t.classList.remove("border-0"),t.classList.remove("border-2"),t.classList.remove("border"),0===e?t.classList.add("border-0"):1===e?t.classList.add("border"):2===e&&t.classList.add("border-2"),Ae(t)}(i,parseInt(e,10));break;case"border-style":!function(t,e){t.classList.remove("border-transparent"),t.classList.remove("border-current"),"transparent"===e?t.classList.add("border-transparent"):"current"===e&&t.classList.add("border-current"),Ae(t)}(i,n.borderStyle===e?"":e);break;case"width":!function(t,e){"auto"===e?(t.classList.remove("flex"),t.classList.remove("justify-center"),t.classList.remove("items-center"),t.classList.remove("w-full"),t.classList.add("inline-block"),t.style.width=""):"full"===e&&(t.classList.remove("inline-block"),t.classList.add("flex"),t.classList.add("justify-center"),t.classList.add("items-center"),t.style.width="100%"),Ae(t)}(i,e);break;case"bold":!function(t,e){t.classList.remove("font-semibold"),t.classList.remove("font-normal"),t.classList.add(e?"font-semibold":"font-normal"),Ae(t)}(i,!n.bold);break;case"uppercase":!function(t,e){e?t.classList.add("uppercase"):t.classList.remove("uppercase"),Ae(t)}(i,!n.uppercase);break;case"underline":!function(t,e){t.classList.remove("underline"),t.classList.remove("no-underline"),t.classList.add(e?"underline":"no-underline"),Ae(t)}(i,!n.underline);break;default:return}this.builder.opts.onChange(),this.realtime()}commandInput(t,e,i){const n=this.getButton();n&&(this.builder.uo.saveForUndo(),"href"===t?function(t,e){"a"===t.tagName.toLowerCase()&&t.setAttribute("href",e)}(n,e):"newtab"===t?function(t,e){e?t.setAttribute("target","_blank"):t.removeAttribute("target")}(n,e):"fontsize"===t?function(t,e){fe(t,"size-"),e&&t.classList.add("size-"+e),Ae(t)}(n,""===e?"":parseInt(e,10)):"tracking"===t?""!==e&&function(t,e){fe(t,"tracking-"),t.classList.add("tracking-"+e),Ae(t)}(n,parseInt(e,10)):"margin"===t&&function(t,e,i){const n=me[e];n&&(fe(t,n),t.classList.add(n+we(i,5)),Ae(t))}(n,i,""===e?0:parseInt(e,10)),"href"!==t&&"newtab"!==t||this.syncLinkDialog(n),this.builder.opts.onChange(),this.realtime())}syncLinkDialog(t){const e=this.builderStuff.querySelector(".is-modal.createlink");if(!e||!this.dom.hasClass(e,"active"))return;const i=e.querySelector(".input-url");i&&document.activeElement!==i&&(i.value=t.getAttribute("href")||"");const n=e.querySelector(".input-newwindow");n&&(n.checked="_blank"===t.getAttribute("target"))}openColor(t,e){const i=this.getButton();if(!i)return;this.builder.uo.saveForUndo(!0);const n=this.dom;let o="";"color-bg"===t?o=i.style.backgroundColor||n.getStyle(i,"background-color"):"color-text"===t?o=i.style.color||n.getStyle(i,"color"):"hover-bg"===t?o=xe(i).hoverBg:"hover-text"===t?o=xe(i).hoverColor:"hover-border"===t&&(o=xe(i).hoverBorder),e.setAttribute("data-focus",!0),this.builder.colorPicker.open((e=>{const i=this.getButton();i&&("color-bg"===t?function(t,e){t.style.backgroundColor=e,""===e?t.removeAttribute("data-bg"):t.setAttribute("data-bg",e),fe(t,"bg-"),Ae(t)}(i,e):"color-text"===t?function(t,e){t.style.color=e,fe(t,"text-"),Ae(t)}(i,e):"hover-bg"===t?Oe(i,"bg",e):"hover-text"===t?Oe(i,"color",e):"hover-border"===t&&Oe(i,"border",e),this.builder.opts.onChange(),this.realtime())}),o,(()=>{e.removeAttribute("data-focus"),e.focus()}))}setColorState(t){const e=this.buttonModal;e.querySelectorAll('.buttoneditor-colorstate [data-cmd="colorstate"]').forEach((e=>{e.classList.toggle("on",e.getAttribute("data-val")===t)})),e.querySelectorAll(".buttoneditor-colors").forEach((e=>{e.style.display=e.getAttribute("data-state")===t?"":"none"}))}renderPresets(){const t=this.buttonModal.querySelector('.buttoneditor-panel[data-tab="presets"]');if(!t)return;let e='<div class="buttoneditor-gallery is-container">';Be.forEach((t=>{const i=function(t){const{type:e="outline",shape:i="rounded",size:n="medium",text:o="Button",color:s,bg:l,hoverBg:a,hoverColor:r,hoverBorder:c,borderColor:u,customClasses:d="",href:h="#"}=t,b=ue[n]||ue.medium,p=`py-${b.py} px-${b.px} size-${b.size} leading-${b.leading}`;let g=`transition-all inline-block whitespace-nowrap cursor-pointer no-underline border-2 border-solid mt-2 mb-1 font-normal tracking-normal ${de[i]||""} ${p} ${d}`.trim();if(/\bunderline\b/.test(d)&&(g=g.replace(/\bno-underline\b/,"").trim()),"outline2"===e){g+=" "+(u?"":"border-current hover:border-current");const t=s?`style="color: ${s};"`:"";return{html:`<a href="${h}" role="button" class="${g}"${t?" "+t:""}>${o}</a>`}}if("outline"===e)g+=" border-current hover:border-transparent";else{if("solid"!==e)return;g+=" border-transparent hover:border-transparent"}let m="<a\n";m+=` href="${h}"\n`,m+=' role="button"\n',m+=` class="${g}"\n`;const f=[],y=[];return s&&f.push(`color: ${s}`),l&&f.push(`background-color: ${l}`),l&&a&&(f.push(`${re.bg}: ${a}`),y.push("bg")),r&&(f.push(`${re.color}: ${r}`),y.push("color")),c&&(f.push(`${re.border}: ${c}`),y.push("border")),f.length&&(m+=` style="${f.join("; ")};"`),y.length&&(m+=`\n ${le}="${y.join(" ")}"`),m+=">\n",m+=` ${o}\n`,m+="</a>",{html:m}}(t);i&&i.html&&(e+=i.html)})),e+="</div>",t.innerHTML=e,t.querySelectorAll(".buttoneditor-gallery a").forEach((t=>{t.addEventListener("click",(e=>{e.preventDefault();const i=this.getButton();i&&(this.builder.uo.saveForUndo(),De(i,t),this.builder.opts.onChange(),this.realtime())}))}))}renderSaved(){const t=this.buttonModal.querySelector(".buttoneditor-savedlist");if(!t)return;const e=t=>this.util.out(t),i=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");let n="";for(const t of i){const i=t.hover?` ${le}="${t.hover}"`:"",o=t.bg?` data-bg="${t.bg}"`:"",s=t.hoverBg?` data-hover-bg="${t.hoverBg}"`:"";n+=`<a data-id="${t.id}"${o}${s}${i} class="${t.className}" href="#" role="button" style="${t.cssText}">Button<span class="buttoneditor-remove" title="${e("Remove")}">&times;</span></a>`}t.innerHTML=n,t.querySelectorAll("a").forEach((t=>{t.addEventListener("click",(e=>{if(e.target.closest(".buttoneditor-remove"))return;const i=this.getButton();i&&(this.builder.uo.saveForUndo(),De(i,t),this.builder.opts.onChange(),this.realtime(),e.preventDefault())}))})),t.querySelectorAll(".buttoneditor-remove").forEach((t=>{t.addEventListener("click",(t=>{const e=parseInt(t.target.closest("a").getAttribute("data-id"),10);let i=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");i=i.filter((t=>t.id!==e)),i.forEach(((t,e)=>{t.id=e})),localStorage.setItem("_savedbuttons",JSON.stringify(i)),this.renderSaved(),t.stopImmediatePropagation(),t.preventDefault()}))}))}saveCurrent(){const t=this.getButton();if(!t)return;const e=JSON.parse(localStorage.getItem("_savedbuttons")||"[]");t.classList.remove("active"),t.classList.remove("elm-active"),e.push({id:e.length,className:t.className,cssText:t.style.cssText,hover:t.getAttribute(le)||"",bg:t.getAttribute("data-bg")||"",hoverBg:t.getAttribute("data-hover-bg")||""}),localStorage.setItem("_savedbuttons",JSON.stringify(e)),this.renderSaved()}selectTab(t){this.buttonModal.querySelectorAll(".buttoneditor-panel").forEach((e=>e.classList.toggle("on",e.getAttribute("data-tab")===t)))}getButton(){return this.builder.activeButton||this.builder.activeLinkButton||this.builder.activeLink}open(){this.util.showModal(this.buttonModal,!1),this.applyPosition(),this.tabs?this.tabs.select(Lc[0].id):this.selectTab(Lc[0].id),this.setColorState("normal"),this.renderSaved(),this.realtime()}applyPosition(){this.util.applyModalPosition(this.buttonModal,this.builder.opts.buttonEditorPosition)}hide(){this.dom.removeClass(this.buttonModal,"active")}realtime(){const t=this.getButton();if(!t)return;const e=this.dom,i=this.buttonModal,n=xe(t);this.syncSeg("size",n.sizeKey),this.syncSeg("radius",n.radius),this.syncSeg("border-width",null==n.borderWidth?null:String(n.borderWidth)),this.syncSeg("border-style",n.borderStyle),this.syncSeg("width",n.widthMode),this.syncStep("px",n.px),this.syncStep("py",n.py),this.syncToggle("bold",n.bold),this.syncToggle("uppercase",n.uppercase),this.syncToggle("underline",n.underline);const o=i.querySelector('[data-cmd="fontsize"]');o&&(o.value=null==n.fontSize?"":String(n.fontSize));const s=i.querySelector('[data-cmd="tracking"]');s&&(s.value=null==n.tracking?"":String(n.tracking)),["top","right","bottom","left"].forEach((t=>{const e=i.querySelector(`[data-cmd="margin"][data-val="${t}"]`);e&&document.activeElement!==e&&(e.value=null==n.margin[t]?"":n.margin[t])}));const l=i.querySelector('[data-cmd="href"]');l&&document.activeElement!==l&&(l.value=n.href);const a=i.querySelector('[data-cmd="newtab"]');a&&(a.checked=n.newTab),this.paintSwatch("color-bg",e.getStyle(t,"background-color")),this.paintSwatch("color-text",e.getStyle(t,"color")),this.paintSwatch("hover-bg",n.hoverBg),this.paintSwatch("hover-text",n.hoverColor),this.paintSwatch("hover-border",n.hoverBorder)}syncSeg(t,e){this.buttonModal.querySelectorAll(`[data-cmd="${t}"]`).forEach((t=>{t.classList.toggle("on",null!=e&&t.getAttribute("data-val")===e)}))}syncStep(t,e){const i=this.buttonModal.querySelector(`.buttoneditor-stepval[data-field="${t}"]`);i&&(i.textContent=null==e?"–":e)}syncToggle(t,e){const i=this.buttonModal.querySelector(`[data-cmd="${t}"]`);i&&i.classList.toggle("on",!!e)}paintSwatch(t,e){const i=this.buttonModal.querySelector(`.buttoneditor-swatch[data-cmd="${t}"]`);if(!i)return;const n=i.querySelector("span"),o=!e||"transparent"===e||"rgba(0, 0, 0, 0)"===e;i.classList.toggle("is-empty",o),n&&(n.style.background=o?"":e)}}class qc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector("#divLinkTool");if(!o){let s=`<div id="divLinkTool" class="is-tool">\n <button title="${i.out("Edit Button")}" data-title="${i.out("Edit Button")}" class="link-button-edit" style="display:none;">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg>\n </button>\n <button title="${i.out("Link")}" data-title="${i.out("Link")}" class="link-edit">\n <svg class="is-icon-flex" style="width:17px;height:17px;transform:rotate(45deg)"><use xlink:href="#icon-link2"></use></svg>\n </button>\n <button title="${i.out("Duplicate")}" data-title="${i.out("Duplicate")}" class="link-duplicate">\n <svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-duplicate3"></use></svg>\n </button>\n <button title="${i.out("Delete")}" data-title="${i.out("Delete")}" class="link-remove">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector("#divLinkTool"):t.querySelector("#divLinkTool"),this.linkTool=o;let l=o.querySelector(".link-edit");n.addEventListener(l,"click",(()=>{this.editLink()}));let a=o.querySelector(".link-button-edit");n.addEventListener(a,"click",(()=>{this.editButton()}));let r=o.querySelector(".link-duplicate");n.addEventListener(r,"click",(()=>{if(this.builder.activeLink)if(this.builder.uo.saveForUndo(),this.builder.opts.emailMode){for(var t=this.builder.activeLink;"table"!==t.tagName.toLowerCase()&&!n.hasClass(t,"button");)t=t.parentNode;let e=t=t.parentNode;const i=e.cloneNode(!0);let o=i.querySelector(".icon-active");o&&n.removeClass(o,"icon-active"),i.style.paddingRight="15px",e.parentNode.insertBefore(i,e),this.showTool(this.builder.activeLink)}else{const t=this.builder.activeLink.cloneNode(!0);let e=t.querySelector(".icon-active");e&&n.removeClass(e,"icon-active"),this.builder.activeLink.parentNode.insertBefore(t,this.builder.activeLink),this.showTool(this.builder.activeLink)}}));let c=o.querySelector(".link-remove");n.addEventListener(c,"click",(()=>{if(this.builder.uo.saveForUndo(),this.builder.opts.emailMode){for(var t=this.builder.activeLink;"table"!==t.tagName.toLowerCase()&&!n.hasClass(t,"button");)t=t.parentNode;let e=t=t.parentNode;e&&e.parentNode.removeChild(e),o.style.display=""}else this.builder.activeLink&&this.builder.activeLink.parentNode.removeChild(this.builder.activeLink),o.style.display="";this.builder.activeLink.querySelector(".icon-active")&&(this.builder.activeIcon=null)}))}}renderButtonPanel(){this.builder.builderStuff.querySelector(".is-modal.buttoneditor")||(this.buttonEditor=new Mc(this.builder))}syncButtonUI(t){if(!t||!t.isConnected)return;if(this.builder.opts.onButtonEdit)return void(t===this.builder.activeLinkButton&&this.builder.opts.onButtonEdit(t));const e=this.builder.dom,i=this.builder.builderStuff.querySelector(".is-modal.buttoneditor");i&&e.hasClass(i,"active")&&(this.buttonEditor||(this.buttonEditor=new Mc(this.builder)),this.buttonEditor.realtime())}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.createlink");if(!n){let o=`\n <div class="is-modal createlink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form">\n <div class="cb-field">\n <label for="inpCreateLinkUrl">${e.out("Link")}:</label>\n <div class="link-src">\n <input id="inpCreateLinkUrl" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select">\n ${this.builder.opts.selectIcon}\n </button>\n <button title="${e.out(this.builder.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:50px">\n ${this.builder.opts.otherSelectIcon}\n </button>\n <div class="div-anyfile-upload is-btn classic" style="position: relative; flex: 0 0 auto; width: 50px; height: var(--cb-field-height); box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetAnyfileUpload" method="post" action="${this.builder.opts.fileHandler}" enctype="multipart/form-data" style="overflow:hidden;position:absolute;top:0;left:0;width:100%;height:100%;border-radius:1px;display:flex;align-items: center;justify-content: center;">\n <input class="input-anyfile-customval" name="hidRefId" type="hidden" value="${this.builder.customval}" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input type="file" onclick="blur()" tabindex="0" class="input-anyfile-upload" name="fileImage" accept="*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;"/>\n </form>\n <iframe tabindex="-1" id="frameTargetAnyfileUpload" name="frameTargetAnyfileUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n <div class="cb-field">\n <label class="label-checkbox">\n <input class="input-newwindow" id="__input_newwindow" type="checkbox" /> ${e.out("Open in new tab")}\n </label>\n <label class="label-checkbox mt-1" id="lblOpenLightbox" style="${this.builder.useLightbox?"":"display:none"}">\n <input class="input-openlightbox" id="__input_openlightbox" type="checkbox" /> ${e.out("Open in a lightbox")}\n </label>\n </div>\n <div class="cb-field">\n <label id="lblCreateLinkText" for="inpCreateLinkText">${e.out("Text")}:</label>\n <input id="inpCreateLinkText" class="input-text" type="text"/>\n </div>\n <div class="cb-field">\n <label for="inpCreateLinkTitle">${e.out("Title")}:</label>\n <input id="inpCreateLinkTitle" class="input-title" type="text"/>\n </div>\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.createlink"),this.modal=n,""!==this.builder.opts.fileHandler||this.builder.opts.onFileUpload||(t.querySelector(".div-anyfile-upload").style.display="none");let s=t.querySelector(".input-anyfile-upload");i.addEventListener(s,"change",(t=>{let e=s;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),this.builder.opts.onFileUpload?this.builder.opts.onFileUpload(t):n.submit(),s.value=""}));let l=n.querySelector(".input-ok");i.addEventListener(l,"click",(()=>{this.builder.uo.saveForUndo();let t=null,o=this.builder.activeLink;if(o){let s=n.querySelector(".input-url").value,l=n.querySelector(".input-title").value,a=n.querySelector(".input-text").value;if(""===a&&(a=s),""===s&&"inscribe"===this.builder.opts.engine&&!this.builder.activeIcon){const t=this.builder.editingEngine.active;if(t&&o.isConnected)return i.selectElementContents(o),t.unlink(),this.hideTool(),this.builder.opts.onChange(),void e.hideModal(n)}if(""!==s)o.setAttribute("href",s),n.querySelector(".input-newwindow").checked?(o.setAttribute("target","_blank"),o.getAttribute("rel")||o.setAttribute("rel","noopener noreferrer")):o.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(o,"is-lightbox"):i.removeClass(o,"is-lightbox"),this.builder.activeIcon||(o.innerHTML=a),l?o.setAttribute("title",l):o.removeAttribute("title"),this.syncButtonUI(o),t=o;else if(this.hideTool(),this.builder.activeIcon){this.builder.activeIcon.setAttribute("dummy-sel",""),o.outerHTML=this.builder.activeIcon.outerHTML;let t=this.builder.doc.querySelector("[dummy-sel]");t.removeAttribute("dummy-sel"),this.builder.activeIcon=t,this.builder.activeIcon.click()}else o.outerHTML=o.innerHTML;this.builder.opts.onChange()}else{e.restoreSelection();let t=n.querySelector(".input-url").value,o=n.querySelector(".input-title").value,s=n.querySelector(".input-text").value;if(""===s&&(s=t),""!==t){if("inscribe"===this.builder.opts.engine&&!this.builder.activeIcon&&!this.builder.activeSvg){const l=this.builder.editingEngine.active;if(l){const a={};let r;return n.querySelector(".input-newwindow").checked&&(a.target="_blank"),o&&(a.title=o),n.querySelector(".input-openlightbox").checked&&(a.class="is-lightbox"),r=l.hasLiveSelection()?l.link(t,a):l.insertLink(t,s,a),this.builder.opts.onChange(),this.builder.opts.onRender(),e.hideModal(n),void(r&&r.isConnected&&(l.focus(),i.selectElementContents(r),e.saveSelection()))}}let l;if(this.builder.uo.saveForUndo(),this.builder.activeIcon){let s=this.builder.activeIcon.outerHTML;this.builder.activeIcon.outerHTML=`<a dummy-sel="1" href="${t}">${s}</a>`,l=this.builder.doc.querySelector("[dummy-sel]"),l.removeAttribute("dummy-sel"),n.querySelector(".input-newwindow").checked?l.setAttribute("target","_blank"):l.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(l,"is-lightbox"):i.removeClass(l,"is-lightbox"),l.setAttribute("title",o),this.builder.activeIcon=l.childNodes[0],e.appleMobile||(this.builder.activeIcon.click(),i.selectElementContents(this.builder.activeIcon),this.builder.doc.selection?this.builder.doc.selection.empty():window.getSelection().removeAllRanges())}else{const e=this.builder.selectionText,l=this.builder.selectionElm;let a;if(e){a=e;const l=a.getRangeAt(0),r=l.extractContents(),c=this.builder.doc.createElement("a");c.setAttribute("href",t),c.setAttribute("title",o),n.querySelector(".input-newwindow").checked?c.setAttribute("target","_blank"):c.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(c,"is-lightbox"):i.removeClass(c,"is-lightbox"),c.appendChild(r),l.insertNode(c),c.innerHTML=s,a.selectAllChildren(c)}else if(l){a=l,l.innerHTML=`<a class="dummylink" href="dummy">${s}</a>`;let e=this.builder.doc.querySelector(".dummylink");e.setAttribute("href",t),e.setAttribute("title",o),n.querySelector(".input-newwindow").checked?e.setAttribute("target","_blank"):e.removeAttribute("target"),n.querySelector(".input-openlightbox").checked?i.addClass(e,"is-lightbox"):i.removeClass(e,"is-lightbox"),i.selectElementContents(e),i.removeClass(e,"dummylink")}}}e.saveSelection(),this.builder.opts.onChange(),this.builder.opts.onRender()}if(e.hideModal(n),t&&t.isConnected&&!this.builder.activeIcon){const n=this.builder.editingEngine.active;n&&(n.focus(),i.selectElementContents(t),e.saveSelection())}}));let a=n.querySelector(".input-cancel");if(i.addEventListener(a,"click",(()=>{e.hideModal(n),e.appleMobile||e.restoreSelection()})),this.builder.opts.onOtherSelectClick||""!==this.builder.opts.otherSelect){n.querySelector(".input-select-other").style.display="block";let o=n.querySelector(".input-select-other");i.addEventListener(o,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:n.querySelector(".input-url"),theTrigger:n.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{o.removeAttribute("data-focus"),o.focus()}),!1,this.builder.assetPanelFullScreen),o.setAttribute("data-focus",!0)}this.builder.targetInput=n.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}if(this.builder.opts.onFileSelectClick||""!==this.builder.opts.fileselect){n.querySelector(".input-select").style.display="block",n.querySelector(".input-url").style.width="444px";let o=n.querySelector(".input-select");i.addEventListener(o,"click",(()=>{if(this.builder.opts.onFileSelectClick)this.builder.opts.onFileSelectClick({targetInput:n.querySelector(".input-url"),theTrigger:n.querySelector(".input-select")});else{let i=t.querySelector(".is-modal.fileselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.fileselect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.fileselect),e.showModal(i,!1,null,!1,this.builder.assetPanelFullScreen)}this.builder.targetInput=n.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="all"}))}else n.querySelector(".input-select").style.display="none",n.querySelector(".input-url").style.width="100%"}}click(t,e){const i=this.builder.dom;let n=!1;t.hasAttribute("data-html")&&(n=!0);let o=!1;t.hasAttribute("data-noedit")&&(o=!0);let s=!1;t.hasAttribute("data-protected")&&(s=!0);const l=e.target;if(this.builder.activeLink=null,this.builder.activeLinkButton=null,("a"===l.tagName.toLowerCase()||i.parentsHasTag(l,"a"))&&!n&&!o&&!s){if(l.childNodes.length>0&&l.childNodes[0].tagName&&"i"===l.childNodes[0].tagName.toLowerCase()&&1===l.childNodes.length&&""===l.childNodes[0].innerHTML){const t=document.querySelectorAll(".icon-active");Array.prototype.forEach.call(t,(t=>{i.removeClass(t,"icon-active")})),i.addClass(l.childNodes[0],"icon-active"),i.selectElementContents(l.childNodes[0]),this.builder.activeIcon=l.childNodes[0]}if("img"===l.tagName.toLowerCase())return;let t,n;if("a"===l.tagName.toLowerCase())t=l;else{let e=l;for(;"a"!==e.tagName.toLowerCase();)e=e.parentNode;t=e}this.builder.activeLink=t;let o=i.getStyle(t,"display");"inline-block"!==o&&"block"!==o&&"flex"!==o||(n=!0),n&&(this.builder.activeLinkButton=t),this.showTool(t),e.preventDefault()}}showTool(t){this.renderTool();const e=this.linkTool,i=this.builder.dom;let n,o;"inline"===i.getStyle(t,"display")&!this.builder.activeIcon?(e.querySelector(".link-duplicate").style.display="none",e.querySelector(".link-remove").style.display="none"):(e.querySelector(".link-duplicate").style.display="block",e.querySelector(".link-remove").style.display="block"),this.builder.useButtonPlugin||this.builder.opts.onButtonEdit?e.querySelector(".link-button-edit").style.display="none":t&&this.builder.activeLinkButton?e.querySelector(".link-button-edit").style.display="block":e.querySelector(".link-button-edit").style.display="none",this.buttonEditor&&i.hasClass(this.buttonEditor.buttonModal,"active")&&this.buttonEditor.realtime(),o=t.getBoundingClientRect().top+this.builder.win.pageYOffset,this.builder.activeIcon&&(o=this.builder.activeIcon.getBoundingClientRect().top+this.builder.win.pageYOffset),n=t.getBoundingClientRect().left,e.style.display="flex";const s=e.offsetWidth,l=e.offsetHeight;e.style.top=o-l-3+"px",e.style.left=n+t.offsetWidth*this.builder.opts.zoom-s+"px";const a=t=>{const e=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let i=t.target;i&&(i.closest("#divLinkTool")||i.closest(".is-modal")||i.closest(".keep-selection")||i.closest("a")||e||(this.hideTool(),this.buttonEditor&&this.buttonEditor.hide(),document.removeEventListener("click",a),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",a),this.builder.handleLinkButtonClick_=!1))};this.builder.handleLinkButtonClick_||(document.addEventListener("click",a),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",a),this.builder.handleLinkButtonClick_=!0)}hideTool(){this.linkTool&&(this.linkTool.style.display="")}editButton(){this.builder.opts.onButtonEdit?this.builder.opts.onButtonEdit(this.builder.activeLinkButton||this.builder.activeLink):(this.renderButtonPanel(),this.buttonEditor.open())}createLink(){this.renderPanel();const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(e.getSelection(),"inscribe"===this.builder.opts.engine){const t=this.builder.editingEngine.active;let e=t?t.linkElement():null;if(!e){const t=this.builder.selection;if(t&&t.length)for(const i of t){let t=i&&i.startContainer;t&&3===t.nodeType&&(t=t.parentNode);const n=t&&t.closest?t.closest("a"):null;if(n&&n.closest(".is-builder")){e=n;break}}}this.builder.activeLink=e||null}let n=i.getSelected(),o=t.querySelector(".is-modal.createlink");o.querySelector(".input-url").value="",o.querySelector(".input-newwindow").checked=!1,o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value="",o.querySelector(".input-text").value="",o.querySelector("#lblCreateLinkText").style.display="",o.querySelector("#inpCreateLinkText").style.display="";let s=this.builder.activeLink;if(s){let t=s.getAttribute("href"),e=s.getAttribute("target"),n=s.getAttribute("title"),l=s.innerHTML;o.querySelector(".input-url").value=t,o.querySelector(".input-newwindow").checked="_blank"===e,i.hasClass(s,"is-lightbox")?o.querySelector(".input-openlightbox").checked=!0:o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value=n,o.querySelector(".input-text").value=l}else o.querySelector(".input-text").value=n,this.builder.activeIcon&&(o.querySelector("#lblCreateLinkText").style.display="none",o.querySelector("#inpCreateLinkText").style.display="none");e.showModal(o,!0,(()=>{e.appleMobile||e.restoreSelection()}),!0),o.querySelector(".input-url").focus()}editLink(){this.renderPanel();const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=this.builder.activeLink,o=t.querySelector(".is-modal.createlink"),s=n.querySelector("i");o.querySelector("#lblCreateLinkText").style.display="",o.querySelector("#inpCreateLinkText").style.display="",1===n.childElementCount&&s&&i.hasClass(s,"icon")&&(o.querySelector("#lblCreateLinkText").style.display="none",o.querySelector("#inpCreateLinkText").style.display="none");let l=n.getAttribute("href"),a=n.getAttribute("target"),r=n.getAttribute("title"),c=n.innerHTML;o.querySelector(".input-url").value=l,o.querySelector(".input-newwindow").checked="_blank"===a,i.hasClass(n,"is-lightbox")?o.querySelector(".input-openlightbox").checked=!0:o.querySelector(".input-openlightbox").checked=!1,o.querySelector(".input-title").value=r,o.querySelector(".input-text").value=c,e.showModal(o,!0,null,!0),o.querySelector(".input-url").focus()}}class Rc{constructor(t){this.builder=t}renderTool(){const t=this.builder.util,e=this.builder.builderStuff,i=this.builder.contentStuff,n=this.builder.dom;this.dom=n,this.builderStuff=e;let o=e.querySelector("#divButtonTool");if(!o){let s=`<div id="divButtonTool" class="is-tool">\n <button title="${t.out("Edit Button")}" data-title="${t.out("Edit Button")}" class="button-edit">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-pencil"></use></svg>\n </button>\n <button title="${t.out("Duplicate")}" data-title="${t.out("Duplicate")}" class="button-duplicate">\n <svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-duplicate3"></use></svg>\n </button>\n <button title="${t.out("Delete")}" data-title="${t.out("Delete")}" class="button-remove">\n <svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;n.appendHtml(e,s),o=this.builder.iframe?i.querySelector("#divButtonTool"):e.querySelector("#divButtonTool"),this.buttonTool=o;let l=o.querySelector(".button-edit");n.addEventListener(l,"click",(()=>{this.editButton()}));let a=o.querySelector(".button-duplicate");n.addEventListener(a,"click",(()=>{if(this.builder.activeButton){this.builder.uo.saveForUndo();const t=this.builder.activeButton.cloneNode(!0);let e=t.querySelector(".elm-active");e&&n.removeClass(e,"elm-active"),this.builder.activeButton.parentNode.insertBefore(t,this.builder.activeButton),this.showTool(this.builder.activeButton)}}));let r=o.querySelector(".button-remove");n.addEventListener(r,"click",(()=>{this.builder.uo.saveForUndo(),this.builder.activeButton&&this.builder.activeButton.parentNode.removeChild(this.builder.activeButton),o.style.display="",this.builder.activeButton=null}))}}renderPanel(){this.builderStuff.querySelector(".is-modal.buttoneditor")||(this.buttonEditor=new Mc(this.builder))}click(t,e){let i=!1;t.hasAttribute("data-html")&&(i=!0);let n=!1;t.hasAttribute("data-noedit")&&(n=!0);let o=!1;t.hasAttribute("data-protected")&&(o=!0);const s=e.target;this.builder.activeButton=null;const l=s.closest("button");if(l&&!i&&!n&&!o){this.builder.activeButton=l,this.renderTool(),this.showTool(l);const t=e=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=e.target;n&&(n.closest("#divButtonTool")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("button")||i||(this.hideTool(),this.buttonEditor&&this.buttonEditor.hide(),document.removeEventListener("click",t),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",t),this.builder.handleButtonClick_=!1))};this.builder.handleButtonClick_||(document.addEventListener("click",t),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",t),this.builder.handleButtonClick_=!0),e.preventDefault()}}editButton(){this.builder.opts.onButtonEdit?this.builder.opts.onButtonEdit(this.builder.activeButton):(this.renderPanel(),this.buttonEditor.open())}showTool(t){const e=this.builder.dom;this.buttonEditor&&e.hasClass(this.buttonEditor.buttonModal,"active")&&this.buttonEditor.realtime();const i=this.buttonTool;i.querySelector(".button-edit").style.display=this.builder.opts.onButtonEdit?"none":"";let n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left;i.style.display="flex";const s=i.offsetWidth,l=i.offsetHeight;i.style.top=n-l-3+"px",i.style.left=o+t.offsetWidth*this.builder.opts.zoom-s+"px"}hideTool(){this.buttonTool&&(this.buttonTool.style.display="")}}class Ic{constructor(t){this.builder=t}renderTool(){if(this.spacerTool)return;const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-spacer-tool");if(!o){let s=`\n <div id="divSpacerTool" class="is-tool is-spacer-tool">\n <button title="${i.out("Decrease")}" data-value="-"><svg class="is-icon-flex"><use xlink:href="#icon-minus2"></use></svg></button>\n <button title="${i.out("Increase")}" data-value="+" style="border-left: none;"><svg class="is-icon-flex"><use xlink:href="#icon-plus"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-spacer-tool"):t.querySelector(".is-spacer-tool"),this.spacerTool=o;const l=o.querySelectorAll("button");Array.prototype.forEach.call(l,(t=>{n.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-value");let i=this.builder.activeSpacer;"-"===e?n.hasClass(i,"height-300")?(n.removeClass(i,"height-300"),n.addClass(i,"height-280")):n.hasClass(i,"height-280")?(n.removeClass(i,"height-280"),n.addClass(i,"height-260")):n.hasClass(i,"height-260")?(n.removeClass(i,"height-260"),n.addClass(i,"height-240")):n.hasClass(i,"height-240")?(n.removeClass(i,"height-240"),n.addClass(i,"height-220")):n.hasClass(i,"height-220")?(n.removeClass(i,"height-220"),n.addClass(i,"height-200")):n.hasClass(i,"height-200")?(n.removeClass(i,"height-200"),n.addClass(i,"height-180")):n.hasClass(i,"height-180")?(n.removeClass(i,"height-180"),n.addClass(i,"height-160")):n.hasClass(i,"height-160")?(n.removeClass(i,"height-160"),n.addClass(i,"height-140")):n.hasClass(i,"height-140")?(n.removeClass(i,"height-140"),n.addClass(i,"height-120")):n.hasClass(i,"height-120")?(n.removeClass(i,"height-120"),n.addClass(i,"height-100")):n.hasClass(i,"height-100")?(n.removeClass(i,"height-100"),n.addClass(i,"height-80")):n.hasClass(i,"height-80")?(n.removeClass(i,"height-80"),n.addClass(i,"height-60")):n.hasClass(i,"height-60")?(n.removeClass(i,"height-60"),n.addClass(i,"height-40")):n.hasClass(i,"height-40")&&(n.removeClass(i,"height-40"),n.addClass(i,"height-20")):n.hasClass(i,"height-20")?(n.removeClass(i,"height-20"),n.addClass(i,"height-40")):n.hasClass(i,"height-40")?(n.removeClass(i,"height-40"),n.addClass(i,"height-60")):n.hasClass(i,"height-60")?(n.removeClass(i,"height-60"),n.addClass(i,"height-80")):n.hasClass(i,"height-80")?(n.removeClass(i,"height-80"),n.addClass(i,"height-100")):n.hasClass(i,"height-100")?(n.removeClass(i,"height-100"),n.addClass(i,"height-120")):n.hasClass(i,"height-120")?(n.removeClass(i,"height-120"),n.addClass(i,"height-140")):n.hasClass(i,"height-140")?(n.removeClass(i,"height-140"),n.addClass(i,"height-160")):n.hasClass(i,"height-160")?(n.removeClass(i,"height-160"),n.addClass(i,"height-180")):n.hasClass(i,"height-180")?(n.removeClass(i,"height-180"),n.addClass(i,"height-200")):n.hasClass(i,"height-200")?(n.removeClass(i,"height-200"),n.addClass(i,"height-220")):n.hasClass(i,"height-220")?(n.removeClass(i,"height-220"),n.addClass(i,"height-240")):n.hasClass(i,"height-240")?(n.removeClass(i,"height-240"),n.addClass(i,"height-260")):n.hasClass(i,"height-260")?(n.removeClass(i,"height-260"),n.addClass(i,"height-280")):n.hasClass(i,"height-280")&&(n.removeClass(i,"height-280"),n.addClass(i,"height-300")),this.showTool(i),this.builder.opts.onChange(),this.builder.onSpacerChange&&this.builder.onSpacerChange()}))}))}}click(t){const e=this.builder.dom,i=t.target;e.hasClass(i,"spacer")?(this.builder.activeSpacer=i,document.selection?document.selection.empty():window.getSelection().removeAllRanges(),this.showTool(i)):this.hideTool()}showTool(t){this.renderTool();let e=t.getBoundingClientRect().top+this.builder.win.pageYOffset,i=t.getBoundingClientRect().left;this.spacerTool.style.display="flex";const n=this.spacerTool.offsetWidth,o=this.spacerTool.offsetHeight;this.spacerTool.style.top=e+(t.offsetHeight*this.builder.opts.zoom-o)/2+"px",this.spacerTool.style.left=i+(t.offsetWidth*this.builder.opts.zoom-n)/2+"px"}hideTool(){this.spacerTool&&(this.spacerTool.style.display="")}}const Oc=new ze;class Nc{constructor(t={}){let e={element:document};Object.assign(this,e,t);const i=()=>{let t=this.element.querySelectorAll(".is-tabs-more");Array.prototype.forEach.call(t,(t=>{t.style.display="none",t.setAttribute("aria-expanded",!1)})),document.removeEventListener("click",n)},n=t=>{t.target.closest(".is-tab-more")||t.target.closest("[data-menu]")||i()},o=t=>{const e=t.parentNode.getAttribute("data-group"),o=t.getAttribute("data-menu");if(o){document.addEventListener("click",n),t.setAttribute("aria-expanded",!0),this.element.querySelector("#"+o).style.display="block";let i=this.element.querySelector('.is-tabs-more[data-group="'+e+'"] > li.active');if(i)i.focus();else{this.element.querySelector('.is-tabs-more[data-group="'+e+'"]').focus()}return!1}if(Oc.hasClass(t,"active"))return!1;const s=t.getAttribute("data-content");if(!s)return!1;let l=this.element.querySelectorAll('.is-tabs[data-group="'+e+'"] > a');Array.prototype.forEach.call(l,(t=>{Oc.removeClass(t,"active")})),l=this.element.querySelectorAll('.is-tabs-more[data-group="'+e+'"] > li'),Array.prototype.forEach.call(l,(t=>{Oc.removeClass(t,"active")})),Oc.addClass(t,"active");let a=this.element.querySelectorAll('.is-tab-content[data-group="'+e+'"]');Array.prototype.forEach.call(a,(t=>{t.style.display="none",Oc.removeClass(t,"active")}));const r=this.element.querySelector("#"+s);r.style.display="flex",Oc.addClass(r,"active");const c=this.element.querySelector(".is-tabs-more");return c&&(c.style.display="none"),i(),this.setupTabKey(r),!1};let s=this.element.querySelectorAll(".is-tabs a");Array.prototype.forEach.call(s,(t=>{t.addEventListener("keydown",(e=>{if(e.preventDefault(),39===e.which&&e.target.nextElementSibling)e.target.nextElementSibling.focus();else if(37===e.which&&e.target.previousElementSibling)e.target.previousElementSibling.focus();else if(13===e.keyCode||32===e.keyCode)o(e.target);else if(9===e.which&&!e.shiftKey){let e=[];const i=t.parentNode.getAttribute("data-group");if(t.parentNode.parentNode.querySelector('.is-tab-content[data-group="'+i+'"].active').querySelectorAll('.is-tabs.active, a[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex]').forEach((t=>{e.push(t)})),0===e.length)return;e[0].focus()}})),t.addEventListener("click",(t=>{t.preventDefault(),o(t.target)}))}));const l=this.element.querySelectorAll(".is-tabs-more");Array.prototype.forEach.call(l,(t=>{t.addEventListener("keydown",(e=>{e.preventDefault(),40===e.keyCode&&e.target.nextElementSibling?t.querySelector("li").focus():27===e.keyCode&&i()}))})),s=this.element.querySelectorAll(".is-tabs-more li"),Array.prototype.forEach.call(s,(t=>{t.addEventListener("keydown",(e=>{if(e.preventDefault(),e.stopImmediatePropagation(),38===e.keyCode&&e.target.previousElementSibling)e.target.previousElementSibling.focus();else if(40===e.keyCode&&e.target.nextElementSibling)e.target.nextElementSibling.focus();else if(27===e.keyCode)i();else if((13===e.keyCode||32===e.keyCode)&&(o(e.target),e.target.closest(".is-tabs-more"))){const e=t.parentNode.getAttribute("id"),i=this.element.querySelector('.is-tabs a[data-menu="'+e+'"]');i&&i.focus()}})),t.addEventListener("click",(e=>{if(e.preventDefault(),o(e.target),e.target.closest(".is-tabs-more")){const e=t.parentNode.getAttribute("id"),i=this.element.querySelector('.is-tabs a[data-menu="'+e+'"]');i&&i.focus()}}))}))}setupTabKey(t){let e=[];if(t.querySelectorAll('.is-tabs.active, a[href], input:not([disabled]):not([type="hidden"]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex]').forEach((t=>{e.push(t)})),0===e.length)return;let i=e[0];e[e.length-1].addEventListener("keydown",(e=>{if(9===e.which&&!e.shiftKey){e.preventDefault();let i=t.getAttribute("id");const n=this.element.querySelector('li[data-content="'+i+'"],a[data-content="'+i+'"]');if(n.closest(".is-tabs-more")){i=n.parentNode.getAttribute("id");const t=this.element.querySelector('.is-tabs a[data-menu="'+i+'"]');t&&t.focus()}else n.focus()}})),i.addEventListener("keydown",(e=>{if(9===e.which&&e.shiftKey){e.preventDefault();let i=t.getAttribute("id");const n=this.element.querySelector('li[data-content="'+i+'"],a[data-content="'+i+'"]');if(n.closest(".is-tabs-more")){i=n.parentNode.getAttribute("id");const t=this.element.querySelector('.is-tabs a[data-menu="'+i+'"]');t&&t.focus()}else n.focus()}}))}}class $c{constructor(t,e){this.runtime=t,this.builder=e}t(t){return null==t?t:this.builder&&"function"==typeof this.builder.out?this.builder.out(t):t}generateForm(t,e,i){const n=this.runtime.getPlugin(t);if(!n)return this.createEmptyForm();if(!n.settings&&!n.editor)return this.createEmptyForm();n.settings||(n.settings={});const o=document.createElement("div");o.className="cb-settings-form";const s=this.getCurrentValues(e,n.settings);n.settings._groups?this.generateGroupedForm(o,n.settings,s):this.generateFlatForm(o,n.settings,s),o._cbBaseValues=this.getBaseValues(n.settings,s);const l=()=>this.updateConditionalFields(o);return l(),o.addEventListener("input",l),o.addEventListener("change",l),"function"==typeof i&&o.addEventListener("input",(()=>{const t=this.getFormValues(o);i(t,e)})),o}generateFlatForm(t,e,i){Object.keys(e).forEach((n=>{if(n.startsWith("_"))return;const o=e[n];if(o.hidden)return;const s=this.createField(n,o,i[n]);t.appendChild(s)}))}generateGroupedForm(t,e,i){(e._groups||[]).forEach((n=>{const o=document.createElement("div");o.className="cb-settings-group";const s=document.createElement("h3");s.className="cb-settings-group-title",s.style.cssText="font-size: 16px;font-weight: 400;",s.textContent=this.t(n.label),o.appendChild(s),n.fields.forEach((t=>{const n=e[t];if(!n)return;if(n.hidden)return;const s=this.createField(t,n,i[t]);o.appendChild(s)})),t.appendChild(o)}))}updateConditionalFields(t){const e=t.querySelectorAll("[data-depends-on]");if(!e.length)return;const i=Object.assign({},t._cbBaseValues,this.getFormValues(t));e.forEach((t=>{const e=t._cbDependsOn||this.parseDependsOn(t.getAttribute("data-depends-on"));t.style.display=this.matchesDependsOn(e,i)?"":"none"})),t.querySelectorAll(".cb-settings-group").forEach((t=>{const e=t.querySelectorAll(".cb-settings-field");if(!e.length)return;const i=Array.prototype.some.call(e,(t=>"none"!==t.style.display));t.style.display=i?"":"none"}))}getBaseValues(t,e){const i={};return t?(Object.keys(t).forEach((e=>{e.startsWith("_")||t[e]&&void 0!==t[e].default&&(i[e]=t[e].default)})),Object.assign(i,e)):i}parseDependsOn(t){try{return JSON.parse(t)}catch(t){return null}}matchesDependsOn(t,e){if(!t)return!0;return(Array.isArray(t)?t:[t]).every((t=>{if(!t||!t.field)return!0;if(!(t.field in e))return!0;const i=e[t.field];return"not"in t?!this.dependsOnValueMatches(t.not,i):"value"in t?this.dependsOnValueMatches(t.value,i):void 0!==i&&""!==i&&!1!==i&&"false"!==i}))}dependsOnValueMatches(t,e){return(Array.isArray(t)?t:[t]).some((t=>String(t)===String(e)))}createField(t,e,i){const n=document.createElement("div");n.className="cb-settings-field",n.style.marginBottom="10px",n.setAttribute("data-field",t),e.dependsOn&&(n.setAttribute("data-depends-on",JSON.stringify(e.dependsOn)),n._cbDependsOn=e.dependsOn,n.style.display="none");const o=document.createElement("label");o.className="cb-settings-label",o.textContent=this.t(e.label||t);const s=this.createInput(t,e,i);return n.appendChild(s),n}createInput(t,e,i){const n=void 0!==i?i:e.default;switch(e.type){case"number":return this.createNumberInput(t,e,n);case"boolean":return this.createCheckboxInput(t,e,n);case"select":return this.createSelectInput(t,e,n);case"radio":return this.createRadioInput(t,e,n);case"textarea":return this.createTextareaInput(t,e,n);case"color":return this.createColorInput(t,e,n);case"range":return this.createRangeInput(t,e,n);default:return this.createTextInput(t,e,n)}}createTextInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("input");if(s.type="text",s.name=t,s.value=i||"",e.placeholder&&(s.placeholder=this.t(e.placeholder)),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createNumberInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),e.unit&&(o.textContent+=` (${e.unit})`),n.appendChild(o);const s=document.createElement("input");if(s.type="number",s.style.cssText="width: 100px;",s.name=t,s.value=void 0!==i?i:e.default,void 0!==e.min&&(s.min=e.min),void 0!==e.max&&(s.max=e.max),void 0!==e.step&&(s.step=e.step),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createCheckboxInput(t,e,i){const n=document.createElement("label");n.className="label checkbox";const o=document.createElement("div"),s=document.createElement("input");s.type="checkbox",s.name=t,s.checked=void 0!==i?i:e.default;const l=document.createElement("span");if(l.textContent=this.t(e.label||t),n.appendChild(s),n.appendChild(l),o.appendChild(n),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),o.appendChild(t)}return n}createSelectInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createTextNode(this.t(e.label||t));n.appendChild(o);const s=document.createElement("select");if(s.name=t,e.options.forEach((t=>{const e=document.createElement("option");e.value=t.value,e.textContent=this.t(t.label),t.value===i&&(e.selected=!0),s.appendChild(e)})),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createRadioInput(t,e,i){const n=document.createElement("div"),o=document.createElement("div");if(o.textContent=this.t(e.label||t),o.style.cssText="margin-bottom: 8px;font-weight: 590;",n.appendChild(o),e.options.forEach((e=>{const o=document.createElement("label");o.className="label checkbox";const s=document.createElement("input");s.type="radio",s.name=t,s.value=e.value,s.checked=e.value===i;const l=document.createElement("span");l.textContent=this.t(e.label),o.appendChild(s),o.appendChild(l),n.appendChild(o)})),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createTextareaInput(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("textarea");if(s.name=t,s.value=i||"",s.rows=e.rows||4,e.placeholder&&(s.placeholder=this.t(e.placeholder)),n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}hexToRgba(t){if(/^rgba?\(/i.test(t))return t;3!==(t=t.replace(/^#/,"")).length&&4!==t.length||(t=t.split("").map((t=>t+t)).join(""));return`rgba(${parseInt(t.substring(0,2),16)}, ${parseInt(t.substring(2,4),16)}, ${parseInt(t.substring(4,6),16)}, ${8===t.length?parseInt(t.substring(6,8),16)/255:1})`}toHex(t){const e=document.createElement("canvas").getContext("2d");e.fillStyle=t;const i=e.fillStyle;if(i.startsWith("#"))return i;const n=i.match(/\d+(\.\d+)?/g).map(Number),[o,s,l,a=1]=n,r=[o,s,l].map((t=>t.toString(16).padStart(2,"0"))).join(""),c=Math.round(255*a).toString(16).padStart(2,"0");return a<1?`#${r}${c}`:`#${r}`}createColorInput(t,e,i){const n=document.createElement("div"),o=document.createElement("label");o.className="label",o.style.cursor="pointer";const s=document.createElement("div");s.textContent=this.t(e.label||t),o.appendChild(s);const l=document.createElement("input");l.type="hidden",l.name=t,l.value=i||e.default||"#000000";const a=document.createElement("div");a.className="group",a.style.cssText="width: 52px; margin:0; overflow: visible;";const r=document.createElement("button");r.type="button",r.title=this.t(e.label||"Color"),r.className="btn-color is-btn-color",r.style.backgroundColor=this.hexToRgba(l.value),r.setAttribute("aria-label",`Choose color for ${this.t(e.label||t)}`);if(r.addEventListener("click",(t=>{t.preventDefault(),this.builder.openColorPicker(l.value,(t=>{const e=this.toHex(t);l.value=e,r.style.backgroundColor=t,l.dispatchEvent(new Event("input",{bubbles:!0}))}),r)})),o.addEventListener("click",(t=>{t.target!==o&&t.target!==s||r.click()})),a.appendChild(r),o.appendChild(l),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),o.appendChild(t)}return n.appendChild(o),n.appendChild(a),n}createColorInput2(t,e,i){const n=document.createElement("label");n.className="label";const o=document.createElement("div");o.textContent=this.t(e.label||t),n.appendChild(o);const s=document.createElement("input");if(s.type="color",s.name=t,s.style.cssText="width:40px;height:40px",s.value=i||e.default||"#000000",n.appendChild(s),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}createRangeInput(t,e,i){const n=document.createElement("label");n.className="label";const o=void 0!==i?i:e.default,s=document.createElement("div");s.textContent=this.t(e.label||t)+": "+o+(e.unit||""),n.appendChild(s);const l=document.createElement("input");if(l.type="range",l.className="is-rangeslider",l.name=t,void 0!==e.min&&(l.min=e.min),void 0!==e.max&&(l.max=e.max),void 0!==e.step&&(l.step=e.step),l.value=o,l.addEventListener("input",(()=>{s.textContent=this.t(e.label||t)+": "+l.value+(e.unit||"")})),n.appendChild(l),e.description){const t=document.createElement("small");t.style.cssText="display: block;margin-top: 4px;",t.textContent=this.t(e.description),n.appendChild(t)}return n}getCurrentValues(t,e){const i={};return e?(Object.keys(e).forEach((n=>{if(n.startsWith("_"))return;const o="data-cb-"+n.replace(/([A-Z])/g,"-$1").toLowerCase(),s=t.getAttribute(o);null!==s&&(i[n]=this.parseValue(s,e[n].type))})),i):i}parseValue(t,e){switch(e){case"number":return parseFloat(t);case"boolean":return"true"===t;default:return t}}getFormValues(t){const e={};return t.querySelectorAll("input, select, textarea").forEach((t=>{const i=t.name;i&&("checkbox"===t.type?e[i]=t.checked:"radio"===t.type?t.checked&&(e[i]=t.value):e[i]=t.value)})),e}applyValues(t,e){Object.keys(e).forEach((i=>{const n="data-cb-"+i.replace(/([A-Z])/g,"-$1").toLowerCase();t.setAttribute(n,e[i])}))}createEmptyForm(){const t=document.createElement("div");return t.className="cb-settings-form",t.innerHTML="<p>This plugin has no configurable settings.</p>",t}}class Pc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-plugin-tool");if(!o){let s=`\n <div class="is-tool is-plugin-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-plugin-tool"):t.querySelector(".is-plugin-tool"),this.pluginTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.pluginModal&&this.pluginModal.classList.contains("active")?this.hidePluginEditor():(this.renderPanel(),this.showPluginEditor()),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.pluginsettings");if(!n){let o=`\n <div class="is-modal is-modal-content pluginsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n <span>${e.out("Plugin Settings")}</span>\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="is-modal-controls" style="box-sizing:border-box;padding:30px;overflow-y: auto;">\n <div class="is-tabs" data-group="table">\n <a title="${e.out("Style")}" id="tabTableGeneral" href="" data-content="divTableGeneral" class="active">${e.out("Style")}</a>\n <a title="${e.out("Layout")}" id="tabTableLayout" href="" data-content="divTableLayout">${e.out("Layout")}</a>\n </div>\n <div id="divTableGeneral" class="is-tab-content active" tabindex="-1" data-group="table" style="display:block">\n\n <div style="display:flex;padding-bottom:12px">\n <div style="padding-right:15px">\n <div>${e.out("Background")}:</div>\n <div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor is-btn-color"></button>\n </div>\n </div>\n <div>\n <div>${e.out("Text Color")}:</div>\n <div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor is-btn-color"></button>\n </div>\n </div>\n </div>\n\n <div style="padding-bottom:12px;">\n <div>${e.out("Border Thickness")}:</div>\n <div>\n <select id="selCellBorderWidth" style="width:120px;"><option value="0">No Border</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select> \n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Border Color")}:</div>\n <div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor is-btn-color"></button>\n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Apply To")}:</div>\n <div>\n <select id="selTableApplyTo" style="width:120px;">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option> \n <option value="currentcell">${e.out("Current Cell")}</option> \n </select>\n </div>\n </div>\n\n </div>\n\n <div id="divTableLayout" class="is-tab-content" tabindex="-1" data-group="table">\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Insert Row")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Above")}" data-table-cmd="rowabove" title="${e.out("Above")}" style="margin-right:15px"> ${e.out("Above")} </button>\n <button class="classic" title="${e.out("Below")}" data-table-cmd="rowbelow" title="${e.out("Below")}" style=""> ${e.out("Below")} </button>\n </div> \n </div>\n \n <div style="padding-bottom:15px;">\n <div>${e.out("Insert Column")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Left")}" data-table-cmd="columnleft" title="${e.out("Left")}" style="margin-right:15px"> ${e.out("Left")} </button> \n <button class="classic" title="${e.out("Right")}" data-table-cmd="columnright" title="${e.out("Right")}" style=""> ${e.out("Right")} </button> \n </div> \n </div>\n\n <div style="padding-bottom:15px;">\n <button class="classic" title="${e.out("Delete Row")}" data-table-cmd="delrow" title="Delete Row" style=""> ${e.out("Delete Row")} </button> \n </div>\n\n <div style="padding-bottom:15px;"> \n <button class="classic" title="${e.out("Delete Column")}" data-table-cmd="delcolumn" title="Delete Column" style=""> ${e.out("Delete Column")} </button> \n </div>\n \n <div> \n <button class="classic" title="${e.out("Merge Cell")}" data-table-cmd="mergecell" style="">${e.out("Merge Cell")}</button> \n </div>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.pluginsettings"),this.pluginModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo(),this.builder.opts.onChange(),e.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{e.hideModal(n)})),new Nc({element:n}),new vs({selector:".is-modal.pluginsettings .is-draggable"})}}showPluginEditor(){const t=this.pluginModal;this.builder.util.showModal(t),this.builder.util.applyModalPosition(t,this.builder.opts.pluginSettingsPosition),this.realtime();const e=t=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=t.target,o=!document.contains(n);this.builder.doc.activeElement&&this.builder.doc.activeElement.closest(".is-modal")||n&&(n.closest(".is-plugin-tool")||n.closest(".is-sidebar")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("[data-cb-type]")||i||o||(this.hidePluginEditor(),document.removeEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",e),this.builder.handlePluginClick_=!1),n.closest("[data-cb-type]")&&this.realtime())};this.builder.handlePluginClick_||(this.builder.handlePluginClick_=!0,setTimeout((()=>{document.addEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",e)}),0))}hidePluginEditor(){const t=this.pluginModal;this.builder.destroyPanelEditors&&this.builder.destroyPanelEditors(),t&&this.builder.util.hideModal(t)}realtime(){const t=this.builder.util,e=this.pluginModal;let i=this.builder.activePlugin;const n=this.builder.win.builderRuntime;if(i&&n){const o=i.getAttribute("data-cb-type"),s=n.getPlugin(o);if(!s){const t=n.pluginManager;return void(t&&t.loadPlugin&&t.loadPlugin(o).then((t=>{t&&this.builder.activePlugin===i&&this.realtime()})))}let l=t.out(s.displayName||s.name);e.querySelector(".is-modal-bar > span").innerHTML=l;const a=e.querySelector(".is-modal-controls");this.builder.destroyPanelEditors&&this.builder.destroyPanelEditors(),a.innerHTML="";const r=document.createElement("div");r.classList.add("submain"),a.appendChild(r),this.currentElement=i,this.generator=new $c(n,this.builder);const c=s&&s.editor&&s.editor.openContentEditor;if(c){const t=i.getAttribute("data-cb-original-content");let e=document.querySelector(".editable-clone");e&&e.remove(),e=i.cloneNode(!1),e.innerHTML=t,e.className="editable-clone",e.style.display="none",document.body.appendChild(e);const o=e.cloneNode(!1),l=s.editor.openContentEditor(e,this.builder,(async()=>{this.builder.uo.saveForUndo(),i.setAttribute("data-cb-original-content",e.innerHTML);const t=((t,e)=>{const i=[];for(const n of Object.keys(t.dataset))n in e.dataset&&t.dataset[n]!==e.dataset[n]&&i.push(n);return i})(o,e);for(const n of t)i.dataset[n]=e.dataset[n];i.innerHTML=e.innerHTML,e.remove(),await n.reinitialize(i.parentElement),this.builder.onChange(),this.builder.enableEditableRegions(i)}));r.appendChild(l)}this.currentForm=this.generator.generateForm(o,i,(()=>{this.builder.uo.saveForUndo(),this.applyChanges(n)})),c&&(this.currentForm.style.marginTop="20px"),r.appendChild(this.currentForm)}}async applyChanges(t){if(!this.currentElement||!this.currentForm)return;const e=this.generator.getFormValues(this.currentForm);this.generator.applyValues(this.currentElement,e);const i=this.currentElement.parentElement||this.currentElement.closest(".is-wrapper");await t.reinitialize(i),this.builder.opts.onChange()}click(t){const e=t.target.closest("[data-cb-type]");if(e){if(this.builder.activePlugin=e,!this.builder.isContentBox){this.renderTool(),this.pluginTool.style.display="flex";let t=this.pluginTool.offsetWidth,i=this.pluginTool.offsetHeight;const n=e.getBoundingClientRect(),o=this.builder.win.pageYOffset,s=window.innerWidth;let l,a;if("SPAN"===e.tagName){const r=e.getClientRects(),c=r.length?r[r.length-1]:n;a=c.right-9,l=n.top+o-i-2,n.top-i-2<0&&(l=n.bottom+o+2),a+t>s-4&&(a=Math.max(2,c.right-t))}else{let i=e.offsetWidth*this.builder.opts.zoom;l=n.top+o,a=n.left-2+(i-t),t+a>s&&(a=n.left)}this.pluginTool.style.top=l+"px",this.pluginTool.style.left=a+"px"}}else this.builder.activePlugin=null,this.pluginTool&&(this.pluginTool.style.display="")}}class Dc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;this.dom=n;let o=t.querySelector(".is-module-tool");if(!o){let s=`\n <div class="is-tool is-module-tool">\n <button class="btn-module-refresh" title="${i.out("Refresh")}" data-title="${i.out("Refresh")}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-reload"></use></svg></button>\n <button class="btn-module-settings" title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-module-tool"):t.querySelector(".is-module-tool"),this.moduleTool=o;const l=o.querySelector(".btn-module-settings");l.addEventListener("click",(async()=>{this.edit(l)}));o.querySelector(".btn-module-refresh").addEventListener("click",(async()=>{let t=this.builder.activeModule;t.click(),i.refreshModuleLayout(t)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.custommodule");if(!n){let o=`\n\n <input id="hidContentModuleCode" type="hidden" />\n <input id="hidContentModuleSettings" type="hidden" />\n \n <div class="is-modal custommodule" tabindex="-1" role="dialog" aria-modal="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Module Settings")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <iframe tabindex="0" style="position: absolute;top: 0;left: 0;width:100%;height:100%;border:none;border-bottom:90px solid transparent;border-top:40px solid transparent;margin:0;box-sizing:border-box;" src="about:blank"></iframe>\n <div style="width:100%;height:90px;padding: 20px; box-sizing: border-box;position:absolute;left:0;bottom:0;overflow:hidden;text-align:right">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div> \n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.custommodule"),this.moduleModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{let i=n.querySelector("iframe");if(!i.contentWindow.construct)return;{const t=i.contentWindow.construct();if("object"==typeof t&&null!==t&&t.error)return void alert(t.error)}this.builder.uo.saveForUndo();let o=this.builder.activeModule;o.setAttribute("data-html",encodeURIComponent(t.querySelector("#hidContentModuleCode").value)),o.setAttribute("data-settings",encodeURIComponent(t.querySelector("#hidContentModuleSettings").value));let s=t.querySelector("#hidContentModuleCode").value;s=s.replace(/{id}/g,e.makeId()),s=s.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),o.innerHTML="";var l=document.createRange();l.setStart(o,0),o.appendChild(l.createContextualFragment(s));let a=o.querySelectorAll("[data-subblock]");var r=1;Array.prototype.forEach.call(a,(t=>{o.getAttribute("data-html-"+r)&&(t.innerHTML=decodeURIComponent(o.getAttribute("data-html-"+r))),r++}));let c=this.builder.doc.querySelector(".builder-active");c&&this.builder.applyBehaviorOn(c);o.querySelectorAll(".grid-sortable").forEach((t=>{new Bt(t,{animation:600,dragClass:"hide-drag-class",onStart:()=>{this.builder.uo.saveForUndo()},onSort:()=>{if(t.closest("[data-html]")){const e=t.closest("[data-html]"),i=encodeURIComponent(e.innerHTML);e.setAttribute("data-html",i),this.builder.opts.onChange()}}})})),this.builder.opts.onChange(),this.builder.opts.onRender(),this.builder.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{this.builder.hideModal(n)})),new vs({selector:".is-modal.custommodule .is-draggable"})}}async edit(t){const e=this.builder.util,i=this.builder.dom;this.renderPanel();let n=this.builder.activeModule;const o=this.moduleModal;i.removeAttributes(this.builder.doc.querySelectorAll("[data-module-active]"),"data-module-active"),n.setAttribute("data-module-active","1");var s=n.getAttribute("data-module"),l=n.getAttribute("data-module-desc");o.querySelector(".is-modal-bar").innerHTML=l?e.out(l)+`<button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">\n <svg class="is-icon-flex" style="width:30px;height:30px;"><use xlink:href="#ion-ios-close-empty"></use></svg>\n </button>`:e.out("Module Settings")+`<button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">\n <svg class="is-icon-flex" style="width:30px;height:30px;"><use xlink:href="#ion-ios-close-empty"></use></svg>\n </button>`;var a=n.getAttribute("data-dialog-width");a&&""!==a||(a="900px");var r=n.getAttribute("data-dialog-height");r&&""!==r||(r="570px"),"slider-builder"===s&&(o.querySelector("div:not(.is-modal-overlay)").style.width="90vw",a="1500px",r="80vh"),o.querySelector("div:not(.is-modal-overlay)").style.width="90vw",o.querySelector("div:not(.is-modal-overlay)").style.maxWidth=a,o.querySelector("div:not(.is-modal-overlay)").style.height=r,n.getAttribute("data-theme-light")||"form-builder"===s?o.classList.add("theme-light"):o.classList.remove("theme-light");let c=o.querySelector(".is-modal-close");i.addEventListener(c,"click",(()=>{e.hideModal(o)}));var u=1;const d=n.querySelectorAll("[data-subblock]");if(Array.prototype.forEach.call(d,(t=>{if(i.hasClass(t.parentNode,"glide__slide--clone"))return;let e=t.innerHTML;n.setAttribute("data-html-"+u,encodeURIComponent(e)),u++})),"side"===n.getAttribute("data-panel")&&this.builder.controlPanel);else{let i=o.querySelector("iframe");i.style.opacity=.001,e.showModal(o,!0,(()=>{t&&(t.removeAttribute("data-focus"),t.focus())})),t&&t.setAttribute("data-focus",!0);let n=await fetch(this.builder.opts.modulePath+s+".html");n=await n.text(),n=n.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),n=n.replace(/="assets\//g,'="'+this.builder.settings.assetPath),i.srcdoc=n,setTimeout((()=>{i.style.opacity=""}),1)}}click(t){let e=!1;if(t.hasAttribute("data-module")&&(e=!0),e){this.builder.activeModule=t,this.renderTool(),this.moduleTool.style.display="flex";const e=this.moduleTool.querySelector(".btn-module-settings");"side"===t.getAttribute("data-panel")&&this.builder.controlPanel?e.style.display="none":e.style.display="",this.repositionModuleTool();"button"===this.builder.doc.activeElement.tagName.toLowerCase()&&(this.moduleTool&&(this.moduleTool.style.display=""),setTimeout((()=>{this.builder.colTool.lockIndicator.style.display=""}),0))}else this.builder.activeModule=null,this.moduleTool&&(this.moduleTool.style.display="")}repositionModuleTool(){if(!this.builder.activeModule)return;if("flex"!==this.moduleTool.style.display)return;let t=this.builder.activeModule,e=this.moduleTool.offsetWidth,i=t.offsetWidth*this.builder.opts.zoom,n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left-2;o+=i-e;e+o>window.innerWidth&&(o=t.getBoundingClientRect().left),this.moduleTool.style.top=n+"px",this.moduleTool.style.left=o+"px"}}class Bc{constructor(t){this.builder=t,this.renderTool()}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-code-tool");if(!o){let s=`\n <div class="is-tool is-code-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-code-tool"):t.querySelector(".is-code-tool"),this.codeTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.edit(l)}))}}edit(){const t=this.builder.builderStuff,e=this.builder.dom;let i=this.builder.activeCodeBlock;this.builder.htmlutil.renderPanel();let n=t.querySelector("#tmp_buildercontent");n&&n.parentNode.removeChild(n),e.appendHtml(t,'<div id="tmp_buildercontent" style="position:absolute;top:0;left:0;width:1px;height:1px;overflow:hidden;visibility:hidden;"></div>'),n=t.querySelector("#tmp_buildercontent");let o=1;const s=i.querySelectorAll("is-builder");Array.prototype.forEach.call(s,(s=>{let l=s.innerHTML;n=t.querySelector("#tmp_buildercontent"),n.innerHTML=l;let a=n.querySelectorAll(".elm-active");e.removeClasses(a,"elm-active"),a=n.querySelectorAll(".elm-inspected"),e.removeClasses(a,"elm-inspected"),a=n.querySelectorAll(".cell-active"),e.removeClasses(a,"cell-active"),a=n.querySelectorAll(".row-active"),e.removeClasses(a,"row-active"),a=n.querySelectorAll(".row-outline"),e.removeClasses(a,"row-outline"),a=n.querySelectorAll(".row-outline"),e.removeClasses(a,"row-outline"),a=n.querySelectorAll("[data-click]"),e.removeAttributes(a,"data-click"),a=n.querySelectorAll("[contenteditable]"),e.removeAttributes(a,"contenteditable"),a=n.querySelectorAll("[data-module-active]"),e.removeAttributes(a,"data-module-active"),e.removeElements(n.querySelectorAll(".is-row-tool")),e.removeElements(n.querySelectorAll(".is-col-tool")),e.removeElements(n.querySelectorAll(".is-rowadd-tool")),e.removeElements(n.querySelectorAll(".ovl")),e.removeElements(n.querySelectorAll(".row-add-initial")),a=n.querySelectorAll("[data-keep]"),e.removeAttributes(a,"data-keep"),l=n.innerHTML.trim(),l=l.replace(/<font/g,"<span").replace(/<\/font/g,"</span"),i.setAttribute("data-html-"+o,encodeURIComponent(l)),o++}));let l,a=decodeURIComponent(i.getAttribute("data-html"));a=a.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),n.parentNode.removeChild(n),l=this.builder.opts.htmlSyntaxHighlighting?t.querySelector(".viewhtmlmonaco"):t.querySelector(".viewhtml");let r=l.querySelector("textarea");a=a.replaceAll("{id}","__id__"),a=(0,Eo.html)(a),a=a.replaceAll("__id__","{id}"),r.value=a,this.builder.htmlutil.view("code")}click(t){let e=!1;if(t.hasAttribute("data-html")&&!t.hasAttribute("data-module")&&(e=!0),e){this.builder.activeCodeBlock=t;let e=t;this.renderTool(),this.codeTool.style.display="flex";let i=this.codeTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left-2;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.codeTool.style.top=o+"px",this.codeTool.style.left=s+"px"}else this.builder.activeCodeBlock=null,this.codeTool&&(this.codeTool.style.display="")}}class Hc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-iframe-tool");if(!o){let s=`\n <div class="is-tool is-iframe-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-iframe-tool"):t.querySelector(".is-iframe-tool"),this.iframeTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.renderPanel();const t=this.iframeModal;let e=this.builder.activeIframe,n=e.src;const o=t.querySelector(".input-src"),s=t.querySelector(".input-embedcode");o.value="",s.value="",i.showModal(t,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),null!=/^.*\/\/www.youtube.com\/embed\//.exec(n)||null!=/^.*\/\/player.vimeo.com\/video\//.exec(n)?(s.style.display="none",o.style.display="block",o.value=n,o.focus()):(o.style.display="none",s.style.display="block",s.value=e.outerHTML,s.focus()),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.iframelink");if(!n){let o=`\n <div class="is-modal iframelink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <input class="input-src" id="__iframelink_input_src" type="text" placeholder="Source" style="width:100%;margin-bottom:12px;"/>\n <textarea class="input-embedcode" id="__iframelink_input_embedcode" type="text" placeholder="Embed Code" style="width:100%;height:300px;margin-bottom:12px;display:none;"></textarea>\n <div style="text-align:right">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.iframelink"),this.iframeModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeIframe,i=t.parentNode;if(""!==n.querySelector(".input-src").value){var o=n.querySelector(".input-src").value,s=/^http[s]?:\/\/(((www.youtube.com\/watch\?(feature=player_detailpage&)?)v=)|(youtu.be\/))([^#&?]*)/.exec(o),l=/^.*(vimeo\.com\/)((channels\/[A-z]+\/)|(groups\/[A-z]+\/videos\/)|(video\/))?([0-9]+)\/?/.exec(o);if(null===s&&null===l||-1!==o.indexOf("player.vimeo.com")||-1!==o.indexOf("youtube.com/embed/"))t.src=o;else{if(null!=s&&s.length>=7)o="https://www.youtube.com/embed/"+s[6]+"?rel=0";if(null!=l&&l.length>=7)o="https://player.vimeo.com/video/"+l[6];t.src=o}this.builder.opts.onChange()}else{const o=n.querySelector(".input-embedcode"),s=o.value;if(-1===s.toLowerCase().indexOf("<iframe"))return void(alert(e.out("Please enter <iframe> element."))||o.focus());""!==s&&(t.outerHTML=s),this.builder.activeIframe=i.querySelector("iframe");let l=this.builder.doc.querySelector(".builder-active");l&&this.builder.applyBehaviorOn(l),this.builder.opts.onChange(),this.builder.onIframeChange&&this.builder.onIframeChange()}e.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{e.hideModal(n)}))}}click(t){const e=this.builder.dom;if(!e.hasClass(t.target,"ovl")||!t.target.parentNode.querySelector("audio"))if(e.hasClass(t.target,"ovl")){t.target.style.display="none",this.builder.activeIframe=t.target.parentNode.querySelector("iframe");let e=this.builder.activeIframe;this.renderTool(),this.iframeTool.style.display="flex";let i=this.iframeTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left-2;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.iframeTool.style.top=o+"px",this.iframeTool.style.left=s+"px"}else{let t=this.builder.doc.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display="block"})),this.builder.activeIframe=null,this.iframeTool&&(this.iframeTool.style.display="")}}}function zc(t){return t%2==0}function Fc(t,e,i){if("currentcell"===i)return e?[e]:[];const n=[],o=e?e.parentNode:null,s=e?function(t,e,i){let n=0,o=!1;for(let t=0;t<e.cells.length;t++)o||(n+=e.cells[t].colSpan),i===e.cells[t]&&(o=!0);return n-=i.colSpan-1,n-1}(0,o,e):-1;for(let e=0;e<t.rows.length;e++){const l=t.rows[e];for(let t=0;t<l.cells.length;t++){const a=l.cells[t];("table"===i||"evenrows"===i&&zc(e+1)||"oddrows"===i&&!zc(e+1)||"currentrow"===i&&l===o||"currentcol"===i&&t===s)&&n.push(a)}}return n}function Uc(t){t.opts&&t.opts.onChange&&t.opts.onChange()}function jc(t,e,i,n,o){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.backgroundColor=o})),Uc(t))}function Wc(t,e,i,n,o){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.color=o})),Uc(t))}function Vc(t,e,i,n,o,s){e&&i&&(t.uo.saveForUndo(),Fc(e,i,n).forEach((t=>{t.style.borderWidth=s+"px",t.style.borderStyle="solid",t.style.borderColor=o})),Uc(t))}function Gc(t,e,i,n,o,s){if(!e||!i)return;t.uo.saveForUndo();const l="0"===String(o);Fc(e,i,n).forEach((t=>{l?(t.style.borderWidth="",t.style.borderStyle="",t.style.borderColor=""):(t.style.borderWidth=o+"px",t.style.borderStyle="solid",t.style.borderColor=s)})),Uc(t)}class Yc{constructor(t){this.builder=t,this.modal=null,this._target={table:null,cell:null},this._onTrack=t=>this._track(t)}get isOpen(){return this.modal&&this.modal.classList.contains("active")}_render(){if(this.modal)return;const t=this.builder,e=t.util,i=t.dom,n=`\n <div class="is-modal is-modal-content edittablestyle" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${e.out("Table")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="ts-body">\n <div class="ts-row">\n <div class="ts-field w-full">\n <div class="ts-label">${e.out("Background")}</div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor cb-colorbtn"><span></span></button>\n </div>\n <div class="ts-field w-full">\n <div class="ts-label">${e.out("Text Color")}</div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor cb-colorbtn"><span></span></button>\n </div>\n </div>\n\n <div class="ts-sep"></div>\n\n <div class="ts-label">${e.out("Border")}</div>\n <div class="ts-borderrow">\n <div class="ts-seg" role="group" aria-label="${e.out("Border Thickness")}">\n <button type="button" class="tbw-seg on" data-value="0">${e.out("None")}</button>\n <button type="button" class="tbw-seg" data-value="1">1</button>\n <button type="button" class="tbw-seg" data-value="2">2</button>\n <button type="button" class="tbw-seg" data-value="3">3</button>\n </div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor cb-colorbtn"><span></span></button>\n </div>\n <select class="input-table-borderwidth" style="display:none"><option value="0">${e.out("No Border")}</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>\n\n <div class="ts-sep"></div>\n\n <div class="ts-field">\n <div class="ts-label">${e.out("Apply To")}</div>\n <select class="input-table-applyto">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option>\n <option value="currentcell">${e.out("Current Cell")}</option>\n </select>\n </div>\n </div>\n </div>`;i.appendHtml(t.builderStuff,n),this.modal=t.builderStuff.querySelector(".is-modal.edittablestyle");const o=()=>this.modal.querySelector(".input-table-applyto").value,s=this.modal.querySelector(".input-table-bordercolor"),l=this.modal.querySelector(".input-table-borderwidth"),a=(i,n,o)=>{const s=this._target;s.table&&s.cell&&(i.setAttribute("data-focus",!0),t.colorPicker.open((t=>{o(this._target,t),e.paintColorButton(i,t)}),n(),(()=>{i.removeAttribute("data-focus"),i.focus()})))},r=this.modal.querySelector(".input-table-bgcolor");r.addEventListener("click",(()=>a(r,(()=>r.querySelector("span").style.backgroundColor),((e,i)=>jc(t,e.table,e.cell,o(),i)))));const c=this.modal.querySelector(".input-table-textcolor");c.addEventListener("click",(()=>a(c,(()=>c.querySelector("span").style.backgroundColor),((e,i)=>Wc(t,e.table,e.cell,o(),i))))),s.addEventListener("click",(()=>a(s,(()=>s.querySelector("span").style.backgroundColor),((e,i)=>{let n=l.value;"0"===n&&(l.value="1",n="1"),Vc(t,e.table,e.cell,o(),i,n)})))),l.addEventListener("change",(()=>{const i=this._target;if(!i.table||!i.cell)return;let n=s.querySelector("span").style.backgroundColor||"#000000";Gc(t,i.table,i.cell,o(),l.value,n),"0"===l.value&&e.paintColorButton(s,"")})),this.modal.querySelectorAll(".tbw-seg").forEach((t=>{t.addEventListener("click",(()=>{this.modal.querySelectorAll(".tbw-seg").forEach((t=>t.classList.remove("on"))),t.classList.add("on"),l.value=t.getAttribute("data-value"),l.dispatchEvent(new Event("change"))}))})),this.modal.querySelector(".is-modal-close").addEventListener("click",(()=>this.hide())),new vs({selector:".is-modal.edittablestyle .is-draggable"})}open(t){this._render();const e=t&&t()||{table:null,cell:null};this._target={table:e.table||null,cell:e.cell||null},this.builder.util.showModal(this.modal),this.realtime(),this._bindTracking()}hide(){this._unbindTracking(),this.modal&&this.builder.util.hideModal(this.modal)}setTarget(t,e){this._target={table:t||null,cell:e||null},this.realtime()}realtime(){if(!this.isOpen)return;const t=this._target&&this._target.cell,e=this.builder.util,i=t=>this.modal.querySelector(t);t?(e.paintColorButton(i(".input-table-bgcolor"),t.style.backgroundColor),e.paintColorButton(i(".input-table-textcolor"),t.style.color),e.paintColorButton(i(".input-table-bordercolor"),t.style.borderColor),i(".input-table-borderwidth").value=parseInt(t.style.borderWidth,10)||0):(e.paintColorButton(i(".input-table-bgcolor"),""),e.paintColorButton(i(".input-table-textcolor"),""),e.paintColorButton(i(".input-table-bordercolor"),""),i(".input-table-borderwidth").value=0);const n=String(i(".input-table-borderwidth").value||0);this.modal.querySelectorAll(".tbw-seg").forEach((t=>t.classList.toggle("on",t.getAttribute("data-value")===n)))}_track(t){const e=t.target;if(!e||!e.closest)return;const i=e.closest("td,th"),n=e.closest("table");if(n&&i&&n.closest(".is-builder"))return void this.setTarget(n,i);const o=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");n||o||e.closest(".is-modal")||e.closest(".is-sidebar")||e.closest(".is-rte-table-tool")||e.closest(".keep-selection")||this.hide()}_bindTracking(){this._tracking||(this._tracking=!0,this.builder.doc.addEventListener("click",this._onTrack),this.builder.doc!==document&&document.addEventListener("click",this._onTrack))}_unbindTracking(){this._tracking&&(this._tracking=!1,this.builder.doc.removeEventListener("click",this._onTrack),this.builder.doc!==document&&document.removeEventListener("click",this._onTrack))}}class Xc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-table-tool");if(!o){let s=`\n <div class="is-tool is-table-tool">\n <button title="${i.out("Settings")}" style="width:35px;height:35px;"><svg class="is-icon-flex" style="width:17px;height:17px;"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-table-tool"):t.querySelector(".is-table-tool"),this.tableTool=o;let l=o.querySelector("button");n.addEventListener(l,"click",(()=>{this.tableModal&&this.tableModal.classList.contains("active")?this.hideTableEditor():(this.renderPanel(),this.showTableEditor())}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.edittable");if(!n){let o=`\n <div class="is-modal is-modal-content edittable" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-bar is-draggable">\n ${e.out("Table")}\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div style="padding:0">\n <div class="is-tabs" data-group="table">\n <a title="${e.out("Style")}" id="tabTableGeneral" href="" data-content="divTableGeneral" class="active">${e.out("Style")}</a>\n <a title="${e.out("Layout")}" id="tabTableLayout" href="" data-content="divTableLayout">${e.out("Layout")}</a>\n </div>\n <div id="divTableGeneral" class="is-tab-content active" tabindex="-1" data-group="table" style="display:block">\n\n <div style="display:flex;padding-bottom:12px">\n <div style="padding-right:15px">\n <div>${e.out("Background")}:</div>\n <div>\n <button title="${e.out("Background Color")}" class="input-table-bgcolor is-btn-color"></button>\n </div>\n </div>\n <div>\n <div>${e.out("Text Color")}:</div>\n <div>\n <button title="${e.out("Text Color")}" class="input-table-textcolor is-btn-color"></button>\n </div>\n </div>\n </div>\n\n <div style="padding-bottom:12px;">\n <div>${e.out("Border Thickness")}:</div>\n <div>\n <select id="selCellBorderWidth" style="width:120px;"><option value="0">No Border</option><option value="1">1</option><option value="2">2</option><option value="3">3</option></select> \n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Border Color")}:</div>\n <div>\n <button title="${e.out("Border Color")}" class="input-table-bordercolor is-btn-color"></button>\n </div>\n </div>\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Apply To")}:</div>\n <div>\n <select id="selTableApplyTo" style="width:120px;">\n <option value="table">${e.out("Table")}</option>\n <option value="currentrow">${e.out("Current Row")}</option>\n <option value="currentcol">${e.out("Current Column")}</option>\n <option value="evenrows">${e.out("Even Rows")}</option>\n <option value="oddrows">${e.out("Odd Rows")}</option> \n <option value="currentcell">${e.out("Current Cell")}</option> \n </select>\n </div>\n </div>\n\n </div>\n\n <div id="divTableLayout" class="is-tab-content" tabindex="-1" data-group="table">\n \n <div style="padding-bottom:12px;">\n <div>${e.out("Insert Row")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Above")}" data-table-cmd="rowabove" title="${e.out("Above")}" style="margin-right:15px"> ${e.out("Above")} </button>\n <button class="classic" title="${e.out("Below")}" data-table-cmd="rowbelow" title="${e.out("Below")}" style=""> ${e.out("Below")} </button>\n </div> \n </div>\n \n <div style="padding-bottom:15px;">\n <div>${e.out("Insert Column")}:</div>\n <div style="display:flex">\n <button class="classic" title="${e.out("Left")}" data-table-cmd="columnleft" title="${e.out("Left")}" style="margin-right:15px"> ${e.out("Left")} </button> \n <button class="classic" title="${e.out("Right")}" data-table-cmd="columnright" title="${e.out("Right")}" style=""> ${e.out("Right")} </button> \n </div> \n </div>\n\n <div style="padding-bottom:15px;">\n <button class="classic" title="${e.out("Delete Row")}" data-table-cmd="delrow" title="Delete Row" style=""> ${e.out("Delete Row")} </button> \n </div>\n\n <div style="padding-bottom:15px;"> \n <button class="classic" title="${e.out("Delete Column")}" data-table-cmd="delcolumn" title="Delete Column" style=""> ${e.out("Delete Column")} </button> \n </div>\n \n <div> \n <button class="classic" title="${e.out("Merge Cell")}" data-table-cmd="mergecell" style="">${e.out("Merge Cell")}</button> \n </div>\n </div>\n </div>\n </div>\n \n `;i.appendHtml(t,o),n=t.querySelector(".is-modal.edittable"),this.tableModal=n;const s=n.querySelector(".input-table-bgcolor");s.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selTableApplyTo").value;jc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t),e.style.backgroundColor=t}),s.style.backgroundColor,(()=>{s.removeAttribute("data-focus"),s.focus()})),s.setAttribute("data-focus",!0)}));const l=n.querySelector(".input-table-textcolor");l.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selTableApplyTo").value;Wc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t),e.style.backgroundColor=t}),l.style.backgroundColor,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}));const a=n.querySelector(".input-table-bordercolor");a.addEventListener("click",(t=>{let e=t.target;this.builder.colorPicker.open((t=>{if(!this.builder.activeTd)return;let i=n.querySelector("#selCellBorderWidth").value;"0"===i&&(n.querySelector("#selCellBorderWidth").value=1,i="1");let o=n.querySelector("#selTableApplyTo").value;Vc(this.builder,this.builder.activeTable,this.builder.activeTd,o,t,i),e.style.backgroundColor=t}),a.style.backgroundColor,(()=>{a.removeAttribute("data-focus"),a.focus()})),a.setAttribute("data-focus",!0)}));let r=n.querySelector("#selCellBorderWidth");r.addEventListener("change",(()=>{if(!this.builder.activeTd)return;let t=r.value,e=n.querySelector(".input-table-bordercolor").style.backgroundColor;""===e&&(e="#000000");let i=n.querySelector("#selTableApplyTo").value;Gc(this.builder,this.builder.activeTable,this.builder.activeTd,i,t,e),"0"===t&&(n.querySelector(".input-table-bordercolor").style.backgroundColor="")}));let c=n.querySelector('[data-table-cmd="rowabove"]');c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=t.insertRow(e.rowIndex);for(var n=0;n<e.cells.length;n++){var o=i.insertCell(i.cells.length);this.builder.activeTd.getAttribute("style")&&o.setAttribute("style",this.builder.activeTd.getAttribute("style")),o.style.verticalAlign="top",o.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="rowbelow"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=t.insertRow(e.rowIndex+1);for(var n=0;n<e.cells.length;n++){var o=i.insertCell(i.cells.length);this.builder.activeTd.getAttribute("style")&&o.setAttribute("style",this.builder.activeTd.getAttribute("style")),o.style.verticalAlign="top",o.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="columnleft"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++){var n=t.rows[i].insertCell(e);this.builder.activeTd.getAttribute("style")&&n.setAttribute("style",this.builder.activeTd.getAttribute("style")),n.style.verticalAlign="top",n.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="columnright"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++){var n=t.rows[i].insertCell(e+1);this.builder.activeTd.getAttribute("style")&&n.setAttribute("style",this.builder.activeTd.getAttribute("style")),n.style.verticalAlign="top",n.innerHTML="<br>"}this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="delrow"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode;t.deleteRow(e.rowIndex),this.builder.activeTable=null,this.builder.activeTd=null,0===t.rows.length&&t.parentNode.removeChild(t),this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="delcolumn"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable;for(var e=this.builder.activeTd.cellIndex,i=0;i<t.rows.length;i++)t.rows[i].deleteCell(e);this.builder.activeTable=null,this.builder.activeTd=null,0===t.rows[0].cells.length&&t.parentNode.removeChild(t),this.builder.opts.onChange()})),c=n.querySelector('[data-table-cmd="mergecell"]'),c.addEventListener("click",(()=>{if(!this.builder.activeTd)return;this.builder.uo.saveForUndo();let t=this.builder.activeTable,e=this.builder.activeTd.parentNode,i=this.builder.activeTd;i.colSpan=i.colSpan+1,i.cellIndex+1<t.rows[e.rowIndex].cells.length&&t.rows[e.rowIndex].deleteCell(i.cellIndex+1),this.builder.opts.onChange()}));let u=n.querySelector(".is-modal-close");i.addEventListener(u,"click",(()=>{i.removeClass(n,"active")})),new Nc({element:n}),new vs({selector:".is-modal.edittable .is-draggable"})}}showTableEditor(){const t=this.tableModal;this.builder.util.showModal(t),this.realtime();const e=t=>{const i=document.querySelector(".pop-picker.active")||document.querySelector(".pickgradientcolor.active");let n=t.target;n&&(n.closest(".is-table-tool")||n.closest(".is-sidebar")||n.closest(".is-modal")||n.closest(".keep-selection")||n.closest("table")||i||(this.hideTableEditor(),document.removeEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",e),this.builder.handleTableClick_=!1),n.closest("table")&&this.realtime())};this.builder.handleTableClick_||(document.addEventListener("click",e),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",e),this.builder.handleTableClick_=!0)}hideTableEditor(){const t=this.tableModal;t&&this.builder.util.hideModal(t)}realtime(){const t=this.tableModal;if(t.classList.contains("active")&&this.builder.activeTable){let e=this.builder.activeTd;e&&(t.querySelector(".input-table-bgcolor").style.backgroundColor=e.style.backgroundColor,t.querySelector(".input-table-textcolor").style.backgroundColor=e.style.color,t.querySelector(".input-table-bordercolor").style.backgroundColor=e.style.borderColor,t.querySelector("#selCellBorderWidth").value=parseInt(e.style.borderWidth))}else t.querySelector(".input-table-bgcolor").style.backgroundColor="",t.querySelector(".input-table-textcolor").style.backgroundColor="",t.querySelector(".input-table-bordercolor").style.backgroundColor="",t.querySelector("#selCellBorderWidth").value=0}click(t){const e=this.builder.dom;let i=t.target;if(!i)return;const n=i.closest("table");if(n){let t=i.closest("td");if(e.hasClass(n,"default")){this.builder.activeTd=t,this.builder.activeTable=n,this.renderTool(),this.tableTool.style.display="flex";let e=this.tableTool.offsetWidth,i=n.offsetWidth*this.builder.opts.zoom,o=n.getBoundingClientRect().top+this.builder.win.pageYOffset,s=n.getBoundingClientRect().left-2;s+=i-e;e+s>window.innerWidth&&(s=n.getBoundingClientRect().left),this.tableTool.style.top=o+"px",this.tableTool.style.left=s+"px"}else this.builder.activeTd=null,this.builder.activeTable=null,this.tableTool&&(this.tableTool.style.display="")}else this.builder.activeTd=null,this.builder.activeTable=null,this.tableTool&&(this.tableTool.style.display="")}}class Kc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-video-tool");if(!o){let s=`\n <div class="is-tool is-video-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="width:40px;height:40px;background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-video-tool"):t.querySelector(".is-video-tool"),this.videoTool=o;let l=this.videoTool.querySelector("button");n.addEventListener(l,"click",(()=>{this.renderPanel();const t=this.videoModal;let e=this.builder.activeVideo,n=e.querySelector("source"),o="";n&&(o=n.getAttribute("src")),o.startsWith("data:")&&(this.builder.base64Data=o,o="[Image Data]"),t.querySelector(".input-url").value=o;const s=t.querySelector(".input-video-controls");e.hasAttribute("controls")?s.checked=!0:s.checked=!1;const a=t.querySelector(".input-video-loop");e.hasAttribute("loop")?a.checked=!0:a.checked=!1;const r=t.querySelector(".input-video-autoplay");e.hasAttribute("autoplay")?r.checked=!0:r.checked=!1;const c=t.querySelector(".input-video-muted");e.hasAttribute("muted")?c.checked=!0:c.checked=!1,i.showModal(t,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".is-modal.videolink")){let n=`\n <div class="is-modal videolink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <label for="inpVideoLinkSource" style="display:block">${e.out("Source")}:</label>\n <div class="video-url">\n <input id="inpVideoLinkSource" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="video-larger1 input-upload is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetVideoUpload" method="post" action="${this.builder.opts.videoHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;">\n <input id="hidRefId5" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input title="${e.out("Select")}" id="fileVideo1" name="fileImage" type="file" accept="video/mp4" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="0" id="frameTargetVideoUpload" name="frameTargetVideoUpload" tabIndex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n \n <label class="label-checkbox" style="display:block;margin-top:14px;">\n <input class="input-video-controls" id="__input_video_controls" type="checkbox" /> ${e.out("Show Controls")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-loop" id="__input_video_loop" type="checkbox" /> ${e.out("Loop")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-autoplay" id="__input_video_autoplay" type="checkbox" /> ${e.out("Autoplay")}&nbsp;\n </label>\n <label class="label-checkbox" style="display:block;margin-top:10px;">\n <input class="input-video-muted" id="__input_video_muted" type="checkbox" /> ${e.out("Muted")}&nbsp;\n </label>\n \n <div style="text-align:right;margin-top:14px;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);const o=t.querySelector(".is-modal.videolink");this.videoModal=o,""!==this.builder.opts.videoHandler||this.builder.opts.onVideoUpload||(o.querySelector(".video-larger1").style.display="none"),this.builder.opts.onVideoSelectClick||""!==this.builder.opts.videoSelect||(o.querySelector(".input-select").style.display="none");let s=o.querySelector(".input-select");s&&i.addEventListener(s,"click",(async()=>{if(this.builder.opts.onVideoSelectClick)this.builder.opts.onVideoSelectClick({targetInput:o.querySelector(".input-url"),theTrigger:s});else{let i=t.querySelector(".is-modal.videoselect"),n=i.querySelector("iframe");if(this.builder.opts.assetManagerBasePath){let t;this.builder.opts.assetRefresh&&(t=this.builder.opts.videoSelect),"about:blank"===n.src&&(t=this.builder.opts.videoSelect);let e=await fetch(t);e=await e.text(),e=e.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),e=e.replace(/<head>/i,'<head><base href="'+this.builder.opts.assetManagerBasePath+'">'),e=e.replace(/="assets\//g,'="'+this.builder.opts.assetPath),n.srcdoc=e}else this.builder.opts.assetRefresh&&(n.src=this.builder.opts.videoSelect),"about:blank"===n.src&&(n.src=this.builder.opts.videoSelect);e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="video"}));let l=o.querySelector("#fileVideo1");i.addEventListener(l,"change",(t=>{let e=l;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefId5").value=this.builder.opts.customval,this.builder.opts.onVideoUpload?this.builder.opts.onVideoUpload(t):n.submit(),l.value=""}));let a=o.querySelector(".input-ok");i.addEventListener(a,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeVideo;if(o.querySelector(".input-video-controls").checked?t.setAttribute("controls",""):t.removeAttribute("controls"),o.querySelector(".input-video-loop").checked?t.setAttribute("loop",""):t.removeAttribute("loop"),o.querySelector(".input-video-autoplay").checked?t.setAttribute("autoplay",""):t.removeAttribute("autoplay"),o.querySelector(".input-video-muted").checked?t.setAttribute("muted",""):t.removeAttribute("muted"),""!==o.querySelector(".input-url").value){let e=o.querySelector(".input-url").value;"[Image Data]"===e&&(e=this.builder.base64Data,this.builder.base64Data="");let i=t.querySelector("source");e!==i.getAttribute("src")&&(i&&i.setAttribute("src",e),setTimeout((function(){t.pause(),t.load()}),100)),this.builder.opts.onChange()}this.builder.hideModal(o),this.builder.onVideoChange&&this.builder.onVideoChange()}));let r=o.querySelector(".input-cancel");i.addEventListener(r,"click",(()=>{this.builder.base64Data="",this.builder.hideModal(o)}))}}click(t){let e=t.target;if("video"===e.tagName.toLowerCase()){if(e.closest("[data-html]"))return void(this.builder.activeVideo=null);this.renderTool();const t=this.videoTool;this.builder.activeVideo=e,t.style.display="flex";let i=t.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),t.style.top=o+"px",t.style.left=s+"px"}else this.builder.activeVideo=null,this.videoTool&&(this.videoTool.style.display="")}repositionVideoTool(){let t=this.builder.activeVideo;if(!t)return;if(!this.videoTool)return;this.videoTool.style.display="flex";let e=this.videoTool.offsetWidth,i=t.offsetWidth*this.builder.opts.zoom,n=t.getBoundingClientRect().top+this.builder.win.pageYOffset,o=t.getBoundingClientRect().left;o+=i-e;e+o>window.innerWidth&&(o=t.getBoundingClientRect().left),this.videoTool.style.top=n+"px",this.videoTool.style.left=o+"px"}}class Zc{constructor(t){this.builder=t}renderTool(){const t=this.builder.builderStuff,e=this.builder.contentStuff,i=this.builder.util,n=this.builder.dom;let o=t.querySelector(".is-audio-tool");if(!o){let s=`\n <div class="is-tool is-audio-tool">\n <button title="${i.out("Settings")}" data-title="${i.out("Settings")}" style="background:none;"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;n.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-audio-tool"):t.querySelector(".is-audio-tool"),this.audioTool=o;let l=this.audioTool.querySelector("button");n.addEventListener(l,"click",(()=>{let t=this.builder.activeAudio.querySelector("source"),e="";t&&(e=t.getAttribute("src")),this.renderPanel();const n=this.audioModal;e.startsWith("data:")&&(this.builder.base64Data=e,e="[Image Data]"),n.querySelector(".input-url").value=e,i.showModal(n,!0,(()=>{l.removeAttribute("data-focus"),l.focus()})),l.setAttribute("data-focus",!0)}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;if(!t.querySelector(".is-modal.audiolink")){let n=`\n <div class="is-modal audiolink" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <label for="inpAudioLinkSource" style="display:block">${e.out("Source")}:</label>\n <div class="audio-url">\n <input id="inpAudioLinkSource" class="input-url" type="text"/>\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="audio-file-upload input-upload is-btn classic" style="position:relative;flex:none;box-shadow: 0px 3px 6px -6px rgba(0, 0, 0, 0.32);">\n <form class="form-upload-larger" target="frameTargetAudioUpload" method="post" action="${this.builder.opts.audioHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;display:flex;justify-content:center;align-items:center;width:100%;height:100%;">\n <input id="hidRefAudio" name="hidRefId" type="hidden" value="" />\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input title="${e.out("Select")}" id="fileAudio1" name="fileImage" type="file" accept="audio/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="0" id="frameTargetAudioUpload" name="frameTargetAudioUpload" tabIndex="-1" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n \n <div style="text-align:right;margin-top:14px;">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(t,n);const o=t.querySelector(".is-modal.audiolink");this.audioModal=o,""!==this.builder.opts.audioHandler||this.builder.opts.onAudioUpload||(o.querySelector(".audio-file-upload").style.display="none"),this.builder.opts.onAudioSelectClick||""!==this.builder.opts.audioSelect||(o.querySelector(".input-select").style.display="none");let s=o.querySelector(".input-select");s&&i.addEventListener(s,"click",(async()=>{if(this.builder.opts.onAudioSelectClick)this.builder.opts.onAudioSelectClick({targetInput:o.querySelector(".input-url"),theTrigger:s});else{let i=t.querySelector(".is-modal.audioselect"),n=i.querySelector("iframe");if(this.builder.opts.assetManagerBasePath){let t;this.builder.opts.assetRefresh&&(t=this.builder.opts.audioSelect),"about:blank"===n.src&&(t=this.builder.opts.audioSelect);let e=await fetch(t);e=await e.text(),e=e.replace(/<script>/g,""+(this.builder.nonce?`<script nonce="${this.builder.nonce}">`:"<script>")),e=e.replace(/<head>/i,'<head><base href="'+this.builder.opts.assetManagerBasePath+'">'),e=e.replace(/="assets\//g,'="'+this.builder.opts.assetPath),n.srcdoc=e}else this.builder.opts.assetRefresh&&(n.src=this.builder.opts.audioSelect),"about:blank"===n.src&&(n.src=this.builder.opts.audioSelect);e.showModal(i,!1,(()=>{s.removeAttribute("data-focus"),s.focus()}),!1,this.builder.assetPanelFullScreen),s.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-url"),this.builder.targetCallback=null,this.builder.targetAssetType="audio"}));let l=o.querySelector("#fileAudio1");i.addEventListener(l,"change",(t=>{let e=l;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),o.querySelector("#hidRefAudio").value=this.builder.opts.customval,this.builder.opts.onAudioUpload?this.builder.opts.onAudioUpload(t):n.submit(),l.value=""}));let a=o.querySelector(".input-ok");i.addEventListener(a,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeAudio;if(""!==o.querySelector(".input-url").value){let e=o.querySelector(".input-url").value;"[Image Data]"===e&&(e=this.builder.base64Data,this.builder.base64Data="");let i=t.querySelector("source");e!==i.getAttribute("src")&&(i&&i.setAttribute("src",e),setTimeout((function(){t.pause(),t.load()}),100)),this.builder.opts.onChange()}this.builder.hideModal(o)}));let r=o.querySelector(".input-cancel");i.addEventListener(r,"click",(()=>{this.builder.base64Data="",this.builder.hideModal(o)}))}}click(t){if(this.builder.dom.hasClass(t.target,"ovl")&&t.target.parentNode.querySelector("audio")){t.target.style.display="none";let e=t.target.parentNode.querySelector("audio");this.builder.activeAudio=e,this.renderTool(),this.audioTool.style.display="flex";let i=this.audioTool.offsetWidth,n=e.offsetWidth*this.builder.opts.zoom,o=e.getBoundingClientRect().top+this.builder.win.pageYOffset,s=e.getBoundingClientRect().left;s+=n-i;i+s>window.innerWidth&&(s=e.getBoundingClientRect().left),this.audioTool.style.top=o+"px",this.audioTool.style.left=s+"px"}else this.builder.activeAudio=null,this.audioTool&&(this.audioTool.style.display="")}}class Jc{constructor(t){this.builder=t;const e=this.builder.dom;this.dom=e;const i=this.builder.util;this.util=i;const n=this.builder.builderStuff;this.builderStuff=n;const o=this.builder.contentStuff;this.contentStuff=o,this.renderTool()}renderTool(){const t=this.builderStuff,e=this.contentStuff,i=this.dom,n=this.util;let o=t.querySelector(".is-svg-tool");if(!o){let s=`\n <div class="is-tool is-svg-tool">\n <button class="btn-svg-settings" title="${n.out("Settings")}" data-title="${n.out("Settings")}"><svg class="is-icon-flex"><use xlink:href="#icon-cog"></use></svg></button>\n </div>\n `;i.appendHtml(t,s),o=this.builder.iframe?e.querySelector(".is-svg-tool"):t.querySelector(".is-svg-tool"),this.svgTool=o;const l=o.querySelector(".btn-svg-settings");l.addEventListener("click",(async()=>{this.edit(l)}))}}renderPanel(){const t=this.util,e=this.builderStuff,i=this.builder.dom;this.dom=i;let n=e.querySelector(".is-modal.svgsettings");if(!n){let o=`\n\n <div class="is-modal svgsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content scroll cb-form">\n <div class="cb-field">\n <label for="inpSvgCode">${t.out("Embed SVG")}:</label>\n <div class="audio-url">\n <textarea id="inpSvgCode" class="input-url"></textarea>\n </div>\n </div>\n <div class="cb-actions">\n <button title="${t.out("Cancel")}" class="input-cancel classic-secondary">${t.out("Cancel")}</button>\n <button title="${t.out("Ok")}" class="input-ok classic-primary">${t.out("Ok")}</button>\n </div>\n </div>\n </div>\n `;i.appendHtml(e,o),n=e.querySelector(".is-modal.svgsettings"),this.svgModal=n;let s=n.querySelector(".input-ok");i.addEventListener(s,"click",(()=>{const e=n.querySelector("#inpSvgCode"),o=(new DOMParser).parseFromString(e.value,"text/html"),s=o.querySelector("svg");if(!s)return;s.classList.add("svgdummy"),this.builder.uo.saveForUndo();let l=this.builder.activeSvg;l?l.outerHTML=o.body.innerHTML:this.builder.util.pasteHtmlAtCaret(o.body.innerHTML,!0);let a=this.builder.doc.querySelector(".svgdummy");a&&(a.classList.remove("svgdummy"),this.builder.activeSvg=a,i.selectElementContents(a),t.saveSelection()),this.builder.opts.onChange(),this.builder.hideModal(n)}));let l=n.querySelector(".input-cancel");i.addEventListener(l,"click",(()=>{this.builder.hideModal(n)}))}}async edit(t){this.renderPanel();const e=this.svgModal,i=this.dom;let n=e.querySelector(".is-modal-close");i.addEventListener(n,"click",(()=>{this.util.hideModal(e)})),this.util.showModal(e,!0,(()=>{t&&(t.removeAttribute("data-focus"),t.focus())})),t&&t.setAttribute("data-focus",!0);const o=e.querySelector("#inpSvgCode");o.value="";let s=this.builder.activeSvg;s&&(o.value=s.outerHTML),o.focus()}click(t){const e=t.target.closest("svg");e?(this.builder.activeSvg=e,document.selection?document.selection.empty():window.getSelection().removeAllRanges(),this.builder.doc.querySelectorAll(".icon-active").forEach((t=>t.classList.remove("icon-active"))),e.classList.add("icon-active"),this.showTool(e)):(this.builder.activeSvg=null,this.hideTool())}showTool(){this.svgTool.style.display="flex",this.repositionModuleTool()}hideTool(){this.svgTool.style.display=""}repositionModuleTool(){if(!this.builder.activeSvg)return;if(!this.svgTool)return;if("flex"!==this.svgTool.style.display)return;let t,e,i=this.builder.activeSvg,n=this.svgTool.offsetWidth,o=i.getBoundingClientRect().width;o<200?(e=i.getBoundingClientRect().left+o,t=i.getBoundingClientRect().top+this.builder.win.pageYOffset):(e=i.getBoundingClientRect().left+o-n,t=i.getBoundingClientRect().top+this.builder.win.pageYOffset+3),this.svgTool.style.top=t+"px",this.svgTool.style.left=e+"px"}}class Qc{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=this.builder.dom;this.dom=n,this.hyperlink=new qc(t),this.button=new Rc(t),this.image=new Ec(t),this.spacer=new Ic(t),this.plugin=new Pc(t),this.module=new Dc(t),this.code=new Bc(t),this.iframe=new Hc(t),this.table=new Xc(t),this.video=new Kc(t),this.audio=new Zc(t),this.svg=new Jc(t)}applyBehavior(t){const e=this.dom;let i=!1;t.hasAttribute("data-html")&&(i=!0);let n=!1;t.hasAttribute("data-noedit")&&(n=!0);let o=!1;if(t.hasAttribute("data-protected")&&(o=!0),i||n||o){if(n){let e=t.querySelectorAll("[contenteditable]");Array.prototype.forEach.call(e,(t=>{t.contentEditable=!1}))}return}const s=t.querySelectorAll("[data-cb-type]");Array.prototype.forEach.call(s,(t=>{t.contentEditable=!1}));let l=t.querySelectorAll(".is-social");Array.prototype.forEach.call(l,(t=>{t.contentEditable=!1}));let a=t.querySelectorAll(".spacer");Array.prototype.forEach.call(a,(t=>{t.contentEditable=!1}));let r=t.querySelectorAll("hr");Array.prototype.forEach.call(r,(t=>{t.contentEditable=!1}));let c=t.querySelectorAll("a");Array.prototype.forEach.call(c,(i=>{"inline-block"===e.getStyle(i,"display")&&(i.contentEditable=!0,i.parentNode!==t&&(i.parentNode.contentEditable=!1))}));let u=t.querySelectorAll(".embed-responsive");Array.prototype.forEach.call(u,(t=>{let i=t.querySelector(".ovl");i||(e.appendHtml(t,'<div class="ovl" style="position:absolute;background:#fff;opacity:0.01;cursor:pointer;top:0;left:0px;width:100%;height:100%;z-index:1"></div>'),i=t.querySelector(".ovl"),e.addEventListener(i,"click",(()=>{let t=document.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display="block"})),i.style.display="none"})))}));let d=t.querySelectorAll("audio");Array.prototype.forEach.call(d,(t=>{if(t.closest("[data-cb-type]"))return;let i=t.parentNode.querySelector(".ovl");i||(e.appendHtml(t.parentNode,'<div class="ovl" style="position:absolute;background:#fff;opacity:0.01;cursor:pointer;top:0;left:0px;width:100%;height:100%;z-index:1"></div>'),i=t.parentNode.querySelector(".ovl"),e.addEventListener(i,"click",(()=>{let t=document.querySelectorAll(".ovl");Array.prototype.forEach.call(t,(t=>{t.style.display=""})),i.style.display="none"}))),setTimeout((()=>{i.closest(".elm-active")?i.click():i.style.display=""}),300)}))}click(t,e){const i=this.dom,n=e.target;let o=!1;t.hasAttribute("data-noedit")&&(o=!0);let s=!1;t.hasAttribute("data-protected")&&(s=!0);let l=!1,a=!1;t.hasAttribute("data-html")&&(l=!0,i.parentsHasAttribute(n,"data-subblock")&&(a=!0));if(n.closest("[data-cb-type]")&&(l=!0,a=n.closest(".is-subblock")),!l&&!o&&!s||a){this.builder.doc.querySelectorAll(".icon-active").forEach((t=>t.classList.remove("icon-active"))),this.builder.activeIcon=null,"i"===n.tagName.toLowerCase()&&""===n.innerHTML&&(n.classList.add("icon-active"),i.selectElementContents(n),this.builder.activeIcon=n,document.selection?document.selection.empty():window.getSelection().removeAllRanges()),this.image.click(e),this.button.click(t,e),this.hyperlink.click(t,e),"a"!==n.tagName.toLowerCase()&&!i.parentsHasTag(n,"a")||l||e.preventDefault(),this.iframe.click(e),this.video.click(e),this.audio.click(e),this.spacer.click(e),this.svg.click(e)}else if(this.util.hideControls(),"img"===e.target.tagName.toLowerCase()&&e.target.hasAttribute("data-image-embed")){if(this.image.click(e),e.target.hasAttribute("data-sync")){let t=e.target;t.setAttribute("data-src",t.src)}}else"img"===e.target.tagName.toLowerCase()&&t.hasAttribute("data-image-allowed")&&this.image.click(e);this.code.click(t,e),this.module.click(t,e),this.plugin.click(e)}}class tu{constructor(t){this.builder=t,this.grid=new fs(t),this.renderRowMore()}render(t){const e=this.builder.dom,n=this.builder.util,o=this.builder.builderStuff;let s=t.querySelector(".is-row-tool");if(!s){let l=`<div class="is-tool is-row-tool" style="${this.builder.rowTool||""===this.builder.rowTool?"":"display:none;"}">\n <div title="${n.out("Move")}" role="button" tabindex="-1" class="row-handle" style="${this.builder.rowHandle?"":"display:none;"}width:100%;cursor:move;text-align:center;"><svg class="is-icon-flex"><use xlink:href="#ion-move"></use></svg></div>\n <button type="button" tabindex="-1" title="${n.out("More")}" class="row-more"><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-dots2"></use></svg></button>\n <button type="button" tabindex="-1" title="${n.out("Grid Editor")}" class="row-grideditor"><svg class="is-icon-flex"><use xlink:href="#ion-grid"></use></svg></button>\n <button type="button" tabindex="-1" title="${n.out("Delete")}" class="row-remove"><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-trash2"></use></svg></button>\n </div>\n <div class="is-tool is-col-tool">\n <button type="button" tabindex="-1" title="${n.out("Add")}" class="cell-add">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-plus"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${n.out("More")}" class="cell-more">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-dots2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${n.out("Delete")}" class="cell-remove">\n <svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n </div>\n `;e.appendHtml(t,l),s=t.querySelector(".is-row-tool");let a=s.querySelectorAll("[title]");Array.prototype.forEach.call(a,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}));let r=t.querySelector(".is-col-tool");a=r.querySelectorAll("[title]"),Array.prototype.forEach.call(a,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}));const c=r.querySelector(".cell-add");c&&e.addEventListener(c,"click",(t=>{if(t.preventDefault(),t.stopImmediatePropagation(),!n.cellSelected())return;const s=window.innerHeight,l=n.getElementPosition(c);let a=l.top,r=l.left;i(this.builder);let u=this.builder.builderStuff.querySelector(".is-pop.quickadd");u.querySelector(".is-pop-tabs").style.display="flex",n.showPop(u,!1,c);const d=u.offsetHeight;s-a>d?(u.style.top=a+window.pageYOffset+35+"px",u.style.left=r+"px",e.removeClass(u,"arrow-bottom"),e.removeClass(u,"arrow-right"),e.removeClass(u,"arrow-left"),e.removeClass(u,"center"),e.addClass(u,"arrow-top"),e.addClass(u,"left")):(u.style.top=a+window.pageYOffset-d-8+"px",u.style.left=r+"px",e.removeClass(u,"arrow-top"),e.removeClass(u,"arrow-right"),e.removeClass(u,"arrow-left"),e.removeClass(u,"center"),e.addClass(u,"arrow-bottom"),e.addClass(u,"left")),"left"===u.querySelector(".active").getAttribute("data-value")?u.setAttribute("data-mode","cell-left"):u.setAttribute("data-mode","cell-right"),u.classList.remove("simple");const h=t=>{let e=t.target;if(e&&!(e.closest(".quickadd")||e.closest(".row-add")||e.closest(".is-rowadd-tool")||e.closest(".cell-add")||e.closest(".elm-add")||e.closest(".row-add-initial"))){const t=o.querySelector(".quickadd");n.hidePop(t),document.removeEventListener("click",h),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",h),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",h),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",h),this.builder.handleQuickAddClickOut_=!0)}));const u=r.querySelector(".cell-more");u&&e.addEventListener(u,"click",(t=>{t.preventDefault(),t.stopImmediatePropagation();let i=n.cellSelected();if(!i)return;const s=window.innerHeight,l=n.getElementPosition(u);let a=l.top,r=l.left;this.builder.colTool.renderColMore();const c=o.querySelector(".columnmore");setTimeout((()=>{n.showPop(c,!1,u),this.builder.colTool.refreshColumnMoreState();const t=c.offsetHeight;s-a>t?(c.style.top=a+window.pageYOffset+35+"px",c.style.left=r-7+"px",e.removeClass(c,"arrow-bottom"),e.removeClass(c,"arrow-right"),e.removeClass(c,"arrow-left"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.addClass(c,"arrow-top"),e.addClass(c,"left")):(c.style.top=a+window.pageYOffset-t-8+"px",c.style.left=r-7+"px",e.removeClass(c,"arrow-top"),e.removeClass(c,"arrow-right"),e.removeClass(c,"arrow-left"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.addClass(c,"arrow-bottom"),e.addClass(c,"left"))}),0);const d=c.querySelector(".cell-locking");i.hasAttribute("data-noedit")?e.addClass(d,"on"):e.removeClass(d,"on");const h=c.querySelector(".cell-increase"),b=c.querySelector(".cell-decrease"),p=c.querySelector(".cell-prev"),g=c.querySelector(".cell-next"),m=c.querySelector(".cell-up"),f=c.querySelector(".cell-down"),y=c.querySelector(".cell-duplicate"),v=c.querySelector(".cell-locking"),w=c.querySelector(".is-separator");if(i.closest("[nogrid]")){p&&(p.style.display="none"),g&&(g.style.display="none"),m&&(m.style.display="none"),f&&(f.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),y&&(y.style.display="none"),p&&p.setAttribute("disabled","disabled"),g&&g.setAttribute("disabled","disabled"),m&&m.setAttribute("disabled","disabled"),f&&f.setAttribute("disabled","disabled"),h&&h.setAttribute("disabled","disabled"),b&&b.setAttribute("disabled","disabled"),y&&y.setAttribute("disabled","disabled");let t=c.querySelector(".cell-html");t&&(t.style.display=""),i.getAttribute("data-html")&&(c.querySelector(".cell-html").style.display="none",this.columnTool.querySelector(".cell-more").style.display="none",c.querySelector(".cell-html").setAttribute("disabled","disabled"),this.columnTool.querySelector(".cell-more").setAttribute("disabled","disabled"))}else{p&&(p.style.display=""),g&&(g.style.display=""),m&&(m.style.display=""),f&&(f.style.display=""),h&&(h.style.display=""),b&&(b.style.display=""),y&&(y.style.display=""),p&&p.removeAttribute("disabled"),g&&g.removeAttribute("disabled"),m&&m.removeAttribute("disabled"),f&&f.removeAttribute("disabled"),h&&h.removeAttribute("disabled"),b&&b.removeAttribute("disabled"),y&&y.removeAttribute("disabled");let t=c.querySelector(".cell-html");t&&(t.style.display="",t.removeAttribute("disabled"));let e=i.parentNode,n=3;e.querySelector(".is-row-overlay")&&(n=4),e.childElementCount-n==1?(p&&(p.style.display="none"),g&&(g.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),p&&p.setAttribute("disabled","disabled"),g&&g.setAttribute("disabled","disabled"),h&&h.setAttribute("disabled","disabled"),b&&b.setAttribute("disabled","disabled")):(p&&(p.style.display=""),g&&(g.style.display=""),h&&(h.style.display=""),b&&(b.style.display=""),p&&p.removeAttribute("disabled"),g&&g.removeAttribute("disabled"),h&&h.removeAttribute("disabled"),b&&b.removeAttribute("disabled"));let o=y;i.getAttribute("data-html")?(t&&(t.style.display="none",t.setAttribute("disabled","disabled")),o&&(o.style.display="none",o.setAttribute("disabled","disabled"))):(t&&(t.style.display="",t.removeAttribute("disabled")),o&&(o.style.display="",o.removeAttribute("disabled")))}i.classList.contains("column-lock")?(p&&(p.style.display="none"),g&&(g.style.display="none"),m&&(m.style.display="none"),f&&(f.style.display="none"),h&&(h.style.display="none"),b&&(b.style.display="none"),y&&(y.style.display="none"),w&&(w.style.display="none"),v&&(v.style.display="none")):(w&&(w.style.display=""),v&&(v.style.display=""))}));const d=r.querySelector(".cell-remove");d&&e.addEventListener(d,"click",(()=>{new fs(this.builder).removeColumn(),n.clearControls(),n.clearModals(),this.builder.onSelectChange&&this.builder.onSelectChange()}));let h=s.querySelector(".row-grideditor");h&&e.addEventListener(h,"click",(()=>{this.showGridEditor()}));const b=s.querySelector(".row-more");b&&e.addEventListener(b,"click",(t=>{let i;t.preventDefault(),t.stopImmediatePropagation();let o=n.cellSelected();if(i=o?o.parentNode:n.rowSelected(),!i)return;e.removeClass(i,"row-outline"),n.hideColumnTool();const s=window.innerHeight,l=n.getElementPosition(b);let a=l.top,r=l.left;this.renderRowMore();const c=this.rowMore;setTimeout((()=>{n.showPop(c,!1,b),this.refreshRowMoreState();const t=c.offsetHeight;e.removeClass(c,"arrow-bottom"),e.removeClass(c,"arrow-left"),e.removeClass(c,"arrow-right"),e.removeClass(c,"center"),e.removeClass(c,"right"),e.removeClass(c,"left"),"right"===this.builder.opts.rowTool?(c.style.left=r-c.offsetWidth-10+"px",e.addClass(c,"arrow-right"),e.addClass(c,"left")):(c.style.left=r+35+"px",e.addClass(c,"arrow-left"),e.addClass(c,"left")),c.style.top=s-a>t?a+window.pageYOffset-8+"px":a+window.pageYOffset-t+b.offsetHeight+"px"}),0);let u=c.querySelector(".row-html"),d=c.querySelector(".row-duplicate");i.querySelector("[data-html]")?(u&&(u.style.display="none"),d&&(d.style.display="none")):(u&&(u.style.display=""),d&&(d.style.display=""));let h=!1;i.querySelectorAll("[data-noedit]").forEach((t=>{t.hasAttribute("data-html")||(h=!0)}));const p=c.querySelector(".row-locking");h?e.addClass(p,"on"):e.removeClass(p,"on")}));let p=s.querySelector(".row-remove");p&&e.addEventListener(p,"click",(()=>{this.grid.removeRow(),n.clearControls(),n.clearModals(),this.builder.onSelectChange&&this.builder.onSelectChange()}))}}refreshRowMoreState(){const t=this.rowMore||this.builder.builderStuff.querySelector(".rowmore");if(!t||!this.grid)return;const e=(e,i)=>{const n=t.querySelector(e);n&&(n.disabled=!i)};e(".row-up",this.grid.canMoveRowUp()),e(".row-down",this.grid.canMoveRowDown())}renderRowMore(){const t=this.builder,e=this.builder.builderStuff,i=this.builder.util,n=this.builder.dom;let o=e.querySelector(".rowmore");if(!o){let s=["moveup","movedown","duplicate","html","separator","lock","settings"];t.rowMoreButtons&&(s=t.rowMoreButtons);const l={moveup:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Move Up")}" class="row-up"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${i.out("Move Up")}</button>`,movedown:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Move Down")}" class="row-down"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${i.out("Move Down")}</button>`,duplicate:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Duplicate")}" class="row-duplicate"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${i.out("Duplicate")}</button>`,html:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("HTML")}" class="row-html">\n <span><svg class="is-icon-flex" style="margin-right:-3px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></span>${i.out("HTML")}\n </button>`,separator:'<div class="is-separator"></div>',lock:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Lock")}" class="row-locking"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-lock"></use></svg></span>${i.out("Lock")}</button>`,settings:`<button style="flex: 1 1 calc(50% - 10px);" type="button" title="${i.out("Settings")}" class="row-settings"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${i.out("Settings")}</button>`};let a=`<div class="is-pop rowmore" style="z-index:10002;" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${s.filter((e=>!(!t.opts.rowHtmlEditor&&"html"===e))).map((t=>l[t]||"")).join("")}\n </div>\n </div>\n `;n.appendHtml(e,a),o=e.querySelector(".rowmore"),this.rowMore=o;let r=o.querySelector(".row-settings");r&&n.addEventListener(r,"click",(()=>{if(this.builder.controlPanel)return this.builder.controlpanel.select("row",!0),void i.hidePop(this.rowMore);this.renderPanel();const t=this.rowSettings,n=this.rowOverlay();n&&(this.readRowStyles(n),i.saveSelection(),i.showModal(t,!1,(()=>{"flex"===e.querySelector(".is-rte-tool").style.display&&i.restoreSelection()})),i.hidePop(this.rowMore))})),r=o.querySelector(".row-up"),r&&n.addEventListener(r,"click",(()=>{this.grid.moveRowUp(),this.refreshRowMoreState()})),r=o.querySelector(".row-down"),r&&n.addEventListener(r,"click",(()=>{this.grid.moveRowDown(),this.refreshRowMoreState()})),r=o.querySelector(".row-duplicate"),r&&n.addEventListener(r,"click",(()=>{this.grid.duplicateRow(),i.hidePop(o),i.hideColumnTool(),i.clearControls()})),r=o.querySelector(".row-html"),r&&n.addEventListener(r,"click",(()=>{let e,n=i.cellSelected();if(e=n?n.parentNode:i.rowSelected(),!e)return;new us(t).view("row")}));const c=o.querySelector(".row-locking");c&&n.addEventListener(c,"click",(e=>{let s=i.rowSelected();if(!s)return;let l=!1;s.querySelectorAll("[data-noedit]").forEach((t=>{t.hasAttribute("data-html")||(l=!0)})),l?(Array.from(s.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-col-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-row-overlay")||(e.removeAttribute("data-noedit"),e.contentEditable=!0,t.colTool.showHideLockIndicator(e),t.element.applyBehavior(e))})),n.removeClass(c,"on")):(Array.from(s.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-col-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-row-overlay")||(e.setAttribute("data-noedit",""),e.contentEditable=!1,i.clearActiveElement(!0),t.colTool.showHideLockIndicator(e),t.element.applyBehavior(e))})),n.addClass(c,"on")),i.hidePop(o),e.preventDefault()}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom;let n=t.querySelector(".is-modal.rowsettings");if(!n){let o=function(t,e){return`\n <div class="is-modal rowsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Row Settings")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Row Settings")}">\n <button type="button" role="tab" id="tabRowGeneral" data-tab="divRowGeneral" aria-controls="divRowGeneral" aria-selected="true" tabindex="0">${e.out("General")}</button>\n <button type="button" role="tab" id="tabRowMore" data-tab="divRowMore" aria-controls="divRowMore" aria-selected="false" tabindex="-1">${e.out("More")}</button>\n </div>\n\n <div id="divRowGeneral" class="is-tab-content" role="tabpanel" aria-labelledby="tabRowGeneral" data-group="rowsettings" style="display:flex" tabindex="-1">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-cs-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="cb-cs-seg-btn on" data-fill="color">${e.out("Color")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-row-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-row-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="cell-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-cell-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${t.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-row-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-row-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkRowGrayscale" class="chk-row-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n \x3c!-- Wrap Columns (Breakpoint): hidden like the legacy dialog (not in use).\n Kept in the DOM so the #rdoColMdWrap/#rdoColSmWrap/#rdoColXsWrap hooks exist. --\x3e\n <div class="div-row-wrapcolumns" style="display:none;flex-direction:column;padding-bottom:7px">\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Wrap Columns (Breakpoint)")}:</div>\n <div style="padding-top:3px;padding-bottom:5px;display:flex;align-items: center;">\n <label class="flex mr-3" title="${e.out("Tablet (Landscape)")}">\n <input type="radio" id="rdoColMdWrap" name="boxWrap" value="md">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px;transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n <label class="flex mr-3" title="${e.out("Tablet (Portrait)")}">\n <input type="radio" id="rdoColSmWrap" name="boxWrap" value="sm">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n <label class="flex" title="${e.out("Mobile")}">\n <input type="radio" id="rdoColXsWrap" name="boxWrap" value="xs">\n <svg class="is-icon-flex" style="margin-left:3px;width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </label>\n </div>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — it\n scopes the three per-device controls below (visibility, columns\n per line, reverse). Flat section (no box); heading + note convey it. --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-cs-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this row")}</span>\n <label class="switch"><input id="chkRowVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden"><span>${e.out("Hidden")}</span></button>\n </div>\n\n <div class="div-colsperline cb-field">\n <span class="cb-grouplabel">${e.out("Columns per Line")}</span>\n <select class="input-numofcols" id="__input_numofcols" style="display:none">\n <option value="">Default</option>\n <option value="2">2 columns per row</option>\n <option value="3">3 columns per row</option>\n <option value="4">4 columns per row</option>\n <option value="5">5 columns per row</option>\n <option value="6">6 columns per row</option>\n </select>\n <div class="cb-cs-colsperline">\n <button title="1" class="input-colsperline on" data-value="1">1</button>\n <button title="2" class="input-colsperline" data-value="2">2</button>\n <button title="3" class="input-colsperline" data-value="3">3</button>\n <button title="4" class="input-colsperline" data-value="4">4</button>\n <button title="5" class="input-colsperline" data-value="5">5</button>\n <button title="6" class="input-colsperline" data-value="6">6</button>\n <button title="${e.out("Default")}" class="input-colsperline cb-cs-colsperline-default" data-value="">${e.out("Default")}</button>\n </div>\n </div>\n\n <div id="divReverseColumns" class="cb-switchrow" style="margin-bottom:0">\n <span class="lbl">${e.out("Reverse Columns")}</span>\n <label class="switch"><input id="chkReverseColumns" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n </div>\n\n <div id="divRowMore" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabRowMore" data-group="rowsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpRowId">${e.out("Add Row ID")}:</label>\n <input id="inpRowId" class="input-row-id cb-cs-mono" type="text" onkeypress="return /[0-9a-zA-Z_]/i.test(event.key)" placeholder="${e.out("e.g. hero-row")}">\n <p class="cb-cs-hint">${e.out("A unique id for anchors or custom scripts.")}</p>\n </div>\n\n <div class="cb-field">\n <label>${e.out("Add Css Classes")}:</label>\n <div data-row-class-chips></div>\n \x3c!-- hook kept for readRowStyles + the change handler; hidden, driven by the chip field --\x3e\n <input id="inpRowCssClasses" class="input-row-classes" type="text" style="display:none">\n <p class="cb-cs-hint">${e.out("Space-separated classes applied to the row element.")}</p>\n </div>\n\n </div>\n\n </div>\n\n </div>\n </div>\n `}(this.builder,e);i.appendHtml(t,o),n=t.querySelector(".is-modal.rowsettings"),this.rowSettings=n,i.accessibleTabs(n.querySelector(".cb-tabs"),((t,e)=>{n.querySelectorAll('.is-tab-content[data-group="rowsettings"]').forEach((t=>{t.style.display="none"}));const i=n.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex")}));const s=document.querySelector(".is-modal.imagesource"),l=document.querySelector(".is-modal.imageadjust"),a=document.querySelector(".is-modal.imageadjust2");this.imageSource=s,this.imageAdjust=l,this.imageAdjust2=a,this.divRowGeneral=n.querySelector("#divRowGeneral");const r=n.querySelector(".div-colsperline");this.builder.enableColumnsPerLine||(r.style.display="none");let c=n.querySelector(".input-row-bgcolor");c.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{const i=this.rowOverlay();if(i){if(i.style.backgroundColor=t,e.paintColorButton(c,t),""!==t){n.querySelector(".input-row-gradient").style.backgroundImage="",i.style.backgroundImage=""}this.builder.opts.onChange()}}),n.querySelector(".input-row-bgcolor span").style.backgroundColor,(()=>{c.removeAttribute("data-focus"),c.focus()}),c,!0),c.setAttribute("data-focus",!0)}));const u=n.querySelector(".input-cell-bgimage");u&&i.addEventListener(u,"click",(()=>{const t=this.rowOverlay();if(!t)return;let e="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(e=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.builder.colTool.openImagePicker(e,(t=>{const e=this.rowOverlay();if(!e)return;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=n.querySelector(".cell-bgimage-preview"),o=this.rowSettings.querySelector(".input-row-bgimageadjust"),s=this.rowSettings.querySelector(".input-row-bgremove");o.style.display="none",s.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):i.innerHTML="",this.builder.opts.onChange()}),u)}));const d=n.querySelector(".input-row-bgimageadjust");d&&i.addEventListener(d,"click",(()=>{const t=this.rowOverlay();t&&this.builder.colTool.openImageAdjust(t,d)}));let h=n.querySelector(".input-row-bgremove");h&&i.addEventListener(h,"click",(()=>{const t=this.rowOverlay();if(!t)return;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const e=n.querySelector(".cell-bgimage-preview"),i=this.rowSettings.querySelector(".input-row-bgimageadjust"),o=this.rowSettings.querySelector(".input-row-bgremove");i.style.display="none",o.style.display="none",e.innerHTML="",this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divRowGeneral.querySelector(".input-select").style.display="none");const b=this.divRowGeneral.querySelector(".input-select");this.builder.renderSelectAsset(b,"image",(t=>{const e=this.rowOverlay();if(!e)return;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=n.querySelector(".cell-bgimage-preview"),o=this.rowSettings.querySelector(".input-row-bgimageadjust"),s=this.rowSettings.querySelector(".input-row-bgremove");o.style.display="none",s.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):i.innerHTML="",this.builder.opts.onChange()}));const p=this.builder.gradientpicker();let g=n.querySelector(".input-row-gradient");g.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const t=this.rowOverlay();t&&(p.open(t,(()=>{this.rowSettings.querySelector(".input-row-bgimageadjust").style.display="none";this.rowSettings.querySelector(".input-row-bgremove").style.display="none";this.rowSettings.querySelector(".cell-bgimage-preview").innerHTML="";if(this.imageSource.querySelector(".input-src").value="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=this.rowSettings.querySelector(".input-row-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}}),(t=>{g.removeAttribute("data-focus"),g.focus()}),g,!0),g.setAttribute("data-focus",!0))}));const m=n.querySelector(".chk-row-grayscale");m.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t=this.rowOverlay();t&&(m.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),this.builder.opts.onChange())}));let f=n.querySelectorAll(".input-device");f.forEach((t=>{t.addEventListener("click",(()=>{let i=e.rowSelected();i&&(n.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(i))}))}));let y=n.querySelector(".input-visible"),v=n.querySelector(".input-hidden");y.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?t.classList.remove("xs-hidden"):"sm"===o?t.classList.remove("sm-hidden"):"md"===o?t.classList.remove("md-hidden"):""===o&&t.classList.remove("desktop-hidden"),y.classList.add("on"),v.classList.remove("on"),this.builder.opts.onChange()})),v.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?t.classList.add("xs-hidden"):"sm"===o?t.classList.add("sm-hidden"):"md"===o?t.classList.add("md-hidden"):""===o&&t.classList.add("desktop-hidden"),y.classList.remove("on"),v.classList.add("on"),this.builder.opts.onChange()})),f=n.querySelectorAll(".input-colsperline"),f.forEach((t=>{t.addEventListener("click",(()=>{let i=e.rowSelected();if(!i)return;this.builder.uo.saveForUndo(),n.querySelectorAll(".input-colsperline").forEach((t=>{t.classList.remove("on")})),t.classList.add("on");let o=t.getAttribute("data-value"),s=n.querySelector(".div-target"),l=this.builder.responsive.readTarget(s);"xs"===l?(i.classList.remove("xs-items-1"),i.classList.remove("xs-items-2"),i.classList.remove("xs-items-3"),i.classList.remove("xs-items-4"),i.classList.remove("xs-items-5"),i.classList.remove("xs-items-6"),""!==o&&i.classList.add(`xs-items-${o}`)):"sm"===l?(i.classList.remove("sm-items-1"),i.classList.remove("sm-items-2"),i.classList.remove("sm-items-3"),i.classList.remove("sm-items-4"),i.classList.remove("sm-items-5"),i.classList.remove("sm-items-6"),""!==o&&i.classList.add(`sm-items-${o}`)):"md"===l?(i.classList.remove("md-items-1"),i.classList.remove("md-items-2"),i.classList.remove("md-items-3"),i.classList.remove("md-items-4"),i.classList.remove("md-items-5"),i.classList.remove("md-items-6"),""!==o&&i.classList.add(`md-items-${o}`)):""===l&&(i.classList.remove("desktop-items-1"),i.classList.remove("desktop-items-2"),i.classList.remove("desktop-items-3"),i.classList.remove("desktop-items-4"),i.classList.remove("desktop-items-5"),i.classList.remove("desktop-items-6"),""!==o&&i.classList.add(`desktop-items-${o}`)),this.builder.settings.onChange()}))}));const w=n.querySelector("#chkReverseColumns");w.addEventListener("click",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo();let i=n.querySelector(".div-target"),o=this.builder.responsive.readTarget(i);"xs"===o?w.checked?t.classList.add("xs-column-reverse"):t.classList.remove("xs-column-reverse"):"sm"===o?w.checked?t.classList.add("sm-column-reverse"):t.classList.remove("sm-column-reverse"):"md"===o?w.checked?t.classList.add("md-column-reverse"):t.classList.remove("md-column-reverse"):""===o&&(w.checked?t.classList.add("desktop-column-reverse"):t.classList.remove("desktop-column-reverse")),this.builder.settings.onChange()}));let x=n.querySelector(".input-row-id");x.addEventListener("change",(()=>{let t=e.rowSelected();t&&(this.builder.uo.saveForUndo(),""!==x.value?t.setAttribute("id",x.value):t.removeAttribute("id"),this.builder.opts.onChange())}));let k=n.querySelector(".input-row-classes");k.addEventListener("change",(()=>{let t=e.rowSelected();if(!t)return;this.builder.uo.saveForUndo();let i=[],n=t.getAttribute("data-class");n&&(i=n.split(" "));let o=[],s=k.value;o=s.split(" "),i.forEach((e=>{o.includes(e)||t.classList.remove(e)})),o.forEach((e=>{""!==e&&t.classList.add(e)})),t.setAttribute("data-class",s),""===t.getAttribute("data-class")&&t.removeAttribute("data-class"),this.builder.opts.onChange()})),new Nc({element:n}),new vs({selector:".is-modal.rowsettings .is-draggable"}),function(t){const e=t.rowSettings;if(!e)return;const i=t.builder.util,n=e.querySelectorAll(".cb-cs-seg-btn"),o=e.querySelectorAll(".cb-cs-fill"),s=t=>{n.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),o.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))};t._showRowFill=s,n.forEach((t=>{t.addEventListener("click",(()=>s(t.getAttribute("data-fill"))))}));const l=e.querySelector("#chkRowVisible"),a=e.querySelector(".input-visible"),r=e.querySelector(".input-hidden"),c=()=>{l&&a&&(l.checked=a.classList.contains("on"))};t._syncRowVisSwitch=c,l&&l.addEventListener("change",(()=>{l.checked?a&&a.click():r&&r.click()})),e.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(c,0)))}));const u=e.querySelector("[data-row-class-chips]"),d=e.querySelector(".input-row-classes");u&&d&&(t._rowClassChips=i.chipField(u,{placeholder:i.out("Add class…"),removeTitle:i.out("Remove"),onChange:t=>{d.value=t.join(" "),d.dispatchEvent(new Event("change",{bubbles:!0}))}}))}(this)}}realtimeVisibility(t,e){if(!this.rowSettings)return;if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.rowSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.rowSettings.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.rowSettings.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.rowSettings.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.rowSettings.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.rowSettings.querySelector(".div-target"),n=this.rowSettings.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),this.rowSettings.querySelectorAll(".input-colsperline").forEach((t=>{t.classList.remove("on")}));let l=!1;"xs"===o?(l=t.classList.contains("xs-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="none",t.classList.contains("xs-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("xs-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("xs-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("xs-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("xs-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("xs-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"),e||this.builder.livePreview.resizePreview(375)):"sm"===o?(l=t.classList.contains("sm-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("sm-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("sm-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("sm-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("sm-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("sm-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("sm-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(768)):"md"===o?(l=t.classList.contains("md-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("md-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("md-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("md-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("md-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("md-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("md-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(1024)):(l=t.classList.contains("desktop-column-reverse"),this.rowSettings.querySelector('.input-colsperline[data-value=""]').style.display="flex",t.classList.contains("desktop-items-1")?this.rowSettings.querySelector('.input-colsperline[data-value="1"]').classList.add("on"):t.classList.contains("desktop-items-2")?this.rowSettings.querySelector('.input-colsperline[data-value="2"]').classList.add("on"):t.classList.contains("desktop-items-3")?this.rowSettings.querySelector('.input-colsperline[data-value="3"]').classList.add("on"):t.classList.contains("desktop-items-4")?this.rowSettings.querySelector('.input-colsperline[data-value="4"]').classList.add("on"):t.classList.contains("desktop-items-5")?this.rowSettings.querySelector('.input-colsperline[data-value="5"]').classList.add("on"):t.classList.contains("desktop-items-6")?this.rowSettings.querySelector('.input-colsperline[data-value="6"]').classList.add("on"):this.rowSettings.querySelector('.input-colsperline[data-value=""]').classList.add("on"),e||this.builder.livePreview.resizePreview(1920));this.rowSettings.querySelector("#chkReverseColumns").checked=l}moveRowUp(){this.grid.moveRowUp()}moveRowDown(){this.grid.moveRowDown()}duplicateRow(){this.grid.duplicateRow()}removeRow(){this.grid.removeRow()}hideGridEditor(){const t=this.builder.builderStuff.querySelector(".grideditor");if(!t)return;t.classList.remove("active");this.builder.doc.querySelectorAll(this.builder.opts.container).forEach((t=>{t.removeAttribute("grideditor")}))}showGridEditor(){const t=this.builder.builderStuff,e=this.builder.util,i=t.querySelector(".grideditor");if(!i)return;const n=t=>{let e=t.target;e&&(e.closest(".rte-grideditor")||e.closest(".grideditor")||e.closest(".is-modal")||e.closest(".keep-selection")||e.closest(".is-sidebar")||e.closest(".is-rte-tool")||e.closest(".is-rte-pop")||e.closest(".is-elementrte-tool")||e.closest(".is-builder")||e.closest(".is-pop")||(this.hideGridEditor(),document.removeEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",n),this.builder.handleGridToolClickOut_=!1))};if(i.classList.contains("active"))return this.hideGridEditor(),document.removeEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",n),void(this.builder.handleGridToolClickOut_=!1);e.showModal(i);this.builder.doc.querySelectorAll(this.builder.opts.container).forEach((t=>{t.setAttribute("grideditor","")})),this.builder.handleGridToolClickOut_||(document.addEventListener("click",n),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",n),this.builder.handleGridToolClickOut_=!0)}readRowStyles(t){const e=this.builder.util;if(!this.rowSettings)return;e.clearActiveElement();let i=t.style.backgroundColor,n=this.rowSettings.querySelector(".input-row-bgcolor");i?e.paintColorButton(n,i):e.paintColorButton(n,"");let o="";const s=this.rowSettings.querySelector(".cell-bgimage-preview"),l=this.rowSettings.querySelector(".input-row-bgimageadjust");l.style.display="none";const a=this.rowSettings.querySelector(".input-row-bgremove");a.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(o=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),s.innerHTML=`<img src="${o}">`,l.style.display="flex",a.style.display="flex"):s.innerHTML="";let r=this.rowSettings.querySelector(".input-row-gradient");if(r.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;r.style.backgroundImage=e}const c=this.rowSettings.querySelector(".chk-row-grayscale");c.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(c.checked=!0);let u=t.parentNode;this.realtimeVisibility(u,!0);const d=this.rowSettings.querySelector("#divReverseColumns");let h=3;u.querySelector(".is-row-overlay")&&(h=4),u.childElementCount-h>1?d.style.display="flex":d.style.display="none";let b=this.rowSettings.querySelector(".input-row-id");b.value="";const p=u.getAttribute("id");p&&(b.value=p);let g=this.rowSettings.querySelector(".input-row-classes");g.value="";const m=u.getAttribute("data-class");g.value=m,function(t,e){if(!t.rowSettings||!e)return;let i="color";const n=e.style.backgroundImage;n&&-1!==n.indexOf("url(")?i="image":n&&n.includes("linear")&&(i="gradient"),t._showRowFill&&t._showRowFill(i),t._syncRowVisSwitch&&t._syncRowVisSwitch(),t._rowClassChips&&t._rowClassChips.set(e.getAttribute("data-class")||"")}(this,t)}rowOverlay(){const t=this.builder.util,e=this.builder.dom;let i=t.rowSelected();if(!i)return!1;let n=i.querySelector(".is-row-overlay");return n||(e.appendHtml(i,'<div class="is-row-overlay"></div>'),n=i.querySelector(".is-row-overlay")),i.classList.add("relative"),n}}class eu{constructor(t){this.builder=t;const e=this.builder.dom;this.dom=e}render(t){const e=this.dom,n=this.builder.util,o=this.builder.builderStuff;let s=t.querySelector(".is-rowadd-tool");if(!s){const i=`<div class="is-rowadd-tool" style="height:0">\n <button type="button" tabindex="-1" title="${n.out("Add")}" title="${n.out("Add")}" style="outline:none;line-height:1;margin:0;padding:0;cursor:pointer;background-color:rgba(255,255,255,0.9);"><svg class="is-icon-flex" style="fill:rgba(0, 0, 0, 0.8);width:17px;height:17px;"><use xlink:href="#ion-ios-plus-empty"></use></svg></button>\n </div>`;e.appendHtml(t,i),s=t.querySelector(".is-rowadd-tool");let o=s.querySelectorAll("[title]");Array.prototype.forEach.call(o,(t=>{t.setAttribute("data-title",t.getAttribute("title")),this.builder.iframe?this.builder.tooltip.set(t,5,3,!0):this.builder.tooltip.set(t,5,3)}))}let l=s.querySelector("button");e.addEventListener(l,"click",(t=>{t.preventDefault(),t.stopImmediatePropagation();const s=i(this.builder);s.querySelector(".is-pop-tabs").style.display="none";const a=window.innerHeight,r=n.getElementPosition(l);let c=r.top,u=r.left;n.showPop(s,!1,l);const d=s.offsetWidth,h=s.offsetHeight;a-c>h?(s.style.top=c+window.pageYOffset+27+"px",s.style.left=u-d/2+7+"px",e.removeClass(s,"arrow-bottom"),e.removeClass(s,"arrow-right"),e.removeClass(s,"arrow-left"),e.removeClass(s,"center"),e.addClass(s,"arrow-top"),e.addClass(s,"center")):(s.style.top=c+window.pageYOffset-h-8+"px",s.style.left=u-d/2+7+"px",e.removeClass(s,"arrow-top"),e.removeClass(s,"arrow-right"),e.removeClass(s,"arrow-left"),e.removeClass(s,"center"),e.addClass(s,"arrow-bottom"),e.addClass(s,"center")),s.setAttribute("data-mode","row"),s.classList.remove("simple");const b=t=>{let e=t.target;if(e&&!(e.closest(".quickadd")||e.closest(".row-add")||e.closest(".is-rowadd-tool")||e.closest(".cell-add")||e.closest(".elm-add")||e.closest(".row-add-initial"))){const t=o.querySelector(".quickadd");n.hidePop(t),document.removeEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",b),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",b),this.builder.handleQuickAddClickOut_=!0)}))}}class iu{constructor(t){this.builder=t,this.grid=new fs(t);const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=this.builder.dom;if(this.dom=n,!i.querySelector(".is-pop.imageadjust")){let t=`\n <div class="is-modal imageadjust" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content" style="max-width:420px;">\n <div class="is-modal-bar is-draggable">\n ${e.out("Background Image Adjustments")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:25px;">\n\n <div class="div-target" style="display: flex;justify-content: flex-end;padding: 5px 0 0;">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px;transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:16px;height:16px"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs" style="width:40px;height:25px;">\n <svg class="is-icon-flex" style="width:13px;height:13px"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n\n <div class="cb-grouplabel">${e.out("Scale")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="100" max="500" value="0" class="image-scale-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Horizontal")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="0" max="100" value="0" class="image-hor-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px;">${e.out("Vertical")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="0" max="100" value="0" class="image-vert-slider is-rangeslider">\n </div>\n\n <div style="padding-bottom:3px;padding-top: 10px;display:flex;justify-content:right;align-items:center;">\n <button title="${e.out("Reset")}" class="image-reset" style="display:flex;width:30px;height:30px;"><svg class="is-icon-flex" style="width:11px;height:11px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n\n </div>\n\n </div>\n </div> \n\n <div class="is-modal imageadjust2" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content" style="max-width:420px;">\n <div class="is-modal-bar is-draggable">\n ${e.out("Background Image Adjustments")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:25px;">\n\n <div class="cb-grouplabel">${e.out("Scale")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="100" max="500" value="0" class="image-scale-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px">${e.out("Horizontal")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="-150" max="150" value="0" class="image-hor-slider is-rangeslider">\n </div>\n\n <div class="cb-grouplabel" style="margin-top:20px">${e.out("Vertical")}:</div>\n <div style="padding-top:4px">\n <input type="range" min="-150" max="150" value="0" class="image-vert-slider is-rangeslider">\n </div>\n\n <div style="padding-bottom:3px;padding-top: 10px;display:flex;justify-content:right;align-items:center;">\n <button title="${e.out("Reset")}" class="image-reset" style="display:flex;width:30px;height:30px;"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n\n </div>\n </div> \n\n <div class="is-modal imagesource" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content cb-form" style="max-width:550px;">\n\n <div class="cb-field">\n <label for="inpCellImageBgSource">${e.out("Source")}:</label>\n <div class="image-src">\n <input id="inpCellImageBgSource" class="input-src" type="text">\n <button title="${e.out("Select")}" class="input-select" style="flex:none;">\n ${this.builder.opts.selectIcon}\n </button>\n <div class="image-larger3 input-upload" style="position: relative; flex: 0 0 auto;box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetCellImageUpload" method="post" action="${this.builder.opts.largerImageHandler}" enctype="multipart/form-data" style="position:absolute;display:flex;justify-content: center;align-items: center;top:0;left:0;width:100%;height:100%;">\n <input id="hidRefId3" name="hidRefId" type="hidden" value="">\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage3" name="fileImage" type="file" accept="image/*" style="position:absolute;top:-30px;left:0;width:100%;height:80px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="-1" tabIndex="0" id="frameTargetCellImageUpload" name="frameTargetCellImageUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n\n </div>\n </div>\n\n <div class="is-locked-indicator">\n <svg class="is-icon-flex"><use xlink:href="#icon-lock"></use></svg>\n </div>\n `;n.appendHtml(i,t),this.builder.iframe?this.lockIndicator=this.builder.contentStuff.querySelector(".is-locked-indicator"):this.lockIndicator=i.querySelector(".is-locked-indicator");const o=document.querySelector(".is-modal.imagesource"),s=document.querySelector(".is-modal.imageadjust"),l=document.querySelector(".is-modal.imageadjust2");this.imageSource=o,this.imageAdjust=s,this.imageAdjust2=l,""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(o.querySelector(".image-larger3").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none");let a=o.querySelector(".image-src");if(this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const t=o.querySelector(".input-select");t&&n.addEventListener(t,"click",(()=>{if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:o.querySelector(".input-src"),theTrigger:t});else{let n=i.querySelector(".is-modal.imageselect"),o=n.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(n,!1,(()=>{t.removeAttribute("data-focus"),t.focus()}),!1,this.builder.assetPanelFullScreen),t.setAttribute("data-focus",!0)}this.builder.targetInput=o.querySelector(".input-src"),this.builder.targetCallback=null,this.builder.targetAssetType="image"}))}else n.removeClass(a,"image-select");let r=o.querySelector("#fileImage3");n.addEventListener(r,"change",(t=>{let e=r;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let i=e;n.addClass(i,"please-wait"),o.querySelector("#hidRefId3").value=this.builder.opts.customval,this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):i.submit(),r.value=""}));const c=o.querySelector(".input-ok");n.addEventListener(c,"click",(()=>{const t=this.imageSource.querySelector(".input-src").value;this.builder.imageSelectedCallback&&this.builder.imageSelectedCallback(t),this.builder.hideModal(o)}));const u=o.querySelector(".input-cancel");n.addEventListener(u,"click",(()=>{this.builder.hideModal(o)}));const d=s.querySelector(".image-scale-slider");d.onfocus=()=>{this.builder.uo.saveForUndo(!0)},d.oninput=()=>{let t=d.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let t=e.getAttribute("data-bg-xs");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-xs",i.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let t=e.getAttribute("data-bg-sm");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-sm",i.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let t=e.getAttribute("data-bg-md");t||(t="");let i=document.createElement("div");i.style.cssText=t,i.style.backgroundSize="cover",e.setAttribute("data-bg-md",i.style.cssText)}else e.style.backgroundSize=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},d.onchange=()=>{(document.querySelector(".content-preview.is-screen-375.active")||document.querySelector(".content-preview.is-screen-768.active")||document.querySelector(".content-preview.is-screen-1024.active"))&&(d.value=0),this.builder.opts.onChange()};const h=l.querySelector(".image-scale-slider");h.onfocus=()=>{this.builder.uo.saveForUndo(!0)},h.oninput=()=>{let t=this.builder.elementSelected,e=h.value;this.scaleWidth?(t.style.width=e+"%",t.style.height=100*e/h.min+"%"):(t.style.height=e+"%",t.style.width=100*e/h.min+"%"),t.setAttribute("data-scale",e)},h.onchange=()=>{this.builder.opts.onChange()};const b=s.querySelector(".image-hor-slider");b.onfocus=()=>{this.builder.uo.saveForUndo(!0)},b.oninput=()=>{let t=b.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let i=e.getAttribute("data-bg-xs");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-xs",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let i=e.getAttribute("data-bg-sm");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-sm",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let i=e.getAttribute("data-bg-md");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionX=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-md",n.style.cssText)}else e.style.backgroundPositionX=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},b.onchange=()=>{this.builder.win.adjustBgPos&&this.builder.win.adjustBgPos(),this.builder.opts.onChange()};const p=l.querySelector(".image-hor-slider");p.onfocus=()=>{this.builder.uo.saveForUndo(!0)},p.oninput=()=>{let t=this.builder.elementSelected,e=parseFloat(p.value);t.style.left=`${e}%`,t.style.right="",t.setAttribute("data-x",e)},p.onchange=()=>{this.builder.opts.onChange()};const g=s.querySelector(".image-vert-slider");g.onfocus=()=>{this.builder.uo.saveForUndo(!0)},g.oninput=()=>{let t=g.value,e=this.builder.elementSelected;if(document.querySelector(".content-preview.is-screen-375.active")&&this.useTarget){let i=e.getAttribute("data-bg-xs");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-xs",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-768.active")&&this.useTarget){let i=e.getAttribute("data-bg-sm");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-sm",n.style.cssText)}else if(document.querySelector(".content-preview.is-screen-1024.active")&&this.useTarget){let i=e.getAttribute("data-bg-md");i||(i="");let n=document.createElement("div");n.style.cssText=i,n.style.backgroundPositionY=t+"%",n.style.backgroundSize="cover",e.setAttribute("data-bg-md",n.style.cssText)}else e.style.backgroundPositionY=t+"%";e.style.left="",e.style.top="",e.style.width="",e.style.height="",e.removeAttribute("data-x"),e.removeAttribute("data-y"),e.removeAttribute("data-scale")},g.onchange=()=>{this.builder.win.adjustBgPos&&this.builder.win.adjustBgPos(),this.builder.opts.onChange()};const m=l.querySelector(".image-vert-slider");m.onfocus=()=>{this.builder.uo.saveForUndo(!0)},m.oninput=()=>{let t=this.builder.elementSelected,e=parseFloat(m.value);t.style.top=`${e}%`,t.style.bottom="",t.setAttribute("data-y",e)},m.onchange=()=>{this.builder.opts.onChange()};s.querySelector(".image-reset").addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.elementSelected;this.resetImage(t),this.builder.opts.onChange()}));l.querySelector(".image-reset").addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.elementSelected;this.resetImage2(t),this.builder.opts.onChange()}));this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on");i.querySelector(".is-modal.content-preview").classList.contains("active")||this.builder.openPreview(),this.realtimeImageAdjust(),this.readImageAdjust(this.builder.elementSelected,this.useTarget)}))}))}this.renderColMore()}refreshColumnMoreState(){const t=this.builder.builderStuff.querySelector(".columnmore");if(!t||!this.grid)return;const e=(e,i)=>{const n=t.querySelector(e);n&&(n.disabled=!i)};e(".cell-prev",this.grid.canMoveColumnPrevious()),e(".cell-next",this.grid.canMoveColumnNext()),e(".cell-up",this.grid.canMoveColumnUp()),e(".cell-down",this.grid.canMoveColumnDown())}renderColMore(){const t=this.builder,e=this.builder.builderStuff,i=this.builder.util,n=this.builder.dom;this.grid=new fs(t);let o=e.querySelector(".is-pop.columnmore");if(!o){let s=["moveleft","moveright","moveup","movedown","increase","decrease","duplicate","html","separator","lock","settings"];t.columnMoreButtons&&(s=t.columnMoreButtons);const l={moveleft:`<button type="button" title="${i.out("Move Left")}" class="cell-prev" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-left"></use></svg></span>${i.out("Move Left")}</button>`,moveright:`<button type="button" title="${i.out("Move Right")}" class="cell-next" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-right"></use></svg></span>${i.out("Move Right")}</button>`,moveup:`<button type="button" title="${i.out("Move Up")}" class="cell-up" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${i.out("Move Up")}</button>`,movedown:`<button type="button" title="${i.out("Move Down")}" class="cell-down" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${i.out("Move Down")}</button>`,increase:`<button type="button" title="${i.out("Increase")}" class="cell-increase" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-increase"></use></svg></span>${i.out("Increase")}</button>`,decrease:`<button type="button" title="${i.out("Decrease")}" class="cell-decrease" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-decrease"></use></svg></span>${i.out("Decrease")}</button>`,duplicate:`<button type="button" title="${i.out("Duplicate")}" class="cell-duplicate" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${i.out("Duplicate")}</button>`,html:`<button type="button" title="${i.out("HTML")}" class="cell-html" style="flex: 1 1 calc(50% - 10px);">\n <span><svg class="is-icon-flex" style="margin-right:-3px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-left"></use></svg><svg class="is-icon-flex" style="margin-left:-2px;width:12px;height:12px;"><use xlink:href="#ion-ios-arrow-right"></use></svg></span>${i.out("HTML")}\n </button>`,separator:'<div class="is-separator"></div>',lock:`<button type="button" title="${i.out("Lock")}" class="cell-locking" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-lock"></use></svg></span>${i.out("Lock")}</button>`,settings:`<button type="button" title="${i.out("Settings")}" class="cell-settings" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${i.out("Settings")}</button>`};let a,r=`\n <div class="is-pop columnmore" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${s.filter((e=>!(!t.opts.columnHtmlEditor&&"html"===e))).map((t=>l[t]||"")).join("")}\n </div>\n </div>\n `;n.appendHtml(e,r),o=e.querySelector(".columnmore"),this.columnMore=o,a=o.querySelector(".cell-prev"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnPrevious(),this.refreshColumnMoreState()})),a=o.querySelector(".cell-next"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnNext(),this.refreshColumnMoreState()})),a=o.querySelector(".cell-up"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnUp(),i.clearControls()})),a=o.querySelector(".cell-down"),n.addEventListener(a,"click",(()=>{this.grid.moveColumnDown(),i.clearControls()})),a=o.querySelector(".cell-increase"),n.addEventListener(a,"click",(()=>{const t=i.cellSelected();if(!t)return;const e=t.parentNode;if(!this.builder.useDefaultGrid){let t=!1;Array.from(e.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-col-tool")||e.style.width&&(t=!0)})),t&&(Array.from(e.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||(t.style.width="",t.style.flex="",t.style.height="",t.style.minHeight="")})),i.fixLayout(e))}this.grid.increaseColumn(),Array.from(t.parentNode.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||t.getAttribute("data-module")&&i.refreshModuleLayout(t)}))})),a=o.querySelector(".cell-decrease"),n.addEventListener(a,"click",(()=>{const t=i.cellSelected();if(!t)return;const e=t.parentNode;if(!this.builder.useDefaultGrid){let t=!1;Array.from(e.children).map((e=>{e.classList.contains("is-row-tool")||e.classList.contains("is-rowadd-tool")||e.classList.contains("is-col-tool")||e.style.width&&(t=!0)})),t&&(Array.from(e.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||(t.style.width="",t.style.flex="",t.style.height="",t.style.minHeight="")})),i.fixLayout(e))}this.grid.decreaseColumn(),Array.from(t.parentNode.children).map((t=>{t.classList.contains("is-row-tool")||t.classList.contains("is-rowadd-tool")||t.classList.contains("is-col-tool")||t.getAttribute("data-module")&&i.refreshModuleLayout(t)}))})),a=o.querySelector(".cell-duplicate"),n.addEventListener(a,"click",(()=>{this.grid.duplicateColumn(),i.hidePop(this.columnMore),i.clearControls()})),a=o.querySelector(".cell-html"),a&&n.addEventListener(a,"click",(()=>{if(!i.cellSelected())return;new us(this.builder).view("cell")}));const c=o.querySelector(".cell-locking");c&&n.addEventListener(c,"click",(t=>{let e=i.cellSelected();e&&(e.hasAttribute("data-noedit")?(e.removeAttribute("data-noedit"),e.contentEditable=!0,n.removeClass(c,"on")):(e.setAttribute("data-noedit",""),e.contentEditable=!1,n.addClass(c,"on"),this.util.clearActiveElement(!0)),this.showHideLockIndicator(e),this.builder.element.applyBehavior(e),i.hidePop(this.columnMore),t.preventDefault())})),a=o.querySelector(".cell-settings"),a&&n.addEventListener(a,"click",(()=>{if(this.builder.controlPanel)return this.builder.controlpanel.select("column",!0),void i.hidePop(this.columnMore);this.renderPanel();const t=this.cellSettings;let n=i.cellSelected();n&&(this.readCellStyles(n),i.saveSelection(),i.showModal(t,!1,(()=>{"flex"===e.querySelector(".is-rte-tool").style.display&&i.restoreSelection()})),i.hidePop(this.columnMore))}))}}renderPanel(){const t=this.builder.builderStuff,e=this.builder.util,i=this.builder.dom,n=t.querySelector(".is-modal.imagesource"),o=t.querySelector(".is-modal.imageadjust"),s=t.querySelector(".is-modal.imageadjust2");this.imageSource=n,this.imageAdjust=o,this.imageAdjust2=s;let l=t.querySelector(".is-modal.columnsettings");if(!l){let n=function(t,e){const i=t.useLightbox,n=t.useCssClasses;return`\n <div class="is-modal columnsettings" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Column Settings")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Column Settings")}">\n <button type="button" role="tab" id="tabCellGeneral" data-tab="divCellGeneral" aria-controls="divCellGeneral" aria-selected="true" tabindex="0">${e.out("General")}</button>\n <button type="button" role="tab" id="tabCellContent" data-tab="divCellContent" aria-controls="divCellContent" aria-selected="false" tabindex="-1">${e.out("Content")}</button>\n ${i?`\n <button type="button" role="tab" id="tabCellClick" data-tab="divCellClick" aria-controls="divCellClick" aria-selected="false" tabindex="-1">${e.out("On Click")}</button>\n `:""}\n <button type="button" role="tab" id="tabCellMore" data-tab="divCellMore" aria-controls="divCellMore" aria-selected="false" tabindex="-1">${e.out("More")}</button>\n </div>\n\n <div id="divCellGeneral" class="is-tab-content" role="tabpanel" aria-labelledby="tabCellGeneral" data-group="cellsettings" style="display:flex" tabindex="-1">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-cs-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="cb-cs-seg-btn on" data-fill="color">${e.out("Color")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" class="cb-cs-seg-btn" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-cell-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-cell-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="cell-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-cell-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${t.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-cell-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-cell-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Text Color")}</span>\n <div class="div-content-textcolor cb-cs-chips">\n <button title="${e.out("Dark")}" class="input-cell-textcolor" data-command="dark"><span>${e.out("Dark")}</span></button>\n <button title="${e.out("Light")}" class="input-cell-textcolor" data-command="light"><span>${e.out("Light")}</span></button>\n <button title="${e.out("Default")}" class="input-cell-textcolor" data-command=""><span>${e.out("Default")}</span></button>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkCellGrayscale" class="chk-cell-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — here it\n scopes the column's per-device visibility. Flat section (no box);\n heading + note convey the per-device scope (mirrors Row Settings). --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-cs-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this column")}</span>\n <label class="switch"><input id="chkCellVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden"><span>${e.out("Hidden")}</span></button>\n </div>\n\n \x3c!-- Hidden like the legacy dialog (not in use); kept only so the shared readCellStyles/handler have their hook element. --\x3e\n <div style="display:none"><input id="chkHideColumnOnMobile" class="chk-cell-hideonmobile" type="checkbox" /></div>\n\n </div>\n\n <div id="divCellContent" class="is-tab-content" role="tabpanel" aria-labelledby="tabCellContent" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Spacing")}</span>\n <span class="cb-cs-readout cb-cs-padding-readout is-default"></span>\n </div>\n\n <div class="div-content-padding-pos cb-cs-sidepad" style="${n?"":"display:none"}">\n <div class="cb-cs-mpad" role="group" aria-label="${e.out("Padding")}">\n <button title="${e.out("Top")}" class="input-cell-padding-pos on" data-command="top"><span></span></button>\n <button title="${e.out("Left")}" class="input-cell-padding-pos on" data-command="left"><span></span></button>\n <span class="cb-cs-mpad-mid"></span>\n <button title="${e.out("Right")}" class="input-cell-padding-pos on" data-command="right"><span></span></button>\n <button title="${e.out("Bottom")}" class="input-cell-padding-pos on" data-command="bottom"><span></span></button>\n </div>\n <div class="cb-cs-axis">\n <button title="${e.out("All")}" class="input-cell-padding-pos" data-command="all">${e.out("All")}</button>\n <button title="x" class="input-cell-padding-pos" data-command="x">X</button>\n <button title="y" class="input-cell-padding-pos" data-command="y">Y</button>\n </div>\n </div>\n\n <div class="div-content-padding cb-cs-chiprow">\n <div class="cb-cs-chipset" style="${n?"display:none":""}">\n <button title="0" class="input-cell-padding" data-command="0">0</button>\n <button title="10" class="input-cell-padding" data-command="10">10</button>\n <button title="20" class="input-cell-padding" data-command="20">20</button>\n <button title="30" class="input-cell-padding" data-command="30">30</button>\n <button title="40" class="input-cell-padding" data-command="40">40</button>\n <button title="50" class="input-cell-padding" data-command="50">50</button>\n <button title="60" class="input-cell-padding" data-command="60">60</button>\n </div>\n\n <div class="cb-cs-chipset" style="${n?"":"display:none"}">\n <button title="0" class="input-cell-padding" data-command="0">0</button>\n <button title="10" class="input-cell-padding" data-command="1">10</button>\n <button title="20" class="input-cell-padding" data-command="2">20</button>\n <button title="30" class="input-cell-padding" data-command="3">30</button>\n <button title="40" class="input-cell-padding" data-command="4">40</button>\n <button title="50" class="input-cell-padding" data-command="5">50</button>\n <button title="60" class="input-cell-padding" data-command="6">60</button>\n <button title="70" class="input-cell-padding" data-command="7">70</button>\n <button title="80" class="input-cell-padding" data-command="8">80</button>\n <button title="90" class="input-cell-padding" data-command="9">90</button>\n <button title="100" class="input-cell-padding" data-command="10">100</button>\n <button title="110" class="input-cell-padding" data-command="11">110</button>\n <button title="120" class="input-cell-padding" data-command="12">120</button>\n <button title="140" class="input-cell-padding" data-command="14">140</button>\n <button title="160" class="input-cell-padding" data-command="16">160</button>\n <button title="${e.out("Clear")}" class="input-cell-padding cb-cs-chip-clear" data-command=""><svg class="is-icon-flex" style="flex:none;width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n <p class="cb-cs-hint">${e.out("Empty keeps the column's default padding.")}</p>\n </div>\n\n \x3c!-- Min Height: hidden — rarely used and better set from another panel.\n Kept in the DOM so the shared .input-cell-height handlers don't null-error.\n TO RESTORE: delete the style="display:none" on the wrapper below. --\x3e\n <div style="display:none">\n <div class="is-separator"></div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Min Height")}</span>\n <div class="div-content-height cb-cs-heightrow">\n <div class="cb-cs-stepper">\n <button title="${e.out("Decrease")}" class="input-cell-height" data-command="-">&#8722;</button>\n <button title="${e.out("Increase")}" class="input-cell-height" data-command="+">+</button>\n </div>\n <div class="cb-cs-presets">\n <button title="300" class="input-cell-height" data-command="300">300</button>\n <button title="400" class="input-cell-height" data-command="400">400</button>\n <button title="500" class="input-cell-height" data-command="500">500</button>\n <button title="600" class="input-cell-height" data-command="600">600</button>\n <button title="700" class="input-cell-height" data-command="700">700</button>\n <button title="${e.out("Clear")}" class="input-cell-height cb-cs-chip-clear" data-command=""><svg class="is-icon-flex" style="flex:none;width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n </div>\n </div>\n </div>\n </div>\n\n <div class="is-separator"></div>\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Content Alignment")}</span>\n <span class="cb-cs-readout cb-cs-posval"></span>\n </div>\n <div class="cb-cs-padwrap">\n <div class="div-content-position cb-cs-pad" role="radiogroup" aria-label="${e.out("Content Alignment")}" tabindex="0">\n <div class="cbpad-fill"></div>\n <div class="cbpad-marker"><i></i><i></i></div>\n <button class="cmd-content-pos" data-pos="topleft" title="${e.out("Top Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="topcenter" title="${e.out("Top Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="topright" title="${e.out("Top Right")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="centerleft" title="${e.out("Center Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="center" title="${e.out("Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="centerright" title="${e.out("Center Right")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomleft" title="${e.out("Bottom Left")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomcenter" title="${e.out("Bottom Center")}" type="button"></button>\n <button class="cmd-content-pos" data-pos="bottomright" title="${e.out("Bottom Right")}" type="button"></button>\n </div>\n <button title="${e.out("Clear")}" class="cmd-content-pos cb-cs-pos-clear" data-pos="">${e.out("Clear")}</button>\n </div>\n <p class="cb-cs-hint">${e.out("Arrow keys move the selection.")}</p>\n </div>\n\n </div>\n\n <div id="divCellClick" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabCellClick" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpCellLinkSource">${e.out("Open on click")}:</label>\n <div class="image-src">\n <input id="inpCellLinkSource" class="input-src" type="text" placeholder="${e.out("Link, image, or video URL")}">\n <button title="${e.out("Select")}" class="input-select" style="flex:none;width:40px;">${t.opts.selectIcon}</button>\n\n <button title="${e.out(t.opts.otherSelectCaption)}" class="input-select-other" style="display:none;width:40px;">\n ${t.opts.otherSelectIcon}\n </button>\n\n <div class="image-larger4 is-btn classic" style="position: relative; flex: 0 0 auto; width: 40px; height: var(--cb-field-height); box-shadow: rgba(0, 0, 0, 0.32) 0px 3px 6px -6px;">\n <form class="form-upload-larger" target="frameTargetLinkUpload" method="post" action="${t.opts.largerImageHandler}" enctype="multipart/form-data" style="position:absolute;top:0;left:0;width:100%;height:100%;border-radius:1px;display:flex;align-items: center;justify-content: center;">\n <input id="hidRefId4" name="hidRefId" type="hidden" value="">\n\n <svg style="width:16px;height:16px;"><use xlink:href="#icon-upload"></use></svg>\n\n <input onclick="blur()" title="${e.out("Select")}" id="fileImage4" name="fileImage" type="file" accept="image/*,video/mp4" style="position:absolute;top:-30px;left:0;width:100%;height:68px;opacity: 0;cursor: pointer;">\n </form>\n\n <iframe tabindex="-1" id="frameTargetLinkUpload" name="frameTargetLinkUpload" src="about:blank" style="width:1px;height:1px;position:absolute;top:0;right:-100000px"></iframe>\n </div>\n </div>\n <p class="cb-cs-hint">${e.out("Turns the whole column into a link or lightbox trigger. Leave empty for no action.")}</p>\n </div>\n\n <div class="cb-field" style="align-items:flex-start">\n <button class="input-testclick classic-primary">${e.out("Test")}</button>\n </div>\n\n <p class="cb-cs-hint">${e.out("You can test the On-Click action on page if you lock the column by clicking the lock button")} <svg class="is-icon-flex"><use xlink:href="#icon-lock"></use></svg>.</p>\n\n </div>\n\n <div id="divCellMore" class="is-tab-content cb-form" role="tabpanel" aria-labelledby="tabCellMore" data-group="cellsettings" tabindex="-1">\n\n <div class="cb-field">\n <label for="inpCellId">${e.out("Add Column ID")}:</label>\n <input id="inpCellId" class="input-cell-id cb-cs-mono" type="text" onkeypress="return /[0-9a-zA-Z_]/i.test(event.key)" placeholder="${e.out("e.g. hero-left")}">\n <p class="cb-cs-hint">${e.out("A unique id for anchors or custom scripts.")}</p>\n </div>\n\n <div class="cb-field">\n <label>${e.out("Add Css Classes")}:</label>\n <div data-cell-class-chips></div>\n \x3c!-- hook kept for readCellStyles + the change handler; hidden, driven by the chip field --\x3e\n <input id="inpCellCssClasses" class="input-cell-classes" type="text" style="display:none">\n <p class="cb-cs-hint">${e.out("Space-separated classes applied to the column element.")}</p>\n </div>\n\n </div>\n\n </div>\n\n </div>\n </div>\n `}(this.builder,e);i.appendHtml(t,n),l=t.querySelector(".is-modal.columnsettings"),this.cellSettings=l,i.accessibleTabs(l.querySelector(".cb-tabs"),((t,e)=>{l.querySelectorAll('.is-tab-content[data-group="cellsettings"]').forEach((t=>{t.style.display="none"}));const i=l.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex")})),this.divCellClick=l.querySelector("#divCellClick"),this.divCellGeneral=l.querySelector("#divCellGeneral");let o=l.querySelector(".input-cell-id");o.addEventListener("change",(()=>{let t=e.cellSelected();t&&(this.builder.uo.saveForUndo(),""!==o.value?t.setAttribute("id",o.value):t.removeAttribute("id"),this.builder.opts.onChange())}));let s=l.querySelector(".input-cell-classes");s.addEventListener("change",(()=>{let t=e.cellSelected();if(!t)return;this.builder.uo.saveForUndo();let i=[],n=t.getAttribute("data-class");n&&(i=n.split(" "));let o=[],l=s.value;o=l.split(" "),i.forEach((e=>{o.includes(e)||t.classList.remove(e)})),o.forEach((e=>{""!==e&&t.classList.add(e)})),t.setAttribute("data-class",l),""===t.getAttribute("data-class")&&t.removeAttribute("data-class"),this.builder.opts.onChange()}));let a=l.querySelector(".input-cell-bgcolor");a.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{let i=e.cellSelected();if(i.style.backgroundColor=t,e.paintColorButton(a,t),""!==t){l.querySelector(".input-cell-gradient").style.backgroundImage="",i.style.backgroundImage=""}this.builder.opts.onChange()}),l.querySelector(".input-cell-bgcolor span").style.backgroundColor,(()=>{a.removeAttribute("data-focus"),a.focus()}),a,!0),a.setAttribute("data-focus",!0)}));const r=l.querySelector(".input-cell-bgimage");r&&i.addEventListener(r,"click",(()=>{let t=e.cellSelected();if(!t)return;let i="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(i=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.openImagePicker(i,(t=>{let i=e.cellSelected();if(!i)return;this.builder.uo.saveForUndo(),i.style.backgroundImage=`url("${t}")`,i.style.backgroundSize="cover",i.style.backgroundRepeat="no-repeat";const n=l.querySelector(".cell-bgimage-preview"),o=this.cellSettings.querySelector(".input-cell-bgimageadjust"),s=this.cellSettings.querySelector(".input-cell-bgremove");o.style.display="none",s.style.display="none",""!==t?(n.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):n.innerHTML="",this.builder.opts.onChange()}),r)}));const c=l.querySelector(".input-cell-bgimageadjust");c&&i.addEventListener(c,"click",(()=>{let t=e.cellSelected();t&&this.openImageAdjust(t,c)}));let u=l.querySelector(".input-cell-bgremove");u&&i.addEventListener(u,"click",(()=>{let t=e.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const i=l.querySelector(".cell-bgimage-preview"),n=this.cellSettings.querySelector(".input-cell-bgimageadjust"),o=this.cellSettings.querySelector(".input-cell-bgremove");n.style.display="none",o.style.display="none",i.innerHTML="",this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divCellGeneral.querySelector(".input-select").style.display="none");const d=this.divCellGeneral.querySelector(".input-select");this.builder.renderSelectAsset(d,"image",(t=>{let i=e.cellSelected();if(!i)return;this.builder.uo.saveForUndo(),i.style.backgroundImage=`url("${t}")`,i.style.backgroundSize="cover",i.style.backgroundRepeat="no-repeat";const n=l.querySelector(".cell-bgimage-preview"),o=this.cellSettings.querySelector(".input-cell-bgimageadjust"),s=this.cellSettings.querySelector(".input-cell-bgremove");o.style.display="none",s.style.display="none",""!==t?(n.innerHTML=`<img src="${t}">`,o.style.display="flex",s.style.display="flex"):n.innerHTML="",this.builder.opts.onChange()}));let h=l.querySelectorAll(".input-row-enlarge");Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected().parentNode;i.removeClass(o,"expand-10"),i.removeClass(o,"expand-20"),i.removeClass(o,"expand-30"),i.removeClass(o,"expand-40"),i.removeClass(o,"expand-50"),i.removeClass(o,"expand-60"),i.addClass(o,"expand-"+n),this.builder.opts.onChange()}))}));const b=this.builder.gradientpicker();let p=l.querySelector(".input-cell-gradient");p.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);let t=e.cellSelected();b.open(t,(()=>{this.cellSettings.querySelector(".input-cell-bgimageadjust").style.display="none";this.cellSettings.querySelector(".input-cell-bgremove").style.display="none";this.cellSettings.querySelector(".cell-bgimage-preview").innerHTML="";if(this.imageSource.querySelector(".input-src").value="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=l.querySelector(".input-cell-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}}),(t=>{p.removeAttribute("data-focus"),p.focus()}),p,!0),p.setAttribute("data-focus",!0)})),h=l.querySelectorAll(".input-cell-textcolor"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected();"dark"===n?(i.removeClass(o,"is-light-text"),i.addClass(o,"is-dark-text")):"light"===n?(i.removeClass(o,"is-dark-text"),i.addClass(o,"is-light-text")):(i.removeClass(o,"is-dark-text"),i.removeClass(o,"is-light-text"));let s=o.querySelectorAll("*");Array.prototype.forEach.call(s,(t=>{t.style.color&&(t.style.color="")})),this.builder.opts.onChange()}))})),h=l.querySelectorAll(".input-cell-padding-pos"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{let e=t.getAttribute("data-command"),n=this.cellSettings.querySelectorAll(".input-cell-padding-pos");Array.prototype.forEach.call(n,(t=>{i.removeClass(t,"on")})),"all"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="top"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="left"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="right"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="bottom"]'),"on")):"x"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="left"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="right"]'),"on")):"y"===e?(i.addClass(this.cellSettings.querySelector('button[data-command="top"]'),"on"),i.addClass(this.cellSettings.querySelector('button[data-command="bottom"]'),"on")):i.addClass(t,"on");let o=this.cellSettings.querySelectorAll(".input-cell-padding");Array.prototype.forEach.call(o,(t=>{i.removeClass(t,"on")}))}))})),h=l.querySelectorAll(".input-cell-padding"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-command"),o=e.cellSelected(),s=this.cellSettings.querySelectorAll(".input-cell-padding");if(Array.prototype.forEach.call(s,(t=>{i.removeClass(t,"on")})),this.builder.useCssClasses){let e;i.removeClass(o,"padding-0"),i.removeClass(o,"padding-10"),i.removeClass(o,"padding-20"),i.removeClass(o,"padding-30"),i.removeClass(o,"padding-40"),i.removeClass(o,"padding-50"),i.removeClass(o,"padding-60");let s=this.cellSettings.querySelectorAll(".input-cell-padding-pos.on");if(2===s.length)if(e=s[0].getAttribute("data-command"),"left"===e){let t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.x;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.x[`px_${n}`])}else{let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.y;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.y[`py_${n}`])}else if(4===s.length){let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.all;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.x;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}t=this.builder.cssClasses.padding.y;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.all[`p_${n}`])}else if(e=s[0].getAttribute("data-command"),"top"===e){let t=this.builder.cssClasses.padding.top;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.top[`pt_${n}`])}else if("bottom"===e){let t=this.builder.cssClasses.padding.bottom;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.bottom[`pb_${n}`])}else if("left"===e){let t=this.builder.cssClasses.padding.left;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.left[`pl_${n}`])}else if("right"===e){let t=this.builder.cssClasses.padding.right;for(let e=0;e<Object.keys(t).length;e++){let n=Object.values(t)[e];i.removeClass(o,n)}""!==n&&i.addClass(o,this.builder.cssClasses.padding.right[`pr_${n}`])}i.addClass(t,"on")}else i.removeClass(o,"padding-0"),i.removeClass(o,"padding-10"),i.removeClass(o,"padding-20"),i.removeClass(o,"padding-30"),i.removeClass(o,"padding-40"),i.removeClass(o,"padding-50"),i.removeClass(o,"padding-60"),""!==n&&(i.addClass(o,"padding-"+n),i.addClass(t,"on"));this.builder.opts.onChange()}))}));const g=l.querySelector(".chk-cell-grayscale");i.addEventListener(g,"click",(()=>{this.builder.uo.saveForUndo();let t=e.cellSelected();g.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),this.builder.opts.onChange()}));const m=l.querySelector(".chk-cell-hideonmobile");if(i.addEventListener(m,"click",(()=>{this.builder.uo.saveForUndo();let t=e.cellSelected();m.checked?t.classList.add("hideonmobile"):t.classList.remove("hideonmobile"),this.builder.opts.onChange()})),h=l.querySelectorAll(".input-cell-height"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{let n=this.builder.colHeight;this.builder.uo.saveForUndo();let o=t.getAttribute("data-command"),s=e.cellSelected(),l=this.cellSettings.querySelectorAll(".input-cell-height");if(Array.prototype.forEach.call(l,(t=>{i.removeClass(t,"on")})),""===o)Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)}));else if("-"===o){let t=s.offsetHeight;Array.prototype.forEach.call(n,(e=>{if(t-e>0&&t-e<=50)if(Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+e),300===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');i.addClass(t,"on")}else if(400===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');i.addClass(t,"on")}else if(500===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');i.addClass(t,"on")}else if(600===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');i.addClass(t,"on")}else if(700===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');i.addClass(t,"on")}}))}else if("+"===o){let t=s.offsetHeight;Array.prototype.forEach.call(n,(e=>{if(e-t>0&&e-t<=50)if(Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+e),300===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');i.addClass(t,"on")}else if(400===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');i.addClass(t,"on")}else if(500===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');i.addClass(t,"on")}else if(600===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');i.addClass(t,"on")}else if(700===e){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');i.addClass(t,"on")}}))}else Array.prototype.forEach.call(n,(t=>{i.removeClass(s,"min-height-"+t)})),i.addClass(s,"min-height-"+o),i.addClass(t,"on");this.builder.opts.onChange()}))})),h=l.querySelectorAll(".cmd-content-pos"),Array.prototype.forEach.call(h,(t=>{i.addEventListener(t,"click",(()=>{this.builder.uo.saveForUndo();let n=t.getAttribute("data-pos"),o=e.cellSelected();const s=this.cellSettings.querySelectorAll(".cmd-content-pos");if(Array.prototype.forEach.call(s,(t=>{i.removeClass(t,"on")})),this.builder.useCssClasses)if(""!==n){let e=this.builder.cssClasses.display;if(i.addCssClass(o,e.flex,e),e=this.builder.cssClasses.flexDirection,i.addCssClass(o,e.column,e),"topleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("topcenter"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("topright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.start,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}if("centerleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("center"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("centerright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.center,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}if("bottomleft"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.start,e),i.addClass(t,"on")}if("bottomcenter"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.center,e),i.addClass(t,"on")}if("bottomright"===n){let e=this.builder.cssClasses.justifyContent;i.addCssClass(o,e.end,e),e=this.builder.cssClasses.alignItems,i.addCssClass(o,e.end,e),i.addClass(t,"on")}o.style.justifyContent="",o.style.alignItems=""}else i.removeCssClasses(o,this.builder.cssClasses.display),i.removeCssClasses(o,this.builder.cssClasses.flexDirection),i.removeCssClasses(o,this.builder.cssClasses.justifyContent),i.removeCssClasses(o,this.builder.cssClasses.alignItems),o.style.display="",o.style.flexDirection="",o.style.justifyContent="",o.style.alignItems="";else o.style.display="flex",o.style.flexDirection="column","topleft"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="flex-start",i.addClass(t,"on")),"topcenter"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="center",i.addClass(t,"on")),"topright"===n&&(o.style.justifyContent="flex-start",o.style.alignItems="flex-end",i.addClass(t,"on")),"centerleft"===n&&(o.style.justifyContent="center",o.style.alignItems="flex-start",i.addClass(t,"on")),"center"===n&&(o.style.justifyContent="center",o.style.alignItems="center",i.addClass(t,"on")),"centerright"===n&&(o.style.justifyContent="center",o.style.alignItems="flex-end",i.addClass(t,"on")),"bottomleft"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="flex-start",i.addClass(t,"on")),"bottomcenter"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="center",i.addClass(t,"on")),"bottomright"===n&&(o.style.justifyContent="flex-end",o.style.alignItems="flex-end",i.addClass(t,"on"));this.builder.opts.onChange()}))})),this.builder.opts.onOtherSelectClick||""!==this.builder.opts.otherSelect){this.cellSettings.querySelector(".input-select-other").style.display="flex";let n=this.cellSettings.querySelector(".input-select-other");i.addEventListener(n,"click",(i=>{if(this.builder.opts.onOtherSelectClick)this.builder.opts.onOtherSelectClick({targetInput:this.cellSettings.querySelector(".input-src"),theTrigger:this.cellSettings.querySelector(".input-select-other")});else{let i=t.querySelector(".is-modal.otherselect");this.builder.opts.assetRefresh&&(i.querySelector("iframe").src=this.builder.opts.otherSelect,this.builder.opts.assetRefresh=!1),"about:blank"===i.querySelector("iframe").src&&(i.querySelector("iframe").src=this.builder.opts.otherSelect),e.showModal(i,!1,(()=>{n.removeAttribute("data-focus"),n.focus()}),!1,this.builder.assetPanelFullScreen),n.setAttribute("data-focus",!0)}this.builder.targetInput=this.cellSettings.querySelector(".input-src"),this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="all",i.preventDefault(),i.stopImmediatePropagation()}))}if(""!==this.builder.opts.largerImageHandler||this.builder.opts.onLargerImageUpload||(this.cellSettings.querySelector(".image-larger4").style.display="none"),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(this.divCellClick.querySelector(".input-select").style.display="none"),this.builder.opts.onMediaSelectClick||this.builder.opts.mediaSelect||this.builder.opts.onImageSelectClick||this.builder.opts.imageselect){const n=this.cellSettings.querySelector(".input-src");u=this.divCellClick.querySelector(".input-select"),u&&i.addEventListener(u,"click",(()=>{if(this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media",this.builder.opts.onMediaSelectClick)this.builder.opts.onMediaSelectClick({targetInput:n,theTrigger:u});else if(this.builder.opts.onImageSelectClick)this.builder.opts.onImageSelectClick({targetInput:n,theTrigger:u});else if(this.builder.opts.mediaSelect){let i=t.querySelector(".is-modal.mediaselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.mediaSelect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.mediaSelect),e.showModal(i,!1,(()=>{u.removeAttribute("data-focus"),u.focus()}),!1,this.builder.assetPanelFullScreen),u.setAttribute("data-focus",!0),this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media"}else if(this.builder.opts.imageselect){let i=t.querySelector(".is-modal.imageselect"),o=i.querySelector("iframe");this.builder.opts.assetRefresh&&(o.src=this.builder.opts.imageselect,this.builder.opts.assetRefresh=!1),"about:blank"===o.src&&(o.src=this.builder.opts.imageselect),e.showModal(i,!1,(()=>{u.removeAttribute("data-focus"),u.focus()}),!1,this.builder.assetPanelFullScreen),u.setAttribute("data-focus",!0),this.builder.targetInput=n,this.builder.targetCallback=()=>{this.applyClick()},this.builder.targetAssetType="media"}}))}const f=this.cellSettings.querySelector(".input-src");i.observeElement(f,"value",(()=>{this.applyClick()}));let y=this.cellSettings.querySelector("#fileImage4");i.addEventListener(y,"change",(t=>{let e=y;for(;"form"!==e.nodeName.toLowerCase();)e=e.parentNode;let n=e;i.addClass(n,"please-wait"),this.cellSettings.querySelector("#hidRefId4").value=this.builder.opts.customval,this.builder.opts.onMediaUpload?this.builder.opts.onMediaUpload(t):this.builder.opts.onLargerImageUpload?this.builder.opts.onLargerImageUpload(t):n.submit(),y.value=""}));const v=this.cellSettings.querySelector(".input-src");v.addEventListener("focus",(()=>{this.builder.uo.saveForUndo(!0)})),v.addEventListener("keyup",(()=>{let t=this.util.cellSelected();t&&(""===v.value?(i.removeClass(t,"block-click"),t.removeAttribute("data-modal-url")):(i.addClass(t,"block-click"),t.setAttribute("data-modal-url",v.value)),this.builder.opts.onChange())})),this.cellSettings.querySelector(".input-testclick").addEventListener("click",(()=>{let t=this.util.cellSelected();t&&""!==v.value&&this.builder.openMedia(t)})),this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{let e=this.util.cellSelected();e&&(this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(e))}))}));let w=this.cellSettings.querySelector(".input-visible"),x=this.cellSettings.querySelector(".input-hidden");const k=(t,e)=>t.querySelectorAll(`.${e}-hidden`).length>0;w.addEventListener("click",(()=>{let t=this.util.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=this.cellSettings.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.remove("xs-hidden"):"sm"===i?(t.classList.remove("sm-hidden"),k(t.parentNode,"sm")||t.parentNode.classList.remove("sm-autofit")):"md"===i?(t.classList.remove("md-hidden"),k(t.parentNode,"md")||t.parentNode.classList.remove("md-autofit")):""===i&&(t.classList.remove("desktop-hidden"),k(t.parentNode,"desktop")||t.parentNode.classList.remove("desktop-autofit")),w.classList.add("on"),x.classList.remove("on"),this.builder.opts.onChange()})),x.addEventListener("click",(()=>{let t=this.util.cellSelected();if(!t)return;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=this.cellSettings.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.add("xs-hidden"):"sm"===i?(t.classList.add("sm-hidden"),t.parentNode.classList.add("sm-autofit")):"md"===i?(t.classList.add("md-hidden"),t.parentNode.classList.add("md-autofit")):""===i&&(t.classList.add("desktop-hidden"),t.parentNode.classList.add("desktop-autofit")),w.classList.remove("on"),x.classList.add("on"),this.builder.opts.onChange()})),new Nc({element:l}),new vs({selector:".is-modal.columnsettings .is-draggable"}),function(t){const e=t.cellSettings;if(!e)return;const i=t.util,n=e.querySelectorAll(".cb-cs-seg-btn"),o=e.querySelectorAll(".cb-cs-fill"),s=t=>{n.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),o.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))};t._showColumnFill=s,n.forEach((t=>{t.addEventListener("click",(()=>s(t.getAttribute("data-fill"))))}));const l=e.querySelectorAll(".div-content-textcolor .input-cell-textcolor");l.forEach((t=>{t.addEventListener("click",(()=>{l.forEach((t=>t.classList.remove("on"))),t.classList.add("on")}))}));const a=e.querySelector("#chkCellVisible"),r=e.querySelector(".input-visible"),c=e.querySelector(".input-hidden"),u=()=>{a&&r&&(a.checked=r.classList.contains("on"))};t._syncVisSwitch=u,a&&a.addEventListener("change",(()=>{a.checked?r&&r.click():c&&c.click()})),e.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(u,0)))}));const d=e.querySelector(".cb-cs-padding-readout");t._syncPaddingDefault=()=>{if(!d)return;const t=e.querySelector(".input-cell-padding.on");t&&""!==t.getAttribute("data-command")?(d.classList.remove("is-default"),d.textContent=t.textContent.trim()+"px"):(d.classList.add("is-default"),d.textContent=i.out("Default"))},e.querySelectorAll(".input-cell-padding").forEach((e=>{e.addEventListener("click",(()=>t._syncPaddingDefault()))}));const h=e.querySelector(".cb-cs-pad");if(h){const n=h.querySelector(".cbpad-fill"),o=h.querySelector(".cbpad-marker"),s=e.querySelector(".cb-cs-posval"),l=Array.prototype.slice.call(h.querySelectorAll(".cmd-content-pos")),a=t=>{const e=t%3,i=Math.floor(t/3),a=100/3;n&&(n.style.left=e*a+"%",n.style.top=i*a+"%",n.style.opacity="1"),o&&(o.style.left=(e+.5)*a+"%",o.style.top=(i+.5)*a+"%",o.style.opacity="1"),s&&(s.textContent=l[t]&&l[t].getAttribute("title")||"")};t._placeColumnPos=t=>{null==t||t<0?(n&&(n.style.opacity="0"),o&&(o.style.opacity="0"),s&&(s.textContent=i.out("Default"))):a(t)},l.forEach(((t,e)=>t.addEventListener("click",(()=>a(e))))),h.addEventListener("keydown",(t=>{let e=l.findIndex((t=>t.classList.contains("on")));e<0&&(e=4);let i=e%3,n=Math.floor(e/3),o=!0;if("ArrowLeft"===t.key?i=Math.max(0,i-1):"ArrowRight"===t.key?i=Math.min(2,i+1):"ArrowUp"===t.key?n=Math.max(0,n-1):"ArrowDown"===t.key?n=Math.min(2,n+1):o=!1,o){t.preventDefault();const e=l[3*n+i];e&&e.click()}}));const r=e.querySelector('.cmd-content-pos[data-pos=""]');r&&r.addEventListener("click",(()=>t._placeColumnPos(-1)))}const b=e.querySelector("[data-cell-class-chips]"),p=e.querySelector(".input-cell-classes");b&&p&&(t._cellClassChips=i.chipField(b,{placeholder:i.out("Add class…"),removeTitle:i.out("Remove"),onChange:t=>{p.value=t.join(" "),p.dispatchEvent(new Event("change",{bubbles:!0}))}}))}(this)}}moveColumnLeft(){this.grid.moveColumnPrevious()}moveColumnRight(){this.grid.moveColumnNext()}duplicateColumn(){this.grid.duplicateColumn()}removeColumn(){this.grid.removeColumn()}moveColumnUp(){this.grid.moveColumnUp()}moveColumnDown(){this.grid.moveColumnDown()}applyClick(){const t=this.dom;let e=this.util.cellSelected();if(!e)return;const i=this.cellSettings.querySelector(".input-src");let n=e.getAttribute("data-modal-url");n||(n=""),n!==i.value&&(this.builder.uo.saveForUndo(),t.addClass(e,"block-click"),e.setAttribute("data-modal-url",i.value),this.builder.opts.onChange())}readCellStyles(t){const e=this.dom;this.util.clearActiveElement();let i=t.style.backgroundColor,n=this.cellSettings.querySelector(".input-cell-bgcolor");i?this.util.paintColorButton(n,i):this.util.paintColorButton(n,"");let o="";const s=this.cellSettings.querySelector(".cell-bgimage-preview"),l=this.cellSettings.querySelector(".input-cell-bgimageadjust");l.style.display="none";const a=this.cellSettings.querySelector(".input-cell-bgremove");a.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(o=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),s.innerHTML=`<img src="${o}">`,l.style.display="flex",a.style.display="flex"):s.innerHTML="";let r=this.cellSettings.querySelector(".input-cell-gradient");if(r.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;r.style.backgroundImage=e}const c=this.cellSettings.querySelector(".input-src");c.value="";let u=t.getAttribute("data-modal-url");u&&(c.value=u);let d=this.cellSettings.querySelectorAll(".input-cell-padding");if(Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")})),e.hasClass(t,"padding-0")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="0"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-10")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="10"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-20")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="20"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-30")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="30"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-40")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="40"');e.addClass(t,"on")}else if(e.hasClass(t,"padding-50")){let t=this.cellSettings.querySelector('.input-cell-padding[data-command="50"');e.addClass(t,"on")}const h=this.cellSettings.querySelector(".chk-cell-grayscale");h.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(h.checked=!0);const b=this.cellSettings.querySelector(".chk-cell-hideonmobile");b.checked=!1,t.classList.contains("hideonmobile")&&(b.checked=!0),d=this.cellSettings.querySelectorAll(".input-cell-height"),Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")}));let p=0,g=this.builder.colHeight;if(Array.prototype.forEach.call(g,(i=>{e.hasClass(t,"min-height-"+i)&&(p=i)})),300===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="300"');e.addClass(t,"on")}else if(400===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="400"');e.addClass(t,"on")}else if(500===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="500"');e.addClass(t,"on")}else if(600===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="600"');e.addClass(t,"on")}else if(700===p){let t=this.cellSettings.querySelector('.input-cell-height[data-command="700"');e.addClass(t,"on")}d=this.cellSettings.querySelectorAll(".cmd-content-pos"),Array.prototype.forEach.call(d,(t=>{e.removeClass(t,"on")}));let m=t.style.alignItems,f=t.style.justifyContent,y="";if("flex-start"===f?"flex-start"===m?y="topleft":"center"===m?y="topcenter":"flex-end"===m&&(y="topright"):"center"===f?"flex-start"===m?y="centerleft":"center"===m?y="center":"flex-end"===m&&(y="centerright"):"flex-end"===f&&("flex-start"===m?y="bottomleft":"center"===m?y="bottomcenter":"flex-end"===m&&(y="bottomright")),"topleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topleft"');e.addClass(t,"on")}else if("topcenter"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topcenter"');e.addClass(t,"on")}else if("topright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="topright"');e.addClass(t,"on")}else if("centerleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="centerleft"');e.addClass(t,"on")}else if("center"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="center"');e.addClass(t,"on")}else if("centerright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="centerright"');e.addClass(t,"on")}else if("bottomleft"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomleft"');e.addClass(t,"on")}else if("bottomcenter"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomcenter"');e.addClass(t,"on")}else if("bottomright"===y){let t=this.cellSettings.querySelector('.cmd-content-pos[data-pos="bottomright"');e.addClass(t,"on")}this.realtimeVisibility(t,!0);let v=this.cellSettings.querySelector(".input-cell-id");v.value="";const w=t.getAttribute("id");w&&(v.value=w);let x=this.cellSettings.querySelector(".input-cell-classes");x.value="";const k=t.getAttribute("data-class");x.value=k,function(t,e){const i=t.cellSettings;if(!i||!e)return;let n="color";const o=e.style.backgroundImage;if(o&&-1!==o.indexOf("url(")?n="image":o&&o.includes("linear")&&(n="gradient"),t._showColumnFill&&t._showColumnFill(n),i.querySelectorAll(".div-content-textcolor .input-cell-textcolor").forEach((t=>{const i=t.getAttribute("data-command");let n;n="dark"===i?e.classList.contains("is-dark-text"):"light"===i?e.classList.contains("is-light-text"):!e.classList.contains("is-dark-text")&&!e.classList.contains("is-light-text"),t.classList.toggle("on",n)})),t._syncVisSwitch&&t._syncVisSwitch(),t._syncPaddingDefault&&t._syncPaddingDefault(),t._cellClassChips&&t._cellClassChips.set(e.getAttribute("data-class")||""),t._placeColumnPos){const e=Array.prototype.slice.call(i.querySelectorAll(".cb-cs-pad .cmd-content-pos")),n=i.querySelector(".cb-cs-pad .cmd-content-pos.on");t._placeColumnPos(n?e.indexOf(n):-1)}}(this,t)}realtimeVisibility(t,e){if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.cellSettings.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.cellSettings.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.cellSettings.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.cellSettings.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.cellSettings.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.cellSettings.querySelector(".div-target"),n=this.cellSettings.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),"xs"===o?e||this.builder.livePreview.resizePreview(375):"sm"===o?e||this.builder.livePreview.resizePreview(768):"md"===o?e||this.builder.livePreview.resizePreview(1024):e||this.builder.livePreview.resizePreview(1920)}openImagePicker(t,e,i){const n=this.imageSource;n.querySelector(".input-src").value=t,this.builder.imageSelectedCallback=e,n.style.zIndex="10005",this.util.showModal(n,!1,(()=>{i&&(i.removeAttribute("data-focus"),i.focus())}),!1,this.builder.assetPanelFullScreen),i&&i.setAttribute("data-focus",!0)}readImageAdjust(t,e){const i=this.imageAdjust,n=i.querySelector(".image-scale-slider"),o=i.querySelector(".image-hor-slider"),s=i.querySelector(".image-vert-slider");n.value=100,o.value=0,s.value=0,n.disabled=!1,e&&(o.value=50,s.value=60);let l=document.createElement("div");if(document.querySelector(".content-preview.is-screen-375.active")&&e){let e=t.getAttribute("data-bg-xs");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else if(document.querySelector(".content-preview.is-screen-768.active")&&e){let e=t.getAttribute("data-bg-sm");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else if(document.querySelector(".content-preview.is-screen-1024.active")&&e){let e=t.getAttribute("data-bg-md");e||(e=""),l.style.cssText=e,n.disabled=!0,n.style.opacity=.6}else l.style.cssText=t.style.cssText,n.disabled=!1,n.style.opacity="";if(l.style.backgroundSize){let t,e=l.style.backgroundSize;t=isNaN(parseInt(e))?100:parseInt(e),-1!==e.indexOf("%")&&(n.value=t)}if(l.style.backgroundPositionX){let t,e=l.style.backgroundPositionX;t=isNaN(parseInt(e))?0:parseInt(e),-1!==e.indexOf("%")&&(o.value=t)}if(l.style.backgroundPositionY){let t,e=l.style.backgroundPositionY;t=isNaN(parseInt(e))?0:parseInt(e),-1!==e.indexOf("%")&&(s.value=t)}this.builder.elementSelected=t}openImageAdjust(t,e,i){this.useTarget=!!i;const n=this.imageAdjust.querySelector(".div-target");n.style.display=i?"flex":"none";const o=this.builderStuff.querySelector(".is-modal.content-preview");this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),o.classList.contains("active")||this.imageAdjust.querySelector('.input-device[data-value=""]').classList.add("on"),this.readImageAdjust(t,i),this.imageAdjust.style.zIndex="10005",this.util.showModal(this.imageAdjust,!1,(()=>{e&&(e.removeAttribute("data-focus"),e.focus())})),e&&e.setAttribute("data-focus",!0),this.realtimeImageAdjust(!0)}realtimeImageAdjust(t){if(t){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.imageAdjust.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.imageAdjust.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.imageAdjust.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.imageAdjust.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.imageAdjust.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let e=this.imageAdjust.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t||this.builder.livePreview.resizePreview(375):"sm"===i?t||this.builder.livePreview.resizePreview(768):"md"===i?t||this.builder.livePreview.resizePreview(1024):t||this.builder.livePreview.resizePreview(1920)}resetImage(t){const e=this.imageAdjust,i=e.querySelector(".image-scale-slider"),n=e.querySelector(".image-hor-slider"),o=e.querySelector(".image-vert-slider");n.value=50,o.value=60,i.value=0,(t.classList.contains("cell-active")||t.classList.contains("is-row-overlay"))&&(n.value=0,o.value=0),t.style.backgroundPositionX="",t.style.backgroundPositionY="",t.style.backgroundSize="cover",t.style.left="",t.style.top="",t.style.width="",t.style.height="",t.removeAttribute("data-x"),t.removeAttribute("data-y"),t.removeAttribute("data-scale"),t.removeAttribute("data-bg-xs"),t.removeAttribute("data-bg-sm"),t.removeAttribute("data-bg-md")}resetImage2(t){const e=this.imageAdjust2,i=e.querySelector(".image-scale-slider"),n=e.querySelector(".image-hor-slider"),o=e.querySelector(".image-vert-slider");let s,l,a=t.parentNode.offsetWidth,r=t.parentNode.offsetHeight;l=new Image,l.src=t.style.backgroundImage.replace(/"/g,"").replace(/url\(|\)$/gi,""),l.onload=()=>{if(s={width:l.naturalWidth,height:l.naturalHeight},this.dimension=s,a/r<=s.width/s.height){this.scaleWidth=!0,this.scaleHeight=!1;let e=r*(s.width/s.height);e=e/a*100,t.style.width||(t.style.width=e+"%",t.style.height=""),i.min=e;let l=.5*-(e-100);n.value=l,t.style.left=l+"%",t.setAttribute("data-x",l),o.value=0,t.style.top="0%",t.setAttribute("data-y",0),i.value=e,t.style.width=e+"%",t.setAttribute("data-scale",e),t.style.height="100%"}else{this.scaleHeight=!0,this.scaleWidth=!1;let e=a*(s.height/s.width);e=e/r*100,t.style.height||(t.style.height=e+"%",t.style.width=""),i.min=e;let l=.6*-(e-100);o.value=l,t.style.top=l+"%",t.setAttribute("data-y",l),n.value=0,t.style.left="0%",t.setAttribute("data-x",0),i.value=e,t.style.height=e+"%",t.setAttribute("data-scale",e),t.style.width="100%"}}}openImageAdjust2(t,e){const i=this.imageAdjust2,n=i.querySelector(".image-scale-slider"),o=i.querySelector(".image-hor-slider"),s=i.querySelector(".image-vert-slider");n.value=0,o.value=0,s.value=15;const l=t.getAttribute("data-scale");l&&(n.value=l);const a=t.getAttribute("data-x");a&&(o.value=a);const r=t.getAttribute("data-y");r&&(s.value=r);let c,u,d=t.parentNode.offsetWidth,h=t.parentNode.offsetHeight;u=new Image,u.src=t.style.backgroundImage.replace(/"/g,"").replace(/url\(|\)$/gi,""),u.onload=()=>{if(c={width:u.naturalWidth,height:u.naturalHeight},this.dimension=c,d/h<=c.width/c.height){this.scaleWidth=!0,this.scaleHeight=!1;let e=h*(c.width/c.height);e=e/d*100,t.style.width||(t.style.width=e+"%",t.style.height=""),n.min=e,a||(o.value=.5*-(e-100),t.style.left=.5*-(e-100)+"%",s.value=0);t.getAttribute("data-scale")||(n.value=e)}else{this.scaleHeight=!0,this.scaleWidth=!1;let e=d*(c.height/c.width);e=e/h*100,t.style.height||(t.style.height=e+"%",t.style.width=""),n.min=e,r||(s.value=.6*-(e-100),t.style.top=.6*-(e-100)+"%",o.value=0);t.getAttribute("data-scale")||(n.value=e)}},this.builder.elementSelected=t,i.style.zIndex="10005",this.util.showModal(i,!1,(()=>{e&&(e.removeAttribute("data-focus"),e.focus())})),e&&e.setAttribute("data-focus",!0)}showHideLockIndicator(t){const e=this.lockIndicator;if(t.hasAttribute("data-noedit")){let i,n;this.builder.iframe?(i=t.getBoundingClientRect().top+this.builder.win.pageYOffset,n=t.getBoundingClientRect().left+this.builder.win.pageXOffset):(i=t.getBoundingClientRect().top+window.pageYOffset,n=t.getBoundingClientRect().left+window.pageXOffset);const o=t.offsetWidth*this.builder.zoom;e.style.display="flex",e.style.top=i+4+"px",e.style.left=n+o-33+"px"}else e.style.display=""}click(t){if(this.columnTool=t.parentNode.querySelector(":scope > .is-col-tool"),!this.columnTool)return;this.columnTool.style.left=t.offsetLeft+"px",this.columnTool.style.top=t.offsetTop+"px";const e=this.columnTool.querySelector(".cell-add"),i=this.columnTool.querySelector(".cell-remove"),n=this.columnTool.querySelector(".cell-more");t.closest("[nogrid]")?(e.style.display="none",i.style.display="none",e.setAttribute("disabled","disabled"),i.setAttribute("disabled","disabled"),t.getAttribute("data-html")&&(n.style.display="none",n.setAttribute("disabled","disabled"))):(e.style.display="",i.style.display="",e.removeAttribute("disabled"),i.removeAttribute("disabled"));let o=t.parentNode;if(o.hasAttribute("data-protected")){o.querySelector(".is-row-tool").style.display="none",this.columnTool.style.display="none";let t=o.querySelector(".is-rowadd-tool");t&&(t.style.display="none")}else{this.columnTool.style.display="",t.closest("[data-protected]")?(e.style.display="none",i.style.display="none",n.style.display="none"):(e.style.display="",i.style.display="",n.style.display="")}t.classList.contains("column-lock")&&(e.style.display="none",i.style.display="none")}}const nu=new ze;class ou{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;let n=i.querySelector(".editstyles");if(!n){let t=`\n <div class="is-modal is-modal-content editstyles" role="dialog" aria-modal="true" aria-label="${e.out("Style")}">\n <div class="is-modal-bar is-draggable">\n <button class="is-modal-close" tabindex="-1" title="${e.out("Close")}">&#10005;</button>\n </div>\n <div class="editstyles-body">\n <div class="cb-field cb-field-grow">\n <label class="cb-grouplabel" for="inpElmInlineStyle">${e.out("Style")}</label>\n <textarea id="inpElmInlineStyle" spellcheck="false" aria-label="${e.out("Style")}"></textarea>\n </div>\n <div class="cb-field">\n <label class="cb-grouplabel" for="inpElmClassName">${e.out("Class")}</label>\n <input type="text" id="inpElmClassName" value="" spellcheck="false" aria-label="${e.out("Class")}" />\n </div>\n </div>\n </div>\n `;nu.appendHtml(i,t),n=i.querySelector(".editstyles"),new vs({selector:".is-modal.editstyles .is-draggable"});let o=n.querySelector(".is-modal-close");nu.addEventListener(o,"click",(()=>{nu.removeClass(n,"active");var t=this.builderStuff.querySelector(".elementstyles");if(!nu.hasClass(t,"active")){let t=document.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(t,(t=>{t.removeAttribute("data-saveforundo")})),t=document.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(t,(t=>{nu.removeClass(t,"elm-inspected")}))}}));let s=n.querySelector("#inpElmClassName");s.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=n.querySelector("#inpElmClassName").value,i=!1;nu.hasClass(t,"elm-active")&&(i=!0);let o=!1;nu.hasClass(t,"elm-active")&&(o=!0);let s=!1;nu.hasClass(t,"row-active")&&(s=!0),t.setAttribute("class",e),i&&nu.addClass(t,"elm-active"),o&&nu.addClass(t,"cell-active"),s&&nu.addClass(t,"row-active"),nu.addClass(t,"elm-inspected"),this.builder.opts.onChange()})),s=n.querySelector("#inpElmInlineStyle"),s.addEventListener("keyup",(()=>{this.builder.inspectedElement.style.cssText=n.querySelector("#inpElmInlineStyle").value,this.builder.opts.onChange()}))}this.modalStyles=n}toggleStyleEditor(){nu.hasClass(this.modalStyles,"active")?nu.removeClass(this.modalStyles,"active"):nu.addClass(this.modalStyles,"active")}refresh(){if(!this.builder.inspectedElement)return;this.modalStyles.querySelector("#inpElmInlineStyle").value=this.builder.inspectedElement.style.cssText;let t=this.builder.inspectedElement.getAttribute("class");t&&(t=t.replace("elm-active",""),t=t.replace("cell-active",""),t=t.replace("row-active",""),t=t.replace("elm-inspected",""),t=t.replace(" "," ").trim()),this.modalStyles.querySelector("#inpElmClassName").value=t}}const su=new ze;class lu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);let o=i.querySelector("#divElementGeneral");this.panelStuff=o;const s=`\n <div class="cb-elmgeneral">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Background")}</span>\n <div class="cb-seg" role="group" aria-label="${e.out("Background")}">\n <button type="button" class="on" data-fill="color">${e.out("Color")}</button>\n <button type="button" data-fill="gradient">${e.out("Gradient")}</button>\n <button type="button" data-fill="image">${e.out("Image")}</button>\n </div>\n\n <div class="cb-cs-fill" data-fill="color">\n <button title="${e.out("Background Color")}" class="input-elm-bgcolor cb-colorbtn"><span></span></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="gradient" style="display:none">\n <button title="${e.out("Gradient")}" class="input-elm-gradient cb-gradientbtn"></button>\n </div>\n\n <div class="cb-cs-fill" data-fill="image" style="display:none">\n <div class="elm-bgimage-preview"></div>\n <div class="cb-cs-imagerow">\n <button title="${e.out("Image")}" class="input-elm-bgimage">\n <svg class="is-icon-flex"><use xlink:href="#icon-image"></use></svg>\n <span>${e.out("Image")}</span>\n </button>\n <button title="${e.out("Select")}" class="input-select">${this.builder.opts.selectIcon}</button>\n <button title="${e.out("Remove")}" class="input-elm-bgremove"><svg class="is-icon-flex" style="width:16px;height:16px;"><use xlink:href="#icon-eraser"></use></svg></button>\n <button title="${e.out("Adjust")}" class="input-elm-bgimageadjust"><svg class="is-icon-flex"><use xlink:href="#ion-wrench"></use></svg></button>\n </div>\n </div>\n </div>\n\n <div class="cb-switchrow">\n <span class="lbl">${e.out("Grayscale")}<small>${e.out("Desaturate the background image")}</small></span>\n <label class="switch"><input id="chkElmGrayscale" class="chk-elm-grayscale" type="checkbox" /><span class="slider"></span></label>\n </div>\n\n <div class="is-separator"></div>\n\n \x3c!-- Responsive: the device selector is a breakpoint switcher — here it\n scopes the element's per-device visibility (mirrors Column/Row). --\x3e\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Responsive")}</span>\n <span class="cb-subnote">${e.out("applies to the selected device")}</span>\n </div>\n <div class="div-target cb-devrow">\n <button title="${e.out("Desktop")}" class="input-device on" data-value="">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-desktop"></use></svg>\n </button>\n <button title="${e.out("Laptop/Tablet (Landscape)")}" class="input-device" data-value="md">\n <svg class="is-icon-flex" style="transform:rotate(-90deg)"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Tablet (Portrait)")}" class="input-device" data-value="sm">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-tablet"></use></svg>\n </button>\n <button title="${e.out("Mobile")}" class="input-device" data-value="xs">\n <svg class="is-icon-flex"><use xlink:href="#icon-device-mobile"></use></svg>\n </button>\n </div>\n <div class="cb-switchrow" style="margin-top:14px">\n <span class="lbl">${e.out("Show this element")}</span>\n <label class="switch"><input id="chkElmVisible" type="checkbox" checked /><span class="slider"></span></label>\n </div>\n <div class="div-visibility" style="display:none">\n <button title="${e.out("Visible")}" class="input-visible on" data-value="sm"><span>${e.out("Visible")}</span></button>\n <button title="${e.out("Hidden")}" class="input-hidden" data-value="xs"><span>${e.out("Hidden")}</span></button>\n </div>\n\n </div>\n `;su.appendHtml(o,s);let l=o.querySelector(".input-elm-bgcolor");l.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),this.builder.colorPicker.open((t=>{let i=this.builder.inspectedElement;if(i.style.backgroundColor=t,e.paintColorButton(l,t),""!==t){o.querySelector(".input-elm-gradient").style.backgroundImage="",i.style.backgroundImage=""}n.refresh(),this.builder.opts.onChange()}),o.querySelector(".input-elm-bgcolor span").style.backgroundColor,(()=>{l.removeAttribute("data-focus"),l.focus()}),l,!0),l.setAttribute("data-focus",!0)}));const a=this.builder.gradientpicker();let r=o.querySelector(".input-elm-gradient");r.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0),a.open(this.builder.inspectedElement,(()=>{let t=this.builder.inspectedElement;if(t.style.backgroundImage&&t.style.backgroundImage.includes("linear-gradient")){const i=o.querySelector(".input-elm-bgcolor");e.paintColorButton(i,""),t.style.backgroundColor=""}n.refresh()}),(t=>{t&&n.refresh(),r.removeAttribute("data-focus"),r.focus()}),r,!0),r.setAttribute("data-focus",!0)}));const c=o.querySelector(".input-elm-bgimage");c&&su.addEventListener(c,"click",(()=>{const t=this.builder.inspectedElement;let e="";t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")&&(e=t.style.backgroundImage.slice(4,-1).replace(/["']/g,"")),this.builder.colTool.openImagePicker(e,(t=>{this.builder.uo.saveForUndo();const e=this.builder.inspectedElement;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=o.querySelector(".elm-bgimage-preview"),s=this.panelStuff.querySelector(".input-elm-bgimageadjust"),l=this.panelStuff.querySelector(".input-elm-bgremove");s.style.display="none",l.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,s.style.display="flex",l.style.display="flex"):i.innerHTML="",n.refresh(),this.builder.opts.onChange()}),c)}));const u=o.querySelector(".input-elm-bgimageadjust");u&&su.addEventListener(u,"click",(()=>{const t=this.builder.inspectedElement;this.builder.colTool.openImageAdjust(t,u)}));const d=o.querySelector(".input-elm-bgremove");d&&su.addEventListener(d,"click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.style.backgroundImage="",t.style.backgroundSize="",t.style.backgroundRepeat="",t.style.backgroundPosition="";const e=o.querySelector(".elm-bgimage-preview"),i=this.panelStuff.querySelector(".input-elm-bgimageadjust"),s=this.panelStuff.querySelector(".input-elm-bgremove");i.style.display="none",s.style.display="none",e.innerHTML="",n.refresh(),this.builder.opts.onChange()})),this.builder.opts.onImageSelectClick||""!==this.builder.opts.imageselect||(o.querySelector(".input-select").style.display="none");const h=o.querySelector(".input-select");this.builder.renderSelectAsset(h,"image",(t=>{const e=this.builder.inspectedElement;this.builder.uo.saveForUndo(),e.style.backgroundImage=`url("${t}")`,e.style.backgroundSize="cover",e.style.backgroundRepeat="no-repeat";const i=o.querySelector(".elm-bgimage-preview"),s=this.panelStuff.querySelector(".input-elm-bgimageadjust"),l=this.panelStuff.querySelector(".input-elm-bgremove");s.style.display="none",l.style.display="none",""!==t?(i.innerHTML=`<img src="${t}">`,s.style.display="flex",l.style.display="flex"):i.innerHTML="",n.refresh(),this.builder.opts.onChange()}));const b=o.querySelector(".chk-elm-grayscale");b.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t=this.builder.inspectedElement;b.checked?t.style.filter="grayscale(1)":t.style.filter&&(t.style.filter=t.style.filter.replace("grayscale(1)","")),n.refresh(),this.builder.opts.onChange()})),o.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>{const e=this.builder.inspectedElement;o.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.add("on"),this.realtimeVisibility(e)}))}));let p=o.querySelector(".input-visible"),g=o.querySelector(".input-hidden");p.addEventListener("click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=o.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.remove("xs-hidden"):"sm"===i?t.classList.remove("sm-hidden"):"md"===i?t.classList.remove("md-hidden"):""===i&&t.classList.remove("desktop-hidden"),p.classList.add("on"),g.classList.remove("on"),this.builder.opts.onChange()})),g.addEventListener("click",(()=>{const t=this.builder.inspectedElement;this.builder.uo.saveForUndo(),t.classList.remove("hideonmobile");let e=o.querySelector(".div-target"),i=this.builder.responsive.readTarget(e);"xs"===i?t.classList.add("xs-hidden"):"sm"===i?t.classList.add("sm-hidden"):"md"===i?t.classList.add("md-hidden"):""===i&&t.classList.add("desktop-hidden"),p.classList.remove("on"),g.classList.add("on"),this.builder.opts.onChange()}));const m=o.querySelectorAll(".cb-seg > button"),f=o.querySelectorAll(".cb-cs-fill");this._showElmFill=t=>{m.forEach((e=>e.classList.toggle("on",e.getAttribute("data-fill")===t))),f.forEach((e=>{e.style.display=e.getAttribute("data-fill")===t?"":"none"}))},m.forEach((t=>{t.addEventListener("click",(()=>this._showElmFill(t.getAttribute("data-fill"))))}));const y=o.querySelector("#chkElmVisible");this._syncElmVisSwitch=()=>{y&&p&&(y.checked=p.classList.contains("on"))},y&&y.addEventListener("change",(()=>{y.checked?p.click():g.click()})),o.querySelectorAll(".input-device").forEach((t=>{t.addEventListener("click",(()=>setTimeout(this._syncElmVisSwitch,0)))}))}readElementStyles(t){let e=this.panelStuff,i=t.style.backgroundColor,n=e.querySelector(".input-elm-bgcolor");i?this.builder.util.paintColorButton(n,i):this.builder.util.paintColorButton(n,"");let o=e.querySelector(".input-elm-gradient");if(o.style.backgroundImage="",t.style.backgroundImage&&t.style.backgroundImage.includes("linear")){let e=t.style.backgroundImage;o.style.backgroundImage=e}let s="";const l=e.querySelector(".elm-bgimage-preview"),a=e.querySelector(".input-elm-bgimageadjust");a.style.display="none";const r=e.querySelector(".input-elm-bgremove");r.style.display="none",t.style.backgroundImage&&-1!==t.style.backgroundImage.indexOf("url(")?(s=t.style.backgroundImage.slice(4,-1).replace(/["']/g,""),l.innerHTML=`<img src="${s}">`,a.style.display="flex",r.style.display="flex"):l.innerHTML="";const c=e.querySelector(".chk-elm-grayscale");c.checked=!1,t.style.filter&&-1!==t.style.filter.indexOf("grayscale")&&(c.checked=!0);let u="color";const d=t.style.backgroundImage;d&&-1!==d.indexOf("url(")?u="image":d&&d.includes("linear")&&(u="gradient"),this._showElmFill&&this._showElmFill(u),this.realtimeVisibility(t,!0),this._syncElmVisSwitch&&this._syncElmVisSwitch()}realtimeVisibility(t,e){if(e){const t=this.builder.builderStuff.querySelector(".is-modal.content-preview.active");if(t){this.panelStuff.querySelectorAll(".input-device").forEach((t=>{t.classList.remove("on")})),t.classList.contains("is-screen-1920")||t.classList.contains("is-screen-1440")?this.panelStuff.querySelector('.input-device[data-value=""]').classList.add("on"):t.classList.contains("is-screen-1024")?this.panelStuff.querySelector('.input-device[data-value="md"]').classList.add("on"):t.classList.contains("is-screen-768")?this.panelStuff.querySelector('.input-device[data-value="sm"]').classList.add("on"):t.classList.contains("is-screen-375")&&this.panelStuff.querySelector('.input-device[data-value="xs"]').classList.add("on")}}let i=this.panelStuff.querySelector(".div-target"),n=this.panelStuff.querySelector(".div-visibility"),o=this.builder.responsive.readTarget(i),s=this.builder.responsive.getVisibility(t,o);this.builder.responsive.showVisibility(n,s),"xs"===o?e||this.builder.livePreview.resizePreview(375):"sm"===o?e||this.builder.livePreview.resizePreview(768):"md"===o?e||this.builder.livePreview.resizePreview(1024):e||this.builder.livePreview.resizePreview(1920)}}const au=new ze;class ru{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);let o=i.querySelector("#divElementBox");this.panelStuff=o;const s='\n <option value="px">px</option>\n <option value="em">em</option>\n <option value="vw">vw</option>\n <option value="vh">vh</option>\n <option value="%">%</option>',l=`\n <div class="cb-elmbox">\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Size")}</span>\n\n <div class="cb-eb-sizefield">\n <span class="cb-field-label">${e.out("Width")}</span>\n <div class="cb-seg" data-for="width" role="group" aria-label="${e.out("Width")}">\n <button type="button" class="on" data-mode="auto">${e.out("Auto")}</button>\n <button type="button" data-mode="full">${e.out("Full")}</button>\n <button type="button" data-mode="fixed">${e.out("Fixed")}</button>\n </div>\n <div class="cb-eb-reveal cb-eb-width-fixed" style="display:none">\n <div class="cb-dim">\n <input type="text" id="inpElmWidth" value="" placeholder="${e.out("value")}"/>\n <span class="cb-dim-sep"></span>\n <select id="inpElmWidthUnit">${s}</select>\n </div>\n </div>\n </div>\n\n <div class="cb-eb-sizefield" style="margin-top:12px">\n <span class="cb-field-label">${e.out("Height")}</span>\n <div class="cb-seg" data-for="height" role="group" aria-label="${e.out("Height")}">\n <button type="button" class="on" data-mode="auto">${e.out("Auto")}</button>\n <button type="button" data-mode="screen">${e.out("Screen")}</button>\n <button type="button" data-mode="fixed">${e.out("Fixed")}</button>\n </div>\n <div class="cb-eb-reveal cb-eb-height-fixed" style="display:none">\n <div class="cb-dim">\n <input type="text" id="inpElmHeight" value="" placeholder="${e.out("value")}"/>\n <span class="cb-dim-sep"></span>\n <select id="inpElmHeightUnit">${s}</select>\n </div>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Constraints")}</span>\n <div class="cb-eb-grid2">\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Min Width")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMinWidth" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMinWidthUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Max Width")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMaxWidth" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMaxWidthUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Min Height")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMinHeight" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMinHeightUnit">${s}</select></div></label>\n <label class="cb-eb-fld"><span class="cb-field-label">${e.out("Max Height")}</span>\n <div class="cb-dim"><input type="text" id="inpElmMaxHeight" value="" placeholder="—"/><span class="cb-dim-sep"></span><select id="inpElmMaxHeightUnit">${s}</select></div></label>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-grouplabel">${e.out("Overflow")}</span>\n <div class="cb-eb-fld">\n <span class="cb-field-label">${e.out("Horizontal")}</span>\n <div class="cb-seg" data-for="overflowx" role="group" aria-label="${e.out("Overflow x")}">\n <button type="button" class="on" data-val="">${e.out("Default")}</button>\n <button type="button" data-val="auto">${e.out("Auto")}</button>\n <button type="button" data-val="hidden">${e.out("Hidden")}</button>\n </div>\n </div>\n <div class="cb-eb-fld" style="margin-top:10px">\n <span class="cb-field-label">${e.out("Vertical")}</span>\n <div class="cb-seg" data-for="overflowy" role="group" aria-label="${e.out("Overflow y")}">\n <button type="button" class="on" data-val="">${e.out("Default")}</button>\n <button type="button" data-val="auto">${e.out("Auto")}</button>\n <button type="button" data-val="hidden">${e.out("Hidden")}</button>\n </div>\n </div>\n </div>\n\n </div>\n `;au.appendHtml(o,l);let a=o.querySelector("#inpElmMaxWidth");a.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),a.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxWidth").value,i=o.querySelector("#inpElmMaxWidthUnit").value;isNaN(e)||""===e?t.style.maxWidth="":t.style.maxWidth=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMaxWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxWidth").value,i=o.querySelector("#inpElmMaxWidthUnit").value;isNaN(e)||""===e?t.style.maxWidth="":t.style.maxWidth=e+i,n.refresh(),this.builder.opts.onChange()}));let r=o.querySelector("#inpElmMaxHeight");r.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),r.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxHeight").value,i=o.querySelector("#inpElmMaxHeightUnit").value;isNaN(e)||""===e?t.style.maxHeight="":t.style.maxHeight=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMaxHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMaxHeight").value,i=o.querySelector("#inpElmMaxHeightUnit").value;isNaN(e)||""===e?t.style.maxHeight="":t.style.maxHeight=e+i,n.refresh(),this.builder.opts.onChange()}));let c=o.querySelector("#inpElmMinWidth");c.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),c.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinWidth").value,i=o.querySelector("#inpElmMinWidthUnit").value;isNaN(e)||""===e?t.style.minWidth="":t.style.minWidth=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMinWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinWidth").value,i=o.querySelector("#inpElmMinWidthUnit").value;isNaN(e)||""===e?t.style.minWidth="":t.style.minWidth=e+i,n.refresh(),this.builder.opts.onChange()}));let u=o.querySelector("#inpElmMinHeight");u.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),u.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinHeight").value,i=o.querySelector("#inpElmMinHeightUnit").value;isNaN(e)||""===e?t.style.minHeight="":t.style.minHeight=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmMinHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmMinHeight").value,i=o.querySelector("#inpElmMinHeightUnit").value;isNaN(e)||""===e?t.style.minHeight="":t.style.minHeight=e+i,n.refresh(),this.builder.opts.onChange()}));let d=o.querySelector("#inpElmWidth");d.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),d.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmWidth").value,i=o.querySelector("#inpElmWidthUnit").value;isNaN(e)||""===e?t.style.width="":t.style.width=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmWidthUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmWidth").value,i=o.querySelector("#inpElmWidthUnit").value;isNaN(e)||""===e?t.style.width="":t.style.width=e+i,n.refresh(),this.builder.opts.onChange()}));let h=o.querySelector("#inpElmHeight");h.addEventListener("click",(()=>{this.builder.uo.saveForUndo()})),h.addEventListener("keyup",(()=>{let t=this.builder.inspectedElement,e=o.querySelector("#inpElmHeight").value,i=o.querySelector("#inpElmHeightUnit").value;isNaN(e)||""===e?t.style.height="":t.style.height=e+i,n.refresh(),this.builder.opts.onChange()})),o.querySelector("#inpElmHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=o.querySelector("#inpElmHeight").value,i=o.querySelector("#inpElmHeightUnit").value;isNaN(e)||""===e?t.style.height="":t.style.height=e+i,n.refresh(),this.builder.opts.onChange()}));const b=(t,e,i)=>{const s=o.querySelector(`.cb-seg[data-for="${t}"]`),l=o.querySelector(`.cb-eb-${t}-fixed`),a=o.querySelector("width"===t?"#inpElmWidth":"#inpElmHeight"),r=o.querySelector("width"===t?"#inpElmWidthUnit":"#inpElmHeightUnit"),c=t;if(s.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-mode")===e))),l.style.display="fixed"===e?"":"none",!i)return;this.builder.uo.saveForUndo();const u=this.builder.inspectedElement;if("auto"===e)u.style[c]="",a.value="";else if("full"===e)u.style[c]="100%",a.value="100",r.value="%";else if("screen"===e)u.style[c]="100vh",a.value="100",r.value="vh";else if("fixed"===e){const t=a.value;isNaN(t)||""===t||(u.style[c]=t+r.value),setTimeout((()=>a.focus()),0)}n.refresh(),this.builder.opts.onChange()};this._setSizeMode=b,["width","height"].forEach((t=>{o.querySelectorAll(`.cb-seg[data-for="${t}"] button`).forEach((e=>{e.addEventListener("click",(()=>b(t,e.getAttribute("data-mode"),!0)))}))}));const p=(t,e,i)=>{if(o.querySelector(`.cb-seg[data-for="overflow${t}"]`).querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===e))),!i)return;this.builder.uo.saveForUndo();const s=this.builder.inspectedElement;"x"===t?s.style.overflowX=e:s.style.overflowY=e,n.refresh(),this.builder.opts.onChange()};this._setOverflow=p,["x","y"].forEach((t=>{o.querySelectorAll(`.cb-seg[data-for="overflow${t}"] button`).forEach((e=>{e.addEventListener("click",(()=>p(t,e.getAttribute("data-val"),!0)))}))}))}readElementStyles(t){let e=this.panelStuff;const i=e.querySelector("#inpElmMaxWidth"),n=e.querySelector("#inpElmMaxWidthUnit");i.value="",n.value="px";let o=t.style.maxWidth,s=parseInt(o);isNaN(s)||(-1!==o.indexOf("%")&&(n.value="%"),-1!==o.indexOf("px")&&(n.value="px"),-1!==o.indexOf("vw")&&(n.value="vw"),-1!==o.indexOf("vh")&&(n.value="vh"),-1!==o.indexOf("em")&&(n.value="em"),i.value=s);const l=e.querySelector("#inpElmMaxHeight"),a=e.querySelector("#inpElmMaxHeightUnit");l.value="",a.value="px",o=t.style.maxHeight;let r=parseInt(o);isNaN(r)||(-1!==o.indexOf("%")&&(a.value="%"),-1!==o.indexOf("px")&&(a.value="px"),-1!==o.indexOf("vw")&&(a.value="vw"),-1!==o.indexOf("vh")&&(a.value="vh"),-1!==o.indexOf("em")&&(a.value="em"),l.value=r);const c=e.querySelector("#inpElmMinWidth"),u=e.querySelector("#inpElmMinWidthUnit");c.value="",u.value="px",o=t.style.minWidth;let d=parseInt(o);isNaN(d)||(-1!==o.indexOf("%")&&(u.value="%"),-1!==o.indexOf("px")&&(u.value="px"),-1!==o.indexOf("vw")&&(u.value="vw"),-1!==o.indexOf("vh")&&(u.value="vh"),-1!==o.indexOf("em")&&(u.value="em"),c.value=d);const h=e.querySelector("#inpElmMinHeight"),b=e.querySelector("#inpElmMinHeightUnit");h.value="",b.value="px",o=t.style.minHeight;let p=parseInt(o);isNaN(p)||(-1!==o.indexOf("%")&&(b.value="%"),-1!==o.indexOf("px")&&(b.value="px"),-1!==o.indexOf("vw")&&(b.value="vw"),-1!==o.indexOf("vh")&&(b.value="vh"),-1!==o.indexOf("em")&&(b.value="em"),h.value=p);const g=e.querySelector("#inpElmWidth"),m=e.querySelector("#inpElmWidthUnit");g.value="",m.value="px",o=t.style.width;let f=parseInt(o);isNaN(f)||(-1!==o.indexOf("%")&&(m.value="%"),-1!==o.indexOf("px")&&(m.value="px"),-1!==o.indexOf("vw")&&(m.value="vw"),-1!==o.indexOf("vh")&&(m.value="vh"),-1!==o.indexOf("em")&&(m.value="em"),g.value=f);const y=e.querySelector("#inpElmHeight"),v=e.querySelector("#inpElmHeightUnit");y.value="",v.value="px",o=t.style.height;let w=parseInt(o);isNaN(w)||(-1!==o.indexOf("%")&&(v.value="%"),-1!==o.indexOf("px")&&(v.value="px"),-1!==o.indexOf("vw")&&(v.value="vw"),-1!==o.indexOf("vh")&&(v.value="vh"),-1!==o.indexOf("em")&&(v.value="em"),y.value=w);const x=t.style.width;this._setSizeMode&&this._setSizeMode("width",""===x||"auto"===x?"auto":"100%"===x?"full":"fixed",!1);const k=t.style.height;this._setSizeMode&&this._setSizeMode("height",""===k||"auto"===k?"auto":"100vh"===k?"screen":"fixed",!1),this._setOverflow&&(this._setOverflow("x",t.style.overflowX||"",!1),this._setOverflow("y",t.style.overflowY||"",!1))}}const cu=new ze,uu=["top","left","right","bottom"],du=t=>t.charAt(0).toUpperCase()+t.slice(1),hu=["%","vw","vh","em","px"];class bu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i,this.elementStyleEditor=new ou(t);let n=i.querySelector("#divElementSpacing");this.panelStuff=n,this.units={padding:"px",margin:"px"},this.linked={padding:!1,margin:!1},this.scrub=null;const o=`\n <div class="cb-elmspacing">\n ${this.crossHtml("padding",e.out("Padding"),["px","em","%"])}\n ${this.crossHtml("margin",e.out("Margin"),["px","em","%","auto"])}\n <p class="cb-sp-note">${e.out("Drag a field up or down, or type a value.")}</p>\n </div>\n `;cu.appendHtml(n,o),["padding","margin"].forEach((t=>this.wireCross(t)))}crossHtml(t,e,i){const n="padding"===t?"inpElmPadding":"inpElmMargin",o=i.map(((t,e)=>`<button type="button" data-unit="${t}"${0===e?' class="on"':""}>${t}</button>`)).join("");return`\n <div class="cb-field">\n <span class="cb-grouplabel">${e}</span>\n <div class="cb-sp-pad" data-prop="${t}">\n ${uu.map((t=>`\n <div class="cb-sp-field" data-side="${t}">\n <input type="text" class="cb-sp-value" id="${n}${du(t)}" data-side="${t}" inputmode="numeric" autocomplete="off" spellcheck="false" title="${this.util.out(du(t))}" aria-label="${this.util.out(du(t))}">\n </div>`)).join("")}\n <div class="cb-sp-box">\n <button class="cb-sp-link" type="button" aria-pressed="false" title="${this.util.out("Apply to all sides")}"><svg class="is-icon-flex"><use xlink:href="#icon-link3"></use></svg></button>\n <span class="cb-sp-caption"></span>\n </div>\n </div>\n <div class="cb-seg is-inline cb-sp-unit" data-prop="${t}" role="group" aria-label="${e} ${this.util.out("unit")}">${o}</div>\n </div>`}wireCross(t){const e=this.panelStuff,i=e.querySelector(`.cb-sp-pad[data-prop="${t}"]`);uu.forEach((e=>{const n=i.querySelector(`.cb-sp-value[data-side="${e}"]`);this.bindField(t,e,n)}));const n=i.querySelector(".cb-sp-link");n.addEventListener("click",(()=>{this.linked[t]=!this.linked[t],n.classList.toggle("active",this.linked[t]),n.setAttribute("aria-pressed",this.linked[t]?"true":"false"),i.classList.toggle("linked",this.linked[t])}));e.querySelector(`.cb-sp-unit[data-prop="${t}"]`).querySelectorAll("button").forEach((e=>{e.addEventListener("click",(()=>this.setUnit(t,e.getAttribute("data-unit"),!0)))}))}bindField(t,e,i){const n=this.panelStuff.ownerDocument;i.addEventListener("click",(()=>this.builder.uo.saveForUndo())),i.addEventListener("keyup",(n=>{"ArrowUp"!==n.key&&"ArrowDown"!==n.key&&"auto"!==this.units[t]&&this.applyValue(t,e,i.value,{undo:!1})})),i.addEventListener("change",(()=>{"auto"!==this.units[t]&&this.applyValue(t,e,i.value,{undo:!1})})),i.addEventListener("keydown",(n=>{if("auto"!==this.units[t]&&("ArrowUp"===n.key||"ArrowDown"===n.key)){n.preventDefault();const o=parseFloat(i.value)||0;i.value=String(Math.max(0,o+("ArrowUp"===n.key?1:-1))),this.applyValue(t,e,i.value,{undo:!0})}})),i.addEventListener("pointerdown",(o=>{0===o.button&&this.builder.inspectedElement&&"auto"!==this.units[t]&&(n.activeElement!==i&&o.preventDefault(),this.scrub={prop:t,side:e,input:i,x:o.clientX,y:o.clientY,start:parseFloat(i.value)||0,moved:!1,undo:!0},i.setPointerCapture(o.pointerId))})),i.addEventListener("pointermove",(n=>{const o=this.scrub;if(!o||o.input!==i)return;const s=n.clientX-o.x,l=o.y-n.clientY;if(!o.moved){if(Math.abs(s)<3&&Math.abs(l)<3)return;o.moved=!0,this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`).classList.add("scrubbing")}const a=Math.abs(l)>=Math.abs(s)?l:s;i.value=String(Math.max(0,Math.round(o.start+a/2))),this.applyValue(t,e,i.value,{undo:o.undo,notify:!1}),o.undo=!1}));const o=e=>{const n=this.scrub;n&&n.input===i&&(this.scrub=null,this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`).classList.remove("scrubbing"),i.hasPointerCapture(e.pointerId)&&i.releasePointerCapture(e.pointerId),n.moved?n.undo||this.builder.opts.onChange():(i.focus(),i.select()))};i.addEventListener("pointerup",o),i.addEventListener("pointercancel",o)}applyValue(t,e,i,{undo:n=!0,notify:o=!0}={}){const s=this.builder.inspectedElement;if(!s)return;n&&this.builder.uo.saveForUndo();const l=this.units[t],a=String(i).trim(),r=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`);(this.linked[t]?uu:[e]).forEach((i=>{const n=t+du(i);"auto"===a?s.style[n]="auto":""===a||isNaN(a)?s.style[n]="":s.style[n]=a+l,this.linked[t]&&i!==e&&(r.querySelector(`.cb-sp-value[data-side="${i}"]`).value=a)})),this.elementStyleEditor.refresh(),o&&this.builder.opts.onChange()}setUnit(t,e,i){this.units[t]=e;this.panelStuff.querySelector(`.cb-sp-unit[data-prop="${t}"]`).querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-unit")===e)));const n=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${t}"]`);if(n.classList.toggle("is-auto","auto"===e),!i)return;this.builder.uo.saveForUndo();const o=this.builder.inspectedElement;o&&(uu.forEach((i=>{const s=n.querySelector(`.cb-sp-value[data-side="${i}"]`),l=t+du(i);if("auto"===e)o.style[l]="auto",s.value="auto";else{const t=s.value.trim();""===t||"auto"===t||isNaN(t)?(o.style[l]="",s.value=""):o.style[l]=t+e}})),this.elementStyleEditor.refresh(),this.builder.opts.onChange())}detectUnit(t){for(let e=0;e<hu.length;e++)if(-1!==t.indexOf(hu[e]))return hu[e];return"px"}readElementStyles(t){const e=(t.tagName||"element").toLowerCase();["padding","margin"].forEach((i=>{const n=this.panelStuff.querySelector(`.cb-sp-pad[data-prop="${i}"]`);n.querySelector(".cb-sp-caption").textContent=e;const o={};let s=null,l=0,a=0;uu.forEach((e=>{const n=t.style[i+du(e)];if(n&&-1!==n.indexOf("auto"))o[e]={auto:!0},l++,a++;else{const t=parseFloat(n);if(isNaN(t))o[e]={};else{const i=this.detectUnit(n);o[e]={num:t,unit:i},s||(s=i),a++}}}));const r="margin"===i&&a>0&&l===uu.length?"auto":s||"px";this.setUnit(i,r,!1),uu.forEach((t=>{const e=n.querySelector(`.cb-sp-value[data-side="${t}"]`),i=o[t];e.placeholder="0","auto"===r||i.auto?e.value="auto":e.value=void 0!==i.num?String(i.num):""}))}))}}const pu=new ze,gu={all:{w:"borderWidth",s:"borderStyle",c:"borderColor"},top:{w:"borderTopWidth",s:"borderTopStyle",c:"borderTopColor"},right:{w:"borderRightWidth",s:"borderRightStyle",c:"borderRightColor"},bottom:{w:"borderBottomWidth",s:"borderBottomStyle",c:"borderBottomColor"},left:{w:"borderLeftWidth",s:"borderLeftStyle",c:"borderLeftColor"}},mu=["Top","Right","Bottom","Left"],fu=["px","em","vw","vh"];class yu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementBorder"),this.target="all",this.nowLabels={all:e.out("All sides"),top:e.out("Top"),right:e.out("Right"),bottom:e.out("Bottom"),left:e.out("Left")};const i=fu.map((t=>`<option value="${t}">${t}</option>`)).join(""),n=`\n <div class="cb-elmborder">\n\n <div class="cb-field">\n <div class="cb-bd-head">\n <span class="cb-grouplabel">${e.out("Sides")}</span>\n <span class="cb-bd-now"></span>\n </div>\n <div class="cb-bd-sbox">\n <div class="cb-bd-rect" data-sel="all">\n <span class="cb-bd-ez t" data-edge="top" title="${e.out("Border Top")}"></span>\n <span class="cb-bd-ez r" data-edge="right" title="${e.out("Border Right")}"></span>\n <span class="cb-bd-ez b" data-edge="bottom" title="${e.out("Border Bottom")}"></span>\n <span class="cb-bd-ez l" data-edge="left" title="${e.out("Border Left")}"></span>\n <button type="button" class="cb-bd-all on" data-all>${e.out("All")}</button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-field-label">${e.out("Style")}</span><span class="cb-readout" data-readout="style"></span></div>\n <div class="cb-seg" data-style role="group" aria-label="${e.out("Border Style")}">\n <button type="button" data-val="" title="${e.out("None")}"><span class="cb-bd-none">${e.out("None")}</span></button>\n <button type="button" data-val="solid" title="${e.out("Solid")}"><span class="cb-bd-line"></span></button>\n <button type="button" data-val="dashed" title="${e.out("Dashed")}"><span class="cb-bd-line is-dashed"></span></button>\n <button type="button" data-val="dotted" title="${e.out("Dotted")}"><span class="cb-bd-line is-dotted"></span></button>\n </div>\n </div>\n\n <div class="cb-field cb-bd-wc" data-wc>\n <div class="cb-bd-wcgrid">\n <div class="cb-bd-fld">\n <span class="cb-field-label">${e.out("Width")}</span>\n <div class="cb-dim">\n <input type="text" class="cb-bd-width" value="" placeholder="0">\n <span class="cb-dim-sep"></span>\n <select class="cb-bd-unit">${i}</select>\n </div>\n </div>\n <div class="cb-bd-fld">\n <span class="cb-field-label">${e.out("Color")}</span>\n <button title="${e.out("Border Color")}" class="cb-bd-color cb-colorbtn"><span></span></button>\n </div>\n </div>\n </div>\n\n </div>\n `;pu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.rect=t.querySelector(".cb-bd-rect"),this.nowLabel=t.querySelector(".cb-bd-now"),this.styleSeg=t.querySelector("[data-style]"),this._styleReadout=this.util.bindReadout(this.styleSeg,t.querySelector('[data-readout="style"]')),this.widthInput=t.querySelector(".cb-bd-width"),this.unitSel=t.querySelector(".cb-bd-unit"),this.colorBtn=t.querySelector(".cb-bd-color"),this.wcWrap=t.querySelector("[data-wc]"),this.allBtn=t.querySelector("[data-all]"),this.allBtn.addEventListener("click",(()=>this.selectTarget("all"))),t.querySelectorAll(".cb-bd-ez").forEach((t=>t.addEventListener("click",(()=>this.selectTarget(t.getAttribute("data-edge")))))),this.styleSeg.querySelectorAll("button").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-val");""!==e&&""===this.widthInput.value.trim()&&(this.widthInput.value="1"),this.setStyleActive(e),this.applyBorder()}))})),this.widthInput.addEventListener("click",(()=>this.builder.uo.saveForUndo())),this.widthInput.addEventListener("keyup",(()=>this.applyBorder())),this.widthInput.addEventListener("change",(()=>this.applyBorder())),this.unitSel.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.applyBorder()})),this.colorBtn.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const t=this.colorBtn.querySelector("span"),e=t.style.background||t.style.backgroundColor;this.builder.colorPicker.open((t=>{this.elm().style[gu[this.target].c]=t,this.util.paintColorButton(this.colorBtn,t),this.done()}),e,(()=>{this.colorBtn.removeAttribute("data-focus"),this.colorBtn.focus()}),this.colorBtn),this.colorBtn.setAttribute("data-focus",!0)}))}currentStyle(){const t=this.styleSeg.querySelector("button.on");return t?t.getAttribute("data-val"):""}setStyleActive(t){this.styleSeg.querySelectorAll("button").forEach((e=>e.classList.toggle("on",e.getAttribute("data-val")===t))),this._styleReadout&&this._styleReadout(),this.wcWrap.classList.toggle("is-off",""===t),this.wcWrap.inert=""===t}selectTarget(t){this.target=t,this.rect.dataset.sel=t,this.allBtn.classList.toggle("on","all"===t),this.nowLabel.textContent=this.nowLabels[t]||"",this.readTarget()}applyBorder(){const t=this.elm();if(!t)return;const e=gu[this.target],i=this.currentStyle();if(""===i)"all"===this.target&&(mu.forEach((e=>{t.style["border"+e+"Width"]="",t.style["border"+e+"Style"]="",t.style["border"+e+"Color"]=""})),t.style.border=""),t.style[e.w]="",t.style[e.s]="",t.style[e.c]="";else{t.style[e.s]=i;const n=this.widthInput.value.trim();t.style[e.w]=""===n||isNaN(n)?"":n+(this.unitSel.value||"px")}this.done()}readTarget(){const t=this.elm(),e=gu[this.target],i=t&&t.style[e.w]||"",n=t&&t.style[e.s]||"",o=t&&t.style[e.c]||"";let s="";-1!==n.indexOf("solid")?s="solid":-1!==n.indexOf("dashed")?s="dashed":-1!==n.indexOf("dotted")&&(s="dotted"),this.setStyleActive(s);const l=parseFloat(i);this.widthInput.value=isNaN(l)?"":l;let a="px";fu.forEach((t=>{-1!==i.indexOf(t)&&(a=t)})),this.unitSel.value=a,this.util.paintColorButton(this.colorBtn,o)}readElementStyles(){this.selectTarget("all")}}const vu=new ze,wu=t=>"700"===t||"bold"===t||parseInt(t,10)>=600;class xu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;const n=new ou(t);this.elementStyleEditor=n;let o=i.querySelector("#divElementText");this.panelStuff=o;const s=["px","em","pt","%","vw","vh","vmin","vmax"].map((t=>`<option value="${t}">${t}</option>`)).join(""),l=[["",e.out("Default")],["100","Thin 100"],["200","Extra Light 200"],["300","Light 300"],["400","Regular 400"],["500","Medium 500"],["600","Semibold 600"],["700","Bold 700"],["800","Extrabold 800"],["900","Black 900"]].map((([t,e])=>`<option value="${t}">${e}</option>`)).join(""),a=`\n <div class="cb-elmtext">\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Color")}</span>\n <button title="${e.out("Text Color")}" class="input-elm-color cb-colorbtn"><span></span></button>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Font Size")}</span>\n <div class="cb-dim">\n <input type="text" id="inpElmFontSize" value="" placeholder="—">\n <span class="cb-dim-sep"></span>\n <select id="inpElmFontSizeUnit">${s}</select>\n </div>\n </div>\n </div>\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Font Weight")}</span>\n <div class="cb-tx-sel"><select id="inpElmFontWeight">${l}</select></div>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Line Height")}</span>\n <div class="cb-dim">\n <input type="text" id="inpElmLineHeight" value="" placeholder="—">\n <span class="cb-dim-sep"></span>\n <select id="inpElmLineHeightUnit"><option value="">—</option><option value="px">px</option><option value="pt">pt</option></select>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-grouplabel">${e.out("Alignment")}</span><span class="cb-readout" data-readout="align"></span></div>\n <div class="cb-seg" data-for="align" role="group" aria-label="${e.out("Text Align")}">\n <button type="button" data-val="left" title="${e.out("Left")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-left"></use></svg></button>\n <button type="button" data-val="center" title="${e.out("Center")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-center"></use></svg></button>\n <button type="button" data-val="right" title="${e.out("Right")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-right"></use></svg></button>\n <button type="button" data-val="justify" title="${e.out("Full")}"><svg class="is-icon-flex"><use xlink:href="#icon-align-full"></use></svg></button>\n </div>\n </div>\n\n <div class="cb-field">\n <div class="cb-fhead"><span class="cb-grouplabel">${e.out("Style")}</span><span class="cb-readout" data-readout="txstyle"></span></div>\n <div class="cb-tx-toggles">\n <button type="button" class="cb-tx-tg cb-tx-b" data-bold title="${e.out("Bold")}">B</button>\n <button type="button" class="cb-tx-tg cb-tx-i" data-italic title="${e.out("Italic")}">I</button>\n <button type="button" class="cb-tx-tg cb-tx-u" data-deco="underline" title="${e.out("Underline")}">U</button>\n <button type="button" class="cb-tx-tg cb-tx-s" data-deco="line-through" title="${e.out("Line Through")}">S</button>\n <span class="cb-tx-divider"></span>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="uppercase" title="${e.out("Uppercase")}">AB</button>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="lowercase" title="${e.out("Lowercase")}">ab</button>\n <button type="button" class="cb-tx-tg cb-tx-case" data-case="capitalize" title="${e.out("Capitalize")}">Ab</button>\n </div>\n </div>\n\n <div class="cb-field cb-tx-row2">\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Letter Spacing")}</span>\n <div class="cb-dim"><input type="text" id="inpElmLetterSpacing" value="" placeholder="0"><span class="cb-dim-sep"></span><span class="cb-dim-u">px</span></div>\n </div>\n <div class="cb-tx-fld">\n <span class="cb-field-label">${e.out("Word Spacing")}</span>\n <div class="cb-dim"><input type="text" id="inpElmWordSpacing" value="" placeholder="0"><span class="cb-dim-sep"></span><span class="cb-dim-u">px</span></div>\n </div>\n </div>\n\n </div>\n `;vu.appendHtml(o,a),this.bindColor(),this.bindAlign(),this.bindWeight(),this.bindStyleToggles(),this.bindDimInputs()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}bindColor(){const t=this.panelStuff.querySelector(".input-elm-color");t.addEventListener("click",(()=>{this.builder.uo.saveForUndo(!0);const e=t.querySelector("span").style.background||t.querySelector("span").style.backgroundColor;this.builder.colorPicker.open((e=>{this.elm().style.color=e,this.util.paintColorButton(t,e),this.done()}),e,(()=>{t.removeAttribute("data-focus"),t.focus()}),t),t.setAttribute("data-focus",!0)}))}bindAlign(){const t=this.panelStuff.querySelector('.cb-seg[data-for="align"]'),e=this.util.bindReadout(t,this.panelStuff.querySelector('[data-readout="align"]'));this._setAlign=(i,n)=>{t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===i))),e(),n&&(this.builder.uo.saveForUndo(),this.elm().style.textAlign=i,this.done())},t.querySelectorAll("button").forEach((t=>{t.addEventListener("click",(()=>{const e=t.getAttribute("data-val");this._setAlign(t.classList.contains("on")?"":e,!0)}))}))}bindWeight(){const t=this.panelStuff.querySelector("#inpElmFontWeight"),e=this.panelStuff.querySelector("[data-bold]");this._setWeight=(i,n)=>{t.value=i,e.classList.toggle("on",wu(i)),this._styleReadout&&this._styleReadout(),n&&(this.builder.uo.saveForUndo(),this.elm().style.fontWeight=i,this.done())},t.addEventListener("change",(()=>this._setWeight(t.value,!0))),e.addEventListener("click",(()=>this._setWeight(wu(t.value)?"":"700",!0)))}bindStyleToggles(){const t=this.panelStuff;this._styleReadout=this.util.bindReadout(t.querySelector(".cb-tx-toggles"),t.querySelector('[data-readout="txstyle"]'));const e=t.querySelector("[data-italic]");e.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const t="italic"===this.elm().style.fontStyle;this.elm().style.fontStyle=t?"":"italic",e.classList.toggle("on",!t),this._styleReadout(),this.done()})),t.querySelectorAll("[data-deco]").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-deco"),i=-1!==(this.elm().style.textDecoration||this.elm().style.textDecorationLine||"").indexOf(e)?"":e;this.elm().style.textDecoration=i,this._syncDeco(i),this.done()}))})),t.querySelectorAll("[data-case]").forEach((t=>{t.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const e=t.getAttribute("data-case"),i=this.elm().style.textTransform===e?"":e;this.elm().style.textTransform=i,this._syncCase(i),this.done()}))}))}_syncDeco(t){this.panelStuff.querySelectorAll("[data-deco]").forEach((e=>e.classList.toggle("on",e.getAttribute("data-deco")===t&&""!==t))),this._styleReadout&&this._styleReadout()}_syncCase(t){this.panelStuff.querySelectorAll("[data-case]").forEach((e=>e.classList.toggle("on",e.getAttribute("data-case")===t&&""!==t))),this._styleReadout&&this._styleReadout()}bindDimInputs(){const t=this.panelStuff,e=(e,i)=>{const n=t.querySelector("#"+e);n.addEventListener("click",(()=>this.builder.uo.saveForUndo())),n.addEventListener("keyup",i),n.addEventListener("change",i)},i=()=>{const e=this.elm(),i=t.querySelector("#inpElmFontSize").value,n=t.querySelector("#inpElmFontSizeUnit");if(""===i)return e.style.fontSize="",void this.done();if(isNaN(i))e.style.fontSize="";else{e.style.fontSize=i+(n.value||"px");(this.builder.opts.fontSizeClassValues||[]).forEach((t=>vu.removeClass(e,"size-"+t)))}this.done()};e("inpElmFontSize",i),t.querySelector("#inpElmFontSizeUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo(),i()}));const n=()=>{const e=this.elm(),i=t.querySelector("#inpElmLineHeight").value,n=t.querySelector("#inpElmLineHeightUnit").value;e.style.lineHeight=isNaN(i)||""===i?"":i+n,this.done()};e("inpElmLineHeight",n),t.querySelector("#inpElmLineHeightUnit").addEventListener("change",(()=>{this.builder.uo.saveForUndo(),n()})),e("inpElmLetterSpacing",(()=>{const e=this.elm(),i=t.querySelector("#inpElmLetterSpacing").value;e.style.letterSpacing=isNaN(i)||""===i?"":i+"px",this.done()})),e("inpElmWordSpacing",(()=>{const e=this.elm(),i=t.querySelector("#inpElmWordSpacing").value;e.style.wordSpacing=isNaN(i)||""===i?"":i+"px",this.done()}))}readElementStyles(t){const e=this.panelStuff;this.util.paintColorButton(e.querySelector(".input-elm-color"),t.style.color||""),this._setAlign&&this._setAlign(t.style.textAlign||"",!1);const i=parseFloat(t.style.fontSize);e.querySelector("#inpElmFontSize").value=isNaN(i)?"":i;const n=t.style.fontSize||"";let o="px";["%","vmin","vmax","vw","vh","em","pt","px"].forEach((t=>{-1!==n.indexOf(t)&&(o=t)})),e.querySelector("#inpElmFontSizeUnit").value=o;let s=t.style.fontWeight||"";"normal"===s?s="400":"bold"===s&&(s="700"),this._setWeight&&this._setWeight(-1!==["","100","200","300","400","500","600","700","800","900"].indexOf(s)?s:"",!1),e.querySelector("[data-italic]").classList.toggle("on","italic"===t.style.fontStyle),this._syncDeco(t.style.textDecoration&&-1!==t.style.textDecoration.indexOf("underline")?"underline":t.style.textDecoration&&-1!==t.style.textDecoration.indexOf("line-through")?"line-through":""),this._syncCase(t.style.textTransform||"");const l=t.style.lineHeight||"",a=parseFloat(l);e.querySelector("#inpElmLineHeight").value=isNaN(a)?"":a,e.querySelector("#inpElmLineHeightUnit").value=-1!==l.indexOf("px")?"px":-1!==l.indexOf("pt")?"pt":"";const r=parseFloat(t.style.letterSpacing);e.querySelector("#inpElmLetterSpacing").value=isNaN(r)?"":r;const c=parseFloat(t.style.wordSpacing);e.querySelector("#inpElmWordSpacing").value=isNaN(c)?"":c}}const ku=new ze,Su={all:"borderRadius",tl:"borderTopLeftRadius",tr:"borderTopRightRadius",bl:"borderBottomLeftRadius",br:"borderBottomRightRadius"},_u=[["tl","Top Left"],["tr","Top Right"],["bl","Bottom Left"],["br","Bottom Right"]],Cu=["px","em","rem","%"],Eu={px:60,em:5,rem:5,"%":50};class Au{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementCorner"),this.target="all",this.unit="px",this.nowLabels={all:e.out("All corners"),tl:e.out("Top Left"),tr:e.out("Top Right"),bl:e.out("Bottom Left"),br:e.out("Bottom Right")};const i=Cu.map((t=>`<option value="${t}">${t}</option>`)).join(""),n=_u.map((([t,i])=>`<span class="cb-cn-handle ${t} on" data-c="${t}" title="${e.out(i)}"></span>`)).join(""),o=`\n <div class="cb-elmcorner">\n\n <div class="cb-field">\n <div class="cb-head">\n <span class="cb-grouplabel">${e.out("Corners")}</span>\n <span class="cb-subnote cb-cn-now"></span>\n </div>\n <div class="cb-cn-box">\n <div class="cb-cn-rect">\n ${n}\n <button type="button" class="cb-cn-all on" data-all>${e.out("All")}</button>\n </div>\n </div>\n </div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Radius")}</span>\n <div class="cb-cn-radiusrow">\n <div class="cb-dim cb-cn-dim">\n <input type="text" class="cb-cn-value" value="" placeholder="0" inputmode="numeric" autocomplete="off">\n <span class="cb-dim-sep"></span>\n <select class="cb-cn-unit">${i}</select>\n </div>\n <input type="range" class="cb-slider cb-cn-slider" min="0" max="60" step="1" value="0" aria-label="${e.out("Radius")}">\n </div>\n </div>\n\n </div>\n `;ku.appendHtml(this.panelStuff,o),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff;this.rect=t.querySelector(".cb-cn-rect"),this.nowLabel=t.querySelector(".cb-cn-now"),this.valueInput=t.querySelector(".cb-cn-value"),this.unitSel=t.querySelector(".cb-cn-unit"),this.slider=t.querySelector(".cb-cn-slider"),this.allBtn=t.querySelector("[data-all]"),this.handles=[...t.querySelectorAll(".cb-cn-handle")],this.allBtn.addEventListener("click",(()=>this.selectTarget("all"))),this.handles.forEach((t=>t.addEventListener("click",(()=>this.selectTarget(t.getAttribute("data-c")))))),this.valueInput.addEventListener("click",(()=>this.builder.uo.saveForUndo())),this.valueInput.addEventListener("keyup",(()=>{this.applyRadius(!0),this.syncSlider()})),this.valueInput.addEventListener("change",(()=>{this.applyRadius(!0),this.syncSlider()})),this.slider.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),this.slider.addEventListener("input",(()=>{this.valueInput.value=this.slider.value,this.applyRadius(!1)})),this.slider.addEventListener("change",(()=>this.builder.opts.onChange())),this.unitSel.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.unit=this.unitSel.value,this.slider.max=Eu[this.unit]||60,this.applyRadius(!0),this.syncSlider()}))}selectTarget(t){this.target=t,this.allBtn.classList.toggle("on","all"===t),this.handles.forEach((e=>e.classList.toggle("on","all"===t||e.getAttribute("data-c")===t))),this.nowLabel.textContent=this.nowLabels[t]||"",this.readTarget()}applyRadius(t){const e=this.elm();if(!e)return;const i=Su[this.target],n=this.valueInput.value.trim();e.style[i]=""===n||isNaN(n)?"":n+this.unit,this.updatePreview(),this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}syncSlider(){const t=parseFloat(this.valueInput.value);this.slider.value=isNaN(t)?0:Math.min(t,parseFloat(this.slider.max))}updatePreview(){const t=this.elm();if(!t||!this.rect)return;const e=t.style.borderRadius,i=i=>t.style["border"+i+"Radius"]||e||"0";this.rect.style.borderRadius=`${i("TopLeft")} ${i("TopRight")} ${i("BottomRight")} ${i("BottomLeft")}`}detectUnit(t){return-1!==t.indexOf("%")?"%":-1!==t.indexOf("rem")?"rem":-1!==t.indexOf("em")?"em":"px"}readTarget(){const t=this.elm(),e=t&&t.style[Su[this.target]]||"",i=parseFloat(e);this.unit=isNaN(i)?"px":this.detectUnit(e),this.unitSel.value=this.unit,this.slider.max=Eu[this.unit]||60,this.valueInput.value=isNaN(i)?"":i,this.syncSlider(),this.updatePreview()}readElementStyles(){this.selectTarget("all")}}const Lu=new ze,Tu=[["x","Offset X",-50,50],["y","Offset Y",-50,50],["blur","Blur",0,50],["spread","Spread",-20,40]],Mu={x:"xu",y:"yu",blur:"bu",spread:"su"},qu="rgba(0, 0, 0, 0.2)";class Ru{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementShadow"),this.layers=[],this.sel=-1;const i=(this.builder.opts.shadowTemplates||[]).map(((t,i)=>`<button type="button" class="cb-sh-preset" data-preset="${i}" title="${e.out("Apply Shadow")} ${i+1}" style="box-shadow:${t}"></button>`)).join(""),n=`\n <div class="cb-elmshadow">\n\n <div class="cb-sh-preview"><div class="cb-sh-card" data-card></div></div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Presets")}</span>\n <div class="cb-sh-presets" data-presets>${i}</div>\n </div>\n\n <div class="cb-field">\n <div class="cb-sh-lhead">\n <span>${e.out("Shadows")}</span>\n <div class="cb-sh-lactions">\n <button type="button" class="cb-sh-clear" data-clear title="${e.out("Clear")}"><svg class="is-icon-flex"><use xlink:href="#icon-eraser"></use></svg></button>\n <button type="button" class="cb-sh-add" data-add><span class="cb-sh-plus">+</span> ${e.out("Add")}</button>\n </div>\n </div>\n <div class="cb-sh-list" data-list></div>\n </div>\n\n <div class="cb-sh-editor" data-editor>\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Type")}</span>\n <div class="cb-seg" data-type role="group" aria-label="${e.out("Outer/Inner Shadow")}">\n <button type="button" data-t="0">${e.out("Outset")}</button>\n <button type="button" data-t="1">${e.out("Inset")}</button>\n </div>\n </div>\n ${Tu.map((([t,i,n,o])=>{return s=t,l=i,a=n,r=o,`\n <div class="cb-field">\n <span class="cb-field-label">${e.out(l)}</span>\n <div class="cb-sh-bsrow">\n <div class="cb-dim cb-sh-bsdim"><input type="text" data-k="${s}" inputmode="numeric" autocomplete="off"><span class="cb-dim-sep"></span><select data-u="${s}"><option value="px">px</option><option value="em">em</option></select></div>\n <input type="range" class="cb-slider cb-sh-slider" min="${a}" max="${r}" step="1" data-s="${s}">\n </div>\n </div>`;var s,l,a,r})).join("")}\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Shadow Color")}</span>\n <div class="cb-sh-colorrow">\n <button title="${e.out("Shadow Color")}" class="cb-sh-color cb-colorbtn"><span></span></button>\n <button type="button" class="cb-sh-reset" data-reset title="${e.out("Reset offset, blur and spread")}">${e.out("Reset")}</button>\n </div>\n </div>\n </div>\n\n </div>\n `;Lu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff;this.card=t.querySelector("[data-card]"),this.list=t.querySelector("[data-list]"),this.editor=t.querySelector("[data-editor]"),this.colorBtn=t.querySelector(".cb-sh-color"),t.querySelector("[data-presets]").addEventListener("click",(t=>{const e=t.target.closest("[data-preset]");if(!e)return;const i=(this.builder.opts.shadowTemplates||[])[+e.getAttribute("data-preset")];if(!i)return;this.builder.uo.saveForUndo();const n=this.parseLayer(i);this.sel<0||!this.layers.length?(this.layers.push(n),this.sel=this.layers.length-1):this.layers[this.sel]=n,this.refresh(!0)})),this.list.addEventListener("click",(t=>{const e=t.target.closest("[data-del]");if(e)return t.stopPropagation(),this.builder.uo.saveForUndo(),this.layers.splice(+e.getAttribute("data-del"),1),this.sel>=this.layers.length&&(this.sel=this.layers.length-1),void this.refresh(!0);const i=t.target.closest("[data-i]");i&&(this.sel=+i.getAttribute("data-i"),this.markSelected(),this.loadEditor())})),t.querySelector("[data-clear]").addEventListener("click",(()=>{this.layers.length&&(this.builder.uo.saveForUndo(),this.layers=[],this.sel=-1,this.refresh(!0))})),t.querySelector("[data-reset]").addEventListener("click",(()=>{if(this.sel<0)return;this.builder.uo.saveForUndo();const t=this.layers[this.sel];t.x=0,t.y=0,t.blur=0,t.spread=0,this.loadEditor(),this.apply(!0),this.syncRow(this.sel)})),t.querySelector("[data-add]").addEventListener("click",(()=>{this.builder.uo.saveForUndo(),this.layers.push({inset:0,x:0,xu:"px",y:4,yu:"px",blur:12,bu:"px",spread:0,su:"px",color:qu}),this.sel=this.layers.length-1,this.refresh(!0)})),t.querySelectorAll("[data-type] button").forEach((t=>t.addEventListener("click",(()=>{this.sel<0||(this.builder.uo.saveForUndo(),this.layers[this.sel].inset=+t.getAttribute("data-t"),this.setTypeActive(this.layers[this.sel].inset),this.apply(!0),this.syncRow(this.sel))})))),Tu.forEach((([e])=>{const i=t.querySelector(`[data-k="${e}"]`),n=t.querySelector(`[data-s="${e}"]`),o=t.querySelector(`[data-u="${e}"]`);i.addEventListener("click",(()=>this.builder.uo.saveForUndo()));const s=()=>{this.sel<0||(this.layers[this.sel][e]=parseFloat(i.value)||0,n.value=this.layers[this.sel][e],this.apply(!0),this.syncRow(this.sel))};i.addEventListener("keyup",s),i.addEventListener("change",s),n.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),n.addEventListener("input",(()=>{this.sel<0||(this.layers[this.sel][e]=parseFloat(n.value)||0,i.value=n.value,this.apply(!1),this.syncRow(this.sel))})),n.addEventListener("change",(()=>this.builder.opts.onChange())),o.addEventListener("change",(()=>{this.sel<0||(this.builder.uo.saveForUndo(),this.layers[this.sel][Mu[e]]=o.value,this.apply(!0))}))})),this.colorBtn.addEventListener("click",(()=>{if(this.sel<0)return;this.builder.uo.saveForUndo(!0);const t=this.colorBtn.querySelector("span"),e=t.style.background||t.style.backgroundColor;this.builder.colorPicker.open((t=>{this.layers[this.sel].color=t||qu,this.util.paintColorButton(this.colorBtn,this.layers[this.sel].color),this.apply(!0),this.syncRow(this.sel)}),e,(()=>{this.colorBtn.removeAttribute("data-focus"),this.colorBtn.focus()}),this.colorBtn),this.colorBtn.setAttribute("data-focus",!0)}))}compose(){return this.layers.map((t=>{const e=[];return t.inset&&e.push("inset"),e.push(`${t.x}${t.xu}`,`${t.y}${t.yu}`,`${t.blur}${t.bu}`,`${t.spread}${t.su}`),t.color&&e.push(t.color),e.join(" ")})).join(", ")}apply(t){const e=this.elm();e&&(e.style.boxShadow=this.compose()),this.updatePreview(),this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}updatePreview(){this.card&&(this.card.style.boxShadow=this.compose())}refresh(t){this.renderList(),this.loadEditor(),this.apply(t)}renderList(){this.layers.length?this.list.innerHTML=this.layers.map(((t,e)=>`\n <div class="cb-sh-layer ${e===this.sel?"on":""}" data-i="${e}">\n <span class="cb-sh-dot" style="background:${t.color}"></span>\n <span class="cb-sh-ltype">${t.inset?this.util.out("Inset"):this.util.out("Outset")}</span>\n <span class="cb-sh-lvals">${t.x} ${t.y} ${t.blur} ${t.spread}</span>\n <button type="button" class="cb-sh-del" data-del="${e}" title="${this.util.out("Remove")}">&#10005;</button>\n </div>`)).join(""):this.list.innerHTML=`<div class="cb-sh-empty">${this.util.out("No shadow — pick a preset or Add.")}</div>`}markSelected(){this.list.querySelectorAll(".cb-sh-layer").forEach((t=>t.classList.toggle("on",+t.getAttribute("data-i")===this.sel)))}syncRow(t){const e=this.list.querySelector(`[data-i="${t}"]`),i=this.layers[t];e&&i&&(e.querySelector(".cb-sh-dot").style.background=i.color,e.querySelector(".cb-sh-ltype").textContent=i.inset?this.util.out("Inset"):this.util.out("Outset"),e.querySelector(".cb-sh-lvals").textContent=`${i.x} ${i.y} ${i.blur} ${i.spread}`)}setTypeActive(t){this.panelStuff.querySelectorAll("[data-type] button").forEach((e=>e.classList.toggle("on",+e.getAttribute("data-t")==(t?1:0))))}loadEditor(){const t=this.layers[this.sel];this.editor.classList.toggle("is-off",!t),this.editor.inert=!t,t&&(this.setTypeActive(t.inset),Tu.forEach((([e])=>{this.panelStuff.querySelector(`[data-k="${e}"]`).value=t[e],this.panelStuff.querySelector(`[data-s="${e}"]`).value=t[e],this.panelStuff.querySelector(`[data-u="${e}"]`).value=t[Mu[e]]})),this.util.paintColorButton(this.colorBtn,t.color))}parseBoxShadow(t){const e=[];let i=0,n="";for(const o of t)"("===o?i++:")"===o&&i--,","===o&&0===i?(e.push(n),n=""):n+=o;return n.trim()&&e.push(n),e.map((t=>this.parseLayer(t))).filter(Boolean)}parseLayer(t){let e=(t||"").trim();if(!e)return null;let i=0;/\binset\b/.test(e)&&(i=1,e=e.replace(/\binset\b/," "));let n="";const o=e.match(/rgba?\([^)]*\)|hsla?\([^)]*\)|#[0-9a-fA-F]{3,8}/);o&&(n=o[0].replace(/\s+/g,""),e=e.replace(o[0]," "));const s=e.trim().split(/\s+/).filter(Boolean),l=t=>{const e=void 0!==t?String(t).match(/^(-?[\d.]+)([a-z%]*)$/):null;return e?{v:parseFloat(e[1])||0,u:e[2]||"px"}:{v:0,u:"px"}},a=l(s[0]),r=l(s[1]),c=l(s[2]),u=l(s[3]);return{inset:i,x:a.v,xu:a.u,y:r.v,yu:r.u,blur:c.v,bu:c.u,spread:u.v,su:u.u,color:n||qu}}readElementStyles(t){const e=t&&t.style.boxShadow||"";this.layers=e?this.parseBoxShadow(e):[],this.sel=this.layers.length?0:-1,this.renderList(),this.loadEditor(),this.updatePreview()}}const Iu=new ze,Ou=t=>t.charAt(0).toUpperCase()+t.slice(1),Nu=["top","left","right","bottom"],$u=["px","em","vw","vh","%"],Pu=[["row","Row","→"],["row-reverse","Row reverse","←"],["column","Column","↓"],["column-reverse","Column reverse","↑"]],Du=[["flex-start","Start"],["center","Center"],["flex-end","End"],["space-between","Space between"],["space-around","Space around"]],Bu=[["flex-start","Start"],["center","Center"],["flex-end","End"],["stretch","Stretch"],["baseline","Baseline"]],Hu=[["nowrap","No wrap"],["wrap","Wrap"],["wrap-reverse","Reverse"]],zu=[["flex-start","Start"],["center","Center"],["flex-end","End"],["stretch","Stretch"],["space-between","Space between"],["space-around","Space around"]],Fu=[["none","None"],["left","Left"],["right","Right"]],Uu={direction:"flexDirection",justify:"justifyContent",align:"alignItems",wrap:"flexWrap",aligncontent:"alignContent",float:"cssFloat"};class ju{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementLayout"),this.offUnit="px",this.scrub=null,this.readoutUpdate={};const i=t=>`<span class="cb-lo-ga${"stretch"===t?" is-stretch":""}" style="align-items:${"baseline"===t?"flex-end":t}"><i></i><i></i><i></i></span>`,n=(t,i,n)=>`<div class="cb-seg" data-seg="${t}" role="group">${i.map((t=>`<button type="button" data-v="${t[0]}" title="${e.out(t[1])}">${n?n(t[0]):t[2]?`<span class="cb-lo-arrow">${t[2]}</span>`:e.out(t[1])}</button>`)).join("")}</div>`,o=(t,i)=>`<div class="cb-fhead"><span class="cb-field-label">${e.out(i)}</span><span class="cb-readout" data-readout="${t}"></span></div>`,s=`\n <div class="cb-elmlayout">\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Display")}</span>\n <div class="cb-lo-sel"><select id="inpElmDisplay">\n <option value="">${e.out("Default")}</option>\n <option value="block">Block</option><option value="inline-block">Inline block</option>\n <option value="inline">Inline</option><option value="flex">Flex</option><option value="none">None</option>\n </select></div>\n </div>\n\n <div class="cb-lo-reveal" data-flex style="display:none">\n <div class="cb-lo-seclabel">${e.out("Flex")}</div>\n <div class="cb-field">${o("direction","Direction")}${n("direction",Pu,null)}</div>\n <div class="cb-field">${o("justify","Justify Content")}${n("justify",Du,(t=>`<span class="cb-lo-gj" style="justify-content:${t}"><i></i><i></i><i></i></span>`))}</div>\n <div class="cb-field">${o("align","Align Items")}${n("align",Bu,i)}</div>\n <div class="cb-field"><span class="cb-field-label">${e.out("Wrap")}</span>${n("wrap",Hu,null)}</div>\n <div class="cb-field" data-acwrap style="display:none">${o("aligncontent","Align Content")}${n("aligncontent",zu,i)}</div>\n </div>\n\n <div class="cb-lo-sep"></div>\n\n <div class="cb-field">\n <span class="cb-field-label">${e.out("Position")}</span>\n <div class="cb-lo-sel"><select id="inpElmPosition">\n <option value="">${e.out("Static")}</option>\n <option value="relative">Relative</option><option value="absolute">Absolute</option>\n <option value="fixed">Fixed</option><option value="sticky">Sticky</option>\n </select></div>\n </div>\n\n <div class="cb-lo-reveal" data-pos style="display:none">\n <div class="cb-lo-seclabel">${e.out("Offsets")}</div>\n <div class="cb-lo-cross">\n ${Nu.map((t=>`<div class="cb-lo-field" data-side="${t}"><input type="text" class="cb-lo-value" id="inpElm${Ou(t)}" data-side="${t}" inputmode="numeric" autocomplete="off" spellcheck="false" title="${e.out(Ou(t))}"></div>`)).join("")}\n <div class="cb-lo-box"><span class="cb-lo-caption"></span></div>\n </div>\n <div class="cb-seg is-inline cb-lo-unit" data-unit role="group" aria-label="${e.out("Unit")}">${$u.map(((t,e)=>`<button type="button" data-u="${t}"${0===e?' class="on"':""}>${t}</button>`)).join("")}</div>\n </div>\n\n <div class="cb-field"><span class="cb-field-label">${e.out("Float")}</span>${n("float",Fu,null)}</div>\n\n </div>\n `;Iu.appendHtml(this.panelStuff,s),this.wire()}elm(){return this.builder.inspectedElement}done(t=!0){this.elementStyleEditor.refresh(),t&&this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.cross=t.querySelector(".cb-lo-cross");const e=t.querySelector("#inpElmDisplay");e.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.elm().style.display=e.value,t.querySelector("[data-flex]").style.display="flex"===e.value?"":"none",this.done()}));const i=t.querySelector("#inpElmPosition");i.addEventListener("change",(()=>{this.builder.uo.saveForUndo(),this.elm().style.position=i.value,t.querySelector("[data-pos]").style.display=i.value&&"static"!==i.value?"":"none",this.done()})),t.querySelectorAll("[data-seg]").forEach((e=>{const i=e.getAttribute("data-seg"),n=t.querySelector(`[data-readout="${i}"]`);n&&(this.readoutUpdate[i]=this.util.bindReadout(e,n)),e.querySelectorAll("button").forEach((n=>n.addEventListener("click",(()=>{this.builder.uo.saveForUndo();const o=n.classList.contains("on")?"":n.getAttribute("data-v");e.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t===n&&""!==o))),this.elm().style[Uu[i]]=o,"wrap"===i&&(t.querySelector("[data-acwrap]").style.display=o&&"nowrap"!==o?"":"none"),this.readoutUpdate[i]&&this.readoutUpdate[i](),this.done()}))))})),Nu.forEach((e=>this.bindOffset(t.querySelector(`#inpElm${Ou(e)}`),e))),t.querySelectorAll("[data-unit] button").forEach((t=>t.addEventListener("click",(()=>this.setOffUnit(t.getAttribute("data-u"),!0)))))}applyOffset(t,{undo:e=!1,notify:i=!0}={}){const n=this.elm();if(!n)return;e&&this.builder.uo.saveForUndo();const o=this.panelStuff.querySelector(`#inpElm${Ou(t)}`).value.trim();n.style[t]=""===o||isNaN(o)?"":o+this.offUnit,this.done(i)}setOffUnit(t,e){this.offUnit=t,this.panelStuff.querySelectorAll("[data-unit] button").forEach((e=>e.classList.toggle("on",e.getAttribute("data-u")===t))),e&&(this.builder.uo.saveForUndo(),Nu.forEach((t=>this.applyOffset(t,{undo:!1,notify:!1}))),this.builder.opts.onChange())}bindOffset(t,e){const i=this.panelStuff.ownerDocument;t.addEventListener("click",(()=>this.builder.uo.saveForUndo())),t.addEventListener("keyup",(t=>{"ArrowUp"!==t.key&&"ArrowDown"!==t.key&&this.applyOffset(e)})),t.addEventListener("change",(()=>this.applyOffset(e))),t.addEventListener("keydown",(i=>{"ArrowUp"!==i.key&&"ArrowDown"!==i.key||(i.preventDefault(),t.value=String((parseFloat(t.value)||0)+("ArrowUp"===i.key?1:-1)),this.applyOffset(e,{undo:!0}))})),t.addEventListener("pointerdown",(n=>{0===n.button&&this.elm()&&(i.activeElement!==t&&n.preventDefault(),this.scrub={input:t,side:e,x:n.clientX,y:n.clientY,start:parseFloat(t.value)||0,moved:!1,undo:!0},t.setPointerCapture(n.pointerId))})),t.addEventListener("pointermove",(i=>{const n=this.scrub;if(!n||n.input!==t)return;const o=i.clientX-n.x,s=n.y-i.clientY;if(!n.moved){if(Math.abs(o)<3&&Math.abs(s)<3)return;n.moved=!0,this.cross.classList.add("is-scrubbing")}const l=Math.abs(s)>=Math.abs(o)?s:o;t.value=String(Math.round(n.start+l/2)),this.applyOffset(e,{undo:n.undo,notify:!1}),n.undo=!1}));const n=e=>{const i=this.scrub;i&&i.input===t&&(this.scrub=null,this.cross.classList.remove("is-scrubbing"),t.hasPointerCapture(e.pointerId)&&t.releasePointerCapture(e.pointerId),i.moved?this.builder.opts.onChange():(t.focus(),t.select()))};t.addEventListener("pointerup",n),t.addEventListener("pointercancel",n)}markSeg(t,e){this.panelStuff.querySelectorAll(`[data-seg="${t}"] button`).forEach((t=>t.classList.toggle("on",t.getAttribute("data-v")===e&&!!e))),this.readoutUpdate[t]&&this.readoutUpdate[t]()}readElementStyles(t){const e=this.panelStuff,i=t.style.display||"";e.querySelector("#inpElmDisplay").value=i,e.querySelector("[data-flex]").style.display="flex"===i?"":"none",this.markSeg("direction",t.style.flexDirection),this.markSeg("justify",t.style.justifyContent),this.markSeg("align",t.style.alignItems),this.markSeg("wrap",t.style.flexWrap),this.markSeg("aligncontent",t.style.alignContent),e.querySelector("[data-acwrap]").style.display=t.style.flexWrap&&"nowrap"!==t.style.flexWrap?"":"none";const n=t.style.position||"";e.querySelector("#inpElmPosition").value=n,e.querySelector("[data-pos]").style.display=n&&"static"!==n?"":"none",e.querySelector(".cb-lo-caption").textContent=(t.tagName||"element").toLowerCase();let o=null;Nu.forEach((i=>{const n=t.style[i]||"",s=parseFloat(n);e.querySelector(`#inpElm${Ou(i)}`).value=isNaN(s)?"":s,isNaN(s)||o||$u.forEach((t=>{-1!==n.indexOf(t)&&(o=t)}))})),this.setOffUnit(o||"px",!1),this.markSeg("float",t.style.cssFloat||t.style.float)}}const Wu=new ze,Vu=[{key:"blur",label:"Blur",min:0,max:20,def:0,cssUnit:"px",suffix:"px"},{key:"brightness",label:"Brightness",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"contrast",label:"Contrast",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"grayscale",label:"Grayscale",min:0,max:100,def:0,cssUnit:"%",suffix:"%"},{key:"saturate",label:"Saturate",min:0,max:200,def:100,cssUnit:"%",suffix:""},{key:"hue-rotate",label:"Hue",min:0,max:360,def:0,cssUnit:"deg",suffix:"°"},{key:"invert",label:"Invert",min:0,max:100,def:0,cssUnit:"%",suffix:"%"},{key:"sepia",label:"Sepia",min:0,max:100,def:0,cssUnit:"%",suffix:"%"}];class Gu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.elementStyleEditor=new ou(t),this.panelStuff=this.builderStuff.querySelector("#divElementEffect");const i=Vu.map((t=>`\n <div class="cb-fx-row" data-row="${t.key}">\n <span class="cb-fx-rlabel">${e.out(t.label)}</span>\n <input type="range" class="cb-slider cb-fx-slider" data-f="${t.key}" min="${t.min}" max="${t.max}" step="1" value="${t.def}" aria-label="${e.out(t.label)}">\n <span class="cb-fx-rval" data-v="${t.key}"></span>\n </div>`)).join(""),n=`\n <div class="cb-elmeffect">\n\n <div class="cb-fx-field">\n <div class="cb-fhead">\n <span class="cb-field-label">${e.out("Opacity")}</span>\n <span class="cb-readout" data-opacity-v></span>\n </div>\n <input type="range" class="cb-slider" data-opacity min="0" max="100" step="1" value="100" aria-label="${e.out("Opacity")}">\n </div>\n\n <div class="cb-fx-sep"></div>\n\n <div class="cb-fx-seclabel">\n <span>${e.out("Filters")}</span>\n <button type="button" class="cb-fx-reset" data-reset>${e.out("Reset")}</button>\n </div>\n\n <div class="cb-fx-rows">${i}</div>\n\n </div>\n `;Wu.appendHtml(this.panelStuff,n),this.wire()}elm(){return this.builder.inspectedElement}done(){this.elementStyleEditor.refresh(),this.builder.opts.onChange()}wire(){const t=this.panelStuff;this.opacity=t.querySelector("[data-opacity]"),this.opacityV=t.querySelector("[data-opacity-v]"),this.opacity.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),this.opacity.addEventListener("input",(()=>this.applyOpacity())),this.opacity.addEventListener("change",(()=>this.builder.opts.onChange())),Vu.forEach((e=>{const i=t.querySelector(`[data-f="${e.key}"]`);i.addEventListener("pointerdown",(()=>this.builder.uo.saveForUndo())),i.addEventListener("input",(()=>{this.syncRow(e),this.applyFilter()})),i.addEventListener("change",(()=>this.builder.opts.onChange()))})),t.querySelector("[data-reset]").addEventListener("click",(()=>{""!==this.composeFilter()&&(this.builder.uo.saveForUndo(),Vu.forEach((e=>{t.querySelector(`[data-f="${e.key}"]`).value=e.def,this.syncRow(e)})),this.applyFilter())}))}syncRow(t){const e=this.panelStuff,i=parseInt(e.querySelector(`[data-f="${t.key}"]`).value,10);e.querySelector(`[data-v="${t.key}"]`).textContent=i+t.suffix,e.querySelector(`[data-row="${t.key}"]`).classList.toggle("is-active",i!==t.def)}applyOpacity(){const t=this.elm();if(!t)return;const e=parseInt(this.opacity.value,10);this.opacityV.textContent=e+"%",t.style.opacity=100===e?"":String(e/100),this.done()}composeFilter(){const t=this.panelStuff,e=[];return Vu.forEach((i=>{const n=parseInt(t.querySelector(`[data-f="${i.key}"]`).value,10);n!==i.def&&e.push(`${i.key}(${n}${i.cssUnit})`)})),e.join(" ")}applyFilter(){const t=this.elm();if(!t)return;const e=this.composeFilter();t.style.filter=e,this.done()}readElementStyles(t){const e=this.panelStuff,i=parseFloat(t.style.opacity),n=isNaN(i)?100:Math.round(100*i);this.opacity.value=n,this.opacityV.textContent=n+"%";const o=t.style.filter||"";Vu.forEach((t=>{let i=t.def;const n=o.match(new RegExp(t.key+"\\(\\s*([-\\d.]+)\\s*(%|px|deg)?\\s*\\)"));if(n){let e=parseFloat(n[1]);"%"===t.cssUnit&&(void 0===n[2]||""===n[2])&&e<=3&&(e*=100),isNaN(e)||(i=Math.round(e))}e.querySelector(`[data-f="${t.key}"]`).value=i,this.syncRow(t)}))}}const Yu=new ze;class Xu{constructor(t){this.builder=t;const e=this.builder.util;this.util=e,this.builderStuff=this.builder.builderStuff,this.panelStuff=this.builderStuff.querySelector("#divElementMore");const i=`\n <div class="cb-elmmore">\n\n <div class="cb-field">\n <label class="cb-field-label" for="inpElmId">${e.out("Element ID")}</label>\n <div class="cb-mo-id">\n <span class="cb-mo-hash">#</span>\n <input type="text" id="inpElmId" spellcheck="false" placeholder="${e.out("none")}">\n </div>\n </div>\n\n <div class="cb-field">\n <label class="cb-field-label">${e.out("CSS classes")}</label>\n <div data-chips></div>\n <div class="cb-mo-hint">${e.out("Press Enter or space to add. Click × to remove.")}</div>\n </div>\n\n </div>\n `;Yu.appendHtml(this.panelStuff,i),this.wire()}elm(){return this.builder.inspectedElement}wire(){const t=this.panelStuff,e=t.querySelector("#inpElmId");e.addEventListener("change",(()=>{const t=this.elm();this.builder.uo.saveForUndo(),""!==e.value.trim()?t.setAttribute("id",e.value.trim()):t.removeAttribute("id"),this.builder.opts.onChange()})),this.chips=this.util.chipField(t.querySelector("[data-chips]"),{placeholder:this.util.out("Add class…"),removeTitle:this.util.out("Remove"),onChange:t=>this.applyClasses(t)})}applyClasses(t){const e=this.elm();if(!e)return;this.builder.uo.saveForUndo();let i=[];const n=e.getAttribute("data-class");n&&(i=n.split(" ")),i.forEach((i=>{""===i||t.includes(i)||e.classList.remove(i)})),t.forEach((t=>{""!==t&&e.classList.add(t)}));const o=t.join(" ");e.setAttribute("data-class",o),""===e.getAttribute("data-class")&&e.removeAttribute("data-class"),this.builder.opts.onChange()}readElementStyles(t){this.panelStuff.querySelector("#inpElmId").value=t.getAttribute("id")||"",this.chips.set(t.getAttribute("data-class")||"")}}const Ku=new ze;class Zu{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i;let n=i.querySelector("#divElementAnimation");this.panelStuff=n;const o=`\n <div style="margin-top:13px;font-weight:bold;">${e.out("Animate")}</div>\n\n <div class="is-settings" style="width:100%;">\n <div style="display:flex">\n <select id="selElmAnim">\n <option value=""></option>\n <option value="fade">fade</option>\n <option value="fade-up">fade-up</option>\n <option value="fade-down">fade-down</option>\n <option value="fade-left">fade-left</option>\n <option value="fade-right">fade-right</option>\n <option value="fade-up-right">fade-up-right</option>\n <option value="fade-up-left">fade-up-left</option>\n <option value="fade-down-right">fade-down-right</option>\n <option value="fade-down-left">fade-down-left</option>\n <option value="flip-up">flip-up</option>\n <option value="flip-down">flip-down</option>\n <option value="flip-left">flip-left</option>\n <option value="flip-right">flip-right</option>\n <option value="slide-up">slide-up</option>\n <option value="slide-down">slide-down</option>\n <option value="slide-left">slide-left</option>\n <option value="slide-right">slide-right</option>\n <option value="zoom-in">zoom-in</option>\n <option value="zoom-in-up">zoom-in-up</option>\n <option value="zoom-in-down">zoom-in-down</option>\n <option value="zoom-in-left">zoom-in-left</option>\n <option value="zoom-in-right">zoom-in-right</option>\n <option value="zoom-out">zoom-out</option>\n <option value="zoom-out-up">zoom-out-up</option>\n <option value="zoom-out-down">zoom-out-down</option>\n <option value="zoom-out-left">zoom-out-left</option>\n <option value="zoom-out-right">zoom-out-right</option>\n </select>\n </div>\n </div>\n\n <div class="is-settings" style="width:110px;">\n <div> ${e.out("Delay")}:</div>\n <div>\n <select id="selElmAnimDelay">\n <option value=""></option>\n <option value="0">0</option>\n <option value="100">100</option>\n <option value="200">200</option>\n <option value="300">300</option>\n <option value="400">400</option>\n <option value="500">500</option>\n <option value="600">600</option>\n <option value="700">700</option>\n <option value="800">800</option>\n <option value="900">900</option>\n <option value="1000">1000</option>\n <option value="1100">1100</option>\n <option value="1200">1200</option>\n <option value="1300">1300</option>\n <option value="1400">1400</option>\n <option value="1500">1500</option>\n <option value="1600">1600</option>\n <option value="1700">1700</option>\n <option value="1800">1800</option>\n <option value="1900">1900</option>\n <option value="2000">2000</option>\n <option value="2100">2100</option>\n <option value="2200">2200</option>\n <option value="2300">2300</option>\n <option value="2400">2400</option>\n <option value="2500">2500</option>\n <option value="2600">2600</option>\n <option value="2700">2700</option>\n <option value="2800">2800</option>\n <option value="2900">2900</option>\n <option value="3000">3000</option>\n </select> &nbsp;ms\n </div>\n </div>\n\n <div class="is-settings" style="width:110px;">\n <div> ${e.out("Duration")}:</div>\n <div>\n <select id="selElmAnimDuration">\n <option value=""></option>\n <option value="0">0</option>\n <option value="100">100</option>\n <option value="200">200</option>\n <option value="300">300</option>\n <option value="400">400</option>\n <option value="500">500</option>\n <option value="600">600</option>\n <option value="700">700</option>\n <option value="800">800</option>\n <option value="900">900</option>\n <option value="1000">1000</option>\n <option value="1100">1100</option>\n <option value="1200">1200</option>\n <option value="1300">1300</option>\n <option value="1400">1400</option>\n <option value="1500">1500</option>\n <option value="1600">1600</option>\n <option value="1700">1700</option>\n <option value="1800">1800</option>\n <option value="1900">1900</option>\n <option value="2000">2000</option>\n <option value="2100">2100</option>\n <option value="2200">2200</option>\n <option value="2300">2300</option>\n <option value="2400">2400</option>\n <option value="2500">2500</option>\n <option value="2600">2600</option>\n <option value="2700">2700</option>\n <option value="2800">2800</option>\n <option value="2900">2900</option>\n <option value="3000">3000</option>\n </select> &nbsp;ms\n </div>\n </div>\n\n <div class="is-settings" style="width:100%;">\n <div style="margin-top:15px">\n <label for="chkAnimateOnce"><input type="checkbox" id="chkAnimateOnce" value=""> ${e.out("Animate Once")} </label>\n </div>\n </div>\n\n <div class="is-settings" style="width:100%;">\n <div style="display:flex">\n <button title="${e.out("Test")}" id="btnPreviewAnim" class="classic" value=""> ${e.out("TEST")} </button>\n </div>\n </div>\n `;Ku.appendHtml(n,o);let s=n.querySelector("#selElmAnim");s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnim").value;""===e?t.removeAttribute("data-aos"):(t.setAttribute("data-aos",e),n.querySelector("#btnPreviewAnim").click()),this.builder.opts.onChange()})),s=n.querySelector("#selElmAnimDelay"),s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnimDelay").value;""===e?t.removeAttribute("data-aos-delay"):t.setAttribute("data-aos-delay",e),this.builder.opts.onChange()})),s=n.querySelector("#selElmAnimDuration"),s.addEventListener("change",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement,e=n.querySelector("#selElmAnimDuration").value;""===e?t.removeAttribute("data-aos-duration"):t.setAttribute("data-aos-duration",e),this.builder.opts.onChange()}));let l=n.querySelector("#chkAnimateOnce");l.addEventListener("click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.inspectedElement;n.querySelector("#chkAnimateOnce").checked?t.setAttribute("data-aos-once","true"):t.removeAttribute("data-aos-once"),this.builder.opts.onChange()})),l=n.querySelector("#btnPreviewAnim"),l.addEventListener("click",(()=>{let t=this.builder.inspectedElement,e=t.getAttribute("data-aos-duration");t.removeAttribute("data-aos-duration"),t.style.visibility="hidden",window.AOS&&window.AOS.init({duration:1}),Ku.removeClass(t,"aos-init"),Ku.removeClass(t,"aos-animate"),setTimeout((function(){t.style.visibility="",window.AOS&&window.AOS.init({duration:1200}),e&&t.setAttribute("data-aos-duration",e)}),10)}))}readElementStyles(t){this.panelStuff.querySelector("#selElmAnimDelay").value="";let e=t.getAttribute("data-aos-delay");this.panelStuff.querySelector("#selElmAnimDelay").value=e,this.panelStuff.querySelector("#selElmAnimDuration").value="",e=t.getAttribute("data-aos-duration"),this.panelStuff.querySelector("#selElmAnimDuration").value=e,this.panelStuff.querySelector("#chkAnimateOnce").checked=!1;let i=t.getAttribute("data-aos-once");i&&"true"===i&&(this.panelStuff.querySelector("#chkAnimateOnce").checked=!0),this.panelStuff.querySelector("#selElmAnim").value="",e=t.getAttribute("data-aos"),this.panelStuff.querySelector("#selElmAnim").value=e}}const Ju=new ze;let Qu=[];class td{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff;this.util=e,this.builderStuff=i}renderPanel(){const t=this.util,e=this.builderStuff,i=this.builder;let n=e.querySelector(".elementstyles");if(!n){let o=`\n <div class="is-modal is-modal-content elementstyles" style="display:none;" tabindex="-1" role="dialog" aria-hidden="true">\n\n <div class="is-modal-bar is-draggable" draggable="">\n <span>${t.out("Element")}</span>\n <button type="button" tabindex="-1" title="${t.out("Close")}" class="is-modal-close">&#10005;</button>\n </div>\n\n <div class="elm-dock">\n\n <div class="elm-list"></div>\n\n <div class="cb-tabs-scroller">\n <div class="cb-tabs cb-tabs-scroll" role="tablist" aria-label="${t.out("Element styles")}" data-group="element">\n <button type="button" role="tab" id="tabElementGeneral" data-tab="divElementGeneral" aria-controls="divElementGeneral" aria-selected="true" tabindex="0">${t.out("General")}</button>\n <button type="button" role="tab" id="tabElementBox" data-tab="divElementBox" aria-controls="divElementBox" aria-selected="false" tabindex="-1">${t.out("Box")}</button>\n <button type="button" role="tab" id="tabElementSpacing" data-tab="divElementSpacing" aria-controls="divElementSpacing" aria-selected="false" tabindex="-1">${t.out("Spacing")}</button>\n <button type="button" role="tab" id="tabElementText" data-tab="divElementText" aria-controls="divElementText" aria-selected="false" tabindex="-1">${t.out("Text")}</button>\n <button type="button" role="tab" id="tabElementBorder" data-tab="divElementBorder" aria-controls="divElementBorder" aria-selected="false" tabindex="-1">${t.out("Border")}</button>\n <button type="button" role="tab" id="tabElementCorner" data-tab="divElementCorner" aria-controls="divElementCorner" aria-selected="false" tabindex="-1">${t.out("Corners")}</button>\n <button type="button" role="tab" id="tabElementShadow" data-tab="divElementShadow" aria-controls="divElementShadow" aria-selected="false" tabindex="-1">${t.out("Shadow")}</button>\n <button type="button" role="tab" id="tabElementLayout" data-tab="divElementLayout" aria-controls="divElementLayout" aria-selected="false" tabindex="-1">${t.out("Layout")}</button>\n <button type="button" role="tab" id="tabElementEffect" data-tab="divElementEffect" aria-controls="divElementEffect" aria-selected="false" tabindex="-1">${t.out("Effects")}</button>\n \x3c!--<button type="button" role="tab" id="tabElementAttribute" data-tab="divElementAttribute" aria-controls="divElementAttribute" aria-selected="false" tabindex="-1" style="display:none">${t.out("Attributes")}</button>--\x3e\n ${!0===this.builder.opts.elementAnimate?`<button type="button" role="tab" id="tabElementAnimation" data-tab="divElementAnimation" aria-controls="divElementAnimation" aria-selected="false" tabindex="-1">${t.out("Animation")}</button>`:""}\n <button type="button" role="tab" id="tabElementMore" data-tab="divElementMore" aria-controls="divElementMore" aria-selected="false" tabindex="-1">${t.out("More")}</button>\n </div>\n <button type="button" class="cb-tabs-arrow cb-tabs-arrow--prev" aria-hidden="true" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 18l-6-6 6-6"/></svg></button>\n <button type="button" class="cb-tabs-arrow cb-tabs-arrow--next" aria-hidden="true" tabindex="-1"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 18l6-6-6-6"/></svg></button>\n </div>\n\n <div class="elm-dock-content">\n\n <div id="divElementGeneral" class="is-tab-content active" role="tabpanel" aria-labelledby="tabElementGeneral" tabindex="-1" data-group="element" style="display:flex;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n <div id="divElementBox" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementBox" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementSpacing" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementSpacing" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementBorder" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementBorder" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementText" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementText" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementCorner" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementCorner" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementShadow" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementShadow" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n <div id="divElementLayout" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementLayout" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementEffect" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementEffect" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n \n \x3c!--<div id="divElementAttribute" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementAttribute" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>--\x3e\n \n <div id="divElementAnimation" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementAnimation" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n <div id="divElementMore" class="is-tab-content" role="tabpanel" aria-labelledby="tabElementMore" tabindex="-1" data-group="element" style="display:none;flex-flow:wrap;padding:18px 20px;">\n </div>\n\n </div>\n\n <div class="elm-dock-foot">\n <button type="button" title="${t.out("css")}" class="elm-editstyle classic">${t.out("css")}</button>\n </div>\n\n </div>\n </div>\n `;Ju.appendHtml(e,o),this.elementStyleEditor=new ou(i),n=e.querySelector(".elementstyles");let s=n.querySelector(".is-modal-close");Ju.addEventListener(s,"click",(()=>{this.hidePanel()})),s=n.querySelector(".elm-editstyle"),Ju.addEventListener(s,"click",(()=>{this.elementStyleEditor.toggleStyleEditor()})),this.panel=n;const l=new ru(i);this.elementBoxStyles=l;const a=new lu(i);this.elementGeneralStyles=a;const r=new bu(i);this.elementSpacingStyles=r;const c=new yu(i);this.elementBorderStyles=c;const u=new xu(i);this.elementTextStyles=u;const d=new Au(i);this.elementCornerStyles=d;const h=new Ru(i);this.elementShadowStyles=h;const b=new ju(i);this.elementLayoutStyles=b;const p=new Gu(i);this.elementEffectStyles=p;const g=new Xu(i);this.elementMoreStyles=g;const m=new Zu(i);this.elementAnimationStyles=m,this.tabs=Ju.accessibleTabs(this.panel.querySelector(".cb-tabs"),((t,e)=>{this.panel.querySelectorAll('.is-tab-content[data-group="element"]').forEach((t=>{t.style.display="none",Ju.removeClass(t,"active")}));const i=this.panel.querySelector("#"+e.getAttribute("aria-controls"));i&&(i.style.display="flex",Ju.addClass(i,"active"))})),Ju.scrollableTabs(this.panel.querySelector(".cb-tabs-scroller")),new vs({selector:".is-modal.elementstyles .is-draggable"})}this.panel=n}click(){this.panel&&(Ju.hasClass(this.panel,"active")||Ju.hasClass(this.elementStyleEditor.modalStyles,"active"))&&this.inspect(this.builder.inspectedElement)}inspect(t){this.elementGeneralStyles.readElementStyles(t),this.elementBoxStyles.readElementStyles(t),this.elementSpacingStyles.readElementStyles(t),this.elementBorderStyles.readElementStyles(t),this.elementTextStyles.readElementStyles(t),this.elementCornerStyles.readElementStyles(t),this.elementShadowStyles.readElementStyles(t),this.elementLayoutStyles.readElementStyles(t),this.elementEffectStyles.readElementStyles(t),this.elementMoreStyles.readElementStyles(t),this.elementAnimationStyles.readElementStyles(t);let e=this.panel,i=this.builder.doc.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(i,(t=>{t.removeAttribute("data-saveforundo")})),t.setAttribute("data-saveforundo",""),i=this.builder.doc.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(i,(t=>{Ju.removeClass(t,"elm-inspected")})),setTimeout((()=>{Ju.addClass(t,"elm-inspected")}),10),e.querySelector(".elm-list").innerHTML="";let n=t,o=0;for(Qu=[];!Ju.hasClass(n,"is-builder")&&(Qu.push(n),n)&&n.tagName;){var s=n.tagName.toLowerCase(),l=Ju.createElement("a");l.setAttribute("data-index",o),o++,l.setAttribute("href","#"),l.innerHTML=s,""===e.querySelector(".elm-list").innerHTML?(Ju.addClass(l,"active"),e.querySelector(".elm-list").insertAdjacentHTML("afterbegin",l.outerHTML)):(e.querySelector(".elm-list").insertAdjacentHTML("afterbegin","&nbsp;>&nbsp; "),e.querySelector(".elm-list").insertAdjacentHTML("afterbegin",l.outerHTML)),n=n.parentNode}const a=e.querySelectorAll(".elm-list a");Array.prototype.forEach.call(a,(t=>{Ju.addEventListener(t,"click",(e=>{let i=t.getAttribute("data-index");this.builder.inspectedElement=Qu[i],this.inspect(Qu[i]),this.builder.doc.querySelector(".elm-inspected.elm-active")||(this.builderStuff.querySelector(".is-element-tool").style.display="none"),e.preventDefault(),e.stopImmediatePropagation()}))})),this.elementStyleEditor.refresh()}showPanel(){this.renderPanel();var t=this.panel;t.style.display="",this.util.applyModalPosition(t,this.builder.opts.elementEditorPosition),Ju.addClass(t,"active"),t.setAttribute("aria-hidden","false");let e=t.querySelector(".is-tab-content.active");e.focus(),this.builder.tabs.setupTabKey(e),this.escBound||(this.escBound=!0,t.addEventListener("keydown",(t=>{27===t.keyCode&&this.hidePanel()}))),this.inspect(this.builder.inspectedElement)}hidePanel(){var t=this.panel;if(!t)return;Ju.removeClass(t,"active"),t.setAttribute("aria-hidden","true");let e=this.builder.doc.querySelectorAll("[data-saveforundo]");Array.prototype.forEach.call(e,(t=>{t.removeAttribute("data-saveforundo")})),e=this.builder.doc.querySelectorAll(".elm-inspected"),Array.prototype.forEach.call(e,(t=>{Ju.removeClass(t,"elm-inspected")}))}}class ed{constructor(t){this.builder=t;const e=this.builder.util,n=this.builder.builderStuff;this.util=e,this.builderStuff=n;const o=this.builder.dom;this.dom=o;const s=new td(t);this.elementPanel=s;let l=n.querySelector(".is-element-tool"),a=n.querySelector(".elmmore");if(!l){let i=["moveup","movedown","duplicate","settings"];t.elementMoreButtons&&(i=t.elementMoreButtons);const s={moveup:`<button type="button" title="${e.out("Move Up")}" class="elm-up" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-up"></use></svg></span>${e.out("Move Up")}</button>`,movedown:`<button type="button" title="${e.out("Move Down")}" class="elm-down" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:15px;height:15px;"><use xlink:href="#ion-ios-arrow-thin-down"></use></svg></span>${e.out("Move Down")}</button>`,duplicate:`<button type="button" title="${e.out("Duplicate")}" class="elm-duplicate" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:12px;height:12px;"><use xlink:href="#ion-ios-photos-outline"></use></svg></span>${e.out("Duplicate")}</button>`,settings:`<button type="button" title="${e.out("Settings")}" class="elm-settings" style="flex: 1 1 calc(50% - 10px);"><span><svg class="is-icon-flex" style="width:13px;height:13px;"><use xlink:href="#icon-cog"></use></svg></span>${e.out("Settings")}</button>`};let r=i.filter((e=>!(!t.opts.elementEditor&&"settings"===e))).map((t=>s[t]||"")).join(""),c=`<div class="is-tool is-element-tool">\n <button type="button" tabindex="-1" title="${e.out("Add")}" class="elm-add">\n <svg class="is-icon-flex" style="width:14px;height:14px;color:#111"><use xlink:href="#icon-plus"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("More")}" class="elm-more">\n <svg class="is-icon-flex" style="width:17px;height:17px;color:#111"><use xlink:href="#icon-dots2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("Delete")}" class="elm-remove">\n <svg class="is-icon-flex" style="width:15px;height:15px;color:#111"><use xlink:href="#icon-trash2"></use></svg>\n </button>\n <button type="button" tabindex="-1" title="${e.out("Settings")}" class="elm-settings">\n <svg class="is-icon-flex"><use xlink:href="#ion-ios-gear"></use></svg>\n </button>\n </div>\n\n <div class="is-pop elmmore" style="z-index:10002;" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div style="display:flex;flex-flow:wrap;">\n ${r}\n </div>\n </div>\n `;o.appendHtml(n,c),l=this.builder.iframe?this.builder.contentStuff.querySelector(".is-element-tool"):n.querySelector(".is-element-tool"),a=n.querySelector(".elmmore");let u=l.querySelectorAll("[title]");Array.prototype.forEach.call(u,(t=>{t.setAttribute("data-title",t.getAttribute("title"))}))}this.elementTool=l,this.elementMore=a;const r=l.querySelector(".elm-add");o.addEventListener(r,"click",(()=>{const s=i(t);s.querySelector(".is-pop-tabs").style.display="none";const l=window.innerHeight,a=this.builder.util.getElementPosition(r);let c=a.top,u=a.left;e.showPop(s,!1,r);const d=s.offsetWidth,h=s.offsetHeight;l-c>h?(s.style.top=c+window.pageYOffset+42+"px",s.style.left=u-d/2+10+"px",o.removeClass(s,"arrow-bottom"),o.removeClass(s,"arrow-right"),o.removeClass(s,"arrow-left"),o.removeClass(s,"center"),o.addClass(s,"arrow-top"),o.addClass(s,"center")):(s.style.top=c+window.pageYOffset-h-8+"px",s.style.left=u-d/2+10+"px",o.removeClass(s,"arrow-top"),o.removeClass(s,"arrow-right"),o.removeClass(s,"arrow-left"),o.removeClass(s,"center"),o.addClass(s,"arrow-bottom"),o.addClass(s,"center")),s.setAttribute("data-mode","elm");t.activeElement&&t.activeElement.closest(".is-subblock")?s.classList.add("simple"):s.classList.remove("simple");const b=t=>{let i=t.target;if(i&&!(i.closest(".quickadd")||i.closest(".row-add")||i.closest(".is-rowadd-tool")||i.closest(".cell-add")||i.closest(".elm-add")||i.closest(".row-add-initial"))){const t=n.querySelector(".quickadd");e.hidePop(t),document.removeEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.removeEventListener("click",b),this.builder.handleQuickAddClickOut_=!1}};this.builder.handleQuickAddClickOut_||(document.addEventListener("click",b),this.builder.iframeDocument&&this.builder.doc.addEventListener("click",b),this.builder.handleQuickAddClickOut_=!0)}));const c=l.querySelector(".elm-remove");o.addEventListener(c,"click",(()=>{e.confirm(e.out("Are you sure you want to delete this element?"),(t=>{if(t){this.builder.uo.saveForUndo();let t=this.builder.activeElement,n=!1;t.closest(".is-subblock")&&(n=!0);if(t.closest("[data-cb-type]")&&n)return t.remove(),this.elementTool.style.display="none",this.builder.opts.onChange(),void(this.builder.onSelectChange&&this.builder.onSelectChange());let s=t.parentNode;t.remove();let l=o.elementChildren(s);s.classList.contains("cell-active")||0!==l.length||s.remove(),this.elementTool.style.display="none";let a=this.builder.activeCol;if(a){let t=a.parentNode;0===a.childElementCount&&4===t.childElementCount?(t.parentNode.removeChild(t),e.checkEmpty()):0===a.childElementCount&&(t.removeChild(a),e.fixLayout(t))}const r=this.builder.doc.querySelectorAll(".is-subblock");if(Array.prototype.forEach.call(r,(t=>{const e=o.elementChildren(t);let i=!0;e.forEach((()=>{i=!1})),i&&(t.innerHTML='<div class="spacer height-40" contentEditable="false"></div>')})),e.clearControls(),n){let t=this.builder.activeCol,n=t.querySelectorAll("[data-subblock]");var i=1;Array.prototype.forEach.call(n,(e=>{if(e.closest(".glide__slide--clone"))return;let n=e.innerHTML;t.setAttribute("data-html-"+i,encodeURIComponent(n)),i++})),e.refreshModuleLayout(t)}this.builder.opts.onChange(),this.builder.onSelectChange&&this.builder.onSelectChange()}}))}));const u=l.querySelector(".elm-more");o.addEventListener(u,"click",(()=>{const t=window.innerHeight,i=a.querySelector(".elm-settings");this.builder.activeElement.hasAttribute("data-cb-type")?i.style.display="none":i.style.display="";const n=this.builder.util.getElementPosition(u);let s=n.top,l=n.left;e.showPop(a,!1,u);const r=a.offsetWidth,c=a.offsetHeight;t-s>c?(a.style.top=s+window.pageYOffset+42+"px",a.style.left=l-r/2+10+"px",o.removeClass(a,"arrow-bottom"),o.removeClass(a,"arrow-right"),o.removeClass(a,"arrow-left"),o.removeClass(a,"center"),o.addClass(a,"arrow-top"),o.addClass(a,"center")):(a.style.top=s+window.pageYOffset-c-8+"px",a.style.left=l-r/2+10+"px",o.removeClass(a,"arrow-top"),o.removeClass(a,"arrow-right"),o.removeClass(a,"arrow-left"),o.removeClass(a,"center"),o.addClass(a,"arrow-bottom"),o.addClass(a,"center"))}));const d=a.querySelector(".elm-up");o.addEventListener(d,"click",(()=>{let t=this.builder.activeElement;if(t.previousElementSibling)this.builder.uo.saveForUndo(),t.parentNode.insertBefore(t,t.previousElementSibling),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange();else{let e=t;for(;!o.hasClass(e.parentNode,"cell-active")&&!e.parentNode.hasAttribute("data-subblock");)e=e.parentNode;e.previousElementSibling&&e!==t&&(this.builder.uo.saveForUndo(),e.parentNode.insertBefore(e,e.previousElementSibling),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange())}}));const h=a.querySelector(".elm-down");o.addEventListener(h,"click",(()=>{let t=this.builder.activeElement;if(t.nextElementSibling)this.builder.uo.saveForUndo(),t.parentNode.insertBefore(t.nextElementSibling,t),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange();else{let e=t;for(;!o.hasClass(e.parentNode,"cell-active")&&!e.parentNode.hasAttribute("data-subblock");)e=e.parentNode;e.nextElementSibling&&e!==t&&(this.builder.uo.saveForUndo(),e.parentNode.insertBefore(e.nextElementSibling,e),setTimeout((()=>{this.position()}),30),this.builder.opts.onChange())}}));const b=a.querySelector(".elm-duplicate");o.addEventListener(b,"click",(()=>{this.builder.uo.saveForUndo();let t=this.builder.activeElement;const e=t.cloneNode(!0);o.moveAfter(e,t),setTimeout((()=>{e.click(),this.position(e);let t=this.builder.doc.querySelector(".builder-active");t&&this.builder.applyBehaviorOn(t),this.builder.opts.onChange(),this.builder.reinitPlugins(e.parentNode)}),100)}));const p=l.querySelector(".elm-settings");p&&o.addEventListener(p,"click",(()=>{e.hidePop(a),this.elementPanel.showPanel()}));const g=a.querySelector(".elm-settings");g&&o.addEventListener(g,"click",(()=>{e.hidePop(a),this.elementPanel.showPanel()}))}hide(){const t=this.dom;this.elementTool.style.display="";let e=this.builder.doc.querySelectorAll(".elm-active");Array.prototype.forEach.call(e,(e=>{t.removeClass(e,"elm-active")}))}position(){const t=this.dom;let e=this.elementTool,i=this.elementMore;t.addClass(i,"transition1");let n=e.querySelector(".elm-more");const o=window.innerHeight,s=this.builder.util.getElementPosition(n);let l=s.top,a=s.left;const r=e.querySelector(".elm-more");this.util.showPop(i,!1,r);const c=i.offsetWidth,u=i.offsetHeight;o-l>u?(i.style.top=l+window.pageYOffset+27+"px",i.style.left=a-c/2+10+"px",t.removeClass(i,"arrow-bottom"),t.removeClass(i,"arrow-right"),t.removeClass(i,"arrow-left"),t.removeClass(i,"center"),t.addClass(i,"arrow-top"),t.addClass(i,"center")):(i.style.top=l+window.pageYOffset-u-8+"px",i.style.left=a-c/2+10+"px",t.removeClass(i,"arrow-top"),t.removeClass(i,"arrow-right"),t.removeClass(i,"arrow-left"),t.removeClass(i,"center"),t.addClass(i,"arrow-bottom"),t.addClass(i,"center")),setTimeout((()=>{t.removeClass(i,"transition1")}),300)}click(t,e){const i=this.dom,n=e.target;this.elementTool.style.display="none";let o=this.builder.doc.querySelectorAll(".elm-active");Array.prototype.forEach.call(o,(t=>{i.removeClass(t,"elm-active")}));let s=null,l=!1;t.hasAttribute("data-noedit")&&(l=!0);let a=!1;t.hasAttribute("data-protected")&&(a=!0);let r=!1;t.hasAttribute("data-html")&&(r=!0);let c=!1;n.closest(".is-subblock")&&!n.classList.contains("is-subblock")&&(c=!0);let u=!1;n.closest("span[data-cb-type]")&&(u=!0);const d=n.closest("[data-cb-type]"),h=n.closest("[data-cb-code]");if((r||l||a||u)&&!c);else if(h&&!c)s=h;else if(d&&!c)s=d;else{const t=n.tagName.toLowerCase();if(n.classList.contains("cell-active")||"h1"!==t&&"h2"!==t&&"h3"!==t&&"h4"!==t&&"h5"!==t&&"h6"!==t&&"p"!==t&&"div"!==t&&"pre"!==t&&"blockquote"!==t&&"li"!==t&&"img"!==t&&"iframe"!==t)if(i.hasClass(n,"cell-active")||n.hasAttribute("data-subblock"));else if(i.hasClass(n,"cell-active")||n.parentNode.hasAttribute("data-subblock"))s=n;else{let t=n;for(;"BODY"!==t.tagName&&"HTML"!==t.tagName;){let e=t.tagName.toLowerCase();if(i.hasClass(t,"spacer")||"h1"===e||"h2"===e||"h3"===e||"h4"===e||"h5"===e||"h6"===e||"p"===e||"pre"===e||"blockquote"===e||"li"===e||"img"===e||"iframe"===e){s=t;break}if(i.hasClass(t.parentNode,"cell-active")||t.parentNode.hasAttribute("data-subblock")){s=t;break}t=t.parentNode}}else if(s=n,"img"===t){i.hasClass(n.parentNode,"img-circular")&&(s=n.parentNode),i.getParentByTag(n,"a")&&(s=n.parentNode)}}if(s&&s.classList.contains("ovl")&&this.builder.activeIframe?s=this.builder.activeIframe.closest(".embed-responsive"):s&&s.classList.contains("ovl")&&s.parentNode.querySelector("audio")&&(s=s.parentNode),this.builder.activeElement=s,s){let t=s;this.pos(),t.setAttribute("data-cb-nohighlight",""),"none"===this.builder.win.getComputedStyle(t).backgroundImage&&t.removeAttribute("data-cb-nohighlight"),i.addClass(t,"elm-active")}this.builder.inspectedElement=e.target,this.elementPanel.click(e)}refresh(){if(this.builder.activeElement){this.elementTool.style.display="",setTimeout((()=>{this.pos()}),300)}}repositionElementTool(t){if(this.builder.activeElement)try{if(t){"flex"===this.elementTool.style.display&&this.pos()}else this.pos()}catch(t){}}pos(){let t=this.elementTool,e=this.builder.activeElement;if(!e)return;const i=e.closest("[data-edit-actions]");if(i){if((i.dataset.editActions||"").includes("no-add"))return}if(e.closest(".is-dock"))return;let n,o;this.builder.iframe?(n=e.getBoundingClientRect().top+this.builder.win.pageYOffset,o=e.getBoundingClientRect().left+this.builder.win.pageXOffset):(n=e.getBoundingClientRect().top+window.pageYOffset,o=e.getBoundingClientRect().left+window.pageXOffset);const s=e.offsetWidth*this.builder.opts.zoom,l=e.offsetHeight*this.builder.opts.zoom;t.style.display="flex",t.style.top=n+l+"px",t.style.left=o+s-t.offsetWidth+"px";const a=window.innerWidth;o+s>a&&(t.style.left=a-t.offsetWidth+"px")}}const id=new ze;class nd{constructor(t){this.builder=t;const e=this.builder.util,i=this.builder.builderStuff,n=this.builder.dom;this.dom=n;let o="";if(this.builder.themes){o='<div class="div-themes" style="margin-top:3px">';let t=0;this.builder.themes.forEach((i=>{""===i[1]?o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};border:rgba(0,0,0,0.15) 1px solid;"></button>`:"light"===i[1]?o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};border:rgb(132 132 132 / 16%) 1px solid;"></button>`:o+=`<button type="button" title="${e.out("Set theme")}" class="input-setcolor" data-index="${t}" style="background:${i[0]};"></button>`,t++})),o+="</div>"}let s=i.querySelector(".viewconfig");if(!s){let l=function(t,e,i){const n=t.isTouchSupport?"display:none":"",o=t.themes&&t.themes.length>0,s="#divSnippetList"===t.opts.snippetList,l=(t,e,i,n,o="")=>`\n <div class="cb-field" ${o}>\n <span class="cb-grouplabel">${t}</span>\n <div class="cb-seg" data-seg-for="${e}" role="group" aria-label="${t}">\n ${n.map((t=>`<button type="button" data-val="${t[0]}">${t[1]}</button>`)).join("")}\n </div>\n <select class="${e}" id="${i}" style="display:none">\n ${n.map((t=>`<option value="${t[0]}">${t[1]}</option>`)).join("")}\n </select>\n </div>`,a=(t,e,i,n,o="",s="")=>`\n <div class="cb-field" ${s?`id="${s}"`:""} ${o}>\n <span class="cb-grouplabel">${t}</span>\n <div class="cb-sel">\n <select class="${e}" id="${i}">\n ${n.map((t=>`<option value="${t[0]}">${t[1]}</option>`)).join("")}\n </select>\n </div>\n </div>`,r=(t,e,i,n="",o="")=>`\n <div class="cb-switchrow ${n}" ${o}>\n <span class="lbl">${t}</span>\n <label class="switch"><input class="${e}" id="${i}" type="checkbox"><span class="slider"></span></label>\n </div>`;return`\n <div class="is-modal viewconfig" tabindex="-1" role="dialog" aria-modal="true" aria-hidden="true">\n <div class="is-modal-content">\n <div class="is-modal-bar is-draggable">\n ${e.out("Preferences")}\n <button class="is-modal-close" title="${e.out("Close")}" tabindex="-1">&#10005;</button>\n </div>\n\n <div style="padding:0;margin-top:35px;">\n\n <div class="cb-tabs" role="tablist" aria-label="${e.out("Preferences")}">\n <button type="button" role="tab" id="tabPrefInterface" data-tab="divPrefInterface" aria-controls="divPrefInterface" aria-selected="true" tabindex="0">${e.out("Interface")}</button>\n <button type="button" role="tab" id="tabPrefGuides" data-tab="divPrefGuides" aria-controls="divPrefGuides" aria-selected="false" tabindex="-1">${e.out("Guides & Tools")}</button>\n <button type="button" role="tab" id="tabPrefEditing" data-tab="divPrefEditing" aria-controls="divPrefEditing" aria-selected="false" tabindex="-1">${e.out("Snippets & Editing")}</button>\n </div>\n\n <div id="divPrefInterface" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefInterface" data-group="preferences" style="display:block" tabindex="-1">\n ${o?`\n <div class="cb-field" style="${n}">\n <span class="cb-grouplabel">${e.out("Theme")}</span>\n ${i}\n </div>`:""}\n <div class="cb-pref-row2">\n ${a(e.out("Builder Mode"),"select-buildermode","__select_builderode",[["",e.out("Default")],["minimal",e.out("Minimal")],["clean",e.out("Clean")]],"","divBuilderMode")}\n ${l(e.out("Tool Style"),"select-toolstyle","__select_toolstyle",[["",e.out("Colored")],["gray",e.out("Mono")]])}\n </div>\n <div class="cb-pref-row2">\n ${l(e.out("Toolbar visibility"),"select-editingtoolbardisplay","__select_editingtoolbardisplay",[["auto",e.out("Auto")],["always",e.out("Always Visible")]])}\n ${a(e.out("Toolbar position"),"select-editingtoolbar","__select_editingtoolbar",[["topfull",e.out("Top (Full Width)")],["top",e.out("Top")],["left",e.out("Left")],["right",e.out("Right")]],`style="${n}"`)}\n </div>\n </div>\n\n <div id="divPrefGuides" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefGuides" data-group="preferences" style="display:none" tabindex="-1">\n <div class="cb-pref-row2">\n ${l(e.out("Outline Mode"),"select-outlinemode","__select_outlinemode",[["",e.out("Row & column")],["row",e.out("Row only")]],'id="divOutlineMode"')}\n ${l(e.out("Outline Style"),"select-outlinestyle","__select_outlinestyle",[["",e.out("Colored")],["grayoutline",e.out("Gray")]])}\n </div>\n <div class="cb-field" style="max-width:230px">\n <span class="cb-grouplabel">${e.out("Row Tool Position")}</span>\n <div class="cb-seg" data-seg-for="select-rowtool" role="group" aria-label="${e.out("Row Tool Position")}">\n <button type="button" data-val="right">${e.out("Right")}</button>\n <button type="button" data-val="left">${e.out("Left")}</button>\n </div>\n <select class="select-rowtool" id="__select_rowtool" style="display:none">\n <option value="right">${e.out("Right")}</option>\n <option value="left">${e.out("Left")}</option>\n </select>\n </div>\n\n <div class="cb-pref-sep"></div>\n <div class="cb-pref-grouphead">${e.out("Hide on canvas")}</div>\n ${r(e.out("Outline"),"input-hiderowcoloutline","__input_hiderowcoloutline")}\n ${r(e.out("Column Tool"),"input-hidecelltool","__input_hidecelltool","",'id="divHideCellTool"')}\n ${r(e.out("Snippet (+) Tool"),"input-hidesnippetaddtool","__input_hidesnippetaddtool")}\n ${r(e.out("Element tool"),"input-hideelementtool","__input_hideelementtool")}\n ${r(e.out("Element highlight"),"input-hideelementhighlight","__input_hideelementhighlight")}\n </div>\n\n <div id="divPrefEditing" class="is-tab-content" role="tabpanel" aria-labelledby="tabPrefEditing" data-group="preferences" style="display:none" tabindex="-1">\n <div class="cb-pref-grouphead">${e.out("Snippets")}</div>\n ${r(e.out("Open snippets sidebar on start"),"input-opensnippets","__input_opensnippets","option-opensnippets",'style="margin-bottom:14px"')}\n ${l(e.out("Snippets sidebar visibility"),"select-snippetssidebardisplay","__select_snippetssidebardisplay",[["auto",e.out("Auto")],["always",e.out("Always Visible")]],s?'style="max-width:280px"':'style="display:none"')}\n\n <div class="cb-pref-sep"></div>\n <div class="cb-pref-grouphead">${e.out("Editing")}</div>\n <div class="cb-pref-row2">\n ${a(e.out("Paste result"),"select-pasteresult","__select_pasteresult",[["auto",e.out("Auto")],["html-without-styles",e.out("HTML (without styles)")],["html",e.out("HTML (with styles)")],["text",e.out("Text only")]])}\n ${l(e.out("HTML View"),"select-htmlview","__select_htmlview",[["shorten",e.out("Shorten HTML")],["actual",e.out("Actual")]])}\n </div>\n </div>\n\n </div>\n\n <div class="cb-actions">\n <button title="${e.out("Cancel")}" class="input-cancel classic-secondary">${e.out("Cancel")}</button>\n <button title="${e.out("Ok")}" class="input-ok classic-primary">${e.out("Ok")}</button>\n </div>\n </div>\n </div>`}(t,e,o);n.appendHtml(i,l),s=i.querySelector(".viewconfig"),"#divSnippetList"===t.opts.snippetList&&t.opts.snippetJSON.snippets.length>0||(s.querySelector(".option-opensnippets").style.display="none");let a=s.querySelector(".input-cancel");if(n.addEventListener(a,"click",(()=>{e.hideModal(s)})),a=s.querySelector(".input-ok"),n.addEventListener(a,"click",(()=>{this.update(),e.hideModal(s)})),null!==localStorage.getItem("_hiderowcoloutline")&&("1"===localStorage.getItem("_hiderowcoloutline")?this.builder.opts.rowcolOutline=!1:this.builder.opts.rowcolOutline=!0),this.setOutline(!this.builder.opts.rowcolOutline),null!==localStorage.getItem("_outlinemode")&&(this.builder.opts.outlineMode=localStorage.getItem("_outlinemode")),this.setOutlineMode(this.builder.opts.outlineMode),null!==localStorage.getItem("_outlinestyle")&&(this.builder.opts.outlineStyle=localStorage.getItem("_outlinestyle")),this.setOutlineStyle(this.builder.opts.outlineStyle),null!==localStorage.getItem("_pasteresult")&&(this.builder.opts.paste=localStorage.getItem("_pasteresult")),null!==localStorage.getItem("_htmlview")){let t=localStorage.getItem("_htmlview");this.builder.opts.shortenHTML="shorten"===t}if(null!==localStorage.getItem("_hidecelltool")&&("1"===localStorage.getItem("_hidecelltool")?this.builder.opts.columnTool=!1:this.builder.opts.columnTool=!0),this.setColumnTool(!this.builder.opts.columnTool),null!==localStorage.getItem("_hidesnippetaddtool")&&("1"===localStorage.getItem("_hidesnippetaddtool")?this.builder.opts.snippetAddTool=!1:this.builder.opts.snippetAddTool=!0),this.setSnippetAddTool(!this.builder.opts.snippetAddTool),null!==localStorage.getItem("_hideelementtool")&&("1"===localStorage.getItem("_hideelementtool")?this.builder.opts.elementTool=!1:this.builder.opts.elementTool=!0),this.setElementTool(!this.builder.opts.elementTool),null!==localStorage.getItem("_hideelementhighlight")&&("1"===localStorage.getItem("_hideelementhighlight")?this.builder.opts.elementHighlight=!1:this.builder.opts.elementHighlight=!0),this.setElementHighlight(!this.builder.opts.elementHighlight),null!==localStorage.getItem("_opensnippets")&&("1"===localStorage.getItem("_opensnippets")?this.builder.opts.snippetOpen=!0:this.builder.opts.snippetOpen=!1),null!==localStorage.getItem("_buildermode")&&(this.builder.opts.builderMode=localStorage.getItem("_buildermode")),this.setBuilderMode(this.builder.opts.builderMode),null!==localStorage.getItem("_rowtool")&&(this.builder.opts.rowTool=localStorage.getItem("_rowtool")),this.setRowToolPosition(this.builder.opts.rowTool),null!==localStorage.getItem("_toolstyle")&&(this.builder.opts.toolStyle=localStorage.getItem("_toolstyle")),this.setToolStyle(this.builder.opts.toolStyle),null!==localStorage.getItem("_editingtoolbardisplay")&&(this.builder.opts.toolbarDisplay=localStorage.getItem("_editingtoolbardisplay")),null!==localStorage.getItem("_snippetssidebardisplay")&&(this.builder.opts.snippetsSidebarDisplay=localStorage.getItem("_snippetssidebardisplay")),null!=localStorage.getItem("_editingtoolbar")&&(this.builder.opts.toolbar=localStorage.getItem("_editingtoolbar")),this.setToolbar(this.builder.opts.toolbar),null!=localStorage.getItem("_theme")){const t=localStorage.getItem("_theme");if(this.builder.themeIndex=t,this.builder.themes&&this.builder.themes.length>0){const e=this.builder.themes[t];e&&(this.builder.setUIColor(e[1],e[2]),this.builder.renderIframeLater=!0)}}else this.builder.setUIColor("",""),this.builder.renderIframeLater=!0;this.builder.renderIframeLater||e.getUIStyles(),this.builder.opts.emailMode&&(this.builder.opts.outlineMode="row",this.builder.opts.columnTool=!1,this.builder.opts.builderMode="",null!=localStorage.getItem("_outlinemode")&&localStorage.setItem("_outlinemode","row"),null!==localStorage.getItem("_hidecelltool")&&localStorage.setItem("_hidecelltool","1"),null!==localStorage.getItem("_buildermode")&&localStorage.setItem("_buildermode",""),this.setColumnTool(!0),this.setBuilderMode(""),this.setEmailMode(),i.querySelector("#divHideCellTool").style.display="none",i.querySelector("#divOutlineMode").style.display="none",i.querySelector("#divBuilderMode").style.display="none")}this.config=s,function(t){const e=t.config;if(!e)return;id.accessibleTabs(e.querySelector(".cb-tabs"),((t,i)=>{e.querySelectorAll('.is-tab-content[data-group="preferences"]').forEach((t=>{t.style.display="none"}));const n=e.querySelector("#"+i.getAttribute("aria-controls"));n&&(n.style.display="block")})),e.querySelectorAll(".cb-seg[data-seg-for]").forEach((t=>{const i=e.querySelector("."+t.getAttribute("data-seg-for"));i&&t.querySelectorAll("button").forEach((e=>{e.addEventListener("click",(()=>{i.value=e.getAttribute("data-val"),t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t===e)))}))}))}));const i=e.querySelector(".is-modal-close");i&&i.addEventListener("click",(()=>t.builder.util.hideModal(e)))}(this);const l=document.querySelectorAll(".input-setcolor");l.forEach((t=>{t.addEventListener("click",(e=>{const i=t.getAttribute("data-index"),n=this.builder.themes[i];this.builder.setUIColor(n[1],n[2]),this.builder.themeIndex=i,l.forEach((e=>e.classList.toggle("on",e===t))),e.preventDefault(),e.stopImmediatePropagation()}))}))}view(){const t=new He(this.builder);let e=this.config;t.showModal(e,!1,null,!1),this.builder.opts.rowcolOutline?e.querySelector(".input-hiderowcoloutline").checked=!1:e.querySelector(".input-hiderowcoloutline").checked=!0,this.builder.opts.columnTool?e.querySelector(".input-hidecelltool").checked=!1:e.querySelector(".input-hidecelltool").checked=!0,this.builder.opts.snippetAddTool?e.querySelector(".input-hidesnippetaddtool").checked=!1:e.querySelector(".input-hidesnippetaddtool").checked=!0,this.builder.opts.elementTool?e.querySelector(".input-hideelementtool").checked=!1:e.querySelector(".input-hideelementtool").checked=!0,this.builder.opts.elementHighlight?e.querySelector(".input-hideelementhighlight").checked=!1:e.querySelector(".input-hideelementhighlight").checked=!0,this.builder.opts.snippetOpen?e.querySelector(".input-opensnippets").checked=!0:e.querySelector(".input-opensnippets").checked=!1,this.config.querySelector(".select-buildermode").value=this.builder.opts.builderMode,this.config.querySelector(".select-rowtool").value=this.builder.opts.rowTool,this.config.querySelector(".select-outlinemode").value=this.builder.opts.outlineMode,this.config.querySelector(".select-outlinestyle").value=this.builder.opts.outlineStyle,this.config.querySelector(".select-toolstyle").value=this.builder.opts.toolStyle,this.config.querySelector(".select-pasteresult").value=this.builder.opts.paste,this.config.querySelector(".select-editingtoolbardisplay").value=this.builder.opts.toolbarDisplay,this.config.querySelector(".select-editingtoolbar").value=this.builder.opts.toolbar,this.config.querySelector(".select-snippetssidebardisplay").value=this.builder.opts.snippetsSidebarDisplay,this.builder.opts.shortenHTML?this.config.querySelector(".select-htmlview").value="shorten":this.config.querySelector(".select-htmlview").value="actual",function(t){const e=t.config;if(!e)return;e.querySelectorAll(".cb-seg[data-seg-for]").forEach((t=>{const i=e.querySelector("."+t.getAttribute("data-seg-for"));i&&t.querySelectorAll("button").forEach((t=>t.classList.toggle("on",t.getAttribute("data-val")===i.value)))}));const i=String(t.builder.themeIndex);e.querySelectorAll(".input-setcolor").forEach((t=>t.classList.toggle("on",t.getAttribute("data-index")===i)))}(this)}update(){let t=this.config.querySelector(".input-hiderowcoloutline").checked;t?(this.builder.opts.rowcolOutline=!1,localStorage.setItem("_hiderowcoloutline","1")):(this.builder.opts.rowcolOutline=!0,localStorage.setItem("_hiderowcoloutline","0")),this.setOutline(t),this.config.querySelector(".input-hidecelltool").checked?(this.builder.opts.columnTool=!1,localStorage.setItem("_hidecelltool","1"),this.setColumnTool(!0)):(this.builder.opts.columnTool=!0,localStorage.setItem("_hidecelltool","0"),this.setColumnTool(!1)),this.config.querySelector(".input-hidesnippetaddtool").checked?(this.builder.opts.snippetAddTool=!1,localStorage.setItem("_hidesnippetaddtool","1"),this.setSnippetAddTool(!0)):(this.builder.opts.snippetAddTool=!0,localStorage.setItem("_hidesnippetaddtool","0"),this.setSnippetAddTool(!1)),this.config.querySelector(".input-hideelementtool").checked?(this.builder.opts.elementTool=!1,localStorage.setItem("_hideelementtool","1"),this.setElementTool(!0)):(this.builder.opts.elementTool=!0,localStorage.setItem("_hideelementtool","0"),this.setElementTool(!1)),this.config.querySelector(".input-hideelementhighlight").checked?(this.builder.opts.elementHighlight=!1,localStorage.setItem("_hideelementhighlight","1"),this.setElementHighlight(!0)):(this.builder.opts.elementHighlight=!0,localStorage.setItem("_hideelementhighlight","0"),this.setElementHighlight(!1)),this.config.querySelector(".input-opensnippets").checked?(this.builder.opts.snippetOpen=!0,localStorage.setItem("_opensnippets","1")):(this.builder.opts.snippetOpen=!1,localStorage.setItem("_opensnippets","0"));let e=this.config.querySelector(".select-buildermode").value;this.builder.opts.builderMode=e,localStorage.setItem("_buildermode",e),this.setBuilderMode(e);let i=this.config.querySelector(".select-rowtool").value;this.builder.opts.rowTool=i,localStorage.setItem("_rowtool",i),this.setRowToolPosition(i);let n=this.config.querySelector(".select-outlinemode").value;this.builder.opts.outlineMode=n,localStorage.setItem("_outlinemode",n),this.setOutlineMode(n);let o=this.config.querySelector(".select-outlinestyle").value;this.builder.opts.outlineStyle=o,localStorage.setItem("_outlinestyle",o),this.setOutlineStyle(o);let s=this.config.querySelector(".select-toolstyle").value;this.builder.opts.toolStyle=s,localStorage.setItem("_toolstyle",s),this.setToolStyle(s);let l=this.config.querySelector(".select-pasteresult").value;this.builder.opts.paste=l,localStorage.setItem("_pasteresult",l);let a=this.config.querySelector(".select-editingtoolbardisplay").value;this.builder.opts.toolbarDisplay=a,localStorage.setItem("_editingtoolbardisplay",a);let r=this.config.querySelector(".select-snippetssidebardisplay").value;this.builder.opts.snippetsSidebarDisplay=r,localStorage.setItem("_snippetssidebardisplay",r);let c=this.config.querySelector(".select-editingtoolbar").value;this.builder.opts.toolbar=c,localStorage.setItem("_editingtoolbar",c),this.setToolbar(c);let u=this.config.querySelector(".select-htmlview").value;if(this.builder.opts.shortenHTML="shorten"===u,localStorage.setItem("_htmlview",u),this.builder.themes){const t=this.builder.themeIndex;this.builder.themeIndex&&localStorage.setItem("_theme",t)}let d=this.builder.builderStuff.querySelectorAll(".is-rte-pop");Array.prototype.forEach.call(d,(t=>{t.style.display=""}))}setToolbar(t){const e=this.dom,i=this.builder.builderStuff,n=this.builder.contentStuff;"topfull"===t?(i.setAttribute("toolbarfull",""),i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),this.builder.iframe&&(n.removeAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"top"===t?(i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.removeAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"left"===t?(i.setAttribute("toolbarleft",""),i.removeAttribute("toolbarright",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.setAttribute("toolbarleft",""),n.removeAttribute("toolbarright",""))):"right"===t&&(i.setAttribute("toolbarright",""),i.removeAttribute("toolbarleft",""),i.removeAttribute("toolbarfull",""),this.builder.iframe&&(n.setAttribute("toolbarright",""),n.removeAttribute("toolbarleft","")));const o=i.querySelector(".is-rte-tool"),s=i.querySelector(".rte-more-options"),l=i.querySelector(".elementrte-more-options");o&&this.builder.rte.positionToolbar(),s&&(e.removeClass(s,"active"),e.addClass(s,"deactive"),e.removeClass(l,"active"),e.addClass(l,"deactive"))}setEmailMode(){if(this.builder.builderStuff.setAttribute("emailmode",""),this.builder.iframe){this.builder.contentStuff.setAttribute("emailmode","")}}setElementTool(t){const e=this.builder.builderStuff;if(t?e.setAttribute("hideelementtool",""):e.removeAttribute("hideelementtool",""),this.builder.iframe){const e=this.builder.contentStuff;t?e.setAttribute("hideelementtool",""):e.removeAttribute("hideelementtool","")}}setElementHighlight(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hideelementhighlight",""):e.removeAttribute("hideelementhighlight","")}))}setOutlineStyle(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"grayoutline"===t?e.setAttribute("grayoutline",""):e.removeAttribute("grayoutline")}))}setColumnTool(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);t?Array.prototype.forEach.call(e,(t=>{t.setAttribute("hidecolumntool","")})):Array.prototype.forEach.call(e,(t=>{t.removeAttribute("hidecolumntool")}))}setSnippetAddTool(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hidesnippetaddtool",""):e.removeAttribute("hidesnippetaddtool","")}))}setToolStyle(t){const e=this.builder.builderStuff;if("gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray",""),this.builder.iframe){const e=this.builder.contentStuff;"gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray","")}const i=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(i,(e=>{"gray"===t?e.setAttribute("gray",""):e.removeAttribute("gray")}))}setOutlineMode(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"row"===t?e.setAttribute("rowoutline",""):e.removeAttribute("rowoutline")}))}setOutline(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{t?e.setAttribute("hideoutline",""):e.removeAttribute("hideoutline")}))}setRowToolPosition(t){const e=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(e,(e=>{"right"===t?e.removeAttribute("leftrowtool"):e.setAttribute("leftrowtool","")}))}setBuilderMode(t){const e=this.builder.builderStuff;if(""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal")),this.builder.iframe){const e=this.builder.contentStuff;""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal"))}const i=this.builder.doc.querySelectorAll(this.builder.opts.container);Array.prototype.forEach.call(i,(e=>{""===t?(e.removeAttribute("minimal"),e.removeAttribute("clean")):"minimal"===t?(e.setAttribute("minimal",""),e.removeAttribute("clean")):"clean"===t&&(e.setAttribute("clean",""),e.removeAttribute("minimal"))}))}initBuilder(t){const e=this.builder.opts.builderMode;""===e?(t.removeAttribute("minimal"),t.removeAttribute("clean")):"minimal"===e?(t.setAttribute("minimal",""),t.removeAttribute("clean")):"clean"===e&&(t.setAttribute("clean",""),t.removeAttribute("minimal"));"right"===this.builder.opts.rowTool?t.removeAttribute("leftrowtool"):t.setAttribute("leftrowtool","");!this.builder.opts.rowcolOutline?t.setAttribute("hideoutline",""):t.removeAttribute("hideoutline");"row"===this.builder.opts.outlineMode?t.setAttribute("rowoutline",""):t.removeAttribute("rowoutline");"gray"===this.builder.opts.toolStyle?t.setAttribute("gray",""):t.removeAttribute("gray");!this.builder.opts.snippetAddTool?t.setAttribute("hidesnippetaddtool",""):t.removeAttribute("hidesnippetaddtool","");"grayoutline"===this.builder.opts.outlineStyle?t.setAttribute("grayoutline",""):t.removeAttribute("grayoutline");!this.builder.opts.elementHighlight?t.setAttribute("hideelementhighlight",""):t.removeAttribute("hideelementhighlight","")}}
29
29
  /*!
30
30
  * Kelir v1.1.0
31
31
  * A dependency-free color picker library. ES6 module.