@material/web 1.0.0-pre.8 → 1.0.0

package/slider/lib/slider.d.ts

@@ -1,124 +0,0 @@
-/**
- * @license
- * Copyright 2023 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-import '../../elevation/elevation.js';
-import '../../focus/focus-ring.js';
-import '../../ripple/ripple.js';
-import { LitElement, PropertyValues } from 'lit';
-import { getFormValue } from '../../controller/form-controller.js';
-/**
- * Slider component.
- */
-export declare class Slider extends LitElement {
-    static shadowRootOptions: ShadowRootInit;
-    /**
-     * @nocollapse
-     */
-    static formAssociated: boolean;
-    /**
-     * Whether or not the slider is disabled.
-     */
-    disabled: boolean;
-    /**
-     * The slider minimum value
-     */
-    min: number;
-    /**
-     * The slider maximum value
-     */
-    max: number;
-    /**
-     * The slider value, can be a single number, or an array tuple indicating
-     * a start and end value.
-     */
-    value: number | [number, number];
-    /**
-     * An optinoal label for the slider's value; if not set, the label is the
-     * value itself. This can be a string or string tuple when start and end
-     * values are used.
-     */
-    valueLabel?: string | [string, string] | undefined;
-    /**
-     * The step between values.
-     */
-    step: number;
-    /**
-     * Whether or not to show tick marks.
-     */
-    withTickMarks: boolean;
-    /**
-     * Whether or not to show a value label when activated.
-     */
-    withLabel: boolean;
-    /**
-     * The HTML name to use in form submission.
-     */
-    name: string;
-    /**
-     * The associated form element with which this element's value will submit.
-     */
-    get form(): HTMLFormElement;
-    /**
-     * Read only computed value representing the fraction between 0 and 1
-     * respresenting the value's position between min and max. This is a
-     * single fraction or a tuple if the value specifies start and end values.
-     */
-    get valueAsFraction(): number | number[];
-    private getMetrics;
-    private readonly inputA;
-    private readonly handleA;
-    private readonly rippleA;
-    private readonly inputB;
-    private readonly handleB;
-    private readonly rippleB;
-    private valueA;
-    private valueB;
-    private rippleAShowing;
-    private rippleBShowing;
-    private handleAHover;
-    private handleBHover;
-    private onTopId;
-    private handlesOverlapping;
-    constructor();
-    focus(): void;
-    get valueAsString(): string;
-    [getFormValue](): string;
-    private allowRange;
-    private isFlipped;
-    protected willUpdate(changed: PropertyValues): void;
-    protected updated(changed: PropertyValues): Promise<void>;
-    protected render(): import("lit-html").TemplateResult<1>;
-    private renderTrack;
-    private renderLabel;
-    private renderHandle;
-    private renderInput;
-    private readonly renderRipple;
-    private readonly getRippleA;
-    private readonly getRippleB;
-    private toggleRippleHover;
-    private isEventOnA;
-    private handleFocus;
-    private ripplePointerId;
-    private handleDown;
-    /**
-     * The move handler tracks handle hovering to facilitate proper ripple
-     * behavior on the slider handle. This is needed because user interaction with
-     * the native input is leveraged to position the handle. Because the separate
-     * displayed handle element has pointer events disabled (to allow interaction
-     * with the input) and the input's handle is a pseudo-element, neither can be
-     * the ripple's interactive element. Therefore the input is the ripple's
-     * interactive element and has a `ripple` directive; however the ripple
-     * is gated on the handle being hovered. In addition, because the ripple
-     * hover state is being specially handled, it must be triggered independent
-     * of the directive. This is done based on the hover state when the
-     * slider is updated.
-     */
-    private handleMove;
-    private handleEnter;
-    private handleLeave;
-    private updateOnTop;
-    private handleInput;
-    private handleChange;
-}

package/slider/lib/slider.js

@@ -1,485 +0,0 @@
-/**
- * @license
- * Copyright 2023 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-var _a;
-import { __decorate } from "tslib";
-import '../../elevation/elevation.js';
-import '../../focus/focus-ring.js';
-import '../../ripple/ripple.js';
-import { html, isServer, LitElement, nothing } from 'lit';
-import { property, query, queryAsync, state } from 'lit/decorators.js';
-import { classMap } from 'lit/directives/class-map.js';
-import { styleMap } from 'lit/directives/style-map.js';
-import { when } from 'lit/directives/when.js';
-import { requestUpdateOnAriaChange } from '../../aria/delegate.js';
-import { dispatchActivationClick, isActivationClick, redispatchEvent } from '../../controller/events.js';
-import { FormController, getFormValue } from '../../controller/form-controller.js';
-import { stringConverter } from '../../controller/string-converter.js';
-import { ripple } from '../../ripple/directive.js';
-// Disable warning for classMap with destructuring
-// tslint:disable:quoted-properties-on-dictionary
-function inBounds({ x, y }, element) {
-    if (!element) {
-        return false;
-    }
-    const { top, left, bottom, right } = element.getBoundingClientRect();
-    return x >= left && x <= right && y >= top && y <= bottom;
-}
-// parse values like: foo or foo,bar
-function tupleConverter(attr) {
-    const [, v, e] = attr?.match(/\s*\[?\s*([^,]+)(?:(?:\s*$)|(?:\s*,\s*(.*)\s*))/) ?? [];
-    return e !== undefined ? [v, e] : v;
-}
-function toNumber(value) {
-    return Number(value) || 0;
-}
-function tupleAsString(value) {
-    return Array.isArray(value) ? value.join() : String(value ?? '');
-}
-function valueConverter(attr) {
-    const value = tupleConverter(attr);
-    return Array.isArray(value) ? value.map(i => toNumber(i)) : toNumber(value);
-}
-function clamp(value, min, max) {
-    return Math.max(min, Math.min(max, value));
-}
-function isOverlapping(elA, elB) {
-    if (!(elA && elB)) {
-        return false;
-    }
-    const a = elA.getBoundingClientRect();
-    const b = elB.getBoundingClientRect();
-    return !(a.top > b.bottom || a.right < b.left || a.bottom < b.top ||
-        a.left > b.right);
-}
-/**
- * Slider component.
- */
-export class Slider extends LitElement {
-    /**
-     * The associated form element with which this element's value will submit.
-     */
-    get form() {
-        return this.closest('form');
-    }
-    /**
-     * Read only computed value representing the fraction between 0 and 1
-     * respresenting the value's position between min and max. This is a
-     * single fraction or a tuple if the value specifies start and end values.
-     */
-    get valueAsFraction() {
-        const { lowerFraction, upperFraction } = this.getMetrics();
-        return this.allowRange ? [lowerFraction, upperFraction] : upperFraction;
-    }
-    getMetrics() {
-        const step = Math.max(this.step, 1);
-        const range = Math.max(this.max - this.min, step);
-        const lower = Math.min(this.valueA, this.valueB);
-        const upper = Math.max(this.valueA, this.valueB);
-        const lowerFraction = (lower - this.min) / range;
-        const upperFraction = (upper - this.min) / range;
-        return {
-            step,
-            range,
-            lower,
-            upper,
-            lowerFraction,
-            upperFraction,
-        };
-    }
-    constructor() {
-        super();
-        /**
-         * Whether or not the slider is disabled.
-         */
-        this.disabled = false;
-        /**
-         * The slider minimum value
-         */
-        this.min = 0;
-        /**
-         * The slider maximum value
-         */
-        this.max = 10;
-        /**
-         * The slider value, can be a single number, or an array tuple indicating
-         * a start and end value.
-         */
-        this.value = 0;
-        /**
-         * The step between values.
-         */
-        this.step = 1;
-        /**
-         * Whether or not to show tick marks.
-         */
-        this.withTickMarks = false;
-        /**
-         * Whether or not to show a value label when activated.
-         */
-        this.withLabel = false;
-        /**
-         * The HTML name to use in form submission.
-         */
-        this.name = '';
-        this.valueA = 0;
-        this.valueB = 0;
-        this.rippleAShowing = false;
-        this.rippleBShowing = false;
-        // handle hover/pressed states are set manually since the handle
-        // does not receive pointer events so that the native inputs are
-        // interaction targets.
-        this.handleAHover = false;
-        this.handleBHover = false;
-        this.onTopId = 'b';
-        this.handlesOverlapping = false;
-        // If range should be allowed (detected via value format).
-        this.allowRange = false;
-        this.renderRipple = (id) => html `<md-ripple class=${id} ?disabled=${this.disabled} unbounded></md-ripple>`;
-        this.getRippleA = () => {
-            if (!this.handleAHover) {
-                return null;
-            }
-            this.rippleAShowing = true;
-            return this.rippleA;
-        };
-        this.getRippleB = () => {
-            if (!this.handleBHover) {
-                return null;
-            }
-            this.rippleBShowing = true;
-            return this.rippleB;
-        };
-        // used in synthetic events generated to control ripple hover state.
-        this.ripplePointerId = 1;
-        this.addController(new FormController(this));
-        if (!isServer) {
-            this.addEventListener('click', (event) => {
-                if (!isActivationClick(event) || !this.inputB) {
-                    return;
-                }
-                this.focus();
-                dispatchActivationClick(this.inputB);
-            });
-        }
-    }
-    focus() {
-        this.inputB?.focus();
-    }
-    get valueAsString() {
-        return tupleAsString(this.value);
-    }
-    // value coerced to a string
-    [getFormValue]() {
-        return this.valueAsString;
-    }
-    // indicates input values are crossed over each other from initial rendering.
-    isFlipped() {
-        return this.valueA > this.valueB;
-    }
-    willUpdate(changed) {
-        if (changed.has('value') || changed.has('min') || changed.has('max') ||
-            changed.has('step')) {
-            this.allowRange = Array.isArray(this.value);
-            const step = Math.max(this.step, 1);
-            let lower = this.allowRange ? this.value[0] : this.min;
-            lower = clamp(lower - (lower % step), this.min, this.max);
-            let upper = this.allowRange ? this.value[1] :
-                this.value;
-            upper = clamp(upper - (upper % step), this.min, this.max);
-            const isFlipped = this.isFlipped() && this.allowRange;
-            this.valueA = isFlipped ? upper : lower;
-            this.valueB = isFlipped ? lower : upper;
-        }
-        // manually handle ripple hover state since the handle is pointer events
-        // none.
-        if (changed.get('handleAHover') !== undefined) {
-            this.rippleAShowing = true;
-            this.toggleRippleHover(this.rippleA, this.handleAHover);
-        }
-        else if (changed.get('handleBHover') !== undefined) {
-            this.rippleBShowing = true;
-            this.toggleRippleHover(this.rippleB, this.handleBHover);
-        }
-    }
-    async updated(changed) {
-        if (changed.has('value') || changed.has('valueA') ||
-            changed.has('valueB')) {
-            await this.updateComplete;
-            this.handlesOverlapping = isOverlapping(this.handleA, this.handleB);
-        }
-    }
-    render() {
-        const { step, range, lowerFraction, upperFraction } = this.getMetrics();
-        const isFlipped = this.isFlipped();
-        const containerStyles = {
-            // for clipping inputs and active track.
-            '--slider-lower-fraction': String(lowerFraction),
-            '--slider-upper-fraction': String(upperFraction),
-            // for generating tick marks
-            '--slider-tick-count': String(range / step),
-        };
-        const containerClasses = { ranged: this.allowRange };
-        // optional label values to show in place of the value.
-        const labelA = String(this.valueLabel?.[isFlipped ? 1 : 0] ?? this.valueA);
-        const labelB = String((this.allowRange ? this.valueLabel?.[isFlipped ? 0 : 1] :
-            this.valueLabel) ??
-            this.valueB);
-        const inputAProps = {
-            id: 'a',
-            lesser: !isFlipped,
-            value: this.valueA,
-            label: labelA,
-            getRipple: this.getRippleA
-        };
-        const inputBProps = {
-            id: 'b',
-            lesser: isFlipped,
-            value: this.valueB,
-            label: labelB,
-            getRipple: this.getRippleB
-        };
-        const handleAProps = {
-            id: 'a',
-            lesser: !isFlipped,
-            showRipple: this.rippleAShowing,
-            hover: this.handleAHover,
-            label: labelA
-        };
-        const handleBProps = {
-            id: 'b',
-            lesser: isFlipped,
-            showRipple: this.rippleBShowing,
-            hover: this.handleBHover,
-            label: labelB
-        };
-        const handleContainerClasses = {
-            hover: this.handleAHover || this.handleBHover
-        };
-        return html `
-      <div
-        class="container ${classMap(containerClasses)}"
-        style=${styleMap(containerStyles)}
-      >
-        ${when(this.allowRange, () => this.renderInput(inputAProps))}
-        ${this.renderInput(inputBProps)}
-        ${this.renderTrack()}
-        <div class="handleContainerPadded">
-          <div class="handleContainerBlock">
-            <div class="handleContainer ${classMap(handleContainerClasses)}">
-              ${when(this.allowRange, () => this.renderHandle(handleAProps))}
-              ${this.renderHandle(handleBProps)}
-            </div>
-          </div>
-        </div>
-      </div>`;
-    }
-    renderTrack() {
-        const trackClasses = { 'tickMarks': this.withTickMarks };
-        return html `<div class="track ${classMap(trackClasses)}"></div>`;
-    }
-    renderLabel(value) {
-        return html `<div class="label">
-        <span class="labelContent" part="label">${value}</span>
-      </div>`;
-    }
-    renderHandle({ id, lesser, showRipple, hover, label }) {
-        const onTop = !this.disabled && id === this.onTopId;
-        const isOverlapping = !this.disabled && this.handlesOverlapping;
-        return html `<div class="handle ${classMap({
-            [id]: true,
-            lesser,
-            hover,
-            onTop,
-            isOverlapping
-        })}">
-        <div class="handleNub"><md-elevation></md-elevation></div>
-        ${when(this.withLabel, () => this.renderLabel(label))}
-      ${when(showRipple, () => this.renderRipple(id))}
-      <md-focus-ring for=${id}></md-focus-ring>
-    </div>`;
-    }
-    renderInput({ id, lesser, value, label, getRipple }) {
-        // when ranged, ensure announcement includes value info.
-        const ariaLabelDescriptor = this.allowRange ? ` - ${lesser ? `start` : `end`} handle` : '';
-        // Needed for closure conformance
-        const { ariaLabel } = this;
-        return html `<input type="range"
-      class="${classMap({
-            lesser,
-            [id]: true
-        })}"
-      @focus=${this.handleFocus}
-      @pointerdown=${this.handleDown}
-      @pointerenter=${this.handleEnter}
-      @pointermove=${this.handleMove}
-      @pointerleave=${this.handleLeave}
-      @input=${this.handleInput}
-      @change=${this.handleChange}
-      id=${id}
-      .disabled=${this.disabled}
-      .min=${String(this.min)}
-      .max=${String(this.max)}
-      .step=${String(this.step)}
-      .value=${String(value)}
-      .tabIndex=${lesser ? 1 : 0}
-      aria-label=${`${ariaLabel}${ariaLabelDescriptor}` || nothing}
-      aria-valuetext=${label}
-      ${ripple(getRipple)}>`;
-    }
-    async toggleRippleHover(ripple, hovering) {
-        const rippleEl = await ripple;
-        if (!rippleEl) {
-            return;
-        }
-        // TODO(b/269799771): improve slider ripple connection
-        if (hovering) {
-            rippleEl.handlePointerenter(new PointerEvent('pointerenter', { isPrimary: true, pointerId: this.ripplePointerId }));
-        }
-        else {
-            rippleEl.handlePointerleave(new PointerEvent('pointerleave', { isPrimary: true, pointerId: this.ripplePointerId }));
-        }
-    }
-    isEventOnA({ target }) {
-        return target === this.inputA;
-    }
-    handleFocus(e) {
-        this.updateOnTop(e);
-    }
-    handleDown(e) {
-        this.ripplePointerId = e.pointerId;
-        const isA = this.isEventOnA(e);
-        // Since handle moves to pointer on down and there may not be a move,
-        // it needs to be considered hovered..
-        this.handleAHover = !this.disabled && isA && Boolean(this.handleA);
-        this.handleBHover = !this.disabled && !isA && Boolean(this.handleB);
-        // Force Safari to focus input so the label stays displayed; note,
-        // Macs don't normally focus non-text type inputs.
-        const target = e.target;
-        requestAnimationFrame(() => {
-            target.focus();
-        });
-    }
-    /**
-     * The move handler tracks handle hovering to facilitate proper ripple
-     * behavior on the slider handle. This is needed because user interaction with
-     * the native input is leveraged to position the handle. Because the separate
-     * displayed handle element has pointer events disabled (to allow interaction
-     * with the input) and the input's handle is a pseudo-element, neither can be
-     * the ripple's interactive element. Therefore the input is the ripple's
-     * interactive element and has a `ripple` directive; however the ripple
-     * is gated on the handle being hovered. In addition, because the ripple
-     * hover state is being specially handled, it must be triggered independent
-     * of the directive. This is done based on the hover state when the
-     * slider is updated.
-     */
-    handleMove(e) {
-        this.handleAHover = !this.disabled && inBounds(e, this.handleA);
-        this.handleBHover = !this.disabled && inBounds(e, this.handleB);
-    }
-    handleEnter(e) {
-        this.handleMove(e);
-    }
-    handleLeave() {
-        this.handleAHover = false;
-        this.handleBHover = false;
-    }
-    updateOnTop(e) {
-        this.onTopId = e.target.classList.contains('a') ? 'a' : 'b';
-    }
-    handleInput(e) {
-        if (this.inputA) {
-            this.valueA = this.inputA.valueAsNumber ?? 0;
-        }
-        this.valueB = this.inputB.valueAsNumber;
-        this.updateOnTop(e);
-        // update value only on interaction
-        const lower = Math.min(this.valueA, this.valueB);
-        const upper = Math.max(this.valueA, this.valueB);
-        this.value = this.allowRange ? [lower, upper] : this.valueB;
-    }
-    handleChange(event) {
-        redispatchEvent(this, event);
-    }
-}
-_a = Slider;
-(() => {
-    requestUpdateOnAriaChange(_a);
-})();
-Slider.shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };
-/**
- * @nocollapse
- */
-Slider.formAssociated = true;
-__decorate([
-    property({ type: Boolean, reflect: true })
-], Slider.prototype, "disabled", void 0);
-__decorate([
-    property({ type: Number })
-], Slider.prototype, "min", void 0);
-__decorate([
-    property({ type: Number })
-], Slider.prototype, "max", void 0);
-__decorate([
-    property({ converter: valueConverter })
-], Slider.prototype, "value", void 0);
-__decorate([
-    property({ converter: tupleConverter })
-], Slider.prototype, "valueLabel", void 0);
-__decorate([
-    property({ type: Number })
-], Slider.prototype, "step", void 0);
-__decorate([
-    property({ type: Boolean })
-], Slider.prototype, "withTickMarks", void 0);
-__decorate([
-    property({ type: Boolean })
-], Slider.prototype, "withLabel", void 0);
-__decorate([
-    property({ reflect: true, converter: stringConverter })
-], Slider.prototype, "name", void 0);
-__decorate([
-    query('input.a')
-], Slider.prototype, "inputA", void 0);
-__decorate([
-    query('.handle.a')
-], Slider.prototype, "handleA", void 0);
-__decorate([
-    queryAsync('md-ripple.a')
-], Slider.prototype, "rippleA", void 0);
-__decorate([
-    query('input.b')
-], Slider.prototype, "inputB", void 0);
-__decorate([
-    query('.handle.b')
-], Slider.prototype, "handleB", void 0);
-__decorate([
-    queryAsync('md-ripple.b')
-], Slider.prototype, "rippleB", void 0);
-__decorate([
-    state()
-], Slider.prototype, "valueA", void 0);
-__decorate([
-    state()
-], Slider.prototype, "valueB", void 0);
-__decorate([
-    state()
-], Slider.prototype, "rippleAShowing", void 0);
-__decorate([
-    state()
-], Slider.prototype, "rippleBShowing", void 0);
-__decorate([
-    state()
-], Slider.prototype, "handleAHover", void 0);
-__decorate([
-    state()
-], Slider.prototype, "handleBHover", void 0);
-__decorate([
-    state()
-], Slider.prototype, "onTopId", void 0);
-__decorate([
-    state()
-], Slider.prototype, "handlesOverlapping", void 0);
-//# sourceMappingURL=slider.js.map

package/slider/lib/slider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"slider.js","sourceRoot":"","sources":["slider.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../elevation/elevation.js';\nimport '../../focus/focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement, nothing, PropertyValues} from 'lit';\nimport {property, query, queryAsync, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {styleMap} from 'lit/directives/style-map.js';\nimport {when} from 'lit/directives/when.js';\n\nimport {requestUpdateOnAriaChange} from '../../aria/delegate.js';\nimport {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';\nimport {FormController, getFormValue} from '../../controller/form-controller.js';\nimport {stringConverter} from '../../controller/string-converter.js';\nimport {ripple} from '../../ripple/directive.js';\nimport {MdRipple} from '../../ripple/ripple.js';\nimport {ARIAMixinStrict} from '../../types/aria.js';\n\n// Disable warning for classMap with destructuring\n// tslint:disable:quoted-properties-on-dictionary\n\nfunction inBounds({x, y}: PointerEvent, element?: HTMLElement|null) {\n  if (!element) {\n    return false;\n  }\n  const {top, left, bottom, right} = element.getBoundingClientRect();\n  return x >= left && x <= right && y >= top && y <= bottom;\n}\n\n// parse values like: foo or foo,bar\nfunction tupleConverter(attr: string|null) {\n  const [, v, e] =\n      attr?.match(/\\s*\\[?\\s*([^,]+)(?:(?:\\s*$)|(?:\\s*,\\s*(.*)\\s*))/) ?? [];\n  return e !== undefined ? [v, e] : v;\n}\n\nfunction toNumber(value: string) {\n  return Number(value) || 0;\n}\n\nfunction tupleAsString(value: unknown|[unknown, unknown]) {\n  return Array.isArray(value) ? value.join() : String(value ?? '');\n}\n\nfunction valueConverter(attr: string|null) {\n  const value = tupleConverter(attr);\n  return Array.isArray(value) ? value.map(i => toNumber(i)) : toNumber(value);\n}\n\nfunction clamp(value: number, min: number, max: number) {\n  return Math.max(min, Math.min(max, value));\n}\n\nfunction isOverlapping(elA: Element|null, elB: Element|null) {\n  if (!(elA && elB)) {\n    return false;\n  }\n  const a = elA.getBoundingClientRect();\n  const b = elB.getBoundingClientRect();\n  return !(\n      a.top > b.bottom || a.right < b.left || a.bottom < b.top ||\n      a.left > b.right);\n}\n\n/**\n * Slider component.\n */\nexport class Slider extends LitElement {\n  static {\n    requestUpdateOnAriaChange(this);\n  }\n\n  static override shadowRootOptions:\n      ShadowRootInit = {...LitElement.shadowRootOptions, delegatesFocus: true};\n\n  /**\n   * @nocollapse\n   */\n  static formAssociated = true;\n\n  /**\n   * Whether or not the slider is disabled.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  /**\n   * The slider minimum value\n   */\n  @property({type: Number}) min = 0;\n\n  /**\n   * The slider maximum value\n   */\n  @property({type: Number}) max = 10;\n\n  /**\n   * The slider value, can be a single number, or an array tuple indicating\n   * a start and end value.\n   */\n  @property({converter: valueConverter}) value: number|[number, number] = 0;\n\n  /**\n   * An optinoal label for the slider's value; if not set, the label is the\n   * value itself. This can be a string or string tuple when start and end\n   * values are used.\n   */\n  @property({converter: tupleConverter})\n  valueLabel?: string|[string, string]|undefined;\n\n  /**\n   * The step between values.\n   */\n  @property({type: Number}) step = 1;\n\n  /**\n   * Whether or not to show tick marks.\n   */\n  @property({type: Boolean}) withTickMarks = false;\n\n  /**\n   * Whether or not to show a value label when activated.\n   */\n  @property({type: Boolean}) withLabel = false;\n\n  /**\n   * The HTML name to use in form submission.\n   */\n  @property({reflect: true, converter: stringConverter}) name = '';\n\n  /**\n   * The associated form element with which this element's value will submit.\n   */\n  get form() {\n    return this.closest('form');\n  }\n\n\n  /**\n   * Read only computed value representing the fraction between 0 and 1\n   * respresenting the value's position between min and max. This is a\n   * single fraction or a tuple if the value specifies start and end values.\n   */\n  get valueAsFraction() {\n    const {lowerFraction, upperFraction} = this.getMetrics();\n    return this.allowRange ? [lowerFraction, upperFraction] : upperFraction;\n  }\n\n  private getMetrics() {\n    const step = Math.max(this.step, 1);\n    const range = Math.max(this.max - this.min, step);\n    const lower = Math.min(this.valueA, this.valueB);\n    const upper = Math.max(this.valueA, this.valueB);\n    const lowerFraction = (lower - this.min) / range;\n    const upperFraction = (upper - this.min) / range;\n    return {\n      step,\n      range,\n      lower,\n      upper,\n      lowerFraction,\n      upperFraction,\n    };\n  }\n\n  @query('input.a') private readonly inputA!: HTMLInputElement|null;\n  @query('.handle.a') private readonly handleA!: HTMLDivElement|null;\n  @queryAsync('md-ripple.a') private readonly rippleA!: Promise<MdRipple|null>;\n\n  @query('input.b') private readonly inputB!: HTMLInputElement|null;\n  @query('.handle.b') private readonly handleB!: HTMLDivElement|null;\n  @queryAsync('md-ripple.b') private readonly rippleB!: Promise<MdRipple|null>;\n\n  @state() private valueA = 0;\n  @state() private valueB = 0;\n\n  @state() private rippleAShowing = false;\n  @state() private rippleBShowing = false;\n\n  // handle hover/pressed states are set manually since the handle\n  // does not receive pointer events so that the native inputs are\n  // interaction targets.\n  @state() private handleAHover = false;\n  @state() private handleBHover = false;\n\n  @state() private onTopId = 'b';\n  @state() private handlesOverlapping = false;\n\n  constructor() {\n    super();\n    this.addController(new FormController(this));\n    if (!isServer) {\n      this.addEventListener('click', (event: MouseEvent) => {\n        if (!isActivationClick(event) || !this.inputB) {\n          return;\n        }\n        this.focus();\n        dispatchActivationClick(this.inputB);\n      });\n    }\n  }\n\n  override focus() {\n    this.inputB?.focus();\n  }\n\n  get valueAsString() {\n    return tupleAsString(this.value);\n  }\n\n  // value coerced to a string\n  [getFormValue]() {\n    return this.valueAsString;\n  }\n\n  // If range should be allowed (detected via value format).\n  private allowRange = false;\n\n  // indicates input values are crossed over each other from initial rendering.\n  private isFlipped() {\n    return this.valueA > this.valueB;\n  }\n\n  protected override willUpdate(changed: PropertyValues) {\n    if (changed.has('value') || changed.has('min') || changed.has('max') ||\n        changed.has('step')) {\n      this.allowRange = Array.isArray(this.value);\n      const step = Math.max(this.step, 1);\n      let lower =\n          this.allowRange ? (this.value as [number, number])[0] : this.min;\n      lower = clamp(lower - (lower % step), this.min, this.max);\n      let upper = this.allowRange ? (this.value as [number, number])[1] :\n                                    this.value as number;\n      upper = clamp(upper - (upper % step), this.min, this.max);\n      const isFlipped = this.isFlipped() && this.allowRange;\n      this.valueA = isFlipped ? upper : lower;\n      this.valueB = isFlipped ? lower : upper;\n    }\n\n    // manually handle ripple hover state since the handle is pointer events\n    // none.\n    if (changed.get('handleAHover') !== undefined) {\n      this.rippleAShowing = true;\n      this.toggleRippleHover(this.rippleA, this.handleAHover);\n    } else if (changed.get('handleBHover') !== undefined) {\n      this.rippleBShowing = true;\n      this.toggleRippleHover(this.rippleB, this.handleBHover);\n    }\n  }\n\n  protected override async updated(changed: PropertyValues) {\n    if (changed.has('value') || changed.has('valueA') ||\n        changed.has('valueB')) {\n      await this.updateComplete;\n      this.handlesOverlapping = isOverlapping(this.handleA, this.handleB);\n    }\n  }\n\n  protected override render() {\n    const {step, range, lowerFraction, upperFraction} = this.getMetrics();\n    const isFlipped = this.isFlipped();\n    const containerStyles = {\n      // for clipping inputs and active track.\n      '--slider-lower-fraction': String(lowerFraction),\n      '--slider-upper-fraction': String(upperFraction),\n      // for generating tick marks\n      '--slider-tick-count': String(range / step),\n    };\n    const containerClasses = {ranged: this.allowRange};\n\n    // optional label values to show in place of the value.\n    const labelA = String(this.valueLabel?.[isFlipped ? 1 : 0] ?? this.valueA);\n    const labelB = String(\n        (this.allowRange ? this.valueLabel?.[isFlipped ? 0 : 1] :\n                           this.valueLabel) ??\n        this.valueB);\n\n    const inputAProps = {\n      id: 'a',\n      lesser: !isFlipped,\n      value: this.valueA,\n      label: labelA,\n      getRipple: this.getRippleA\n    };\n\n    const inputBProps = {\n      id: 'b',\n      lesser: isFlipped,\n      value: this.valueB,\n      label: labelB,\n      getRipple: this.getRippleB\n    };\n\n    const handleAProps = {\n      id: 'a',\n      lesser: !isFlipped,\n      showRipple: this.rippleAShowing,\n      hover: this.handleAHover,\n      label: labelA\n    };\n\n    const handleBProps = {\n      id: 'b',\n      lesser: isFlipped,\n      showRipple: this.rippleBShowing,\n      hover: this.handleBHover,\n      label: labelB\n    };\n\n    const handleContainerClasses = {\n      hover: this.handleAHover || this.handleBHover\n    };\n\n    return html`\n      <div\n        class=\"container ${classMap(containerClasses)}\"\n        style=${styleMap(containerStyles)}\n      >\n        ${when(this.allowRange, () => this.renderInput(inputAProps))}\n        ${this.renderInput(inputBProps)}\n        ${this.renderTrack()}\n        <div class=\"handleContainerPadded\">\n          <div class=\"handleContainerBlock\">\n            <div class=\"handleContainer ${classMap(handleContainerClasses)}\">\n              ${when(this.allowRange, () => this.renderHandle(handleAProps))}\n              ${this.renderHandle(handleBProps)}\n            </div>\n          </div>\n        </div>\n      </div>`;\n  }\n\n  private renderTrack() {\n    const trackClasses = {'tickMarks': this.withTickMarks};\n    return html`<div class=\"track ${classMap(trackClasses)}\"></div>`;\n  }\n\n  private renderLabel(value: string) {\n    return html`<div class=\"label\">\n        <span class=\"labelContent\" part=\"label\">${value}</span>\n      </div>`;\n  }\n\n  private renderHandle({id, lesser, showRipple, hover, label}: {\n    id: string,\n    lesser: boolean,\n    showRipple: boolean,\n    hover: boolean,\n    label: string\n  }) {\n    const onTop = !this.disabled && id === this.onTopId;\n    const isOverlapping = !this.disabled && this.handlesOverlapping;\n    return html`<div class=\"handle ${classMap({\n      [id]: true,\n      lesser,\n      hover,\n      onTop,\n      isOverlapping\n    })}\">\n        <div class=\"handleNub\"><md-elevation></md-elevation></div>\n        ${when(this.withLabel, () => this.renderLabel(label))}\n      ${when(showRipple, () => this.renderRipple(id))}\n      <md-focus-ring for=${id}></md-focus-ring>\n    </div>`;\n  }\n\n  private renderInput({id, lesser, value, label, getRipple}: {\n    id: string,\n    lesser: boolean,\n    value: number,\n    label: string,\n    getRipple: () => Promise<MdRipple|null>| null\n  }) {\n    // when ranged, ensure announcement includes value info.\n    const ariaLabelDescriptor =\n        this.allowRange ? ` - ${lesser ? `start` : `end`} handle` : '';\n    // Needed for closure conformance\n    const {ariaLabel} = this as ARIAMixinStrict;\n    return html`<input type=\"range\"\n      class=\"${classMap({\n      lesser,\n      [id]: true\n    })}\"\n      @focus=${this.handleFocus}\n      @pointerdown=${this.handleDown}\n      @pointerenter=${this.handleEnter}\n      @pointermove=${this.handleMove}\n      @pointerleave=${this.handleLeave}\n      @input=${this.handleInput}\n      @change=${this.handleChange}\n      id=${id}\n      .disabled=${this.disabled}\n      .min=${String(this.min)}\n      .max=${String(this.max)}\n      .step=${String(this.step)}\n      .value=${String(value)}\n      .tabIndex=${lesser ? 1 : 0}\n      aria-label=${`${ariaLabel}${ariaLabelDescriptor}` || nothing}\n      aria-valuetext=${label}\n      ${ripple(getRipple)}>`;\n  }\n\n  private readonly renderRipple = (id: string) => html`<md-ripple class=${\n      id} ?disabled=${this.disabled} unbounded></md-ripple>`;\n\n  private readonly getRippleA = () => {  // bind to this\n    if (!this.handleAHover) {\n      return null;\n    }\n    this.rippleAShowing = true;\n    return this.rippleA;\n  };\n\n  private readonly getRippleB = () => {  // bind to this\n    if (!this.handleBHover) {\n      return null;\n    }\n    this.rippleBShowing = true;\n    return this.rippleB;\n  };\n\n  private async toggleRippleHover(\n      ripple: Promise<MdRipple|null>, hovering: boolean) {\n    const rippleEl = await ripple;\n    if (!rippleEl) {\n      return;\n    }\n    // TODO(b/269799771): improve slider ripple connection\n    if (hovering) {\n      rippleEl.handlePointerenter(new PointerEvent(\n          'pointerenter', {isPrimary: true, pointerId: this.ripplePointerId}));\n    } else {\n      rippleEl.handlePointerleave(new PointerEvent(\n          'pointerleave', {isPrimary: true, pointerId: this.ripplePointerId}));\n    }\n  }\n\n  private isEventOnA({target}: Event) {\n    return target === this.inputA;\n  }\n\n  private handleFocus(e: Event) {\n    this.updateOnTop(e);\n  }\n\n  // used in synthetic events generated to control ripple hover state.\n  private ripplePointerId = 1;\n\n  private handleDown(e: PointerEvent) {\n    this.ripplePointerId = e.pointerId;\n    const isA = this.isEventOnA(e);\n    // Since handle moves to pointer on down and there may not be a move,\n    // it needs to be considered hovered..\n    this.handleAHover = !this.disabled && isA && Boolean(this.handleA);\n    this.handleBHover = !this.disabled && !isA && Boolean(this.handleB);\n    // Force Safari to focus input so the label stays displayed; note,\n    // Macs don't normally focus non-text type inputs.\n    const target = (e.target as HTMLElement);\n    requestAnimationFrame(() => {\n      target.focus();\n    });\n  }\n\n  /**\n   * The move handler tracks handle hovering to facilitate proper ripple\n   * behavior on the slider handle. This is needed because user interaction with\n   * the native input is leveraged to position the handle. Because the separate\n   * displayed handle element has pointer events disabled (to allow interaction\n   * with the input) and the input's handle is a pseudo-element, neither can be\n   * the ripple's interactive element. Therefore the input is the ripple's\n   * interactive element and has a `ripple` directive; however the ripple\n   * is gated on the handle being hovered. In addition, because the ripple\n   * hover state is being specially handled, it must be triggered independent\n   * of the directive. This is done based on the hover state when the\n   * slider is updated.\n   */\n  private handleMove(e: PointerEvent) {\n    this.handleAHover = !this.disabled && inBounds(e, this.handleA);\n    this.handleBHover = !this.disabled && inBounds(e, this.handleB);\n  }\n\n  private handleEnter(e: PointerEvent) {\n    this.handleMove(e);\n  }\n\n  private handleLeave() {\n    this.handleAHover = false;\n    this.handleBHover = false;\n  }\n\n  private updateOnTop(e: Event) {\n    this.onTopId = (e.target as Element).classList.contains('a') ? 'a' : 'b';\n  }\n\n  private handleInput(e: InputEvent) {\n    if (this.inputA) {\n      this.valueA = this.inputA.valueAsNumber ?? 0;\n    }\n    this.valueB = this.inputB!.valueAsNumber;\n    this.updateOnTop(e);\n    // update value only on interaction\n    const lower = Math.min(this.valueA, this.valueB);\n    const upper = Math.max(this.valueA, this.valueB);\n    this.value = this.allowRange ? [lower, upper] : this.valueB;\n  }\n\n  private handleChange(event: Event) {\n    redispatchEvent(this, event);\n  }\n}\n"]}