610 lines
53 KiB
JavaScript
610 lines
53 KiB
JavaScript
import { jsx as y } from "react/jsx-runtime";
|
|
import $, { forwardRef as R } from "react";
|
|
import { o as z } from "./create-component-CVXl33PD.mjs";
|
|
import { a as b, e as S, i as k, t as c, T as u, E as n, r as I, _ as o, n as a, x as f, c as _, b as A } from "./class-map-CwiboTfb.mjs";
|
|
import { m as M, o as B } from "./outlined-field-CsypDRr3.mjs";
|
|
import { u as D, i as m } from "./static-DdXEOlS4.mjs";
|
|
import { r as h, a as O } from "./animation-DjClVFum.mjs";
|
|
import { o as E } from "./query-assigned-elements-DUhez03i.mjs";
|
|
import { o as w } from "./style-map-CdUj7GnE.mjs";
|
|
import { m as q } from "./delegate-BXi1gVeU.mjs";
|
|
import { r as N } from "./redispatch-event-taWUbWUt.mjs";
|
|
import { V, m as U, c as P, g as j } from "./validator-DZt1_yHv.mjs";
|
|
import { m as Y } from "./element-internals-3IY9gE4L.mjs";
|
|
import { m as H, g as G } from "./form-associated-CyYeHPMb.mjs";
|
|
/**
|
|
* @license
|
|
* Copyright 2024 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
const J = b`:host{--_active-indicator-color: var(--md-filled-text-field-active-indicator-color, var(--md-sys-color-on-surface-variant, #49454f));--_active-indicator-height: var(--md-filled-text-field-active-indicator-height, 1px);--_caret-color: var(--md-filled-text-field-caret-color, var(--md-sys-color-primary, #6750a4));--_container-color: var(--md-filled-text-field-container-color, var(--md-sys-color-surface-container-highest, #e6e0e9));--_disabled-active-indicator-color: var(--md-filled-text-field-disabled-active-indicator-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-active-indicator-height: var(--md-filled-text-field-disabled-active-indicator-height, 1px);--_disabled-active-indicator-opacity: var(--md-filled-text-field-disabled-active-indicator-opacity, 0.38);--_disabled-container-color: var(--md-filled-text-field-disabled-container-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-container-opacity: var(--md-filled-text-field-disabled-container-opacity, 0.04);--_disabled-input-text-color: var(--md-filled-text-field-disabled-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-input-text-opacity: var(--md-filled-text-field-disabled-input-text-opacity, 0.38);--_disabled-label-text-color: var(--md-filled-text-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-filled-text-field-disabled-label-text-opacity, 0.38);--_disabled-leading-icon-color: var(--md-filled-text-field-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-filled-text-field-disabled-leading-icon-opacity, 0.38);--_disabled-supporting-text-color: var(--md-filled-text-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-filled-text-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-icon-color: var(--md-filled-text-field-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-filled-text-field-disabled-trailing-icon-opacity, 0.38);--_error-active-indicator-color: var(--md-filled-text-field-error-active-indicator-color, var(--md-sys-color-error, #b3261e));--_error-focus-active-indicator-color: var(--md-filled-text-field-error-focus-active-indicator-color, var(--md-sys-color-error, #b3261e));--_error-focus-caret-color: var(--md-filled-text-field-error-focus-caret-color, var(--md-sys-color-error, #b3261e));--_error-focus-input-text-color: var(--md-filled-text-field-error-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-filled-text-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-icon-color: var(--md-filled-text-field-error-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-supporting-text-color: var(--md-filled-text-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-icon-color: var(--md-filled-text-field-error-focus-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_error-hover-active-indicator-color: var(--md-filled-text-field-error-hover-active-indicator-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-input-text-color: var(--md-filled-text-field-error-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-filled-text-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-icon-color: var(--md-filled-text-field-error-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-state-layer-color: var(--md-filled-text-field-error-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-state-layer-opacity: var(--md-filled-text-field-error-hover-state-layer-opacity, 0.08);--_error-hover-supporting-text-color: var(--md-filled-text-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-icon-color: var(--md-filled-text-field-error-hover-trailing-icon-color, var(--md-sys-color-on-error-container, #410e0b));--_error-input-text-color: var(--md-filled-text-field-error-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-label-text-color: var(--md-filled-text-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-icon-color: var(--md-filled-text-field-error-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-supporting-text-color: var(--md-filled-text-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-icon-color: var(--md-filled-text-field-error-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_focus-active-indicator-color: var(--md-filled-text-field-focus-active-indicator-color, var(--md-sys-color-primary, #6750a4));--_focus-active-indicator-height: var(--md-filled-text-field-focus-active-indicator-height, 3px);--_focus-input-text-color: var(--md-filled-text-field-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-filled-text-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-filled-text-field-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-supporting-text-color: var(--md-filled-text-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-icon-color: var(--md-filled-text-field-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-active-indicator-color: var(--md-filled-text-field-hover-active-indicator-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-active-indicator-height: var(--md-filled-text-field-hover-active-indicator-height, 1px);--_hover-input-text-color: var(--md-filled-text-field-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-filled-text-field-hover-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-leading-icon-color: var(--md-filled-text-field-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-state-layer-color: var(--md-filled-text-field-hover-state-layer-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-state-layer-opacity: var(--md-filled-text-field-hover-state-layer-opacity, 0.08);--_hover-supporting-text-color: var(--md-filled-text-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-filled-text-field-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-color: var(--md-filled-text-field-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_input-text-font: var(--md-filled-text-field-input-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_input-text-line-height: var(--md-filled-text-field-input-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_input-text-placeholder-color: var(--md-filled-text-field-input-text-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-prefix-color: var(--md-filled-text-field-input-text-prefix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-size: var(--md-filled-text-field-input-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_input-text-suffix-color: var(--md-filled-text-field-input-text-suffix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-weight: var(--md-filled-text-field-input-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_label-text-color: var(--md-filled-text-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-filled-text-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-filled-text-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-populated-line-height: var(--md-filled-text-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-filled-text-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-filled-text-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-filled-text-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-icon-color: var(--md-filled-text-field-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-icon-size: var(--md-filled-text-field-leading-icon-size, 24px);--_supporting-text-color: var(--md-filled-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-filled-text-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-filled-text-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-filled-text-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-weight: var(--md-filled-text-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_trailing-icon-color: var(--md-filled-text-field-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-size: var(--md-filled-text-field-trailing-icon-size, 24px);--_container-shape-start-start: var(--md-filled-text-field-container-shape-start-start, var(--md-filled-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-filled-text-field-container-shape-start-end, var(--md-filled-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-filled-text-field-container-shape-end-end, var(--md-filled-text-field-container-shape, var(--md-sys-shape-corner-none, 0px)));--_container-shape-end-start: var(--md-filled-text-field-container-shape-end-start, var(--md-filled-text-field-container-shape, var(--md-sys-shape-corner-none, 0px)));--_icon-input-space: var(--md-filled-text-field-icon-input-space, 16px);--_leading-space: var(--md-filled-text-field-leading-space, 16px);--_trailing-space: var(--md-filled-text-field-trailing-space, 16px);--_top-space: var(--md-filled-text-field-top-space, 16px);--_bottom-space: var(--md-filled-text-field-bottom-space, 16px);--_input-text-prefix-trailing-space: var(--md-filled-text-field-input-text-prefix-trailing-space, 2px);--_input-text-suffix-leading-space: var(--md-filled-text-field-input-text-suffix-leading-space, 2px);--_with-label-top-space: var(--md-filled-text-field-with-label-top-space, 8px);--_with-label-bottom-space: var(--md-filled-text-field-with-label-bottom-space, 8px);--_focus-caret-color: var(--md-filled-text-field-focus-caret-color, var(--md-sys-color-primary, #6750a4));--_with-leading-icon-leading-space: var(--md-filled-text-field-with-leading-icon-leading-space, 12px);--_with-trailing-icon-trailing-space: var(--md-filled-text-field-with-trailing-icon-trailing-space, 12px);--md-filled-field-active-indicator-color: var(--_active-indicator-color);--md-filled-field-active-indicator-height: var(--_active-indicator-height);--md-filled-field-bottom-space: var(--_bottom-space);--md-filled-field-container-color: var(--_container-color);--md-filled-field-container-shape-end-end: var(--_container-shape-end-end);--md-filled-field-container-shape-end-start: var(--_container-shape-end-start);--md-filled-field-container-shape-start-end: var(--_container-shape-start-end);--md-filled-field-container-shape-start-start: var(--_container-shape-start-start);--md-filled-field-content-color: var(--_input-text-color);--md-filled-field-content-font: var(--_input-text-font);--md-filled-field-content-line-height: var(--_input-text-line-height);--md-filled-field-content-size: var(--_input-text-size);--md-filled-field-content-space: var(--_icon-input-space);--md-filled-field-content-weight: var(--_input-text-weight);--md-filled-field-disabled-active-indicator-color: var(--_disabled-active-indicator-color);--md-filled-field-disabled-active-indicator-height: var(--_disabled-active-indicator-height);--md-filled-field-disabled-active-indicator-opacity: var(--_disabled-active-indicator-opacity);--md-filled-field-disabled-container-color: var(--_disabled-container-color);--md-filled-field-disabled-container-opacity: var(--_disabled-container-opacity);--md-filled-field-disabled-content-color: var(--_disabled-input-text-color);--md-filled-field-disabled-content-opacity: var(--_disabled-input-text-opacity);--md-filled-field-disabled-label-text-color: var(--_disabled-label-text-color);--md-filled-field-disabled-label-text-opacity: var(--_disabled-label-text-opacity);--md-filled-field-disabled-leading-content-color: var(--_disabled-leading-icon-color);--md-filled-field-disabled-leading-content-opacity: var(--_disabled-leading-icon-opacity);--md-filled-field-disabled-supporting-text-color: var(--_disabled-supporting-text-color);--md-filled-field-disabled-supporting-text-opacity: var(--_disabled-supporting-text-opacity);--md-filled-field-disabled-trailing-content-color: var(--_disabled-trailing-icon-color);--md-filled-field-disabled-trailing-content-opacity: var(--_disabled-trailing-icon-opacity);--md-filled-field-error-active-indicator-color: var(--_error-active-indicator-color);--md-filled-field-error-content-color: var(--_error-input-text-color);--md-filled-field-error-focus-active-indicator-color: var(--_error-focus-active-indicator-color);--md-filled-field-error-focus-content-color: var(--_error-focus-input-text-color);--md-filled-field-error-focus-label-text-color: var(--_error-focus-label-text-color);--md-filled-field-error-focus-leading-content-color: var(--_error-focus-leading-icon-color);--md-filled-field-error-focus-supporting-text-color: var(--_error-focus-supporting-text-color);--md-filled-field-error-focus-trailing-content-color: var(--_error-focus-trailing-icon-color);--md-filled-field-error-hover-active-indicator-color: var(--_error-hover-active-indicator-color);--md-filled-field-error-hover-content-color: var(--_error-hover-input-text-color);--md-filled-field-error-hover-label-text-color: var(--_error-hover-label-text-color);--md-filled-field-error-hover-leading-content-color: var(--_error-hover-leading-icon-color);--md-filled-field-error-hover-state-layer-color: var(--_error-hover-state-layer-color);--md-filled-field-error-hover-state-layer-opacity: var(--_error-hover-state-layer-opacity);--md-filled-field-error-hover-supporting-text-color: var(--_error-hover-supporting-text-color);--md-filled-field-error-hover-trailing-content-color: var(--_error-hover-trailing-icon-color);--md-filled-field-error-label-text-color: var(--_error-label-text-color);--md-filled-field-error-leading-content-color: var(--_error-leading-icon-color);--md-filled-field-error-supporting-text-color: var(--_error-supporting-text-color);--md-filled-field-error-trailing-content-color: var(--_error-trailing-icon-color);--md-filled-field-focus-active-indicator-color: var(--_focus-active-indicator-color);--md-filled-field-focus-active-indicator-height: var(--_focus-active-indicator-height);--md-filled-field-focus-content-color: var(--_focus-input-text-color);--md-filled-field-focus-label-text-color: var(--_focus-label-text-color);--md-filled-field-focus-leading-content-color: var(--_focus-leading-icon-color);--md-filled-field-focus-supporting-text-color: var(--_focus-supporting-text-color);--md-filled-field-focus-trailing-content-color: var(--_focus-trailing-icon-color);--md-filled-field-hover-active-indicator-color: var(--_hover-active-indicator-color);--md-filled-field-hover-active-indicator-height: var(--_hover-active-indicator-height);--md-filled-field-hover-content-color: var(--_hover-input-text-color);--md-filled-field-hover-label-text-color: var(--_hover-label-text-color);--md-filled-field-hover-leading-content-color: var(--_hover-leading-icon-color);--md-filled-field-hover-state-layer-color: var(--_hover-state-layer-color);--md-filled-field-hover-state-layer-opacity: var(--_hover-state-layer-opacity);--md-filled-field-hover-supporting-text-color: var(--_hover-supporting-text-color);--md-filled-field-hover-trailing-content-color: var(--_hover-trailing-icon-color);--md-filled-field-label-text-color: var(--_label-text-color);--md-filled-field-label-text-font: var(--_label-text-font);--md-filled-field-label-text-line-height: var(--_label-text-line-height);--md-filled-field-label-text-populated-line-height: var(--_label-text-populated-line-height);--md-filled-field-label-text-populated-size: var(--_label-text-populated-size);--md-filled-field-label-text-size: var(--_label-text-size);--md-filled-field-label-text-weight: var(--_label-text-weight);--md-filled-field-leading-content-color: var(--_leading-icon-color);--md-filled-field-leading-space: var(--_leading-space);--md-filled-field-supporting-text-color: var(--_supporting-text-color);--md-filled-field-supporting-text-font: var(--_supporting-text-font);--md-filled-field-supporting-text-line-height: var(--_supporting-text-line-height);--md-filled-field-supporting-text-size: var(--_supporting-text-size);--md-filled-field-supporting-text-weight: var(--_supporting-text-weight);--md-filled-field-top-space: var(--_top-space);--md-filled-field-trailing-content-color: var(--_trailing-icon-color);--md-filled-field-trailing-space: var(--_trailing-space);--md-filled-field-with-label-bottom-space: var(--_with-label-bottom-space);--md-filled-field-with-label-top-space: var(--_with-label-top-space);--md-filled-field-with-leading-content-leading-space: var(--_with-leading-icon-leading-space);--md-filled-field-with-trailing-content-trailing-space: var(--_with-trailing-icon-trailing-space)}
|
|
`;
|
|
/**
|
|
* @license
|
|
* Copyright 2020 Google LLC
|
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
*/
|
|
const K = (l) => l.strings === void 0, Q = {}, W = (l, e = Q) => l._$AH = e;
|
|
/**
|
|
* @license
|
|
* Copyright 2020 Google LLC
|
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
*/
|
|
const T = S(class extends k {
|
|
constructor(l) {
|
|
if (super(l), l.type !== c.PROPERTY && l.type !== c.ATTRIBUTE && l.type !== c.BOOLEAN_ATTRIBUTE) throw Error("The `live` directive is not allowed on child or event bindings");
|
|
if (!K(l)) throw Error("`live` bindings can only contain a single expression");
|
|
}
|
|
render(l) {
|
|
return l;
|
|
}
|
|
update(l, [e]) {
|
|
if (e === u || e === n) return e;
|
|
const t = l.element, r = l.name;
|
|
if (l.type === c.PROPERTY) {
|
|
if (e === t[r]) return u;
|
|
} else if (l.type === c.BOOLEAN_ATTRIBUTE) {
|
|
if (!!e === t.hasAttribute(r)) return u;
|
|
} else if (l.type === c.ATTRIBUTE && t.getAttribute(r) === e + "") return u;
|
|
return W(l), e;
|
|
}
|
|
});
|
|
/**
|
|
* @license
|
|
* Copyright 2022 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
const X = {
|
|
fromAttribute(l) {
|
|
return l ?? "";
|
|
},
|
|
toAttribute(l) {
|
|
return l || null;
|
|
}
|
|
};
|
|
/**
|
|
* @license
|
|
* Copyright 2023 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
class Z extends V {
|
|
computeValidity({ state: e, renderedControl: t }) {
|
|
let r = t;
|
|
p(e) && !r ? (r = this.inputControl || document.createElement("input"), this.inputControl = r) : r || (r = this.textAreaControl || document.createElement("textarea"), this.textAreaControl = r);
|
|
const d = p(e) ? r : null;
|
|
if (d && (d.type = e.type), r.value !== e.value && (r.value = e.value), r.required = e.required, d) {
|
|
const s = e;
|
|
s.pattern ? d.pattern = s.pattern : d.removeAttribute("pattern"), s.min ? d.min = s.min : d.removeAttribute("min"), s.max ? d.max = s.max : d.removeAttribute("max"), s.step ? d.step = s.step : d.removeAttribute("step");
|
|
}
|
|
return (e.minLength ?? -1) > -1 ? r.setAttribute("minlength", String(e.minLength)) : r.removeAttribute("minlength"), (e.maxLength ?? -1) > -1 ? r.setAttribute("maxlength", String(e.maxLength)) : r.removeAttribute("maxlength"), {
|
|
validity: r.validity,
|
|
validationMessage: r.validationMessage
|
|
};
|
|
}
|
|
equals({ state: e }, { state: t }) {
|
|
const r = e.type === t.type && e.value === t.value && e.required === t.required && e.minLength === t.minLength && e.maxLength === t.maxLength;
|
|
return !p(e) || !p(t) ? r : r && e.pattern === t.pattern && e.min === t.min && e.max === t.max && e.step === t.step;
|
|
}
|
|
copy({ state: e }) {
|
|
return {
|
|
state: p(e) ? this.copyInput(e) : this.copyTextArea(e),
|
|
renderedControl: null
|
|
};
|
|
}
|
|
copyInput(e) {
|
|
const { type: t, pattern: r, min: d, max: s, step: g } = e;
|
|
return {
|
|
...this.copySharedState(e),
|
|
type: t,
|
|
pattern: r,
|
|
min: d,
|
|
max: s,
|
|
step: g
|
|
};
|
|
}
|
|
copyTextArea(e) {
|
|
return {
|
|
...this.copySharedState(e),
|
|
type: e.type
|
|
};
|
|
}
|
|
copySharedState({ value: e, required: t, minLength: r, maxLength: d }) {
|
|
return { value: e, required: t, minLength: r, maxLength: d };
|
|
}
|
|
}
|
|
function p(l) {
|
|
return l.type !== "textarea";
|
|
}
|
|
/**
|
|
* @license
|
|
* Copyright 2021 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
const ee = q(M(U(H(Y(I)))));
|
|
let i = class extends ee {
|
|
constructor() {
|
|
super(...arguments), this.error = !1, this.errorText = "", this.label = "", this.noAsterisk = !1, this.required = !1, this.value = "", this.prefixText = "", this.suffixText = "", this.hasLeadingIcon = !1, this.hasTrailingIcon = !1, this.supportingText = "", this.textDirection = "", this.rows = 2, this.cols = 20, this.inputMode = "", this.max = "", this.maxLength = -1, this.min = "", this.minLength = -1, this.noSpinner = !1, this.pattern = "", this.placeholder = "", this.readOnly = !1, this.multiple = !1, this.step = "", this.type = "text", this.autocomplete = "", this.dirty = !1, this.focused = !1, this.nativeError = !1, this.nativeErrorText = "";
|
|
}
|
|
/**
|
|
* Gets or sets the direction in which selection occurred.
|
|
*/
|
|
get selectionDirection() {
|
|
return this.getInputOrTextarea().selectionDirection;
|
|
}
|
|
set selectionDirection(e) {
|
|
this.getInputOrTextarea().selectionDirection = e;
|
|
}
|
|
/**
|
|
* Gets or sets the end position or offset of a text selection.
|
|
*/
|
|
get selectionEnd() {
|
|
return this.getInputOrTextarea().selectionEnd;
|
|
}
|
|
set selectionEnd(e) {
|
|
this.getInputOrTextarea().selectionEnd = e;
|
|
}
|
|
/**
|
|
* Gets or sets the starting position or offset of a text selection.
|
|
*/
|
|
get selectionStart() {
|
|
return this.getInputOrTextarea().selectionStart;
|
|
}
|
|
set selectionStart(e) {
|
|
this.getInputOrTextarea().selectionStart = e;
|
|
}
|
|
/**
|
|
* The text field's value as a number.
|
|
*/
|
|
get valueAsNumber() {
|
|
const e = this.getInput();
|
|
return e ? e.valueAsNumber : NaN;
|
|
}
|
|
set valueAsNumber(e) {
|
|
const t = this.getInput();
|
|
t && (t.valueAsNumber = e, this.value = t.value);
|
|
}
|
|
/**
|
|
* The text field's value as a Date.
|
|
*/
|
|
get valueAsDate() {
|
|
const e = this.getInput();
|
|
return e ? e.valueAsDate : null;
|
|
}
|
|
set valueAsDate(e) {
|
|
const t = this.getInput();
|
|
t && (t.valueAsDate = e, this.value = t.value);
|
|
}
|
|
get hasError() {
|
|
return this.error || this.nativeError;
|
|
}
|
|
/**
|
|
* Selects all the text in the text field.
|
|
*
|
|
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/select
|
|
*/
|
|
select() {
|
|
this.getInputOrTextarea().select();
|
|
}
|
|
setRangeText(...e) {
|
|
this.getInputOrTextarea().setRangeText(...e), this.value = this.getInputOrTextarea().value;
|
|
}
|
|
/**
|
|
* Sets the start and end positions of a selection in the text field.
|
|
*
|
|
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/setSelectionRange
|
|
*
|
|
* @param start The offset into the text field for the start of the selection.
|
|
* @param end The offset into the text field for the end of the selection.
|
|
* @param direction The direction in which the selection is performed.
|
|
*/
|
|
setSelectionRange(e, t, r) {
|
|
this.getInputOrTextarea().setSelectionRange(e, t, r);
|
|
}
|
|
/**
|
|
* Decrements the value of a numeric type text field by `step` or `n` `step`
|
|
* number of times.
|
|
*
|
|
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/stepDown
|
|
*
|
|
* @param stepDecrement The number of steps to decrement, defaults to 1.
|
|
*/
|
|
stepDown(e) {
|
|
const t = this.getInput();
|
|
t && (t.stepDown(e), this.value = t.value);
|
|
}
|
|
/**
|
|
* Increments the value of a numeric type text field by `step` or `n` `step`
|
|
* number of times.
|
|
*
|
|
* https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement/stepUp
|
|
*
|
|
* @param stepIncrement The number of steps to increment, defaults to 1.
|
|
*/
|
|
stepUp(e) {
|
|
const t = this.getInput();
|
|
t && (t.stepUp(e), this.value = t.value);
|
|
}
|
|
/**
|
|
* Reset the text field to its default value.
|
|
*/
|
|
reset() {
|
|
this.dirty = !1, this.value = this.getAttribute("value") ?? "", this.nativeError = !1, this.nativeErrorText = "";
|
|
}
|
|
attributeChangedCallback(e, t, r) {
|
|
e === "value" && this.dirty || super.attributeChangedCallback(e, t, r);
|
|
}
|
|
render() {
|
|
const e = {
|
|
disabled: this.disabled,
|
|
error: !this.disabled && this.hasError,
|
|
textarea: this.type === "textarea",
|
|
"no-spinner": this.noSpinner
|
|
};
|
|
return f`
|
|
<span class="text-field ${_(e)}">
|
|
${this.renderField()}
|
|
</span>
|
|
`;
|
|
}
|
|
updated(e) {
|
|
const t = this.getInputOrTextarea().value;
|
|
this.value !== t && (this.value = t);
|
|
}
|
|
renderField() {
|
|
return D`<${this.fieldTag}
|
|
class="field"
|
|
count=${this.value.length}
|
|
?disabled=${this.disabled}
|
|
?error=${this.hasError}
|
|
error-text=${this.getErrorText()}
|
|
?focused=${this.focused}
|
|
?has-end=${this.hasTrailingIcon}
|
|
?has-start=${this.hasLeadingIcon}
|
|
label=${this.label}
|
|
?no-asterisk=${this.noAsterisk}
|
|
max=${this.maxLength}
|
|
?populated=${!!this.value}
|
|
?required=${this.required}
|
|
?resizable=${this.type === "textarea"}
|
|
supporting-text=${this.supportingText}
|
|
>
|
|
${this.renderLeadingIcon()}
|
|
${this.renderInputOrTextarea()}
|
|
${this.renderTrailingIcon()}
|
|
<div id="description" slot="aria-describedby"></div>
|
|
<slot name="container" slot="container"></slot>
|
|
</${this.fieldTag}>`;
|
|
}
|
|
renderLeadingIcon() {
|
|
return f`
|
|
<span class="icon leading" slot="start">
|
|
<slot name="leading-icon" @slotchange=${this.handleIconChange}></slot>
|
|
</span>
|
|
`;
|
|
}
|
|
renderTrailingIcon() {
|
|
return f`
|
|
<span class="icon trailing" slot="end">
|
|
<slot name="trailing-icon" @slotchange=${this.handleIconChange}></slot>
|
|
</span>
|
|
`;
|
|
}
|
|
renderInputOrTextarea() {
|
|
const e = { direction: this.textDirection }, t = this.ariaLabel || this.label || n, r = this.autocomplete, d = (this.maxLength ?? -1) > -1, s = (this.minLength ?? -1) > -1;
|
|
if (this.type === "textarea")
|
|
return f`
|
|
<textarea
|
|
class="input"
|
|
style=${w(e)}
|
|
aria-describedby="description"
|
|
aria-invalid=${this.hasError}
|
|
aria-label=${t}
|
|
autocomplete=${r || n}
|
|
name=${this.name || n}
|
|
?disabled=${this.disabled}
|
|
maxlength=${d ? this.maxLength : n}
|
|
minlength=${s ? this.minLength : n}
|
|
placeholder=${this.placeholder || n}
|
|
?readonly=${this.readOnly}
|
|
?required=${this.required}
|
|
rows=${this.rows}
|
|
cols=${this.cols}
|
|
.value=${T(this.value)}
|
|
@change=${this.redispatchEvent}
|
|
@focus=${this.handleFocusChange}
|
|
@blur=${this.handleFocusChange}
|
|
@input=${this.handleInput}
|
|
@select=${this.redispatchEvent}></textarea>
|
|
`;
|
|
const g = this.renderPrefix(), C = this.renderSuffix(), F = this.inputMode;
|
|
return f`
|
|
<div class="input-wrapper">
|
|
${g}
|
|
<input
|
|
class="input"
|
|
style=${w(e)}
|
|
aria-describedby="description"
|
|
aria-invalid=${this.hasError}
|
|
aria-label=${t}
|
|
autocomplete=${r || n}
|
|
name=${this.name || n}
|
|
?disabled=${this.disabled}
|
|
inputmode=${F || n}
|
|
max=${this.max || n}
|
|
maxlength=${d ? this.maxLength : n}
|
|
min=${this.min || n}
|
|
minlength=${s ? this.minLength : n}
|
|
pattern=${this.pattern || n}
|
|
placeholder=${this.placeholder || n}
|
|
?readonly=${this.readOnly}
|
|
?required=${this.required}
|
|
?multiple=${this.multiple}
|
|
step=${this.step || n}
|
|
type=${this.type}
|
|
.value=${T(this.value)}
|
|
@change=${this.redispatchEvent}
|
|
@focus=${this.handleFocusChange}
|
|
@blur=${this.handleFocusChange}
|
|
@input=${this.handleInput}
|
|
@select=${this.redispatchEvent} />
|
|
${C}
|
|
</div>
|
|
`;
|
|
}
|
|
renderPrefix() {
|
|
return this.renderAffix(
|
|
this.prefixText,
|
|
/* isSuffix */
|
|
!1
|
|
);
|
|
}
|
|
renderSuffix() {
|
|
return this.renderAffix(
|
|
this.suffixText,
|
|
/* isSuffix */
|
|
!0
|
|
);
|
|
}
|
|
renderAffix(e, t) {
|
|
return e ? f`<span class="${_({
|
|
suffix: t,
|
|
prefix: !t
|
|
})}">${e}</span>` : n;
|
|
}
|
|
getErrorText() {
|
|
return this.error ? this.errorText : this.nativeErrorText;
|
|
}
|
|
handleFocusChange() {
|
|
var e;
|
|
this.focused = ((e = this.inputOrTextarea) == null ? void 0 : e.matches(":focus")) ?? !1;
|
|
}
|
|
handleInput(e) {
|
|
this.dirty = !0, this.value = e.target.value;
|
|
}
|
|
redispatchEvent(e) {
|
|
N(this, e);
|
|
}
|
|
getInputOrTextarea() {
|
|
return this.inputOrTextarea || (this.connectedCallback(), this.scheduleUpdate()), this.isUpdatePending && this.scheduleUpdate(), this.inputOrTextarea;
|
|
}
|
|
getInput() {
|
|
return this.type === "textarea" ? null : this.getInputOrTextarea();
|
|
}
|
|
handleIconChange() {
|
|
this.hasLeadingIcon = this.leadingIcons.length > 0, this.hasTrailingIcon = this.trailingIcons.length > 0;
|
|
}
|
|
[G]() {
|
|
return this.value;
|
|
}
|
|
formResetCallback() {
|
|
this.reset();
|
|
}
|
|
formStateRestoreCallback(e) {
|
|
this.value = e;
|
|
}
|
|
focus() {
|
|
this.getInputOrTextarea().focus();
|
|
}
|
|
[P]() {
|
|
return new Z(() => ({
|
|
state: this,
|
|
renderedControl: this.inputOrTextarea
|
|
}));
|
|
}
|
|
[j]() {
|
|
return this.inputOrTextarea;
|
|
}
|
|
[B](e) {
|
|
var r;
|
|
e == null || e.preventDefault();
|
|
const t = this.getErrorText();
|
|
this.nativeError = !!e, this.nativeErrorText = this.validationMessage, t === this.getErrorText() && ((r = this.field) == null || r.reannounceError());
|
|
}
|
|
};
|
|
i.shadowRootOptions = {
|
|
...I.shadowRootOptions,
|
|
delegatesFocus: !0
|
|
};
|
|
o([
|
|
a({ type: Boolean, reflect: !0 })
|
|
], i.prototype, "error", void 0);
|
|
o([
|
|
a({ attribute: "error-text" })
|
|
], i.prototype, "errorText", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "label", void 0);
|
|
o([
|
|
a({ type: Boolean, attribute: "no-asterisk" })
|
|
], i.prototype, "noAsterisk", void 0);
|
|
o([
|
|
a({ type: Boolean, reflect: !0 })
|
|
], i.prototype, "required", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "value", void 0);
|
|
o([
|
|
a({ attribute: "prefix-text" })
|
|
], i.prototype, "prefixText", void 0);
|
|
o([
|
|
a({ attribute: "suffix-text" })
|
|
], i.prototype, "suffixText", void 0);
|
|
o([
|
|
a({ type: Boolean, attribute: "has-leading-icon" })
|
|
], i.prototype, "hasLeadingIcon", void 0);
|
|
o([
|
|
a({ type: Boolean, attribute: "has-trailing-icon" })
|
|
], i.prototype, "hasTrailingIcon", void 0);
|
|
o([
|
|
a({ attribute: "supporting-text" })
|
|
], i.prototype, "supportingText", void 0);
|
|
o([
|
|
a({ attribute: "text-direction" })
|
|
], i.prototype, "textDirection", void 0);
|
|
o([
|
|
a({ type: Number })
|
|
], i.prototype, "rows", void 0);
|
|
o([
|
|
a({ type: Number })
|
|
], i.prototype, "cols", void 0);
|
|
o([
|
|
a({ reflect: !0 })
|
|
], i.prototype, "inputMode", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "max", void 0);
|
|
o([
|
|
a({ type: Number })
|
|
], i.prototype, "maxLength", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "min", void 0);
|
|
o([
|
|
a({ type: Number })
|
|
], i.prototype, "minLength", void 0);
|
|
o([
|
|
a({ type: Boolean, attribute: "no-spinner" })
|
|
], i.prototype, "noSpinner", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "pattern", void 0);
|
|
o([
|
|
a({ reflect: !0, converter: X })
|
|
], i.prototype, "placeholder", void 0);
|
|
o([
|
|
a({ type: Boolean, reflect: !0 })
|
|
], i.prototype, "readOnly", void 0);
|
|
o([
|
|
a({ type: Boolean, reflect: !0 })
|
|
], i.prototype, "multiple", void 0);
|
|
o([
|
|
a()
|
|
], i.prototype, "step", void 0);
|
|
o([
|
|
a({ reflect: !0 })
|
|
], i.prototype, "type", void 0);
|
|
o([
|
|
a({ reflect: !0 })
|
|
], i.prototype, "autocomplete", void 0);
|
|
o([
|
|
h()
|
|
], i.prototype, "dirty", void 0);
|
|
o([
|
|
h()
|
|
], i.prototype, "focused", void 0);
|
|
o([
|
|
h()
|
|
], i.prototype, "nativeError", void 0);
|
|
o([
|
|
h()
|
|
], i.prototype, "nativeErrorText", void 0);
|
|
o([
|
|
O(".input")
|
|
], i.prototype, "inputOrTextarea", void 0);
|
|
o([
|
|
O(".field")
|
|
], i.prototype, "field", void 0);
|
|
o([
|
|
E({ slot: "leading-icon" })
|
|
], i.prototype, "leadingIcons", void 0);
|
|
o([
|
|
E({ slot: "trailing-icon" })
|
|
], i.prototype, "trailingIcons", void 0);
|
|
/**
|
|
* @license
|
|
* Copyright 2021 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
class te extends i {
|
|
constructor() {
|
|
super(...arguments), this.fieldTag = m`md-filled-field`;
|
|
}
|
|
}
|
|
/**
|
|
* @license
|
|
* Copyright 2024 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
const L = b`:host{display:inline-flex;outline:none;resize:both;text-align:start;-webkit-tap-highlight-color:rgba(0,0,0,0)}.text-field,.field{width:100%}.text-field{display:inline-flex}.field{cursor:text}.disabled .field{cursor:default}.text-field,.textarea .field{resize:inherit}slot[name=container]{border-radius:inherit}.icon{color:currentColor;display:flex;align-items:center;justify-content:center;fill:currentColor;position:relative}.icon ::slotted(*){display:flex;position:absolute}[has-start] .icon.leading{font-size:var(--_leading-icon-size);height:var(--_leading-icon-size);width:var(--_leading-icon-size)}[has-end] .icon.trailing{font-size:var(--_trailing-icon-size);height:var(--_trailing-icon-size);width:var(--_trailing-icon-size)}.input-wrapper{display:flex}.input-wrapper>*{all:inherit;padding:0}.input{caret-color:var(--_caret-color);overflow-x:hidden;text-align:inherit}.input::placeholder{color:currentColor;opacity:1}.input::-webkit-calendar-picker-indicator{display:none}.input::-webkit-search-decoration,.input::-webkit-search-cancel-button{display:none}@media(forced-colors: active){.input{background:none}}.no-spinner .input::-webkit-inner-spin-button,.no-spinner .input::-webkit-outer-spin-button{display:none}.no-spinner .input[type=number]{-moz-appearance:textfield}:focus-within .input{caret-color:var(--_focus-caret-color)}.error:focus-within .input{caret-color:var(--_error-focus-caret-color)}.text-field:not(.disabled) .prefix{color:var(--_input-text-prefix-color)}.text-field:not(.disabled) .suffix{color:var(--_input-text-suffix-color)}.text-field:not(.disabled) .input::placeholder{color:var(--_input-text-placeholder-color)}.prefix,.suffix{text-wrap:nowrap;width:min-content}.prefix{padding-inline-end:var(--_input-text-prefix-trailing-space)}.suffix{padding-inline-start:var(--_input-text-suffix-leading-space)}
|
|
`;
|
|
/**
|
|
* @license
|
|
* Copyright 2021 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
let v = class extends te {
|
|
constructor() {
|
|
super(...arguments), this.fieldTag = m`md-filled-field`;
|
|
}
|
|
};
|
|
v.styles = [L, J];
|
|
v = o([
|
|
A("md-filled-text-field")
|
|
], v);
|
|
/**
|
|
* @license
|
|
* Copyright 2024 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
const re = b`:host{--_caret-color: var(--md-outlined-text-field-caret-color, var(--md-sys-color-primary, #6750a4));--_disabled-input-text-color: var(--md-outlined-text-field-disabled-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-input-text-opacity: var(--md-outlined-text-field-disabled-input-text-opacity, 0.38);--_disabled-label-text-color: var(--md-outlined-text-field-disabled-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-label-text-opacity: var(--md-outlined-text-field-disabled-label-text-opacity, 0.38);--_disabled-leading-icon-color: var(--md-outlined-text-field-disabled-leading-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-leading-icon-opacity: var(--md-outlined-text-field-disabled-leading-icon-opacity, 0.38);--_disabled-outline-color: var(--md-outlined-text-field-disabled-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-outline-opacity: var(--md-outlined-text-field-disabled-outline-opacity, 0.12);--_disabled-outline-width: var(--md-outlined-text-field-disabled-outline-width, 1px);--_disabled-supporting-text-color: var(--md-outlined-text-field-disabled-supporting-text-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-supporting-text-opacity: var(--md-outlined-text-field-disabled-supporting-text-opacity, 0.38);--_disabled-trailing-icon-color: var(--md-outlined-text-field-disabled-trailing-icon-color, var(--md-sys-color-on-surface, #1d1b20));--_disabled-trailing-icon-opacity: var(--md-outlined-text-field-disabled-trailing-icon-opacity, 0.38);--_error-focus-caret-color: var(--md-outlined-text-field-error-focus-caret-color, var(--md-sys-color-error, #b3261e));--_error-focus-input-text-color: var(--md-outlined-text-field-error-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-focus-label-text-color: var(--md-outlined-text-field-error-focus-label-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-leading-icon-color: var(--md-outlined-text-field-error-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-focus-outline-color: var(--md-outlined-text-field-error-focus-outline-color, var(--md-sys-color-error, #b3261e));--_error-focus-supporting-text-color: var(--md-outlined-text-field-error-focus-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-focus-trailing-icon-color: var(--md-outlined-text-field-error-focus-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_error-hover-input-text-color: var(--md-outlined-text-field-error-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-hover-label-text-color: var(--md-outlined-text-field-error-hover-label-text-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-leading-icon-color: var(--md-outlined-text-field-error-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-hover-outline-color: var(--md-outlined-text-field-error-hover-outline-color, var(--md-sys-color-on-error-container, #410e0b));--_error-hover-supporting-text-color: var(--md-outlined-text-field-error-hover-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-hover-trailing-icon-color: var(--md-outlined-text-field-error-hover-trailing-icon-color, var(--md-sys-color-on-error-container, #410e0b));--_error-input-text-color: var(--md-outlined-text-field-error-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_error-label-text-color: var(--md-outlined-text-field-error-label-text-color, var(--md-sys-color-error, #b3261e));--_error-leading-icon-color: var(--md-outlined-text-field-error-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_error-outline-color: var(--md-outlined-text-field-error-outline-color, var(--md-sys-color-error, #b3261e));--_error-supporting-text-color: var(--md-outlined-text-field-error-supporting-text-color, var(--md-sys-color-error, #b3261e));--_error-trailing-icon-color: var(--md-outlined-text-field-error-trailing-icon-color, var(--md-sys-color-error, #b3261e));--_focus-input-text-color: var(--md-outlined-text-field-focus-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_focus-label-text-color: var(--md-outlined-text-field-focus-label-text-color, var(--md-sys-color-primary, #6750a4));--_focus-leading-icon-color: var(--md-outlined-text-field-focus-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-outline-color: var(--md-outlined-text-field-focus-outline-color, var(--md-sys-color-primary, #6750a4));--_focus-outline-width: var(--md-outlined-text-field-focus-outline-width, 3px);--_focus-supporting-text-color: var(--md-outlined-text-field-focus-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_focus-trailing-icon-color: var(--md-outlined-text-field-focus-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-input-text-color: var(--md-outlined-text-field-hover-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-label-text-color: var(--md-outlined-text-field-hover-label-text-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-leading-icon-color: var(--md-outlined-text-field-hover-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-outline-color: var(--md-outlined-text-field-hover-outline-color, var(--md-sys-color-on-surface, #1d1b20));--_hover-outline-width: var(--md-outlined-text-field-hover-outline-width, 1px);--_hover-supporting-text-color: var(--md-outlined-text-field-hover-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_hover-trailing-icon-color: var(--md-outlined-text-field-hover-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-color: var(--md-outlined-text-field-input-text-color, var(--md-sys-color-on-surface, #1d1b20));--_input-text-font: var(--md-outlined-text-field-input-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_input-text-line-height: var(--md-outlined-text-field-input-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_input-text-placeholder-color: var(--md-outlined-text-field-input-text-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-prefix-color: var(--md-outlined-text-field-input-text-prefix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-size: var(--md-outlined-text-field-input-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_input-text-suffix-color: var(--md-outlined-text-field-input-text-suffix-color, var(--md-sys-color-on-surface-variant, #49454f));--_input-text-weight: var(--md-outlined-text-field-input-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_label-text-color: var(--md-outlined-text-field-label-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_label-text-font: var(--md-outlined-text-field-label-text-font, var(--md-sys-typescale-body-large-font, var(--md-ref-typeface-plain, Roboto)));--_label-text-line-height: var(--md-outlined-text-field-label-text-line-height, var(--md-sys-typescale-body-large-line-height, 1.5rem));--_label-text-populated-line-height: var(--md-outlined-text-field-label-text-populated-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_label-text-populated-size: var(--md-outlined-text-field-label-text-populated-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_label-text-size: var(--md-outlined-text-field-label-text-size, var(--md-sys-typescale-body-large-size, 1rem));--_label-text-weight: var(--md-outlined-text-field-label-text-weight, var(--md-sys-typescale-body-large-weight, var(--md-ref-typeface-weight-regular, 400)));--_leading-icon-color: var(--md-outlined-text-field-leading-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_leading-icon-size: var(--md-outlined-text-field-leading-icon-size, 24px);--_outline-color: var(--md-outlined-text-field-outline-color, var(--md-sys-color-outline, #79747e));--_outline-width: var(--md-outlined-text-field-outline-width, 1px);--_supporting-text-color: var(--md-outlined-text-field-supporting-text-color, var(--md-sys-color-on-surface-variant, #49454f));--_supporting-text-font: var(--md-outlined-text-field-supporting-text-font, var(--md-sys-typescale-body-small-font, var(--md-ref-typeface-plain, Roboto)));--_supporting-text-line-height: var(--md-outlined-text-field-supporting-text-line-height, var(--md-sys-typescale-body-small-line-height, 1rem));--_supporting-text-size: var(--md-outlined-text-field-supporting-text-size, var(--md-sys-typescale-body-small-size, 0.75rem));--_supporting-text-weight: var(--md-outlined-text-field-supporting-text-weight, var(--md-sys-typescale-body-small-weight, var(--md-ref-typeface-weight-regular, 400)));--_trailing-icon-color: var(--md-outlined-text-field-trailing-icon-color, var(--md-sys-color-on-surface-variant, #49454f));--_trailing-icon-size: var(--md-outlined-text-field-trailing-icon-size, 24px);--_container-shape-start-start: var(--md-outlined-text-field-container-shape-start-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-start-end: var(--md-outlined-text-field-container-shape-start-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-end: var(--md-outlined-text-field-container-shape-end-end, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_container-shape-end-start: var(--md-outlined-text-field-container-shape-end-start, var(--md-outlined-text-field-container-shape, var(--md-sys-shape-corner-extra-small, 4px)));--_icon-input-space: var(--md-outlined-text-field-icon-input-space, 16px);--_leading-space: var(--md-outlined-text-field-leading-space, 16px);--_trailing-space: var(--md-outlined-text-field-trailing-space, 16px);--_top-space: var(--md-outlined-text-field-top-space, 16px);--_bottom-space: var(--md-outlined-text-field-bottom-space, 16px);--_input-text-prefix-trailing-space: var(--md-outlined-text-field-input-text-prefix-trailing-space, 2px);--_input-text-suffix-leading-space: var(--md-outlined-text-field-input-text-suffix-leading-space, 2px);--_focus-caret-color: var(--md-outlined-text-field-focus-caret-color, var(--md-sys-color-primary, #6750a4));--_with-leading-icon-leading-space: var(--md-outlined-text-field-with-leading-icon-leading-space, 12px);--_with-trailing-icon-trailing-space: var(--md-outlined-text-field-with-trailing-icon-trailing-space, 12px);--md-outlined-field-bottom-space: var(--_bottom-space);--md-outlined-field-container-shape-end-end: var(--_container-shape-end-end);--md-outlined-field-container-shape-end-start: var(--_container-shape-end-start);--md-outlined-field-container-shape-start-end: var(--_container-shape-start-end);--md-outlined-field-container-shape-start-start: var(--_container-shape-start-start);--md-outlined-field-content-color: var(--_input-text-color);--md-outlined-field-content-font: var(--_input-text-font);--md-outlined-field-content-line-height: var(--_input-text-line-height);--md-outlined-field-content-size: var(--_input-text-size);--md-outlined-field-content-space: var(--_icon-input-space);--md-outlined-field-content-weight: var(--_input-text-weight);--md-outlined-field-disabled-content-color: var(--_disabled-input-text-color);--md-outlined-field-disabled-content-opacity: var(--_disabled-input-text-opacity);--md-outlined-field-disabled-label-text-color: var(--_disabled-label-text-color);--md-outlined-field-disabled-label-text-opacity: var(--_disabled-label-text-opacity);--md-outlined-field-disabled-leading-content-color: var(--_disabled-leading-icon-color);--md-outlined-field-disabled-leading-content-opacity: var(--_disabled-leading-icon-opacity);--md-outlined-field-disabled-outline-color: var(--_disabled-outline-color);--md-outlined-field-disabled-outline-opacity: var(--_disabled-outline-opacity);--md-outlined-field-disabled-outline-width: var(--_disabled-outline-width);--md-outlined-field-disabled-supporting-text-color: var(--_disabled-supporting-text-color);--md-outlined-field-disabled-supporting-text-opacity: var(--_disabled-supporting-text-opacity);--md-outlined-field-disabled-trailing-content-color: var(--_disabled-trailing-icon-color);--md-outlined-field-disabled-trailing-content-opacity: var(--_disabled-trailing-icon-opacity);--md-outlined-field-error-content-color: var(--_error-input-text-color);--md-outlined-field-error-focus-content-color: var(--_error-focus-input-text-color);--md-outlined-field-error-focus-label-text-color: var(--_error-focus-label-text-color);--md-outlined-field-error-focus-leading-content-color: var(--_error-focus-leading-icon-color);--md-outlined-field-error-focus-outline-color: var(--_error-focus-outline-color);--md-outlined-field-error-focus-supporting-text-color: var(--_error-focus-supporting-text-color);--md-outlined-field-error-focus-trailing-content-color: var(--_error-focus-trailing-icon-color);--md-outlined-field-error-hover-content-color: var(--_error-hover-input-text-color);--md-outlined-field-error-hover-label-text-color: var(--_error-hover-label-text-color);--md-outlined-field-error-hover-leading-content-color: var(--_error-hover-leading-icon-color);--md-outlined-field-error-hover-outline-color: var(--_error-hover-outline-color);--md-outlined-field-error-hover-supporting-text-color: var(--_error-hover-supporting-text-color);--md-outlined-field-error-hover-trailing-content-color: var(--_error-hover-trailing-icon-color);--md-outlined-field-error-label-text-color: var(--_error-label-text-color);--md-outlined-field-error-leading-content-color: var(--_error-leading-icon-color);--md-outlined-field-error-outline-color: var(--_error-outline-color);--md-outlined-field-error-supporting-text-color: var(--_error-supporting-text-color);--md-outlined-field-error-trailing-content-color: var(--_error-trailing-icon-color);--md-outlined-field-focus-content-color: var(--_focus-input-text-color);--md-outlined-field-focus-label-text-color: var(--_focus-label-text-color);--md-outlined-field-focus-leading-content-color: var(--_focus-leading-icon-color);--md-outlined-field-focus-outline-color: var(--_focus-outline-color);--md-outlined-field-focus-outline-width: var(--_focus-outline-width);--md-outlined-field-focus-supporting-text-color: var(--_focus-supporting-text-color);--md-outlined-field-focus-trailing-content-color: var(--_focus-trailing-icon-color);--md-outlined-field-hover-content-color: var(--_hover-input-text-color);--md-outlined-field-hover-label-text-color: var(--_hover-label-text-color);--md-outlined-field-hover-leading-content-color: var(--_hover-leading-icon-color);--md-outlined-field-hover-outline-color: var(--_hover-outline-color);--md-outlined-field-hover-outline-width: var(--_hover-outline-width);--md-outlined-field-hover-supporting-text-color: var(--_hover-supporting-text-color);--md-outlined-field-hover-trailing-content-color: var(--_hover-trailing-icon-color);--md-outlined-field-label-text-color: var(--_label-text-color);--md-outlined-field-label-text-font: var(--_label-text-font);--md-outlined-field-label-text-line-height: var(--_label-text-line-height);--md-outlined-field-label-text-populated-line-height: var(--_label-text-populated-line-height);--md-outlined-field-label-text-populated-size: var(--_label-text-populated-size);--md-outlined-field-label-text-size: var(--_label-text-size);--md-outlined-field-label-text-weight: var(--_label-text-weight);--md-outlined-field-leading-content-color: var(--_leading-icon-color);--md-outlined-field-leading-space: var(--_leading-space);--md-outlined-field-outline-color: var(--_outline-color);--md-outlined-field-outline-width: var(--_outline-width);--md-outlined-field-supporting-text-color: var(--_supporting-text-color);--md-outlined-field-supporting-text-font: var(--_supporting-text-font);--md-outlined-field-supporting-text-line-height: var(--_supporting-text-line-height);--md-outlined-field-supporting-text-size: var(--_supporting-text-size);--md-outlined-field-supporting-text-weight: var(--_supporting-text-weight);--md-outlined-field-top-space: var(--_top-space);--md-outlined-field-trailing-content-color: var(--_trailing-icon-color);--md-outlined-field-trailing-space: var(--_trailing-space);--md-outlined-field-with-leading-content-leading-space: var(--_with-leading-icon-leading-space);--md-outlined-field-with-trailing-content-trailing-space: var(--_with-trailing-icon-trailing-space)}
|
|
`;
|
|
/**
|
|
* @license
|
|
* Copyright 2021 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
class ie extends i {
|
|
constructor() {
|
|
super(...arguments), this.fieldTag = m`md-outlined-field`;
|
|
}
|
|
}
|
|
/**
|
|
* @license
|
|
* Copyright 2021 Google LLC
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
let x = class extends ie {
|
|
constructor() {
|
|
super(...arguments), this.fieldTag = m`md-outlined-field`;
|
|
}
|
|
};
|
|
x.styles = [L, re];
|
|
x = o([
|
|
A("md-outlined-text-field")
|
|
], x);
|
|
const oe = z({
|
|
react: $,
|
|
tagName: "md-filled-text-field",
|
|
elementClass: v
|
|
}), le = z({
|
|
react: $,
|
|
tagName: "md-outlined-text-field",
|
|
elementClass: x
|
|
}), Te = R(({
|
|
variant: l = "filled",
|
|
...e
|
|
}, t) => l === "filled" ? /* @__PURE__ */ y(oe, { ...e, ref: t }) : /* @__PURE__ */ y(le, { ...e, ref: t }));
|
|
export {
|
|
Te as TextField
|
|
};
|