(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d["Vue Box Model Editor"]={},d.Vue))})(this,function(d,e){"use strict";var Mo=Object.defineProperty;var Eo=(d,e,u)=>e in d?Mo(d,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):d[e]=u;var i=(d,e,u)=>(Eo(d,typeof e!="symbol"?e+"":e,u),u);class u{constructor(){i(this,"isLinked",!0);i(this,"top",null);i(this,"topUnit","px");i(this,"right",null);i(this,"rightUnit","px");i(this,"bottom",null);i(this,"bottomUnit","px");i(this,"left",null);i(this,"leftUnit","px")}}class k extends u{constructor(){super(...arguments);i(this,"style","solid")}}var B="M3.9,12C3.9,10.29 5.29,8.9 7,8.9H11V7H7A5,5 0 0,0 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12M8,13H16V11H8V13M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.71 18.71,15.1 17,15.1H13V17H17A5,5 0 0,0 22,12A5,5 0 0,0 17,7Z",S="M17,7H13V8.9H17C18.71,8.9 20.1,10.29 20.1,12C20.1,13.43 19.12,14.63 17.79,15L19.25,16.44C20.88,15.61 22,13.95 22,12A5,5 0 0,0 17,7M16,11H13.81L15.81,13H16V11M2,4.27L5.11,7.38C3.29,8.12 2,9.91 2,12A5,5 0 0,0 7,17H11V15.1H7C5.29,15.1 3.9,13.71 3.9,12C3.9,10.41 5.11,9.1 6.66,8.93L8.73,11H8V13H10.73L13,15.27V17H14.73L18.74,21L20,19.74L3.27,3L2,4.27Z",C="M7,10L12,15L17,10H7Z";class m{constructor(){i(this,"width",null);i(this,"widthUnit","px");i(this,"height",null);i(this,"heightUnit","px")}}const f=(o,t)=>{const s=o.__vccOpts||o;for(const[l,h]of t)s[l]=h;return s},N={mdi:{size:24,viewbox:"0 0 24 24"},"simple-icons":{size:24,viewbox:"0 0 24 24"},default:{size:0,viewbox:"0 0 0 0"}},$={name:"icon",props:{type:String,path:{type:String,required:!0},size:{type:[String,Number],default:24},viewbox:String,flip:{type:String,validator:o=>["horizontal","vertical","both","none"].includes(o)},rotate:{type:Number,default:0}},computed:{styles(){return{"--sx":["both","horizontal"].includes(this.flip)?"-1":"1","--sy":["both","vertical"].includes(this.flip)?"-1":"1","--r":isNaN(this.rotate)?this.rotate:this.rotate+"deg"}},defaults(){return N[this.type]||N.default},sizeValue(){return this.size||this.defaults.size},viewboxValue(){return this.viewbox||this.defaults.viewbox}}},v=["width","height","viewBox"],D=["d"];function M(o,t,s,l,h,b){return e.openBlock(),e.createElementBlock("svg",{width:b.sizeValue,height:b.sizeValue,viewBox:b.viewboxValue,style:e.normalizeStyle(b.styles)},[e.createElementVNode("path",{d:s.path},null,8,D)],12,v)}const U=f($,[["render",M],["__scopeId","data-v-76aa6b74"]]);class z{constructor(){i(this,"bordersColor","#000");i(this,"marginBackgroundColor","#f9cc9d");i(this,"borderBackgroundColor","#ffeebc");i(this,"paddingBackgroundColor","#c4dfb8");i(this,"sizeBackgroundColor","#a0c6e8");i(this,"textColor","#252525");i(this,"inputFontSize",11);i(this,"unitDropdownBackgroundColor","#f9f9f9");i(this,"unitDropdownTextColor",this.textColor);i(this,"unitDropdownHoverBackgroundColor","#d1d1d1");i(this,"unitDropdownHoverTextColor",this.unitDropdownTextColor);i(this,"unitDropdownFontSize",12)}}const E=e.defineComponent({components:{SvgIcon:U},props:{availableUnits:Array,backgroundColor:String,textColor:String,fontSize:Number,value:{type:String,required:!0}},computed:{styles(){const o=new z;return{"--background-color":this.backgroundColor??o.unitDropdownBackgroundColor,"--text-color":this.textColor??o.unitDropdownTextColor,"--hover-background-color":o.unitDropdownHoverBackgroundColor,"--hover-text-color":o.unitDropdownHoverTextColor,"--font-size":`${this.fontSize??o.unitDropdownFontSize}px`}}},watch:{value(o){this.selectedUnit=o}},mounted(){document.addEventListener("click",t=>{const s=t.target,l=this.$refs.container,h=this.$refs.dropdown;l.contains(s)||(h.style.display="none")});const o=this.$refs.dropdown;Object.keys(this.styles).forEach(t=>o.style.setProperty(t,this.styles[t])),document.body.appendChild(o)},data(){return{selectedUnit:this.value,dropdownOpenIcon:C}},methods:{toggleDropdown(){const o=this.$refs.dropdown,t=this.$refs.label;if(o.style.display!=="none"){o.style.display="none";return}const l=t.getBoundingClientRect();o.style.display="block";const h=o.getBoundingClientRect();o.style.top=`${l.top+l.height}px`,o.style.left=`${l.left+l.width-h.width}px`},updateValue(o){this.selectedUnit=o,this.$refs.dropdown.style.display="none",this.$emit("update:value",this.selectedUnit)}}}),H={ref:"container",class:"units-dropdown"},L={ref:"dropdown",class:"vbme-units-dropdown__content"},F=["onClick"];function T(o,t,s,l,h,b){const g=e.resolveComponent("SvgIcon");return e.openBlock(),e.createElementBlock("div",H,[e.createElementVNode("span",{ref:"label",class:"units-dropdown__selected-item",onClick:t[0]||(t[0]=(...a)=>o.toggleDropdown&&o.toggleDropdown(...a))},[e.createElementVNode("span",null,e.toDisplayString(o.selectedUnit),1),e.createVNode(g,{class:"units-dropdown__icon",type:"mdi",width:"12",height:"20",viewBox:"8 0 8 22",path:o.dropdownOpenIcon},null,8,["path"])],512),e.createElementVNode("div",L,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.availableUnits,a=>(e.openBlock(),e.createElementBlock("div",{class:"vbme-units-dropdown__content__item",key:a,onClick:()=>{o.updateValue(a)}},e.toDisplayString(a),9,F))),128))],512)],512)}const A=f(E,[["render",T]]),y=class y{static getNormalizedValue(t){return y._acceptedTextValues.includes(t)?t:(t==null?void 0:t.length)===0||(t=+t,isNaN(t))?null:t}};i(y,"_acceptedTextValues",["auto","inherit","initial","unset"]);let w=y;const I=e.defineComponent({props:{editing:Boolean,value:Number,fontSize:Number},computed:{styles(){return{"--font-size":`${this.fontSize??11}px`}}},data(){return{isEditing:this.editing,editValue:this.value}},methods:{beginEdit(){this.isEditing=!0,this.$nextTick(()=>{this.$refs.inputValue.focus()})},endEdit(){this.isEditing=!1},onValueChange(o){const t=o.target;this.editValue=this.getNormalizedValue(t.value),this.$emit("update:value",this.editValue)},getNormalizedValue(o){return w.getNormalizedValue(o)}}}),O=["value"];function Z(o,t,s,l,h,b){return e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle(o.styles)},[o.isEditing?(e.openBlock(),e.createElementBlock("input",{key:1,ref:"inputValue",value:o.editValue,onKeyup:t[1]||(t[1]=e.withKeys(g=>{o.onValueChange(g),o.endEdit()},["enter"])),onChange:t[2]||(t[2]=(...g)=>o.onValueChange&&o.onValueChange(...g)),onBlur:t[3]||(t[3]=(...g)=>o.endEdit&&o.endEdit(...g))},null,40,O)):(e.openBlock(),e.createElementBlock("span",{key:0,class:"value-label",onClick:t[0]||(t[0]=e.withModifiers((...g)=>o.beginEdit&&o.beginEdit(...g),["stop"]))},e.toDisplayString(o.value??"-"),1))],4)}const W=f(I,[["render",Z]]);class c{constructor(){i(this,"availableUnits",["px","em","rem","vw","vh","%"]);i(this,"style",new z)}}const j={},K={width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},q=[e.createElementVNode("path",{d:"M4 11H8V13H4V11Z",fill:"currentColor"},null,-1),e.createElementVNode("path",{d:"M10 11H14V13H10V11Z",fill:"currentColor"},null,-1),e.createElementVNode("path",{d:"M20 11H16V13H20V11Z",fill:"currentColor"},null,-1)];function P(o,t){return e.openBlock(),e.createElementBlock("svg",K,q)}const R=f(j,[["render",P]]),G={},J={width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},Q=[e.createStaticVNode('<path d="M3 11H1V13H3V11Z" fill="currentColor"></path><path d="M7 11H5V13H7V11Z" fill="currentColor"></path><path d="M9 11H11V13H9V11Z" fill="currentColor"></path><path d="M15 11H13V13H15V11Z" fill="currentColor"></path><path d="M17 11H19V13H17V11Z" fill="currentColor"></path><path d="M23 11H21V13H23V11Z" fill="currentColor"></path>',6)];function X(o,t){return e.openBlock(),e.createElementBlock("svg",J,Q)}const Y=f(G,[["render",X]]),x={},_={width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},oo=[e.createElementVNode("path",{d:"M2 11H22V13H2V11Z",fill:"currentColor"},null,-1)];function eo(o,t){return e.openBlock(),e.createElementBlock("svg",_,oo)}const to=f(x,[["render",eo]]),V=["solid","dashed","dotted"],no=e.defineComponent({components:{BoxModelValue:W,BoxModelUnitSelector:A,SvgIcon:U,BorderStyleDashed:R,BorderStyleDotted:Y,BorderStyleSolid:to},props:{margin:u,border:k,padding:u,size:m,options:c},computed:{styles(){return{"--borders-color":this.options.style.bordersColor,"--margin-background-color":this.options.style.marginBackgroundColor,"--border-background-color":this.options.style.borderBackgroundColor,"--padding-background-color":this.options.style.paddingBackgroundColor,"--size-background-color":this.options.style.sizeBackgroundColor,"--text-color":this.options.style.textColor,"--input-font-size":`${this.options.style.inputFontSize}px`}}},data(){return{editingMeasure:null,dropdownOpenIcon:C,linkIcon:B,unlinkIcon:S}},methods:{resetWhite(...o){o.map(t=>t).forEach(t=>{t.classList.remove("white")})},makeAllWhiteExcept(o){[this.$refs.margin,this.$refs.border,this.$refs.padding,this.$refs.size].forEach(s=>{s!==o?s.classList.add("white"):s.classList.remove("white")})},edit(o,t){this.editingMeasure=`${o}-${t}`,this.$nextTick(()=>{this.$refs.inputValue.focus()})},setAndNotify(o,t,s){let l=o==="size"?new m:new u;l=Object.assign(l,{...t}),s(l),this.$emit(`update:${o}`,l)},setUnit(o,t,s){o.hasOwnProperty("isLinked")&&o.isLinked?o.topUnit=o.rightUnit=o.bottomUnit=o.leftUnit=t:o[`${s}Unit`]=t},toggleLinkStatus(o){const t={...this[o]};t.isLinked=!t.isLinked,t.isLinked&&(t.left=t.right=t.bottom=t.top),this.$emit(`update:${o}`,t)},onValueChange(o,t,s){const l=Object.assign(new u,{...this[o]});l.isLinked?l.top=l.left=l.right=l.bottom=s:l[t]=s,this.$emit(`update:${o}`,l)},onSizeChange(o,t){const s=t.target,l=Object.assign(new m,{...this.size});l[o]=w.getNormalizedValue(s.value),this.$emit("update:size",l)},toggleBorderStyle(){const o=Object.assign(new k,{...this.border});let s=V.indexOf(o.style)+1;s===V.length&&(s=0),o.style=V[s],this.$emit("update:border",o)}}}),io={class:"margin-container__label"},lo={class:"margin-input__top"},so={class:"margin-input__left"},ro={class:"margin-input__right"},ao={class:"margin-input__bottom"},po={class:"border-container__label"},go=e.createElementVNode("div",{class:"border-container__label__spacer"}," ",-1),uo={class:"border-input__top"},ho={class:"border-input__left"},fo={class:"border-input__right"},bo={class:"border-input__bottom"},mo={class:"padding-container__label"},wo={class:"padding-input__top"},yo={class:"padding-input__left"},ko={class:"padding-input__right"},zo={class:"padding-input__bottom"},Vo={class:"size-container__value-container"},Co={class:"width"},No=["value"],Uo={class:"height"},co=["value"];function Bo(o,t,s,l,h,b){const g=e.resolveComponent("SvgIcon"),a=e.resolveComponent("BoxModelValue"),p=e.resolveComponent("BoxModelUnitSelector"),$o=e.resolveComponent("BorderStyleSolid"),vo=e.resolveComponent("BorderStyleDashed"),Do=e.resolveComponent("BorderStyleDotted");return e.openBlock(),e.createElementBlock("div",{ref:"margin",class:"margin-container",style:e.normalizeStyle(o.styles),onMouseenter:t[43]||(t[43]=e.withModifiers(()=>{o.makeAllWhiteExcept(o.$refs.margin)},["stop"])),onMouseleave:t[44]||(t[44]=e.withModifiers(()=>{o.resetWhite(o.$refs.border,o.$refs.padding,o.$refs.size)},["stop"]))},[e.createElementVNode("div",io,[e.createTextVNode(" margin "),e.createVNode(g,{class:"toggle-lock-icon",type:"mdi",width:"16",height:"16",viewBox:"0 0 24 22",path:o.margin.isLinked?o.linkIcon:o.unlinkIcon,onClick:t[0]||(t[0]=n=>o.toggleLinkStatus("margin"))},null,8,["path"])]),e.createElementVNode("div",lo,[e.createVNode(a,{editing:o.editingMeasure==="margin-top",value:o.margin.top,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[1]||(t[1]=n=>o.onValueChange("margin","top",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.margin.topUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[2]||(t[2]=n=>{o.setAndNotify("margin",o.margin,r=>o.setUnit(r,n,"top"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.margin.top&&!isNaN(+o.margin.top)]])]),e.createElementVNode("div",so,[e.createVNode(a,{editing:o.editingMeasure==="margin-left",value:o.margin.left,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[3]||(t[3]=n=>o.onValueChange("margin","left",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.margin.leftUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[4]||(t[4]=n=>{o.setAndNotify("margin",o.margin,r=>o.setUnit(r,n,"left"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.margin.left&&!isNaN(+o.margin.left)]])]),e.createElementVNode("div",ro,[e.createVNode(a,{editing:o.editingMeasure==="margin-right",value:o.margin.right,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[5]||(t[5]=n=>o.onValueChange("margin","right",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.margin.rightUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[6]||(t[6]=n=>{o.setAndNotify("margin",o.margin,r=>o.setUnit(r,n,"right"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.margin.right&&!isNaN(+o.margin.right)]])]),e.createElementVNode("div",ao,[e.createVNode(a,{editing:o.editingMeasure==="margin-bottom",value:o.margin.bottom,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[7]||(t[7]=n=>o.onValueChange("margin","bottom",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.margin.bottomUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[8]||(t[8]=n=>{o.setAndNotify("margin",o.margin,r=>o.setUnit(r,n,"bottom"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.margin.bottom&&!isNaN(+o.margin.bottom)]])]),e.createElementVNode("div",{ref:"border",class:"border-container",onMouseenter:t[41]||(t[41]=e.withModifiers(()=>{o.makeAllWhiteExcept(o.$refs.border)},["stop"])),onMouseleave:t[42]||(t[42]=e.withModifiers(()=>{o.resetWhite(o.$refs.border,o.$refs.margin)},["stop"]))},[e.createElementVNode("div",po,[e.createTextVNode(" border "),e.createVNode(g,{class:"toggle-lock-icon",type:"mdi",width:"16",height:"16",viewBox:"0 0 24 22",path:o.border.isLinked?o.linkIcon:o.unlinkIcon,onClick:t[9]||(t[9]=n=>o.toggleLinkStatus("border"))},null,8,["path"]),go,o.border.style==="solid"?(e.openBlock(),e.createBlock($o,{key:0,class:"toggle-border-style-icon",onClick:e.withModifiers(o.toggleBorderStyle,["stop"])},null,8,["onClick"])):e.createCommentVNode("",!0),o.border.style==="dashed"?(e.openBlock(),e.createBlock(vo,{key:1,class:"toggle-border-style-icon",onClick:e.withModifiers(o.toggleBorderStyle,["stop"])},null,8,["onClick"])):e.createCommentVNode("",!0),o.border.style==="dotted"?(e.openBlock(),e.createBlock(Do,{key:2,class:"toggle-border-style-icon",onClick:e.withModifiers(o.toggleBorderStyle,["stop"])},null,8,["onClick"])):e.createCommentVNode("",!0)]),e.createElementVNode("div",uo,[e.createVNode(a,{editing:o.editingMeasure==="border-top",value:o.border.top,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[10]||(t[10]=n=>o.onValueChange("border","top",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.border.topUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[11]||(t[11]=n=>{o.setAndNotify("border",o.border,r=>o.setUnit(r,n,"top"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.border.top&&!isNaN(+o.border.top)]])]),e.createElementVNode("div",ho,[e.createVNode(a,{editing:o.editingMeasure==="border-left",value:o.border.left,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[12]||(t[12]=n=>o.onValueChange("border","left",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.border.leftUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[13]||(t[13]=n=>{o.setAndNotify("border",o.border,r=>o.setUnit(r,n,"left"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.border.left&&!isNaN(+o.border.left)]])]),e.createElementVNode("div",fo,[e.createVNode(a,{editing:o.editingMeasure==="border-right",value:o.border.right,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[14]||(t[14]=n=>o.onValueChange("border","right",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.border.rightUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[15]||(t[15]=n=>{o.setAndNotify("border",o.border,r=>o.setUnit(r,n,"right"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.border.right&&!isNaN(+o.border.right)]])]),e.createElementVNode("div",bo,[e.createVNode(a,{editing:o.editingMeasure==="border-bottom",value:o.border.bottom,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[16]||(t[16]=n=>o.onValueChange("border","bottom",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.border.bottomUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[17]||(t[17]=n=>{o.setAndNotify("border",o.border,r=>o.setUnit(r,n,"bottom"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.border.bottom&&!isNaN(+o.border.bottom)]])]),e.createElementVNode("div",{ref:"padding",class:"padding-container",onMouseenter:t[39]||(t[39]=e.withModifiers(()=>{o.makeAllWhiteExcept(o.$refs.padding)},["stop"])),onMouseleave:t[40]||(t[40]=e.withModifiers(()=>{o.resetWhite(o.$refs.padding,o.$refs.border)},["stop"]))},[e.createElementVNode("div",mo,[e.createTextVNode(" padding "),e.createVNode(g,{class:"toggle-lock-icon",type:"mdi",width:"16",height:"16",viewBox:"0 0 24 22",path:o.padding.isLinked?o.linkIcon:o.unlinkIcon,onClick:t[18]||(t[18]=n=>o.toggleLinkStatus("padding"))},null,8,["path"])]),e.createElementVNode("div",wo,[e.createVNode(a,{editing:o.editingMeasure==="padding-top",value:o.padding.top,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[19]||(t[19]=n=>o.onValueChange("padding","top",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.padding.topUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[20]||(t[20]=n=>{o.setAndNotify("padding",o.padding,r=>o.setUnit(r,n,"top"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.padding.top&&!isNaN(+o.padding.top)]])]),e.createElementVNode("div",yo,[e.createVNode(a,{editing:o.editingMeasure==="padding-left",value:o.padding.left,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[21]||(t[21]=n=>o.onValueChange("padding","left",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.padding.leftUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[22]||(t[22]=n=>{o.setAndNotify("padding",o.padding,r=>o.setUnit(r,n,"left"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.padding.left&&!isNaN(+o.padding.left)]])]),e.createElementVNode("div",ko,[e.createVNode(a,{editing:o.editingMeasure==="padding-right",value:o.padding.right,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[23]||(t[23]=n=>o.onValueChange("padding","right",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.padding.rightUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[24]||(t[24]=n=>{o.setAndNotify("padding",o.padding,r=>o.setUnit(r,n,"right"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.padding.right&&!isNaN(+o.padding.right)]])]),e.createElementVNode("div",zo,[e.createVNode(a,{editing:o.editingMeasure==="padding-bottom",value:o.padding.bottom,"font-size":o.options.style.inputFontSize,"onUpdate:value":t[25]||(t[25]=n=>o.onValueChange("padding","bottom",n))},null,8,["editing","value","font-size"]),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.padding.bottomUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[26]||(t[26]=n=>{o.setAndNotify("padding",o.padding,r=>o.setUnit(r,n,"bottom"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.padding.bottom&&!isNaN(+o.padding.bottom)]])]),e.createElementVNode("div",{ref:"size",class:"size-container",onMouseenter:t[37]||(t[37]=e.withModifiers(()=>{o.makeAllWhiteExcept(o.$refs.size)},["stop"])),onMouseleave:t[38]||(t[38]=e.withModifiers(()=>{o.resetWhite(o.$refs.size,o.$refs.padding)},["stop"]))},[e.createElementVNode("div",Vo,[e.createElementVNode("div",Co,[o.editingMeasure!=="size-width"?(e.openBlock(),e.createElementBlock("span",{key:0,onClick:t[27]||(t[27]=e.withModifiers(()=>{o.edit("size","width")},["stop"]))},e.toDisplayString(o.size.width??"..."),1)):(e.openBlock(),e.createElementBlock("input",{key:1,ref:"inputValue",value:o.size.width,onKeyup:t[28]||(t[28]=e.withKeys(n=>{o.onSizeChange("width",n),o.editingMeasure=null},["enter"])),onChange:t[29]||(t[29]=n=>{o.onSizeChange("width",n)}),onBlur:t[30]||(t[30]=()=>{o.editingMeasure=null})},null,40,No)),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.size.widthUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[31]||(t[31]=n=>{o.setAndNotify("size",o.size,r=>o.setUnit(r,n,"width"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.size.width&&!isNaN(+o.size.width)]])]),e.createElementVNode("div",Uo,[o.editingMeasure!=="size-height"?(e.openBlock(),e.createElementBlock("span",{key:0,onClick:t[32]||(t[32]=e.withModifiers(()=>{o.edit("size","height")},["stop"]))},e.toDisplayString(o.size.height??"..."),1)):(e.openBlock(),e.createElementBlock("input",{key:1,ref:"inputValue",value:o.size.height,onKeyup:t[33]||(t[33]=e.withKeys(n=>{o.onSizeChange("height",n),o.editingMeasure=null},["enter"])),onChange:t[34]||(t[34]=n=>{o.onSizeChange("height",n)}),onBlur:t[35]||(t[35]=()=>{o.editingMeasure=null})},null,40,co)),e.withDirectives(e.createVNode(p,{availableUnits:o.options.availableUnits,value:o.size.heightUnit,"background-color":o.options.style.unitDropdownBackgroundColor,"text-color":o.options.style.unitDropdownTextColor,"font-size":o.options.style.unitDropdownFontSize,"onUpdate:value":t[36]||(t[36]=n=>{o.setAndNotify("size",o.size,r=>o.setUnit(r,n,"height"))})},null,8,["availableUnits","value","background-color","text-color","font-size"]),[[e.vShow,o.size.height&&!isNaN(+o.size.height)]])])])],544)],544)],544)],36)}const So=f(no,[["render",Bo]]);d.BorderModel=k,d.BoxModel=u,d.BoxModelEditor=So,d.BoxModelEditorOptions=c,d.BoxModelEditorStyleOptions=z,d.SizeModel=m,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});