@sky.ui/core 0.0.24 → 0.0.25

package/dist/helper/internals/form-control-base.js

@@ -1,2 +1,2 @@
-import{__decorate as t,__metadata as e}from"tslib";import{LitElement as i}from"lit";import{property as s}from"lit/decorators.js";class n extends i{static{this.formAssociated=!0}constructor(){if(super(),this.defaultValue="",this.name="",this.formId=null,this.disabled=!1,this.readonly=!1,this.required=!1,this.requiredMessage="This field is required.","function"!=typeof this.attachInternals)throw new Error("ElementInternals / form-associated custom elements not supported in this browser.");this.internals=this.attachInternals()}get form(){return this.internals.form}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.internals.reportValidity()}formResetCallback(){this.onFormReset(),this.syncFormValue(),this.syncValidity()}formDisabledCallback(t){this.disabled=t,this.onFormDisabled(t),this.syncValidity()}formStateRestoreCallback(t){this.onFormStateRestore(t),this.syncFormValue(),this.syncValidity()}getCustomErrorMessage(){return""}validateForForm(){return""}onFormReset(){this.setValueFromFormState(this.defaultValue)}onFormDisabled(t){}onFormStateRestore(t){this.setValueFromFormState(t)}onNativeValueMutated(t){}syncFormValue(){if(!this.name||this.disabled)return void this.internals.setFormValue(null);const t=this.getFormValue();null!==t?this.internals.setFormValue(t):this.internals.setFormValue(null)}syncValidity(){if(this.disabled)return void this.internals.setValidity({});if(this.required&&this.isEmpty())return void this.internals.setValidity({valueMissing:!0},this.requiredMessage||"This field is required.",this.getValidityAnchor());const t=this.validateForForm();t?this.internals.setValidity({customError:!0},t,this.getValidityAnchor()):this.internals.setValidity({})}reemitNativeEvent(t,e,i){const s={bubbles:!0,composed:!0,cancelable:!!["submit"].includes(t)},n=void 0!==i?.detail?new CustomEvent(t,{...s,...i}):new Event(t,{...s,...i});n.__originalEvent=e,this.dispatchEvent(n)}captureDefaultValue(t){this.defaultValue=t??""}get nativeControl(){return this.getNativeControl()}get nativeInput(){const t=this.getNativeControl();return t instanceof HTMLInputElement?t:null}get nativeTextarea(){const t=this.getNativeControl();return t instanceof HTMLTextAreaElement?t:null}syncFromNative(t=!0){const e=this.nativeControl;e&&(this.onNativeValueMutated(e),this.syncFormValue(),t&&this.syncValidity())}focus(t){this.nativeControl?.focus?.(t)}blur(){this.nativeControl?.blur?.()}click(){this.nativeControl?.click?.()}showPicker(){const t=this.nativeInput;if(!t||"function"!=typeof t.showPicker)return!1;try{return t.showPicker(),!0}catch(t){return!1}}getSelectionTarget(){const t=this.getNativeControl();if(!t)return null;if(t instanceof HTMLTextAreaElement)return t;if(t instanceof HTMLInputElement){const e=(t.type||"").toLowerCase();return"date"===e||"time"===e||"week"===e||"month"===e||"datetime-local"===e||"number"===e||"file"===e?null:t}return null}get selectionStart(){return this.getSelectionTarget()?.selectionStart??null}set selectionStart(t){const e=this.getSelectionTarget();e&&(e.selectionStart=t)}get selectionEnd(){return this.getSelectionTarget()?.selectionEnd??null}set selectionEnd(t){const e=this.getSelectionTarget();e&&(e.selectionEnd=t)}get selectionDirection(){return this.getSelectionTarget()?.selectionDirection??null}select(){this.getSelectionTarget()?.select?.()}setSelectionRange(t,e,i){this.getSelectionTarget()?.setSelectionRange?.(t,e,i)}setRangeText(t,e,i,s){const n=this.getSelectionTarget();!n||this.disabled||this.readonly||(void 0!==e&&void 0!==i?n.setRangeText(t,e,i,s):n.setRangeText(t),this.syncFromNative(!0))}get valueAsNumber(){return this.nativeInput?.valueAsNumber??Number.NaN}set valueAsNumber(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.valueAsNumber=t,this.syncFromNative(!0))}get valueAsDate(){return this.nativeInput?.valueAsDate??null}set valueAsDate(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.valueAsDate=t,this.syncFromNative(!0))}stepUp(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.stepUp(t),this.syncFromNative(!0))}stepDown(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.stepDown(t),this.syncFromNative(!0))}setCustomValidity(t){this.disabled||(t?this.internals.setValidity({customError:!0},t,this.getValidityAnchor()):(this.internals.setValidity({}),this.syncValidity()))}}t([s({type:String,reflect:!0}),e("design:type",Object)],n.prototype,"name",void 0),t([s({type:String,reflect:!0}),e("design:type",Object)],n.prototype,"formId",void 0),t([s({type:Boolean,reflect:!0}),e("design:type",Object)],n.prototype,"disabled",void 0),t([s({type:Boolean,reflect:!0}),e("design:type",Object)],n.prototype,"readonly",void 0),t([s({type:Boolean,reflect:!0}),e("design:type",Object)],n.prototype,"required",void 0),t([s({type:String}),e("design:type",Object)],n.prototype,"requiredMessage",void 0);export{n as FormControlBase};
+import{LitElement as t}from"lit";import{property as e}from"lit/decorators.js";var i=Object.defineProperty,s=(t,e,s,n)=>{for(var r,a=void 0,l=t.length-1;l>=0;l--)(r=t[l])&&(a=r(e,s,a)||a);return a&&i(e,s,a),a};class n extends t{constructor(){if(super(),this.defaultValue="",this.name="",this.formId=null,this.disabled=!1,this.readonly=!1,this.required=!1,this.requiredMessage="This field is required.","function"!=typeof this.attachInternals)throw new Error("ElementInternals / form-associated custom elements not supported in this browser.");this.internals=this.attachInternals()}static{this.formAssociated=!0}get form(){return this.internals.form}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}checkValidity(){return this.internals.checkValidity()}reportValidity(){return this.internals.reportValidity()}formResetCallback(){this.onFormReset(),this.syncFormValue(),this.syncValidity()}formDisabledCallback(t){this.disabled=t,this.onFormDisabled(t),this.syncValidity()}formStateRestoreCallback(t){this.onFormStateRestore(t),this.syncFormValue(),this.syncValidity()}getCustomErrorMessage(){return""}validateForForm(){return""}onFormReset(){this.setValueFromFormState(this.defaultValue)}onFormDisabled(t){}onFormStateRestore(t){this.setValueFromFormState(t)}onNativeValueMutated(t){}syncFormValue(){if(!this.name||this.disabled)return void this.internals.setFormValue(null);const t=this.getFormValue();null!==t?this.internals.setFormValue(t):this.internals.setFormValue(null)}syncValidity(){if(this.disabled)return void this.internals.setValidity({});if(this.required&&this.isEmpty())return void this.internals.setValidity({valueMissing:!0},this.requiredMessage||"This field is required.",this.getValidityAnchor());const t=this.validateForForm();t?this.internals.setValidity({customError:!0},t,this.getValidityAnchor()):this.internals.setValidity({})}reemitNativeEvent(t,e,i){const s={bubbles:!0,composed:!0,cancelable:!!["submit"].includes(t)},n=void 0!==i?.detail?new CustomEvent(t,{...s,...i}):new Event(t,{...s,...i});n.__originalEvent=e,this.dispatchEvent(n)}captureDefaultValue(t){this.defaultValue=t??""}get nativeControl(){return this.getNativeControl()}get nativeInput(){const t=this.getNativeControl();return t instanceof HTMLInputElement?t:null}get nativeTextarea(){const t=this.getNativeControl();return t instanceof HTMLTextAreaElement?t:null}syncFromNative(t=!0){const e=this.nativeControl;e&&(this.onNativeValueMutated(e),this.syncFormValue(),t&&this.syncValidity())}focus(t){this.nativeControl?.focus?.(t)}blur(){this.nativeControl?.blur?.()}click(){this.nativeControl?.click?.()}showPicker(){const t=this.nativeInput;if(!t||"function"!=typeof t.showPicker)return!1;try{return t.showPicker(),!0}catch(t){return!1}}getSelectionTarget(){const t=this.getNativeControl();if(!t)return null;if(t instanceof HTMLTextAreaElement)return t;if(t instanceof HTMLInputElement){const e=(t.type||"").toLowerCase();return"date"===e||"time"===e||"week"===e||"month"===e||"datetime-local"===e||"number"===e||"file"===e?null:t}return null}get selectionStart(){return this.getSelectionTarget()?.selectionStart??null}set selectionStart(t){const e=this.getSelectionTarget();e&&(e.selectionStart=t)}get selectionEnd(){return this.getSelectionTarget()?.selectionEnd??null}set selectionEnd(t){const e=this.getSelectionTarget();e&&(e.selectionEnd=t)}get selectionDirection(){return this.getSelectionTarget()?.selectionDirection??null}select(){this.getSelectionTarget()?.select?.()}setSelectionRange(t,e,i){this.getSelectionTarget()?.setSelectionRange?.(t,e,i)}setRangeText(t,e,i,s){const n=this.getSelectionTarget();!n||this.disabled||this.readonly||(void 0!==e&&void 0!==i?n.setRangeText(t,e,i,s):n.setRangeText(t),this.syncFromNative(!0))}get valueAsNumber(){return this.nativeInput?.valueAsNumber??Number.NaN}set valueAsNumber(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.valueAsNumber=t,this.syncFromNative(!0))}get valueAsDate(){return this.nativeInput?.valueAsDate??null}set valueAsDate(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.valueAsDate=t,this.syncFromNative(!0))}stepUp(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.stepUp(t),this.syncFromNative(!0))}stepDown(t){const e=this.nativeInput;!e||this.disabled||this.readonly||(e.stepDown(t),this.syncFromNative(!0))}setCustomValidity(t){this.disabled||(t?this.internals.setValidity({customError:!0},t,this.getValidityAnchor()):(this.internals.setValidity({}),this.syncValidity()))}}s([e({type:String,reflect:!0})],n.prototype,"name"),s([e({type:String,reflect:!0})],n.prototype,"formId"),s([e({type:Boolean,reflect:!0})],n.prototype,"disabled"),s([e({type:Boolean,reflect:!0})],n.prototype,"readonly"),s([e({type:Boolean,reflect:!0})],n.prototype,"required"),s([e({type:String})],n.prototype,"requiredMessage");export{n as FormControlBase};
 //# sourceMappingURL=form-control-base.js.map

package/dist/helper/internals/form-control-base.js.map

@@ -1 +1 @@
-{"version":3,"file":"form-control-base.js","sources":["../../../src/helper/internals/form-control-base.ts"],"sourcesContent":[null],"names":["FormControlBase","LitElement","this","formAssociated","constructor","super","defaultValue","name","formId","disabled","readonly","required","requiredMessage","attachInternals","Error","internals","form","validity","validationMessage","willValidate","checkValidity","reportValidity","formResetCallback","onFormReset","syncFormValue","syncValidity","formDisabledCallback","onFormDisabled","formStateRestoreCallback","state","onFormStateRestore","getCustomErrorMessage","validateForForm","setValueFromFormState","_disabled","onNativeValueMutated","_native","setFormValue","v","getFormValue","setValidity","isEmpty","valueMissing","getValidityAnchor","msg","customError","reemitNativeEvent","type","originalEvent","init","common","bubbles","composed","cancelable","includes","ev","undefined","detail","CustomEvent","Event","__originalEvent","dispatchEvent","captureDefaultValue","initial","nativeControl","getNativeControl","nativeInput","el","HTMLInputElement","nativeTextarea","HTMLTextAreaElement","syncFromNative","runValidity","native","focus","options","blur","click","showPicker","input","err","getSelectionTarget","t","toLowerCase","selectionStart","selectionEnd","selectionDirection","select","setSelectionRange","start","end","direction","setRangeText","replacement","selectionMode","valueAsNumber","Number","NaN","valueAsDate","stepUp","n","stepDown","setCustomValidity","message","__decorate","property","String","reflect","prototype","Boolean"],"mappings":"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"}
+{"version":3,"file":"form-control-base.js","sources":["../../../src/helper/internals/form-control-base.ts"],"sourcesContent":["import { LitElement } from \"lit\";\r\nimport { property } from \"lit/decorators.js\";\r\n\r\nexport type FormState = string | File | FormData | null | string;\r\n\r\nexport abstract class FormControlBase extends LitElement {\r\n  /** Enables form-associated custom element behavior */\r\n  static formAssociated = true;\r\n\r\n  protected internals: ElementInternals;\r\n  protected defaultValue = \"\";\r\n\r\n  /** Native form attributes you’ll reuse everywhere */\r\n  @property({ type: String, reflect: true }) name = \"\";\r\n  @property({ type: String, reflect: true })\r\n  formId: string | null = null;\r\n  @property({ type: Boolean, reflect: true }) disabled = false;\r\n  @property({ type: Boolean, reflect: true }) readonly = false;\r\n  @property({ type: Boolean, reflect: true }) required = false;\r\n  @property({ type: String }) requiredMessage = \"This field is required.\";\r\n\r\n  constructor() {\r\n    super();\r\n\r\n    if (typeof (this as any).attachInternals === \"function\") {\r\n      // @ts-ignore\r\n      this.internals = this.attachInternals();\r\n    } else {\r\n      throw new Error(\r\n        \"ElementInternals / form-associated custom elements not supported in this browser.\"\r\n      );\r\n    }\r\n  }\r\n\r\n  // ---- Native form APIs (pass-through)\r\n  get form() {\r\n    return this.internals.form;\r\n  }\r\n  get validity() {\r\n    return this.internals.validity;\r\n  }\r\n  get validationMessage() {\r\n    return this.internals.validationMessage;\r\n  }\r\n  get willValidate() {\r\n    return this.internals.willValidate;\r\n  }\r\n  checkValidity() {\r\n    return this.internals.checkValidity();\r\n  }\r\n  reportValidity() {\r\n    return this.internals.reportValidity();\r\n  }\r\n\r\n  // ---- Form callbacks\r\n  formResetCallback() {\r\n    this.onFormReset();\r\n    this.syncFormValue();\r\n    this.syncValidity();\r\n  }\r\n\r\n  formDisabledCallback(disabled: boolean) {\r\n    this.disabled = disabled;\r\n    this.onFormDisabled(disabled);\r\n    this.syncValidity();\r\n  }\r\n\r\n  formStateRestoreCallback(state: FormState) {\r\n    this.onFormStateRestore(state);\r\n    this.syncFormValue();\r\n    this.syncValidity();\r\n  }\r\n\r\n  // ============================================================\r\n  // ✅ Hooks for subclasses\r\n  // ============================================================\r\n\r\n  /** Must return current “submission value” (string/file/formdata) */\r\n  protected abstract getFormValue(): FormState;\r\n\r\n  /** Must set the component state from restored state (usually string) */\r\n  protected abstract setValueFromFormState(state: FormState): void;\r\n\r\n  /** Must return the internal focusable control to anchor validity bubbles */\r\n  protected abstract getValidityAnchor(): HTMLElement | undefined;\r\n\r\n  /** Must return true if empty (for required) */\r\n  protected abstract isEmpty(): boolean;\r\n\r\n  /** ✅ Must return the native control you want to proxy to (input/textarea/select/...) */\r\n  protected abstract getNativeControl(): HTMLElement | null;\r\n\r\n  /** Optional: return first custom error message (or empty string) */\r\n  protected getCustomErrorMessage(): string {\r\n    return \"\";\r\n  }\r\n\r\n  protected validateForForm(): string {\r\n    // return \"\" if OK, otherwise return error message\r\n    return \"\";\r\n  }\r\n\r\n  /** Optional: reset component to default */\r\n  protected onFormReset() {\r\n    this.setValueFromFormState(this.defaultValue);\r\n  }\r\n\r\n  /** Optional: react to fieldset disabled */\r\n  protected onFormDisabled(_disabled: boolean) { }\r\n\r\n  /** Optional: handle BFCache restore */\r\n  protected onFormStateRestore(state: FormState) {\r\n    this.setValueFromFormState(state);\r\n  }\r\n\r\n  /**\r\n   * ✅ Called by base after a proxy method mutates the native control.\r\n   * Subclasses should pull native.value into their state and optionally validate.\r\n   */\r\n  protected onNativeValueMutated(_native: any): void { }\r\n\r\n  // ============================================================\r\n  // ✅ Shared utilities (form value + validity)\r\n  // ============================================================\r\n\r\n  protected syncFormValue() {\r\n    if (!this.name || this.disabled) {\r\n      this.internals.setFormValue(null);\r\n      return;\r\n    }\r\n\r\n    const v = this.getFormValue();\r\n\r\n    if (v === null) {\r\n      this.internals.setFormValue(null);\r\n      return;\r\n    }\r\n\r\n    this.internals.setFormValue(v);\r\n  }\r\n\r\n  protected syncValidity() {\r\n    if (this.disabled) {\r\n      this.internals.setValidity({});\r\n      return;\r\n    }\r\n\r\n    // Required\r\n    if (this.required && this.isEmpty()) {\r\n      this.internals.setValidity(\r\n        { valueMissing: true },\r\n        this.requiredMessage || \"This field is required.\",\r\n        this.getValidityAnchor()\r\n      );\r\n      return;\r\n    }\r\n\r\n    // Custom error (subclass)\r\n    const msg = this.validateForForm();\r\n    if (msg) {\r\n      this.internals.setValidity(\r\n        { customError: true },\r\n        msg,\r\n        this.getValidityAnchor()\r\n      );\r\n      return;\r\n    }\r\n\r\n    this.internals.setValidity({});\r\n  }\r\n\r\n  protected reemitNativeEvent(\r\n    type: string,\r\n    originalEvent: Event,\r\n    init?: Partial<EventInit> & { detail?: any }\r\n  ) {\r\n    const cancelable = [\"submit\"].includes(type) ? true : false;\r\n    const common: EventInit = { bubbles: true, composed: true, cancelable };\r\n\r\n    const ev =\r\n      init?.detail !== undefined\r\n        ? new CustomEvent(type, { ...common, ...init })\r\n        : new Event(type, { ...common, ...init });\r\n\r\n    (ev as any).__originalEvent = originalEvent;\r\n\r\n    this.dispatchEvent(ev);\r\n  }\r\n\r\n  /** Call once after initial render */\r\n  protected captureDefaultValue(initial: string) {\r\n    this.defaultValue = initial ?? \"\";\r\n  }\r\n\r\n\r\n\r\n  // ============================================================\r\n  // ✅ Native proxy helpers (shared across all controls)\r\n  // ============================================================\r\n\r\n  protected get nativeControl(): any | null {\r\n    return this.getNativeControl() as any;\r\n  }\r\n\r\n  protected get nativeInput(): HTMLInputElement | null {\r\n    const el = this.getNativeControl();\r\n    return el instanceof HTMLInputElement ? el : null;\r\n  }\r\n\r\n  protected get nativeTextarea(): HTMLTextAreaElement | null {\r\n    const el = this.getNativeControl();\r\n    return el instanceof HTMLTextAreaElement ? el : null;\r\n  }\r\n\r\n  /** Central sync after proxy calls */\r\n  protected syncFromNative(runValidity = true) {\r\n    const native = this.nativeControl;\r\n    if (!native) return;\r\n\r\n    this.onNativeValueMutated(native);\r\n    this.syncFormValue();\r\n    if (runValidity) this.syncValidity();\r\n  }\r\n\r\n  // ---- focus/blur/click/showPicker\r\n  focus(options?: FocusOptions) {\r\n    this.nativeControl?.focus?.(options);\r\n  }\r\n\r\n  blur() {\r\n    this.nativeControl?.blur?.();\r\n  }\r\n\r\n  click() {\r\n    this.nativeControl?.click?.();\r\n  }\r\n\r\n  showPicker(): boolean {\r\n    const input = this.nativeInput as any;\r\n    if (!input || typeof input.showPicker !== \"function\") return false;\r\n\r\n    try {\r\n      input.showPicker();\r\n      return true;\r\n    } catch (err) {\r\n      // Chromium throws NotAllowedError if not called from a user gesture\r\n      // We intentionally swallow it because this is often used programmatically.\r\n      return false;\r\n    }\r\n  }\r\n\r\n  protected getSelectionTarget(): HTMLInputElement | HTMLTextAreaElement | null {\r\n    const el = this.getNativeControl();\r\n    if (!el) return null;\r\n\r\n    // textarea always supports selection\r\n    if (el instanceof HTMLTextAreaElement) return el;\r\n\r\n    if (el instanceof HTMLInputElement) {\r\n      const t = (el.type || \"\").toLowerCase();\r\n\r\n      // types that don't support selection APIs\r\n      if (\r\n        t === \"date\" ||\r\n        t === \"time\" ||\r\n        t === \"week\" ||\r\n        t === \"month\" ||\r\n        t === \"datetime-local\" ||\r\n        t === \"number\" ||\r\n        t === \"file\"\r\n      ) {\r\n        return null;\r\n      }\r\n\r\n      return el;\r\n    }\r\n\r\n    return null;\r\n  }\r\n\r\n  get selectionStart(): number | null {\r\n    return this.getSelectionTarget()?.selectionStart ?? null;\r\n  }\r\n  set selectionStart(v: number | null) {\r\n    const t = this.getSelectionTarget();\r\n    if (!t) return;\r\n    t.selectionStart = v;\r\n  }\r\n\r\n  get selectionEnd(): number | null {\r\n    return this.getSelectionTarget()?.selectionEnd ?? null;\r\n  }\r\n  set selectionEnd(v: number | null) {\r\n    const t = this.getSelectionTarget();\r\n    if (!t) return;\r\n    t.selectionEnd = v;\r\n  }\r\n\r\n  get selectionDirection(): \"forward\" | \"backward\" | \"none\" | null {\r\n    return this.getSelectionTarget()?.selectionDirection ?? null;\r\n  }\r\n\r\n  select() {\r\n    this.getSelectionTarget()?.select?.();\r\n  }\r\n\r\n  setSelectionRange(start: number, end: number, direction?: \"forward\" | \"backward\" | \"none\") {\r\n    this.getSelectionTarget()?.setSelectionRange?.(start, end, direction);\r\n  }\r\n\r\n  setRangeText(\r\n    replacement: string,\r\n    start?: number,\r\n    end?: number,\r\n    selectionMode?: \"select\" | \"start\" | \"end\" | \"preserve\"\r\n  ) {\r\n    const el = this.getSelectionTarget();\r\n    if (!el || this.disabled || this.readonly) return;\r\n\r\n    if (start !== undefined && end !== undefined) {\r\n      el.setRangeText(replacement, start, end, selectionMode);\r\n    } else {\r\n      el.setRangeText(replacement);\r\n    }\r\n\r\n    this.syncFromNative(true);\r\n  }\r\n\r\n  // ---- valueAsNumber/valueAsDate (input only)\r\n  get valueAsNumber(): number {\r\n    return this.nativeInput?.valueAsNumber ?? Number.NaN;\r\n  }\r\n  set valueAsNumber(v: number) {\r\n    const input = this.nativeInput;\r\n    if (!input || this.disabled || this.readonly) return;\r\n    input.valueAsNumber = v;\r\n    this.syncFromNative(true);\r\n  }\r\n\r\n  get valueAsDate(): Date | null {\r\n    return this.nativeInput?.valueAsDate ?? null;\r\n  }\r\n  set valueAsDate(v: Date | null) {\r\n    const input = this.nativeInput;\r\n    if (!input || this.disabled || this.readonly) return;\r\n    input.valueAsDate = v;\r\n    this.syncFromNative(true);\r\n  }\r\n\r\n  // ---- stepping (input only)\r\n  stepUp(n?: number) {\r\n    const input = this.nativeInput;\r\n    if (!input || this.disabled || this.readonly) return;\r\n    input.stepUp(n);\r\n    this.syncFromNative(true);\r\n  }\r\n\r\n  stepDown(n?: number) {\r\n    const input = this.nativeInput;\r\n    if (!input || this.disabled || this.readonly) return;\r\n    input.stepDown(n);\r\n    this.syncFromNative(true);\r\n  }\r\n\r\n  // ---- native-ish validity API\r\n  setCustomValidity(message: string) {\r\n    if (this.disabled) return;\r\n\r\n    if (message) {\r\n      this.internals.setValidity(\r\n        { customError: true },\r\n        message,\r\n        this.getValidityAnchor()\r\n      );\r\n    } else {\r\n      this.internals.setValidity({});\r\n      this.syncValidity();\r\n    }\r\n  }\r\n}\r\n"],"names":["FormControlBase","LitElement","constructor","super","this","defaultValue","name","formId","disabled","readonly","required","requiredMessage","attachInternals","Error","internals","formAssociated","form","validity","validationMessage","willValidate","checkValidity","reportValidity","formResetCallback","onFormReset","syncFormValue","syncValidity","formDisabledCallback","onFormDisabled","formStateRestoreCallback","state","onFormStateRestore","getCustomErrorMessage","validateForForm","setValueFromFormState","_disabled","onNativeValueMutated","_native","setFormValue","v","getFormValue","setValidity","isEmpty","valueMissing","getValidityAnchor","msg","customError","reemitNativeEvent","type","originalEvent","init","common","bubbles","composed","cancelable","includes","ev","detail","CustomEvent","Event","__originalEvent","dispatchEvent","captureDefaultValue","initial","nativeControl","getNativeControl","nativeInput","el","HTMLInputElement","nativeTextarea","HTMLTextAreaElement","syncFromNative","runValidity","native","focus","options","blur","click","showPicker","input","err","getSelectionTarget","t","toLowerCase","selectionStart","selectionEnd","selectionDirection","select","setSelectionRange","start","end","direction","setRangeText","replacement","selectionMode","valueAsNumber","Number","NaN","valueAsDate","stepUp","n","stepDown","setCustomValidity","message","__decorateClass","property","String","reflect","prototype","Boolean"],"mappings":"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"}

package/dist/helper/utils/color-resolver.js.map

@@ -1 +1 @@
-{"version":3,"file":"color-resolver.js","sources":["../../../src/helper/utils/color-resolver.ts"],"sourcesContent":[null],"names":["DEFAULT_COLOR_TOKENS","primary","active","secondary","success","danger","warning","info","light","dark","muted","default","resolveColor","input","customMap","map","resolveTextColorForToken","isDefaultColorToken","resolveInkColorForToken","resolveAccentColorForToken","SEMANTIC_SURFACE_KEYS","resolveSemanticSurfaceKey","colorToken","semanticSoftSurfaceTokens","semanticKey","options","bg","color","border","bordered","skyBorderPrimaryShorthand","skyBorderWidthSolid","widthPx","DEFAULT_COLOR_VARIANT_PATCHES","shadow","hoverBg","hoverColor","hoverShadow","arrow","solid","faded","hoverBorder","transparent","flat","ghost","link","tuneSurfaceVariantForDefaultColor","variant","styles","patch","hoverShade","amount","darkShade","lightShade","fadeMix","resolveGradientStop","stop","match","head","parseGradientSpec","raw","trim","idx","indexOf","prefix","stopsStr","slice","kind","args","k","a","split","s","kLower","toLowerCase","stops","filter","Boolean","createGradient","specStr","fallbackColor","spec","length","st","join","ColorResolver","constructor","config","this","useColorMix","resolve","startsWith","customVar","getTextColor","backgroundColor","getHoverColor","baseColor","darkenAmount","colorResolver"],"mappings":"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"}
+{"version":3,"file":"color-resolver.js","sources":["../../../src/helper/utils/color-resolver.ts"],"sourcesContent":["/**\r\n * Color resolution utilities for Sky Design System\r\n * Provides consistent color token mapping across components\r\n */\r\n\r\nexport type ColorToken =\r\n  | 'primary'\r\n  | 'secondary'\r\n  | 'success'\r\n  | 'danger'\r\n  | 'warning'\r\n  | 'light'\r\n  | 'dark'\r\n  | 'default'\r\n  | string; // Custom CSS color\r\n\r\nexport interface ColorResolverConfig {\r\n  /** CSS variable prefix (default: 'sky') */\r\n  prefix?: string;\r\n  /** Whether to use color-mix for hover states */\r\n  useColorMix?: boolean;\r\n}\r\n\r\n/**\r\n * Default color token mapping to CSS variables\r\n */\r\nexport const DEFAULT_COLOR_TOKENS: Record<string, string> = {\r\n  primary: 'var(--sky-active-primary)',\r\n  active: 'var(--sky-active-primary)',\r\n  secondary: 'var(--sky-info-primary)',\r\n  success: 'var(--sky-success-primary)',\r\n  danger: 'var(--sky-danger-primary)',\r\n  warning: 'var(--sky-warning-primary)',\r\n  info: 'var(--sky-info-primary)',\r\n  light: 'var(--sky-text-light)',\r\n  dark: 'var(--sky-text-dark)',\r\n  /** Muted line/text (e.g. dividers); maps to `--sky-text-tertiary`. */\r\n  muted: 'var(--sky-text-tertiary)',\r\n  /** Light border tone; maps to `--sky-border-light`. */\r\n  'border-light': 'var(--sky-border-light)',\r\n  default: 'var(--sky-glass-solid)',\r\n} as const;\r\n\r\n/**\r\n * Resolves a color token to its CSS value\r\n * @param input - Color token (e.g., 'primary') or custom CSS color\r\n * @param customMap - Optional custom token mapping (overrides defaults)\r\n * @returns CSS color value\r\n */\r\nexport function resolveColor(\r\n  input: string,\r\n  customMap: Record<string, string> = {}\r\n): string {\r\n  const map = { ...DEFAULT_COLOR_TOKENS, ...customMap };\r\n  return map[input] || input || map.primary;\r\n}\r\n\r\n/**\r\n * Determines appropriate text color for a given background color token\r\n * @param input - Color token (e.g., 'primary')\r\n * @returns CSS color value for text\r\n */\r\nexport function resolveTextColorForToken(input: string): string {\r\n  const tokenMap: Record<string, string> = {\r\n    dark: 'var(--sky-text-light)',\r\n    light: 'var(--sky-text-dark)',\r\n    warning: 'var(--sky-text-black)',\r\n    success: 'var(--sky-text-black)',\r\n    default: 'var(--sky-text-primary)',\r\n  };\r\n\r\n  return tokenMap[input] || 'var(--sky-text-white)';\r\n}\r\n\r\n/** True when the token is the neutral glass surface (`default`), not a brand accent. */\r\nexport function isDefaultColorToken(input: string): boolean {\r\n  return input === 'default';\r\n}\r\n\r\n/** Foreground ink (labels, borders) — never use glass-solid as text. */\r\nexport function resolveInkColorForToken(input: string): string {\r\n  return isDefaultColorToken(input)\r\n    ? 'var(--sky-text-primary)'\r\n    : resolveColor(input);\r\n}\r\n\r\n/** Accent for hover/focus on neutral surfaces. */\r\nexport function resolveAccentColorForToken(input: string): string {\r\n  return isDefaultColorToken(input)\r\n    ? 'var(--sky-active-primary)'\r\n    : resolveColor(input);\r\n}\r\n\r\n/** Maps component color tokens to theme semantic keys (`active`, `success`, …). */\r\nconst SEMANTIC_SURFACE_KEYS: Record<string, string> = {\r\n  primary: \"active\",\r\n  active: \"active\",\r\n  success: \"success\",\r\n  danger: \"danger\",\r\n  warning: \"warning\",\r\n  info: \"info\",\r\n  secondary: \"info\",\r\n};\r\n\r\n/**\r\n * Resolves a color token to a theme semantic surface key, if one exists.\r\n */\r\nexport function resolveSemanticSurfaceKey(colorToken: string): string | null {\r\n  return SEMANTIC_SURFACE_KEYS[colorToken] ?? null;\r\n}\r\n\r\n/** Soft semantic surface tokens for alerts, badges, and subtle status blocks. */\r\nexport function semanticSoftSurfaceTokens(\r\n  semanticKey: string,\r\n  options: { bordered?: boolean } = {},\r\n): { bg: string; color: string; border: string } {\r\n  return {\r\n    bg: `var(--sky-${semanticKey}-quinary)`,\r\n    color: `var(--sky-${semanticKey}-primary-dark)`,\r\n    border: options.bordered\r\n      ? `1px solid var(--sky-${semanticKey}-g1)`\r\n      : \"none\",\r\n  };\r\n}\r\n\r\n/**\r\n * Theme glass border shorthand (`1px solid …` from `--sky-border-primary`).\r\n * Use as a full `border` value — do not wrap in `Npx solid var(--sky-border-primary)`.\r\n */\r\nexport function skyBorderPrimaryShorthand(): string {\r\n  return 'var(--sky-border-primary)';\r\n}\r\n\r\n/**\r\n * Separator stroke for custom widths (`--sky-border-light` is a color, not shorthand).\r\n */\r\nexport function skyBorderWidthSolid(widthPx: number): string {\r\n  return `${widthPx}px solid var(--sky-border-light)`;\r\n}\r\n\r\n/** Partial variant overrides when `color=\"default\"` (surface token, not ink). */\r\nexport type DefaultColorVariantPatch = Partial<{\r\n  bg: string;\r\n  color: string;\r\n  border: string;\r\n  shadow: string;\r\n  hoverBg: string;\r\n  hoverColor: string;\r\n  hoverShadow: string;\r\n  hoverBorder: string;\r\n  arrow: string;\r\n}>;\r\n\r\nconst DEFAULT_COLOR_VARIANT_PATCHES: Record<string, DefaultColorVariantPatch> = {\r\n  shadow: {\r\n    bg: 'var(--sky-glass-solid)',\r\n    hoverBg: 'var(--sky-glass-solid)',\r\n    color: 'var(--sky-text-primary)',\r\n    hoverColor: 'var(--sky-active-primary)',\r\n    shadow: 'none',\r\n    hoverShadow: 'var(--sky-box-shadow-hover)',\r\n    arrow: 'var(--sky-glass-solid)',\r\n  },\r\n  solid: {\r\n    hoverShadow: 'var(--sky-box-shadow-hover)',\r\n  },\r\n  faded: {\r\n    color: 'var(--sky-text-primary)',\r\n    hoverColor: 'var(--sky-text-primary)',\r\n    arrow: 'var(--sky-hover-tertiary)',\r\n  },\r\n  bordered: {\r\n    color: 'var(--sky-text-primary)',\r\n    border: skyBorderWidthSolid(2),\r\n    hoverColor: 'var(--sky-text-primary)',\r\n    hoverBorder: '2px solid var(--sky-text-tertiary)',\r\n    arrow: 'var(--sky-border-light)',\r\n  },\r\n  transparent: {\r\n    color: 'var(--sky-text-primary)',\r\n    hoverBg: 'var(--sky-hover-tertiary)',\r\n    hoverColor: 'var(--sky-text-primary)',\r\n  },\r\n  flat: {\r\n    bg: 'var(--sky-hover-tertiary)',\r\n    color: 'var(--sky-text-primary)',\r\n    hoverBg: 'var(--sky-hover-secondary)',\r\n    hoverColor: 'var(--sky-active-primary)',\r\n    arrow: 'var(--sky-hover-tertiary)',\r\n  },\r\n  ghost: {\r\n    color: 'var(--sky-text-primary)',\r\n    border: skyBorderWidthSolid(2),\r\n    hoverBg: 'var(--sky-hover-secondary)',\r\n    hoverColor: 'var(--sky-text-primary)',\r\n  },\r\n  link: {\r\n    color: 'var(--sky-text-primary)',\r\n    hoverColor: 'var(--sky-active-primary)',\r\n  },\r\n  light: {\r\n    color: 'var(--sky-text-primary)',\r\n  },\r\n};\r\n\r\n/**\r\n * Applies variant style overrides for `color=\"default\"` so glass tokens are not\r\n * used as text/border/hover ink on translucent surfaces.\r\n */\r\nexport function tuneSurfaceVariantForDefaultColor<T extends DefaultColorVariantPatch>(\r\n  colorToken: string,\r\n  variant: string,\r\n  styles: T,\r\n): T {\r\n  if (!isDefaultColorToken(colorToken)) return styles;\r\n  const patch = DEFAULT_COLOR_VARIANT_PATCHES[variant];\r\n  if (!patch) return styles;\r\n  return { ...styles, ...patch };\r\n}\r\n\r\n/**\r\n * Creates a hover shade using color-mix\r\n * @param color - Base CSS color\r\n * @param amount - Percentage of black to mix (0-100)\r\n * @returns CSS color-mix() value\r\n */\r\nexport function hoverShade(color: string, amount: number = 20): string {\r\n  return `color-mix(in srgb, ${color} ${100 - amount}%, var(--sky-text-dark))`;\r\n}\r\n/**\r\n * Creates a hover shade using color-mix\r\n * @param color - Base CSS color\r\n * @param amount - Percentage of black to mix (0-100)\r\n * @returns CSS color-mix() value\r\n */\r\nexport function darkShade(color: string, amount: number = 20): string {\r\n  return `color-mix(in srgb, ${color} ${100 - amount}%, var(--sky-text-black))`;\r\n}\r\n/**\r\n * Creates a hover shade using color-mix\r\n * @param color - Base CSS color\r\n * @param amount - Percentage of black to mix (0-100)\r\n * @returns CSS color-mix() value\r\n */\r\nexport function lightShade(color: string, amount: number = 20): string {\r\n  return `color-mix(in srgb, ${color} ${100 - amount}%, var(--sky-text-white))`;\r\n}\r\n\r\n\r\n/**\r\n * Creates a faded/transparent version of a color\r\n * @param color - Base CSS color\r\n * @param amount - Percentage of transparency (0-100)\r\n * @returns CSS color-mix() value with transparency\r\n */\r\nexport function fadeMix(color: string, amount: number = 15): string {\r\n  return `color-mix(in srgb, ${color} ${amount}%, transparent)`;\r\n}\r\n\r\n/**\r\n * Resolves gradient stop tokens to CSS colors\r\n * @param stop - Gradient stop token (e.g., 'primary 30%')\r\n * @returns CSS gradient stop value\r\n */\r\nexport function resolveGradientStop(stop: string): string {\r\n  const match = stop.match(/^([^\\s]+)(\\s+.+)?$/);\r\n  const head = match?.[1] ?? stop;\r\n  const tail = match?.[2] ?? '';\r\n\r\n  const resolved = DEFAULT_COLOR_TOKENS[head] || head;\r\n  return `${resolved}${tail}`;\r\n}\r\n\r\n/**\r\n * Parses a gradient specification string\r\n */\r\nexport interface GradientSpec {\r\n  kind: 'linear' | 'radial' | 'conic';\r\n  args: string;\r\n  stops: string[];\r\n}\r\n\r\n/**\r\n * Parses gradient specification string\r\n * Format: \"kind@args: stop1, stop2, stop3\"\r\n * Example: \"linear@90deg: primary, secondary 50%, danger\"\r\n * Example: \"radial@circle: primary, transparent\"\r\n */\r\nexport function parseGradientSpec(input: string): GradientSpec {\r\n  const raw = (input || '').trim();\r\n  const idx = raw.indexOf(':');\r\n  let prefix = '';\r\n  let stopsStr = raw;\r\n\r\n  if (idx !== -1) {\r\n    prefix = raw.slice(0, idx).trim();\r\n    stopsStr = raw.slice(idx + 1).trim();\r\n  }\r\n\r\n  let kind: 'linear' | 'radial' | 'conic' = 'linear';\r\n  let args = '90deg';\r\n\r\n  if (prefix) {\r\n    const [k, a] = prefix.split('@').map(s => s.trim());\r\n    const kLower = (k || '').toLowerCase();\r\n    if (kLower === 'linear' || kLower === 'radial' || kLower === 'conic') {\r\n      kind = kLower;\r\n      args = a || (kind === 'linear'\r\n        ? '90deg'\r\n        : kind === 'radial'\r\n          ? 'circle'\r\n          : 'from 0deg at 50% 50%');\r\n    } else {\r\n      stopsStr = raw;\r\n    }\r\n  }\r\n\r\n  const stops = stopsStr\r\n    .split(',')\r\n    .map(s => s.trim())\r\n    .filter(Boolean);\r\n\r\n  return { kind, args, stops };\r\n}\r\n\r\n/**\r\n * Creates a CSS gradient from a specification string\r\n * @param specStr - Gradient specification string\r\n * @param fallbackColor - Fallback color if no stops provided\r\n * @returns CSS gradient value\r\n */\r\nexport function createGradient(\r\n  specStr: string,\r\n  fallbackColor: string = 'var(--sky-active-primary)'\r\n): string {\r\n  const spec = parseGradientSpec(specStr);\r\n  const stops = (\r\n    spec.stops.length\r\n      ? spec.stops\r\n      : [fallbackColor, fallbackColor]\r\n  ).map(st => resolveGradientStop(st));\r\n\r\n  const { kind, args } = spec;\r\n\r\n  switch (kind) {\r\n    case 'linear':\r\n      return `linear-gradient(${args}, ${stops.join(', ')})`;\r\n    case 'radial':\r\n      return `radial-gradient(${args}, ${stops.join(', ')})`;\r\n    case 'conic':\r\n      return `conic-gradient(${args}, ${stops.join(', ')})`;\r\n    default:\r\n      return `linear-gradient(90deg, ${stops.join(', ')})`;\r\n  }\r\n}\r\n\r\n/**\r\n * Color resolver with configuration support\r\n */\r\nexport class ColorResolver {\r\n  private config: Required<ColorResolverConfig>;\r\n\r\n  constructor(config: ColorResolverConfig = {}) {\r\n    this.config = {\r\n      prefix: config.prefix || 'sky',\r\n      useColorMix: config.useColorMix ?? true,\r\n    };\r\n  }\r\n\r\n  /**\r\n   * Resolves a color with prefix-aware variable names\r\n   */\r\n  resolve(input: string): string {\r\n    if (input.startsWith('#')) return input;\r\n    if (input.startsWith('rgb') || input.startsWith('hsl')) return input;\r\n    if (input.startsWith('var(')) return input;\r\n\r\n    const customVar = `var(--${this.config.prefix}-${input})`;\r\n    const defaultResolved = DEFAULT_COLOR_TOKENS[input];\r\n\r\n    return defaultResolved || customVar || DEFAULT_COLOR_TOKENS.primary;\r\n  }\r\n\r\n  /**\r\n   * Gets text color for a background color\r\n   */\r\n  getTextColor(backgroundColor: string): string {\r\n    // If it's a token, use the token-based logic\r\n    if (backgroundColor in DEFAULT_COLOR_TOKENS) {\r\n      return resolveTextColorForToken(backgroundColor);\r\n    }\r\n\r\n    // For custom colors, return a sensible default\r\n    return 'var(--sky-text-white)';\r\n  }\r\n\r\n  /**\r\n   * Creates a hover state color\r\n   */\r\n  getHoverColor(baseColor: string, darkenAmount: number = 20): string {\r\n    if (!this.config.useColorMix) {\r\n      // Fallback for browsers without color-mix support\r\n      return baseColor;\r\n    }\r\n\r\n    return hoverShade(baseColor, darkenAmount);\r\n  }\r\n}\r\n\r\n/**\r\n * Singleton instance for convenience\r\n */\r\nexport const colorResolver = new ColorResolver();\r\n\r\n"],"names":["DEFAULT_COLOR_TOKENS","primary","active","secondary","success","danger","warning","info","light","dark","muted","default","resolveColor","input","customMap","map","resolveTextColorForToken","isDefaultColorToken","resolveInkColorForToken","resolveAccentColorForToken","SEMANTIC_SURFACE_KEYS","resolveSemanticSurfaceKey","colorToken","semanticSoftSurfaceTokens","semanticKey","options","bg","color","border","bordered","skyBorderPrimaryShorthand","skyBorderWidthSolid","widthPx","DEFAULT_COLOR_VARIANT_PATCHES","shadow","hoverBg","hoverColor","hoverShadow","arrow","solid","faded","hoverBorder","transparent","flat","ghost","link","tuneSurfaceVariantForDefaultColor","variant","styles","patch","hoverShade","amount","darkShade","lightShade","fadeMix","resolveGradientStop","stop","match","head","parseGradientSpec","raw","trim","idx","indexOf","prefix","stopsStr","slice","kind","args","k","a","split","s","kLower","toLowerCase","stops","filter","Boolean","createGradient","specStr","fallbackColor","spec","length","st","join","ColorResolver","constructor","config","this","useColorMix","resolve","startsWith","customVar","getTextColor","backgroundColor","getHoverColor","baseColor","darkenAmount","colorResolver"],"mappings":"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"}

package/dist/helper/utils/size-resolver.js.map

@@ -1 +1 @@
-{"version":3,"file":"size-resolver.js","sources":["../../../src/helper/utils/size-resolver.ts"],"sourcesContent":[null],"names":["resolveRadius","input","map","none","sm","md","lg","full","Object","prototype","hasOwnProperty","call"],"mappings":"AAKM,SAAUA,EAAcC,GAC1B,MAAMC,EAA8B,CAClCC,KAAM,MACNC,GAAI,4BACJC,GAAI,8BACJC,GAAI,6BACJC,KAAM,UAER,OAAOC,OAAOC,UAAUC,eAAeC,KAAKT,EAAKD,GAC7CC,EAAID,GACJA,CACN"}
+{"version":3,"file":"size-resolver.js","sources":["../../../src/helper/utils/size-resolver.ts"],"sourcesContent":["/**\r\n * Resolves a radius input into a valid CSS radius value.\r\n * @param input - The radius input (`sm`, `md`, `lg`, `full`, `none`, or CSS length).\r\n * @returns The resolved CSS radius value.\r\n */\r\nexport function resolveRadius(input: string) {\r\n    const map: Record<string, string> = {\r\n      none: \"0px\",\r\n      sm: \"var(--sky-radius-primary)\",\r\n      md: \"var(--sky-radius-secondary)\",\r\n      lg: \"var(--sky-radius-tertiary)\",\r\n      full: \"9999px\",\r\n    };\r\n    return Object.prototype.hasOwnProperty.call(map, input)\r\n      ? map[input]\r\n      : input;\r\n  }"],"names":["resolveRadius","input","map","none","sm","md","lg","full","Object","prototype","hasOwnProperty","call"],"mappings":"AAKO,SAASA,EAAcC,GAC1B,MAAMC,EAA8B,CAClCC,KAAM,MACNC,GAAI,4BACJC,GAAI,8BACJC,GAAI,6BACJC,KAAM,UAER,OAAOC,OAAOC,UAAUC,eAAeC,KAAKT,EAAKD,GAC7CC,EAAID,GACJA,CACN"}

package/dist/sky-alert/sky-alert.js

@@ -1,4 +1,47 @@
-import{__decorate as t,__metadata as e}from"tslib";import{LitElement as r,css as i,html as o}from"lit";import{property as s,state as n,customElement as a}from"lit/decorators.js";import{styleMap as l}from"lit/directives/style-map.js";import{classMap as p}from"lit/directives/class-map.js";import{when as d}from"lit/directives/when.js";import{resolveRadius as c}from"../helper/utils/size-resolver.js";import{resolveColor as h,resolveTextColorForToken as g,resolveSemanticSurfaceKey as y,semanticSoftSurfaceTokens as v,tuneSurfaceVariantForDefaultColor as m,isDefaultColorToken as b,skyBorderPrimaryShorthand as x,hoverShade as f,fadeMix as u}from"../helper/utils/color-resolver.js";import{SkyIcon as k}from"../sky-icon/sky-icon.js";let z=class extends r{constructor(){super(...arguments),this.title="",this.message="",this.removable=!1,this.color="primary",this.size="md",this.radius="md",this.icon=null,this.strip="none",this.stripColor="currentColor",this.variant="solid",this.loading=!1,this.roleType="alert",this._styleVars={},this._sizeCache=null,this._hasActionsSlotContent=!1}static{this.dependencies={"sky-icon":k}}static{this.styles=i`
+import{css as t,LitElement as e,html as r}from"lit";import{property as i,state as o,customElement as s}from"lit/decorators.js";import{styleMap as n}from"lit/directives/style-map.js";import{classMap as a}from"lit/directives/class-map.js";import{when as l}from"lit/directives/when.js";import{resolveRadius as p}from"../helper/utils/size-resolver.js";import{resolveColor as d,resolveTextColorForToken as c,resolveSemanticSurfaceKey as h,semanticSoftSurfaceTokens as g,tuneSurfaceVariantForDefaultColor as y,isDefaultColorToken as v,skyBorderPrimaryShorthand as m,hoverShade as b,fadeMix as x}from"../helper/utils/color-resolver.js";import{SkyIcon as f}from"../sky-icon/sky-icon.js";var u=Object.defineProperty,k=Object.getOwnPropertyDescriptor,z=(t,e,r,i)=>{for(var o,s=i>1?void 0:i?k(e,r):e,n=t.length-1;n>=0;n--)(o=t[n])&&(s=(i?o(e,r,s):o(s))||s);return i&&s&&u(e,r,s),s};let S=class extends e{constructor(){super(...arguments),this.title="",this.message="",this.removable=!1,this.color="primary",this.size="md",this.radius="md",this.icon=null,this.strip="none",this.stripColor="currentColor",this.variant="solid",this.loading=!1,this.roleType="alert",this._styleVars={},this._sizeCache=null,this._hasActionsSlotContent=!1}_resolveSize(t){const e=String(t).trim();if(this._sizeCache&&this._sizeCache.size===e)return this._sizeCache.result;const r={xs:{padding:"3px 7px",titleFontSize:"12px",messageFontSize:"11px",gap:"4px",icon:"14px",closeSize:"18px",closeFontSize:"12px",spinner:"12px",stripWidth:"2px",minHeight:"28px"},sm:{padding:"5px 9px",titleFontSize:"14px",messageFontSize:"13px",gap:"6px",icon:"16px",closeSize:"20px",closeFontSize:"14px",spinner:"14px",stripWidth:"3px",minHeight:"32px"},md:{padding:"8px 12px",titleFontSize:"16px",messageFontSize:"14px",gap:"8px",icon:"20px",closeSize:"24px",closeFontSize:"16px",spinner:"16px",stripWidth:"4px",minHeight:"36px"},lg:{padding:"10px 14px",titleFontSize:"18px",messageFontSize:"15px",gap:"10px",icon:"22px",closeSize:"28px",closeFontSize:"18px",spinner:"18px",stripWidth:"5px",minHeight:"40px"},xl:{padding:"12px 16px",titleFontSize:"20px",messageFontSize:"16px",gap:"12px",icon:"24px",closeSize:"32px",closeFontSize:"20px",spinner:"20px",stripWidth:"6px",minHeight:"44px"}};if(r[t])return this._sizeCache={size:e,result:r[t]},r[t];const i=String(t).trim().match(/^([\d.]+)(px|rem|em)?$/i),o=i?.[2]||"px",s=i?parseFloat(i[1]):16,n=t=>`${Math.round(100*t)/100}${o}`,a=(t,e,r)=>Math.max(e,Math.min(r,t)),l=`${s}${o}`,p=a(.875*s,11,16),d=a(.5*s,3,12),c=a(.75*s,7,16),h=a(.5*s,4,12),g=a(1.25*s,14,24),y=a(1.5*s,18,32),v=a(1*s,12,20),m=a(1*s,12,20),b=a(.25*s,2,6),x=a(2.25*s,28,44);return{padding:`${n(d)} ${n(c)}`,titleFontSize:l,messageFontSize:n(p),gap:n(h),icon:n(g),closeSize:n(y),closeFontSize:n(v),spinner:n(m),stripWidth:n(b),minHeight:n(x)}}willUpdate(t){super.willUpdate(t),(t.has("color")||t.has("variant")||t.has("stripColor")||t.has("radius")||t.has("size"))&&this._updateStyleVars()}firstUpdated(){queueMicrotask(()=>this._checkActionsSlot())}_updateStyleVars(){const t=d(this.color),e=c(this.color),r="currentColor"===this.stripColor?t:d(this.stripColor),i=this._resolveSize(this.size),o=h(this.color),s={solid:{bg:t,color:e,border:"none"},flat:o?g(o):{bg:x(t,20),color:b(t,30),border:"none"},faded:o?g(o,{bordered:!0}):{bg:"var(--sky-hover-tertiary)",color:t,border:"1px solid var(--sky-text-tertiary)"},bordered:{bg:"transparent",color:o?`var(--sky-${o}-primary-dark)`:t,border:`2px solid ${t}`},light:{bg:"transparent",color:o?`var(--sky-${o}-primary-dark)`:t,border:"none"}},n=this.variant in s?this.variant:"flat";let a=y(this.color,n,s[n]);!v(this.color)||"flat"!==n&&"faded"!==n||(a={...a,bg:"var(--sky-glass-solid)",color:"var(--sky-text-primary)",border:"faded"===n?m():"none"});let l="var(--sky-hover-primary)",f="currentColor",u="var(--sky-hover-secondary)",k="currentColor";"solid"===n?(l=x(e,20),f=e,u=x(e,30),k=e):"flat"!==n&&"faded"!==n||(o?(l=`var(--sky-${o}-g0)`,f=a.color,u=`var(--sky-${o}-g1)`,k=a.color):v(this.color)?(l="var(--sky-hover-primary)",f=a.color,u="var(--sky-hover-secondary)",k=a.color):(l=x(t,15),f=a.color,u=x(t,25),k=a.color)),this._styleVars={"--alert-bg":a.bg,"--alert-color":a.color,"--alert-border":a.border,"--alert-radius":p(this.radius),"--alert-padding":i.padding,"--alert-gap":i.gap,"--alert-min-height":i.minHeight,"--title-font-size":i.titleFontSize,"--message-font-size":i.messageFontSize,"--icon-size":i.icon,"--close-size":i.closeSize,"--close-font-size":i.closeFontSize,"--spinner-size":i.spinner,"--strip-color":r,"--strip-width":i.stripWidth,"--close-bg":l,"--close-color":f,"--close-hover-bg":u,"--close-hover-color":k}}close(){const t=new CustomEvent("alert-closed",{detail:{title:this.title,message:this.message},bubbles:!0,composed:!0});this.dispatchEvent(t),this.remove()}getAriaRole(){return this.roleType}_checkActionsSlot(){const t=this.renderRoot?.querySelector('slot[name="actions"]');if(!t)return;const e=t.assignedNodes({flatten:!0}).some(t=>t.nodeType!==Node.TEXT_NODE||(t.textContent?.trim().length??0)>0);e!==this._hasActionsSlotContent&&(this._hasActionsSlotContent=e)}_onActionsSlotChange(t){const e=t.target.assignedNodes({flatten:!0}).some(t=>t.nodeType!==Node.TEXT_NODE||(t.textContent?.trim().length??0)>0);this._hasActionsSlotContent=e}render(){const t=this.getAriaRole(),e=a({alert:!0,[this.variant]:!0,"strip-start":"start"===this.strip||"both"===this.strip,"strip-end":"end"===this.strip||"both"===this.strip});return r`
+      <div
+        part="alert"
+        class=${e}
+        role="${t}"
+        aria-live="${"alert"===this.roleType?"assertive":"polite"}"
+        style=${n(this._styleVars)}
+      >
+        ${l(this.icon,()=>r`<sky-icon part="icon" class="icon" icon="${this.icon}"></sky-icon>`)}
+
+        <div part="content" class="content">
+          ${l(this.title,()=>r`<div part="title" class="title">${this.title}</div>`)}
+          ${l(this.message,()=>r`<p part="message" class="message">${this.message}</p>`,()=>r`<slot></slot>`)}
+        </div>
+
+        ${l(this._hasActionsSlotContent||this.removable,()=>r`
+            <div part="actions" class="actions">
+              <slot name="actions" @slotchange=${this._onActionsSlotChange}></slot>
+              ${l(this.removable,()=>r`
+                  <button
+                    part="close-button"
+                    class="close-button"
+                    type="button"
+                    @click=${this.close}
+                    aria-label="Dismiss alert"
+                    title="Dismiss"
+                  >
+                    <sky-icon icon="ion:close"></sky-icon>
+                  </button>
+                `)}
+            </div>
+          `,()=>r`
+            <div class="actions-slot-placeholder" aria-hidden="true">
+              <slot name="actions" @slotchange=${this._onActionsSlotChange}></slot>
+            </div>
+          `)}
+
+        ${l(this.loading,()=>r`
+            <div part="loading-overlay" class="loading-overlay">
+              <div part="loading-spinner" class="loading-spinner"></div>
+            </div>
+          `)}
+      </div>
+    `}};S.dependencies={"sky-icon":f},S.styles=t`
     :host {
       display: block;
       font-family: var(--sky-font);
@@ -235,48 +278,5 @@ import{__decorate as t,__metadata as e}from"tslib";import{LitElement as r,css as
         transform: translateY(0);
       }
     }
-  `}_resolveSize(t){const e=String(t).trim();if(this._sizeCache&&this._sizeCache.size===e)return this._sizeCache.result;const r={xs:{padding:"3px 7px",titleFontSize:"12px",messageFontSize:"11px",gap:"4px",icon:"14px",closeSize:"18px",closeFontSize:"12px",spinner:"12px",stripWidth:"2px",minHeight:"28px"},sm:{padding:"5px 9px",titleFontSize:"14px",messageFontSize:"13px",gap:"6px",icon:"16px",closeSize:"20px",closeFontSize:"14px",spinner:"14px",stripWidth:"3px",minHeight:"32px"},md:{padding:"8px 12px",titleFontSize:"16px",messageFontSize:"14px",gap:"8px",icon:"20px",closeSize:"24px",closeFontSize:"16px",spinner:"16px",stripWidth:"4px",minHeight:"36px"},lg:{padding:"10px 14px",titleFontSize:"18px",messageFontSize:"15px",gap:"10px",icon:"22px",closeSize:"28px",closeFontSize:"18px",spinner:"18px",stripWidth:"5px",minHeight:"40px"},xl:{padding:"12px 16px",titleFontSize:"20px",messageFontSize:"16px",gap:"12px",icon:"24px",closeSize:"32px",closeFontSize:"20px",spinner:"20px",stripWidth:"6px",minHeight:"44px"}};if(r[t])return this._sizeCache={size:e,result:r[t]},r[t];const i=String(t).trim().match(/^([\d.]+)(px|rem|em)?$/i),o=i?.[2]||"px",s=i?parseFloat(i[1]):16,n=t=>`${Math.round(100*t)/100}${o}`,a=(t,e,r)=>Math.max(e,Math.min(r,t)),l=`${s}${o}`,p=a(.875*s,11,16),d=a(.5*s,3,12),c=a(.75*s,7,16),h=a(.5*s,4,12),g=a(1.25*s,14,24),y=a(1.5*s,18,32),v=a(1*s,12,20),m=a(1*s,12,20),b=a(.25*s,2,6),x=a(2.25*s,28,44);return{padding:`${n(d)} ${n(c)}`,titleFontSize:l,messageFontSize:n(p),gap:n(h),icon:n(g),closeSize:n(y),closeFontSize:n(v),spinner:n(m),stripWidth:n(b),minHeight:n(x)}}willUpdate(t){super.willUpdate(t),(t.has("color")||t.has("variant")||t.has("stripColor")||t.has("radius")||t.has("size"))&&this._updateStyleVars()}firstUpdated(){queueMicrotask(()=>this._checkActionsSlot())}_updateStyleVars(){const t=h(this.color),e=g(this.color),r="currentColor"===this.stripColor?t:h(this.stripColor),i=this._resolveSize(this.size),o=y(this.color),s={solid:{bg:t,color:e,border:"none"},flat:o?v(o):{bg:u(t,20),color:f(t,30),border:"none"},faded:o?v(o,{bordered:!0}):{bg:"var(--sky-hover-tertiary)",color:t,border:"1px solid var(--sky-text-tertiary)"},bordered:{bg:"transparent",color:o?`var(--sky-${o}-primary-dark)`:t,border:`2px solid ${t}`},light:{bg:"transparent",color:o?`var(--sky-${o}-primary-dark)`:t,border:"none"}},n=this.variant in s?this.variant:"flat";let a=m(this.color,n,s[n]);!b(this.color)||"flat"!==n&&"faded"!==n||(a={...a,bg:"var(--sky-glass-solid)",color:"var(--sky-text-primary)",border:"faded"===n?x():"none"});let l="var(--sky-hover-primary)",p="currentColor",d="var(--sky-hover-secondary)",k="currentColor";"solid"===n?(l=u(e,20),p=e,d=u(e,30),k=e):"flat"!==n&&"faded"!==n||(o?(l=`var(--sky-${o}-g0)`,p=a.color,d=`var(--sky-${o}-g1)`,k=a.color):b(this.color)?(l="var(--sky-hover-primary)",p=a.color,d="var(--sky-hover-secondary)",k=a.color):(l=u(t,15),p=a.color,d=u(t,25),k=a.color)),this._styleVars={"--alert-bg":a.bg,"--alert-color":a.color,"--alert-border":a.border,"--alert-radius":c(this.radius),"--alert-padding":i.padding,"--alert-gap":i.gap,"--alert-min-height":i.minHeight,"--title-font-size":i.titleFontSize,"--message-font-size":i.messageFontSize,"--icon-size":i.icon,"--close-size":i.closeSize,"--close-font-size":i.closeFontSize,"--spinner-size":i.spinner,"--strip-color":r,"--strip-width":i.stripWidth,"--close-bg":l,"--close-color":p,"--close-hover-bg":d,"--close-hover-color":k}}close(){const t=new CustomEvent("alert-closed",{detail:{title:this.title,message:this.message},bubbles:!0,composed:!0});this.dispatchEvent(t),this.remove()}getAriaRole(){return this.roleType}_checkActionsSlot(){const t=this.renderRoot?.querySelector('slot[name="actions"]');if(!t)return;const e=t.assignedNodes({flatten:!0}).some(t=>t.nodeType!==Node.TEXT_NODE||(t.textContent?.trim().length??0)>0);e!==this._hasActionsSlotContent&&(this._hasActionsSlotContent=e)}_onActionsSlotChange(t){const e=t.target.assignedNodes({flatten:!0}).some(t=>t.nodeType!==Node.TEXT_NODE||(t.textContent?.trim().length??0)>0);this._hasActionsSlotContent=e}render(){const t=this.getAriaRole(),e=p({alert:!0,[this.variant]:!0,"strip-start":"start"===this.strip||"both"===this.strip,"strip-end":"end"===this.strip||"both"===this.strip});return o`
-      <div
-        part="alert"
-        class=${e}
-        role="${t}"
-        aria-live="${"alert"===this.roleType?"assertive":"polite"}"
-        style=${l(this._styleVars)}
-      >
-        ${d(this.icon,()=>o`<sky-icon part="icon" class="icon" icon="${this.icon}"></sky-icon>`)}
-
-        <div part="content" class="content">
-          ${d(this.title,()=>o`<div part="title" class="title">${this.title}</div>`)}
-          ${d(this.message,()=>o`<p part="message" class="message">${this.message}</p>`,()=>o`<slot></slot>`)}
-        </div>
-
-        ${d(this._hasActionsSlotContent||this.removable,()=>o`
-            <div part="actions" class="actions">
-              <slot name="actions" @slotchange=${this._onActionsSlotChange}></slot>
-              ${d(this.removable,()=>o`
-                  <button
-                    part="close-button"
-                    class="close-button"
-                    type="button"
-                    @click=${this.close}
-                    aria-label="Dismiss alert"
-                    title="Dismiss"
-                  >
-                    <sky-icon icon="ion:close"></sky-icon>
-                  </button>
-                `)}
-            </div>
-          `,()=>o`
-            <div class="actions-slot-placeholder" aria-hidden="true">
-              <slot name="actions" @slotchange=${this._onActionsSlotChange}></slot>
-            </div>
-          `)}
-
-        ${d(this.loading,()=>o`
-            <div part="loading-overlay" class="loading-overlay">
-              <div part="loading-spinner" class="loading-spinner"></div>
-            </div>
-          `)}
-      </div>
-    `}};t([s({type:String}),e("design:type",String)],z.prototype,"title",void 0),t([s({type:String}),e("design:type",String)],z.prototype,"message",void 0),t([s({type:Boolean}),e("design:type",Boolean)],z.prototype,"removable",void 0),t([s({type:String}),e("design:type",String)],z.prototype,"color",void 0),t([s({type:String}),e("design:type",String)],z.prototype,"size",void 0),t([s({type:String}),e("design:type",String)],z.prototype,"radius",void 0),t([s({type:String}),e("design:type",Object)],z.prototype,"icon",void 0),t([s({type:String,reflect:!0}),e("design:type",String)],z.prototype,"strip",void 0),t([s({type:String}),e("design:type",String)],z.prototype,"stripColor",void 0),t([s({type:String,reflect:!0}),e("design:type",String)],z.prototype,"variant",void 0),t([s({type:Boolean}),e("design:type",Boolean)],z.prototype,"loading",void 0),t([s({type:String,reflect:!0}),e("design:type",String)],z.prototype,"roleType",void 0),t([n(),e("design:type",Object)],z.prototype,"_hasActionsSlotContent",void 0),z=t([a("sky-alert")],z);export{z as SkyAlert};
+  `,z([i({type:String})],S.prototype,"title",2),z([i({type:String})],S.prototype,"message",2),z([i({type:Boolean})],S.prototype,"removable",2),z([i({type:String})],S.prototype,"color",2),z([i({type:String})],S.prototype,"size",2),z([i({type:String})],S.prototype,"radius",2),z([i({type:String})],S.prototype,"icon",2),z([i({type:String,reflect:!0})],S.prototype,"strip",2),z([i({type:String})],S.prototype,"stripColor",2),z([i({type:String,reflect:!0})],S.prototype,"variant",2),z([i({type:Boolean})],S.prototype,"loading",2),z([i({type:String,reflect:!0})],S.prototype,"roleType",2),z([o()],S.prototype,"_hasActionsSlotContent",2),S=z([s("sky-alert")],S);export{S as SkyAlert};
 //# sourceMappingURL=sky-alert.js.map

package/dist/sky-alert/sky-alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"sky-alert.js","sources":["../../src/sky-alert/sky-alert.ts"],"sourcesContent":[null],"names":["SkyAlert","LitElement","constructor","this","title","message","removable","color","size","radius","icon","strip","stripColor","variant","loading","roleType","_styleVars","_sizeCache","_hasActionsSlotContent","dependencies","SkyIcon","styles","css","_resolveSize","input","key","String","trim","result","presets","xs","padding","titleFontSize","messageFontSize","gap","closeSize","closeFontSize","spinner","stripWidth","minHeight","sm","md","lg","xl","m","match","unit","fsNum","parseFloat","to","n","Math","round","clamp","min","max","titleFs","messageFs","py","px","closeFont","willUpdate","changedProperties","super","has","_updateStyleVars","firstUpdated","queueMicrotask","_checkActionsSlot","baseColor","resolveColor","textColor","resolveTextColorForToken","stripColorResolved","s","semanticKey","resolveSemanticSurfaceKey","variantStyles","solid","bg","border","flat","semanticSoftSurfaceTokens","fadeMix","hoverShade","faded","bordered","light","currentVariant","v","tuneSurfaceVariantForDefaultColor","isDefaultColorToken","skyBorderPrimaryShorthand","closeBg","closeColor","closeHoverBg","closeHoverColor","resolveRadius","close","evt","CustomEvent","detail","bubbles","composed","dispatchEvent","remove","getAriaRole","slot","renderRoot","querySelector","hasContent","assignedNodes","flatten","some","nodeType","Node","TEXT_NODE","textContent","length","_onActionsSlotChange","e","target","render","roleAttr","alertClasses","classMap","alert","html","styleMap","when","__decorate","property","type","prototype","Boolean","reflect","state","customElement"],"mappings":"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"}
+{"version":3,"file":"sky-alert.js","sources":["../../src/sky-alert/sky-alert.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues } from \"lit\";\r\nimport { customElement, property, state } from \"lit/decorators.js\";\r\nimport { styleMap } from \"lit/directives/style-map.js\";\r\nimport { classMap } from \"lit/directives/class-map.js\";\r\nimport { when } from \"lit/directives/when.js\";\r\nimport { resolveRadius } from \"../helper/utils/size-resolver\";\r\nimport {\r\n  resolveColor,\r\n  resolveTextColorForToken,\r\n  fadeMix,\r\n  hoverShade,\r\n  isDefaultColorToken,\r\n  tuneSurfaceVariantForDefaultColor,\r\n  resolveSemanticSurfaceKey,\r\n  semanticSoftSurfaceTokens,\r\n  skyBorderPrimaryShorthand,\r\n} from \"../helper/utils/color-resolver\";\r\nimport { SkyIcon } from \"../sky-icon/sky-icon.js\";\r\n\r\nexport type SkyAlertClosedEventDetail = { title: string; message: string };\r\nexport type SkyAlertStrip = \"start\" | \"end\" | \"both\" | \"none\";\r\nexport type SkyAlertVariant = \"flat\" | \"bordered\" | \"light\" | \"faded\" | \"solid\";\r\nexport type SkyAlertRoleType = \"alert\" | \"alertdialog\";\r\n/** Resolved size metrics returned by `SkyAlert._resolveSize()`. */\r\ntype SkyAlertResolvedSize = {\r\n  padding: string;\r\n  titleFontSize: string;\r\n  messageFontSize: string;\r\n  gap: string;\r\n  icon: string;\r\n  closeSize: string;\r\n  closeFontSize: string;\r\n  spinner: string;\r\n  stripWidth: string;\r\n  minHeight: string;\r\n};\r\n\r\n/**\r\n * @element sky-alert\r\n *\r\n * @summary Status alert banner with variants, optional icon, strip accents, actions, dismiss behavior, and loading state.\r\n *\r\n * @status stable\r\n * @since 1.0.0\r\n *\r\n * @documentation https://library.sky-ui.com/components/alert\r\n * @dependency sky-icon\r\n *\r\n * @slot - Custom message content (used when `message` is empty).\r\n * @slot actions - Action buttons or links displayed on the trailing side.\r\n *\r\n * @property {string} title - Title text shown above the message.\r\n * @property {string} message - Message text rendered inside the alert.\r\n * @property {boolean} removable - Shows a dismiss button when enabled.\r\n * @property {string} color - Base color token or CSS color used by the alert.\r\n * @property {string} size - Preset size token (`xs | sm | md | lg | xl`) or CSS length.\r\n * @property {string} radius - Radius token or CSS length.\r\n * @property {string | null} icon - Optional leading icon name for `<sky-icon>`.\r\n * @property {SkyAlertStrip} strip - Strip accent placement.\r\n * @property {string} stripColor - Strip accent color token or CSS color.\r\n * @property {SkyAlertVariant} variant - Visual style variant.\r\n * @property {boolean} loading - Shows a loading overlay.\r\n * @property {SkyAlertRoleType} roleType - ARIA role for the alert container.\r\n * @method close Dispatches `alert-closed` and removes the alert from the DOM.\r\n *\r\n * @fires {CustomEvent<SkyAlertClosedEventDetail>} alert-closed - Fired when the alert is dismissed via the close button; bubbles and is composed.\r\n *\r\n * @csspart alert - The outer alert container.\r\n * @csspart icon - The optional leading icon.\r\n * @csspart content - The content container (title + message/slot).\r\n * @csspart title - The title text element.\r\n * @csspart message - The message text element (when `message` is provided).\r\n * @csspart actions - The trailing actions container.\r\n * @csspart close-button - The dismiss button (when `removable`).\r\n * @csspart loading-overlay - Overlay shown when `loading` is true.\r\n * @csspart loading-spinner - Spinner element shown inside the loading overlay.\r\n *\r\n * @Behavior\r\n * - `message` content takes priority over default-slot message content.\r\n * - Dismissing a removable alert dispatches `alert-closed` and removes the element.\r\n * - `strip` controls accent placement (`start`, `end`, `both`, `none`).\r\n * - `role-type=\"alert\"` maps to `aria-live=\"assertive\"`; `alertdialog` maps to `aria-live=\"polite\"`.\r\n * - Respects reduced motion preferences for entry, button hover rotation, and spinner animation.\r\n *\r\n * @example\r\n * ```html\r\n * <sky-alert title=\"Upload Complete\" message=\"Your file is now available.\" variant=\"bordered\" strip=\"start\" removable>\r\n *   <button slot=\"actions\">View</button>\r\n * </sky-alert>\r\n * ```\r\n * ```vue\r\n * <template>\r\n *   <sky-alert title=\"Upload Complete\" message=\"Your file is now available.\" variant=\"bordered\" strip=\"start\" removable>\r\n *     <button slot=\"actions\">View</button>\r\n *   </sky-alert>\r\n * </template>\r\n * ```\r\n * ```jsx\r\n * export default function Demo() {\r\n *   return (\r\n *     <sky-alert title=\"Upload Complete\" message=\"Your file is now available.\" variant=\"bordered\" strip=\"start\" removable>\r\n *       <button slot=\"actions\">View</button>\r\n *     </sky-alert>\r\n *   );\r\n * }\r\n * ```\r\n */\r\n\r\n@customElement(\"sky-alert\")\r\nexport class SkyAlert extends LitElement {\r\n\r\n  static dependencies: Record<string, CustomElementConstructor> = {\r\n    \"sky-icon\": SkyIcon,\r\n  };\r\n\r\n  /** Title text displayed above the message. @default \"\" */\r\n  @property({ type: String }) title: string = \"\";\r\n\r\n  /** Message text displayed inside the alert. @default \"\" */\r\n  @property({ type: String }) message: string = \"\";\r\n\r\n  /** Shows a close button that dismisses the alert. @default false */\r\n  @property({ type: Boolean }) removable: boolean = false;\r\n\r\n  /** Base color token or CSS color. @default \"primary\" */\r\n  @property({ type: String }) color: string = \"primary\";\r\n\r\n  /** Size token (`xs | sm | md | lg | xl`) or CSS length. @default \"md\" */\r\n  @property({ type: String }) size: string = \"md\";\r\n\r\n  /** Radius token or CSS length. @default \"md\" */\r\n  @property({ type: String }) radius: string = \"md\";\r\n\r\n  /** Optional leading icon name for `<sky-icon>`. @default null */\r\n  @property({ type: String }) icon: string | null = null;\r\n\r\n  /** Strip accent position. @default \"none\" */\r\n  @property({ type: String, reflect: true }) strip: SkyAlertStrip = \"none\";\r\n\r\n  /** Strip accent color. @default \"currentColor\" */\r\n  @property({ type: String })\r\n  stripColor: string = \"currentColor\";\r\n\r\n  /** Visual style variant. @default \"solid\" */\r\n  @property({ type: String, reflect: true })\r\n  variant: SkyAlertVariant = \"solid\";\r\n\r\n  /** Shows a loading overlay. @default false */\r\n  @property({ type: Boolean }) loading: boolean = false;\r\n\r\n  /** ARIA role applied to the alert container. @default \"alert\" */\r\n  @property({ type: String, reflect: true })\r\n  roleType: SkyAlertRoleType = \"alert\";\r\n\r\n  /** Internal style variables */\r\n  private _styleVars: Record<string, string> = {};\r\n\r\n  /** Cached result of _resolveSize for the last `size` value (avoids recomputing when only color/variant change). */\r\n  private _sizeCache: { size: string; result: SkyAlertResolvedSize } | null = null;\r\n\r\n  /** True when the actions slot has assigned content (used to show separator only when needed). */\r\n  @state() private _hasActionsSlotContent = false;\r\n\r\n  static override styles = css`\r\n    :host {\r\n      display: block;\r\n      font-family: var(--sky-font);\r\n      width: 100%;\r\n    }\r\n\r\n    .alert {\r\n      position: relative;\r\n      width: 100%;\r\n      box-sizing: border-box;\r\n      display: flex;\r\n      align-items: stretch;\r\n      gap: var(--alert-gap, var(--sky-space-2, 8px));\r\n      padding: var(--alert-padding);\r\n      border-radius: var(--alert-radius);\r\n      border: var(--alert-border, none);\r\n      color: var(--alert-color, var(--sky-text-primary));\r\n      background-color: var(--alert-bg, transparent);\r\n      backdrop-filter: none;\r\n      -webkit-backdrop-filter: none;\r\n      transition: var(--sky-transition-default);\r\n      min-height: var(--alert-min-height, 36px);\r\n      animation: skyc-fade-in var(--sky-duration-fast, 120ms) var(--sky-ease-out, ease-out);\r\n    }\r\n\r\n    /* Strip styles (logical properties for RTL) */\r\n    .alert.strip-start::before,\r\n    .alert.strip-end::after {\r\n      content: \"\";\r\n      position: absolute;\r\n      top: 0;\r\n      bottom: 0;\r\n      width: var(--strip-width, 4px);\r\n      background: var(--strip-color, currentColor);\r\n      z-index: 1;\r\n    }\r\n\r\n    .alert.strip-start::before {\r\n      inset-inline-start: 0;\r\n      border-start-start-radius: inherit;\r\n      border-end-start-radius: inherit;\r\n    }\r\n\r\n    .alert.strip-end::after {\r\n      inset-inline-end: 0;\r\n      border-start-end-radius: inherit;\r\n      border-end-end-radius: inherit;\r\n    }\r\n\r\n    .alert.strip-start {\r\n      border-start-start-radius: 0 !important;\r\n      border-end-start-radius: 0 !important;\r\n    }\r\n    .alert.strip-end {\r\n      border-start-end-radius: 0 !important;\r\n      border-end-end-radius: 0 !important;\r\n    }\r\n\r\n    .alert.strip-start.strip-end {\r\n      border-radius: 0 !important;\r\n    }\r\n\r\n    /* Remove borders on strip sides */\r\n    .alert.strip-start.bordered {\r\n      border-inline-start: none !important;\r\n    }\r\n    .alert.strip-end.bordered {\r\n      border-inline-end: none !important;\r\n    }\r\n    .alert.strip-start.strip-end.bordered {\r\n      border-inline-start: none !important;\r\n      border-inline-end: none !important;\r\n    }\r\n\r\n    .alert.faded.strip-start {\r\n      border-inline-start: none !important;\r\n    }\r\n    .alert.faded.strip-end {\r\n      border-inline-end: none !important;\r\n    }\r\n    .alert.faded.strip-start.strip-end {\r\n      border-inline-start: none !important;\r\n      border-inline-end: none !important;\r\n    }\r\n\r\n    .icon {\r\n      align-self: flex-start;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      font-size: var(--icon-size, 20px);\r\n      color: inherit;\r\n      flex-shrink: 0;\r\n      padding-block-start: 2px;\r\n    }\r\n\r\n    .content {\r\n      flex: 1 1 auto;\r\n      min-width: 0;\r\n      display: flex;\r\n      flex-direction: column;\r\n      justify-content: center;\r\n    }\r\n\r\n    .title {\r\n      font: var(--sky-text-title);\r\n      font-size: var(--title-font-size);\r\n      color: inherit;\r\n      margin: 0 0 var(--sky-space-1, 4px) 0;\r\n    }\r\n\r\n    .message {\r\n      margin: 0;\r\n      text-align: start;\r\n      font: var(--sky-text-body);\r\n      font-size: var(--message-font-size);\r\n      color: inherit;\r\n    }\r\n\r\n    ::slotted(*) {\r\n      font: var(--sky-text-body);\r\n      font-size: var(--message-font-size);\r\n    }\r\n\r\n    .actions {\r\n      display: inline-flex;\r\n      gap: var(--sky-space-2, 8px);\r\n      align-items: center;\r\n      justify-content: flex-end;\r\n      flex: 0 0 auto;\r\n      align-self: stretch;\r\n      border-inline-start: 1px solid var(--sky-border-light);\r\n      padding-inline-start: var(--sky-space-2, 8px);\r\n      margin-inline-start: var(--sky-space-1, 4px);\r\n    }\r\n\r\n    .actions-slot-placeholder {\r\n      position: absolute;\r\n      width: 0;\r\n      height: 0;\r\n      overflow: hidden;\r\n      opacity: 0;\r\n      pointer-events: none;\r\n    }\r\n\r\n    .close-button {\r\n      margin-inline-start: var(--sky-space-1\\\\.5, 6px);\r\n      display: inline-flex;\r\n      aspect-ratio: 1 / 1;\r\n      justify-content: center;\r\n      align-items: center;\r\n      width: var(--close-size, 24px);\r\n      height: var(--close-size, 24px);\r\n      box-sizing: border-box;\r\n      background: var(--close-bg, var(--sky-hover-primary));\r\n      border: none;\r\n      border-radius: var(--sky-radius-full, 50%);\r\n      font-size: var(--close-font-size, 16px);\r\n      cursor: pointer;\r\n      font-weight: var(--sky-font-weight-bold, 700);\r\n      color: var(--close-color, currentColor);\r\n      transition: var(--sky-transition-fast);\r\n      -webkit-tap-highlight-color: transparent;\r\n    }\r\n\r\n    .close-button:hover {\r\n      transform: rotate(90deg);\r\n      background: var(--close-hover-bg, var(--sky-hover-secondary));\r\n      color: var(--close-hover-color, currentColor);\r\n    }\r\n\r\n    .close-button:focus-visible {\r\n      outline: none;\r\n      box-shadow: var(--sky-focus-ring);\r\n      background: var(--close-hover-bg, var(--sky-hover-secondary));\r\n      color: var(--close-hover-color, currentColor);\r\n    }\r\n\r\n    .loading-overlay {\r\n      position: absolute;\r\n      inset: 0;\r\n      display: flex;\r\n      align-items: center;\r\n      justify-content: center;\r\n      background: var(--sky-overlay-secondary);\r\n      border-radius: inherit;\r\n      backdrop-filter: none;\r\n      -webkit-backdrop-filter: none;\r\n      z-index: 2;\r\n    }\r\n\r\n    .loading-spinner {\r\n      width: var(--spinner-size, 16px);\r\n      height: var(--spinner-size, 16px);\r\n      border: 2px solid currentColor;\r\n      border-top-color: transparent;\r\n      border-radius: var(--sky-radius-full, 50%);\r\n      animation: skyc-spin 0.8s linear infinite;\r\n    }\r\n\r\n    @media (prefers-reduced-motion: reduce) {\r\n      .alert {\r\n        animation: none;\r\n        transition: none;\r\n      }\r\n\r\n      .close-button {\r\n        transition: none;\r\n      }\r\n\r\n      .close-button:hover,\r\n      .close-button:focus-visible {\r\n        transform: none;\r\n      }\r\n\r\n      .loading-spinner {\r\n        animation: none;\r\n      }\r\n    }\r\n\r\n    @keyframes skyc-spin {\r\n      to {\r\n        transform: rotate(360deg);\r\n      }\r\n    }\r\n\r\n    @keyframes skyc-fade-in {\r\n      from {\r\n        opacity: 0;\r\n        transform: translateY(-2px);\r\n      }\r\n      to {\r\n        opacity: 1;\r\n        transform: translateY(0);\r\n      }\r\n    }\r\n  `;\r\n\r\n  /**\r\n   * Resolves size to get padding, font sizes, and other metrics.\r\n   * Result is memoized by `size` to avoid recomputing when only color/variant/radius change.\r\n   */\r\n  private _resolveSize(input: string): SkyAlertResolvedSize {\r\n    const key = String(input).trim();\r\n    if (this._sizeCache && this._sizeCache.size === key) return this._sizeCache.result;\r\n\r\n    const presets: Record<\r\n      string,\r\n      {\r\n        padding: string;\r\n        titleFontSize: string;\r\n        messageFontSize: string;\r\n        gap: string;\r\n        icon: string;\r\n        closeSize: string;\r\n        closeFontSize: string;\r\n        spinner: string;\r\n        stripWidth: string;\r\n        minHeight: string;\r\n      }\r\n    > = {\r\n      xs: {\r\n        padding: \"3px 7px\",\r\n        titleFontSize: \"12px\",\r\n        messageFontSize: \"11px\",\r\n        gap: \"4px\",\r\n        icon: \"14px\",\r\n        closeSize: \"18px\",\r\n        closeFontSize: \"12px\",\r\n        spinner: \"12px\",\r\n        stripWidth: \"2px\",\r\n        minHeight: \"28px\",\r\n      },\r\n      sm: {\r\n        padding: \"5px 9px\",\r\n        titleFontSize: \"14px\",\r\n        messageFontSize: \"13px\",\r\n        gap: \"6px\",\r\n        icon: \"16px\",\r\n        closeSize: \"20px\",\r\n        closeFontSize: \"14px\",\r\n        spinner: \"14px\",\r\n        stripWidth: \"3px\",\r\n        minHeight: \"32px\",\r\n      },\r\n      md: {\r\n        padding: \"8px 12px\",\r\n        titleFontSize: \"16px\",\r\n        messageFontSize: \"14px\",\r\n        gap: \"8px\",\r\n        icon: \"20px\",\r\n        closeSize: \"24px\",\r\n        closeFontSize: \"16px\",\r\n        spinner: \"16px\",\r\n        stripWidth: \"4px\",\r\n        minHeight: \"36px\",\r\n      },\r\n      lg: {\r\n        padding: \"10px 14px\",\r\n        titleFontSize: \"18px\",\r\n        messageFontSize: \"15px\",\r\n        gap: \"10px\",\r\n        icon: \"22px\",\r\n        closeSize: \"28px\",\r\n        closeFontSize: \"18px\",\r\n        spinner: \"18px\",\r\n        stripWidth: \"5px\",\r\n        minHeight: \"40px\",\r\n      },\r\n      xl: {\r\n        padding: \"12px 16px\",\r\n        titleFontSize: \"20px\",\r\n        messageFontSize: \"16px\",\r\n        gap: \"12px\",\r\n        icon: \"24px\",\r\n        closeSize: \"32px\",\r\n        closeFontSize: \"20px\",\r\n        spinner: \"20px\",\r\n        stripWidth: \"6px\",\r\n        minHeight: \"44px\",\r\n      },\r\n    };\r\n\r\n    if (presets[input]) {\r\n      this._sizeCache = { size: key, result: presets[input] };\r\n      return presets[input];\r\n    }\r\n\r\n    const m = String(input)\r\n      .trim()\r\n      .match(/^([\\d.]+)(px|rem|em)?$/i);\r\n    const unit = m?.[2] || \"px\";\r\n    const fsNum = m ? parseFloat(m[1]) : 16;\r\n    const fs = `${fsNum}${unit}`;\r\n\r\n    const to = (n: number) => `${Math.round(n * 100) / 100}${unit}`;\r\n    const clamp = (n: number, min: number, max: number) =>\r\n      Math.max(min, Math.min(max, n));\r\n\r\n    const titleFs = fs;\r\n    const messageFs = clamp(fsNum * 0.875, 11, 16);\r\n    const py = clamp(fsNum * 0.5, 3, 12);\r\n    const px = clamp(fsNum * 0.75, 7, 16);\r\n    const gap = clamp(fsNum * 0.5, 4, 12);\r\n    const icon = clamp(fsNum * 1.25, 14, 24);\r\n    const closeSize = clamp(fsNum * 1.5, 18, 32);\r\n    const closeFont = clamp(fsNum * 1, 12, 20);\r\n    const spinner = clamp(fsNum * 1, 12, 20);\r\n    const stripWidth = clamp(fsNum * 0.25, 2, 6);\r\n    const minHeight = clamp(fsNum * 2.25, 28, 44);\r\n\r\n    return {\r\n      padding: `${to(py)} ${to(px)}`,\r\n      titleFontSize: titleFs,\r\n      messageFontSize: to(messageFs),\r\n      gap: to(gap),\r\n      icon: to(icon),\r\n      closeSize: to(closeSize),\r\n      closeFontSize: to(closeFont),\r\n      spinner: to(spinner),\r\n      stripWidth: to(stripWidth),\r\n      minHeight: to(minHeight),\r\n    };\r\n  }\r\n\r\n  /** Recomputes style variables when visual inputs change. */\r\n  override willUpdate(changedProperties: PropertyValues): void {\r\n    super.willUpdate(changedProperties);\r\n\r\n    if (\r\n      changedProperties.has(\"color\") ||\r\n      changedProperties.has(\"variant\") ||\r\n      changedProperties.has(\"stripColor\") ||\r\n      changedProperties.has(\"radius\") ||\r\n      changedProperties.has(\"size\")\r\n    ) {\r\n      this._updateStyleVars();\r\n    }\r\n  }\r\n\r\n  /** Initializes actions-slot presence state after first render. */\r\n  override firstUpdated(): void {\r\n    queueMicrotask(() => this._checkActionsSlot());\r\n  }\r\n\r\n  /** Computes CSS custom properties from current variant, size, and color inputs. */\r\n  private _updateStyleVars(): void {\r\n    const baseColor = resolveColor(this.color);\r\n    const textColor = resolveTextColorForToken(this.color);\r\n    const stripColorResolved = this.stripColor === \"currentColor\"\r\n      ? baseColor\r\n      : resolveColor(this.stripColor);\r\n\r\n    const s = this._resolveSize(this.size);\r\n\r\n    const semanticKey = resolveSemanticSurfaceKey(this.color);\r\n\r\n    const variantStyles = {\r\n      solid: {\r\n        bg: baseColor,\r\n        color: textColor,\r\n        border: \"none\",\r\n      },\r\n      flat: semanticKey\r\n        ? semanticSoftSurfaceTokens(semanticKey)\r\n        : {\r\n            bg: fadeMix(baseColor, 20),\r\n            color: hoverShade(baseColor, 30),\r\n            border: \"none\",\r\n          },\r\n      faded: semanticKey\r\n        ? semanticSoftSurfaceTokens(semanticKey, { bordered: true })\r\n        : {\r\n            bg: \"var(--sky-hover-tertiary)\",\r\n            color: baseColor,\r\n            border: \"1px solid var(--sky-text-tertiary)\",\r\n          },\r\n      bordered: {\r\n        bg: \"transparent\",\r\n        color: semanticKey\r\n          ? `var(--sky-${semanticKey}-primary-dark)`\r\n          : baseColor,\r\n        border: `2px solid ${baseColor}`,\r\n      },\r\n      light: {\r\n        bg: \"transparent\",\r\n        color: semanticKey\r\n          ? `var(--sky-${semanticKey}-primary-dark)`\r\n          : baseColor,\r\n        border: \"none\",\r\n      },\r\n    } as const;\r\n\r\n    const currentVariant = this.variant in variantStyles\r\n      ? this.variant as keyof typeof variantStyles\r\n      : \"flat\";\r\n\r\n    let v = tuneSurfaceVariantForDefaultColor(\r\n      this.color,\r\n      currentVariant,\r\n      variantStyles[currentVariant],\r\n    );\r\n\r\n    if (\r\n      isDefaultColorToken(this.color) &&\r\n      (currentVariant === \"flat\" || currentVariant === \"faded\")\r\n    ) {\r\n      v = {\r\n        ...v,\r\n        bg: \"var(--sky-glass-solid)\",\r\n        color: \"var(--sky-text-primary)\",\r\n        border: currentVariant === \"faded\" ? skyBorderPrimaryShorthand() : \"none\",\r\n      };\r\n    }\r\n\r\n    let closeBg = \"var(--sky-hover-primary)\";\r\n    let closeColor = \"currentColor\";\r\n    let closeHoverBg = \"var(--sky-hover-secondary)\";\r\n    let closeHoverColor = \"currentColor\";\r\n\r\n    if (currentVariant === \"solid\") {\r\n      closeBg = fadeMix(textColor, 20);\r\n      closeColor = textColor;\r\n      closeHoverBg = fadeMix(textColor, 30);\r\n      closeHoverColor = textColor;\r\n    } else if (currentVariant === \"flat\" || currentVariant === \"faded\") {\r\n      if (semanticKey) {\r\n        closeBg = `var(--sky-${semanticKey}-g0)`;\r\n        closeColor = v.color;\r\n        closeHoverBg = `var(--sky-${semanticKey}-g1)`;\r\n        closeHoverColor = v.color;\r\n      } else if (isDefaultColorToken(this.color)) {\r\n        closeBg = \"var(--sky-hover-primary)\";\r\n        closeColor = v.color;\r\n        closeHoverBg = \"var(--sky-hover-secondary)\";\r\n        closeHoverColor = v.color;\r\n      } else {\r\n        closeBg = fadeMix(baseColor, 15);\r\n        closeColor = v.color;\r\n        closeHoverBg = fadeMix(baseColor, 25);\r\n        closeHoverColor = v.color;\r\n      }\r\n    }\r\n\r\n    this._styleVars = {\r\n      \"--alert-bg\": v.bg,\r\n      \"--alert-color\": v.color,\r\n      \"--alert-border\": v.border,\r\n      \"--alert-radius\": resolveRadius(this.radius),\r\n      \"--alert-padding\": s.padding,\r\n      \"--alert-gap\": s.gap,\r\n      \"--alert-min-height\": s.minHeight,\r\n      \"--title-font-size\": s.titleFontSize,\r\n      \"--message-font-size\": s.messageFontSize,\r\n      \"--icon-size\": s.icon,\r\n      \"--close-size\": s.closeSize,\r\n      \"--close-font-size\": s.closeFontSize,\r\n      \"--spinner-size\": s.spinner,\r\n      \"--strip-color\": stripColorResolved,\r\n      \"--strip-width\": s.stripWidth,\r\n      \"--close-bg\": closeBg,\r\n      \"--close-color\": closeColor,\r\n      \"--close-hover-bg\": closeHoverBg,\r\n      \"--close-hover-color\": closeHoverColor,\r\n    };\r\n  }\r\n\r\n  /**\r\n   * Dispatches `alert-closed` and removes the alert from the DOM.\r\n   *\r\n   * @returns {void}\r\n   */\r\n  public close(): void {\r\n    const evt = new CustomEvent<SkyAlertClosedEventDetail>(\"alert-closed\", {\r\n      detail: { title: this.title, message: this.message },\r\n      bubbles: true,\r\n      composed: true,\r\n    });\r\n    this.dispatchEvent(evt);\r\n    this.remove();\r\n  }\r\n\r\n  /** Returns the ARIA role applied to the alert container. */\r\n  private getAriaRole(): SkyAlertRoleType {\r\n    return this.roleType;\r\n  }\r\n\r\n  /** Checks whether the actions slot currently has meaningful assigned content. */\r\n  private _checkActionsSlot(): void {\r\n    const slot = this.renderRoot?.querySelector<HTMLSlotElement>('slot[name=\"actions\"]');\r\n    if (!slot) return;\r\n    const nodes = slot.assignedNodes({ flatten: true });\r\n    const hasContent = nodes.some(\r\n      (n) => n.nodeType !== Node.TEXT_NODE || (n.textContent?.trim().length ?? 0) > 0,\r\n    );\r\n    if (hasContent !== this._hasActionsSlotContent) {\r\n      this._hasActionsSlotContent = hasContent;\r\n    }\r\n  }\r\n\r\n  /** Updates action-slot state when the slot assignment changes. */\r\n  private _onActionsSlotChange(e: Event): void {\r\n    const slot = e.target as HTMLSlotElement;\r\n    const nodes = slot.assignedNodes({ flatten: true });\r\n    const hasContent = nodes.some(\r\n      (n) => n.nodeType !== Node.TEXT_NODE || (n.textContent?.trim().length ?? 0) > 0,\r\n    );\r\n    this._hasActionsSlotContent = hasContent;\r\n  }\r\n\r\n  override render() {\r\n    const roleAttr = this.getAriaRole();\r\n    const alertClasses = classMap({\r\n      alert: true,\r\n      [this.variant]: true,\r\n      \"strip-start\": this.strip === \"start\" || this.strip === \"both\",\r\n      \"strip-end\": this.strip === \"end\" || this.strip === \"both\",\r\n    });\r\n\r\n    return html`\r\n      <div\r\n        part=\"alert\"\r\n        class=${alertClasses}\r\n        role=\"${roleAttr}\"\r\n        aria-live=\"${this.roleType === \"alert\" ? \"assertive\" : \"polite\"}\"\r\n        style=${styleMap(this._styleVars)}\r\n      >\r\n        ${when(\r\n          this.icon,\r\n          () => html`<sky-icon part=\"icon\" class=\"icon\" icon=\"${this.icon!}\"></sky-icon>`,\r\n        )}\r\n\r\n        <div part=\"content\" class=\"content\">\r\n          ${when(\r\n            this.title,\r\n            () => html`<div part=\"title\" class=\"title\">${this.title}</div>`,\r\n          )}\r\n          ${when(\r\n            this.message,\r\n            () => html`<p part=\"message\" class=\"message\">${this.message}</p>`,\r\n            () => html`<slot></slot>`,\r\n          )}\r\n        </div>\r\n\r\n        ${when(\r\n          this._hasActionsSlotContent || this.removable,\r\n          () => html`\r\n            <div part=\"actions\" class=\"actions\">\r\n              <slot name=\"actions\" @slotchange=${this._onActionsSlotChange}></slot>\r\n              ${when(\r\n                this.removable,\r\n                () => html`\r\n                  <button\r\n                    part=\"close-button\"\r\n                    class=\"close-button\"\r\n                    type=\"button\"\r\n                    @click=${this.close}\r\n                    aria-label=\"Dismiss alert\"\r\n                    title=\"Dismiss\"\r\n                  >\r\n                    <sky-icon icon=\"ion:close\"></sky-icon>\r\n                  </button>\r\n                `,\r\n              )}\r\n            </div>\r\n          `,\r\n          () => html`\r\n            <div class=\"actions-slot-placeholder\" aria-hidden=\"true\">\r\n              <slot name=\"actions\" @slotchange=${this._onActionsSlotChange}></slot>\r\n            </div>\r\n          `,\r\n        )}\r\n\r\n        ${when(\r\n          this.loading,\r\n          () => html`\r\n            <div part=\"loading-overlay\" class=\"loading-overlay\">\r\n              <div part=\"loading-spinner\" class=\"loading-spinner\"></div>\r\n            </div>\r\n          `,\r\n        )}\r\n      </div>\r\n    `;\r\n  }\r\n}"],"names":["SkyAlert","LitElement","constructor","super","arguments","this","title","message","removable","color","size","radius","icon","strip","stripColor","variant","loading","roleType","_styleVars","_sizeCache","_hasActionsSlotContent","_resolveSize","input","key","String","trim","result","presets","xs","padding","titleFontSize","messageFontSize","gap","closeSize","closeFontSize","spinner","stripWidth","minHeight","sm","md","lg","xl","m","match","unit","fsNum","parseFloat","to","n","Math","round","clamp","min","max","titleFs","messageFs","py","px","closeFont","willUpdate","changedProperties","has","_updateStyleVars","firstUpdated","queueMicrotask","_checkActionsSlot","baseColor","resolveColor","textColor","resolveTextColorForToken","stripColorResolved","s","semanticKey","resolveSemanticSurfaceKey","variantStyles","solid","bg","border","flat","semanticSoftSurfaceTokens","fadeMix","hoverShade","faded","bordered","light","currentVariant","v","tuneSurfaceVariantForDefaultColor","isDefaultColorToken","skyBorderPrimaryShorthand","closeBg","closeColor","closeHoverBg","closeHoverColor","resolveRadius","close","evt","CustomEvent","detail","bubbles","composed","dispatchEvent","remove","getAriaRole","slot","renderRoot","querySelector","hasContent","assignedNodes","flatten","some","nodeType","Node","TEXT_NODE","textContent","length","_onActionsSlotChange","e","target","render","roleAttr","alertClasses","classMap","alert","html","styleMap","when","dependencies","SkyIcon","styles","css","__decorateClass","property","type","prototype","Boolean","reflect","state","customElement"],"mappings":"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"}

package/dist/sky-appbar/sky-appbar.js

@@ -1,4 +1,32 @@
-import{__decorate as t,__metadata as e}from"tslib";import{LitElement as o,css as r,nothing as a,html as i}from"lit";import{property as s,customElement as n}from"lit/decorators.js";import{isDefaultColorToken as l,resolveColor as d,resolveTextColorForToken as c}from"../helper/utils/color-resolver.js";import{SkyIcon as p}from"../sky-icon/sky-icon.js";let b=class extends o{constructor(){super(...arguments),this.title="App Bar",this.color="default",this.url="",this.banner=!0,this.dense=!1,this.elevated=!1,this.leadingLabel="Open menu"}static{this.dependencies={"sky-icon":p}}static{this.styles=r`
+import{css as t,LitElement as e,nothing as r,html as o}from"lit";import{property as a,customElement as n}from"lit/decorators.js";import{isDefaultColorToken as i,resolveColor as s,resolveTextColorForToken as l}from"../helper/utils/color-resolver.js";import{SkyIcon as d}from"../sky-icon/sky-icon.js";var c=Object.defineProperty,p=Object.getOwnPropertyDescriptor,b=(t,e,r,o)=>{for(var a,n=o>1?void 0:o?p(e,r):e,i=t.length-1;i>=0;i--)(a=t[i])&&(n=(o?a(e,r,n):a(n))||n);return o&&n&&c(e,r,n),n};let y=class extends e{constructor(){super(...arguments),this.title="App Bar",this.color="default",this.url="",this.banner=!0,this.dense=!1,this.elevated=!1,this.leadingLabel="Open menu"}_applyColorSurface(){if(!i(this.color))return this.setAttribute("data-surface","solid"),this.style.setProperty("--appbar-bg-color",s(this.color)),void this.style.setProperty("--appbar-text-color",l(this.color));this.removeAttribute("data-surface"),this.style.removeProperty("--appbar-bg-color"),this.style.removeProperty("--appbar-text-color")}connectedCallback(){super.connectedCallback(),this._applyColorSurface(),this._applyBackgroundImage()}_applyBackgroundImage(){const t=this.url?`url(${this.url})`:"none";this.style.setProperty("--appbar-bg-image",t)}updated(t){t.has("color")&&this._applyColorSurface(),t.has("url")&&this._applyBackgroundImage()}render(){return o`
+      ${this.url?o`
+            <div class="background" aria-hidden="true"></div>
+            <div class="background-overlay" aria-hidden="true"></div>
+          `:r}
+      <div
+        class="content"
+        part="content"
+        role="${this.banner?"banner":"group"}"
+      >
+        <div class="leading" part="leading">
+          <slot name="button">
+            <button
+              type="button"
+              class="leading-button"
+              aria-label="${this.leadingLabel}"
+            >
+              <sky-icon class="icon" icon="mdi:menu"></sky-icon>
+            </button>
+          </slot>
+        </div>
+        <div class="title-area" part="title">
+          <span class="title-text">${this.title}</span>
+        </div>
+        <div class="actions" part="actions">
+          <slot></slot>
+        </div>
+      </div>
+    `}};y.dependencies={"sky-icon":d},y.styles=t`
     :host {
       width: 100%;
       display: flex;
@@ -183,33 +211,5 @@ import{__decorate as t,__metadata as e}from"tslib";import{LitElement as o,css as
       }
     }
 
-  `}_applyColorSurface(){if(!l(this.color))return this.setAttribute("data-surface","solid"),this.style.setProperty("--appbar-bg-color",d(this.color)),void this.style.setProperty("--appbar-text-color",c(this.color));this.removeAttribute("data-surface"),this.style.removeProperty("--appbar-bg-color"),this.style.removeProperty("--appbar-text-color")}connectedCallback(){super.connectedCallback(),this._applyColorSurface(),this._applyBackgroundImage()}_applyBackgroundImage(){const t=this.url?`url(${this.url})`:"none";this.style.setProperty("--appbar-bg-image",t)}updated(t){t.has("color")&&this._applyColorSurface(),t.has("url")&&this._applyBackgroundImage()}render(){return i`
-      ${this.url?i`
-            <div class="background" aria-hidden="true"></div>
-            <div class="background-overlay" aria-hidden="true"></div>
-          `:a}
-      <div
-        class="content"
-        part="content"
-        role="${this.banner?"banner":"group"}"
-      >
-        <div class="leading" part="leading">
-          <slot name="button">
-            <button
-              type="button"
-              class="leading-button"
-              aria-label="${this.leadingLabel}"
-            >
-              <sky-icon class="icon" icon="mdi:menu"></sky-icon>
-            </button>
-          </slot>
-        </div>
-        <div class="title-area" part="title">
-          <span class="title-text">${this.title}</span>
-        </div>
-        <div class="actions" part="actions">
-          <slot></slot>
-        </div>
-      </div>
-    `}};t([s({type:String}),e("design:type",Object)],b.prototype,"title",void 0),t([s({type:String}),e("design:type",Object)],b.prototype,"color",void 0),t([s({type:String}),e("design:type",Object)],b.prototype,"url",void 0),t([s({type:Boolean}),e("design:type",Object)],b.prototype,"banner",void 0),t([s({type:Boolean}),e("design:type",Object)],b.prototype,"dense",void 0),t([s({type:Boolean}),e("design:type",Object)],b.prototype,"elevated",void 0),t([s({type:String}),e("design:type",Object)],b.prototype,"leadingLabel",void 0),b=t([n("sky-appbar")],b);export{b as SkyAppbar};
+  `,b([a({type:String})],y.prototype,"title",2),b([a({type:String})],y.prototype,"color",2),b([a({type:String})],y.prototype,"url",2),b([a({type:Boolean})],y.prototype,"banner",2),b([a({type:Boolean})],y.prototype,"dense",2),b([a({type:Boolean})],y.prototype,"elevated",2),b([a({type:String})],y.prototype,"leadingLabel",2),y=b([n("sky-appbar")],y);export{y as SkyAppbar};
 //# sourceMappingURL=sky-appbar.js.map

package/dist/sky-appbar/sky-appbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"sky-appbar.js","sources":["../../src/sky-appbar/sky-appbar.ts"],"sourcesContent":[null],"names":["SkyAppbar","LitElement","constructor","this","title","color","url","banner","dense","elevated","leadingLabel","dependencies","SkyIcon","styles","css","_applyColorSurface","isDefaultColorToken","setAttribute","style","setProperty","resolveColor","resolveTextColorForToken","removeAttribute","removeProperty","connectedCallback","super","_applyBackgroundImage","image","updated","changedProperties","has","render","html","nothing","__decorate","property","type","String","prototype","Boolean","customElement"],"mappings":"8VAqEO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,uBAOuBC,KAAAC,MAAQ,UAMRD,KAAAE,MAAQ,UAGRF,KAAAG,IAAM,GAGLH,KAAAI,QAAS,EAGTJ,KAAAK,OAAQ,EAGRL,KAAAM,UAAW,EAGZN,KAAAO,aAAe,WAsQ7C,QAhSSP,KAAAQ,aAAyD,CAC9D,WAAYC,EACZ,QA0BcT,KAAAU,OAASC,CAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyL1B,CAGM,kBAAAC,GACN,IAAKC,EAAoBb,KAAKE,OAO5B,OANAF,KAAKc,aAAa,eAAgB,SAClCd,KAAKe,MAAMC,YAAY,oBAAqBC,EAAajB,KAAKE,aAC9DF,KAAKe,MAAMC,YACT,sBACAE,EAAyBlB,KAAKE,QAKlCF,KAAKmB,gBAAgB,gBACrBnB,KAAKe,MAAMK,eAAe,qBAC1BpB,KAAKe,MAAMK,eAAe,sBAC5B,CAES,iBAAAC,GACPC,MAAMD,oBACNrB,KAAKY,qBACLZ,KAAKuB,uBACP,CAGQ,qBAAAA,GACN,MAAMC,EAAQxB,KAAKG,IAAM,OAAOH,KAAKG,OAAS,OAC9CH,KAAKe,MAAMC,YAAY,oBAAqBQ,EAC9C,CAGmB,OAAAC,CAAQC,GACrBA,EAAkBC,IAAI,UACxB3B,KAAKY,qBAGHc,EAAkBC,IAAI,QACxB3B,KAAKuB,uBAET,CAES,MAAAK,GACP,OAAOC,CAAI;QACP7B,KAAKG,IACH0B,CAAI;;;YAIJC;;;;gBAIM9B,KAAKI,OAAS,SAAW;;;;;;;4BAObJ,KAAKO;;;;;;;qCAOIP,KAAKC;;;;;;KAOxC,GA1R4B8B,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,kCAA4BrC,EAAAsC,UAAA,gBAMlBJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,kCAA4BrC,EAAAsC,UAAA,gBAGlBJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,kCAAmBrC,EAAAsC,UAAA,cAGRJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,mCAAyBvC,EAAAsC,UAAA,iBAGdJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,mCAAyBvC,EAAAsC,UAAA,gBAGdJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,mCAA4BvC,EAAAsC,UAAA,mBAGlBJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,kCAAqCrC,EAAAsC,UAAA,uBA5B5CtC,EAASkC,EAAA,CADrBM,EAAc,eACFxC"}
+{"version":3,"file":"sky-appbar.js","sources":["../../src/sky-appbar/sky-appbar.ts"],"sourcesContent":["import { LitElement, html, css, PropertyValues, nothing } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport {\n  resolveColor,\n  resolveTextColorForToken,\n  isDefaultColorToken,\n} from \"../helper/utils/color-resolver\";\nimport { SkyIcon } from \"../sky-icon/sky-icon.js\";\n\n/**\n * @element sky-appbar\n *\n * @summary Application top bar with title, optional leading control, trailing actions, and optional color/image background.\n *\n * @status stable\n * @since 1.0.0\n *\n * @documentation https://library.sky-ui.com/components/appbar\n * @dependency sky-icon\n *\n * @slot button - Leading area (e.g., menu/back button). Defaults to a hamburger icon.\n * @slot - Trailing actions (icons/buttons). This is the default slot.\n *\n * @property {string} title - Title text displayed in the app bar.\n * @property {string} color - Semantic token or CSS color for bar background; foreground color is derived for contrast.\n * @property {string} url - Background image URL.\n * @property {boolean} banner - Uses `role=\"banner\"` when true, otherwise `role=\"group\"`.\n * @property {boolean} dense - Enables compact vertical spacing.\n * @property {boolean} elevated - Applies elevated shadow styling.\n * @property {string} leadingLabel - Accessible label for default leading button fallback.\n *\n * @csspart content - Wrapper that contains the leading slot, title, and actions.\n * @csspart leading - Container for the leading slot (e.g. menu button).\n * @csspart title - The title area (contains .title-text with the title string).\n * @csspart actions - The trailing actions container.\n *\n * @Behavior\n * - `color` resolves background via `resolveColor()` and text/icon color via `resolveTextColorForToken()`.\n * - `url` renders a background layer behind content.\n * - `banner` should be true only for the primary page app bar landmark.\n * - In RTL contexts, the default leading icon is mirrored unless reduced motion is enabled.\n *\n * @example\n * ```html\n * <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n *   <button slot=\"button\">Menu</button>\n *   <sky-icon icon=\"ion:search\"></sky-icon>\n * </sky-appbar>\n * ```\n * ```vue\n * <template>\n *   <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n *     <button slot=\"button\">Menu</button>\n *     <sky-icon icon=\"ion:search\"></sky-icon>\n *   </sky-appbar>\n * </template>\n * ```\n * ```jsx\n * export default function Demo() {\n *   return (\n *     <sky-appbar title=\"Dashboard\" color=\"primary\" dense>\n *       <button slot=\"button\">Menu</button>\n *       <sky-icon icon=\"ion:search\"></sky-icon>\n *     </sky-appbar>\n *   );\n * }\n * ```\n */\n@customElement(\"sky-appbar\")\nexport class SkyAppbar extends LitElement {\n\n  static dependencies: Record<string, CustomElementConstructor> = {\n    \"sky-icon\": SkyIcon,\n  };\n\n  /** Title text displayed in the app bar. @default \"App Bar\" */\n  @property({ type: String }) title = \"App Bar\";\n\n  /**\n   * Bar background token or CSS color; when set, foreground uses `resolveTextColorForToken` for contrast.\n   * @default \"default\"\n   */\n  @property({ type: String }) color = \"default\";\n\n  /** Background image URL. @default \"\" */\n  @property({ type: String }) url = \"\";\n\n  /** When true, the bar has role=\"banner\" (main app header). Set false for secondary bars. @default true */\n  @property({ type: Boolean }) banner = true;\n\n  /** When true, reduces vertical padding for a compact bar. @default false */\n  @property({ type: Boolean }) dense = false;\n\n  /** When true, applies stronger shadow (e.g. for sticky bar after scroll). @default false */\n  @property({ type: Boolean }) elevated = false;\n\n  /** Accessible label for the default leading button when no slot content is provided. @default \"Open menu\" */\n  @property({ type: String }) leadingLabel = \"Open menu\";\n\n  static override styles = css`\n    :host {\n      width: 100%;\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      position: relative;\n      font-family: var(--sky-font);\n      overflow: hidden;\n      color: var(--appbar-text-color, var(--sky-text-primary));\n      transition: var(--sky-transition-default);\n    }\n\n    :host(:not([data-surface=\"solid\"])) {\n      background: var(--sky-glass-secondary);\n      background-image: var(--sky-glass-surface);\n      backdrop-filter:\n        var(--sky-blur-secondary)\n        var(--sky-saturation-secondary)\n        var(--sky-brightness-secondary);\n      -webkit-backdrop-filter:\n        var(--sky-blur-secondary)\n        var(--sky-saturation-secondary)\n        var(--sky-brightness-secondary);\n      border-bottom: var(--sky-border-secondary);\n      box-shadow:\n        var(--sky-box-shadow-inset),\n        var(--sky-box-shadow-primary);\n    }\n\n    :host([data-surface=\"solid\"]) {\n      background-color: var(--appbar-bg-color);\n      color: var(--appbar-text-color);\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n      border-bottom: var(--sky-border-primary);\n      box-shadow: var(--sky-box-shadow-primary);\n    }\n\n    :host([elevated]:not([data-surface=\"solid\"])) {\n      box-shadow:\n        var(--sky-box-shadow-inset),\n        var(--sky-box-shadow-secondary);\n    }\n\n    :host([elevated][data-surface=\"solid\"]) {\n      box-shadow: var(--sky-box-shadow-secondary);\n    }\n\n    .background {\n      position: absolute;\n      inset: 0;\n      width: 100%;\n      height: 100%;\n      background-image: var(--appbar-bg-image, none);\n      background-size: cover;\n      background-position: center;\n      z-index: -2;\n      pointer-events: none;\n    }\n\n    .background-overlay {\n      position: absolute;\n      inset: 0;\n      background: var(--appbar-bg-overlay, transparent);\n      z-index: -1;\n      pointer-events: none;\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n    }\n\n    .content {\n      display: flex;\n      padding: var(--sky-space-2, 8px) var(--sky-space-4, 16px);\n      align-items: center;\n      justify-content: space-between;\n      width: 100%;\n      position: relative;\n      gap: var(--sky-space-2, 8px);\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n    }\n\n    :host([dense]) .content {\n      padding-block: var(--sky-space-1, 4px);\n    }\n\n    .title-area {\n      flex: 1 1 auto;\n      min-width: 0;\n      padding-inline-start: var(--sky-space-2\\\\.5, 10px);\n    }\n\n    .title-text {\n      font: var(--sky-text-title);\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n    }\n\n    .leading {\n      display: flex;\n      align-items: center;\n      flex-shrink: 0;\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n    }\n\n    .leading ::slotted(*) {\n      cursor: pointer;\n    }\n\n    .leading-button {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      margin: 0;\n      padding: 0;\n      border: none;\n      background: none;\n      cursor: pointer;\n      font: inherit;\n      color: inherit;\n      -webkit-tap-highlight-color: transparent;\n      min-width: var(--sky-touch-target, 44px);\n      min-height: var(--sky-touch-target, 44px);\n      box-sizing: border-box;\n      border-radius: var(--sky-radius-primary);\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n      transition: var(--sky-transition-fast);\n    }\n\n    .leading-button:hover {\n      background: var(--sky-hover-primary);\n    }\n\n    .leading-button:focus-visible,\n    .leading ::slotted(*:focus-visible),\n    .actions ::slotted(*:focus-visible) {\n      outline: none;\n      box-shadow: var(--sky-focus-ring);\n    }\n\n    .icon {\n      cursor: pointer;\n      font-size: var(--sky-font-size-xl, 1.25rem);\n      display: flex;\n      align-items: center;\n    }\n\n    .actions {\n      display: flex;\n      align-items: center;\n      gap: var(--sky-space-2, 8px);\n      padding-inline-start: var(--sky-space-2\\\\.5, 10px);\n      flex-shrink: 0;\n      backdrop-filter: none;\n      -webkit-backdrop-filter: none;\n    }\n\n    .actions ::slotted(button),\n    .actions ::slotted([role=\"button\"]) {\n      min-width: var(--sky-touch-target, 44px);\n      min-height: var(--sky-touch-target, 44px);\n      box-sizing: border-box;\n    }\n\n    :host-context([dir=\"rtl\"]) .leading-button .icon {\n      transform: scaleX(-1);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      :host,\n      .content,\n      .leading-button,\n      .leading ::slotted(*),\n      .actions ::slotted(*) {\n        transition: none;\n      }\n\n      :host-context([dir=\"rtl\"]) .leading-button .icon {\n        transform: none;\n      }\n    }\n\n  `;\n\n  /** Applies glass vs solid surface tokens from `color`. */\n  private _applyColorSurface(): void {\n    if (!isDefaultColorToken(this.color)) {\n      this.setAttribute(\"data-surface\", \"solid\");\n      this.style.setProperty(\"--appbar-bg-color\", resolveColor(this.color));\n      this.style.setProperty(\n        \"--appbar-text-color\",\n        resolveTextColorForToken(this.color),\n      );\n      return;\n    }\n\n    this.removeAttribute(\"data-surface\");\n    this.style.removeProperty(\"--appbar-bg-color\");\n    this.style.removeProperty(\"--appbar-text-color\");\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this._applyColorSurface();\n    this._applyBackgroundImage();\n  }\n\n  /** Sets background image CSS variable from `url`. */\n  private _applyBackgroundImage(): void {\n    const image = this.url ? `url(${this.url})` : \"none\";\n    this.style.setProperty(\"--appbar-bg-image\", image);\n  }\n\n  /** Updates host style variables when visual input properties change. */\n  protected override updated(changedProperties: PropertyValues): void {\n    if (changedProperties.has(\"color\")) {\n      this._applyColorSurface();\n    }\n\n    if (changedProperties.has(\"url\")) {\n      this._applyBackgroundImage();\n    }\n  }\n\n  override render() {\n    return html`\n      ${this.url\n        ? html`\n            <div class=\"background\" aria-hidden=\"true\"></div>\n            <div class=\"background-overlay\" aria-hidden=\"true\"></div>\n          `\n        : nothing}\n      <div\n        class=\"content\"\n        part=\"content\"\n        role=\"${this.banner ? \"banner\" : \"group\"}\"\n      >\n        <div class=\"leading\" part=\"leading\">\n          <slot name=\"button\">\n            <button\n              type=\"button\"\n              class=\"leading-button\"\n              aria-label=\"${this.leadingLabel}\"\n            >\n              <sky-icon class=\"icon\" icon=\"mdi:menu\"></sky-icon>\n            </button>\n          </slot>\n        </div>\n        <div class=\"title-area\" part=\"title\">\n          <span class=\"title-text\">${this.title}</span>\n        </div>\n        <div class=\"actions\" part=\"actions\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["SkyAppbar","LitElement","constructor","super","arguments","this","title","color","url","banner","dense","elevated","leadingLabel","_applyColorSurface","isDefaultColorToken","setAttribute","style","setProperty","resolveColor","resolveTextColorForToken","removeAttribute","removeProperty","connectedCallback","_applyBackgroundImage","image","updated","changedProperties","has","render","html","nothing","dependencies","SkyIcon","styles","css","__decorateClass","property","type","String","prototype","Boolean","customElement"],"mappings":"2eAqEO,IAAMA,EAAN,cAAwBC,EAAxB,WAAAC,GAAAC,SAAAC,WAOuBC,KAAAC,MAAQ,UAMRD,KAAAE,MAAQ,UAGRF,KAAAG,IAAM,GAGLH,KAAAI,QAAS,EAGTJ,KAAAK,OAAQ,EAGRL,KAAAM,UAAW,EAGZN,KAAAO,aAAe,WAAA,CA8LnC,kBAAAC,GACN,IAAKC,EAAoBT,KAAKE,OAO5B,OANAF,KAAKU,aAAa,eAAgB,SAClCV,KAAKW,MAAMC,YAAY,oBAAqBC,EAAab,KAAKE,aAC9DF,KAAKW,MAAMC,YACT,sBACAE,EAAyBd,KAAKE,QAKlCF,KAAKe,gBAAgB,gBACrBf,KAAKW,MAAMK,eAAe,qBAC1BhB,KAAKW,MAAMK,eAAe,sBAC5B,CAES,iBAAAC,GACPnB,MAAMmB,oBACNjB,KAAKQ,qBACLR,KAAKkB,uBACP,CAGQ,qBAAAA,GACN,MAAMC,EAAQnB,KAAKG,IAAM,OAAOH,KAAKG,OAAS,OAC9CH,KAAKW,MAAMC,YAAY,oBAAqBO,EAC9C,CAGmB,OAAAC,CAAQC,GACrBA,EAAkBC,IAAI,UACxBtB,KAAKQ,qBAGHa,EAAkBC,IAAI,QACxBtB,KAAKkB,uBAET,CAES,MAAAK,GACP,OAAOC,CAAA;QACHxB,KAAKG,IACHqB,CAAA;;;YAIAC;;;;gBAIMzB,KAAKI,OAAS,SAAW;;;;;;;4BAObJ,KAAKO;;;;;;;qCAOIP,KAAKC;;;;;;KAOxC,GAjSWN,EAEJ+B,aAAyD,CAC9D,WAAYC,GAHHhC,EA8BKiC,OAASC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAvBGC,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAPPtC,EAOiBuC,UAAA,QAAA,GAMAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAbPtC,EAaiBuC,UAAA,QAAA,GAGAJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UAhBPtC,EAgBiBuC,UAAA,MAAA,GAGCJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAnBPxC,EAmBkBuC,UAAA,SAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAtBPxC,EAsBkBuC,UAAA,QAAA,GAGAJ,EAAA,CAA5BC,EAAS,CAAEC,KAAMG,WAzBPxC,EAyBkBuC,UAAA,WAAA,GAGDJ,EAAA,CAA3BC,EAAS,CAAEC,KAAMC,UA5BPtC,EA4BiBuC,UAAA,eAAA,GA5BjBvC,EAANmC,EAAA,CADNM,EAAc,eACFzC"}