@awc-ui/core 1.0.0-beta.2 → 1.0.0-beta.3

package/dist/components-csr/md-radio.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdRadioCss","MdRadio","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","valueMissingLabel","customValidityMessage","invalid","defaultChecked","checked","disabled","softDisabled","required","name","value","density","pressed","focused","programmaticFocus","managedTabIndex","parentLabel","lastValidityKey","handleLabelClick","e","composedPath","includes","el","handleClick","isDisabled","mdChange","emit","handleKeyDown","key","preventDefault","triggerRipple","setTimeout","focusSibling","handleFocus","mdFocus","handleBlur","mdBlur","handlePointerDown","handlePointerUp","connectedCallback","closest","addEventListener","componentWillLoad","syncFormValue","componentDidLoad","updateRovingTabIndex","syncGroupValidity","disconnectedCallback","removeEventListener","onCheckedChange","newVal","uncheckOthers","onValidityInputChange","setFormValue","internals","groupHasSelection","root","getRootNode","Array","from","querySelectorAll","some","r","hasAttribute","groupIsRequired","syncValidity","setValidityState","missing","missingMessage","customMessage","emitValidityChange","forEach","syncValidityFromGroup","formResetCallback","getValidity","getValidityOf","v","valid","validationMessage","primed","mdValidityChange","checkValidity","checkValidityOf","reportValidity","reportValidityOf","setCustomValidity","message","onDisabledChange","setFocus","focus","setBlur","blur","select","siblings","anyChecked","s","firstEnabled","find","keepChecked","sibling","removeAttribute","direction","enabled","filter","length","idx","indexOf","next","target","setAttribute","dispatchEvent","CustomEvent","detail","getAttribute","bubbles","composed","render","isEffectivelyDisabled","h","Host","class","role","undefined","String","tabindex","onClick","onKeyDown","onFocus","onBlur","onPointerDown","onPointerUp","onPointerLeave","onPointerCancel","part","type","onChange"],"sources":["src/components/md-radio/md-radio.css?tag=md-radio&encapsulation=shadow","src/components/md-radio/md-radio.tsx"],"sourcesContent":["/* ==========================================================\n   md-radio — Material Design 3 Radio Button\n   Spec: https://m3.material.io/components/radio-button/specs\n\n   Measurements (MD3 spec):\n     Icon size:             20px (outer circle)\n     Inner dot:             10px (when checked)\n     State-layer size:      40px\n     Target (touch) size:   48px\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-radio-icon-color                 Unchecked outer circle color\n     --md-radio-selected-icon-color        Checked outer circle + inner dot color\n     --md-radio-icon-size                  Outer circle size\n     --md-radio-inner-circle-size          Inner dot size\n     --md-radio-state-layer-size           State-layer diameter\n     --md-radio-state-layer-color          State-layer color (unchecked)\n     --md-radio-selected-state-layer-color State-layer color (checked)\n\n   CSS PARTS:\n     state-layer     Hover / focus / press overlay\n     container       Wrapper around outer + inner circles\n     outer-circle    The 20px circle border\n     inner-circle    The 10px filled dot\n\n   SLOTS:\n     (none — standalone control, label provided externally)\n   ========================================================== */\n\n/* ==========================================================\n   1. HOST — TOUCH TARGET (48px)\n   color controls md-ripple wave (md-ripple uses currentColor).\n   ========================================================== */\n\n:host {\n  --_icon-color: var(--md-radio-icon-color, var(--md-sys-color-on-surface-variant));\n  --_selected-icon-color: var(--md-radio-selected-icon-color, var(--md-sys-color-primary));\n  /* The visible circle + dot shrink with global density (20/10 at 0 → 16/8 at\n     -4) so the control densifies, not just the tap target; ratio preserved. */\n  --_icon-size: var(--md-radio-icon-size, max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px)));\n  --_inner-circle-size: var(--md-radio-inner-circle-size, max(8px, calc(10px + var(--md-sys-density-scale, 0) * 0.5px)));\n  /* Global density: the state layer shrinks in step with the host touch target\n     (both trim 4px per `data-density` rung), so it stays 8px inside the host at\n     every rung. Floored at 24px; unchanged at density 0. */\n  --_state-layer-size: max(24px, calc(var(--md-radio-state-layer-size, 40px) + var(--md-sys-density-scale, 0) * 4px));\n  --_state-layer-color: var(--md-radio-state-layer-color, var(--md-sys-color-on-surface));\n  --_selected-state-layer-color: var(--md-radio-selected-state-layer-color, var(--md-sys-color-primary));\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  /* Global density: each `data-density` rung (0…-4) trims 4px off the touch\n     target, floored at 32px to keep breathing room around the 20px circle.\n     Unchanged at density 0. */\n  inline-size: max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));\n  block-size: max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));\n  cursor: pointer;\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  overflow: hidden;\n  -webkit-tap-highlight-color: transparent;\n  box-sizing: border-box;\n  flex-shrink: 0;\n  vertical-align: middle;\n  outline: none;\n  color: var(--_state-layer-color);\n}\n\n:host(.md-radio--checked) {\n  color: var(--_selected-state-layer-color);\n}\n\n/* ==========================================================\n   2. HIDDEN NATIVE INPUT\n   The host is the interactive radio (role=\"radio\" + roving\n   tabindex). This decorative input must be fully removed from\n   the focus order and accessibility tree — a native <input> stays\n   natively focusable despite tabindex=\"-1\"/aria-hidden, which would\n   nest a second interactive control inside the role=\"radio\" host\n   (axe: nested-interactive). display:none is the only reliable way\n   to strip a native control's focusability; opacity/zero-size do not.\n   ========================================================== */\n\n.md-radio__native {\n  display: none;\n}\n\n/* ==========================================================\n   3. RIPPLE LAYER (40px — constrains md-ripple to state-layer size)\n   md-ripple resolves this span as its host via parentElement,\n   so its wave is sized and clipped to the 40px circle.\n   ========================================================== */\n\n.md-radio__ripple-layer {\n  position: absolute;\n  inline-size: var(--_state-layer-size);\n  block-size: var(--_state-layer-size);\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  overflow: hidden;\n}\n\n:host(.md-radio--disabled) .md-radio__ripple-layer,\n:host([soft-disabled]) .md-radio__ripple-layer {\n  display: none;\n}\n\n/* ==========================================================\n   4. STATE LAYER (40px centered inside 48px touch target)\n   ========================================================== */\n\n.md-radio__state-layer {\n  position: absolute;\n  inline-size: var(--_state-layer-size);\n  block-size: var(--_state-layer-size);\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  background-color: var(--_state-layer-color);\n  opacity: 0;\n  transition: opacity var(--md-sys-motion-duration-short2, 100ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n  pointer-events: none;\n}\n\n/* Unchecked state-layer */\n:host(.md-radio--unchecked:hover) .md-radio__state-layer {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n\n:host(.md-radio--unchecked:active) .md-radio__state-layer {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.12);\n}\n\n/* Checked state-layer */\n:host(.md-radio--checked) .md-radio__state-layer {\n  background-color: var(--_selected-state-layer-color);\n}\n\n:host(.md-radio--checked:hover) .md-radio__state-layer {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n\n:host(.md-radio--checked:active) .md-radio__state-layer {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.12);\n}\n\n/* ==========================================================\n   5. FOCUS RING — separate pseudo so it is NOT affected by the\n   state-layer's opacity (which would make the ring ~12% visible).\n   Sized to the 40px state-layer, with a 2px gap from the 20px\n   container.\n   ========================================================== */\n\n:host(:focus-visible)::after,\n:host(.md-radio--focus-ring)::after {\n  content: '';\n  position: absolute;\n  inset: 0;\n  margin: auto;\n  inline-size: var(--_state-layer-size);\n  block-size: var(--_state-layer-size);\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  outline: 3px solid var(--md-sys-color-secondary);\n  /* Sits ON the state layer, not pulled inside it. At -8px the ring drew at\n     24px around a 20px radio — a 2px gap — so it read as a bullseye welded to\n     the control rather than as a focus indicator. On the state layer it clears\n     the circle by a visible margin and still fits the touch target: the ring's\n     outer edge is state-layer + 6px (46px inside a 48px host at density 0,\n     30px inside 32px at -4). */\n  outline-offset: 0;\n  pointer-events: none;\n}\n\n/* ==========================================================\n   6. CONTAINER (positions outer + inner circles)\n   Transition uses same motion tokens as md-checkbox:\n     Release: medium4 (400ms) + emphasized-decelerate (spring-back)\n     Press:   short4  (200ms) + standard (snap-in)\n   ========================================================== */\n\n.md-radio__container {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: var(--_icon-size);\n  block-size: var(--_icon-size);\n  pointer-events: none;\n  transition:\n    transform var(--md-sys-motion-duration-medium4, 400ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1));\n}\n\n/* Press animation — M3 Expressive squish */\n:host(.md-radio--pressed) .md-radio__container {\n  transform: scale(0.82);\n  transition:\n    transform var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n/* ==========================================================\n   7. OUTER CIRCLE (20px, 2px border)\n   ========================================================== */\n\n.md-radio__outer {\n  position: absolute;\n  inset: 0;\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  border: 2px solid var(--_icon-color);\n  box-sizing: border-box;\n  transition:\n    border-color var(--md-sys-motion-duration-short2, 100ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n:host(.md-radio--checked) .md-radio__outer {\n  border-color: var(--_selected-icon-color);\n}\n\n/* ==========================================================\n   8. INNER CIRCLE (10px filled dot)\n   Grows from scale(0) to scale(1) when checked.\n   ========================================================== */\n\n.md-radio__inner {\n  inline-size: var(--_inner-circle-size);\n  block-size: var(--_inner-circle-size);\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  background-color: var(--_selected-icon-color);\n  transform: scale(0);\n  transition:\n    transform var(--md-sys-motion-duration-medium4, 400ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1));\n}\n\n:host(.md-radio--checked) .md-radio__inner {\n  transform: scale(1);\n}\n\n/* ==========================================================\n   9. DISABLED\n   ========================================================== */\n\n:host(.md-radio--disabled) {\n  cursor: default;\n  pointer-events: none;\n}\n\n:host(.md-radio--disabled.md-radio--unchecked) .md-radio__outer {\n  border-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host(.md-radio--disabled.md-radio--checked) .md-radio__outer {\n  border-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host(.md-radio--disabled.md-radio--checked) .md-radio__inner {\n  background-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host(.md-radio--disabled) .md-radio__state-layer {\n  display: none;\n}\n\n/* Soft-disabled: disabled visuals but remains focusable */\n:host([soft-disabled]) {\n  cursor: default;\n  pointer-events: auto;\n}\n\n:host([soft-disabled].md-radio--unchecked) .md-radio__outer {\n  border-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host([soft-disabled].md-radio--checked) .md-radio__outer {\n  border-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host([soft-disabled].md-radio--checked) .md-radio__inner {\n  background-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host([soft-disabled]) .md-radio__state-layer {\n  display: none;\n}\n\n/* ==========================================================\n   10. REDUCED MOTION\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  .md-radio__container,\n  .md-radio__state-layer,\n  .md-radio__outer,\n  .md-radio__inner {\n    transition: none;\n  }\n}\n\n/* ==========================================================\n   11. FORCED COLORS — Windows High Contrast\n   ========================================================== */\n\n@media (forced-colors: active) {\n  :host {\n    forced-color-adjust: none;\n  }\n\n  .md-radio__outer {\n    border-color: ButtonText;\n  }\n\n  :host(.md-radio--checked) .md-radio__outer {\n    border-color: Highlight;\n  }\n\n  :host(.md-radio--checked) .md-radio__inner {\n    background-color: Highlight;\n  }\n\n  :host(:focus-visible)::after,\n  :host(.md-radio--focus-ring)::after {\n    outline-color: Highlight;\n  }\n\n  :host(.md-radio--disabled) .md-radio__outer {\n    border-color: GrayText;\n  }\n\n  :host(.md-radio--disabled.md-radio--checked) .md-radio__inner {\n    background-color: GrayText;\n  }\n\n  .md-radio__state-layer {\n    display: none;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, State, Watch, h } from '@stencil/core';\nimport { RadioElement } from '../../utils/types';\nimport { triggerRipple } from '../../utils/ripple';\nimport {\n  setFormValue,\n  setValidityState,\n  checkValidityOf,\n  reportValidityOf,\n  getValidityOf,\n} from '../../utils/form';\n\n@Component({\n  tag: 'md-radio',\n  styleUrl: 'md-radio.css',\n  shadow: true,\n  formAssociated: true,\n})\nexport class MdRadio {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Form-association handle. Radios previously declared `name`/`value` but were\n   * NOT form-associated, so a checked radio never reached FormData at all — the\n   * group looked wired up and submitted nothing.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n\n  /**\n   * Localized constraint-validation message shown when `required` is unmet.\n   *\n   * A prop rather than a hardcoded string, matching md-time-picker's\n   * `value-missing-label`: components stay i18n-engine-agnostic and the\n   * consumer localizes through its own dictionary. Native inputs get their\n   * message from the browser's locale for free; a form-associated custom\n   * element supplies its own, so leaving this hardcoded would ship an\n   * English-only form to every locale.\n   */\n  @Prop({ attribute: 'value-missing-label' }) valueMissingLabel: string =\n    'Please select one of these options.';\n\n  /** Message set via setCustomValidity(); non-empty wins over valueMissing. */\n  private customValidityMessage = '';\n\n  /** Drives aria-invalid on the host. */\n  @State() private invalid = false;\n\n  /** `checked` at first render, restored on form reset (native radio behaviour). */\n  private defaultChecked = false;\n\n  // ─── Public Props ──────────────────────────────────────────\n\n  /** Whether the radio button is selected */\n  @Prop({ mutable: true, reflect: true }) checked: boolean = false;\n\n  /** Disables the radio button */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Soft-disabled: disabled visuals but remains focusable for discoverability */\n  @Prop({ reflect: true, attribute: 'soft-disabled' }) softDisabled: boolean = false;\n\n  /** Whether the radio is required in a form */\n  @Prop({ reflect: true }) required: boolean = false;\n\n  /** Form name — radios sharing a name form an exclusive group */\n  @Prop({ reflect: true }) name: string = '';\n\n  /** Form value submitted when checked */\n  @Prop({ reflect: true }) value: string = '';\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  // ─── Events ────────────────────────────────────────────────\n\n  /** Emits when the checked state changes via user interaction */\n  @Event() mdChange: EventEmitter<{ checked: boolean; value: string }>;\n\n  /** Emits when the radio receives focus */\n  @Event() mdFocus: EventEmitter<void>;\n\n  /** Emits when the radio loses focus */\n  @Event() mdBlur: EventEmitter<void>;\n\n  // ─── Internal State ────────────────────────────────────────\n\n  @State() private pressed = false;\n  @State() private focused = false;\n  @State() private programmaticFocus = false;\n  @State() private managedTabIndex = '0';\n\n  private parentLabel: HTMLLabelElement | null = null;\n\n  private get isDisabled() {\n    return this.disabled || this.softDisabled;\n  }\n\n  // ─── Lifecycle ─────────────────────────────────────────────\n\n  connectedCallback() {\n    this.parentLabel = this.el.closest('label');\n    this.parentLabel?.addEventListener('click', this.handleLabelClick);\n  }\n\n  componentWillLoad() {\n    this.defaultChecked = this.checked;\n    this.syncFormValue();\n  }\n\n  componentDidLoad() {\n    this.updateRovingTabIndex();\n    // Group validity depends on SIBLINGS, which may not have upgraded when this\n    // radio first rendered. Re-sync once the whole group exists, or a group\n    // whose pre-checked member upgraded last would report itself empty.\n    this.syncGroupValidity();\n  }\n\n  disconnectedCallback() {\n    this.parentLabel?.removeEventListener('click', this.handleLabelClick);\n    this.parentLabel = null;\n  }\n\n  // ─── Watchers ──────────────────────────────────────────────\n\n  @Watch('checked')\n  onCheckedChange(newVal: boolean) {\n    if (newVal) {\n      this.uncheckOthers(this.el);\n    }\n    this.updateRovingTabIndex();\n    this.syncFormValue();\n    // Runs for BOTH directions. Checking this radio satisfies `required` for\n    // every member of the group; unchecking the last one must put the group\n    // back into valueMissing. Either way every member re-publishes, not just\n    // this one, because validity here is a property of the group.\n    this.syncGroupValidity();\n  }\n\n  @Watch('required')\n  @Watch('name')\n  @Watch('valueMissingLabel')\n  onValidityInputChange() {\n    this.syncGroupValidity();\n  }\n\n  /** Only the checked member of a name group submits — native radio semantics. */\n  private syncFormValue() {\n    setFormValue(this.internals, this.checked ? this.value || 'on' : null);\n  }\n\n  /** True when any radio sharing this name is checked. */\n  private get groupHasSelection(): boolean {\n    if (!this.name) return this.checked;\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    return Array.from(root.querySelectorAll(`md-radio[name=\"${this.name}\"]`)).some((r) => {\n      const el = r as Element & { checked?: boolean };\n      // The PROPERTY is authoritative once the element has upgraded. The\n      // reflected `checked` attribute lags by a render, so reading it (or\n      // OR-ing it in) reports a just-unchecked radio as still checked — the\n      // group then looks satisfied, `required` never republishes valueMissing,\n      // and the form submits empty. Fall back to the attribute only for an\n      // element that has not upgraded yet, where the property does not exist.\n      return typeof el.checked === 'boolean' ? el.checked : r.hasAttribute('checked');\n    });\n  }\n\n  /**\n   * True when ANY radio in the group is marked required.\n   *\n   * Per the HTML spec `required` on a single radio makes the whole GROUP\n   * required, and every member then suffers valueMissing — not just the one\n   * carrying the attribute. Reading it per-element meant a screen-reader user\n   * landing on a sibling heard nothing wrong, and that sibling's own\n   * checkValidity() disagreed with the form's.\n   */\n  private get groupIsRequired(): boolean {\n    if (this.required) return true;\n    if (!this.name) return false;\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    return Array.from(root.querySelectorAll(`md-radio[name=\"${this.name}\"]`)).some((r) =>\n      r.hasAttribute('required'),\n    );\n  }\n\n  private syncValidity() {\n    // See md-checkbox: WCAG 3.3.1 requires the invalid state to be exposed\n    // programmatically. For a radio the condition is a GROUP property, so every\n    // member reports invalid while the group has no selection — which is what a\n    // screen reader user hears whichever member they land on.\n    this.invalid = this.customValidityMessage\n      ? true\n      : this.groupIsRequired && !this.groupHasSelection;\n    setValidityState(this.internals, {\n      missing: this.groupIsRequired && !this.groupHasSelection,\n      missingMessage: this.valueMissingLabel,\n      customMessage: this.customValidityMessage,\n    });\n      this.emitValidityChange();\n  }\n\n  /** Re-publish validity for every radio in the group. */\n  private syncGroupValidity() {\n    this.syncValidity();\n    if (!this.name) return;\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    root.querySelectorAll(`md-radio[name=\"${this.name}\"]`).forEach((r) => {\n      if (r !== this.el) (r as unknown as { syncValidityFromGroup?: () => void }).syncValidityFromGroup?.();\n    });\n  }\n\n  /**\n   * Group-coordination hook. Sibling radios call this so the whole group agrees\n   * on validity; exposed as a @Method because a sibling can only reach this\n   * component through its public element interface.\n   */\n  @Method()\n  async syncValidityFromGroup() {\n    this.syncValidity();\n  }\n\n  /** Restore the initial selection when the owning form is reset. */\n  formResetCallback() {\n    this.checked = this.defaultChecked;\n  }\n\n  /** Current validity: boolean, message and flags. Mirrors md-text-field. */\n  @Method()\n  async getValidity(): Promise<{\n    valid: boolean;\n    validationMessage: string;\n    flags: Record<string, boolean>;\n  }> {\n    return getValidityOf(this.internals);\n  }\n\n  /**\n   * Fires when this control's validity CHANGES — never on every keystroke, and\n   * never for a re-publish that lands on the same state.\n   *\n   * `composed: false` is deliberate. Composites like md-select embed an\n   * md-text-field, and a composed event escapes that inner shadow root, so a\n   * listener on md-select would receive the inner field's event as well as the\n   * host's — two events, different payloads, for one logical control. Keeping\n   * it uncomposed means each component reports only for itself, while\n   * `bubbles: true` still lets a <form> or app root hear every control.\n   */\n  @Event({ bubbles: true, composed: false }) mdValidityChange: EventEmitter<{\n    valid: boolean;\n    validationMessage: string;\n    flags: Record<string, boolean>;\n  }>;\n\n  /** Last emitted validity, so a re-publish that changes nothing stays silent. */\n  private lastValidityKey: string | null = null;\n\n  /**\n   * Emit mdValidityChange if validity actually moved.\n   *\n   * The FIRST call only primes the baseline. Initial state is not a change, and\n   * emitting on mount would fire once per control on every page load — noise a\n   * consumer would have to filter out, and misleading for anything logging\n   * \"field became invalid\".\n   */\n  private emitValidityChange() {\n    const v = getValidityOf(this.internals);\n    const key = `${v.valid}|${v.validationMessage}`;\n    if (this.lastValidityKey === key) return;\n    const primed = this.lastValidityKey !== null;\n    this.lastValidityKey = key;\n    if (primed) this.mdValidityChange.emit(v);\n  }\n\n  /** Constraint-validation API, matching md-text-field and the native contract. */\n  @Method()\n  async checkValidity(): Promise<boolean> {\n    return checkValidityOf(this.internals);\n  }\n\n  @Method()\n  async reportValidity(): Promise<boolean> {\n    return reportValidityOf(this.internals);\n  }\n\n  @Method()\n  async setCustomValidity(message: string) {\n    this.customValidityMessage = message;\n    this.syncValidity();\n  }\n\n  @Watch('disabled')\n  onDisabledChange() {\n    this.updateRovingTabIndex();\n  }\n\n  // ─── Public Methods ────────────────────────────────────────\n\n  /** Programmatically focus the radio */\n  @Method()\n  async setFocus() {\n    // Script-initiated focus does not trigger :focus-visible, so flag it\n    // explicitly to render the focus ring.\n    this.programmaticFocus = true;\n    this.el.focus();\n  }\n\n  /** Programmatically blur the radio */\n  @Method()\n  async setBlur() {\n    this.el.blur();\n  }\n\n  /**\n   * Programmatically select this radio and uncheck siblings.\n   * Emits mdChange like a user interaction.\n   */\n  @Method()\n  async select() {\n    if (this.isDisabled || this.checked) return;\n    this.checked = true;\n    this.mdChange.emit({ checked: true, value: this.value });\n  }\n\n  // ─── Private — Roving tabindex (WAI-ARIA Radio Group) ─────\n\n  /**\n   * WAI-ARIA: only the active radio in a group receives Tab focus.\n   *  - checked radio → tabindex 0\n   *  - no radio checked → first enabled radio → tabindex 0\n   *  - all others → tabindex -1\n   *  - disabled → always tabindex -1\n   *  - no name (standalone) → tabindex 0\n   */\n  private updateRovingTabIndex() {\n    if (this.disabled) {\n      this.managedTabIndex = '-1';\n      return;\n    }\n    if (this.checked) {\n      this.managedTabIndex = '0';\n      return;\n    }\n    if (!this.name) {\n      this.managedTabIndex = '0';\n      return;\n    }\n\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    const siblings = Array.from(root.querySelectorAll(`md-radio[name=\"${this.name}\"]`));\n\n    const anyChecked = siblings.some(s => s !== this.el && (s as unknown as RadioElement).checked);\n    if (anyChecked) {\n      this.managedTabIndex = '-1';\n      return;\n    }\n\n    const firstEnabled = siblings.find(s => !(s as unknown as RadioElement).disabled);\n    this.managedTabIndex = firstEnabled === this.el ? '0' : '-1';\n  }\n\n  // ─── Private — Handlers ───────────────────────────────────\n\n  private handleLabelClick = (e: MouseEvent) => {\n    if (!e.composedPath().includes(this.el)) {\n      this.handleClick();\n    }\n  };\n\n  private handleClick = () => {\n    if (this.isDisabled || this.checked) return;\n    this.checked = true;\n    this.mdChange.emit({ checked: true, value: this.value });\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (this.isDisabled) return;\n\n    if (e.key === ' ') {\n      e.preventDefault();\n      this.pressed = true;\n      this.handleClick();\n      triggerRipple(this.el);\n      setTimeout(() => { this.pressed = false; }, 150);\n      return;\n    }\n\n    if (e.key === 'ArrowDown' || e.key === 'ArrowRight') {\n      e.preventDefault();\n      this.focusSibling(1);\n    } else if (e.key === 'ArrowUp' || e.key === 'ArrowLeft') {\n      e.preventDefault();\n      this.focusSibling(-1);\n    }\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n    this.mdFocus.emit();\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.programmaticFocus = false;\n    this.mdBlur.emit();\n  };\n\n  private handlePointerDown = () => {\n    // Pointer interaction should not keep the programmatic focus ring.\n    this.programmaticFocus = false;\n    if (!this.isDisabled) this.pressed = true;\n  };\n\n  private handlePointerUp = () => {\n    this.pressed = false;\n  };\n\n  // ─── Private — Group management ───────────────────────────\n\n  /** Uncheck all radios in the group except the given element */\n  private uncheckOthers(keepChecked: HTMLElement) {\n    if (!this.name) return;\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    const siblings = root.querySelectorAll(`md-radio[name=\"${this.name}\"]`);\n    siblings.forEach((sibling) => {\n      if (sibling !== keepChecked && sibling.hasAttribute('checked')) {\n        sibling.removeAttribute('checked');\n      }\n    });\n  }\n\n  /**\n   * Focus next/previous sibling radio in the group.\n   * Arrow keys move focus AND check the newly focused button (WAI-ARIA).\n   * Skips disabled and soft-disabled radios.\n   */\n  private focusSibling(direction: 1 | -1) {\n    if (!this.name) return;\n    const root = this.el.getRootNode() as Document | ShadowRoot;\n    const siblings = Array.from(root.querySelectorAll(`md-radio[name=\"${this.name}\"]`)) as HTMLElement[];\n    const enabled = siblings.filter(s => !s.hasAttribute('disabled') && !s.hasAttribute('soft-disabled'));\n    if (enabled.length === 0) return;\n\n    const idx = enabled.indexOf(this.el);\n    const next = (idx + direction + enabled.length) % enabled.length;\n    const target = enabled[next];\n    target.focus();\n    target.setAttribute('checked', '');\n    triggerRipple(target);\n    target.dispatchEvent(new CustomEvent('mdChange', {\n      detail: { checked: true, value: target.getAttribute('value') || '' },\n      bubbles: true,\n      composed: true,\n    }));\n  }\n\n  // ─── Render ────────────────────────────────────────────────\n\n  render() {\n    const isEffectivelyDisabled = this.isDisabled;\n\n    return (\n      <Host\n        class={{\n          'md-radio': true,\n          'md-radio--checked': this.checked,\n          'md-radio--unchecked': !this.checked,\n          'md-radio--disabled': isEffectivelyDisabled,\n          'md-radio--pressed': this.pressed,\n          'md-radio--focused': this.focused,\n          'md-radio--focus-ring': this.programmaticFocus,\n        }}\n        role=\"radio\"\n        aria-invalid={this.invalid ? 'true' : undefined}\n        aria-checked={String(this.checked)}\n        aria-disabled={isEffectivelyDisabled ? 'true' : undefined}\n        aria-required={this.required ? 'true' : undefined}\n        tabindex={this.managedTabIndex}\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeyDown}\n        onFocus={this.handleFocus}\n        onBlur={this.handleBlur}\n        onPointerDown={this.handlePointerDown}\n        onPointerUp={this.handlePointerUp}\n        onPointerLeave={this.handlePointerUp}\n        onPointerCancel={this.handlePointerUp}\n      >\n        <span class=\"md-radio__ripple-layer\" aria-hidden=\"true\">\n          <md-ripple disabled={isEffectivelyDisabled}></md-ripple>\n        </span>\n        <span class=\"md-radio__state-layer\" part=\"state-layer\" aria-hidden=\"true\"></span>\n\n        <span class=\"md-radio__container\" part=\"container\" aria-hidden=\"true\">\n          <span class=\"md-radio__outer\" part=\"outer-circle\"></span>\n          <span class=\"md-radio__inner\" part=\"inner-circle\"></span>\n        </span>\n\n        <input\n          type=\"radio\"\n          class=\"md-radio__native\"\n          checked={this.checked}\n          disabled={this.disabled}\n          required={this.required}\n          name={this.name}\n          value={this.value}\n          aria-hidden=\"true\"\n          tabindex=\"-1\"\n          onChange={() => {}}\n        />\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-rating.js

@@ -0,0 +1,2 @@
+import{p as t,H as i,c as e,h as s,d as a,t as n}from"./p-bSpXNc5J.js";import{s as r}from"./p-DWxN44zD.js";const o=()=>`:host{--_size:var(--md-rating-item-size, max(12px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));--_gap:var(--md-rating-item-gap, var(--md-sys-spacing-gap-xs, 4px));--_active-color:var(--md-rating-active-color, var(--md-sys-color-secondary, #FFB400));--_inactive-color:var(--md-rating-inactive-color, color-mix(in srgb, var(--md-sys-color-on-surface-variant) 30%, transparent));--_focus-ring-color:var(--md-rating-focus-ring-color, var(--md-sys-color-secondary));--_focus-ring-width:var(--md-rating-focus-ring-width, 3px);--_focus-ring-offset:var(--md-rating-focus-ring-offset, 2px);--_state-layer-color:var(--md-rating-state-layer-color, var(--md-sys-color-on-surface));--_label-color:var(--md-rating-value-label-color, var(--md-sys-color-on-surface));--_label-font:var(     --md-rating-value-label-font,     var(--md-sys-typescale-label-medium-font, system-ui)   );--_pop-scale:var(--md-rating-pop-scale, 1.12);--_duration:var(--md-rating-duration, var(--md-sys-motion-duration-short3, 150ms));display:inline-flex;align-items:center;gap:var(--md-sys-spacing-gap-md, 12px);color:var(--_active-color);vertical-align:middle}:host([size="xs"]){--_size:var(--md-rating-item-size, max(12px, calc(16px + var(--md-sys-density-scale, 0) * 2px)))}:host([size="sm"]){--_size:var(--md-rating-item-size, max(12px, calc(20px + var(--md-sys-density-scale, 0) * 2px)))}:host([size="md"]){--_size:var(--md-rating-item-size, max(12px, calc(28px + var(--md-sys-density-scale, 0) * 2px)))}:host([size="lg"]){--_size:var(--md-rating-item-size, max(12px, calc(36px + var(--md-sys-density-scale, 0) * 2px)))}:host([size="xl"]){--_size:var(--md-rating-item-size, max(12px, calc(48px + var(--md-sys-density-scale, 0) * 2px)))}.md-rating__items{display:inline-flex;align-items:center;gap:var(--_gap);position:relative;border-radius:var(--md-sys-shape-corner-full, 999px);outline:none}.md-rating__items:focus-visible{outline:var(--_focus-ring-width) solid var(--_focus-ring-color);outline-offset:var(--_focus-ring-offset)}.md-rating__item{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_size);block-size:var(--_size);padding:0;margin:0;border:0;background:transparent;cursor:pointer;border-radius:50%;color:inherit;font:inherit;transition:transform var(--_duration) var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),     color var(--_duration) ease;-webkit-tap-highlight-color:transparent;will-change:transform;backface-visibility:hidden}:host(.md-rating--readonly) .md-rating__item,:host(.md-rating--disabled) .md-rating__item,:host(.md-rating--soft-disabled) .md-rating__item{cursor:default}.md-rating__item:hover{transform:scale(var(--_pop-scale))}:host(.md-rating--readonly) .md-rating__item:hover,:host(.md-rating--disabled) .md-rating__item:hover,:host(.md-rating--soft-disabled) .md-rating__item:hover{transform:none}.md-rating__icon{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--md-rating-icon-font-family, 'Material Symbols Rounded', 'Material Symbols Outlined', 'Material Icons');font-size:var(--_size);font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;line-height:1;white-space:nowrap;direction:ltr;pointer-events:none;-webkit-font-smoothing:antialiased;font-feature-settings:'liga';font-variation-settings:'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24}.md-rating__icon--bg{color:var(--_inactive-color)}.md-rating__icon--fg{color:var(--_active-color);font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24}:host([outline-empty]) .md-rating__icon--bg{font-variation-settings:'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24}.md-rating__icon--state{color:var(--_state-layer-color);opacity:0;font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;transition:opacity var(--_duration) ease}.md-rating__item:hover .md-rating__icon--state{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}.md-rating__item:active .md-rating__icon--state{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}:host(.md-rating--readonly) .md-rating__icon--state,:host(.md-rating--disabled) .md-rating__icon--state,:host(.md-rating--soft-disabled) .md-rating__icon--state{display:none}.md-rating__icon--ripple{color:var(--_state-layer-color);opacity:0;font-variation-settings:'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24}:host(.md-rating--readonly) .md-rating__icon--ripple,:host(.md-rating--disabled) .md-rating__icon--ripple,:host(.md-rating--soft-disabled) .md-rating__icon--ripple{display:none}.md-rating__value-label{display:inline-grid;place-items:center start;font:var(--_label-font);font-size:var(--md-sys-typescale-label-large-size, 14px);font-weight:var(--md-sys-typescale-label-large-weight, 500);color:var(--_label-color);white-space:nowrap;font-variant-numeric:tabular-nums}.md-rating__value-label>*{grid-area:1 / 1}.md-rating__value-label-sizer{visibility:hidden;pointer-events:none}:host(.md-rating--disabled){opacity:var(--md-sys-state-disabled-content-opacity, 0.38);pointer-events:none}:host(.md-rating--soft-disabled){opacity:var(--md-sys-state-disabled-content-opacity, 0.38)}:host(.md-rating--soft-disabled) .md-rating__items{pointer-events:none}:host(.md-rating--soft-disabled) .md-rating__items{pointer-events:auto}:host(.md-rating--soft-disabled) .md-rating__item{pointer-events:none}:host-context([dir="rtl"]) .md-rating__items,:host([dir="rtl"]) .md-rating__items{flex-direction:row-reverse}@media (prefers-reduced-motion: reduce){.md-rating__item,.md-rating__icon--state{transition:none}.md-rating__item:hover{transform:none}}.material-symbols-outlined{font-family:var(--md-rating-icon-font-family, 'Material Symbols Rounded', 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const l=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdHover=e(this,"mdHover",7);this.mdChange=e(this,"mdChange",7);this.internals=this.attachInternals();this.value=0;this.defaultValue=0;this.max=5;this.precision=1;this.size="md";this.readonly=false;this.disabled=false;this.softDisabled=false;this.icon="star";this.emptyIcon="star";this.outlineEmpty=true;this.showValueLabel=false;this.ratingLabel="Rating";this.name="";this.hover="preview";this.density=0;this.hoveredValue=null;this.focused=false;this.initialValue=0;this.computeValueFromPointer=(t,i,e)=>{if(this.precision===1)return t+1;const s=e.getBoundingClientRect();const a=getComputedStyle(this.el).direction==="rtl";const n=i.clientX-s.left;const r=a?1-n/s.width:n/s.width;return t+(r<=.5?.5:1)};this.handleItemPointerMove=t=>i=>{if(!this.isInteractive)return;if(this.hover==="off")return;const e=i.currentTarget;const s=this.computeValueFromPointer(t,i,e);if(s!==this.hoveredValue){this.hoveredValue=s;this.mdHover.emit(s)}};this.handlePointerLeave=()=>{if(!this.isInteractive)return;if(this.hoveredValue==null)return;this.hoveredValue=null;this.mdHover.emit(null)};this.handleItemClick=t=>i=>{if(!this.isInteractive)return;const e=i.currentTarget;let s=this.computeValueFromPointer(t,i,e);if(s===this.value){s=this.defaultValue}this.value=s;this.mdChange.emit(s)};this.handleItemPointerDown=()=>t=>{if(!this.isInteractive||this.rippleSuppressed())return;const i=t.currentTarget;const e=i.querySelector(".md-rating__icon--ripple");if(!e||typeof e.animate!=="function")return;const s=i.getBoundingClientRect();const a=s.width?(t.clientX-s.left)/s.width*100:50;const n=s.height?(t.clientY-s.top)/s.height*100:50;e.animate([{clipPath:`circle(0% at ${a}% ${n}%)`,opacity:.22},{clipPath:`circle(85% at ${a}% ${n}%)`,opacity:0}],{duration:420,easing:"cubic-bezier(0.2, 0, 0, 1)"})};this.handleKeyDown=t=>{if(!this.isInteractive)return;const i=this.precision;let e=this.value;const s=getComputedStyle(this.el).direction==="rtl";switch(t.key){case"ArrowRight":e=s?this.value-i:this.value+i;break;case"ArrowLeft":e=s?this.value+i:this.value-i;break;case"ArrowUp":e=this.value+i;break;case"ArrowDown":e=this.value-i;break;case"Home":e=0;break;case"End":e=this.max;break;default:if(/^[0-9]$/.test(t.key)){const i=Number(t.key);if(i<=this.max)e=i}else{return}}t.preventDefault();e=Math.max(0,Math.min(this.max,e));if(e!==this.value){this.value=e;this.mdChange.emit(e)}};this.handleFocus=()=>{this.focused=true};this.handleBlur=()=>{this.focused=false;if(this.hoveredValue!=null){this.hoveredValue=null;this.mdHover.emit(null)}}}componentWillLoad(){this.validateValue(this.value);this.initialValue=this.value}validateValue(t){if(typeof t!=="number"||Number.isNaN(t)){this.value=0;return}if(t<0)this.value=0;if(t>this.max)this.value=this.max;this.syncFormValue()}onMaxChange(){if(this.value>this.max)this.value=this.max}formResetCallback(){this.value=this.initialValue}syncFormValue(){r(this.internals,this.value?String(this.value):null)}async focusRating(){const t=this.el.shadowRoot;const i=t?.querySelector(".md-rating__items");i?.focus()}get isInteractive(){return!this.readonly&&!this.disabled&&!this.softDisabled}get displayValue(){return this.hoveredValue!=null&&this.hover==="preview"?this.hoveredValue:this.value}resolveLabel(t){if(this.getLabel)return this.getLabel(t);if(t===0)return"Empty";if(t===1)return"1 Star";return`${t} Stars`}resolveAccessibleLabel(){const t=this.el;const i=t.getRootNode();const e=t=>i.getElementById?.(t)??(typeof document!=="undefined"?document.getElementById(t):null);const s=t=>t.map((t=>t?.textContent?.trim()??"")).filter(Boolean).join(" ");const a=t.getAttribute("aria-labelledby");if(a){const t=s(a.split(/\s+/).map(e));if(t)return t}const n=t.getAttribute("aria-label");if(n)return n;const r=this.internals?.labels;if(r&&r.length){const t=s(Array.from(r));if(t)return t}return this.ratingLabel}valueLabelVariants(){const t=this.precision||1;const i=new Set;for(let e=0;e<=this.max+1e-9;e+=t){const s=Math.min(Math.round(e/t)*t,this.max);i.add(this.resolveLabel(s))}return Array.from(i)}rippleSuppressed(){if(typeof getComputedStyle!=="function")return false;try{return getComputedStyle(this.el).getPropertyValue("--md-sys-ripple-enabled").trim()==="0"}catch{return false}}renderItem(t){const i=this.displayValue;const e=Math.max(0,Math.min(1,i-t));const a=e>0&&e<1;const n=e>=1;const r=e<=0;return s("span",{class:{"md-rating__item":true,"md-rating__item--full":n,"md-rating__item--half":a,"md-rating__item--empty":r},part:`item ${n?"item-full":a?"item-half":"item-empty"}`,"aria-hidden":"true",onPointerMove:this.handleItemPointerMove(t),onPointerDown:this.handleItemPointerDown(),onClick:this.handleItemClick(t)},s("span",{class:"md-rating__icon md-rating__icon--bg material-symbols-outlined",part:"icon-empty"},this.outlineEmpty?this.icon:this.emptyIcon),s("span",{class:"md-rating__icon md-rating__icon--fg material-symbols-outlined",part:"icon-filled",style:{clipPath:`inset(0 ${(1-e)*100}% 0 0)`}},this.icon),s("span",{class:"md-rating__icon md-rating__icon--state material-symbols-outlined",part:"state-layer","aria-hidden":"true"},this.icon),s("span",{class:"md-rating__icon md-rating__icon--ripple material-symbols-outlined",part:"ripple","aria-hidden":"true"},this.icon))}render(){const t=this.disabled?"-1":this.readonly?undefined:"0";const i=this.value;const e=!this.readonly;const n=this.resolveAccessibleLabel();const r=e?n:`${n}: ${this.resolveLabel(i)}`;return s(a,{key:"6a07c9c03bcae26da555b8936153fa1f78269e4c",class:{"md-rating":true,[`md-rating--${this.size}`]:true,"md-rating--readonly":this.readonly,"md-rating--disabled":this.disabled,"md-rating--soft-disabled":this.softDisabled,"md-rating--focused":this.focused}},s("div",{key:"e7ab5f40e2aac91318894ee41e552d94c42dc7d5",class:"md-rating__items",role:e?"slider":"img","aria-label":r,"aria-valuemin":e?0:undefined,"aria-valuemax":e?this.max:undefined,"aria-valuenow":e?i:undefined,"aria-valuetext":e?this.resolveLabel(i):undefined,"aria-orientation":e?"horizontal":undefined,"aria-readonly":e?"false":undefined,"aria-disabled":e&&(this.disabled||this.softDisabled)?"true":undefined,tabindex:t,part:"items",onKeyDown:this.handleKeyDown,onFocus:this.handleFocus,onBlur:this.handleBlur,onPointerLeave:this.handlePointerLeave},Array.from({length:this.max},((t,i)=>this.renderItem(i)))),this.showValueLabel&&s("span",{key:"3928dd313d1539d4de36ac82f837ace71b48ac25",class:"md-rating__value-label",part:"value-label","aria-hidden":"true"},this.valueLabelVariants().map((t=>s("span",{key:t,class:"md-rating__value-label-sizer","aria-hidden":"true"},t))),s("span",{key:"848cbe90b328be7557684d0c98cef4d44ee217a9",class:"md-rating__value-label-text"},this.resolveLabel(this.displayValue))))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{validateValue:0}],max:[{onMaxChange:0}]}}static get style(){return o()}},[65,"md-rating",{value:[1538],defaultValue:[2,"default-value"],max:[514],precision:[514],size:[513],readonly:[516],disabled:[516],softDisabled:[516,"soft-disabled"],icon:[1],emptyIcon:[1,"empty-icon"],outlineEmpty:[516,"outline-empty"],getLabel:[16],showValueLabel:[516,"show-value-label"],ratingLabel:[1,"rating-label"],name:[513],hover:[513],density:[514],hoveredValue:[32],focused:[32],focusRating:[64]},undefined,{value:[{validateValue:0}],max:[{onMaxChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const t=["md-rating"];t.forEach((t=>{switch(t){case"md-rating":if(!customElements.get(n(t))){customElements.define(n(t),l)}break}}))}d();const c=l;const m=d;export{c as MdRating,m as defineCustomElement};
+//# sourceMappingURL=md-rating.js.map

package/dist/components-csr/md-rating.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdRatingCss","MdRating","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","value","defaultValue","max","precision","size","readonly","disabled","softDisabled","icon","emptyIcon","outlineEmpty","showValueLabel","ratingLabel","name","hover","density","hoveredValue","focused","initialValue","computeValueFromPointer","itemIndex","e","itemEl","rect","getBoundingClientRect","isRtl","getComputedStyle","el","direction","x","clientX","left","ratio","width","handleItemPointerMove","i","isInteractive","target","currentTarget","next","mdHover","emit","handlePointerLeave","handleItemClick","mdChange","handleItemPointerDown","rippleSuppressed","item","ripple","querySelector","animate","y","height","clientY","top","clipPath","opacity","duration","easing","handleKeyDown","step","key","test","digit","Number","preventDefault","Math","min","handleFocus","handleBlur","componentWillLoad","validateValue","isNaN","syncFormValue","onMaxChange","formResetCallback","setFormValue","internals","String","focusRating","root","shadowRoot","host","focus","displayValue","resolveLabel","getLabel","resolveAccessibleLabel","getRootNode","byId","id","getElementById","document","joinText","els","map","textContent","trim","filter","Boolean","join","labelledby","getAttribute","text","split","hostAria","labels","length","Array","from","valueLabelVariants","set","Set","v","val","round","add","getPropertyValue","renderItem","filledPortion","isHalf","isFull","isEmpty","h","class","part","onPointerMove","onPointerDown","onClick","style","render","tabindex","undefined","interactive","baseLabel","Host","role","onKeyDown","onFocus","onBlur","onPointerLeave","_","t"],"sources":["src/components/md-rating/md-rating.css?tag=md-rating&encapsulation=shadow","src/components/md-rating/md-rating.tsx"],"sourcesContent":["/* ==========================================================\n   md-rating — Material Design 3 Expressive Rating\n   Spec: https://m3.material.io/styles/motion/overview\n   Reference parity: https://mui.com/material-ui/react-rating/\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-rating-item-size          Icon dimension (per `size`)\n     --md-rating-item-gap           Space between items\n     --md-rating-active-color       Filled icon color\n     --md-rating-inactive-color     Empty icon color\n     --md-rating-focus-ring-color   Focus ring color\n     --md-rating-focus-ring-width   Focus ring width\n     --md-rating-focus-ring-offset  Focus ring offset\n     --md-rating-state-layer-color  Hover / press overlay color\n     --md-rating-value-label-color  Color of the inline value label\n     --md-rating-value-label-font   Font of the value label\n     --md-rating-pop-scale          Scale on hover/active (MD3 Expressive)\n     --md-rating-duration           Animation duration\n\n   CSS PARTS:\n     items          The slider container\n     item           Each star/icon button\n     item-full      A fully filled item\n     item-half      A half-filled item\n     item-empty     An empty item\n     icon-empty     The background (outline) icon\n     icon-filled    The clipped foreground (filled) icon\n     state-layer    Hover / press overlay — a filled glyph tracing the icon shape\n     ripple         Press ripple — a glyph-clipped expanding circle\n     value-label    The inline numeric value label\n   ========================================================== */\n\n:host {\n  --_size: var(--md-rating-item-size, max(12px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));\n  --_gap: var(--md-rating-item-gap, var(--md-sys-spacing-gap-xs, 4px));\n  --_active-color: var(--md-rating-active-color, var(--md-sys-color-secondary, #FFB400));\n  --_inactive-color: var(--md-rating-inactive-color, color-mix(in srgb, var(--md-sys-color-on-surface-variant) 30%, transparent));\n  --_focus-ring-color: var(--md-rating-focus-ring-color, var(--md-sys-color-secondary));\n  --_focus-ring-width: var(--md-rating-focus-ring-width, 3px);\n  --_focus-ring-offset: var(--md-rating-focus-ring-offset, 2px);\n  --_state-layer-color: var(--md-rating-state-layer-color, var(--md-sys-color-on-surface));\n  --_label-color: var(--md-rating-value-label-color, var(--md-sys-color-on-surface));\n  --_label-font: var(\n    --md-rating-value-label-font,\n    var(--md-sys-typescale-label-medium-font, system-ui)\n  );\n  --_pop-scale: var(--md-rating-pop-scale, 1.12);\n  --_duration: var(--md-rating-duration, var(--md-sys-motion-duration-short3, 150ms));\n\n  display: inline-flex;\n  align-items: center;\n  gap: var(--md-sys-spacing-gap-md, 12px);\n  color: var(--_active-color);\n  vertical-align: middle;\n}\n\n/* Size scale — MD3 Expressive density variants. */\n:host([size=\"xs\"]) { --_size: var(--md-rating-item-size, max(12px, calc(16px + var(--md-sys-density-scale, 0) * 2px))); }\n:host([size=\"sm\"]) { --_size: var(--md-rating-item-size, max(12px, calc(20px + var(--md-sys-density-scale, 0) * 2px))); }\n:host([size=\"md\"]) { --_size: var(--md-rating-item-size, max(12px, calc(28px + var(--md-sys-density-scale, 0) * 2px))); }\n:host([size=\"lg\"]) { --_size: var(--md-rating-item-size, max(12px, calc(36px + var(--md-sys-density-scale, 0) * 2px))); }\n:host([size=\"xl\"]) { --_size: var(--md-rating-item-size, max(12px, calc(48px + var(--md-sys-density-scale, 0) * 2px))); }\n\n.md-rating__items {\n  display: inline-flex;\n  align-items: center;\n  gap: var(--_gap);\n  position: relative;\n  border-radius: var(--md-sys-shape-corner-full, 999px);\n  outline: none;\n}\n\n.md-rating__items:focus-visible {\n  outline: var(--_focus-ring-width) solid var(--_focus-ring-color);\n  outline-offset: var(--_focus-ring-offset);\n}\n\n/* ── Item ─────────────────────────────────────────────────────── */\n\n.md-rating__item {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: var(--_size);\n  block-size: var(--_size);\n  padding: 0;\n  margin: 0;\n  border: 0;\n  background: transparent;\n  cursor: pointer;\n  border-radius: 50%;\n  color: inherit;\n  font: inherit;\n  transition:\n    transform var(--_duration) var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n    color var(--_duration) ease;\n  -webkit-tap-highlight-color: transparent;\n  /* Composite the item so the hover pop scales the cached raster instead of\n     re-hinting the font glyphs every frame — kills the edge shimmer/jitter. */\n  will-change: transform;\n  backface-visibility: hidden;\n}\n\n:host(.md-rating--readonly) .md-rating__item,\n:host(.md-rating--disabled) .md-rating__item,\n:host(.md-rating--soft-disabled) .md-rating__item {\n  cursor: default;\n}\n\n.md-rating__item:hover {\n  transform: scale(var(--_pop-scale));\n}\n\n:host(.md-rating--readonly) .md-rating__item:hover,\n:host(.md-rating--disabled) .md-rating__item:hover,\n:host(.md-rating--soft-disabled) .md-rating__item:hover {\n  transform: none;\n}\n\n/* ── Icons ────────────────────────────────────────────────────── */\n\n.md-rating__icon {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--md-rating-icon-font-family, 'Material Symbols Rounded', 'Material Symbols Outlined', 'Material Icons');\n  font-size: var(--_size);\n  font-weight: normal;\n  font-style: normal;\n  letter-spacing: normal;\n  text-transform: none;\n  line-height: 1;\n  white-space: nowrap;\n  direction: ltr;\n  pointer-events: none;\n  -webkit-font-smoothing: antialiased;\n  font-feature-settings: 'liga';\n  font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24;\n}\n\n.md-rating__icon--bg {\n  color: var(--_inactive-color);\n}\n\n.md-rating__icon--fg {\n  color: var(--_active-color);\n  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;\n}\n\n/* Outline-empty styling: use the filled glyph with the inactive\n   colour for both layers so the outline silhouette is preserved. */\n:host([outline-empty]) .md-rating__icon--bg {\n  font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;\n}\n\n/* ── State layer ──────────────────────────────────────────────── */\n\n/* The hover/press overlay is a filled copy of the glyph, so the state\n   layer traces the icon silhouette (a star, heart, bolt…) instead of the\n   old circle. It sits on top of the icons and tints them within their own\n   shape. */\n.md-rating__icon--state {\n  color: var(--_state-layer-color);\n  opacity: 0;\n  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;\n  transition: opacity var(--_duration) ease;\n}\n\n.md-rating__item:hover .md-rating__icon--state {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n\n.md-rating__item:active .md-rating__icon--state {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.12);\n}\n\n:host(.md-rating--readonly) .md-rating__icon--state,\n:host(.md-rating--disabled) .md-rating__icon--state,\n:host(.md-rating--soft-disabled) .md-rating__icon--state {\n  display: none;\n}\n\n/* ── Press ripple ─────────────────────────────────────────────── */\n\n/* A filled copy of the glyph, invisible at rest. handleItemPointerDown drives\n   an expanding `clip-path: circle()` + fade over it via the Web Animations API,\n   so the ripple reveals within the icon silhouette. */\n.md-rating__icon--ripple {\n  color: var(--_state-layer-color);\n  opacity: 0;\n  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;\n}\n\n:host(.md-rating--readonly) .md-rating__icon--ripple,\n:host(.md-rating--disabled) .md-rating__icon--ripple,\n:host(.md-rating--soft-disabled) .md-rating__icon--ripple {\n  display: none;\n}\n\n/* ── Value label ──────────────────────────────────────────────── */\n\n.md-rating__value-label {\n  /* Grid-stack the visible text over the hidden sizers so the box always\n     reserves the widest label's width — the text can change on hover without\n     resizing the box and reflowing the row. */\n  display: inline-grid;\n  place-items: center start;\n  font: var(--_label-font);\n  font-size: var(--md-sys-typescale-label-large-size, 14px);\n  font-weight: var(--md-sys-typescale-label-large-weight, 500);\n  color: var(--_label-color);\n  white-space: nowrap;\n  font-variant-numeric: tabular-nums;\n}\n\n.md-rating__value-label > * {\n  grid-area: 1 / 1;\n}\n\n.md-rating__value-label-sizer {\n  visibility: hidden;\n  pointer-events: none;\n}\n\n/* ── Disabled / readonly visuals ──────────────────────────────── */\n\n:host(.md-rating--disabled) {\n  opacity: var(--md-sys-state-disabled-content-opacity, 0.38);\n  pointer-events: none;\n}\n\n:host(.md-rating--soft-disabled) {\n  opacity: var(--md-sys-state-disabled-content-opacity, 0.38);\n}\n\n:host(.md-rating--soft-disabled) .md-rating__items {\n  pointer-events: none;\n}\n\n/* Allow keyboard focus on soft-disabled. */\n:host(.md-rating--soft-disabled) .md-rating__items {\n  pointer-events: auto;\n}\n\n:host(.md-rating--soft-disabled) .md-rating__item {\n  pointer-events: none;\n}\n\n/* ── RTL mirroring ─────────────────────────────────────────────── */\n\n:host-context([dir=\"rtl\"]) .md-rating__items,\n:host([dir=\"rtl\"]) .md-rating__items {\n  flex-direction: row-reverse;\n}\n\n/* ── Reduced motion ────────────────────────────────────────────── */\n\n@media (prefers-reduced-motion: reduce) {\n  .md-rating__item,\n  .md-rating__icon--state {\n    transition: none;\n  }\n  .md-rating__item:hover {\n    transform: none;\n  }\n}\n\n/* ── Material Symbols font (shadow-root scope) ─────────────────── */\n\n/* Shadow DOM doesn't inherit page-level font-family rules, so the\n   `.material-symbols-outlined` class on our internal icon spans\n   needs its own font declaration here. Mirrors md-button.css. */\n.material-symbols-outlined {\n  font-family: var(--md-rating-icon-font-family, 'Material Symbols Rounded', 'Material Symbols Outlined', 'Material Icons');\n  font-weight: normal;\n  font-style: normal;\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  direction: ltr;\n  font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Watch,\n  Method,\n  AttachInternals,\n} from '@stencil/core';\nimport { setFormValue } from '../../utils/form';\n\n/**\n * `md-rating` — Material Design 3 Expressive Rating control.\n *\n * A star-rating input: configurable max, half-step precision, custom icons\n * (Material Symbols glyphs OR slotted SVG/HTML), per-value icons\n * (filled / empty), hover preview, read-only and disabled modes,\n * keyboard navigation (Arrow + Home/End), and reset to zero.\n *\n * MD3 Expressive: items animate with a brief tonal \"scale-up\" pop on\n * hover and selection; press uses a state-layer + ripple. The\n * underlying ARIA pattern is a slider so screen readers announce the\n * value as a continuous range.\n */\n@Component({\n  tag: 'md-rating',\n  styleUrl: 'md-rating.css',\n  shadow: true,\n  formAssociated: true,\n})\nexport class MdRating {\n  @Element() el!: HTMLElement;\n\n  /**\n   * Form-association handle. The rating submits its `value` under the host's\n   * `name` via `setFormValue`, so it participates in `<form>`/`FormData`\n   * natively — a hidden `<input>` in the shadow root would be invisible to\n   * `FormData`.\n   */\n  @AttachInternals() internals!: ElementInternals;\n\n  /** Current numeric rating (0 → max, half-steps when precision = 0.5). */\n  @Prop({ mutable: true, reflect: true }) value: number = 0;\n\n  /** Default value used when the consumer clears the rating (re-clicking the\n   *  current value). */\n  @Prop({ attribute: 'default-value' }) defaultValue: number = 0;\n\n  /** Maximum rating (number of items rendered). */\n  @Prop({ reflect: true }) max: number = 5;\n\n  /** Step size — `1` (full only) or `0.5` (half). */\n  @Prop({ reflect: true }) precision: 1 | 0.5 = 1;\n\n  /** Size of each item. */\n  @Prop({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'md';\n\n  /** Read-only — purely decorative; no interaction, no focus. */\n  @Prop({ reflect: true }) readonly: boolean = false;\n\n  /** Disabled — non-interactive and visually dimmed; not focusable. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Soft-disabled — disabled visuals but remains focusable for discoverability. */\n  @Prop({ reflect: true, attribute: 'soft-disabled' }) softDisabled: boolean = false;\n\n  /** Material Symbols glyph used for *filled* items. */\n  @Prop() icon: string = 'star';\n\n  /** Material Symbols glyph used for *empty* items. */\n  @Prop({ attribute: 'empty-icon' }) emptyIcon: string = 'star';\n\n  /**\n   * Use the *filled* glyph for empty items as well, drawn with the\n   * outline-only color treatment — a solid silhouette outline behind\n   * the fill.\n   */\n  @Prop({ attribute: 'outline-empty', reflect: true }) outlineEmpty: boolean = true;\n\n  /**\n   * Optional label provider — `el.getLabel = (v) => \"${v} Stars\"`. Used\n   * by the hidden screen-reader text and the visible value label\n   * when `show-value-label` is set.\n   */\n  @Prop() getLabel?: (value: number) => string;\n\n  /** When true, render the current numeric value beside the items. */\n  @Prop({ attribute: 'show-value-label', reflect: true }) showValueLabel: boolean = false;\n\n  /** Accessible label for the slider role. */\n  /**\n   * Accessible name for the rating control.\n   *\n   * The attribute is `rating-label`, NOT `aria-label-rating`. Anything starting\n   * with `aria-` is parsed as an ARIA attribute, and `aria-label-rating` is not\n   * one — so the previous name made axe report a CRITICAL `aria-valid-attr`\n   * violation on every consumer that used the documented API. The value still\n   * ends up as the host's accessible name; only the attribute spelling changed.\n   */\n  @Prop({ attribute: 'rating-label' }) ratingLabel: string = 'Rating';\n\n  /** Form name for native form participation. */\n  @Prop({ reflect: true }) name: string = '';\n\n  /**\n   * Hover-preview behaviour:\n   *   - `'preview'` (default) — display the hovered value over the live one.\n   *   - `'off'` — no hover preview; `value` is the only signal.\n   */\n  @Prop({ reflect: true }) hover: 'preview' | 'off' = 'preview';\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /** Fires while the user is hovering (or `null` when the cursor leaves). */\n  @Event() mdHover: EventEmitter<number | null>;\n\n  /** Fires whenever the value changes via interaction. */\n  @Event() mdChange: EventEmitter<number>;\n\n  @State() private hoveredValue: number | null = null;\n  @State() private focused: boolean = false;\n\n  /** Initial rating at load, restored on form reset. */\n  private initialValue = 0;\n\n  componentWillLoad() {\n    this.validateValue(this.value);\n    this.initialValue = this.value;\n  }\n\n  @Watch('value')\n  validateValue(next: number) {\n    if (typeof next !== 'number' || Number.isNaN(next)) {\n      this.value = 0;\n      return;\n    }\n    if (next < 0) this.value = 0;\n    if (next > this.max) this.value = this.max;\n    this.syncFormValue();\n  }\n\n  /** Re-clamp the value when `max` shrinks, so aria-valuenow can never fall\n   *  outside the announced [aria-valuemin, aria-valuemax] range. */\n  @Watch('max')\n  onMaxChange() {\n    if (this.value > this.max) this.value = this.max;\n  }\n\n  /** Restore the initial rating when the owning form is reset. */\n  formResetCallback() {\n    this.value = this.initialValue;\n  }\n\n  /** Keep the submitted form value in sync with the rating. */\n  private syncFormValue() {\n    setFormValue(this.internals, this.value ? String(this.value) : null);\n  }\n\n  /** Programmatically focus the rating. */\n  @Method()\n  async focusRating() {\n    const root = this.el.shadowRoot;\n    const host = root?.querySelector('.md-rating__items') as HTMLElement | null;\n    host?.focus();\n  }\n\n  private get isInteractive(): boolean {\n    return !this.readonly && !this.disabled && !this.softDisabled;\n  }\n\n  private get displayValue(): number {\n    return this.hoveredValue != null && this.hover === 'preview'\n      ? this.hoveredValue\n      : this.value;\n  }\n\n  private resolveLabel(value: number): string {\n    if (this.getLabel) return this.getLabel(value);\n    if (value === 0) return 'Empty';\n    if (value === 1) return '1 Star';\n    return `${value} Stars`;\n  }\n\n  /**\n   * Accessible name for the slider. The focusable node is the shadow-internal\n   * slider, so an external `<label>`, `aria-labelledby`, or host `aria-label`\n   * can't otherwise name it (IDREFs don't cross the shadow boundary; a host\n   * label on a generic host is dropped). We forward it: aria-labelledby (text)\n   * → host aria-label → associated `<label>`s (via ElementInternals) → the\n   * `rating-label` prop as the attribute-only fallback.\n   */\n  private resolveAccessibleLabel(): string {\n    const host = this.el;\n    const root = host.getRootNode() as Document | ShadowRoot;\n    const byId = (id: string): Element | null =>\n      (root as Document).getElementById?.(id) ??\n      (typeof document !== 'undefined' ? document.getElementById(id) : null);\n    const joinText = (els: Array<Element | null>) =>\n      els.map((el) => el?.textContent?.trim() ?? '').filter(Boolean).join(' ');\n\n    const labelledby = host.getAttribute('aria-labelledby');\n    if (labelledby) {\n      const text = joinText(labelledby.split(/\\s+/).map(byId));\n      if (text) return text;\n    }\n\n    const hostAria = host.getAttribute('aria-label');\n    if (hostAria) return hostAria;\n\n    const labels = this.internals?.labels;\n    if (labels && labels.length) {\n      const text = joinText(Array.from(labels) as Element[]);\n      if (text) return text;\n    }\n\n    return this.ratingLabel;\n  }\n\n  /**\n   * Every label the value can take (one per discrete step, 0 → max). Rendered as\n   * hidden sizers behind the visible label so its box reserves the widest label's\n   * width — otherwise the text swapping on hover (\"1 Star\" → \"3.5 Stars\") would\n   * resize the box and reflow the whole component. Icon-agnostic re: getLabel.\n   */\n  private valueLabelVariants(): string[] {\n    const step = this.precision || 1;\n    const set = new Set<string>();\n    for (let v = 0; v <= this.max + 1e-9; v += step) {\n      const val = Math.min(Math.round(v / step) * step, this.max);\n      set.add(this.resolveLabel(val));\n    }\n    return Array.from(set);\n  }\n\n  private computeValueFromPointer = (\n    itemIndex: number,\n    e: MouseEvent | PointerEvent,\n    itemEl: HTMLElement,\n  ): number => {\n    if (this.precision === 1) return itemIndex + 1;\n    const rect = itemEl.getBoundingClientRect();\n    const isRtl = getComputedStyle(this.el).direction === 'rtl';\n    const x = e.clientX - rect.left;\n    const ratio = isRtl ? 1 - x / rect.width : x / rect.width;\n    return itemIndex + (ratio <= 0.5 ? 0.5 : 1);\n  };\n\n  private handleItemPointerMove = (i: number) => (e: PointerEvent) => {\n    if (!this.isInteractive) return;\n    if (this.hover === 'off') return;\n    const target = e.currentTarget as HTMLElement;\n    const next = this.computeValueFromPointer(i, e, target);\n    if (next !== this.hoveredValue) {\n      this.hoveredValue = next;\n      this.mdHover.emit(next);\n    }\n  };\n\n  private handlePointerLeave = () => {\n    if (!this.isInteractive) return;\n    if (this.hoveredValue == null) return;\n    this.hoveredValue = null;\n    this.mdHover.emit(null);\n  };\n\n  private handleItemClick = (i: number) => (e: MouseEvent) => {\n    if (!this.isInteractive) return;\n    const target = e.currentTarget as HTMLElement;\n    let next = this.computeValueFromPointer(i, e, target);\n\n    if (next === this.value) {\n      next = this.defaultValue;\n    }\n\n    this.value = next;\n    this.mdChange.emit(next);\n  };\n\n  /**\n   * True when ripples are switched off, globally (`data-ripple=\"off\"` on an\n   * ancestor) or on this component (`ripple=\"off\"`). Both resolve to\n   * `--md-sys-ripple-enabled` in tokens.css §13.\n   *\n   * md-rating does NOT use the shared md-ripple element — its press effect is a\n   * filled copy of the glyph revealed by a WAAPI clip-path animation, so it\n   * bypasses the gate in md-ripple entirely and needs its own check to honour\n   * the same switch.\n   *\n   * `=== '0'` deliberately: an unset property returns '' and must mean ENABLED,\n   * so a falsiness test would kill ripples wherever the token sheet is absent.\n   */\n  private rippleSuppressed(): boolean {\n    if (typeof getComputedStyle !== 'function') return false;\n    try {\n      return (\n        getComputedStyle(this.el).getPropertyValue('--md-sys-ripple-enabled').trim() === '0'\n      );\n    } catch {\n      return false;\n    }\n  }\n\n  /**\n   * Press ripple, clipped to the glyph. The ripple layer is a filled copy of\n   * the icon, so an expanding `clip-path: circle()` from the pointer reveals it\n   * within the star/heart/bolt silhouette — a shaped ripple that stays\n   * icon-agnostic (no hardcoded star geometry). Runs via the Web Animations API\n   * so each press restarts cleanly and it no-ops in non-DOM (spec) envs.\n   */\n  private handleItemPointerDown = () => (e: PointerEvent) => {\n    if (!this.isInteractive || this.rippleSuppressed()) return;\n    const item = e.currentTarget as HTMLElement;\n    const ripple = item.querySelector('.md-rating__icon--ripple') as HTMLElement | null;\n    if (!ripple || typeof ripple.animate !== 'function') return;\n    const rect = item.getBoundingClientRect();\n    const x = rect.width ? ((e.clientX - rect.left) / rect.width) * 100 : 50;\n    const y = rect.height ? ((e.clientY - rect.top) / rect.height) * 100 : 50;\n    ripple.animate(\n      [\n        { clipPath: `circle(0% at ${x}% ${y}%)`, opacity: 0.22 },\n        { clipPath: `circle(85% at ${x}% ${y}%)`, opacity: 0 },\n      ],\n      { duration: 420, easing: 'cubic-bezier(0.2, 0, 0, 1)' },\n    );\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (!this.isInteractive) return;\n    const step = this.precision;\n    let next = this.value;\n    const isRtl = getComputedStyle(this.el).direction === 'rtl';\n\n    switch (e.key) {\n      case 'ArrowRight':\n        next = isRtl ? this.value - step : this.value + step;\n        break;\n      case 'ArrowLeft':\n        next = isRtl ? this.value + step : this.value - step;\n        break;\n      case 'ArrowUp':\n        next = this.value + step;\n        break;\n      case 'ArrowDown':\n        next = this.value - step;\n        break;\n      case 'Home':\n        next = 0;\n        break;\n      case 'End':\n        next = this.max;\n        break;\n      default:\n        if (/^[0-9]$/.test(e.key)) {\n          const digit = Number(e.key);\n          if (digit <= this.max) next = digit;\n        } else {\n          // Not a slider key (e.g. Escape/Tab): let it bubble untouched so a\n          // dialog/menu ancestor can still dismiss. Home already clears to 0.\n          return;\n        }\n    }\n    e.preventDefault();\n    next = Math.max(0, Math.min(this.max, next));\n    if (next !== this.value) {\n      this.value = next;\n      this.mdChange.emit(next);\n    }\n  };\n\n  private handleFocus = () => {\n    this.focused = true;\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    if (this.hoveredValue != null) {\n      this.hoveredValue = null;\n      this.mdHover.emit(null);\n    }\n  };\n\n  private renderItem(i: number) {\n    const value = this.displayValue;\n    const filledPortion = Math.max(0, Math.min(1, value - i));\n    const isHalf = filledPortion > 0 && filledPortion < 1;\n    const isFull = filledPortion >= 1;\n    const isEmpty = filledPortion <= 0;\n\n    return (\n      // A non-interactive <span> (not <button>): the single interactive control\n      // is the role=\"slider\" container, so an interactive descendant would trip\n      // WAI-ARIA \"nested-interactive\". Pointer handlers still drive selection;\n      // keyboard is handled on the slider. aria-hidden keeps it out of the tree.\n      <span\n        class={{\n          'md-rating__item': true,\n          'md-rating__item--full': isFull,\n          'md-rating__item--half': isHalf,\n          'md-rating__item--empty': isEmpty,\n        }}\n        part={`item ${isFull ? 'item-full' : isHalf ? 'item-half' : 'item-empty'}`}\n        aria-hidden=\"true\"\n        onPointerMove={this.handleItemPointerMove(i)}\n        onPointerDown={this.handleItemPointerDown()}\n        onClick={this.handleItemClick(i)}\n      >\n        <span class=\"md-rating__icon md-rating__icon--bg material-symbols-outlined\" part=\"icon-empty\">\n          {this.outlineEmpty ? this.icon : this.emptyIcon}\n        </span>\n        <span\n          class=\"md-rating__icon md-rating__icon--fg material-symbols-outlined\"\n          part=\"icon-filled\"\n          style={{ clipPath: `inset(0 ${(1 - filledPortion) * 100}% 0 0)` }}\n        >\n          {this.icon}\n        </span>\n        {/* State layer is a third copy of the glyph, so the hover/press overlay\n            follows the icon silhouette (star, heart, bolt…) instead of a circle. */}\n        <span\n          class=\"md-rating__icon md-rating__icon--state material-symbols-outlined\"\n          part=\"state-layer\"\n          aria-hidden=\"true\"\n        >\n          {this.icon}\n        </span>\n        {/* Press ripple, clipped to the glyph via an expanding clip-path circle\n            driven from handleItemPointerDown (see there). */}\n        <span\n          class=\"md-rating__icon md-rating__icon--ripple material-symbols-outlined\"\n          part=\"ripple\"\n          aria-hidden=\"true\"\n        >\n          {this.icon}\n        </span>\n      </span>\n    );\n  }\n\n  render() {\n    const tabindex = this.disabled\n      ? '-1'\n      : this.readonly\n        ? undefined\n        : '0';\n\n    const value = this.value;\n    // Readonly renders as role=\"img\" (a static picture of the rating). `img`\n    // does NOT support the slider value/orientation/readonly attributes, so\n    // emitting them trips WAI-ARIA \"aria-allowed-attr\". Instead the value is\n    // folded into the img's accessible NAME (img ignores aria-valuetext), and\n    // the slider ARIA is applied only in the interactive branch.\n    const interactive = !this.readonly;\n    const baseLabel = this.resolveAccessibleLabel();\n    const name = interactive\n      ? baseLabel\n      : `${baseLabel}: ${this.resolveLabel(value)}`;\n\n    return (\n      <Host\n        class={{\n          'md-rating': true,\n          [`md-rating--${this.size}`]: true,\n          'md-rating--readonly': this.readonly,\n          'md-rating--disabled': this.disabled,\n          'md-rating--soft-disabled': this.softDisabled,\n          'md-rating--focused': this.focused,\n        }}\n      >\n        <div\n          class=\"md-rating__items\"\n          role={interactive ? 'slider' : 'img'}\n          aria-label={name}\n          aria-valuemin={interactive ? 0 : undefined}\n          aria-valuemax={interactive ? this.max : undefined}\n          aria-valuenow={interactive ? value : undefined}\n          aria-valuetext={interactive ? this.resolveLabel(value) : undefined}\n          aria-orientation={interactive ? 'horizontal' : undefined}\n          aria-readonly={interactive ? 'false' : undefined}\n          aria-disabled={interactive && (this.disabled || this.softDisabled) ? 'true' : undefined}\n          tabindex={tabindex}\n          part=\"items\"\n          onKeyDown={this.handleKeyDown}\n          onFocus={this.handleFocus}\n          onBlur={this.handleBlur}\n          onPointerLeave={this.handlePointerLeave}\n        >\n          {Array.from({ length: this.max }, (_, i) => this.renderItem(i))}\n        </div>\n        {this.showValueLabel && (\n          <span class=\"md-rating__value-label\" part=\"value-label\" aria-hidden=\"true\">\n            {/* Hidden sizers reserve the widest label's width so the visible text\n                swapping on hover doesn't reflow the row (see valueLabelVariants). */}\n            {this.valueLabelVariants().map((t) => (\n              <span key={t} class=\"md-rating__value-label-sizer\" aria-hidden=\"true\">\n                {t}\n              </span>\n            ))}\n            <span class=\"md-rating__value-label-text\">\n              {this.resolveLabel(this.displayValue)}\n            </span>\n          </span>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-ripple.js

@@ -0,0 +1,2 @@
+import{M as o,d as s}from"./p-Hm3X1iai.js";const t=o;const a=s;export{t as MdRipple,a as defineCustomElement};
+//# sourceMappingURL=md-ripple.js.map

package/dist/components-csr/md-ripple.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/components-csr/md-search.js

@@ -0,0 +1,2 @@
+import{p as e,H as i,c as t,h as s,d as a,t as r}from"./p-bSpXNc5J.js";import{d as n}from"./p-IWA0yIjJ.js";import{d as o}from"./p-CG6FaRlt.js";import{d as c}from"./p-Hm3X1iai.js";const d=()=>`:host{--_container-color:var(     --md-search-container-color,     var(--md-sys-color-surface-container-high, #ECE6F0)   );--_container-shape:var(     --md-search-container-shape,     var(--md-sys-shape-corner-full, 9999px)   );--_container-height:var(--md-search-container-height, max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px)));--_resting-corner-shape:min(     var(--_container-shape),     calc(var(--_container-height) / 2)   );--_docked-panel-shape:var(--md-search-docked-panel-shape, var(--md-sys-shape-corner-large, 16px));--_divided-fullscreen-bar-height:var(--md-search-divided-fullscreen-bar-height, max(48px, calc(72px + var(--md-sys-density-scale, 0) * 4px)));--_leading-icon-label-gap:var(--md-search-leading-icon-label-gap, 4px);--_trailing-icon-label-gap:var(--md-search-trailing-icon-label-gap, 4px);--_icon-button-size:var(--md-search-icon-button-size, max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px)));--_container-min-inline-size:var(--md-search-container-min-inline-size, 360px);--_container-max-inline-size:var(--md-search-container-max-inline-size, 720px);--_container-padding-inline:var(--md-search-container-padding-inline, 0px);--_container-padding-inline-focused:var(     --md-search-container-padding-inline-focused,     var(--_container-padding-inline)   );--_leading-padding-inline:var(--md-search-leading-padding-inline, 4px);--_trailing-padding-inline:var(--md-search-trailing-padding-inline, 8px);--_expand-inset:var(--md-search-expand-inset, 24px);--_expand-inset-focused:var(--md-search-expand-focused-inset, 12px);--_expand-duration:var(     --md-search-expand-duration,     var(--md-sys-motion-duration-medium4, 400ms)   );--_expand-easing:var(     --md-search-expand-easing,     cubic-bezier(0.34, 1.56, 0.64, 1)   );--_input-color:var(     --md-search-input-color,     var(--md-sys-color-on-surface, #1D1B20)   );--_input-font-family:var(     --md-search-input-font-family,     var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif)   );--_input-font-size:var(     --md-search-input-font-size,     max(13px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px))   );--_input-line-height:var(     --md-search-input-line-height,     var(--md-sys-typescale-body-large-line-height, 24px)   );--_input-font-weight:var(     --md-search-input-font-weight,     var(--md-sys-typescale-body-large-font-weight, 400)   );--_input-letter-spacing:var(     --md-search-input-letter-spacing,     var(--md-sys-typescale-body-large-letter-spacing, 0.5px)   );--_placeholder-color:var(     --md-search-placeholder-color,     var(--md-sys-color-on-surface-variant, #49454F)   );--_leading-icon-color:var(     --md-search-leading-icon-color,     var(--md-sys-color-on-surface, #1D1B20)   );--_trailing-icon-color:var(     --md-search-trailing-icon-color,     var(       --md-search-icon-color,       var(--md-sys-color-on-surface-variant, #49454F)     )   );--_icon-size:var(--md-search-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));--_loading-color:var(     --md-search-loading-color,     var(--md-sys-color-primary, #6750A4)   );--_open-glyph-mirror:1;--_contained-background-color:var(     --md-search-contained-background-color,     var(--md-sys-color-surface-container-low, #F7F2FA)   );--_container-elevation-level:0px 0px 0px 0px transparent;--_container-elevation:var(     --md-search-container-elevation,     var(--_container-elevation-level)   );--_state-layer-color:var(     --md-search-state-layer-color,     var(--md-sys-color-on-surface, #1D1B20)   );--_hover-state-layer-opacity:var(     --md-search-hover-state-layer-opacity,     var(--md-sys-state-hover-state-layer-opacity, 0.08)   );--_pressed-state-layer-opacity:var(     --md-search-pressed-state-layer-opacity,     0.1   );--_focus-indicator-color:var(     --md-search-focus-indicator-color,     var(--md-sys-color-secondary, #625B71)   );--_focus-indicator-thickness:var(--md-search-focus-indicator-thickness, 3px);--_focus-indicator-offset:var(--md-search-focus-indicator-offset, 2px);--_avatar-size:var(--md-search-avatar-size, 40px);--_panel-min-block-size:var(--md-search-panel-min-block-size, 0px);--_panel-max-block-size:var(--md-search-panel-max-block-size, min(400px, 60vh));--_max-block-size:var(--md-search-max-block-size);--_panel-offset:var(     --md-search-panel-offset,     calc(var(--_focus-indicator-offset) + var(--_focus-indicator-thickness) + 3px)   );--_bar-fullscreen-color:var(     --md-search-bar-fullscreen-color,     var(--md-sys-color-surface-container-low, #F7F2FA)   );--_fullscreen-results-color:var(     --md-search-fullscreen-results-color,     var(--md-sys-color-surface-container-low, #F7F2FA)   );--_divider-color:var(     --md-search-divider-color,     var(--md-sys-color-outline, #79747E)   );--_divider-thickness:var(--md-search-divider-thickness, 1px);--_fullscreen-bar-offset-block-start:var(     --md-search-fullscreen-bar-offset-block-start,     max(16px, env(safe-area-inset-block-start, 0px))   );--_fullscreen-bar-offset-inline:var(     --md-search-fullscreen-bar-offset-inline,     max(0px, env(safe-area-inset-inline-start, 0px))   );--_fullscreen-bar-panel-gap:var(--md-search-fullscreen-bar-panel-gap, 0px);--_panel-padding-block-start:var(--md-search-panel-padding-block-start, 0px);--_motion-duration:var(     --md-search-panel-motion-duration,     var(--md-sys-motion-duration-medium2, 250ms)   );--_motion-easing:var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));--_fs-expand-duration:var(     --md-search-fullscreen-expand-duration,     var(--md-sys-motion-duration-medium2, 300ms)   );--_fs-expand-easing:var(     --md-search-fullscreen-expand-easing,     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))   );--_fs-collapse-duration:var(     --md-search-fullscreen-collapse-duration,     var(--md-sys-motion-duration-medium2, 300ms)   );--_fs-collapse-easing:var(     --md-search-fullscreen-collapse-easing,     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))   );display:block;position:relative;inline-size:100%;min-inline-size:var(--_container-min-inline-size);max-inline-size:var(--_container-max-inline-size);margin-inline:auto;min-block-size:var(--_container-height);font-family:var(--_input-font-family);color:var(--_input-color);box-sizing:border-box}:host([hidden]){display:none}:host(.md-search--trigger-icon.md-search--closed){display:inline-flex;flex-direction:column;align-items:center;justify-content:center;inline-size:fit-content;block-size:fit-content;min-inline-size:0;max-inline-size:none;min-block-size:0;margin-inline:0;overflow:visible}:host(.md-search--trigger-icon.md-search--closed) .md-search__panel,:host(.md-search--trigger-icon.md-search--closed) .md-search__inset-probe{display:none}:host(.md-search--trigger-icon.md-search--open) .md-search__trigger{display:none}.md-search__trigger{display:contents}:host(.md-search--trigger-icon) .md-search__trigger-button{--md-icon-button-container-width:max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-container-height:max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-icon-size:max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px));--md-icon-button-icon-color:var(     --md-search-leading-icon-color,     var(--md-sys-color-on-surface, #1d1b20)   )}:host(.md-search--contained.md-search--docked){--_panel-offset:var(     --md-search-contained-docked-panel-offset,     calc(var(--_focus-indicator-offset) + var(--_focus-indicator-thickness) + 3px)   )}:host(.md-search--full-screen){--_expand-inset:0px;--_expand-inset-focused:0px}:host(.md-search--full-width){--_expand-inset:0px;--_expand-inset-focused:0px}:host(.md-search--contained.md-search--full-screen){--_fullscreen-bar-offset-inline:var(     --md-search-fullscreen-bar-offset-inline,     max(8px, env(safe-area-inset-inline-start, 0px))   );--_fullscreen-bar-panel-gap:var(     --md-search-fullscreen-bar-panel-gap,     calc(var(--_focus-indicator-offset) + var(--_focus-indicator-thickness) + 3px)   )}:host(.md-search--divided.md-search--full-screen.md-search--open){--_container-height:var(--_divided-fullscreen-bar-height);--_fullscreen-bar-offset-block-start:max(0px, env(safe-area-inset-block-start, 0px));--_fullscreen-bar-offset-inline:max(0px, env(safe-area-inset-inline-start, 0px))}:host(.md-search--full-screen.md-search--open){position:fixed;inset:0;display:block;inline-size:100%;block-size:100dvh;max-inline-size:none;min-inline-size:0;margin:0;min-block-size:0;z-index:var(--md-sys-z-index-modal, 1300);box-sizing:border-box}:host(.md-search--trigger-icon.md-search--full-screen.md-search--open){display:block;inline-size:100%;block-size:100dvh;max-inline-size:none;min-inline-size:0;min-block-size:0;align-items:stretch;justify-content:flex-start}:host(.md-search--full-screen.md-search--open) .md-search__bar{position:fixed;inset-block-start:var(--_fullscreen-bar-offset-block-start);inset-inline:var(--_fullscreen-bar-offset-inline);inline-size:auto;margin-inline:0;z-index:2}:host(.md-search--full-screen.md-search--open) .md-search__bar--focus-ring{z-index:2}:host(.md-search--full-screen.md-search--open) .md-search__panel--full-screen{position:fixed;inset:0;margin:0;padding-block-start:calc(     var(--_fullscreen-bar-offset-block-start) + var(--_container-height) +       var(--_fullscreen-bar-panel-gap) + var(--_panel-padding-block-start)   );padding-inline:0;max-block-size:var(--_max-block-size, 100dvh);z-index:1;background-color:var(--_fullscreen-results-color)}:host(.md-search--contained.md-search--open) .md-search__leading-button{margin-inline-start:0}.md-search__bar{position:relative;display:flex;align-items:center;box-sizing:border-box;gap:0;inline-size:calc(100% - calc(var(--_expand-inset) * 2));min-inline-size:0;max-inline-size:100%;margin-inline:auto;block-size:var(--_container-height);padding-inline:var(--_container-padding-inline);background-color:var(--_container-color);border-radius:var(--_container-shape);box-shadow:var(--_container-elevation);cursor:text;overflow:hidden;transition:inline-size var(--_expand-duration) var(--_expand-easing),     background-color var(--_motion-duration) var(--_motion-easing),     box-shadow var(--_motion-duration) var(--_motion-easing),     border-radius var(--_motion-duration) var(--_motion-easing)}:host(.md-search--elevation-0){--_container-elevation-level:0px 0px 0px 0px transparent}:host(.md-search--elevation-1){--_container-elevation-level:var(--md-sys-elevation-1)}:host(.md-search--elevation-2){--_container-elevation-level:var(--md-sys-elevation-2)}:host(.md-search--elevation-3){--_container-elevation-level:var(--md-sys-elevation-3)}:host(.md-search--elevation-4){--_container-elevation-level:var(--md-sys-elevation-4)}:host(.md-search--elevation-5){--_container-elevation-level:var(--md-sys-elevation-5)}.md-search__bar--focused,:host(.md-search--open) .md-search__bar{inline-size:calc(100% - calc(var(--_expand-inset-focused) * 2));padding-inline:var(--_container-padding-inline-focused)}:host(.md-search--disabled) .md-search__bar{cursor:not-allowed;opacity:0.38}:host(.md-search--full-screen) .md-search__bar{transition:opacity var(--_fs-collapse-duration) var(--_fs-collapse-easing),     transform var(--_fs-collapse-duration) var(--_fs-collapse-easing),     background-color var(--_motion-duration) var(--_motion-easing),     border-radius var(--_motion-duration) var(--_motion-easing)}:host(.md-search--full-screen.md-search--open) .md-search__bar{opacity:0;transform:translateY(30px);pointer-events:none}:host(.md-search--full-screen.md-search--open.md-search--panel-content) .md-search__bar{opacity:1;transform:translateY(0);pointer-events:auto;transition:opacity var(--_fs-expand-duration) var(--_fs-expand-easing),     transform var(--_fs-expand-duration) var(--_fs-expand-easing),     background-color var(--_motion-duration) var(--_motion-easing),     border-radius var(--_motion-duration) var(--_motion-easing)}:host(.md-search--divided.md-search--full-screen.md-search--open) .md-search__bar{border-radius:0;background-color:var(--_bar-fullscreen-color);padding-inline:var(--_container-padding-inline-focused)}:host(.md-search--contained.md-search--full-screen.md-search--open) .md-search__bar{border-radius:var(--_container-shape);background-color:var(--_container-color);padding-inline:var(--_container-padding-inline-focused)}.md-search__bar>md-ripple{position:absolute;inset:0;border-radius:inherit;pointer-events:none;--md-ripple-grow-duration:var(--_expand-duration);--md-ripple-grow-easing:var(--_expand-easing)}.md-search__inset-probe{position:absolute;inset-block-start:0;inset-inline-start:0;inline-size:max(0px, calc(var(--_expand-inset) - var(--_expand-inset-focused)));block-size:0;visibility:hidden;pointer-events:none;opacity:0}.md-search__a11y-status{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.md-search__state-layer{position:absolute;inset:0;border-radius:inherit;background-color:var(--_state-layer-color);opacity:0;pointer-events:none;transition:opacity var(--md-sys-motion-duration-short2, 100ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}.md-search__bar:hover .md-search__state-layer{opacity:var(--_hover-state-layer-opacity)}.md-search__bar--focus-ring .md-search__state-layer{opacity:0}.md-search__bar--focus-ring{box-shadow:var(--_container-elevation),     0 0 0 var(--_focus-indicator-offset) var(--_container-color),     0 0 0       calc(var(--_focus-indicator-offset) + var(--_focus-indicator-thickness))       var(--_focus-indicator-color)}.md-search__bar:active .md-search__state-layer{opacity:var(--_pressed-state-layer-opacity)}.md-search__bar:hover .md-search__input::placeholder,.md-search__bar:active .md-search__input::placeholder{color:var(--_placeholder-color)}:host(.md-search--disabled) .md-search__state-layer{display:none}.md-search__leading,.md-search__trailing{display:inline-flex;align-items:center;gap:var(--md-sys-spacing-gap-xs, 4px);flex:0 0 auto;position:relative;z-index:1;box-sizing:border-box}.md-search__leading{padding-inline-start:var(--_leading-padding-inline);padding-inline-end:var(--_leading-icon-label-gap)}.md-search__trailing{margin-inline-start:auto;padding-inline-start:var(--_trailing-icon-label-gap);padding-inline-end:var(--_trailing-padding-inline)}.md-search__leading .md-search__icon,.md-search__leading-button{color:var(--_leading-icon-color)}.md-search__trailing .md-search__icon{color:var(--_trailing-icon-color)}.md-search__icon{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size);line-height:1;font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;overflow-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased;pointer-events:none;user-select:none}.md-search__icon-button{appearance:none;background:transparent;border:0;margin:0;padding:0;cursor:pointer;inline-size:var(--_icon-button-size);block-size:var(--_icon-button-size);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;color:var(--_trailing-icon-color);position:relative;transition:background-color var(--md-sys-motion-duration-short2, 100ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}.md-search__icon-button:hover{background-color:color-mix(     in srgb,     var(--_trailing-icon-color) 8%,     transparent   )}.md-search__loading{--md-loading-indicator-size:var(--_icon-button-size);--md-loading-indicator-shape-size:var(--_icon-size);--md-loading-indicator-color:var(--_loading-color);flex:0 0 auto;pointer-events:none}.md-search__trailing-morph{position:relative;flex:0 0 auto;inline-size:var(--_icon-button-size);block-size:var(--_icon-button-size)}.md-search__trailing-morph>.md-search__loading,.md-search__trailing-morph>.md-search__clear{position:absolute;inset:0;margin:auto;transition:opacity var(--md-sys-motion-duration-medium1, 250ms)       var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),     transform var(--md-sys-motion-duration-medium1, 250ms)       var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1))}.md-search__trailing-morph>.md-search__clear{opacity:1;transform:scale(1) rotate(0deg)}.md-search__trailing-morph>.md-search__loading{opacity:0;transform:scale(0.6) rotate(-90deg)}.md-search__trailing-morph--loading>.md-search__clear{opacity:0;transform:scale(0.6) rotate(90deg);pointer-events:none}.md-search__trailing-morph--loading>.md-search__loading{opacity:1;transform:scale(1) rotate(0deg)}.md-search__voice{flex:0 0 auto;color:var(--_trailing-icon-color)}.md-search__voice .md-search__icon{position:relative;z-index:1}.md-search__voice--listening{color:var(--md-sys-color-primary, #6750A4)}.md-search__voice--listening::before{content:'';position:absolute;inset:0;border-radius:50%;background-color:color-mix(     in srgb,     var(--md-sys-color-primary, #6750A4) 16%,     transparent   );animation:md-search-voice-pulse 1.4s     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)) infinite}@keyframes md-search-voice-pulse{0%,100%{transform:scale(0.82);opacity:0.55}50%{transform:scale(1.12);opacity:0.2}}.md-search__icon-button:focus-visible{outline:var(--_focus-indicator-thickness) solid var(--_focus-indicator-color);outline-offset:calc(-1 * var(--_focus-indicator-thickness))}.md-search__leading-button{appearance:none;background:transparent;border:0;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;position:relative;inline-size:var(--_icon-button-size);block-size:var(--_icon-button-size);border-radius:50%;cursor:text;pointer-events:none;transition:background-color var(--md-sys-motion-duration-short2, 100ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-search--open) .md-search__leading-button{cursor:pointer;pointer-events:auto}.md-search__leading-state-layer{position:absolute;inset:0;border-radius:inherit;background-color:var(--_leading-icon-color);opacity:0;pointer-events:none;transition:opacity var(--md-sys-motion-duration-short2, 100ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-search--open) .md-search__leading-button:hover .md-search__leading-state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}:host(.md-search--open) .md-search__leading-button:active .md-search__leading-state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}.md-search__leading-button:focus-visible{outline:var(--_focus-indicator-thickness) solid var(--_focus-indicator-color);outline-offset:calc(-1 * var(--_focus-indicator-thickness));border-radius:50%}.md-search__leading-button:disabled{cursor:not-allowed}.md-search__leading-button .md-search__icon{position:absolute;inset:0;margin:auto;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_icon-size);block-size:var(--_icon-size);transition:opacity var(--_motion-duration) var(--_motion-easing),     transform var(--_motion-duration) var(--_motion-easing)}.md-search__icon--resting{opacity:1;transform:rotate(0deg) scale(1)}:host(.md-search--open) .md-search__icon--resting{opacity:0;transform:rotate(-90deg) scale(0.6)}.md-search__icon--open{opacity:0;transform:rotate(90deg) scale(0.6) scaleX(var(--_open-glyph-mirror))}:host(.md-search--open) .md-search__icon--open{opacity:1;transform:rotate(0deg) scale(1) scaleX(var(--_open-glyph-mirror))}:host([dir="rtl"]),:host-context([dir="rtl"]){--_open-glyph-mirror:-1}::slotted([slot='leading']),::slotted([slot='trailing']){display:inline-flex;align-items:center}::slotted(md-avatar[slot='trailing']),::slotted([slot='trailing'][role='img']),::slotted(img[slot='trailing']){inline-size:var(--_avatar-size);block-size:var(--_avatar-size)}.md-search__input{flex:1 1 auto;min-inline-size:0;border:0;outline:0;background:transparent;color:var(--_input-color);font-family:var(--_input-font-family);font-size:var(--_input-font-size);font-weight:var(--_input-font-weight);line-height:var(--_input-line-height);letter-spacing:var(--_input-letter-spacing);padding-inline:0;position:relative;z-index:1}.md-search__input::placeholder{color:var(--_placeholder-color);opacity:1;font-family:var(--_input-font-family);font-size:var(--_input-font-size);font-weight:var(--_input-font-weight);line-height:var(--_input-line-height);letter-spacing:var(--_input-letter-spacing)}.md-search__input:disabled{cursor:not-allowed}.md-search__input::-webkit-search-cancel-button,.md-search__input::-webkit-search-decoration{display:none}.md-search__panel{visibility:hidden;opacity:0;pointer-events:none;box-sizing:border-box;background-color:transparent;color:var(--_input-color);display:flex;flex-direction:column;overflow:hidden;min-block-size:0;transition:opacity var(--_motion-duration) var(--_motion-easing),     transform var(--_motion-duration) var(--_motion-easing),     visibility 0s linear var(--_motion-duration)}.md-search__panel-body{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column}.md-search__results-host{display:flex;flex-direction:column;flex:1 1 auto;min-block-size:0;overflow:hidden}.md-search__results-host .md-search__results-scroll{flex:1 1 auto;min-block-size:0}.md-search__results-scroll{flex:1 1 auto;min-block-size:0;overflow-block:auto;overflow-inline:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--md-sys-color-outline-variant, #cac4d0) transparent}.md-search__results-scroll::-webkit-scrollbar{inline-size:8px}.md-search__results-scroll::-webkit-scrollbar-thumb{background-color:var(--md-sys-color-outline-variant, #cac4d0);border-radius:4px}.md-search__empty{flex:0 0 auto;margin:0;padding-block:var(--md-search-empty-padding-block, var(--md-sys-spacing-inset-xl, 24px));padding-inline:var(--md-search-empty-padding-inline, var(--md-sys-spacing-inset-lg, 16px));text-align:center;color:var(     --md-search-empty-color,     var(--md-sys-color-on-surface-variant, #49454f)   );font-family:var(     --md-sys-typescale-body-medium-font,     Roboto,     system-ui,     sans-serif   );font-size:var(--md-sys-typescale-body-medium-size, 14px);font-weight:var(--md-sys-typescale-body-medium-weight, 400);line-height:var(--md-sys-typescale-body-medium-line-height, 20px);letter-spacing:var(--md-sys-typescale-body-medium-tracking, 0.25px)}.md-search__panel-body--empty .md-search__results-host{display:none}.md-search__panel--docked{position:absolute;inset-inline:var(--_expand-inset-focused);inset-block-start:calc(var(--_container-height) + var(--_panel-offset));block-size:fit-content;min-block-size:var(--_panel-min-block-size);max-block-size:var(--_max-block-size, var(--_panel-max-block-size));transform:translateY(-4px);z-index:var(--md-sys-z-index-popup, 1100)}.md-search__panel--docked.md-search__panel--open{visibility:visible;opacity:1;pointer-events:auto;transform:translateY(0);transition:opacity var(--_motion-duration) var(--_motion-easing),     transform var(--_motion-duration) var(--_motion-easing),     visibility 0s}.md-search__panel--full-screen{opacity:0;transform:translateY(30px);will-change:opacity, transform;transition:opacity var(--_fs-collapse-duration) var(--_fs-collapse-easing),     transform var(--_fs-collapse-duration) var(--_fs-collapse-easing),     visibility 0s linear var(--_fs-collapse-duration)}.md-search__panel--full-screen.md-search__panel--open{visibility:visible;opacity:1;pointer-events:auto;transform:translateY(0);transition:opacity var(--_fs-expand-duration) var(--_fs-expand-easing),     transform var(--_fs-expand-duration) var(--_fs-expand-easing),     visibility 0s}.md-search__divider{display:none;block-size:var(--_divider-thickness);background-color:var(--_divider-color);flex:0 0 auto}:host(.md-search--divided.md-search--panel-content) .md-search__divider{display:block}:host(.md-search--divided.md-search--full-screen.md-search--open.md-search--panel-content) .md-search__bar{border-radius:0}:host(.md-search--divided) .md-search__panel--docked{inset-block-start:var(--_container-height)}:host(.md-search--divided.md-search--docked) .md-search__bar{transition:inline-size var(--_expand-duration) var(--_expand-easing),     background-color var(--_motion-duration) var(--_motion-easing),     box-shadow var(--_motion-duration) var(--_motion-easing)}:host(.md-search--divided.md-search--docked.md-search--open.md-search--panel-content) .md-search__bar{border-radius:var(--_resting-corner-shape) var(--_resting-corner-shape) 0 0;background-color:var(--_container-color);overflow:hidden}:host(.md-search--divided.md-search--docked.md-search--open.md-search--panel-content) .md-search__panel--docked{background-color:var(--_container-color);border-radius:0 0 var(--_resting-corner-shape) var(--_resting-corner-shape);overflow:hidden}:host(.md-search--contained.md-search--docked.md-search--open.md-search--panel-content) .md-search__panel--docked{border-radius:var(--_docked-panel-shape);background-color:var(--_container-color)}::slotted([slot='results']){display:block;--md-list-container-color:transparent;--md-list-item-container-color:transparent;--md-list-padding-block:0px}:host(.md-search--disabled) .md-search__input,:host(.md-search--disabled) .md-search__icon,:host(.md-search--disabled) .md-search__icon-button,:host(.md-search--disabled) .md-search__leading-button{pointer-events:none;color:color-mix(     in srgb,     var(--md-sys-color-on-surface, #1D1B20) 38%,     transparent   )}@media (prefers-reduced-motion: reduce){.md-search__bar,.md-search__panel,.md-search__state-layer,.md-search__icon-button,.md-search__leading-button,.md-search__leading-state-layer,.md-search__leading-button .md-search__icon,.md-search__trailing-morph>.md-search__loading,.md-search__trailing-morph>.md-search__clear{transition-duration:0.01ms !important}.md-search__voice--listening::before{animation:none}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const l=e(class e extends i{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.mdInput=t(this,"mdInput",7);this.mdSearch=t(this,"mdSearch",7);this.mdSubmit=t(this,"mdSubmit",7);this.mdChange=t(this,"mdChange",7);this.mdOpen=t(this,"mdOpen",7);this.mdClose=t(this,"mdClose",7);this.mdClear=t(this,"mdClear",7);this.mdVoice=t(this,"mdVoice",7);this.mdLeadingIconClick=t(this,"mdLeadingIconClick",7);this.mdTrailingIconClick=t(this,"mdTrailingIconClick",7);this.variant="contained";this.layout="full-screen";this.triggerIcon="search";this.triggerFor="";this.fullWidth=false;this.value="";this.placeholder="Search";this.open=false;this.disabled=false;this.elevation=0;this.leadingIcon="search";this.showClearButton=true;this.voiceSearch=false;this.escapeCloses=true;this.dismissOnOutsideClick=true;this.scrollShadow=true;this.maxBlockSize="";this.inputAriaLabel="";this.initialFocus="auto";this.announceResults=true;this.resultsLabel="{count} results available";this.noResultsLabel="No results available";this.loading=false;this.debounce=0;this.throttle=0;this.loadingLabel="Searching";this.density=0;this.focused=false;this.hasSlottedLeading=false;this.hasSlottedTrailing=false;this.hasSlottedTrigger=false;this.resultsStatus="";this.barExpanded=false;this.panelVisible=false;this.showFocusRing=false;this.listening=false;this.loadingMorphMounted=false;this.loadingMorphIn=false;this.keyboardModality=false;this.previousFocus=null;this.valueOnFocus="";this.pendingFullScreenReveal=false;this.pendingSearchValue=null;this.lastEmittedSearch=null;this.wiredTrigger=null;this.handleExternalTriggerClick=e=>{if(this.disabled)return;e.stopPropagation();this.open=!this.open};this.handleTriggerActivate=()=>{if(this.disabled)return;if(!this.open)this.open=true};this.handleTriggerClick=e=>{e.stopPropagation();this.handleTriggerActivate()};this.handleTriggerKeyDown=e=>{if(e.key!=="Enter"&&e.key!==" ")return;e.preventDefault();this.handleTriggerActivate()};this.handleBarClick=e=>{if(this.disabled)return;const i=e.target;if(i.closest('[part="trailing"]'))return;if(!this.open)this.open=true;this.input?.focus()};this.handleLeadingClick=e=>{if(this.disabled)return;const i=this.hasSlottedLeading;const t=!i&&this.open;if(!i&&!t)return;this.mdLeadingIconClick.emit({value:this.value,open:this.open});if(t){e.stopPropagation();this.open=false}};this.handleTrailingClick=e=>{if(this.disabled)return;const i=typeof e.composedPath==="function"?e.composedPath():[];const t=i.length?i:[e.target];const s=t.some((e=>{const i=e?.classList;return!!i?.contains?.("md-search__clear")||!!i?.contains?.("md-search__voice")}));if(s)return;const a=this.trailingSlotEl?.assignedElements?.()??[];if(a.length===0)return;const r=t[0];const n=a.some((e=>e===r||(r?e.contains(r):false)));if(!n)return;e.stopPropagation();this.mdTrailingIconClick.emit({value:this.value,open:this.open})};this.handleClearClick=e=>{e.stopPropagation();if(this.disabled)return;this.value="";this.input?.focus();this.mdInput.emit({value:""});this.pendingSearchValue="";this.flushSearch();this.mdClear.emit()};this.handleVoiceClick=e=>{e.stopPropagation();if(this.disabled)return;if(this.listening){this.stopVoice()}else{this.startVoice()}};this.handleVoiceResult=e=>{let i="";let t=false;const s=e.results;for(let e=0;e<s.length;e++){i+=s[e][0].transcript;if(s[e].isFinal)t=true}i=i.replace(/^\s+/,"");this.value=i;if(!this.open)this.open=true;this.mdInput.emit({value:i});this.scheduleSearch(i);this.mdVoice.emit({value:i,final:t});if(t){this.pendingSearchValue=i;this.flushSearch();this.stopVoice()}};this.handleVoiceEnd=()=>{this.listening=false;this.recognition=undefined};this.handleInput=e=>{const i=e.target.value;this.value=i;if(!this.open&&!this.disabled)this.open=true;this.mdInput.emit({value:i});this.scheduleSearch(i)};this.trackKeyboardModality=()=>{this.keyboardModality=true};this.trackPointerModality=()=>{this.keyboardModality=false};this.handleInputFocus=()=>{this.focused=true;this.showFocusRing=this.keyboardModality;this.valueOnFocus=this.value};this.handleInputBlur=()=>{this.focused=false;this.showFocusRing=false;if(this.value!==this.valueOnFocus){this.mdChange.emit({value:this.value})}};this.handleInputKeyDown=e=>{if(this.disabled)return;if(!this.open){if(e.key==="Enter"||e.key===" "){e.preventDefault();this.open=true}return}if(e.key==="Enter"){this.pendingSearchValue=this.value;this.flushSearch();this.mdSubmit.emit({value:this.value})}}}async show(){this.open=true}async close(){this.open=false}async toggle(){this.open=!this.open}async focusInput(){this.input?.focus()}connectedCallback(){if(typeof document!=="undefined"){document.addEventListener("keydown",this.trackKeyboardModality,true);document.addEventListener("pointerdown",this.trackPointerModality,true)}}componentWillLoad(){this.barExpanded=this.open;this.panelVisible=this.open;this.loadingMorphMounted=this.loading;this.loadingMorphIn=this.loading;this.lastEmittedSearch=this.value.trim();this.updateResultsStatus()}componentDidLoad(){this.wireExternalTrigger();const e=this.el.shadowRoot;if(!e)return;const i=e.querySelector('slot[name="leading"]');const t=e.querySelector('slot[name="trailing"]');this.trailingSlotEl=t??undefined;i?.addEventListener("slotchange",(()=>{this.hasSlottedLeading=i.assignedElements().length>0}));t?.addEventListener("slotchange",(()=>{this.hasSlottedTrailing=t.assignedElements().length>0}));const s=e.querySelector('slot[name="results"]');s?.addEventListener("slotchange",(()=>this.updateResultsStatus()));const a=e.querySelector('slot[name="trigger"]');a?.addEventListener("slotchange",(()=>{this.hasSlottedTrigger=a.assignedElements().length>0}));this.hasSlottedTrigger=(a?.assignedElements().length??0)>0;this.measureRippleExtend();this.observeHostResize();if(this.open)this.applyOpenSideEffects()}onExternalTriggerChange(){this.wireExternalTrigger()}disconnectedCallback(){this.unwireExternalTrigger();this.clearCloseTimer();this.cancelReveal();this.clearSearchTimers();this.stopVoice();this.clearLoadingMorphTimers();this.removeOutsideClickHandler();this.resizeObserver?.disconnect();this.resizeObserver=undefined;if(typeof document!=="undefined"){document.removeEventListener("keydown",this.trackKeyboardModality,true);document.removeEventListener("pointerdown",this.trackPointerModality,true)}if(this.layout==="full-screen"&&typeof document!=="undefined"){document.body.style.removeProperty("overflow")}}get effectiveTrigger(){if(this.hasExternalTrigger)return"icon";if(this.trigger!=null)return this.trigger;return this.layout==="full-screen"?"icon":"bar"}get hasExternalTrigger(){return Boolean(this.triggerFor||this.triggerElement)}get usesIconTrigger(){return this.effectiveTrigger==="icon"}resolveExternalTrigger(){if(this.triggerElement)return this.triggerElement;if(!this.triggerFor||typeof document==="undefined")return null;const e=this.triggerFor.trim();if(!e)return null;try{return document.querySelector(e)}catch{if(typeof console!=="undefined"){console.warn("[md-search] `trigger-for` is not a valid selector:",this.triggerFor)}return null}}wireExternalTrigger(){const e=this.resolveExternalTrigger();if(e===this.wiredTrigger){this.syncExternalTriggerAria();return}this.unwireExternalTrigger();if(!e)return;e.addEventListener("click",this.handleExternalTriggerClick);this.wiredTrigger=e;this.syncExternalTriggerAria()}unwireExternalTrigger(){this.wiredTrigger?.removeEventListener("click",this.handleExternalTriggerClick);this.wiredTrigger?.removeAttribute("aria-expanded");this.wiredTrigger=null}syncExternalTriggerAria(){const e=this.wiredTrigger;if(!e)return;e.setAttribute("aria-haspopup","dialog");e.setAttribute("aria-expanded",String(this.open))}get showBar(){return!this.usesIconTrigger||this.barExpanded}measureRippleExtend(){if(!this.showBar)return;const e=this.rippleEl;if(!e)return;if(this.layout==="full-screen"&&typeof window!=="undefined"){const i=this.el.shadowRoot?.querySelector(".md-search__bar");const t=i?.getBoundingClientRect().width??0;const s=window.innerWidth-t;if(s>1){e.style.setProperty("--md-ripple-extend-inline",`${s}px`);return}}const i=this.insetProbeEl;if(!i)return;const t=i.getBoundingClientRect().width;if(!Number.isFinite(t)||t<=0){e.style.removeProperty("--md-ripple-extend-inline");return}e.style.setProperty("--md-ripple-extend-inline",`${t}px`)}observeHostResize(){if(typeof ResizeObserver==="undefined")return;this.resizeObserver=new ResizeObserver((()=>{if(this.barExpanded)return;this.measureRippleExtend()}));this.resizeObserver.observe(this.el)}onOpenChange(i,t){if(i===t)return;this.clearCloseTimer();this.cancelReveal();if(i){this.barExpanded=true;if(this.layout==="full-screen"){this.pendingFullScreenReveal=true}else{this.panelVisible=true}this.applyOpenSideEffects();this.updateResultsStatus();this.syncExternalTriggerAria();this.mdOpen.emit()}else{this.pendingFullScreenReveal=false;this.panelVisible=false;this.stopVoice();this.removeOutsideClickHandler();this.updateResultsStatus();this.mdClose.emit();this.syncExternalTriggerAria();this.closeTimer=setTimeout((()=>{this.barExpanded=false;this.finishCloseSideEffects();if(this.wiredTrigger&&typeof document!=="undefined"){const e=document.activeElement;const i=e===this.el||this.el.contains(e);if(e===document.body||i)this.wiredTrigger.focus?.()}this.closeTimer=undefined}),e.PANEL_CLOSE_MS)}}onLoadingChange(e){this.updateResultsStatus();this.updateLoadingMorph(e)}updateLoadingMorph(i){this.clearLoadingMorphTimers();if(i){this.loadingMorphMounted=true;if(typeof requestAnimationFrame==="undefined"){this.loadingMorphIn=true;return}this.loadingMorphInRaf=requestAnimationFrame((()=>{this.loadingMorphInRaf=undefined;if(this.loading)this.loadingMorphIn=true}))}else{this.loadingMorphIn=false;this.loadingMorphTimer=setTimeout((()=>{this.loadingMorphTimer=undefined;if(!this.loading)this.loadingMorphMounted=false}),e.MORPH_MS)}}clearLoadingMorphTimers(){if(this.loadingMorphTimer){clearTimeout(this.loadingMorphTimer);this.loadingMorphTimer=undefined}if(this.loadingMorphInRaf!==undefined&&typeof cancelAnimationFrame!=="undefined"){cancelAnimationFrame(this.loadingMorphInRaf);this.loadingMorphInRaf=undefined}}componentDidRender(){if(!this.pendingFullScreenReveal)return;this.pendingFullScreenReveal=false;if(typeof requestAnimationFrame==="undefined"){this.panelVisible=true;return}this.revealRaf=requestAnimationFrame((()=>{this.revealRaf=undefined;if(this.open)this.panelVisible=true}))}cancelReveal(){if(this.revealRaf!==undefined&&typeof cancelAnimationFrame!=="undefined"){cancelAnimationFrame(this.revealRaf)}this.revealRaf=undefined}clearCloseTimer(){if(this.closeTimer===undefined)return;clearTimeout(this.closeTimer);this.closeTimer=undefined}applyOpenSideEffects(){if(typeof document==="undefined")return;this.previousFocus=document.activeElement??null;if(this.layout==="full-screen"){const e=window.innerWidth-document.documentElement.clientWidth;if(e>0){document.body.style.paddingInlineEnd=`${e}px`}document.body.style.overflow="hidden"}this.attachOutsideClickHandler();if(typeof requestAnimationFrame!=="undefined"){requestAnimationFrame((()=>this.focusInitialTarget()))}else{this.focusInitialTarget()}}focusInitialTarget(){const e=this.resolveInitialFocusTarget();e?.focus?.({preventScroll:true})}resolveInitialFocusTarget(){if(this.initialFocus==="leading"){return this.leadingFocusTarget()??this.input}return this.input}leadingFocusTarget(){const e='button, a[href], input, select, textarea, md-icon-button, md-button, [tabindex]:not([tabindex="-1"])';const i=this.el.querySelector('[slot="leading"]');if(i){if(typeof i.focus==="function"&&i.getAttribute("tabindex")!=="-1"){if(i.matches(e))return i}const t=i.querySelector(e);if(t)return t;return i}const t=this.el.shadowRoot?.querySelector(".md-search__leading-button");if(t&&t.getAttribute("tabindex")!=="-1")return t;return undefined}finishCloseSideEffects(){if(typeof document!=="undefined"&&this.layout==="full-screen"){document.body.style.removeProperty("overflow");document.body.style.removeProperty("padding-inline-end")}this.previousFocus?.focus?.();this.previousFocus=null}attachOutsideClickHandler(){if(!this.dismissOnOutsideClick||typeof document==="undefined")return;this.outsideClickHandler=e=>{const i=e.target;if(!i)return;const t=e.composedPath?e.composedPath():[];if(t.includes(this.el))return;if(this.el.contains(i))return;const s=this.wiredTrigger;if(s&&(t.includes(s)||s.contains(i)))return;this.open=false};document.addEventListener("mousedown",this.outsideClickHandler,true)}removeOutsideClickHandler(){if(this.outsideClickHandler&&typeof document!=="undefined"){document.removeEventListener("mousedown",this.outsideClickHandler,true)}this.outsideClickHandler=undefined}getSpeechRecognitionCtor(){if(typeof window==="undefined")return undefined;const e=window;return e.SpeechRecognition||e.webkitSpeechRecognition}isVoiceSupported(){return!!this.getSpeechRecognitionCtor()}resolveVoiceLang(){if(typeof document!=="undefined"){const e=this.el.getAttribute("lang")||document.documentElement.lang;if(e)return e}return"en-US"}async startVoice(){this.startVoiceInternal()}async stopVoice(){this.listening=false;if(this.recognition){try{this.recognition.stop()}catch{}}}startVoiceInternal(){const e=this.getSpeechRecognitionCtor();if(!e||this.disabled||this.listening)return;if(this.recognition){try{this.recognition.abort()}catch{}this.recognition=undefined}const i=new e;i.lang=this.resolveVoiceLang();i.interimResults=true;i.continuous=false;i.maxAlternatives=1;i.onresult=this.handleVoiceResult;i.onerror=this.handleVoiceEnd;i.onend=this.handleVoiceEnd;this.recognition=i;if(!this.open)this.open=true;this.input?.focus();this.listening=true;try{i.start()}catch{this.listening=false;this.recognition=undefined}}scheduleSearch(e){this.pendingSearchValue=e;const i=Math.max(0,Number(this.debounce)||0);const t=Math.max(0,Number(this.throttle)||0);if(i===0&&t===0){this.flushSearch();return}if(this.searchDebounceTimer)clearTimeout(this.searchDebounceTimer);this.searchDebounceTimer=setTimeout((()=>this.flushSearch()),i);if(t>0&&this.searchMaxWaitTimer===undefined){this.searchMaxWaitTimer=setTimeout((()=>this.flushSearch()),t)}}flushSearch(){this.clearSearchTimers();if(this.pendingSearchValue===null)return;const e=this.pendingSearchValue;this.pendingSearchValue=null;const i=e.trim();if(i===this.lastEmittedSearch)return;this.lastEmittedSearch=i;this.mdSearch.emit({value:i})}clearSearchTimers(){if(this.searchDebounceTimer){clearTimeout(this.searchDebounceTimer);this.searchDebounceTimer=undefined}if(this.searchMaxWaitTimer){clearTimeout(this.searchMaxWaitTimer);this.searchMaxWaitTimer=undefined}}handleWindowKeyDown(e){if(!this.open)return;if(e.key==="Escape"&&this.escapeCloses){e.preventDefault();this.open=false;return}if(e.key==="ArrowDown"||e.key==="ArrowUp"){if(this.moveResultFocus(e.key==="ArrowDown"?1:-1)){e.preventDefault()}return}if(this.layout!=="full-screen"||e.key!=="Tab")return;const i=this.collectFocusables();if(i.length===0)return;const t=i[0];const s=i[i.length-1];const a=this.el.shadowRoot?.activeElement??document.activeElement;if(e.shiftKey&&a===t){e.preventDefault();s.focus()}else if(!e.shiftKey&&a===s){e.preventDefault();t.focus()}}collectFocusables(){const e=this.el.shadowRoot;if(!e)return[];const i='a[href], button, input, select, textarea, [tabindex]:not([tabindex="-1"]), md-icon-button, md-button';const t=Array.from(e.querySelectorAll(i));const s=Array.from(this.el.querySelectorAll(i));return[...t,...s].filter((e=>{if(e.hasAttribute("disabled"))return false;const i=e.getAttribute("tabindex");return i!=="-1"}))}countResults(){const e=Array.from(this.el.querySelectorAll('[slot="results"]'));const i='md-list-item, [role="option"], li, [data-search-result]';const t=new Set;for(const s of e){if(s.matches(i))t.add(s);s.querySelectorAll(i).forEach((e=>t.add(e)))}return t.size>0?t.size:e.length}resultItems(){const e='md-list-item, [role="option"], [role="menuitem"], [data-search-result], li';const i=Array.from(this.el.querySelectorAll('[slot="results"]'));const t=new Set;for(const s of i){if(s.matches(e))t.add(s);s.querySelectorAll(e).forEach((e=>t.add(e)))}return Array.from(t)}moveResultFocus(e){const i=this.resultItems();if(i.length===0)return false;const t=this.el.shadowRoot?.activeElement??(typeof document!=="undefined"?document.activeElement:null);const s=t?i.findIndex((e=>e===t||e.contains(t))):-1;if(e>0){const e=s<0?0:Math.min(s+1,i.length-1);this.focusResultItem(i[e]);return true}if(s<=0){this.input?.focus();return true}this.focusResultItem(i[s-1]);return true}focusResultItem(e){if(e.getAttribute("tabindex")===null){e.setAttribute("tabindex","-1")}e.focus?.()}updateResultsStatus(){if(!this.announceResults||!this.open){this.resultsStatus="";return}if(this.loading){this.resultsStatus=this.loadingLabel;return}const e=this.countResults();if(e>0){this.resultsStatus=this.resultsLabel.replace("{count}",String(e))}else if(this.shouldShowVisibleEmptyState()){this.resultsStatus=""}else{this.resultsStatus=this.value.trim()?this.noResultsLabel:""}}shouldShowVisibleEmptyState(){return this.panelVisible&&!this.loading&&this.countResults()===0&&this.value.trim().length>0}shouldShowResultsChrome(){if(!this.panelVisible||this.loading)return false;if(this.countResults()>0)return true;return this.shouldShowVisibleEmptyState()}isPanelRevealed(){if(this.layout==="full-screen"){return this.panelVisible&&this.barExpanded}return this.shouldShowResultsChrome()}effectiveLabel(){return this.inputAriaLabel||this.placeholder||"Search"}resolveOpenLeadingIcon(){if(this.openLeadingIcon)return this.openLeadingIcon;return this.variant==="contained"?"chevron_left":"arrow_back"}renderTrigger(){if(!this.usesIconTrigger||this.barExpanded)return null;if(this.hasExternalTrigger)return null;return s("div",{class:"md-search__trigger",part:"trigger"},s("slot",{name:"trigger"},s("md-icon-button",{class:"md-search__trigger-button",part:"trigger-button",icon:this.triggerIcon,variant:"standard",size:"md",disabled:this.disabled,"aria-label":this.effectiveLabel(),onClick:this.handleTriggerClick,onKeyDown:this.handleTriggerKeyDown})))}renderLeading(){const e=this.barExpanded;const i=e?"Close search":"Search";const t=this.resolveOpenLeadingIcon();return s("span",{class:{"md-search__leading":true,"md-search__leading--button":e},part:"leading",onClick:this.handleLeadingClick},s("slot",{name:"leading"},s("button",{type:"button",class:"md-search__leading-button","aria-label":i,tabIndex:e?0:-1,disabled:this.disabled},s("span",{class:"md-search__leading-state-layer",part:"leading-state-layer","aria-hidden":"true"}),s("span",{class:"md-search__icon md-search__icon--resting material-symbols-outlined","aria-hidden":"true"},this.leadingIcon),s("span",{class:"md-search__icon md-search__icon--open material-symbols-outlined","aria-hidden":"true"},t))))}renderClearButton(){if(!this.showClearButton||!this.value)return null;return s("button",{type:"button",class:"md-search__icon-button md-search__clear",part:"clear-button","aria-label":"Clear search",onClick:this.handleClearClick},s("span",{class:"md-search__icon material-symbols-outlined","aria-hidden":"true"},"close"))}renderVoiceButton(){return s("button",{type:"button",class:{"md-search__icon-button":true,"md-search__voice":true,"md-search__voice--listening":this.listening},part:"voice-button","aria-label":this.listening?"Stop voice search":"Search by voice","aria-pressed":this.listening?"true":"false",disabled:this.disabled,onClick:this.handleVoiceClick},s("span",{class:"md-search__icon material-symbols-outlined","aria-hidden":"true"},"mic"))}renderTrailing(){const e=this.showClearButton&&this.value.length>0;const i=e||this.loadingMorphMounted;const t=this.voiceSearch&&this.isVoiceSupported();return s("span",{class:"md-search__trailing",part:"trailing",onClick:this.handleTrailingClick},i&&s("span",{class:{"md-search__trailing-morph":true,"md-search__trailing-morph--loading":this.loadingMorphIn}},this.loadingMorphMounted&&s("slot",{name:"loader"},s("md-loading-indicator",{class:"md-search__loading",part:"loading",exportparts:"shape:loading-shape",label:this.loadingLabel})),e&&this.renderClearButton()),t&&this.renderVoiceButton(),s("slot",{name:"trailing"}))}render(){const e=this.layout==="full-screen";const i={};if(this.maxBlockSize){i["--_max-block-size"]=this.maxBlockSize}return s(a,{key:"a1917af311741dbe519c61dbccc2444d2f7d1471",class:{"md-search":true,[`md-search--${this.variant}`]:true,[`md-search--${this.layout}`]:true,[`md-search--trigger-${this.effectiveTrigger}`]:true,"md-search--open":this.barExpanded,"md-search--panel-content":this.layout==="full-screen"?this.isPanelRevealed():this.shouldShowResultsChrome(),"md-search--closed":!this.barExpanded,"md-search--has-slotted-trigger":this.hasSlottedTrigger,"md-search--disabled":this.disabled,"md-search--focused":this.focused,"md-search--has-value":this.value.length>0,"md-search--has-slotted-leading":this.hasSlottedLeading,"md-search--has-slotted-trailing":this.hasSlottedTrailing,"md-search--full-width":this.fullWidth,[`md-search--elevation-${this.elevation}`]:true},style:Object.keys(i).length>0?i:undefined},s("span",{key:"fbe5d4a8afd52543bb6605dd7949ffcf007d40eb",class:"md-search__inset-probe",ref:e=>this.insetProbeEl=e,"aria-hidden":"true"}),s("div",{key:"2dbe27e3953c8ee2ca91e05027ca4036d76e4a4b",class:"md-search__a11y-status",part:"status",role:"status","aria-live":"polite","aria-atomic":"true"},this.resultsStatus),this.renderTrigger(),this.showBar&&s("div",{key:"e888147bb5f685e91b4e6be63811d183a84f8105",class:{"md-search__bar":true,"md-search__bar--focused":this.focused,"md-search__bar--focus-ring":this.showFocusRing},part:"bar",onClick:this.handleBarClick},!this.disabled&&s("md-ripple",{key:"9c34671fb64625f5d72ce562328f0c22ffefd9f9",ref:e=>this.rippleEl=e}),s("span",{key:"4a2e71d470ec5a5597f8c302b7ffb2ed0a664618",class:"md-search__state-layer",part:"state-layer","aria-hidden":"true"}),this.renderLeading(),s("input",{key:"ed5b32d0d9d6500cd005902f6286d3091e21c943",ref:e=>this.input=e,class:"md-search__input",part:"input",type:"search",role:"combobox",value:this.value,placeholder:this.placeholder,disabled:this.disabled,"aria-label":this.effectiveLabel(),"aria-expanded":this.open?"true":"false","aria-controls":"md-search-panel","aria-autocomplete":"list",autocomplete:"off",spellcheck:false,onInput:this.handleInput,onFocus:this.handleInputFocus,onBlur:this.handleInputBlur,onKeyDown:this.handleInputKeyDown}),this.renderTrailing()),s("div",{key:"b263a0d7de44094b5202238f64fa333f82c17b34",id:"md-search-panel",class:{"md-search__panel":true,[`md-search__panel--${this.layout}`]:true,"md-search__panel--open":this.isPanelRevealed()},part:"panel",role:"dialog","aria-modal":e&&this.isPanelRevealed()?"true":"false","aria-hidden":this.isPanelRevealed()?"false":"true","aria-label":this.effectiveLabel()},this.variant==="divided"&&this.isPanelRevealed()&&s("div",{key:"7267d71b9e43dee8d24652d1f5896282bb471be8",class:"md-search__divider",part:"divider","aria-hidden":"true"}),s("div",{key:"91137bdaeb1e35d9dde52c1ffd92298b8a78b9ff",class:{"md-search__panel-body":true,"md-search__panel-body--empty":this.shouldShowVisibleEmptyState()},part:"panel-body"},this.shouldShowVisibleEmptyState()&&s("p",{key:"3df90324a512cb06038c1488ef72f71a82796e7d",class:"md-search__empty",part:"empty",role:"status","aria-live":"polite"},this.noResultsLabel),s("div",{key:"76e88f72feeb9c6fba5ff3870cd1492a8679e9cd",class:"md-search__results-host",part:"results-host",hidden:this.shouldShowVisibleEmptyState()?true:undefined,"aria-hidden":this.shouldShowVisibleEmptyState()?"true":undefined},s("div",{key:"9a6d7f652aefe09ed382805822e8e0247294ff2c",class:"md-search__results-scroll",part:"results-viewport"},s("slot",{key:"fdfd7c5b6b18dcb0bd1f6404d42e9da7ee3b417b",name:"results"}))))))}get el(){return this}static get watchers(){return{triggerFor:[{onExternalTriggerChange:0}],triggerElement:[{onExternalTriggerChange:0}],open:[{onOpenChange:0}],loading:[{onLoadingChange:0}]}}static get style(){return d()}},[257,"md-search",{variant:[513],layout:[513],trigger:[513],triggerIcon:[1,"trigger-icon"],triggerFor:[1,"trigger-for"],triggerElement:[16],fullWidth:[516,"full-width"],value:[1537],placeholder:[1],open:[1540],disabled:[516],elevation:[514],leadingIcon:[1,"leading-icon"],openLeadingIcon:[1,"open-leading-icon"],showClearButton:[4,"show-clear-button"],voiceSearch:[4,"voice-search"],escapeCloses:[4,"escape-closes"],dismissOnOutsideClick:[4,"dismiss-on-outside-click"],scrollShadow:[516,"scroll-shadow"],maxBlockSize:[1,"max-block-size"],inputAriaLabel:[1,"input-aria-label"],initialFocus:[1,"initial-focus"],announceResults:[4,"announce-results"],resultsLabel:[1,"results-label"],noResultsLabel:[1,"no-results-label"],loading:[1540],debounce:[2],throttle:[2],loadingLabel:[1,"loading-label"],density:[514],focused:[32],hasSlottedLeading:[32],hasSlottedTrailing:[32],hasSlottedTrigger:[32],resultsStatus:[32],barExpanded:[32],panelVisible:[32],showFocusRing:[32],listening:[32],loadingMorphMounted:[32],loadingMorphIn:[32],show:[64],close:[64],toggle:[64],focusInput:[64],startVoice:[64],stopVoice:[64]},[[8,"keydown","handleWindowKeyDown"]],{triggerFor:[{onExternalTriggerChange:0}],triggerElement:[{onExternalTriggerChange:0}],open:[{onOpenChange:0}],loading:[{onLoadingChange:0}]}]);l.PANEL_CLOSE_MS=300;l.MORPH_MS=300;function h(){if(typeof customElements==="undefined"){return}const e=["md-search","md-icon-button","md-loading-indicator","md-ripple"];e.forEach((e=>{switch(e){case"md-search":if(!customElements.get(r(e))){customElements.define(r(e),l)}break;case"md-icon-button":if(!customElements.get(r(e))){n()}break;case"md-loading-indicator":if(!customElements.get(r(e))){o()}break;case"md-ripple":if(!customElements.get(r(e))){c()}break}}))}h();const m=l;const u=h;export{m as MdSearch,u as defineCustomElement};
+//# sourceMappingURL=md-search.js.map