@material/web 1.1.1 → 1.1.2-nightly.50a9ffa.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/button/internal/button.js +1 -1
- package/button/internal/button.js.map +1 -1
- package/checkbox/internal/checkbox.js +2 -1
- package/checkbox/internal/checkbox.js.map +1 -1
- package/chips/internal/filter-chip.js +1 -1
- package/chips/internal/filter-chip.js.map +1 -1
- package/dialog/internal/dialog.js +1 -1
- package/dialog/internal/dialog.js.map +1 -1
- package/internal/events/dispatch-hooks.d.ts +85 -0
- package/internal/events/dispatch-hooks.js +151 -0
- package/internal/events/dispatch-hooks.js.map +1 -0
- package/internal/{controller/events.d.ts → events/form-label-activation.d.ts} +0 -22
- package/internal/{controller/events.js → events/form-label-activation.js} +1 -35
- package/internal/events/form-label-activation.js.map +1 -0
- package/internal/events/redispatch-event.d.ts +27 -0
- package/internal/events/redispatch-event.js +40 -0
- package/internal/events/redispatch-event.js.map +1 -0
- package/labs/card/internal/_outlined-card.scss +3 -2
- package/labs/card/internal/_shared.scss +17 -4
- package/labs/card/internal/card.js +2 -1
- package/labs/card/internal/card.js.map +1 -1
- package/labs/card/internal/outlined-styles.css.js +1 -1
- package/labs/card/internal/outlined-styles.css.js.map +1 -1
- package/labs/card/internal/shared-styles.css.js +1 -1
- package/labs/card/internal/shared-styles.css.js.map +1 -1
- package/menu/internal/_menu.scss +1 -0
- package/menu/internal/menu-styles.css.js +1 -1
- package/menu/internal/menu-styles.css.js.map +1 -1
- package/package.json +21 -9
- package/radio/internal/radio.js +1 -1
- package/radio/internal/radio.js.map +1 -1
- package/ripple/internal/ripple.js +11 -0
- package/ripple/internal/ripple.js.map +1 -1
- package/select/internal/_shared.scss +10 -1
- package/select/internal/select.d.ts +6 -1
- package/select/internal/select.js +37 -25
- package/select/internal/select.js.map +1 -1
- package/select/internal/selectoption/select-option.d.ts +26 -1
- package/select/internal/selectoption/select-option.js.map +1 -1
- package/select/internal/selectoption/selectOptionController.d.ts +2 -26
- package/select/internal/selectoption/selectOptionController.js.map +1 -1
- package/select/internal/shared-styles.css.js +1 -1
- package/select/internal/shared-styles.css.js.map +1 -1
- package/select/internal/shared.d.ts +1 -1
- package/select/internal/shared.js.map +1 -1
- package/select/select-option.d.ts +1 -0
- package/select/select-option.js.map +1 -1
- package/slider/internal/_slider.scss +31 -33
- package/slider/internal/slider-styles.css.js +1 -1
- package/slider/internal/slider-styles.css.js.map +1 -1
- package/slider/internal/slider.js +2 -1
- package/slider/internal/slider.js.map +1 -1
- package/switch/internal/switch.js +2 -1
- package/switch/internal/switch.js.map +1 -1
- package/tabs/internal/_tab.scss +7 -5
- package/tabs/internal/tab-styles.css.js +1 -1
- package/tabs/internal/tab-styles.css.js.map +1 -1
- package/textfield/internal/_input.scss +1 -1
- package/textfield/internal/shared-styles.css.js +1 -1
- package/textfield/internal/shared-styles.css.js.map +1 -1
- package/textfield/internal/text-field.d.ts +26 -0
- package/textfield/internal/text-field.js +27 -1
- package/textfield/internal/text-field.js.map +1 -1
- package/internal/controller/events.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"form-label-activation.js","sourceRoot":"","sources":["form-label-activation.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,UAAU,uBAAuB,CAAC,OAAoB;IAC1D,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,EAAC,OAAO,EAAE,IAAI,EAAC,CAAC,CAAC;IACvD,OAAO,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7B,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAAY;IAC5C,wCAAwC;IACxC,IAAI,KAAK,CAAC,aAAa,KAAK,KAAK,CAAC,MAAM,EAAE;QACxC,OAAO,KAAK,CAAC;KACd;IACD,gDAAgD;IAChD,IAAI,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAC,KAAK,KAAK,CAAC,MAAM,EAAE;QAC5C,OAAO,KAAK,CAAC;KACd;IACD,0EAA0E;IAC1E,oBAAoB;IACpB,IAAK,KAAK,CAAC,MAA4C,CAAC,QAAQ,EAAE;QAChE,OAAO,KAAK,CAAC;KACd;IACD,8DAA8D;IAC9D,OAAO,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;AAC9B,CAAC;AAED,6DAA6D;AAC7D,yCAAyC;AACzC,SAAS,YAAY,CAAC,KAAY;IAChC,MAAM,SAAS,GAAG,kBAAkB,CAAC;IACrC,IAAI,SAAS,EAAE;QACb,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,KAAK,CAAC,wBAAwB,EAAE,CAAC;KAClC;IACD,yBAAyB,EAAE,CAAC;IAC5B,OAAO,SAAS,CAAC;AACnB,CAAC;AAED,wCAAwC;AACxC,IAAI,kBAAkB,GAAG,KAAK,CAAC;AAC/B,KAAK,UAAU,yBAAyB;IACtC,kBAAkB,GAAG,IAAI,CAAC;IAC1B,wCAAwC;IACxC,2BAA2B;IAC3B,MAAM,IAAI,CAAC;IACX,kBAAkB,GAAG,KAAK,CAAC;AAC7B,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2021 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * Dispatches a click event to the given element that triggers a native action,\n * but is not composed and therefore is not seen outside the element.\n *\n * This is useful for responding to an external click event on the host element\n * that should trigger an internal action like a button click.\n *\n * Note, a helper is provided because setting this up correctly is a bit tricky.\n * In particular, calling `click` on an element creates a composed event, which\n * is not desirable, and a manually dispatched event must specifically be a\n * `MouseEvent` to trigger a native action.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n * if (isActivationClick(event)) {\n * this.dispatchActivationClick(this.buttonElement);\n * }\n * }\n *\n */\nexport function dispatchActivationClick(element: HTMLElement) {\n const event = new MouseEvent('click', {bubbles: true});\n element.dispatchEvent(event);\n return event;\n}\n\n/**\n * Returns true if the click event should trigger an activation behavior. The\n * behavior is defined by the element and is whatever it should do when\n * clicked.\n *\n * Typically when an element needs to handle a click, the click is generated\n * from within the element and an event listener within the element implements\n * the needed behavior; however, it's possible to fire a click directly\n * at the element that the element should handle. This method helps\n * distinguish these \"external\" clicks.\n *\n * An \"external\" click can be triggered in a number of ways: via a click\n * on an associated label for a form associated element, calling\n * `element.click()`, or calling\n * `element.dispatchEvent(new MouseEvent('click', ...))`.\n *\n * Also works around Firefox issue\n * https://bugzilla.mozilla.org/show_bug.cgi?id=1804576 by squelching\n * events for a microtask after called.\n *\n * @example\n * hostClickListener = (event: MouseEvent) {\n * if (isActivationClick(event)) {\n * this.dispatchActivationClick(this.buttonElement);\n * }\n * }\n *\n */\nexport function isActivationClick(event: Event) {\n // Event must start at the event target.\n if (event.currentTarget !== event.target) {\n return false;\n }\n // Event must not be retargeted from shadowRoot.\n if (event.composedPath()[0] !== event.target) {\n return false;\n }\n // Target must not be disabled; this should only occur for a synthetically\n // dispatched click.\n if ((event.target as EventTarget & {disabled: boolean}).disabled) {\n return false;\n }\n // This is an activation if the event should not be squelched.\n return !squelchEvent(event);\n}\n\n// TODO(https://bugzilla.mozilla.org/show_bug.cgi?id=1804576)\n// Remove when Firefox bug is addressed.\nfunction squelchEvent(event: Event) {\n const squelched = isSquelchingEvents;\n if (squelched) {\n event.preventDefault();\n event.stopImmediatePropagation();\n }\n squelchEventsForMicrotask();\n return squelched;\n}\n\n// Ignore events for one microtask only.\nlet isSquelchingEvents = false;\nasync function squelchEventsForMicrotask() {\n isSquelchingEvents = true;\n // Need to pause for just one microtask.\n // tslint:disable-next-line\n await null;\n isSquelchingEvents = false;\n}\n"]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2021 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Re-dispatches an event from the provided element.
|
|
8
|
+
*
|
|
9
|
+
* This function is useful for forwarding non-composed events, such as `change`
|
|
10
|
+
* events.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* class MyInput extends LitElement {
|
|
14
|
+
* render() {
|
|
15
|
+
* return html`<input @change=${this.redispatchEvent}>`;
|
|
16
|
+
* }
|
|
17
|
+
*
|
|
18
|
+
* protected redispatchEvent(event: Event) {
|
|
19
|
+
* redispatchEvent(this, event);
|
|
20
|
+
* }
|
|
21
|
+
* }
|
|
22
|
+
*
|
|
23
|
+
* @param element The element to dispatch the event from.
|
|
24
|
+
* @param event The event to re-dispatch.
|
|
25
|
+
* @return Whether or not the event was dispatched (if cancelable).
|
|
26
|
+
*/
|
|
27
|
+
export declare function redispatchEvent(element: Element, event: Event): boolean;
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2021 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
/**
|
|
7
|
+
* Re-dispatches an event from the provided element.
|
|
8
|
+
*
|
|
9
|
+
* This function is useful for forwarding non-composed events, such as `change`
|
|
10
|
+
* events.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* class MyInput extends LitElement {
|
|
14
|
+
* render() {
|
|
15
|
+
* return html`<input @change=${this.redispatchEvent}>`;
|
|
16
|
+
* }
|
|
17
|
+
*
|
|
18
|
+
* protected redispatchEvent(event: Event) {
|
|
19
|
+
* redispatchEvent(this, event);
|
|
20
|
+
* }
|
|
21
|
+
* }
|
|
22
|
+
*
|
|
23
|
+
* @param element The element to dispatch the event from.
|
|
24
|
+
* @param event The event to re-dispatch.
|
|
25
|
+
* @return Whether or not the event was dispatched (if cancelable).
|
|
26
|
+
*/
|
|
27
|
+
export function redispatchEvent(element, event) {
|
|
28
|
+
// For bubbling events in SSR light DOM (or composed), stop their propagation
|
|
29
|
+
// and dispatch the copy.
|
|
30
|
+
if (event.bubbles && (!element.shadowRoot || event.composed)) {
|
|
31
|
+
event.stopPropagation();
|
|
32
|
+
}
|
|
33
|
+
const copy = Reflect.construct(event.constructor, [event.type, event]);
|
|
34
|
+
const dispatched = element.dispatchEvent(copy);
|
|
35
|
+
if (!dispatched) {
|
|
36
|
+
event.preventDefault();
|
|
37
|
+
}
|
|
38
|
+
return dispatched;
|
|
39
|
+
}
|
|
40
|
+
//# sourceMappingURL=redispatch-event.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"redispatch-event.js","sourceRoot":"","sources":["redispatch-event.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,UAAU,eAAe,CAAC,OAAgB,EAAE,KAAY;IAC5D,6EAA6E;IAC7E,yBAAyB;IACzB,IAAI,KAAK,CAAC,OAAO,IAAI,CAAC,CAAC,OAAO,CAAC,UAAU,IAAI,KAAK,CAAC,QAAQ,CAAC,EAAE;QAC5D,KAAK,CAAC,eAAe,EAAE,CAAC;KACzB;IAED,MAAM,IAAI,GAAG,OAAO,CAAC,SAAS,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IACvE,MAAM,UAAU,GAAG,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAC/C,IAAI,CAAC,UAAU,EAAE;QACf,KAAK,CAAC,cAAc,EAAE,CAAC;KACxB;IAED,OAAO,UAAU,CAAC;AACpB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2021 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n/**\n * Re-dispatches an event from the provided element.\n *\n * This function is useful for forwarding non-composed events, such as `change`\n * events.\n *\n * @example\n * class MyInput extends LitElement {\n * render() {\n * return html`<input @change=${this.redispatchEvent}>`;\n * }\n *\n * protected redispatchEvent(event: Event) {\n * redispatchEvent(this, event);\n * }\n * }\n *\n * @param element The element to dispatch the event from.\n * @param event The event to re-dispatch.\n * @return Whether or not the event was dispatched (if cancelable).\n */\nexport function redispatchEvent(element: Element, event: Event) {\n // For bubbling events in SSR light DOM (or composed), stop their propagation\n // and dispatch the copy.\n if (event.bubbles && (!element.shadowRoot || event.composed)) {\n event.stopPropagation();\n }\n\n const copy = Reflect.construct(event.constructor, [event.type, event]);\n const dispatched = element.dispatchEvent(copy);\n if (!dispatched) {\n event.preventDefault();\n }\n\n return dispatched;\n}\n"]}
|
|
@@ -18,18 +18,31 @@
|
|
|
18
18
|
z-index: 0;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
|
|
22
|
-
.
|
|
23
|
-
|
|
21
|
+
md-elevation,
|
|
22
|
+
.background,
|
|
23
|
+
.outline {
|
|
24
24
|
border-radius: inherit;
|
|
25
25
|
inset: 0;
|
|
26
26
|
position: absolute;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// Separate element will be needed for disabled opacities (b/307361748)
|
|
30
|
+
.background {
|
|
31
|
+
background: var(--_container-color);
|
|
27
32
|
// Place behind content.
|
|
28
33
|
z-index: -1;
|
|
29
34
|
}
|
|
30
35
|
|
|
36
|
+
// Separate element needed to overlay on top of content as opposed to
|
|
37
|
+
// background, which is behind content. All cards have an outline for HCM.
|
|
38
|
+
.outline {
|
|
39
|
+
// A default transparent border that is visible in HCM
|
|
40
|
+
border: 1px solid transparent;
|
|
41
|
+
// Outline should be placed on top of content, such as images.
|
|
42
|
+
z-index: 1;
|
|
43
|
+
}
|
|
44
|
+
|
|
31
45
|
md-elevation {
|
|
32
|
-
border-radius: inherit;
|
|
33
46
|
// Place behind content.
|
|
34
47
|
z-index: -1;
|
|
35
48
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.js","sourceRoot":"","sources":["card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,iCAAiC,CAAC;AAEzC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAC,MAAM,KAAK,CAAC;AAErC;;GAEG;AACH,MAAM,OAAO,IAAK,SAAQ,UAAU;IACf,MAAM;QACvB,OAAO,IAAI,CAAA
|
|
1
|
+
{"version":3,"file":"card.js","sourceRoot":"","sources":["card.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,iCAAiC,CAAC;AAEzC,OAAO,EAAC,IAAI,EAAE,UAAU,EAAC,MAAM,KAAK,CAAC;AAErC;;GAEG;AACH,MAAM,OAAO,IAAK,SAAQ,UAAU;IACf,MAAM;QACvB,OAAO,IAAI,CAAA;;;;;KAKV,CAAC;IACJ,CAAC;CACF","sourcesContent":["/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../../elevation/elevation.js';\n\nimport {html, LitElement} from 'lit';\n\n/**\n * A card component.\n */\nexport class Card extends LitElement {\n protected override render() {\n return html`\n <md-elevation part=\"elevation\"></md-elevation>\n <div class=\"background\"></div>\n <slot></slot>\n <div class=\"outline\"></div>\n `;\n }\n}\n"]}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, 12px);--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.
|
|
7
|
+
export const styles = css `:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, 12px);--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.outline{border-color:var(--_outline-color);border-width:var(--_outline-width)}/*# sourceMappingURL=outlined-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=outlined-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"outlined-styles.css.js","sourceRoot":"","sources":["outlined-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, 12px);--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.
|
|
1
|
+
{"version":3,"file":"outlined-styles.css.js","sourceRoot":"","sources":["outlined-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--_container-color: var(--md-outlined-card-container-color, var(--md-sys-color-surface, #fef7ff));--_container-elevation: var(--md-outlined-card-container-elevation, 0);--_container-shadow-color: var(--md-outlined-card-container-shadow-color, var(--md-sys-color-shadow, #000));--_container-shape: var(--md-outlined-card-container-shape, 12px);--_outline-color: var(--md-outlined-card-outline-color, var(--md-sys-color-outline-variant, #cac4d0));--_outline-width: var(--md-outlined-card-outline-width, 1px)}.outline{border-color:var(--_outline-color);border-width:var(--_outline-width)}/*# sourceMappingURL=outlined-styles.css.map */\n`;\n "]}
|
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}
|
|
7
|
+
export const styles = css `:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}md-elevation,.background,.outline{border-radius:inherit;inset:0;position:absolute}.background{background:var(--_container-color);z-index:-1}.outline{border:1px solid rgba(0,0,0,0);z-index:1}md-elevation{z-index:-1;--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}slot{border-radius:inherit}/*# sourceMappingURL=shared-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=shared-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared-styles.css.js","sourceRoot":"","sources":["shared-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}
|
|
1
|
+
{"version":3,"file":"shared-styles.css.js","sourceRoot":"","sources":["shared-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{border-radius:var(--_container-shape);box-sizing:border-box;display:flex;flex-direction:column;position:relative;z-index:0}md-elevation,.background,.outline{border-radius:inherit;inset:0;position:absolute}.background{background:var(--_container-color);z-index:-1}.outline{border:1px solid rgba(0,0,0,0);z-index:1}md-elevation{z-index:-1;--md-elevation-level: var(--_container-elevation);--md-elevation-shadow-color: var(--_container-shadow-color)}slot{border-radius:inherit}/*# sourceMappingURL=shared-styles.css.map */\n`;\n "]}
|
package/menu/internal/_menu.scss
CHANGED
|
@@ -4,6 +4,6 @@
|
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
6
|
import { css } from 'lit';
|
|
7
|
-
export const styles = css `:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */
|
|
7
|
+
export const styles = css `:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);color:inherit;opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */
|
|
8
8
|
`;
|
|
9
9
|
//# sourceMappingURL=menu-styles.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu-styles.css.js","sourceRoot":"","sources":["menu-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */\n`;\n "]}
|
|
1
|
+
{"version":3,"file":"menu-styles.css.js","sourceRoot":"","sources":["menu-styles.css.ts"],"names":[],"mappings":"AAAA;;;;IAII;AACH,OAAO,EAAC,GAAG,EAAC,MAAM,KAAK,CAAC;AACxB,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;CACzB,CAAC","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n import {css} from 'lit';\n export const styles = css`:host{--md-elevation-level: var(--md-menu-container-elevation, 2);--md-elevation-shadow-color: var(--md-menu-container-shadow-color, var(--md-sys-color-shadow, #000));min-width:112px;color:unset;display:contents}md-focus-ring{--md-focus-ring-shape: var(--md-menu-container-shape, 4px)}.menu{border-radius:var(--md-menu-container-shape, 4px);display:none;inset:auto;border:none;padding:0px;overflow:visible;background-color:rgba(0,0,0,0);color:inherit;opacity:0;z-index:20;position:absolute;user-select:none;max-height:inherit;height:inherit;min-width:inherit;max-width:inherit}.menu::backdrop{display:none}.fixed{position:fixed}.items{display:block;list-style-type:none;margin:0;outline:none;box-sizing:border-box;background-color:var(--md-menu-container-color, var(--md-sys-color-surface-container, #f3edf7));height:inherit;max-height:inherit;overflow:auto;min-width:inherit;max-width:inherit;border-radius:inherit}.item-padding{padding-block:8px}.has-overflow:not([popover]) .items{overflow:visible}.has-overflow.animating .items,.animating .items{overflow:hidden}.has-overflow.animating .items{pointer-events:none}.animating ::slotted(.md-menu-hidden){opacity:0}slot{display:block;height:inherit;max-height:inherit}::slotted(:is(md-divider,[role=separator])){margin:8px 0}@media(forced-colors: active){.menu{border-style:solid;border-color:CanvasText;border-width:1px}}/*# sourceMappingURL=menu-styles.css.map */\n`;\n "]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@material/web",
|
|
3
|
-
"version": "1.1.
|
|
3
|
+
"version": "1.1.2-nightly.50a9ffa.0",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -29,8 +29,9 @@
|
|
|
29
29
|
"build:sass": "wireit",
|
|
30
30
|
"test": "wireit",
|
|
31
31
|
"build:catalog": "wireit",
|
|
32
|
-
"build:
|
|
33
|
-
"update-docs": "wireit"
|
|
32
|
+
"build:scripts": "wireit",
|
|
33
|
+
"update-docs": "wireit",
|
|
34
|
+
"update-size": "wireit"
|
|
34
35
|
},
|
|
35
36
|
"type": "module",
|
|
36
37
|
"files": [
|
|
@@ -56,10 +57,14 @@
|
|
|
56
57
|
},
|
|
57
58
|
"devDependencies": {
|
|
58
59
|
"@lit-labs/analyzer": "^0.9.2",
|
|
60
|
+
"@rollup/plugin-multi-entry": "^6.0.1",
|
|
61
|
+
"@rollup/plugin-node-resolve": "^15.2.3",
|
|
62
|
+
"@rollup/plugin-terser": "^0.4.4",
|
|
59
63
|
"@types/jasmine": "^4.0.3",
|
|
60
64
|
"@web/test-runner": "^0.15.0",
|
|
61
65
|
"@web/test-runner-playwright": "^0.9.0",
|
|
62
66
|
"jasmine": "^4.5.0",
|
|
67
|
+
"rollup": "^2.79.1",
|
|
63
68
|
"sass": "^1.52.3",
|
|
64
69
|
"sass-true": "^6.1.0",
|
|
65
70
|
"typescript": "5.1.6",
|
|
@@ -145,19 +150,19 @@
|
|
|
145
150
|
"./catalog:build:prod"
|
|
146
151
|
]
|
|
147
152
|
},
|
|
148
|
-
"build:
|
|
153
|
+
"build:scripts": {
|
|
149
154
|
"command": "tsc -b scripts/tsconfig.json --pretty",
|
|
150
155
|
"files": [
|
|
151
156
|
"scripts/tsconfig.json",
|
|
152
|
-
"scripts
|
|
157
|
+
"scripts/**/*.ts",
|
|
153
158
|
"!**/*.d.ts",
|
|
154
159
|
"!**/*.css.ts"
|
|
155
160
|
],
|
|
156
161
|
"output": [
|
|
157
162
|
"scripts/.tsbuildinfo",
|
|
158
|
-
"scripts
|
|
159
|
-
"scripts
|
|
160
|
-
"scripts
|
|
163
|
+
"scripts/**/*.js",
|
|
164
|
+
"scripts/**/*.js.map",
|
|
165
|
+
"scripts/**/*.d.ts"
|
|
161
166
|
],
|
|
162
167
|
"clean": "if-file-deleted"
|
|
163
168
|
},
|
|
@@ -175,7 +180,14 @@
|
|
|
175
180
|
],
|
|
176
181
|
"output": [],
|
|
177
182
|
"dependencies": [
|
|
178
|
-
"build:
|
|
183
|
+
"build:scripts"
|
|
184
|
+
]
|
|
185
|
+
},
|
|
186
|
+
"update-size": {
|
|
187
|
+
"command": "node scripts/size/update-size.js",
|
|
188
|
+
"dependencies": [
|
|
189
|
+
"build:scripts",
|
|
190
|
+
"build"
|
|
179
191
|
]
|
|
180
192
|
}
|
|
181
193
|
}
|
package/radio/internal/radio.js
CHANGED
|
@@ -10,7 +10,7 @@ import '../../ripple/ripple.js';
|
|
|
10
10
|
import { html, isServer, LitElement } from 'lit';
|
|
11
11
|
import { property, query } from 'lit/decorators.js';
|
|
12
12
|
import { classMap } from 'lit/directives/class-map.js';
|
|
13
|
-
import { isActivationClick } from '../../internal/
|
|
13
|
+
import { isActivationClick } from '../../internal/events/form-label-activation.js';
|
|
14
14
|
import { createValidator, getValidityAnchor, mixinConstraintValidation, } from '../../labs/behaviors/constraint-validation.js';
|
|
15
15
|
import { internals, mixinElementInternals, } from '../../labs/behaviors/element-internals.js';
|
|
16
16
|
import { mixinFocusable } from '../../labs/behaviors/focusable.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"radio.js","sourceRoot":"","sources":["radio.ts"],"names":[],"mappings":"AAAA;;;;GAIG;;;AAEH,OAAO,8BAA8B,CAAC;AACtC,OAAO,wBAAwB,CAAC;AAEhC,OAAO,EAAC,IAAI,EAAE,QAAQ,EAAE,UAAU,EAAC,MAAM,KAAK,CAAC;AAC/C,OAAO,EAAC,QAAQ,EAAE,KAAK,EAAC,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,iBAAiB,EAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"radio.js","sourceRoot":"","sources":["radio.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport '../../focus/md-focus-ring.js';\nimport '../../ripple/ripple.js';\n\nimport {html, isServer, LitElement} from 'lit';\nimport {property, query} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {isActivationClick} from '../../internal/events/form-label-activation.js';\nimport {\n createValidator,\n getValidityAnchor,\n mixinConstraintValidation,\n} from '../../labs/behaviors/constraint-validation.js';\nimport {\n internals,\n mixinElementInternals,\n} from '../../labs/behaviors/element-internals.js';\nimport {mixinFocusable} from '../../labs/behaviors/focusable.js';\nimport {\n getFormState,\n getFormValue,\n mixinFormAssociated,\n} from '../../labs/behaviors/form-associated.js';\nimport {RadioValidator} from '../../labs/behaviors/validators/radio-validator.js';\n\nimport {SingleSelectionController} from './single-selection-controller.js';\n\nconst CHECKED = Symbol('checked');\nlet maskId = 0;\n\n// Separate variable needed for closure.\nconst radioBaseClass = mixinConstraintValidation(\n mixinFormAssociated(mixinElementInternals(mixinFocusable(LitElement))),\n);\n\n/**\n * A radio component.\n *\n * @fires input {InputEvent} Dispatched when the value changes from user\n * interaction. --bubbles\n * @fires change {Event} Dispatched when the value changes from user\n * interaction. --bubbles --composed\n */\nexport class Radio extends radioBaseClass {\n // Unique maskId is required because of a Safari bug that fail to persist\n // reference to the mask. This should be removed once the bug is fixed.\n private readonly maskId = `cutout${++maskId}`;\n\n /**\n * Whether or not the radio is selected.\n */\n @property({type: Boolean})\n get checked() {\n return this[CHECKED];\n }\n set checked(checked: boolean) {\n const wasChecked = this.checked;\n if (wasChecked === checked) {\n return;\n }\n\n this[CHECKED] = checked;\n this.requestUpdate('checked', wasChecked);\n this.selectionController.handleCheckedChange();\n }\n\n [CHECKED] = false;\n\n /**\n * Whether or not the radio is required. If any radio is required in a group,\n * all radios are implicitly required.\n */\n @property({type: Boolean}) required = false;\n\n /**\n * The element value to use in form submission when checked.\n */\n @property() value = 'on';\n\n @query('.container') private readonly container!: HTMLElement;\n private readonly selectionController = new SingleSelectionController(this);\n\n constructor() {\n super();\n this.addController(this.selectionController);\n if (!isServer) {\n this[internals].role = 'radio';\n this.addEventListener('click', this.handleClick.bind(this));\n this.addEventListener('keydown', this.handleKeydown.bind(this));\n }\n }\n\n protected override render() {\n const classes = {'checked': this.checked};\n return html`\n <div class=\"container ${classMap(classes)}\" aria-hidden=\"true\">\n <md-ripple\n part=\"ripple\"\n .control=${this}\n ?disabled=${this.disabled}></md-ripple>\n <md-focus-ring part=\"focus-ring\" .control=${this}></md-focus-ring>\n <svg class=\"icon\" viewBox=\"0 0 20 20\">\n <mask id=\"${this.maskId}\">\n <rect width=\"100%\" height=\"100%\" fill=\"white\" />\n <circle cx=\"10\" cy=\"10\" r=\"8\" fill=\"black\" />\n </mask>\n <circle\n class=\"outer circle\"\n cx=\"10\"\n cy=\"10\"\n r=\"10\"\n mask=\"url(#${this.maskId})\" />\n <circle class=\"inner circle\" cx=\"10\" cy=\"10\" r=\"5\" />\n </svg>\n\n <input\n id=\"input\"\n type=\"radio\"\n tabindex=\"-1\"\n .checked=${this.checked}\n .value=${this.value}\n ?disabled=${this.disabled} />\n </div>\n `;\n }\n\n protected override updated() {\n this[internals].ariaChecked = String(this.checked);\n }\n\n private async handleClick(event: Event) {\n if (this.disabled) {\n return;\n }\n\n // allow event to propagate to user code after a microtask.\n await 0;\n if (event.defaultPrevented) {\n return;\n }\n\n if (isActivationClick(event)) {\n this.focus();\n }\n\n // Per spec, clicking on a radio input always selects it.\n this.checked = true;\n this.dispatchEvent(new Event('change', {bubbles: true}));\n this.dispatchEvent(\n new InputEvent('input', {bubbles: true, composed: true}),\n );\n }\n\n private async handleKeydown(event: KeyboardEvent) {\n // allow event to propagate to user code after a microtask.\n await 0;\n if (event.key !== ' ' || event.defaultPrevented) {\n return;\n }\n\n this.click();\n }\n\n // Writable mixin properties for lit-html binding, needed for lit-analyzer\n declare disabled: boolean;\n declare name: string;\n\n override [getFormValue]() {\n return this.checked ? this.value : null;\n }\n\n override [getFormState]() {\n return String(this.checked);\n }\n\n override formResetCallback() {\n // The checked property does not reflect, so the original attribute set by\n // the user is used to determine the default value.\n this.checked = this.hasAttribute('checked');\n }\n\n override formStateRestoreCallback(state: string) {\n this.checked = state === 'true';\n }\n\n [createValidator]() {\n return new RadioValidator(() => {\n if (!this.selectionController) {\n // Validation runs on superclass construction, so selection controller\n // might not actually be ready until this class constructs.\n return [this];\n }\n\n return this.selectionController.controls as [Radio, ...Radio[]];\n });\n }\n\n [getValidityAnchor]() {\n return this.container;\n }\n}\n"]}
|
|
@@ -79,6 +79,13 @@ const EVENTS = [
|
|
|
79
79
|
* scroll interaction.
|
|
80
80
|
*/
|
|
81
81
|
const TOUCH_DELAY_MS = 150;
|
|
82
|
+
/**
|
|
83
|
+
* Used to detect if HCM is active. Events do not process during HCM when the
|
|
84
|
+
* ripple is not displayed.
|
|
85
|
+
*/
|
|
86
|
+
const FORCED_COLORS = isServer
|
|
87
|
+
? null
|
|
88
|
+
: window.matchMedia('(forced-colors: active)');
|
|
82
89
|
/**
|
|
83
90
|
* A ripple component.
|
|
84
91
|
*/
|
|
@@ -361,6 +368,10 @@ export class Ripple extends LitElement {
|
|
|
361
368
|
}
|
|
362
369
|
/** @private */
|
|
363
370
|
async handleEvent(event) {
|
|
371
|
+
if (FORCED_COLORS?.matches) {
|
|
372
|
+
// Skip event logic since the ripple is `display: none`.
|
|
373
|
+
return;
|
|
374
|
+
}
|
|
364
375
|
switch (event.type) {
|
|
365
376
|
case 'click':
|
|
366
377
|
this.handleClick();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ripple.js","sourceRoot":"","sources":["ripple.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, isServer, LitElement, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {\n Attachable,\n AttachableController,\n} from '../../internal/controller/attachable-controller.js';\nimport {EASING} from '../../internal/motion/animation.js';\n\nconst PRESS_GROW_MS = 450;\nconst MINIMUM_PRESS_MS = 225;\nconst INITIAL_ORIGIN_SCALE = 0.2;\nconst PADDING = 10;\nconst SOFT_EDGE_MINIMUM_SIZE = 75;\nconst SOFT_EDGE_CONTAINER_RATIO = 0.35;\nconst PRESS_PSEUDO = '::after';\nconst ANIMATION_FILL = 'forwards';\n\n/**\n * Interaction states for the ripple.\n *\n * On Touch:\n * - `INACTIVE -> TOUCH_DELAY -> WAITING_FOR_CLICK -> INACTIVE`\n * - `INACTIVE -> TOUCH_DELAY -> HOLDING -> WAITING_FOR_CLICK -> INACTIVE`\n *\n * On Mouse or Pen:\n * - `INACTIVE -> WAITING_FOR_CLICK -> INACTIVE`\n */\nenum State {\n /**\n * Initial state of the control, no touch in progress.\n *\n * Transitions:\n * - on touch down: transition to `TOUCH_DELAY`.\n * - on mouse down: transition to `WAITING_FOR_CLICK`.\n */\n INACTIVE,\n /**\n * Touch down has been received, waiting to determine if it's a swipe or\n * scroll.\n *\n * Transitions:\n * - on touch up: begin press; transition to `WAITING_FOR_CLICK`.\n * - on cancel: transition to `INACTIVE`.\n * - after `TOUCH_DELAY_MS`: begin press; transition to `HOLDING`.\n */\n TOUCH_DELAY,\n /**\n * A touch has been deemed to be a press\n *\n * Transitions:\n * - on up: transition to `WAITING_FOR_CLICK`.\n */\n HOLDING,\n /**\n * The user touch has finished, transition into rest state.\n *\n * Transitions:\n * - on click end press; transition to `INACTIVE`.\n */\n WAITING_FOR_CLICK,\n}\n\n/**\n * Events that the ripple listens to.\n */\nconst EVENTS = [\n 'click',\n 'contextmenu',\n 'pointercancel',\n 'pointerdown',\n 'pointerenter',\n 'pointerleave',\n 'pointerup',\n];\n\n/**\n * Delay reacting to touch so that we do not show the ripple for a swipe or\n * scroll interaction.\n */\nconst TOUCH_DELAY_MS = 150;\n\n/**\n * A ripple component.\n */\nexport class Ripple extends LitElement implements Attachable {\n /**\n * Disables the ripple.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n get htmlFor() {\n return this.attachableController.htmlFor;\n }\n\n set htmlFor(htmlFor: string | null) {\n this.attachableController.htmlFor = htmlFor;\n }\n\n get control() {\n return this.attachableController.control;\n }\n set control(control: HTMLElement | null) {\n this.attachableController.control = control;\n }\n\n @state() private hovered = false;\n @state() private pressed = false;\n\n @query('.surface') private readonly mdRoot!: HTMLElement | null;\n private rippleSize = '';\n private rippleScale = '';\n private initialSize = 0;\n private growAnimation?: Animation;\n private state = State.INACTIVE;\n private rippleStartEvent?: PointerEvent;\n private checkBoundsAfterContextMenu = false;\n private readonly attachableController = new AttachableController(\n this,\n this.onControlChange.bind(this),\n );\n\n attach(control: HTMLElement) {\n this.attachableController.attach(control);\n }\n\n detach() {\n this.attachableController.detach();\n }\n\n override connectedCallback() {\n super.connectedCallback();\n // Needed for VoiceOver, which will create a \"group\" if the element is a\n // sibling to other content.\n this.setAttribute('aria-hidden', 'true');\n }\n\n protected override render() {\n const classes = {\n 'hovered': this.hovered,\n 'pressed': this.pressed,\n };\n\n return html`<div class=\"surface ${classMap(classes)}\"></div>`;\n }\n\n protected override update(changedProps: PropertyValues<Ripple>) {\n if (changedProps.has('disabled') && this.disabled) {\n this.hovered = false;\n this.pressed = false;\n }\n super.update(changedProps);\n }\n\n /**\n * TODO(b/269799771): make private\n * @private only public for slider\n */\n handlePointerenter(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.hovered = true;\n }\n\n /**\n * TODO(b/269799771): make private\n * @private only public for slider\n */\n handlePointerleave(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.hovered = false;\n\n // release a held mouse or pen press that moves outside the element\n if (this.state !== State.INACTIVE) {\n this.endPressAnimation();\n }\n }\n\n private handlePointerup(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n if (this.state === State.HOLDING) {\n this.state = State.WAITING_FOR_CLICK;\n return;\n }\n\n if (this.state === State.TOUCH_DELAY) {\n this.state = State.WAITING_FOR_CLICK;\n this.startPressAnimation(this.rippleStartEvent);\n return;\n }\n }\n\n private async handlePointerdown(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.rippleStartEvent = event;\n if (!this.isTouch(event)) {\n this.state = State.WAITING_FOR_CLICK;\n this.startPressAnimation(event);\n return;\n }\n\n // after a longpress contextmenu event, an extra `pointerdown` can be\n // dispatched to the pressed element. Check that the down is within\n // bounds of the element in this case.\n if (this.checkBoundsAfterContextMenu && !this.inBounds(event)) {\n return;\n }\n\n this.checkBoundsAfterContextMenu = false;\n\n // Wait for a hold after touch delay\n this.state = State.TOUCH_DELAY;\n await new Promise((resolve) => {\n setTimeout(resolve, TOUCH_DELAY_MS);\n });\n\n if (this.state !== State.TOUCH_DELAY) {\n return;\n }\n\n this.state = State.HOLDING;\n this.startPressAnimation(event);\n }\n\n private handleClick() {\n // Click is a MouseEvent in Firefox and Safari, so we cannot use\n // `shouldReactToEvent`\n if (this.disabled) {\n return;\n }\n\n if (this.state === State.WAITING_FOR_CLICK) {\n this.endPressAnimation();\n return;\n }\n\n if (this.state === State.INACTIVE) {\n // keyboard synthesized click event\n this.startPressAnimation();\n this.endPressAnimation();\n }\n }\n\n private handlePointercancel(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.endPressAnimation();\n }\n\n private handleContextmenu() {\n if (this.disabled) {\n return;\n }\n\n this.checkBoundsAfterContextMenu = true;\n this.endPressAnimation();\n }\n\n private determineRippleSize() {\n const {height, width} = this.getBoundingClientRect();\n const maxDim = Math.max(height, width);\n const softEdgeSize = Math.max(\n SOFT_EDGE_CONTAINER_RATIO * maxDim,\n SOFT_EDGE_MINIMUM_SIZE,\n );\n\n const initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);\n const hypotenuse = Math.sqrt(width ** 2 + height ** 2);\n const maxRadius = hypotenuse + PADDING;\n\n this.initialSize = initialSize;\n this.rippleScale = `${(maxRadius + softEdgeSize) / initialSize}`;\n this.rippleSize = `${initialSize}px`;\n }\n\n private getNormalizedPointerEventCoords(pointerEvent: PointerEvent): {\n x: number;\n y: number;\n } {\n const {scrollX, scrollY} = window;\n const {left, top} = this.getBoundingClientRect();\n const documentX = scrollX + left;\n const documentY = scrollY + top;\n const {pageX, pageY} = pointerEvent;\n return {x: pageX - documentX, y: pageY - documentY};\n }\n\n private getTranslationCoordinates(positionEvent?: Event) {\n const {height, width} = this.getBoundingClientRect();\n // end in the center\n const endPoint = {\n x: (width - this.initialSize) / 2,\n y: (height - this.initialSize) / 2,\n };\n\n let startPoint;\n if (positionEvent instanceof PointerEvent) {\n startPoint = this.getNormalizedPointerEventCoords(positionEvent);\n } else {\n startPoint = {\n x: width / 2,\n y: height / 2,\n };\n }\n\n // center around start point\n startPoint = {\n x: startPoint.x - this.initialSize / 2,\n y: startPoint.y - this.initialSize / 2,\n };\n\n return {startPoint, endPoint};\n }\n\n private startPressAnimation(positionEvent?: Event) {\n if (!this.mdRoot) {\n return;\n }\n\n this.pressed = true;\n this.growAnimation?.cancel();\n this.determineRippleSize();\n const {startPoint, endPoint} =\n this.getTranslationCoordinates(positionEvent);\n const translateStart = `${startPoint.x}px, ${startPoint.y}px`;\n const translateEnd = `${endPoint.x}px, ${endPoint.y}px`;\n\n this.growAnimation = this.mdRoot.animate(\n {\n top: [0, 0],\n left: [0, 0],\n height: [this.rippleSize, this.rippleSize],\n width: [this.rippleSize, this.rippleSize],\n transform: [\n `translate(${translateStart}) scale(1)`,\n `translate(${translateEnd}) scale(${this.rippleScale})`,\n ],\n },\n {\n pseudoElement: PRESS_PSEUDO,\n duration: PRESS_GROW_MS,\n easing: EASING.STANDARD,\n fill: ANIMATION_FILL,\n },\n );\n }\n\n private async endPressAnimation() {\n this.state = State.INACTIVE;\n const animation = this.growAnimation;\n let pressAnimationPlayState = Infinity;\n if (typeof animation?.currentTime === 'number') {\n pressAnimationPlayState = animation.currentTime;\n } else if (animation?.currentTime) {\n pressAnimationPlayState = animation.currentTime.to('ms').value;\n }\n\n if (pressAnimationPlayState >= MINIMUM_PRESS_MS) {\n this.pressed = false;\n return;\n }\n\n await new Promise((resolve) => {\n setTimeout(resolve, MINIMUM_PRESS_MS - pressAnimationPlayState);\n });\n\n if (this.growAnimation !== animation) {\n // A new press animation was started. The old animation was canceled and\n // should not finish the pressed state.\n return;\n }\n\n this.pressed = false;\n }\n\n /**\n * Returns `true` if\n * - the ripple element is enabled\n * - the pointer is primary for the input type\n * - the pointer is the pointer that started the interaction, or will start\n * the interaction\n * - the pointer is a touch, or the pointer state has the primary button\n * held, or the pointer is hovering\n */\n private shouldReactToEvent(event: PointerEvent) {\n if (this.disabled || !event.isPrimary) {\n return false;\n }\n\n if (\n this.rippleStartEvent &&\n this.rippleStartEvent.pointerId !== event.pointerId\n ) {\n return false;\n }\n\n if (event.type === 'pointerenter' || event.type === 'pointerleave') {\n return !this.isTouch(event);\n }\n\n const isPrimaryButton = event.buttons === 1;\n return this.isTouch(event) || isPrimaryButton;\n }\n\n /**\n * Check if the event is within the bounds of the element.\n *\n * This is only needed for the \"stuck\" contextmenu longpress on Chrome.\n */\n private inBounds({x, y}: PointerEvent) {\n const {top, left, bottom, right} = this.getBoundingClientRect();\n return x >= left && x <= right && y >= top && y <= bottom;\n }\n\n private isTouch({pointerType}: PointerEvent) {\n return pointerType === 'touch';\n }\n\n /** @private */\n async handleEvent(event: Event) {\n switch (event.type) {\n case 'click':\n this.handleClick();\n break;\n case 'contextmenu':\n this.handleContextmenu();\n break;\n case 'pointercancel':\n this.handlePointercancel(event as PointerEvent);\n break;\n case 'pointerdown':\n await this.handlePointerdown(event as PointerEvent);\n break;\n case 'pointerenter':\n this.handlePointerenter(event as PointerEvent);\n break;\n case 'pointerleave':\n this.handlePointerleave(event as PointerEvent);\n break;\n case 'pointerup':\n this.handlePointerup(event as PointerEvent);\n break;\n default:\n break;\n }\n }\n\n private onControlChange(prev: HTMLElement | null, next: HTMLElement | null) {\n if (isServer) return;\n\n for (const event of EVENTS) {\n prev?.removeEventListener(event, this);\n next?.addEventListener(event, this);\n }\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"ripple.js","sourceRoot":"","sources":["ripple.ts"],"names":[],"mappings":"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","sourcesContent":["/**\n * @license\n * Copyright 2022 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport {html, isServer, LitElement, PropertyValues} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\n\nimport {\n Attachable,\n AttachableController,\n} from '../../internal/controller/attachable-controller.js';\nimport {EASING} from '../../internal/motion/animation.js';\n\nconst PRESS_GROW_MS = 450;\nconst MINIMUM_PRESS_MS = 225;\nconst INITIAL_ORIGIN_SCALE = 0.2;\nconst PADDING = 10;\nconst SOFT_EDGE_MINIMUM_SIZE = 75;\nconst SOFT_EDGE_CONTAINER_RATIO = 0.35;\nconst PRESS_PSEUDO = '::after';\nconst ANIMATION_FILL = 'forwards';\n\n/**\n * Interaction states for the ripple.\n *\n * On Touch:\n * - `INACTIVE -> TOUCH_DELAY -> WAITING_FOR_CLICK -> INACTIVE`\n * - `INACTIVE -> TOUCH_DELAY -> HOLDING -> WAITING_FOR_CLICK -> INACTIVE`\n *\n * On Mouse or Pen:\n * - `INACTIVE -> WAITING_FOR_CLICK -> INACTIVE`\n */\nenum State {\n /**\n * Initial state of the control, no touch in progress.\n *\n * Transitions:\n * - on touch down: transition to `TOUCH_DELAY`.\n * - on mouse down: transition to `WAITING_FOR_CLICK`.\n */\n INACTIVE,\n /**\n * Touch down has been received, waiting to determine if it's a swipe or\n * scroll.\n *\n * Transitions:\n * - on touch up: begin press; transition to `WAITING_FOR_CLICK`.\n * - on cancel: transition to `INACTIVE`.\n * - after `TOUCH_DELAY_MS`: begin press; transition to `HOLDING`.\n */\n TOUCH_DELAY,\n /**\n * A touch has been deemed to be a press\n *\n * Transitions:\n * - on up: transition to `WAITING_FOR_CLICK`.\n */\n HOLDING,\n /**\n * The user touch has finished, transition into rest state.\n *\n * Transitions:\n * - on click end press; transition to `INACTIVE`.\n */\n WAITING_FOR_CLICK,\n}\n\n/**\n * Events that the ripple listens to.\n */\nconst EVENTS = [\n 'click',\n 'contextmenu',\n 'pointercancel',\n 'pointerdown',\n 'pointerenter',\n 'pointerleave',\n 'pointerup',\n];\n\n/**\n * Delay reacting to touch so that we do not show the ripple for a swipe or\n * scroll interaction.\n */\nconst TOUCH_DELAY_MS = 150;\n\n/**\n * Used to detect if HCM is active. Events do not process during HCM when the\n * ripple is not displayed.\n */\nconst FORCED_COLORS = isServer\n ? null\n : window.matchMedia('(forced-colors: active)');\n\n/**\n * A ripple component.\n */\nexport class Ripple extends LitElement implements Attachable {\n /**\n * Disables the ripple.\n */\n @property({type: Boolean, reflect: true}) disabled = false;\n\n get htmlFor() {\n return this.attachableController.htmlFor;\n }\n\n set htmlFor(htmlFor: string | null) {\n this.attachableController.htmlFor = htmlFor;\n }\n\n get control() {\n return this.attachableController.control;\n }\n set control(control: HTMLElement | null) {\n this.attachableController.control = control;\n }\n\n @state() private hovered = false;\n @state() private pressed = false;\n\n @query('.surface') private readonly mdRoot!: HTMLElement | null;\n private rippleSize = '';\n private rippleScale = '';\n private initialSize = 0;\n private growAnimation?: Animation;\n private state = State.INACTIVE;\n private rippleStartEvent?: PointerEvent;\n private checkBoundsAfterContextMenu = false;\n private readonly attachableController = new AttachableController(\n this,\n this.onControlChange.bind(this),\n );\n\n attach(control: HTMLElement) {\n this.attachableController.attach(control);\n }\n\n detach() {\n this.attachableController.detach();\n }\n\n override connectedCallback() {\n super.connectedCallback();\n // Needed for VoiceOver, which will create a \"group\" if the element is a\n // sibling to other content.\n this.setAttribute('aria-hidden', 'true');\n }\n\n protected override render() {\n const classes = {\n 'hovered': this.hovered,\n 'pressed': this.pressed,\n };\n\n return html`<div class=\"surface ${classMap(classes)}\"></div>`;\n }\n\n protected override update(changedProps: PropertyValues<Ripple>) {\n if (changedProps.has('disabled') && this.disabled) {\n this.hovered = false;\n this.pressed = false;\n }\n super.update(changedProps);\n }\n\n /**\n * TODO(b/269799771): make private\n * @private only public for slider\n */\n handlePointerenter(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.hovered = true;\n }\n\n /**\n * TODO(b/269799771): make private\n * @private only public for slider\n */\n handlePointerleave(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.hovered = false;\n\n // release a held mouse or pen press that moves outside the element\n if (this.state !== State.INACTIVE) {\n this.endPressAnimation();\n }\n }\n\n private handlePointerup(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n if (this.state === State.HOLDING) {\n this.state = State.WAITING_FOR_CLICK;\n return;\n }\n\n if (this.state === State.TOUCH_DELAY) {\n this.state = State.WAITING_FOR_CLICK;\n this.startPressAnimation(this.rippleStartEvent);\n return;\n }\n }\n\n private async handlePointerdown(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.rippleStartEvent = event;\n if (!this.isTouch(event)) {\n this.state = State.WAITING_FOR_CLICK;\n this.startPressAnimation(event);\n return;\n }\n\n // after a longpress contextmenu event, an extra `pointerdown` can be\n // dispatched to the pressed element. Check that the down is within\n // bounds of the element in this case.\n if (this.checkBoundsAfterContextMenu && !this.inBounds(event)) {\n return;\n }\n\n this.checkBoundsAfterContextMenu = false;\n\n // Wait for a hold after touch delay\n this.state = State.TOUCH_DELAY;\n await new Promise((resolve) => {\n setTimeout(resolve, TOUCH_DELAY_MS);\n });\n\n if (this.state !== State.TOUCH_DELAY) {\n return;\n }\n\n this.state = State.HOLDING;\n this.startPressAnimation(event);\n }\n\n private handleClick() {\n // Click is a MouseEvent in Firefox and Safari, so we cannot use\n // `shouldReactToEvent`\n if (this.disabled) {\n return;\n }\n\n if (this.state === State.WAITING_FOR_CLICK) {\n this.endPressAnimation();\n return;\n }\n\n if (this.state === State.INACTIVE) {\n // keyboard synthesized click event\n this.startPressAnimation();\n this.endPressAnimation();\n }\n }\n\n private handlePointercancel(event: PointerEvent) {\n if (!this.shouldReactToEvent(event)) {\n return;\n }\n\n this.endPressAnimation();\n }\n\n private handleContextmenu() {\n if (this.disabled) {\n return;\n }\n\n this.checkBoundsAfterContextMenu = true;\n this.endPressAnimation();\n }\n\n private determineRippleSize() {\n const {height, width} = this.getBoundingClientRect();\n const maxDim = Math.max(height, width);\n const softEdgeSize = Math.max(\n SOFT_EDGE_CONTAINER_RATIO * maxDim,\n SOFT_EDGE_MINIMUM_SIZE,\n );\n\n const initialSize = Math.floor(maxDim * INITIAL_ORIGIN_SCALE);\n const hypotenuse = Math.sqrt(width ** 2 + height ** 2);\n const maxRadius = hypotenuse + PADDING;\n\n this.initialSize = initialSize;\n this.rippleScale = `${(maxRadius + softEdgeSize) / initialSize}`;\n this.rippleSize = `${initialSize}px`;\n }\n\n private getNormalizedPointerEventCoords(pointerEvent: PointerEvent): {\n x: number;\n y: number;\n } {\n const {scrollX, scrollY} = window;\n const {left, top} = this.getBoundingClientRect();\n const documentX = scrollX + left;\n const documentY = scrollY + top;\n const {pageX, pageY} = pointerEvent;\n return {x: pageX - documentX, y: pageY - documentY};\n }\n\n private getTranslationCoordinates(positionEvent?: Event) {\n const {height, width} = this.getBoundingClientRect();\n // end in the center\n const endPoint = {\n x: (width - this.initialSize) / 2,\n y: (height - this.initialSize) / 2,\n };\n\n let startPoint;\n if (positionEvent instanceof PointerEvent) {\n startPoint = this.getNormalizedPointerEventCoords(positionEvent);\n } else {\n startPoint = {\n x: width / 2,\n y: height / 2,\n };\n }\n\n // center around start point\n startPoint = {\n x: startPoint.x - this.initialSize / 2,\n y: startPoint.y - this.initialSize / 2,\n };\n\n return {startPoint, endPoint};\n }\n\n private startPressAnimation(positionEvent?: Event) {\n if (!this.mdRoot) {\n return;\n }\n\n this.pressed = true;\n this.growAnimation?.cancel();\n this.determineRippleSize();\n const {startPoint, endPoint} =\n this.getTranslationCoordinates(positionEvent);\n const translateStart = `${startPoint.x}px, ${startPoint.y}px`;\n const translateEnd = `${endPoint.x}px, ${endPoint.y}px`;\n\n this.growAnimation = this.mdRoot.animate(\n {\n top: [0, 0],\n left: [0, 0],\n height: [this.rippleSize, this.rippleSize],\n width: [this.rippleSize, this.rippleSize],\n transform: [\n `translate(${translateStart}) scale(1)`,\n `translate(${translateEnd}) scale(${this.rippleScale})`,\n ],\n },\n {\n pseudoElement: PRESS_PSEUDO,\n duration: PRESS_GROW_MS,\n easing: EASING.STANDARD,\n fill: ANIMATION_FILL,\n },\n );\n }\n\n private async endPressAnimation() {\n this.state = State.INACTIVE;\n const animation = this.growAnimation;\n let pressAnimationPlayState = Infinity;\n if (typeof animation?.currentTime === 'number') {\n pressAnimationPlayState = animation.currentTime;\n } else if (animation?.currentTime) {\n pressAnimationPlayState = animation.currentTime.to('ms').value;\n }\n\n if (pressAnimationPlayState >= MINIMUM_PRESS_MS) {\n this.pressed = false;\n return;\n }\n\n await new Promise((resolve) => {\n setTimeout(resolve, MINIMUM_PRESS_MS - pressAnimationPlayState);\n });\n\n if (this.growAnimation !== animation) {\n // A new press animation was started. The old animation was canceled and\n // should not finish the pressed state.\n return;\n }\n\n this.pressed = false;\n }\n\n /**\n * Returns `true` if\n * - the ripple element is enabled\n * - the pointer is primary for the input type\n * - the pointer is the pointer that started the interaction, or will start\n * the interaction\n * - the pointer is a touch, or the pointer state has the primary button\n * held, or the pointer is hovering\n */\n private shouldReactToEvent(event: PointerEvent) {\n if (this.disabled || !event.isPrimary) {\n return false;\n }\n\n if (\n this.rippleStartEvent &&\n this.rippleStartEvent.pointerId !== event.pointerId\n ) {\n return false;\n }\n\n if (event.type === 'pointerenter' || event.type === 'pointerleave') {\n return !this.isTouch(event);\n }\n\n const isPrimaryButton = event.buttons === 1;\n return this.isTouch(event) || isPrimaryButton;\n }\n\n /**\n * Check if the event is within the bounds of the element.\n *\n * This is only needed for the \"stuck\" contextmenu longpress on Chrome.\n */\n private inBounds({x, y}: PointerEvent) {\n const {top, left, bottom, right} = this.getBoundingClientRect();\n return x >= left && x <= right && y >= top && y <= bottom;\n }\n\n private isTouch({pointerType}: PointerEvent) {\n return pointerType === 'touch';\n }\n\n /** @private */\n async handleEvent(event: Event) {\n if (FORCED_COLORS?.matches) {\n // Skip event logic since the ripple is `display: none`.\n return;\n }\n\n switch (event.type) {\n case 'click':\n this.handleClick();\n break;\n case 'contextmenu':\n this.handleContextmenu();\n break;\n case 'pointercancel':\n this.handlePointercancel(event as PointerEvent);\n break;\n case 'pointerdown':\n await this.handlePointerdown(event as PointerEvent);\n break;\n case 'pointerenter':\n this.handlePointerenter(event as PointerEvent);\n break;\n case 'pointerleave':\n this.handlePointerleave(event as PointerEvent);\n break;\n case 'pointerup':\n this.handlePointerup(event as PointerEvent);\n break;\n default:\n break;\n }\n }\n\n private onControlChange(prev: HTMLElement | null, next: HTMLElement | null) {\n if (isServer) return;\n\n for (const event of EVENTS) {\n prev?.removeEventListener(event, this);\n next?.addEventListener(event, this);\n }\n }\n}\n"]}
|
|
@@ -70,10 +70,19 @@
|
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
md-menu {
|
|
73
|
-
|
|
73
|
+
// Not inherited because it is applied every time the menu opens
|
|
74
|
+
min-width: var(--__menu-min-width);
|
|
75
|
+
// Inherits from `.menu-wrapper` because it is applied only when
|
|
76
|
+
// `clampMenuWidth` is true
|
|
74
77
|
max-width: var(--__menu-max-width, inherit);
|
|
75
78
|
}
|
|
76
79
|
|
|
80
|
+
.menu-wrapper {
|
|
81
|
+
width: 0px;
|
|
82
|
+
height: 0px;
|
|
83
|
+
max-width: inherit;
|
|
84
|
+
}
|
|
85
|
+
|
|
77
86
|
md-menu ::slotted(:not[disabled]) {
|
|
78
87
|
cursor: pointer;
|
|
79
88
|
}
|
|
@@ -11,7 +11,7 @@ import { createValidator, getValidityAnchor } from '../../labs/behaviors/constra
|
|
|
11
11
|
import { getFormValue } from '../../labs/behaviors/form-associated.js';
|
|
12
12
|
import { onReportValidity } from '../../labs/behaviors/on-report-validity.js';
|
|
13
13
|
import { SelectValidator } from '../../labs/behaviors/validators/select-validator.js';
|
|
14
|
-
import { SelectOption } from './selectoption/
|
|
14
|
+
import { SelectOption } from './selectoption/select-option.js';
|
|
15
15
|
declare const VALUE: unique symbol;
|
|
16
16
|
declare const selectBaseClass: import("../../labs/behaviors/mixin.js").MixinReturn<import("../../labs/behaviors/mixin.js").MixinReturn<import("../../labs/behaviors/mixin.js").MixinReturn<(abstract new (...args: any[]) => import("../../labs/behaviors/element-internals.js").WithElementInternals) & typeof LitElement & import("../../labs/behaviors/form-associated.js").FormAssociatedConstructor, import("../../labs/behaviors/form-associated.js").FormAssociated>, import("../../labs/behaviors/constraint-validation.js").ConstraintValidation>, import("../../labs/behaviors/on-report-validity.js").OnReportValidity>;
|
|
17
17
|
/**
|
|
@@ -93,6 +93,11 @@ export declare abstract class Select extends selectBaseClass {
|
|
|
93
93
|
* Text to display in the field. Only set for SSR.
|
|
94
94
|
*/
|
|
95
95
|
displayText: string;
|
|
96
|
+
/**
|
|
97
|
+
* Whether the menu should be aligned to the start or the end of the select's
|
|
98
|
+
* textbox.
|
|
99
|
+
*/
|
|
100
|
+
menuAlign: 'start' | 'end';
|
|
96
101
|
/**
|
|
97
102
|
* The value of the currently selected option.
|
|
98
103
|
*
|