@material/web 1.0.0-pre.8 → 1.0.0

package/circularprogress/lib/circular-progress.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"circular-progress.js","sourceRoot":"","sources":["circular-progress.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;;AAEH,OAAO,EAAC,IAAI,EAAE,UAAU,EAAE,OAAO,EAAC,MAAM,KAAK,CAAC;AAC9C,OAAO,EAAC,QAAQ,EAAC,MAAM,mBAAmB,CAAC;AAC3C,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAC;AAGjE;;GAEG;AACH,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAAhD;;QAKE;;WAEG;QACuB,aAAQ,GAAG,CAAC,CAAC;QAEvC;;;WAGG;QACwB,kBAAa,GAAG,KAAK,CAAC;QAEjD;;WAEG;QACiD,cAAS,GAAG,KAAK,CAAC;IAuDxE,CAAC;IArDoB,MAAM;QACvB,MAAM,OAAO,GAAG;YACd,eAAe,EAAE,IAAI,CAAC,aAAa;YACnC,YAAY,EAAE,IAAI,CAAC,SAAS;SAC7B,CAAC;QAEF,iCAAiC;QACjC,MAAM,EAAC,SAAS,EAAC,GAAG,IAAuB,CAAC;QAC5C,OAAO,IAAI,CAAA;;mCAEoB,QAAQ,CAAC,OAAO,CAAC;;sBAE9B,SAAS,IAAI,OAAO;;;yBAGjB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,QAAQ;UAE7D,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,IAAI,CAAC,4BAA4B,EAAE,CAAC,CAAC;YACrC,IAAI,CAAC,0BAA0B,EAAE;;oBAE1C,CAAC;IACnB,CAAC;IAED,sEAAsE;IACtE,yCAAyC;IACjC,0BAA0B;QAChC,MAAM,UAAU,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,QAAQ,CAAC,GAAG,GAAG,CAAC;QAC7C,mEAAmE;QACnE,4EAA4E;QAC5E,MAAM,UAAU,GAAG,GAAG,CAAC;QACvB,OAAO,IAAI,CAAA;0CAC2B,UAAU;6CACP,UAAU,wBAC/C,UAAU;WACP,CAAC;IACV,CAAC;IAED,oEAAoE;IACpE,6EAA6E;IAC7E,uDAAuD;IACvD,qEAAqE;IACrE,yEAAyE;IACjE,4BAA4B;QAClC,OAAO,IAAI,CAAA;;;;;;;;aAQF,CAAC;IACZ,CAAC;CACF;;AAzEC;IACE,yBAAyB,CAAC,EAAI,CAAC,CAAC;AAClC,CAAC,GAAA,CAAA;AAKyB;IAAzB,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;kDAAc;AAMZ;IAA1B,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;uDAAuB;AAKG;IAAnD,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAC,CAAC;mDAAmB","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, LitElement, nothing} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {requestUpdateOnAriaChange} from '../../aria/delegate.js';\nimport {ARIAMixinStrict} from '../../types/aria.js';\n\n/**\n * A circular progress component.\n */\nexport class CircularProgress extends LitElement {\n  static {\n    requestUpdateOnAriaChange(this);\n  }\n\n  /**\n   * Progress to display, a fraction between 0 and 1.\n   */\n  @property({type: Number}) progress = 0;\n\n  /**\n   * Whether or not to display an animated spinner representing indeterminate\n   * progress.\n   */\n  @property({type: Boolean}) indeterminate = false;\n\n  /**\n   * Whether or not to render indeterminate mode using 4 colors instead of one.\n   */\n  @property({type: Boolean, attribute: 'four-color'}) fourColor = false;\n\n  protected override render() {\n    const classes = {\n      'indeterminate': this.indeterminate,\n      'four-color': this.fourColor\n    };\n\n    // Needed for closure conformance\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return html`\n      <div\n        class=\"circular-progress ${classMap(classes)}\"\n        role=\"progressbar\"\n        aria-label=\"${ariaLabel || nothing}\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"1\"\n        aria-valuenow=\"${this.indeterminate ? nothing : this.progress}\">\n        ${\n        this.indeterminate ? this.renderIndeterminateContainer() :\n                             this.renderDeterminateContainer()}\n      </div>\n      <slot></slot>`;\n  }\n\n  // Determinate mode is rendered with an svg so the progress arc can be\n  // easily animated via stroke-dashoffset.\n  private renderDeterminateContainer() {\n    const dashOffset = (1 - this.progress) * 100;\n    // note, dash-array/offset are relative to Setting `pathLength` but\n    // Chrome seems to render this inaccurately and using a large viewbox helps.\n    const pathLength = 100;\n    return html`<svg viewBox=\"0 0 4800 4800\">\n      <circle class=\"track\" pathLength=\"${pathLength}\"></circle>\n      <circle class=\"progress\" pathLength=\"${pathLength}\" stroke-dashoffset=\"${\n        dashOffset}\"></circle>\n    </svg>`;\n  }\n\n  // Indeterminate mode rendered with 2 bordered-divs. The borders are\n  // clipped into half circles by their containers. The divs are then carefully\n  // animated to produce changes to the spinner arc size.\n  // This approach has 4.5x the FPS of rendering via svg on Chrome 111.\n  // See https://lit.dev/playground/#gist=febb773565272f75408ab06a0eb49746.\n  private renderIndeterminateContainer() {\n    return html`\n      <div class=\"spinner\">\n        <div class=\"left\">\n          <div class=\"circle\"></div>\n        </div>\n        <div class=\"right\">\n          <div class=\"circle\"></div>\n        </div>\n      </div>`;\n  }\n}\n"]}

package/controller/form-associated.d.ts

@@ -1,14 +0,0 @@
-/**
- * @license
- * Copyright 2022 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-/**
- * FormAssociatedElement interface
- */
-export interface FormAssociatedElement extends HTMLElement {
-}
-/**
- * Returns true if the element is a form associated custom element (FACE).
- */
-export declare function isFormAssociated(element: FormAssociatedElement): boolean;

package/controller/form-associated.js

@@ -1,12 +0,0 @@
-/**
- * @license
- * Copyright 2022 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-/**
- * Returns true if the element is a form associated custom element (FACE).
- */
-export function isFormAssociated(element) {
-    return element.constructor.formAssociated;
-}
-//# sourceMappingURL=form-associated.js.map

package/controller/form-associated.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"form-associated.js","sourceRoot":"","sources":["form-associated.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAYH;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,OAA8B;IAC7D,OAAQ,OAAO,CAAC,WAA4C,CAAC,cAAc,CAAC;AAC9E,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * FormAssociatedElement interface\n */\nexport interface FormAssociatedElement extends HTMLElement {}\n\ndeclare var FormAssociatedElement: {\n  new (): FormAssociatedElement; prototype: FormAssociatedElement;\n  readonly formAssociated?: boolean;\n};\n\n/**\n * Returns true if the element is a form associated custom element (FACE).\n */\nexport function isFormAssociated(element: FormAssociatedElement) {\n  return (element.constructor as typeof FormAssociatedElement).formAssociated;\n}\n"]}

package/controller/form-controller.d.ts

@@ -1,66 +0,0 @@
-/**
- * @license
- * Copyright 2021 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-import { ReactiveController, ReactiveControllerHost } from 'lit';
-declare global {
-    interface Window {
-        ShadyDOM?: {
-            inUse: boolean;
-        };
-    }
-}
-/**
- * An element that `FormController` may use.
- */
-export interface FormElement extends ReactiveControllerHost, HTMLElement {
-    /**
-     * The `<form>` that this element is associated with.
-     */
-    readonly form: HTMLFormElement | null;
-    /**
-     * The name of the element in the form. This property should reflect to a
-     * `name` attribute.
-     */
-    name: string;
-    /**
-     * Whether or not this element is disabled. If present, this property should
-     * reflect to a `disabled` attribute.
-     */
-    disabled?: boolean;
-    /**
-     * A function that retrieves the current form value for this element.
-     *
-     * @return The current form value, or `null` if there is no value.
-     */
-    [getFormValue](): string | File | FormData | null;
-}
-/**
- * A unique symbol key for `FormController` elements to implement their
- * `getFormValue()` function.
- */
-export declare const getFormValue: unique symbol;
-/**
- * A `ReactiveController` that adds `<form>` support to an element.
- *
- * Elements should also set `static formAssociated = true` which
- * provides platform support for forms. When an element is form associated,
- * it can be activated via clicks on associated label elements. It is the
- * responsibility of the element to process this click and perform any necessary
- * activation tasks, for example focusing and clicking on an internal element.
- *
- */
-export declare class FormController implements ReactiveController {
-    private readonly element;
-    private form?;
-    /**
-     * Creates a new `FormController` for the given element.
-     *
-     * @param element The element to add `<form>` support to.
-     */
-    constructor(element: FormElement);
-    hostConnected(): void;
-    hostDisconnected(): void;
-    private readonly formDataListener;
-}

package/controller/form-controller.js

@@ -1,74 +0,0 @@
-/**
- * @license
- * Copyright 2021 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-import { isFormAssociated } from './form-associated.js';
-import { shimLabelSupport, SUPPORTS_FACE_LABEL } from './shim-label-activation.js';
-/**
- * A unique symbol key for `FormController` elements to implement their
- * `getFormValue()` function.
- */
-export const getFormValue = Symbol('getFormValue');
-/**
- * A `ReactiveController` that adds `<form>` support to an element.
- *
- * Elements should also set `static formAssociated = true` which
- * provides platform support for forms. When an element is form associated,
- * it can be activated via clicks on associated label elements. It is the
- * responsibility of the element to process this click and perform any necessary
- * activation tasks, for example focusing and clicking on an internal element.
- *
- */
-export class FormController {
-    /**
-     * Creates a new `FormController` for the given element.
-     *
-     * @param element The element to add `<form>` support to.
-     */
-    constructor(element) {
-        this.element = element;
-        this.formDataListener = (event) => {
-            if (this.element.disabled) {
-                // Check for truthiness since some elements may not support disabling.
-                return;
-            }
-            const value = this.element[getFormValue]();
-            // If given a `FormData` instance, append all values to the form. This
-            // allows elements to customize what is added beyond a single name/value
-            // pair.
-            if (value instanceof FormData) {
-                for (const [key, dataValue] of value) {
-                    event.formData.append(key, dataValue);
-                }
-                return;
-            }
-            // Do not associate the value with the form if there is no value or no name.
-            if (value === null || !this.element.name) {
-                return;
-            }
-            event.formData.append(this.element.name, value);
-        };
-    }
-    hostConnected() {
-        // If the component internals are not in Shadow DOM, subscribing to form
-        // data events could lead to duplicated data, which may not work correctly
-        // on the server side.
-        if (!this.element.shadowRoot || window.ShadyDOM?.inUse) {
-            return;
-        }
-        // Preserve a reference to the form, since on hostDisconnected it may be
-        // null if the child was removed.
-        this.form = this.element.form;
-        this.form?.addEventListener('formdata', this.formDataListener);
-        // TODO(b/261871554) Label activation shim is currently only needed for
-        // Safari. Remove it when no longer needed.
-        if (isFormAssociated(this.element) && !SUPPORTS_FACE_LABEL) {
-            shimLabelSupport(this.element.getRootNode());
-        }
-    }
-    hostDisconnected() {
-        this.form?.removeEventListener('formdata', this.formDataListener);
-    }
-}
-//# sourceMappingURL=form-controller.js.map

package/controller/form-controller.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"form-controller.js","sourceRoot":"","sources":["form-controller.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAIH,OAAO,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAC,gBAAgB,EAAE,mBAAmB,EAAC,MAAM,4BAA4B,CAAC;AAkCjF;;;GAGG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,cAAc,CAAC,CAAC;AAEnD;;;;;;;;;GASG;AACH,MAAM,OAAO,cAAc;IAGzB;;;;OAIG;IACH,YAA6B,OAAoB;QAApB,YAAO,GAAP,OAAO,CAAa;QA0BhC,qBAAgB,GAAG,CAAC,KAAoB,EAAE,EAAE;YAC3D,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,EAAE;gBACzB,sEAAsE;gBACtE,OAAO;aACR;YAED,MAAM,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,EAAE,CAAC;YAC3C,sEAAsE;YACtE,wEAAwE;YACxE,QAAQ;YACR,IAAI,KAAK,YAAY,QAAQ,EAAE;gBAC7B,KAAK,MAAM,CAAC,GAAG,EAAE,SAAS,CAAC,IAAI,KAAK,EAAE;oBACpC,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,EAAE,SAAS,CAAC,CAAC;iBACvC;gBACD,OAAO;aACR;YAED,4EAA4E;YAC5E,IAAI,KAAK,KAAK,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE;gBACxC,OAAO;aACR;YAED,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAClD,CAAC,CAAC;IAjDkD,CAAC;IAErD,aAAa;QACX,wEAAwE;QACxE,0EAA0E;QAC1E,sBAAsB;QACtB,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,UAAU,IAAI,MAAM,CAAC,QAAQ,EAAE,KAAK,EAAE;YACtD,OAAO;SACR;QAED,wEAAwE;QACxE,iCAAiC;QACjC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;QAC9B,IAAI,CAAC,IAAI,EAAE,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAE/D,uEAAuE;QACvE,2CAA2C;QAC3C,IAAI,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,mBAAmB,EAAE;YAC1D,gBAAgB,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW,EAA2B,CAAC,CAAC;SACvE;IACH,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,IAAI,EAAE,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IACpE,CAAC;CA0BF","sourcesContent":["/**\n * @license\n * Copyright 2021 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {ReactiveController, ReactiveControllerHost} from 'lit';\n\nimport {isFormAssociated} from './form-associated.js';\nimport {shimLabelSupport, SUPPORTS_FACE_LABEL} from './shim-label-activation.js';\n\ndeclare global {\n  interface Window {\n    ShadyDOM?: {inUse: boolean;};\n  }\n}\n\n/**\n * An element that `FormController` may use.\n */\nexport interface FormElement extends ReactiveControllerHost, HTMLElement {\n  /**\n   * The `<form>` that this element is associated with.\n   */\n  readonly form: HTMLFormElement|null;\n  /**\n   * The name of the element in the form. This property should reflect to a\n   * `name` attribute.\n   */\n  name: string;\n  /**\n   * Whether or not this element is disabled. If present, this property should\n   * reflect to a `disabled` attribute.\n   */\n  disabled?: boolean;\n  /**\n   * A function that retrieves the current form value for this element.\n   *\n   * @return The current form value, or `null` if there is no value.\n   */\n  [getFormValue](): string|File|FormData|null;\n}\n\n/**\n * A unique symbol key for `FormController` elements to implement their\n * `getFormValue()` function.\n */\nexport const getFormValue = Symbol('getFormValue');\n\n/**\n * A `ReactiveController` that adds `<form>` support to an element.\n *\n * Elements should also set `static formAssociated = true` which\n * provides platform support for forms. When an element is form associated,\n * it can be activated via clicks on associated label elements. It is the\n * responsibility of the element to process this click and perform any necessary\n * activation tasks, for example focusing and clicking on an internal element.\n *\n */\nexport class FormController implements ReactiveController {\n  private form?: HTMLFormElement|null;\n\n  /**\n   * Creates a new `FormController` for the given element.\n   *\n   * @param element The element to add `<form>` support to.\n   */\n  constructor(private readonly element: FormElement) {}\n\n  hostConnected() {\n    // If the component internals are not in Shadow DOM, subscribing to form\n    // data events could lead to duplicated data, which may not work correctly\n    // on the server side.\n    if (!this.element.shadowRoot || window.ShadyDOM?.inUse) {\n      return;\n    }\n\n    // Preserve a reference to the form, since on hostDisconnected it may be\n    // null if the child was removed.\n    this.form = this.element.form;\n    this.form?.addEventListener('formdata', this.formDataListener);\n\n    // TODO(b/261871554) Label activation shim is currently only needed for\n    // Safari. Remove it when no longer needed.\n    if (isFormAssociated(this.element) && !SUPPORTS_FACE_LABEL) {\n      shimLabelSupport(this.element.getRootNode() as Document | ShadowRoot);\n    }\n  }\n\n  hostDisconnected() {\n    this.form?.removeEventListener('formdata', this.formDataListener);\n  }\n\n  private readonly formDataListener = (event: FormDataEvent) => {\n    if (this.element.disabled) {\n      // Check for truthiness since some elements may not support disabling.\n      return;\n    }\n\n    const value = this.element[getFormValue]();\n    // If given a `FormData` instance, append all values to the form. This\n    // allows elements to customize what is added beyond a single name/value\n    // pair.\n    if (value instanceof FormData) {\n      for (const [key, dataValue] of value) {\n        event.formData.append(key, dataValue);\n      }\n      return;\n    }\n\n    // Do not associate the value with the form if there is no value or no name.\n    if (value === null || !this.element.name) {\n      return;\n    }\n\n    event.formData.append(this.element.name, value);\n  };\n}\n"]}

package/controller/shim-label-activation.d.ts

@@ -1,18 +0,0 @@
-/**
- * @license
- * Copyright 2022 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-/**
- * Returns true if labeling is supported for form associated custom elemeents.
- * Chrome and Firefox currently do and Safari support appears to be in progress,
- * see https://bugs.webkit.org/show_bug.cgi?id=197960.
- */
-export declare const SUPPORTS_FACE_LABEL: boolean;
-/**
- * Provides a shim for labeling form associated custom elements via clicks
- * on label elements. Note, this is currently needed only in Safari and
- * support appears to be in progress, see
- * https://bugs.webkit.org/show_bug.cgi?id=197960.
- */
-export declare function shimLabelSupport(root: Document | ShadowRoot): void;

package/controller/shim-label-activation.js

@@ -1,72 +0,0 @@
-/**
- * @license
- * Copyright 2022 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-import { isFormAssociated } from './form-associated.js';
-// TODO Label activation shim is currently only needed for Safari. Remove it
-// when no longer needed, see b/261871554.
-/**
- * Returns true if labeling is supported for form associated custom elemeents.
- * Chrome and Firefox currently do and Safari support appears to be in progress,
- * see https://bugs.webkit.org/show_bug.cgi?id=197960.
- */
-export const SUPPORTS_FACE_LABEL = 'labels' in (globalThis?.ElementInternals?.prototype ?? {});
-function isCustomElement(element) {
-    return element.localName.match('-');
-}
-// Elements that can be associated with a <label> element include <button>,
-// <input> (except for type="hidden"), <meter>, <output>, <progress>, <select>
-// and <textarea>.
-const implicitLabelReactive = new Set(['button', 'input', 'meter', 'progress', 'output', 'select', 'textarea']);
-function isLabelReactive(element) {
-    return implicitLabelReactive.has(element.localName) ||
-        isFormAssociated(element);
-}
-/**
- * Provides a shim for labeling form associated custom elements via clicks
- * on label elements. Note, this is currently needed only in Safari and
- * support appears to be in progress, see
- * https://bugs.webkit.org/show_bug.cgi?id=197960.
- */
-export function shimLabelSupport(root) {
-    // Listen for clicks on root to find clicks on label elements
-    root.addEventListener('click', labelActivationListener);
-}
-function labelActivationListener(event) {
-    // Find label on which user clicked.
-    const path = event.composedPath();
-    const root = event.currentTarget;
-    let label = undefined;
-    for (let i = 0; i < path.length; i++) {
-        const target = path[i];
-        // Not element or not in scope.
-        if (target.nodeType !== Node.ELEMENT_NODE ||
-            target.getRootNode() !== root) {
-            continue;
-        }
-        // If the click is on a label reactive element, this is not a label click.
-        if (isLabelReactive(target)) {
-            return;
-        }
-        if (target.localName === 'label') {
-            label = target;
-        }
-    }
-    if (label === undefined) {
-        return;
-    }
-    // Find associated element to activate.
-    const forId = label.getAttribute('for');
-    const target = forId ?
-        root.getElementById(forId) :
-        Array.from(label.querySelectorAll('*'))
-            .find((el) => isCustomElement(el) && isFormAssociated(el));
-    if (target == null) {
-        return;
-    }
-    // Simulate FACE by issuing a click on the associated element.
-    const simulatedClick = new PointerEvent('click', { composed: true, bubbles: true });
-    target.dispatchEvent(simulatedClick);
-}
-//# sourceMappingURL=shim-label-activation.js.map

package/controller/shim-label-activation.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"shim-label-activation.js","sourceRoot":"","sources":["shim-label-activation.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAAC,gBAAgB,EAAC,MAAM,sBAAsB,CAAC;AAEtD,4EAA4E;AAC5E,0CAA0C;AAE1C;;;;GAIG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAC5B,QAAQ,IAAI,CAAC,UAAU,EAAE,gBAAgB,EAAE,SAAS,IAAI,EAAE,CAAC,CAAC;AAEhE,SAAS,eAAe,CAAC,OAAoB;IAC3C,OAAO,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;AACtC,CAAC;AAED,2EAA2E;AAC3E,8EAA8E;AAC9E,kBAAkB;AAClB,MAAM,qBAAqB,GAAG,IAAI,GAAG,CACjC,CAAC,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC,CAAC;AAE9E,SAAS,eAAe,CAAC,OAAoB;IAC3C,OAAO,qBAAqB,CAAC,GAAG,CAAC,OAAO,CAAC,SAAS,CAAC;QAC/C,gBAAgB,CAAC,OAAO,CAAC,CAAC;AAChC,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,gBAAgB,CAAC,IAAyB;IACxD,6DAA6D;IAC7D,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,CAAC,CAAC;AAC1D,CAAC;AAED,SAAS,uBAAuB,CAAC,KAAY;IAC3C,oCAAoC;IACpC,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAC;IAClC,MAAM,IAAI,GAAG,KAAK,CAAC,aAAsC,CAAC;IAC1D,IAAI,KAAK,GAA+B,SAAS,CAAC;IAClD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;QACpC,MAAM,MAAM,GAAG,IAAI,CAAC,CAAC,CAAgB,CAAC;QACtC,+BAA+B;QAC/B,IAAI,MAAM,CAAC,QAAQ,KAAK,IAAI,CAAC,YAAY;YACrC,MAAM,CAAC,WAAW,EAAE,KAAK,IAAI,EAAE;YACjC,SAAS;SACV;QACD,0EAA0E;QAC1E,IAAI,eAAe,CAAC,MAAM,CAAC,EAAE;YAC3B,OAAO;SACR;QACD,IAAI,MAAM,CAAC,SAAS,KAAK,OAAO,EAAE;YAChC,KAAK,GAAG,MAA0B,CAAC;SACpC;KACF;IACD,IAAI,KAAK,KAAK,SAAS,EAAE;QACvB,OAAO;KACR;IACD,uCAAuC;IACvC,MAAM,KAAK,GAAG,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,MAAM,GAAG,KAAK,CAAC,CAAC;QAClB,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,CAAC;QAC5B,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAc,GAAG,CAAC,CAAC;aAC/C,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,eAAe,CAAC,EAAE,CAAC,IAAI,gBAAgB,CAAC,EAAE,CAAC,CAAC,CAAC;IACnE,IAAI,MAAM,IAAI,IAAI,EAAE;QAClB,OAAO;KACR;IACD,8DAA8D;IAC9D,MAAM,cAAc,GAChB,IAAI,YAAY,CAAC,OAAO,EAAE,EAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;IAC/D,MAAM,CAAC,aAAa,CAAC,cAAc,CAAC,CAAC;AACvC,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {isFormAssociated} from './form-associated.js';\n\n// TODO Label activation shim is currently only needed for Safari. Remove it\n// when no longer needed, see b/261871554.\n\n/**\n * Returns true if labeling is supported for form associated custom elemeents.\n * Chrome and Firefox currently do and Safari support appears to be in progress,\n * see https://bugs.webkit.org/show_bug.cgi?id=197960.\n */\nexport const SUPPORTS_FACE_LABEL =\n    'labels' in (globalThis?.ElementInternals?.prototype ?? {});\n\nfunction isCustomElement(element: HTMLElement) {\n  return element.localName.match('-');\n}\n\n// Elements that can be associated with a <label> element include <button>,\n// <input> (except for type=\"hidden\"), <meter>, <output>, <progress>, <select>\n// and <textarea>.\nconst implicitLabelReactive = new Set(\n    ['button', 'input', 'meter', 'progress', 'output', 'select', 'textarea']);\n\nfunction isLabelReactive(element: HTMLElement) {\n  return implicitLabelReactive.has(element.localName) ||\n      isFormAssociated(element);\n}\n\n/**\n * Provides a shim for labeling form associated custom elements via clicks\n * on label elements. Note, this is currently needed only in Safari and\n * support appears to be in progress, see\n * https://bugs.webkit.org/show_bug.cgi?id=197960.\n */\nexport function shimLabelSupport(root: Document|ShadowRoot) {\n  // Listen for clicks on root to find clicks on label elements\n  root.addEventListener('click', labelActivationListener);\n}\n\nfunction labelActivationListener(event: Event) {\n  // Find label on which user clicked.\n  const path = event.composedPath();\n  const root = event.currentTarget as ShadowRoot | Document;\n  let label: HTMLLabelElement|undefined = undefined;\n  for (let i = 0; i < path.length; i++) {\n    const target = path[i] as HTMLElement;\n    // Not element or not in scope.\n    if (target.nodeType !== Node.ELEMENT_NODE ||\n        target.getRootNode() !== root) {\n      continue;\n    }\n    // If the click is on a label reactive element, this is not a label click.\n    if (isLabelReactive(target)) {\n      return;\n    }\n    if (target.localName === 'label') {\n      label = target as HTMLLabelElement;\n    }\n  }\n  if (label === undefined) {\n    return;\n  }\n  // Find associated element to activate.\n  const forId = label.getAttribute('for');\n  const target = forId ?\n      root.getElementById(forId) :\n      Array.from(label.querySelectorAll<HTMLElement>('*'))\n          .find((el) => isCustomElement(el) && isFormAssociated(el));\n  if (target == null) {\n    return;\n  }\n  // Simulate FACE by issuing a click on the associated element.\n  const simulatedClick =\n      new PointerEvent('click', {composed: true, bubbles: true});\n  target.dispatchEvent(simulatedClick);\n}\n"]}

package/dialog/lib/_dialog.scss

@@ -1,378 +0,0 @@
-//
-// Copyright 2023 Google LLC
-// SPDX-License-Identifier: Apache-2.0
-//
-
-// PUBLIC PROPERTIES
-
-// go/keep-sorted start
-@use 'sass:map';
-// go/keep-sorted end
-// go/keep-sorted start
-@use '../../elevation/elevation';
-@use '../../sass/color';
-@use '../../sass/theme';
-@use '../../sass/var';
-@use './tokens';
-// go/keep-sorted end
-
-@mixin styles() {
-  $tokens: tokens.md-comp-dialog-values();
-  $tokens: theme.create-theme-vars($tokens, 'dialog');
-
-  :host {
-    @each $token, $value in $tokens {
-      --_#{$token}: #{$value};
-    }
-
-    // Private properties for drag data.
-    --_container-drag-inline-start: initial;
-    --_container-drag-block-start: initial;
-  }
-
-  @media (prefers-reduced-motion: reduce) {
-    :host {
-      --_opening-transition-duration: 0;
-      --_closing-transition-duration: 0;
-    }
-  }
-
-  .dialog {
-    position: fixed;
-    align-items: center;
-    justify-content: center;
-    box-sizing: border-box;
-    inset: 0;
-    block-size: 100dvh;
-    inline-size: 100dvw;
-    max-block-size: 100dvh;
-    max-inline-size: 100dvw;
-    border: none;
-    background: transparent;
-    padding: 0;
-    margin: 0;
-    overflow: clip;
-  }
-
-  // stylelint-disable-next-line selector-pseudo-class-no-unknown --
-  // New platform pseudo-class
-  .dialog:not(:modal) {
-    z-index: 10000;
-    pointer-events: none;
-  }
-
-  .dialog[open] {
-    display: flex;
-  }
-
-  .dialog::backdrop {
-    // Per spec, custom properties don't inherit to backdrop so we avoid using it.
-    background: none;
-  }
-
-  // Note, using ::before as scrim because ::backdrop cannot inherit custom properties.
-  .dialog::before {
-    content: '';
-    position: absolute;
-    z-index: -1;
-    inset: 0;
-    block-size: 100dvh;
-    inline-size: 100dvw;
-    pointer-events: none;
-  }
-
-  // Hide scrim when modeless.
-  :host([modeless]) .dialog:before {
-    display: none;
-  }
-
-  .container {
-    position: absolute;
-
-    inset-inline-start: var(
-      --_container-drag-inline-start,
-      var(--_container-inset-inline-start)
-    );
-    inset-inline-end: var(--_container-inset-inline-end);
-    inset-block-start: var(
-      --_container-drag-block-start,
-      var(--_container-inset-block-start)
-    );
-    inset-block-end: var(--_container-inset-block-end);
-
-    background-color: var(--_container-color);
-    border-radius: var(--_container-shape);
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    pointer-events: auto;
-    min-block-size: var(--_container-min-block-size);
-    max-block-size: var(--_container-max-block-size);
-    min-inline-size: var(--_container-min-inline-size);
-    max-inline-size: var(--_container-max-inline-size);
-    padding-block-start: var(--_container-block-padding);
-    padding-block-end: var(--_container-block-padding);
-  }
-
-  md-elevation {
-    @include elevation.theme(
-      (
-        'level': var(--_container-elevation),
-      )
-    );
-  }
-
-  .container > * {
-    box-sizing: border-box;
-    // Apply pad left/right here so scrollbar is not indented.
-    padding-inline-start: var(--_container-inline-padding);
-    padding-inline-end: var(--_container-inline-padding);
-  }
-
-  .header {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    gap: var(--_header-spacing);
-    -webkit-font-smoothing: antialiased;
-    color: var(--_headline-color);
-    font: var(--_headline-type);
-  }
-
-  .content {
-    flex: 1;
-    overflow: auto;
-    margin-block-start: var(--_content-block-start-spacing);
-    margin-block-end: var(--_content-block-end-spacing);
-    -webkit-font-smoothing: antialiased;
-    color: var(--_supporting-text-color);
-    font: var(--_supporting-text-type);
-  }
-
-  .footer {
-    display: flex;
-    position: relative;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: flex-end;
-    box-sizing: border-box;
-    gap: var(--_action-spacing);
-  }
-
-  .footerHidden {
-    --_content-block-end-spacing: 0px;
-  }
-
-  .footerHidden .footer {
-    display: none;
-  }
-
-  .stacked .footer {
-    flex-direction: column;
-    align-items: flex-end;
-  }
-
-  .scrollable .content {
-    border-block-start: var(--_with-divider-divider-height) solid transparent;
-    border-block-end: var(--_with-divider-divider-height) solid transparent;
-  }
-
-  .scroll-divider-header .content {
-    border-block-start-color: var(--_with-divider-divider-color);
-  }
-
-  .scroll-divider-footer:not(.footerHidden) .content {
-    border-block-end-color: var(--_with-divider-divider-color);
-  }
-
-  .dragging {
-    user-select: none;
-    cursor: move;
-    touch-action: none;
-  }
-
-  // Transitions for open/closed states
-  .container {
-    will-change: transform, opacity;
-    transition-property: transform;
-    overflow: hidden;
-  }
-
-  .container > * {
-    transition-timing-function: inherit;
-    transition-duration: inherit;
-    transition-property: opacity, transform;
-    will-change: transform, opacity;
-    opacity: 0;
-  }
-
-  :host([transition][showing-open]) .container > * {
-    opacity: 1;
-    transform: none;
-  }
-
-  :host([transition][showing-open]) .container {
-    opacity: 1;
-    transform: none;
-  }
-
-  .dialog::before {
-    transition: background-color linear;
-    background-color: transparent;
-  }
-
-  :host([showing-open]) .dialog::before {
-    background-color: var(--_scrim-color);
-  }
-
-  :host([opening]) .dialog::before {
-    transition-duration: calc(var(--_opening-transition-duration) / 2);
-  }
-
-  :host([closing]) .dialog::before {
-    transition-duration: calc(var(--_closing-transition-duration) / 2);
-  }
-
-  :host([opening]) .container {
-    transition-duration: var(--_opening-transition-duration);
-    transition-timing-function: var(--_opening-transition-easing);
-  }
-
-  :host([closing]) .container {
-    transition-duration: var(--_closing-transition-duration);
-    transition-timing-function: var(--_closing-transition-easing);
-  }
-
-  :host([trasition][closing]) .container > * {
-    transform: none;
-    opacity: 0;
-  }
-
-  :host([transition='grow-down']) {
-    --_opening-transform: scale(1, 0.1) translateY(-20%);
-    --_closing-transform: scale(1, 0.9) translateY(-10%);
-    --_origin: top;
-    --_opening-content-transform: scale(1, 2);
-    --_origin-footer: bottom;
-  }
-
-  :host([transition='grow-up']) {
-    --_opening-transform: scale(1, 0.1) translateY(20%);
-    --_closing-transform: scale(1, 0.9) translateY(10%);
-    --_origin: bottom;
-    --_opening-content-transform: scale(1, 2);
-    --_origin-footer: bottom;
-  }
-
-  :host([transition='grow-left']) {
-    --_opening-transform: scale(0.1, 1) translateX(20%);
-    --_closing-transform: scale(0.9, 1) translateX(10%);
-    --_origin: right;
-    --_opening-content-transform: none;
-    --_origin-footer: none;
-  }
-
-  :host([transition='grow-right']) {
-    --_opening-transform: scale(0.1, 1) translateX(-20%);
-    --_closing-transform: scale(0.9, 1) translateX(-10%);
-    --_origin: left;
-    --_opening-content-transform: none;
-    --_origin-footer: none;
-  }
-
-  :host([transition^='grow-']) .container {
-    transform-origin: var(--_origin);
-    transform: var(--_opening-transform);
-  }
-
-  :host([transition^='grow-']) .container > * {
-    transform-origin: var(--_origin);
-    transform: var(--_opening-content-transform);
-  }
-
-  :host([transition^='grow-']) .footer {
-    transform-origin: var(--_origin-footer);
-  }
-
-  :host([transition^='grow-'][closing]) {
-    transform: var(--_closing-transform);
-  }
-
-  :host([transition='shrink']) .container {
-    transform: scale(1.2);
-  }
-
-  :host([transition='grow']) .container {
-    transform: scale(0.8);
-  }
-
-  :host([transition='shrink'][closing]) .container,
-  :host([transition='grow'][closing]) .container {
-    transition-duration: 0;
-    transform: none;
-  }
-
-  // fullscreen
-  :host([showing-fullscreen]) {
-    --_container-max-block-size: none;
-    --_container-max-inline-size: none;
-  }
-
-  :host([showing-fullscreen]) .container {
-    block-size: 100dvh;
-    inline-size: 100dvw;
-    border-radius: 0px;
-    padding-block-start: 0;
-    padding-block-end: 0;
-  }
-
-  :host([showing-fullscreen]) .header {
-    justify-content: space-between;
-    flex-direction: row;
-    max-block-size: var(--_fullscreen-header-block-size);
-    padding-block-start: var(--_fullscreen-container-block-padding);
-    // TODO: should there be explicit tokens for these?
-    padding-inline: 4px;
-    --_header-spacing: 4px;
-  }
-
-  :host([showing-fullscreen]) .content {
-    margin-block-start: 0;
-    margin-block-end: 0;
-  }
-
-  :host([showing-fullscreen]) .footer {
-    max-block-size: var(--_fullscreen-footer-block-size);
-    padding-block-end: var(--_fullscreen-container-block-padding);
-  }
-
-  // Hide bottom divider on fullscreen since it's common not to have footer actions.
-  :host([showing-fullscreen]) .scroll-divider-footer .content {
-    border-block-end-color: transparent;
-  }
-
-  // High contrast mode
-  @media screen and (forced-colors: active), (-ms-high-contrast: active) {
-    .container {
-      outline: windowtext solid 2px;
-    }
-  }
-
-  // Slot styling
-  [name='headline-prefix']::slotted(*),
-  [name='headline-suffix']::slotted(*) {
-    color: var(--_with-icon-icon-color);
-    font-size: var(--_with-icon-icon-size);
-  }
-
-  [name='header']::slotted(*) {
-    flex: 1;
-    align-self: stretch;
-    display: flex;
-    align-items: center;
-  }
-
-  :host([showing-fullscreen]) [name='headline']::slotted(*) {
-    flex: 1;
-  }
-}