@rettangoli/ui 1.9.0 → 1.9.2

package/dist/rettangoli-iife-layout.min.js

@@ -72,7 +72,7 @@ var rettangoli=(()=>{var $=`
       background-color: var(--destructive);
       color: var(--primary-foreground);
     `,ol:`
-      background-color: transparent;
+      background-color: var(--background);
       color: var(--foreground);
       border-width: 1px;
     `,gh:`
@@ -600,7 +600,7 @@ var rettangoli=(()=>{var $=`
         ${K}
         ${W}
         ${$}
-      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styleElement=document.createElement("style"),this._slotElement=document.createElement("slot"),this._linkElement=null,this.shadow.appendChild(this._styleElement),this._updateDOM()}static get observedAttributes(){return["href","new-tab","rel",...g([...C,"cols","op","wh","w","h","hide","show","sh","sv","z","overflow"])]}_styles=b();_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.hasAttribute("new-tab"),s=this.getAttribute("rel");this._linkElement=B({shadowRoot:this.shadow,slotElement:this._slotElement,linkElement:this._linkElement,href:t,newTab:e,rel:s})}connectedCallback(){this.updateStyles()}updateStyles(){this._styles=b(),S.forEach(e=>{let s=k=>`${e==="default"?"":`${e}-`}${k}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=Te(this.getAttribute(s("cols"))),h=this.getAttribute(s("op")),a=this.getAttribute(s("z"));l!==null&&(this._styles[e]["grid-template-columns"]=l),a!==null&&(this._styles[e]["z-index"]=a),h!==null&&(this._styles[e].opacity=h),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)",allowFlexGrow:!0}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%",allowFlexGrow:!0}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="grid");let d=this.hasAttribute(s("sh")),y=this.hasAttribute(s("sv")),x=this.getAttribute(s("overflow"));d&&y?(this._styles[e].overflow="auto",this._styles[e]["scrollbar-gutter"]="stable"):d?(this._styles[e]["overflow-x"]="auto",this._styles[e]["scrollbar-gutter"]="stable"):y&&(this._styles[e]["overflow-y"]="auto",this._styles[e]["scrollbar-gutter"]="stable"),x==="hidden"&&(this._styles[e].overflow="hidden")});let t=w(this._styles);t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}attributeChangedCallback(t,e,s){if(t==="href"||t==="new-tab"||t==="rel"){this._updateDOM();return}e!==s&&this.updateStyles()}},Ft=({render:i,html:t})=>lt;var Dt=c`
+      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styleElement=document.createElement("style"),this._slotElement=document.createElement("slot"),this._linkElement=null,this.shadow.appendChild(this._styleElement),this._updateDOM()}static get observedAttributes(){return["href","new-tab","rel",...g([...C,"cols","op","wh","w","h","hide","show","sh","sv","z","overflow"])]}_styles=b();_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.hasAttribute("new-tab"),s=this.getAttribute("rel");this._linkElement=B({shadowRoot:this.shadow,slotElement:this._slotElement,linkElement:this._linkElement,href:t,newTab:e,rel:s})}connectedCallback(){this.updateStyles()}updateStyles(){this._styles=b(),S.forEach(e=>{let s=k=>`${e==="default"?"":`${e}-`}${k}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=Te(this.getAttribute(s("cols"))),h=this.getAttribute(s("op")),a=this.getAttribute(s("z"));l!==null&&(this._styles[e]["grid-template-columns"]=l),a!==null&&(this._styles[e]["z-index"]=a),h!==null&&(this._styles[e].opacity=h),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)",allowFlexGrow:!0}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%",allowFlexGrow:!0}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="grid");let d=this.hasAttribute(s("sh")),y=this.hasAttribute(s("sv")),x=this.getAttribute(s("overflow"));d&&y?(this._styles[e].overflow="auto",this._styles[e]["scrollbar-gutter"]="stable"):d?(this._styles[e]["overflow-x"]="auto",this._styles[e]["scrollbar-gutter"]="stable"):y&&(this._styles[e]["overflow-y"]="auto",this._styles[e]["scrollbar-gutter"]="stable"),x==="hidden"&&(this._styles[e].overflow="hidden")});let t=w(this._styles);t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}attributeChangedCallback(t,e,s){if(t==="href"||t==="new-tab"||t==="rel"){this._updateDOM();return}e!==s&&this.updateStyles()}},Ft=({render:i,html:t})=>lt;var Vt=c`
 
   :host([d="h"]) {
     flex-direction: row;
@@ -688,13 +688,13 @@ var rettangoli=(()=>{var $=`
 
 
         ${Y}
-        ${Dt}
+        ${Vt}
         ${f}
         ${m}
         ${K}
         ${W}
         ${$}
-      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styleElement=document.createElement("style"),this._slotElement=document.createElement("slot"),this._linkElement=null,this.shadow.appendChild(this._styleElement),this._updateDOM()}static get observedAttributes(){return["href","new-tab","rel",...g([...C,"op","wh","w","h","ar","bgi","bgs","bgp","bgr","hsb","hide","show","sh","sv","z","d","ah","av","wrap","no-wrap","overflow","stretch"])]}_styles=b();_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.hasAttribute("new-tab"),s=this.getAttribute("rel");this._linkElement=B({shadowRoot:this.shadow,slotElement:this._slotElement,linkElement:this._linkElement,href:t,newTab:e,rel:s})}connectedCallback(){this.updateStyles()}updateStyles(){this._styles=b(),S.forEach(e=>{let s=zt=>`${e==="default"?"":`${e}-`}${zt}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z")),a=P(this.getAttribute(s("ar"))),d=Q(this.getAttribute(s("bgi"))),y=Q(this.getAttribute(s("bgs"))),x=Q(this.getAttribute(s("bgp"))),k=Q(this.getAttribute(s("bgr")));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),a!==void 0&&(this._styles[e]["aspect-ratio"]=a),d!==null&&(this._styles[e]["background-image"]=d),y!==null&&(this._styles[e]["background-size"]=y),x!==null&&(this._styles[e]["background-position"]=x),k!==null&&(this._styles[e]["background-repeat"]=k),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)",allowFlexGrow:!0}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%",allowFlexGrow:!0}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="flex");let z=this.getAttribute(s("d")),A=this.getAttribute(s("ah")),E=this.getAttribute(s("av")),I=T({element:this,size:e,attr:"d"});z==="h"?this._styles[e]["flex-direction"]="row":z==="v"?this._styles[e]["flex-direction"]="column":e==="default"&&!z&&["sm","md","lg","xl"].some(ge=>this.hasAttribute(`${ge}-d`))&&(this._styles[e]["flex-direction"]="column");let H=I==="h",J=I==="v"||!I;H&&(A==="c"?this._styles[e]["justify-content"]="center":A==="e"?this._styles[e]["justify-content"]="flex-end":A==="s"&&(this._styles[e]["justify-content"]="flex-start"),E==="c"?(this._styles[e]["align-items"]="center",this._styles[e]["align-content"]="center"):E==="e"?(this._styles[e]["align-items"]="flex-end",this._styles[e]["align-content"]="flex-end"):E==="s"&&(this._styles[e]["align-items"]="flex-start")),J&&(A!==null||E!==null)&&(A==="c"?this._styles[e]["align-items"]="center":A==="e"?this._styles[e]["align-items"]="flex-end":A==="s"&&(this._styles[e]["align-items"]="flex-start"),E==="c"?this._styles[e]["justify-content"]="center":E==="e"?this._styles[e]["justify-content"]="flex-end":E==="s"&&(this._styles[e]["justify-content"]="flex-start"));let ce=this.hasAttribute(s("wrap")),ue=this.hasAttribute(s("no-wrap"));ce&&(this._styles[e]["flex-wrap"]="wrap"),ue&&(this._styles[e]["flex-wrap"]="nowrap"),this.hasAttribute(s("stretch"))&&(this._styles[e]["align-self"]="stretch");let kt=this.hasAttribute(s("sh")),It=this.hasAttribute(s("sv")),pe=this.hasAttribute(s("hsb")),me=this.getAttribute(s("overflow"));kt&&It?(this._styles[e].overflow="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"):kt?(this._styles[e]["overflow-x"]="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"):It&&(this._styles[e]["overflow-y"]="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"),me==="hidden"&&(this._styles[e].overflow="hidden",this._styles[e]["flex-wrap"]="nowrap"),pe&&(this._styles[e]["-ms-overflow-style"]="none",this._styles[e]["scrollbar-gutter"]="auto",this._styles[e]["scrollbar-width"]="none")});let t=w(this._styles);t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}attributeChangedCallback(t,e,s){if(t==="href"||t==="new-tab"||t==="rel"){this._updateDOM();return}e!==s&&this.updateStyles()}},Vt=({render:i,html:t})=>at;var Oe={ta:{s:"text-align: start;",c:"text-align: center;",e:"text-align: end;",j:"text-align: justify;"},s:{h1:`
+      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styleElement=document.createElement("style"),this._slotElement=document.createElement("slot"),this._linkElement=null,this.shadow.appendChild(this._styleElement),this._updateDOM()}static get observedAttributes(){return["href","new-tab","rel",...g([...C,"op","wh","w","h","ar","bgi","bgs","bgp","bgr","hsb","hide","show","sh","sv","z","d","ah","av","wrap","no-wrap","overflow","stretch"])]}_styles=b();_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.hasAttribute("new-tab"),s=this.getAttribute("rel");this._linkElement=B({shadowRoot:this.shadow,slotElement:this._slotElement,linkElement:this._linkElement,href:t,newTab:e,rel:s})}connectedCallback(){this.updateStyles()}updateStyles(){this._styles=b(),S.forEach(e=>{let s=zt=>`${e==="default"?"":`${e}-`}${zt}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z")),a=P(this.getAttribute(s("ar"))),d=Q(this.getAttribute(s("bgi"))),y=Q(this.getAttribute(s("bgs"))),x=Q(this.getAttribute(s("bgp"))),k=Q(this.getAttribute(s("bgr")));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),a!==void 0&&(this._styles[e]["aspect-ratio"]=a),d!==null&&(this._styles[e]["background-image"]=d),y!==null&&(this._styles[e]["background-size"]=y),x!==null&&(this._styles[e]["background-position"]=x),k!==null&&(this._styles[e]["background-repeat"]=k),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)",allowFlexGrow:!0}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%",allowFlexGrow:!0}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="flex");let z=this.getAttribute(s("d")),A=this.getAttribute(s("ah")),E=this.getAttribute(s("av")),I=T({element:this,size:e,attr:"d"});z==="h"?this._styles[e]["flex-direction"]="row":z==="v"?this._styles[e]["flex-direction"]="column":e==="default"&&!z&&["sm","md","lg","xl"].some(ge=>this.hasAttribute(`${ge}-d`))&&(this._styles[e]["flex-direction"]="column");let H=I==="h",J=I==="v"||!I;H&&(A==="c"?this._styles[e]["justify-content"]="center":A==="e"?this._styles[e]["justify-content"]="flex-end":A==="s"&&(this._styles[e]["justify-content"]="flex-start"),E==="c"?(this._styles[e]["align-items"]="center",this._styles[e]["align-content"]="center"):E==="e"?(this._styles[e]["align-items"]="flex-end",this._styles[e]["align-content"]="flex-end"):E==="s"&&(this._styles[e]["align-items"]="flex-start")),J&&(A!==null||E!==null)&&(A==="c"?this._styles[e]["align-items"]="center":A==="e"?this._styles[e]["align-items"]="flex-end":A==="s"&&(this._styles[e]["align-items"]="flex-start"),E==="c"?this._styles[e]["justify-content"]="center":E==="e"?this._styles[e]["justify-content"]="flex-end":E==="s"&&(this._styles[e]["justify-content"]="flex-start"));let ce=this.hasAttribute(s("wrap")),ue=this.hasAttribute(s("no-wrap"));ce&&(this._styles[e]["flex-wrap"]="wrap"),ue&&(this._styles[e]["flex-wrap"]="nowrap"),this.hasAttribute(s("stretch"))&&(this._styles[e]["align-self"]="stretch");let kt=this.hasAttribute(s("sh")),It=this.hasAttribute(s("sv")),pe=this.hasAttribute(s("hsb")),me=this.getAttribute(s("overflow"));kt&&It?(this._styles[e].overflow="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"):kt?(this._styles[e]["overflow-x"]="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"):It&&(this._styles[e]["overflow-y"]="auto",this._styles[e]["scrollbar-gutter"]="stable",this._styles[e]["flex-wrap"]="nowrap"),me==="hidden"&&(this._styles[e].overflow="hidden",this._styles[e]["flex-wrap"]="nowrap"),pe&&(this._styles[e]["-ms-overflow-style"]="none",this._styles[e]["scrollbar-gutter"]="auto",this._styles[e]["scrollbar-width"]="none")});let t=w(this._styles);t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}attributeChangedCallback(t,e,s){if(t==="href"||t==="new-tab"||t==="rel"){this._updateDOM();return}e!==s&&this.updateStyles()}},Dt=({render:i,html:t})=>at;var Oe={ta:{s:"text-align: start;",c:"text-align: center;",e:"text-align: end;",j:"text-align: justify;"},s:{h1:`
       font-size: var(--h1-font-size);
       font-weight: var(--h1-font-weight);
       line-height: var(--h1-line-height);
@@ -1160,7 +1160,7 @@ var rettangoli=(()=>{var $=`
         }
         ${f}
         ${m}
-      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles=b(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","type","placeholder","disabled","value","min","max","step","s",...g([...Ne,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_onInput=()=>{this.dispatchEvent(new CustomEvent("value-input",{detail:{value:this._inputElement.value},bubbles:!0}))};_onChange=()=>{this.dispatchEvent(new CustomEvent("value-change",{detail:{value:this._inputElement.value},bubbles:!0}))};attributeChangedCallback(t,e,s){if(e!==s){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(i.inputSpecificAttributes.includes(t)){this._updateInputAttributes();return}this.updateStyles()}}updateStyles(){this._styles=b(),S.forEach(e=>{let s=a=>`${e==="default"?"":`${e}-`}${a}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="block")});let t=w(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,e){if(e==null||e==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,e)}_syncValueAttribute(){this._inputElement.value=this.getAttribute("value")??""}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("type"),s=new Set(["text","password","date","time","datetime-local"]).has(t)?t:"text",r=this.getAttribute("min"),n=this.getAttribute("max"),o=this.getAttribute("step"),l=this.hasAttribute("disabled");this._setOrRemoveInputAttribute("type",s),this._setOrRemoveInputAttribute("min",r),this._setOrRemoveInputAttribute("max",n),this._setOrRemoveInputAttribute("step",o),l?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},L=({render:i,html:t})=>pt;var Fe=L({}),D="date",mt=class extends Fe{connectedCallback(){this.getAttribute("type")!==D&&super.setAttribute("type",D),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==D){this.getAttribute("type")!==D&&super.setAttribute("type",D);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},Zt=({render:i,html:t})=>mt;var De=L({}),V="time",gt=class extends De{connectedCallback(){this.getAttribute("type")!==V&&super.setAttribute("type",V),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==V){this.getAttribute("type")!==V&&super.setAttribute("type",V);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},Jt=({render:i,html:t})=>gt;var Ve=L({}),U="datetime-local",ft=class extends Ve{connectedCallback(){this.getAttribute("type")!==U&&super.setAttribute("type",U),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==U){this.getAttribute("type")!==U&&super.setAttribute("type",U);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},te=({render:i,html:t})=>ft;var Ue=["mt","mr","mb","ml","m","mh","mv","cur"],bt=class i extends HTMLElement{static styleSheet=null;static inputSpecificAttributes=["disabled","step","min","max","s"];static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(c`
+      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles=b(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","type","placeholder","disabled","value","min","max","step","s",...g([...Ne,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_onInput=()=>{this.dispatchEvent(new CustomEvent("value-input",{detail:{value:this._inputElement.value},bubbles:!0}))};_onChange=()=>{this.dispatchEvent(new CustomEvent("value-change",{detail:{value:this._inputElement.value},bubbles:!0}))};attributeChangedCallback(t,e,s){if(e!==s){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(i.inputSpecificAttributes.includes(t)){this._updateInputAttributes();return}this.updateStyles()}}updateStyles(){this._styles=b(),S.forEach(e=>{let s=a=>`${e==="default"?"":`${e}-`}${a}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="block")});let t=w(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,e){if(e==null||e==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,e)}_syncValueAttribute(){this._inputElement.value=this.getAttribute("value")??""}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("type"),s=new Set(["text","password","date","time","datetime-local"]).has(t)?t:"text",r=this.getAttribute("min"),n=this.getAttribute("max"),o=this.getAttribute("step"),l=this.hasAttribute("disabled");this._setOrRemoveInputAttribute("type",s),this._setOrRemoveInputAttribute("min",r),this._setOrRemoveInputAttribute("max",n),this._setOrRemoveInputAttribute("step",o),l?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},L=({render:i,html:t})=>pt;var Fe=L({}),V="date",mt=class extends Fe{connectedCallback(){this.getAttribute("type")!==V&&super.setAttribute("type",V),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==V){this.getAttribute("type")!==V&&super.setAttribute("type",V);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},Zt=({render:i,html:t})=>mt;var Ve=L({}),D="time",gt=class extends Ve{connectedCallback(){this.getAttribute("type")!==D&&super.setAttribute("type",D),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==D){this.getAttribute("type")!==D&&super.setAttribute("type",D);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},Jt=({render:i,html:t})=>gt;var De=L({}),U="datetime-local",ft=class extends De{connectedCallback(){this.getAttribute("type")!==U&&super.setAttribute("type",U),super.connectedCallback&&super.connectedCallback()}attributeChangedCallback(t,e,s){if(t==="type"&&s!==U){this.getAttribute("type")!==U&&super.setAttribute("type",U);return}super.attributeChangedCallback&&super.attributeChangedCallback(t,e,s)}},te=({render:i,html:t})=>ft;var Ue=["mt","mr","mb","ml","m","mh","mv","cur"],bt=class i extends HTMLElement{static styleSheet=null;static inputSpecificAttributes=["disabled","step","min","max","s"];static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(c`
         :host {
           display: contents;
         }
@@ -1195,7 +1195,7 @@ var rettangoli=(()=>{var $=`
         }
         ${f}
         ${m}
-      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles=b(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","placeholder","disabled","value","step","min","max","s",...g([...Ue,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_emitValueEvent=t=>{let e=this._inputElement.value;if(e.trim()===""){this.dispatchEvent(new CustomEvent(t,{detail:{value:null},bubbles:!0}));return}let s=parseFloat(e);isNaN(s)||(s=this._clampValueToBounds(s),this._inputElement.value=s.toString(),this.dispatchEvent(new CustomEvent(t,{detail:{value:s},bubbles:!0})))};_onInput=()=>{this._emitValueEvent("value-input")};_onChange=()=>{this._emitValueEvent("value-change")};attributeChangedCallback(t,e,s){if(e!==s){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(i.inputSpecificAttributes.includes(t)){this._updateInputAttributes(),(t==="min"||t==="max")&&this._syncValueAttribute();return}this.updateStyles()}}updateStyles(){this._styles=b(),S.forEach(e=>{let s=a=>`${e==="default"?"":`${e}-`}${a}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="block")});let t=w(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,e){if(e==null||e==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,e)}_clampValueToBounds(t){let e=t,s=this.getAttribute("min");if(s!==null){let n=parseFloat(s);isNaN(n)||(e=Math.max(e,n))}let r=this.getAttribute("max");if(r!==null){let n=parseFloat(r);isNaN(n)||(e=Math.min(e,n))}return e}_syncValueAttribute(){let t=this.getAttribute("value");if(t==null||t===""){this._inputElement.value="";return}let e=parseFloat(t);if(isNaN(e)){this._inputElement.value="";return}let s=this._clampValueToBounds(e);this._inputElement.value=s.toString()}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("step"),e=this.getAttribute("min"),s=this.getAttribute("max"),r=this.hasAttribute("disabled");this._inputElement.setAttribute("type","number"),this._setOrRemoveInputAttribute("step",t),this._setOrRemoveInputAttribute("min",e),this._setOrRemoveInputAttribute("max",s),r?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},ee=({render:i,html:t})=>bt;var vt=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(c`
+      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles=b(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","placeholder","disabled","value","step","min","max","s",...g([...Ue,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_emitValueEvent=(t,{commit:e=!1}={})=>{if(this._inputElement.value.trim()===""){if(this._inputElement.validity.badInput)return;this.dispatchEvent(new CustomEvent(t,{detail:{value:null},bubbles:!0}));return}let r=this._inputElement.valueAsNumber;if(!Number.isNaN(r)){let n=e?this._clampValueToBounds(r):r;e&&(this._inputElement.value=n.toString()),this.dispatchEvent(new CustomEvent(t,{detail:{value:n},bubbles:!0}))}};_onInput=()=>{this._emitValueEvent("value-input")};_onChange=()=>{this._emitValueEvent("value-change",{commit:!0})};attributeChangedCallback(t,e,s){if(e!==s){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(i.inputSpecificAttributes.includes(t)){this._updateInputAttributes(),(t==="min"||t==="max")&&this._syncValueAttribute();return}this.updateStyles()}}updateStyles(){this._styles=b(),S.forEach(e=>{let s=a=>`${e==="default"?"":`${e}-`}${a}`,r=this.getAttribute(s("wh")),n=u(r===null?this.getAttribute(s("w")):r),o=u(r===null?this.getAttribute(s("h")):r),l=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),l!==null&&(this._styles[e].opacity=l),v({styleBucket:this._styles[e],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),v({styleBucket:this._styles[e],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="block")});let t=w(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,e){if(e==null||e==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,e)}_clampValueToBounds(t){let e=t,s=this.getAttribute("min");if(s!==null){let n=parseFloat(s);isNaN(n)||(e=Math.max(e,n))}let r=this.getAttribute("max");if(r!==null){let n=parseFloat(r);isNaN(n)||(e=Math.min(e,n))}return e}_syncValueAttribute(){let t=this.getAttribute("value");if(t==null||t===""){this._inputElement.value="";return}let e=parseFloat(t);if(isNaN(e)){this._inputElement.value="";return}let s=this._clampValueToBounds(e);this._inputElement.value=s.toString()}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("step"),e=this.getAttribute("min"),s=this.getAttribute("max"),r=this.hasAttribute("disabled");this._inputElement.setAttribute("type","number"),this._setOrRemoveInputAttribute("step",t),this._setOrRemoveInputAttribute("min",e),this._setOrRemoveInputAttribute("max",s),r?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},ee=({render:i,html:t})=>bt;var vt=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(c`
         :host {
           display: contents;
         }
@@ -1540,4 +1540,4 @@ var rettangoli=(()=>{var $=`
         slot[name="content"] {
           display: contents;
         }
-      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._dialogElement=document.createElement("dialog"),this.shadow.appendChild(this._dialogElement),this._dialogElement.addEventListener("click",t=>{t.stopPropagation();let e=t.composedPath();(e[0]===this._dialogElement||e[0].nodeName==="DIALOG"&&e[0]===this._dialogElement)&&this._emitClose()}),this._dialogElement.addEventListener("contextmenu",t=>{let e=t.composedPath();(e[0]===this._dialogElement||e[0].nodeName==="DIALOG"&&e[0]===this._dialogElement)&&(t.preventDefault(),this._emitClose())}),this._dialogElement.addEventListener("cancel",t=>{t.preventDefault(),this._emitClose()}),this._popoverContainer=document.createElement("div"),this._popoverContainer.className="popover-container",this._dialogElement.appendChild(this._popoverContainer),this._slotElement=null,this._contentWrapper=null,this._isOpen=!1,this._positionFrameId=null,this._revealFrameId=null,this._positionVersion=0,this._isObservingResize=!1,this._isModalOpen=!1,this._observedContentWrapper=null,this._onWindowResize=()=>{this._updateActiveStateAttributes(),this._syncDialogMode(),this._schedulePositionUpdate()},this._resizeObserver=typeof ResizeObserver=="function"?new ResizeObserver(()=>{this._isOpen&&this._schedulePositionUpdate()}):null}_emitClose(){this.dispatchEvent(new CustomEvent("close",{detail:{},bubbles:!0}))}static get observedAttributes(){return["open","x","y",...g(["place","overlay","no-overlay"]),"content-w","content-h","content-wh","content-g","content-sv","content-hsb","content-ph","content-pv","content-bgc","content-style"]}connectedCallback(){this._syncContentWrapper({reposition:!1}),this._updateActiveStateAttributes(),this.hasAttribute("open")&&this._show()}disconnectedCallback(){this._cancelScheduledPositionUpdate(),this._stopResizeObserver(),window.removeEventListener("resize",this._onWindowResize),this._isOpen&&this._dialogElement.open&&this._dialogElement.close(),this._isModalOpen=!1}attributeChangedCallback(t,e,s){t==="open"?s!==null&&!this._isOpen?this.isConnected&&this._show():s===null&&this._isOpen&&this._hide():t==="x"||t==="y"||t.endsWith("place")?(this._updateActiveStateAttributes(),this._isOpen&&this._schedulePositionUpdate()):t.endsWith("overlay")?(this._updateActiveStateAttributes(),this._isOpen&&(this._syncDialogMode(),this._schedulePositionUpdate())):t.startsWith("content-")&&this._syncContentWrapper()}_getActiveResponsiveSize(){if(typeof window>"u"||typeof window.matchMedia!="function")return"default";for(let t of Qe){let e=O[t];if(e&&window.matchMedia(Ze(e)).matches)return t}return"default"}_getActiveResponsiveAttribute(t){return T({element:this,size:this._getActiveResponsiveSize(),attr:t})}_getActivePlace(){return this._getActiveResponsiveAttribute("place")||"bs"}_isOverlayActive(){return he(this._getActiveResponsiveAttribute("overlay"),!1)}_isNoOverlayActive(){return he(this._getActiveResponsiveAttribute("no-overlay"),!1)}_shouldUseModalDialog(){return this._isOverlayActive()||!this._isNoOverlayActive()}_updateActiveStateAttributes(){let t=this._getActivePlace(),e=this._isOverlayActive();this.getAttribute(ae)!==t&&this.setAttribute(ae,t),e?this.getAttribute(q)!=="true"&&this.setAttribute(q,"true"):this.hasAttribute(q)&&this.removeAttribute(q)}_openDialogElement(){this._dialogElement.open||(this._shouldUseModalDialog()?(this._dialogElement.showModal(),this._isModalOpen=!0):(this._dialogElement.show(),this._isModalOpen=!1))}_syncDialogMode(){!this._isOpen||!this._dialogElement.open||this._shouldUseModalDialog()===this._isModalOpen||(this._dialogElement.close(),this._isModalOpen=!1,this._openDialogElement())}_isIgnorableTextNode(t){return t?.nodeType===Node.TEXT_NODE&&t.textContent?.trim()===""}_ensureContentWrapper(){if(this._contentWrapper?.parentNode===this)return this._contentWrapper;let t=Array.from(this.children).find(e=>e.hasAttribute(le));return t?this._contentWrapper=t:(this._contentWrapper=document.createElement("rtgl-view"),this._contentWrapper.setAttribute(le,""),this._contentWrapper.setAttribute("part","content"),this._contentWrapper.setAttribute("bgc","su"),this._contentWrapper.setAttribute("bw","xs"),this._contentWrapper.setAttribute("bc","bo"),this._contentWrapper.setAttribute("br","md"),this._contentWrapper.setAttribute("ph","sm"),this._contentWrapper.setAttribute("pv","sm"),this._contentWrapper.setAttribute("style",At)),this._contentWrapper.parentNode!==this&&this.appendChild(this._contentWrapper),this._contentWrapper}_syncContentWrapperAttributes(){let t=this._ensureContentWrapper(),e=[["content-w","w"],["content-h","h"],["content-wh","wh"],["content-g","g"],["content-sv","sv"],["content-hsb","hsb"]];for(let[r,n]of e){let o=this.getAttribute(r);o===null?t.removeAttribute(n):t.setAttribute(n,o)}t.setAttribute("bgc",this.getAttribute("content-bgc")||"su"),t.setAttribute("ph",this.getAttribute("content-ph")||"sm"),t.setAttribute("pv",this.getAttribute("content-pv")||"sm");let s=this.getAttribute("content-style");t.setAttribute("style",s?`${At} ${s}`:At)}_syncContentWrapper({reposition:t=!0}={}){let e=this._ensureContentWrapper(),s=Array.from(this.childNodes).filter(n=>n!==e&&!this._isIgnorableTextNode(n));for(let n of s)n.nodeType===Node.ELEMENT_NODE&&n.getAttribute("slot")==="content"&&n.removeAttribute("slot"),e.appendChild(n);this._syncContentWrapperAttributes(),Array.from(e.childNodes).some(n=>!this._isIgnorableTextNode(n))||this.hasAttribute("open")?e.setAttribute("slot","content"):e.removeAttribute("slot"),t&&this._isOpen&&this._schedulePositionUpdate()}_show(){this._isOpen||(this._syncContentWrapper({reposition:!1}),this._updateActiveStateAttributes(),this._slotElement||(this._slotElement=document.createElement("slot"),this._slotElement.setAttribute("name","content"),this._popoverContainer.appendChild(this._slotElement)),this._isOpen=!0,this._startResizeObserver(),window.addEventListener("resize",this._onWindowResize),this._dialogElement.open?this._schedulePositionUpdate():setTimeout(()=>{this._isOpen&&this._dialogElement&&!this._dialogElement.open&&this._openDialogElement(),this._schedulePositionUpdate()},0))}_hide(){this._isOpen&&(this._isOpen=!1,this._cancelScheduledPositionUpdate(),this._stopResizeObserver(),window.removeEventListener("resize",this._onWindowResize),this._dialogElement.open&&this._dialogElement.close(),this._isModalOpen=!1,this._slotElement&&(this._popoverContainer.removeChild(this._slotElement),this._slotElement=null))}_startResizeObserver(){this._resizeObserver&&(this._isObservingResize||(this._resizeObserver.observe(this._popoverContainer),this._isObservingResize=!0),this._contentWrapper&&this._observedContentWrapper!==this._contentWrapper&&(this._observedContentWrapper&&this._resizeObserver.unobserve(this._observedContentWrapper),this._resizeObserver.observe(this._contentWrapper),this._observedContentWrapper=this._contentWrapper))}_stopResizeObserver(){this._resizeObserver?.disconnect(),this._isObservingResize=!1,this._observedContentWrapper=null}_cancelScheduledPositionUpdate(){this._positionFrameId!==null&&(cancelAnimationFrame(this._positionFrameId),this._positionFrameId=null),this._revealFrameId!==null&&(cancelAnimationFrame(this._revealFrameId),this._revealFrameId=null),this._positionVersion+=1,this.removeAttribute("positioned")}_readCoordinateAttr(t){let e=parseFloat(this.getAttribute(t)||"0");return Number.isFinite(e)?e:0}_schedulePositionUpdate(){this._isOpen&&(this.removeAttribute("positioned"),this._positionVersion+=1,this._positionFrameId===null&&(this._positionFrameId=requestAnimationFrame(()=>{if(this._positionFrameId=null,!this._isOpen)return;if(!this._dialogElement.open){this._schedulePositionUpdate();return}this._syncContentWrapper({reposition:!1}),this._startResizeObserver();let t=this._readCoordinateAttr("x"),e=this._readCoordinateAttr("y"),s=this._getActivePlace();this._updateActiveStateAttributes();let r=this._popoverContainer.getBoundingClientRect(),{left:n,top:o}=this._calculatePosition(t,e,r.width,r.height,s);this._popoverContainer.style.left=`${n}px`,this._popoverContainer.style.top=`${o}px`;let l=this._positionVersion;this._revealFrameId=requestAnimationFrame(()=>{this._revealFrameId=null,this._isOpen&&this._positionVersion===l&&this.setAttribute("positioned","")})})))}_calculatePosition(t,e,s,r,n){return oe({x:t,y:e,width:s,height:r,place:n,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight})}get popover(){return this._popoverContainer}get content(){return this._contentWrapper}refreshContent(){this._syncContentWrapper()}},de=({render:i,html:t})=>Ct;customElements.define("rtgl-button",Ot({}));customElements.define("rtgl-carousel",Nt({}));customElements.define("rtgl-grid",Ft({}));customElements.define("rtgl-view",Vt({}));customElements.define("rtgl-text",jt({}));customElements.define("rtgl-image",Gt({}));customElements.define("rtgl-tag",Yt({}));customElements.define("rtgl-svg",Qt({}));customElements.define("rtgl-input",L({}));customElements.define("rtgl-input-date",Zt({}));customElements.define("rtgl-input-time",Jt({}));customElements.define("rtgl-input-datetime",te({}));customElements.define("rtgl-input-number",ee({}));customElements.define("rtgl-textarea",ie({}));customElements.define("rtgl-color-picker",se({}));customElements.define("rtgl-slider",ne({}));customElements.define("rtgl-dialog",re({}));customElements.define("rtgl-popover",de({}));})();
+      `))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._dialogElement=document.createElement("dialog"),this.shadow.appendChild(this._dialogElement),this._dialogElement.addEventListener("click",t=>{t.stopPropagation();let e=t.composedPath();(e[0]===this._dialogElement||e[0].nodeName==="DIALOG"&&e[0]===this._dialogElement)&&this._emitClose()}),this._dialogElement.addEventListener("contextmenu",t=>{let e=t.composedPath();(e[0]===this._dialogElement||e[0].nodeName==="DIALOG"&&e[0]===this._dialogElement)&&(t.preventDefault(),this._emitClose())}),this._dialogElement.addEventListener("cancel",t=>{t.preventDefault(),this._emitClose()}),this._popoverContainer=document.createElement("div"),this._popoverContainer.className="popover-container",this._dialogElement.appendChild(this._popoverContainer),this._slotElement=null,this._contentWrapper=null,this._isOpen=!1,this._positionFrameId=null,this._revealFrameId=null,this._positionVersion=0,this._isObservingResize=!1,this._isModalOpen=!1,this._observedContentWrapper=null,this._onWindowResize=()=>{this._updateActiveStateAttributes(),this._syncDialogMode(),this._schedulePositionUpdate()},this._resizeObserver=typeof ResizeObserver=="function"?new ResizeObserver(()=>{this._isOpen&&this._schedulePositionUpdate()}):null}_emitClose(){this.dispatchEvent(new CustomEvent("close",{detail:{},bubbles:!0}))}static get observedAttributes(){return["open","x","y",...g(["place","overlay","no-overlay"]),"content-w","content-h","content-wh","content-g","content-sv","content-hsb","content-ph","content-pv","content-bgc","content-style"]}connectedCallback(){this._syncContentWrapper({reposition:!1}),this._updateActiveStateAttributes(),this.hasAttribute("open")&&this._show()}disconnectedCallback(){this._cancelScheduledPositionUpdate(),this._stopResizeObserver(),window.removeEventListener("resize",this._onWindowResize),this._isOpen&&this._dialogElement.open&&this._dialogElement.close(),this._isModalOpen=!1}attributeChangedCallback(t,e,s){t==="open"?s!==null&&!this._isOpen?this.isConnected&&this._show():s===null&&this._isOpen&&this._hide():t==="x"||t==="y"||t.endsWith("place")?(this._updateActiveStateAttributes(),this._isOpen&&this._schedulePositionUpdate()):t.endsWith("overlay")?(this._updateActiveStateAttributes(),this._isOpen&&(this._syncDialogMode(),this._schedulePositionUpdate())):t.startsWith("content-")&&this._syncContentWrapper()}_getActiveResponsiveSize(){if(typeof window>"u"||typeof window.matchMedia!="function")return"default";for(let t of Qe){let e=O[t];if(e&&window.matchMedia(Ze(e)).matches)return t}return"default"}_getActiveResponsiveAttribute(t){return T({element:this,size:this._getActiveResponsiveSize(),attr:t})}_getActivePlace(){return this._getActiveResponsiveAttribute("place")||"bs"}_isOverlayActive(){return he(this._getActiveResponsiveAttribute("overlay"),!1)}_isNoOverlayActive(){return he(this._getActiveResponsiveAttribute("no-overlay"),!1)}_shouldUseModalDialog(){return this._isOverlayActive()||!this._isNoOverlayActive()}_updateActiveStateAttributes(){let t=this._getActivePlace(),e=this._isOverlayActive();this.getAttribute(ae)!==t&&this.setAttribute(ae,t),e?this.getAttribute(q)!=="true"&&this.setAttribute(q,"true"):this.hasAttribute(q)&&this.removeAttribute(q)}_openDialogElement(){this._dialogElement.open||(this._shouldUseModalDialog()?(this._dialogElement.showModal(),this._isModalOpen=!0):(this._dialogElement.show(),this._isModalOpen=!1))}_syncDialogMode(){!this._isOpen||!this._dialogElement.open||this._shouldUseModalDialog()===this._isModalOpen||(this._dialogElement.close(),this._isModalOpen=!1,this._openDialogElement())}_isIgnorableTextNode(t){return t?.nodeType===Node.TEXT_NODE&&t.textContent?.trim()===""}_ensureContentWrapper(){if(this._contentWrapper?.parentNode===this)return this._contentWrapper;let t=Array.from(this.children).find(e=>e.hasAttribute(le));return t?this._contentWrapper=t:(this._contentWrapper=document.createElement("rtgl-view"),this._contentWrapper.setAttribute(le,""),this._contentWrapper.setAttribute("part","content"),this._contentWrapper.setAttribute("bgc","su"),this._contentWrapper.setAttribute("bw","xs"),this._contentWrapper.setAttribute("bc","bo"),this._contentWrapper.setAttribute("br","md"),this._contentWrapper.setAttribute("ph","sm"),this._contentWrapper.setAttribute("pv","sm"),this._contentWrapper.setAttribute("style",At)),this._contentWrapper.parentNode!==this&&this.appendChild(this._contentWrapper),this._contentWrapper}_syncContentWrapperAttributes(){let t=this._ensureContentWrapper(),e=[["content-w","w"],["content-h","h"],["content-wh","wh"],["content-g","g"],["content-sv","sv"],["content-hsb","hsb"]];for(let[r,n]of e){let o=this.getAttribute(r);o===null?t.removeAttribute(n):t.setAttribute(n,o)}t.setAttribute("bgc",this.getAttribute("content-bgc")||"su"),t.setAttribute("ph",this.getAttribute("content-ph")||"sm"),t.setAttribute("pv",this.getAttribute("content-pv")||"sm");let s=this.getAttribute("content-style");t.setAttribute("style",s?`${At} ${s}`:At)}_syncContentWrapper({reposition:t=!0}={}){let e=this._ensureContentWrapper(),s=Array.from(this.childNodes).filter(n=>n!==e&&!this._isIgnorableTextNode(n));for(let n of s)n.nodeType===Node.ELEMENT_NODE&&n.getAttribute("slot")==="content"&&n.removeAttribute("slot"),e.appendChild(n);this._syncContentWrapperAttributes(),Array.from(e.childNodes).some(n=>!this._isIgnorableTextNode(n))||this.hasAttribute("open")?e.setAttribute("slot","content"):e.removeAttribute("slot"),t&&this._isOpen&&this._schedulePositionUpdate()}_show(){this._isOpen||(this._syncContentWrapper({reposition:!1}),this._updateActiveStateAttributes(),this._slotElement||(this._slotElement=document.createElement("slot"),this._slotElement.setAttribute("name","content"),this._popoverContainer.appendChild(this._slotElement)),this._isOpen=!0,this._startResizeObserver(),window.addEventListener("resize",this._onWindowResize),this._dialogElement.open?this._schedulePositionUpdate():setTimeout(()=>{this._isOpen&&this._dialogElement&&!this._dialogElement.open&&this._openDialogElement(),this._schedulePositionUpdate()},0))}_hide(){this._isOpen&&(this._isOpen=!1,this._cancelScheduledPositionUpdate(),this._stopResizeObserver(),window.removeEventListener("resize",this._onWindowResize),this._dialogElement.open&&this._dialogElement.close(),this._isModalOpen=!1,this._slotElement&&(this._popoverContainer.removeChild(this._slotElement),this._slotElement=null))}_startResizeObserver(){this._resizeObserver&&(this._isObservingResize||(this._resizeObserver.observe(this._popoverContainer),this._isObservingResize=!0),this._contentWrapper&&this._observedContentWrapper!==this._contentWrapper&&(this._observedContentWrapper&&this._resizeObserver.unobserve(this._observedContentWrapper),this._resizeObserver.observe(this._contentWrapper),this._observedContentWrapper=this._contentWrapper))}_stopResizeObserver(){this._resizeObserver?.disconnect(),this._isObservingResize=!1,this._observedContentWrapper=null}_cancelScheduledPositionUpdate(){this._positionFrameId!==null&&(cancelAnimationFrame(this._positionFrameId),this._positionFrameId=null),this._revealFrameId!==null&&(cancelAnimationFrame(this._revealFrameId),this._revealFrameId=null),this._positionVersion+=1,this.removeAttribute("positioned")}_readCoordinateAttr(t){let e=parseFloat(this.getAttribute(t)||"0");return Number.isFinite(e)?e:0}_schedulePositionUpdate(){this._isOpen&&(this.removeAttribute("positioned"),this._positionVersion+=1,this._positionFrameId===null&&(this._positionFrameId=requestAnimationFrame(()=>{if(this._positionFrameId=null,!this._isOpen)return;if(!this._dialogElement.open){this._schedulePositionUpdate();return}this._syncContentWrapper({reposition:!1}),this._startResizeObserver();let t=this._readCoordinateAttr("x"),e=this._readCoordinateAttr("y"),s=this._getActivePlace();this._updateActiveStateAttributes();let r=this._popoverContainer.getBoundingClientRect(),{left:n,top:o}=this._calculatePosition(t,e,r.width,r.height,s);this._popoverContainer.style.left=`${n}px`,this._popoverContainer.style.top=`${o}px`;let l=this._positionVersion;this._revealFrameId=requestAnimationFrame(()=>{this._revealFrameId=null,this._isOpen&&this._positionVersion===l&&this.setAttribute("positioned","")})})))}_calculatePosition(t,e,s,r,n){return oe({x:t,y:e,width:s,height:r,place:n,viewportWidth:window.innerWidth,viewportHeight:window.innerHeight})}get popover(){return this._popoverContainer}get content(){return this._contentWrapper}refreshContent(){this._syncContentWrapper()}},de=({render:i,html:t})=>Ct;customElements.define("rtgl-button",Ot({}));customElements.define("rtgl-carousel",Nt({}));customElements.define("rtgl-grid",Ft({}));customElements.define("rtgl-view",Dt({}));customElements.define("rtgl-text",jt({}));customElements.define("rtgl-image",Gt({}));customElements.define("rtgl-tag",Yt({}));customElements.define("rtgl-svg",Qt({}));customElements.define("rtgl-input",L({}));customElements.define("rtgl-input-date",Zt({}));customElements.define("rtgl-input-time",Jt({}));customElements.define("rtgl-input-datetime",te({}));customElements.define("rtgl-input-number",ee({}));customElements.define("rtgl-textarea",ie({}));customElements.define("rtgl-color-picker",se({}));customElements.define("rtgl-slider",ne({}));customElements.define("rtgl-dialog",re({}));customElements.define("rtgl-popover",de({}));})();

package/dist/rettangoli-iife-ui.min.js

@@ -72,7 +72,7 @@ var rettangoli=(()=>{var _e=`
       background-color: var(--destructive);
       color: var(--primary-foreground);
     `,ol:`
-      background-color: transparent;
+      background-color: var(--background);
       color: var(--foreground);
       border-width: 1px;
     `,gh:`
@@ -1195,7 +1195,7 @@ var rettangoli=(()=>{var _e=`
         }
         ${M}
         ${P}
-      `))}constructor(){super(),e.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[e.styleSheet],this._styles=F(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","placeholder","disabled","value","step","min","max","s",...W([...ko,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_emitValueEvent=t=>{let s=this._inputElement.value;if(s.trim()===""){this.dispatchEvent(new CustomEvent(t,{detail:{value:null},bubbles:!0}));return}let r=parseFloat(s);isNaN(r)||(r=this._clampValueToBounds(r),this._inputElement.value=r.toString(),this.dispatchEvent(new CustomEvent(t,{detail:{value:r},bubbles:!0})))};_onInput=()=>{this._emitValueEvent("value-input")};_onChange=()=>{this._emitValueEvent("value-change")};attributeChangedCallback(t,s,r){if(s!==r){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(e.inputSpecificAttributes.includes(t)){this._updateInputAttributes(),(t==="min"||t==="max")&&this._syncValueAttribute();return}this.updateStyles()}}updateStyles(){this._styles=F(),te.forEach(s=>{let r=a=>`${s==="default"?"":`${s}-`}${a}`,i=this.getAttribute(r("wh")),n=T(i===null?this.getAttribute(r("w")):i),o=T(i===null?this.getAttribute(r("h")):i),p=this.getAttribute(r("op")),l=this.getAttribute(r("z"));l!==null&&(this._styles[s]["z-index"]=l),p!==null&&(this._styles[s].opacity=p),K({styleBucket:this._styles[s],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),K({styleBucket:this._styles[s],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(r("hide"))&&(this._styles[s].display="none"),this.hasAttribute(r("show"))&&(this._styles[s].display="block")});let t=G(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,s){if(s==null||s==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,s)}_clampValueToBounds(t){let s=t,r=this.getAttribute("min");if(r!==null){let n=parseFloat(r);isNaN(n)||(s=Math.max(s,n))}let i=this.getAttribute("max");if(i!==null){let n=parseFloat(i);isNaN(n)||(s=Math.min(s,n))}return s}_syncValueAttribute(){let t=this.getAttribute("value");if(t==null||t===""){this._inputElement.value="";return}let s=parseFloat(t);if(isNaN(s)){this._inputElement.value="";return}let r=this._clampValueToBounds(s);this._inputElement.value=r.toString()}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("step"),s=this.getAttribute("min"),r=this.getAttribute("max"),i=this.hasAttribute("disabled");this._inputElement.setAttribute("type","number"),this._setOrRemoveInputAttribute("step",t),this._setOrRemoveInputAttribute("min",s),this._setOrRemoveInputAttribute("max",r),i?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},Cr=({render:e,html:t})=>ts;var ss=class e extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){e.styleSheet||(e.styleSheet=new CSSStyleSheet,e.styleSheet.replaceSync(O`
+      `))}constructor(){super(),e.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[e.styleSheet],this._styles=F(),this._lastStyleString="",this._inputElement=document.createElement("input"),this._styleElement=document.createElement("style"),this.shadow.appendChild(this._styleElement),this.shadow.appendChild(this._inputElement),this._inputElement.addEventListener("input",this._onInput),this._inputElement.addEventListener("change",this._onChange)}static get observedAttributes(){return["key","placeholder","disabled","value","step","min","max","s",...W([...ko,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_emitValueEvent=(t,{commit:s=!1}={})=>{if(this._inputElement.value.trim()===""){if(this._inputElement.validity.badInput)return;this.dispatchEvent(new CustomEvent(t,{detail:{value:null},bubbles:!0}));return}let i=this._inputElement.valueAsNumber;if(!Number.isNaN(i)){let n=s?this._clampValueToBounds(i):i;s&&(this._inputElement.value=n.toString()),this.dispatchEvent(new CustomEvent(t,{detail:{value:n},bubbles:!0}))}};_onInput=()=>{this._emitValueEvent("value-input")};_onChange=()=>{this._emitValueEvent("value-change",{commit:!0})};attributeChangedCallback(t,s,r){if(s!==r){if(t==="key"){this._syncValueAttribute();return}if(t==="value"){this._syncValueAttribute();return}if(t==="placeholder"){this._syncPlaceholderAttribute();return}if(e.inputSpecificAttributes.includes(t)){this._updateInputAttributes(),(t==="min"||t==="max")&&this._syncValueAttribute();return}this.updateStyles()}}updateStyles(){this._styles=F(),te.forEach(s=>{let r=a=>`${s==="default"?"":`${s}-`}${a}`,i=this.getAttribute(r("wh")),n=T(i===null?this.getAttribute(r("w")):i),o=T(i===null?this.getAttribute(r("h")):i),p=this.getAttribute(r("op")),l=this.getAttribute(r("z"));l!==null&&(this._styles[s]["z-index"]=l),p!==null&&(this._styles[s].opacity=p),K({styleBucket:this._styles[s],axis:"width",dimension:n,fillValue:"var(--width-stretch)"}),K({styleBucket:this._styles[s],axis:"height",dimension:o,fillValue:"100%"}),this.hasAttribute(r("hide"))&&(this._styles[s].display="none"),this.hasAttribute(r("show"))&&(this._styles[s].display="block")});let t=G(this._styles,"input");t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}_setOrRemoveInputAttribute(t,s){if(s==null||s==="null"){this._inputElement.removeAttribute(t);return}this._inputElement.setAttribute(t,s)}_clampValueToBounds(t){let s=t,r=this.getAttribute("min");if(r!==null){let n=parseFloat(r);isNaN(n)||(s=Math.max(s,n))}let i=this.getAttribute("max");if(i!==null){let n=parseFloat(i);isNaN(n)||(s=Math.min(s,n))}return s}_syncValueAttribute(){let t=this.getAttribute("value");if(t==null||t===""){this._inputElement.value="";return}let s=parseFloat(t);if(isNaN(s)){this._inputElement.value="";return}let r=this._clampValueToBounds(s);this._inputElement.value=r.toString()}_syncPlaceholderAttribute(){this._setOrRemoveInputAttribute("placeholder",this.getAttribute("placeholder"))}_updateInputAttributes(){let t=this.getAttribute("step"),s=this.getAttribute("min"),r=this.getAttribute("max"),i=this.hasAttribute("disabled");this._inputElement.setAttribute("type","number"),this._setOrRemoveInputAttribute("step",t),this._setOrRemoveInputAttribute("min",s),this._setOrRemoveInputAttribute("max",r),i?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes(),this._syncValueAttribute(),this._syncPlaceholderAttribute(),this.updateStyles()}},Cr=({render:e,html:t})=>ts;var ss=class e extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){e.styleSheet||(e.styleSheet=new CSSStyleSheet,e.styleSheet.replaceSync(O`
         :host {
           display: contents;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rettangoli/ui",
-  "version": "1.9.0",
+  "version": "1.9.2",
   "description": "A UI component library for building web interfaces.",
   "main": "dist/rettangoli-esm.min.js",
   "type": "module",

package/src/primitives/input-number.js

@@ -123,9 +123,16 @@ class RettangoliInputNumberElement extends HTMLElement {
     this._inputElement.focus();
   }
 
-  _emitValueEvent = (eventName) => {
+  _emitValueEvent = (eventName, { commit = false } = {}) => {
     const inputValue = this._inputElement.value;
     if (inputValue.trim() === "") {
+      // Native number inputs expose incomplete values such as `1e` as an
+      // empty string with badInput=true. Keep the last valid form value until
+      // the editor becomes either a complete number or a genuine empty state.
+      if (this._inputElement.validity.badInput) {
+        return;
+      }
+
       this.dispatchEvent(new CustomEvent(eventName, {
         detail: {
           value: null,
@@ -135,16 +142,24 @@ class RettangoliInputNumberElement extends HTMLElement {
       return;
     }
 
-    let numericValue = parseFloat(inputValue);
+    const numericValue = this._inputElement.valueAsNumber;
 
     // Only process if the value is a valid number (not NaN)
-    if (!isNaN(numericValue)) {
-      numericValue = this._clampValueToBounds(numericValue);
-      this._inputElement.value = numericValue.toString();
+    if (!Number.isNaN(numericValue)) {
+      const nextValue = commit
+        ? this._clampValueToBounds(numericValue)
+        : numericValue;
+
+      // Preserve native editing states (for example a trailing decimal) while
+      // typing. Rewriting the value on every input event resets the caret and
+      // makes decimal entry and deletion unreliable.
+      if (commit) {
+        this._inputElement.value = nextValue.toString();
+      }
 
       this.dispatchEvent(new CustomEvent(eventName, {
         detail: {
-          value: numericValue,
+          value: nextValue,
         },
         bubbles: true,
       }));
@@ -156,7 +171,7 @@ class RettangoliInputNumberElement extends HTMLElement {
   };
 
   _onChange = () => {
-    this._emitValueEvent('value-change');
+    this._emitValueEvent('value-change', { commit: true });
   };
 
   attributeChangedCallback(name, oldValue, newValue) {

package/src/styles/buttonMarginStyles.js

@@ -57,7 +57,7 @@ const styles = {
       color: var(--primary-foreground);
     `,
     ol: `
-      background-color: transparent;
+      background-color: var(--background);
       color: var(--foreground);
       border-width: 1px;
     `,