@shineuix/ssr 0.0.0-stage → 1.0.0

package/dist/components/sui-ifta-label.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as a,h as e,t}from"./p-CeVlau-G.js";import{d as l,F as r}from"./p-TBwsYzWO.js";import{u as o}from"./p-U06fVoGD.js";import{i as n,d as u,s as d,r as f}from"./p-BHB1Wprj.js";import{i as c,a as h}from"./p-Cs2X0Kih.js";import{i as b}from"./p-MsqFuhDd.js";import{f as p}from"./p-CGWvlrv_.js";const m=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiInput=a(this,"suiInput",7),this.suiChange=a(this,"suiChange",7),this.suiFocus=a(this,"suiFocus",3),this.suiBlur=a(this,"suiBlur",3),this.internals=this.attachInternals()}get host(){return this}internals;label;help;error;value="";type="text";placeholder;invalid=!1;disabled=!1;readOnly=!1;maxLength;pattern;minLength;required=!1;name;suiInput;suiChange;suiFocus;suiBlur;focused=!1;formDisabled=!1;hostLabel;hostLabelledby;stopAria;hints={};stopHints;stopLabelledby;fieldId=o("sui-ifta");input;initial="";get isDisabled(){return this.disabled||this.formDisabled}connectedCallback(){n(this.host,this.internals),u(this.host,(()=>this.input)),this.stopAria?.(),this.stopAria=c(this.host,(i=>{this.hostLabel=i})),this.stopHints?.(),this.stopHints=b(this.host,(i=>{this.hints=i})),this.stopLabelledby?.(),this.stopLabelledby=h(this.host,(i=>{this.hostLabelledby=i}))}componentWillLoad(){this.initial=this.value,this.syncForm()}componentDidLoad(){this.syncForm()}componentDidRender(){this.syncForm()}disconnectedCallback(){this.stopAria?.(),this.stopHints?.(),this.stopLabelledby?.()}syncForm(){d(this.internals,this.isDisabled?null:this.value),f(this.internals,this.required&&!this.isDisabled&&!this.readOnly,!this.value,this.label,this.input,this.error,this.input)}formResetCallback(){this.value=this.initial,this.input&&(this.input.value=this.initial),this.syncForm()}formDisabledCallback(i){this.formDisabled=p(this.host,this.disabled,i),this.syncForm()}async select(){this.input?.select()}async setFocus(){this.input?.focus()}onInput=i=>{this.value=i.target.value,this.suiInput.emit(this.value)};onChange=()=>{this.suiChange.emit(this.value)};onFocus=()=>{this.focused=!0,this.suiFocus.emit()};onBlur=()=>{this.focused=!1,this.suiBlur.emit()};render(){const i=this.invalid||!!this.error;return e(r,{key:"49d90864339ca67ccad6f89fba05100ac8250b01",help:this.help,error:this.error,descId:this.fieldId},e("div",{key:"c9177ac5eed4e8bc60d420fae0a7b4adf309cec2",class:{"sui-input":!0,"sui-frame":!0,"sui-ifta":!0,focus:this.focused,invalid:i,disabled:this.isDisabled,readonly:this.readOnly},onClick:()=>this.input?.focus()},e("label",{key:"b84e98a4a3120eec090c8c1c1d225dd8d15e9633",class:"ifta-label",htmlFor:this.fieldId},this.label,this.required?e("span",{class:"sui-field-req","aria-hidden":"true"},"*"):null),e("input",{key:"e62f8a8ae5052a01a3cc83bb9eea3a85597934e4",ref:i=>this.input=i,id:this.fieldId,class:"field",type:this.type,value:this.value,placeholder:this.placeholder,required:this.required,disabled:this.isDisabled,readOnly:this.readOnly,maxLength:this.maxLength,pattern:this.pattern,minLength:this.minLength,inputMode:this.hints.inputmode,enterKeyHint:this.hints.enterkeyhint,"aria-label":this.label?void 0:this.hostLabel,"aria-labelledby":this.label?void 0:this.hostLabelledby,"aria-invalid":i?"true":null,"aria-describedby":l(this.fieldId,this.help,this.error),onFocus:this.onFocus,onBlur:this.onBlur,onInput:this.onInput,onChange:this.onChange})))}static get formAssociated(){return!0}static get watchers(){return{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}]}}static get style(){return".sc-sui-ifta-label-h{display:block;font-family:var(--font-sans)}.sui-input.sui-ifta.sc-sui-ifta-label{padding:7px 12px 8px;cursor:text}.sui-input.sui-ifta.readonly.sc-sui-ifta-label:not(.disabled){background:var(--surface-sunken)}.ifta-label.sc-sui-ifta-label{display:block;margin-bottom:2px;font-size:10.5px;font-weight:650;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-faint);cursor:inherit;transition:color var(--duration-fast) var(--ease-out)}.sui-ifta.focus.sc-sui-ifta-label .ifta-label.sc-sui-ifta-label{color:var(--focus-ring)}.sui-ifta.invalid.sc-sui-ifta-label .ifta-label.sc-sui-ifta-label{color:var(--danger)}.sui-ifta.sc-sui-ifta-label .field.sc-sui-ifta-label{display:block;width:100%;box-sizing:border-box;padding:0;margin:0;border:none;outline:none;background:transparent;color:var(--ink);font-size:14px;font-weight:550;font-family:var(--font-sans);line-height:1.3}.sui-ifta.sc-sui-ifta-label .field.sc-sui-ifta-label::placeholder{color:var(--ink-placeholder)}.sui-ifta.sc-sui-ifta-label .field.sc-sui-ifta-label:disabled{color:var(--disabled-ink);cursor:not-allowed}.sui-field.sc-sui-ifta-label{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-ifta-label{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-ifta-label .sui-field-label.sc-sui-ifta-label{color:var(--danger)}.sui-field-req.sc-sui-ifta-label{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-ifta-label{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-ifta-label{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-ifta-label .sui-glyph.sc-sui-ifta-label{font-size:11px}.sui-frame.sc-sui-ifta-label{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-ifta-label:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-ifta-label,.sui-frame.readonly.sc-sui-ifta-label{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-ifta-label:focus-within,.sui-frame.focus.sc-sui-ifta-label,.sui-frame.open.sc-sui-ifta-label{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-ifta-label{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-ifta-label:focus-within,.sui-frame.invalid.focus.sc-sui-ifta-label,.sui-frame.invalid.open.sc-sui-ifta-label{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-ifta-label:disabled,.sui-frame.disabled.sc-sui-ifta-label{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-ifta-label{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-ifta-label::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-ifta-label{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-ifta-label{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-ifta-label{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-ifta-label:focus-within,.sui-frame.focus.sc-sui-ifta-label,.sui-frame.open.sc-sui-ifta-label{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-ifta-label:disabled,.sui-frame.disabled.sc-sui-ifta-label{color:GrayText;border-color:GrayText}}"}},[578,"sui-ifta-label",{label:[1],help:[1],error:[1],value:[1025],type:[513],placeholder:[1],invalid:[516],disabled:[516],readOnly:[516,"readonly"],maxLength:[2,"maxlength"],pattern:[1],minLength:[2,"minlength"],required:[516],name:[513],focused:[32],formDisabled:[32],hostLabel:[32],hostLabelledby:[32],hints:[32],select:[64],setFocus:[64]},void 0,{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}]}]),v=m,g=function(){"undefined"!=typeof customElements&&["sui-ifta-label"].forEach((i=>{"sui-ifta-label"===i&&(customElements.get(t(i))||customElements.define(t(i),m))}))};export{v as SuiIftaLabel,g as defineCustomElement}

package/dist/components/sui-image-compare.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiImageCompare extends Components.SuiImageCompare, HTMLElement {}
+export const SuiImageCompare: {
+    prototype: SuiImageCompare;
+    new (): SuiImageCompare;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-image-compare.js

@@ -0,0 +1 @@
+import{p as e,H as i,c as a,h as s,a as t,t as r}from"./p-CeVlau-G.js";import{d as o}from"./p-BHB1Wprj.js";import{a as c,l as n}from"./p-BuyjS5bS.js";import{a as l}from"./p-COO9uV7W.js";import{G as m,_ as p}from"./p-DdsE4HI6.js";import{M as d}from"./p-7Ti-Ht9x.js";const u=e(class e extends i{constructor(e){super(),!1!==e&&this.__registerHost(),this.suiResize=a(this,"suiResize",3),this.suiResizeEnd=a(this,"suiResizeEnd",3),this.suiError=a(this,"suiError",3)}get host(){return this}beforeSrc;afterSrc;beforeAlt="";afterAlt="";beforeFilter;beforeLabel;afterLabel;height=240;ratio=.5;suiResize;suiResizeEnd;dragging=!1;suiError;failed=new Set;fail(e){e&&!this.failed.has(e)&&(this.failed=new Set(this.failed).add(e),this.suiError.emit(e))}frame;divider;rect;static MIN=.04;static MAX=.96;componentWillLoad(){this.clamp()}connectedCallback(){o(this.host,(()=>this.divider))}disconnectedCallback(){this.stopDrag(!1)}async setFocus(){this.divider?.focus()}clamp(){const i=Number(this.ratio),a=Number.isFinite(i)?Math.min(e.MAX,Math.max(e.MIN,i)):.5;a!==this.ratio&&(this.ratio=a)}set(i){const a=Math.min(e.MAX,Math.max(e.MIN,i));return a!==this.ratio&&(this.ratio=a,this.suiResize.emit(a),!0)}onPointerDown=e=>{void 0!==e.button&&0!==e.button||(e.preventDefault(),this.rect=this.frame?.getBoundingClientRect(),this.dragging=!0,document.addEventListener("pointermove",this.onPointerMove),document.addEventListener("pointerup",this.onPointerUp),document.addEventListener("pointercancel",this.onPointerUp),!!this.divider&&!!e.target&&this.divider.contains(e.target)||this.onPointerMove(e),this.divider?.focus?.({preventScroll:!0}))};onPointerMove=e=>{const i=this.rect;i&&i.width&&this.set((e.clientX-i.left)/i.width)};onPointerUp=()=>this.stopDrag(!0);stopDrag=e=>{"undefined"!=typeof document&&(document.removeEventListener("pointermove",this.onPointerMove),document.removeEventListener("pointerup",this.onPointerUp),document.removeEventListener("pointercancel",this.onPointerUp)),this.rect=void 0,this.dragging&&(this.dragging=!1,e&&this.suiResizeEnd.emit(this.ratio))};onKeyDown=i=>{let a;switch(i.key){case"ArrowLeft":case"ArrowDown":a=this.ratio-.02;break;case"ArrowRight":case"ArrowUp":a=this.ratio+.02;break;case"Home":a=e.MIN;break;case"End":a=e.MAX;break;case"PageDown":a=this.ratio-.1;break;case"PageUp":a=this.ratio+.1;break;default:return}i.preventDefault(),this.set(a)&&this.suiResizeEnd.emit(this.ratio)};render(){const e=Math.round(1e4*this.ratio)/100,i=this.afterSrc||this.beforeSrc;return this.failed.has(i)||this.failed.has(this.beforeSrc)?s(t,null,s("div",{class:"frame failed",style:{height:this.height+"px"}},s(d,{text:c(void 0,"image-compare.unavailable",void 0,"Before and after images unavailable")}))):s(t,null,s("div",{class:{frame:!0,dragging:this.dragging},ref:e=>this.frame=e,style:{height:this.height+"px"},onPointerDown:this.onPointerDown},s("img",{class:"after",src:i,alt:this.afterAlt,onError:()=>this.fail(i)}),s("img",{class:"before",src:this.beforeSrc,alt:this.beforeAlt,style:{clipPath:`inset(0 ${100-e}% 0 0)`,filter:this.beforeFilter||void 0},onError:()=>this.fail(this.beforeSrc)}),s("span",{class:"tag left"},c(void 0,"image-compare.before",this.beforeLabel,"Before")),s("span",{class:"tag right"},c(void 0,"image-compare.after",this.afterLabel,"After")),s("div",{class:"divider",ref:e=>this.divider=e,style:{left:`calc(${e}% - 1px)`},role:"slider",tabIndex:0,"aria-label":c(void 0,"image-compare.comparePosition",void 0,"Compare position"),"aria-orientation":"horizontal","aria-valuemin":"0","aria-valuemax":"100","aria-valuenow":Math.round(100*this.ratio)+"","aria-valuetext":n(void 0,"image-compare.position",void 0,"{percent} {label}",{percent:l(Math.round(100*this.ratio)),label:c(void 0,"image-compare.before",this.beforeLabel,"Before")}),onKeyDown:this.onKeyDown},s("div",{class:"handle","aria-hidden":"true"},s(m,{glyph:p})))))}static get watchers(){return{ratio:[{clamp:0}]}}static get style(){return".sc-sui-image-compare-h{display:block;font-family:var(--font-sans)}.frame.sc-sui-image-compare{position:relative;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);box-sizing:border-box;user-select:none;touch-action:none;background:var(--surface-sunken)}.after.sc-sui-image-compare,.before.sc-sui-image-compare{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}.tag.sc-sui-image-compare{position:absolute;top:10px;padding:4px 9px;border-radius:var(--radius-pill);font-size:10.5px;font-weight:700;letter-spacing:0.05em;text-transform:uppercase;line-height:1.3;background:color-mix(in srgb, var(--brand-active) 72%, transparent);color:var(--brand-contrast);font-family:var(--font-sans);pointer-events:none}.tag.left.sc-sui-image-compare{left:10px}.tag.right.sc-sui-image-compare{right:10px}.divider.sc-sui-image-compare{position:absolute;top:0;bottom:0;width:2px;background:var(--ink-on-dark);cursor:ew-resize;box-shadow:0 0 6px color-mix(in srgb, var(--brand-active) 50%, transparent)}.divider.sc-sui-image-compare:focus{outline:none}.handle.sc-sui-image-compare{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--accent-contrast);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-pop);transition:background var(--duration-fast) var(--ease-out)}.handle.sc-sui-image-compare .sui-glyph.sc-sui-image-compare{font-size:12px}.divider.sc-sui-image-compare:hover .handle.sc-sui-image-compare{background:var(--accent-hover)}.frame.dragging.sc-sui-image-compare .handle.sc-sui-image-compare{background:var(--accent-active)}.divider.sc-sui-image-compare:focus-visible .handle.sc-sui-image-compare{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}@media (forced-colors: active){.divider.sc-sui-image-compare{background:CanvasText;outline:1px solid Canvas}.handle.sc-sui-image-compare{background:Canvas;color:CanvasText;border:1px solid CanvasText;box-sizing:border-box}}.sui-media-fallback.sc-sui-image-compare{position:absolute;inset:0;box-sizing:border-box;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--surface-sunken);color:var(--ink-faint);font:460 12.5px/1.4 var(--font-sans);text-align:center}.sui-media-fallback.sc-sui-image-compare .sui-glyph.sc-sui-image-compare{font-size:22px}.sui-media-fallback.sc-sui-image-compare .sui-mf-text.sc-sui-image-compare{color:var(--ink-muted)}.sui-media-fallback.compact.sc-sui-image-compare{gap:0;padding:0}.sui-media-fallback.compact.sc-sui-image-compare .sui-glyph.sc-sui-image-compare{font-size:14px}.sui-media-fallback.inverse.sc-sui-image-compare{background:transparent;color:color-mix(in srgb, var(--ink-on-dark) 70%, transparent)}.sui-media-fallback.inverse.sc-sui-image-compare .sui-mf-text.sc-sui-image-compare{color:var(--ink-on-dark)}@media (forced-colors: active){.sui-media-fallback.sc-sui-image-compare,.sui-media-fallback.sc-sui-image-compare .sui-mf-text.sc-sui-image-compare{color:GrayText}}"}},[514,"sui-image-compare",{beforeSrc:[1,"before-src"],afterSrc:[1,"after-src"],beforeAlt:[1,"before-alt"],afterAlt:[1,"after-alt"],beforeFilter:[1,"before-filter"],beforeLabel:[1,"before-label"],afterLabel:[1,"after-label"],height:[2],ratio:[1026],dragging:[32],failed:[32],setFocus:[64]},void 0,{ratio:[{clamp:0}]}]),h=u,g=function(){"undefined"!=typeof customElements&&["sui-image-compare"].forEach((e=>{"sui-image-compare"===e&&(customElements.get(r(e))||customElements.define(r(e),u))}))};export{h as SuiImageCompare,g as defineCustomElement}

package/dist/components/sui-image.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiImage extends Components.SuiImage, HTMLElement {}
+export const SuiImage: {
+    prototype: SuiImage;
+    new (): SuiImage;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-image.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as e,f as t,h as a,a as o,t as r}from"./p-CeVlau-G.js";import{d as n}from"./p-BHB1Wprj.js";import{o as c}from"./p-BEa7fx4d.js";import{m as l}from"./p-BiSaIyr0.js";import{u as h}from"./p-U06fVoGD.js";import{a as d,l as u}from"./p-BuyjS5bS.js";import{G as p,X as m,Y as g,Z as f,U as v,x as b}from"./p-DdsE4HI6.js";import{M as x}from"./p-7Ti-Ht9x.js";import{h as k}from"./p-BWkzTEZX.js";const y=["cover","contain"],w=["lazy","eager"],z=i(class i extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiOpen=e(this,"suiOpen",3),this.suiClose=e(this,"suiClose",3),this.suiError=e(this,"suiError",3)}get host(){return this}src;previewSrc;alt="";caption;width;height;radius;fit="cover";loading="lazy";noPreview=!1;open=!1;suiOpen;suiClose;suiError;zoom=1;rotation=0;panX=0;panY=0;panning=!1;failed=!1;previewFailed=!1;closing=!1;layer;stage;big;modal;layerId=h("sui-image-lightbox");top=l({exited:()=>this.closing=!1,onEscape:()=>this.requestClose("escape")});panFrom;panMoved=!1;static PAN_STEP=40;connectedCallback(){n(this.host,(()=>this.frameButton())),this.open&&this.layer&&t(this)}async setFocus(){this.frameButton()?.focus()}frameButton(){return this.interactive&&this.host.querySelector("button.frame")||void 0}disconnectedCallback(){this.deactivate(),this.top.disconnect()&&(this.closing=!1),this.endPan()}onOpen(i){if(i)return this.top.reopen(),this.closing=!1,void this.reset();this.deactivate(),this.closing=this.top.close()}onSrc(){this.failed=!1,this.previewFailed=!1}onPreviewSrc(){this.previewFailed=!1}componentDidRender(){this.open&&this.activate()}activate(){this.open&&this.layer&&!this.modal&&this.host.isConnected&&(this.top.open(this.layer),this.modal=c(this.layer))}deactivate(){this.modal?.release(),this.modal=void 0}reset(){this.zoom=1,this.rotation=0,this.panX=0,this.panY=0}openPreview=()=>{this.interactive&&!this.open&&(this.open=!0,this.suiOpen.emit())};requestClose(i){this.suiClose.emit(i).defaultPrevented||(this.open=!1)}get interactive(){return!this.noPreview&&!this.failed&&!this.previewFailed}get bigSrc(){return this.previewSrc||this.src}get pannable(){return this.zoom>1}setZoom(i){this.zoom=i,i<=1?(this.panX=0,this.panY=0):this.clampPan()}clampPan(){const i=this.big?.offsetWidth||0,s=this.big?.offsetHeight||0;if(!i||!s)return;const e=Math.max(0,(i*this.zoom-i)/2),t=Math.max(0,(s*this.zoom-s)/2);this.panX=Math.min(e,Math.max(-e,this.panX)),this.panY=Math.min(t,Math.max(-t,this.panY))}turn(i){this.rotation=(this.rotation+i)%360}pan(i,s){this.panX+=i,this.panY+=s,this.clampPan()}onPanDown=i=>{this.pannable&&(i.preventDefault(),this.panFrom={x:i.clientX-this.panX,y:i.clientY-this.panY},this.panMoved=!1,this.panning=!0,document.addEventListener("pointermove",this.onPanMove),document.addEventListener("pointerup",this.endPan),document.addEventListener("pointercancel",this.endPan))};onPanMove=i=>{this.panFrom&&(this.panMoved=!0,this.panX=i.clientX-this.panFrom.x,this.panY=i.clientY-this.panFrom.y,this.clampPan())};endPan=()=>{this.panFrom=void 0,this.panning=!1,"undefined"!=typeof document&&(document.removeEventListener("pointermove",this.onPanMove),document.removeEventListener("pointerup",this.endPan),document.removeEventListener("pointercancel",this.endPan))};onLayerKeyDown=s=>{const e=i.PAN_STEP;let t=0,a=0;switch(s.key){case"ArrowLeft":t=e;break;case"ArrowRight":t=-e;break;case"ArrowUp":a=e;break;case"ArrowDown":a=-e;break;default:return}s.stopPropagation(),this.pannable&&(s.preventDefault(),this.pan(t,a))};onLayerClick=i=>{const s=this.panMoved;this.panMoved=!1,s||i.target!==this.layer&&i.target!==this.stage||this.requestClose("scrim")};onImageError=()=>{this.failed||(this.failed=!0,this.suiError.emit(this.src),this.open&&this.requestClose("cancel"))};onPreviewError=()=>{if(!this.previewSrc)return this.onImageError();this.previewFailed||(this.previewFailed=!0,this.suiError.emit(this.previewSrc),this.open&&this.requestClose("cancel"))};transform(){const i=[];return(this.panX||this.panY)&&i.push(`translate(${this.panX}px, ${this.panY}px)`),this.rotation&&i.push(`rotate(${this.rotation}deg)`),1!==this.zoom&&i.push(`scale(${this.zoom})`),i.length?i.join(" "):void 0}static len(i){if(null!=i&&""!==i)return"number"==typeof i||/^\d+(\.\d+)?$/.test(i+"")?i+"px":i+""}static one(i,s,e){return i.includes(s)?s:e}tool(i,s,e){return a("button",{type:"button",class:"tool","aria-label":i,onClick:e},a(p,{glyph:s}))}render(){const s={width:i.len(this.width),height:i.len(this.height),borderRadius:this.radius||void 0},e=this.caption||this.alt||d(void 0,"image.imagePreview",void 0,"Image preview"),t=i.one(y,this.fit,"cover"),r=[this.failed?null:a("img",{class:{pic:!0,[t]:!0},src:this.src,alt:this.alt,loading:i.one(w,this.loading,"lazy"),onError:this.onImageError}),a("span",{key:"a26973d182b104f7a4bdc114bdd3bfe5697fbbb1",class:"fallback",hidden:!this.failed},a("slot",{key:"02e2716a07d9d3fef1c016da68ff83604dcafdc2",name:"error"})),this.failed&&!k(this.host,"error")?a(x,{text:d(void 0,"image.unavailable",void 0,"Image unavailable")}):null];return a(o,{key:"f02baa9ae7c9a0b775607cda11d8dffb56a74583"},a("figure",{key:"d9b8a137ff65c6083abecf8f5ed89c95567cfde4",class:"figure"},this.interactive?a("button",{type:"button",class:"frame preview",style:s,"aria-label":u(void 0,"image.preview",void 0,"Preview: {name}",{name:e}),"aria-haspopup":"dialog","aria-expanded":this.open?"true":"false","aria-controls":this.open?this.layerId:void 0,onClick:this.openPreview},r,a("span",{class:"veil","aria-hidden":"true"},a(p,{glyph:m}))):a("div",{class:{frame:!0,failed:this.failed},style:s},r),this.caption?a("figcaption",{class:"caption"},this.caption):null),this.open||this.closing?a("div",{id:this.layerId,class:{layer:!0,closing:this.closing},inert:this.closing,ref:i=>this.layer=i,role:"dialog","aria-label":e,onClick:this.onLayerClick,onKeyDown:this.onLayerKeyDown},a("div",{class:"bar"},this.caption?a("div",{class:"big-caption"},this.caption):null,a("div",{class:"tools"},this.tool(d(void 0,"image.zoomIn",void 0,"Zoom in"),m,(()=>this.setZoom(Math.min(2.5,+(this.zoom+.25).toFixed(2))))),this.tool(d(void 0,"image.zoomOut",void 0,"Zoom out"),g,(()=>this.setZoom(Math.max(.5,+(this.zoom-.25).toFixed(2))))),a("span",{class:"sep","aria-hidden":"true"}),this.tool(d(void 0,"image.rotateLeft",void 0,"Rotate left"),f,(()=>this.turn(-90))),this.tool(d(void 0,"image.rotateRight",void 0,"Rotate right"),v,(()=>this.turn(90))),a("span",{class:"sep","aria-hidden":"true"}),this.tool(d(void 0,"image.close",void 0,"Close"),b,(()=>this.requestClose("close-button"))))),a("div",{class:"stage",ref:i=>this.stage=i},a("img",{class:{big:!0,pannable:this.pannable,panning:this.panning},ref:i=>this.big=i,src:this.bigSrc,alt:this.alt,style:{transform:this.transform()},onError:this.onPreviewError,onPointerDown:this.onPanDown}))):null)}static get watchers(){return{open:[{onOpen:0}],src:[{onSrc:0}],previewSrc:[{onPreviewSrc:0}]}}static get style(){return".sc-sui-image-h{display:inline-block;font-family:var(--font-sans)}.figure.sc-sui-image{margin:0;display:inline-block}.frame.sc-sui-image{position:relative;display:block;overflow:hidden;box-sizing:border-box;padding:0;margin:0;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-sunken);cursor:default;font:inherit;color:inherit;text-align:start}.frame.preview.sc-sui-image{cursor:zoom-in}.frame.preview.sc-sui-image:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.pic.sc-sui-image{display:block;width:100%;height:100%}.pic.cover.sc-sui-image{object-fit:cover}.pic.contain.sc-sui-image{object-fit:contain}.fallback.sc-sui-image{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.fallback[hidden].sc-sui-image{display:none}.frame.failed.sc-sui-image{min-width:128px;min-height:96px}.veil.sc-sui-image{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:var(--scrim);color:var(--ink-on-dark);opacity:0;transition:opacity var(--duration-fast) var(--ease-out)}.veil.sc-sui-image .sui-glyph.sc-sui-image{font-size:18px}.frame.preview.sc-sui-image:hover .veil.sc-sui-image,.frame.preview.sc-sui-image:focus-visible .veil.sc-sui-image{opacity:1}.caption.sc-sui-image{font-size:11.5px;color:var(--ink-faint);margin-top:6px}.layer.sc-sui-image{position:fixed;inset:0;z-index:var(--z-dialog);background:color-mix(in srgb, var(--media-dark) 90%, transparent);display:flex;flex-direction:column;animation:sui-image-fade var(--duration-slow) var(--ease-out)}.layer.sc-sui-image:focus{outline:none}.bar.sc-sui-image{flex:none;display:flex;align-items:center;gap:16px;height:64px;box-sizing:border-box;padding-inline:24px 14px;background:var(--media-dark)}.big-caption.sc-sui-image{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:color-mix(in srgb, var(--ink-on-dark) 85%, transparent);font-size:13px;font-weight:600;font-family:var(--font-sans)}.tools.sc-sui-image{display:flex;align-items:center;gap:4px;margin-inline-start:auto}.sep.sc-sui-image{width:1px;height:20px;margin-inline:4px;background:color-mix(in srgb, var(--ink-on-dark) 22%, transparent)}.tool.sc-sui-image{width:40px;height:40px;padding:0;margin:0;border:0;border-radius:var(--radius-md);background:transparent;color:var(--ink-on-dark);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background var(--duration-fast) var(--ease-out)}.tool.sc-sui-image .sui-glyph.sc-sui-image{font-size:16px}.tool.sc-sui-image:hover{background:color-mix(in srgb, var(--ink-on-dark) 14%, transparent)}.tool.sc-sui-image:focus-visible{outline:2px solid var(--ink-on-dark);outline-offset:1px;box-shadow:none}.stage.sc-sui-image{position:relative;flex:1;min-height:0;overflow:hidden;box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:16px 24px}@media (max-width: 480px){.bar.sc-sui-image{flex-wrap:wrap;height:auto;min-height:64px;padding-block:12px;row-gap:6px}.big-caption.sc-sui-image{order:1;flex-basis:100%;white-space:normal;overflow-wrap:break-word}}.big.sc-sui-image{position:relative;max-width:100%;max-height:100%;border-radius:var(--radius-md);display:block;transition:transform var(--duration-base) var(--ease-out);animation:sui-image-in var(--duration-slow) var(--ease-out)}.big.pannable.sc-sui-image{cursor:grab}.big.pannable.sc-sui-image:active{cursor:grabbing}.big.panning.sc-sui-image{transition:none}.layer.closing.sc-sui-image{pointer-events:none;animation:sui-image-out var(--duration-fast) var(--ease-out) forwards}@keyframes sui-image-fade{from{opacity:0}}@keyframes sui-image-in{from{opacity:0;top:4px}}@keyframes sui-image-out{to{opacity:0}}@media (forced-colors: active){.layer.sc-sui-image{background:Canvas}.bar.sc-sui-image{background:Canvas}.big.sc-sui-image{border:1px solid CanvasText;box-sizing:border-box}.big-caption.sc-sui-image{color:CanvasText}.tool.sc-sui-image{color:ButtonText;border:1px solid ButtonText}.tool.sc-sui-image:focus-visible{outline-color:Highlight}.sep.sc-sui-image{background:CanvasText}}.sui-media-fallback.sc-sui-image{position:absolute;inset:0;box-sizing:border-box;padding:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:var(--surface-sunken);color:var(--ink-faint);font:460 12.5px/1.4 var(--font-sans);text-align:center}.sui-media-fallback.sc-sui-image .sui-glyph.sc-sui-image{font-size:22px}.sui-media-fallback.sc-sui-image .sui-mf-text.sc-sui-image{color:var(--ink-muted)}.sui-media-fallback.compact.sc-sui-image{gap:0;padding:0}.sui-media-fallback.compact.sc-sui-image .sui-glyph.sc-sui-image{font-size:14px}.sui-media-fallback.inverse.sc-sui-image{background:transparent;color:color-mix(in srgb, var(--ink-on-dark) 70%, transparent)}.sui-media-fallback.inverse.sc-sui-image .sui-mf-text.sc-sui-image{color:var(--ink-on-dark)}@media (forced-colors: active){.sui-media-fallback.sc-sui-image,.sui-media-fallback.sc-sui-image .sui-mf-text.sc-sui-image{color:GrayText}}"}},[774,"sui-image",{src:[1],previewSrc:[1,"preview-src"],alt:[1],caption:[1],width:[8],height:[8],radius:[1],fit:[513],loading:[513],noPreview:[516,"no-preview"],open:[1540],zoom:[32],rotation:[32],panX:[32],panY:[32],panning:[32],failed:[32],previewFailed:[32],closing:[32],setFocus:[64]},void 0,{open:[{onOpen:0}],src:[{onSrc:0}],previewSrc:[{onPreviewSrc:0}]}]),j=z,C=function(){"undefined"!=typeof customElements&&["sui-image"].forEach((i=>{"sui-image"===i&&(customElements.get(r(i))||customElements.define(r(i),z))}))};export{j as SuiImage,C as defineCustomElement}

package/dist/components/sui-inplace.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInplace extends Components.SuiInplace, HTMLElement {}
+export const SuiInplace: {
+    prototype: SuiInplace;
+    new (): SuiInplace;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-inplace.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as e,h as a,a as t,t as n}from"./p-CeVlau-G.js";import{a as r}from"./p-BuyjS5bS.js";import{d as l}from"./p-BHB1Wprj.js";import{G as o,$ as c}from"./p-DdsE4HI6.js";const u=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiInput=e(this,"suiInput",7),this.suiSave=e(this,"suiSave",7),this.suiOpen=e(this,"suiOpen",3),this.suiClose=e(this,"suiClose",3)}get host(){return this}value="";placeholder;label;name;editing=!1;disabled=!1;readOnly=!1;suiInput;suiSave;suiOpen;suiClose;input;text;snapshot="";focusPending=!1;restorePending=!1;async edit(){this.begin()}async setFocus(){this.focusTarget()?.focus()}focusTarget(){return this.editing?this.input:this.disabled?void 0:this.text}connectedCallback(){l(this.host,(()=>this.focusTarget()))}componentWillLoad(){this.snapshot=this.value}onEditing(i){i&&(this.snapshot=this.value,this.focusPending=!0)}componentDidRender(){this.focusPending&&(this.focusPending=!1,this.input?.focus(),this.input?.select?.()),this.restorePending&&(this.restorePending=!1,this.text?.focus())}begin(){this.editing||this.disabled||this.readOnly||(this.editing=!0,this.suiOpen.emit())}requestClose(i){return!this.suiClose.emit(i).defaultPrevented||(this.input?.focus(),!1)}commit(i){this.editing&&this.requestClose("pick")&&(this.restorePending=i,this.editing=!1,this.suiSave.emit(this.value))}revert(i){this.editing&&this.requestClose("escape")&&(this.restorePending=i,this.editing=!1,this.value!==this.snapshot&&(this.value=this.snapshot,this.suiInput.emit(this.value)))}onInput=i=>{this.value=i.target.value,this.suiInput.emit(this.value)};onBlur=()=>{this.commit(!1)};onInputKey=i=>{"Enter"===i.key?(i.preventDefault(),this.commit(!0)):"Escape"===i.key&&(i.preventDefault(),this.revert(!0))};onTextKey=i=>{"Enter"!==i.key&&" "!==i.key||(i.preventDefault(),this.begin())};render(){const i=r(void 0,"inplace.placeholder",this.placeholder,"Click to edit"),s=this.disabled||this.readOnly;return a(t,{key:"b3bdad0742ec1f24e5d4fffe2a6afee1b1f8584a"},this.label?a("span",{class:"sui-inplace-label"},this.label):null,this.editing?a("span",{class:"sui-inplace-field","data-value":this.value||i},a("input",{ref:i=>this.input=i,class:"sui-inplace-input sui-frame",type:"text",size:1,name:this.name,value:this.value,placeholder:this.placeholder,"aria-label":this.label||i,onInput:this.onInput,onBlur:this.onBlur,onKeyDown:this.onInputKey})):a("span",{ref:i=>this.text=i,class:{"sui-inplace-text":!0,empty:!this.value,locked:s},role:this.disabled?void 0:"button",tabIndex:this.disabled?void 0:0,"aria-disabled":this.disabled?"true":void 0,"aria-readonly":this.readOnly&&!this.disabled?"true":void 0,"aria-label":this.disabled?void 0:this.label||void 0,onClick:s?void 0:()=>this.begin(),onKeyDown:s?void 0:this.onTextKey},a("span",{class:"value"},this.value||i),s?null:a(o,{glyph:c})),!this.editing&&this.name?a("input",{type:"hidden",name:this.name,value:this.value}):null)}static get watchers(){return{editing:[{onEditing:0}]}}static get style(){return".sc-sui-inplace-h{display:inline-flex;flex-direction:column;gap:4px;max-width:100%;font-family:var(--font-sans);vertical-align:top}.sui-inplace-label.sc-sui-inplace{font-size:11px;font-weight:650;letter-spacing:0.05em;text-transform:uppercase;color:var(--ink-faint)}.sui-inplace-text.sc-sui-inplace,.sui-inplace-input.sc-sui-inplace,.sui-inplace-field.sc-sui-inplace::after{box-sizing:border-box;min-width:0;min-height:28px;padding:2px 8px;border:1px solid transparent;border-radius:var(--radius-md);font:inherit}.sui-inplace-text.sc-sui-inplace,.sui-inplace-field.sc-sui-inplace{margin:-3px -9px;max-width:calc(100% + 18px)}.sui-inplace-text.sc-sui-inplace{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--ink);cursor:text;transition:background var(--duration-fast) var(--ease-out)}.sui-inplace-text.empty.sc-sui-inplace{color:var(--ink-placeholder)}.sui-inplace-text.sc-sui-inplace .value.sc-sui-inplace{min-width:0;max-width:100%;overflow-wrap:anywhere}.sui-inplace-text.locked.sc-sui-inplace{cursor:default}.sui-inplace-text.locked.sc-sui-inplace:hover{background:transparent}[disabled].sc-sui-inplace-h .sui-inplace-text.sc-sui-inplace{color:var(--disabled-ink);cursor:not-allowed}[disabled].sc-sui-inplace-h .sui-inplace-text.empty.sc-sui-inplace{color:var(--ink-placeholder)}.sui-inplace-text.sc-sui-inplace:hover{--ink-faint:var(--ink-muted);background:var(--surface-hover)}.sui-inplace-text.empty.sc-sui-inplace:not(.locked):hover{color:var(--ink-faint)}.sui-inplace-text.sc-sui-inplace:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.sui-inplace-text.sc-sui-inplace .sui-glyph.sc-sui-inplace{font-size:0.8em;color:var(--ink-faint);opacity:0.45;transition:opacity var(--duration-fast) var(--ease-out)}.sui-inplace-text.sc-sui-inplace:hover .sui-glyph.sc-sui-inplace{opacity:1}.sui-inplace-field.sc-sui-inplace{display:inline-grid;align-items:stretch}.sui-inplace-field.sc-sui-inplace::after{content:attr(data-value);grid-area:1 / 1;visibility:hidden;white-space:pre;padding-inline-end:calc(16px + 0.8em)}.sui-inplace-input.sc-sui-inplace{grid-area:1 / 1;width:100%;margin:0;color:var(--ink)}.sui-inplace-input.sc-sui-inplace::placeholder{color:var(--ink-placeholder)}@media (forced-colors: active){.sui-inplace-text.sc-sui-inplace{border-style:none;padding:3px 9px}.sui-inplace-text.sc-sui-inplace .sui-glyph.sc-sui-inplace{opacity:1}}.sui-frame.sc-sui-inplace{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-inplace:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-inplace,.sui-frame.readonly.sc-sui-inplace{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-inplace:focus-within,.sui-frame.focus.sc-sui-inplace,.sui-frame.open.sc-sui-inplace{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-inplace{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-inplace:focus-within,.sui-frame.invalid.focus.sc-sui-inplace,.sui-frame.invalid.open.sc-sui-inplace{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-inplace:disabled,.sui-frame.disabled.sc-sui-inplace{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-inplace{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-inplace::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-inplace{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-inplace{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-inplace{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-inplace:focus-within,.sui-frame.focus.sc-sui-inplace,.sui-frame.open.sc-sui-inplace{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-inplace:disabled,.sui-frame.disabled.sc-sui-inplace{color:GrayText;border-color:GrayText}}"}},[514,"sui-inplace",{value:[1025],placeholder:[1],label:[1],name:[513],editing:[1540],disabled:[516],readOnly:[516,"readonly"],edit:[64],setFocus:[64]},void 0,{editing:[{onEditing:0}]}]),d=u,p=function(){"undefined"!=typeof customElements&&["sui-inplace"].forEach((i=>{"sui-inplace"===i&&(customElements.get(n(i))||customElements.define(n(i),u))}))};export{d as SuiInplace,p as defineCustomElement}

package/dist/components/sui-input-group-addon.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputGroupAddon extends Components.SuiInputGroupAddon, HTMLElement {}
+export const SuiInputGroupAddon: {
+    prototype: SuiInputGroupAddon;
+    new (): SuiInputGroupAddon;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-group-addon.js

@@ -0,0 +1 @@
+import{p as e,H as n,h as t,a as s,t as a}from"./p-CeVlau-G.js";const o=e(class extends n{constructor(e){super(),!1!==e&&this.__registerHost()}render(){return t(s,{key:"9c6c955aa8f342625371e845303b877a3c883a07"},t("slot",{key:"74c95fa3b70f163443293d424e285950b4a7988a"}))}static get style(){return".sc-sui-input-group-addon-h{display:flex;align-items:center;padding:0 12px;box-sizing:border-box;background:var(--sui-addon-bg, var(--surface-sunken));color:var(--ink-muted);font-family:var(--font-sans);font-size:13px;font-weight:550;white-space:nowrap}"}},[262,"sui-input-group-addon"]),r=o,u=function(){"undefined"!=typeof customElements&&["sui-input-group-addon"].forEach((e=>{"sui-input-group-addon"===e&&(customElements.get(a(e))||customElements.define(a(e),o))}))};export{r as SuiInputGroupAddon,u as defineCustomElement}

package/dist/components/sui-input-group.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputGroup extends Components.SuiInputGroup, HTMLElement {}
+export const SuiInputGroup: {
+    prototype: SuiInputGroup;
+    new (): SuiInputGroup;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-group.js

@@ -0,0 +1 @@
+import{SuiInputGroup as e,defineCustomElement as o}from"./p-CT6aJe8X.js";const t=e,p=o;export{t as SuiInputGroup,p as defineCustomElement}

package/dist/components/sui-input-mask.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputMask extends Components.SuiInputMask, HTMLElement {}
+export const SuiInputMask: {
+    prototype: SuiInputMask;
+    new (): SuiInputMask;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-mask.js

@@ -0,0 +1 @@
+import{p as s,H as i,c as t,h as e,t as a}from"./p-CeVlau-G.js";import{d as r,F as o}from"./p-TBwsYzWO.js";import{u as n}from"./p-U06fVoGD.js";import{i as u,d as l,s as h,a as d,r as c}from"./p-BHB1Wprj.js";import{a as m}from"./p-BM1Zzj1H.js";import{i as p,a as f}from"./p-Cs2X0Kih.js";import{l as b}from"./p-BuyjS5bS.js";import{f as v}from"./p-CGWvlrv_.js";const k={9:/^[0-9]$/,a:/^[a-zA-Z]$/,"*":/^[a-zA-Z0-9]$/},g=s=>(s||"").replace(/[^a-zA-Z0-9]/g,""),y=s=>(s||"").split("?").join("");function x(s,i){let t="",e=0;for(let a=0;a<s.length&&e<i.length;a++){const r=s[a];if("?"===r)continue;const o=i[e],n=k[r];n?n.test(o)?(t+=o,e++):(e++,a--):t+=r}return t}const F=s=>s.split("").filter((s=>!!k[s])),w=s=>{const i=s.indexOf("?");return F(i<0?s:s.slice(0,i))},z=["sm","md","lg"],C=s(class extends i{constructor(s){super(),!1!==s&&this.__registerHost(),this.suiInput=t(this,"suiInput",7),this.suiChange=t(this,"suiChange",7),this.suiComplete=t(this,"suiComplete",7),this.suiFocus=t(this,"suiFocus",3),this.suiBlur=t(this,"suiBlur",3),this.internals=this.attachInternals()}get host(){return this}internals;label;required=!1;help;error;size="md";invalid=!1;disabled=!1;mask="(999) 999-9999";placeholder;value="";name;unmask=!1;autoClear=!1;readOnly=!1;autocomplete;suiInput;suiChange;suiComplete;suiFocus;suiBlur;fieldId=n("sui-input-mask");input;initial="";wasComplete=!1;formDisabled=!1;hostLabel;hostLabelledby;stopAria;stopLabelledby;get isDisabled(){return this.disabled||this.formDisabled}connectedCallback(){u(this.host,this.internals),l(this.host,(()=>this.input)),this.stopAria?.(),this.stopAria=p(this.host,(s=>{this.hostLabel=s})),this.stopLabelledby?.(),this.stopLabelledby=f(this.host,(s=>{this.hostLabelledby=s}))}componentWillLoad(){this.value=x(this.mask,g(this.value)),this.initial=this.value,this.syncForm()}disconnectedCallback(){this.stopAria?.(),this.stopLabelledby?.()}onMask(){this.value=x(this.mask,g(this.value))}onValue(){const s=x(this.mask,g(this.value));s!==this.value&&(this.value=s)}componentDidRender(){this.syncForm()}syncForm(){h(this.internals,this.isDisabled?null:this.unmask?g(this.value):this.value);const s=!this.isDisabled&&!this.readOnly;if(s&&!this.error&&this.isPartial()){const s=y(this.mask),i=this.label?b(void 0,"input-mask.mismatch",void 0,"{field} must match {pattern}.",{field:this.label,pattern:s}):b(void 0,"input-mask.mismatchUnnamed",void 0,"This field must match {pattern}.",{pattern:s});d(this.internals,{patternMismatch:!0},i,this.input)}else c(this.internals,this.required&&s,!g(this.value),this.label,this.input,this.error)}isPartial(){const s=g(this.value),i=w(this.mask).length;return s.length>0&&i>0&&s.length<i}componentDidLoad(){this.syncForm()}formResetCallback(){this.value=this.initial,this.input&&(this.input.value=this.initial),this.syncForm()}formDisabledCallback(s){this.formDisabled=v(this.host,this.disabled,s),this.syncForm()}async select(){this.input?.select()}async setFocus(){this.input?.focus()}async getUnmasked(){return g(this.value)}slotAt(s){return g(s.value.slice(0,s.selectionStart??s.value.length)).length}caretFor(s,i){if(i<=0){const i=s.split("").findIndex((s=>/[a-zA-Z0-9]/.test(s)));return i<0?s.length:i}let t=0;for(let e=0;e<s.length;e++)if(/[a-zA-Z0-9]/.test(s[e])&&(t++,t===i))return e+1;return s.length}onKeyDown=s=>{if(s.ctrlKey||s.metaKey||s.altKey)return;const i=s.target;if(i.selectionStart!==i.selectionEnd)return;const t=F(this.mask),e=this.slotAt(i);if(g(i.value).length>=t.length&&1===s.key.length)return void s.preventDefault();const a=t[e];1!==s.key.length||a&&m(k[a],s.key)||s.preventDefault()};onInput=s=>{const i=s.target,t=this.slotAt(i),e=x(this.mask,g(i.value));if(i.value!==e){i.value=e;const s=this.caretFor(e,t);i.setSelectionRange?.(s,s)}this.value=e,this.suiInput.emit(this.value);const a=w(this.mask).length||F(this.mask).length,r=a>0&&g(e).length>=a;r&&!this.wasComplete&&this.suiComplete.emit(this.value),this.wasComplete=r};onChange=()=>{this.suiChange.emit(this.value)};onFocus=()=>{this.suiFocus.emit()};onBlur=()=>{this.autoClear&&this.isPartial()&&!this.isDisabled&&!this.readOnly&&(this.value="",this.input&&(this.input.value=""),this.wasComplete=!1,this.suiInput.emit(""),this.suiChange.emit("")),this.suiBlur.emit()};render(){const s=this.invalid||!!this.error,i=y(this.mask),t=this.placeholder||i.replace(/[9a*]/g,"_"),a=this.mask.includes("?"),n=a?this.mask.slice(0,this.mask.indexOf("?")):"",u=z.includes(this.size)?this.size:"md";return e(o,{key:"634471bc71366453ed3e4e2f9bfcf3c0ba8f730c",label:this.label,required:this.required,help:this.help,error:this.error,htmlFor:this.fieldId,descId:this.fieldId},e("input",{key:"5b74078d0252d5effe929593cf04f1464d00e301",ref:s=>this.input=s,id:this.fieldId,class:{"sui-input":!0,"sui-frame":!0,"sui-mask":!0,[u]:!0,invalid:s},type:"text",value:this.value,placeholder:t,maxLength:i.length,required:this.required,disabled:this.isDisabled,readOnly:this.readOnly,autocomplete:this.autocomplete??"off","aria-label":this.label?void 0:this.hostLabel,"aria-labelledby":this.label?void 0:this.hostLabelledby,"aria-invalid":s?"true":null,"aria-describedby":[r(this.fieldId,this.help,this.error),this.fieldId+"-fmt"].filter(Boolean).join(" ")||null,onFocus:this.onFocus,onBlur:this.onBlur,onKeyDown:this.onKeyDown,onInput:this.onInput,onChange:this.onChange}),e("span",{key:"4bb157280e88de2a4c6355e05f37ca93862e1949",class:"sui-mask-fmt",id:this.fieldId+"-fmt"},a&&n?b(void 0,"input-mask.formatPartial",void 0,"Format: {pattern} ({part} required)",{pattern:i,part:n}):b(void 0,"input-mask.format",void 0,"Format: {pattern}",{pattern:i})))}static get formAssociated(){return!0}static get watchers(){return{mask:[{onMask:0}],value:[{onValue:0},{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}],unmask:[{syncForm:0}]}}static get style(){return".sc-sui-input-mask-h{display:block;font-family:var(--font-sans)}.sui-input.sui-mask.sc-sui-input-mask{font-feature-settings:'tnum'}.sui-mask-fmt.sc-sui-input-mask{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}.sui-field.sc-sui-input-mask{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-input-mask{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-input-mask .sui-field-label.sc-sui-input-mask{color:var(--danger)}.sui-field-req.sc-sui-input-mask{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-input-mask{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-input-mask{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-input-mask .sui-glyph.sc-sui-input-mask{font-size:11px}.sui-frame.sc-sui-input-mask{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-input-mask:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-input-mask,.sui-frame.readonly.sc-sui-input-mask{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-input-mask:focus-within,.sui-frame.focus.sc-sui-input-mask,.sui-frame.open.sc-sui-input-mask{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-input-mask{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-input-mask:focus-within,.sui-frame.invalid.focus.sc-sui-input-mask,.sui-frame.invalid.open.sc-sui-input-mask{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-input-mask:disabled,.sui-frame.disabled.sc-sui-input-mask{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-input-mask{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-input-mask::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-input-mask{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-input-mask{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-input-mask{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-input-mask:focus-within,.sui-frame.focus.sc-sui-input-mask,.sui-frame.open.sc-sui-input-mask{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-input-mask:disabled,.sui-frame.disabled.sc-sui-input-mask{color:GrayText;border-color:GrayText}}"}},[578,"sui-input-mask",{label:[1],required:[516],help:[1],error:[1],size:[513],invalid:[516],disabled:[516],mask:[1],placeholder:[1],value:[1025],name:[513],unmask:[516],autoClear:[516,"auto-clear"],readOnly:[516,"readonly"],autocomplete:[1],formDisabled:[32],hostLabel:[32],hostLabelledby:[32],select:[64],setFocus:[64],getUnmasked:[64]},void 0,{mask:[{onMask:0}],value:[{onValue:0},{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}],unmask:[{syncForm:0}]}]),j=C,B=function(){"undefined"!=typeof customElements&&["sui-input-mask"].forEach((s=>{"sui-input-mask"===s&&(customElements.get(a(s))||customElements.define(a(s),C))}))};export{j as SuiInputMask,B as defineCustomElement}

package/dist/components/sui-input-number.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputNumber extends Components.SuiInputNumber, HTMLElement {}
+export const SuiInputNumber: {
+    prototype: SuiInputNumber;
+    new (): SuiInputNumber;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-number.js

@@ -0,0 +1 @@
+import{SuiInputNumber as e,defineCustomElement as t}from"./p-CekHtBpA.js";const m=e,o=t;export{m as SuiInputNumber,o as defineCustomElement}

package/dist/components/sui-input-otp.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputOtp extends Components.SuiInputOtp, HTMLElement {}
+export const SuiInputOtp: {
+    prototype: SuiInputOtp;
+    new (): SuiInputOtp;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-otp.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as t,h as e,t as o}from"./p-CeVlau-G.js";import{d as r,F as n}from"./p-TBwsYzWO.js";import{u as a}from"./p-U06fVoGD.js";import{a as u,l as h}from"./p-BuyjS5bS.js";import{i as l,d,s as p,r as c}from"./p-BHB1Wprj.js";import{i as f,a as m}from"./p-Cs2X0Kih.js";import{f as b}from"./p-CGWvlrv_.js";const v=["sm","md","lg"],g=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiInput=t(this,"suiInput",7),this.suiChange=t(this,"suiChange",7),this.suiComplete=t(this,"suiComplete",7),this.suiFocus=t(this,"suiFocus",3),this.suiBlur=t(this,"suiBlur",3),this.internals=this.attachInternals()}get host(){return this}internals;label;help;error;length=6;size="md";invalid=!1;disabled=!1;readOnly=!1;masked=!1;alphanumeric=!1;value="";name;required=!1;suiInput;suiChange;suiComplete;suiFocus;suiBlur;cells=[];formDisabled=!1;hostLabel;hostLabelledby;stopAria;stopLabelledby;fieldId=a("sui-otp");inputs=[];initial="";internal=!1;committed="";get isDisabled(){return this.disabled||this.formDisabled}get len(){const i=Math.floor(Number(this.length));return Number.isFinite(i)&&i>0?i:6}connectedCallback(){l(this.host,this.internals),d(this.host,(()=>this.focusTarget())),this.stopAria?.(),this.stopAria=f(this.host,(i=>{this.hostLabel=i})),this.stopLabelledby?.(),this.stopLabelledby=m(this.host,(i=>{this.hostLabelledby=i}))}componentWillLoad(){this.value=this.normalizeValue(this.value),this.initial=this.value,this.committed=this.value,this.cells=this.split(this.value),this.syncForm()}disconnectedCallback(){this.stopAria?.(),this.stopLabelledby?.()}onValue(){const i=this.normalizeValue(this.value);i===this.value?(this.internal||i===this.cells.join("")||(this.cells=this.split(i)),this.syncForm()):this.value=i}onLength(){this.value=this.normalizeValue(this.value),this.cells=this.split(this.value),this.syncForm()}syncForm(){p(this.internals,this.isDisabled?null:this.value),c(this.internals,this.required&&!this.isDisabled&&!this.readOnly,this.cells.some((i=>!i)),this.label,this.inputs[0],this.error)}componentDidRender(){this.syncForm()}formResetCallback(){this.value=this.initial,this.committed=this.initial,this.cells=this.split(this.initial),this.cells.forEach(((i,s)=>{const t=this.inputs[s];t&&(t.value=i)})),this.syncForm()}formDisabledCallback(i){this.formDisabled=b(this.host,this.disabled,i),this.syncForm()}async setFocus(){this.focusTarget()?.focus()}focusTarget(){const i=this.cells.findIndex((i=>!i));return this.inputs[i>=0?i:this.len-1]}accept(i){return(i||"").replace(this.alphanumeric?/[^a-zA-Z0-9]/g:/\D/g,"")}normalizeValue(i){return this.accept(i).slice(0,this.len)}split(i){const s=this.normalizeValue(i);return Array.from({length:this.len},((i,t)=>s[t]||""))}focusAt(i){const s=this.inputs[Math.max(0,Math.min(this.len-1,i))];s&&(s.focus(),s.select?.())}update(i){this.cells=i;const s=i.join("");this.internal=!0,this.value=s,this.internal=!1,this.suiInput.emit(s),i.length>0&&i.every(Boolean)&&this.suiComplete.emit(s)}commit(){this.value!==this.committed&&(this.committed=this.value,this.suiChange.emit(this.value))}onFocusIn=i=>{const s=i.relatedTarget;s&&this.host.contains(s)||this.suiFocus.emit()};onFocusOut=i=>{const s=i.relatedTarget;s&&this.host.contains(s)||(this.commit(),this.suiBlur.emit())};onInput=i=>s=>{const t=s.target;if(this.readOnly)return void(t.value=this.cells[i]);const e=this.accept(t.value),o=this.cells.slice();if(e.length>1){for(let s=0;s<e.length&&i+s<this.len;s++)o[i+s]=e[s];return t.value=o[i],this.update(o),void this.focusAt(Math.min(this.len-1,i+e.length))}o[i]=e.slice(-1),t.value=o[i],o[i]!==this.cells[i]&&(this.update(o),o[i]&&i<this.len-1&&this.focusAt(i+1))};onKeyDown=i=>s=>{if("Enter"!==s.key)if("Backspace"===s.key&&this.readOnly)s.preventDefault();else if(1!==s.key.length||s.ctrlKey||s.metaKey||s.altKey||this.readOnly)if("Backspace"===s.key&&!this.cells[i]&&i>0){s.preventDefault();const t=this.cells.slice();t[i-1]="";const e=this.inputs[i-1];e&&(e.value=""),this.update(t),this.focusAt(i-1)}else"ArrowLeft"===s.key&&i>0?(s.preventDefault(),this.focusAt(i-1)):"ArrowRight"===s.key&&i<this.len-1?(s.preventDefault(),this.focusAt(i+1)):"Home"===s.key?(s.preventDefault(),this.focusAt(0)):"End"===s.key&&(s.preventDefault(),this.focusAt(this.len-1));else{const i=s.target;this.accept(s.key)?i.value&&i.selectionStart===i.selectionEnd&&i.select?.():s.preventDefault()}else this.commit()};onPaste=i=>s=>{if(this.readOnly)return void s.preventDefault();const t=s.clipboardData?.getData("text")||"",e=this.accept(t);if(!e)return;s.preventDefault();const o=this.cells.slice();for(let s=0;s<e.length&&i+s<this.len;s++)o[i+s]=e[s];this.update(o),this.focusAt(Math.min(this.len-1,i+e.length))};onFocus=i=>{i.target.select?.()};render(){const i=this.invalid||!!this.error,s=r(this.fieldId,this.help,this.error),t=v.includes(this.size)?this.size:"md";return this.inputs=[],e(n,{key:"7bd6efecb1f07de3044524c1293d99c5fad93c5a",label:this.label,required:this.required,help:this.help,error:this.error,htmlFor:this.fieldId+"-1",descId:this.fieldId},e("div",{key:"332e7ee7521b625ff5ef0b03ee0a663c88a587c6",class:{"sui-otp":!0,[t]:!0},role:"group","aria-label":this.label||this.hostLabel||(this.hostLabelledby?void 0:u(void 0,"input-otp.oneTimeCode",void 0,"One-time code")),"aria-labelledby":this.label?void 0:this.hostLabelledby,"aria-describedby":s,"aria-invalid":i?"true":null,onFocusin:this.onFocusIn,onFocusout:this.onFocusOut},this.cells.map(((o,r)=>e("input",{key:r,id:0===r?this.fieldId+"-1":void 0,ref:i=>{i&&(this.inputs[r]=i)},class:{"sui-input":!0,"sui-frame":!0,cell:!0,[t]:!0,invalid:i},type:this.masked?"password":"text",inputMode:this.alphanumeric?"text":"numeric",autocomplete:0===r?"one-time-code":"off",maxLength:1,value:o,disabled:this.isDisabled,readOnly:this.readOnly,"aria-label":this.alphanumeric?h(void 0,"input-otp.character",void 0,"Character {n}",{n:r+1}):h(void 0,"input-otp.digit",void 0,"Digit {n}",{n:r+1}),"aria-invalid":i?"true":null,"aria-describedby":s,onFocus:this.onFocus,onInput:this.onInput(r),onKeyDown:this.onKeyDown(r),onPaste:this.onPaste(r)})))))}static get formAssociated(){return!0}static get watchers(){return{value:[{onValue:0}],length:[{onLength:0}],alphanumeric:[{onLength:0}],required:[{syncForm:0}],error:[{syncForm:0}],label:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}]}}static get style(){return".sc-sui-input-otp-h{display:block;font-family:var(--font-sans)}.sui-otp.sc-sui-input-otp{display:flex;flex-wrap:wrap;gap:10px;direction:ltr}.sc-sui-input-otp-h:dir(rtl) .sui-otp.sc-sui-input-otp{justify-content:flex-end}.sui-otp.sm.sc-sui-input-otp{gap:8px}.sui-input.cell.sc-sui-input-otp{width:48px;height:56px;padding:0;text-align:center;font-size:22px;font-weight:700;font-feature-settings:'tnum';caret-color:var(--focus-ring)}.sui-input.cell.sm.sc-sui-input-otp{width:36px;height:40px;padding:0;font-size:16px}.sui-input.cell.md.sc-sui-input-otp{width:42px;height:48px;padding:0;font-size:18px}.sui-input.cell.lg.sc-sui-input-otp{width:48px;height:56px;padding:0;font-size:22px}.sui-field.sc-sui-input-otp{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-input-otp{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-input-otp .sui-field-label.sc-sui-input-otp{color:var(--danger)}.sui-field-req.sc-sui-input-otp{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-input-otp{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-input-otp{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-input-otp .sui-glyph.sc-sui-input-otp{font-size:11px}.sui-frame.sc-sui-input-otp{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-input-otp:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-input-otp,.sui-frame.readonly.sc-sui-input-otp{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-input-otp:focus-within,.sui-frame.focus.sc-sui-input-otp,.sui-frame.open.sc-sui-input-otp{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-input-otp{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-input-otp:focus-within,.sui-frame.invalid.focus.sc-sui-input-otp,.sui-frame.invalid.open.sc-sui-input-otp{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-input-otp:disabled,.sui-frame.disabled.sc-sui-input-otp{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-input-otp{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-input-otp::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-input-otp{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-input-otp{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-input-otp{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-input-otp:focus-within,.sui-frame.focus.sc-sui-input-otp,.sui-frame.open.sc-sui-input-otp{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-input-otp:disabled,.sui-frame.disabled.sc-sui-input-otp{color:GrayText;border-color:GrayText}}"}},[578,"sui-input-otp",{label:[1],help:[1],error:[1],length:[2],size:[513],invalid:[516],disabled:[516],readOnly:[516,"readonly"],masked:[516],alphanumeric:[516],value:[1025],name:[513],required:[516],cells:[32],formDisabled:[32],hostLabel:[32],hostLabelledby:[32],setFocus:[64]},void 0,{value:[{onValue:0}],length:[{onLength:0}],alphanumeric:[{onLength:0}],required:[{syncForm:0}],error:[{syncForm:0}],label:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}]}]),x=g,y=function(){"undefined"!=typeof customElements&&["sui-input-otp"].forEach((i=>{"sui-input-otp"===i&&(customElements.get(o(i))||customElements.define(o(i),g))}))};export{x as SuiInputOtp,y as defineCustomElement}

package/dist/components/sui-input-tags.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputTags extends Components.SuiInputTags, HTMLElement {}
+export const SuiInputTags: {
+    prototype: SuiInputTags;
+    new (): SuiInputTags;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-tags.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as t,h as e,t as a}from"./p-CeVlau-G.js";import{d as r,F as o}from"./p-TBwsYzWO.js";import{u as n}from"./p-U06fVoGD.js";import{i as u,d as l,s as d,r as h}from"./p-BHB1Wprj.js";import{f as p}from"./p-CGWvlrv_.js";import{m as c}from"./p-BE4gZZNA.js";import{l as f,k as g}from"./p-M0fYQCIv.js";import{l as m,a as b}from"./p-BuyjS5bS.js";import{i as v,a as x}from"./p-Cs2X0Kih.js";import{d as y}from"./p-CR0heQtR.js";const k=["sm","md","lg"],w=i=>"string"==typeof i?i:i?.label??"",F=i=>"string"==typeof i?i:g(i?.value),z=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiChange=t(this,"suiChange",7),this.suiInput=t(this,"suiInput",7),this.suiFocus=t(this,"suiFocus",3),this.suiBlur=t(this,"suiBlur",3),this.internals=this.attachInternals()}get host(){return this}internals;label;help;error;value=[];placeholder;size="md";disabled=!1;readOnly=!1;invalid=!1;max;required=!1;separator=",";name;suiChange;suiInput;suiFocus;suiBlur;text="";announce="";formDisabled=!1;hostLabel;hostLabelledby;stopAria;stopLabelledby;fieldId=n("sui-input-tags");input;initial=[];get tags(){return f(this.value,this.host,"value")}get isDisabled(){return this.disabled||this.formDisabled}get sep(){return"string"==typeof this.separator&&this.separator.length>0?this.separator:","}get cap(){return"number"==typeof this.max&&Number.isFinite(this.max)&&this.max>0?Math.floor(this.max):void 0}connectedCallback(){u(this.host,this.internals),l(this.host,(()=>this.input)),this.stopAria?.(),this.stopAria=v(this.host,(i=>{this.hostLabel=i})),this.stopLabelledby?.(),this.stopLabelledby=x(this.host,(i=>{this.hostLabelledby=i}))}componentWillLoad(){this.initial=[...this.tags],this.syncForm()}componentDidRender(){this.syncForm()}disconnectedCallback(){this.stopAria?.(),this.stopLabelledby?.()}syncForm(){const i=this.tags,s=this.isDisabled,t=i.map(F);d(this.internals,s?null:c(this.name,t)??(t.length?t.join(this.sep):null)),h(this.internals,this.required&&!s&&!this.readOnly,0===i.length,this.label,this.input,this.error)}componentDidLoad(){this.syncForm()}formResetCallback(){this.value=[...this.initial],this.text="",this.syncForm()}formDisabledCallback(i){this.formDisabled=p(this.host,this.disabled,i),this.syncForm()}async setFocus(){this.input?.focus()}setValue(i){this.value=i,this.suiChange.emit(i)}commit(i){if(this.readOnly)return;const s=this.text.split(this.sep),t=i?"":s.pop()??"",e=this.tags.slice();let a=!1;for(const i of s){const s=i.trim();s&&(e.some((i=>F(i)===s))?this.announce=m(void 0,"input-tags.alreadyListed",void 0,"{value} is already in the list.",{value:s}):this.cap&&e.length>=this.cap?this.announce=m(void 0,"input-tags.limitReached",void 0,"Limit of {n} reached.",{n:this.cap+""}):(e.push(s),this.announce=m(void 0,"input-tags.added",void 0,"{value} added.",{value:s}),a=!0))}a&&this.setValue(e),this.text!==t&&(this.text=t,this.suiInput.emit(t))}removeAt(i){if(this.isDisabled||this.readOnly)return;const s=this.tags.slice(),[t]=s.splice(i,1);this.announce=m(void 0,"input-tags.removed",void 0,"{value} removed.",{value:w(t)}),this.setValue(s),this.input?.focus()}onInput=i=>{const s=i.target.value;this.readOnly?i.target.value=this.text:(this.text=s,this.suiInput.emit(s),s.includes(this.sep)&&this.commit(!1))};onKeyDown=i=>{"Enter"===i.key?(i.preventDefault(),this.commit(!0)):"Backspace"===i.key&&!this.text&&this.tags.length&&this.removeAt(this.tags.length-1)};onFocus=()=>{this.suiFocus.emit()};onBlur=()=>{this.commit(!0),this.suiBlur.emit()};onBoxClick=i=>{this.isDisabled||i.target.closest("sui-chip")||this.input?.focus()};render(){const i=this.tags,s=this.invalid||!!this.error,t=k.includes(this.size)?this.size:"md";return e(o,{key:"d47747f7afa14cfab2cf33ae2364b10979f5fc0f",label:this.label,required:this.required,help:this.help,error:this.error,htmlFor:this.fieldId,descId:this.fieldId},e("div",{key:"af16da6c8c9178d5509bbf13a8d626b65df1659d",class:{"sui-input":!0,"sui-frame":!0,"sui-chip-box":!0,box:!0,[t]:!0,invalid:s,disabled:this.isDisabled,readonly:this.readOnly},role:"group","aria-label":this.label||this.hostLabel,"aria-labelledby":this.label?void 0:this.hostLabelledby,"aria-disabled":this.isDisabled?"true":null,onClick:this.onBoxClick},i.length?e("span",{class:"sui-chips chips",role:"list"},i.map(((i,s)=>e("span",{role:"listitem",key:s},e("sui-chip",{size:"sm",label:w(i),removable:!this.readOnly,disabled:this.isDisabled,onSuiRemove:i=>{i.stopPropagation(),this.removeAt(s)}}))))):null,e("span",{key:"4edc0c44231dc20f23ea8dfc26b6c1d0ed444748",class:"sr-status",role:"status","aria-live":"polite"},this.announce),e("input",{key:"6678c027370d348a2ef4f07cd48a3a0316a62052",ref:i=>this.input=i,class:"entry",id:this.fieldId,type:"text",value:this.text,disabled:this.isDisabled,readOnly:this.readOnly,placeholder:0===i.length?b(void 0,"input-tags.placeholder",this.placeholder,"Type and press Enter"):"",autocomplete:"off","aria-label":this.label?void 0:this.hostLabel,"aria-labelledby":this.label?void 0:this.hostLabelledby,"aria-invalid":s?"true":null,"aria-required":this.required?"true":null,"aria-describedby":r(this.fieldId,this.help,this.error),onFocus:this.onFocus,onBlur:this.onBlur,onInput:this.onInput,onKeyDown:this.onKeyDown})))}static get formAssociated(){return!0}static get watchers(){return{value:[{syncForm:0}],required:[{syncForm:0}],name:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}]}}static get style(){return'.sc-sui-input-tags-h{display:block;font-family:var(--font-sans);min-inline-size:min(180px, 100%)}.sr-status.sc-sui-input-tags{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.sui-field.sc-sui-input-tags{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-input-tags{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-input-tags .sui-field-label.sc-sui-input-tags{color:var(--danger)}.sui-field-req.sc-sui-input-tags{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-input-tags{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-input-tags{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-input-tags .sui-glyph.sc-sui-input-tags{font-size:11px}.sui-frame.sc-sui-input-tags{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-input-tags:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-input-tags,.sui-frame.readonly.sc-sui-input-tags{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-input-tags:focus-within,.sui-frame.focus.sc-sui-input-tags,.sui-frame.open.sc-sui-input-tags{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-input-tags{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-input-tags:focus-within,.sui-frame.invalid.focus.sc-sui-input-tags,.sui-frame.invalid.open.sc-sui-input-tags{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-input-tags:disabled,.sui-frame.disabled.sc-sui-input-tags{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-input-tags{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-input-tags::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-input-tags{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-input-tags{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-input-tags{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-input-tags:focus-within,.sui-frame.focus.sc-sui-input-tags,.sui-frame.open.sc-sui-input-tags{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-input-tags:disabled,.sui-frame.disabled.sc-sui-input-tags{color:GrayText;border-color:GrayText}}.sui-chip-box.sc-sui-input-tags{display:flex;flex-wrap:wrap;align-items:center;gap:5px;cursor:text}.sui-chip-box.disabled.sc-sui-input-tags{cursor:not-allowed}.sui-chip-box.readonly.sc-sui-input-tags:not(.disabled){cursor:default}.sui-input.sui-chip-box.sm.sc-sui-input-tags{height:auto;min-height:var(--sui-field-height, var(--control-sm));padding:2px 6px;gap:4px;font-size:12.5px}.sui-input.sui-chip-box.md.sc-sui-input-tags{height:auto;min-height:var(--sui-field-height, var(--control-md));padding:3px 8px;font-size:13px}.sui-input.sui-chip-box.lg.sc-sui-input-tags{height:auto;min-height:var(--sui-field-height, var(--control-lg));padding:5px 8px;font-size:13px}.sui-chips.sc-sui-input-tags{display:contents}.sui-chips.sc-sui-input-tags>[role="listitem"].sc-sui-input-tags{display:inline-flex;min-width:0;max-width:100%}.sui-chip-box.sc-sui-input-tags .entry.sc-sui-input-tags{flex:1;width:0;min-width:90px;border:none;outline:none;background:transparent;color:var(--ink);font-size:13px;font-family:var(--font-sans);font-weight:460;padding:3px 2px;margin:0}.sui-chip-box.sc-sui-input-tags .entry.sc-sui-input-tags:focus-visible{outline:none}.sui-chip-box.sm.sc-sui-input-tags .entry.sc-sui-input-tags{font-size:12.5px;padding:1px 2px}.sui-chip-box.md.sc-sui-input-tags .entry.sc-sui-input-tags{padding:2px 2px}.sui-chip-box.sc-sui-input-tags .entry.sc-sui-input-tags::placeholder{color:var(--ink-placeholder)}.sui-chip-box.sc-sui-input-tags .entry.sc-sui-input-tags:disabled{color:var(--disabled-ink);cursor:not-allowed}.sui-chip-box.sc-sui-input-tags .entry.sc-sui-input-tags:disabled::placeholder{color:var(--ink-placeholder)}'}},[578,"sui-input-tags",{label:[1],help:[1],error:[1],value:[1040],placeholder:[1],size:[513],disabled:[516],readOnly:[516,"readonly"],invalid:[516],max:[2],required:[516],separator:[1],name:[513],text:[32],announce:[32],formDisabled:[32],hostLabel:[32],hostLabelledby:[32],setFocus:[64]},void 0,{value:[{syncForm:0}],required:[{syncForm:0}],name:[{syncForm:0}],error:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}]}]),C=z,j=function(){"undefined"!=typeof customElements&&["sui-input-tags","sui-chip"].forEach((i=>{switch(i){case"sui-input-tags":customElements.get(a(i))||customElements.define(a(i),z);break;case"sui-chip":customElements.get(a(i))||y()}}))};export{C as SuiInputTags,j as defineCustomElement}

package/dist/components/sui-input-text.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiInputText extends Components.SuiInputText, HTMLElement {}
+export const SuiInputText: {
+    prototype: SuiInputText;
+    new (): SuiInputText;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-input-text.js

@@ -0,0 +1 @@
+import{SuiInputText as t,defineCustomElement as e}from"./p-BmmgLDk2.js";const m=t,o=e;export{m as SuiInputText,o as defineCustomElement}

package/dist/components/sui-kbd.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiKbd extends Components.SuiKbd, HTMLElement {}
+export const SuiKbd: {
+    prototype: SuiKbd;
+    new (): SuiKbd;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-kbd.js

@@ -0,0 +1 @@
+import{p as e,H as s,h as i,a as r,t as n}from"./p-CeVlau-G.js";const t=e(class extends s{constructor(e){super(),!1!==e&&this.__registerHost()}size="md";tone;quiet=!1;render(){return i(r,{key:"822d0e4695959ad7a0a72c1cc9f130853c934cf3"},i("kbd",{key:"7eb4d95af6355ce397f7c5c178338122a6473616",class:{"sui-kbd":!0,["sm"===this.size?"sm":"md"]:!0,inverse:"inverse"===this.tone,quiet:this.quiet}},i("slot",{key:"301716f01a0b9d50a67371b5ec37be6e05a21334"})))}static get style(){return".sc-sui-kbd-h{display:inline-flex;vertical-align:middle;flex-shrink:0;font-family:var(--font-sans);user-select:none}.sui-kbd.sc-sui-kbd{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;font-family:var(--font-mono);font-weight:var(--w-semibold);font-feature-settings:'tnum';line-height:1;white-space:nowrap;color:var(--ink-muted);background:var(--surface-sunken);border:1px solid var(--border);border-bottom-color:var(--border-strong);border-radius:var(--radius-xs)}.sui-kbd.md.sc-sui-kbd{min-width:20px;height:20px;padding:0 6px;font-size:11px}.sui-kbd.sm.sc-sui-kbd{min-width:18px;height:18px;padding:0 5px;font-size:11px}.sui-kbd.quiet.sc-sui-kbd{color:var(--ink-muted);background:transparent;border-color:var(--border)}.sui-kbd.inverse.sc-sui-kbd{color:var(--ink-inverse-muted);background:var(--surface-navy-deep);border-color:var(--border-inverse)}.sui-kbd.inverse.quiet.sc-sui-kbd{color:var(--ink-inverse-faint);background:transparent}"}},[774,"sui-kbd",{size:[513],tone:[513],quiet:[516]}]),o=t,d=function(){"undefined"!=typeof customElements&&["sui-kbd"].forEach((e=>{"sui-kbd"===e&&(customElements.get(n(e))||customElements.define(n(e),t))}))};export{o as SuiKbd,d as defineCustomElement}

package/dist/components/sui-knob.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiKnob extends Components.SuiKnob, HTMLElement {}
+export const SuiKnob: {
+    prototype: SuiKnob;
+    new (): SuiKnob;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-knob.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as e,h as t,t as n}from"./p-CeVlau-G.js";import{d as o,F as r}from"./p-TBwsYzWO.js";import{i as a}from"./p-GAnFXayY.js";import{a as d}from"./p-BuyjS5bS.js";import{u as l}from"./p-U06fVoGD.js";import{i as c,d as u,s as h,r as b}from"./p-BHB1Wprj.js";import{b as g,c as f}from"./p-COO9uV7W.js";import{f as k}from"./p-CGWvlrv_.js";const m=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiInput=e(this,"suiInput",7),this.suiChange=e(this,"suiChange",7),this.internals=this.attachInternals()}get host(){return this}internals;label;help;error;required=!1;min=0;max=100;step=1;value=50;diameter=84;disabled=!1;readOnly=!1;format;name;suiInput;suiChange;dragging=!1;formDisabled=!1;fieldId=l("sui-knob");dial;drag;initial=50;async setFocus(){this.dial?.focus()}connectedCallback(){c(this.host,this.internals),u(this.host,(()=>this.dial))}componentWillLoad(){this.initial=this.value,this.syncForm()}disconnectedCallback(){this.stopDrag(!1)}componentDidRender(){this.syncForm()}syncForm(){h(this.internals,this.isDisabled?null:this.empty?"":this.num+""),b(this.internals,this.required&&!this.isDisabled&&!this.readOnly,this.empty,this.label,this.dial,this.error)}get empty(){const i=this.value;return null==i||""===i||Number.isNaN(Number(i))}get num(){return this.empty?this.min:Number(this.value)}componentDidLoad(){this.syncForm()}formResetCallback(){this.value=this.initial}formDisabledCallback(i){this.formDisabled=k(this.host,this.disabled,i),this.syncForm()}get isDisabled(){return this.disabled||this.formDisabled}get isInert(){return this.isDisabled||this.readOnly}fmt(i){return this.format?this.format(i):g(i)}snap(i){const s=this.step>0?this.step:1,e=((s+"").split(".")[1]||"").length;return f(Number((this.min+Math.round((i-this.min)/s)*s).toFixed(e)),this.min,this.max)}set(i){const s=this.snap(i);return s!==this.value&&(this.value=s,!0)}onMove=i=>{this.drag&&this.set(this.drag.v+(this.max-this.min)/150*(this.drag.y-i.clientY))&&this.suiInput.emit(this.num)};onUp=()=>this.stopDrag(!0);onDown=i=>{this.isInert||(i.preventDefault(),this.drag={y:i.clientY,v:this.num},this.dragging=!0,this.dial?.focus(),document.addEventListener("pointermove",this.onMove),document.addEventListener("pointerup",this.onUp),document.addEventListener("pointercancel",this.onUp))};stopDrag(i){"undefined"!=typeof document&&(document.removeEventListener("pointermove",this.onMove),document.removeEventListener("pointerup",this.onUp),document.removeEventListener("pointercancel",this.onUp)),this.drag&&(this.drag=void 0,this.dragging=!1,i&&this.suiChange.emit(this.num))}onKeyDown=i=>{if(this.isInert)return;const s=this.step>0?this.step:1,e=a(this.host);let t;switch("ArrowRight"===i.key?e?"ArrowLeft":"ArrowRight":"ArrowLeft"===i.key?e?"ArrowRight":"ArrowLeft":i.key){case"ArrowUp":case"ArrowRight":t=this.num+s;break;case"ArrowDown":case"ArrowLeft":t=this.num-s;break;case"PageUp":t=this.num+10*s;break;case"PageDown":t=this.num-10*s;break;case"Home":t=this.min;break;case"End":t=this.max;break;default:return}i.preventDefault(),this.set(t)&&(this.suiInput.emit(this.num),this.suiChange.emit(this.num))};render(){const i=this.max-this.min,s=this.empty,e=270*(i>0?f((this.num-this.min)/i,0,1):0),n=Math.max(0,this.diameter);return t(r,{key:"15234d94a00fa6742ef5a5295540fd116b84381f",help:this.help,error:this.error,descId:this.fieldId},t("div",{key:"0786926eb0b9015c6cd3b28bc711170cfc34306c",class:{"sui-knob":!0,disabled:this.isDisabled,"read-only":this.readOnly,invalid:!!this.error,dragging:this.dragging,empty:s}},t("div",{key:"35a4fd0827707677af507a57bf10824d6a3f25d7",ref:i=>this.dial=i,class:"dial",role:"slider",tabIndex:this.isDisabled?-1:0,"aria-label":this.label||void 0,"aria-valuenow":this.num,"aria-valuemin":this.min,"aria-valuemax":this.max,"aria-valuetext":s?d(void 0,"knob.noValue",void 0,"No value"):this.fmt(this.num),"aria-orientation":"vertical","aria-disabled":this.isDisabled?"true":null,"aria-readonly":this.readOnly?"true":null,"aria-invalid":this.error?"true":null,"aria-describedby":o(this.fieldId,this.help,this.error),style:{width:n+"px",height:n+"px","--sui-knob-deg":e+"deg"},onPointerDown:this.onDown,onKeyDown:this.onKeyDown},t("div",{key:"a5e96f5da9888ecab99d7282f0a33b48071b9505",class:"face",style:{width:Math.max(0,n-22)+"px",height:Math.max(0,n-22)+"px",fontSize:n/4.4+"px"}},s?null:t("span",{class:"figure"},this.fmt(this.num)))),this.label?t("span",{class:"label"},this.label,this.required?t("span",{class:"sui-field-req","aria-hidden":"true"},"*"):null):null))}static get formAssociated(){return!0}static get watchers(){return{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],label:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}]}}static get style(){return".sc-sui-knob-h{display:inline-block;font-family:var(--font-sans)}.sui-field.sc-sui-knob{align-items:center}.sui-knob.sc-sui-knob{display:inline-flex;flex-direction:column;align-items:center;gap:8px}.dial.sc-sui-knob{--sui-knob-deg:0deg;display:flex;align-items:center;justify-content:center;border-radius:50%;background:conic-gradient(from 225deg, var(--brand) 0deg var(--sui-knob-deg), var(--brand-soft) var(--sui-knob-deg) 270deg, transparent 270deg 360deg);cursor:ns-resize;user-select:none;touch-action:none}.sui-knob.sc-sui-knob:not(.disabled):not(.read-only) .dial.sc-sui-knob:hover:not(:focus-visible){box-shadow:0 0 0 6px var(--surface-hover)}.sui-knob.dragging.sc-sui-knob:not(.disabled):not(.read-only) .dial.sc-sui-knob:not(:focus-visible),.sui-knob.sc-sui-knob:not(.disabled):not(.read-only) .dial.sc-sui-knob:active:not(:focus-visible){box-shadow:0 0 0 6px var(--surface-pressed)}.dial.sc-sui-knob:focus{outline:none}.dial.sc-sui-knob:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px;box-shadow:var(--focus-shadow)}.invalid.sc-sui-knob:not(.disabled) .dial.sc-sui-knob{background:conic-gradient(from 225deg, var(--danger) 0deg var(--sui-knob-deg), var(--danger-soft) var(--sui-knob-deg) 270deg, transparent 270deg 360deg)}.invalid.sc-sui-knob .dial.sc-sui-knob:focus-visible{outline-color:var(--danger);box-shadow:0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent)}.disabled.sc-sui-knob .dial.sc-sui-knob,.read-only.sc-sui-knob .dial.sc-sui-knob{cursor:default}.disabled.sc-sui-knob .dial.sc-sui-knob{background:conic-gradient(from 225deg, var(--border-strong) 0deg var(--sui-knob-deg), var(--brand-soft) var(--sui-knob-deg) 270deg, transparent 270deg 360deg)}.face.sc-sui-knob{display:flex;align-items:center;justify-content:center;box-sizing:border-box;border-radius:50%;background:var(--surface);border:1px solid var(--hairline);font-family:var(--font-sans);font-weight:730;font-feature-settings:'tnum';color:var(--ink);line-height:1}.disabled.sc-sui-knob .face.sc-sui-knob{color:var(--disabled-ink)}.figure.sc-sui-knob{direction:ltr;unicode-bidi:plaintext}.label.sc-sui-knob{font-size:12px;font-weight:620;color:var(--ink-muted)}@media (forced-colors: active){.dial.sc-sui-knob,.invalid.sc-sui-knob:not(.disabled) .dial.sc-sui-knob{forced-color-adjust:none;background:conic-gradient(from 225deg, Highlight 0deg var(--sui-knob-deg), CanvasText var(--sui-knob-deg) 270deg, transparent 270deg 360deg)}.dial.sc-sui-knob:focus-visible{outline-color:Highlight;box-shadow:none}.face.sc-sui-knob{forced-color-adjust:auto}.disabled.sc-sui-knob .dial.sc-sui-knob{background:conic-gradient(from 225deg, GrayText 0deg var(--sui-knob-deg), Canvas var(--sui-knob-deg) 270deg, transparent 270deg 360deg)}.disabled.sc-sui-knob .face.sc-sui-knob{border-color:GrayText;color:GrayText}.disabled.sc-sui-knob .label.sc-sui-knob{color:GrayText}}.sui-field.sc-sui-knob{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-knob{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-knob .sui-field-label.sc-sui-knob{color:var(--danger)}.sui-field-req.sc-sui-knob{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-knob{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-knob{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-knob .sui-glyph.sc-sui-knob{font-size:11px}"}},[578,"sui-knob",{label:[1],help:[1],error:[1],required:[516],min:[2],max:[2],step:[2],value:[1026],diameter:[2],disabled:[516],readOnly:[516,"readonly"],format:[16],name:[513],dragging:[32],formDisabled:[32],setFocus:[64]},void 0,{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],label:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}]}]),p=m,v=function(){"undefined"!=typeof customElements&&["sui-knob"].forEach((i=>{"sui-knob"===i&&(customElements.get(n(i))||customElements.define(n(i),m))}))};export{p as SuiKnob,v as defineCustomElement}

package/dist/components/sui-list.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiList extends Components.SuiList, HTMLElement {}
+export const SuiList: {
+    prototype: SuiList;
+    new (): SuiList;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-list.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as t,h as e,a as o,t as r}from"./p-CeVlau-G.js";import{a,L as l}from"./p-C0MrkGLb.js";import{G as n,z as u}from"./p-DdsE4HI6.js";import{c,m as d}from"./p-q0JbXN8q.js";import{i as p}from"./p-Cs2X0Kih.js";import{a as h}from"./p-BuyjS5bS.js";import{u as f}from"./p-U06fVoGD.js";import{d as v}from"./p-BHB1Wprj.js";import{d as g}from"./p-D7L5Nhsy.js";import{d as m}from"./p-Ds9HpZbg.js";const x=Symbol("threw"),b=i=>!!i&&"string"==typeof i.section&&void 0===i.id,w=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiItemPick=t(this,"suiItemPick",7),this.suiSelectionChange=t(this,"suiSelectionChange",3)}get host(){return this}items=[];selection;density="standard";wrap=!1;loading=!1;filter=!1;filterPlaceholder;emptyMessage;emptyFilterMessage;maxHeight;itemRender;suiItemPick;suiSelectionChange;focusIdx=-1;query="";hostLabel;fieldId=f("sui-list");list;searchInput;stopAria;typeahead="";typeaheadTimer;connectedCallback(){v(this.host,(()=>this.focusTarget())),this.stopAria?.(),this.stopAria=p(this.host,(i=>{this.hostLabel=i}))}disconnectedCallback(){this.stopAria?.(),clearTimeout(this.typeaheadTimer),this.typeahead=""}onItems(){this.focusIdx=-1}async setFocus(){const i=this.rows(),s=this.tabStop(i);s>=0?this.focusRow(s):this.searchInput?.focus()}focusTarget(){const i=this.tabStop(this.rows());return(i>=0?this.rowEl(i):null)||this.searchInput||void 0}isSelected(i){return null!=this.selection&&i.id+""==this.selection+""}rowMatches(i,s){return!s||[i.title,i.description,i.meta].some((i=>!!i&&i.toLowerCase().includes(s)))}rows(){const i=this.filter?this.query.trim().toLowerCase():"",s=[];return(this.items||[]).forEach((t=>{!b(t)&&t&&this.rowMatches(t,i)&&s.push({item:t,i:s.length})})),s}runs(i){const s=new Map;i.forEach((i=>s.set(i.item,i)));const t=[];let e=null;return(this.items||[]).forEach((i=>{if(!i)return;if(b(i))return e={section:i.section,rows:[]},void t.push(e);const o=s.get(i);o&&(e||(e={rows:[]},t.push(e)),e.rows.push(o))})),t.filter((i=>i.rows.length))}tabStop(i){if((s=>s>=0&&s<i.length&&!i[s].item.disabled)(this.focusIdx))return this.focusIdx;const s=i.findIndex((i=>this.isSelected(i.item)&&!i.item.disabled));return s>=0?s:i.findIndex((i=>!i.item.disabled))}rowEl(i){return this.list?this.list.querySelector(`[data-index="${i}"]`):null}focusRow(i){const s=this.rowEl(i);s&&(this.focusIdx=i,s.focus())}step(i,s,t){let e=s;for(;;){if(e+=t,e<0||e>=i.length)return s;if(!i[e].item.disabled)return e}}edge(i,s){if(s>0)return i.findIndex((i=>!i.item.disabled));for(let s=i.length-1;s>=0;s--)if(!i[s].item.disabled)return s;return-1}onTypeahead(i,s,t){clearTimeout(this.typeaheadTimer),this.typeahead+=t.toLowerCase(),this.typeaheadTimer=setTimeout((()=>this.typeahead=""),500);for(let t=1;t<=i.length;t++){const e=(s+t)%i.length,o=i[e];if(!o.item.disabled&&o.item.title.toLowerCase().startsWith(this.typeahead))return void this.focusRow(e)}}isCommand(i){return!!i.command&&!i.href}pick(i){i.disabled||(this.isCommand(i)||this.isSelected(i)||(this.selection=i.id,this.suiSelectionChange.emit(i.id)),this.suiItemPick.emit({id:i.id,item:i}))}onRowKey=(i,s,t)=>{const e="A"===i.currentTarget.tagName;switch(i.key){case"ArrowDown":return i.preventDefault(),void this.focusRow(this.step(t,s.i,1));case"ArrowUp":return i.preventDefault(),void this.focusRow(this.step(t,s.i,-1));case"Home":return i.preventDefault(),void this.focusRow(this.edge(t,1));case"End":return i.preventDefault(),void this.focusRow(this.edge(t,-1));case"Enter":if(e)return;return i.preventDefault(),void this.pick(s.item);case" ":return i.preventDefault(),void(e?i.currentTarget.click():this.pick(s.item));default:1!==i.key.length||i.ctrlKey||i.metaKey||i.altKey||this.onTypeahead(t,s.i,i.key)}};onSearchKey=(i,s)=>{if("ArrowDown"!==i.key)return;i.preventDefault();const t=this.tabStop(s);t>=0&&this.focusRow(t)};onSearchInput=i=>{this.query=i.target.value,this.focusIdx=-1};marker(i){return i.avatar||i.initials?e("sui-avatar",{class:"sui-list-avatar",src:i.avatar,initials:i.initials,size:"sm","aria-hidden":"true",badge:i.badge,badgeTone:i.badgeTone}):e(l,{severity:i.severity,icon:i.icon})}renderRow(i,s,t,o){const r=i.item,l=this.isSelected(r),n=!!r.href&&!r.disabled,u=this.itemRender?c(this.itemRender,[r],x):x,p=u!==x,f={row:!0,selected:l,unread:!!r.unread,disabled:!!r.disabled,custom:p},v=p?e("span",{class:"body",ref:i=>d(i,u)}):e(a,{marker:this.marker(r),title:r.title,description:r.description,meta:r.meta,unread:!!r.unread,unreadLabel:h(void 0,"list.unread",void 0,"Unread")}),g={id:`${this.fieldId}-${i.i}`,"data-index":i.i,"data-id":r.id+"",tabIndex:r.disabled?-1:i.i===t?0:-1,onFocus:()=>{this.focusIdx=i.i},onClick:i=>{r.disabled?i.preventDefault():this.pick(r)},onKeyDown:t=>this.onRowKey(t,i,s)};return o?e("div",{key:r.id+"",role:"listitem",class:"item"},e(n?"a":"button",{class:f,type:n?void 0:"button",role:!n&&this.isCommand(r)?"link":void 0,href:n?r.href:void 0,target:n?r.target:void 0,rel:n&&"_blank"===r.target?"noopener":void 0,disabled:!(n||!r.disabled)||void 0,"aria-disabled":n&&r.disabled?"true":null,"aria-current":l?"page":null,...g},v)):e("div",{key:r.id+"",class:f,role:"option","aria-selected":l?"true":"false","aria-disabled":r.disabled?"true":null,...g},v)}renderSkeleton(){return e("div",{class:"skeleton","aria-hidden":"true"},[0,1,2,3].map((i=>e("div",{class:"row skel",key:"sk"+i},e("sui-skeleton",{shape:"circle",width:"26"}),e("span",{class:"text"},e("sui-skeleton",{shape:"title",width:58-9*i+"%",height:"12"}),e("sui-skeleton",{width:84-7*i+"%",height:"10"}))))))}render(){const i=this.rows(),s=this.tabStop(i),t=i.some((i=>(!!i.item.href||this.isCommand(i.item))&&!i.item.disabled)),r=this.runs(i),a=this.query.trim(),l=!this.loading&&0===i.length,c=a?h(void 0,"list.emptyFilter",this.emptyFilterMessage,"No matches."):h(void 0,"list.empty",this.emptyMessage,"Nothing here yet."),d=i=>`${this.fieldId}-h${i}`;return e(o,{key:"70d001ab31324bcafe1bc7ae551109fc98f4db6b","aria-busy":this.loading?"true":null},this.filter?e("div",{class:"sui-popup-search search"},e("div",{class:"sui-popup-search-box sui-frame"},e(n,{glyph:u}),e("input",{ref:i=>this.searchInput=i,type:"text",placeholder:h(void 0,"list.search",this.filterPlaceholder,"Search"),"aria-label":h(void 0,"list.searchRows",void 0,"Search the list"),"aria-controls":this.fieldId,value:this.query,onInput:this.onSearchInput,onKeyDown:s=>this.onSearchKey(s,i)}))):null,e("div",{key:"0b0c3d3455a0ff0973d375d6159993c7f31d615b",class:"scroll",style:this.maxHeight?{maxHeight:this.maxHeight+"px"}:void 0},this.loading?this.renderSkeleton():null,this.loading?null:e("div",{id:this.fieldId,ref:i=>this.list=i,class:"list",role:t?void 0:"listbox","aria-label":t?void 0:this.hostLabel},r.map(t?(t,o)=>[t.section?e("div",{class:"section",id:d(o)},t.section):null,e("div",{role:"list","aria-labelledby":t.section?d(o):void 0,"aria-label":t.section?void 0:this.hostLabel},t.rows.map((t=>this.renderRow(t,i,s,!0))))]:(t,o)=>t.section?e("div",{role:"group","aria-labelledby":d(o)},e("div",{class:"section",id:d(o),role:"presentation"},t.section),t.rows.map((t=>this.renderRow(t,i,s,!1)))):t.rows.map((t=>this.renderRow(t,i,s,!1))))),l?e("div",{class:"empty",role:"status"},a?c:e("slot",{name:"empty"},c)):null))}static get watchers(){return{items:[{onItems:0}]}}static get style(){return".sc-sui-list-h{display:block;min-width:0;max-width:100%;box-sizing:border-box;font-family:var(--font-sans);color:var(--ink);overflow-x:hidden}.search.sc-sui-list{padding:8px 8px 6px;margin-bottom:0}.scroll.sc-sui-list{overflow-x:hidden}.scroll[style].sc-sui-list{overflow-y:auto}.list.sc-sui-list{display:block;min-width:0}.item.sc-sui-list{display:block;min-width:0}.section.sc-sui-list{padding:10px 14px 4px;font-size:10.5px;font-weight:650;letter-spacing:0.09em;text-transform:uppercase;color:var(--ink-faint);user-select:none}[density='compact'].sc-sui-list-h .section.sc-sui-list{padding:7px 12px 3px}.row.sc-sui-list{position:relative;display:flex;align-items:flex-start;gap:10px;width:100%;min-width:0;box-sizing:border-box;margin:0;padding:10px var(--sui-inset-x, 14px);border:0;border-bottom:1px solid var(--hairline);background:transparent;color:var(--ink);text-align:start;text-decoration:none;font-family:var(--font-sans);cursor:pointer;user-select:none;outline:none;transition:background var(--duration-fast) var(--ease-out)}.row.sc-sui-list::before{content:'';position:absolute;inset-inline-start:0;top:0;bottom:0;width:3px;background:transparent;transition:background var(--duration-fast) var(--ease-out)}.list.sc-sui-list>.row.sc-sui-list:last-child,.list.sc-sui-list>[role='group'].sc-sui-list:last-child>.row.sc-sui-list:last-child,.list.sc-sui-list>[role='list'].sc-sui-list:last-child>.item.sc-sui-list:last-child>.row.sc-sui-list{border-bottom-color:transparent}a.row.sc-sui-list,a.row.sc-sui-list:hover,a.row.sc-sui-list:visited{color:var(--ink);text-decoration:none}.row.unread.sc-sui-list{background:var(--surface-sunken)}.row.sc-sui-list:hover{--ink-faint:var(--ink-muted);background:var(--surface-hover)}.row.selected.sc-sui-list{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--surface-selected)}.row.selected.sc-sui-list:hover{--ink-muted:var(--ink);--ink-faint:var(--ink);background:linear-gradient(var(--surface-hover) 0 0) var(--surface-selected)}.row.selected.sc-sui-list::before{background:var(--accent)}.row.selected.sc-sui-list .title.sc-sui-list,a.row.selected.sc-sui-list,a.row.selected.sc-sui-list:hover{color:var(--ink)}.row.selected.sc-sui-list .detail.sc-sui-list,.row.selected.sc-sui-list .meta.sc-sui-list{color:var(--ink-muted)}.row.disabled.sc-sui-list,.row.sc-sui-list:disabled{--ink-muted:var(--ink-placeholder);--ink-faint:var(--ink-placeholder);color:var(--disabled-ink);cursor:not-allowed;background:transparent}.row.disabled.sc-sui-list .title.sc-sui-list,.row.disabled.sc-sui-list .detail.sc-sui-list,.row.disabled.sc-sui-list .meta.sc-sui-list,.row.sc-sui-list:disabled .title.sc-sui-list,.row.sc-sui-list:disabled .detail.sc-sui-list,.row.sc-sui-list:disabled .meta.sc-sui-list{color:var(--disabled-ink)}.row.disabled.sc-sui-list .sev.sc-sui-list,.row.sc-sui-list:disabled .sev.sc-sui-list{background:var(--disabled-bg);color:var(--disabled-ink)}.row.sc-sui-list:focus-visible{outline:2px solid var(--focus-ring);outline-offset:-2px;z-index:1}.row.sc-sui-list:focus-visible::before{inset-block:2px 1px;inset-inline-start:2px}.row.custom.sc-sui-list{display:block}.body.sc-sui-list{display:block;min-width:0}[density='compact'].sc-sui-list-h .row.sc-sui-list{padding-block:6px;padding-inline:calc(var(--sui-inset-x, 14px) - 2px) var(--sui-inset-x, 12px);gap:8px}[density='compact'].sc-sui-list-h .sev.sc-sui-list{width:22px;height:22px;margin-top:0;margin-inline:2px}[density='compact'].sc-sui-list-h .sev.sc-sui-list i.sc-sui-list,[density='compact'].sc-sui-list-h .sev.sc-sui-list .sui-glyph.sc-sui-list{font-size:10px}[density='compact'].sc-sui-list-h .title.sc-sui-list{font-size:12px}[density='compact'].sc-sui-list-h .detail.sc-sui-list{font-size:11px;margin-top:0}[density='comfortable'].sc-sui-list-h .row.sc-sui-list{padding-block:14px}[density='comfortable'].sc-sui-list-h .section.sc-sui-list{padding-top:14px}.title.sc-sui-list,.detail.sc-sui-list{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title.sc-sui-list{display:block;flex:1;min-width:0}[wrap].sc-sui-list-h .title.sc-sui-list,[wrap].sc-sui-list-h .detail.sc-sui-list{white-space:normal;overflow-wrap:anywhere;overflow:visible;text-overflow:clip}[wrap].sc-sui-list-h .title-row.sc-sui-list{align-items:baseline}.empty.sc-sui-list{padding:26px 16px;text-align:center;font-size:12.5px;color:var(--ink-muted)}.skeleton.sc-sui-list{display:block}.row.skel.sc-sui-list{cursor:default;pointer-events:none}.row.skel.sc-sui-list .text.sc-sui-list{display:flex;flex-direction:column;gap:7px;padding-top:3px}@media (forced-colors: active){.list.sc-sui-list>.row.sc-sui-list:last-child,.list.sc-sui-list>[role='group'].sc-sui-list:last-child>.row.sc-sui-list:last-child,.list.sc-sui-list>[role='list'].sc-sui-list:last-child>.item.sc-sui-list:last-child>.row.sc-sui-list{border-bottom-color:Canvas}.row.selected.sc-sui-list::before{background:Highlight}.row.disabled.sc-sui-list{color:GrayText}.row.disabled.sc-sui-list .title.sc-sui-list,.row.disabled.sc-sui-list .detail.sc-sui-list,.row.disabled.sc-sui-list .meta.sc-sui-list{color:GrayText}.row.disabled.sc-sui-list .sev.sc-sui-list{border-color:GrayText;color:GrayText}}.sui-frame.sc-sui-list{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-list:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-list,.sui-frame.readonly.sc-sui-list{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-list:focus-within,.sui-frame.focus.sc-sui-list,.sui-frame.open.sc-sui-list{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-list{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-list:focus-within,.sui-frame.invalid.focus.sc-sui-list,.sui-frame.invalid.open.sc-sui-list{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-list:disabled,.sui-frame.disabled.sc-sui-list{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-list{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-list::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-list{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-list{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-list{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-list:focus-within,.sui-frame.focus.sc-sui-list,.sui-frame.open.sc-sui-list{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-list:disabled,.sui-frame.disabled.sc-sui-list{color:GrayText;border-color:GrayText}}.sev.sc-sui-list{width:26px;height:26px;border-radius:50%;flex-shrink:0;margin-top:1px;display:inline-flex;align-items:center;justify-content:center}.sev.sc-sui-list i.sc-sui-list,.sev.sc-sui-list .sui-glyph.sc-sui-list{font-size:11px}.sev.positive.sc-sui-list{background:var(--status-positive-bg);color:var(--status-positive-ink)}.sev.attention.sc-sui-list{background:var(--status-attention-bg);color:var(--status-attention-ink)}.sev.critical.sc-sui-list{background:var(--danger-soft);color:var(--danger)}.sev.info.sc-sui-list{background:var(--surface-sunken);color:var(--ink-muted)}.sev.neutral.sc-sui-list{background:var(--status-neutral-bg);color:var(--status-neutral-ink)}.sev.icon.sc-sui-list{background:var(--surface-sunken);color:var(--ink-muted)}.sui-list-avatar.sc-sui-list{flex-shrink:0;margin-top:1px}.text.sc-sui-list{flex:1;min-width:0}.title-row.sc-sui-list{display:flex;align-items:center;gap:6px;min-width:0}.title.sc-sui-list{font-size:12.5px;font-weight:620;min-width:0}.unread.sc-sui-list .title.sc-sui-list{font-weight:700}.dot.sc-sui-list{width:6px;height:6px;border-radius:50%;background:var(--accent);flex-shrink:0;margin-inline-start:auto}.meta.sc-sui-list{flex-shrink:0;margin-inline-start:auto;font-size:11px;color:var(--ink-muted);font-feature-settings:'tnum';white-space:nowrap}.dot.sc-sui-list+.sr-only.sc-sui-list+.meta.sc-sui-list,.dot.sc-sui-list+.meta.sc-sui-list{margin-inline-start:0}.detail.sc-sui-list{display:block;font-size:11.5px;color:var(--ink-muted);line-height:1.45;margin-top:1px}.time.sc-sui-list{display:block;font-size:10.5px;color:var(--ink-faint);margin-top:3px;font-feature-settings:'tnum'}.sr-only.sc-sui-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}@media (forced-colors: active){.sev.sc-sui-list{box-sizing:border-box;border:1px solid CanvasText}.dot.sc-sui-list{background:CanvasText}}.sui-popup-trigger.sc-sui-list{box-sizing:border-box;width:100%;height:var(--sui-field-height, var(--control-md));display:flex;align-items:center;gap:8px;padding-block:0;padding-inline:12px 10px;color:var(--ink);font-size:13px;font-family:var(--font-sans);font-weight:460;cursor:pointer;user-select:none;text-align:start}.sui-popup-trigger.sc-sui-list:disabled,.sui-popup-trigger.disabled.sc-sui-list{cursor:not-allowed}.sui-popup-trigger.sc-sui-list .val.sc-sui-list{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-popup-trigger.placeholder.sc-sui-list .val.sc-sui-list{color:var(--ink-placeholder)}.sui-popup-trigger.sc-sui-list .clear.sc-sui-list{display:inline-flex;padding:2px;color:var(--ink-faint);font-size:11px;cursor:pointer;border-radius:4px}.sui-popup-trigger.sc-sui-list .clear.sc-sui-list:hover{color:var(--ink)}.sui-popup-trigger.sc-sui-list .chev.sc-sui-list{display:var(--sui-field-chevron, inline-block);font-size:10px;color:var(--ink-faint);transition:transform var(--duration-fast) var(--ease-out)}.sui-popup-trigger.open.sc-sui-list .chev.sc-sui-list{transform:rotate(180deg)}.sui-popup-trigger.readonly.sc-sui-list .chev.sc-sui-list{opacity:0.4}.sui-popup-trigger.sc-sui-list .spin.sc-sui-list{font-size:11px;color:var(--ink-faint)}.sui-popup-trigger.sm.sc-sui-list{height:var(--sui-field-height, var(--control-sm));font-size:12.5px}.sui-popup-trigger.md.sc-sui-list{height:var(--sui-field-height, var(--control-md));font-size:13px}.sui-popup-trigger.lg.sc-sui-list{height:var(--sui-field-height, var(--control-lg));font-size:14px}.sui-popup-panel.sc-sui-list{position:fixed;z-index:var(--z-dropdown);box-sizing:border-box;min-width:100%;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);padding:5px;max-height:260px;overflow-y:auto;animation:sui-popup-in var(--duration-overlay) var(--ease-out)}.sui-popup-panel[data-side='top'].sc-sui-list{animation-name:sui-popup-in-top}.sui-popup-panel.closing.sc-sui-list{animation:sui-popup-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-popup-in{from{opacity:0;transform:translateY(-4px)}}@keyframes sui-popup-in-top{from{opacity:0;transform:translateY(4px)}}@keyframes sui-popup-out{to{opacity:0}}.sui-popup-search.sc-sui-list{padding:3px 3px 7px;border-bottom:1px solid var(--hairline);margin-bottom:4px}.sui-popup-search-box.sc-sui-list{display:flex;align-items:center;gap:7px;height:30px;padding:0 9px}.sui-popup-search-box.sc-sui-list .sui-glyph.sc-sui-list{font-size:11px;color:var(--ink-faint)}.sui-popup-search-box.sc-sui-list input.sc-sui-list{flex:1;min-width:0;border:none;outline:none;background:transparent;font:460 12.5px var(--font-sans);color:var(--ink)}.sui-popup-empty.sc-sui-list{padding:10px;font-size:12.5px;color:var(--ink-faint)}.sui-popup-group.sc-sui-list{padding:8px 10px 4px;font-size:10.5px;font-weight:650;letter-spacing:0.09em;text-transform:uppercase;color:var(--ink-faint);user-select:none}.sui-popup-status.sc-sui-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.sui-popup-loading.sc-sui-list{display:flex;align-items:center;gap:8px;padding:10px;font-size:12.5px;color:var(--ink-faint)}.sui-popup-loading.sc-sui-list .sui-glyph.sc-sui-list{font-size:11px;color:var(--brand)}.sui-popup-spin.sc-sui-list{animation:sb-spin 0.8s linear infinite}@media (prefers-reduced-motion: reduce){.sui-popup-spin.sc-sui-list{animation-duration:2s}}.sui-popup-spacer.sc-sui-list{flex:none;pointer-events:none}.sui-popup-option.sc-sui-list{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;font-size:13px;font-weight:460;color:var(--ink);cursor:pointer;background:transparent}.sui-popup-option-label.sc-sui-list{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-popup-option.hover.sc-sui-list{--ink-faint:var(--ink-muted);background:var(--surface-hover)}.sui-popup-option.selected.sc-sui-list{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--surface-selected);font-weight:650}.sui-popup-option.selected.hover.sc-sui-list{--ink-muted:var(--ink);--ink-faint:var(--ink);background:linear-gradient(var(--surface-hover) 0 0) var(--surface-selected)}.sui-popup-option.keynav.sc-sui-list{outline:2px solid var(--focus-ring);outline-offset:-2px}.sui-popup-option.disabled.sc-sui-list{--ink-muted:var(--ink-placeholder);--ink-faint:var(--ink-placeholder);color:var(--disabled-ink);cursor:not-allowed}.sui-popup-option.sc-sui-list .sui-glyph.sc-sui-list{font-size:11px;color:var(--brand-soft-ink)}@media (forced-colors: active){.sui-popup-trigger.placeholder.sc-sui-list .val.sc-sui-list{color:GrayText}.sui-popup-option.hover.sc-sui-list{outline:2px solid CanvasText;outline-offset:-2px}.sui-popup-option.selected.sc-sui-list{forced-color-adjust:none;background:Highlight;color:HighlightText}.sui-popup-option.selected.sc-sui-list .sui-glyph.sc-sui-list{color:HighlightText}.sui-popup-option.disabled.sc-sui-list{color:GrayText}}"}},[774,"sui-list",{items:[16],selection:[1032],density:[513],wrap:[516],loading:[516],filter:[516],filterPlaceholder:[1,"filter-placeholder"],emptyMessage:[1,"empty-message"],emptyFilterMessage:[1,"empty-filter-message"],maxHeight:[2,"max-height"],itemRender:[16],focusIdx:[32],query:[32],hostLabel:[32],setFocus:[64]},void 0,{items:[{onItems:0}]}]),k=w,y=function(){"undefined"!=typeof customElements&&["sui-list","sui-avatar","sui-skeleton"].forEach((i=>{switch(i){case"sui-list":customElements.get(r(i))||customElements.define(r(i),w);break;case"sui-avatar":customElements.get(r(i))||g();break;case"sui-skeleton":customElements.get(r(i))||m()}}))};export{k as SuiList,y as defineCustomElement}

package/dist/components/sui-listbox.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiListbox extends Components.SuiListbox, HTMLElement {}
+export const SuiListbox: {
+    prototype: SuiListbox;
+    new (): SuiListbox;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/sui-listbox.js

@@ -0,0 +1 @@
+import{p as i,H as s,c as o,f as t,h as e,t as r}from"./p-CeVlau-G.js";import{d as a,F as l}from"./p-TBwsYzWO.js";import{p as n,P as u,a as p}from"./p-D0KZcTn9.js";import{G as d,k as c,z as h}from"./p-DdsE4HI6.js";import{u as x}from"./p-U06fVoGD.js";import{i as b,d as f,s as v,r as m}from"./p-BHB1Wprj.js";import{f as g}from"./p-CGWvlrv_.js";import{m as y}from"./p-BE4gZZNA.js";import{o as k,f as w,l as z,n as F,h as T,s as j,k as C}from"./p-M0fYQCIv.js";import{S as A,r as S,v as D,s as I}from"./p-Btp15dVO.js";import{a as O}from"./p-BuyjS5bS.js";import{d as q,p as G}from"./p-Bt5Kx3zM.js";const H=i(class extends s{constructor(i){super(),!1!==i&&this.__registerHost(),this.suiChange=o(this,"suiChange",7),this.internals=this.attachInternals()}get host(){return this}internals;label;help;error;options=[];value;multiple=!1;filter=!1;emptyMessage;emptyFilterMessage;loading=!1;loadingMessage;disabled=!1;readOnly=!1;invalid=!1;height=220;virtualScrollThreshold=200;required=!1;name;suiChange;query="";hoverIdx=-1;keyNav=!1;pointerAt="";onKeyNav(i){q(i)&&(this.keyNav=!0)}onPointerNav(i){const s=G(i);s!==this.pointerAt&&(this.pointerAt=s,this.keyNav=!1)}onPointerPress(){this.keyNav=!1}boxScrollTop=0;formDisabled=!1;get isDisabled(){return this.disabled||this.formDisabled}fieldId=x("sui-listbox");list;box;filterInput;typeahead="";typeaheadTimer;scrollFrame;initial;metrics=new A;windowed=!1;connectedCallback(){b(this.host,this.internals),f(this.host,(()=>this.filterInput||this.list))}componentWillLoad(){this.initial=Array.isArray(this.value)?[...this.value]:this.value,this.syncForm()}disconnectedCallback(){clearTimeout(this.typeaheadTimer),this.typeahead="",null!=this.scrollFrame&&"undefined"!=typeof cancelAnimationFrame&&cancelAnimationFrame(this.scrollFrame),this.scrollFrame=void 0}syncForm(){const i=this.selected();let s;s=this.isDisabled?null:this.multiple?y(this.name,i)??(i.length?i.join(","):null):i.length?C(i[0]):"",v(this.internals,s),m(this.internals,this.required&&!this.isDisabled&&!this.readOnly,0===i.length,this.label,this.list,this.error)}componentDidLoad(){this.syncForm()}componentDidRender(){this.syncForm(),this.remeasure()}remeasure(){if(!this.box)return;const i=this.box.querySelector('.sui-popup-spacer[data-edge="top"]');if(!i)return;let s=this.metrics.measure(this.box,this.box.querySelector(".sui-popup-option"),i);s=this.metrics.measureGroup(this.box.querySelector(".sui-popup-group"))||s,s&&t(this)}onBoxScroll=i=>{this.windowed&&(this.boxScrollTop=i.target.scrollTop||0)};resetScroll(){this.boxScrollTop=0,this.box&&(this.box.scrollTop=0)}windowFor(i,s){const o=this.virtualScrollThreshold;return!(o>0)||s<o?null:S(D(i),this.metrics.at(this.boxScrollTop))}scrollIndexIntoView(i){if(!this.windowed||!this.box||i<0)return;const s=D(k(this.visible())),o=I(s,this.metrics.at(this.boxScrollTop),i,this.metrics.rowsTop);null!=o&&(this.box.scrollTop=o,this.boxScrollTop=this.box.scrollTop)}onOptions(){this.hoverIdx>=this.visible().length&&(this.hoverIdx=-1)}formResetCallback(){this.value=Array.isArray(this.initial)?[...this.initial]:this.initial}formDisabledCallback(i){this.formDisabled=g(this.host,this.disabled,i),this.syncForm()}async setFocus(){(this.filterInput||this.list)?.focus()}normCache;norm(){return this.normCache&&this.normCache.src===this.options||(this.normCache={src:this.options,out:w(z(this.options,this.host,"options"))}),this.normCache.out}visible(){if(this.loading)return[];const i=this.query.trim().toLowerCase();return i?this.norm().filter((s=>s.label.toLowerCase().includes(i))):this.norm()}selected(){return Array.isArray(this.value)?this.value:F(this.value)?[]:[this.value]}isSel(i){return T(this.selected(),i)}pick(i){if(!(this.isDisabled||this.readOnly||i.disabled))if(this.multiple){const s=this.selected(),o=T(s,i.value)?s.filter((s=>!j(s,i.value))):s.concat(i.value);this.value=o,this.suiChange.emit(o)}else{if(j(this.value,i.value))return;this.value=i.value,this.suiChange.emit(i.value)}}setHover(i){this.hoverIdx=i,this.scrollHoverIntoView()}move(i){const s=this.visible();if(!s.length)return;let o=this.hoverIdx<0&&-1===i?0:this.hoverIdx;for(let t=0;t<s.length&&(o=(o+i+s.length)%s.length,s[o].disabled);t++);this.setHover(o)}scrollHoverIntoView(){"undefined"!=typeof requestAnimationFrame&&(null!=this.scrollFrame&&cancelAnimationFrame(this.scrollFrame),this.scrollFrame=requestAnimationFrame((()=>{this.scrollFrame=void 0;const i=this.list?.querySelector('[role="option"].hover');i?i.scrollIntoView?.({block:"nearest"}):this.scrollIndexIntoView(this.hoverIdx)})))}onTypeahead(i){clearTimeout(this.typeaheadTimer),this.typeahead+=i.toLowerCase(),this.typeaheadTimer=setTimeout((()=>this.typeahead=""),500);const s=this.visible(),o=this.hoverIdx+1;for(let i=0;i<s.length;i++){const t=(o+i)%s.length;if(!s[t].disabled&&s[t].label.toLowerCase().startsWith(this.typeahead))return void this.setHover(t)}}onKeyDown=i=>{if(this.isDisabled)return;const s=this.visible(),o=!!this.filterInput&&i.target===this.filterInput;switch(i.key){case"ArrowDown":return i.preventDefault(),void this.move(1);case"ArrowUp":return i.preventDefault(),void this.move(-1);case"Home":if(o)return;return i.preventDefault(),void this.setHover(s.findIndex((i=>!i.disabled)));case"End":{if(o)return;i.preventDefault();let t=s.length-1;for(;t>0&&s[t].disabled;)t--;return void this.setHover(t)}case"Enter":return void(s[this.hoverIdx]&&(i.preventDefault(),this.pick(s[this.hoverIdx])));case" ":if(o)return;return i.preventDefault(),void(s[this.hoverIdx]&&this.pick(s[this.hoverIdx]));default:o||1!==i.key.length||i.ctrlKey||i.metaKey||i.altKey||this.onTypeahead(i.key)}};renderRow(i,s,o){const t=this.isSel(i.value);return e("div",{id:`${this.fieldId}-opt-${s}`,key:i.value,role:"option","aria-selected":t?"true":"false","aria-disabled":i.disabled?"true":null,"aria-posinset":s+1,"aria-setsize":o,class:{"sui-popup-option":!0,selected:t,hover:s===this.hoverIdx,keynav:this.keyNav&&s===this.hoverIdx,disabled:!!i.disabled},onMouseEnter:()=>this.hoverIdx=s,onMouseLeave:()=>this.hoverIdx=-1,onClick:()=>this.pick(i)},e("span",{class:"sui-popup-option-label"},i.label),t?e(d,{glyph:c}):null)}render(){const i=this.visible(),s=k(i),o=this.windowFor(s,i.length);this.windowed=!!o;const t=this.invalid||!!this.error,r=i[this.hoverIdx]?`${this.fieldId}-opt-${this.hoverIdx}`:void 0,c=O(void 0,"listbox.loading",this.loadingMessage,"Loading"),x=this.query.trim()?O(void 0,"listbox.emptyFilter",this.emptyFilterMessage,"No matches."):O(void 0,"listbox.empty",this.emptyMessage,"Nothing here yet.");return e(l,{key:"f1d611e290cfa3759ff2c3462a1d5866c76ae548",label:this.label,required:this.required,help:this.help,error:this.error,htmlFor:this.fieldId,descId:this.fieldId},e("div",{key:"690dd7ffc2f2aea5f56adb0274248d3bc32f867c",ref:i=>this.box=i,class:{box:!0,"sui-frame":!0,invalid:t,disabled:this.isDisabled,readonly:this.readOnly},style:{maxHeight:this.height+"px"},onKeyDown:this.onKeyDown,onScroll:this.onBoxScroll},this.filter?e("div",{class:"sui-popup-search"},e("div",{class:"sui-popup-search-box sui-frame"},e(d,{glyph:h}),e("input",{ref:i=>this.filterInput=i,type:"text",placeholder:O(void 0,"listbox.search",void 0,"Search"),"aria-label":O(void 0,"listbox.searchOptions",void 0,"Search options"),"aria-controls":this.fieldId,"aria-activedescendant":r,disabled:this.isDisabled,value:this.query,onInput:i=>{this.query=i.target.value,this.hoverIdx=-1,this.resetScroll()}}))):null,e("div",{key:"efe0e8380e57b39472440f0c7c0a953f20571786",ref:i=>this.list=i,id:this.fieldId,role:"listbox","aria-label":this.label,"aria-multiselectable":this.multiple?"true":null,"aria-disabled":this.isDisabled?"true":null,"aria-required":this.required?"true":null,"aria-readonly":this.readOnly?"true":null,"aria-activedescendant":r,"aria-invalid":t?"true":null,"aria-busy":this.loading?"true":null,"aria-describedby":a(this.fieldId,this.help,this.error),tabIndex:this.isDisabled?-1:0},this.loading||0===i.length?null:n(s,o,(i=>`${this.fieldId}-grp-${i}`),((s,o)=>this.renderRow(s,o,i.length)))),this.loading?e(u,{message:c}):null,this.loading||0!==i.length?null:e("div",{class:"sui-popup-empty"},x),e(p,{key:"f2faa1faedad0c64169d8d389654bc574937b62f",message:this.loading?c:0===i.length?x:""})))}static get formAssociated(){return!0}static get watchers(){return{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],name:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}],options:[{onOptions:0}],loading:[{onOptions:0}]}}static get style(){return'.sc-sui-listbox-h{display:block;font-family:var(--font-sans);min-width:0}.box.sc-sui-listbox{box-sizing:border-box;padding:5px;overflow-y:auto}.box.readonly.sc-sui-listbox [role="option"].sc-sui-listbox{cursor:default}.box.disabled.sc-sui-listbox .sui-popup-option.sc-sui-listbox{color:var(--disabled-ink);cursor:not-allowed}.box.sc-sui-listbox [role="listbox"].sc-sui-listbox{outline:none}@media (forced-colors: active){.box.sc-sui-listbox:focus-within{outline:2px solid Highlight;outline-offset:1px}.box.disabled.sc-sui-listbox{border-color:GrayText}.box.disabled.sc-sui-listbox .sui-popup-option.sc-sui-listbox{color:GrayText}.box.disabled.sc-sui-listbox .sui-popup-option.selected.sc-sui-listbox{background:GrayText;color:Canvas}.box.disabled.sc-sui-listbox .sui-popup-option.selected.sc-sui-listbox .sui-glyph.sc-sui-listbox{color:Canvas}}.sui-field.sc-sui-listbox{display:flex;flex-direction:column;gap:6px;font-family:var(--font-sans);min-width:0}.sui-field-label.sc-sui-listbox{font-size:12.5px;font-weight:620;color:var(--ink);line-height:1.3}.sui-field.invalid.sc-sui-listbox .sui-field-label.sc-sui-listbox{color:var(--danger)}.sui-field-req.sc-sui-listbox{color:var(--danger);margin-inline-start:3px}.sui-field-help.sc-sui-listbox{font-size:12px;color:var(--ink-faint);line-height:1.4}.sui-field-error.sc-sui-listbox{font-size:12px;font-weight:600;color:var(--danger);display:flex;align-items:center;gap:5px;line-height:1.4}.sui-field-error.sc-sui-listbox .sui-glyph.sc-sui-listbox{font-size:11px}.sui-frame.sc-sui-listbox{box-sizing:border-box;background:var(--sui-field-bg, var(--surface));border:1px solid var(--sui-field-border, var(--control-border));border-radius:var(--sui-field-radius, var(--radius-md));box-shadow:none;outline:none;transition:border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out)}.sui-frame.sc-sui-listbox:hover{border-color:var(--sui-field-border, color-mix(in srgb, var(--control-border) 55%, var(--ink)))}.sui-frame[readonly].sc-sui-listbox,.sui-frame.readonly.sc-sui-listbox{border-color:var(--sui-field-border, var(--control-border));background:var(--sui-field-bg, var(--surface-sunken))}.sui-frame.sc-sui-listbox:focus-within,.sui-frame.focus.sc-sui-listbox,.sui-frame.open.sc-sui-listbox{border-color:var(--sui-field-border, var(--focus-ring));outline:var(--sui-field-edge, 1px solid var(--focus-ring));outline-offset:-2px;box-shadow:var(--sui-field-halo, 0 0 0 3px var(--focus-halo))}.sui-frame.invalid.sc-sui-listbox{border-color:var(--sui-field-border, var(--danger));outline:var(--sui-field-edge, 1px solid var(--danger));outline-offset:-2px}.sui-frame.invalid.sc-sui-listbox:focus-within,.sui-frame.invalid.focus.sc-sui-listbox,.sui-frame.invalid.open.sc-sui-listbox{outline-width:2px;outline-offset:-3px;box-shadow:var(--sui-field-halo, 0 0 0 3px color-mix(in srgb, var(--danger) 35%, transparent))}.sui-frame.sc-sui-listbox:disabled,.sui-frame.disabled.sc-sui-listbox{--ink-muted:var(--disabled-ink);--ink-faint:var(--disabled-ink);border-color:var(--sui-field-border, var(--border));outline:none;box-shadow:none;background:var(--sui-field-bg, var(--disabled-bg));color:var(--disabled-ink);cursor:not-allowed}.sui-input.sc-sui-listbox{width:100%;color:var(--ink);font-family:var(--font-sans);font-weight:460}.sui-input.sc-sui-listbox::placeholder{color:var(--ink-placeholder)}.sui-input.sm.sc-sui-listbox{height:var(--sui-field-height, var(--control-sm));padding:0 10px;font-size:12.5px}.sui-input.md.sc-sui-listbox{height:var(--sui-field-height, var(--control-md));padding:0 var(--control-pad-x);font-size:13px}.sui-input.lg.sc-sui-listbox{height:var(--sui-field-height, var(--control-lg));padding:0 var(--control-pad-x);font-size:14px}@media (forced-colors: active){.sui-frame.sc-sui-listbox:focus-within,.sui-frame.focus.sc-sui-listbox,.sui-frame.open.sc-sui-listbox{outline:2px solid Highlight;outline-offset:1px}.sui-frame.sc-sui-listbox:disabled,.sui-frame.disabled.sc-sui-listbox{color:GrayText;border-color:GrayText}}.sui-popup-trigger.sc-sui-listbox{box-sizing:border-box;width:100%;height:var(--sui-field-height, var(--control-md));display:flex;align-items:center;gap:8px;padding-block:0;padding-inline:12px 10px;color:var(--ink);font-size:13px;font-family:var(--font-sans);font-weight:460;cursor:pointer;user-select:none;text-align:start}.sui-popup-trigger.sc-sui-listbox:disabled,.sui-popup-trigger.disabled.sc-sui-listbox{cursor:not-allowed}.sui-popup-trigger.sc-sui-listbox .val.sc-sui-listbox{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-popup-trigger.placeholder.sc-sui-listbox .val.sc-sui-listbox{color:var(--ink-placeholder)}.sui-popup-trigger.sc-sui-listbox .clear.sc-sui-listbox{display:inline-flex;padding:2px;color:var(--ink-faint);font-size:11px;cursor:pointer;border-radius:4px}.sui-popup-trigger.sc-sui-listbox .clear.sc-sui-listbox:hover{color:var(--ink)}.sui-popup-trigger.sc-sui-listbox .chev.sc-sui-listbox{display:var(--sui-field-chevron, inline-block);font-size:10px;color:var(--ink-faint);transition:transform var(--duration-fast) var(--ease-out)}.sui-popup-trigger.open.sc-sui-listbox .chev.sc-sui-listbox{transform:rotate(180deg)}.sui-popup-trigger.readonly.sc-sui-listbox .chev.sc-sui-listbox{opacity:0.4}.sui-popup-trigger.sc-sui-listbox .spin.sc-sui-listbox{font-size:11px;color:var(--ink-faint)}.sui-popup-trigger.sm.sc-sui-listbox{height:var(--sui-field-height, var(--control-sm));font-size:12.5px}.sui-popup-trigger.md.sc-sui-listbox{height:var(--sui-field-height, var(--control-md));font-size:13px}.sui-popup-trigger.lg.sc-sui-listbox{height:var(--sui-field-height, var(--control-lg));font-size:14px}.sui-popup-panel.sc-sui-listbox{position:fixed;z-index:var(--z-dropdown);box-sizing:border-box;min-width:100%;background:var(--surface-raised);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-pop);padding:5px;max-height:260px;overflow-y:auto;animation:sui-popup-in var(--duration-overlay) var(--ease-out)}.sui-popup-panel[data-side=\'top\'].sc-sui-listbox{animation-name:sui-popup-in-top}.sui-popup-panel.closing.sc-sui-listbox{animation:sui-popup-out var(--duration-fast) var(--ease-out) forwards;pointer-events:none}@keyframes sui-popup-in{from{opacity:0;transform:translateY(-4px)}}@keyframes sui-popup-in-top{from{opacity:0;transform:translateY(4px)}}@keyframes sui-popup-out{to{opacity:0}}.sui-popup-search.sc-sui-listbox{padding:3px 3px 7px;border-bottom:1px solid var(--hairline);margin-bottom:4px}.sui-popup-search-box.sc-sui-listbox{display:flex;align-items:center;gap:7px;height:30px;padding:0 9px}.sui-popup-search-box.sc-sui-listbox .sui-glyph.sc-sui-listbox{font-size:11px;color:var(--ink-faint)}.sui-popup-search-box.sc-sui-listbox input.sc-sui-listbox{flex:1;min-width:0;border:none;outline:none;background:transparent;font:460 12.5px var(--font-sans);color:var(--ink)}.sui-popup-empty.sc-sui-listbox{padding:10px;font-size:12.5px;color:var(--ink-faint)}.sui-popup-group.sc-sui-listbox{padding:8px 10px 4px;font-size:10.5px;font-weight:650;letter-spacing:0.09em;text-transform:uppercase;color:var(--ink-faint);user-select:none}.sui-popup-status.sc-sui-listbox{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}.sui-popup-loading.sc-sui-listbox{display:flex;align-items:center;gap:8px;padding:10px;font-size:12.5px;color:var(--ink-faint)}.sui-popup-loading.sc-sui-listbox .sui-glyph.sc-sui-listbox{font-size:11px;color:var(--brand)}.sui-popup-spin.sc-sui-listbox{animation:sb-spin 0.8s linear infinite}@media (prefers-reduced-motion: reduce){.sui-popup-spin.sc-sui-listbox{animation-duration:2s}}.sui-popup-spacer.sc-sui-listbox{flex:none;pointer-events:none}.sui-popup-option.sc-sui-listbox{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:6px;font-size:13px;font-weight:460;color:var(--ink);cursor:pointer;background:transparent}.sui-popup-option-label.sc-sui-listbox{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sui-popup-option.hover.sc-sui-listbox{--ink-faint:var(--ink-muted);background:var(--surface-hover)}.sui-popup-option.selected.sc-sui-listbox{--ink-muted:var(--ink-muted-on-wash);--ink-faint:var(--ink-muted);background:var(--surface-selected);font-weight:650}.sui-popup-option.selected.hover.sc-sui-listbox{--ink-muted:var(--ink);--ink-faint:var(--ink);background:linear-gradient(var(--surface-hover) 0 0) var(--surface-selected)}.sui-popup-option.keynav.sc-sui-listbox{outline:2px solid var(--focus-ring);outline-offset:-2px}.sui-popup-option.disabled.sc-sui-listbox{--ink-muted:var(--ink-placeholder);--ink-faint:var(--ink-placeholder);color:var(--disabled-ink);cursor:not-allowed}.sui-popup-option.sc-sui-listbox .sui-glyph.sc-sui-listbox{font-size:11px;color:var(--brand-soft-ink)}@media (forced-colors: active){.sui-popup-trigger.placeholder.sc-sui-listbox .val.sc-sui-listbox{color:GrayText}.sui-popup-option.hover.sc-sui-listbox{outline:2px solid CanvasText;outline-offset:-2px}.sui-popup-option.selected.sc-sui-listbox{forced-color-adjust:none;background:Highlight;color:HighlightText}.sui-popup-option.selected.sc-sui-listbox .sui-glyph.sc-sui-listbox{color:HighlightText}.sui-popup-option.disabled.sc-sui-listbox{color:GrayText}}'}},[578,"sui-listbox",{label:[1],help:[1],error:[1],options:[16],value:[1032],multiple:[516],filter:[516],emptyMessage:[1,"empty-message"],emptyFilterMessage:[1,"empty-filter-message"],loading:[516],loadingMessage:[1,"loading-message"],disabled:[516],readOnly:[516,"readonly"],invalid:[516],height:[2],virtualScrollThreshold:[2,"virtual-scroll-threshold"],required:[516],name:[513],query:[32],hoverIdx:[32],keyNav:[32],boxScrollTop:[32],formDisabled:[32],setFocus:[64]},[[0,"keydown","onKeyNav"],[1,"pointermove","onPointerNav"],[1,"pointerdown","onPointerPress"]],{value:[{syncForm:0}],required:[{syncForm:0}],error:[{syncForm:0}],name:[{syncForm:0}],disabled:[{syncForm:0}],readOnly:[{syncForm:0}],label:[{syncForm:0}],options:[{onOptions:0}],loading:[{onOptions:0}]}]),M=H,N=function(){"undefined"!=typeof customElements&&["sui-listbox"].forEach((i=>{"sui-listbox"===i&&(customElements.get(r(i))||customElements.define(r(i),H))}))};export{M as SuiListbox,N as defineCustomElement}

package/dist/components/sui-mega-menu.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "@shineuix/core";
+
+interface SuiMegaMenu extends Components.SuiMegaMenu, HTMLElement {}
+export const SuiMegaMenu: {
+    prototype: SuiMegaMenu;
+    new (): SuiMegaMenu;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;