@francofantomius/material-components 0.1.0

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

@@ -0,0 +1 @@
+{"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/index.d.ts

@@ -0,0 +1,23 @@
+export * from './tokens/index.js';
+export * from './internal/base-component.js';
+export * from './internal/form-associated.js';
+export * from './internal/ripple/ripple.js';
+export * from './internal/focus-ring/focus-ring.js';
+export * from './components/icon/icon.js';
+export * from './components/button/button.js';
+export * from './components/icon-button/icon-button.js';
+export * from './components/fab/fab.js';
+export * from './components/text-field/text-field.js';
+export * from './components/checkbox/checkbox.js';
+export * from './components/switch/switch.js';
+export * from './components/radio/radio.js';
+export * from './components/card/card.js';
+export * from './components/dialog/dialog.js';
+export * from './components/divider/divider.js';
+export * from './components/progress/progress.js';
+export * from './components/badge/badge.js';
+export * from './components/chip/chip.js';
+export * from './components/tabs/tabs.js';
+export * from './components/list/list.js';
+export * from './components/snackbar/snackbar.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,cAAc,mBAAmB,CAAC;AAGlC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,qCAAqC,CAAC;AAGpD,cAAc,2BAA2B,CAAC;AAC1C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,yCAAyC,CAAC;AACxD,cAAc,yBAAyB,CAAC;AACxC,cAAc,uCAAuC,CAAC;AACtD,cAAc,mCAAmC,CAAC;AAClD,cAAc,+BAA+B,CAAC;AAC9C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,+BAA+B,CAAC;AAC9C,cAAc,iCAAiC,CAAC;AAChD,cAAc,mCAAmC,CAAC;AAClD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mCAAmC,CAAC"}

package/dist/index.js

@@ -0,0 +1,59 @@
+import { a as r, c as t, d, e as m, l as a, m as p, s, t as M, b as x } from "./chunks/theme.css-DV3DRha-.js";
+import { M as i } from "./chunks/base-component-DQTjlEVL.js";
+import { M as n } from "./chunks/form-associated-fKbeX_2P.js";
+import { MdRipple as h } from "./internal/ripple/ripple.js";
+import { M as b } from "./chunks/focus-ring-Dl-XoEKK.js";
+import { MdIcon as C } from "./components/icon/icon.js";
+import { MdButton as g } from "./components/button/button.js";
+import { MdIconButton as y } from "./components/icon-button/icon-button.js";
+import { MdFab as F } from "./components/fab/fab.js";
+import { MdTextField as I } from "./components/text-field/text-field.js";
+import { MdCheckbox as D } from "./components/checkbox/checkbox.js";
+import { MdSwitch as L } from "./components/switch/switch.js";
+import { MdRadio as A, MdRadioGroup as G } from "./components/radio/radio.js";
+import { MdCard as V } from "./components/card/card.js";
+import { MdDialog as q } from "./components/dialog/dialog.js";
+import { MdDivider as H } from "./components/divider/divider.js";
+import { MdProgress as K } from "./components/progress/progress.js";
+import { MdBadge as O } from "./components/badge/badge.js";
+import { MdChip as U, MdChipSet as W } from "./components/chip/chip.js";
+import { MdTab as Y, MdTabs as Z } from "./components/tabs/tabs.js";
+import { MdList as $, MdListItem as oo } from "./components/list/list.js";
+import { MdSnackbar as ro } from "./components/snackbar/snackbar.js";
+export {
+  O as MdBadge,
+  i as MdBaseElement,
+  g as MdButton,
+  V as MdCard,
+  D as MdCheckbox,
+  U as MdChip,
+  W as MdChipSet,
+  q as MdDialog,
+  H as MdDivider,
+  F as MdFab,
+  b as MdFocusRing,
+  n as MdFormAssociatedElement,
+  C as MdIcon,
+  y as MdIconButton,
+  $ as MdList,
+  oo as MdListItem,
+  K as MdProgress,
+  A as MdRadio,
+  G as MdRadioGroup,
+  h as MdRipple,
+  ro as MdSnackbar,
+  L as MdSwitch,
+  Y as MdTab,
+  Z as MdTabs,
+  I as MdTextField,
+  r as applyTheme,
+  t as colorSchemeToCssVariables,
+  d as darkColorScheme,
+  m as elevationTokens,
+  a as lightColorScheme,
+  p as motionTokens,
+  s as shapeTokens,
+  M as themeStyles,
+  x as typographyTokens
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/dist/internal/base-component.d.ts

@@ -0,0 +1,13 @@
+import { LitElement, CSSResultGroup } from 'lit';
+/**
+ * Base element class for all Material Web Components.
+ * Provides standard reset styles and event dispatch helpers.
+ */
+export declare class MdBaseElement extends LitElement {
+    static styles: CSSResultGroup;
+    /**
+     * Helper to dispatch custom events with standard bubbles/composed defaults.
+     */
+    protected emitEvent<T = unknown>(name: string, detail?: T, options?: CustomEventInit<T>): boolean;
+}
+//# sourceMappingURL=base-component.d.ts.map

package/dist/internal/base-component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-component.d.ts","sourceRoot":"","sources":["../../src/internal/base-component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAO,cAAc,EAAE,MAAM,KAAK,CAAC;AAEtD;;;GAGG;AACH,qBAAa,aAAc,SAAQ,UAAU;IAC3C,OAAgB,MAAM,EAAE,cAAc,CAWpC;IAEF;;OAEG;IACH,SAAS,CAAC,SAAS,CAAC,CAAC,GAAG,OAAO,EAC7B,IAAI,EAAE,MAAM,EACZ,MAAM,CAAC,EAAE,CAAC,EACV,OAAO,GAAE,eAAe,CAAC,CAAC,CAAM,GAC/B,OAAO;CAUX"}

package/dist/internal/focus-ring/focus-ring.css.d.ts

@@ -0,0 +1,2 @@
+export declare const focusRingStyles: import('lit').CSSResult;
+//# sourceMappingURL=focus-ring.css.d.ts.map

package/dist/internal/focus-ring/focus-ring.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus-ring.css.d.ts","sourceRoot":"","sources":["../../../src/internal/focus-ring/focus-ring.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,yBA8B3B,CAAC"}

package/dist/internal/focus-ring/focus-ring.d.ts

@@ -0,0 +1,18 @@
+import { MdBaseElement } from '../base-component.js';
+export declare class MdFocusRing extends MdBaseElement {
+    static styles: import('lit').CSSResultGroup[];
+    visible: boolean;
+    inward: boolean;
+    private control;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private handleFocusIn;
+    private handleFocusOut;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'md-focus-ring': MdFocusRing;
+    }
+}
+//# sourceMappingURL=focus-ring.d.ts.map

package/dist/internal/focus-ring/focus-ring.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"focus-ring.d.ts","sourceRoot":"","sources":["../../../src/internal/focus-ring/focus-ring.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAGrD,qBACa,WAAY,SAAQ,aAAa;IAC5C,OAAgB,MAAM,iCAA2C;IAGjE,OAAO,UAAS;IAGhB,MAAM,UAAS;IAEf,OAAO,CAAC,OAAO,CAA4B;IAElC,iBAAiB,IAAI,IAAI;IASzB,oBAAoB,IAAI,IAAI;IAQrC,OAAO,CAAC,aAAa,CAInB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEO,MAAM;CAGhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,WAAW,CAAC;KAC9B;CACF"}

package/dist/internal/form-associated.d.ts

@@ -0,0 +1,26 @@
+import { MdBaseElement } from './base-component.js';
+/**
+ * Base element class for Form-Associated Custom Elements (FACE).
+ * Provides seamless integration with native HTML <form> elements.
+ */
+export declare class MdFormAssociatedElement extends MdBaseElement {
+    static formAssociated: boolean;
+    protected internals?: ElementInternals;
+    name: string;
+    disabled: boolean;
+    required: boolean;
+    private _customValidityMessage;
+    private _valid;
+    constructor();
+    get form(): HTMLFormElement | null;
+    get validity(): ValidityState;
+    get validationMessage(): string;
+    get willValidate(): boolean;
+    checkValidity(): boolean;
+    reportValidity(): boolean;
+    protected setFormValue(value: string | File | FormData | null): void;
+    protected setValidity(flags?: ValidityStateFlags, message?: string, anchor?: HTMLElement): void;
+    formResetCallback(): void;
+    formDisabledCallback(disabled: boolean): void;
+}
+//# sourceMappingURL=form-associated.d.ts.map

package/dist/internal/form-associated.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-associated.d.ts","sourceRoot":"","sources":["../../src/internal/form-associated.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAEpD;;;GAGG;AACH,qBAAa,uBAAwB,SAAQ,aAAa;IACxD,MAAM,CAAC,cAAc,UAAQ;IAE7B,SAAS,CAAC,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAGvC,IAAI,SAAM;IAGV,QAAQ,UAAS;IAGjB,QAAQ,UAAS;IAEjB,OAAO,CAAC,sBAAsB,CAAM;IACpC,OAAO,CAAC,MAAM,CAAQ;;IAStB,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAED,IAAI,QAAQ,IAAI,aAAa,CAc5B;IAED,IAAI,iBAAiB,IAAI,MAAM,CAE9B;IAED,IAAI,YAAY,IAAI,OAAO,CAE1B;IAED,aAAa,IAAI,OAAO;IAOxB,cAAc,IAAI,OAAO;IAOzB,SAAS,CAAC,YAAY,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,GAAG,QAAQ,GAAG,IAAI,GAAG,IAAI;IAIpE,SAAS,CAAC,WAAW,CACnB,KAAK,CAAC,EAAE,kBAAkB,EAC1B,OAAO,CAAC,EAAE,MAAM,EAChB,MAAM,CAAC,EAAE,WAAW,GACnB,IAAI;IAeP,iBAAiB,IAAI,IAAI;IAIzB,oBAAoB,CAAC,QAAQ,EAAE,OAAO,GAAG,IAAI;CAG9C"}

package/dist/internal/ripple/ripple.css.d.ts

@@ -0,0 +1,2 @@
+export declare const rippleStyles: import('lit').CSSResult;
+//# sourceMappingURL=ripple.css.d.ts.map

package/dist/internal/ripple/ripple.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ripple.css.d.ts","sourceRoot":"","sources":["../../../src/internal/ripple/ripple.css.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,YAAY,yBAuExB,CAAC"}

package/dist/internal/ripple/ripple.d.ts

@@ -0,0 +1,26 @@
+import { MdBaseElement } from '../base-component.js';
+export declare class MdRipple extends MdBaseElement {
+    static styles: import('lit').CSSResultGroup[];
+    unbounded: boolean;
+    disabled: boolean;
+    private isHovered;
+    private isFocused;
+    private ripples;
+    private control;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private setupControl;
+    private cleanupControl;
+    private handlePointerEnter;
+    private handlePointerLeave;
+    private handleFocusIn;
+    private handleFocusOut;
+    private handlePointerDown;
+    render(): import('lit-html').TemplateResult<1>;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'md-ripple': MdRipple;
+    }
+}
+//# sourceMappingURL=ripple.d.ts.map

package/dist/internal/ripple/ripple.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ripple.d.ts","sourceRoot":"","sources":["../../../src/internal/ripple/ripple.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AAGrD,qBACa,QAAS,SAAQ,aAAa;IACzC,OAAgB,MAAM,iCAAwC;IAG9D,SAAS,UAAS;IAGlB,QAAQ,UAAS;IAGjB,OAAO,CAAC,SAAS,CAAS;IAG1B,OAAO,CAAC,SAAS,CAAS;IAE1B,OAAO,CAAC,OAAO,CAAqB;IACpC,OAAO,CAAC,OAAO,CAA4B;IAElC,iBAAiB,IAAI,IAAI;IAKzB,oBAAoB,IAAI,IAAI;IAKrC,OAAO,CAAC,YAAY;IAYpB,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,kBAAkB,CAGxB;IAEF,OAAO,CAAC,kBAAkB,CAExB;IAEF,OAAO,CAAC,aAAa,CAGnB;IAEF,OAAO,CAAC,cAAc,CAEpB;IAEF,OAAO,CAAC,iBAAiB,CAmCvB;IAEO,MAAM;CAOhB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,QAAQ,CAAC;KACvB;CACF"}

package/dist/internal/ripple/ripple.js

@@ -0,0 +1,144 @@
+import { css as f, html as m } from "lit";
+import { property as p, state as h, customElement as y } from "lit/decorators.js";
+import { M as u } from "../../chunks/base-component-DQTjlEVL.js";
+const b = f`
+  :host {
+    display: inline-flex;
+    position: absolute;
+    inset: 0;
+    overflow: hidden;
+    border-radius: inherit;
+    pointer-events: none;
+    -webkit-tap-highlight-color: transparent;
+  }
+
+  :host([unbounded]) {
+    overflow: visible;
+  }
+
+  :host([disabled]) {
+    opacity: 0;
+  }
+
+  .surface {
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    background-color: currentColor;
+    opacity: 0;
+    transition: opacity 150ms linear;
+  }
+
+  :host(:hover) .surface,
+  .surface.hovered {
+    opacity: var(--md-sys-state-hover-opacity, 0.08);
+  }
+
+  :host(:focus-visible) .surface,
+  .surface.focused {
+    opacity: var(--md-sys-state-focus-opacity, 0.12);
+  }
+
+  .ripple {
+    position: absolute;
+    border-radius: 50%;
+    background-color: currentColor;
+    opacity: var(--md-sys-state-pressed-opacity, 0.12);
+    transform: scale(0);
+    pointer-events: none;
+    animation: md-ripple-expand 350ms cubic-bezier(0.2, 0, 0, 1) forwards;
+  }
+
+  .ripple.fading {
+    animation: md-ripple-fade-out 250ms linear forwards;
+  }
+
+  @keyframes md-ripple-expand {
+    from {
+      transform: scale(0);
+      opacity: var(--md-sys-state-pressed-opacity, 0.12);
+    }
+    to {
+      transform: scale(2.5);
+      opacity: var(--md-sys-state-pressed-opacity, 0.12);
+    }
+  }
+
+  @keyframes md-ripple-fade-out {
+    from {
+      opacity: var(--md-sys-state-pressed-opacity, 0.12);
+    }
+    to {
+      opacity: 0;
+    }
+  }
+`;
+var w = Object.defineProperty, E = Object.getOwnPropertyDescriptor, l = (n, t, o, i) => {
+  for (var s = i > 1 ? void 0 : i ? E(t, o) : t, a = n.length - 1, e; a >= 0; a--)
+    (e = n[a]) && (s = (i ? e(t, o, s) : e(s)) || s);
+  return i && s && w(t, o, s), s;
+};
+let r = class extends u {
+  constructor() {
+    super(...arguments), this.unbounded = !1, this.disabled = !1, this.isHovered = !1, this.isFocused = !1, this.ripples = [], this.control = null, this.handlePointerEnter = () => {
+      this.disabled || (this.isHovered = !0);
+    }, this.handlePointerLeave = () => {
+      this.isHovered = !1;
+    }, this.handleFocusIn = () => {
+      this.disabled || (this.isFocused = !0);
+    }, this.handleFocusOut = () => {
+      this.isFocused = !1;
+    }, this.handlePointerDown = (n) => {
+      if (this.disabled || n.button !== 0) return;
+      const t = this.getBoundingClientRect(), o = Math.max(t.width, t.height), i = o / 2, s = this.unbounded ? t.width / 2 : n.clientX - t.left, a = this.unbounded ? t.height / 2 : n.clientY - t.top, e = document.createElement("div");
+      e.className = "ripple", e.style.width = `${o}px`, e.style.height = `${o}px`, e.style.left = `${s - i}px`, e.style.top = `${a - i}px`;
+      const c = this.shadowRoot?.querySelector(".surface-container");
+      c && (c.appendChild(e), this.ripples.push(e));
+      const d = () => {
+        e.classList.add("fading"), setTimeout(() => {
+          e.remove(), this.ripples = this.ripples.filter((v) => v !== e);
+        }, 250), window.removeEventListener("pointerup", d), window.removeEventListener("pointercancel", d);
+      };
+      window.addEventListener("pointerup", d), window.addEventListener("pointercancel", d);
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.setupControl();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this.cleanupControl();
+  }
+  setupControl() {
+    this.control = this.parentElement || this.getRootNode()?.host, this.control && (this.control.addEventListener("pointerenter", this.handlePointerEnter), this.control.addEventListener("pointerleave", this.handlePointerLeave), this.control.addEventListener("pointerdown", this.handlePointerDown), this.control.addEventListener("focusin", this.handleFocusIn), this.control.addEventListener("focusout", this.handleFocusOut));
+  }
+  cleanupControl() {
+    this.control && (this.control.removeEventListener("pointerenter", this.handlePointerEnter), this.control.removeEventListener("pointerleave", this.handlePointerLeave), this.control.removeEventListener("pointerdown", this.handlePointerDown), this.control.removeEventListener("focusin", this.handleFocusIn), this.control.removeEventListener("focusout", this.handleFocusOut));
+  }
+  render() {
+    return m`
+      <div class="surface-container">
+        <div class="surface ${this.isHovered ? "hovered" : ""} ${this.isFocused ? "focused" : ""}"></div>
+      </div>
+    `;
+  }
+};
+r.styles = [u.styles, b];
+l([
+  p({ type: Boolean, reflect: !0 })
+], r.prototype, "unbounded", 2);
+l([
+  p({ type: Boolean, reflect: !0 })
+], r.prototype, "disabled", 2);
+l([
+  h()
+], r.prototype, "isHovered", 2);
+l([
+  h()
+], r.prototype, "isFocused", 2);
+r = l([
+  y("md-ripple")
+], r);
+export {
+  r as MdRipple
+};
+//# sourceMappingURL=ripple.js.map

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

@@ -0,0 +1 @@
+{"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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"}

package/dist/tokens/colors.d.ts

@@ -0,0 +1,42 @@
+export interface M3ColorScheme {
+    primary: string;
+    onPrimary: string;
+    primaryContainer: string;
+    onPrimaryContainer: string;
+    secondary: string;
+    onSecondary: string;
+    secondaryContainer: string;
+    onSecondaryContainer: string;
+    tertiary: string;
+    onTertiary: string;
+    tertiaryContainer: string;
+    onTertiaryContainer: string;
+    error: string;
+    onError: string;
+    errorContainer: string;
+    onErrorContainer: string;
+    background: string;
+    onBackground: string;
+    surface: string;
+    onSurface: string;
+    surfaceVariant: string;
+    onSurfaceVariant: string;
+    outline: string;
+    outlineVariant: string;
+    shadow: string;
+    scrim: string;
+    inverseSurface: string;
+    inverseOnSurface: string;
+    inversePrimary: string;
+    surfaceDim: string;
+    surfaceBright: string;
+    surfaceContainerLowest: string;
+    surfaceContainerLow: string;
+    surfaceContainer: string;
+    surfaceContainerHigh: string;
+    surfaceContainerHighest: string;
+}
+export declare const lightColorScheme: M3ColorScheme;
+export declare const darkColorScheme: M3ColorScheme;
+export declare function colorSchemeToCssVariables(scheme: Partial<M3ColorScheme>): Record<string, string>;
+//# sourceMappingURL=colors.d.ts.map

package/dist/tokens/colors.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"colors.d.ts","sourceRoot":"","sources":["../../src/tokens/colors.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,aAAa;IAC5B,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAC7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,MAAM,CAAC;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAED,eAAO,MAAM,gBAAgB,EAAE,aAqC9B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,aAqC7B,CAAC;AAEF,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,OAAO,CAAC,aAAa,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAOhG"}

package/dist/tokens/elevation.d.ts

@@ -0,0 +1,9 @@
+export declare const elevationTokens: {
+    level0: string;
+    level1: string;
+    level2: string;
+    level3: string;
+    level4: string;
+    level5: string;
+};
+//# sourceMappingURL=elevation.d.ts.map

package/dist/tokens/elevation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"elevation.d.ts","sourceRoot":"","sources":["../../src/tokens/elevation.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe;;;;;;;CAO3B,CAAC"}

package/dist/tokens/index.d.ts

@@ -0,0 +1,7 @@
+export * from './colors.js';
+export * from './typography.js';
+export * from './elevation.js';
+export * from './shape.js';
+export * from './motion.js';
+export * from './theme.css.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/tokens/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/tokens/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,aAAa,CAAC;AAC5B,cAAc,gBAAgB,CAAC"}

package/dist/tokens/index.js

@@ -0,0 +1,13 @@
+import { a, c as o, d as l, e as h, l as m, m as r, s as t, t as n, b as p } from "../chunks/theme.css-DV3DRha-.js";
+export {
+  a as applyTheme,
+  o as colorSchemeToCssVariables,
+  l as darkColorScheme,
+  h as elevationTokens,
+  m as lightColorScheme,
+  r as motionTokens,
+  t as shapeTokens,
+  n as themeStyles,
+  p as typographyTokens
+};
+//# sourceMappingURL=index.js.map

package/dist/tokens/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/tokens/motion.d.ts

@@ -0,0 +1,21 @@
+export declare const motionTokens: {
+    easingStandard: string;
+    easingStandardDecelerate: string;
+    easingStandardAccelerate: string;
+    easingEmphasized: string;
+    easingEmphasizedDecelerate: string;
+    easingEmphasizedAccelerate: string;
+    durationShort1: string;
+    durationShort2: string;
+    durationShort3: string;
+    durationShort4: string;
+    durationMedium1: string;
+    durationMedium2: string;
+    durationMedium3: string;
+    durationMedium4: string;
+    durationLong1: string;
+    durationLong2: string;
+    durationLong3: string;
+    durationLong4: string;
+};
+//# sourceMappingURL=motion.d.ts.map

package/dist/tokens/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/tokens/motion.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;CAoBxB,CAAC"}

package/dist/tokens/shape.d.ts

@@ -0,0 +1,10 @@
+export declare const shapeTokens: {
+    cornerNone: string;
+    cornerExtraSmall: string;
+    cornerSmall: string;
+    cornerMedium: string;
+    cornerLarge: string;
+    cornerExtraLarge: string;
+    cornerFull: string;
+};
+//# sourceMappingURL=shape.d.ts.map

package/dist/tokens/shape.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shape.d.ts","sourceRoot":"","sources":["../../src/tokens/shape.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,WAAW;;;;;;;;CAQvB,CAAC"}

package/dist/tokens/theme.css.d.ts

@@ -0,0 +1,4 @@
+import { M3ColorScheme } from './colors.js';
+export declare const themeStyles: import('lit').CSSResult;
+export declare function applyTheme(theme: Partial<M3ColorScheme>, target?: HTMLElement): void;
+//# sourceMappingURL=theme.css.d.ts.map

package/dist/tokens/theme.css.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.css.d.ts","sourceRoot":"","sources":["../../src/tokens/theme.css.ts"],"names":[],"mappings":"AACA,OAAO,EAAqC,aAAa,EAAE,MAAM,aAAa,CAAC;AAM/E,eAAO,MAAM,WAAW,yBA4GvB,CAAC;AAEF,wBAAgB,UAAU,CACxB,KAAK,EAAE,OAAO,CAAC,aAAa,CAAC,EAC7B,MAAM,GAAE,WAAsC,GAC7C,IAAI,CAON"}