@rettangoli/ui 0.1.18 → 0.1.19
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.
|
@@ -394,7 +394,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
394
394
|
left: 0;
|
|
395
395
|
top: 0;
|
|
396
396
|
height: 100%;
|
|
397
|
-
`},shadow:{sm:"--shadow-sm",md:"--shadow-md",lg:"--shadow-lg"},pt:r,pr:r,pb:r,pl:r,p:r,ph:r,pv:r,g:r,gv:r,gh:r,bw:E,bwt:E,bwr:E,bwb:E,bwl:E,bc:{pr:"--primary",se:"--secondary",de:"--destructive",fg:"--foreground",bg:"--background",mu:"--muted",ac:"--accent",bo:"--border",tr:"transparent"},br:{xs:"--border-radius-xs",sm:"--border-radius-sm",md:"--border-radius-md",lg:"--border-radius-lg",xl:"--border-radius-xl",f:"--border-radius-f"}},C=u(dt);var ct={mt:r,mr:r,mb:r,ml:r,m:r,mh:r,mv:r},v=u(ct);var
|
|
397
|
+
`},shadow:{sm:"--shadow-sm",md:"--shadow-md",lg:"--shadow-lg"},pt:r,pr:r,pb:r,pl:r,p:r,ph:r,pv:r,g:r,gv:r,gh:r,bw:E,bwt:E,bwr:E,bwb:E,bwl:E,bc:{pr:"--primary",se:"--secondary",de:"--destructive",fg:"--foreground",bg:"--background",mu:"--muted",ac:"--accent",bo:"--border",tr:"transparent"},br:{xs:"--border-radius-xs",sm:"--border-radius-sm",md:"--border-radius-md",lg:"--border-radius-lg",xl:"--border-radius-xl",f:"--border-radius-f"}},C=u(dt);var ct={mt:r,mr:r,mb:r,ml:r,m:r,mh:r,mv:r},v=u(ct);var D=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
398
398
|
slot {
|
|
399
399
|
display: contents;
|
|
400
400
|
}
|
|
@@ -434,7 +434,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
434
434
|
bottom: 0;
|
|
435
435
|
z-index: 1;
|
|
436
436
|
}
|
|
437
|
-
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),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","target","op",...w([...y,"wh","w","h","hide","show","sh","sv","z","d","ah","av","flex","fw","overflow"])]}_styles={default:{},sm:{},md:{},lg:{},xl:{}};_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.getAttribute("target");this._slotElement.parentNode!==this.shadow&&this.shadow.appendChild(this._slotElement),t?(this._linkElement||(this._linkElement=document.createElement("a"),this.shadow.appendChild(this._linkElement)),this._linkElement.href=t,e?this._linkElement.target=e:this._linkElement.removeAttribute("target")):this._linkElement&&(this.shadow.removeChild(this._linkElement),this._linkElement=null)}connectedCallback(){this.updateStyles()}updateStyles(){this._styles={default:{},sm:{},md:{},lg:{},xl:{}},["default","sm","md","lg","xl"].forEach(e=>{let s=q=>`${e==="default"?"":`${e}-`}${q}`,o=this.getAttribute(s("wh")),n=p(o===null?this.getAttribute(s("w")):o),l=p(o===null?this.getAttribute(s("h")):o),c=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),c!==null&&(this._styles[e].opacity=c),n==="f"?this._styles[e].width="var(--width-stretch)":n!==void 0&&(this._styles[e].width=n,this._styles[e]["min-width"]=n,this._styles[e]["max-width"]=n),l==="f"?this._styles[e].height="100%":l!==void 0&&(this._styles[e].height=l,this._styles[e]["min-height"]=l,this._styles[e]["max-height"]=l),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="flex");let d=this.getAttribute(s("d")),g=this.getAttribute(s("ah")),m=this.getAttribute(s("av"));d==="h"?this._styles[e]["flex-direction"]="row":d==="v"?this._styles[e]["flex-direction"]="column":e==="default"&&!d&&["sm","md","lg","xl"].some(st=>this.hasAttribute(`${st}-d`))&&(this._styles[e]["flex-direction"]="column");let b=d==="h",A=d==="v"||!d;b&&(g==="c"?this._styles[e]["justify-content"]="center":g==="e"?this._styles[e]["justify-content"]="flex-end":g==="s"&&(this._styles[e]["justify-content"]="flex-start"),m==="c"?(this._styles[e]["align-items"]="center",this._styles[e]["align-content"]="center"):m==="e"?(this._styles[e]["align-items"]="flex-end",this._styles[e]["align-content"]="flex-end"):m==="s"&&(this._styles[e]["align-items"]="flex-start")),A&&(g!==null||m!==null)&&(g==="c"?this._styles[e]["align-items"]="center":g==="e"?this._styles[e]["align-items"]="flex-end":g==="s"&&(this._styles[e]["align-items"]="flex-start"),m==="c"?this._styles[e]["justify-content"]="center":m==="e"?this._styles[e]["justify-content"]="flex-end":m==="s"&&(this._styles[e]["justify-content"]="flex-start"));let z=this.getAttribute(s("flex"));z!==null&&(this._styles[e].flex=z),this.getAttribute(s("fw"))==="w"&&(this._styles[e]["flex-wrap"]="wrap");let k=this.hasAttribute(s("sh")),
|
|
437
|
+
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),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","target","op",...w([...y,"wh","w","h","hide","show","sh","sv","z","d","ah","av","flex","fw","overflow"])]}_styles={default:{},sm:{},md:{},lg:{},xl:{}};_lastStyleString="";_updateDOM(){let t=this.getAttribute("href"),e=this.getAttribute("target");this._slotElement.parentNode!==this.shadow&&this.shadow.appendChild(this._slotElement),t?(this._linkElement||(this._linkElement=document.createElement("a"),this.shadow.appendChild(this._linkElement)),this._linkElement.href=t,e?this._linkElement.target=e:this._linkElement.removeAttribute("target")):this._linkElement&&(this.shadow.removeChild(this._linkElement),this._linkElement=null)}connectedCallback(){this.updateStyles()}updateStyles(){this._styles={default:{},sm:{},md:{},lg:{},xl:{}},["default","sm","md","lg","xl"].forEach(e=>{let s=q=>`${e==="default"?"":`${e}-`}${q}`,o=this.getAttribute(s("wh")),n=p(o===null?this.getAttribute(s("w")):o),l=p(o===null?this.getAttribute(s("h")):o),c=this.getAttribute(s("op")),h=this.getAttribute(s("z"));h!==null&&(this._styles[e]["z-index"]=h),c!==null&&(this._styles[e].opacity=c),n==="f"?this._styles[e].width="var(--width-stretch)":n!==void 0&&(this._styles[e].width=n,this._styles[e]["min-width"]=n,this._styles[e]["max-width"]=n),l==="f"?this._styles[e].height="100%":l!==void 0&&(this._styles[e].height=l,this._styles[e]["min-height"]=l,this._styles[e]["max-height"]=l),this.hasAttribute(s("hide"))&&(this._styles[e].display="none"),this.hasAttribute(s("show"))&&(this._styles[e].display="flex");let d=this.getAttribute(s("d")),g=this.getAttribute(s("ah")),m=this.getAttribute(s("av"));d==="h"?this._styles[e]["flex-direction"]="row":d==="v"?this._styles[e]["flex-direction"]="column":e==="default"&&!d&&["sm","md","lg","xl"].some(st=>this.hasAttribute(`${st}-d`))&&(this._styles[e]["flex-direction"]="column");let b=d==="h",A=d==="v"||!d;b&&(g==="c"?this._styles[e]["justify-content"]="center":g==="e"?this._styles[e]["justify-content"]="flex-end":g==="s"&&(this._styles[e]["justify-content"]="flex-start"),m==="c"?(this._styles[e]["align-items"]="center",this._styles[e]["align-content"]="center"):m==="e"?(this._styles[e]["align-items"]="flex-end",this._styles[e]["align-content"]="flex-end"):m==="s"&&(this._styles[e]["align-items"]="flex-start")),A&&(g!==null||m!==null)&&(g==="c"?this._styles[e]["align-items"]="center":g==="e"?this._styles[e]["align-items"]="flex-end":g==="s"&&(this._styles[e]["align-items"]="flex-start"),m==="c"?this._styles[e]["justify-content"]="center":m==="e"?this._styles[e]["justify-content"]="flex-end":m==="s"&&(this._styles[e]["justify-content"]="flex-start"));let z=this.getAttribute(s("flex"));z!==null&&(this._styles[e].flex=z),this.getAttribute(s("fw"))==="w"&&(this._styles[e]["flex-wrap"]="wrap");let k=this.hasAttribute(s("sh")),L=this.hasAttribute(s("sv")),it=this.getAttribute(s("overflow"));k&&L?(this._styles[e].overflow="scroll",this._styles[e]["flex-wrap"]="nowrap"):k?(this._styles[e]["overflow-x"]="scroll",this._styles[e]["flex-wrap"]="nowrap"):L&&(this._styles[e]["overflow-y"]="scroll",this._styles[e]["flex-wrap"]="nowrap"),it==="hidden"&&(this._styles[e].overflow="hidden",this._styles[e]["flex-wrap"]="nowrap")});let t=x(this._styles);t!==this._lastStyleString&&(this._styleElement.textContent=t,this._lastStyleString=t)}attributeChangedCallback(t,e,s){if(t==="href"||t==="target"){this._updateDOM();return}e!==s&&this.updateStyles()}},K=({render:i,html:t})=>D;var gt={ta:{s:"start",c:"center",e:"end",j:"justify"},s:{h1:`
|
|
438
438
|
font-size: var(--h1-font-size);
|
|
439
439
|
font-weight: var(--h1-font-weight);
|
|
440
440
|
line-height: var(--h1-line-height);
|
|
@@ -474,7 +474,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
474
474
|
font-weight: var(--xs-font-weight);
|
|
475
475
|
line-height: var(--xs-line-height);
|
|
476
476
|
letter-spacing: var(--xs-letter-spacing);
|
|
477
|
-
`}},Q=u(gt);var pt={c:{fg:"--foreground",de:"--destructive","pr-fg":"--primary-foreground","se-fg":"--secondary-foreground","mu-fg":"--muted-foreground","ac-fg":"--accent-foreground"}},$=u(pt);var
|
|
477
|
+
`}},Q=u(gt);var pt={c:{fg:"--foreground",de:"--destructive","pr-fg":"--primary-foreground","se-fg":"--secondary-foreground","mu-fg":"--muted-foreground","ac-fg":"--accent-foreground"}},$=u(pt);var W=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
478
478
|
:host {
|
|
479
479
|
display: block;
|
|
480
480
|
font-size: var(--md-font-size);
|
|
@@ -509,7 +509,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
509
509
|
${$}
|
|
510
510
|
${v}
|
|
511
511
|
${f}
|
|
512
|
-
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._slotElement=document.createElement("slot"),this._linkElement=null,this._updateDOM()}static get observedAttributes(){return["key","w","ellipsis","href","target"]}connectedCallback(){this._updateStyling(),this._updateDOM()}attributeChangedCallback(t,e,s){t==="href"||t==="target"?this._updateDOM():this._updateStyling()}_updateStyling(){let t=p(this.getAttribute("w"));this.hasAttribute("ellipsis")?(this.style.overflow="hidden",this.style.textOverflow="ellipsis",this.style.whiteSpace="nowrap"):(this.style.overflow="",this.style.textOverflow="",this.style.whiteSpace=""),t==="f"?this.style.width="var(--width-stretch)":t!==void 0?this.style.width=t:this.style.width=""}_updateDOM(){let t=this.getAttribute("href"),e=this.getAttribute("target");this._slotElement.parentNode!==this.shadow&&this.shadow.appendChild(this._slotElement),t?(this._linkElement||(this._linkElement=document.createElement("a"),this.shadow.appendChild(this._linkElement)),this._linkElement.href=t,e?this._linkElement.target=e:this._linkElement.removeAttribute("target")):this._linkElement&&(this.shadow.removeChild(this._linkElement),this._linkElement=null)}},G=({render:i,html:t})=>
|
|
512
|
+
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._slotElement=document.createElement("slot"),this._linkElement=null,this._updateDOM()}static get observedAttributes(){return["key","w","ellipsis","href","target"]}connectedCallback(){this._updateStyling(),this._updateDOM()}attributeChangedCallback(t,e,s){t==="href"||t==="target"?this._updateDOM():this._updateStyling()}_updateStyling(){let t=p(this.getAttribute("w"));this.hasAttribute("ellipsis")?(this.style.overflow="hidden",this.style.textOverflow="ellipsis",this.style.whiteSpace="nowrap"):(this.style.overflow="",this.style.textOverflow="",this.style.whiteSpace=""),t==="f"?this.style.width="var(--width-stretch)":t!==void 0?this.style.width=t:this.style.width=""}_updateDOM(){let t=this.getAttribute("href"),e=this.getAttribute("target");this._slotElement.parentNode!==this.shadow&&this.shadow.appendChild(this._slotElement),t?(this._linkElement||(this._linkElement=document.createElement("a"),this.shadow.appendChild(this._linkElement)),this._linkElement.href=t,e?this._linkElement.target=e:this._linkElement.removeAttribute("target")):this._linkElement&&(this.shadow.removeChild(this._linkElement),this._linkElement=null)}},G=({render:i,html:t})=>W;var O=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
513
513
|
:host {
|
|
514
514
|
border-style: solid;
|
|
515
515
|
box-sizing: border-box;
|
|
@@ -673,7 +673,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
673
673
|
${v}
|
|
674
674
|
${_}
|
|
675
675
|
${f}
|
|
676
|
-
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet]}static get observedAttributes(){return["key","svg","w","h","wh"]}static get icons(){return i._icons}static addIcon(t,e){i._icons[t]=e}connectedCallback(){this._updateSizing(),this._render()}attributeChangedCallback(t,e,s){this._updateSizing(),this._render()}_updateSizing(){let t=this.getAttribute("wh"),e=p(t===null?this.getAttribute("w"):t),s=p(t===null?this.getAttribute("h"):t);e&&(this.style.width=e),s&&(this.style.height=s)}_render(){try{let t=this.getAttribute("svg"),e=i._icons[t]||(window.rtglIcons||{})[t];if(e){this.shadow.innerHTML=e;return}}catch(t){console.log("error in rtgl-svg render",t)}this.shadow.innerHTML=""}},Y=({render:i,html:t})=>T;var
|
|
676
|
+
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet]}static get observedAttributes(){return["key","svg","w","h","wh"]}static get icons(){return i._icons}static addIcon(t,e){i._icons[t]=e}connectedCallback(){this._updateSizing(),this._render()}attributeChangedCallback(t,e,s){this._updateSizing(),this._render()}_updateSizing(){let t=this.getAttribute("wh"),e=p(t===null?this.getAttribute("w"):t),s=p(t===null?this.getAttribute("h"):t);e&&(this.style.width=e),s&&(this.style.height=s)}_render(){try{let t=this.getAttribute("svg"),e=i._icons[t]||(window.rtglIcons||{})[t];if(e){this.shadow.innerHTML=e;return}}catch(t){console.log("error in rtgl-svg render",t)}this.shadow.innerHTML=""}},Y=({render:i,html:t})=>T;var I=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
677
677
|
:host {
|
|
678
678
|
display: contents;
|
|
679
679
|
}
|
|
@@ -708,7 +708,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
708
708
|
}
|
|
709
709
|
${v}
|
|
710
710
|
${f}
|
|
711
|
-
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles={default:{},sm:{},md:{},lg:{},xl:{}},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._onChange)}static get observedAttributes(){return["key","type","placeholder","disabled","value","s",...w([...y,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_onChange=t=>{this.dispatchEvent(new CustomEvent("input-change",{detail:{value:this._inputElement.value}}))};attributeChangedCallback(t,e,s){if(t==="value"&&requestAnimationFrame(()=>{let n=this.getAttribute("value");this._inputElement.value=n??""}),t==="placeholder"&&requestAnimationFrame(()=>{let n=this.getAttribute("placeholder");n===void 0||n==="null"?this._inputElement.removeAttribute("placeholder"):this._inputElement.setAttribute("placeholder",n??"")}),["type","disabled","step","s"].includes(t)){this._updateInputAttributes();return}this._styles={default:{},sm:{},md:{},lg:{},xl:{}},["default","sm","md","lg","xl"].forEach(n=>{let l=b=>`${n==="default"?"":`${n}-`}${b}`,c=this.getAttribute(l("wh")),h=p(c===null?this.getAttribute(l("w")):c),d=p(c===null?this.getAttribute(l("h")):c),g=this.getAttribute(l("op")),m=this.getAttribute(l("z"));m!==null&&(this._styles[n]["z-index"]=m),g!==null&&(this._styles[n].opacity=g),h==="f"?this._styles[n].width="var(--width-stretch)":h!==void 0&&(this._styles[n].width=h,this._styles[n]["min-width"]=h,this._styles[n]["max-width"]=h),d==="f"?this._styles[n].height="100%":d!==void 0&&(this._styles[n].height=d,this._styles[n]["min-height"]=d,this._styles[n]["max-height"]=d),this.hasAttribute(l("hide"))&&(this._styles[n].display="none !important"),this.hasAttribute(l("show"))&&(this._styles[n].display="block !important")});let o=x(this._styles,"input");o!==this._lastStyleString&&(this._styleElement.textContent=o,this._lastStyleString=o)}_updateInputAttributes(){let t=this.getAttribute("type")||"text",e=this.getAttribute("step"),s=this.hasAttribute("disabled");this._inputElement.setAttribute("type",t),e!==null?this._inputElement.setAttribute("step",e):this._inputElement.removeAttribute("step"),s?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes()}},Z=({render:i,html:t})=>
|
|
711
|
+
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._styles={default:{},sm:{},md:{},lg:{},xl:{}},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._onChange)}static get observedAttributes(){return["key","type","placeholder","disabled","value","s",...w([...y,"wh","w","h","hide","show","op","z"])]}get value(){return this._inputElement.value}set value(t){this._inputElement.value=t}focus(){this._inputElement.focus()}_onChange=t=>{this.dispatchEvent(new CustomEvent("input-change",{detail:{value:this._inputElement.value}}))};attributeChangedCallback(t,e,s){if(t==="value"&&requestAnimationFrame(()=>{let n=this.getAttribute("value");this._inputElement.value=n??""}),t==="placeholder"&&requestAnimationFrame(()=>{let n=this.getAttribute("placeholder");n===void 0||n==="null"?this._inputElement.removeAttribute("placeholder"):this._inputElement.setAttribute("placeholder",n??"")}),["type","disabled","step","s"].includes(t)){this._updateInputAttributes();return}this._styles={default:{},sm:{},md:{},lg:{},xl:{}},["default","sm","md","lg","xl"].forEach(n=>{let l=b=>`${n==="default"?"":`${n}-`}${b}`,c=this.getAttribute(l("wh")),h=p(c===null?this.getAttribute(l("w")):c),d=p(c===null?this.getAttribute(l("h")):c),g=this.getAttribute(l("op")),m=this.getAttribute(l("z"));m!==null&&(this._styles[n]["z-index"]=m),g!==null&&(this._styles[n].opacity=g),h==="f"?this._styles[n].width="var(--width-stretch)":h!==void 0&&(this._styles[n].width=h,this._styles[n]["min-width"]=h,this._styles[n]["max-width"]=h),d==="f"?this._styles[n].height="100%":d!==void 0&&(this._styles[n].height=d,this._styles[n]["min-height"]=d,this._styles[n]["max-height"]=d),this.hasAttribute(l("hide"))&&(this._styles[n].display="none !important"),this.hasAttribute(l("show"))&&(this._styles[n].display="block !important")});let o=x(this._styles,"input");o!==this._lastStyleString&&(this._styleElement.textContent=o,this._lastStyleString=o)}_updateInputAttributes(){let t=this.getAttribute("type")||"text",e=this.getAttribute("step"),s=this.hasAttribute("disabled");this._inputElement.setAttribute("type",t),e!==null?this._inputElement.setAttribute("step",e):this._inputElement.removeAttribute("step"),s?this._inputElement.setAttribute("disabled",""):this._inputElement.removeAttribute("disabled")}connectedCallback(){this._updateInputAttributes()}},Z=({render:i,html:t})=>I;var H=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
712
712
|
:host {
|
|
713
713
|
display: contents;
|
|
714
714
|
}
|
|
@@ -733,7 +733,7 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
733
733
|
}
|
|
734
734
|
${v}
|
|
735
735
|
${f}
|
|
736
|
-
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._textareaElement=document.createElement("textarea"),this._textareaElement.setAttribute("type","text"),this.shadow.appendChild(this._textareaElement),this._textareaElement.addEventListener("input",this._onChange)}_onChange=t=>{this.dispatchEvent(new CustomEvent("textarea-change",{detail:{value:this._textareaElement.value}}))};static get observedAttributes(){return["key","w","ellipsis","cols","rows","placeholder","value"]}get value(){return this._textareaElement.value}set value(t){this._textareaElement.value=t}connectedCallback(){this._updateTextareaAttributes()}attributeChangedCallback(t,e,s){if(t==="key"&&e!==s){requestAnimationFrame(()=>{let o=this.getAttribute("value");this._textareaElement.value=o??""});return}this._updateTextareaAttributes()}_updateTextareaAttributes(){let t=this.getAttribute("cols"),e=this.getAttribute("rows"),s=this.getAttribute("placeholder"),o=this.getAttribute("value");t!==null?this._textareaElement.setAttribute("cols",t):this._textareaElement.removeAttribute("cols"),e!==null?this._textareaElement.setAttribute("rows",e):this._textareaElement.removeAttribute("rows"),s!==null?this._textareaElement.setAttribute("placeholder",s):this._textareaElement.removeAttribute("placeholder"),o!==null&&(this._textareaElement.value=o)}},tt=({render:i,html:t})=>
|
|
736
|
+
`))}constructor(){super(),i.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"closed"}),this.shadow.adoptedStyleSheets=[i.styleSheet],this._textareaElement=document.createElement("textarea"),this._textareaElement.setAttribute("type","text"),this.shadow.appendChild(this._textareaElement),this._textareaElement.addEventListener("input",this._onChange)}_onChange=t=>{this.dispatchEvent(new CustomEvent("textarea-change",{detail:{value:this._textareaElement.value}}))};static get observedAttributes(){return["key","w","ellipsis","cols","rows","placeholder","value"]}get value(){return this._textareaElement.value}set value(t){this._textareaElement.value=t}connectedCallback(){this._updateTextareaAttributes()}attributeChangedCallback(t,e,s){if(t==="key"&&e!==s){requestAnimationFrame(()=>{let o=this.getAttribute("value");this._textareaElement.value=o??""});return}this._updateTextareaAttributes()}_updateTextareaAttributes(){let t=this.getAttribute("cols"),e=this.getAttribute("rows"),s=this.getAttribute("placeholder"),o=this.getAttribute("value");t!==null?this._textareaElement.setAttribute("cols",t):this._textareaElement.removeAttribute("cols"),e!==null?this._textareaElement.setAttribute("rows",e):this._textareaElement.removeAttribute("rows"),s!==null?this._textareaElement.setAttribute("placeholder",s):this._textareaElement.removeAttribute("placeholder"),o!==null&&(this._textareaElement.value=o)}},tt=({render:i,html:t})=>H;var B=class i extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){i.styleSheet||(i.styleSheet=new CSSStyleSheet,i.styleSheet.replaceSync(a`
|
|
737
737
|
:host {
|
|
738
738
|
display: contents;
|
|
739
739
|
}
|
|
@@ -804,4 +804,4 @@ var rettangoli=(()=>{function a(i,...t){let e="";return i.forEach((s,o)=>{e+=s+(
|
|
|
804
804
|
dialog[open] slot[name="content"] {
|
|
805
805
|
animation: dialog-in 150ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
806
806
|
}
|
|
807
|
-
`))}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._slotElement=null,this._isConnected=!1,this._dialogElement.addEventListener("
|
|
807
|
+
`))}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._slotElement=null,this._isConnected=!1,this._mouseDownInContent=!1,this._dialogElement.addEventListener("mousedown",t=>{this._mouseDownInContent=t.target!==this._dialogElement}),this._dialogElement.addEventListener("click",t=>{t.target===this._dialogElement&&!this._mouseDownInContent&&this._attemptClose(),this._mouseDownInContent=!1}),this._dialogElement.addEventListener("contextmenu",t=>{t.target===this._dialogElement&&!this._mouseDownInContent&&(t.preventDefault(),this._attemptClose()),this._mouseDownInContent=!1}),this._dialogElement.addEventListener("cancel",t=>{t.preventDefault(),this._attemptClose()})}_attemptClose(){this.dispatchEvent(new CustomEvent("close",{detail:{}}))}static get observedAttributes(){return["open","w","s"]}connectedCallback(){this._updateDialog(),this._isConnected=!0,this.hasAttribute("open")&&this._showModal()}attributeChangedCallback(t,e,s){t==="open"?s!==null&&!this._dialogElement.open&&this._isConnected?this._showModal():s===null&&this._dialogElement.open&&this._hideModal():t==="w"&&this._updateWidth()}_updateDialog(){this._updateWidth()}_updateWidth(){let t=this.getAttribute("w");t?this._dialogElement.style.width=t:this._dialogElement.style.width=""}_showModal(){this._dialogElement.open||(this._slotElement||(this._slotElement=document.createElement("slot"),this._slotElement.setAttribute("name","content"),this._dialogElement.appendChild(this._slotElement)),this._dialogElement.showModal(),this._dialogElement.scrollTop=0,this._applyAdaptiveCentering())}_hideModal(){this._dialogElement.open&&(this._dialogElement.close(),this._slotElement&&(this._slotElement.style.marginTop="",this._slotElement.style.marginBottom="",this._dialogElement.removeChild(this._slotElement),this._slotElement=null),this._dialogElement.style.height="")}_applyAdaptiveCentering(){this._slotElement&&requestAnimationFrame(()=>{if(!this._slotElement)return;let t=this._slotElement.offsetHeight,e=window.innerHeight,s=40;if(t>=e-2*s)this._slotElement.style.marginTop=`${s}px`,this._slotElement.style.marginBottom=`${s}px`,this._dialogElement.style.height="100vh";else{let o=e-t,n=Math.floor(o/2);this._slotElement.style.marginTop=`${n}px`,this._slotElement.style.marginBottom=`${n}px`,this._dialogElement.style.height="auto"}})}get dialog(){return this._dialogElement}},et=({render:i,html:t})=>B;customElements.define("rtgl-button",P({}));customElements.define("rtgl-view",K({}));customElements.define("rtgl-text",G({}));customElements.define("rtgl-image",J({}));customElements.define("rtgl-svg",Y({}));customElements.define("rtgl-input",Z({}));customElements.define("rtgl-textarea",tt({}));customElements.define("rtgl-dialog",et({}));})();
|
|
@@ -881,7 +881,7 @@ var rettangoli=(()=>{var si=Object.defineProperty;var P=(e,t)=>{for(var r in t)s
|
|
|
881
881
|
dialog[open] slot[name="content"] {
|
|
882
882
|
animation: dialog-in 150ms cubic-bezier(0.16, 1, 0.3, 1);
|
|
883
883
|
}
|
|
884
|
-
`))}constructor(){super(),e.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[e.styleSheet],this._dialogElement=document.createElement("dialog"),this.shadow.appendChild(this._dialogElement),this._slotElement=null,this._isConnected=!1,this._dialogElement.addEventListener("
|
|
884
|
+
`))}constructor(){super(),e.initializeStyleSheet(),this.shadow=this.attachShadow({mode:"open"}),this.shadow.adoptedStyleSheets=[e.styleSheet],this._dialogElement=document.createElement("dialog"),this.shadow.appendChild(this._dialogElement),this._slotElement=null,this._isConnected=!1,this._mouseDownInContent=!1,this._dialogElement.addEventListener("mousedown",t=>{this._mouseDownInContent=t.target!==this._dialogElement}),this._dialogElement.addEventListener("click",t=>{t.target===this._dialogElement&&!this._mouseDownInContent&&this._attemptClose(),this._mouseDownInContent=!1}),this._dialogElement.addEventListener("contextmenu",t=>{t.target===this._dialogElement&&!this._mouseDownInContent&&(t.preventDefault(),this._attemptClose()),this._mouseDownInContent=!1}),this._dialogElement.addEventListener("cancel",t=>{t.preventDefault(),this._attemptClose()})}_attemptClose(){this.dispatchEvent(new CustomEvent("close",{detail:{}}))}static get observedAttributes(){return["open","w","s"]}connectedCallback(){this._updateDialog(),this._isConnected=!0,this.hasAttribute("open")&&this._showModal()}attributeChangedCallback(t,r,s){t==="open"?s!==null&&!this._dialogElement.open&&this._isConnected?this._showModal():s===null&&this._dialogElement.open&&this._hideModal():t==="w"&&this._updateWidth()}_updateDialog(){this._updateWidth()}_updateWidth(){let t=this.getAttribute("w");t?this._dialogElement.style.width=t:this._dialogElement.style.width=""}_showModal(){this._dialogElement.open||(this._slotElement||(this._slotElement=document.createElement("slot"),this._slotElement.setAttribute("name","content"),this._dialogElement.appendChild(this._slotElement)),this._dialogElement.showModal(),this._dialogElement.scrollTop=0,this._applyAdaptiveCentering())}_hideModal(){this._dialogElement.open&&(this._dialogElement.close(),this._slotElement&&(this._slotElement.style.marginTop="",this._slotElement.style.marginBottom="",this._dialogElement.removeChild(this._slotElement),this._slotElement=null),this._dialogElement.style.height="")}_applyAdaptiveCentering(){this._slotElement&&requestAnimationFrame(()=>{if(!this._slotElement)return;let t=this._slotElement.offsetHeight,r=window.innerHeight,s=40;if(t>=r-2*s)this._slotElement.style.marginTop=`${s}px`,this._slotElement.style.marginBottom=`${s}px`,this._dialogElement.style.height="100vh";else{let i=r-t,n=Math.floor(i/2);this._slotElement.style.marginTop=`${n}px`,this._slotElement.style.marginBottom=`${n}px`,this._dialogElement.style.height="auto"}})}get dialog(){return this._dialogElement}},Ir=({render:e,html:t})=>ht;var dt=class e extends HTMLElement{static styleSheet=null;static initializeStyleSheet(){e.styleSheet||(e.styleSheet=new CSSStyleSheet,e.styleSheet.replaceSync(R`
|
|
885
885
|
:host {
|
|
886
886
|
display: contents;
|
|
887
887
|
}
|
package/package.json
CHANGED
package/src/primitives/dialog.js
CHANGED
|
@@ -95,34 +95,46 @@ class RettangoliDialogElement extends HTMLElement {
|
|
|
95
95
|
this._slotElement = null;
|
|
96
96
|
this._isConnected = false;
|
|
97
97
|
|
|
98
|
+
// Track if mouse down occurred inside dialog content
|
|
99
|
+
this._mouseDownInContent = false;
|
|
100
|
+
|
|
101
|
+
// Track mouse down events to determine click origin
|
|
102
|
+
this._dialogElement.addEventListener('mousedown', (e) => {
|
|
103
|
+
this._mouseDownInContent = e.target !== this._dialogElement;
|
|
104
|
+
});
|
|
105
|
+
|
|
98
106
|
// Handle click outside - emit custom event
|
|
99
107
|
this._dialogElement.addEventListener('click', (e) => {
|
|
100
|
-
if (e.target === this._dialogElement) {
|
|
101
|
-
this.
|
|
102
|
-
detail: {}
|
|
103
|
-
}));
|
|
108
|
+
if (e.target === this._dialogElement && !this._mouseDownInContent) {
|
|
109
|
+
this._attemptClose();
|
|
104
110
|
}
|
|
111
|
+
// Reset the flag after click is processed
|
|
112
|
+
this._mouseDownInContent = false;
|
|
105
113
|
});
|
|
106
114
|
|
|
107
115
|
// Handle right-click on overlay to close dialog
|
|
108
116
|
this._dialogElement.addEventListener('contextmenu', (e) => {
|
|
109
|
-
if (e.target === this._dialogElement) {
|
|
117
|
+
if (e.target === this._dialogElement && !this._mouseDownInContent) {
|
|
110
118
|
e.preventDefault();
|
|
111
|
-
this.
|
|
112
|
-
detail: {}
|
|
113
|
-
}));
|
|
119
|
+
this._attemptClose();
|
|
114
120
|
}
|
|
121
|
+
// Reset the flag after contextmenu is processed
|
|
122
|
+
this._mouseDownInContent = false;
|
|
115
123
|
});
|
|
116
124
|
|
|
117
125
|
// Handle ESC key - prevent native close and emit custom event
|
|
118
126
|
this._dialogElement.addEventListener('cancel', (e) => {
|
|
119
127
|
e.preventDefault();
|
|
120
|
-
this.
|
|
121
|
-
detail: {}
|
|
122
|
-
}));
|
|
128
|
+
this._attemptClose();
|
|
123
129
|
});
|
|
124
130
|
}
|
|
125
131
|
|
|
132
|
+
_attemptClose() {
|
|
133
|
+
this.dispatchEvent(new CustomEvent('close', {
|
|
134
|
+
detail: {}
|
|
135
|
+
}));
|
|
136
|
+
}
|
|
137
|
+
|
|
126
138
|
static get observedAttributes() {
|
|
127
139
|
return ["open", "w", "s"];
|
|
128
140
|
}
|