@francofantomius/material-components 0.1.0 → 1.0.1

package/dist/components/list/list.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"list.js","sources":["../../../src/components/list/list.css.ts","../../../src/components/list/list.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const listStyles = css`\n  :host {\n    display: flex;\n    flex-direction: column;\n    padding: 8px 0;\n    box-sizing: border-box;\n  }\n`;\n\nexport const listItemStyles = css`\n  :host {\n    display: flex;\n    outline: none;\n    box-sizing: border-box;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n    opacity: 0.38;\n  }\n\n  .item {\n    position: relative;\n    display: flex;\n    align-items: center;\n    width: 100%;\n    min-height: 56px;\n    padding: 8px 16px;\n    box-sizing: border-box;\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    color: var(--md-sys-color-on-surface, #1D1B20);\n    text-decoration: none;\n    gap: 16px;\n    user-select: none;\n    overflow: hidden;\n  }\n\n  :host([interactive]) .item {\n    cursor: pointer;\n  }\n\n  .start {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    flex-shrink: 0;\n  }\n\n  .content {\n    display: flex;\n    flex-direction: column;\n    flex: 1;\n    min-width: 0;\n    justify-content: center;\n  }\n\n  .headline {\n    font-size: var(--md-sys-typescale-body-large-size, 16px);\n    line-height: 24px;\n    font-weight: 400;\n    color: var(--md-sys-color-on-surface, #1D1B20);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .supporting-text {\n    font-size: var(--md-sys-typescale-body-medium-size, 14px);\n    line-height: 20px;\n    font-weight: 400;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n\n  .end {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    font-size: var(--md-sys-typescale-label-small-size, 11px);\n    flex-shrink: 0;\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport '../../internal/ripple/ripple.js';\nimport '../../internal/focus-ring/focus-ring.js';\nimport { listStyles, listItemStyles } from './list.css.js';\n\n@customElement('md-list-item')\nexport class MdListItem extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, listItemStyles];\n\n  @property({ type: String })\n  headline = '';\n\n  @property({ type: String, attribute: 'supporting-text' })\n  supportingText = '';\n\n  @property({ type: String, attribute: 'trailing-supporting-text' })\n  trailingSupportingText = '';\n\n  @property({ type: Boolean, reflect: true })\n  interactive = false;\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String })\n  target = '';\n\n  private handleClick = (event: MouseEvent) => {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopImmediatePropagation();\n      return;\n    }\n    if (this.interactive) {\n      this.emitEvent('item-click');\n    }\n  };\n\n  override render() {\n    const inner = html`\n      ${this.interactive ? html`<md-ripple ?disabled=${this.disabled}></md-ripple><md-focus-ring></md-focus-ring>` : nothing}\n\n      <div class=\"start\">\n        <slot name=\"start\"></slot>\n      </div>\n\n      <div class=\"content\">\n        <slot>\n          ${this.headline ? html`<span class=\"headline\">${this.headline}</span>` : nothing}\n          ${this.supportingText ? html`<span class=\"supporting-text\">${this.supportingText}</span>` : nothing}\n        </slot>\n      </div>\n\n      <div class=\"end\">\n        <slot name=\"end\">\n          ${this.trailingSupportingText ? html`<span>${this.trailingSupportingText}</span>` : nothing}\n        </slot>\n      </div>\n    `;\n\n    if (this.href) {\n      return html`\n        <a\n          class=\"item\"\n          href=${this.disabled ? nothing : this.href}\n          target=${this.target || nothing}\n          aria-disabled=${this.disabled ? 'true' : nothing}\n          tabindex=${this.disabled ? '-1' : '0'}\n          @click=${this.handleClick}\n        >\n          ${inner}\n        </a>\n      `;\n    }\n\n    return html`\n      <div\n        class=\"item\"\n        tabindex=${this.interactive && !this.disabled ? '0' : nothing}\n        @click=${this.handleClick}\n      >\n        ${inner}\n      </div>\n    `;\n  }\n}\n\n@customElement('md-list')\nexport class MdList extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, listStyles];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'list');\n  }\n\n  override render() {\n    return html`<slot></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-list': MdList;\n    'md-list-item': MdListItem;\n  }\n}\n\n"],"names":["listStyles","css","listItemStyles","MdListItem","MdBaseElement","event","inner","html","nothing","__decorateClass","property","customElement","MdList"],"mappings":"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"}

package/dist/components/progress/progress.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"progress.js","sources":["../../../src/components/progress/progress.css.ts","../../../src/components/progress/progress.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const progressStyles = css`\n  :host {\n    display: inline-flex;\n    vertical-align: middle;\n  }\n\n  /* --- Linear Progress --- */\n  :host(:not([type])),\n  :host([type=\"linear\"]) {\n    display: block;\n    width: 100%;\n    height: 4px;\n    position: relative;\n    overflow: hidden;\n    background-color: var(--md-sys-color-surface-container-highest, #E6E0E9);\n    border-radius: var(--md-sys-shape-corner-full, 9999px);\n  }\n\n  .linear-buffer {\n    position: absolute;\n    inset: 0;\n    background-color: var(--md-sys-color-primary-container, #EADDFF);\n    transform-origin: left;\n    transition: transform 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  .linear-bar {\n    position: absolute;\n    top: 0;\n    bottom: 0;\n    left: 0;\n    right: 0;\n    background-color: var(--md-sys-color-primary, #6750A4);\n    border-radius: inherit;\n    transform-origin: left;\n    transition: transform 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([indeterminate]:not([type])),\n  :host([indeterminate][type=\"linear\"]) .linear-bar {\n    animation: md-linear-indeterminate 2s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;\n  }\n\n  @keyframes md-linear-indeterminate {\n    0% {\n      left: -35%;\n      right: 100%;\n    }\n    60% {\n      left: 100%;\n      right: -90%;\n    }\n    100% {\n      left: 100%;\n      right: -90%;\n    }\n  }\n\n  /* --- Circular Progress --- */\n  :host([type=\"circular\"]) {\n    width: 48px;\n    height: 48px;\n    position: relative;\n  }\n\n  svg {\n    width: 100%;\n    height: 100%;\n    transform: rotate(-90deg);\n  }\n\n  circle {\n    fill: none;\n    stroke-width: 4px;\n    stroke-linecap: round;\n  }\n\n  .circle-track {\n    stroke: var(--md-sys-color-surface-container-highest, #E6E0E9);\n  }\n\n  .circle-indicator {\n    stroke: var(--md-sys-color-primary, #6750A4);\n    transition: stroke-dashoffset 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([indeterminate][type=\"circular\"]) svg {\n    animation: md-circular-rotate 1.4s linear infinite;\n  }\n\n  :host([indeterminate][type=\"circular\"]) .circle-indicator {\n    animation: md-circular-dash 1.4s ease-in-out infinite;\n  }\n\n  @keyframes md-circular-rotate {\n    100% {\n      transform: rotate(270deg);\n    }\n  }\n\n  @keyframes md-circular-dash {\n    0% {\n      stroke-dasharray: 1, 200;\n      stroke-dashoffset: 0;\n    }\n    50% {\n      stroke-dasharray: 89, 200;\n      stroke-dashoffset: -35px;\n    }\n    100% {\n      stroke-dasharray: 89, 200;\n      stroke-dashoffset: -124px;\n    }\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { progressStyles } from './progress.css.js';\n\nexport type ProgressType = 'linear' | 'circular';\n\n@customElement('md-progress')\nexport class MdProgress extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, progressStyles];\n\n  @property({ type: String, reflect: true })\n  type: ProgressType = 'linear';\n\n  @property({ type: Number })\n  value: number | null = null;\n\n  @property({ type: Number })\n  max = 1;\n\n  @property({ type: Number })\n  buffer = 1;\n\n  @property({ type: Boolean, reflect: true })\n  indeterminate = true;\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    super.willUpdate(changedProperties);\n    if (changedProperties.has('value')) {\n      this.indeterminate = this.value === null || this.value === undefined;\n      if (!this.indeterminate && this.value !== null) {\n        this.setAttribute('aria-valuenow', String(this.value));\n      } else {\n        this.removeAttribute('aria-valuenow');\n      }\n    }\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'progressbar');\n    this.setAttribute('aria-valuemin', '0');\n    this.setAttribute('aria-valuemax', String(this.max));\n  }\n\n  override render() {\n    const fraction = this.value !== null ? Math.min(Math.max(this.value / this.max, 0), 1) : 0;\n    const bufferFraction = Math.min(Math.max(this.buffer / this.max, 0), 1);\n\n    if (this.type === 'circular') {\n      const radius = 20;\n      const circumference = 2 * Math.PI * radius;\n      const offset = circumference - fraction * circumference;\n\n      return html`\n        <svg viewBox=\"0 0 48 48\">\n          <circle class=\"circle-track\" cx=\"24\" cy=\"24\" r=${radius}></circle>\n          <circle\n            class=\"circle-indicator\"\n            cx=\"24\"\n            cy=\"24\"\n            r=${radius}\n            stroke-dasharray=${this.indeterminate ? nothing : `${circumference}`}\n            stroke-dashoffset=${this.indeterminate ? nothing : `${offset}`}\n          ></circle>\n        </svg>\n      `;\n    }\n\n    return html`\n      ${this.buffer < 1 ? html`<div class=\"linear-buffer\" style=\"transform: scaleX(${bufferFraction})\"></div>` : nothing}\n      <div\n        class=\"linear-bar\"\n        style=${this.indeterminate ? '' : `transform: scaleX(${fraction})`}\n      ></div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-progress': MdProgress;\n  }\n}\n\n"],"names":["progressStyles","css","MdProgress","MdBaseElement","changedProperties","fraction","bufferFraction","circumference","offset","html","nothing","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/components/radio/radio.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"radio.js","sources":["../../../src/components/radio/radio.css.ts","../../../src/components/radio/radio.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const radioStyles = css`\n  :host {\n    display: inline-flex;\n    align-items: center;\n    vertical-align: middle;\n    cursor: pointer;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    user-select: none;\n    gap: 8px;\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    font-size: var(--md-sys-typescale-body-large-size, 16px);\n    color: var(--md-sys-color-on-surface, #1D1B20);\n  }\n\n  :host([disabled]) {\n    cursor: not-allowed;\n    color: rgba(29, 27, 32, 0.38);\n    pointer-events: none;\n  }\n\n  .container {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 40px;\n    height: 40px;\n    border-radius: 50%;\n  }\n\n  .outer-circle {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    width: 20px;\n    height: 20px;\n    box-sizing: border-box;\n    border: 2px solid var(--md-sys-color-on-surface-variant, #49454F);\n    border-radius: 50%;\n    background-color: transparent;\n    transition: border-color 150ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([checked]) .outer-circle {\n    border-color: var(--md-sys-color-primary, #6750A4);\n  }\n\n  :host([disabled]) .outer-circle {\n    border-color: rgba(29, 27, 32, 0.38);\n  }\n\n  .inner-circle {\n    width: 10px;\n    height: 10px;\n    border-radius: 50%;\n    background-color: var(--md-sys-color-primary, #6750A4);\n    transform: scale(0);\n    transition: transform 150ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([checked]) .inner-circle {\n    transform: scale(1);\n  }\n\n  :host([disabled][checked]) .inner-circle {\n    background-color: rgba(29, 27, 32, 0.38);\n  }\n`;\n\nexport const radioGroupStyles = css`\n  :host {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  :host([row]) {\n    flex-direction: row;\n    align-items: center;\n    gap: 16px;\n  }\n`;\n\n","import { html } from 'lit';\nimport { customElement, property, queryAssignedElements } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { MdFormAssociatedElement } from '../../internal/form-associated.js';\nimport '../../internal/ripple/ripple.js';\nimport '../../internal/focus-ring/focus-ring.js';\nimport { radioStyles, radioGroupStyles } from './radio.css.js';\n\n@customElement('md-radio')\nexport class MdRadio extends MdFormAssociatedElement {\n  static override styles = [MdFormAssociatedElement.styles, radioStyles];\n\n  @property({ type: Boolean, reflect: true })\n  checked = false;\n\n  @property({ type: String })\n  value = 'on';\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.tabIndex = this.disabled ? -1 : (this.checked ? 0 : -1);\n    this.addEventListener('click', this.handleClick);\n    this.addEventListener('keydown', this.handleKeyDown);\n    this.updateFormValue();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.handleClick);\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('checked') || changedProperties.has('value')) {\n      this.tabIndex = this.disabled ? -1 : (this.checked ? 0 : -1);\n      this.updateFormValue();\n    }\n  }\n\n  override formResetCallback() {\n    this.checked = false;\n    this.updateFormValue();\n  }\n\n  private updateFormValue() {\n    this.setFormValue(this.checked ? this.value : null);\n    if (this.required && !this.checked) {\n      this.setValidity({ valueMissing: true }, 'Please select one of these options');\n    } else {\n      this.setValidity({});\n    }\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    if (this.disabled || this.checked) return;\n    event.preventDefault();\n    this.select();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n    if (event.key === ' ' || event.key === 'Enter') {\n      event.preventDefault();\n      this.select();\n    }\n  };\n\n  select() {\n    this.checked = true;\n    this.updateFormValue();\n    this.emitEvent('change', { checked: true, value: this.value });\n    this.emitEvent('input', { checked: true, value: this.value });\n\n    // Uncheck siblings with same name\n    if (this.name) {\n      const root = this.getRootNode() as Document | ShadowRoot;\n      const radios = root.querySelectorAll(`md-radio[name=\"${this.name}\"]`) as NodeListOf<MdRadio>;\n      radios.forEach((radio) => {\n        if (radio !== this && radio.checked) {\n          radio.checked = false;\n          radio.tabIndex = -1;\n        }\n      });\n    }\n  }\n\n  override render() {\n    return html`\n      <div class=\"container\">\n        <md-ripple ?disabled=${this.disabled} unbounded></md-ripple>\n        <md-focus-ring></md-focus-ring>\n        <div class=\"outer-circle\">\n          <div class=\"inner-circle\"></div>\n        </div>\n      </div>\n      <slot></slot>\n    `;\n  }\n}\n\n@customElement('md-radio-group')\nexport class MdRadioGroup extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, radioGroupStyles];\n\n  @property({ type: String })\n  name = '';\n\n  @property({ type: String })\n  value = '';\n\n  @property({ type: Boolean, reflect: true })\n  row = false;\n\n  @queryAssignedElements({ selector: 'md-radio' })\n  private radios!: MdRadio[];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('change', this.handleChange);\n    this.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('change', this.handleChange);\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('name') || changedProperties.has('value')) {\n      this.syncRadios();\n    }\n  }\n\n  private handleSlotChange = () => {\n    this.syncRadios();\n  };\n\n  private syncRadios() {\n    let hasChecked = false;\n    this.radios.forEach((radio) => {\n      if (this.name && !radio.name) {\n        radio.name = this.name;\n      }\n      if (this.value && radio.value === this.value) {\n        radio.checked = true;\n        hasChecked = true;\n      }\n    });\n\n    if (!hasChecked && this.radios.length > 0) {\n      const firstEnabled = this.radios.find((r) => !r.disabled);\n      if (firstEnabled) firstEnabled.tabIndex = 0;\n    }\n  }\n\n  private handleChange = (event: Event) => {\n    const radio = event.target as MdRadio;\n    if (radio && radio.checked) {\n      this.value = radio.value;\n      this.emitEvent('group-change', { value: this.value });\n    }\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    const enabledRadios = this.radios.filter((r) => !r.disabled);\n    if (enabledRadios.length === 0) return;\n\n    const currentIndex = enabledRadios.findIndex((r) => r === document.activeElement || r.shadowRoot?.activeElement);\n\n    let nextIndex = -1;\n    if (event.key === 'ArrowDown' || event.key === 'ArrowRight') {\n      event.preventDefault();\n      nextIndex = currentIndex < enabledRadios.length - 1 ? currentIndex + 1 : 0;\n    } else if (event.key === 'ArrowUp' || event.key === 'ArrowLeft') {\n      event.preventDefault();\n      nextIndex = currentIndex > 0 ? currentIndex - 1 : enabledRadios.length - 1;\n    }\n\n    if (nextIndex !== -1) {\n      const target = enabledRadios[nextIndex];\n      if (target) {\n        target.select();\n        target.focus();\n      }\n    }\n  };\n\n  override render() {\n    return html`<slot @slotchange=${this.handleSlotChange}></slot>`;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-radio': MdRadio;\n    'md-radio-group': MdRadioGroup;\n  }\n}\n"],"names":["radioStyles","css","radioGroupStyles","MdRadio","MdFormAssociatedElement","event","changedProperties","radio","html","__decorateClass","property","customElement","MdRadioGroup","MdBaseElement","enabledRadios","r","currentIndex","nextIndex","target","hasChecked","firstEnabled","queryAssignedElements"],"mappings":"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"}

package/dist/components/snackbar/snackbar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"snackbar.js","sources":["../../../src/components/snackbar/snackbar.css.ts","../../../src/components/snackbar/snackbar.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const snackbarStyles = css`\n  :host {\n    display: block;\n    position: fixed;\n    bottom: 24px;\n    left: 50%;\n    transform: translateX(-50%) translateY(100px);\n    opacity: 0;\n    pointer-events: none;\n    z-index: 2000;\n    transition: transform 250ms cubic-bezier(0.2, 0, 0, 1),\n                opacity 250ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([open]) {\n    transform: translateX(-50%) translateY(0);\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  .snackbar {\n    display: flex;\n    align-items: center;\n    min-width: 288px;\n    max-width: 568px;\n    min-height: 48px;\n    padding: 8px 16px;\n    box-sizing: border-box;\n    border-radius: var(--md-sys-shape-corner-extra-small, 4px);\n    background-color: var(--md-sys-color-inverse-surface, #313033);\n    color: var(--md-sys-color-inverse-on-surface, #F4EFF4);\n    box-shadow: var(--md-sys-elevation-level3, 0px 1px 3px 0px rgba(0,0,0,0.30));\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    font-size: var(--md-sys-typescale-body-medium-size, 14px);\n    line-height: 20px;\n    gap: 12px;\n  }\n\n  .message {\n    flex: 1;\n  }\n\n  .actions {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .action-btn {\n    background: transparent;\n    border: none;\n    color: var(--md-sys-color-inverse-primary, #D0BCFF);\n    font-family: inherit;\n    font-size: var(--md-sys-typescale-label-large-size, 14px);\n    font-weight: 500;\n    cursor: pointer;\n    padding: 0 8px;\n    height: 36px;\n    border-radius: var(--md-sys-shape-corner-extra-small, 4px);\n    outline: none;\n  }\n\n  .action-btn:hover {\n    background-color: rgba(208, 188, 255, 0.08);\n  }\n\n  .close-btn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    background: transparent;\n    border: none;\n    color: var(--md-sys-color-inverse-on-surface, #F4EFF4);\n    cursor: pointer;\n    padding: 4px;\n    border-radius: 50%;\n    outline: none;\n  }\n\n  .close-btn:hover {\n    background-color: rgba(255, 255, 255, 0.08);\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport '../icon/icon.js';\nimport { snackbarStyles } from './snackbar.css.js';\n\n@customElement('md-snackbar')\nexport class MdSnackbar extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, snackbarStyles];\n\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  @property({ type: String })\n  message = '';\n\n  @property({ type: String, attribute: 'action-text' })\n  actionText = '';\n\n  @property({ type: Boolean, reflect: true })\n  closeable = false;\n\n  @property({ type: Number, attribute: 'timeout-ms' })\n  timeoutMs = 4000;\n\n  private timerId: number | null = null;\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        this.startTimer();\n      } else {\n        this.clearTimer();\n      }\n    }\n  }\n\n  show() {\n    this.open = true;\n  }\n\n  close() {\n    this.open = false;\n    this.emitEvent('close');\n  }\n\n  private startTimer() {\n    this.clearTimer();\n    if (this.timeoutMs > 0) {\n      this.timerId = window.setTimeout(() => {\n        this.close();\n      }, this.timeoutMs);\n    }\n  }\n\n  private clearTimer() {\n    if (this.timerId !== null) {\n      clearTimeout(this.timerId);\n      this.timerId = null;\n    }\n  }\n\n  private handleAction = () => {\n    this.emitEvent('action');\n    this.close();\n  };\n\n  private handleClose = () => {\n    this.close();\n  };\n\n  override render() {\n    return html`\n      <div class=\"snackbar\" role=\"status\" aria-live=\"polite\">\n        <div class=\"message\">\n          <slot>${this.message}</slot>\n        </div>\n\n        <div class=\"actions\">\n          ${this.actionText\n            ? html`\n                <button class=\"action-btn\" @click=${this.handleAction}>\n                  ${this.actionText}\n                </button>\n              `\n            : nothing}\n\n          ${this.closeable\n            ? html`\n                <button class=\"close-btn\" aria-label=\"Dismiss\" @click=${this.handleClose}>\n                  <md-icon name=\"close\" size=\"18\"></md-icon>\n                </button>\n              `\n            : nothing}\n        </div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-snackbar': MdSnackbar;\n  }\n}\n\n"],"names":["snackbarStyles","css","MdSnackbar","MdBaseElement","changedProperties","html","nothing","__decorateClass","property","customElement"],"mappings":";;;;AAEO,MAAMA,IAAiBC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;ACKvB,IAAMC,IAAN,cAAyBC,EAAc;AAAA,EAAvC,cAAA;AAAA,UAAA,GAAA,SAAA,GAIL,KAAA,OAAO,IAGP,KAAA,UAAU,IAGV,KAAA,aAAa,IAGb,KAAA,YAAY,IAGZ,KAAA,YAAY,KAEZ,KAAQ,UAAyB,MAsCjC,KAAQ,eAAe,MAAM;AAC3B,WAAK,UAAU,QAAQ,GACvB,KAAK,MAAA;AAAA,IACP,GAEA,KAAQ,cAAc,MAAM;AAC1B,WAAK,MAAA;AAAA,IACP;AAAA,EAAA;AAAA,EA3CS,QAAQC,GAAyC;AACxD,UAAM,QAAQA,CAAiB,GAC3BA,EAAkB,IAAI,MAAM,MAC1B,KAAK,OACP,KAAK,WAAA,IAEL,KAAK,WAAA;AAAA,EAGX;AAAA,EAEA,OAAO;AACL,SAAK,OAAO;AAAA,EACd;AAAA,EAEA,QAAQ;AACN,SAAK,OAAO,IACZ,KAAK,UAAU,OAAO;AAAA,EACxB;AAAA,EAEQ,aAAa;AACnB,SAAK,WAAA,GACD,KAAK,YAAY,MACnB,KAAK,UAAU,OAAO,WAAW,MAAM;AACrC,WAAK,MAAA;AAAA,IACP,GAAG,KAAK,SAAS;AAAA,EAErB;AAAA,EAEQ,aAAa;AACnB,IAAI,KAAK,YAAY,SACnB,aAAa,KAAK,OAAO,GACzB,KAAK,UAAU;AAAA,EAEnB;AAAA,EAWS,SAAS;AAChB,WAAOC;AAAA;AAAA;AAAA,kBAGO,KAAK,OAAO;AAAA;AAAA;AAAA;AAAA,YAIlB,KAAK,aACHA;AAAA,oDACsC,KAAK,YAAY;AAAA,oBACjD,KAAK,UAAU;AAAA;AAAA,kBAGrBC,CAAO;AAAA;AAAA,YAET,KAAK,YACHD;AAAA,wEAC0D,KAAK,WAAW;AAAA;AAAA;AAAA,kBAI1EC,CAAO;AAAA;AAAA;AAAA;AAAA,EAInB;AACF;AA5FaJ,EACK,SAAS,CAACC,EAAc,QAAQH,CAAc;AAG9DO,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAH/BN,EAIX,WAAA,QAAA,CAAA;AAGAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,OAAA,CAAQ;AAAA,GANfN,EAOX,WAAA,WAAA,CAAA;AAGAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,eAAe;AAAA,GATzCN,EAUX,WAAA,cAAA,CAAA;AAGAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,SAAS,SAAS,IAAM;AAAA,GAZ/BN,EAaX,WAAA,aAAA,CAAA;AAGAK,EAAA;AAAA,EADCC,EAAS,EAAE,MAAM,QAAQ,WAAW,cAAc;AAAA,GAfxCN,EAgBX,WAAA,aAAA,CAAA;AAhBWA,IAANK,EAAA;AAAA,EADNE,EAAc,aAAa;AAAA,GACfP,CAAA;"}

package/dist/components/switch/switch.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"switch.js","sources":["../../../src/components/switch/switch.css.ts","../../../src/components/switch/switch.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const switchStyles = css`\n  :host {\n    display: inline-flex;\n    align-items: center;\n    vertical-align: middle;\n    cursor: pointer;\n    outline: none;\n    -webkit-tap-highlight-color: transparent;\n    user-select: none;\n    gap: 12px;\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    font-size: var(--md-sys-typescale-body-large-size, 16px);\n    color: var(--md-sys-color-on-surface, #1D1B20);\n  }\n\n  :host([disabled]) {\n    cursor: not-allowed;\n    color: rgba(29, 27, 32, 0.38);\n    pointer-events: none;\n  }\n\n  .switch {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    width: 52px;\n    height: 32px;\n    box-sizing: border-box;\n    border-radius: var(--md-sys-shape-corner-full, 9999px);\n    border: 2px solid var(--md-sys-color-outline, #79747E);\n    background-color: var(--md-sys-color-surface-container-highest, #E6E0E9);\n    transition: background-color 200ms cubic-bezier(0.2, 0, 0, 1),\n                border-color 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([selected]) .switch {\n    background-color: var(--md-sys-color-primary, #6750A4);\n    border-color: var(--md-sys-color-primary, #6750A4);\n  }\n\n  :host([disabled]) .switch {\n    background-color: rgba(29, 27, 32, 0.12);\n    border-color: rgba(29, 27, 32, 0.12);\n  }\n\n  .thumb-container {\n    position: absolute;\n    left: 4px;\n    width: 20px;\n    height: 20px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: transform 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([selected]) .thumb-container {\n    transform: translateX(20px);\n  }\n\n  .thumb {\n    width: 16px;\n    height: 16px;\n    border-radius: 50%;\n    background-color: var(--md-sys-color-outline, #79747E);\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    transition: width 200ms cubic-bezier(0.2, 0, 0, 1),\n                height 200ms cubic-bezier(0.2, 0, 0, 1),\n                background-color 200ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([selected]) .thumb {\n    width: 24px;\n    height: 24px;\n    background-color: var(--md-sys-color-on-primary, #FFFFFF);\n  }\n\n  :host([disabled]) .thumb {\n    background-color: rgba(29, 27, 32, 0.38);\n  }\n\n  .icon {\n    font-size: 16px;\n    color: var(--md-sys-color-on-primary-container, #21005D);\n    opacity: 0;\n    transition: opacity 150ms ease;\n  }\n\n  :host([selected]) .icon.check {\n    opacity: 1;\n  }\n\n  :host([icons]:not([selected])) .icon.cross {\n    opacity: 1;\n    color: var(--md-sys-color-surface-container-highest, #E6E0E9);\n  }\n`;\n\n","import { html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { MdFormAssociatedElement } from '../../internal/form-associated.js';\nimport '../../internal/ripple/ripple.js';\nimport '../../internal/focus-ring/focus-ring.js';\nimport '../icon/icon.js';\nimport { switchStyles } from './switch.css.js';\n\n@customElement('md-switch')\nexport class MdSwitch extends MdFormAssociatedElement {\n  static override styles = [MdFormAssociatedElement.styles, switchStyles];\n\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  @property({ type: Boolean, reflect: true })\n  icons = false;\n\n  @property({ type: String })\n  value = 'on';\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.tabIndex = this.disabled ? -1 : 0;\n    this.addEventListener('click', this.handleClick);\n    this.addEventListener('keydown', this.handleKeyDown);\n    this.updateFormValue();\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.handleClick);\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('selected') || changedProperties.has('value')) {\n      this.updateFormValue();\n    }\n  }\n\n  override formResetCallback() {\n    this.selected = false;\n    this.updateFormValue();\n  }\n\n  private updateFormValue() {\n    this.setFormValue(this.selected ? this.value : null);\n    if (this.required && !this.selected) {\n      this.setValidity({ valueMissing: true }, 'Please toggle this switch');\n    } else {\n      this.setValidity({});\n    }\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    if (this.disabled) return;\n    event.preventDefault();\n    this.toggle();\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n    if (event.key === ' ' || event.key === 'Enter') {\n      event.preventDefault();\n      this.toggle();\n    }\n  };\n\n  private toggle() {\n    this.selected = !this.selected;\n    this.updateFormValue();\n    this.emitEvent('change', { selected: this.selected });\n    this.emitEvent('input', { selected: this.selected });\n  }\n\n  override render() {\n    return html`\n      <div class=\"switch\">\n        <div class=\"thumb-container\">\n          <md-ripple ?disabled=${this.disabled} unbounded></md-ripple>\n          <md-focus-ring></md-focus-ring>\n          <div class=\"thumb\">\n            ${this.icons\n              ? html`\n                  <md-icon class=\"icon check\" size=\"14\">check</md-icon>\n                  <md-icon class=\"icon cross\" size=\"14\">close</md-icon>\n                `\n              : html`<slot name=\"icon\"></slot>`}\n          </div>\n        </div>\n      </div>\n      <slot></slot>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-switch': MdSwitch;\n  }\n}\n"],"names":["switchStyles","css","MdSwitch","MdFormAssociatedElement","event","changedProperties","html","__decorateClass","property","customElement"],"mappings":"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"}

package/dist/components/tabs/tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"tabs.js","sources":["../../../src/components/tabs/tabs.css.ts","../../../src/components/tabs/tabs.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const tabsStyles = css`\n  :host {\n    display: flex;\n    position: relative;\n    box-sizing: border-box;\n    border-bottom: 1px solid var(--md-sys-color-surface-variant, #E7E0EC);\n    overflow-x: auto;\n    scrollbar-width: none; /* Firefox */\n  }\n\n  :host::-webkit-scrollbar {\n    display: none; /* Safari and Chrome */\n  }\n\n  .tabs-container {\n    display: flex;\n    position: relative;\n    width: 100%;\n  }\n\n  .indicator {\n    position: absolute;\n    bottom: 0;\n    height: 3px;\n    background-color: var(--md-sys-color-primary, #6750A4);\n    border-radius: 3px 3px 0 0;\n    transition: transform 250ms cubic-bezier(0.2, 0, 0, 1),\n                width 250ms cubic-bezier(0.2, 0, 0, 1);\n    pointer-events: none;\n  }\n`;\n\nexport const tabStyles = css`\n  :host {\n    display: inline-flex;\n    flex: 1;\n    min-width: 90px;\n    height: 48px;\n    outline: none;\n    cursor: pointer;\n    user-select: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n    opacity: 0.38;\n  }\n\n  .tab {\n    position: relative;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: center;\n    width: 100%;\n    height: 100%;\n    padding: 0 16px;\n    gap: 8px;\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    font-size: var(--md-sys-typescale-title-small-size, 14px);\n    font-weight: 500;\n    line-height: 20px;\n    letter-spacing: 0.1px;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    transition: color 150ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  :host([active]) .tab {\n    color: var(--md-sys-color-primary, #6750A4);\n  }\n\n  .content {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    position: relative;\n    z-index: 1;\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property, query, queryAssignedElements } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport '../../internal/ripple/ripple.js';\nimport '../../internal/focus-ring/focus-ring.js';\nimport '../icon/icon.js';\nimport { tabsStyles, tabStyles } from './tabs.css.js';\n\n@customElement('md-tab')\nexport class MdTab extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, tabStyles];\n\n  @property({ type: Boolean, reflect: true })\n  active = false;\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  @property({ type: String })\n  icon = '';\n\n  @property({ type: String })\n  label = '';\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'tab');\n    this.setAttribute('aria-selected', this.active ? 'true' : 'false');\n    this.tabIndex = this.active ? 0 : -1;\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('active')) {\n      this.setAttribute('aria-selected', this.active ? 'true' : 'false');\n      this.tabIndex = this.active ? 0 : -1;\n    }\n  }\n\n  override render() {\n    return html`\n      <div class=\"tab\">\n        <md-ripple ?disabled=${this.disabled}></md-ripple>\n        <md-focus-ring></md-focus-ring>\n        <span class=\"content\">\n          <slot name=\"icon\">\n            ${this.icon ? html`<md-icon name=${this.icon}></md-icon>` : nothing}\n          </slot>\n          <slot>${this.label}</slot>\n        </span>\n      </div>\n    `;\n  }\n}\n\n@customElement('md-tabs')\nexport class MdTabs extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, tabsStyles];\n\n  @property({ type: Number, reflect: true, attribute: 'active-index' })\n  activeIndex = 0;\n\n  @queryAssignedElements({ selector: 'md-tab' })\n  private tabs!: MdTab[];\n\n  @query('.indicator')\n  private indicatorElement?: HTMLElement;\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.setAttribute('role', 'tablist');\n    this.addEventListener('click', this.handleClick);\n    this.addEventListener('keydown', this.handleKeyDown);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.handleClick);\n    this.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('activeIndex')) {\n      this.syncActiveTab();\n    }\n  }\n\n  private handleSlotChange = () => {\n    this.syncActiveTab();\n  };\n\n  private syncActiveTab() {\n    if (!this.tabs || this.tabs.length === 0) return;\n\n    this.tabs.forEach((tab, index) => {\n      tab.active = index === this.activeIndex;\n    });\n\n    this.updateIndicator();\n  }\n\n  private updateIndicator() {\n    if (!this.indicatorElement || !this.tabs || this.tabs.length === 0) return;\n\n    const activeTab = this.tabs[this.activeIndex];\n    if (activeTab) {\n      const parentRect = this.getBoundingClientRect();\n      const tabRect = activeTab.getBoundingClientRect();\n      const left = tabRect.left - parentRect.left;\n      const width = tabRect.width;\n\n      this.indicatorElement.style.transform = `translateX(${left}px)`;\n      this.indicatorElement.style.width = `${width}px`;\n    }\n  }\n\n  private handleClick = (event: MouseEvent) => {\n    const target = (event.target as HTMLElement).closest('md-tab') as MdTab | null;\n    if (target && !target.disabled) {\n      const index = this.tabs.indexOf(target);\n      if (index !== -1 && index !== this.activeIndex) {\n        this.activeIndex = index;\n        this.syncActiveTab();\n        this.emitEvent('change', { activeIndex: this.activeIndex });\n      }\n    }\n  };\n\n  private handleKeyDown = (event: KeyboardEvent) => {\n    const enabledTabs = this.tabs.filter((t) => !t.disabled);\n    if (enabledTabs.length === 0) return;\n\n    const currentTab = this.tabs[this.activeIndex];\n    const currentIndex = enabledTabs.indexOf(currentTab!);\n\n    let nextIndex = -1;\n    if (event.key === 'ArrowRight') {\n      event.preventDefault();\n      nextIndex = currentIndex < enabledTabs.length - 1 ? currentIndex + 1 : 0;\n    } else if (event.key === 'ArrowLeft') {\n      event.preventDefault();\n      nextIndex = currentIndex > 0 ? currentIndex - 1 : enabledTabs.length - 1;\n    } else if (event.key === 'Home') {\n      event.preventDefault();\n      nextIndex = 0;\n    } else if (event.key === 'End') {\n      event.preventDefault();\n      nextIndex = enabledTabs.length - 1;\n    }\n\n    if (nextIndex !== -1 && enabledTabs[nextIndex]) {\n      const targetTab = enabledTabs[nextIndex]!;\n      this.activeIndex = this.tabs.indexOf(targetTab);\n      this.syncActiveTab();\n      targetTab.focus();\n      this.emitEvent('change', { activeIndex: this.activeIndex });\n    }\n  };\n\n  override render() {\n    return html`\n      <div class=\"tabs-container\">\n        <slot @slotchange=${this.handleSlotChange}></slot>\n        <div class=\"indicator\"></div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-tab': MdTab;\n    'md-tabs': MdTabs;\n  }\n}\n\n"],"names":["tabsStyles","css","tabStyles","MdTab","MdBaseElement","changedProperties","html","nothing","__decorateClass","property","customElement","MdTabs","event","target","index","enabledTabs","t","currentTab","currentIndex","nextIndex","targetTab","tab","activeTab","parentRect","tabRect","left","width","queryAssignedElements","query"],"mappings":"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"}

package/dist/components/text-field/text-field.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"text-field.js","sources":["../../../src/components/text-field/text-field.css.ts","../../../src/components/text-field/text-field.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const textFieldStyles = css`\n  :host {\n    display: inline-flex;\n    flex-direction: column;\n    min-width: 240px;\n    vertical-align: top;\n    font-family: var(--md-sys-typescale-font-family, inherit);\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  :host([disabled]) {\n    pointer-events: none;\n    opacity: 0.38;\n  }\n\n  .container {\n    position: relative;\n    display: flex;\n    align-items: center;\n    min-height: 56px;\n    padding: 0 16px;\n    box-sizing: border-box;\n    transition: background-color 150ms cubic-bezier(0.2, 0, 0, 1),\n                border-color 150ms cubic-bezier(0.2, 0, 0, 1);\n  }\n\n  /* --- Filled Variant (Default) --- */\n  :host(:not([variant])) .container,\n  :host([variant=\"filled\"]) .container {\n    background-color: var(--md-sys-color-surface-container-highest, #E6E0E9);\n    border-radius: var(--md-sys-shape-corner-extra-small, 4px) var(--md-sys-shape-corner-extra-small, 4px) 0 0;\n    border-bottom: 1px solid var(--md-sys-color-on-surface-variant, #49454F);\n  }\n\n  :host(:not([variant])[focused]) .container,\n  :host([variant=\"filled\"][focused]) .container {\n    border-bottom: 2px solid var(--md-sys-color-primary, #6750A4);\n  }\n\n  :host(:not([variant])[error]) .container,\n  :host([variant=\"filled\"][error]) .container {\n    border-bottom-color: var(--md-sys-color-error, #B3261E);\n  }\n\n  /* --- Outlined Variant --- */\n  :host([variant=\"outlined\"]) .container {\n    background-color: transparent;\n    border: 1px solid var(--md-sys-color-outline, #79747E);\n    border-radius: var(--md-sys-shape-corner-extra-small, 4px);\n  }\n\n  :host([variant=\"outlined\"][focused]) .container {\n    border: 2px solid var(--md-sys-color-primary, #6750A4);\n    padding: 0 15px; /* Offset for 2px border */\n  }\n\n  :host([variant=\"outlined\"][error]) .container {\n    border-color: var(--md-sys-color-error, #B3261E);\n  }\n\n  /* Floating Label */\n  .label {\n    position: absolute;\n    left: 16px;\n    top: 50%;\n    transform: translateY(-50%);\n    font-size: 16px;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    pointer-events: none;\n    transition: transform 150ms cubic-bezier(0.2, 0, 0, 1),\n                font-size 150ms cubic-bezier(0.2, 0, 0, 1),\n                color 150ms cubic-bezier(0.2, 0, 0, 1);\n    transform-origin: top left;\n  }\n\n  :host([has-leading-icon]) .label {\n    left: 48px;\n  }\n\n  :host([focused]) .label,\n  :host([has-value]) .label,\n  :host([has-placeholder]) .label {\n    transform: translateY(-110%) scale(0.75);\n  }\n\n  :host([variant=\"filled\"][focused]) .label,\n  :host([variant=\"filled\"][has-value]) .label,\n  :host([variant=\"filled\"][has-placeholder]) .label {\n    top: 35%;\n  }\n\n  :host([variant=\"outlined\"][focused]) .label,\n  :host([variant=\"outlined\"][has-value]) .label,\n  :host([variant=\"outlined\"][has-placeholder]) .label {\n    top: 0;\n    left: 12px;\n    background-color: var(--md-sys-color-surface, #FEF7FF);\n    padding: 0 4px;\n  }\n\n  :host([focused]) .label {\n    color: var(--md-sys-color-primary, #6750A4);\n  }\n\n  :host([error]) .label {\n    color: var(--md-sys-color-error, #B3261E);\n  }\n\n  .input-wrapper {\n    display: flex;\n    align-items: center;\n    flex: 1;\n    height: 100%;\n    min-width: 0;\n  }\n\n  :host(:not([variant])) .input-wrapper,\n  :host([variant=\"filled\"]) .input-wrapper {\n    padding-top: 18px;\n  }\n\n  input {\n    flex: 1;\n    width: 100%;\n    border: none;\n    outline: none;\n    background: transparent;\n    font-family: inherit;\n    font-size: 16px;\n    line-height: 24px;\n    color: var(--md-sys-color-on-surface, #1D1B20);\n    padding: 0;\n  }\n\n  input::placeholder {\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    opacity: 0.6;\n  }\n\n  .affix {\n    font-size: 16px;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n    user-select: none;\n  }\n\n  .prefix { margin-right: 4px; }\n  .suffix { margin-left: 4px; }\n\n  .icon-slot {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n  }\n\n  .leading-icon { margin-right: 12px; }\n  .trailing-icon { margin-left: 12px; }\n\n  :host([error]) .trailing-icon {\n    color: var(--md-sys-color-error, #B3261E);\n  }\n\n  /* Supporting / Error text */\n  .supporting-text {\n    display: flex;\n    justify-content: space-between;\n    padding: 4px 16px 0;\n    font-size: 12px;\n    line-height: 16px;\n    color: var(--md-sys-color-on-surface-variant, #49454F);\n  }\n\n  :host([error]) .supporting-text {\n    color: var(--md-sys-color-error, #B3261E);\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property, state, query, queryAssignedElements } from 'lit/decorators.js';\nimport { MdBaseElement } from '../../internal/base-component.js';\nimport { MdFormAssociatedElement } from '../../internal/form-associated.js';\nimport '../../internal/ripple/ripple.js';\nimport '../icon/icon.js';\nimport { textFieldStyles } from './text-field.css.js';\n\nexport type TextFieldVariant = 'filled' | 'outlined';\n\n@customElement('md-text-field')\nexport class MdTextField extends MdFormAssociatedElement {\n  static override styles = [MdFormAssociatedElement.styles, textFieldStyles];\n\n  @property({ type: String, reflect: true })\n  variant: TextFieldVariant = 'filled';\n\n  @property({ type: String })\n  label = '';\n\n  @property({ type: String })\n  value = '';\n\n  @property({ type: String })\n  placeholder = '';\n\n  @property({ type: String })\n  type = 'text';\n\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  @property({ type: Boolean, reflect: true })\n  error = false;\n\n  @property({ type: String, attribute: 'error-text' })\n  errorText = '';\n\n  @property({ type: String, attribute: 'supporting-text' })\n  supportingText = '';\n\n  @property({ type: String, attribute: 'prefix-text' })\n  prefixText = '';\n\n  @property({ type: String, attribute: 'suffix-text' })\n  suffixText = '';\n\n  @property({ type: Number, attribute: 'maxlength' })\n  maxLength = -1;\n\n  @property({ type: String })\n  pattern = '';\n\n  @property({ type: String, attribute: 'leading-icon' })\n  leadingIcon = '';\n\n  @property({ type: String, attribute: 'trailing-icon' })\n  trailingIcon = '';\n\n  @state()\n  private focused = false;\n\n  @query('input')\n  private inputElement?: HTMLInputElement;\n\n  @queryAssignedElements({ slot: 'leading-icon' })\n  private assignedLeadingIcons!: HTMLElement[];\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.setFormValue(this.value);\n  }\n\n  override willUpdate(changedProperties: Map<string, unknown>) {\n    super.willUpdate(changedProperties);\n    if (changedProperties.has('value')) {\n      this.setFormValue(this.value);\n      this.toggleAttribute('has-value', Boolean(this.value));\n      this.validateInput();\n    }\n  }\n\n  override updated(changedProperties: Map<string, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('placeholder')) {\n      this.toggleAttribute('has-placeholder', Boolean(this.placeholder));\n    }\n  }\n\n  override formResetCallback() {\n    this.value = '';\n    this.error = false;\n    this.setFormValue(null);\n  }\n\n  private handleFocus = () => {\n    this.focused = true;\n    this.toggleAttribute('focused', true);\n  };\n\n  private handleBlur = () => {\n    this.focused = false;\n    this.toggleAttribute('focused', false);\n    this.validateInput();\n  };\n\n  private handleInput = (event: Event) => {\n    const target = event.target as HTMLInputElement;\n    this.value = target.value;\n    this.setFormValue(this.value);\n    this.emitEvent('input', { value: this.value });\n  };\n\n  private handleChange = () => {\n    this.emitEvent('change', { value: this.value });\n  };\n\n  private validateInput() {\n    if (!this.inputElement) return;\n\n    if (this.required && !this.value) {\n      this.setValidity({ valueMissing: true }, this.errorText || 'This field is required');\n      this.error = true;\n    } else if (this.pattern && !new RegExp(this.pattern).test(this.value)) {\n      this.setValidity({ patternMismatch: true }, this.errorText || 'Invalid format');\n      this.error = true;\n    } else {\n      this.setValidity({});\n      if (!this.errorText) {\n        this.error = false;\n      }\n    }\n  }\n\n  private handleSlotChange() {\n    const hasLeading = Boolean(this.leadingIcon || (this.assignedLeadingIcons && this.assignedLeadingIcons.length > 0));\n    this.toggleAttribute('has-leading-icon', hasLeading);\n  }\n\n  override render() {\n    const displayText = this.error ? (this.errorText || this.supportingText) : this.supportingText;\n\n    return html`\n      <div class=\"container\" @click=${() => this.inputElement?.focus()}>\n        ${this.variant === 'filled' ? html`<md-ripple ?disabled=${this.disabled}></md-ripple>` : nothing}\n\n        <span class=\"icon-slot leading-icon\">\n          <slot name=\"leading-icon\" @slotchange=${this.handleSlotChange}>\n            ${this.leadingIcon ? html`<md-icon name=${this.leadingIcon}></md-icon>` : nothing}\n          </slot>\n        </span>\n\n        <div class=\"input-wrapper\">\n          ${this.label ? html`<label class=\"label\">${this.label}</label>` : nothing}\n          ${this.prefixText ? html`<span class=\"affix prefix\">${this.prefixText}</span>` : nothing}\n          <input\n            type=${this.type}\n            .value=${this.value}\n            placeholder=${this.focused || !this.label ? this.placeholder : ''}\n            ?disabled=${this.disabled}\n            ?readonly=${this.readonly}\n            ?required=${this.required}\n            maxlength=${this.maxLength > 0 ? this.maxLength : nothing}\n            @focus=${this.handleFocus}\n            @blur=${this.handleBlur}\n            @input=${this.handleInput}\n            @change=${this.handleChange}\n          />\n          ${this.suffixText ? html`<span class=\"affix suffix\">${this.suffixText}</span>` : nothing}\n        </div>\n\n        <span class=\"icon-slot trailing-icon\">\n          <slot name=\"trailing-icon\">\n            ${this.error ? html`<md-icon name=\"error\" filled></md-icon>` : (this.trailingIcon ? html`<md-icon name=${this.trailingIcon}></md-icon>` : nothing)}\n          </slot>\n        </span>\n      </div>\n\n      ${displayText || (this.maxLength > 0)\n        ? html`\n            <div class=\"supporting-text\">\n              <span>${displayText}</span>\n              ${this.maxLength > 0 ? html`<span>${this.value.length} / ${this.maxLength}</span>` : nothing}\n            </div>\n          `\n        : nothing}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-text-field': MdTextField;\n  }\n}\n"],"names":["textFieldStyles","css","MdTextField","MdFormAssociatedElement","event","target","changedProperties","hasLeading","displayText","html","nothing","__decorateClass","property","state","query","queryAssignedElements","customElement"],"mappings":"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"}

package/dist/internal/ripple/ripple.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ripple.js","sources":["../../../src/internal/ripple/ripple.css.ts","../../../src/internal/ripple/ripple.ts"],"sourcesContent":["import { css } from 'lit';\n\nexport const rippleStyles = css`\n  :host {\n    display: inline-flex;\n    position: absolute;\n    inset: 0;\n    overflow: hidden;\n    border-radius: inherit;\n    pointer-events: none;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  :host([unbounded]) {\n    overflow: visible;\n  }\n\n  :host([disabled]) {\n    opacity: 0;\n  }\n\n  .surface {\n    position: absolute;\n    inset: 0;\n    border-radius: inherit;\n    background-color: currentColor;\n    opacity: 0;\n    transition: opacity 150ms linear;\n  }\n\n  :host(:hover) .surface,\n  .surface.hovered {\n    opacity: var(--md-sys-state-hover-opacity, 0.08);\n  }\n\n  :host(:focus-visible) .surface,\n  .surface.focused {\n    opacity: var(--md-sys-state-focus-opacity, 0.12);\n  }\n\n  .ripple {\n    position: absolute;\n    border-radius: 50%;\n    background-color: currentColor;\n    opacity: var(--md-sys-state-pressed-opacity, 0.12);\n    transform: scale(0);\n    pointer-events: none;\n    animation: md-ripple-expand 350ms cubic-bezier(0.2, 0, 0, 1) forwards;\n  }\n\n  .ripple.fading {\n    animation: md-ripple-fade-out 250ms linear forwards;\n  }\n\n  @keyframes md-ripple-expand {\n    from {\n      transform: scale(0);\n      opacity: var(--md-sys-state-pressed-opacity, 0.12);\n    }\n    to {\n      transform: scale(2.5);\n      opacity: var(--md-sys-state-pressed-opacity, 0.12);\n    }\n  }\n\n  @keyframes md-ripple-fade-out {\n    from {\n      opacity: var(--md-sys-state-pressed-opacity, 0.12);\n    }\n    to {\n      opacity: 0;\n    }\n  }\n`;\n\n","import { html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { MdBaseElement } from '../base-component.js';\nimport { rippleStyles } from './ripple.css.js';\n\n@customElement('md-ripple')\nexport class MdRipple extends MdBaseElement {\n  static override styles = [MdBaseElement.styles, rippleStyles];\n\n  @property({ type: Boolean, reflect: true })\n  unbounded = false;\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  @state()\n  private isHovered = false;\n\n  @state()\n  private isFocused = false;\n\n  private ripples: HTMLElement[] = [];\n  private control: HTMLElement | null = null;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    this.setupControl();\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.cleanupControl();\n  }\n\n  private setupControl(): void {\n    // Attach to parent element or host\n    this.control = (this.parentElement || (this.getRootNode() as ShadowRoot)?.host) as HTMLElement | null;\n    if (!this.control) return;\n\n    this.control.addEventListener('pointerenter', this.handlePointerEnter);\n    this.control.addEventListener('pointerleave', this.handlePointerLeave);\n    this.control.addEventListener('pointerdown', this.handlePointerDown);\n    this.control.addEventListener('focusin', this.handleFocusIn);\n    this.control.addEventListener('focusout', this.handleFocusOut);\n  }\n\n  private cleanupControl(): void {\n    if (!this.control) return;\n    this.control.removeEventListener('pointerenter', this.handlePointerEnter);\n    this.control.removeEventListener('pointerleave', this.handlePointerLeave);\n    this.control.removeEventListener('pointerdown', this.handlePointerDown);\n    this.control.removeEventListener('focusin', this.handleFocusIn);\n    this.control.removeEventListener('focusout', this.handleFocusOut);\n  }\n\n  private handlePointerEnter = (): void => {\n    if (this.disabled) return;\n    this.isHovered = true;\n  };\n\n  private handlePointerLeave = (): void => {\n    this.isHovered = false;\n  };\n\n  private handleFocusIn = (): void => {\n    if (this.disabled) return;\n    this.isFocused = true;\n  };\n\n  private handleFocusOut = (): void => {\n    this.isFocused = false;\n  };\n\n  private handlePointerDown = (event: PointerEvent): void => {\n    if (this.disabled || event.button !== 0) return;\n\n    const rect = this.getBoundingClientRect();\n    const size = Math.max(rect.width, rect.height);\n    const radius = size / 2;\n\n    const x = this.unbounded ? rect.width / 2 : event.clientX - rect.left;\n    const y = this.unbounded ? rect.height / 2 : event.clientY - rect.top;\n\n    const ripple = document.createElement('div');\n    ripple.className = 'ripple';\n    ripple.style.width = `${size}px`;\n    ripple.style.height = `${size}px`;\n    ripple.style.left = `${x - radius}px`;\n    ripple.style.top = `${y - radius}px`;\n\n    const container = this.shadowRoot?.querySelector('.surface-container');\n    if (container) {\n      container.appendChild(ripple);\n      this.ripples.push(ripple);\n    }\n\n    const removeRipple = () => {\n      ripple.classList.add('fading');\n      setTimeout(() => {\n        ripple.remove();\n        this.ripples = this.ripples.filter((r) => r !== ripple);\n      }, 250);\n      window.removeEventListener('pointerup', removeRipple);\n      window.removeEventListener('pointercancel', removeRipple);\n    };\n\n    window.addEventListener('pointerup', removeRipple);\n    window.addEventListener('pointercancel', removeRipple);\n  };\n\n  override render() {\n    return html`\n      <div class=\"surface-container\">\n        <div class=\"surface ${this.isHovered ? 'hovered' : ''} ${this.isFocused ? 'focused' : ''}\"></div>\n      </div>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'md-ripple': MdRipple;\n  }\n}\n\n"],"names":["rippleStyles","css","MdRipple","MdBaseElement","event","rect","size","radius","x","y","ripple","container","removeRipple","r","html","__decorateClass","property","state","customElement"],"mappings":"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"}