@luzmo/lucero 1.0.1-alpha.22 → 1.0.1-alpha.24

package/components/{button-base-CShsEDFM.cjs → button-base-C7or8-FB.cjs}

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const i=require("lit"),l=require("lit/decorators.js"),c=require("./focusable-CbVKgGfS.cjs"),u=require("./like-anchor-B2EqJPdw.cjs"),p=require("./observe-slot-text-ByPG1Lqw.cjs"),d=":host{display:inline-flex;vertical-align:top;--parent-element-progress-circle-size: 18px;--icon-size: 18px}:host([dir]){-webkit-appearance:none}:host([disabled]){pointer-events:none;cursor:auto}#button{position:absolute;top:0;right:0;bottom:0;left:0}::slotted(luzmo-overlay),::slotted(luzmo-tooltip){position:absolute}:host:after{pointer-events:none}::slotted(*){pointer-events:none}::slotted([slot=icon]){--luzmo-icon-vertical-align: 0}slot[name=icon]::slotted(svg),slot[name=icon]::slotted(img){fill:currentcolor;stroke:currentcolor;block-size:var(--luzmo-button-icon-size, var(--icon-size));inline-size:var(--luzmo-button-icon-size, var(--icon-size))}[icon-only]+#label{display:contents}:host([size=s]){--parent-element-progress-circle-size: 16px;--icon-size: 16px}:host([size=l]){--parent-element-progress-circle-size: 20px;--icon-size: 20px}:host([size=xl]){--parent-element-progress-circle-size: 22px;--icon-size: 22px}";var b=Object.defineProperty,a=(o,e,t,f)=>{for(var s=void 0,n=o.length-1,h;n>=0;n--)(h=o[n])&&(s=h(e,t,s)||s);return s&&b(e,t,s),s};class r extends p.ObserveSlotText(u.LikeAnchor(c.Focusable),"",["luzmo-overlay,luzmo-tooltip"]){constructor(){super(),this.active=!1,this.type="button",this.proxyFocus=this.proxyFocus.bind(this),this.addEventListener("click",this.handleClickCapture,{capture:!0})}static get styles(){return[i.unsafeCSS(d)]}get focusElement(){return this}get hasLabel(){return this.slotHasContent}get buttonContent(){return[i.html` <slot name="icon" ?icon-only=${!this.hasLabel}></slot> `,i.html`
+"use strict";const i=require("lit"),l=require("lit/decorators.js"),c=require("./focusable-CbVKgGfS.cjs"),u=require("./like-anchor-B2EqJPdw.cjs"),p=require("./observe-slot-text-CBMHpuIK.cjs"),d=":host{display:inline-flex;vertical-align:top;--parent-element-progress-circle-size: 18px;--icon-size: 18px}:host([dir]){-webkit-appearance:none}:host([disabled]){pointer-events:none;cursor:auto}#button{position:absolute;top:0;right:0;bottom:0;left:0}::slotted(luzmo-overlay),::slotted(luzmo-tooltip){position:absolute}:host:after{pointer-events:none}::slotted(*){pointer-events:none}::slotted([slot=icon]){--luzmo-icon-vertical-align: 0}slot[name=icon]::slotted(svg),slot[name=icon]::slotted(img){fill:currentcolor;stroke:currentcolor;block-size:var(--luzmo-button-icon-size, var(--icon-size));inline-size:var(--luzmo-button-icon-size, var(--icon-size))}[icon-only]+#label{display:contents}:host([size=s]){--parent-element-progress-circle-size: 16px;--icon-size: 16px}:host([size=l]){--parent-element-progress-circle-size: 20px;--icon-size: 20px}:host([size=xl]){--parent-element-progress-circle-size: 22px;--icon-size: 22px}";var b=Object.defineProperty,a=(o,e,t,f)=>{for(var s=void 0,n=o.length-1,h;n>=0;n--)(h=o[n])&&(s=h(e,t,s)||s);return s&&b(e,t,s),s};class r extends p.ObserveSlotText(u.LikeAnchor(c.Focusable),"",["luzmo-overlay,luzmo-tooltip"]){constructor(){super(),this.active=!1,this.type="button",this.proxyFocus=this.proxyFocus.bind(this),this.addEventListener("click",this.handleClickCapture,{capture:!0})}static get styles(){return[i.unsafeCSS(d)]}get focusElement(){return this}get hasLabel(){return this.slotHasContent}get buttonContent(){return[i.html` <slot name="icon" ?icon-only=${!this.hasLabel}></slot> `,i.html`
         <span id="label">
           <slot @slotchange=${this.manageTextObservedSlot}></slot>
         </span>

package/components/{clear-button-CMhq1QsA.js → clear-button-BFtJVPzm.js}

@@ -19,7 +19,7 @@ import { luzmoIcon as e, luzmoClear12 as u, luzmoClear16 as i, luzmoClear14 as s
 import { unsafeCSS as b, html as a } from "lit";
 import { property as d } from "lit/decorators.js";
 import { S as v } from "./sized-mixin-cJbo3PKR.js";
-import { L as g } from "./button-base-BGAqeDTT.js";
+import { L as g } from "./button-base-B5uul3tZ.js";
 const h = ":host{font-size:var(--luzmo-clear-button-icon-size, var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color, transparent);padding:var(--luzmo-clear-button-padding, var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color, var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover: hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover, var(--luzmo-clear-button-icon-color-hover, var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover, var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down, var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down, var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within{color:var(--luzmo-clear-button-icon-color-key-focus, var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus, var(--clear-button-background-color-key-focus))}:host([disabled]){--clear-button-icon-color: var( --luzmo-clear-button-icon-color-disabled, var(--disabled-content-color) );--clear-button-background-color: var( --luzmo-clear-button-background-color-disabled, transparent )}.fill{background-color:var(--luzmo-clear-button-background-color, var(--clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors: active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover: Highlight}}:host{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent;--clear-button-icon-size: var(--luzmo-font-size);--clear-button-padding: 0px;--clear-button-icon-color: var(--luzmo-font-color);--clear-button-icon-color-hover: var(--luzmo-font-color-hover);--clear-button-icon-color-down: var(--luzmo-font-color-down);--clear-button-icon-color-key-focus: var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size: var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent}:host([variant=overBackground]){--clear-button-icon-color: rgb(255, 255, 255);--clear-button-icon-color-hover: rgb(255, 255, 255);--clear-button-icon-color-down: rgb(255, 255, 255);--clear-button-icon-color-key-focus: rgb(255, 255, 255);--clear-button-background-color: transparent;--clear-button-background-color-hover: rgba(255, 255, 255, .25);--clear-button-background-color-down: rgba(255, 255, 255, .4);--clear-button-background-color-key-focus: rgba(255, 255, 255, .25)}:host([disabled]){--clear-button-icon-color: var(--luzmo-disabled-color);--clear-button-icon-color-hover: var(--luzmo-disabled-color);--clear-button-icon-color-down: var(--luzmo-disabled-color);--clear-button-background-color: transparent}:host{box-sizing:border-box}";
 var f = Object.defineProperty, z = (o, t, n, p) => {
   for (var r = void 0, c = o.length - 1, l; c >= 0; c--)

package/components/{clear-button-BWJrTbkk.cjs → clear-button-_a8GjtJC.cjs}

@@ -15,4 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const c=require("@luzmo/icons"),l=require("lit"),i=require("lit/decorators.js"),s=require("./sized-mixin-DcvJLFeo.cjs"),b=require("./button-base-CShsEDFM.cjs"),d=":host{font-size:var(--luzmo-clear-button-icon-size, var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color, transparent);padding:var(--luzmo-clear-button-padding, var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color, var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover: hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover, var(--luzmo-clear-button-icon-color-hover, var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover, var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down, var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down, var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within{color:var(--luzmo-clear-button-icon-color-key-focus, var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus, var(--clear-button-background-color-key-focus))}:host([disabled]){--clear-button-icon-color: var( --luzmo-clear-button-icon-color-disabled, var(--disabled-content-color) );--clear-button-background-color: var( --luzmo-clear-button-background-color-disabled, transparent )}.fill{background-color:var(--luzmo-clear-button-background-color, var(--clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors: active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover: Highlight}}:host{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent;--clear-button-icon-size: var(--luzmo-font-size);--clear-button-padding: 0px;--clear-button-icon-color: var(--luzmo-font-color);--clear-button-icon-color-hover: var(--luzmo-font-color-hover);--clear-button-icon-color-down: var(--luzmo-font-color-down);--clear-button-icon-color-key-focus: var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size: var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent}:host([variant=overBackground]){--clear-button-icon-color: rgb(255, 255, 255);--clear-button-icon-color-hover: rgb(255, 255, 255);--clear-button-icon-color-down: rgb(255, 255, 255);--clear-button-icon-color-key-focus: rgb(255, 255, 255);--clear-button-background-color: transparent;--clear-button-background-color-hover: rgba(255, 255, 255, .25);--clear-button-background-color-down: rgba(255, 255, 255, .4);--clear-button-background-color-key-focus: rgba(255, 255, 255, .25)}:host([disabled]){--clear-button-icon-color: var(--luzmo-disabled-color);--clear-button-icon-color-hover: var(--luzmo-disabled-color);--clear-button-icon-color-down: var(--luzmo-disabled-color);--clear-button-background-color: transparent}:host{box-sizing:border-box}";var v=Object.defineProperty,h=(o,t,a,z)=>{for(var r=void 0,n=o.length-1,e;n>=0;n--)(e=o[n])&&(r=e(t,a,r)||r);return r&&v(t,a,r),r};const g=o=>{const t=o==="s"?c.luzmoClear12:["xl","l"].includes(o)?c.luzmoClear16:c.luzmoClear14;return l.html` <div class="icon" slot="icon">${c.luzmoIcon(t)}</div> `};class u extends s.SizedMixin(b.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,l.unsafeCSS(d)]}get buttonContent(){return[g(this.size)]}render(){return l.html` <div class="fill">${super.render()}</div> `}}h([i.property({reflect:!0})],u.prototype,"variant");exports.LuzmoClearButton=u;
+"use strict";const c=require("@luzmo/icons"),l=require("lit"),i=require("lit/decorators.js"),s=require("./sized-mixin-DcvJLFeo.cjs"),b=require("./button-base-C7or8-FB.cjs"),d=":host{font-size:var(--luzmo-clear-button-icon-size, var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color, transparent);padding:var(--luzmo-clear-button-padding, var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color, var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover: hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover, var(--luzmo-clear-button-icon-color-hover, var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover, var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down, var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down, var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within{color:var(--luzmo-clear-button-icon-color-key-focus, var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus, var(--clear-button-background-color-key-focus))}:host([disabled]){--clear-button-icon-color: var( --luzmo-clear-button-icon-color-disabled, var(--disabled-content-color) );--clear-button-background-color: var( --luzmo-clear-button-background-color-disabled, transparent )}.fill{background-color:var(--luzmo-clear-button-background-color, var(--clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors: active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover: Highlight}}:host{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent;--clear-button-icon-size: var(--luzmo-font-size);--clear-button-padding: 0px;--clear-button-icon-color: var(--luzmo-font-color);--clear-button-icon-color-hover: var(--luzmo-font-color-hover);--clear-button-icon-color-down: var(--luzmo-font-color-down);--clear-button-icon-color-key-focus: var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size: var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent}:host([variant=overBackground]){--clear-button-icon-color: rgb(255, 255, 255);--clear-button-icon-color-hover: rgb(255, 255, 255);--clear-button-icon-color-down: rgb(255, 255, 255);--clear-button-icon-color-key-focus: rgb(255, 255, 255);--clear-button-background-color: transparent;--clear-button-background-color-hover: rgba(255, 255, 255, .25);--clear-button-background-color-down: rgba(255, 255, 255, .4);--clear-button-background-color-key-focus: rgba(255, 255, 255, .25)}:host([disabled]){--clear-button-icon-color: var(--luzmo-disabled-color);--clear-button-icon-color-hover: var(--luzmo-disabled-color);--clear-button-icon-color-down: var(--luzmo-disabled-color);--clear-button-background-color: transparent}:host{box-sizing:border-box}";var v=Object.defineProperty,h=(o,t,a,z)=>{for(var r=void 0,n=o.length-1,e;n>=0;n--)(e=o[n])&&(r=e(t,a,r)||r);return r&&v(t,a,r),r};const g=o=>{const t=o==="s"?c.luzmoClear12:["xl","l"].includes(o)?c.luzmoClear16:c.luzmoClear14;return l.html` <div class="icon" slot="icon">${c.luzmoIcon(t)}</div> `};class u extends s.SizedMixin(b.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,l.unsafeCSS(d)]}get buttonContent(){return[g(this.size)]}render(){return l.html` <div class="fill">${super.render()}</div> `}}h([i.property({reflect:!0})],u.prototype,"variant");exports.LuzmoClearButton=u;

package/components/{close-button-BiJwFZyW.js → close-button-D9qjjy2w.js}

@@ -20,7 +20,7 @@ import { unsafeCSS as h, html as v } from "lit";
 import { property as a } from "lit/decorators.js";
 import { S as g } from "./sized-mixin-cJbo3PKR.js";
 import "./icon/index.js";
-import { L as m } from "./button-base-BGAqeDTT.js";
+import { L as m } from "./button-base-B5uul3tZ.js";
 const f = ':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;border-style:solid;margin:0;-webkit-text-decoration:none;text-decoration:none;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}:host a{-webkit-user-select:none;user-select:none;-webkit-appearance:none}@media (forced-colors: active){:host{--highcontrast-close-button-icon-color-disabled: GrayText;--highcontrast-close-button-icon-color-down: Highlight;--highcontrast-close-button-icon-color-hover: Highlight;--highcontrast-close-button-icon-color-focus: Highlight;--highcontrast-close-button-background-color-default: ButtonFace;--highcontrast-close-button-focus-indicator-color: ButtonText}:host(:focus-visible):after{forced-color-adjust:none;margin:var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap));transition:opacity var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-out,margin var(--luzmo-close-button-animation-duraction, var(--close-button-animation-duration)) ease-out}:host([static-color=black]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: GrayText}:host([static-color=white]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: Highlight}}:host{block-size:var(--luzmo-close-button-height, var(--close-button-size));inline-size:var(--luzmo-close-button-width, var(--close-button-size));font-size:var(--luzmo-close-button-icon-size, var(--close-button-icon-size));color:inherit;border-radius:var(--luzmo-close-button-border-radius, var(--close-button-size));transition:border-color var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;margin-inline:var(--luzmo-close-button-margin-inline);justify-content:center;align-items:center;align-self:var(--luzmo-close-button-align-self);border-width:0;border-color:#0000;flex-direction:row;margin-block-start:var(--luzmo-close-button-margin-top);padding:0;display:inline-flex;position:relative}:host:after{pointer-events:none;content:"";margin:calc(var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)) * -1);border-radius:calc(var(--luzmo-close-button-size, var(--close-button-size)) + var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)));transition:box-shadow var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;position:absolute;inset-block:0;inset-inline:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-close-button-focus-indicator-width, var(--close-button-focus-indicator-width)) var(--highcontrast-close-button-focus-indicator-color, var(--luzmo-close-button-focus-indicator-color, var(--close-button-focus-indicator-color)))}:host(:not([disabled])){background-color:var(--highcontrast-close-button-background-color-default, var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default)))}:host(:not([disabled]):is(:active,[active])){background-color:var(--luzmo-close-button-background-color-down, var(--close-button-background-color-down))}:host(:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-down, var(--luzmo-close-button-icon-color-down, var(--close-button-icon-color-down)))}:host([focused]:not([disabled])),:host(:not([disabled]):focus-visible){background-color:var(--luzmo-close-button-background-color-focus, var(--close-button-background-color-focus))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host(:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host([disabled]){background-color:var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default))}:host([disabled]) .icon{color:var(--highcontrast-close-button-icon-color-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}:host([static-color=black]:not([disabled])),:host([static-color=white]:not([disabled])){background-color:var(--highcontrast-close-button-static-background-color-default, var(--luzmo-close-button-static-background-color-default, var(--close-button-static-background-color-default)))}@media (hover: hover){:host(:not([disabled]):hover){--luzmo-icon-color: var( --luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover) );background-color:var(--luzmo-close-button-background-color-hover, var(--close-button-background-color-hover))}:host(:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-hover, var(--luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover)))}:host([static-color=black]:not([disabled]):hover),:host([static-color=white]:not([disabled]):hover){background-color:var(--highcontrast-close-button-static-background-color-hover, var(--luzmo-close-button-static-background-color-hover, var(--close-button-static-background-color-hover)))}:host([static-color=black]:not([disabled]):hover) .icon,:host([static-color=white]:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}}:host([static-color=black]:not([disabled]):is(:active,[active])),:host([static-color=white]:not([disabled]):is(:active,[active])){background-color:var(--highcontrast-close-button-static-background-color-down, var(--luzmo-close-button-static-background-color-down, var(--close-button-static-background-color-down)))}:host([static-color=black]:not([disabled]):is(:active,[active])) .icon,:host([static-color=white]:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black][focused]:not([disabled])),:host([static-color=black]:not([disabled]):focus-visible),:host([static-color=white][focused]:not([disabled])),:host([static-color=white]:not([disabled]):focus-visible){background-color:var(--highcontrast-close-button-static-background-color-focus, var(--luzmo-close-button-static-background-color-focus, var(--close-button-static-background-color-focus)))}:host([static-color=black][focused]:not([disabled])) .icon,:host([static-color=black]:not([disabled]):focus) .icon,:host([static-color=black]:not([disabled]):focus-visible) .icon,:host([static-color=white][focused]:not([disabled])) .icon,:host([static-color=white]:not([disabled]):focus) .icon,:host([static-color=white]:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black]:not([disabled])) .icon,:host([static-color=white]:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([static-color=black][disabled]) .icon,:host([static-color=white][disabled]) .icon{color:var(--highcontrast-close-button-icon-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}.icon{margin:0}:host{--close-button-background-color-default: transparent;--close-button-background-color-hover: var(--luzmo-background-color-hover);--close-button-background-color-down: var(--luzmo-background-color-down);--close-button-background-color-focus: var(--luzmo-background-color-focus);--close-button-icon-color-default: var(--luzmo-font-color);--close-button-icon-color-hover: var(--luzmo-font-color-hover);--close-button-icon-color-down: var(--luzmo-font-color-down);--close-button-icon-color-focus: var(--luzmo-font-color-focus);--close-button-icon-color-disabled: var(--luzmo-disabled-color);--close-button-focus-indicator-width: var(--luzmo-indicator-width);--close-button-focus-indicator-gap: var(--luzmo-indicator-gap);--close-button-focus-indicator-color: var(--luzmo-indicator-color);--close-button-animation-duration: var(--luzmo-animation-duration);--close-button-size: var(--luzmo-component-height)}:host([static-color=white]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(255, 255, 255, .2);--close-button-static-background-color-down: rgba(255, 255, 255, .4);--close-button-static-background-color-focus: rgba(255, 255, 255, .2);--close-button-icon-color-default: rgb(255, 255, 255);--close-button-icon-color-disabled: rgba(255, 255, 255, .2);--close-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=black]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(0, 0, 0, .2);--close-button-static-background-color-down: rgba(0, 0, 0, .4);--close-button-static-background-color-focus: rgba(0, 0, 0, .2);--close-button-icon-color-default: rgb(0, 0, 0);--close-button-icon-color-disabled: rgba(0, 0, 0, .2);--close-button-focus-indicator-color: rgb(0, 0, 0)}:host([size=s]){--close-button-size: var(--luzmo-component-height-s);--close-button-icon-size: var(--luzmo-font-size-s)}:host{--close-button-size: var(--luzmo-component-height);--close-button-icon-size: var(--luzmo-font-size)}:host([size=l]){--close-button-size: var(--luzmo-component-height-l);--close-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--close-button-size: var(--luzmo-component-height-xl);--close-button-icon-size: var(--luzmo-font-size-xl)}';
 var z = Object.defineProperty, s = (o, c, l, w) => {
   for (var t = void 0, n = o.length - 1, r; n >= 0; n--)

package/components/{close-button-DrMdfzPW.cjs → close-button-TZ08VFmi.cjs}

@@ -15,4 +15,4 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";const n=require("@luzmo/icons"),i=require("lit"),e=require("lit/decorators.js"),b=require("./sized-mixin-DcvJLFeo.cjs");require("./icon/index.cjs");const d=require("./button-base-CShsEDFM.cjs"),h=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;border-style:solid;margin:0;-webkit-text-decoration:none;text-decoration:none;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}:host a{-webkit-user-select:none;user-select:none;-webkit-appearance:none}@media (forced-colors: active){:host{--highcontrast-close-button-icon-color-disabled: GrayText;--highcontrast-close-button-icon-color-down: Highlight;--highcontrast-close-button-icon-color-hover: Highlight;--highcontrast-close-button-icon-color-focus: Highlight;--highcontrast-close-button-background-color-default: ButtonFace;--highcontrast-close-button-focus-indicator-color: ButtonText}:host(:focus-visible):after{forced-color-adjust:none;margin:var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap));transition:opacity var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-out,margin var(--luzmo-close-button-animation-duraction, var(--close-button-animation-duration)) ease-out}:host([static-color=black]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: GrayText}:host([static-color=white]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: Highlight}}:host{block-size:var(--luzmo-close-button-height, var(--close-button-size));inline-size:var(--luzmo-close-button-width, var(--close-button-size));font-size:var(--luzmo-close-button-icon-size, var(--close-button-icon-size));color:inherit;border-radius:var(--luzmo-close-button-border-radius, var(--close-button-size));transition:border-color var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;margin-inline:var(--luzmo-close-button-margin-inline);justify-content:center;align-items:center;align-self:var(--luzmo-close-button-align-self);border-width:0;border-color:#0000;flex-direction:row;margin-block-start:var(--luzmo-close-button-margin-top);padding:0;display:inline-flex;position:relative}:host:after{pointer-events:none;content:"";margin:calc(var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)) * -1);border-radius:calc(var(--luzmo-close-button-size, var(--close-button-size)) + var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)));transition:box-shadow var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;position:absolute;inset-block:0;inset-inline:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-close-button-focus-indicator-width, var(--close-button-focus-indicator-width)) var(--highcontrast-close-button-focus-indicator-color, var(--luzmo-close-button-focus-indicator-color, var(--close-button-focus-indicator-color)))}:host(:not([disabled])){background-color:var(--highcontrast-close-button-background-color-default, var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default)))}:host(:not([disabled]):is(:active,[active])){background-color:var(--luzmo-close-button-background-color-down, var(--close-button-background-color-down))}:host(:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-down, var(--luzmo-close-button-icon-color-down, var(--close-button-icon-color-down)))}:host([focused]:not([disabled])),:host(:not([disabled]):focus-visible){background-color:var(--luzmo-close-button-background-color-focus, var(--close-button-background-color-focus))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host(:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host([disabled]){background-color:var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default))}:host([disabled]) .icon{color:var(--highcontrast-close-button-icon-color-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}:host([static-color=black]:not([disabled])),:host([static-color=white]:not([disabled])){background-color:var(--highcontrast-close-button-static-background-color-default, var(--luzmo-close-button-static-background-color-default, var(--close-button-static-background-color-default)))}@media (hover: hover){:host(:not([disabled]):hover){--luzmo-icon-color: var( --luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover) );background-color:var(--luzmo-close-button-background-color-hover, var(--close-button-background-color-hover))}:host(:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-hover, var(--luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover)))}:host([static-color=black]:not([disabled]):hover),:host([static-color=white]:not([disabled]):hover){background-color:var(--highcontrast-close-button-static-background-color-hover, var(--luzmo-close-button-static-background-color-hover, var(--close-button-static-background-color-hover)))}:host([static-color=black]:not([disabled]):hover) .icon,:host([static-color=white]:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}}:host([static-color=black]:not([disabled]):is(:active,[active])),:host([static-color=white]:not([disabled]):is(:active,[active])){background-color:var(--highcontrast-close-button-static-background-color-down, var(--luzmo-close-button-static-background-color-down, var(--close-button-static-background-color-down)))}:host([static-color=black]:not([disabled]):is(:active,[active])) .icon,:host([static-color=white]:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black][focused]:not([disabled])),:host([static-color=black]:not([disabled]):focus-visible),:host([static-color=white][focused]:not([disabled])),:host([static-color=white]:not([disabled]):focus-visible){background-color:var(--highcontrast-close-button-static-background-color-focus, var(--luzmo-close-button-static-background-color-focus, var(--close-button-static-background-color-focus)))}:host([static-color=black][focused]:not([disabled])) .icon,:host([static-color=black]:not([disabled]):focus) .icon,:host([static-color=black]:not([disabled]):focus-visible) .icon,:host([static-color=white][focused]:not([disabled])) .icon,:host([static-color=white]:not([disabled]):focus) .icon,:host([static-color=white]:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black]:not([disabled])) .icon,:host([static-color=white]:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([static-color=black][disabled]) .icon,:host([static-color=white][disabled]) .icon{color:var(--highcontrast-close-button-icon-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}.icon{margin:0}:host{--close-button-background-color-default: transparent;--close-button-background-color-hover: var(--luzmo-background-color-hover);--close-button-background-color-down: var(--luzmo-background-color-down);--close-button-background-color-focus: var(--luzmo-background-color-focus);--close-button-icon-color-default: var(--luzmo-font-color);--close-button-icon-color-hover: var(--luzmo-font-color-hover);--close-button-icon-color-down: var(--luzmo-font-color-down);--close-button-icon-color-focus: var(--luzmo-font-color-focus);--close-button-icon-color-disabled: var(--luzmo-disabled-color);--close-button-focus-indicator-width: var(--luzmo-indicator-width);--close-button-focus-indicator-gap: var(--luzmo-indicator-gap);--close-button-focus-indicator-color: var(--luzmo-indicator-color);--close-button-animation-duration: var(--luzmo-animation-duration);--close-button-size: var(--luzmo-component-height)}:host([static-color=white]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(255, 255, 255, .2);--close-button-static-background-color-down: rgba(255, 255, 255, .4);--close-button-static-background-color-focus: rgba(255, 255, 255, .2);--close-button-icon-color-default: rgb(255, 255, 255);--close-button-icon-color-disabled: rgba(255, 255, 255, .2);--close-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=black]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(0, 0, 0, .2);--close-button-static-background-color-down: rgba(0, 0, 0, .4);--close-button-static-background-color-focus: rgba(0, 0, 0, .2);--close-button-icon-color-default: rgb(0, 0, 0);--close-button-icon-color-disabled: rgba(0, 0, 0, .2);--close-button-focus-indicator-color: rgb(0, 0, 0)}:host([size=s]){--close-button-size: var(--luzmo-component-height-s);--close-button-icon-size: var(--luzmo-font-size-s)}:host{--close-button-size: var(--luzmo-component-height);--close-button-icon-size: var(--luzmo-font-size)}:host([size=l]){--close-button-size: var(--luzmo-component-height-l);--close-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--close-button-size: var(--luzmo-component-height-xl);--close-button-icon-size: var(--luzmo-font-size-xl)}';var v=Object.defineProperty,u=(o,c,a,f)=>{for(var t=void 0,r=o.length-1,s;r>=0;r--)(s=o[r])&&(t=s(c,a,t)||t);return t&&v(c,a,t),t};const g=o=>{const c=o==="s"?n.luzmoClose12:o==="l"?n.luzmoClose16:n.luzmoClose14;return i.html` <div class="icon" slot="icon">${n.luzmoIcon(c)}</div> `};class l extends b.SizedMixin(d.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,i.unsafeCSS(h)]}get buttonContent(){return[g(this.size)]}}u([e.property({reflect:!0})],l.prototype,"variant");u([e.property({reflect:!0,attribute:"static-color"})],l.prototype,"staticColor");exports.LuzmoCloseButton=l;
+"use strict";const n=require("@luzmo/icons"),i=require("lit"),e=require("lit/decorators.js"),b=require("./sized-mixin-DcvJLFeo.cjs");require("./icon/index.cjs");const d=require("./button-base-C7or8-FB.cjs"),h=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;border-style:solid;margin:0;-webkit-text-decoration:none;text-decoration:none;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}:host a{-webkit-user-select:none;user-select:none;-webkit-appearance:none}@media (forced-colors: active){:host{--highcontrast-close-button-icon-color-disabled: GrayText;--highcontrast-close-button-icon-color-down: Highlight;--highcontrast-close-button-icon-color-hover: Highlight;--highcontrast-close-button-icon-color-focus: Highlight;--highcontrast-close-button-background-color-default: ButtonFace;--highcontrast-close-button-focus-indicator-color: ButtonText}:host(:focus-visible):after{forced-color-adjust:none;margin:var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap));transition:opacity var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-out,margin var(--luzmo-close-button-animation-duraction, var(--close-button-animation-duration)) ease-out}:host([static-color=black]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: GrayText}:host([static-color=white]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: Highlight}}:host{block-size:var(--luzmo-close-button-height, var(--close-button-size));inline-size:var(--luzmo-close-button-width, var(--close-button-size));font-size:var(--luzmo-close-button-icon-size, var(--close-button-icon-size));color:inherit;border-radius:var(--luzmo-close-button-border-radius, var(--close-button-size));transition:border-color var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;margin-inline:var(--luzmo-close-button-margin-inline);justify-content:center;align-items:center;align-self:var(--luzmo-close-button-align-self);border-width:0;border-color:#0000;flex-direction:row;margin-block-start:var(--luzmo-close-button-margin-top);padding:0;display:inline-flex;position:relative}:host:after{pointer-events:none;content:"";margin:calc(var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)) * -1);border-radius:calc(var(--luzmo-close-button-size, var(--close-button-size)) + var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)));transition:box-shadow var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;position:absolute;inset-block:0;inset-inline:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-close-button-focus-indicator-width, var(--close-button-focus-indicator-width)) var(--highcontrast-close-button-focus-indicator-color, var(--luzmo-close-button-focus-indicator-color, var(--close-button-focus-indicator-color)))}:host(:not([disabled])){background-color:var(--highcontrast-close-button-background-color-default, var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default)))}:host(:not([disabled]):is(:active,[active])){background-color:var(--luzmo-close-button-background-color-down, var(--close-button-background-color-down))}:host(:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-down, var(--luzmo-close-button-icon-color-down, var(--close-button-icon-color-down)))}:host([focused]:not([disabled])),:host(:not([disabled]):focus-visible){background-color:var(--luzmo-close-button-background-color-focus, var(--close-button-background-color-focus))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host(:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host([disabled]){background-color:var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default))}:host([disabled]) .icon{color:var(--highcontrast-close-button-icon-color-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}:host([static-color=black]:not([disabled])),:host([static-color=white]:not([disabled])){background-color:var(--highcontrast-close-button-static-background-color-default, var(--luzmo-close-button-static-background-color-default, var(--close-button-static-background-color-default)))}@media (hover: hover){:host(:not([disabled]):hover){--luzmo-icon-color: var( --luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover) );background-color:var(--luzmo-close-button-background-color-hover, var(--close-button-background-color-hover))}:host(:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-hover, var(--luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover)))}:host([static-color=black]:not([disabled]):hover),:host([static-color=white]:not([disabled]):hover){background-color:var(--highcontrast-close-button-static-background-color-hover, var(--luzmo-close-button-static-background-color-hover, var(--close-button-static-background-color-hover)))}:host([static-color=black]:not([disabled]):hover) .icon,:host([static-color=white]:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}}:host([static-color=black]:not([disabled]):is(:active,[active])),:host([static-color=white]:not([disabled]):is(:active,[active])){background-color:var(--highcontrast-close-button-static-background-color-down, var(--luzmo-close-button-static-background-color-down, var(--close-button-static-background-color-down)))}:host([static-color=black]:not([disabled]):is(:active,[active])) .icon,:host([static-color=white]:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black][focused]:not([disabled])),:host([static-color=black]:not([disabled]):focus-visible),:host([static-color=white][focused]:not([disabled])),:host([static-color=white]:not([disabled]):focus-visible){background-color:var(--highcontrast-close-button-static-background-color-focus, var(--luzmo-close-button-static-background-color-focus, var(--close-button-static-background-color-focus)))}:host([static-color=black][focused]:not([disabled])) .icon,:host([static-color=black]:not([disabled]):focus) .icon,:host([static-color=black]:not([disabled]):focus-visible) .icon,:host([static-color=white][focused]:not([disabled])) .icon,:host([static-color=white]:not([disabled]):focus) .icon,:host([static-color=white]:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black]:not([disabled])) .icon,:host([static-color=white]:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([static-color=black][disabled]) .icon,:host([static-color=white][disabled]) .icon{color:var(--highcontrast-close-button-icon-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}.icon{margin:0}:host{--close-button-background-color-default: transparent;--close-button-background-color-hover: var(--luzmo-background-color-hover);--close-button-background-color-down: var(--luzmo-background-color-down);--close-button-background-color-focus: var(--luzmo-background-color-focus);--close-button-icon-color-default: var(--luzmo-font-color);--close-button-icon-color-hover: var(--luzmo-font-color-hover);--close-button-icon-color-down: var(--luzmo-font-color-down);--close-button-icon-color-focus: var(--luzmo-font-color-focus);--close-button-icon-color-disabled: var(--luzmo-disabled-color);--close-button-focus-indicator-width: var(--luzmo-indicator-width);--close-button-focus-indicator-gap: var(--luzmo-indicator-gap);--close-button-focus-indicator-color: var(--luzmo-indicator-color);--close-button-animation-duration: var(--luzmo-animation-duration);--close-button-size: var(--luzmo-component-height)}:host([static-color=white]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(255, 255, 255, .2);--close-button-static-background-color-down: rgba(255, 255, 255, .4);--close-button-static-background-color-focus: rgba(255, 255, 255, .2);--close-button-icon-color-default: rgb(255, 255, 255);--close-button-icon-color-disabled: rgba(255, 255, 255, .2);--close-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=black]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(0, 0, 0, .2);--close-button-static-background-color-down: rgba(0, 0, 0, .4);--close-button-static-background-color-focus: rgba(0, 0, 0, .2);--close-button-icon-color-default: rgb(0, 0, 0);--close-button-icon-color-disabled: rgba(0, 0, 0, .2);--close-button-focus-indicator-color: rgb(0, 0, 0)}:host([size=s]){--close-button-size: var(--luzmo-component-height-s);--close-button-icon-size: var(--luzmo-font-size-s)}:host{--close-button-size: var(--luzmo-component-height);--close-button-icon-size: var(--luzmo-font-size)}:host([size=l]){--close-button-size: var(--luzmo-component-height-l);--close-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--close-button-size: var(--luzmo-component-height-xl);--close-button-icon-size: var(--luzmo-font-size-xl)}';var v=Object.defineProperty,u=(o,c,a,f)=>{for(var t=void 0,r=o.length-1,s;r>=0;r--)(s=o[r])&&(t=s(c,a,t)||t);return t&&v(c,a,t),t};const g=o=>{const c=o==="s"?n.luzmoClose12:o==="l"?n.luzmoClose16:n.luzmoClose14;return i.html` <div class="icon" slot="icon">${n.luzmoIcon(c)}</div> `};class l extends b.SizedMixin(d.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,i.unsafeCSS(h)]}get buttonContent(){return[g(this.size)]}}u([e.property({reflect:!0})],l.prototype,"variant");u([e.property({reflect:!0,attribute:"static-color"})],l.prototype,"staticColor");exports.LuzmoCloseButton=l;

package/components/color-area/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("lit"),s=require("lit/decorators.js"),b=require("lit/directives/if-defined.js");require("../color-handle/index.cjs");const g=require("../base-5nDSSNeT.cjs"),v=require("../platform-BJnOJJag.cjs"),y=require("../color-controller-ChN-A9Ft.cjs"),w=require("../language-resolution-EUER43cg.cjs"),C=require("../streaming-listener-CfUtuELp.cjs"),x="@media (forced-colors: active){:host{--highcontrast-color-area-border-color-disabled: GrayText;--highcontrast-color-area-border-color: Canvas;--highcontrast-color-area-fill-color-disabled: Canvas}.gradient,:host([disabled]){forced-color-adjust:none}}:host{cursor:default;-webkit-user-select:none;user-select:none;min-inline-size:var(--luzmo-color-area-min-width, 64px);min-block-size:var(--luzmo-color-area-min-height, 64px);inline-size:var(--luzmo-color-area-width, 192px);block-size:var(--luzmo-color-area-height, 192px);box-sizing:border-box;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color, var(--luzmo-color-area-border-color, var(--luzmo-border-color)));display:inline-block;position:relative}:host([focused]){z-index:1}:host([disabled]){pointer-events:none;background:var(--highcontrast-color-area-fill-color-disabled, var(--luzmo-color-area-disabled-background-color, var(--luzmo-dimmed-color)));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color-disabled)}:host([disabled]) .gradient{display:none}.handle{transform:translate(calc(var(--luzmo-color-area-width, 192px) - var(--luzmo-border-width)));inset-block-start:0}.handle:dir(rtl),:host([dir=rtl]) .handle{inset-inline-end:0}.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s))}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}:host{touch-action:none}:host:before{pointer-events:none}.gradient{overflow:hidden}.handle{transform:translate(var(--luzmo-color-area-default-width))}::slotted(*){width:100%;height:100%}:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider[orient=vertical]{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}.slider:focus{z-index:1}.fieldset{border:0;margin:0;padding:0}";var $=Object.defineProperty,z=Object.getOwnPropertyDescriptor,a=(p,e,t,r)=>{for(var o=r>1?void 0:r?z(e,t):e,n=p.length-1,l;n>=0;n--)(l=p[n])&&(o=(r?l(e,t,o):l(o))||o);return r&&o&&$(e,t,o),o};class i extends g.LuzmoElement{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.labelX="saturation",this.labelY="luminosity",this.isLTR=!0,this.languageResolver=new w.LanguageResolutionController(this),this.colorController=new y.ColorController(this,{manageAs:"hsv"}),this.activeAxis="x",this.step=.01,this.altered=0,this.activeKeys=new Set,this._valueChanged=!1,this._pointerDown=!1}static get styles(){return[f.unsafeCSS(x)]}get hue(){return this.colorController.hue}set hue(e){this.colorController.hue=e}get value(){return this.colorController.colorValue}get color(){return this.colorController.colorValue}set color(e){this.colorController.color=e}get x(){return this.colorController.color.hsv.s/100}set x(e){if(e===this.x)return;const t=this.x;this.inputX?(this.inputX.value=e.toString(),this.colorController.color.set("s",this.inputX.valueAsNumber*100)):this.colorController.color.set("s",e*100),this.requestUpdate("x",t)}get y(){return this.colorController.color.hsv.v/100}set y(e){if(e===this.y)return;const t=this.y;this.inputY&&(this.inputY.value=e.toString(),this.colorController.color.set("v",this.inputY.valueAsNumber*100)),this.requestUpdate("y",t)}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.activeAxis==="x"?this.inputX.focus():this.inputY.focus()}handleFocus(){this.focused=!0,this._valueChanged=!1}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1,this._valueChanged=!1)}handleKeydown(e){const{code:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(o=>!!o).length,(t.search("Arrow")===0||t.search("Page")===0||t.search("Home")===0||t.search("End")===0)&&(e.preventDefault(),this.activeKeys.add(t),this.handleKeypress())}handleKeypress(){let e=0,t=0;const r=Math.max(this.step,this.altered*5*this.step);this.activeKeys.forEach(o=>{switch(o){case"ArrowUp":{t=r;break}case"ArrowDown":{t=r*-1;break}case"ArrowLeft":{e=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{e=this.step*(this.isLTR?1:-1);break}case"PageUp":{t=r*10;break}case"PageDown":{t=r*-10;break}case"Home":{e=r*(this.isLTR?-10:10);break}case"End":{e=r*(this.isLTR?10:-10);break}}}),e!==0?(this.activeAxis="x",this.inputX.focus()):t!==0&&(this.activeAxis="y",this.inputY.focus()),this.x=Math.min(1,Math.max(this.x+e,0)),this.y=Math.min(1,Math.max(this.y+t,0)),this.colorController.savePreviousColor(),(e!==0||t!==0)&&(this._valueChanged=!0,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor())}handleKeyup(e){e.preventDefault();const{code:t}=e;this.activeKeys.delete(t)}handleInput(e){const{valueAsNumber:t,name:r}=e.target;this[r]=t}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),e.target.setPointerCapture(e.pointerId),e.pointerType==="mouse"&&(this.focused=!0)}handlePointermove(e){const[t,r]=this.calculateHandlePosition(e);this._valueChanged=!1,this.x=t,this.y=r,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(e){e.preventDefault(),this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId);const t=this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}));this.inputX.focus(),e.pointerType==="mouse"&&(this.focused=!1),t||this.colorController.restorePreviousColor()}calculateHandlePosition(e){if(!this.boundingClientRect)return[this.x,this.y];const t=this.boundingClientRect,r=t.left,o=t.top,n=e.clientX,l=e.clientY,h=t.width,d=t.height,c=Math.max(0,Math.min(1,(n-r)/h)),u=Math.max(0,Math.min(1,(l-o)/d));return[this.isLTR?c:1-c,1-u]}handleAreaPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",e)),this.handlePointermove(e))}render(){const{width:e=0,height:t=0}=this.boundingClientRect||{},r=v.isAndroid()||v.isIOS(),n="Color Picker",l=b.ifDefined(r?void 0:"2d slider"),h=this.labelX,d=this.labelY,c=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.x),u=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.y),m={background:`linear-gradient(to top, black 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%),linear-gradient(to right, white 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%), hsl(${this.hue}, 100%, 50%);`};return f.html`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const f=require("lit"),s=require("lit/decorators.js"),b=require("lit/directives/if-defined.js");require("../color-handle/index.cjs");const g=require("../base-5nDSSNeT.cjs"),v=require("../platform-BJnOJJag.cjs"),y=require("../color-controller-ChN-A9Ft.cjs"),w=require("../language-resolution-EUER43cg.cjs"),C=require("../streaming-listener-D9Wc7skA.cjs"),x="@media (forced-colors: active){:host{--highcontrast-color-area-border-color-disabled: GrayText;--highcontrast-color-area-border-color: Canvas;--highcontrast-color-area-fill-color-disabled: Canvas}.gradient,:host([disabled]){forced-color-adjust:none}}:host{cursor:default;-webkit-user-select:none;user-select:none;min-inline-size:var(--luzmo-color-area-min-width, 64px);min-block-size:var(--luzmo-color-area-min-height, 64px);inline-size:var(--luzmo-color-area-width, 192px);block-size:var(--luzmo-color-area-height, 192px);box-sizing:border-box;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color, var(--luzmo-color-area-border-color, var(--luzmo-border-color)));display:inline-block;position:relative}:host([focused]){z-index:1}:host([disabled]){pointer-events:none;background:var(--highcontrast-color-area-fill-color-disabled, var(--luzmo-color-area-disabled-background-color, var(--luzmo-dimmed-color)));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color-disabled)}:host([disabled]) .gradient{display:none}.handle{transform:translate(calc(var(--luzmo-color-area-width, 192px) - var(--luzmo-border-width)));inset-block-start:0}.handle:dir(rtl),:host([dir=rtl]) .handle{inset-inline-end:0}.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s))}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}:host{touch-action:none}:host:before{pointer-events:none}.gradient{overflow:hidden}.handle{transform:translate(var(--luzmo-color-area-default-width))}::slotted(*){width:100%;height:100%}:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider[orient=vertical]{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}.slider:focus{z-index:1}.fieldset{border:0;margin:0;padding:0}";var $=Object.defineProperty,z=Object.getOwnPropertyDescriptor,a=(p,e,t,r)=>{for(var o=r>1?void 0:r?z(e,t):e,n=p.length-1,l;n>=0;n--)(l=p[n])&&(o=(r?l(e,t,o):l(o))||o);return r&&o&&$(e,t,o),o};class i extends g.LuzmoElement{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.labelX="saturation",this.labelY="luminosity",this.isLTR=!0,this.languageResolver=new w.LanguageResolutionController(this),this.colorController=new y.ColorController(this,{manageAs:"hsv"}),this.activeAxis="x",this.step=.01,this.altered=0,this.activeKeys=new Set,this._valueChanged=!1,this._pointerDown=!1}static get styles(){return[f.unsafeCSS(x)]}get hue(){return this.colorController.hue}set hue(e){this.colorController.hue=e}get value(){return this.colorController.colorValue}get color(){return this.colorController.colorValue}set color(e){this.colorController.color=e}get x(){return this.colorController.color.hsv.s/100}set x(e){if(e===this.x)return;const t=this.x;this.inputX?(this.inputX.value=e.toString(),this.colorController.color.set("s",this.inputX.valueAsNumber*100)):this.colorController.color.set("s",e*100),this.requestUpdate("x",t)}get y(){return this.colorController.color.hsv.v/100}set y(e){if(e===this.y)return;const t=this.y;this.inputY&&(this.inputY.value=e.toString(),this.colorController.color.set("v",this.inputY.valueAsNumber*100)),this.requestUpdate("y",t)}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.activeAxis==="x"?this.inputX.focus():this.inputY.focus()}handleFocus(){this.focused=!0,this._valueChanged=!1}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1,this._valueChanged=!1)}handleKeydown(e){const{code:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(o=>!!o).length,(t.search("Arrow")===0||t.search("Page")===0||t.search("Home")===0||t.search("End")===0)&&(e.preventDefault(),this.activeKeys.add(t),this.handleKeypress())}handleKeypress(){let e=0,t=0;const r=Math.max(this.step,this.altered*5*this.step);this.activeKeys.forEach(o=>{switch(o){case"ArrowUp":{t=r;break}case"ArrowDown":{t=r*-1;break}case"ArrowLeft":{e=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{e=this.step*(this.isLTR?1:-1);break}case"PageUp":{t=r*10;break}case"PageDown":{t=r*-10;break}case"Home":{e=r*(this.isLTR?-10:10);break}case"End":{e=r*(this.isLTR?10:-10);break}}}),e!==0?(this.activeAxis="x",this.inputX.focus()):t!==0&&(this.activeAxis="y",this.inputY.focus()),this.x=Math.min(1,Math.max(this.x+e,0)),this.y=Math.min(1,Math.max(this.y+t,0)),this.colorController.savePreviousColor(),(e!==0||t!==0)&&(this._valueChanged=!0,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor())}handleKeyup(e){e.preventDefault();const{code:t}=e;this.activeKeys.delete(t)}handleInput(e){const{valueAsNumber:t,name:r}=e.target;this[r]=t}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),e.target.setPointerCapture(e.pointerId),e.pointerType==="mouse"&&(this.focused=!0)}handlePointermove(e){const[t,r]=this.calculateHandlePosition(e);this._valueChanged=!1,this.x=t,this.y=r,this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(e){e.preventDefault(),this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId);const t=this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}));this.inputX.focus(),e.pointerType==="mouse"&&(this.focused=!1),t||this.colorController.restorePreviousColor()}calculateHandlePosition(e){if(!this.boundingClientRect)return[this.x,this.y];const t=this.boundingClientRect,r=t.left,o=t.top,n=e.clientX,l=e.clientY,h=t.width,d=t.height,c=Math.max(0,Math.min(1,(n-r)/h)),u=Math.max(0,Math.min(1,(l-o)/d));return[this.isLTR?c:1-c,1-u]}handleAreaPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",e)),this.handlePointermove(e))}render(){const{width:e=0,height:t=0}=this.boundingClientRect||{},r=v.isAndroid()||v.isIOS(),n="Color Picker",l=b.ifDefined(r?void 0:"2d slider"),h=this.labelX,d=this.labelY,c=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.x),u=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.y),m={background:`linear-gradient(to top, black 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%),linear-gradient(to right, white 0%, hsla(${this.hue}, 100%, 0.01%, 0) 100%), hsl(${this.hue}, 100%, 50%);`};return f.html`
       <div
         @pointerdown=${this.handleAreaPointerdown}
         class="gradient"

package/components/color-area/index.js

@@ -23,7 +23,7 @@ import { a as y } from "../base-CdYjmV_8.js";
 import { j as x, c as w } from "../platform-CqwNrovd.js";
 import { C } from "../color-controller-7sNUf7SP.js";
 import { L as $ } from "../language-resolution-B-wjV5bb.js";
-import { s as k } from "../streaming-listener-BgU36S1Z.js";
+import { s as k } from "../streaming-listener-BlWm-XZU.js";
 const g = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const u = document.createElement("style");

package/components/color-field/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("lit"),h=require("lit/decorators.js"),d=require("../color-controller-ChN-A9Ft.cjs"),v=require("../text-field-JMrsh-zo.cjs"),c=":host{position:relative}";var f=Object.defineProperty,u=(s,e,l,t)=>{for(var r=void 0,a=s.length-1,n;a>=0;a--)(n=s[a])&&(r=n(e,l,r)||r);return r&&f(e,l,r),r};class i extends v.LuzmoTextFieldBase{constructor(){super(),this.viewColor=!1,this.noAlphaChannel=!1,this._value="",this.colorController=new d.ColorController(this)}static get styles(){return[...super.styles,o.unsafeCSS(c)]}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}updated(e){super.updated(e),e.has("noAlphaChannel")&&this.checkValidity()}renderColorHandle(){return this.viewColor&&this.valid?o.html`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("lit"),h=require("lit/decorators.js"),d=require("../color-controller-ChN-A9Ft.cjs"),v=require("../text-field-Bnei-lTb.cjs"),c=":host{position:relative}";var f=Object.defineProperty,u=(s,e,l,t)=>{for(var r=void 0,a=s.length-1,n;a>=0;a--)(n=s[a])&&(r=n(e,l,r)||r);return r&&f(e,l,r),r};class i extends v.LuzmoTextFieldBase{constructor(){super(),this.viewColor=!1,this.noAlphaChannel=!1,this._value="",this.colorController=new d.ColorController(this)}static get styles(){return[...super.styles,o.unsafeCSS(c)]}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}updated(e){super.updated(e),e.has("noAlphaChannel")&&this.checkValidity()}renderColorHandle(){return this.viewColor&&this.valid?o.html`
           <luzmo-color-handle
             size="m"
             color=${this.colorController.getColor("srgb").toString()}

package/components/color-field/index.js

@@ -18,7 +18,7 @@
 import { unsafeCSS as d, html as u } from "lit";
 import { property as n } from "lit/decorators.js";
 import { C as z } from "../color-controller-7sNUf7SP.js";
-import { a as h } from "../text-field-BTEpwGFu.js";
+import { a as h } from "../text-field-CQ8t9NU2.js";
 const c = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const l = document.createElement("style");

package/components/color-palette-group/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("lit"),d=require("../mutation-controller-DkOMCW-c.cjs"),o=require("lit/decorators.js"),p=require("lit/directives/if-defined.js"),h=require("../base-5nDSSNeT.cjs"),g=require("../roving-tabindex-By_fCy_e.cjs"),m=require("../sized-mixin-DcvJLFeo.cjs"),f=".color-palette-group{column-gap:var(--luzmo-color-palette-group-column-gap, var(--color-palette-group-column-gap));row-gap:var(--luzmo-color-palette-group-row-gap, var(--color-palette-group-row-gap));flex-wrap:wrap;display:flex}::slotted(*){flex-shrink:0}::slotted(:focus-visible){z-index:1}:host{--color-palette-group-column-gap: var(--luzmo-spacing-3);--color-palette-group-row-gap: var(--luzmo-spacing-3)}:host([size=s]){--color-palette-group-column-gap: var(--luzmo-spacing-2);--color-palette-group-row-gap: var(--luzmo-spacing-2)}:host,:host([size=l]),:host([size=xl]){--color-palette-group-column-gap: var(--luzmo-spacing-3);--color-palette-group-row-gap: var(--luzmo-spacing-3)}";var b=Object.defineProperty,v=Object.getOwnPropertyDescriptor,i=(n,e,t,s)=>{for(var r=s>1?void 0:s?v(e,t):e,l=n.length-1,c;l>=0;l--)(c=n[l])&&(r=(s?c(e,t,r):c(r))||r);return s&&r&&b(e,t,r),r};class a extends m.SizedMixin(h.LuzmoElement,{validSizes:["s","m","l","xl"],noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.horizontal=!1,this._palettes=[],this.rovingTabindexController=new g.RovingTabindexController(this,{focusInIndex:e=>e.findIndex(t=>this.selected?!t.disabled&&t.value===this.selected:!t.disabled),elements:()=>this.palettes,isFocusableElement:e=>!e.disabled}),this.label="",this._onKeyDown=e=>{if(e.code==="Enter"||e.code==="Space"){e.preventDefault();const t=e.target;if(t.value===void 0)return;this.deselectSelectedPalettes(),t.selected=!0,t.tabIndex=0,t.setAttribute("aria-checked","true"),this.setSelected(t.value,!0)}},this.manageColorPalettes=()=>{if(!this.slotElement)return;const t=this.slotElement.assignedElements({flatten:!0}).reduce((s,r)=>{if(r.matches("luzmo-color-palette"))s.push(r);else{const l=[...r.querySelectorAll(":scope > luzmo-color-palette")];s.push(...l)}return s},[]);this.palettes=t,this.manageChildren(),this.manageSelects()},new d.s(this,{config:{childList:!0,subtree:!0},callback:()=>{this.manageColorPalettes()},skipInitial:!0})}static get styles(){return[u.unsafeCSS(f)]}set palettes(e){e!==this.palettes&&(this._palettes=e,this.rovingTabindexController.clearElementCache())}get palettes(){return this._palettes}get selected(){return this._selected}set selected(e){this.requestUpdate("selected",this._selected),this._selected=e,this.updateComplete.then(()=>{this.applySelects(),this.manageChildren()})}dispatchChange(e){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||(this.setSelected(e),this.palettes.map(s=>{s.selected=!!(s.value&&this.selected===s.value)}))}setSelected(e,t){if(e===this.selected)return;const s=this.selected;this.requestUpdate("selected",s),this._selected=e,t&&this.dispatchChange(s)}focus(e){this.rovingTabindexController.focus(e)}deselectSelectedPalettes(){this.palettes.forEach(e=>{e.selected&&(e.selected=!1,e.tabIndex=-1,e.setAttribute("aria-checked","false"))})}_handleClick(e){const t=e.target;t.value!==void 0&&(this.deselectSelectedPalettes(),t.selected=!0,t.tabIndex=0,t.setAttribute("aria-checked","true"),this.setSelected(t.value,!0))}async applySelects(){await this.manageSelects()}async manageSelects(){if(this.palettes.length===0)return;const e=this.palettes;this.setAttribute("role","radiogroup");const t=[],s=e.map(async l=>{await l.updateComplete,l.setAttribute("role","radio"),l.setAttribute("aria-checked",l.selected?"true":"false"),l.selected&&t.push(l)});await Promise.all(s);const r=t.map(l=>l.value).find(Boolean);this.setSelected(r)}render(){return u.html`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("lit"),d=require("@lit-labs/observers/mutation-controller.js"),o=require("lit/decorators.js"),p=require("lit/directives/if-defined.js"),h=require("../base-5nDSSNeT.cjs"),g=require("../roving-tabindex-By_fCy_e.cjs"),m=require("../sized-mixin-DcvJLFeo.cjs"),f=".color-palette-group{column-gap:var(--luzmo-color-palette-group-column-gap, var(--color-palette-group-column-gap));row-gap:var(--luzmo-color-palette-group-row-gap, var(--color-palette-group-row-gap));flex-wrap:wrap;display:flex}::slotted(*){flex-shrink:0}::slotted(:focus-visible){z-index:1}:host{--color-palette-group-column-gap: var(--luzmo-spacing-3);--color-palette-group-row-gap: var(--luzmo-spacing-3)}:host([size=s]){--color-palette-group-column-gap: var(--luzmo-spacing-2);--color-palette-group-row-gap: var(--luzmo-spacing-2)}:host,:host([size=l]),:host([size=xl]){--color-palette-group-column-gap: var(--luzmo-spacing-3);--color-palette-group-row-gap: var(--luzmo-spacing-3)}";var b=Object.defineProperty,v=Object.getOwnPropertyDescriptor,i=(n,e,t,s)=>{for(var r=s>1?void 0:s?v(e,t):e,l=n.length-1,u;l>=0;l--)(u=n[l])&&(r=(s?u(e,t,r):u(r))||r);return s&&r&&b(e,t,r),r};class a extends m.SizedMixin(h.LuzmoElement,{validSizes:["s","m","l","xl"],noDefaultSize:!0}){constructor(){super(),this.disabled=!1,this.horizontal=!1,this._palettes=[],this.rovingTabindexController=new g.RovingTabindexController(this,{focusInIndex:e=>e.findIndex(t=>this.selected?!t.disabled&&t.value===this.selected:!t.disabled),elements:()=>this.palettes,isFocusableElement:e=>!e.disabled}),this.label="",this._onKeyDown=e=>{if(e.code==="Enter"||e.code==="Space"){e.preventDefault();const t=e.target;if(t.value===void 0)return;this.deselectSelectedPalettes(),t.selected=!0,t.tabIndex=0,t.setAttribute("aria-checked","true"),this.setSelected(t.value,!0)}},this.manageColorPalettes=()=>{if(!this.slotElement)return;const t=this.slotElement.assignedElements({flatten:!0}).reduce((s,r)=>{if(r.matches("luzmo-color-palette"))s.push(r);else{const l=[...r.querySelectorAll(":scope > luzmo-color-palette")];s.push(...l)}return s},[]);this.palettes=t,this.manageChildren(),this.manageSelects()},new d.MutationController(this,{config:{childList:!0,subtree:!0},callback:()=>{this.manageColorPalettes()},skipInitial:!0})}static get styles(){return[c.unsafeCSS(f)]}set palettes(e){e!==this.palettes&&(this._palettes=e,this.rovingTabindexController.clearElementCache())}get palettes(){return this._palettes}get selected(){return this._selected}set selected(e){this.requestUpdate("selected",this._selected),this._selected=e,this.updateComplete.then(()=>{this.applySelects(),this.manageChildren()})}dispatchChange(e){this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||(this.setSelected(e),this.palettes.map(s=>{s.selected=!!(s.value&&this.selected===s.value)}))}setSelected(e,t){if(e===this.selected)return;const s=this.selected;this.requestUpdate("selected",s),this._selected=e,t&&this.dispatchChange(s)}focus(e){this.rovingTabindexController.focus(e)}deselectSelectedPalettes(){this.palettes.forEach(e=>{e.selected&&(e.selected=!1,e.tabIndex=-1,e.setAttribute("aria-checked","false"))})}_handleClick(e){const t=e.target;t.value!==void 0&&(this.deselectSelectedPalettes(),t.selected=!0,t.tabIndex=0,t.setAttribute("aria-checked","true"),this.setSelected(t.value,!0))}async applySelects(){await this.manageSelects()}async manageSelects(){if(this.palettes.length===0)return;const e=this.palettes;this.setAttribute("role","radiogroup");const t=[],s=e.map(async l=>{await l.updateComplete,l.setAttribute("role","radio"),l.setAttribute("aria-checked",l.selected?"true":"false"),l.selected&&t.push(l)});await Promise.all(s);const r=t.map(l=>l.value).find(Boolean);this.setSelected(r)}render(){return c.html`
       <div
         class="color-palette-group"
         aria-label=${p.ifDefined(this.label??void 0)}

package/components/color-palette-group/index.js

@@ -16,7 +16,7 @@
  * SOFTWARE.
  * */
 import { unsafeCSS as d, html as m } from "lit";
-import { s as p } from "../mutation-controller-DH7YOCyj.js";
+import { MutationController as p } from "@lit-labs/observers/mutation-controller.js";
 import { property as u, query as h } from "lit/decorators.js";
 import { ifDefined as z } from "lit/directives/if-defined.js";
 import { a as f } from "../base-CdYjmV_8.js";

package/components/color-slider/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@ctrl/tinycolor"),y=require("lit"),n=require("lit/decorators.js"),f=require("lit/directives/if-defined.js"),_=require("lit/directives/style-map.js");require("../color-handle/index.cjs");const x=require("../focusable-CbVKgGfS.cjs"),P=require("../language-resolution-EUER43cg.cjs"),H=require("../streaming-listener-CfUtuELp.cjs"),C=/^hs[v|l]a?\s?\((\d{1,3}\.?\d*?),?\s?(\d{1,3})/,z=/(^hs[v|l]a?\s?\()\d{1,3}\.?\d*?(,?\s?)\d{1,3}/,S=/(^hs[v|l]a?\()\d{1,3}/,v=(p,t)=>t?p.toHexString():p.toHex();class k{constructor(t,{applyColorToState:e,extractColorFromState:r,maintains:s}){this.maintains="hue",this._hue=0,this._opacity=1,this.getColorProcesses={rgb:(o,i)=>i?o.toRgbString():o.toRgb(),prgb:(o,i)=>i?o.toPercentageRgbString():o.toPercentageRgb(),hex8:(o,i)=>i?o.toHex8String():o.toHex8(),name:o=>o.toName()||o.toRgbString(),hsl:(o,i)=>{if(this.maintains==="hue"){if(i)return o.toHslString().replace(S,`$1${this.hue}`);const{s:c,l:m,a:b}=o.toHsl();return{h:this.hue,s:c,l:m,a:b}}if(i)return o.toHslString().replace(z,`$1${this.hue}$2${this.saturation}`);const{s:h,l:d,a:g}=o.toHsl();return{h:this.hue,s:h,l:d,a:g}},hsv:(o,i)=>{if(this.maintains==="hue"){if(i)return o.toHsvString().replace(S,`$1${this.hue}`);const{s:c,v:m,a:b}=o.toHsv();return{h:this.hue,s:c,v:m,a:b}}if(i)return o.toHsvString().replace(z,`$1${this.hue}$2${this.saturation}`);const{s:h,v:d,a:g}=o.toHsv();return{h:this.hue,s:h,v:d,a:g}},hex:v,hex3:v,hex4:v,hex6:v},this._color=new u.TinyColor({h:0,s:1,v:1}),this._previousColor=new u.TinyColor({h:0,s:1,v:1}),this._format={format:"",isString:!1},this.host=t,this.applyColorToState=e,this.extractColorFromState=r,this.maintains=s||this.maintains}setColorProcess(t,e,r,s){this.maintains==="hue"?this.setColorMaintainHue(t,e,r,s):this.maintains==="saturation"&&this.setColorMaintainSaturation(t,e,r,s)}setColorMaintainHue(t,e,r,s){const{h:o,s:i,v:h,a:d}=this._color.toHsv();let g;if(s&&r.startsWith("hs")){const c=C.exec(e);if(c!==null){const[,m]=c;g=Number(m)}}else if(!s&&r.startsWith("hs")){const c=t.originalInput;g=Object.values(c)[0]}this.hue=g||o,this.opacity=d??1,this.applyColorToState({h:o,s:i,v:h,a:d})}setColorMaintainSaturation(t,e,r,s){const{a:o}=this._color.toHsv();if(s&&r.startsWith("hs")){const i=C.exec(e);if(i!==null){const[,h,d]=i;this.hue=Number(h),this.saturation=Number(d)}}else if(!s&&r.startsWith("hs")){const i=t.originalInput,h=Object.values(i);this.hue=h[0],this.saturation=h[1]}else{const{h:i}=t.toHsv();this.hue=i}this.opacity=o??1,this.applyColorToState(t.toHsv())}applyColorFromState(){this._color=new u.TinyColor(this.extractColorFromState(this))}get hue(){return this._hue}set hue(t){const e=Math.min(360,Math.max(0,t));if(e===this.hue)return;const r=this.hue,{s,v:o,a:i}=this._color.toHsv();this._color=new u.TinyColor({h:e,s,v:o,a:i}),this._hue=e,this.host.requestUpdate("hue",r)}get opacity(){return this._opacity}set opacity(t){const e=Math.min(1,Math.max(0,t));if(e===this.opacity)return;const r=this.opacity,{h:s,s:o,v:i}=this._color.toHsv();this._color=new u.TinyColor({h:s,s:o,v:i,a:e}),this._opacity=e,this.host.requestUpdate("opacity",r)}get value(){return this.color}get color(){return this.getColorProcesses[this._format.format||"hex"](this._color,this._format.isString)}set color(t){if(t===this.color)return;const e=this._color;this._color=new u.TinyColor(t);const r=this._color.format;let s=typeof t=="string"||t instanceof String;r.startsWith("hex")&&(s=t.startsWith("#")),this._format={format:r,isString:s},this.setColorProcess(this._color,t,r,s),this.host.requestUpdate("color",e)}getColor(t){const e={hsl:"toHsl"};return this._color[e[t]]()}setColor(t){this._color=t;const e=typeof this._color.originalInput=="string"||this._color.originalInput instanceof String;this.setColorProcess(this._color,t,this._color.format,e)}getHslString(){return this._color.toHslString()}savePreviousColor(){this._previousColor=this._color.clone()}restorePreviousColor(){this.setColor(this._previousColor)}}const $='.opacity-checkerboard{position:absolute;block-size:100%;inline-size:100%;background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-color-loupe-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-color-loupe-checkerboard-position, left top)/calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2)}:host{--luzmo-color-slider-gradient-fallback: rgb(255 0 0) 0%, rgb(255 255 0) 17%, rgb(0 255 0) 33%, rgb(0 255 255) 50%, rgb(0 0 255) 67%, rgb(255 0 255) 83%, rgb(255 0 0) 100%;touch-action:none}:host([vertical]) .handle{inset-block-start:unset;inset-block-end:0}:host([vertical]) .slider{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}:host(:focus){outline:none}.gradient{overflow:hidden}::slotted(*){width:100%;height:100%}@media (forced-colors: active){:host{--highcontrast-color-slider-border-color: CanvasText;--highcontrast-color-slider-border-color-disabled: GrayText;--highcontrast-color-slider-background-color-disabled: Canvas;forced-color-adjust:none}}:host{--luzmo-color-handle-hitarea-border-radius: var( --luzmo-color-slider-handle-hitarea-border-radius, 0px );min-inline-size:var(--luzmo-color-slider-minimum-length, 80px);inline-size:var(--luzmo-color-slider-length, 192px);block-size:var(--luzmo-color-slider-control-track-width, 24px);-webkit-user-select:none;user-select:none;cursor:default;display:block;position:relative}:host([focused]){z-index:2}:host([disabled]){pointer-events:none}:host([disabled]) .gradient{display:none}:host([vertical]){min-block-size:var(--luzmo-color-slider-vertical-minimum-height, var(--luzmo-color-slider-minimum-length, 80px));block-size:var(--luzmo-color-slider-vertical-height, var(--luzmo-color-slider-length, 192px));min-inline-size:0;inline-size:var(--luzmo-color-slider-vertical-control-track-width, var(--luzmo-color-slider-control-track-height, 24px));display:inline-block}:host([vertical]) .handle{inset-inline-start:50%}.handle{inset-block-start:50%;inset-inline-start:0}.checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color, var(--luzmo-color-slider-border-color, var(--luzmo-border-color)) )}.checkerboard:before{content:"";z-index:1;box-shadow:inset 0 0 0 var(--luzmo-color-slider-border-width, var(--luzmo-border-width)) var(--luzmo-color-slider-border-color-local);border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s));position:absolute;top:0;right:0;bottom:0;left:0}:host([disabled]) .checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color-disabled, var(--luzmo-color-slider-border-color-disabled, var(--luzmo-dimmed-color)) );background:var(--highcontrast-color-slider-background-color-disabled, var(--luzmo-color-slider-background-color-disabled, var(--luzmo-dimmed-color)))}.checkerboard,.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s))}.gradient:dir(rtl),:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}';var R=Object.defineProperty,T=Object.getOwnPropertyDescriptor,a=(p,t,e,r)=>{for(var s=r>1?void 0:r?T(t,e):t,o=p.length-1,i;o>=0;o--)(i=p[o])&&(s=(r?i(t,e,s):i(s))||s);return r&&s&&R(t,e,s),s};class l extends x.Focusable{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.label="hue",this.vertical=!1,this.languageResolver=new P.LanguageResolutionController(this),this.colorController=new k(this,{applyColorToState:()=>{if(this.mode==="opacity"){const t=new u.TinyColor(this.colorController.color);this.sliderHandlePosition=100*t.getAlpha()}else this.sliderHandlePosition=100*(this.colorController.hue/360)},extractColorFromState:t=>this.mode==="opacity"?{...t.getColor("hsl"),a:this.value}:{...t.getColor("hsl"),h:this.value},maintains:"saturation"}),this.sliderHandlePosition=0,this.step=1,this.isLTR=!0,this._altered=0,this._pointerDown=!1}static get styles(){return[y.unsafeCSS($)]}get value(){return this.mode==="opacity"?this.colorController.opacity:this.colorController.hue}set value(t){this.mode==="opacity"?this.colorController.opacity=t:this.colorController.hue=t}get color(){return this.colorController.color}set color(t){this.colorController.color=t}get altered(){return this._altered}set altered(t){this._altered=t,this.step=Math.max(1,this.altered*10)}get focusElement(){return this.input}handleKeydown(t){const{key:e}=t;this.focused=!0,this.altered=[t.shiftKey,t.ctrlKey,t.altKey].filter(i=>!!i).length;let r=0;switch(e){case"ArrowUp":{r=this.step;break}case"ArrowDown":{r=-this.step;break}case"ArrowLeft":{r=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{r=this.step*(this.isLTR?1:-1);break}default:return}t.preventDefault();const o=100/(this.mode==="opacity"?100:360);this.sliderHandlePosition=Math.min(100,Math.max(0,this.sliderHandlePosition+r*o)),this.value=this.mode==="opacity"?Math.min(1,Math.max(0,this.value+r/100)):Math.min(360,Math.max(0,this.value+r)),this.colorController.applyColorFromState(),r!==0&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}handleInput(t){const{valueAsNumber:e}=t.target;this.value=e,this.sliderHandlePosition=100*(this.mode==="opacity"?this.value:this.value/360),this.colorController.applyColorFromState()}handleChange(t){this.handleInput(t),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}focus(t={}){super.focus(t),this.forwardFocus()}forwardFocus(){this.input.focus()}handleFocus(){this.focused=!0}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1)}handlePointerdown(t){if(t.button!==0){t.preventDefault();return}this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),t.target.setPointerCapture(t.pointerId),t.pointerType==="mouse"&&(this.focused=!0)}handlePointermove(t){this.sliderHandlePosition=this.calculateHandlePosition(t),this.value=(this.mode==="opacity"?1:360)*(this.sliderHandlePosition/100),this.colorController.applyColorFromState(),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(t){this._pointerDown=!1,t.target.releasePointerCapture(t.pointerId),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor(),this.focus(),t.pointerType==="mouse"&&(this.focused=!1)}calculateHandlePosition(t){if(!this.boundingClientRect)return this.sliderHandlePosition;const e=this.boundingClientRect,r=this.vertical?e.top:e.left,s=this.vertical?t.clientY:t.clientX,o=this.vertical?e.height:e.width,i=Math.max(0,Math.min(1,(s-r)/o));return this.vertical||!this.isLTR?100-100*i:100*i}handleGradientPointerdown(t){t.button===0&&(t.stopPropagation(),t.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",t)),this.handlePointermove(t))}get handlePositionStyles(){return`${this.vertical?"inset-block-end":"inset-inline-start"}: ${this.sliderHandlePosition}%`}get getColorSliderStyle(){const t=this.vertical?"top":"right";if(this.mode==="opacity"){const e=new u.TinyColor(this.colorController.color).setAlpha(1).toRgbString();return{background:`linear-gradient(to ${t}, transparent, ${e})`}}return{background:`linear-gradient(to ${t}, var(--luzmo-color-slider-gradient, var(--luzmo-color-slider-gradient-fallback)))`}}render(){return y.html`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("@ctrl/tinycolor"),y=require("lit"),n=require("lit/decorators.js"),f=require("lit/directives/if-defined.js"),_=require("lit/directives/style-map.js");require("../color-handle/index.cjs");const x=require("../focusable-CbVKgGfS.cjs"),P=require("../language-resolution-EUER43cg.cjs"),H=require("../streaming-listener-D9Wc7skA.cjs"),C=/^hs[v|l]a?\s?\((\d{1,3}\.?\d*?),?\s?(\d{1,3})/,z=/(^hs[v|l]a?\s?\()\d{1,3}\.?\d*?(,?\s?)\d{1,3}/,S=/(^hs[v|l]a?\()\d{1,3}/,v=(p,t)=>t?p.toHexString():p.toHex();class k{constructor(t,{applyColorToState:e,extractColorFromState:r,maintains:s}){this.maintains="hue",this._hue=0,this._opacity=1,this.getColorProcesses={rgb:(o,i)=>i?o.toRgbString():o.toRgb(),prgb:(o,i)=>i?o.toPercentageRgbString():o.toPercentageRgb(),hex8:(o,i)=>i?o.toHex8String():o.toHex8(),name:o=>o.toName()||o.toRgbString(),hsl:(o,i)=>{if(this.maintains==="hue"){if(i)return o.toHslString().replace(S,`$1${this.hue}`);const{s:c,l:m,a:b}=o.toHsl();return{h:this.hue,s:c,l:m,a:b}}if(i)return o.toHslString().replace(z,`$1${this.hue}$2${this.saturation}`);const{s:h,l:d,a:g}=o.toHsl();return{h:this.hue,s:h,l:d,a:g}},hsv:(o,i)=>{if(this.maintains==="hue"){if(i)return o.toHsvString().replace(S,`$1${this.hue}`);const{s:c,v:m,a:b}=o.toHsv();return{h:this.hue,s:c,v:m,a:b}}if(i)return o.toHsvString().replace(z,`$1${this.hue}$2${this.saturation}`);const{s:h,v:d,a:g}=o.toHsv();return{h:this.hue,s:h,v:d,a:g}},hex:v,hex3:v,hex4:v,hex6:v},this._color=new u.TinyColor({h:0,s:1,v:1}),this._previousColor=new u.TinyColor({h:0,s:1,v:1}),this._format={format:"",isString:!1},this.host=t,this.applyColorToState=e,this.extractColorFromState=r,this.maintains=s||this.maintains}setColorProcess(t,e,r,s){this.maintains==="hue"?this.setColorMaintainHue(t,e,r,s):this.maintains==="saturation"&&this.setColorMaintainSaturation(t,e,r,s)}setColorMaintainHue(t,e,r,s){const{h:o,s:i,v:h,a:d}=this._color.toHsv();let g;if(s&&r.startsWith("hs")){const c=C.exec(e);if(c!==null){const[,m]=c;g=Number(m)}}else if(!s&&r.startsWith("hs")){const c=t.originalInput;g=Object.values(c)[0]}this.hue=g||o,this.opacity=d??1,this.applyColorToState({h:o,s:i,v:h,a:d})}setColorMaintainSaturation(t,e,r,s){const{a:o}=this._color.toHsv();if(s&&r.startsWith("hs")){const i=C.exec(e);if(i!==null){const[,h,d]=i;this.hue=Number(h),this.saturation=Number(d)}}else if(!s&&r.startsWith("hs")){const i=t.originalInput,h=Object.values(i);this.hue=h[0],this.saturation=h[1]}else{const{h:i}=t.toHsv();this.hue=i}this.opacity=o??1,this.applyColorToState(t.toHsv())}applyColorFromState(){this._color=new u.TinyColor(this.extractColorFromState(this))}get hue(){return this._hue}set hue(t){const e=Math.min(360,Math.max(0,t));if(e===this.hue)return;const r=this.hue,{s,v:o,a:i}=this._color.toHsv();this._color=new u.TinyColor({h:e,s,v:o,a:i}),this._hue=e,this.host.requestUpdate("hue",r)}get opacity(){return this._opacity}set opacity(t){const e=Math.min(1,Math.max(0,t));if(e===this.opacity)return;const r=this.opacity,{h:s,s:o,v:i}=this._color.toHsv();this._color=new u.TinyColor({h:s,s:o,v:i,a:e}),this._opacity=e,this.host.requestUpdate("opacity",r)}get value(){return this.color}get color(){return this.getColorProcesses[this._format.format||"hex"](this._color,this._format.isString)}set color(t){if(t===this.color)return;const e=this._color;this._color=new u.TinyColor(t);const r=this._color.format;let s=typeof t=="string"||t instanceof String;r.startsWith("hex")&&(s=t.startsWith("#")),this._format={format:r,isString:s},this.setColorProcess(this._color,t,r,s),this.host.requestUpdate("color",e)}getColor(t){const e={hsl:"toHsl"};return this._color[e[t]]()}setColor(t){this._color=t;const e=typeof this._color.originalInput=="string"||this._color.originalInput instanceof String;this.setColorProcess(this._color,t,this._color.format,e)}getHslString(){return this._color.toHslString()}savePreviousColor(){this._previousColor=this._color.clone()}restorePreviousColor(){this.setColor(this._previousColor)}}const $='.opacity-checkerboard{position:absolute;block-size:100%;inline-size:100%;background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-color-loupe-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-color-loupe-checkerboard-position, left top)/calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2)}:host{--luzmo-color-slider-gradient-fallback: rgb(255 0 0) 0%, rgb(255 255 0) 17%, rgb(0 255 0) 33%, rgb(0 255 255) 50%, rgb(0 0 255) 67%, rgb(255 0 255) 83%, rgb(255 0 0) 100%;touch-action:none}:host([vertical]) .handle{inset-block-start:unset;inset-block-end:0}:host([vertical]) .slider{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}:host(:focus){outline:none}.gradient{overflow:hidden}::slotted(*){width:100%;height:100%}@media (forced-colors: active){:host{--highcontrast-color-slider-border-color: CanvasText;--highcontrast-color-slider-border-color-disabled: GrayText;--highcontrast-color-slider-background-color-disabled: Canvas;forced-color-adjust:none}}:host{--luzmo-color-handle-hitarea-border-radius: var( --luzmo-color-slider-handle-hitarea-border-radius, 0px );min-inline-size:var(--luzmo-color-slider-minimum-length, 80px);inline-size:var(--luzmo-color-slider-length, 192px);block-size:var(--luzmo-color-slider-control-track-width, 24px);-webkit-user-select:none;user-select:none;cursor:default;display:block;position:relative}:host([focused]){z-index:2}:host([disabled]){pointer-events:none}:host([disabled]) .gradient{display:none}:host([vertical]){min-block-size:var(--luzmo-color-slider-vertical-minimum-height, var(--luzmo-color-slider-minimum-length, 80px));block-size:var(--luzmo-color-slider-vertical-height, var(--luzmo-color-slider-length, 192px));min-inline-size:0;inline-size:var(--luzmo-color-slider-vertical-control-track-width, var(--luzmo-color-slider-control-track-height, 24px));display:inline-block}:host([vertical]) .handle{inset-inline-start:50%}.handle{inset-block-start:50%;inset-inline-start:0}.checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color, var(--luzmo-color-slider-border-color, var(--luzmo-border-color)) )}.checkerboard:before{content:"";z-index:1;box-shadow:inset 0 0 0 var(--luzmo-color-slider-border-width, var(--luzmo-border-width)) var(--luzmo-color-slider-border-color-local);border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s));position:absolute;top:0;right:0;bottom:0;left:0}:host([disabled]) .checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color-disabled, var(--luzmo-color-slider-border-color-disabled, var(--luzmo-dimmed-color)) );background:var(--highcontrast-color-slider-background-color-disabled, var(--luzmo-color-slider-background-color-disabled, var(--luzmo-dimmed-color)))}.checkerboard,.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s))}.gradient:dir(rtl),:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}';var R=Object.defineProperty,T=Object.getOwnPropertyDescriptor,a=(p,t,e,r)=>{for(var s=r>1?void 0:r?T(t,e):t,o=p.length-1,i;o>=0;o--)(i=p[o])&&(s=(r?i(t,e,s):i(s))||s);return r&&s&&R(t,e,s),s};class l extends x.Focusable{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.label="hue",this.vertical=!1,this.languageResolver=new P.LanguageResolutionController(this),this.colorController=new k(this,{applyColorToState:()=>{if(this.mode==="opacity"){const t=new u.TinyColor(this.colorController.color);this.sliderHandlePosition=100*t.getAlpha()}else this.sliderHandlePosition=100*(this.colorController.hue/360)},extractColorFromState:t=>this.mode==="opacity"?{...t.getColor("hsl"),a:this.value}:{...t.getColor("hsl"),h:this.value},maintains:"saturation"}),this.sliderHandlePosition=0,this.step=1,this.isLTR=!0,this._altered=0,this._pointerDown=!1}static get styles(){return[y.unsafeCSS($)]}get value(){return this.mode==="opacity"?this.colorController.opacity:this.colorController.hue}set value(t){this.mode==="opacity"?this.colorController.opacity=t:this.colorController.hue=t}get color(){return this.colorController.color}set color(t){this.colorController.color=t}get altered(){return this._altered}set altered(t){this._altered=t,this.step=Math.max(1,this.altered*10)}get focusElement(){return this.input}handleKeydown(t){const{key:e}=t;this.focused=!0,this.altered=[t.shiftKey,t.ctrlKey,t.altKey].filter(i=>!!i).length;let r=0;switch(e){case"ArrowUp":{r=this.step;break}case"ArrowDown":{r=-this.step;break}case"ArrowLeft":{r=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{r=this.step*(this.isLTR?1:-1);break}default:return}t.preventDefault();const o=100/(this.mode==="opacity"?100:360);this.sliderHandlePosition=Math.min(100,Math.max(0,this.sliderHandlePosition+r*o)),this.value=this.mode==="opacity"?Math.min(1,Math.max(0,this.value+r/100)):Math.min(360,Math.max(0,this.value+r)),this.colorController.applyColorFromState(),r!==0&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}handleInput(t){const{valueAsNumber:e}=t.target;this.value=e,this.sliderHandlePosition=100*(this.mode==="opacity"?this.value:this.value/360),this.colorController.applyColorFromState()}handleChange(t){this.handleInput(t),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}focus(t={}){super.focus(t),this.forwardFocus()}forwardFocus(){this.input.focus()}handleFocus(){this.focused=!0}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1)}handlePointerdown(t){if(t.button!==0){t.preventDefault();return}this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),t.target.setPointerCapture(t.pointerId),t.pointerType==="mouse"&&(this.focused=!0)}handlePointermove(t){this.sliderHandlePosition=this.calculateHandlePosition(t),this.value=(this.mode==="opacity"?1:360)*(this.sliderHandlePosition/100),this.colorController.applyColorFromState(),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(t){this._pointerDown=!1,t.target.releasePointerCapture(t.pointerId),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor(),this.focus(),t.pointerType==="mouse"&&(this.focused=!1)}calculateHandlePosition(t){if(!this.boundingClientRect)return this.sliderHandlePosition;const e=this.boundingClientRect,r=this.vertical?e.top:e.left,s=this.vertical?t.clientY:t.clientX,o=this.vertical?e.height:e.width,i=Math.max(0,Math.min(1,(s-r)/o));return this.vertical||!this.isLTR?100-100*i:100*i}handleGradientPointerdown(t){t.button===0&&(t.stopPropagation(),t.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",t)),this.handlePointermove(t))}get handlePositionStyles(){return`${this.vertical?"inset-block-end":"inset-inline-start"}: ${this.sliderHandlePosition}%`}get getColorSliderStyle(){const t=this.vertical?"top":"right";if(this.mode==="opacity"){const e=new u.TinyColor(this.colorController.color).setAlpha(1).toRgbString();return{background:`linear-gradient(to ${t}, transparent, ${e})`}}return{background:`linear-gradient(to ${t}, var(--luzmo-color-slider-gradient, var(--luzmo-color-slider-gradient-fallback)))`}}render(){return y.html`
       <div
         class="opacity-checkerboard checkerboard"
         role="presentation"

package/components/color-slider/index.js

@@ -23,7 +23,7 @@ import { styleMap as H } from "lit/directives/style-map.js";
 import "../color-handle/index.js";
 import { F as P } from "../focusable-BjvsvVam.js";
 import { L as $ } from "../language-resolution-B-wjV5bb.js";
-import { s as R } from "../streaming-listener-BgU36S1Z.js";
+import { s as R } from "../streaming-listener-BlWm-XZU.js";
 const S = () => {
   if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
     const a = document.createElement("style");

package/components/date-time-picker/index.cjs

@@ -15,7 +15,7 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  * */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@internationalized/date"),$=require("@internationalized/number"),D=require("lit"),h=require("lit/decorators.js"),U=require("lit/directives/class-map.js"),V=require("lit/directives/if-defined.js"),j=require("lit/directives/style-map.js"),I=require("../when-CDZyJPvd.cjs"),R=require("../focusable-CbVKgGfS.cjs"),O=require("../sized-mixin-DcvJLFeo.cjs"),A=require("@luzmo/icons");require("../calendar/index.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../picker-button/index.cjs");require("../popover/index.cjs");const W=require("../manage-help-text-Bat9yGvF.cjs"),G=require("../text-field.module-DXhFA9G-.cjs"),n={Year:"year",Month:"month",Day:"day",Hour:"hour",Minute:"minute",Second:"second",Millisecond:"fractionalSecond",DayPeriod:"dayPeriod",Literal:"literal"},K={[n.Year]:"––––",[n.Month]:"––",[n.Day]:"––",[n.Hour]:"––",[n.Minute]:"––",[n.Second]:"––",[n.Millisecond]:"–––",[n.DayPeriod]:"––"},f={Day:"day",Hour:"hour",Minute:"minute",Second:"second",Millisecond:"millisecond"},q=0,_=12,E=2e3,X=31;function y(o){return typeof o=="number"}function P(o){return o instanceof l.ZonedDateTime}function L(o){return o instanceof l.CalendarDateTime}function F(o){return o instanceof l.CalendarDate}function N(o,e){return o=o%_+e}function B(o){return o>=_?_:q}function Z(o,e){return o.length===e.length&&o.every((t,i)=>t===e[i])}function H(o){return F(o)?new Date(o.year,o.month-1,o.day):new Date(o.year,o.month-1,o.day,o.hour,o.minute,o.second,o.millisecond)}class w{constructor(e,t,i){this.type=e,this.formatted=t,this.label=i,this.placeholder=K[e]}increment(e){this.value===void 0?this.value=this.minValue:(this.value=this.value+1,this.value>this.maxValue&&(this.value=this.minValue))}decrement(e){this.value===void 0?this.value=this.maxValue:(this.value=this.value-1,this.value<this.minValue&&(this.value=this.maxValue))}setValueFromDate(e){this.type==="fractionalSecond"?this.value=e.millisecond:this.type!==n.DayPeriod&&(this.value=e[this.type])}clear(){this.value=void 0}handleInput(e,t){const i=t.parse(e);if(Number.isNaN(i))return;const a=t.parse(`${this.value??""}${i}`);if(this.isInputValueCompliant(a)){this.value=a;return}this.isInputValueCompliant(i)&&(this.value=i)}isInputValueCompliant(e){const{minValue:t,maxValue:i}=this.inputValidationLimits;return e>=t&&e<=i}get inputValidationLimits(){return{minValue:this.minValue,maxValue:this.maxValue}}updateValueToLimits(){this.value!==void 0&&(this.value<this.minValue&&(this.value=this.minValue),this.value>this.maxValue&&(this.value=this.maxValue))}}class Y extends w{constructor(e,t){super(n.Year,e,t),this.minValue=1,this.maxValue=9999}setLimits(e){this.minValue=1,this.maxValue=e.calendar.getYearsInEra(e),this.updateValueToLimits()}increment(e){this.value===void 0?this.value=e.year:super.increment()}decrement(e){this.value===void 0?this.value=e.year:super.decrement()}clear(){if(this.value===void 0)return;const e=Math.floor(this.value/10);this.value=e>0?e:void 0}}class M{constructor(e){this.segments=e}get all(){return this.segments}get editableValues(){return this.all.filter(e=>e instanceof w).map(e=>e.value)}get year(){const e=this.getByType(n.Year);if(e&&e instanceof Y)return e}get month(){const e=this.getByType(n.Month);if(e)return e}get day(){const e=this.getByType(n.Day);if(e)return e}get hour(){const e=this.getByType(n.Hour);if(e)return e}get minute(){const e=this.getByType(n.Minute);if(e)return e}get second(){const e=this.getByType(n.Second);if(e)return e}get millisecond(){const e=this.getByType(n.Millisecond);if(e)return e}get dayPeriod(){const e=this.getByType(n.DayPeriod);if(e)return e}getByType(e){return this.segments.find(t=>t.type===e)}getFormattedDate(e=f.Day){var c,g,k,b,v,z,x;const t=(c=this.year)==null?void 0:c.value,i=(g=this.month)==null?void 0:g.value,a=(k=this.day)==null?void 0:k.value;if(!y(t)||!y(i)||!y(a))return;if(e===f.Day)return new l.CalendarDate(t,i,a);let r=(b=this.hour)==null?void 0:b.value;if(!y(r))return;if(this.dayPeriod){const S=this.dayPeriod.value;if(!y(S))return;r=N(r,S)}if(e===f.Hour)return new l.CalendarDateTime(t,i,a,r);const s=(v=this.minute)==null?void 0:v.value;if(!y(s))return;if(e===f.Minute)return new l.CalendarDateTime(t,i,a,r,s);const d=(z=this.second)==null?void 0:z.value;if(!y(d))return;if(e===f.Second)return new l.CalendarDateTime(t,i,a,r,s,d);const m=(x=this.millisecond)==null?void 0:x.value;if(y(m))return new l.CalendarDateTime(t,i,a,r,s,d,m)}}class J{constructor(e,t){this.dateFormatter=e,this.currentDate=t,this.numberFormatter=new $.NumberFormatter(this.dateFormatter.resolvedOptions().locale,{useGrouping:!1})}format(e){if(!e.year||!e.month||!e.day)return e;const t=this.getDateInfoWithDefaults(e);return t&&(this.setSegmentsFormatted(e,t),this.padSegmentsFormatted(e)),e}setSegmentsFormatted(e,t){var v;e=new M(e.all);const{year:i,month:a,day:r,hour:s,minute:d,second:m,millisecond:c}=t,g=new Date(i,a-1,r,s,d,m,c);if(!e.year)return;e.year.formatted=this.numberFormatter.format(i);const k=[n.Month,n.Day,n.Hour,n.Minute,n.Second,n.DayPeriod],b=this.dateFormatter.formatToParts(g);for(const z of k){const x=e[z];if(!x)continue;const S=(v=b.find(T=>T.type===z))==null?void 0:v.value;S&&(x.formatted=S)}}padSegmentsFormatted(e){if(!e.hour)return;const t=[n.Month,n.Day,n.Hour,n.Minute,n.Second];for(const i of t){const a=e[i];a&&(a.formatted=a.formatted.padStart(2,this.numberFormatter.format(0)))}}getDateInfoWithDefaults(e){var g,k,b,v,z;if(!e.year||!e.month||!e.day)return;const t=e.day.value??l.getMinimumDayInMonth(this.currentDate),i=e.month.value??l.getMinimumMonthInYear(this.currentDate),a=e.year.value??E,r=(g=e.dayPeriod)==null?void 0:g.value;let s=(k=e.hour)==null?void 0:k.value;y(s)?y(r)&&(s=N(s,r)):s=y(r)?r:this.currentDate.hour;const d=((b=e.minute)==null?void 0:b.value)??this.currentDate.minute,m=((v=e.second)==null?void 0:v.value)??this.currentDate.second,c=((z=e.millisecond)==null?void 0:z.value)??this.currentDate.millisecond;return{year:a,month:i,day:t,hour:s,minute:d,second:m,millisecond:c}}}class C{constructor(e){const{dateFormatter:t,segments:i,currentDate:a}=e;this.segments=new M(i.all),this.dateFormatter=t,this.currentDate=a}modify(e){const t=this.segments.getByType(e);if(!t)return this.segments;this.modifySegment(t),this.updateSegmentsLimits(e);const i=new J(this.dateFormatter,this.currentDate);return this.segments=i.format(this.segments),this.segments}updateSegmentsLimits(e){const t=e===n.Year,i=e===n.Month,a=this.segments.year,r=this.segments.month,s=this.segments.day;t&&(r==null||r.setLimits(this.currentDate),s==null||s.setLimits(this.currentDate,r==null?void 0:r.value,a==null?void 0:a.value)),i&&(s==null||s.setLimits(this.currentDate,r==null?void 0:r.value,a==null?void 0:a.value))}}class Q extends C{modifySegment(e){e.clear()}}class ee extends C{modifySegment(e){e.decrement(this.currentDate)}}class te extends C{modifySegment(e){e.increment(this.currentDate)}}class ie extends C{constructor(e){const{dateFormatter:t,segments:i,currentDate:a}=e;super({dateFormatter:t,segments:i,currentDate:a}),this.eventData=e.eventData,this.numberParser=e.numberParser}modifySegment(e){this.eventData!==null&&e.handleInput(this.eventData,this.numberParser)}}class ae extends w{constructor(e,t){super(n.Day,e,t),this.minValue=1,this.maxValue=31}setLimits(e,t,i){if(!y(t)){this.minValue=1,this.maxValue=X;return}y(i)||(i=E);const a=new l.CalendarDate(i,t,1);this.maxValue=e.calendar.getDaysInMonth(a),this.minValue=l.getMinimumDayInMonth(a),this.updateValueToLimits()}}class re extends w{constructor(e,t){super(n.Month,e,t),this.minValue=1,this.maxValue=12}setLimits(e){this.minValue=l.getMinimumMonthInYear(e),this.maxValue=e.calendar.getMonthsInYear(e),this.updateValueToLimits()}}class ne{constructor(e){this.formatted=e,this.type=n.Literal}}class oe extends w{constructor(e,t){super(n.DayPeriod,e,t),this.minValue=q,this.maxValue=_,this.localizedMinValue="AM",this.localizedMaxValue="PM"}toggleAmPm(){this.value=this.value===q?_:q}increment(){this.value===void 0?this.value=this.minValue:this.toggleAmPm()}decrement(){this.value===void 0?this.value=this.maxValue:this.toggleAmPm()}setValueFromDate(e){this.value=B(e.hour)}handleInput(e){const t=e.toLowerCase(),i=this.localizedMinValue.toLowerCase().includes(t),a=this.localizedMaxValue.toLowerCase().includes(t);i&&a||(i&&(this.value=q),a&&(this.value=_))}setLocalizedLimits(e){const t=new Date(0,0,0,this.minValue,0),i=new Date(0,0,0,this.maxValue,0),[a,r]=[t,i].map(this.getDayPeriodFromDate.bind(this,e));a&&(this.localizedMinValue=a),r&&(this.localizedMaxValue=r)}getDayPeriodFromDate(e,t){var i;return(i=e.formatToParts(t).find(a=>a.type===this.type))==null?void 0:i.value}}class se extends w{constructor(e,t){super(n.Hour,e,t),this.minValue=0,this.maxValue=23}setLimits(e){this.minValue=0,this.maxValue=23,e&&(this.minValue=0,this.maxValue=11),this.updateValueToLimits()}setValueFromDate(e,t){t?this.value=e.hour-B(e.hour):super.setValueFromDate(e)}get inputValidationLimits(){const e=this.maxValue===11;return{minValue:e?1:0,maxValue:e?12:23}}}class le extends w{constructor(e,t){super(n.Millisecond,e,t),this.minValue=0,this.maxValue=999}}class de extends w{constructor(e,t){super(n.Minute,e,t),this.minValue=0,this.maxValue=59}}class ce extends w{constructor(e,t){super(n.Second,e,t),this.minValue=0,this.maxValue=59}}class ue{constructor(e){this.dateFormatter=e;const t=this.dateFormatter.resolvedOptions().locale;this.numberFormatter=new $.NumberFormatter(t,{useGrouping:!1}),this.dateTimeFieldDisplayNames=new Intl.DisplayNames([t],{type:"dateTimeField"})}createSegments(e,t=!1){const i=H(e),a=this.dateFormatter.formatToParts(i).map(x=>{const S=x.type;let T=x.value;return S==="year"&&(T=this.numberFormatter.format(e.year)),this.createSegment(S,T)}),r=new M(a),s=r.year,d=r.month,m=r.day;s.setLimits(e),d.setLimits(e),t&&(s.setValueFromDate(e),d.setValueFromDate(e)),m.setLimits(e,d.value,s.value),t&&m.setValueFromDate(e);const c=r.hour,g=r.minute,k=r.second,b=r.millisecond,v=r.dayPeriod;if(v&&v.setLocalizedLimits(this.dateFormatter),!c)return r;const z=!!v;if(c.setLimits(z),t){if(c.setValueFromDate(e,z),z&&r.dayPeriod.setValueFromDate(e),!g||(g.setValueFromDate(e),!k)||(k.setValueFromDate(e),!b))return r;b.setValueFromDate(e)}return r}createSegment(e,t){if(e===n.Literal)return new ne(t);const i=this.displayNameOfType(e);switch(e){case n.Year:return new Y(t,i);case n.Month:return new re(t,i);case n.Day:return new ae(t,i);case n.Hour:return new se(t,i);case n.Minute:return new de(t,i);case n.Second:return new ce(t,i);case n.Millisecond:return new le(t,i);case n.DayPeriod:return new oe(t,i)}}displayNameOfType(e){const t=e==="fractionalSecond"?"millisecond":this.dateTimeFieldDisplayNames.of(e);return t?t.charAt(0).toUpperCase()+t.slice(1):""}}const me='@charset "UTF-8";:host{font-family:var(--luzmo-font-family);--date-time-picker-border-radius: var( --luzmo-date-time-picker-border-radius, var(--luzmo-border-radius) );--date-time-picker-border-radius-quiet: var( --luzmo-date-time-picker-border-radius-quiet, 0 );--date-time-picker-border-width: var(--luzmo-border-width);--date-time-picker-button-border-color: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color, var(--luzmo-border-color) ) );--date-time-picker-button-border-color-focus: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color-focus, var(--luzmo-primary) ) );--date-time-picker-button-border-color-invalid: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color-invalid, var(--luzmo-negative-color) ) );--date-time-picker-button-width: calc( var(--date-time-picker-edge-to-disclosure-icon) * 2 + var(--date-time-picker-icon-size) );--date-time-picker-quiet-button-offset: var( --luzmo-date-time-picker-quiet-button-offset, var(--date-time-picker-text-to-visual) );--date-time-picker-icon-to-text: var(--date-time-picker-edge-to-text);--date-time-picker-button-width-quiet: calc( var(--date-time-picker-button-width) - var( --date-time-picker-quiet-button-offset ) );--date-time-picker-focus-ring-gap: var( --luzmo-date-time-picker-focus-ring-gap, var(--luzmo-indicator-gap) );--date-time-picker-focus-thickness: var( --luzmo-date-time-picker-focus-thickness, var(--luzmo-indicator-width) );--date-time-picker-focus-animation: var( --luzmo-date-time-picker-focus-animation, var(--luzmo-animation-duration) );--date-time-picker-focus-ring-width: var( --luzmo-date-time-picker-focus-ring-width, var(--luzmo-border-width) );--date-time-picker-focus-ring-color: var( --highcontrast-datepicker-focus-ring-color, var(--luzmo-date-time-picker-focus-ring-color, var(--luzmo-indicator-color)) );--date-time-picker-focus-line-gap: var( --luzmo-date-time-picker-focus-line-gap, var(--luzmo-spacing-2) );--date-time-picker-invalid-quiet-color: var( --luzmo-date-time-picker-invalid-quiet-color, var(--luzmo-negative-color) );--date-time-picker-quiet-border-color-hover: var( --luzmo-date-time-picker-quiet-border-color-hover, var(--luzmo-border-color-hover) );--date-time-picker-border-color-disabled: var( --luzmo-date-time-picker-border-color-disabled, var(--luzmo-border-color-disabled) );--date-time-picker-dash-font-size: var( --luzmo-date-time-picker-dash-font-size, var(--date-time-picker-dash-font-size) );--date-time-picker-dash-color: var( --highcontrast-datepicker-dash-color, var(--luzmo-date-time-picker-dash-color, var(--luzmo-font-color)) );--date-time-picker-range-dash-padding-top: var( --luzmo-date-time-picker-range-dash-padding-top, 0 );--date-time-picker-range-dash-margin-inline-start: var( --luzmo-date-time-picker-range-dash-margin-left, calc(var(--date-time-picker-dash-font-size) * -.5) );--date-time-picker-range-input-width-first: var( --luzmo-date-time-picker-range-input-width-first, calc( var(--date-time-picker-initial-width) - var( --date-time-picker-generic-padding ) * 2 ) );--date-time-picker-input-width-base: calc( var(--date-time-picker-range-input-width-first) + var(--date-time-picker-icon-size) );--date-time-picker-input-width: var( --luzmo-date-time-picker-input-width, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-initial-height) ) );--date-time-picker-range-input-width-quiet-first: var( --luzmo-date-time-picker-range-input-width-quiet-first, calc( var(--date-time-picker-width-quiet-first) + var(--date-time-picker-width-quiet-second) ) );--date-time-picker-input-width-quiet: var( --luzmo-date-time-picker-input-width-quiet, calc( var(--date-time-picker-range-input-width-quiet-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-datetime-input-width-first: var( --luzmo-date-time-picker-datetime-input-width-first, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-datetime-width-first) ) );--date-time-picker-datetime-input-width: var( --luzmo-date-time-picker-datetime-input-width, calc( var(--date-time-picker-datetime-input-width-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-datetime-quiet-input-width-first: var( --luzmo-date-time-picker-datetime-quiet-input-width-first, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-input-datetime-width) ) );--date-time-picker-datetime-quiet-input-width: var( --luzmo-date-time-picker-datetime-quiet-input-width, calc( var(--date-time-picker-datetime-quiet-input-width-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-padding-inline-end: var( --luzmo-date-time-picker-padding-inline, calc( var(--date-time-picker-button-width) + var(--date-time-picker-edge-to-text) - var( --date-time-picker-border-width ) * 2 ) );--date-time-picker-padding-inline-end-quiet: var( --luzmo-date-time-picker-padding-inline-quiet, calc( var(--date-time-picker-button-width) + var(--date-time-picker-edge-to-text) - var( --date-time-picker-quiet-button-offset ) ) );--date-time-picker-padding-inline-end-invalid-quiet: var( --luzmo-date-time-picker-padding-inline-end-invalid-quiet, calc( var(--date-time-picker-button-width-quiet) + var(--date-time-picker-icon-size) + var(--date-time-picker-icon-to-text) ) );min-inline-size:var(--luzmo-date-time-picker-min-width, var(--date-time-picker-min-width));border-radius:var(--date-time-picker-border-radius);flex-flow:row;display:inline-flex;position:relative}:host([disabled]) luzmo-picker-button{cursor:default}:host([disabled]){--luzmo-date-time-picker-dash-color: var( --luzmo-date-time-picker-dash-color-disabled, var(--disabled-content-color) );--luzmo-text-field-border-color-disabled: transparent}:host([invalid]),:host([invalid]) #text-field .icon{--luzmo-text-field-icon-spacing-inline-end-invalid: calc( var(--date-time-picker-button-width) + var(--date-time-picker-invalid-icon-to-button) );--luzmo-text-field-icon-spacing-inline-end-quiet-invalid: calc( var(--date-time-picker-button-width-quiet) + var(--date-time-picker-invalid-icon-to-button-quiet) )}:host(:not([quiet])){inline-size:var(--luzmo-date-time-picker-width, var(--date-time-picker-width))}:host([quiet]){inline-size:var(--luzmo-date-time-picker-width-quiet, var(--date-time-picker-width-quiet, var(--date-time-picker-width)))}:host(:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color )}:host([focused]),:host([focused]:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color-focus )}:host([invalid]:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color-invalid )}.input{inline-size:100%;flex:1;padding-inline-end:var(--date-time-picker-padding-inline-end);border-color:var(--luzmo-date-time-picker-border-color, var(--datepicker-border-color))}:host .input:read-only{border-color:var(--luzmo-date-time-picker-border-color, var(--datepicker-border-color))}.input.luzmo-DatePicker-startField{border-inline-end:0;border-start-end-radius:0;border-end-end-radius:0;padding-inline-end:var(--luzmo-date-time-picker-generic-padding, var(--date-time-picker-generic-padding))}.input.luzmo-DatePicker-endField{border-inline-start:0;border-start-start-radius:0;border-end-start-radius:0;padding-inline-start:var(--luzmo-date-time-picker-generic-padding, var(--date-time-picker-generic-padding))}luzmo-picker-button{cursor:pointer;position:absolute;inset-inline-end:0}.luzmo-DatePicker-rangeDash{color:var(--date-time-picker-dash-color);line-height:var(--luzmo-date-time-picker-dash-line-height, var(--date-time-picker-dash-line-height));flex:initial;inline-size:0;z-index:1;padding-block-start:var(--date-time-picker-range-dash-padding-top)}.luzmo-DatePicker-rangeDash:before{content:"–";margin-block:0;margin-inline:var(--date-time-picker-range-dash-margin-inline-start);text-align:center;vertical-align:middle;inline-size:var(--date-time-picker-dash-font-size);display:inline-block;overflow:hidden}:host([quiet]){--luzmo-date-time-picker-border-radius: var( --date-time-picker-border-radius-quiet );--luzmo-date-time-picker-padding-inline: var( --date-time-picker-padding-inline-end-quiet );--luzmo-picker-button-border-color-disabled: var( --date-time-picker-border-color-disabled );--luzmo-picker-button-background-color-hover-disabled: var( --date-time-picker-border-color-disabled )}:host([quiet][disabled]){--luzmo-text-field-border-color-disabled: var( --date-time-picker-border-color-disabled )}:host([quiet][invalid]) .input:not(.luzmo-DatePicker-startField){padding-inline-end:var(--date-time-picker-padding-inline-end-invalid-quiet)}@media (hover: hover){:host(:hover):not([focused],[disabled],[invalid]){--luzmo-picker-button-border-color: var( --date-time-picker-quiet-border-color-hover )}}:host([quiet][invalid]){--luzmo-picker-button-border-color: var( --date-time-picker-invalid-quiet-color )}:host([quiet]) luzmo-picker-button{inline-size:auto;inset-inline-end:calc(var(--date-time-picker-quiet-button-offset) * -1)}:host([quiet]) luzmo-picker-button:not(.is-open){--luzmo-picker-button-border-color-disabled: transparent}:host([quiet]) luzmo-picker-button:not(:disabled,.is-open){--luzmo-picker-button-background-color: transparent}.luzmo-DatePicker--range{--luzmo-date-time-picker-border-radius: var(--date-time-picker-border-radius)}.luzmo-DatePicker--range:after{pointer-events:none;content:"";margin:calc(var(--date-time-picker-focus-ring-gap) * -1);border-radius:calc(var(--date-time-picker-border-radius) + var(--date-time-picker-focus-ring-gap));transition:box-shadow var(--date-time-picker-focus-animation) ease-in-out,border-color var(--date-time-picker-focus-animation) ease-in-out;border-color:#0000;position:absolute;top:0;right:0;bottom:0;left:0}:host([focused]) .luzmo-DatePicker--range:not(.luzmo-DatePicker--quiet):after{box-shadow:0 0 0 var(--date-time-picker-focus-ring-width) var(--date-time-picker-focus-ring-color)}:host([focused]) .luzmo-DatePicker--range:not(.luzmo-DatePicker--quiet) #text-field:after{display:none}:host([quiet]) .luzmo-DatePicker--range{--luzmo-date-time-picker-border-radius: var( --date-time-picker-border-radius-quiet )}:host([quiet][focused]) .luzmo-DatePicker--range:after{box-shadow:none;border-block-end:var(--date-time-picker-focus-thickness) solid var(--date-time-picker-focus-ring-color);border-radius:0;margin:0;inset-block-end:calc(var(--date-time-picker-focus-line-gap) * -1)}:host([quiet]) .luzmo-DatePicker--range #text-field{min-inline-size:0;inline-size:var(--date-time-picker-input-width-quiet)}:host([quiet]) .luzmo-DatePicker--range #text-field:first-of-type{inline-size:var(--date-time-picker-range-input-width-quiet-first)}.luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field{inline-size:var(--date-time-picker-datetime-input-width);min-inline-size:0}.luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field:first-of-type{inline-size:var(--date-time-picker-datetime-input-width-first)}:host([quiet]) .luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field{inline-size:var(--date-time-picker-datetime-quiet-input-width)}:host([quiet]) .luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field:first-of-type{inline-size:var(--date-time-picker-datetime-quiet-input-width-first)}.luzmo-DatePicker--range #text-field{flex:initial;min-inline-size:0;inline-size:var(--date-time-picker-input-width)}.luzmo-DatePicker--range #text-field:first-of-type{inline-size:var(--date-time-picker-range-input-width-first)}@media (forced-colors: active){:host{--highcontrast-datepicker-dash-color: CanvasText;--highcontrast-datepicker-focus-ring-color: Highlight;--highcontrast-datepicker-pickerbutton-border-color: Highlight}:host([disabled]){--highcontrast-datepicker-dash-color: GrayText}:host([quiet][invalid]){--highcontrast-datepicker-pickerbutton-border-color: Highlight}}:host{--date-time-picker-width: auto;--date-time-picker-initial-height: var(--system-date-picker-initial-height);--date-time-picker-font-color-default: var(--luzmo-font-color);--datepicker-border-color: var(--luzmo-border-color);--date-time-picker-button-indicator-color: var(--luzmo-indicator-color);--text-field-focus-indicator-color: var(--luzmo-background-color-highlight);--date-time-picker-initial-width: 120px;--date-time-picker-min-width: 160px;--date-time-picker-calendar-padding: var(--luzmo-spacing-4);--date-time-picker-icon-size: 18px;--date-time-picker-dash-font-size: var(--luzmo-font-size);--date-time-picker-text-to-visual: var(--luzmo-spacing-3);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-3);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-3);--date-time-picker-generic-padding: var(--luzmo-spacing-4)}:host([size=s]){--date-time-picker-min-width: 140px;--date-time-picker-calendar-padding: var(--luzmo-spacing-3);--date-time-picker-icon-size: 16px;--date-time-picker-dash-font-size: var(--luzmo-font-size-s);--date-time-picker-text-to-visual: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-disclosure-icon: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-text: var(--luzmo-spacing-3);--date-time-picker-invalid-icon-to-button: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: var(--luzmo-spacing-3)}:host([invalid][size=s]){--text-field-icon-spacing-block-invalid: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=m]){--date-time-picker-min-width: 160px;--date-time-picker-calendar-padding: var(--luzmo-spacing-4);--date-time-picker-icon-size: 18px;--date-time-picker-dash-font-size: var(--luzmo-font-size-m);--date-time-picker-text-to-visual: var(--luzmo-spacing-3);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-3);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-3);--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) )}:host([size=l]){--date-time-picker-min-width: 180px;--date-time-picker-calendar-padding: var(--luzmo-spacing-5);--date-time-picker-icon-size: 20px;--date-time-picker-dash-font-size: var(--luzmo-font-size-l);--date-time-picker-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-text: var(--luzmo-spacing-4);--date-time-picker-invalid-icon-to-button: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: var(--luzmo-spacing-4)}:host([size=xl]){--date-time-picker-min-width: 200px;--date-time-picker-calendar-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--date-time-picker-icon-size: 22px;--date-time-picker-dash-font-size: var(--luzmo-font-size-xl);--date-time-picker-text-to-visual: var(--luzmo-spacing-4);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-4);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-4);--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) )}:host{--status-icon-size: var( --luzmo-text-field-icon-size-invalid, var(--text-field-icon-size-invalid) );--picker-button-size: var( --luzmo-text-field-height, var(--text-field-height) );--input-spacing: var( --luzmo-text-field-spacing-inline, var(--text-field-spacing-inline) );--input-border-width: var( --luzmo-text-field-border-width, var(--luzmo-border-width) );--text-to-icon: var( --luzmo-text-field-icon-spacing-inline-start-invalid, var(--text-field-icon-spacing-inline-start-invalid) );--date-time-picker-input-width: var(--date-time-picker-width);flex-wrap:wrap}:host #text-field{display:inline-block}:host #text-field .input,:host([quiet]) #text-field .input,:host([valid]) #text-field .input,:host([invalid]) #text-field .input{inline-size:100%}:host #text-field .input,:host([quiet]) #text-field .input{padding-inline-end:calc(var(--picker-button-size) + var(--input-spacing) - var(--input-border-width))}:host([valid]) #text-field .input,:host([invalid]) #text-field .input{inline-size:100%;padding-inline-end:calc(var(--status-icon-size) + var(--picker-button-size) + var(--input-spacing) - var(--input-border-width) + var(--text-to-icon))}@media (hover: hover){:host([invalid]) #text-field:hover .input,:host([focused][invalid]) .input:hover,:host([focused][invalid]) #text-field:hover .input{border-color:var(--highcontrast-text-field-border-color-invalid-default, var(--luzmo-text-field-border-color-invalid-default, var(--luzmo-negative-color-hover)))}}luzmo-picker-button:focus-visible{outline:none}luzmo-popover{overflow-y:auto}luzmo-popover .popover-content{padding:var(--luzmo-date-time-picker-calendar-padding, var(--date-time-picker-calendar-padding))}.input-content{display:flex;align-items:center;height:100%;overflow:auto hidden;scrollbar-width:none;line-height:normal}.input-content::-webkit-scrollbar{display:none;width:0;height:0}.literal-segment,.editable-segment{display:inline-block;color:var(--luzmo-date-time-picker-font-color-default, var(--date-time-picker-font-color-default))}.editable-segment{padding:0 .15em;font-variant-numeric:tabular-nums;text-align:end;white-space:nowrap;caret-color:transparent;outline:none}[dir=ltr] .editable-segment{text-align:start}.literal-segment{white-space:pre;user-select:none;-webkit-user-select:none}.is-placeholder,.is-placeholder+.literal-segment{color:var(--luzmo-font-color-disabled)}.editable-segment:focus-visible{color:var(--white);background-color:var(--highcontrast-text-field-focus-indicator-color, var(--luzmo-text-field-focus-indicator-color, var(--text-field-focus-indicator-color)))}.editable-segment::selection{background-color:transparent}';var he=Object.defineProperty,pe=Object.getOwnPropertyDescriptor,p=(o,e,t,i)=>{for(var a=i>1?void 0:i?pe(e,t):e,r=o.length-1,s;r>=0;r--)(s=o[r])&&(a=(i?s(e,t,a):s(a))||a);return i&&a&&he(e,t,a),a};class u extends W.ManageHelpText(O.SizedMixin(R.Focusable,{validSizes:Object.values(O.ElementSizes)})){constructor(){super(),this._precision=f.Minute,this.isUserSetPrecision=!1,this.invalid=!1,this.readonly=!1,this.quiet=!1,this.placement="bottom",this.language="en",this.labels={previous:"Previous",next:"Next",today:"Today",selected:"Selected",empty:"Empty",calendar:"Calendar"},this.focused=!1,this.segments=new M([]),this.isCalendarOpen=!1,this._timeZone=this.timeZone??l.getLocalTimeZone(),this.cachedLocalTime=l.now(this._timeZone),this.setNumberParser(),this.setDateFormatter(),this.setAriaDateFormatter(),this.addEventListener("focusin",()=>this.previousCommitedValue=this._value),this.addEventListener("focusout",()=>this.commitValue())}static get styles(){return[D.unsafeCSS(me),D.unsafeCSS(G.textFieldStyles)]}get precision(){return this._precision}set precision(e){this.isUserSetPrecision=!0;const t=this._precision;e!==t&&(this._precision=e,this.requestUpdate("precision",t))}get _language(){try{return this.language?new Intl.Locale(this.language).language:"en"}catch{return"en"}}get focusElement(){return this.firstEditableSegment}get currentDate(){return this._value?l.toZoned(this._value,this._timeZone):this.cachedLocalTime}get includesTime(){return[f.Hour,f.Minute,f.Second,f.Millisecond].includes(this.precision)}clear(){this._value=void 0,this.setSegments()}willUpdate(e){const t=e.has("value"),i=e.has("timeZone"),a=e.has("min"),r=e.has("max"),s=e.has("language"),d=e.has("dateFormat"),m=e.has("dateSeparator"),c=e.has("precision"),g=e.has("segments"),k=e.has("disabled");if(s&&this.setNumberParser(),(s||c)&&(this.setDateFormatter(),this.setAriaDateFormatter()),t||a||r||i){this._value=this.value?l.parseAbsolute(new Date(this.value).toISOString(),"UTC"):void 0,this._min=this.min?l.parseAbsolute(new Date(this.min).toISOString(),"UTC"):void 0,this._max=this.max?l.parseAbsolute(new Date(this.max).toISOString(),"UTC"):void 0;const v=this.mostSpecificDateValue;v&&(this.convertDatePropsToMatch(v),this.checkDatePropsCompliance(a||r),this.updateDateProps(),this.updateDefaultPrecision())}(t||s||c||d||i||m)&&this.setSegments(),g&&this.setValueFromSegments(),k&&this.isCalendarOpen&&(this.isCalendarOpen=!1);const b=this._value&&this.labels.selected+": "+this.ariaDateFormatter.format(H(this._value));this.setAttribute("aria-label",b??this.labels.empty)}get mostSpecificDateValue(){const e=[this._value,this._min,this._max].filter(r=>r!==void 0);if(e.length===0)return;const t=e.filter(r=>P(r));if(t.length>0)return t[0];const i=e.filter(r=>L(r));return i.length>0?i[0]:e.find(r=>F(r))}convertDatePropsToMatch(e){if(P(e)){this._timeZone=this.timeZone??e.timeZone,this._value=this._value&&l.toZoned(this._value,this._timeZone),this._min=this._min&&l.toZoned(this._min,this._timeZone),this._max=this._max&&l.toZoned(this._max,this._timeZone);return}if(this._timeZone=this.timeZone??l.getLocalTimeZone(),L(e)){this._value=this._value&&l.toCalendarDateTime(this._value),this._min=this._min&&l.toCalendarDateTime(this._min),this._max=this._max&&l.toCalendarDateTime(this._max);return}this._value=this._value&&l.toCalendarDate(this._value),this._min=this._min&&l.toCalendarDate(this._min),this._max=this._max&&l.toCalendarDate(this._max)}checkDatePropsCompliance(e){e&&this._min&&this._max&&(this._min.compare(this._max)<0||(console.warn(this,`<${this.localName}> expects the 'min' to be less than 'max'. Please ensure that 'min' property's date is earlier than 'max' property's date.`),this._min=void 0,this._max=void 0)),this.isNonCompliantValue()&&(console.warn(this,`<${this.localName}> expects the preselected value to comply with the min and max constraints. Please ensure that 'value' property's date is in between the dates for the 'min' and 'max' properties.`),this._value=void 0),!this._min&&!this._max&&!this._value&&(this._timeZone=l.getLocalTimeZone())}isNonCompliantValue(){return this._value===void 0?!1:!!(this._min&&this._value.compare(this._min)<0||this._max&&this._value.compare(this._max)>0)}updateDateProps(){const e=this.mostSpecificDateValue;if(!e||!this.isUserSetPrecision)return;this.includesTime&&F(e)&&this.convertDatePropsToMatch(l.toCalendarDateTime(e))}updateDefaultPrecision(){if(this.isUserSetPrecision)return;const e=this.mostSpecificDateValue;e&&(this._precision=F(e)?f.Day:f.Minute)}render(){return D.html`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("@internationalized/date"),$=require("@internationalized/number"),D=require("lit"),h=require("lit/decorators.js"),U=require("lit/directives/class-map.js"),V=require("lit/directives/if-defined.js"),j=require("lit/directives/style-map.js"),I=require("lit/directives/when.js"),R=require("../focusable-CbVKgGfS.cjs"),O=require("../sized-mixin-DcvJLFeo.cjs"),A=require("@luzmo/icons");require("../calendar/index.cjs");require("../icon/index.cjs");require("../overlay/index.cjs");require("../picker-button/index.cjs");require("../popover/index.cjs");const W=require("../manage-help-text-Bat9yGvF.cjs"),G=require("../text-field.module-DXhFA9G-.cjs"),n={Year:"year",Month:"month",Day:"day",Hour:"hour",Minute:"minute",Second:"second",Millisecond:"fractionalSecond",DayPeriod:"dayPeriod",Literal:"literal"},K={[n.Year]:"––––",[n.Month]:"––",[n.Day]:"––",[n.Hour]:"––",[n.Minute]:"––",[n.Second]:"––",[n.Millisecond]:"–––",[n.DayPeriod]:"––"},f={Day:"day",Hour:"hour",Minute:"minute",Second:"second",Millisecond:"millisecond"},q=0,_=12,E=2e3,X=31;function y(o){return typeof o=="number"}function P(o){return o instanceof l.ZonedDateTime}function L(o){return o instanceof l.CalendarDateTime}function F(o){return o instanceof l.CalendarDate}function N(o,e){return o=o%_+e}function B(o){return o>=_?_:q}function Z(o,e){return o.length===e.length&&o.every((t,i)=>t===e[i])}function H(o){return F(o)?new Date(o.year,o.month-1,o.day):new Date(o.year,o.month-1,o.day,o.hour,o.minute,o.second,o.millisecond)}class w{constructor(e,t,i){this.type=e,this.formatted=t,this.label=i,this.placeholder=K[e]}increment(e){this.value===void 0?this.value=this.minValue:(this.value=this.value+1,this.value>this.maxValue&&(this.value=this.minValue))}decrement(e){this.value===void 0?this.value=this.maxValue:(this.value=this.value-1,this.value<this.minValue&&(this.value=this.maxValue))}setValueFromDate(e){this.type==="fractionalSecond"?this.value=e.millisecond:this.type!==n.DayPeriod&&(this.value=e[this.type])}clear(){this.value=void 0}handleInput(e,t){const i=t.parse(e);if(Number.isNaN(i))return;const a=t.parse(`${this.value??""}${i}`);if(this.isInputValueCompliant(a)){this.value=a;return}this.isInputValueCompliant(i)&&(this.value=i)}isInputValueCompliant(e){const{minValue:t,maxValue:i}=this.inputValidationLimits;return e>=t&&e<=i}get inputValidationLimits(){return{minValue:this.minValue,maxValue:this.maxValue}}updateValueToLimits(){this.value!==void 0&&(this.value<this.minValue&&(this.value=this.minValue),this.value>this.maxValue&&(this.value=this.maxValue))}}class Y extends w{constructor(e,t){super(n.Year,e,t),this.minValue=1,this.maxValue=9999}setLimits(e){this.minValue=1,this.maxValue=e.calendar.getYearsInEra(e),this.updateValueToLimits()}increment(e){this.value===void 0?this.value=e.year:super.increment()}decrement(e){this.value===void 0?this.value=e.year:super.decrement()}clear(){if(this.value===void 0)return;const e=Math.floor(this.value/10);this.value=e>0?e:void 0}}class M{constructor(e){this.segments=e}get all(){return this.segments}get editableValues(){return this.all.filter(e=>e instanceof w).map(e=>e.value)}get year(){const e=this.getByType(n.Year);if(e&&e instanceof Y)return e}get month(){const e=this.getByType(n.Month);if(e)return e}get day(){const e=this.getByType(n.Day);if(e)return e}get hour(){const e=this.getByType(n.Hour);if(e)return e}get minute(){const e=this.getByType(n.Minute);if(e)return e}get second(){const e=this.getByType(n.Second);if(e)return e}get millisecond(){const e=this.getByType(n.Millisecond);if(e)return e}get dayPeriod(){const e=this.getByType(n.DayPeriod);if(e)return e}getByType(e){return this.segments.find(t=>t.type===e)}getFormattedDate(e=f.Day){var c,g,k,b,v,z,x;const t=(c=this.year)==null?void 0:c.value,i=(g=this.month)==null?void 0:g.value,a=(k=this.day)==null?void 0:k.value;if(!y(t)||!y(i)||!y(a))return;if(e===f.Day)return new l.CalendarDate(t,i,a);let r=(b=this.hour)==null?void 0:b.value;if(!y(r))return;if(this.dayPeriod){const S=this.dayPeriod.value;if(!y(S))return;r=N(r,S)}if(e===f.Hour)return new l.CalendarDateTime(t,i,a,r);const s=(v=this.minute)==null?void 0:v.value;if(!y(s))return;if(e===f.Minute)return new l.CalendarDateTime(t,i,a,r,s);const d=(z=this.second)==null?void 0:z.value;if(!y(d))return;if(e===f.Second)return new l.CalendarDateTime(t,i,a,r,s,d);const m=(x=this.millisecond)==null?void 0:x.value;if(y(m))return new l.CalendarDateTime(t,i,a,r,s,d,m)}}class J{constructor(e,t){this.dateFormatter=e,this.currentDate=t,this.numberFormatter=new $.NumberFormatter(this.dateFormatter.resolvedOptions().locale,{useGrouping:!1})}format(e){if(!e.year||!e.month||!e.day)return e;const t=this.getDateInfoWithDefaults(e);return t&&(this.setSegmentsFormatted(e,t),this.padSegmentsFormatted(e)),e}setSegmentsFormatted(e,t){var v;e=new M(e.all);const{year:i,month:a,day:r,hour:s,minute:d,second:m,millisecond:c}=t,g=new Date(i,a-1,r,s,d,m,c);if(!e.year)return;e.year.formatted=this.numberFormatter.format(i);const k=[n.Month,n.Day,n.Hour,n.Minute,n.Second,n.DayPeriod],b=this.dateFormatter.formatToParts(g);for(const z of k){const x=e[z];if(!x)continue;const S=(v=b.find(T=>T.type===z))==null?void 0:v.value;S&&(x.formatted=S)}}padSegmentsFormatted(e){if(!e.hour)return;const t=[n.Month,n.Day,n.Hour,n.Minute,n.Second];for(const i of t){const a=e[i];a&&(a.formatted=a.formatted.padStart(2,this.numberFormatter.format(0)))}}getDateInfoWithDefaults(e){var g,k,b,v,z;if(!e.year||!e.month||!e.day)return;const t=e.day.value??l.getMinimumDayInMonth(this.currentDate),i=e.month.value??l.getMinimumMonthInYear(this.currentDate),a=e.year.value??E,r=(g=e.dayPeriod)==null?void 0:g.value;let s=(k=e.hour)==null?void 0:k.value;y(s)?y(r)&&(s=N(s,r)):s=y(r)?r:this.currentDate.hour;const d=((b=e.minute)==null?void 0:b.value)??this.currentDate.minute,m=((v=e.second)==null?void 0:v.value)??this.currentDate.second,c=((z=e.millisecond)==null?void 0:z.value)??this.currentDate.millisecond;return{year:a,month:i,day:t,hour:s,minute:d,second:m,millisecond:c}}}class C{constructor(e){const{dateFormatter:t,segments:i,currentDate:a}=e;this.segments=new M(i.all),this.dateFormatter=t,this.currentDate=a}modify(e){const t=this.segments.getByType(e);if(!t)return this.segments;this.modifySegment(t),this.updateSegmentsLimits(e);const i=new J(this.dateFormatter,this.currentDate);return this.segments=i.format(this.segments),this.segments}updateSegmentsLimits(e){const t=e===n.Year,i=e===n.Month,a=this.segments.year,r=this.segments.month,s=this.segments.day;t&&(r==null||r.setLimits(this.currentDate),s==null||s.setLimits(this.currentDate,r==null?void 0:r.value,a==null?void 0:a.value)),i&&(s==null||s.setLimits(this.currentDate,r==null?void 0:r.value,a==null?void 0:a.value))}}class Q extends C{modifySegment(e){e.clear()}}class ee extends C{modifySegment(e){e.decrement(this.currentDate)}}class te extends C{modifySegment(e){e.increment(this.currentDate)}}class ie extends C{constructor(e){const{dateFormatter:t,segments:i,currentDate:a}=e;super({dateFormatter:t,segments:i,currentDate:a}),this.eventData=e.eventData,this.numberParser=e.numberParser}modifySegment(e){this.eventData!==null&&e.handleInput(this.eventData,this.numberParser)}}class ae extends w{constructor(e,t){super(n.Day,e,t),this.minValue=1,this.maxValue=31}setLimits(e,t,i){if(!y(t)){this.minValue=1,this.maxValue=X;return}y(i)||(i=E);const a=new l.CalendarDate(i,t,1);this.maxValue=e.calendar.getDaysInMonth(a),this.minValue=l.getMinimumDayInMonth(a),this.updateValueToLimits()}}class re extends w{constructor(e,t){super(n.Month,e,t),this.minValue=1,this.maxValue=12}setLimits(e){this.minValue=l.getMinimumMonthInYear(e),this.maxValue=e.calendar.getMonthsInYear(e),this.updateValueToLimits()}}class ne{constructor(e){this.formatted=e,this.type=n.Literal}}class oe extends w{constructor(e,t){super(n.DayPeriod,e,t),this.minValue=q,this.maxValue=_,this.localizedMinValue="AM",this.localizedMaxValue="PM"}toggleAmPm(){this.value=this.value===q?_:q}increment(){this.value===void 0?this.value=this.minValue:this.toggleAmPm()}decrement(){this.value===void 0?this.value=this.maxValue:this.toggleAmPm()}setValueFromDate(e){this.value=B(e.hour)}handleInput(e){const t=e.toLowerCase(),i=this.localizedMinValue.toLowerCase().includes(t),a=this.localizedMaxValue.toLowerCase().includes(t);i&&a||(i&&(this.value=q),a&&(this.value=_))}setLocalizedLimits(e){const t=new Date(0,0,0,this.minValue,0),i=new Date(0,0,0,this.maxValue,0),[a,r]=[t,i].map(this.getDayPeriodFromDate.bind(this,e));a&&(this.localizedMinValue=a),r&&(this.localizedMaxValue=r)}getDayPeriodFromDate(e,t){var i;return(i=e.formatToParts(t).find(a=>a.type===this.type))==null?void 0:i.value}}class se extends w{constructor(e,t){super(n.Hour,e,t),this.minValue=0,this.maxValue=23}setLimits(e){this.minValue=0,this.maxValue=23,e&&(this.minValue=0,this.maxValue=11),this.updateValueToLimits()}setValueFromDate(e,t){t?this.value=e.hour-B(e.hour):super.setValueFromDate(e)}get inputValidationLimits(){const e=this.maxValue===11;return{minValue:e?1:0,maxValue:e?12:23}}}class le extends w{constructor(e,t){super(n.Millisecond,e,t),this.minValue=0,this.maxValue=999}}class de extends w{constructor(e,t){super(n.Minute,e,t),this.minValue=0,this.maxValue=59}}class ce extends w{constructor(e,t){super(n.Second,e,t),this.minValue=0,this.maxValue=59}}class ue{constructor(e){this.dateFormatter=e;const t=this.dateFormatter.resolvedOptions().locale;this.numberFormatter=new $.NumberFormatter(t,{useGrouping:!1}),this.dateTimeFieldDisplayNames=new Intl.DisplayNames([t],{type:"dateTimeField"})}createSegments(e,t=!1){const i=H(e),a=this.dateFormatter.formatToParts(i).map(x=>{const S=x.type;let T=x.value;return S==="year"&&(T=this.numberFormatter.format(e.year)),this.createSegment(S,T)}),r=new M(a),s=r.year,d=r.month,m=r.day;s.setLimits(e),d.setLimits(e),t&&(s.setValueFromDate(e),d.setValueFromDate(e)),m.setLimits(e,d.value,s.value),t&&m.setValueFromDate(e);const c=r.hour,g=r.minute,k=r.second,b=r.millisecond,v=r.dayPeriod;if(v&&v.setLocalizedLimits(this.dateFormatter),!c)return r;const z=!!v;if(c.setLimits(z),t){if(c.setValueFromDate(e,z),z&&r.dayPeriod.setValueFromDate(e),!g||(g.setValueFromDate(e),!k)||(k.setValueFromDate(e),!b))return r;b.setValueFromDate(e)}return r}createSegment(e,t){if(e===n.Literal)return new ne(t);const i=this.displayNameOfType(e);switch(e){case n.Year:return new Y(t,i);case n.Month:return new re(t,i);case n.Day:return new ae(t,i);case n.Hour:return new se(t,i);case n.Minute:return new de(t,i);case n.Second:return new ce(t,i);case n.Millisecond:return new le(t,i);case n.DayPeriod:return new oe(t,i)}}displayNameOfType(e){const t=e==="fractionalSecond"?"millisecond":this.dateTimeFieldDisplayNames.of(e);return t?t.charAt(0).toUpperCase()+t.slice(1):""}}const me='@charset "UTF-8";:host{font-family:var(--luzmo-font-family);--date-time-picker-border-radius: var( --luzmo-date-time-picker-border-radius, var(--luzmo-border-radius) );--date-time-picker-border-radius-quiet: var( --luzmo-date-time-picker-border-radius-quiet, 0 );--date-time-picker-border-width: var(--luzmo-border-width);--date-time-picker-button-border-color: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color, var(--luzmo-border-color) ) );--date-time-picker-button-border-color-focus: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color-focus, var(--luzmo-primary) ) );--date-time-picker-button-border-color-invalid: var( --highcontrast-datepicker-pickerbutton-border-color, var( --luzmo-date-time-picker-pickerbutton-border-color-invalid, var(--luzmo-negative-color) ) );--date-time-picker-button-width: calc( var(--date-time-picker-edge-to-disclosure-icon) * 2 + var(--date-time-picker-icon-size) );--date-time-picker-quiet-button-offset: var( --luzmo-date-time-picker-quiet-button-offset, var(--date-time-picker-text-to-visual) );--date-time-picker-icon-to-text: var(--date-time-picker-edge-to-text);--date-time-picker-button-width-quiet: calc( var(--date-time-picker-button-width) - var( --date-time-picker-quiet-button-offset ) );--date-time-picker-focus-ring-gap: var( --luzmo-date-time-picker-focus-ring-gap, var(--luzmo-indicator-gap) );--date-time-picker-focus-thickness: var( --luzmo-date-time-picker-focus-thickness, var(--luzmo-indicator-width) );--date-time-picker-focus-animation: var( --luzmo-date-time-picker-focus-animation, var(--luzmo-animation-duration) );--date-time-picker-focus-ring-width: var( --luzmo-date-time-picker-focus-ring-width, var(--luzmo-border-width) );--date-time-picker-focus-ring-color: var( --highcontrast-datepicker-focus-ring-color, var(--luzmo-date-time-picker-focus-ring-color, var(--luzmo-indicator-color)) );--date-time-picker-focus-line-gap: var( --luzmo-date-time-picker-focus-line-gap, var(--luzmo-spacing-2) );--date-time-picker-invalid-quiet-color: var( --luzmo-date-time-picker-invalid-quiet-color, var(--luzmo-negative-color) );--date-time-picker-quiet-border-color-hover: var( --luzmo-date-time-picker-quiet-border-color-hover, var(--luzmo-border-color-hover) );--date-time-picker-border-color-disabled: var( --luzmo-date-time-picker-border-color-disabled, var(--luzmo-border-color-disabled) );--date-time-picker-dash-font-size: var( --luzmo-date-time-picker-dash-font-size, var(--date-time-picker-dash-font-size) );--date-time-picker-dash-color: var( --highcontrast-datepicker-dash-color, var(--luzmo-date-time-picker-dash-color, var(--luzmo-font-color)) );--date-time-picker-range-dash-padding-top: var( --luzmo-date-time-picker-range-dash-padding-top, 0 );--date-time-picker-range-dash-margin-inline-start: var( --luzmo-date-time-picker-range-dash-margin-left, calc(var(--date-time-picker-dash-font-size) * -.5) );--date-time-picker-range-input-width-first: var( --luzmo-date-time-picker-range-input-width-first, calc( var(--date-time-picker-initial-width) - var( --date-time-picker-generic-padding ) * 2 ) );--date-time-picker-input-width-base: calc( var(--date-time-picker-range-input-width-first) + var(--date-time-picker-icon-size) );--date-time-picker-input-width: var( --luzmo-date-time-picker-input-width, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-initial-height) ) );--date-time-picker-range-input-width-quiet-first: var( --luzmo-date-time-picker-range-input-width-quiet-first, calc( var(--date-time-picker-width-quiet-first) + var(--date-time-picker-width-quiet-second) ) );--date-time-picker-input-width-quiet: var( --luzmo-date-time-picker-input-width-quiet, calc( var(--date-time-picker-range-input-width-quiet-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-datetime-input-width-first: var( --luzmo-date-time-picker-datetime-input-width-first, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-datetime-width-first) ) );--date-time-picker-datetime-input-width: var( --luzmo-date-time-picker-datetime-input-width, calc( var(--date-time-picker-datetime-input-width-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-datetime-quiet-input-width-first: var( --luzmo-date-time-picker-datetime-quiet-input-width-first, calc( var(--date-time-picker-input-width-base) + var(--date-time-picker-input-datetime-width) ) );--date-time-picker-datetime-quiet-input-width: var( --luzmo-date-time-picker-datetime-quiet-input-width, calc( var(--date-time-picker-datetime-quiet-input-width-first) + var(--date-time-picker-icon-size) + var(--date-time-picker-initial-height) ) );--date-time-picker-padding-inline-end: var( --luzmo-date-time-picker-padding-inline, calc( var(--date-time-picker-button-width) + var(--date-time-picker-edge-to-text) - var( --date-time-picker-border-width ) * 2 ) );--date-time-picker-padding-inline-end-quiet: var( --luzmo-date-time-picker-padding-inline-quiet, calc( var(--date-time-picker-button-width) + var(--date-time-picker-edge-to-text) - var( --date-time-picker-quiet-button-offset ) ) );--date-time-picker-padding-inline-end-invalid-quiet: var( --luzmo-date-time-picker-padding-inline-end-invalid-quiet, calc( var(--date-time-picker-button-width-quiet) + var(--date-time-picker-icon-size) + var(--date-time-picker-icon-to-text) ) );min-inline-size:var(--luzmo-date-time-picker-min-width, var(--date-time-picker-min-width));border-radius:var(--date-time-picker-border-radius);flex-flow:row;display:inline-flex;position:relative}:host([disabled]) luzmo-picker-button{cursor:default}:host([disabled]){--luzmo-date-time-picker-dash-color: var( --luzmo-date-time-picker-dash-color-disabled, var(--disabled-content-color) );--luzmo-text-field-border-color-disabled: transparent}:host([invalid]),:host([invalid]) #text-field .icon{--luzmo-text-field-icon-spacing-inline-end-invalid: calc( var(--date-time-picker-button-width) + var(--date-time-picker-invalid-icon-to-button) );--luzmo-text-field-icon-spacing-inline-end-quiet-invalid: calc( var(--date-time-picker-button-width-quiet) + var(--date-time-picker-invalid-icon-to-button-quiet) )}:host(:not([quiet])){inline-size:var(--luzmo-date-time-picker-width, var(--date-time-picker-width))}:host([quiet]){inline-size:var(--luzmo-date-time-picker-width-quiet, var(--date-time-picker-width-quiet, var(--date-time-picker-width)))}:host(:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color )}:host([focused]),:host([focused]:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color-focus )}:host([invalid]:not([quiet],[disabled])){--luzmo-picker-button-border-color: var( --date-time-picker-button-border-color-invalid )}.input{inline-size:100%;flex:1;padding-inline-end:var(--date-time-picker-padding-inline-end);border-color:var(--luzmo-date-time-picker-border-color, var(--datepicker-border-color))}:host .input:read-only{border-color:var(--luzmo-date-time-picker-border-color, var(--datepicker-border-color))}.input.luzmo-DatePicker-startField{border-inline-end:0;border-start-end-radius:0;border-end-end-radius:0;padding-inline-end:var(--luzmo-date-time-picker-generic-padding, var(--date-time-picker-generic-padding))}.input.luzmo-DatePicker-endField{border-inline-start:0;border-start-start-radius:0;border-end-start-radius:0;padding-inline-start:var(--luzmo-date-time-picker-generic-padding, var(--date-time-picker-generic-padding))}luzmo-picker-button{cursor:pointer;position:absolute;inset-inline-end:0}.luzmo-DatePicker-rangeDash{color:var(--date-time-picker-dash-color);line-height:var(--luzmo-date-time-picker-dash-line-height, var(--date-time-picker-dash-line-height));flex:initial;inline-size:0;z-index:1;padding-block-start:var(--date-time-picker-range-dash-padding-top)}.luzmo-DatePicker-rangeDash:before{content:"–";margin-block:0;margin-inline:var(--date-time-picker-range-dash-margin-inline-start);text-align:center;vertical-align:middle;inline-size:var(--date-time-picker-dash-font-size);display:inline-block;overflow:hidden}:host([quiet]){--luzmo-date-time-picker-border-radius: var( --date-time-picker-border-radius-quiet );--luzmo-date-time-picker-padding-inline: var( --date-time-picker-padding-inline-end-quiet );--luzmo-picker-button-border-color-disabled: var( --date-time-picker-border-color-disabled );--luzmo-picker-button-background-color-hover-disabled: var( --date-time-picker-border-color-disabled )}:host([quiet][disabled]){--luzmo-text-field-border-color-disabled: var( --date-time-picker-border-color-disabled )}:host([quiet][invalid]) .input:not(.luzmo-DatePicker-startField){padding-inline-end:var(--date-time-picker-padding-inline-end-invalid-quiet)}@media (hover: hover){:host(:hover):not([focused],[disabled],[invalid]){--luzmo-picker-button-border-color: var( --date-time-picker-quiet-border-color-hover )}}:host([quiet][invalid]){--luzmo-picker-button-border-color: var( --date-time-picker-invalid-quiet-color )}:host([quiet]) luzmo-picker-button{inline-size:auto;inset-inline-end:calc(var(--date-time-picker-quiet-button-offset) * -1)}:host([quiet]) luzmo-picker-button:not(.is-open){--luzmo-picker-button-border-color-disabled: transparent}:host([quiet]) luzmo-picker-button:not(:disabled,.is-open){--luzmo-picker-button-background-color: transparent}.luzmo-DatePicker--range{--luzmo-date-time-picker-border-radius: var(--date-time-picker-border-radius)}.luzmo-DatePicker--range:after{pointer-events:none;content:"";margin:calc(var(--date-time-picker-focus-ring-gap) * -1);border-radius:calc(var(--date-time-picker-border-radius) + var(--date-time-picker-focus-ring-gap));transition:box-shadow var(--date-time-picker-focus-animation) ease-in-out,border-color var(--date-time-picker-focus-animation) ease-in-out;border-color:#0000;position:absolute;top:0;right:0;bottom:0;left:0}:host([focused]) .luzmo-DatePicker--range:not(.luzmo-DatePicker--quiet):after{box-shadow:0 0 0 var(--date-time-picker-focus-ring-width) var(--date-time-picker-focus-ring-color)}:host([focused]) .luzmo-DatePicker--range:not(.luzmo-DatePicker--quiet) #text-field:after{display:none}:host([quiet]) .luzmo-DatePicker--range{--luzmo-date-time-picker-border-radius: var( --date-time-picker-border-radius-quiet )}:host([quiet][focused]) .luzmo-DatePicker--range:after{box-shadow:none;border-block-end:var(--date-time-picker-focus-thickness) solid var(--date-time-picker-focus-ring-color);border-radius:0;margin:0;inset-block-end:calc(var(--date-time-picker-focus-line-gap) * -1)}:host([quiet]) .luzmo-DatePicker--range #text-field{min-inline-size:0;inline-size:var(--date-time-picker-input-width-quiet)}:host([quiet]) .luzmo-DatePicker--range #text-field:first-of-type{inline-size:var(--date-time-picker-range-input-width-quiet-first)}.luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field{inline-size:var(--date-time-picker-datetime-input-width);min-inline-size:0}.luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field:first-of-type{inline-size:var(--date-time-picker-datetime-input-width-first)}:host([quiet]) .luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field{inline-size:var(--date-time-picker-datetime-quiet-input-width)}:host([quiet]) .luzmo-DatePicker--range.luzmo-DatePicker--datetimeRange #text-field:first-of-type{inline-size:var(--date-time-picker-datetime-quiet-input-width-first)}.luzmo-DatePicker--range #text-field{flex:initial;min-inline-size:0;inline-size:var(--date-time-picker-input-width)}.luzmo-DatePicker--range #text-field:first-of-type{inline-size:var(--date-time-picker-range-input-width-first)}@media (forced-colors: active){:host{--highcontrast-datepicker-dash-color: CanvasText;--highcontrast-datepicker-focus-ring-color: Highlight;--highcontrast-datepicker-pickerbutton-border-color: Highlight}:host([disabled]){--highcontrast-datepicker-dash-color: GrayText}:host([quiet][invalid]){--highcontrast-datepicker-pickerbutton-border-color: Highlight}}:host{--date-time-picker-width: auto;--date-time-picker-initial-height: var(--system-date-picker-initial-height);--date-time-picker-font-color-default: var(--luzmo-font-color);--datepicker-border-color: var(--luzmo-border-color);--date-time-picker-button-indicator-color: var(--luzmo-indicator-color);--text-field-focus-indicator-color: var(--luzmo-background-color-highlight);--date-time-picker-initial-width: 120px;--date-time-picker-min-width: 160px;--date-time-picker-calendar-padding: var(--luzmo-spacing-4);--date-time-picker-icon-size: 18px;--date-time-picker-dash-font-size: var(--luzmo-font-size);--date-time-picker-text-to-visual: var(--luzmo-spacing-3);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-3);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-3);--date-time-picker-generic-padding: var(--luzmo-spacing-4)}:host([size=s]){--date-time-picker-min-width: 140px;--date-time-picker-calendar-padding: var(--luzmo-spacing-3);--date-time-picker-icon-size: 16px;--date-time-picker-dash-font-size: var(--luzmo-font-size-s);--date-time-picker-text-to-visual: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-disclosure-icon: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-text: var(--luzmo-spacing-3);--date-time-picker-invalid-icon-to-button: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: var(--luzmo-spacing-3)}:host([invalid][size=s]){--text-field-icon-spacing-block-invalid: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) )}:host([size=m]){--date-time-picker-min-width: 160px;--date-time-picker-calendar-padding: var(--luzmo-spacing-4);--date-time-picker-icon-size: 18px;--date-time-picker-dash-font-size: var(--luzmo-font-size-m);--date-time-picker-text-to-visual: var(--luzmo-spacing-3);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-3);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-3);--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) )}:host([size=l]){--date-time-picker-min-width: 180px;--date-time-picker-calendar-padding: var(--luzmo-spacing-5);--date-time-picker-icon-size: 20px;--date-time-picker-dash-font-size: var(--luzmo-font-size-l);--date-time-picker-text-to-visual: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-disclosure-icon: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-edge-to-text: var(--luzmo-spacing-4);--date-time-picker-invalid-icon-to-button: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--date-time-picker-icon-to-text: var(--luzmo-spacing-4)}:host([size=xl]){--date-time-picker-min-width: 200px;--date-time-picker-calendar-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--date-time-picker-icon-size: 22px;--date-time-picker-dash-font-size: var(--luzmo-font-size-xl);--date-time-picker-text-to-visual: var(--luzmo-spacing-4);--date-time-picker-edge-to-disclosure-icon: var(--luzmo-spacing-4);--date-time-picker-edge-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) );--date-time-picker-invalid-icon-to-button: var(--luzmo-spacing-4);--date-time-picker-icon-to-text: calc( var(--luzmo-spacing-4) + var(--luzmo-spacing-1) )}:host{--status-icon-size: var( --luzmo-text-field-icon-size-invalid, var(--text-field-icon-size-invalid) );--picker-button-size: var( --luzmo-text-field-height, var(--text-field-height) );--input-spacing: var( --luzmo-text-field-spacing-inline, var(--text-field-spacing-inline) );--input-border-width: var( --luzmo-text-field-border-width, var(--luzmo-border-width) );--text-to-icon: var( --luzmo-text-field-icon-spacing-inline-start-invalid, var(--text-field-icon-spacing-inline-start-invalid) );--date-time-picker-input-width: var(--date-time-picker-width);flex-wrap:wrap}:host #text-field{display:inline-block}:host #text-field .input,:host([quiet]) #text-field .input,:host([valid]) #text-field .input,:host([invalid]) #text-field .input{inline-size:100%}:host #text-field .input,:host([quiet]) #text-field .input{padding-inline-end:calc(var(--picker-button-size) + var(--input-spacing) - var(--input-border-width))}:host([valid]) #text-field .input,:host([invalid]) #text-field .input{inline-size:100%;padding-inline-end:calc(var(--status-icon-size) + var(--picker-button-size) + var(--input-spacing) - var(--input-border-width) + var(--text-to-icon))}@media (hover: hover){:host([invalid]) #text-field:hover .input,:host([focused][invalid]) .input:hover,:host([focused][invalid]) #text-field:hover .input{border-color:var(--highcontrast-text-field-border-color-invalid-default, var(--luzmo-text-field-border-color-invalid-default, var(--luzmo-negative-color-hover)))}}luzmo-picker-button:focus-visible{outline:none}luzmo-popover{overflow-y:auto}luzmo-popover .popover-content{padding:var(--luzmo-date-time-picker-calendar-padding, var(--date-time-picker-calendar-padding))}.input-content{display:flex;align-items:center;height:100%;overflow:auto hidden;scrollbar-width:none;line-height:normal}.input-content::-webkit-scrollbar{display:none;width:0;height:0}.literal-segment,.editable-segment{display:inline-block;color:var(--luzmo-date-time-picker-font-color-default, var(--date-time-picker-font-color-default))}.editable-segment{padding:0 .15em;font-variant-numeric:tabular-nums;text-align:end;white-space:nowrap;caret-color:transparent;outline:none}[dir=ltr] .editable-segment{text-align:start}.literal-segment{white-space:pre;user-select:none;-webkit-user-select:none}.is-placeholder,.is-placeholder+.literal-segment{color:var(--luzmo-font-color-disabled)}.editable-segment:focus-visible{color:var(--white);background-color:var(--highcontrast-text-field-focus-indicator-color, var(--luzmo-text-field-focus-indicator-color, var(--text-field-focus-indicator-color)))}.editable-segment::selection{background-color:transparent}';var he=Object.defineProperty,pe=Object.getOwnPropertyDescriptor,p=(o,e,t,i)=>{for(var a=i>1?void 0:i?pe(e,t):e,r=o.length-1,s;r>=0;r--)(s=o[r])&&(a=(i?s(e,t,a):s(a))||a);return i&&a&&he(e,t,a),a};class u extends W.ManageHelpText(O.SizedMixin(R.Focusable,{validSizes:Object.values(O.ElementSizes)})){constructor(){super(),this._precision=f.Minute,this.isUserSetPrecision=!1,this.invalid=!1,this.readonly=!1,this.quiet=!1,this.placement="bottom",this.language="en",this.labels={previous:"Previous",next:"Next",today:"Today",selected:"Selected",empty:"Empty",calendar:"Calendar"},this.focused=!1,this.segments=new M([]),this.isCalendarOpen=!1,this._timeZone=this.timeZone??l.getLocalTimeZone(),this.cachedLocalTime=l.now(this._timeZone),this.setNumberParser(),this.setDateFormatter(),this.setAriaDateFormatter(),this.addEventListener("focusin",()=>this.previousCommitedValue=this._value),this.addEventListener("focusout",()=>this.commitValue())}static get styles(){return[D.unsafeCSS(me),D.unsafeCSS(G.textFieldStyles)]}get precision(){return this._precision}set precision(e){this.isUserSetPrecision=!0;const t=this._precision;e!==t&&(this._precision=e,this.requestUpdate("precision",t))}get _language(){try{return this.language?new Intl.Locale(this.language).language:"en"}catch{return"en"}}get focusElement(){return this.firstEditableSegment}get currentDate(){return this._value?l.toZoned(this._value,this._timeZone):this.cachedLocalTime}get includesTime(){return[f.Hour,f.Minute,f.Second,f.Millisecond].includes(this.precision)}clear(){this._value=void 0,this.setSegments()}willUpdate(e){const t=e.has("value"),i=e.has("timeZone"),a=e.has("min"),r=e.has("max"),s=e.has("language"),d=e.has("dateFormat"),m=e.has("dateSeparator"),c=e.has("precision"),g=e.has("segments"),k=e.has("disabled");if(s&&this.setNumberParser(),(s||c)&&(this.setDateFormatter(),this.setAriaDateFormatter()),t||a||r||i){this._value=this.value?l.parseAbsolute(new Date(this.value).toISOString(),"UTC"):void 0,this._min=this.min?l.parseAbsolute(new Date(this.min).toISOString(),"UTC"):void 0,this._max=this.max?l.parseAbsolute(new Date(this.max).toISOString(),"UTC"):void 0;const v=this.mostSpecificDateValue;v&&(this.convertDatePropsToMatch(v),this.checkDatePropsCompliance(a||r),this.updateDateProps(),this.updateDefaultPrecision())}(t||s||c||d||i||m)&&this.setSegments(),g&&this.setValueFromSegments(),k&&this.isCalendarOpen&&(this.isCalendarOpen=!1);const b=this._value&&this.labels.selected+": "+this.ariaDateFormatter.format(H(this._value));this.setAttribute("aria-label",b??this.labels.empty)}get mostSpecificDateValue(){const e=[this._value,this._min,this._max].filter(r=>r!==void 0);if(e.length===0)return;const t=e.filter(r=>P(r));if(t.length>0)return t[0];const i=e.filter(r=>L(r));return i.length>0?i[0]:e.find(r=>F(r))}convertDatePropsToMatch(e){if(P(e)){this._timeZone=this.timeZone??e.timeZone,this._value=this._value&&l.toZoned(this._value,this._timeZone),this._min=this._min&&l.toZoned(this._min,this._timeZone),this._max=this._max&&l.toZoned(this._max,this._timeZone);return}if(this._timeZone=this.timeZone??l.getLocalTimeZone(),L(e)){this._value=this._value&&l.toCalendarDateTime(this._value),this._min=this._min&&l.toCalendarDateTime(this._min),this._max=this._max&&l.toCalendarDateTime(this._max);return}this._value=this._value&&l.toCalendarDate(this._value),this._min=this._min&&l.toCalendarDate(this._min),this._max=this._max&&l.toCalendarDate(this._max)}checkDatePropsCompliance(e){e&&this._min&&this._max&&(this._min.compare(this._max)<0||(console.warn(this,`<${this.localName}> expects the 'min' to be less than 'max'. Please ensure that 'min' property's date is earlier than 'max' property's date.`),this._min=void 0,this._max=void 0)),this.isNonCompliantValue()&&(console.warn(this,`<${this.localName}> expects the preselected value to comply with the min and max constraints. Please ensure that 'value' property's date is in between the dates for the 'min' and 'max' properties.`),this._value=void 0),!this._min&&!this._max&&!this._value&&(this._timeZone=l.getLocalTimeZone())}isNonCompliantValue(){return this._value===void 0?!1:!!(this._min&&this._value.compare(this._min)<0||this._max&&this._value.compare(this._max)>0)}updateDateProps(){const e=this.mostSpecificDateValue;if(!e||!this.isUserSetPrecision)return;this.includesTime&&F(e)&&this.convertDatePropsToMatch(l.toCalendarDateTime(e))}updateDefaultPrecision(){if(this.isUserSetPrecision)return;const e=this.mostSpecificDateValue;e&&(this._precision=F(e)?f.Day:f.Minute)}render(){return D.html`
       <div id="text-field">
         ${this.renderStateIcons()} ${this.renderInputContent()}
       </div>
@@ -80,7 +80,7 @@
           ${this.renderSegments()}
         </span>
       </div>
-    `}renderSegments(){return this.segments.all.map(e=>I.n(e.type===n.Literal,()=>this.renderLiteralSegment(e),()=>this.renderEditableSegment(e)))}renderLiteralSegment(e){return D.html`
+    `}renderSegments(){return this.segments.all.map(e=>I.when(e.type===n.Literal,()=>this.renderLiteralSegment(e),()=>this.renderEditableSegment(e)))}renderLiteralSegment(e){return D.html`
         <span
             class="literal-segment"
             data-test-id=${e.type}
@@ -102,4 +102,4 @@
         data-type=${e.type}
         .innerText=${this.renderSegmentText(e)}
       ></div>
-    `}renderSegmentText(e){const t=e.value===void 0;return I.n(t,()=>e.placeholder??"",()=>e.formatted??"")}handleKeydown(e){var a;const t=e.target,i=t.dataset.type;if(i)switch(e.code){case"ArrowUp":{this.incrementValue(i);break}case"ArrowDown":{this.decrementValue(i);break}case"ArrowRight":{this.focusSegment(t,"next");break}case"ArrowLeft":{this.focusSegment(t,"previous");break}case"Enter":case"Space":{this.commitValue();break}case"Backspace":case"Delete":{e.preventDefault(),((a=this.segments.getByType(i))==null?void 0:a.value)===void 0?this.focusSegment(t,"previous"):this.clearSegmentContent(i);break}}}get modifierParams(){return{dateFormatter:this.dateFormatter,segments:this.segments,currentDate:this.currentDate}}incrementValue(e){const t=new te(this.modifierParams);this.segments=t.modify(e),this.dispatchInput()}decrementValue(e){const t=new ee(this.modifierParams);this.segments=t.modify(e),this.dispatchInput()}focusSegment(e,t){let i=!1,a=e;for(;!i;){const r=t==="previous"?a.previousElementSibling:a.nextElementSibling;if(!r)break;r.getAttribute("contenteditable")&&(r.focus(),i=!0),a=r}}commitValue(){if(!(this._value&&this.previousCommitedValue&&this._value.compare(this.previousCommitedValue)===0)){if(this._value===void 0&&this.previousCommitedValue===void 0){const e=this.segments.editableValues.every(t=>t===void 0);this.invalid=!e;return}this.invalid=!!(this._value===void 0||this.isNonCompliantValue()),this.previousCommitedValue=this._value,this.dispatchChange()}}clearSegmentContent(e){const t=this.segments.editableValues,i=new Q(this.modifierParams);this.segments=i.modify(e);const a=this.segments.editableValues;Z(t,a)||this.dispatchInput()}handleInput(e){e.stopPropagation();const t=e.target.dataset.type,i=this.segments.editableValues,a=new ie({...this.modifierParams,eventData:e.data,numberParser:this.numberParser});this.segments=a.modify(t),this.updateSegmentContent(this.segments.getByType(t),e.target);const r=this.segments.editableValues;Z(i,r)||this.dispatchInput()}updateSegmentContent(e,t){t.textContent=e.value===void 0?e.placeholder:e.formatted}createOutputString(e){return e?P(e)?this._value.toAbsoluteString():new Date(this._value.toString()).toISOString():""}dispatchChange(){const e=this.createOutputString(this._value);this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:e}}))}dispatchInput(){const e=this.createOutputString(this._value);this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:e}}))}setValueFromSegments(){const e=this.segments.getFormattedDate(this.precision);if(!e){this._value&&this.dispatchChange(),this._value=void 0;return}this._value===void 0&&this.dispatchChange();const t=this.mostSpecificDateValue;t?P(t)?this._value=l.toZoned(e,this._timeZone):L(t)?this._value=l.toCalendarDateTime(e):this._value=l.toCalendarDate(e):this._value=e}setSegments(){var i,a,r,s;const t=new ue(this.dateFormatter).createSegments(this.currentDate,this._value!==void 0);if(this.dateFormat){const d=t.all.findIndex(c=>c.type===n.Month),m=t.all.findIndex(c=>c.type===n.Day);if(d!==-1&&m!==-1){if(this.dateFormat==="mmdd"&&d>m){const c=t.all[d];t.all[d]=t.all[m],t.all[m]=c}else if(this.dateFormat==="ddmm"&&m>d){const c=t.all[m];t.all[m]=t.all[d],t.all[d]=c}}}typeof this.dateSeparator=="string"&&this.dateSeparator&&(((a=(i=t.all)==null?void 0:i[1])==null?void 0:a.type)===n.Literal&&(t.all[1].formatted=this.dateSeparator),((s=(r=t.all)==null?void 0:r[3])==null?void 0:s.type)===n.Literal&&(t.all[3].formatted=this.dateSeparator)),this.segments=t}setNumberParser(){this.numberParser=new $.NumberParser(this._language,{maximumFractionDigits:0})}setDateFormatter(){this.dateFormatter=new l.DateFormatter(this._language,{day:"2-digit",month:"2-digit",year:"numeric",...this.getTimeOptions("2-digit")})}setAriaDateFormatter(){this.ariaDateFormatter=new l.DateFormatter(this._language,{day:"numeric",month:"long",year:"numeric",...this.getTimeOptions("numeric")})}getTimeOptions(e){switch(this.precision){case f.Millisecond:return{hour:e,minute:e,second:e,fractionalSecondDigits:3};case f.Second:return{hour:e,minute:e,second:e};case f.Minute:return{hour:e,minute:e};case f.Hour:return{hour:e};default:return{}}}}p([h.property({type:String,reflect:!0})],u.prototype,"value",2);p([h.property({type:String,reflect:!0})],u.prototype,"min",2);p([h.property({type:String,reflect:!0})],u.prototype,"max",2);p([h.property({type:String,attribute:"date-format",reflect:!0})],u.prototype,"dateFormat",2);p([h.property({type:String,attribute:"date-separator",reflect:!0})],u.prototype,"dateSeparator",2);p([h.property({type:String,reflect:!0})],u.prototype,"precision",1);p([h.property({type:Boolean,reflect:!0})],u.prototype,"invalid",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"readonly",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"quiet",2);p([h.property({type:String,reflect:!0})],u.prototype,"placement",2);p([h.property({type:String,attribute:"time-zone",reflect:!0})],u.prototype,"timeZone",2);p([h.property({type:String,reflect:!0})],u.prototype,"language",2);p([h.property({attribute:!1})],u.prototype,"labels",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"focused",2);p([h.state()],u.prototype,"_value",2);p([h.state()],u.prototype,"_min",2);p([h.state()],u.prototype,"_max",2);p([h.state()],u.prototype,"segments",2);p([h.state()],u.prototype,"isCalendarOpen",2);p([h.query(".editable-segment")],u.prototype,"firstEditableSegment",2);p([h.query(".input")],u.prototype,"input",2);customElements.get("luzmo-date-time-picker")||customElements.define("luzmo-date-time-picker",u);exports.LuzmoDateTimePicker=u;
+    `}renderSegmentText(e){const t=e.value===void 0;return I.when(t,()=>e.placeholder??"",()=>e.formatted??"")}handleKeydown(e){var a;const t=e.target,i=t.dataset.type;if(i)switch(e.code){case"ArrowUp":{this.incrementValue(i);break}case"ArrowDown":{this.decrementValue(i);break}case"ArrowRight":{this.focusSegment(t,"next");break}case"ArrowLeft":{this.focusSegment(t,"previous");break}case"Enter":case"Space":{this.commitValue();break}case"Backspace":case"Delete":{e.preventDefault(),((a=this.segments.getByType(i))==null?void 0:a.value)===void 0?this.focusSegment(t,"previous"):this.clearSegmentContent(i);break}}}get modifierParams(){return{dateFormatter:this.dateFormatter,segments:this.segments,currentDate:this.currentDate}}incrementValue(e){const t=new te(this.modifierParams);this.segments=t.modify(e),this.dispatchInput()}decrementValue(e){const t=new ee(this.modifierParams);this.segments=t.modify(e),this.dispatchInput()}focusSegment(e,t){let i=!1,a=e;for(;!i;){const r=t==="previous"?a.previousElementSibling:a.nextElementSibling;if(!r)break;r.getAttribute("contenteditable")&&(r.focus(),i=!0),a=r}}commitValue(){if(!(this._value&&this.previousCommitedValue&&this._value.compare(this.previousCommitedValue)===0)){if(this._value===void 0&&this.previousCommitedValue===void 0){const e=this.segments.editableValues.every(t=>t===void 0);this.invalid=!e;return}this.invalid=!!(this._value===void 0||this.isNonCompliantValue()),this.previousCommitedValue=this._value,this.dispatchChange()}}clearSegmentContent(e){const t=this.segments.editableValues,i=new Q(this.modifierParams);this.segments=i.modify(e);const a=this.segments.editableValues;Z(t,a)||this.dispatchInput()}handleInput(e){e.stopPropagation();const t=e.target.dataset.type,i=this.segments.editableValues,a=new ie({...this.modifierParams,eventData:e.data,numberParser:this.numberParser});this.segments=a.modify(t),this.updateSegmentContent(this.segments.getByType(t),e.target);const r=this.segments.editableValues;Z(i,r)||this.dispatchInput()}updateSegmentContent(e,t){t.textContent=e.value===void 0?e.placeholder:e.formatted}createOutputString(e){return e?P(e)?this._value.toAbsoluteString():new Date(this._value.toString()).toISOString():""}dispatchChange(){const e=this.createOutputString(this._value);this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:e}}))}dispatchInput(){const e=this.createOutputString(this._value);this.dispatchEvent(new CustomEvent("input",{bubbles:!0,composed:!0,cancelable:!0,detail:{value:e}}))}setValueFromSegments(){const e=this.segments.getFormattedDate(this.precision);if(!e){this._value&&this.dispatchChange(),this._value=void 0;return}this._value===void 0&&this.dispatchChange();const t=this.mostSpecificDateValue;t?P(t)?this._value=l.toZoned(e,this._timeZone):L(t)?this._value=l.toCalendarDateTime(e):this._value=l.toCalendarDate(e):this._value=e}setSegments(){var i,a,r,s;const t=new ue(this.dateFormatter).createSegments(this.currentDate,this._value!==void 0);if(this.dateFormat){const d=t.all.findIndex(c=>c.type===n.Month),m=t.all.findIndex(c=>c.type===n.Day);if(d!==-1&&m!==-1){if(this.dateFormat==="mmdd"&&d>m){const c=t.all[d];t.all[d]=t.all[m],t.all[m]=c}else if(this.dateFormat==="ddmm"&&m>d){const c=t.all[m];t.all[m]=t.all[d],t.all[d]=c}}}typeof this.dateSeparator=="string"&&this.dateSeparator&&(((a=(i=t.all)==null?void 0:i[1])==null?void 0:a.type)===n.Literal&&(t.all[1].formatted=this.dateSeparator),((s=(r=t.all)==null?void 0:r[3])==null?void 0:s.type)===n.Literal&&(t.all[3].formatted=this.dateSeparator)),this.segments=t}setNumberParser(){this.numberParser=new $.NumberParser(this._language,{maximumFractionDigits:0})}setDateFormatter(){this.dateFormatter=new l.DateFormatter(this._language,{day:"2-digit",month:"2-digit",year:"numeric",...this.getTimeOptions("2-digit")})}setAriaDateFormatter(){this.ariaDateFormatter=new l.DateFormatter(this._language,{day:"numeric",month:"long",year:"numeric",...this.getTimeOptions("numeric")})}getTimeOptions(e){switch(this.precision){case f.Millisecond:return{hour:e,minute:e,second:e,fractionalSecondDigits:3};case f.Second:return{hour:e,minute:e,second:e};case f.Minute:return{hour:e,minute:e};case f.Hour:return{hour:e};default:return{}}}}p([h.property({type:String,reflect:!0})],u.prototype,"value",2);p([h.property({type:String,reflect:!0})],u.prototype,"min",2);p([h.property({type:String,reflect:!0})],u.prototype,"max",2);p([h.property({type:String,attribute:"date-format",reflect:!0})],u.prototype,"dateFormat",2);p([h.property({type:String,attribute:"date-separator",reflect:!0})],u.prototype,"dateSeparator",2);p([h.property({type:String,reflect:!0})],u.prototype,"precision",1);p([h.property({type:Boolean,reflect:!0})],u.prototype,"invalid",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"readonly",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"quiet",2);p([h.property({type:String,reflect:!0})],u.prototype,"placement",2);p([h.property({type:String,attribute:"time-zone",reflect:!0})],u.prototype,"timeZone",2);p([h.property({type:String,reflect:!0})],u.prototype,"language",2);p([h.property({attribute:!1})],u.prototype,"labels",2);p([h.property({type:Boolean,reflect:!0})],u.prototype,"focused",2);p([h.state()],u.prototype,"_value",2);p([h.state()],u.prototype,"_min",2);p([h.state()],u.prototype,"_max",2);p([h.state()],u.prototype,"segments",2);p([h.state()],u.prototype,"isCalendarOpen",2);p([h.query(".editable-segment")],u.prototype,"firstEditableSegment",2);p([h.query(".input")],u.prototype,"input",2);customElements.get("luzmo-date-time-picker")||customElements.define("luzmo-date-time-picker",u);exports.LuzmoDateTimePicker=u;

package/components/date-time-picker/index.js

@@ -22,7 +22,7 @@ import { property as b, state as T, query as K } from "lit/decorators.js";
 import { classMap as le } from "lit/directives/class-map.js";
 import { ifDefined as P } from "lit/directives/if-defined.js";
 import { styleMap as ce } from "lit/directives/style-map.js";
-import { n as Y } from "../when-CDK1Tt5Y.js";
+import { when as Y } from "lit/directives/when.js";
 import { F as de } from "../focusable-BjvsvVam.js";
 import { S as ue, E as me } from "../sized-mixin-cJbo3PKR.js";
 import { luzmoAlert as he, luzmoCalendar as pe } from "@luzmo/icons";