@luzmo/lucero 0.0.4 → 0.0.6

package/lib/close-button-BrfeZvjk.cjs

@@ -1,18 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";const n=require("@luzmo/icons"),b=require("./sized-mixin-BSYHt8nT.cjs"),i=require("lit"),e=require("./base-BCmA9Wxv.cjs");require("./icon/index.cjs");const d=require("./button-base-B0iB_JTv.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-thickness, var(--close-button-focus-indicator-thickness)) 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-color-disabled);--close-button-focus-indicator-thickness: 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,l=o.length-1,s;l>=0;l--)(s=o[l])&&(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 r extends b.SizedMixin(d.ButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,i.unsafeCSS(h)]}get buttonContent(){return[g(this.size)]}}u([e.n({reflect:!0})],r.prototype,"variant");u([e.n({reflect:!0,attribute:"static-color"})],r.prototype,"staticColor");exports.LuzmoCloseButton=r;

package/lib/color-area/index.cjs

@@ -1,80 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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 m=require("lit"),a=require("../base-BCmA9Wxv.cjs"),f=require("../query-BL-TJj7K.cjs"),b=require("../if-defined-Cv6xanXh.cjs");require("../color-handle/index.cjs");const v=require("../platform-CQzYNWKq.cjs"),w=require("../color-DphK4hwx.cjs"),g=require("../streaming-listener-Bw4jE33f.cjs"),C="@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 x=Object.defineProperty,$=Object.getOwnPropertyDescriptor,s=(p,e,t,r)=>{for(var o=r>1?void 0:r?$(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&&x(e,t,o),o};class i extends a.LuzmoElement{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.labelX="saturation",this.labelY="luminosity",this.isLTR=!0,this.languageResolver=new g.LanguageResolutionController(this),this.colorController=new w.ColorController(this,{extractColorFromState:()=>({h:this.hue,s:this.x,v:this.y}),applyColorToState:({s:e,v:t})=>{this._x=e,this._y=t,this.requestUpdate()}}),this.activeAxis="x",this._x=1,this._y=1,this.step=.01,this.altered=0,this.activeKeys=new Set,this._valueChanged=!1,this._pointerDown=!1}static get styles(){return[m.unsafeCSS(C)]}get hue(){return this.colorController.hue}set hue(e){this.colorController.hue=e}get value(){return this.colorController.color}get color(){return this.colorController.color}set color(e){this.colorController.color=e}get x(){return this._x}set x(e){if(e===this.x)return;const t=this.x;this._x=e,this.inputX&&(this.inputX.value=e.toString(),this._x=this.inputX.valueAsNumber),this.requestUpdate("x",t),this.colorController.applyColorFromState()}get y(){return this._y}set y(e){if(e===this.y)return;const t=this.y;this._y=e,this.inputY&&(this.inputY.value=e.toString(),this._y=this.inputY.valueAsNumber),this.requestUpdate("y",t),this.colorController.applyColorFromState()}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(),this.colorController.applyColorFromState(),(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,this.colorController.applyColorFromState()}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=1-r,this.colorController.applyColorFromState(),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,u=Math.max(0,Math.min(1,(n-r)/h)),c=Math.max(0,Math.min(1,(l-o)/d));return[this.isLTR?u:1-u,c]}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.o(r?void 0:"2d slider"),h=this.labelX,d=this.labelY,u=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.x),c=new Intl.NumberFormat(this.languageResolver.language,{style:"percent",unitDisplay:"narrow"}).format(this.y),y=`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 m.html`
-      <div
-        @pointerdown=${this.handleAreaPointerdown}
-        class="gradient"
-        style="background: ${y}"
-      >
-        <slot name="gradient"></slot>
-      </div>
-
-      <luzmo-color-handle
-        tabindex=${b.o(this.focused?void 0:"0")}
-        @focus=${this.forwardFocus}
-        ?focused=${this.focused}
-        class="handle"
-        color=${this.colorController.getHslString()}
-        ?disabled=${this.disabled}
-        style=${`transform: translate(${(this.isLTR?this.x:1-this.x)*e}px, ${t-this.y*t}px);`}
-        ${g.streamingListener({start:["pointerdown",this.handlePointerdown],streamInside:["pointermove",this.handlePointermove],end:[["pointerup","pointercancel","pointerleave"],this.handlePointerup]})}
-      ></luzmo-color-handle>
-
-      <fieldset
-        class="fieldset"
-        aria-label=${b.o(r?n:void 0)}
-      >
-        <div role="presentation">
-          <input
-            type="range"
-            class="slider"
-            name="x"
-            aria-label=${r?h:`${h} ${n}`}
-            aria-roledescription=${l}
-            aria-orientation="horizontal"
-            aria-valuetext=${r?u:`${u}, ${h}${this._valueChanged?"":`, ${c}, ${d}`}`}
-            min="0"
-            max="1"
-            step=${this.step}
-            tabindex="-1"
-            .value=${String(this.x)}
-            @input=${this.handleInput}
-            @change=${this.handleChange}
-          />
-        </div>
-        <div role="presentation">
-          <input
-            type="range"
-            class="slider"
-            name="y"
-            aria-label=${r?d:`${d} ${n}`}
-            aria-roledescription=${l}
-            aria-orientation="vertical"
-            aria-valuetext=${r?c:`${c}, ${d}${this._valueChanged?"":`, ${u}, ${h}`}`}
-            orient="vertical"
-            min="0"
-            max="1"
-            step=${this.step}
-            tabindex="-1"
-            .value=${String(this.y)}
-            @input=${this.handleInput}
-            @change=${this.handleChange}
-          />
-        </div>
-      </fieldset>
-    `}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener("focus",this.handleFocus),this.addEventListener("blur",this.handleBlur),this.addEventListener("keyup",this.handleKeyup),this.addEventListener("keydown",this.handleKeydown)}updated(e){if(super.updated(e),this.x!==this.inputX.valueAsNumber&&(this._x=this.inputX.valueAsNumber),this.y!==this.inputY.valueAsNumber&&(this._y=this.inputY.valueAsNumber),e.has("focused")&&this.focused){const t=this.inputX.parentElement,r=this.inputY.parentElement;if(!t.shadowRoot&&!r.shadowRoot){t.attachShadow({mode:"open"}),r.attachShadow({mode:"open"});const o='<div tabindex="-1"><slot></slot></div>';t.shadowRoot.innerHTML=o,r.shadowRoot.innerHTML=o}}}connectedCallback(){var e;super.connectedCallback(),!this.observer&&window.ResizeObserver&&(this.observer=new window.ResizeObserver(t=>{for(const r of t)this.boundingClientRect=r.contentRect;this.requestUpdate()})),(e=this.observer)==null||e.observe(this)}disconnectedCallback(){var e;(e=this.observer)==null||e.unobserve(this),super.disconnectedCallback()}}s([a.n({type:String,reflect:!0})],i.prototype,"dir",2);s([a.n({type:Boolean,reflect:!0})],i.prototype,"disabled",2);s([a.n({type:Boolean,reflect:!0})],i.prototype,"focused",2);s([a.n({type:String,attribute:"label-x"})],i.prototype,"labelX",2);s([a.n({type:String,attribute:"label-y"})],i.prototype,"labelY",2);s([a.n({type:Boolean,attribute:"is-ltr"})],i.prototype,"isLTR",2);s([f.e(".handle")],i.prototype,"handle",2);s([a.n({type:Number})],i.prototype,"hue",1);s([a.n({type:String})],i.prototype,"value",1);s([a.n({type:String})],i.prototype,"color",1);s([a.n({attribute:!1})],i.prototype,"activeAxis",2);s([a.n({type:Number})],i.prototype,"x",1);s([a.n({type:Number})],i.prototype,"y",1);s([a.n({type:Number})],i.prototype,"step",2);s([f.e('[name="x"]')],i.prototype,"inputX",2);s([f.e('[name="y"]')],i.prototype,"inputY",2);customElements.get("luzmo-color-area")||customElements.define("luzmo-color-area",i);exports.LuzmoColorArea=i;

package/lib/color-field/index.cjs

@@ -1,23 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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 r=require("lit"),a=require("../base-BCmA9Wxv.cjs"),h=require("../text-field-C6Aa7XOb.cjs"),u=require("../index-DCKCHDTt.cjs");var c=Object.defineProperty,d=(i,e,l,v)=>{for(var t=void 0,o=i.length-1,n;o>=0;o--)(n=i[o])&&(t=n(e,l,t)||t);return t&&c(e,l,t),t};class s extends h.LuzmoTextFieldBase{constructor(){super(...arguments),this.viewColor=!1,this._value="",this.cachedColor=null,this.cachedTinyColor=null}static get styles(){return[...super.styles]}set value(e){if(e===this.value)return;const l=this._value;this._value=e,this.requestUpdate("value",l)}get value(){return this._value}getColorValue(){if(!this.value)return"";if(!this.cachedColor||this.cachedColor!==this.value){const e=new u.TinyColor(this.value);this.cachedColor=e.isValid?e.toRgbString():""}return this.cachedColor}renderColorHandle(){return this.viewColor?r.html`
-          <luzmo-color-handle
-            size="m"
-            color=${this.getColorValue()}
-          ></luzmo-color-handle>
-        `:r.html``}render(){return this.viewColor&&Promise.resolve().then(()=>require("../color-handle/index.cjs")),r.html` ${super.render()} ${this.renderColorHandle()} `}checkValidity(){let e=super.checkValidity();return this.value&&((!this.cachedTinyColor||this.cachedTinyColor.originalInput!==this.value)&&(this.cachedTinyColor=new u.TinyColor(this.value)),this.valid=e=this.cachedTinyColor.isValid,this.invalid=!e),e}}d([a.n({type:Boolean,attribute:"view-color"})],s.prototype,"viewColor");customElements.get("luzmo-color-field")||customElements.define("luzmo-color-field",s);exports.LuzmoColorField=s;

package/lib/color-handle/index.cjs

@@ -1,24 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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"});require("../color-loupe-BICpNqFs.cjs");const l=require("../base-BCmA9Wxv.cjs"),c=require("lit"),u=':host{touch-action:none;transition:inline-size var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),block-size var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),border-width var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),margin-inline var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),margin-block var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out)}:host{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);background-position:50%}:host(:focus){outline:none}:host{z-index:1;box-sizing:border-box;inline-size:var(--luzmo-color-handle-size, 16px);block-size:var(--luzmo-color-handle-size, 16px);margin-inline:calc(var(--luzmo-color-handle-size, 16px) / 2 * -1);margin-block:calc(var(--luzmo-color-handle-size, 16px) / 2 * -1);border-width:var(--luzmo-color-handle-border-width, 2px);border-color:var(--luzmo-color-handle-border-color, rgb(255, 255, 255));box-shadow:0 0 0 var(--luzmo-color-handle-outer-border-width, 1px) var(--luzmo-color-handle-outer-border-color, rgba(0, 0, 0, .42));transition:all var(--luzmo-color-handle-animation-duration, 0) var(--luzmo-color-handle-animation-easing, ease-in-out);border-style:solid}:host,:host:after{border-radius:100%;display:block;position:absolute}:host:after{content:"";inset-inline:calc(50% - var(--luzmo-color-handle-hitarea-size, 24px) / 2);inset-block:calc(50% - var(--luzmo-color-handle-hitarea-size, 24px) / 2);inline-size:var(--luzmo-color-handle-hitarea-size, 24px);block-size:var(--luzmo-color-handle-hitarea-size, 24px);border-radius:var(--luzmo-color-handle-hitarea-border-radius, 100%)}:host([focused]),:host(:focus-visible){inline-size:var(--luzmo-color-handle-focused-size, 32px);block-size:var(--luzmo-color-handle-focused-size, 32px);margin-inline:calc(var(--luzmo-color-handle-size, 16px) * -1);margin-block:calc(var(--luzmo-color-handle-size, 16px) * -1);outline:none}:host([disabled]){pointer-events:none;border-color:var(--highcontrast-color-handle-border-color-disabled, var(--luzmo-color-handle-border-color-disabled, var(--luzmo-font-color-disabled)));background:var(--highcontrast-color-handle-fill-color-disabled, var(--luzmo-color-handle-fill-color-disabled, var(--luzmo-font-color-disabled)));box-shadow:none}:host([disabled]) .inner{display:none}.inner{inline-size:100%;block-size:100%;box-shadow:inset 0 0 0 var(--luzmo-color-handle-inner-border-width, var(--luzmo-border-width)) var(--luzmo-color-handle-inner-border-color, rgba(0, 0, 0, .42));background-color:var(--luzmo-picked-color);border-radius:100%}@media (forced-colors: active){:host{forced-color-adjust:none}:host([disabled]){--highcontrast-color-handle-border-color-disabled: GrayText;--highcontrast-color-handle-fill-color-disabled: Canvas}}';var h=Object.defineProperty,a=(t,o,s,m)=>{for(var r=void 0,n=t.length-1,d;n>=0;n--)(d=t[n])&&(r=d(o,s,r)||r);return r&&h(o,s,r),r};const i=class i extends l.LuzmoElement{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.open=!1,this.color="rgba(255, 0, 0, 0.5)"}handlePointerdown(o){o.pointerType==="touch"&&(this.open=!0),this.setPointerCapture(o.pointerId)}handlePointerup(o){this.open=!1,this.releasePointerCapture(o.pointerId)}render(){return c.html`
-      <div class="inner" style="background-color: ${this.color}"></div>
-      <luzmo-color-loupe
-        color=${this.color}
-        ?open=${this.open&&!this.disabled}
-      ></luzmo-color-loupe>
-    `}firstUpdated(o){super.firstUpdated(o),this.addEventListener("pointerdown",this.handlePointerdown),this.addEventListener("pointerup",this.handlePointerup),this.addEventListener("pointercancel",this.handlePointerup)}};i.styles=c.unsafeCSS(u);let e=i;a([l.n({type:Boolean,reflect:!0})],e.prototype,"disabled");a([l.n({type:Boolean,reflect:!0})],e.prototype,"focused");a([l.n({type:Boolean,reflect:!0})],e.prototype,"open");a([l.n({type:String})],e.prototype,"color");customElements.get("luzmo-color-handle")||customElements.define("luzmo-color-handle",e);exports.LuzmoColorHandle=e;

package/lib/color-loupe-BICpNqFs.cjs

@@ -1,56 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";const l=require("./base-BCmA9Wxv.cjs"),u=require("lit"),n=':host{inline-size:var(--luzmo-color-loupe-width, 48px);block-size:var(--luzmo-color-loupe-height, 64px);transform:translateY(var(--luzmo-color-loupe-animation-distance, 8px));opacity:0;transform-origin:bottom;pointer-events:none;filter:drop-shadow(var(--luzmo-color-loupe-drop-shadow-x, 0) var(--luzmo-color-loupe-drop-shadow-y, 2px) var(--luzmo-color-loupe-drop-shadow-blur, 8px) var(--luzmo-color-loupe-drop-shadow-color, rgba(0, 0, 0, .25)));transition:transform .1s ease-in-out,opacity .125s ease-in-out;position:absolute;inset-block-end:calc(var(--luzmo-color-handle-size, 16px) - var(--luzmo-color-handle-outer-border-width, 1px) + var(--luzmo-color-loupe-offset, 12px));inset-inline-end:calc(50% - var(--luzmo-color-loupe-width, 48px) / 2)}:host:dir(rtl),:host([dir=rtl]){inset-inline-end:calc(50% - var(--luzmo-color-loupe-width, 48px) / 2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.luzmo-color-loupe-inner-border{fill:var(--luzmo-picked-color);stroke:var(--luzmo-color-loupe-inner-border-color, rgba(0, 0, 0, .1));stroke-width:var(--luzmo-color-loupe-inner-border-width, 1px)}.luzmo-color-loupe-outer-border{fill:none;stroke:var(--luzmo-color-loupe-outer-border-color, white);stroke-width:calc(var(--luzmo-color-loupe-outer-border-width, 2px) + 2px);transform:translate(calc((var(--luzmo-color-loupe-outer-border-width, 2px) + 2px) / 2))}.luzmo-color-loupe-checkerboard-pattern{fill:var(--luzmo-color-loupe-checkerboard-dark-color, rgb(230, 230, 230))}.luzmo-color-loupe-checkerboard-background{fill:var(--luzmo-color-loupe-checkerboard-light-color, rgb(255, 255, 255))}.luzmo-color-loupe-checkerboard-fill{fill:var(--luzmo-color-loupe-checkerboard-fill, url(#checkerboard-primary))}@media (forced-colors: active){:host{--highcontrast-colorloupe-outer-border-color: CanvasText}}svg{width:inherit;height:inherit}.loupe-clipped{clip-path:path("M23 61.575C19.0044 57.435 15.2591 53.0606 11.784 48.475C8.68949 44.4532 5.96348 40.1608 3.639 35.65C1.224 30.8 0 26.549 0 23C0.00319993 17.6937 1.84059 12.5516 5.20091 8.44488C8.56122 4.33815 13.2378 1.51928 18.4385 0.465803C23.6392 -0.587678 29.0442 0.189006 33.7378 2.66428C38.4314 5.13955 42.125 9.16122 44.193 14.048C45.3915 16.88 46.0061 19.9248 46 23C46 26.551 44.774 30.811 42.355 35.661C40.0274 40.1747 37.298 44.4698 34.2 48.494C30.7297 53.0728 26.9898 57.4409 23 61.575ZZ")}.opacity-checkerboard{position:absolute;top:2px;left:2px;block-size:100%;inline-size:100%}.opacity-checkerboard{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)}';var d=Object.defineProperty,s=(a,c,i,h)=>{for(var o=void 0,e=a.length-1,p;e>=0;e--)(p=a[e])&&(o=p(c,i,o)||o);return o&&d(c,i,o),o};const t=class t extends l.LuzmoElement{constructor(){super(...arguments),this.open=!1,this.color="rgba(255, 0, 0, 0.5)"}render(){return u.html`
-      <div class="opacity-checkerboard loupe-clipped"></div>
-      <div class="luzmo-color-loupe-inner-border loupe-clipped"></div>
-      <div class="luzmo-color-loupe-outer-border loupe-clipped"></div>
-      <svg
-        aria-hidden="true"
-        class="luzmo-color-loupe is-open"
-        overflow="visible"
-        style="--luzmo-picked-color: ${this.color}; position: absolute;"
-      >
-        <defs>
-          <path
-            id="loupe-path"
-            d="M23 61.575C19.0044 57.435 15.2591 53.0606 11.784 48.475C8.68949 44.4532 5.96348 40.1608 3.639 35.65C1.224 30.8 0 26.549 0 23C0.00319993 17.6937 1.84059 12.5516 5.20091 8.44488C8.56122 4.33815 13.2378 1.51928 18.4385 0.465803C23.6392 -0.587678 29.0442 0.189006 33.7378 2.66428C38.4314 5.13955 42.125 9.16122 44.193 14.048C45.3915 16.88 46.0061 19.9248 46 23C46 26.551 44.774 30.811 42.355 35.661C40.0274 40.1747 37.298 44.4698 34.2 48.494C30.7297 53.0728 26.9898 57.4409 23 61.575ZZ"
-            transform="translate(2, 2)"
-          />
-          <mask id="loupe-mask">
-            <rect x="0" y="0" height="100" width="100" fill="white" />
-            <use xlink:href="#path" fill="black" />
-          </mask>
-        </defs>
-
-        <g class="luzmo-color-loupe-loupe">
-          <g>
-            <use
-              xlink:href="#loupe-path"
-              mask="url(#loupe-mask)"
-              transform="translate(2, 2)"
-              class="luzmo-color-loupe-inner-border"
-            />
-            <use
-              xlink:href="#loupe-path"
-              mask="url(#loupe-mask)"
-              class="luzmo-color-loupe-outer-border"
-            />
-          </g>
-        </g>
-      </svg>
-    `}};t.styles=u.unsafeCSS(n);let r=t;s([l.n({type:Boolean,reflect:!0})],r.prototype,"open");s([l.n({type:String})],r.prototype,"color");exports.LuzmoColorLoupe=r;

package/lib/color-menu/index.cjs

@@ -1,86 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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 c=require("@luzmo/icons"),h=require("../base-BCmA9Wxv.cjs"),g=require("../sized-mixin-BSYHt8nT.cjs"),n=require("lit"),z=require("../state-DReJ3hB6.cjs"),s=require("../query-BL-TJj7K.cjs");require("../divider/index.cjs");require("../popover/index.cjs");require("../swatch/index.cjs");require("../color-area/index.cjs");require("../color-field/index.cjs");require("../color-handle/index.cjs");require("../color-slider/index.cjs");const a=require("../index-DCKCHDTt.cjs"),v='@charset "UTF-8";:host{width:var(--luzmo-color-menu-width, var(--color-menu-width))}.hue-opacity-text-swatches-container{display:flex;gap:var(--luzmo-color-menu-color-controls-vertical-gap, var(--color-menu-color-controls-vertical-gap));flex-direction:column;padding:var(--luzmo-color-menu-hue-opacity-text-swatches-vertical-padding, var(--color-menu-hue-opacity-text-swatches-vertical-padding)) var(--luzmo-color-menu-hue-opacity-text-swatches-horizontal-padding, var(--color-menu-hue-opacity-text-swatches-horizontal-padding))}.swatch-sliders-container{display:flex;gap:var(--luzmo-color-menu-swatch-to-sliders-space, var(--color-menu-swatch-to-sliders-space))}.swatch-example-container{display:flex;align-items:center}.field-container{display:flex;align-items:center;gap:var(--luzmo-color-menu-format-field-to-format-space, var(--color-menu-format-field-to-format-space))}.format-container{text-transform:uppercase;position:relative;background:none;border:none;outline:none;height:var(--luzmo-color-menu-format-height, var(--color-menu-format-height));cursor:pointer;font-size:var(--luzmo-color-menu-format-font-size, var(--color-menu-format-font-size));display:flex;align-items:center;color:var(--luzmo-color-menu-format-font-color, var(--color-menu-format-font-color));gap:var(--luzmo-color-menu-format-name-to-icon, var(--color-menu-format-name-to-icon-space));padding:0 var(--luzmo-color-menu-format-horizontal-padding, var(--color-menu-format-horizontal-padding))}.format-container:hover{color:var(--luzmo-color-menu-format-font-color-hover, var(--color-menu-format-font-color-hover))}.format-container:focus-visible{outline:none}.format-container:focus-visible:after{content:"";width:100%;height:100%;position:absolute;box-sizing:border-box;left:0;top:0;border:var(--luzmo-color-menu-format-indicator-width, var(--luzmo-indicator-width)) solid var(--luzmo-color-menu-format-indicator-color, var(--luzmo-indicator-color));border-radius:var(--luzmo-color-menu-format-label-indicator-border-radius, var(--luzmo-border-radius-s))}.format-container:focus-visible,.format-container:active{color:var(--luzmo-color-menu-format-font-color-down, var(--color-menu-format-font-color-down))}.format-container .format-label{-webkit-user-select:none;user-select:none}.format-container .angle-icon{display:flex;align-items:center;height:calc(var(--color-menu-format-font-size) / 1.5)}.slider-container{display:flex;flex-direction:column;justify-content:center;gap:var(--luzmo-color-menu-slider-gap, var(--color-menu-slider-gap))}luzmo-color-area{width:100%;height:var(--luzmo-color-menu-height, var(--color-menu-height))}luzmo-color-slider{width:100%}luzmo-divider{margin:var(--luzmo-spacing-5) à}.swatches-container{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--luzmo-color-menu-swatches-gap, var(--color-menu-swatches-gap))}.swatches-container luzmo-swatch{cursor:pointer}.swatches-container .swatch-choice{display:flex;align-items:center;justify-content:center}:host{--luzmo-text-field-icon-size-valid: 0px;--luzmo-text-field-icon-spacing-inline-end-valid: 1px;--luzmo-text-field-text-align: center}:host{--color-menu-width: 290px;--luzmo-text-field-width: 220px;--luzmo-color-slider-control-track-width: 8px;--color-menu-height: 140px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-5 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-5);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-5);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height);--color-menu-format-font-size: var(--luzmo-font-size-s);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-2);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-3);--color-menu-format-font-color: var(--luzmo-font-color);--color-menu-format-font-color-hover: var(--luzmo-font-color-hover);--color-menu-format-font-color-down: var(--luzmo-font-color-down);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host .swatches-container{--luzmo-swatch-size: 22px}:host([size=s]){--color-menu-width: 260px;--luzmo-text-field-width: 200px;--luzmo-color-slider-control-track-width: 8px;--color-menu-hue-opacity-text-swatches-horizontal-padding: var( --luzmo-spacing-5 );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-4 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-4);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-4);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height-s);--color-menu-format-font-size: var(--luzmo-font-size-xs);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-2);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-2);--color-menu-swatches-gap: var(--luzmo-spacing-3)}:host([size=s]) .swatches-container{--luzmo-swatch-size: 20px}:host([size=l]){--color-menu-width: 350px;--luzmo-text-field-width: 240px;--luzmo-color-slider-control-track-width: 16px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-5 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-5);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-5);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-format-height: var(--luzmo-component-height-l);--color-menu-format-font-size: var(--luzmo-font-size);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-3);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-4);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host([size=l]) .swatches-container{--luzmo-swatch-size: 24px}:host([size=l]) .swatch-example-container{--luzmo-swatch-size: 56px}:host([size=xl]){--color-menu-width: 380px;--luzmo-text-field-width: 280px;--luzmo-color-slider-control-track-width: 16px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-hue-opacity-text-swatches-vertical-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-color-controls-vertical-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-swatch-to-sliders-space: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height-xl);--color-menu-format-font-size: var(--luzmo-font-size-l);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-3);--color-menu-format-field-to-format-space: var(--luzmo-spacing-3);--color-menu-format-horizontal-padding: var(--luzmo-spacing-4);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host([size=xl]) .swatches-container{--luzmo-swatch-size: 26px}:host([size=xl]) .swatch-example-container{--luzmo-swatch-size: 64px}';var f=Object.defineProperty,l=(p,o,t,e)=>{for(var i=void 0,m=p.length-1,d;m>=0;m--)(d=p[m])&&(i=d(o,t,i)||i);return i&&f(o,t,i),i};const u=class u extends g.SizedMixin(h.LuzmoElement){constructor(){super(...arguments),this.color="rgb(255, 0, 0)",this.noAlphaChannel=!1,this._alpha=1,this._rgbColor="rgb(255, 0, 0)",this._rgbaColor="rgb(255, 0, 0, 1)",this._previousColor="rgb(255, 0, 0)"}setColor(o){var e;const t=new a.TinyColor((e=o==null?void 0:o.target)==null?void 0:e.color);this._format=t.format==="name"?"rgb":t.format,this._rgbaColor=t.toRgbString(),this._alpha=this.noAlphaChannel?1:t.getAlpha(),this._rgbColor=t.setAlpha(1).toRgbString(),this.hueSliderElement.color=this._rgbColor,this.areaElement.color=this._rgbColor,this.noAlphaChannel||(this.opacitySliderElement.color=this._rgbaColor),this.swatchElement.color=this._rgbaColor,this.colorFieldElement.value=this.formatTextField(t),this._previousColor=this._rgbaColor,this.color=this._rgbaColor,this.dispatchEvent(new CustomEvent("change",{detail:this.color}))}handleAreaChange(o){o.stopPropagation(),o.preventDefault(),this._rgbColor=this.areaElement.color;const t=new a.TinyColor(this._rgbColor);this._rgbaColor=t.setAlpha(this._alpha).toRgbString(),this.colorFieldElement.value=this._rgbaColor,this.noAlphaChannel||(this.opacitySliderElement.color=this._rgbaColor),this.colorFieldElement.value=this.formatTextField(t),this.swatchElement.color=this._rgbaColor,this._previousColor=this._rgbaColor,this.color=this._rgbaColor,this.dispatchEvent(new CustomEvent("change",{detail:this.color}))}handleHueSliderChange(o){o.stopPropagation(),o.preventDefault();const t=new a.TinyColor(this._rgbColor).toHsl();t.h=this.hueSliderElement.value;const e=new a.TinyColor(t);this._rgbColor=e.toRgbString(),this._rgbaColor=e.setAlpha(this._alpha).toRgbString(),this.areaElement.color=this._rgbColor,this.noAlphaChannel||(this.opacitySliderElement.color=this._rgbaColor),this.colorFieldElement.value=this.formatTextField(e),this.swatchElement.color=this._rgbaColor,this._previousColor=this._rgbaColor,this.color=this._rgbaColor,this.dispatchEvent(new CustomEvent("change",{detail:this.color}))}handleOpacitySliderChange(o){o.stopPropagation(),o.preventDefault(),this._alpha=this.opacitySliderElement.sliderHandlePosition/100;const t=new a.TinyColor(this._rgbColor).setAlpha(this._alpha);this._rgbaColor=t.toRgbString(),this.colorFieldElement.value=this.formatTextField(t),this.swatchElement.color=this._rgbaColor,this._previousColor=this._rgbaColor,this.color=this._rgbaColor,this.dispatchEvent(new CustomEvent("change",{detail:this.color}))}handleFieldChange(o){if(o.stopPropagation(),o.preventDefault(),this.colorFieldElement.checkValidity()){const t=new a.TinyColor(this.colorFieldElement.value);this._format=t.format,this._rgbaColor=t.toRgbString(),this._alpha=t.getAlpha(),this._rgbColor=t.setAlpha(1).toRgbString(),this.noAlphaChannel&&(this._rgbaColor=this._rgbColor,this._alpha=1),this.hueSliderElement.color=this._rgbColor,this.areaElement.color=this._rgbColor,this.noAlphaChannel||(this.opacitySliderElement.color=this._rgbaColor),this.swatchElement.color=this._rgbaColor,this._previousColor=this._rgbaColor,this.color=this._rgbaColor,this.dispatchEvent(new CustomEvent("change",{detail:this.color}))}}formatTextField(o){return this._format==="hsl"?o.toHslString():this._format==="hex"?this.noAlphaChannel?o.toHexString():o.toHex8String():(this._format==="name"&&(this._format="rgb"),o.toRgbString())}cycleFormat(){const o=["rgb","hsl","hex"];this._format=o[(o.indexOf(this._format)+1)%o.length];const t=new a.TinyColor(this.color),e=this.formatTextField(t);this.colorFieldElement.value=e}updated(o){if(o.has("color")&&this.color!==this._previousColor){this._previousColor=this.color;const t=new a.TinyColor(this.color);this._alpha=t.getAlpha(),this._rgbColor=t.setAlpha(1).toRgbString(),this._rgbaColor=t.setAlpha(this._alpha).toRgbString(),this.areaElement.color=this._rgbColor,this.hueSliderElement.color=this._rgbColor,this.colorFieldElement.value=this._rgbaColor,this.noAlphaChannel||(this.opacitySliderElement.color=this._rgbaColor),this.swatchElement.color=this._rgbaColor,this._format="rgb"}o.has("noAlphaChannel")&&!this.noAlphaChannel&&(this.opacitySliderElement.color=this._rgbaColor)}renderOpacitySlider(){return n.html`
-      <luzmo-color-slider
-        id="luzmo-opacity-slider"
-        mode="opacity"
-        @input=${this.handleOpacitySliderChange}
-      >
-      </luzmo-color-slider>
-    `}render(){var o;return n.html`
-      <div>
-        <luzmo-color-area
-          .size=${this.size}
-          @input=${this.handleAreaChange}
-        ></luzmo-color-area>
-        <div class="hue-opacity-text-swatches-container">
-          <div class="swatch-sliders-container">
-            <div class="swatch-example-container">
-              <luzmo-swatch
-                rounding="full"
-                .size=${this.noAlphaChannel&&["s","m"].includes(this.size)?"s":"l"}
-                readonly
-              ></luzmo-swatch>
-            </div>
-            <div class="slider-container" style="flex-grow: 1;">
-              <luzmo-color-slider
-                id="luzmo-hue-slider"
-                @input=${this.handleHueSliderChange}
-              >
-              </luzmo-color-slider>
-              ${this.noAlphaChannel?"":this.renderOpacitySlider()}
-            </div>
-          </div>
-          <div class="field-container">
-            <luzmo-color-field
-              .size=${this.size}
-              @input=${this.handleFieldChange}
-            >
-            </luzmo-color-field>
-            <button
-              class="format-container"
-              aria-label="Color format"
-              @click=${this.cycleFormat}
-              tabindex="0"
-            >
-              <div class="format-label">${this._format}</div>
-              <div class="change-format-icon">
-                <div class="angle-icon">${c.luzmoIcon(c.luzmoAngleUp)}</div>
-                <div class="angle-icon">${c.luzmoIcon(c.luzmoAngleDown)}</div>
-              </div>
-            </button>
-          </div>
-          ${((o=this.swatches)==null?void 0:o.length)>0?n.html`
-                <luzmo-divider></luzmo-divider>
-                <div class="swatches-container">
-                  ${this.swatches.map(t=>n.html`
-                      <div class="swatch-choice">
-                        <luzmo-swatch
-                          @click=${this.setColor}
-                          .color=${t}
-                          .size=${this.size}
-                          readonly
-                        >
-                        </luzmo-swatch>
-                      </div>
-                    `)}
-                </div>
-              `:""}
-        </div>
-      </div>
-    `}};u.styles=n.unsafeCSS(v);let r=u;l([h.n({type:String,reflect:!0})],r.prototype,"color");l([h.n({type:Boolean,reflect:!0,attribute:"no-alpha-channel"})],r.prototype,"noAlphaChannel");l([h.n({type:Array,reflect:!0})],r.prototype,"swatches");l([s.e("luzmo-color-area")],r.prototype,"areaElement");l([s.e("#luzmo-hue-slider")],r.prototype,"hueSliderElement");l([s.e("#luzmo-opacity-slider")],r.prototype,"opacitySliderElement");l([s.e("luzmo-color-field")],r.prototype,"colorFieldElement");l([s.e("luzmo-swatch")],r.prototype,"swatchElement");l([z.r()],r.prototype,"_format");customElements.get("luzmo-color-menu")||customElements.define("luzmo-color-menu",r);exports.LuzmoColorMenu=r;

package/lib/color-picker/index.cjs

@@ -1,48 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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("../base-BCmA9Wxv.cjs"),c=require("../sized-mixin-BSYHt8nT.cjs"),s=require("lit"),d=require("../state-DReJ3hB6.cjs"),h=require("../query-BL-TJj7K.cjs");require("../overlay/index.cjs");const m=require("../slottable-request-event-BfUUt1Mh.cjs");require("../popover/index.cjs");require("../swatch/index.cjs");require("../color-menu/index.cjs");const v="luzmo-popover{margin-left:var(--luzmo-color-picker-popover-horizontal-gap, var(--color-picker-popover-horizontal-gap));margin-right:var(--luzmo-color-picker-popover-horizontal-gap, var(--color-picker-popover-horizontal-gap))}luzmo-swatch{cursor:pointer}:host{--luzmo-popover-content-area-spacing-vertical: 0;--color-picker-popover-horizontal-gap: var(--luzmo-spacing-4)}:host([size=s]){--color-picker-popover-horizontal-gap: var(--luzmo-spacing-3)}:host([size=l]),:host([size=xl]){--color-picker-popover-horizontal-gap: var(--luzmo-spacing-5)}";var g=Object.defineProperty,t=(p,r,n,z)=>{for(var l=void 0,i=p.length-1,u;i>=0;i--)(u=p[i])&&(l=u(r,n,l)||l);return l&&g(r,n,l),l};const a=class a extends c.SizedMixin(o.LuzmoElement){constructor(){super(...arguments),this.color="rgb(255, 0, 0)",this.open=!1,this.disabled=!1,this.placement="left-start",this.rounding="full",this.swatches=[],this.noAlphaChannel=!1,this._renderMenu=!1}overlayCloseEvent(r){this.open=!1}overlayOpenEvent(r){this.open=!0}handleColorChange(r){this.color=this.menuElement.color,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}firstUpdated(r){this.overlayElement.addEventListener("slottable-request",n=>{this._renderMenu=n.data!==m.removeSlottableRequest})}updated(r){r.has("open")&&this.open===!0&&(this._renderMenu=!0)}renderColorMenu(){return s.html`
-      <luzmo-color-menu
-        .size=${this.size}
-        .color=${this.color}
-        .noAlphaChannel=${this.noAlphaChannel}
-        .swatches=${this.swatches}
-        @change=${this.handleColorChange}
-      ></luzmo-color-menu>
-    `}render(){return s.html`
-      <luzmo-swatch
-        id="trigger"
-        .shape=${this.shape}
-        .rounding=${this.rounding}
-        .size=${this.size}
-        .color=${this.color}
-        .selected=${this.open&&!this.disabled}
-        ?disabled=${this.disabled}
-        @luzmo-closed=${this.overlayCloseEvent}
-        @luzmo-opened=${this.overlayOpenEvent}
-      ></luzmo-swatch>
-      <luzmo-overlay
-        trigger=${this.disabled?"":"trigger@click"}
-        type="auto"
-        .placement=${this.placement}
-        type="page"
-      >
-        <luzmo-popover style="position:relative">
-          ${this._renderMenu?this.renderColorMenu():s.html``}
-        </luzmo-popover>
-      </luzmo-overlay>
-    `}};a.styles=s.unsafeCSS(v);let e=a;t([o.n({type:String,reflect:!0})],e.prototype,"color");t([o.n({type:Boolean,reflect:!0})],e.prototype,"open");t([o.n({type:Boolean,reflect:!0})],e.prototype,"disabled");t([o.n({type:String,reflect:!0})],e.prototype,"placement");t([o.n({type:String,reflect:!0})],e.prototype,"rounding");t([o.n({type:String,reflect:!0})],e.prototype,"shape");t([o.n({type:Array,reflect:!0})],e.prototype,"swatches");t([o.n({type:Boolean,reflect:!0,attribute:"no-alpha-channel"})],e.prototype,"noAlphaChannel");t([h.e("luzmo-color-menu")],e.prototype,"menuElement");t([h.e("luzmo-overlay")],e.prototype,"overlayElement");t([d.r()],e.prototype,"_renderMenu");customElements.get("luzmo-color-picker")||customElements.define("luzmo-color-picker",e);exports.LuzmoColorPicker=e;

package/lib/color-slider/index.cjs

@@ -1,57 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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"),l=require("../base-BCmA9Wxv.cjs"),b=require("../query-BL-TJj7K.cjs"),d=require("../if-defined-Cv6xanXh.cjs"),m=require("../style-map-BjBGQ_u3.cjs");require("../color-handle/index.cjs");const g=require("../focusable-Dv_6CFaY.cjs"),v=require("../color-DphK4hwx.cjs"),p=require("../streaming-listener-Bw4jE33f.cjs"),h=require("../index-DCKCHDTt.cjs"),f='.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 y=Object.defineProperty,z=Object.getOwnPropertyDescriptor,i=(c,e,t,o)=>{for(var s=o>1?void 0:o?z(e,t):e,a=c.length-1,n;a>=0;a--)(n=c[a])&&(s=(o?n(e,t,s):n(s))||s);return o&&s&&y(e,t,s),s};class r extends g.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 v.ColorController(this,{applyColorToState:()=>{if(this.mode==="opacity"){const e=new h.TinyColor(this.colorController.color);this.sliderHandlePosition=100*e.getAlpha()}else this.sliderHandlePosition=100*(this.colorController.hue/360)},extractColorFromState:e=>this.mode==="opacity"?{...e.getColor("hsl"),a:this.value}:{...e.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[u.unsafeCSS(f)]}get value(){return this.mode==="opacity"?this.colorController.opacity:this.colorController.hue}set value(e){this.mode==="opacity"?this.colorController.opacity=e:this.colorController.hue=e}get color(){return this.colorController.color}set color(e){this.colorController.color=e}get altered(){return this._altered}set altered(e){this._altered=e,this.step=Math.max(1,this.altered*10)}get focusElement(){return this.input}handleKeydown(e){const{key:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(n=>!!n).length;let o=0;switch(t){case"ArrowUp":{o=this.step;break}case"ArrowDown":{o=-this.step;break}case"ArrowLeft":{o=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{o=this.step*(this.isLTR?1:-1);break}default:return}e.preventDefault();const a=100/(this.mode==="opacity"?100:360);this.sliderHandlePosition=Math.min(100,Math.max(0,this.sliderHandlePosition+o*a)),this.value=this.mode==="opacity"?Math.min(1,Math.max(0,this.value+o/100)):Math.min(360,Math.max(0,this.value+o)),this.colorController.applyColorFromState(),o!==0&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}handleInput(e){const{valueAsNumber:t}=e.target;this.value=t,this.sliderHandlePosition=100*(this.mode==="opacity"?this.value:this.value/360),this.colorController.applyColorFromState()}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.input.focus()}handleFocus(){this.focused=!0}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1)}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){this.sliderHandlePosition=this.calculateHandlePosition(e),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(e){this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor(),this.focus(),e.pointerType==="mouse"&&(this.focused=!1)}calculateHandlePosition(e){if(!this.boundingClientRect)return this.sliderHandlePosition;const t=this.boundingClientRect,o=this.vertical?t.top:t.left,s=this.vertical?e.clientY:e.clientX,a=this.vertical?t.height:t.width,n=Math.max(0,Math.min(1,(s-o)/a));return this.vertical||!this.isLTR?100-100*n:100*n}handleGradientPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",e)),this.handlePointermove(e))}get handlePositionStyles(){return`${this.vertical?"inset-block-end":"inset-inline-start"}: ${this.sliderHandlePosition}%`}get getColorSliderStyle(){const e=this.vertical?"top":"right";if(this.mode==="opacity"){const t=new h.TinyColor(this.colorController.color).setAlpha(1).toRgbString();return{background:`linear-gradient(to ${e}, transparent, ${t})`}}return{background:`linear-gradient(to ${e}, var(--luzmo-color-slider-gradient, var(--luzmo-color-slider-gradient-fallback)))`}}render(){return u.html`
-      <div
-        class="opacity-checkerboard checkerboard"
-        role="presentation"
-        @pointerdown=${this.handleGradientPointerdown}
-      >
-        <div
-          class="gradient"
-          role="presentation"
-          style=${m.o(this.getColorSliderStyle)}
-        >
-          <slot name="gradient"></slot>
-        </div>
-      </div>
-      <luzmo-color-handle
-        tabindex=${d.o(this.focused?void 0:"0")}
-        @focus=${this.forwardFocus}
-        ?focused=${this.focused}
-        class="handle"
-        color=${this.mode==="opacity"?this.color:"hsl("+this.value+", 100%, 50%)"}
-        ?disabled=${this.disabled}
-        style=${this.handlePositionStyles}
-        ${p.streamingListener({start:["pointerdown",this.handlePointerdown],streamInside:["pointermove",this.handlePointermove],end:[["pointerup","pointercancel","pointerleave"],this.handlePointerup]})}
-      ></luzmo-color-handle>
-      <input
-        type="range"
-        class="slider"
-        min="0"
-        max=${this.mode==="opacity"?"100":"360"}
-        aria-orientation=${d.o(this.vertical?"vertical":void 0)}
-        orient=${d.o(this.vertical?"vertical":void 0)}
-        step=${this.step}
-        aria-label=${this.label}
-        .value=${String(this.mode==="opacity"?this.value*100:this.value)}
-        aria-valuetext=${`${new Intl.NumberFormat(this.languageResolver.language,{maximumFractionDigits:0,minimumIntegerDigits:1,style:"unit",unit:this.mode==="opacity"?"percent":"degree",unitDisplay:"narrow"}).format(this.mode==="opacity"?this.value*100:this.value)}`}
-        @input=${this.handleInput}
-        @change=${this.handleChange}
-        @keydown=${this.handleKeydown}
-      />
-    `}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener("focus",this.handleFocus),this.addEventListener("blur",this.handleBlur)}updated(e){e.has("mode")&&(this.handle.style.insetInlineStart="",this.handle.style.insetBlockEnd="",this.mode==="opacity"&&(this.colorController.color=new h.TinyColor(this.colorController.color).toRgbString(),this.handle.style.insetInlineStart=100*this.colorController.opacity+"%"))}}i([l.n({type:String,reflect:!0})],r.prototype,"dir",2);i([l.n({type:String,reflect:!0})],r.prototype,"mode",2);i([l.n({type:Boolean,reflect:!0})],r.prototype,"disabled",2);i([l.n({type:Boolean,reflect:!0})],r.prototype,"focused",2);i([b.e(".handle")],r.prototype,"handle",2);i([l.n({type:String})],r.prototype,"label",2);i([l.n({type:Boolean,reflect:!0})],r.prototype,"vertical",2);i([l.n({type:Number})],r.prototype,"value",1);i([l.n({type:Number,reflect:!0})],r.prototype,"sliderHandlePosition",2);i([l.n({type:String})],r.prototype,"color",1);i([l.n({type:Number})],r.prototype,"step",2);i([l.n({type:Boolean,attribute:"is-ltr"})],r.prototype,"isLTR",2);i([b.e("input")],r.prototype,"input",2);customElements.get("luzmo-color-slider")||customElements.define("luzmo-color-slider",r);exports.LuzmoColorSlider=r;

package/lib/divider/index.cjs

@@ -1,18 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * 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 s=require("../base-BCmA9Wxv.cjs"),c=require("../sized-mixin-BSYHt8nT.cjs"),n=require("lit"),f=require("../divider.module-CXMNveQc.cjs");var p=Object.defineProperty,d=(a,e,l,v)=>{for(var t=void 0,i=a.length-1,u;i>=0;i--)(u=a[i])&&(t=u(e,l,t)||t);return t&&p(e,l,t),t};const o=class o extends c.SizedMixin(s.LuzmoElement,{validSizes:["s","m","l"],noDefaultSize:!0}){constructor(){super(...arguments),this.vertical=!1}render(){return n.html``}firstUpdated(e){super.firstUpdated(e),this.setAttribute("role","separator")}updated(e){super.updated(e),e.has("vertical")&&(this.vertical?this.setAttribute("aria-orientation","vertical"):this.removeAttribute("aria-orientation"))}};o.styles=[n.unsafeCSS(f.styles)];let r=o;d([s.n({type:Boolean,reflect:!0})],r.prototype,"vertical");d([s.n({type:String,reflect:!0,attribute:"static-color"})],r.prototype,"staticColor");customElements.get("luzmo-divider")||customElements.define("luzmo-divider",r);exports.Divider=r;

package/lib/field-group-TUFvhJkk.cjs

@@ -1,23 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";const l=require("./base-BCmA9Wxv.cjs"),d=require("lit"),u=require("./manage-help-text-iOk-zmy8.cjs"),p='.luzmo-FieldGroup--toplabel{flex-direction:column}.luzmo-FieldGroup--sidelabel{flex-direction:row}.group{flex-flow:column wrap;display:flex}:host([vertical]) .group{flex-direction:column}:host([horizontal]) .group{flex-direction:row}:host([horizontal]) .group slot:not([name])::slotted(:not(:last-child)){margin-inline-end:var(--field-group-margin)}:host([horizontal]) .group .luzmo-HelpText{flex-basis:100%}:host{--field-group-margin: 16px;--field-group-readonly-delimiter: ","}:host([horizontal][dir=rtl]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=rtl]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 0 0 var(--field-group-margin)}:host([horizontal][dir=ltr]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=ltr]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 var(--field-group-margin) 0 0}';var h=Object.defineProperty,r=(i,t,n,c)=>{for(var e=void 0,a=i.length-1,s;a>=0;a--)(s=i[a])&&(e=s(t,n,e)||e);return e&&h(t,n,e),e};class o extends u.ManageHelpText(l.LuzmoElement,{mode:"external"}){constructor(){super(...arguments),this.horizontal=!1,this.invalid=!1,this.label="",this.vertical=!1}static get styles(){return[d.unsafeCSS(p)]}handleSlotchange(){}render(){return d.html`
-      <div class="group" role="presentation">
-        <slot @slotchange=${this.handleSlotchange}></slot>
-      </div>
-      ${this.renderHelpText(this.invalid)}
-    `}firstUpdated(t){super.firstUpdated(t),this.hasAttribute("role")||this.setAttribute("role","group")}updated(t){super.updated(t),t.has("label")&&(this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"))}}r([l.n({type:Boolean,reflect:!0})],o.prototype,"horizontal");r([l.n({type:Boolean,reflect:!0})],o.prototype,"invalid");r([l.n()],o.prototype,"label");r([l.n({type:Boolean,reflect:!0})],o.prototype,"vertical");exports.LuzmoFieldGroup=o;

package/lib/field-label-BrJaeORz.cjs

@@ -1,25 +0,0 @@
-/*! * Lucero - The design system for Luzmo.
- * 
- * Copyright © 2025 Luzmo
- * All rights reserved.
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
- * This license allows users with a current active Luzmo account to use Lucero.
- * This license terminates automatically if a user no longer has an active Luzmo account.
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
- * 
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
- * SOFTWARE.
- * */
-"use strict";const n=require("./base-BCmA9Wxv.cjs"),b=require("./condition-attribute-with-id-DrQYZzFS.cjs"),h=require("./random-id-CqvckpWe.cjs"),g=require("./element-resolution-BvRLGqIU.cjs"),c=require("./sized-mixin-BSYHt8nT.cjs"),s=require("lit"),m=require("./query-BL-TJj7K.cjs"),u=":host{box-sizing:border-box;min-block-size:var(--luzmo-field-label-min-height, var(--field-label-min-height));padding-block:var(--luzmo-field-label-padding-block, var(--luzmo-field-label-top-to-text, var(--field-label-top-to-text)) var(--luzmo-field-label-bottom-to-text, var(--field-label-bottom-to-text)));padding-inline:0;padding-inline:var(--luzmo-field-label-padding-inline, 0);margin-block:0;margin-block:var(--luzmo-field-label-margin-block, var(--luzmo-field-label-margin-block-start, 0) var(--luzmo-field-label-margin-block-end, 0));margin-inline:0;margin-inline:var(--luzmo-field-label-margin-inline, var(--luzmo-field-label-margin-inline-start, 0) var(--luzmo-field-label-margin-inline-end, 0));font-size:var(--luzmo-field-label-font-size, var(--field-label-font-size));font-weight:var(--luzmo-field-label-font-weight, var(--field-label-font-weight));line-height:var(--luzmo-field-label-line-height, var(--field-label-line-height));-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto;color:var(--luzmo-field-label-color, var(--field-label-color));display:block;font-family:var(--luzmo-field-label-font-family, var(--luzmo-font-family))}:host(:lang(ja)),:host(:lang(ko)),:host(:lang(zh)){--luzmo-field-label-line-height: var( --luzmo-field-label-line-height-cjk, var(--field-label-line-height-cjk) )}:host([disabled]),:host([disabled]) .required-icon{--luzmo-field-label-color: var( --highcontrast-field-label-disabled-content-color, var( --luzmo-disabled-content-color, var(--field-label-disabled-content-color) ) )}.required-icon{display:inline-block;margin-block:0;margin-inline:var(--luzmo-field-label-text-to-asterisk, var(--field-label-text-to-asterisk)) 0;vertical-align:initial;vertical-align:var(--luzmo-field-label-asterisk-vertical-align, baseline)}:host([side-aligned=start]),:host([side-aligned=end]){vertical-align:top;margin-block-start:0;margin-block-end:0;margin-inline-end:var(--luzmo-field-label-side-padding-right, var(--field-label-side-padding-right));display:inline-flex;align-items:center;font-size:var(--luzmo-field-label-side-aligned-font-size, var(--field-label-side-aligned-font-size));block-size:var(--luzmo-field-label-side-aligned-height, var(--field-label-side-aligned-height))}:host([side-aligned=end]){text-align:end}@media (forced-colors: active){:host{--highcontrast-field-label-disabled-content-color: GrayText}}:host{--field-label-color: var(--luzmo-font-color);--field-label-font-weight: var(--luzmo-font-weight);--field-label-line-height: var(--luzmo-line-height);--field-label-line-height-cjk: 1.5;--field-label-disabled-content-color: var(--luzmo-font-color-disabled)}:host{--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height);--field-label-top-to-text: calc(var(--luzmo-spacing-2));--field-label-bottom-to-text: var(--luzmo-spacing-2);--field-label-side-aligned-font-size: var(--luzmo-font-size);--field-label-font-size: var(--luzmo-font-size-s);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: 0px}:host([size=s]){--field-label-min-height: var(--luzmo-component-height-xxs);--field-label-side-aligned-height: var(--luzmo-component-height-s);--field-label-top-to-text: calc(var(--luzmo-spacing-1));--field-label-bottom-to-text: var(--luzmo-spacing-1);--field-label-side-aligned-font-size: var(--luzmo-font-size-s);--field-label-font-size: var(--luzmo-font-size-xs);--field-label-side-padding-right: var(--luzmo-spacing-3);--field-label-text-to-asterisk: 0px}:host([size=l]){--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height-l);--field-label-top-to-text: var(--luzmo-spacing-3);--field-label-bottom-to-text: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--field-label-side-aligned-font-size: var(--luzmo-font-size-l);--field-label-font-size: var(--luzmo-font-size);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}:host([size=xl]){--field-label-min-height: var(--luzmo-component-height-s);--field-label-side-aligned-height: var(--luzmo-component-height-xl);--field-label-top-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--field-label-bottom-to-text: var(--luzmo-spacing-3);--field-label-side-aligned-font-size: var(--luzmo-font-size-xl);--field-label-font-size: var(--luzmo-font-size-l);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}label{display:inline-block}";var z=Object.defineProperty,r=(d,e,t,l)=>{for(var i=void 0,a=d.length-1,f;a>=0;a--)(f=d[a])&&(i=f(e,t,i)||i);return i&&z(e,t,i),i};const v=()=>s.html`
-  <div class="icon-container required-icon">*</div>
-`;class o extends c.SizedMixin(n.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.disabled=!1,this.id="",this.for="",this.required=!1,this.resolvedElement=new g.ElementResolutionController(this)}static get styles(){return[s.unsafeCSS(u)]}handleClick(e){if(!this.target||this.disabled||e.defaultPrevented)return;this.target.focus();const t=this.getRootNode(),l=this.target,i=l.getRootNode(),a=i.host;i===t&&l.forceFocusVisible?l.forceFocusVisible():a&&a.forceFocusVisible&&a.forceFocusVisible()}applyTargetLabel(e){if(this.target=e||this.target,this.target){const t=this.target.applyFocusElementLabel,l=this.target.focusElement||this.target,i=l.getRootNode();t!==void 0?t(this.labelText,this):i===this.getRootNode()?(e?b.conditionAttributeWithId:b.conditionAttributeWithoutId)(l,"aria-labelledby",[this.id]):e?l.setAttribute("aria-label",this.labelText):l.removeAttribute("aria-label")}}async manageTarget(){this.applyTargetLabel();const e=this.resolvedElement.element;if(!e){this.target=e;return}e.localName.search("-")>0&&await customElements.whenDefined(e.localName),e.updateComplete!==void 0&&await e.updateComplete,this.applyTargetLabel(e)}get labelText(){const e=this.slotEl.assignedNodes({flatten:!0});return e.length===0?"":e.map(l=>(l.textContent||"").trim()).join(" ")}render(){return s.html`
-      <label>
-        <slot></slot>
-        ${this.required?s.html` ${v()} `:s.nothing}
-      </label>
-    `}firstUpdated(e){super.firstUpdated(e),this.addEventListener("click",this.handleClick)}willUpdate(e){this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${h.randomID()}`),e.has("for")&&(this.resolvedElement.selector=this.for?`#${this.for}`:""),(e.has("id")||e.has(g.elementResolverUpdatedSymbol))&&this.manageTarget()}}r([n.n({type:Boolean,reflect:!0})],o.prototype,"disabled");r([n.n({type:String})],o.prototype,"id");r([n.n({type:String})],o.prototype,"for");r([n.n({type:Boolean,reflect:!0})],o.prototype,"required");r([m.e("slot")],o.prototype,"slotEl");r([n.n({type:String,reflect:!0,attribute:"side-aligned"})],o.prototype,"sideAligned");exports.FieldLabel=o;