@limetech/lime-elements 37.67.0 → 37.69.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/CHANGELOG.md +17 -0
- package/dist/cjs/lime-elements.cjs.js +1 -1
- package/dist/cjs/limel-action-bar-item_2.cjs.entry.js +122 -0
- package/dist/cjs/limel-action-bar-item_2.cjs.entry.js.map +1 -0
- package/dist/cjs/{limel-action-bar_4.cjs.entry.js → limel-action-bar_2.cjs.entry.js} +2 -116
- package/dist/cjs/limel-action-bar_2.cjs.entry.js.map +1 -0
- package/dist/cjs/{limel-breadcrumbs_5.cjs.entry.js → limel-breadcrumbs_7.cjs.entry.js} +3344 -407
- package/dist/cjs/limel-breadcrumbs_7.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-callout.cjs.entry.js +1 -1
- package/dist/cjs/limel-card.cjs.entry.js +85 -0
- package/dist/cjs/limel-card.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-chart.cjs.entry.js +216 -0
- package/dist/cjs/limel-chart.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-chip_2.cjs.entry.js +1 -1
- package/dist/cjs/limel-dynamic-label_2.cjs.entry.js +91 -0
- package/dist/cjs/limel-dynamic-label_2.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-file-viewer.cjs.entry.js +1 -1
- package/dist/cjs/limel-file.cjs.entry.js +1 -1
- package/dist/cjs/limel-flatpickr-adapter.cjs.entry.js +1 -1
- package/dist/cjs/limel-icon.cjs.entry.js +208 -0
- package/dist/cjs/limel-icon.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-linear-progress.cjs.entry.js +1 -1
- package/dist/cjs/{limel-icon_2.cjs.entry.js → limel-portal.cjs.entry.js} +1 -201
- package/dist/cjs/limel-portal.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-prosemirror-adapter.cjs.entry.js +1 -1
- package/dist/cjs/limel-snackbar.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{translations-6c4447f4.js → translations-9ccca4b6.js} +9 -1
- package/dist/cjs/translations-9ccca4b6.js.map +1 -0
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/card/card.css +202 -0
- package/dist/collection/components/card/card.js +282 -0
- package/dist/collection/components/card/card.js.map +1 -0
- package/dist/collection/components/chart/chart.css +758 -0
- package/dist/collection/components/chart/chart.js +418 -0
- package/dist/collection/components/chart/chart.js.map +1 -0
- package/dist/collection/components/chart/chart.types.js +2 -0
- package/dist/collection/components/chart/chart.types.js.map +1 -0
- package/dist/collection/style/mixins.scss +16 -0
- package/dist/collection/translations/da.js +1 -0
- package/dist/collection/translations/da.js.map +1 -1
- package/dist/collection/translations/de.js +1 -0
- package/dist/collection/translations/de.js.map +1 -1
- package/dist/collection/translations/en.js +1 -0
- package/dist/collection/translations/en.js.map +1 -1
- package/dist/collection/translations/fi.js +1 -0
- package/dist/collection/translations/fi.js.map +1 -1
- package/dist/collection/translations/fr.js +1 -0
- package/dist/collection/translations/fr.js.map +1 -1
- package/dist/collection/translations/nl.js +1 -0
- package/dist/collection/translations/nl.js.map +1 -1
- package/dist/collection/translations/no.js +1 -0
- package/dist/collection/translations/no.js.map +1 -1
- package/dist/collection/translations/sv.js +1 -0
- package/dist/collection/translations/sv.js.map +1 -1
- package/dist/esm/lime-elements.js +1 -1
- package/dist/esm/limel-action-bar-item_2.entry.js +117 -0
- package/dist/esm/limel-action-bar-item_2.entry.js.map +1 -0
- package/dist/esm/{limel-action-bar_4.entry.js → limel-action-bar_2.entry.js} +3 -115
- package/dist/esm/limel-action-bar_2.entry.js.map +1 -0
- package/dist/esm/{limel-breadcrumbs_5.entry.js → limel-breadcrumbs_7.entry.js} +3333 -398
- package/dist/esm/limel-breadcrumbs_7.entry.js.map +1 -0
- package/dist/esm/limel-callout.entry.js +1 -1
- package/dist/esm/limel-card.entry.js +81 -0
- package/dist/esm/limel-card.entry.js.map +1 -0
- package/dist/esm/limel-chart.entry.js +212 -0
- package/dist/esm/limel-chart.entry.js.map +1 -0
- package/dist/esm/limel-chip_2.entry.js +1 -1
- package/dist/esm/limel-dynamic-label_2.entry.js +86 -0
- package/dist/esm/limel-dynamic-label_2.entry.js.map +1 -0
- package/dist/esm/limel-file-viewer.entry.js +1 -1
- package/dist/esm/limel-file.entry.js +1 -1
- package/dist/esm/limel-flatpickr-adapter.entry.js +1 -1
- package/dist/esm/limel-icon.entry.js +204 -0
- package/dist/esm/limel-icon.entry.js.map +1 -0
- package/dist/esm/limel-linear-progress.entry.js +1 -1
- package/dist/esm/{limel-icon_2.entry.js → limel-portal.entry.js} +2 -201
- package/dist/esm/limel-portal.entry.js.map +1 -0
- package/dist/esm/limel-prosemirror-adapter.entry.js +1 -1
- package/dist/esm/limel-snackbar.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{translations-26583a3b.js → translations-453e0db7.js} +9 -1
- package/dist/esm/translations-453e0db7.js.map +1 -0
- package/dist/lime-elements/lime-elements.esm.js +1 -1
- package/dist/lime-elements/lime-elements.esm.js.map +1 -1
- package/dist/lime-elements/{p-5d12d8d2.entry.js → p-0ee1d461.entry.js} +2 -2
- package/dist/lime-elements/p-18b068c9.entry.js +2 -0
- package/dist/lime-elements/p-18b068c9.entry.js.map +1 -0
- package/dist/lime-elements/{p-195df464.entry.js → p-1e99b371.entry.js} +2 -2
- package/dist/lime-elements/{p-4fd0ac1e.entry.js → p-2cbfe8f9.entry.js} +2 -2
- package/dist/lime-elements/{p-adfa2c05.entry.js → p-3fcb2b67.entry.js} +2 -2
- package/dist/lime-elements/{p-1a0aaf41.entry.js → p-488decb0.entry.js} +2 -2
- package/dist/lime-elements/p-5d08ef7d.entry.js +2 -0
- package/dist/lime-elements/p-5d08ef7d.entry.js.map +1 -0
- package/dist/lime-elements/p-7f9e0f52.entry.js +2 -0
- package/dist/lime-elements/p-7f9e0f52.entry.js.map +1 -0
- package/dist/lime-elements/p-8915fa60.js +2 -0
- package/dist/lime-elements/p-8915fa60.js.map +1 -0
- package/dist/lime-elements/p-97ae94e0.entry.js +266 -0
- package/dist/lime-elements/p-97ae94e0.entry.js.map +1 -0
- package/dist/lime-elements/{p-fbaa1b19.entry.js → p-9d2f6454.entry.js} +2 -2
- package/dist/lime-elements/p-9f8aa8e7.entry.js +2 -0
- package/dist/lime-elements/p-9f8aa8e7.entry.js.map +1 -0
- package/dist/lime-elements/{p-03eea223.entry.js → p-a451cece.entry.js} +2 -2
- package/dist/lime-elements/p-a8e24972.entry.js +2 -0
- package/dist/lime-elements/p-a8e24972.entry.js.map +1 -0
- package/dist/lime-elements/p-d696f6b8.entry.js +2 -0
- package/dist/lime-elements/p-d696f6b8.entry.js.map +1 -0
- package/dist/lime-elements/p-d93f1964.entry.js +2 -0
- package/dist/lime-elements/p-d93f1964.entry.js.map +1 -0
- package/dist/lime-elements/{p-0f484317.entry.js → p-dd031410.entry.js} +2 -2
- package/dist/lime-elements/style/mixins.scss +16 -0
- package/dist/scss/mixins.scss +16 -0
- package/dist/types/components/card/card.d.ts +75 -0
- package/dist/types/components/chart/chart.d.ts +94 -0
- package/dist/types/components/chart/chart.types.d.ts +25 -0
- package/dist/types/components.d.ts +346 -4
- package/dist/types/translations/da.d.ts +1 -0
- package/dist/types/translations/de.d.ts +1 -0
- package/dist/types/translations/en.d.ts +1 -0
- package/dist/types/translations/fi.d.ts +1 -0
- package/dist/types/translations/fr.d.ts +1 -0
- package/dist/types/translations/nl.d.ts +1 -0
- package/dist/types/translations/no.d.ts +1 -0
- package/dist/types/translations/sv.d.ts +1 -0
- package/package.json +1 -1
- package/dist/cjs/component-864afce0.js +0 -2447
- package/dist/cjs/component-864afce0.js.map +0 -1
- package/dist/cjs/limel-action-bar_4.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-breadcrumbs_5.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-dynamic-label_4.cjs.entry.js +0 -600
- package/dist/cjs/limel-dynamic-label_4.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-icon_2.cjs.entry.js.map +0 -1
- package/dist/cjs/translations-6c4447f4.js.map +0 -1
- package/dist/esm/component-5e233629.js +0 -2439
- package/dist/esm/component-5e233629.js.map +0 -1
- package/dist/esm/limel-action-bar_4.entry.js.map +0 -1
- package/dist/esm/limel-breadcrumbs_5.entry.js.map +0 -1
- package/dist/esm/limel-dynamic-label_4.entry.js +0 -593
- package/dist/esm/limel-dynamic-label_4.entry.js.map +0 -1
- package/dist/esm/limel-icon_2.entry.js.map +0 -1
- package/dist/esm/translations-26583a3b.js.map +0 -1
- package/dist/lime-elements/p-61047574.entry.js +0 -2
- package/dist/lime-elements/p-61047574.entry.js.map +0 -1
- package/dist/lime-elements/p-b9b0853b.entry.js +0 -68
- package/dist/lime-elements/p-b9b0853b.entry.js.map +0 -1
- package/dist/lime-elements/p-bd261424.entry.js +0 -2
- package/dist/lime-elements/p-bd261424.entry.js.map +0 -1
- package/dist/lime-elements/p-d528606a.js +0 -200
- package/dist/lime-elements/p-d528606a.js.map +0 -1
- package/dist/lime-elements/p-e78fcffb.entry.js +0 -2
- package/dist/lime-elements/p-e78fcffb.entry.js.map +0 -1
- package/dist/lime-elements/p-fe15bcbb.js +0 -2
- package/dist/lime-elements/p-fe15bcbb.js.map +0 -1
- /package/dist/lime-elements/{p-5d12d8d2.entry.js.map → p-0ee1d461.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-195df464.entry.js.map → p-1e99b371.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-4fd0ac1e.entry.js.map → p-2cbfe8f9.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-adfa2c05.entry.js.map → p-3fcb2b67.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-1a0aaf41.entry.js.map → p-488decb0.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-fbaa1b19.entry.js.map → p-9d2f6454.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-03eea223.entry.js.map → p-a451cece.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-0f484317.entry.js.map → p-dd031410.entry.js.map} +0 -0
|
@@ -11,11 +11,13 @@ const linkHelper = require('./link-helper-14629490.js');
|
|
|
11
11
|
const config = require('./config-e7e1a299.js');
|
|
12
12
|
const component = require('./component-44f52caf.js');
|
|
13
13
|
const debounce = require('./debounce-2e5f4b7e.js');
|
|
14
|
+
const checkbox_template = require('./checkbox.template-f86d05d4.js');
|
|
15
|
+
const ponyfill = require('./ponyfill-63966294.js');
|
|
14
16
|
const eq = require('./eq-9a943b00.js');
|
|
15
17
|
const zipObject = require('./zipObject-93a471fa.js');
|
|
16
|
-
const
|
|
17
|
-
const component$1 = require('./component-
|
|
18
|
-
const
|
|
18
|
+
const util = require('./util-b0f5741e.js');
|
|
19
|
+
const component$1 = require('./component-a8e11c4c.js');
|
|
20
|
+
const dom = require('./dom-81eaa633.js');
|
|
19
21
|
require('./component-3f00c197.js');
|
|
20
22
|
require('./isObject-e28b7997.js');
|
|
21
23
|
require('./toNumber-062ea29c.js');
|
|
@@ -24,7 +26,6 @@ require('./isObjectLike-3e3f0cba.js');
|
|
|
24
26
|
require('./_assignValue-7c18d8d6.js');
|
|
25
27
|
require('./_defineProperty-8f56146d.js');
|
|
26
28
|
require('./_getNative-60328036.js');
|
|
27
|
-
require('./util-b0f5741e.js');
|
|
28
29
|
|
|
29
30
|
const breadcrumbsCss = "@charset \"UTF-8\";:host(limel-breadcrumbs){--limel-breadcrumbs-item-height:1.5rem;--limel-breadcrumbs-gap:0.75rem;--limel-breadcrumbs-gap:0.75rem;--limel-breadcrumbs-item-text-color:var(\n --breadcrumbs-item-text-color,\n rgb(var(--contrast-1500))\n );--limel-overflow-mask-horizontal:linear-gradient(\n to right,\n transparent 0%,\n black calc(0% + var(--limel-left-edge-fade-width, 1rem)),\n black calc(100% - var(--limel-right-edge-fade-width, 1rem)),\n transparent 100%\n );-webkit-mask-image:var(--limel-overflow-mask-horizontal);mask-image:var(--limel-overflow-mask-horizontal);padding-left:var(--limel-left-edge-fade-width, 1rem);padding-right:var(--limel-right-edge-fade-width, 1rem);--limel-left-edge-fade-width:0.5rem;--limel-right-edge-fade-width:0.5rem}ol,li,.step{all:unset}*{box-sizing:border-box}ol{padding:0.5rem;gap:var(--limel-breadcrumbs-gap)}.step{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:0.25rem;max-width:var(--breadcrumbs-item-max-width, 10rem);height:var(--limel-breadcrumbs-item-height);color:var(--limel-breadcrumbs-item-text-color);border-radius:100vw;font-size:0.875rem;padding:0 0.25rem}.step:not(:has(.text)){padding:0 0.125rem}.step:not(.last):focus{outline:none}.step:not(.last):focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.step:not(.last):after{content:var(--limel-breadcrumbs-divider);display:flex;align-items:center;justify-content:center;width:var(--limel-breadcrumbs-gap);position:absolute;top:0;right:calc(var(--limel-breadcrumbs-gap) * -1);bottom:0;left:auto;text-align:center}a.step{position:relative;cursor:pointer;transition:color 0.2s ease;color:var(--limel-breadcrumbs-item-text-color)}a.step:before{transition:opacity 0.2s ease, transform 0.3s ease-out;content:\"\";position:absolute;inset:auto 0 0 0;width:calc(100% - 0.5rem);margin:auto;height:0.125rem;border-radius:1rem;background-color:currentColor;opacity:0;transform:scale(0.6)}a.step:hover{color:rgb(var(--color-blue-default))}a.step:hover:before{opacity:0.3;transform:scale(1)}button.step:not(.last){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--limel-breadcrumbs-item-text-color);background-color:transparent}button.step:not(.last):hover,button.step:not(.last):focus,button.step:not(.last):focus-visible{will-change:color, background-color, box-shadow, transform}button.step:not(.last):hover{transform:translate3d(0, 0.01rem, 0);color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}button.step:not(.last):active{--limel-clickable-transform-timing-function:cubic-bezier(\n 0.83,\n -0.15,\n 0.49,\n 1.16\n );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}button.step:not(.last):hover,button.step:not(.last):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}limel-icon{flex-shrink:0;width:calc(var(--limel-breadcrumbs-item-height) - 0.25rem);height:calc(var(--limel-breadcrumbs-item-height) - 0.25rem)}.text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0 0.25rem}.last{opacity:0.7}:host(limel-breadcrumbs){box-sizing:border-box;display:flex;width:100%;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;direction:rtl}:host(limel-breadcrumbs)::-webkit-scrollbar{display:none}ol{display:flex;flex-direction:row-reverse;justify-content:flex-end;margin-right:auto}.step{direction:ltr}";
|
|
30
31
|
|
|
@@ -639,431 +640,3258 @@ const InputField = class {
|
|
|
639
640
|
};
|
|
640
641
|
InputField.style = inputFieldCss;
|
|
641
642
|
|
|
642
|
-
|
|
643
|
+
/**
|
|
644
|
+
* @license
|
|
645
|
+
* Copyright 2018 Google Inc.
|
|
646
|
+
*
|
|
647
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
648
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
649
|
+
* in the Software without restriction, including without limitation the rights
|
|
650
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
651
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
652
|
+
* furnished to do so, subject to the following conditions:
|
|
653
|
+
*
|
|
654
|
+
* The above copyright notice and this permission notice shall be included in
|
|
655
|
+
* all copies or substantial portions of the Software.
|
|
656
|
+
*
|
|
657
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
658
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
659
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
660
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
661
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
662
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
663
|
+
* THE SOFTWARE.
|
|
664
|
+
*/
|
|
665
|
+
var _a, _b;
|
|
666
|
+
var cssClasses$2 = {
|
|
667
|
+
LIST_ITEM_ACTIVATED_CLASS: 'mdc-list-item--activated',
|
|
668
|
+
LIST_ITEM_CLASS: 'mdc-list-item',
|
|
669
|
+
LIST_ITEM_DISABLED_CLASS: 'mdc-list-item--disabled',
|
|
670
|
+
LIST_ITEM_SELECTED_CLASS: 'mdc-list-item--selected',
|
|
671
|
+
LIST_ITEM_TEXT_CLASS: 'mdc-list-item__text',
|
|
672
|
+
LIST_ITEM_PRIMARY_TEXT_CLASS: 'mdc-list-item__primary-text',
|
|
673
|
+
ROOT: 'mdc-list',
|
|
674
|
+
};
|
|
675
|
+
var evolutionClassNameMap = (_a = {},
|
|
676
|
+
_a["" + cssClasses$2.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-list-item--activated',
|
|
677
|
+
_a["" + cssClasses$2.LIST_ITEM_CLASS] = 'mdc-list-item',
|
|
678
|
+
_a["" + cssClasses$2.LIST_ITEM_DISABLED_CLASS] = 'mdc-list-item--disabled',
|
|
679
|
+
_a["" + cssClasses$2.LIST_ITEM_SELECTED_CLASS] = 'mdc-list-item--selected',
|
|
680
|
+
_a["" + cssClasses$2.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-list-item__primary-text',
|
|
681
|
+
_a["" + cssClasses$2.ROOT] = 'mdc-list',
|
|
682
|
+
_a);
|
|
683
|
+
var deprecatedClassNameMap = (_b = {},
|
|
684
|
+
_b["" + cssClasses$2.LIST_ITEM_ACTIVATED_CLASS] = 'mdc-deprecated-list-item--activated',
|
|
685
|
+
_b["" + cssClasses$2.LIST_ITEM_CLASS] = 'mdc-deprecated-list-item',
|
|
686
|
+
_b["" + cssClasses$2.LIST_ITEM_DISABLED_CLASS] = 'mdc-deprecated-list-item--disabled',
|
|
687
|
+
_b["" + cssClasses$2.LIST_ITEM_SELECTED_CLASS] = 'mdc-deprecated-list-item--selected',
|
|
688
|
+
_b["" + cssClasses$2.LIST_ITEM_TEXT_CLASS] = 'mdc-deprecated-list-item__text',
|
|
689
|
+
_b["" + cssClasses$2.LIST_ITEM_PRIMARY_TEXT_CLASS] = 'mdc-deprecated-list-item__primary-text',
|
|
690
|
+
_b["" + cssClasses$2.ROOT] = 'mdc-deprecated-list',
|
|
691
|
+
_b);
|
|
692
|
+
var strings$2 = {
|
|
693
|
+
ACTION_EVENT: 'MDCList:action',
|
|
694
|
+
ARIA_CHECKED: 'aria-checked',
|
|
695
|
+
ARIA_CHECKED_CHECKBOX_SELECTOR: '[role="checkbox"][aria-checked="true"]',
|
|
696
|
+
ARIA_CHECKED_RADIO_SELECTOR: '[role="radio"][aria-checked="true"]',
|
|
697
|
+
ARIA_CURRENT: 'aria-current',
|
|
698
|
+
ARIA_DISABLED: 'aria-disabled',
|
|
699
|
+
ARIA_ORIENTATION: 'aria-orientation',
|
|
700
|
+
ARIA_ORIENTATION_HORIZONTAL: 'horizontal',
|
|
701
|
+
ARIA_ROLE_CHECKBOX_SELECTOR: '[role="checkbox"]',
|
|
702
|
+
ARIA_SELECTED: 'aria-selected',
|
|
703
|
+
ARIA_INTERACTIVE_ROLES_SELECTOR: '[role="listbox"], [role="menu"]',
|
|
704
|
+
ARIA_MULTI_SELECTABLE_SELECTOR: '[aria-multiselectable="true"]',
|
|
705
|
+
CHECKBOX_RADIO_SELECTOR: 'input[type="checkbox"], input[type="radio"]',
|
|
706
|
+
CHECKBOX_SELECTOR: 'input[type="checkbox"]',
|
|
707
|
+
CHILD_ELEMENTS_TO_TOGGLE_TABINDEX: "\n ." + cssClasses$2.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses$2.LIST_ITEM_CLASS + " a,\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " a\n ",
|
|
708
|
+
DEPRECATED_SELECTOR: '.mdc-deprecated-list',
|
|
709
|
+
FOCUSABLE_CHILD_ELEMENTS: "\n ." + cssClasses$2.LIST_ITEM_CLASS + " button:not(:disabled),\n ." + cssClasses$2.LIST_ITEM_CLASS + " a,\n ." + cssClasses$2.LIST_ITEM_CLASS + " input[type=\"radio\"]:not(:disabled),\n ." + cssClasses$2.LIST_ITEM_CLASS + " input[type=\"checkbox\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " button:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " a,\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " input[type=\"radio\"]:not(:disabled),\n ." + deprecatedClassNameMap[cssClasses$2.LIST_ITEM_CLASS] + " input[type=\"checkbox\"]:not(:disabled)\n ",
|
|
710
|
+
RADIO_SELECTOR: 'input[type="radio"]',
|
|
711
|
+
SELECTED_ITEM_SELECTOR: '[aria-selected="true"], [aria-current="true"]',
|
|
712
|
+
};
|
|
713
|
+
var numbers$2 = {
|
|
714
|
+
UNSET_INDEX: -1,
|
|
715
|
+
TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS: 300
|
|
716
|
+
};
|
|
717
|
+
var evolutionAttribute = 'evolution';
|
|
643
718
|
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
719
|
+
/**
|
|
720
|
+
* @license
|
|
721
|
+
* Copyright 2020 Google Inc.
|
|
722
|
+
*
|
|
723
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
724
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
725
|
+
* in the Software without restriction, including without limitation the rights
|
|
726
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
727
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
728
|
+
* furnished to do so, subject to the following conditions:
|
|
729
|
+
*
|
|
730
|
+
* The above copyright notice and this permission notice shall be included in
|
|
731
|
+
* all copies or substantial portions of the Software.
|
|
732
|
+
*
|
|
733
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
734
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
735
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
736
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
737
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
738
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
739
|
+
* THE SOFTWARE.
|
|
740
|
+
*/
|
|
741
|
+
/**
|
|
742
|
+
* KEY provides normalized string values for keys.
|
|
743
|
+
*/
|
|
744
|
+
var KEY = {
|
|
745
|
+
UNKNOWN: 'Unknown',
|
|
746
|
+
BACKSPACE: 'Backspace',
|
|
747
|
+
ENTER: 'Enter',
|
|
748
|
+
SPACEBAR: 'Spacebar',
|
|
749
|
+
PAGE_UP: 'PageUp',
|
|
750
|
+
PAGE_DOWN: 'PageDown',
|
|
751
|
+
END: 'End',
|
|
752
|
+
HOME: 'Home',
|
|
753
|
+
ARROW_LEFT: 'ArrowLeft',
|
|
754
|
+
ARROW_UP: 'ArrowUp',
|
|
755
|
+
ARROW_RIGHT: 'ArrowRight',
|
|
756
|
+
ARROW_DOWN: 'ArrowDown',
|
|
757
|
+
DELETE: 'Delete',
|
|
758
|
+
ESCAPE: 'Escape',
|
|
759
|
+
TAB: 'Tab',
|
|
650
760
|
};
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
const listItems = this.list.shadowRoot.querySelectorAll('.mdc-deprecated-list-item');
|
|
762
|
-
const listElement = listItems[0];
|
|
763
|
-
listElement === null || listElement === void 0 ? void 0 : listElement.focus();
|
|
761
|
+
var normalizedKeys = new Set();
|
|
762
|
+
// IE11 has no support for new Map with iterable so we need to initialize this
|
|
763
|
+
// by hand.
|
|
764
|
+
normalizedKeys.add(KEY.BACKSPACE);
|
|
765
|
+
normalizedKeys.add(KEY.ENTER);
|
|
766
|
+
normalizedKeys.add(KEY.SPACEBAR);
|
|
767
|
+
normalizedKeys.add(KEY.PAGE_UP);
|
|
768
|
+
normalizedKeys.add(KEY.PAGE_DOWN);
|
|
769
|
+
normalizedKeys.add(KEY.END);
|
|
770
|
+
normalizedKeys.add(KEY.HOME);
|
|
771
|
+
normalizedKeys.add(KEY.ARROW_LEFT);
|
|
772
|
+
normalizedKeys.add(KEY.ARROW_UP);
|
|
773
|
+
normalizedKeys.add(KEY.ARROW_RIGHT);
|
|
774
|
+
normalizedKeys.add(KEY.ARROW_DOWN);
|
|
775
|
+
normalizedKeys.add(KEY.DELETE);
|
|
776
|
+
normalizedKeys.add(KEY.ESCAPE);
|
|
777
|
+
normalizedKeys.add(KEY.TAB);
|
|
778
|
+
var KEY_CODE = {
|
|
779
|
+
BACKSPACE: 8,
|
|
780
|
+
ENTER: 13,
|
|
781
|
+
SPACEBAR: 32,
|
|
782
|
+
PAGE_UP: 33,
|
|
783
|
+
PAGE_DOWN: 34,
|
|
784
|
+
END: 35,
|
|
785
|
+
HOME: 36,
|
|
786
|
+
ARROW_LEFT: 37,
|
|
787
|
+
ARROW_UP: 38,
|
|
788
|
+
ARROW_RIGHT: 39,
|
|
789
|
+
ARROW_DOWN: 40,
|
|
790
|
+
DELETE: 46,
|
|
791
|
+
ESCAPE: 27,
|
|
792
|
+
TAB: 9,
|
|
793
|
+
};
|
|
794
|
+
var mappedKeyCodes = new Map();
|
|
795
|
+
// IE11 has no support for new Map with iterable so we need to initialize this
|
|
796
|
+
// by hand.
|
|
797
|
+
mappedKeyCodes.set(KEY_CODE.BACKSPACE, KEY.BACKSPACE);
|
|
798
|
+
mappedKeyCodes.set(KEY_CODE.ENTER, KEY.ENTER);
|
|
799
|
+
mappedKeyCodes.set(KEY_CODE.SPACEBAR, KEY.SPACEBAR);
|
|
800
|
+
mappedKeyCodes.set(KEY_CODE.PAGE_UP, KEY.PAGE_UP);
|
|
801
|
+
mappedKeyCodes.set(KEY_CODE.PAGE_DOWN, KEY.PAGE_DOWN);
|
|
802
|
+
mappedKeyCodes.set(KEY_CODE.END, KEY.END);
|
|
803
|
+
mappedKeyCodes.set(KEY_CODE.HOME, KEY.HOME);
|
|
804
|
+
mappedKeyCodes.set(KEY_CODE.ARROW_LEFT, KEY.ARROW_LEFT);
|
|
805
|
+
mappedKeyCodes.set(KEY_CODE.ARROW_UP, KEY.ARROW_UP);
|
|
806
|
+
mappedKeyCodes.set(KEY_CODE.ARROW_RIGHT, KEY.ARROW_RIGHT);
|
|
807
|
+
mappedKeyCodes.set(KEY_CODE.ARROW_DOWN, KEY.ARROW_DOWN);
|
|
808
|
+
mappedKeyCodes.set(KEY_CODE.DELETE, KEY.DELETE);
|
|
809
|
+
mappedKeyCodes.set(KEY_CODE.ESCAPE, KEY.ESCAPE);
|
|
810
|
+
mappedKeyCodes.set(KEY_CODE.TAB, KEY.TAB);
|
|
811
|
+
var navigationKeys = new Set();
|
|
812
|
+
// IE11 has no support for new Set with iterable so we need to initialize this
|
|
813
|
+
// by hand.
|
|
814
|
+
navigationKeys.add(KEY.PAGE_UP);
|
|
815
|
+
navigationKeys.add(KEY.PAGE_DOWN);
|
|
816
|
+
navigationKeys.add(KEY.END);
|
|
817
|
+
navigationKeys.add(KEY.HOME);
|
|
818
|
+
navigationKeys.add(KEY.ARROW_LEFT);
|
|
819
|
+
navigationKeys.add(KEY.ARROW_UP);
|
|
820
|
+
navigationKeys.add(KEY.ARROW_RIGHT);
|
|
821
|
+
navigationKeys.add(KEY.ARROW_DOWN);
|
|
822
|
+
/**
|
|
823
|
+
* normalizeKey returns the normalized string for a navigational action.
|
|
824
|
+
*/
|
|
825
|
+
function normalizeKey(evt) {
|
|
826
|
+
var key = evt.key;
|
|
827
|
+
// If the event already has a normalized key, return it
|
|
828
|
+
if (normalizedKeys.has(key)) {
|
|
829
|
+
return key;
|
|
830
|
+
}
|
|
831
|
+
// tslint:disable-next-line:deprecation
|
|
832
|
+
var mappedKey = mappedKeyCodes.get(evt.keyCode);
|
|
833
|
+
if (mappedKey) {
|
|
834
|
+
return mappedKey;
|
|
835
|
+
}
|
|
836
|
+
return KEY.UNKNOWN;
|
|
837
|
+
}
|
|
838
|
+
|
|
839
|
+
/**
|
|
840
|
+
* @license
|
|
841
|
+
* Copyright 2020 Google Inc.
|
|
842
|
+
*
|
|
843
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
844
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
845
|
+
* in the Software without restriction, including without limitation the rights
|
|
846
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
847
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
848
|
+
* furnished to do so, subject to the following conditions:
|
|
849
|
+
*
|
|
850
|
+
* The above copyright notice and this permission notice shall be included in
|
|
851
|
+
* all copies or substantial portions of the Software.
|
|
852
|
+
*
|
|
853
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
854
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
855
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
856
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
857
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
858
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
859
|
+
* THE SOFTWARE.
|
|
860
|
+
*/
|
|
861
|
+
var ELEMENTS_KEY_ALLOWED_IN = ['input', 'button', 'textarea', 'select'];
|
|
862
|
+
/**
|
|
863
|
+
* Ensures that preventDefault is only called if the containing element
|
|
864
|
+
* doesn't consume the event, and it will cause an unintended scroll.
|
|
865
|
+
*
|
|
866
|
+
* @param evt keyboard event to be prevented.
|
|
867
|
+
*/
|
|
868
|
+
var preventDefaultEvent = function (evt) {
|
|
869
|
+
var target = evt.target;
|
|
870
|
+
if (!target) {
|
|
764
871
|
return;
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
872
|
+
}
|
|
873
|
+
var tagName = ("" + target.tagName).toLowerCase();
|
|
874
|
+
if (ELEMENTS_KEY_ALLOWED_IN.indexOf(tagName) === -1) {
|
|
875
|
+
evt.preventDefault();
|
|
876
|
+
}
|
|
877
|
+
};
|
|
878
|
+
|
|
879
|
+
/**
|
|
880
|
+
* @license
|
|
881
|
+
* Copyright 2020 Google Inc.
|
|
882
|
+
*
|
|
883
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
884
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
885
|
+
* in the Software without restriction, including without limitation the rights
|
|
886
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
887
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
888
|
+
* furnished to do so, subject to the following conditions:
|
|
889
|
+
*
|
|
890
|
+
* The above copyright notice and this permission notice shall be included in
|
|
891
|
+
* all copies or substantial portions of the Software.
|
|
892
|
+
*
|
|
893
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
894
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
895
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
896
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
897
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
898
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
899
|
+
* THE SOFTWARE.
|
|
900
|
+
*/
|
|
901
|
+
/**
|
|
902
|
+
* Initializes a state object for typeahead. Use the same reference for calls to
|
|
903
|
+
* typeahead functions.
|
|
904
|
+
*
|
|
905
|
+
* @return The current state of the typeahead process. Each state reference
|
|
906
|
+
* represents a typeahead instance as the reference is typically mutated
|
|
907
|
+
* in-place.
|
|
908
|
+
*/
|
|
909
|
+
function initState() {
|
|
910
|
+
var state = {
|
|
911
|
+
bufferClearTimeout: 0,
|
|
912
|
+
currentFirstChar: '',
|
|
913
|
+
sortedIndexCursor: 0,
|
|
914
|
+
typeaheadBuffer: '',
|
|
771
915
|
};
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
916
|
+
return state;
|
|
917
|
+
}
|
|
918
|
+
/**
|
|
919
|
+
* Initializes typeahead state by indexing the current list items by primary
|
|
920
|
+
* text into the sortedIndexByFirstChar data structure.
|
|
921
|
+
*
|
|
922
|
+
* @param listItemCount numer of items in the list
|
|
923
|
+
* @param getPrimaryTextByItemIndex function that returns the primary text at a
|
|
924
|
+
* given index
|
|
925
|
+
*
|
|
926
|
+
* @return Map that maps the first character of the primary text to the full
|
|
927
|
+
* list text and it's index
|
|
928
|
+
*/
|
|
929
|
+
function initSortedIndex(listItemCount, getPrimaryTextByItemIndex) {
|
|
930
|
+
var sortedIndexByFirstChar = new Map();
|
|
931
|
+
// Aggregate item text to index mapping
|
|
932
|
+
for (var i = 0; i < listItemCount; i++) {
|
|
933
|
+
var primaryText = getPrimaryTextByItemIndex(i).trim();
|
|
934
|
+
if (!primaryText) {
|
|
935
|
+
continue;
|
|
936
|
+
}
|
|
937
|
+
var firstChar = primaryText[0].toLowerCase();
|
|
938
|
+
if (!sortedIndexByFirstChar.has(firstChar)) {
|
|
939
|
+
sortedIndexByFirstChar.set(firstChar, []);
|
|
940
|
+
}
|
|
941
|
+
sortedIndexByFirstChar.get(firstChar).push({ text: primaryText.toLowerCase(), index: i });
|
|
942
|
+
}
|
|
943
|
+
// Sort the mapping
|
|
944
|
+
// TODO(b/157162694): Investigate replacing forEach with Map.values()
|
|
945
|
+
sortedIndexByFirstChar.forEach(function (values) {
|
|
946
|
+
values.sort(function (first, second) {
|
|
947
|
+
return first.index - second.index;
|
|
948
|
+
});
|
|
949
|
+
});
|
|
950
|
+
return sortedIndexByFirstChar;
|
|
951
|
+
}
|
|
952
|
+
/**
|
|
953
|
+
* Given the next desired character from the user, it attempts to find the next
|
|
954
|
+
* list option matching the buffer. Wraps around if at the end of options.
|
|
955
|
+
*
|
|
956
|
+
* @param opts Options and accessors
|
|
957
|
+
* - nextChar - the next character to match against items
|
|
958
|
+
* - sortedIndexByFirstChar - output of `initSortedIndex(...)`
|
|
959
|
+
* - focusedItemIndex - the index of the currently focused item
|
|
960
|
+
* - focusItemAtIndex - function that focuses a list item at given index
|
|
961
|
+
* - skipFocus - whether or not to focus the matched item
|
|
962
|
+
* - isItemAtIndexDisabled - function that determines whether an item at a
|
|
963
|
+
* given index is disabled
|
|
964
|
+
* @param state The typeahead state instance. See `initState`.
|
|
965
|
+
*
|
|
966
|
+
* @return The index of the matched item, or -1 if no match.
|
|
967
|
+
*/
|
|
968
|
+
function matchItem(opts, state) {
|
|
969
|
+
var nextChar = opts.nextChar, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, focusedItemIndex = opts.focusedItemIndex, skipFocus = opts.skipFocus, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
|
|
970
|
+
clearTimeout(state.bufferClearTimeout);
|
|
971
|
+
state.bufferClearTimeout = setTimeout(function () {
|
|
972
|
+
clearBuffer(state);
|
|
973
|
+
}, numbers$2.TYPEAHEAD_BUFFER_CLEAR_TIMEOUT_MS);
|
|
974
|
+
state.typeaheadBuffer = state.typeaheadBuffer + nextChar;
|
|
975
|
+
var index;
|
|
976
|
+
if (state.typeaheadBuffer.length === 1) {
|
|
977
|
+
index = matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state);
|
|
978
|
+
}
|
|
979
|
+
else {
|
|
980
|
+
index = matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state);
|
|
981
|
+
}
|
|
982
|
+
if (index !== -1 && !skipFocus) {
|
|
983
|
+
focusItemAtIndex(index);
|
|
984
|
+
}
|
|
985
|
+
return index;
|
|
986
|
+
}
|
|
987
|
+
/**
|
|
988
|
+
* Matches the user's single input character in the buffer to the
|
|
989
|
+
* next option that begins with such character. Wraps around if at
|
|
990
|
+
* end of options. Returns -1 if no match is found.
|
|
991
|
+
*/
|
|
992
|
+
function matchFirstChar(sortedIndexByFirstChar, focusedItemIndex, isItemAtIndexDisabled, state) {
|
|
993
|
+
var firstChar = state.typeaheadBuffer[0];
|
|
994
|
+
var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
|
|
995
|
+
if (!itemsMatchingFirstChar) {
|
|
996
|
+
return -1;
|
|
997
|
+
}
|
|
998
|
+
// Has the same firstChar been recently matched?
|
|
999
|
+
// Also, did starting index remain the same between key presses?
|
|
1000
|
+
// If both hold true, simply increment index.
|
|
1001
|
+
if (firstChar === state.currentFirstChar &&
|
|
1002
|
+
itemsMatchingFirstChar[state.sortedIndexCursor].index ===
|
|
1003
|
+
focusedItemIndex) {
|
|
1004
|
+
state.sortedIndexCursor =
|
|
1005
|
+
(state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
|
|
1006
|
+
var newIndex = itemsMatchingFirstChar[state.sortedIndexCursor].index;
|
|
1007
|
+
if (!isItemAtIndexDisabled(newIndex)) {
|
|
1008
|
+
return newIndex;
|
|
1009
|
+
}
|
|
1010
|
+
}
|
|
1011
|
+
// If we're here, it means one of the following happened:
|
|
1012
|
+
// - either firstChar or startingIndex has changed, invalidating the
|
|
1013
|
+
// cursor.
|
|
1014
|
+
// - The next item of typeahead is disabled, so we have to look further.
|
|
1015
|
+
state.currentFirstChar = firstChar;
|
|
1016
|
+
var newCursorPosition = -1;
|
|
1017
|
+
var cursorPosition;
|
|
1018
|
+
// Find the first non-disabled item as a fallback.
|
|
1019
|
+
for (cursorPosition = 0; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
|
|
1020
|
+
if (!isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
|
|
1021
|
+
newCursorPosition = cursorPosition;
|
|
1022
|
+
break;
|
|
1023
|
+
}
|
|
1024
|
+
}
|
|
1025
|
+
// Advance cursor to first item matching the firstChar that is positioned
|
|
1026
|
+
// after starting item. Cursor is unchanged from fallback if there's no
|
|
1027
|
+
// such item.
|
|
1028
|
+
for (; cursorPosition < itemsMatchingFirstChar.length; cursorPosition++) {
|
|
1029
|
+
if (itemsMatchingFirstChar[cursorPosition].index > focusedItemIndex &&
|
|
1030
|
+
!isItemAtIndexDisabled(itemsMatchingFirstChar[cursorPosition].index)) {
|
|
1031
|
+
newCursorPosition = cursorPosition;
|
|
1032
|
+
break;
|
|
1033
|
+
}
|
|
1034
|
+
}
|
|
1035
|
+
if (newCursorPosition !== -1) {
|
|
1036
|
+
state.sortedIndexCursor = newCursorPosition;
|
|
1037
|
+
return itemsMatchingFirstChar[state.sortedIndexCursor].index;
|
|
1038
|
+
}
|
|
1039
|
+
return -1;
|
|
1040
|
+
}
|
|
1041
|
+
/**
|
|
1042
|
+
* Attempts to find the next item that matches all of the typeahead buffer.
|
|
1043
|
+
* Wraps around if at end of options. Returns -1 if no match is found.
|
|
1044
|
+
*/
|
|
1045
|
+
function matchAllChars(sortedIndexByFirstChar, isItemAtIndexDisabled, state) {
|
|
1046
|
+
var firstChar = state.typeaheadBuffer[0];
|
|
1047
|
+
var itemsMatchingFirstChar = sortedIndexByFirstChar.get(firstChar);
|
|
1048
|
+
if (!itemsMatchingFirstChar) {
|
|
1049
|
+
return -1;
|
|
1050
|
+
}
|
|
1051
|
+
// Do nothing if text already matches
|
|
1052
|
+
var startingItem = itemsMatchingFirstChar[state.sortedIndexCursor];
|
|
1053
|
+
if (startingItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0 &&
|
|
1054
|
+
!isItemAtIndexDisabled(startingItem.index)) {
|
|
1055
|
+
return startingItem.index;
|
|
1056
|
+
}
|
|
1057
|
+
// Find next item that matches completely; if no match, we'll eventually
|
|
1058
|
+
// loop around to same position
|
|
1059
|
+
var cursorPosition = (state.sortedIndexCursor + 1) % itemsMatchingFirstChar.length;
|
|
1060
|
+
var nextCursorPosition = -1;
|
|
1061
|
+
while (cursorPosition !== state.sortedIndexCursor) {
|
|
1062
|
+
var currentItem = itemsMatchingFirstChar[cursorPosition];
|
|
1063
|
+
var matches = currentItem.text.lastIndexOf(state.typeaheadBuffer, 0) === 0;
|
|
1064
|
+
var isEnabled = !isItemAtIndexDisabled(currentItem.index);
|
|
1065
|
+
if (matches && isEnabled) {
|
|
1066
|
+
nextCursorPosition = cursorPosition;
|
|
1067
|
+
break;
|
|
1068
|
+
}
|
|
1069
|
+
cursorPosition = (cursorPosition + 1) % itemsMatchingFirstChar.length;
|
|
1070
|
+
}
|
|
1071
|
+
if (nextCursorPosition !== -1) {
|
|
1072
|
+
state.sortedIndexCursor = nextCursorPosition;
|
|
1073
|
+
return itemsMatchingFirstChar[state.sortedIndexCursor].index;
|
|
1074
|
+
}
|
|
1075
|
+
return -1;
|
|
1076
|
+
}
|
|
1077
|
+
/**
|
|
1078
|
+
* Whether or not the given typeahead instaance state is currently typing.
|
|
1079
|
+
*
|
|
1080
|
+
* @param state The typeahead state instance. See `initState`.
|
|
1081
|
+
*/
|
|
1082
|
+
function isTypingInProgress(state) {
|
|
1083
|
+
return state.typeaheadBuffer.length > 0;
|
|
1084
|
+
}
|
|
1085
|
+
/**
|
|
1086
|
+
* Clears the typeahaed buffer so that it resets item matching to the first
|
|
1087
|
+
* character.
|
|
1088
|
+
*
|
|
1089
|
+
* @param state The typeahead state instance. See `initState`.
|
|
1090
|
+
*/
|
|
1091
|
+
function clearBuffer(state) {
|
|
1092
|
+
state.typeaheadBuffer = '';
|
|
1093
|
+
}
|
|
1094
|
+
/**
|
|
1095
|
+
* Given a keydown event, it calculates whether or not to automatically focus a
|
|
1096
|
+
* list item depending on what was typed mimicing the typeahead functionality of
|
|
1097
|
+
* a standard <select> element that is open.
|
|
1098
|
+
*
|
|
1099
|
+
* @param opts Options and accessors
|
|
1100
|
+
* - event - the KeyboardEvent to handle and parse
|
|
1101
|
+
* - sortedIndexByFirstChar - output of `initSortedIndex(...)`
|
|
1102
|
+
* - focusedItemIndex - the index of the currently focused item
|
|
1103
|
+
* - focusItemAtIndex - function that focuses a list item at given index
|
|
1104
|
+
* - isItemAtFocusedIndexDisabled - whether or not the currently focused item
|
|
1105
|
+
* is disabled
|
|
1106
|
+
* - isTargetListItem - whether or not the event target is a list item
|
|
1107
|
+
* @param state The typeahead state instance. See `initState`.
|
|
1108
|
+
*
|
|
1109
|
+
* @returns index of the item matched by the keydown. -1 if not matched.
|
|
1110
|
+
*/
|
|
1111
|
+
function handleKeydown(opts, state) {
|
|
1112
|
+
var event = opts.event, isTargetListItem = opts.isTargetListItem, focusedItemIndex = opts.focusedItemIndex, focusItemAtIndex = opts.focusItemAtIndex, sortedIndexByFirstChar = opts.sortedIndexByFirstChar, isItemAtIndexDisabled = opts.isItemAtIndexDisabled;
|
|
1113
|
+
var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
|
|
1114
|
+
var isArrowUp = normalizeKey(event) === 'ArrowUp';
|
|
1115
|
+
var isArrowRight = normalizeKey(event) === 'ArrowRight';
|
|
1116
|
+
var isArrowDown = normalizeKey(event) === 'ArrowDown';
|
|
1117
|
+
var isHome = normalizeKey(event) === 'Home';
|
|
1118
|
+
var isEnd = normalizeKey(event) === 'End';
|
|
1119
|
+
var isEnter = normalizeKey(event) === 'Enter';
|
|
1120
|
+
var isSpace = normalizeKey(event) === 'Spacebar';
|
|
1121
|
+
if (event.ctrlKey || event.metaKey || isArrowLeft || isArrowUp ||
|
|
1122
|
+
isArrowRight || isArrowDown || isHome || isEnd || isEnter) {
|
|
1123
|
+
return -1;
|
|
1124
|
+
}
|
|
1125
|
+
var isCharacterKey = !isSpace && event.key.length === 1;
|
|
1126
|
+
if (isCharacterKey) {
|
|
1127
|
+
preventDefaultEvent(event);
|
|
1128
|
+
var matchItemOpts = {
|
|
1129
|
+
focusItemAtIndex: focusItemAtIndex,
|
|
1130
|
+
focusedItemIndex: focusedItemIndex,
|
|
1131
|
+
nextChar: event.key.toLowerCase(),
|
|
1132
|
+
sortedIndexByFirstChar: sortedIndexByFirstChar,
|
|
1133
|
+
skipFocus: false,
|
|
1134
|
+
isItemAtIndexDisabled: isItemAtIndexDisabled,
|
|
1135
|
+
};
|
|
1136
|
+
return matchItem(matchItemOpts, state);
|
|
1137
|
+
}
|
|
1138
|
+
if (!isSpace) {
|
|
1139
|
+
return -1;
|
|
1140
|
+
}
|
|
1141
|
+
if (isTargetListItem) {
|
|
1142
|
+
preventDefaultEvent(event);
|
|
1143
|
+
}
|
|
1144
|
+
var typeaheadOnListItem = isTargetListItem && isTypingInProgress(state);
|
|
1145
|
+
if (typeaheadOnListItem) {
|
|
1146
|
+
var matchItemOpts = {
|
|
1147
|
+
focusItemAtIndex: focusItemAtIndex,
|
|
1148
|
+
focusedItemIndex: focusedItemIndex,
|
|
1149
|
+
nextChar: ' ',
|
|
1150
|
+
sortedIndexByFirstChar: sortedIndexByFirstChar,
|
|
1151
|
+
skipFocus: false,
|
|
1152
|
+
isItemAtIndexDisabled: isItemAtIndexDisabled,
|
|
1153
|
+
};
|
|
1154
|
+
// space participates in typeahead matching if in rapid typing mode
|
|
1155
|
+
return matchItem(matchItemOpts, state);
|
|
1156
|
+
}
|
|
1157
|
+
return -1;
|
|
1158
|
+
}
|
|
1159
|
+
|
|
1160
|
+
/**
|
|
1161
|
+
* @license
|
|
1162
|
+
* Copyright 2018 Google Inc.
|
|
1163
|
+
*
|
|
1164
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1165
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
1166
|
+
* in the Software without restriction, including without limitation the rights
|
|
1167
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1168
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
1169
|
+
* furnished to do so, subject to the following conditions:
|
|
1170
|
+
*
|
|
1171
|
+
* The above copyright notice and this permission notice shall be included in
|
|
1172
|
+
* all copies or substantial portions of the Software.
|
|
1173
|
+
*
|
|
1174
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1175
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1176
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1177
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1178
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1179
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1180
|
+
* THE SOFTWARE.
|
|
1181
|
+
*/
|
|
1182
|
+
function isNumberArray(selectedIndex) {
|
|
1183
|
+
return selectedIndex instanceof Array;
|
|
1184
|
+
}
|
|
1185
|
+
var MDCListFoundation = /** @class */ (function (_super) {
|
|
1186
|
+
ponyfill.__extends(MDCListFoundation, _super);
|
|
1187
|
+
function MDCListFoundation(adapter) {
|
|
1188
|
+
var _this = _super.call(this, ponyfill.__assign(ponyfill.__assign({}, MDCListFoundation.defaultAdapter), adapter)) || this;
|
|
1189
|
+
_this.wrapFocus = false;
|
|
1190
|
+
_this.isVertical = true;
|
|
1191
|
+
_this.isSingleSelectionList = false;
|
|
1192
|
+
_this.selectedIndex = numbers$2.UNSET_INDEX;
|
|
1193
|
+
_this.focusedItemIndex = numbers$2.UNSET_INDEX;
|
|
1194
|
+
_this.useActivatedClass = false;
|
|
1195
|
+
_this.useSelectedAttr = false;
|
|
1196
|
+
_this.ariaCurrentAttrValue = null;
|
|
1197
|
+
_this.isCheckboxList = false;
|
|
1198
|
+
_this.isRadioList = false;
|
|
1199
|
+
_this.hasTypeahead = false;
|
|
1200
|
+
// Transiently holds current typeahead prefix from user.
|
|
1201
|
+
_this.typeaheadState = initState();
|
|
1202
|
+
_this.sortedIndexByFirstChar = new Map();
|
|
1203
|
+
return _this;
|
|
1204
|
+
}
|
|
1205
|
+
Object.defineProperty(MDCListFoundation, "strings", {
|
|
1206
|
+
get: function () {
|
|
1207
|
+
return strings$2;
|
|
1208
|
+
},
|
|
1209
|
+
enumerable: false,
|
|
1210
|
+
configurable: true
|
|
1211
|
+
});
|
|
1212
|
+
Object.defineProperty(MDCListFoundation, "cssClasses", {
|
|
1213
|
+
get: function () {
|
|
1214
|
+
return cssClasses$2;
|
|
1215
|
+
},
|
|
1216
|
+
enumerable: false,
|
|
1217
|
+
configurable: true
|
|
1218
|
+
});
|
|
1219
|
+
Object.defineProperty(MDCListFoundation, "numbers", {
|
|
1220
|
+
get: function () {
|
|
1221
|
+
return numbers$2;
|
|
1222
|
+
},
|
|
1223
|
+
enumerable: false,
|
|
1224
|
+
configurable: true
|
|
1225
|
+
});
|
|
1226
|
+
Object.defineProperty(MDCListFoundation, "defaultAdapter", {
|
|
1227
|
+
get: function () {
|
|
1228
|
+
return {
|
|
1229
|
+
addClassForElementIndex: function () { return undefined; },
|
|
1230
|
+
focusItemAtIndex: function () { return undefined; },
|
|
1231
|
+
getAttributeForElementIndex: function () { return null; },
|
|
1232
|
+
getFocusedElementIndex: function () { return 0; },
|
|
1233
|
+
getListItemCount: function () { return 0; },
|
|
1234
|
+
hasCheckboxAtIndex: function () { return false; },
|
|
1235
|
+
hasRadioAtIndex: function () { return false; },
|
|
1236
|
+
isCheckboxCheckedAtIndex: function () { return false; },
|
|
1237
|
+
isFocusInsideList: function () { return false; },
|
|
1238
|
+
isRootFocused: function () { return false; },
|
|
1239
|
+
listItemAtIndexHasClass: function () { return false; },
|
|
1240
|
+
notifyAction: function () { return undefined; },
|
|
1241
|
+
removeClassForElementIndex: function () { return undefined; },
|
|
1242
|
+
setAttributeForElementIndex: function () { return undefined; },
|
|
1243
|
+
setCheckedCheckboxOrRadioAtIndex: function () { return undefined; },
|
|
1244
|
+
setTabIndexForListItemChildren: function () { return undefined; },
|
|
1245
|
+
getPrimaryTextAtIndex: function () { return ''; },
|
|
1246
|
+
};
|
|
1247
|
+
},
|
|
1248
|
+
enumerable: false,
|
|
1249
|
+
configurable: true
|
|
1250
|
+
});
|
|
1251
|
+
MDCListFoundation.prototype.layout = function () {
|
|
1252
|
+
if (this.adapter.getListItemCount() === 0) {
|
|
1253
|
+
return;
|
|
1254
|
+
}
|
|
1255
|
+
// TODO(b/172274142): consider all items when determining the list's type.
|
|
1256
|
+
if (this.adapter.hasCheckboxAtIndex(0)) {
|
|
1257
|
+
this.isCheckboxList = true;
|
|
1258
|
+
}
|
|
1259
|
+
else if (this.adapter.hasRadioAtIndex(0)) {
|
|
1260
|
+
this.isRadioList = true;
|
|
1261
|
+
}
|
|
1262
|
+
else {
|
|
1263
|
+
this.maybeInitializeSingleSelection();
|
|
1264
|
+
}
|
|
1265
|
+
if (this.hasTypeahead) {
|
|
1266
|
+
this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
|
|
1267
|
+
}
|
|
1268
|
+
};
|
|
1269
|
+
/** Returns the index of the item that was last focused. */
|
|
1270
|
+
MDCListFoundation.prototype.getFocusedItemIndex = function () {
|
|
1271
|
+
return this.focusedItemIndex;
|
|
1272
|
+
};
|
|
1273
|
+
/** Toggles focus wrapping with keyboard navigation. */
|
|
1274
|
+
MDCListFoundation.prototype.setWrapFocus = function (value) {
|
|
1275
|
+
this.wrapFocus = value;
|
|
1276
|
+
};
|
|
1277
|
+
/**
|
|
1278
|
+
* Toggles orientation direction for keyboard navigation (true for vertical,
|
|
1279
|
+
* false for horizontal).
|
|
1280
|
+
*/
|
|
1281
|
+
MDCListFoundation.prototype.setVerticalOrientation = function (value) {
|
|
1282
|
+
this.isVertical = value;
|
|
1283
|
+
};
|
|
1284
|
+
/** Toggles single-selection behavior. */
|
|
1285
|
+
MDCListFoundation.prototype.setSingleSelection = function (value) {
|
|
1286
|
+
this.isSingleSelectionList = value;
|
|
1287
|
+
if (value) {
|
|
1288
|
+
this.maybeInitializeSingleSelection();
|
|
1289
|
+
this.selectedIndex = this.getSelectedIndexFromDOM();
|
|
1290
|
+
}
|
|
1291
|
+
};
|
|
1292
|
+
/**
|
|
1293
|
+
* Automatically determines whether the list is single selection list. If so,
|
|
1294
|
+
* initializes the internal state to match the selected item.
|
|
1295
|
+
*/
|
|
1296
|
+
MDCListFoundation.prototype.maybeInitializeSingleSelection = function () {
|
|
1297
|
+
var selectedItemIndex = this.getSelectedIndexFromDOM();
|
|
1298
|
+
if (selectedItemIndex === numbers$2.UNSET_INDEX)
|
|
1299
|
+
return;
|
|
1300
|
+
var hasActivatedClass = this.adapter.listItemAtIndexHasClass(selectedItemIndex, cssClasses$2.LIST_ITEM_ACTIVATED_CLASS);
|
|
1301
|
+
if (hasActivatedClass) {
|
|
1302
|
+
this.setUseActivatedClass(true);
|
|
1303
|
+
}
|
|
1304
|
+
this.isSingleSelectionList = true;
|
|
1305
|
+
this.selectedIndex = selectedItemIndex;
|
|
1306
|
+
};
|
|
1307
|
+
/** @return Index of the first selected item based on the DOM state. */
|
|
1308
|
+
MDCListFoundation.prototype.getSelectedIndexFromDOM = function () {
|
|
1309
|
+
var selectedIndex = numbers$2.UNSET_INDEX;
|
|
1310
|
+
var listItemsCount = this.adapter.getListItemCount();
|
|
1311
|
+
for (var i = 0; i < listItemsCount; i++) {
|
|
1312
|
+
var hasSelectedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses$2.LIST_ITEM_SELECTED_CLASS);
|
|
1313
|
+
var hasActivatedClass = this.adapter.listItemAtIndexHasClass(i, cssClasses$2.LIST_ITEM_ACTIVATED_CLASS);
|
|
1314
|
+
if (!(hasSelectedClass || hasActivatedClass)) {
|
|
1315
|
+
continue;
|
|
1316
|
+
}
|
|
1317
|
+
selectedIndex = i;
|
|
1318
|
+
break;
|
|
1319
|
+
}
|
|
1320
|
+
return selectedIndex;
|
|
1321
|
+
};
|
|
1322
|
+
/**
|
|
1323
|
+
* Sets whether typeahead is enabled on the list.
|
|
1324
|
+
* @param hasTypeahead Whether typeahead is enabled.
|
|
1325
|
+
*/
|
|
1326
|
+
MDCListFoundation.prototype.setHasTypeahead = function (hasTypeahead) {
|
|
1327
|
+
this.hasTypeahead = hasTypeahead;
|
|
1328
|
+
if (hasTypeahead) {
|
|
1329
|
+
this.sortedIndexByFirstChar = this.typeaheadInitSortedIndex();
|
|
1330
|
+
}
|
|
1331
|
+
};
|
|
1332
|
+
/**
|
|
1333
|
+
* @return Whether typeahead is currently matching a user-specified prefix.
|
|
1334
|
+
*/
|
|
1335
|
+
MDCListFoundation.prototype.isTypeaheadInProgress = function () {
|
|
1336
|
+
return this.hasTypeahead &&
|
|
1337
|
+
isTypingInProgress(this.typeaheadState);
|
|
1338
|
+
};
|
|
1339
|
+
/** Toggle use of the "activated" CSS class. */
|
|
1340
|
+
MDCListFoundation.prototype.setUseActivatedClass = function (useActivated) {
|
|
1341
|
+
this.useActivatedClass = useActivated;
|
|
1342
|
+
};
|
|
1343
|
+
/**
|
|
1344
|
+
* Toggles use of the selected attribute (true for aria-selected, false for
|
|
1345
|
+
* aria-checked).
|
|
1346
|
+
*/
|
|
1347
|
+
MDCListFoundation.prototype.setUseSelectedAttribute = function (useSelected) {
|
|
1348
|
+
this.useSelectedAttr = useSelected;
|
|
1349
|
+
};
|
|
1350
|
+
MDCListFoundation.prototype.getSelectedIndex = function () {
|
|
1351
|
+
return this.selectedIndex;
|
|
1352
|
+
};
|
|
1353
|
+
MDCListFoundation.prototype.setSelectedIndex = function (index, _a) {
|
|
1354
|
+
var _b = _a === void 0 ? {} : _a, forceUpdate = _b.forceUpdate;
|
|
1355
|
+
if (!this.isIndexValid(index)) {
|
|
1356
|
+
return;
|
|
1357
|
+
}
|
|
1358
|
+
if (this.isCheckboxList) {
|
|
1359
|
+
this.setCheckboxAtIndex(index);
|
|
1360
|
+
}
|
|
1361
|
+
else if (this.isRadioList) {
|
|
1362
|
+
this.setRadioAtIndex(index);
|
|
1363
|
+
}
|
|
1364
|
+
else {
|
|
1365
|
+
this.setSingleSelectionAtIndex(index, { forceUpdate: forceUpdate });
|
|
1366
|
+
}
|
|
1367
|
+
};
|
|
1368
|
+
/**
|
|
1369
|
+
* Focus in handler for the list items.
|
|
1370
|
+
*/
|
|
1371
|
+
MDCListFoundation.prototype.handleFocusIn = function (listItemIndex) {
|
|
1372
|
+
if (listItemIndex >= 0) {
|
|
1373
|
+
this.focusedItemIndex = listItemIndex;
|
|
1374
|
+
this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '0');
|
|
1375
|
+
this.adapter.setTabIndexForListItemChildren(listItemIndex, '0');
|
|
1376
|
+
}
|
|
1377
|
+
};
|
|
1378
|
+
/**
|
|
1379
|
+
* Focus out handler for the list items.
|
|
1380
|
+
*/
|
|
1381
|
+
MDCListFoundation.prototype.handleFocusOut = function (listItemIndex) {
|
|
1382
|
+
var _this = this;
|
|
1383
|
+
if (listItemIndex >= 0) {
|
|
1384
|
+
this.adapter.setAttributeForElementIndex(listItemIndex, 'tabindex', '-1');
|
|
1385
|
+
this.adapter.setTabIndexForListItemChildren(listItemIndex, '-1');
|
|
1386
|
+
}
|
|
1387
|
+
/**
|
|
1388
|
+
* Between Focusout & Focusin some browsers do not have focus on any
|
|
1389
|
+
* element. Setting a delay to wait till the focus is moved to next element.
|
|
1390
|
+
*/
|
|
1391
|
+
setTimeout(function () {
|
|
1392
|
+
if (!_this.adapter.isFocusInsideList()) {
|
|
1393
|
+
_this.setTabindexToFirstSelectedOrFocusedItem();
|
|
1394
|
+
}
|
|
1395
|
+
}, 0);
|
|
1396
|
+
};
|
|
1397
|
+
/**
|
|
1398
|
+
* Key handler for the list.
|
|
1399
|
+
*/
|
|
1400
|
+
MDCListFoundation.prototype.handleKeydown = function (event, isRootListItem, listItemIndex) {
|
|
1401
|
+
var _this = this;
|
|
1402
|
+
var isArrowLeft = normalizeKey(event) === 'ArrowLeft';
|
|
1403
|
+
var isArrowUp = normalizeKey(event) === 'ArrowUp';
|
|
1404
|
+
var isArrowRight = normalizeKey(event) === 'ArrowRight';
|
|
1405
|
+
var isArrowDown = normalizeKey(event) === 'ArrowDown';
|
|
1406
|
+
var isHome = normalizeKey(event) === 'Home';
|
|
1407
|
+
var isEnd = normalizeKey(event) === 'End';
|
|
1408
|
+
var isEnter = normalizeKey(event) === 'Enter';
|
|
1409
|
+
var isSpace = normalizeKey(event) === 'Spacebar';
|
|
1410
|
+
// Have to check both upper and lower case, because having caps lock on
|
|
1411
|
+
// affects the value.
|
|
1412
|
+
var isLetterA = event.key === 'A' || event.key === 'a';
|
|
1413
|
+
if (this.adapter.isRootFocused()) {
|
|
1414
|
+
if (isArrowUp || isEnd) {
|
|
1415
|
+
event.preventDefault();
|
|
1416
|
+
this.focusLastElement();
|
|
1417
|
+
}
|
|
1418
|
+
else if (isArrowDown || isHome) {
|
|
1419
|
+
event.preventDefault();
|
|
1420
|
+
this.focusFirstElement();
|
|
1421
|
+
}
|
|
1422
|
+
if (this.hasTypeahead) {
|
|
1423
|
+
var handleKeydownOpts = {
|
|
1424
|
+
event: event,
|
|
1425
|
+
focusItemAtIndex: function (index) {
|
|
1426
|
+
_this.focusItemAtIndex(index);
|
|
1427
|
+
},
|
|
1428
|
+
focusedItemIndex: -1,
|
|
1429
|
+
isTargetListItem: isRootListItem,
|
|
1430
|
+
sortedIndexByFirstChar: this.sortedIndexByFirstChar,
|
|
1431
|
+
isItemAtIndexDisabled: function (index) {
|
|
1432
|
+
return _this.adapter.listItemAtIndexHasClass(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS);
|
|
1433
|
+
},
|
|
1434
|
+
};
|
|
1435
|
+
handleKeydown(handleKeydownOpts, this.typeaheadState);
|
|
1436
|
+
}
|
|
1437
|
+
return;
|
|
1438
|
+
}
|
|
1439
|
+
var currentIndex = this.adapter.getFocusedElementIndex();
|
|
1440
|
+
if (currentIndex === -1) {
|
|
1441
|
+
currentIndex = listItemIndex;
|
|
1442
|
+
if (currentIndex < 0) {
|
|
1443
|
+
// If this event doesn't have a mdc-list-item ancestor from the
|
|
1444
|
+
// current list (not from a sublist), return early.
|
|
1445
|
+
return;
|
|
1446
|
+
}
|
|
1447
|
+
}
|
|
1448
|
+
if ((this.isVertical && isArrowDown) ||
|
|
1449
|
+
(!this.isVertical && isArrowRight)) {
|
|
1450
|
+
preventDefaultEvent(event);
|
|
1451
|
+
this.focusNextElement(currentIndex);
|
|
1452
|
+
}
|
|
1453
|
+
else if ((this.isVertical && isArrowUp) || (!this.isVertical && isArrowLeft)) {
|
|
1454
|
+
preventDefaultEvent(event);
|
|
1455
|
+
this.focusPrevElement(currentIndex);
|
|
1456
|
+
}
|
|
1457
|
+
else if (isHome) {
|
|
1458
|
+
preventDefaultEvent(event);
|
|
1459
|
+
this.focusFirstElement();
|
|
1460
|
+
}
|
|
1461
|
+
else if (isEnd) {
|
|
1462
|
+
preventDefaultEvent(event);
|
|
1463
|
+
this.focusLastElement();
|
|
1464
|
+
}
|
|
1465
|
+
else if (isLetterA && event.ctrlKey && this.isCheckboxList) {
|
|
1466
|
+
event.preventDefault();
|
|
1467
|
+
this.toggleAll(this.selectedIndex === numbers$2.UNSET_INDEX ?
|
|
1468
|
+
[] :
|
|
1469
|
+
this.selectedIndex);
|
|
1470
|
+
}
|
|
1471
|
+
else if (isEnter || isSpace) {
|
|
1472
|
+
if (isRootListItem) {
|
|
1473
|
+
// Return early if enter key is pressed on anchor element which triggers
|
|
1474
|
+
// synthetic MouseEvent event.
|
|
1475
|
+
var target = event.target;
|
|
1476
|
+
if (target && target.tagName === 'A' && isEnter) {
|
|
1477
|
+
return;
|
|
1478
|
+
}
|
|
1479
|
+
preventDefaultEvent(event);
|
|
1480
|
+
if (this.adapter.listItemAtIndexHasClass(currentIndex, cssClasses$2.LIST_ITEM_DISABLED_CLASS)) {
|
|
1481
|
+
return;
|
|
1482
|
+
}
|
|
1483
|
+
if (!this.isTypeaheadInProgress()) {
|
|
1484
|
+
if (this.isSelectableList()) {
|
|
1485
|
+
this.setSelectedIndexOnAction(currentIndex);
|
|
1486
|
+
}
|
|
1487
|
+
this.adapter.notifyAction(currentIndex);
|
|
1488
|
+
}
|
|
1489
|
+
}
|
|
1490
|
+
}
|
|
1491
|
+
if (this.hasTypeahead) {
|
|
1492
|
+
var handleKeydownOpts = {
|
|
1493
|
+
event: event,
|
|
1494
|
+
focusItemAtIndex: function (index) {
|
|
1495
|
+
_this.focusItemAtIndex(index);
|
|
1496
|
+
},
|
|
1497
|
+
focusedItemIndex: this.focusedItemIndex,
|
|
1498
|
+
isTargetListItem: isRootListItem,
|
|
1499
|
+
sortedIndexByFirstChar: this.sortedIndexByFirstChar,
|
|
1500
|
+
isItemAtIndexDisabled: function (index) { return _this.adapter.listItemAtIndexHasClass(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS); },
|
|
1501
|
+
};
|
|
1502
|
+
handleKeydown(handleKeydownOpts, this.typeaheadState);
|
|
1503
|
+
}
|
|
1504
|
+
};
|
|
1505
|
+
/**
|
|
1506
|
+
* Click handler for the list.
|
|
1507
|
+
*/
|
|
1508
|
+
MDCListFoundation.prototype.handleClick = function (index, toggleCheckbox) {
|
|
1509
|
+
if (index === numbers$2.UNSET_INDEX) {
|
|
1510
|
+
return;
|
|
1511
|
+
}
|
|
1512
|
+
if (this.adapter.listItemAtIndexHasClass(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS)) {
|
|
1513
|
+
return;
|
|
1514
|
+
}
|
|
1515
|
+
if (this.isSelectableList()) {
|
|
1516
|
+
this.setSelectedIndexOnAction(index, toggleCheckbox);
|
|
1517
|
+
}
|
|
1518
|
+
this.adapter.notifyAction(index);
|
|
1519
|
+
};
|
|
1520
|
+
/**
|
|
1521
|
+
* Focuses the next element on the list.
|
|
1522
|
+
*/
|
|
1523
|
+
MDCListFoundation.prototype.focusNextElement = function (index) {
|
|
1524
|
+
var count = this.adapter.getListItemCount();
|
|
1525
|
+
var nextIndex = index + 1;
|
|
1526
|
+
if (nextIndex >= count) {
|
|
1527
|
+
if (this.wrapFocus) {
|
|
1528
|
+
nextIndex = 0;
|
|
1529
|
+
}
|
|
1530
|
+
else {
|
|
1531
|
+
// Return early because last item is already focused.
|
|
1532
|
+
return index;
|
|
1533
|
+
}
|
|
1534
|
+
}
|
|
1535
|
+
this.focusItemAtIndex(nextIndex);
|
|
1536
|
+
return nextIndex;
|
|
1537
|
+
};
|
|
1538
|
+
/**
|
|
1539
|
+
* Focuses the previous element on the list.
|
|
1540
|
+
*/
|
|
1541
|
+
MDCListFoundation.prototype.focusPrevElement = function (index) {
|
|
1542
|
+
var prevIndex = index - 1;
|
|
1543
|
+
if (prevIndex < 0) {
|
|
1544
|
+
if (this.wrapFocus) {
|
|
1545
|
+
prevIndex = this.adapter.getListItemCount() - 1;
|
|
1546
|
+
}
|
|
1547
|
+
else {
|
|
1548
|
+
// Return early because first item is already focused.
|
|
1549
|
+
return index;
|
|
1550
|
+
}
|
|
1551
|
+
}
|
|
1552
|
+
this.focusItemAtIndex(prevIndex);
|
|
1553
|
+
return prevIndex;
|
|
1554
|
+
};
|
|
1555
|
+
MDCListFoundation.prototype.focusFirstElement = function () {
|
|
1556
|
+
this.focusItemAtIndex(0);
|
|
1557
|
+
return 0;
|
|
1558
|
+
};
|
|
1559
|
+
MDCListFoundation.prototype.focusLastElement = function () {
|
|
1560
|
+
var lastIndex = this.adapter.getListItemCount() - 1;
|
|
1561
|
+
this.focusItemAtIndex(lastIndex);
|
|
1562
|
+
return lastIndex;
|
|
1563
|
+
};
|
|
1564
|
+
MDCListFoundation.prototype.focusInitialElement = function () {
|
|
1565
|
+
var initialIndex = this.getFirstSelectedOrFocusedItemIndex();
|
|
1566
|
+
this.focusItemAtIndex(initialIndex);
|
|
1567
|
+
return initialIndex;
|
|
1568
|
+
};
|
|
1569
|
+
/**
|
|
1570
|
+
* @param itemIndex Index of the list item
|
|
1571
|
+
* @param isEnabled Sets the list item to enabled or disabled.
|
|
1572
|
+
*/
|
|
1573
|
+
MDCListFoundation.prototype.setEnabled = function (itemIndex, isEnabled) {
|
|
1574
|
+
if (!this.isIndexValid(itemIndex)) {
|
|
1575
|
+
return;
|
|
1576
|
+
}
|
|
1577
|
+
if (isEnabled) {
|
|
1578
|
+
this.adapter.removeClassForElementIndex(itemIndex, cssClasses$2.LIST_ITEM_DISABLED_CLASS);
|
|
1579
|
+
this.adapter.setAttributeForElementIndex(itemIndex, strings$2.ARIA_DISABLED, 'false');
|
|
1580
|
+
}
|
|
1581
|
+
else {
|
|
1582
|
+
this.adapter.addClassForElementIndex(itemIndex, cssClasses$2.LIST_ITEM_DISABLED_CLASS);
|
|
1583
|
+
this.adapter.setAttributeForElementIndex(itemIndex, strings$2.ARIA_DISABLED, 'true');
|
|
1584
|
+
}
|
|
1585
|
+
};
|
|
1586
|
+
MDCListFoundation.prototype.setSingleSelectionAtIndex = function (index, _a) {
|
|
1587
|
+
var _b = _a === void 0 ? {} : _a, forceUpdate = _b.forceUpdate;
|
|
1588
|
+
if (this.selectedIndex === index && !forceUpdate) {
|
|
1589
|
+
return;
|
|
1590
|
+
}
|
|
1591
|
+
var selectedClassName = cssClasses$2.LIST_ITEM_SELECTED_CLASS;
|
|
1592
|
+
if (this.useActivatedClass) {
|
|
1593
|
+
selectedClassName = cssClasses$2.LIST_ITEM_ACTIVATED_CLASS;
|
|
1594
|
+
}
|
|
1595
|
+
if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
|
|
1596
|
+
this.adapter.removeClassForElementIndex(this.selectedIndex, selectedClassName);
|
|
1597
|
+
}
|
|
1598
|
+
this.setAriaForSingleSelectionAtIndex(index);
|
|
1599
|
+
this.setTabindexAtIndex(index);
|
|
1600
|
+
if (index !== numbers$2.UNSET_INDEX) {
|
|
1601
|
+
this.adapter.addClassForElementIndex(index, selectedClassName);
|
|
1602
|
+
}
|
|
1603
|
+
this.selectedIndex = index;
|
|
1604
|
+
};
|
|
1605
|
+
/**
|
|
1606
|
+
* Sets aria attribute for single selection at given index.
|
|
1607
|
+
*/
|
|
1608
|
+
MDCListFoundation.prototype.setAriaForSingleSelectionAtIndex = function (index) {
|
|
1609
|
+
// Detect the presence of aria-current and get the value only during list
|
|
1610
|
+
// initialization when it is in unset state.
|
|
1611
|
+
if (this.selectedIndex === numbers$2.UNSET_INDEX) {
|
|
1612
|
+
this.ariaCurrentAttrValue =
|
|
1613
|
+
this.adapter.getAttributeForElementIndex(index, strings$2.ARIA_CURRENT);
|
|
1614
|
+
}
|
|
1615
|
+
var isAriaCurrent = this.ariaCurrentAttrValue !== null;
|
|
1616
|
+
var ariaAttribute = isAriaCurrent ? strings$2.ARIA_CURRENT : strings$2.ARIA_SELECTED;
|
|
1617
|
+
if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
|
|
1618
|
+
this.adapter.setAttributeForElementIndex(this.selectedIndex, ariaAttribute, 'false');
|
|
1619
|
+
}
|
|
1620
|
+
if (index !== numbers$2.UNSET_INDEX) {
|
|
1621
|
+
var ariaAttributeValue = isAriaCurrent ? this.ariaCurrentAttrValue : 'true';
|
|
1622
|
+
this.adapter.setAttributeForElementIndex(index, ariaAttribute, ariaAttributeValue);
|
|
1623
|
+
}
|
|
1624
|
+
};
|
|
1625
|
+
/**
|
|
1626
|
+
* Returns the attribute to use for indicating selection status.
|
|
1627
|
+
*/
|
|
1628
|
+
MDCListFoundation.prototype.getSelectionAttribute = function () {
|
|
1629
|
+
return this.useSelectedAttr ? strings$2.ARIA_SELECTED : strings$2.ARIA_CHECKED;
|
|
1630
|
+
};
|
|
1631
|
+
/**
|
|
1632
|
+
* Toggles radio at give index. Radio doesn't change the checked state if it
|
|
1633
|
+
* is already checked.
|
|
1634
|
+
*/
|
|
1635
|
+
MDCListFoundation.prototype.setRadioAtIndex = function (index) {
|
|
1636
|
+
var selectionAttribute = this.getSelectionAttribute();
|
|
1637
|
+
this.adapter.setCheckedCheckboxOrRadioAtIndex(index, true);
|
|
1638
|
+
if (this.selectedIndex !== numbers$2.UNSET_INDEX) {
|
|
1639
|
+
this.adapter.setAttributeForElementIndex(this.selectedIndex, selectionAttribute, 'false');
|
|
1640
|
+
}
|
|
1641
|
+
this.adapter.setAttributeForElementIndex(index, selectionAttribute, 'true');
|
|
1642
|
+
this.selectedIndex = index;
|
|
1643
|
+
};
|
|
1644
|
+
MDCListFoundation.prototype.setCheckboxAtIndex = function (index) {
|
|
1645
|
+
var selectionAttribute = this.getSelectionAttribute();
|
|
1646
|
+
for (var i = 0; i < this.adapter.getListItemCount(); i++) {
|
|
1647
|
+
var isChecked = false;
|
|
1648
|
+
if (index.indexOf(i) >= 0) {
|
|
1649
|
+
isChecked = true;
|
|
1650
|
+
}
|
|
1651
|
+
this.adapter.setCheckedCheckboxOrRadioAtIndex(i, isChecked);
|
|
1652
|
+
this.adapter.setAttributeForElementIndex(i, selectionAttribute, isChecked ? 'true' : 'false');
|
|
1653
|
+
}
|
|
1654
|
+
this.selectedIndex = index;
|
|
1655
|
+
};
|
|
1656
|
+
MDCListFoundation.prototype.setTabindexAtIndex = function (index) {
|
|
1657
|
+
if (this.focusedItemIndex === numbers$2.UNSET_INDEX && index !== 0) {
|
|
1658
|
+
// If some list item was selected set first list item's tabindex to -1.
|
|
1659
|
+
// Generally, tabindex is set to 0 on first list item of list that has no
|
|
1660
|
+
// preselected items.
|
|
1661
|
+
this.adapter.setAttributeForElementIndex(0, 'tabindex', '-1');
|
|
1662
|
+
}
|
|
1663
|
+
else if (this.focusedItemIndex >= 0 && this.focusedItemIndex !== index) {
|
|
1664
|
+
this.adapter.setAttributeForElementIndex(this.focusedItemIndex, 'tabindex', '-1');
|
|
1665
|
+
}
|
|
1666
|
+
// Set the previous selection's tabindex to -1. We need this because
|
|
1667
|
+
// in selection menus that are not visible, programmatically setting an
|
|
1668
|
+
// option will not change focus but will change where tabindex should be 0.
|
|
1669
|
+
if (!(this.selectedIndex instanceof Array) &&
|
|
1670
|
+
this.selectedIndex !== index) {
|
|
1671
|
+
this.adapter.setAttributeForElementIndex(this.selectedIndex, 'tabindex', '-1');
|
|
1672
|
+
}
|
|
1673
|
+
if (index !== numbers$2.UNSET_INDEX) {
|
|
1674
|
+
this.adapter.setAttributeForElementIndex(index, 'tabindex', '0');
|
|
1675
|
+
}
|
|
1676
|
+
};
|
|
1677
|
+
/**
|
|
1678
|
+
* @return Return true if it is single selectin list, checkbox list or radio
|
|
1679
|
+
* list.
|
|
1680
|
+
*/
|
|
1681
|
+
MDCListFoundation.prototype.isSelectableList = function () {
|
|
1682
|
+
return this.isSingleSelectionList || this.isCheckboxList ||
|
|
1683
|
+
this.isRadioList;
|
|
1684
|
+
};
|
|
1685
|
+
MDCListFoundation.prototype.setTabindexToFirstSelectedOrFocusedItem = function () {
|
|
1686
|
+
var targetIndex = this.getFirstSelectedOrFocusedItemIndex();
|
|
1687
|
+
this.setTabindexAtIndex(targetIndex);
|
|
1688
|
+
};
|
|
1689
|
+
MDCListFoundation.prototype.getFirstSelectedOrFocusedItemIndex = function () {
|
|
1690
|
+
// Action lists retain focus on the most recently focused item.
|
|
1691
|
+
if (!this.isSelectableList()) {
|
|
1692
|
+
return Math.max(this.focusedItemIndex, 0);
|
|
1693
|
+
}
|
|
1694
|
+
// Single-selection lists focus the selected item.
|
|
1695
|
+
if (typeof this.selectedIndex === 'number' &&
|
|
1696
|
+
this.selectedIndex !== numbers$2.UNSET_INDEX) {
|
|
1697
|
+
return this.selectedIndex;
|
|
1698
|
+
}
|
|
1699
|
+
// Multiple-selection lists focus the first selected item.
|
|
1700
|
+
if (isNumberArray(this.selectedIndex) && this.selectedIndex.length > 0) {
|
|
1701
|
+
return this.selectedIndex.reduce(function (minIndex, currentIndex) { return Math.min(minIndex, currentIndex); });
|
|
1702
|
+
}
|
|
1703
|
+
// Selection lists without a selection focus the first item.
|
|
1704
|
+
return 0;
|
|
1705
|
+
};
|
|
1706
|
+
MDCListFoundation.prototype.isIndexValid = function (index) {
|
|
1707
|
+
var _this = this;
|
|
1708
|
+
if (index instanceof Array) {
|
|
1709
|
+
if (!this.isCheckboxList) {
|
|
1710
|
+
throw new Error('MDCListFoundation: Array of index is only supported for checkbox based list');
|
|
1711
|
+
}
|
|
1712
|
+
if (index.length === 0) {
|
|
1713
|
+
return true;
|
|
1714
|
+
}
|
|
1715
|
+
else {
|
|
1716
|
+
return index.some(function (i) { return _this.isIndexInRange(i); });
|
|
1717
|
+
}
|
|
1718
|
+
}
|
|
1719
|
+
else if (typeof index === 'number') {
|
|
1720
|
+
if (this.isCheckboxList) {
|
|
1721
|
+
throw new Error("MDCListFoundation: Expected array of index for checkbox based list but got number: " + index);
|
|
1722
|
+
}
|
|
1723
|
+
return this.isIndexInRange(index) ||
|
|
1724
|
+
this.isSingleSelectionList && index === numbers$2.UNSET_INDEX;
|
|
1725
|
+
}
|
|
1726
|
+
else {
|
|
1727
|
+
return false;
|
|
1728
|
+
}
|
|
1729
|
+
};
|
|
1730
|
+
MDCListFoundation.prototype.isIndexInRange = function (index) {
|
|
1731
|
+
var listSize = this.adapter.getListItemCount();
|
|
1732
|
+
return index >= 0 && index < listSize;
|
|
1733
|
+
};
|
|
1734
|
+
/**
|
|
1735
|
+
* Sets selected index on user action, toggles checkbox / radio based on
|
|
1736
|
+
* toggleCheckbox value. User interaction should not toggle list item(s) when
|
|
1737
|
+
* disabled.
|
|
1738
|
+
*/
|
|
1739
|
+
MDCListFoundation.prototype.setSelectedIndexOnAction = function (index, toggleCheckbox) {
|
|
1740
|
+
if (toggleCheckbox === void 0) { toggleCheckbox = true; }
|
|
1741
|
+
if (this.isCheckboxList) {
|
|
1742
|
+
this.toggleCheckboxAtIndex(index, toggleCheckbox);
|
|
1743
|
+
}
|
|
1744
|
+
else {
|
|
1745
|
+
this.setSelectedIndex(index);
|
|
1746
|
+
}
|
|
1747
|
+
};
|
|
1748
|
+
MDCListFoundation.prototype.toggleCheckboxAtIndex = function (index, toggleCheckbox) {
|
|
1749
|
+
var selectionAttribute = this.getSelectionAttribute();
|
|
1750
|
+
var isChecked = this.adapter.isCheckboxCheckedAtIndex(index);
|
|
1751
|
+
if (toggleCheckbox) {
|
|
1752
|
+
isChecked = !isChecked;
|
|
1753
|
+
this.adapter.setCheckedCheckboxOrRadioAtIndex(index, isChecked);
|
|
1754
|
+
}
|
|
1755
|
+
this.adapter.setAttributeForElementIndex(index, selectionAttribute, isChecked ? 'true' : 'false');
|
|
1756
|
+
// If none of the checkbox items are selected and selectedIndex is not
|
|
1757
|
+
// initialized then provide a default value.
|
|
1758
|
+
var selectedIndexes = this.selectedIndex === numbers$2.UNSET_INDEX ?
|
|
1759
|
+
[] :
|
|
1760
|
+
this.selectedIndex.slice();
|
|
1761
|
+
if (isChecked) {
|
|
1762
|
+
selectedIndexes.push(index);
|
|
1763
|
+
}
|
|
1764
|
+
else {
|
|
1765
|
+
selectedIndexes = selectedIndexes.filter(function (i) { return i !== index; });
|
|
1766
|
+
}
|
|
1767
|
+
this.selectedIndex = selectedIndexes;
|
|
1768
|
+
};
|
|
1769
|
+
MDCListFoundation.prototype.focusItemAtIndex = function (index) {
|
|
1770
|
+
this.adapter.focusItemAtIndex(index);
|
|
1771
|
+
this.focusedItemIndex = index;
|
|
1772
|
+
};
|
|
1773
|
+
MDCListFoundation.prototype.toggleAll = function (currentlySelectedIndexes) {
|
|
1774
|
+
var count = this.adapter.getListItemCount();
|
|
1775
|
+
// If all items are selected, deselect everything.
|
|
1776
|
+
if (currentlySelectedIndexes.length === count) {
|
|
1777
|
+
this.setCheckboxAtIndex([]);
|
|
1778
|
+
}
|
|
1779
|
+
else {
|
|
1780
|
+
// Otherwise select all enabled options.
|
|
1781
|
+
var allIndexes = [];
|
|
1782
|
+
for (var i = 0; i < count; i++) {
|
|
1783
|
+
if (!this.adapter.listItemAtIndexHasClass(i, cssClasses$2.LIST_ITEM_DISABLED_CLASS) ||
|
|
1784
|
+
currentlySelectedIndexes.indexOf(i) > -1) {
|
|
1785
|
+
allIndexes.push(i);
|
|
1786
|
+
}
|
|
1787
|
+
}
|
|
1788
|
+
this.setCheckboxAtIndex(allIndexes);
|
|
1789
|
+
}
|
|
1790
|
+
};
|
|
1791
|
+
/**
|
|
1792
|
+
* Given the next desired character from the user, adds it to the typeahead
|
|
1793
|
+
* buffer. Then, attempts to find the next option matching the buffer. Wraps
|
|
1794
|
+
* around if at the end of options.
|
|
1795
|
+
*
|
|
1796
|
+
* @param nextChar The next character to add to the prefix buffer.
|
|
1797
|
+
* @param startingIndex The index from which to start matching. Only relevant
|
|
1798
|
+
* when starting a new match sequence. To start a new match sequence,
|
|
1799
|
+
* clear the buffer using `clearTypeaheadBuffer`, or wait for the buffer
|
|
1800
|
+
* to clear after a set interval defined in list foundation. Defaults to
|
|
1801
|
+
* the currently focused index.
|
|
1802
|
+
* @return The index of the matched item, or -1 if no match.
|
|
1803
|
+
*/
|
|
1804
|
+
MDCListFoundation.prototype.typeaheadMatchItem = function (nextChar, startingIndex, skipFocus) {
|
|
1805
|
+
var _this = this;
|
|
1806
|
+
if (skipFocus === void 0) { skipFocus = false; }
|
|
1807
|
+
var opts = {
|
|
1808
|
+
focusItemAtIndex: function (index) {
|
|
1809
|
+
_this.focusItemAtIndex(index);
|
|
1810
|
+
},
|
|
1811
|
+
focusedItemIndex: startingIndex ? startingIndex : this.focusedItemIndex,
|
|
1812
|
+
nextChar: nextChar,
|
|
1813
|
+
sortedIndexByFirstChar: this.sortedIndexByFirstChar,
|
|
1814
|
+
skipFocus: skipFocus,
|
|
1815
|
+
isItemAtIndexDisabled: function (index) { return _this.adapter.listItemAtIndexHasClass(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS); }
|
|
1816
|
+
};
|
|
1817
|
+
return matchItem(opts, this.typeaheadState);
|
|
1818
|
+
};
|
|
1819
|
+
/**
|
|
1820
|
+
* Initializes the MDCListTextAndIndex data structure by indexing the current
|
|
1821
|
+
* list items by primary text.
|
|
1822
|
+
*
|
|
1823
|
+
* @return The primary texts of all the list items sorted by first character.
|
|
1824
|
+
*/
|
|
1825
|
+
MDCListFoundation.prototype.typeaheadInitSortedIndex = function () {
|
|
1826
|
+
return initSortedIndex(this.adapter.getListItemCount(), this.adapter.getPrimaryTextAtIndex);
|
|
1827
|
+
};
|
|
1828
|
+
/**
|
|
1829
|
+
* Clears the typeahead buffer.
|
|
1830
|
+
*/
|
|
1831
|
+
MDCListFoundation.prototype.clearTypeaheadBuffer = function () {
|
|
1832
|
+
clearBuffer(this.typeaheadState);
|
|
1833
|
+
};
|
|
1834
|
+
return MDCListFoundation;
|
|
1835
|
+
}(ponyfill.MDCFoundation));
|
|
1836
|
+
|
|
1837
|
+
/**
|
|
1838
|
+
* @license
|
|
1839
|
+
* Copyright 2018 Google Inc.
|
|
1840
|
+
*
|
|
1841
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1842
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
1843
|
+
* in the Software without restriction, including without limitation the rights
|
|
1844
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1845
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
1846
|
+
* furnished to do so, subject to the following conditions:
|
|
1847
|
+
*
|
|
1848
|
+
* The above copyright notice and this permission notice shall be included in
|
|
1849
|
+
* all copies or substantial portions of the Software.
|
|
1850
|
+
*
|
|
1851
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1852
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1853
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1854
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1855
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1856
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1857
|
+
* THE SOFTWARE.
|
|
1858
|
+
*/
|
|
1859
|
+
var MDCList = /** @class */ (function (_super) {
|
|
1860
|
+
ponyfill.__extends(MDCList, _super);
|
|
1861
|
+
function MDCList() {
|
|
1862
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
1863
|
+
}
|
|
1864
|
+
Object.defineProperty(MDCList.prototype, "vertical", {
|
|
1865
|
+
set: function (value) {
|
|
1866
|
+
this.foundation.setVerticalOrientation(value);
|
|
1867
|
+
},
|
|
1868
|
+
enumerable: false,
|
|
1869
|
+
configurable: true
|
|
1870
|
+
});
|
|
1871
|
+
Object.defineProperty(MDCList.prototype, "listElements", {
|
|
1872
|
+
get: function () {
|
|
1873
|
+
return Array.from(this.root.querySelectorAll("." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS]));
|
|
1874
|
+
},
|
|
1875
|
+
enumerable: false,
|
|
1876
|
+
configurable: true
|
|
1877
|
+
});
|
|
1878
|
+
Object.defineProperty(MDCList.prototype, "wrapFocus", {
|
|
1879
|
+
set: function (value) {
|
|
1880
|
+
this.foundation.setWrapFocus(value);
|
|
1881
|
+
},
|
|
1882
|
+
enumerable: false,
|
|
1883
|
+
configurable: true
|
|
1884
|
+
});
|
|
1885
|
+
Object.defineProperty(MDCList.prototype, "typeaheadInProgress", {
|
|
1886
|
+
/**
|
|
1887
|
+
* @return Whether typeahead is currently matching a user-specified prefix.
|
|
1888
|
+
*/
|
|
1889
|
+
get: function () {
|
|
1890
|
+
return this.foundation.isTypeaheadInProgress();
|
|
1891
|
+
},
|
|
1892
|
+
enumerable: false,
|
|
1893
|
+
configurable: true
|
|
1894
|
+
});
|
|
1895
|
+
Object.defineProperty(MDCList.prototype, "hasTypeahead", {
|
|
1896
|
+
/**
|
|
1897
|
+
* Sets whether typeahead functionality is enabled on the list.
|
|
1898
|
+
* @param hasTypeahead Whether typeahead is enabled.
|
|
1899
|
+
*/
|
|
1900
|
+
set: function (hasTypeahead) {
|
|
1901
|
+
this.foundation.setHasTypeahead(hasTypeahead);
|
|
1902
|
+
},
|
|
1903
|
+
enumerable: false,
|
|
1904
|
+
configurable: true
|
|
1905
|
+
});
|
|
1906
|
+
Object.defineProperty(MDCList.prototype, "singleSelection", {
|
|
1907
|
+
set: function (isSingleSelectionList) {
|
|
1908
|
+
this.foundation.setSingleSelection(isSingleSelectionList);
|
|
1909
|
+
},
|
|
1910
|
+
enumerable: false,
|
|
1911
|
+
configurable: true
|
|
1912
|
+
});
|
|
1913
|
+
Object.defineProperty(MDCList.prototype, "selectedIndex", {
|
|
1914
|
+
get: function () {
|
|
1915
|
+
return this.foundation.getSelectedIndex();
|
|
1916
|
+
},
|
|
1917
|
+
set: function (index) {
|
|
1918
|
+
this.foundation.setSelectedIndex(index);
|
|
1919
|
+
},
|
|
1920
|
+
enumerable: false,
|
|
1921
|
+
configurable: true
|
|
1922
|
+
});
|
|
1923
|
+
MDCList.attachTo = function (root) {
|
|
1924
|
+
return new MDCList(root);
|
|
1925
|
+
};
|
|
1926
|
+
MDCList.prototype.initialSyncWithDOM = function () {
|
|
1927
|
+
this.isEvolutionEnabled =
|
|
1928
|
+
evolutionAttribute in this.root.dataset;
|
|
1929
|
+
if (this.isEvolutionEnabled) {
|
|
1930
|
+
this.classNameMap = evolutionClassNameMap;
|
|
1931
|
+
}
|
|
1932
|
+
else if (ponyfill.matches(this.root, strings$2.DEPRECATED_SELECTOR)) {
|
|
1933
|
+
this.classNameMap = deprecatedClassNameMap;
|
|
1934
|
+
}
|
|
1935
|
+
else {
|
|
1936
|
+
this.classNameMap =
|
|
1937
|
+
Object.values(cssClasses$2)
|
|
1938
|
+
.reduce(function (obj, className) {
|
|
1939
|
+
obj[className] = className;
|
|
1940
|
+
return obj;
|
|
1941
|
+
}, {});
|
|
1942
|
+
}
|
|
1943
|
+
this.handleClick = this.handleClickEvent.bind(this);
|
|
1944
|
+
this.handleKeydown = this.handleKeydownEvent.bind(this);
|
|
1945
|
+
this.focusInEventListener = this.handleFocusInEvent.bind(this);
|
|
1946
|
+
this.focusOutEventListener = this.handleFocusOutEvent.bind(this);
|
|
1947
|
+
this.listen('keydown', this.handleKeydown);
|
|
1948
|
+
this.listen('click', this.handleClick);
|
|
1949
|
+
this.listen('focusin', this.focusInEventListener);
|
|
1950
|
+
this.listen('focusout', this.focusOutEventListener);
|
|
1951
|
+
this.layout();
|
|
1952
|
+
this.initializeListType();
|
|
1953
|
+
this.ensureFocusable();
|
|
1954
|
+
};
|
|
1955
|
+
MDCList.prototype.destroy = function () {
|
|
1956
|
+
this.unlisten('keydown', this.handleKeydown);
|
|
1957
|
+
this.unlisten('click', this.handleClick);
|
|
1958
|
+
this.unlisten('focusin', this.focusInEventListener);
|
|
1959
|
+
this.unlisten('focusout', this.focusOutEventListener);
|
|
1960
|
+
};
|
|
1961
|
+
MDCList.prototype.layout = function () {
|
|
1962
|
+
var direction = this.root.getAttribute(strings$2.ARIA_ORIENTATION);
|
|
1963
|
+
this.vertical = direction !== strings$2.ARIA_ORIENTATION_HORIZONTAL;
|
|
1964
|
+
var itemSelector = "." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS] + ":not([tabindex])";
|
|
1965
|
+
var childSelector = strings$2.FOCUSABLE_CHILD_ELEMENTS;
|
|
1966
|
+
// List items need to have at least tabindex=-1 to be focusable.
|
|
1967
|
+
var itemEls = this.root.querySelectorAll(itemSelector);
|
|
1968
|
+
if (itemEls.length) {
|
|
1969
|
+
Array.prototype.forEach.call(itemEls, function (el) {
|
|
1970
|
+
el.setAttribute('tabindex', '-1');
|
|
1971
|
+
});
|
|
1972
|
+
}
|
|
1973
|
+
// Child button/a elements are not tabbable until the list item is focused.
|
|
1974
|
+
var focusableChildEls = this.root.querySelectorAll(childSelector);
|
|
1975
|
+
if (focusableChildEls.length) {
|
|
1976
|
+
Array.prototype.forEach.call(focusableChildEls, function (el) {
|
|
1977
|
+
el.setAttribute('tabindex', '-1');
|
|
1978
|
+
});
|
|
1979
|
+
}
|
|
1980
|
+
if (this.isEvolutionEnabled) {
|
|
1981
|
+
this.foundation.setUseSelectedAttribute(true);
|
|
1982
|
+
}
|
|
1983
|
+
this.foundation.layout();
|
|
1984
|
+
};
|
|
1985
|
+
/**
|
|
1986
|
+
* Extracts the primary text from a list item.
|
|
1987
|
+
* @param item The list item element.
|
|
1988
|
+
* @return The primary text in the element.
|
|
1989
|
+
*/
|
|
1990
|
+
MDCList.prototype.getPrimaryText = function (item) {
|
|
1991
|
+
var _a;
|
|
1992
|
+
var primaryText = item.querySelector("." + this.classNameMap[cssClasses$2.LIST_ITEM_PRIMARY_TEXT_CLASS]);
|
|
1993
|
+
if (this.isEvolutionEnabled || primaryText) {
|
|
1994
|
+
return (_a = primaryText === null || primaryText === void 0 ? void 0 : primaryText.textContent) !== null && _a !== void 0 ? _a : '';
|
|
1995
|
+
}
|
|
1996
|
+
var singleLineText = item.querySelector("." + this.classNameMap[cssClasses$2.LIST_ITEM_TEXT_CLASS]);
|
|
1997
|
+
return (singleLineText && singleLineText.textContent) || '';
|
|
1998
|
+
};
|
|
1999
|
+
/**
|
|
2000
|
+
* Initialize selectedIndex value based on pre-selected list items.
|
|
2001
|
+
*/
|
|
2002
|
+
MDCList.prototype.initializeListType = function () {
|
|
2003
|
+
var _this = this;
|
|
2004
|
+
this.isInteractive =
|
|
2005
|
+
ponyfill.matches(this.root, strings$2.ARIA_INTERACTIVE_ROLES_SELECTOR);
|
|
2006
|
+
if (this.isEvolutionEnabled && this.isInteractive) {
|
|
2007
|
+
var selection = Array.from(this.root.querySelectorAll(strings$2.SELECTED_ITEM_SELECTOR), function (listItem) { return _this.listElements.indexOf(listItem); });
|
|
2008
|
+
if (ponyfill.matches(this.root, strings$2.ARIA_MULTI_SELECTABLE_SELECTOR)) {
|
|
2009
|
+
this.selectedIndex = selection;
|
|
2010
|
+
}
|
|
2011
|
+
else if (selection.length > 0) {
|
|
2012
|
+
this.selectedIndex = selection[0];
|
|
2013
|
+
}
|
|
2014
|
+
return;
|
|
2015
|
+
}
|
|
2016
|
+
var checkboxListItems = this.root.querySelectorAll(strings$2.ARIA_ROLE_CHECKBOX_SELECTOR);
|
|
2017
|
+
var radioSelectedListItem = this.root.querySelector(strings$2.ARIA_CHECKED_RADIO_SELECTOR);
|
|
2018
|
+
if (checkboxListItems.length) {
|
|
2019
|
+
var preselectedItems = this.root.querySelectorAll(strings$2.ARIA_CHECKED_CHECKBOX_SELECTOR);
|
|
2020
|
+
this.selectedIndex = Array.from(preselectedItems, function (listItem) { return _this.listElements.indexOf(listItem); });
|
|
2021
|
+
}
|
|
2022
|
+
else if (radioSelectedListItem) {
|
|
2023
|
+
this.selectedIndex = this.listElements.indexOf(radioSelectedListItem);
|
|
2024
|
+
}
|
|
2025
|
+
};
|
|
2026
|
+
/**
|
|
2027
|
+
* Updates the list item at itemIndex to the desired isEnabled state.
|
|
2028
|
+
* @param itemIndex Index of the list item
|
|
2029
|
+
* @param isEnabled Sets the list item to enabled or disabled.
|
|
2030
|
+
*/
|
|
2031
|
+
MDCList.prototype.setEnabled = function (itemIndex, isEnabled) {
|
|
2032
|
+
this.foundation.setEnabled(itemIndex, isEnabled);
|
|
2033
|
+
};
|
|
2034
|
+
/**
|
|
2035
|
+
* Given the next desired character from the user, adds it to the typeahead
|
|
2036
|
+
* buffer. Then, attempts to find the next option matching the buffer. Wraps
|
|
2037
|
+
* around if at the end of options.
|
|
2038
|
+
*
|
|
2039
|
+
* @param nextChar The next character to add to the prefix buffer.
|
|
2040
|
+
* @param startingIndex The index from which to start matching. Defaults to
|
|
2041
|
+
* the currently focused index.
|
|
2042
|
+
* @return The index of the matched item.
|
|
2043
|
+
*/
|
|
2044
|
+
MDCList.prototype.typeaheadMatchItem = function (nextChar, startingIndex) {
|
|
2045
|
+
return this.foundation.typeaheadMatchItem(nextChar, startingIndex, /** skipFocus */ true);
|
|
2046
|
+
};
|
|
2047
|
+
MDCList.prototype.getDefaultFoundation = function () {
|
|
2048
|
+
var _this = this;
|
|
2049
|
+
// DO NOT INLINE this variable. For backward compatibility, foundations take
|
|
2050
|
+
// a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
|
|
2051
|
+
// methods, we need a separate, strongly typed adapter variable.
|
|
2052
|
+
var adapter = {
|
|
2053
|
+
addClassForElementIndex: function (index, className) {
|
|
2054
|
+
var element = _this.listElements[index];
|
|
2055
|
+
if (element) {
|
|
2056
|
+
element.classList.add(_this.classNameMap[className]);
|
|
2057
|
+
}
|
|
2058
|
+
},
|
|
2059
|
+
focusItemAtIndex: function (index) {
|
|
2060
|
+
var element = _this.listElements[index];
|
|
2061
|
+
if (element) {
|
|
2062
|
+
element.focus();
|
|
2063
|
+
}
|
|
2064
|
+
},
|
|
2065
|
+
getAttributeForElementIndex: function (index, attr) {
|
|
2066
|
+
return _this.listElements[index].getAttribute(attr);
|
|
2067
|
+
},
|
|
2068
|
+
getFocusedElementIndex: function () {
|
|
2069
|
+
return _this.listElements.indexOf(document.activeElement);
|
|
2070
|
+
},
|
|
2071
|
+
getListItemCount: function () { return _this.listElements.length; },
|
|
2072
|
+
getPrimaryTextAtIndex: function (index) {
|
|
2073
|
+
return _this.getPrimaryText(_this.listElements[index]);
|
|
2074
|
+
},
|
|
2075
|
+
hasCheckboxAtIndex: function (index) {
|
|
2076
|
+
var listItem = _this.listElements[index];
|
|
2077
|
+
return !!listItem.querySelector(strings$2.CHECKBOX_SELECTOR);
|
|
2078
|
+
},
|
|
2079
|
+
hasRadioAtIndex: function (index) {
|
|
2080
|
+
var listItem = _this.listElements[index];
|
|
2081
|
+
return !!listItem.querySelector(strings$2.RADIO_SELECTOR);
|
|
2082
|
+
},
|
|
2083
|
+
isCheckboxCheckedAtIndex: function (index) {
|
|
2084
|
+
var listItem = _this.listElements[index];
|
|
2085
|
+
var toggleEl = listItem.querySelector(strings$2.CHECKBOX_SELECTOR);
|
|
2086
|
+
return toggleEl.checked;
|
|
2087
|
+
},
|
|
2088
|
+
isFocusInsideList: function () {
|
|
2089
|
+
return _this.root !== document.activeElement &&
|
|
2090
|
+
_this.root.contains(document.activeElement);
|
|
2091
|
+
},
|
|
2092
|
+
isRootFocused: function () { return document.activeElement === _this.root; },
|
|
2093
|
+
listItemAtIndexHasClass: function (index, className) {
|
|
2094
|
+
return _this.listElements[index].classList.contains(_this.classNameMap[className]);
|
|
2095
|
+
},
|
|
2096
|
+
notifyAction: function (index) {
|
|
2097
|
+
_this.emit(strings$2.ACTION_EVENT, { index: index }, /** shouldBubble */ true);
|
|
2098
|
+
},
|
|
2099
|
+
removeClassForElementIndex: function (index, className) {
|
|
2100
|
+
var element = _this.listElements[index];
|
|
2101
|
+
if (element) {
|
|
2102
|
+
element.classList.remove(_this.classNameMap[className]);
|
|
2103
|
+
}
|
|
2104
|
+
},
|
|
2105
|
+
setAttributeForElementIndex: function (index, attr, value) {
|
|
2106
|
+
var element = _this.listElements[index];
|
|
2107
|
+
if (element) {
|
|
2108
|
+
element.setAttribute(attr, value);
|
|
2109
|
+
}
|
|
2110
|
+
},
|
|
2111
|
+
setCheckedCheckboxOrRadioAtIndex: function (index, isChecked) {
|
|
2112
|
+
var listItem = _this.listElements[index];
|
|
2113
|
+
var toggleEl = listItem.querySelector(strings$2.CHECKBOX_RADIO_SELECTOR);
|
|
2114
|
+
toggleEl.checked = isChecked;
|
|
2115
|
+
var event = document.createEvent('Event');
|
|
2116
|
+
event.initEvent('change', true, true);
|
|
2117
|
+
toggleEl.dispatchEvent(event);
|
|
2118
|
+
},
|
|
2119
|
+
setTabIndexForListItemChildren: function (listItemIndex, tabIndexValue) {
|
|
2120
|
+
var element = _this.listElements[listItemIndex];
|
|
2121
|
+
var selector = strings$2.CHILD_ELEMENTS_TO_TOGGLE_TABINDEX;
|
|
2122
|
+
Array.prototype.forEach.call(element.querySelectorAll(selector), function (el) {
|
|
2123
|
+
el.setAttribute('tabindex', tabIndexValue);
|
|
2124
|
+
});
|
|
2125
|
+
},
|
|
2126
|
+
};
|
|
2127
|
+
return new MDCListFoundation(adapter);
|
|
2128
|
+
};
|
|
2129
|
+
/**
|
|
2130
|
+
* Ensures that at least one item is focusable if the list is interactive and
|
|
2131
|
+
* doesn't specify a suitable tabindex.
|
|
2132
|
+
*/
|
|
2133
|
+
MDCList.prototype.ensureFocusable = function () {
|
|
2134
|
+
if (this.isEvolutionEnabled && this.isInteractive) {
|
|
2135
|
+
if (!this.root.querySelector("." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS] + "[tabindex=\"0\"]")) {
|
|
2136
|
+
var index = this.initialFocusIndex();
|
|
2137
|
+
if (index !== -1) {
|
|
2138
|
+
this.listElements[index].tabIndex = 0;
|
|
2139
|
+
}
|
|
2140
|
+
}
|
|
2141
|
+
}
|
|
2142
|
+
};
|
|
2143
|
+
MDCList.prototype.initialFocusIndex = function () {
|
|
2144
|
+
if (this.selectedIndex instanceof Array && this.selectedIndex.length > 0) {
|
|
2145
|
+
return this.selectedIndex[0];
|
|
2146
|
+
}
|
|
2147
|
+
if (typeof this.selectedIndex === 'number' &&
|
|
2148
|
+
this.selectedIndex !== numbers$2.UNSET_INDEX) {
|
|
2149
|
+
return this.selectedIndex;
|
|
2150
|
+
}
|
|
2151
|
+
var el = this.root.querySelector("." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS] + ":not(." + this.classNameMap[cssClasses$2.LIST_ITEM_DISABLED_CLASS] + ")");
|
|
2152
|
+
if (el === null) {
|
|
2153
|
+
return -1;
|
|
2154
|
+
}
|
|
2155
|
+
return this.getListItemIndex(el);
|
|
2156
|
+
};
|
|
2157
|
+
/**
|
|
2158
|
+
* Used to figure out which list item this event is targetting. Or returns -1
|
|
2159
|
+
* if there is no list item
|
|
2160
|
+
*/
|
|
2161
|
+
MDCList.prototype.getListItemIndex = function (el) {
|
|
2162
|
+
var nearestParent = ponyfill.closest(el, "." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS] + ", ." + this.classNameMap[cssClasses$2.ROOT]);
|
|
2163
|
+
// Get the index of the element if it is a list item.
|
|
2164
|
+
if (nearestParent &&
|
|
2165
|
+
ponyfill.matches(nearestParent, "." + this.classNameMap[cssClasses$2.LIST_ITEM_CLASS])) {
|
|
2166
|
+
return this.listElements.indexOf(nearestParent);
|
|
2167
|
+
}
|
|
2168
|
+
return -1;
|
|
2169
|
+
};
|
|
2170
|
+
/**
|
|
2171
|
+
* Used to figure out which element was clicked before sending the event to
|
|
2172
|
+
* the foundation.
|
|
2173
|
+
*/
|
|
2174
|
+
MDCList.prototype.handleFocusInEvent = function (evt) {
|
|
2175
|
+
var index = this.getListItemIndex(evt.target);
|
|
2176
|
+
this.foundation.handleFocusIn(index);
|
|
2177
|
+
};
|
|
2178
|
+
/**
|
|
2179
|
+
* Used to figure out which element was clicked before sending the event to
|
|
2180
|
+
* the foundation.
|
|
2181
|
+
*/
|
|
2182
|
+
MDCList.prototype.handleFocusOutEvent = function (evt) {
|
|
2183
|
+
var index = this.getListItemIndex(evt.target);
|
|
2184
|
+
this.foundation.handleFocusOut(index);
|
|
2185
|
+
};
|
|
2186
|
+
/**
|
|
2187
|
+
* Used to figure out which element was focused when keydown event occurred
|
|
2188
|
+
* before sending the event to the foundation.
|
|
2189
|
+
*/
|
|
2190
|
+
MDCList.prototype.handleKeydownEvent = function (evt) {
|
|
2191
|
+
var index = this.getListItemIndex(evt.target);
|
|
2192
|
+
var target = evt.target;
|
|
2193
|
+
this.foundation.handleKeydown(evt, target.classList.contains(this.classNameMap[cssClasses$2.LIST_ITEM_CLASS]), index);
|
|
2194
|
+
};
|
|
2195
|
+
/**
|
|
2196
|
+
* Used to figure out which element was clicked before sending the event to
|
|
2197
|
+
* the foundation.
|
|
2198
|
+
*/
|
|
2199
|
+
MDCList.prototype.handleClickEvent = function (evt) {
|
|
2200
|
+
var index = this.getListItemIndex(evt.target);
|
|
2201
|
+
var target = evt.target;
|
|
2202
|
+
// Toggle the checkbox only if it's not the target of the event, or the
|
|
2203
|
+
// checkbox will have 2 change events.
|
|
2204
|
+
var toggleCheckbox = !ponyfill.matches(target, strings$2.CHECKBOX_RADIO_SELECTOR);
|
|
2205
|
+
this.foundation.handleClick(index, toggleCheckbox);
|
|
2206
|
+
};
|
|
2207
|
+
return MDCList;
|
|
2208
|
+
}(ponyfill.MDCComponent));
|
|
2209
|
+
|
|
2210
|
+
const RadioButtonTemplate = (props) => {
|
|
2211
|
+
return (index.h("div", { class: "mdc-form-field" },
|
|
2212
|
+
index.h("div", { class: `
|
|
2213
|
+
mdc-radio
|
|
2214
|
+
${props.disabled ? 'mdc-radio--disabled' : ''}
|
|
2215
|
+
` },
|
|
2216
|
+
index.h("input", { class: "mdc-radio__native-control", type: "radio", id: props.id, checked: props.checked, disabled: props.disabled, onChange: props.onChange }),
|
|
2217
|
+
index.h("div", { class: "mdc-radio__background" },
|
|
2218
|
+
index.h("div", { class: "mdc-radio__outer-circle" }),
|
|
2219
|
+
index.h("div", { class: "mdc-radio__inner-circle" }))),
|
|
2220
|
+
index.h("label", { class: `${props.disabled ? 'disabled' : ''}`, htmlFor: props.id }, props.label)));
|
|
2221
|
+
};
|
|
2222
|
+
|
|
2223
|
+
class ListRenderer {
|
|
2224
|
+
constructor() {
|
|
2225
|
+
this.defaultConfig = {
|
|
2226
|
+
isOpen: true,
|
|
2227
|
+
badgeIcons: false,
|
|
2228
|
+
};
|
|
2229
|
+
/**
|
|
2230
|
+
* Determine which ListItem should have the `tab-index` attribute set,
|
|
2231
|
+
* and return the index at which that ListItem is located in `items`.
|
|
2232
|
+
* Returns `undefined` if no item should have the attribute set.
|
|
2233
|
+
* See https://github.com/material-components/material-components-web/tree/e66a43a75fef4f9179e24856649518e15e279a04/packages/mdc-list#accessibility
|
|
2234
|
+
*
|
|
2235
|
+
* @param items - the items of the list, including any `ListSeparator`:s
|
|
2236
|
+
* @returns the index as per the description
|
|
2237
|
+
*/
|
|
2238
|
+
this.getIndexForWhichToApplyTabIndex = (items) => {
|
|
2239
|
+
let result;
|
|
2240
|
+
for (let i = 0, max = items.length; i < max; i += 1) {
|
|
2241
|
+
if ('separator' in items[i]) ;
|
|
2242
|
+
else {
|
|
2243
|
+
const item = items[i];
|
|
2244
|
+
if (item.selected) {
|
|
2245
|
+
result = i;
|
|
2246
|
+
break;
|
|
2247
|
+
}
|
|
2248
|
+
if (result === undefined && !item.disabled) {
|
|
2249
|
+
result = i;
|
|
2250
|
+
// Do NOT break, as any later item with
|
|
2251
|
+
// `selected=true` should get the tab-index instead!
|
|
2252
|
+
}
|
|
2253
|
+
}
|
|
2254
|
+
}
|
|
2255
|
+
return result;
|
|
2256
|
+
};
|
|
2257
|
+
/**
|
|
2258
|
+
* Render a single list item
|
|
2259
|
+
*
|
|
2260
|
+
* @param item - the item to render
|
|
2261
|
+
* @param index - the index the item had in the `items` array
|
|
2262
|
+
* @returns the list item
|
|
2263
|
+
*/
|
|
2264
|
+
this.renderListItem = (item, index$1) => {
|
|
2265
|
+
if ('separator' in item) {
|
|
2266
|
+
return (index.h("li", { class: "mdc-deprecated-list-divider", role: "separator" },
|
|
2267
|
+
this.renderTextForSeparator(item),
|
|
2268
|
+
index.h("div", { class: "limel-list-divider-line" })));
|
|
2269
|
+
}
|
|
2270
|
+
if (['radio', 'checkbox'].includes(this.config.type)) {
|
|
2271
|
+
return this.renderVariantListItem(this.config, item, index$1);
|
|
2272
|
+
}
|
|
2273
|
+
const classNames = {
|
|
2274
|
+
'mdc-deprecated-list-item': true,
|
|
2275
|
+
'mdc-deprecated-list-item--disabled': item.disabled,
|
|
2276
|
+
'mdc-deprecated-list-item--selected': item.selected,
|
|
2277
|
+
'has-primary-component': this.hasPrimaryComponent(item),
|
|
2278
|
+
};
|
|
2279
|
+
const attributes = {};
|
|
2280
|
+
if (index$1 === this.applyTabIndexToItemAtIndex) {
|
|
2281
|
+
attributes.tabindex = '0';
|
|
2282
|
+
}
|
|
2283
|
+
return (index.h("li", Object.assign({ class: classNames, "aria-disabled": item.disabled ? 'true' : 'false', "aria-selected": item.selected ? 'true' : 'false', "data-index": index$1 }, attributes),
|
|
2284
|
+
this.renderIcon(this.config, item),
|
|
2285
|
+
this.getPrimaryComponent(item),
|
|
2286
|
+
this.renderText(item),
|
|
2287
|
+
this.twoLines && this.avatarList ? this.renderDivider() : null,
|
|
2288
|
+
this.renderActionMenu(item.actions)));
|
|
2289
|
+
};
|
|
2290
|
+
this.renderTextForSeparator = (item) => {
|
|
2291
|
+
if ('text' in item) {
|
|
2292
|
+
return index.h("h2", { class: "limel-list-divider-title" }, item.text);
|
|
2293
|
+
}
|
|
2294
|
+
};
|
|
2295
|
+
this.hasPrimaryComponent = (item) => {
|
|
2296
|
+
var _a;
|
|
2297
|
+
return !!((_a = item === null || item === void 0 ? void 0 : item.primaryComponent) === null || _a === void 0 ? void 0 : _a.name);
|
|
2298
|
+
};
|
|
2299
|
+
/**
|
|
2300
|
+
* Render the text of the list item
|
|
2301
|
+
*
|
|
2302
|
+
* @param item - the list item
|
|
2303
|
+
* @returns the text for the list item
|
|
2304
|
+
*/
|
|
2305
|
+
this.renderText = (item) => {
|
|
2306
|
+
if (this.isSimpleItem(item)) {
|
|
2307
|
+
return (index.h("span", { class: "mdc-deprecated-list-item__text" }, item.text));
|
|
2308
|
+
}
|
|
2309
|
+
return (index.h("div", { class: "mdc-deprecated-list-item__text" },
|
|
2310
|
+
index.h("div", { class: "mdc-deprecated-list-item__primary-command-text" },
|
|
2311
|
+
index.h("div", { class: "mdc-deprecated-list-item__primary-text" }, item.text)),
|
|
2312
|
+
index.h("div", { class: "mdc-deprecated-list-item__secondary-text" }, item.secondaryText)));
|
|
2313
|
+
};
|
|
2314
|
+
this.isSimpleItem = (item) => {
|
|
2315
|
+
return !('secondaryText' in item);
|
|
2316
|
+
};
|
|
2317
|
+
/**
|
|
2318
|
+
* Render an icon for a list item
|
|
2319
|
+
*
|
|
2320
|
+
* @param config - the config object, passed on from the `renderListItem` function
|
|
2321
|
+
* @param item - the list item
|
|
2322
|
+
* @returns the icon element
|
|
2323
|
+
*/
|
|
2324
|
+
this.renderIcon = (config, item) => {
|
|
2325
|
+
const style = {};
|
|
2326
|
+
const name = getIconProps.getIconName(item.icon);
|
|
2327
|
+
if (!name) {
|
|
2328
|
+
return;
|
|
2329
|
+
}
|
|
2330
|
+
const color = getIconProps.getIconColor(item.icon, item.iconColor);
|
|
2331
|
+
if (color) {
|
|
2332
|
+
if (config.badgeIcons) {
|
|
2333
|
+
style['--icon-background-color'] = color;
|
|
2334
|
+
}
|
|
2335
|
+
else {
|
|
2336
|
+
style.color = color;
|
|
2337
|
+
}
|
|
2338
|
+
}
|
|
2339
|
+
return (index.h("limel-icon", { badge: config.badgeIcons, class: "mdc-deprecated-list-item__graphic", name: name, style: style, size: config.iconSize }));
|
|
2340
|
+
};
|
|
2341
|
+
this.renderDivider = () => {
|
|
2342
|
+
const classes = {
|
|
2343
|
+
'mdc-deprecated-list-divider': true,
|
|
2344
|
+
'mdc-deprecated-list-divider--inset': true,
|
|
2345
|
+
};
|
|
2346
|
+
if (this.config.iconSize) {
|
|
2347
|
+
classes[this.config.iconSize] = true;
|
|
2348
|
+
}
|
|
2349
|
+
return index.h("hr", { class: classes });
|
|
2350
|
+
};
|
|
2351
|
+
this.renderActionMenu = (actions) => {
|
|
2352
|
+
if (!actions || actions.length === 0) {
|
|
2353
|
+
return;
|
|
2354
|
+
}
|
|
2355
|
+
return (index.h("limel-menu", { class: "mdc-deprecated-list-item__meta", items: actions, openDirection: "left-start" },
|
|
2356
|
+
index.h("limel-icon-button", { class: "action-menu-trigger", slot: "trigger", icon: "menu_2" })));
|
|
2357
|
+
};
|
|
2358
|
+
this.renderVariantListItem = (config, item, index$1) => {
|
|
2359
|
+
let itemTemplate;
|
|
2360
|
+
if (config.type === 'radio') {
|
|
2361
|
+
itemTemplate = (index.h(RadioButtonTemplate, { id: `c_${index$1}`, checked: item.selected, disabled: item.disabled }));
|
|
2362
|
+
}
|
|
2363
|
+
else if (config.type === 'checkbox') {
|
|
2364
|
+
itemTemplate = (index.h(checkbox_template.CheckboxTemplate, { id: `c_${index$1}`, checked: item.selected, disabled: item.disabled }));
|
|
2365
|
+
}
|
|
2366
|
+
const classNames = {
|
|
2367
|
+
'mdc-deprecated-list-item': true,
|
|
2368
|
+
'mdc-deprecated-list-item--disabled': item.disabled,
|
|
2369
|
+
'mdc-deprecated-list-item__text': !item.secondaryText,
|
|
2370
|
+
'has-primary-component': this.hasPrimaryComponent(item),
|
|
2371
|
+
};
|
|
2372
|
+
const attributes = {};
|
|
2373
|
+
if (index$1 === this.applyTabIndexToItemAtIndex) {
|
|
2374
|
+
attributes.tabindex = '0';
|
|
2375
|
+
}
|
|
2376
|
+
return (index.h("li", Object.assign({ class: classNames, role: config.type, "aria-checked": item.selected ? 'true' : 'false', "aria-disabled": item.disabled ? 'true' : 'false', "data-index": index$1 }, attributes), this.renderVariantListItemContent(config, item, itemTemplate)));
|
|
2377
|
+
};
|
|
2378
|
+
this.renderVariantListItemContent = (config, item, itemTemplate) => {
|
|
2379
|
+
if (this.hasIcons) {
|
|
2380
|
+
return [
|
|
2381
|
+
item.icon ? this.renderIcon(config, item) : null,
|
|
2382
|
+
this.getPrimaryComponent(item),
|
|
2383
|
+
this.renderText(item),
|
|
2384
|
+
index.h("div", { class: "mdc-deprecated-list-item__meta" }, itemTemplate),
|
|
2385
|
+
];
|
|
2386
|
+
}
|
|
2387
|
+
return [
|
|
2388
|
+
index.h("div", { class: "mdc-deprecated-list-item__graphic" }, itemTemplate),
|
|
2389
|
+
this.getPrimaryComponent(item),
|
|
2390
|
+
this.renderText(item),
|
|
2391
|
+
];
|
|
2392
|
+
};
|
|
2393
|
+
}
|
|
2394
|
+
render(items, config = {}) {
|
|
2395
|
+
items = items || [];
|
|
2396
|
+
this.config = Object.assign(Object.assign({}, this.defaultConfig), config);
|
|
2397
|
+
this.twoLines = items.some((item) => {
|
|
2398
|
+
return 'secondaryText' in item && !!item.secondaryText;
|
|
2399
|
+
});
|
|
2400
|
+
this.hasIcons = items.some((item) => {
|
|
2401
|
+
return 'icon' in item && !!item.icon;
|
|
2402
|
+
});
|
|
2403
|
+
this.avatarList = this.config.badgeIcons && this.hasIcons;
|
|
2404
|
+
const selectableListTypes = ['selectable', 'radio', 'checkbox'];
|
|
2405
|
+
let role;
|
|
2406
|
+
switch (this.config.type) {
|
|
2407
|
+
case 'checkbox':
|
|
2408
|
+
role = 'group';
|
|
2409
|
+
break;
|
|
2410
|
+
case 'radio':
|
|
2411
|
+
role = 'radiogroup';
|
|
2412
|
+
break;
|
|
2413
|
+
default:
|
|
2414
|
+
role = 'listbox';
|
|
2415
|
+
}
|
|
2416
|
+
this.applyTabIndexToItemAtIndex =
|
|
2417
|
+
this.getIndexForWhichToApplyTabIndex(items);
|
|
2418
|
+
const classNames = {
|
|
2419
|
+
'mdc-deprecated-list': true,
|
|
2420
|
+
'mdc-deprecated-list--two-line': this.twoLines,
|
|
2421
|
+
selectable: selectableListTypes.includes(this.config.type),
|
|
2422
|
+
'mdc-deprecated-list--avatar-list': this.avatarList,
|
|
2423
|
+
'list--compact': this.twoLines &&
|
|
2424
|
+
this.commandKey &&
|
|
2425
|
+
['small', 'x-small'].includes(this.config.iconSize),
|
|
2426
|
+
};
|
|
2427
|
+
return (index.h("ul", { class: classNames, role: role, "aria-orientation": "vertical" }, items.map(this.renderListItem)));
|
|
2428
|
+
}
|
|
2429
|
+
getPrimaryComponent(item) {
|
|
2430
|
+
if (!this.hasPrimaryComponent(item)) {
|
|
2431
|
+
return;
|
|
2432
|
+
}
|
|
2433
|
+
const PrimaryComponent = item.primaryComponent.name;
|
|
2434
|
+
const props = item.primaryComponent.props;
|
|
2435
|
+
return index.h(PrimaryComponent, Object.assign({}, props));
|
|
2436
|
+
}
|
|
2437
|
+
}
|
|
2438
|
+
|
|
2439
|
+
const listCss = "@charset \"UTF-8\";:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}:host(limel-checkbox){--mdc-checkbox-checked-color:var(--mdc-theme-primary);--mdc-checkbox-unchecked-color:var(\n --checkbox-unchecked-border-color,\n rgb(var(--contrast-900))\n );--lime-checkbox-unchecked-color:rgb(var(--contrast-300));min-height:2.5rem}limel-dynamic-label{margin-top:0.375rem;margin-left:0.25rem}.mdc-checkbox{padding:calc((40px - 18px) / 2);padding:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);margin:calc((40px - 40px) / 2);margin:calc((var(--mdc-checkbox-touch-target-size, 40px) - 40px) / 2)}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-checkbox:hover .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-surface--hover .mdc-checkbox__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-checkbox.mdc-ripple-upgraded--background-focused .mdc-checkbox__ripple::before,.mdc-checkbox:not(.mdc-ripple-upgraded):focus .mdc-checkbox__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-checkbox:not(.mdc-ripple-upgraded) .mdc-checkbox__ripple::after{transition:opacity 150ms linear}.mdc-checkbox:not(.mdc-ripple-upgraded):active .mdc-checkbox__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected .mdc-checkbox__ripple::after{background-color:#575756;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #575756))}.mdc-checkbox.mdc-checkbox--selected:hover .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-surface--hover .mdc-checkbox__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-upgraded--background-focused .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded):focus .mdc-checkbox__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded) .mdc-checkbox__ripple::after{transition:opacity 150ms linear}.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded):active .mdc-checkbox__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-ripple-upgraded--background-focused.mdc-checkbox--selected .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-upgraded--background-focused.mdc-checkbox--selected .mdc-checkbox__ripple::after{background-color:#575756;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #575756))}.mdc-checkbox .mdc-checkbox__background{top:calc((40px - 18px) / 2);top:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);left:calc((40px - 18px) / 2);left:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2)}.mdc-checkbox .mdc-checkbox__native-control{top:calc((40px - 40px) / 2);top:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);right:calc((40px - 40px) / 2);right:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);left:calc((40px - 40px) / 2);left:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);width:40px;width:var(--mdc-checkbox-touch-target-size, 40px);height:40px;height:var(--mdc-checkbox-touch-target-size, 40px)}.mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}.mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}@keyframes mdc-checkbox-fade-in-background-8A000000FF57575600000000FF575756{0%{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}50%{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}}@keyframes mdc-checkbox-fade-out-background-8A000000FF57575600000000FF575756{0%,80%{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}100%{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}}.mdc-checkbox.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{animation-name:mdc-checkbox-fade-in-background-8A000000FF57575600000000FF575756}.mdc-checkbox.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{animation-name:mdc-checkbox-fade-out-background-8A000000FF57575600000000FF575756}.mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:rgba(0, 0, 0, 0.38);border-color:var(--mdc-checkbox-disabled-color, rgba(0, 0, 0, 0.38));background-color:transparent}.mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{border-color:transparent;background-color:rgba(0, 0, 0, 0.38);background-color:var(--mdc-checkbox-disabled-color, rgba(0, 0, 0, 0.38))}.mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff;color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:#fff;border-color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff;color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:#fff;border-color:var(--mdc-checkbox-ink-color, #fff)}.mdc-touch-target-wrapper{display:inline}@keyframes mdc-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:29.7833385}50%{animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}100%{stroke-dashoffset:0}}@keyframes mdc-checkbox-unchecked-indeterminate-mixedmark{0%,68.2%{transform:scaleX(0)}68.2%{animation-timing-function:cubic-bezier(0, 0, 0, 1)}100%{transform:scaleX(1)}}@keyframes mdc-checkbox-checked-unchecked-checkmark-path{from{animation-timing-function:cubic-bezier(0.4, 0, 1, 1);opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:-29.7833385}}@keyframes mdc-checkbox-checked-indeterminate-checkmark{from{animation-timing-function:cubic-bezier(0, 0, 0.2, 1);transform:rotate(0deg);opacity:1}to{transform:rotate(45deg);opacity:0}}@keyframes mdc-checkbox-indeterminate-checked-checkmark{from{animation-timing-function:cubic-bezier(0.14, 0, 0, 1);transform:rotate(45deg);opacity:0}to{transform:rotate(360deg);opacity:1}}@keyframes mdc-checkbox-checked-indeterminate-mixedmark{from{animation-timing-function:mdc-animation-deceleration-curve-timing-function;transform:rotate(-45deg);opacity:0}to{transform:rotate(0deg);opacity:1}}@keyframes mdc-checkbox-indeterminate-checked-mixedmark{from{animation-timing-function:cubic-bezier(0.14, 0, 0, 1);transform:rotate(0deg);opacity:1}to{transform:rotate(315deg);opacity:0}}@keyframes mdc-checkbox-indeterminate-unchecked-mixedmark{0%{animation-timing-function:linear;transform:scaleX(1);opacity:1}32.8%,100%{transform:scaleX(0);opacity:0}}.mdc-checkbox{display:inline-block;position:relative;flex:0 0 18px;box-sizing:content-box;width:18px;height:18px;line-height:0;white-space:nowrap;cursor:pointer;vertical-align:bottom}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:GrayText;border-color:var(--mdc-checkbox-disabled-color, GrayText);background-color:transparent}.mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,.mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,.mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{border-color:GrayText;background-color:transparent;background-color:var(--mdc-checkbox-disabled-color, transparent)}.mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:GrayText;color:var(--mdc-checkbox-ink-color, GrayText)}.mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:GrayText;border-color:var(--mdc-checkbox-ink-color, GrayText)}.mdc-checkbox__mixedmark{margin:0 1px}}.mdc-checkbox--disabled{cursor:default;pointer-events:none}.mdc-checkbox__background{display:inline-flex;position:absolute;align-items:center;justify-content:center;box-sizing:border-box;width:18px;height:18px;border:2px solid currentColor;border-radius:2px;background-color:transparent;pointer-events:none;will-change:background-color, border-color;transition:background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox__checkmark{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;transition:opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox--upgraded .mdc-checkbox__checkmark{opacity:1}.mdc-checkbox__checkmark-path{transition:stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);stroke:currentColor;stroke-width:3.12px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-checkbox__mixedmark{width:100%;height:0;transform:scaleX(0) rotate(0deg);border-width:1px;border-style:solid;opacity:0;transition:opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background,.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background,.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background{animation-duration:180ms;animation-timing-function:linear}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-unchecked-checked-checkmark-path 180ms linear 0s;transition:none}.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__mixedmark{animation:mdc-checkbox-unchecked-indeterminate-mixedmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-checked-unchecked-checkmark-path 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__checkmark{animation:mdc-checkbox-checked-indeterminate-checkmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__mixedmark{animation:mdc-checkbox-checked-indeterminate-mixedmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__checkmark{animation:mdc-checkbox-indeterminate-checked-checkmark 500ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__mixedmark{animation:mdc-checkbox-indeterminate-checked-mixedmark 500ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__mixedmark{animation:mdc-checkbox-indeterminate-unchecked-mixedmark 300ms linear 0s;transition:none}.mdc-checkbox__native-control:checked~.mdc-checkbox__background,.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background{transition:border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark-path,.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__checkmark-path,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__checkmark-path{stroke-dashoffset:0}.mdc-checkbox__native-control{position:absolute;margin:0;padding:0;opacity:0;cursor:inherit}.mdc-checkbox__native-control:disabled{cursor:default;pointer-events:none}.mdc-checkbox--touch{margin:calc((48px - 40px) / 2);margin:calc((var(--mdc-checkbox-state-layer-size, 48px) - var(--mdc-checkbox-state-layer-size, 40px)) / 2)}.mdc-checkbox--touch .mdc-checkbox__native-control{top:calc((40px - 48px) / 2);top:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);right:calc((40px - 48px) / 2);right:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);left:calc((40px - 48px) / 2);left:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);width:48px;width:var(--mdc-checkbox-state-layer-size, 48px);height:48px;height:var(--mdc-checkbox-state-layer-size, 48px)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark{transition:opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);opacity:1}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__mixedmark{transform:scaleX(1) rotate(-45deg)}.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__checkmark,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__checkmark{transform:rotate(45deg);opacity:0;transition:opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__mixedmark,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__mixedmark{transform:scaleX(1) rotate(0deg);opacity:1}.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__checkmark,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__checkmark-path,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__mixedmark{transition:none}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-checkbox{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-checkbox .mdc-checkbox__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-checkbox .mdc-checkbox__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-checkbox.mdc-ripple-upgraded--unbounded .mdc-checkbox__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-checkbox.mdc-ripple-upgraded--foreground-activation .mdc-checkbox__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-checkbox.mdc-ripple-upgraded--foreground-deactivation .mdc-checkbox__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-checkbox{z-index:0}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{z-index:-1;z-index:var(--mdc-ripple-z-index, -1)}.mdc-checkbox__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));display:inline-flex;align-items:center;vertical-align:middle}.mdc-form-field>label{margin-left:0;margin-right:auto;padding-left:4px;padding-right:0;order:0}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{margin-left:auto;margin-right:0;}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{padding-left:0;padding-right:4px;}.mdc-form-field--nowrap>label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.mdc-form-field--align-end>label{margin-left:auto;margin-right:0;padding-left:0;padding-right:4px;order:-1}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{margin-left:0;margin-right:auto;}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{padding-left:4px;padding-right:0;}.mdc-form-field--space-between{justify-content:space-between}.mdc-form-field--space-between>label{margin:0}[dir=rtl] .mdc-form-field--space-between>label,.mdc-form-field--space-between>label[dir=rtl]{margin:0;}.mdc-form-field{font-family:inherit}.mdc-form-field{display:flex;align-items:flex-start}.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate)~.mdc-checkbox__background,.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate)~.mdc-checkbox__background{background-color:var(--lime-checkbox-unchecked-color)}.mdc-form-field .mdc-checkbox.mdc-checkbox--invalid .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate)~.mdc-checkbox__background{border-color:var(--lime-error-text-color)}.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control:focus-visible+.mdc-checkbox__background:after{content:\"\";display:block;position:absolute;inset:-0.25rem;border-radius:0.25rem;box-shadow:var(--shadow-depth-8-focused)}.mdc-form-field .mdc-checkbox--disabled{opacity:0.5}.mdc-form-field label{cursor:pointer;line-height:normal;letter-spacing:normal;padding-top:0.75rem;padding-left:0}.mdc-form-field label.mdc-checkbox--required::after{margin-left:0.0625rem;content:\"*\"}.mdc-form-field label.mdc-checkbox--invalid{color:var(--lime-error-text-color)}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within),:host(limel-checkbox[invalid]:not([invalid=false])),:host(limel-checkbox[invalid=true]){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}:host(limel-list){display:block;isolation:isolate;--mdc-checkbox-checked-color:var(--mdc-theme-primary);--mdc-checkbox-unchecked-color:var(\n --checkbox-unchecked-border-color,\n rgb(var(--contrast-900))\n );--lime-checkbox-unchecked-color:rgb(var(--contrast-300))}:host([hidden]){display:none}.mdc-deprecated-list{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, inherit));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);line-height:1.5rem;margin:0;padding:8px 0;list-style-type:none;color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mdc-deprecated-list:focus{outline:none}.mdc-deprecated-list-item{height:48px}.mdc-deprecated-list-item__secondary-text{color:rgba(0, 0, 0, 0.54);color:var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54))}.mdc-deprecated-list-item__graphic{background-color:transparent}.mdc-deprecated-list-item__graphic{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38))}.mdc-deprecated-list-item__meta{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38))}.mdc-deprecated-list-group__subheader{color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__text{opacity:0.38}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__text,.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__secondary-text{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-list-item--selected,.mdc-deprecated-list-item--activated{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-deprecated-list-item--selected .mdc-deprecated-list-item__graphic,.mdc-deprecated-list-item--activated .mdc-deprecated-list-item__graphic{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-deprecated-list--dense{padding-top:4px;padding-bottom:4px;font-size:0.812rem}.mdc-deprecated-list-item{display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;padding:0;padding-left:16px;padding-right:16px;height:48px}.mdc-deprecated-list-item:focus{outline:none}.mdc-deprecated-list-item:not(.mdc-deprecated-list-item--selected):focus::before,.mdc-deprecated-list-item.mdc-ripple-upgraded--background-focused::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}.mdc-deprecated-list-item.mdc-deprecated-list-item--selected::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:3px double transparent;border-radius:inherit;content:\"\";pointer-events:none}[dir=rtl] .mdc-deprecated-list-item,.mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-item{padding-left:16px;padding-right:16px;height:56px}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-item,.mdc-deprecated-list--icon-list .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item{padding-left:16px;padding-right:16px;height:56px}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-item,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item{padding-left:16px;padding-right:16px;height:56px}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-deprecated-list--image-list .mdc-deprecated-list-item{padding-left:16px;padding-right:16px;height:72px}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-item,.mdc-deprecated-list--image-list .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-deprecated-list--video-list .mdc-deprecated-list-item{padding-left:0px;padding-right:16px;height:72px}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-item,.mdc-deprecated-list--video-list .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:0px;}.mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:20px;height:20px}[dir=rtl] .mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-deprecated-list-item__graphic{flex-shrink:0;align-items:center;justify-content:center;fill:currentColor;object-fit:cover;margin-left:0;margin-right:32px;width:24px;height:24px}[dir=rtl] .mdc-deprecated-list-item__graphic,.mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:32px;margin-right:0;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:32px;width:24px;height:24px}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:32px;margin-right:0;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:40px;height:40px;border-radius:50%}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:40px;height:40px}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-deprecated-list--image-list .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:56px;height:56px}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--image-list .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-deprecated-list--video-list .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:100px;height:56px}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--video-list .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-deprecated-list .mdc-deprecated-list-item__graphic{display:inline-flex}.mdc-deprecated-list-item__meta{margin-left:auto;margin-right:0}.mdc-deprecated-list-item__meta:not(.material-icons){-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, inherit));font-size:0.6875rem;font-size:var(--mdc-typography-caption-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-caption-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}.mdc-deprecated-list-item[dir=rtl] .mdc-deprecated-list-item__meta,[dir=rtl] .mdc-deprecated-list-item .mdc-deprecated-list-item__meta{margin-left:0;margin-right:auto}.mdc-deprecated-list-item__text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-deprecated-list-item__text[for]{pointer-events:none}.mdc-deprecated-list-item__primary-text{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-deprecated-list-item__primary-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-deprecated-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-deprecated-list--video-list .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list--image-list .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-deprecated-list--video-list .mdc-deprecated-list-item__primary-text::before,.mdc-deprecated-list--image-list .mdc-deprecated-list-item__primary-text::before,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__primary-text::before,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__primary-text::before,.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-deprecated-list--video-list .mdc-deprecated-list-item__primary-text::after,.mdc-deprecated-list--image-list .mdc-deprecated-list-item__primary-text::after,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item__primary-text::after,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item__primary-text::after,.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-deprecated-list--dense .mdc-deprecated-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-deprecated-list--dense .mdc-deprecated-list-item__primary-text::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-deprecated-list--dense .mdc-deprecated-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-deprecated-list-item__secondary-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;margin-top:0;line-height:normal}.mdc-deprecated-list-item__secondary-text::before{display:inline-block;width:0;height:20px;content:\"\";vertical-align:0}.mdc-deprecated-list--dense .mdc-deprecated-list-item__secondary-text{font-size:inherit}.mdc-deprecated-list--dense .mdc-deprecated-list-item{height:40px}.mdc-deprecated-list--two-line .mdc-deprecated-list-item__text{align-self:flex-start}.mdc-deprecated-list--two-line .mdc-deprecated-list-item{height:64px}.mdc-deprecated-list--two-line.mdc-deprecated-list--video-list .mdc-deprecated-list-item,.mdc-deprecated-list--two-line.mdc-deprecated-list--image-list .mdc-deprecated-list-item,.mdc-deprecated-list--two-line.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-item,.mdc-deprecated-list--two-line.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item,.mdc-deprecated-list--two-line.mdc-deprecated-list--icon-list .mdc-deprecated-list-item{height:72px}.mdc-deprecated-list--two-line.mdc-deprecated-list--icon-list .mdc-deprecated-list-item__graphic{align-self:flex-start;margin-top:16px}.mdc-deprecated-list--two-line.mdc-deprecated-list--dense .mdc-deprecated-list-item,.mdc-deprecated-list--avatar-list.mdc-deprecated-list--dense .mdc-deprecated-list-item{height:60px}.mdc-deprecated-list--avatar-list.mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic{margin-left:0;margin-right:16px;width:36px;height:36px}[dir=rtl] .mdc-deprecated-list--avatar-list.mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic,.mdc-deprecated-list--avatar-list.mdc-deprecated-list--dense .mdc-deprecated-list-item__graphic[dir=rtl]{margin-left:16px;margin-right:0;}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item{cursor:pointer}a.mdc-deprecated-list-item{color:inherit;text-decoration:none}.mdc-deprecated-list-divider{height:0;margin:0;border:none;border-bottom-width:1px;border-bottom-style:solid}.mdc-deprecated-list-divider{border-bottom-color:rgba(0, 0, 0, 0.12)}.mdc-deprecated-list-divider--padded{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list-divider--padded,.mdc-deprecated-list-divider--padded[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list-divider--inset{margin-left:72px;margin-right:0;width:calc(100% - 72px)}[dir=rtl] .mdc-deprecated-list-divider--inset,.mdc-deprecated-list-divider--inset[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list-divider--inset.mdc-deprecated-list-divider--padded{margin-left:72px;margin-right:0;width:calc(100% - 88px)}[dir=rtl] .mdc-deprecated-list-divider--inset.mdc-deprecated-list-divider--padded,.mdc-deprecated-list-divider--inset.mdc-deprecated-list-divider--padded[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading{margin-left:72px;margin-right:0;width:calc(100% - 72px)}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:72px;margin-right:0;width:calc(100% - 88px)}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list--icon-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading{margin-left:72px;margin-right:0;width:calc(100% - 72px)}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:72px;margin-right:0;width:calc(100% - 88px)}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list--avatar-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading{margin-left:72px;margin-right:0;width:calc(100% - 72px)}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:72px;margin-right:0;width:calc(100% - 88px)}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:72px;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list--thumbnail-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading{margin-left:88px;margin-right:0;width:calc(100% - 88px)}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:88px;}.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:88px;margin-right:0;width:calc(100% - 104px)}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:88px;}.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:16px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:16px;margin-right:0;width:calc(100% - 32px)}[dir=rtl] .mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list--image-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:16px;}.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading{margin-left:116px;margin-right:0;width:calc(100% - 116px)}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading,.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading[dir=rtl]{margin-left:0;margin-right:116px;}.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-trailing{width:calc(100% - 16px)}.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing{margin-left:116px;margin-right:0;width:calc(100% - 132px)}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing,.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing[dir=rtl]{margin-left:0;margin-right:116px;}.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding{margin-left:0px;margin-right:0;width:calc(100% - 0px)}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding,.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--padding[dir=rtl]{margin-left:0;margin-right:0px;}.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding{margin-left:0px;margin-right:0;width:calc(100% - 16px)}[dir=rtl] .mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding,.mdc-deprecated-list--video-list .mdc-deprecated-list-divider--inset-leading.mdc-deprecated-list-divider--inset-trailing.mdc-deprecated-list-divider--inset-padding[dir=rtl]{margin-left:0;margin-right:0px;}.mdc-deprecated-list-group .mdc-deprecated-list{padding:0}.mdc-deprecated-list-group__subheader{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, inherit));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);margin:calc((3rem - 1.5rem) / 2) 16px}.mdc-list-item__primary-text{color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}.mdc-list-item__secondary-text{color:rgba(0, 0, 0, 0.54);color:var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54))}.mdc-list-item__overline-text{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38))}.mdc-list-item--with-leading-icon .mdc-list-item__start,.mdc-list-item--with-trailing-icon .mdc-list-item__end{background-color:transparent}.mdc-list-item--with-leading-icon .mdc-list-item__start,.mdc-list-item--with-trailing-icon .mdc-list-item__end{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38))}.mdc-list-item__end{color:rgba(0, 0, 0, 0.38);color:var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38))}.mdc-list-item--disabled .mdc-list-item__start,.mdc-list-item--disabled .mdc-list-item__content,.mdc-list-item--disabled .mdc-list-item__end{opacity:0.38}.mdc-list-item--disabled .mdc-list-item__primary-text{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--disabled .mdc-list-item__secondary-text{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--disabled .mdc-list-item__overline-text{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--disabled.mdc-list-item--with-leading-icon .mdc-list-item__start{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--disabled.mdc-list-item--with-trailing-icon .mdc-list-item__end{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--disabled.mdc-list-item--with-trailing-meta .mdc-list-item__end{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-list-item--selected .mdc-list-item__primary-text,.mdc-list-item--activated .mdc-list-item__primary-text{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-list-item--selected.mdc-list-item--with-leading-icon .mdc-list-item__start,.mdc-list-item--activated.mdc-list-item--with-leading-icon .mdc-list-item__start{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-deprecated-list-group__subheader{color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87))}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-list-divider::after{content:\"\";display:block;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:white}}.mdc-list{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, inherit));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);line-height:1.5rem;margin:0;padding:8px 0;list-style-type:none}.mdc-list:focus{outline:none}.mdc-list-item{display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;padding:0;align-items:stretch;cursor:pointer}.mdc-list-item:focus{outline:none}.mdc-list-item.mdc-list-item--with-one-line{height:48px}.mdc-list-item.mdc-list-item--with-two-lines{height:64px}.mdc-list-item.mdc-list-item--with-three-lines{height:88px}.mdc-list-item.mdc-list-item--with-one-line .mdc-list-item__start{align-self:center;margin-top:0}.mdc-list-item.mdc-list-item--with-two-lines .mdc-list-item__start{align-self:flex-start;margin-top:16px}.mdc-list-item.mdc-list-item--with-three-lines .mdc-list-item__start{align-self:flex-start;margin-top:16px}.mdc-list-item.mdc-list-item--with-one-line .mdc-list-item__end{align-self:center;margin-top:0}.mdc-list-item.mdc-list-item--with-two-lines .mdc-list-item__end{align-self:center;margin-top:0}.mdc-list-item.mdc-list-item--with-three-lines .mdc-list-item__end{align-self:flex-start;margin-top:16px}.mdc-list-item.mdc-list-item--disabled,.mdc-list-item.mdc-list-item--non-interactive{cursor:auto}.mdc-list-item:not(.mdc-list-item--selected):focus::before,.mdc-list-item.mdc-ripple-upgraded--background-focused::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}.mdc-list-item.mdc-list-item--selected::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:3px double transparent;border-radius:inherit;content:\"\";pointer-events:none}.mdc-list-item.mdc-list-item--selected:focus::before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:3px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}a.mdc-list-item{color:inherit;text-decoration:none}.mdc-list-item__start{fill:currentColor;flex-shrink:0;pointer-events:none}.mdc-list-item__end{flex-shrink:0;pointer-events:none}.mdc-list-item__content{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;align-self:center;flex:1;pointer-events:none}.mdc-list-item--with-two-lines .mdc-list-item__content,.mdc-list-item--with-three-lines .mdc-list-item__content{align-self:stretch}.mdc-list-item__content[for]{pointer-events:none}.mdc-list-item__primary-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, inherit));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-list-item--with-two-lines .mdc-list-item__primary-text,.mdc-list-item--with-three-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before,.mdc-list-item--with-three-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after,.mdc-list-item--with-three-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item__secondary-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);text-overflow:ellipsis;white-space:nowrap;overflow:hidden;display:block;margin-top:0;line-height:normal}.mdc-list-item__secondary-text::before{display:inline-block;width:0;height:20px;content:\"\";vertical-align:0}.mdc-list-item--with-three-lines .mdc-list-item__secondary-text{white-space:normal;line-height:20px}.mdc-list-item--with-overline .mdc-list-item__secondary-text{white-space:nowrap;line-height:auto}.mdc-list-item__overline-text{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-overline-font-family, var(--mdc-typography-font-family, inherit));font-size:0.6875rem;font-size:var(--mdc-typography-overline-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-overline-line-height, 0.875rem);font-weight:500;font-weight:var(--mdc-typography-overline-font-weight, 500);letter-spacing:0.1666666667em;letter-spacing:var(--mdc-typography-overline-letter-spacing, 0.1666666667em);text-decoration:none;text-decoration:var(--mdc-typography-overline-text-decoration, none);text-transform:uppercase;text-transform:var(--mdc-typography-overline-text-transform, uppercase);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:24px;content:\"\";vertical-align:0}.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-three-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-three-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-three-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-avatar.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-avatar.mdc-list-item,.mdc-list-item--with-leading-avatar.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-avatar .mdc-list-item__start{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-leading-avatar .mdc-list-item__start,.mdc-list-item--with-leading-avatar .mdc-list-item__start[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-leading-avatar .mdc-list-item__start{width:40px;height:40px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-avatar .mdc-list-item__start{border-radius:50%}.mdc-list-item--with-leading-icon .mdc-list-item__start{width:24px;height:24px}.mdc-list-item--with-leading-icon.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-icon.mdc-list-item,.mdc-list-item--with-leading-icon.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-icon .mdc-list-item__start{margin-left:16px;margin-right:32px}[dir=rtl] .mdc-list-item--with-leading-icon .mdc-list-item__start,.mdc-list-item--with-leading-icon .mdc-list-item__start[dir=rtl]{margin-left:32px;margin-right:16px;}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-thumbnail.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-thumbnail.mdc-list-item,.mdc-list-item--with-leading-thumbnail.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-thumbnail .mdc-list-item__start{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-leading-thumbnail .mdc-list-item__start,.mdc-list-item--with-leading-thumbnail .mdc-list-item__start[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-leading-thumbnail .mdc-list-item__start{width:40px;height:40px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-thumbnail.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-image.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-image.mdc-list-item,.mdc-list-item--with-leading-image.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-image .mdc-list-item__start{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-leading-image .mdc-list-item__start,.mdc-list-item--with-leading-image .mdc-list-item__start[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-leading-image .mdc-list-item__start{width:56px;height:56px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-image.mdc-list-item--with-one-line{height:72px}.mdc-list-item--with-leading-image.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__start{align-self:flex-start;margin-top:8px}.mdc-list-item--with-leading-video.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-video.mdc-list-item,.mdc-list-item--with-leading-video.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-video .mdc-list-item__start{margin-left:0;margin-right:16px}[dir=rtl] .mdc-list-item--with-leading-video .mdc-list-item__start,.mdc-list-item--with-leading-video .mdc-list-item__start[dir=rtl]{margin-left:16px;margin-right:0;}.mdc-list-item--with-leading-video .mdc-list-item__start{width:100px;height:56px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-video.mdc-list-item--with-one-line{height:72px}.mdc-list-item--with-leading-video.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-checkbox.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-checkbox.mdc-list-item,.mdc-list-item--with-leading-checkbox.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-checkbox .mdc-list-item__start{margin-left:8px;margin-right:24px}[dir=rtl] .mdc-list-item--with-leading-checkbox .mdc-list-item__start,.mdc-list-item--with-leading-checkbox .mdc-list-item__start[dir=rtl]{margin-left:24px;margin-right:8px;}.mdc-list-item--with-leading-checkbox .mdc-list-item__start{width:40px;height:40px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__start{align-self:flex-start;margin-top:8px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-radio.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-radio.mdc-list-item,.mdc-list-item--with-leading-radio.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-radio .mdc-list-item__start{margin-left:8px;margin-right:24px}[dir=rtl] .mdc-list-item--with-leading-radio .mdc-list-item__start,.mdc-list-item--with-leading-radio .mdc-list-item__start[dir=rtl]{margin-left:24px;margin-right:8px;}.mdc-list-item--with-leading-radio .mdc-list-item__start{width:40px;height:40px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__start{align-self:flex-start;margin-top:8px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-radio.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-radio.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-leading-switch.mdc-list-item{padding-left:0;padding-right:auto}[dir=rtl] .mdc-list-item--with-leading-switch.mdc-list-item,.mdc-list-item--with-leading-switch.mdc-list-item[dir=rtl]{padding-left:auto;padding-right:0;}.mdc-list-item--with-leading-switch .mdc-list-item__start{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-leading-switch .mdc-list-item__start,.mdc-list-item--with-leading-switch .mdc-list-item__start[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-leading-switch .mdc-list-item__start{width:36px;height:20px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__start{align-self:flex-start;margin-top:16px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__primary-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__overline-text{display:block;margin-top:0;line-height:normal;margin-bottom:-20px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__overline-text::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines .mdc-list-item__overline-text::after{display:inline-block;width:0;height:20px;content:\"\";vertical-align:-20px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines.mdc-list-item--with-trailing-meta .mdc-list-item__end::before{display:inline-block;width:0;height:32px;content:\"\";vertical-align:0}.mdc-list-item--with-leading-switch.mdc-list-item--with-one-line{height:56px}.mdc-list-item--with-leading-switch.mdc-list-item--with-two-lines{height:72px}.mdc-list-item--with-trailing-icon.mdc-list-item{padding-left:auto;padding-right:0}[dir=rtl] .mdc-list-item--with-trailing-icon.mdc-list-item,.mdc-list-item--with-trailing-icon.mdc-list-item[dir=rtl]{padding-left:0;padding-right:auto;}.mdc-list-item--with-trailing-icon .mdc-list-item__end{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-trailing-icon .mdc-list-item__end,.mdc-list-item--with-trailing-icon .mdc-list-item__end[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-trailing-icon .mdc-list-item__end{width:24px;height:24px}.mdc-list-item--with-trailing-meta.mdc-list-item--with-two-lines .mdc-list-item__end{align-self:flex-start;margin-top:0}.mdc-list-item--with-trailing-meta.mdc-list-item--with-three-lines .mdc-list-item__end{align-self:flex-start;margin-top:0}.mdc-list-item--with-trailing-meta.mdc-list-item{padding-left:auto;padding-right:0}[dir=rtl] .mdc-list-item--with-trailing-meta.mdc-list-item,.mdc-list-item--with-trailing-meta.mdc-list-item[dir=rtl]{padding-left:0;padding-right:auto;}.mdc-list-item--with-trailing-meta .mdc-list-item__end{margin-left:28px;margin-right:16px}[dir=rtl] .mdc-list-item--with-trailing-meta .mdc-list-item__end,.mdc-list-item--with-trailing-meta .mdc-list-item__end[dir=rtl]{margin-left:16px;margin-right:28px;}.mdc-list-item--with-trailing-meta.mdc-list-item--with-two-lines .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-trailing-meta.mdc-list-item--with-two-lines .mdc-list-item__end::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-trailing-meta.mdc-list-item--with-three-lines .mdc-list-item__end{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-trailing-meta.mdc-list-item--with-three-lines .mdc-list-item__end::before{display:inline-block;width:0;height:28px;content:\"\";vertical-align:0}.mdc-list-item--with-trailing-meta .mdc-list-item__end{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-caption-font-family, var(--mdc-typography-font-family, inherit));font-size:0.6875rem;font-size:var(--mdc-typography-caption-font-size, 0.6875rem);line-height:0.875rem;line-height:var(--mdc-typography-caption-line-height, 0.875rem);font-weight:400;font-weight:var(--mdc-typography-caption-font-weight, 400);letter-spacing:0.0333333333em;letter-spacing:var(--mdc-typography-caption-letter-spacing, 0.0333333333em);text-decoration:inherit;text-decoration:var(--mdc-typography-caption-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-caption-text-transform, inherit)}.mdc-list-item--with-trailing-checkbox.mdc-list-item{padding-left:auto;padding-right:0}[dir=rtl] .mdc-list-item--with-trailing-checkbox.mdc-list-item,.mdc-list-item--with-trailing-checkbox.mdc-list-item[dir=rtl]{padding-left:0;padding-right:auto;}.mdc-list-item--with-trailing-checkbox .mdc-list-item__end{margin-left:24px;margin-right:8px}[dir=rtl] .mdc-list-item--with-trailing-checkbox .mdc-list-item__end,.mdc-list-item--with-trailing-checkbox .mdc-list-item__end[dir=rtl]{margin-left:8px;margin-right:24px;}.mdc-list-item--with-trailing-checkbox .mdc-list-item__end{width:40px;height:40px}.mdc-list-item--with-trailing-checkbox.mdc-list-item--with-three-lines .mdc-list-item__end{align-self:flex-start;margin-top:8px}.mdc-list-item--with-trailing-radio.mdc-list-item{padding-left:auto;padding-right:0}[dir=rtl] .mdc-list-item--with-trailing-radio.mdc-list-item,.mdc-list-item--with-trailing-radio.mdc-list-item[dir=rtl]{padding-left:0;padding-right:auto;}.mdc-list-item--with-trailing-radio .mdc-list-item__end{margin-left:24px;margin-right:8px}[dir=rtl] .mdc-list-item--with-trailing-radio .mdc-list-item__end,.mdc-list-item--with-trailing-radio .mdc-list-item__end[dir=rtl]{margin-left:8px;margin-right:24px;}.mdc-list-item--with-trailing-radio .mdc-list-item__end{width:40px;height:40px}.mdc-list-item--with-trailing-radio.mdc-list-item--with-three-lines .mdc-list-item__end{align-self:flex-start;margin-top:8px}.mdc-list-item--with-trailing-switch.mdc-list-item{padding-left:auto;padding-right:0}[dir=rtl] .mdc-list-item--with-trailing-switch.mdc-list-item,.mdc-list-item--with-trailing-switch.mdc-list-item[dir=rtl]{padding-left:0;padding-right:auto;}.mdc-list-item--with-trailing-switch .mdc-list-item__end{margin-left:16px;margin-right:16px}[dir=rtl] .mdc-list-item--with-trailing-switch .mdc-list-item__end,.mdc-list-item--with-trailing-switch .mdc-list-item__end[dir=rtl]{margin-left:16px;margin-right:16px;}.mdc-list-item--with-trailing-switch .mdc-list-item__end{width:36px;height:20px}.mdc-list-item--with-trailing-switch.mdc-list-item--with-three-lines .mdc-list-item__end{align-self:flex-start;margin-top:16px}.mdc-list-item--with-overline.mdc-list-item--with-two-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-overline.mdc-list-item--with-two-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:20px;content:\"\";vertical-align:0}.mdc-list-item--with-overline.mdc-list-item--with-three-lines .mdc-list-item__primary-text{display:block;margin-top:0;line-height:normal}.mdc-list-item--with-overline.mdc-list-item--with-three-lines .mdc-list-item__primary-text::before{display:inline-block;width:0;height:20px;content:\"\";vertical-align:0}.mdc-list-item{padding-left:16px;padding-right:16px}[dir=rtl] .mdc-list-item,.mdc-list-item[dir=rtl]{padding-left:16px;padding-right:16px;}.mdc-list-group .mdc-deprecated-list{padding:0}.mdc-list-group__subheader{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-subtitle1-font-family, var(--mdc-typography-font-family, inherit));font-size:0.875rem;font-size:var(--mdc-typography-subtitle1-font-size, 0.875rem);line-height:1.125rem;line-height:var(--mdc-typography-subtitle1-line-height, 1.125rem);font-weight:400;font-weight:var(--mdc-typography-subtitle1-font-weight, 400);letter-spacing:0.009375em;letter-spacing:var(--mdc-typography-subtitle1-letter-spacing, 0.009375em);text-decoration:inherit;text-decoration:var(--mdc-typography-subtitle1-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-subtitle1-text-transform, inherit);margin:calc((3rem - 1.5rem) / 2) 16px}.mdc-list-divider{background-color:rgba(0, 0, 0, 0.12)}.mdc-list-divider{height:1px;padding:0;background-clip:content-box}.mdc-list-divider.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-text.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-icon.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-image.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-avatar.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-switch.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-radio.mdc-list-divider--with-leading-inset{padding-left:16px;padding-right:auto}[dir=rtl] .mdc-list-divider.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-text.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-icon.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-image.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-avatar.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-switch.mdc-list-divider--with-leading-inset,[dir=rtl] .mdc-list-divider--with-leading-radio.mdc-list-divider--with-leading-inset,.mdc-list-divider.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-text.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-icon.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-image.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-avatar.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-switch.mdc-list-divider--with-leading-inset[dir=rtl],.mdc-list-divider--with-leading-radio.mdc-list-divider--with-leading-inset[dir=rtl]{padding-left:auto;padding-right:16px;}.mdc-list-divider.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-text.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-icon.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-image.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-avatar.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-switch.mdc-list-divider--with-trailing-inset,.mdc-list-divider--with-leading-radio.mdc-list-divider--with-trailing-inset{padding-left:auto;padding-right:16px}[dir=rtl] .mdc-list-divider.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-text.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-icon.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-image.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-avatar.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-switch.mdc-list-divider--with-trailing-inset,[dir=rtl] .mdc-list-divider--with-leading-radio.mdc-list-divider--with-trailing-inset,.mdc-list-divider.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-text.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-icon.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-image.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-thumbnail.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-avatar.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-checkbox.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-switch.mdc-list-divider--with-trailing-inset[dir=rtl],.mdc-list-divider--with-leading-radio.mdc-list-divider--with-trailing-inset[dir=rtl]{padding-left:16px;padding-right:auto;}.mdc-list-divider--with-leading-video.mdc-list-divider--with-leading-inset{padding-left:0px;padding-right:auto}[dir=rtl] .mdc-list-divider--with-leading-video.mdc-list-divider--with-leading-inset,.mdc-list-divider--with-leading-video.mdc-list-divider--with-leading-inset[dir=rtl]{padding-left:auto;padding-right:0px;}[dir=rtl] .mdc-list-divider,.mdc-list-divider[dir=rtl]{padding:0;}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity;--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--unbounded .mdc-deprecated-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--foreground-activation .mdc-deprecated-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--foreground-deactivation .mdc-deprecated-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--unbounded .mdc-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--foreground-activation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--foreground-deactivation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:hover .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-surface--hover .mdc-deprecated-list-item__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--background-focused .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded):focus .mdc-deprecated-list-item__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded) .mdc-deprecated-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded):active .mdc-deprecated-list-item__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:hover .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-deprecated-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-activated-opacity, 0.24)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-deprecated-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:hover .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-surface--hover .mdc-deprecated-list-item__ripple::before{opacity:0.32;opacity:var(--mdc-ripple-hover-opacity, 0.32)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-upgraded--background-focused .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded):focus .mdc-deprecated-list-item__ripple::before{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-focus-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded) .mdc-deprecated-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded):active .mdc-deprecated-list-item__ripple::after{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-activated-opacity, 0.24)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated .mdc-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:hover .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.32;opacity:var(--mdc-ripple-hover-opacity, 0.32)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-focus-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-deprecated-list-item__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-deprecated-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:hover .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-surface--hover .mdc-deprecated-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-upgraded--background-focused .mdc-deprecated-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):focus .mdc-deprecated-list-item__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded) .mdc-deprecated-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):active .mdc-deprecated-list-item__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-list-item__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected .mdc-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:hover .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-deprecated-list-item__ripple,:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item .mdc-list-item__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-deprecated-list-item--disabled{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity;--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--unbounded .mdc-deprecated-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--foreground-activation .mdc-deprecated-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--foreground-deactivation .mdc-deprecated-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--unbounded .mdc-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--foreground-activation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--foreground-deactivation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-deprecated-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::before,.mdc-deprecated-list-item--disabled .mdc-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--background-focused .mdc-deprecated-list-item__ripple::before,.mdc-deprecated-list-item--disabled:not(.mdc-ripple-upgraded):focus .mdc-deprecated-list-item__ripple::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-deprecated-list-item--disabled.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,.mdc-deprecated-list-item--disabled:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-deprecated-list-item--disabled .mdc-deprecated-list-item__ripple,.mdc-deprecated-list-item--disabled .mdc-list-item__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}:not(.mdc-list-item--disabled).mdc-list-item{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded--unbounded .mdc-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded--foreground-activation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded--foreground-deactivation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded .mdc-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}:not(.mdc-list-item--disabled).mdc-list-item:hover .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}:not(.mdc-list-item--disabled).mdc-list-item:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-list-item--disabled).mdc-list-item:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-list-item--disabled).mdc-list-item.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}:not(.mdc-list-item--disabled).mdc-list-item--activated .mdc-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-activated-opacity, 0.24)}:not(.mdc-list-item--disabled).mdc-list-item--activated .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--activated .mdc-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-list-item--disabled).mdc-list-item--activated:hover .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--activated.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.32;opacity:var(--mdc-ripple-hover-opacity, 0.32)}:not(.mdc-list-item--disabled).mdc-list-item--activated.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--activated:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-focus-opacity, 0.48)}:not(.mdc-list-item--disabled).mdc-list-item--activated:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-list-item--disabled).mdc-list-item--activated:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.48;opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-list-item--disabled).mdc-list-item--activated.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.48)}:not(.mdc-list-item--disabled).mdc-list-item--selected .mdc-list-item__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}:not(.mdc-list-item--disabled).mdc-list-item--selected .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--selected .mdc-list-item__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}:not(.mdc-list-item--disabled).mdc-list-item--selected:hover .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--selected.mdc-ripple-surface--hover .mdc-list-item__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}:not(.mdc-list-item--disabled).mdc-list-item--selected.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,:not(.mdc-list-item--disabled).mdc-list-item--selected:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}:not(.mdc-list-item--disabled).mdc-list-item--selected:not(.mdc-ripple-upgraded) .mdc-list-item__ripple::after{transition:opacity 150ms linear}:not(.mdc-list-item--disabled).mdc-list-item--selected:not(.mdc-ripple-upgraded):active .mdc-list-item__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-list-item--disabled).mdc-list-item--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}:not(.mdc-list-item--disabled).mdc-list-item .mdc-list-item__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-list-item--disabled{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-list-item--disabled .mdc-list-item__ripple::before,.mdc-list-item--disabled .mdc-list-item__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-list-item--disabled .mdc-list-item__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-list-item--disabled .mdc-list-item__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-list-item--disabled.mdc-ripple-upgraded--unbounded .mdc-list-item__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-list-item--disabled.mdc-ripple-upgraded--foreground-activation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-list-item--disabled.mdc-ripple-upgraded--foreground-deactivation .mdc-list-item__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-list-item--disabled .mdc-list-item__ripple::before,.mdc-list-item--disabled .mdc-list-item__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-list-item--disabled.mdc-ripple-upgraded .mdc-list-item__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-list-item--disabled .mdc-list-item__ripple::before,.mdc-list-item--disabled .mdc-list-item__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-list-item--disabled.mdc-ripple-upgraded--background-focused .mdc-list-item__ripple::before,.mdc-list-item--disabled:not(.mdc-ripple-upgraded):focus .mdc-list-item__ripple::before{transition-duration:75ms;opacity:0.24;opacity:var(--mdc-ripple-focus-opacity, 0.24)}.mdc-list-item--disabled .mdc-list-item__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-deprecated-list,.mdc-deprecated-list-item__secondary-text{font-family:inherit}.mdc-deprecated-list{--mdc-theme-text-icon-on-background:var(\n --icon-color,\n rgb(var(--contrast-900))\n );margin:var(--list-margin, 0.25rem);padding:0;border-radius:0.375rem}.mdc-deprecated-list .mdc-deprecated-list-divider{border-bottom-color:transparent;display:flex;align-items:center;gap:0.75rem;height:auto;padding:0 0.5rem}.mdc-deprecated-list .limel-list-divider-line{background-color:rgb(var(--contrast-400));height:0.125rem;border-radius:1rem;min-width:1rem;flex-grow:1}.mdc-deprecated-list .limel-list-divider-title{all:unset;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:rgb(var(--contrast-900));font-size:0.8125rem}.mdc-deprecated-list .mdc-deprecated-list-item{gap:0.5rem;transition:background-color 0.2s ease;box-sizing:border-box;z-index:0;min-height:2.5rem}.mdc-deprecated-list .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):hover{background-color:rgb(var(--contrast-300));z-index:1}.mdc-deprecated-list .mdc-deprecated-list-item.mdc-deprecated-list-item--disabled{cursor:not-allowed}.mdc-deprecated-list .mdc-deprecated-list-item.mdc-deprecated-list-item--disabled limel-icon{opacity:0.38}.mdc-deprecated-list .mdc-deprecated-list-item:first-child{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem}.mdc-deprecated-list .mdc-deprecated-list-item:last-child{border-bottom-right-radius:0.375rem;border-bottom-left-radius:0.375rem}.mdc-deprecated-list.selectable .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled){cursor:pointer}.mdc-deprecated-list .mdc-deprecated-list-item__meta{line-height:100%;margin-right:-0.5rem;order:var(--limel-list-meta-order, 3)}.mdc-deprecated-list .mdc-deprecated-list-item__graphic{margin-right:0}.mdc-deprecated-list.mdc-deprecated-list--avatar-list{position:relative}.mdc-deprecated-list.mdc-deprecated-list--avatar-list limel-icon.mdc-deprecated-list-item__graphic{background-color:var(--icon-background-color, rgb(var(--contrast-900)));color:var(--icon-color, rgba(var(--color-white), 0.88));margin-left:-0.25rem}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider{position:absolute;bottom:0}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider.mdc-deprecated-list-divider--inset{--icon-width:2.5rem;--icon-right-padding:0.75rem;--list-right-padding:0.75rem;right:0;width:calc(100% - var(--icon-width) - var(--icon-right-padding) - var(--list-right-padding))}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider.mdc-deprecated-list-divider--inset.x-small{--icon-width:1.5rem}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider.mdc-deprecated-list-divider--inset.small{--icon-width:2rem}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider.mdc-deprecated-list-divider--inset.medium{--icon-width:2.5rem}.mdc-deprecated-list.mdc-deprecated-list--avatar-list hr.mdc-deprecated-list-divider.mdc-deprecated-list-divider--inset.large{--icon-width:3rem}.mdc-deprecated-list.mdc-deprecated-list--avatar-list .mdc-deprecated-list-item:last-child hr.mdc-deprecated-list-divider{display:none}.mdc-deprecated-list.mdc-deprecated-list--two-line .mdc-deprecated-list-item__text{padding-top:0.5rem;padding-bottom:0.5rem}.mdc-deprecated-list .mdc-deprecated-list-item__secondary-text,.mdc-deprecated-list .mdc-deprecated-list-item__primary-text,.mdc-deprecated-list .mdc-deprecated-list-item__command-text{margin:0}.mdc-deprecated-list .mdc-deprecated-list-item__secondary-text:before,.mdc-deprecated-list .mdc-deprecated-list-item__secondary-text:after,.mdc-deprecated-list .mdc-deprecated-list-item__primary-text:before,.mdc-deprecated-list .mdc-deprecated-list-item__primary-text:after,.mdc-deprecated-list .mdc-deprecated-list-item__command-text:before,.mdc-deprecated-list .mdc-deprecated-list-item__command-text:after{display:none}.mdc-deprecated-list .mdc-deprecated-list-item__command-text{color:rgb(var(--contrast-800));margin-left:0.7rem}.mdc-deprecated-list .mdc-deprecated-list-item__text{align-self:center;width:100%}.mdc-deprecated-list .mdc-deprecated-list-item__primary-command-text{display:flex;flex-direction:row;justify-content:space-between;align-items:baseline}.mdc-deprecated-list limel-icon.mdc-deprecated-list-item__graphic{display:block}.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) limel-icon.mdc-deprecated-list-item__graphic[size=x-small]{margin-right:0}.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) limel-icon.mdc-deprecated-list-item__graphic[size=small]{margin-right:0}.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) limel-icon.mdc-deprecated-list-item__graphic[size=medium]{margin-right:0.25rem}.mdc-deprecated-list:not(.mdc-deprecated-list--avatar-list) limel-icon.mdc-deprecated-list-item__graphic[size=large]{margin-right:0.5rem}.mdc-deprecated-list-item.mdc-deprecated-list-item--selected:before{background-color:var(--mdc-theme-primary);opacity:0.15}:not(.mdc-deprecated-list--non-interactive)>:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:focus{outline:none}:not(.mdc-deprecated-list--non-interactive)>:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}:not(.mdc-deprecated-list--non-interactive)>:not(.mdc-deprecated-list-item--disabled).mdc-deprecated-list-item:focus-visible{border-radius:0.375rem;z-index:1}:host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}:host(limel-checkbox){--mdc-checkbox-checked-color:var(--mdc-theme-primary);--mdc-checkbox-unchecked-color:var(\n --checkbox-unchecked-border-color,\n rgb(var(--contrast-900))\n );--lime-checkbox-unchecked-color:rgb(var(--contrast-300));min-height:2.5rem}limel-dynamic-label{margin-top:0.375rem;margin-left:0.25rem}.mdc-checkbox{padding:calc((40px - 18px) / 2);padding:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);margin:calc((40px - 40px) / 2);margin:calc((var(--mdc-checkbox-touch-target-size, 40px) - 40px) / 2)}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, #000)}.mdc-checkbox:hover .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-surface--hover .mdc-checkbox__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-checkbox.mdc-ripple-upgraded--background-focused .mdc-checkbox__ripple::before,.mdc-checkbox:not(.mdc-ripple-upgraded):focus .mdc-checkbox__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-checkbox:not(.mdc-ripple-upgraded) .mdc-checkbox__ripple::after{transition:opacity 150ms linear}.mdc-checkbox:not(.mdc-ripple-upgraded):active .mdc-checkbox__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected .mdc-checkbox__ripple::after{background-color:#575756;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #575756))}.mdc-checkbox.mdc-checkbox--selected:hover .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-surface--hover .mdc-checkbox__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-upgraded--background-focused .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded):focus .mdc-checkbox__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded) .mdc-checkbox__ripple::after{transition:opacity 150ms linear}.mdc-checkbox.mdc-checkbox--selected:not(.mdc-ripple-upgraded):active .mdc-checkbox__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-checkbox--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-checkbox.mdc-ripple-upgraded--background-focused.mdc-checkbox--selected .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-upgraded--background-focused.mdc-checkbox--selected .mdc-checkbox__ripple::after{background-color:#575756;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #575756))}.mdc-checkbox .mdc-checkbox__background{top:calc((40px - 18px) / 2);top:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2);left:calc((40px - 18px) / 2);left:calc((var(--mdc-checkbox-ripple-size, 40px) - 18px) / 2)}.mdc-checkbox .mdc-checkbox__native-control{top:calc((40px - 40px) / 2);top:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);right:calc((40px - 40px) / 2);right:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);left:calc((40px - 40px) / 2);left:calc((40px - var(--mdc-checkbox-touch-target-size, 40px)) / 2);width:40px;width:var(--mdc-checkbox-touch-target-size, 40px);height:40px;height:var(--mdc-checkbox-touch-target-size, 40px)}.mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}.mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control:enabled:indeterminate~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true]:enabled~.mdc-checkbox__background{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}@keyframes mdc-checkbox-fade-in-background-8A000000FF57575600000000FF575756{0%{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}50%{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}}@keyframes mdc-checkbox-fade-out-background-8A000000FF57575600000000FF575756{0%,80%{border-color:#575756;border-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756));background-color:#575756;background-color:var(--mdc-checkbox-checked-color, var(--mdc-theme-secondary, #575756))}100%{border-color:rgba(0, 0, 0, 0.54);border-color:var(--mdc-checkbox-unchecked-color, rgba(0, 0, 0, 0.54));background-color:transparent}}.mdc-checkbox.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{animation-name:mdc-checkbox-fade-in-background-8A000000FF57575600000000FF575756}.mdc-checkbox.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__native-control:enabled~.mdc-checkbox__background{animation-name:mdc-checkbox-fade-out-background-8A000000FF57575600000000FF575756}.mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:rgba(0, 0, 0, 0.38);border-color:var(--mdc-checkbox-disabled-color, rgba(0, 0, 0, 0.38));background-color:transparent}.mdc-checkbox .mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,.mdc-checkbox .mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{border-color:transparent;background-color:rgba(0, 0, 0, 0.38);background-color:var(--mdc-checkbox-disabled-color, rgba(0, 0, 0, 0.38))}.mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff;color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:enabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:#fff;border-color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:#fff;color:var(--mdc-checkbox-ink-color, #fff)}.mdc-checkbox .mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:#fff;border-color:var(--mdc-checkbox-ink-color, #fff)}@keyframes mdc-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:29.7833385}50%{animation-timing-function:cubic-bezier(0, 0, 0.2, 1)}100%{stroke-dashoffset:0}}@keyframes mdc-checkbox-unchecked-indeterminate-mixedmark{0%,68.2%{transform:scaleX(0)}68.2%{animation-timing-function:cubic-bezier(0, 0, 0, 1)}100%{transform:scaleX(1)}}@keyframes mdc-checkbox-checked-unchecked-checkmark-path{from{animation-timing-function:cubic-bezier(0.4, 0, 1, 1);opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:-29.7833385}}@keyframes mdc-checkbox-checked-indeterminate-checkmark{from{animation-timing-function:cubic-bezier(0, 0, 0.2, 1);transform:rotate(0deg);opacity:1}to{transform:rotate(45deg);opacity:0}}@keyframes mdc-checkbox-indeterminate-checked-checkmark{from{animation-timing-function:cubic-bezier(0.14, 0, 0, 1);transform:rotate(45deg);opacity:0}to{transform:rotate(360deg);opacity:1}}@keyframes mdc-checkbox-checked-indeterminate-mixedmark{from{animation-timing-function:mdc-animation-deceleration-curve-timing-function;transform:rotate(-45deg);opacity:0}to{transform:rotate(0deg);opacity:1}}@keyframes mdc-checkbox-indeterminate-checked-mixedmark{from{animation-timing-function:cubic-bezier(0.14, 0, 0, 1);transform:rotate(0deg);opacity:1}to{transform:rotate(315deg);opacity:0}}@keyframes mdc-checkbox-indeterminate-unchecked-mixedmark{0%{animation-timing-function:linear;transform:scaleX(1);opacity:1}32.8%,100%{transform:scaleX(0);opacity:0}}.mdc-checkbox{display:inline-block;position:relative;flex:0 0 18px;box-sizing:content-box;width:18px;height:18px;line-height:0;white-space:nowrap;cursor:pointer;vertical-align:bottom}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background{border-color:GrayText;border-color:var(--mdc-checkbox-disabled-color, GrayText);background-color:transparent}.mdc-checkbox__native-control[disabled]:checked~.mdc-checkbox__background,.mdc-checkbox__native-control[disabled]:indeterminate~.mdc-checkbox__background,.mdc-checkbox__native-control[data-indeterminate=true][disabled]~.mdc-checkbox__background{border-color:GrayText;background-color:transparent;background-color:var(--mdc-checkbox-disabled-color, transparent)}.mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__checkmark{color:GrayText;color:var(--mdc-checkbox-ink-color, GrayText)}.mdc-checkbox__native-control:disabled~.mdc-checkbox__background .mdc-checkbox__mixedmark{border-color:GrayText;border-color:var(--mdc-checkbox-ink-color, GrayText)}.mdc-checkbox__mixedmark{margin:0 1px}}.mdc-checkbox--disabled{cursor:default;pointer-events:none}.mdc-checkbox__background{display:inline-flex;position:absolute;align-items:center;justify-content:center;box-sizing:border-box;width:18px;height:18px;border:2px solid currentColor;border-radius:2px;background-color:transparent;pointer-events:none;will-change:background-color, border-color;transition:background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox__checkmark{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;opacity:0;transition:opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox--upgraded .mdc-checkbox__checkmark{opacity:1}.mdc-checkbox__checkmark-path{transition:stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1);stroke:currentColor;stroke-width:3.12px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-checkbox__mixedmark{width:100%;height:0;transform:scaleX(0) rotate(0deg);border-width:1px;border-style:solid;opacity:0;transition:opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__background,.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background,.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__background{animation-duration:180ms;animation-timing-function:linear}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-unchecked-checked-checkmark-path 180ms linear 0s;transition:none}.mdc-checkbox--anim-unchecked-indeterminate .mdc-checkbox__mixedmark{animation:mdc-checkbox-unchecked-indeterminate-mixedmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-checked-unchecked-checkmark-path 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__checkmark{animation:mdc-checkbox-checked-indeterminate-checkmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-checked-indeterminate .mdc-checkbox__mixedmark{animation:mdc-checkbox-checked-indeterminate-mixedmark 90ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__checkmark{animation:mdc-checkbox-indeterminate-checked-checkmark 500ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-checked .mdc-checkbox__mixedmark{animation:mdc-checkbox-indeterminate-checked-mixedmark 500ms linear 0s;transition:none}.mdc-checkbox--anim-indeterminate-unchecked .mdc-checkbox__mixedmark{animation:mdc-checkbox-indeterminate-unchecked-mixedmark 300ms linear 0s;transition:none}.mdc-checkbox__native-control:checked~.mdc-checkbox__background,.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background{transition:border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark-path,.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__checkmark-path,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__checkmark-path{stroke-dashoffset:0}.mdc-checkbox__native-control{position:absolute;margin:0;padding:0;opacity:0;cursor:inherit}.mdc-checkbox__native-control:disabled{cursor:default;pointer-events:none}.mdc-checkbox--touch{margin:calc((48px - 40px) / 2);margin:calc((var(--mdc-checkbox-state-layer-size, 48px) - var(--mdc-checkbox-state-layer-size, 40px)) / 2)}.mdc-checkbox--touch .mdc-checkbox__native-control{top:calc((40px - 48px) / 2);top:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);right:calc((40px - 48px) / 2);right:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);left:calc((40px - 48px) / 2);left:calc((var(--mdc-checkbox-state-layer-size, 40px) - var(--mdc-checkbox-state-layer-size, 48px)) / 2);width:48px;width:var(--mdc-checkbox-state-layer-size, 48px);height:48px;height:var(--mdc-checkbox-state-layer-size, 48px)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__checkmark{transition:opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1);opacity:1}.mdc-checkbox__native-control:checked~.mdc-checkbox__background .mdc-checkbox__mixedmark{transform:scaleX(1) rotate(-45deg)}.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__checkmark,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__checkmark{transform:rotate(45deg);opacity:0;transition:opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-checkbox__native-control:indeterminate~.mdc-checkbox__background .mdc-checkbox__mixedmark,.mdc-checkbox__native-control[data-indeterminate=true]~.mdc-checkbox__background .mdc-checkbox__mixedmark{transform:scaleX(1) rotate(0deg);opacity:1}.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__background,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__checkmark,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__checkmark-path,.mdc-checkbox.mdc-checkbox--upgraded .mdc-checkbox__mixedmark{transition:none}.mdc-checkbox{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-checkbox .mdc-checkbox__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-checkbox .mdc-checkbox__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-checkbox.mdc-ripple-upgraded--unbounded .mdc-checkbox__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-checkbox.mdc-ripple-upgraded--foreground-activation .mdc-checkbox__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-checkbox.mdc-ripple-upgraded--foreground-deactivation .mdc-checkbox__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::before,.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-checkbox.mdc-ripple-upgraded .mdc-checkbox__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-checkbox{z-index:0}.mdc-checkbox .mdc-checkbox__ripple::before,.mdc-checkbox .mdc-checkbox__ripple::after{z-index:-1;z-index:var(--mdc-ripple-z-index, -1)}.mdc-checkbox__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));display:inline-flex;align-items:center;vertical-align:middle}.mdc-form-field>label{margin-left:0;margin-right:auto;padding-left:4px;padding-right:0;order:0}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{margin-left:auto;margin-right:0;}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{padding-left:0;padding-right:4px;}.mdc-form-field--nowrap>label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.mdc-form-field--align-end>label{margin-left:auto;margin-right:0;padding-left:0;padding-right:4px;order:-1}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{margin-left:0;margin-right:auto;}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{padding-left:4px;padding-right:0;}.mdc-form-field--space-between{justify-content:space-between}.mdc-form-field--space-between>label{margin:0}[dir=rtl] .mdc-form-field--space-between>label,.mdc-form-field--space-between>label[dir=rtl]{margin:0;}.mdc-form-field{font-family:inherit}.mdc-form-field{display:flex;align-items:flex-start}.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control[disabled]:not(:checked):not(:indeterminate)~.mdc-checkbox__background,.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate)~.mdc-checkbox__background{background-color:var(--lime-checkbox-unchecked-color)}.mdc-form-field .mdc-checkbox.mdc-checkbox--invalid .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate)~.mdc-checkbox__background{border-color:var(--lime-error-text-color)}.mdc-form-field .mdc-checkbox .mdc-checkbox__native-control:focus-visible+.mdc-checkbox__background:after{content:\"\";display:block;position:absolute;inset:-0.25rem;border-radius:0.25rem;box-shadow:var(--shadow-depth-8-focused)}.mdc-form-field .mdc-checkbox--disabled{opacity:0.5}.mdc-form-field label{cursor:pointer;line-height:normal;letter-spacing:normal;padding-top:0.75rem;padding-left:0}.mdc-form-field label.mdc-checkbox--required::after{margin-left:0.0625rem;content:\"*\"}.mdc-form-field label.mdc-checkbox--invalid{color:var(--lime-error-text-color)}:host(limel-checkbox:focus),:host(limel-checkbox:focus-visible),:host(limel-checkbox:focus-within),:host(limel-checkbox[invalid]:not([invalid=false])),:host(limel-checkbox[invalid=true]){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-checkbox){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-checkbox:focus) limel-helper-line,:host(limel-checkbox:focus-visible) limel-helper-line,:host(limel-checkbox:focus-within) limel-helper-line,:host(limel-checkbox:hover) limel-helper-line{will-change:grid-template-rows}.mdc-radio{padding:calc((40px - 20px) / 2)}.mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:rgba(0, 0, 0, 0.54)}.mdc-radio .mdc-radio__native-control:enabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:#575756;border-color:var(--mdc-theme-secondary, #575756)}.mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#575756;border-color:var(--mdc-theme-secondary, #575756)}.mdc-radio [aria-disabled=true] .mdc-radio__native-control:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle,.mdc-radio .mdc-radio__native-control:disabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:rgba(0, 0, 0, 0.38)}.mdc-radio [aria-disabled=true] .mdc-radio__native-control:checked+.mdc-radio__background .mdc-radio__outer-circle,.mdc-radio .mdc-radio__native-control:disabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:rgba(0, 0, 0, 0.38)}.mdc-radio [aria-disabled=true] .mdc-radio__native-control+.mdc-radio__background .mdc-radio__inner-circle,.mdc-radio .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:rgba(0, 0, 0, 0.38)}.mdc-radio .mdc-radio__background::before{background-color:#575756;background-color:var(--mdc-theme-secondary, #575756)}.mdc-radio .mdc-radio__background::before{top:calc(-1 * (40px - 20px) / 2);left:calc(-1 * (40px - 20px) / 2);width:40px;height:40px}.mdc-radio .mdc-radio__native-control{top:calc((40px - 40px) / 2);right:calc((40px - 40px) / 2);left:calc((40px - 40px) / 2);width:40px;height:40px}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-radio [aria-disabled=true] .mdc-radio__native-control:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle,.mdc-radio .mdc-radio__native-control:disabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:GrayText}.mdc-radio [aria-disabled=true] .mdc-radio__native-control:checked+.mdc-radio__background .mdc-radio__outer-circle,.mdc-radio .mdc-radio__native-control:disabled:checked+.mdc-radio__background .mdc-radio__outer-circle{border-color:GrayText}.mdc-radio [aria-disabled=true] .mdc-radio__native-control+.mdc-radio__background .mdc-radio__inner-circle,.mdc-radio .mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:GrayText}}.mdc-radio{display:inline-block;position:relative;flex:0 0 auto;box-sizing:content-box;width:20px;height:20px;cursor:pointer;will-change:opacity, transform, border-color, color}.mdc-radio__background{display:inline-block;position:relative;box-sizing:border-box;width:20px;height:20px}.mdc-radio__background::before{position:absolute;transform:scale(0, 0);border-radius:50%;opacity:0;pointer-events:none;content:\"\";transition:opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-radio__outer-circle{position:absolute;top:0;left:0;box-sizing:border-box;width:100%;height:100%;border-width:2px;border-style:solid;border-radius:50%;transition:border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-radio__inner-circle{position:absolute;top:0;left:0;box-sizing:border-box;width:100%;height:100%;transform:scale(0, 0);border-width:10px;border-style:solid;border-radius:50%;transition:transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1)}.mdc-radio__native-control{position:absolute;margin:0;padding:0;opacity:0;cursor:inherit;z-index:1}.mdc-radio--touch{margin-top:4px;margin-bottom:4px;margin-right:4px;margin-left:4px}.mdc-radio--touch .mdc-radio__native-control{top:calc((40px - 48px) / 2);right:calc((40px - 48px) / 2);left:calc((40px - 48px) / 2);width:48px;height:48px}.mdc-radio__native-control:checked+.mdc-radio__background,.mdc-radio__native-control:disabled+.mdc-radio__background{transition:opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-radio__native-control:checked+.mdc-radio__background .mdc-radio__outer-circle,.mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__outer-circle{transition:border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-radio__native-control:checked+.mdc-radio__background .mdc-radio__inner-circle,.mdc-radio__native-control:disabled+.mdc-radio__background .mdc-radio__inner-circle{transition:transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-radio--disabled{cursor:default;pointer-events:none}.mdc-radio__native-control:checked+.mdc-radio__background .mdc-radio__inner-circle{transform:scale(0.5);transition:transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-radio__native-control:disabled+.mdc-radio__background,[aria-disabled=true] .mdc-radio__native-control+.mdc-radio__background{cursor:default}.mdc-radio__native-control:focus+.mdc-radio__background::before{transform:scale(1);opacity:0.12;transition:opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1)}.mdc-radio{--mdc-ripple-fg-size:0;--mdc-ripple-left:0;--mdc-ripple-top:0;--mdc-ripple-fg-scale:1;--mdc-ripple-fg-translate-end:0;--mdc-ripple-fg-translate-start:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);will-change:transform, opacity}.mdc-radio .mdc-radio__ripple::before,.mdc-radio .mdc-radio__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-radio .mdc-radio__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-radio .mdc-radio__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-radio.mdc-ripple-upgraded--unbounded .mdc-radio__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-radio.mdc-ripple-upgraded--foreground-activation .mdc-radio__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-radio.mdc-ripple-upgraded--foreground-deactivation .mdc-radio__ripple::after{animation:mdc-ripple-fg-opacity-out 150ms;transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}.mdc-radio .mdc-radio__ripple::before,.mdc-radio .mdc-radio__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::before,.mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after{top:var(--mdc-ripple-top, calc(50% - 50%));left:var(--mdc-ripple-left, calc(50% - 50%));width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-radio .mdc-radio__ripple::before,.mdc-radio .mdc-radio__ripple::after{background-color:#575756;background-color:var(--mdc-ripple-color, var(--mdc-theme-secondary, #575756))}.mdc-radio:hover .mdc-radio__ripple::before,.mdc-radio.mdc-ripple-surface--hover .mdc-radio__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-radio.mdc-ripple-upgraded--background-focused .mdc-radio__ripple::before,.mdc-radio:not(.mdc-ripple-upgraded):focus .mdc-radio__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-radio:not(.mdc-ripple-upgraded) .mdc-radio__ripple::after{transition:opacity 150ms linear}.mdc-radio:not(.mdc-ripple-upgraded):active .mdc-radio__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-radio.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-radio.mdc-ripple-upgraded .mdc-radio__background::before,.mdc-radio.mdc-ripple-upgraded--background-focused .mdc-radio__background::before{content:none}.mdc-radio__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-form-field{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-family:inherit;font-family:var(--mdc-typography-body2-font-family, var(--mdc-typography-font-family, inherit));font-size:0.8125rem;font-size:var(--mdc-typography-body2-font-size, 0.8125rem);line-height:1.625rem;line-height:var(--mdc-typography-body2-line-height, 1.625rem);font-weight:400;font-weight:var(--mdc-typography-body2-font-weight, 400);letter-spacing:0.0178571429em;letter-spacing:var(--mdc-typography-body2-letter-spacing, 0.0178571429em);text-decoration:inherit;text-decoration:var(--mdc-typography-body2-text-decoration, inherit);text-transform:inherit;text-transform:var(--mdc-typography-body2-text-transform, inherit);color:rgba(0, 0, 0, 0.87);color:var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87));display:inline-flex;align-items:center;vertical-align:middle}.mdc-form-field>label{margin-left:0;margin-right:auto;padding-left:4px;padding-right:0;order:0}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{margin-left:auto;margin-right:0;}[dir=rtl] .mdc-form-field>label,.mdc-form-field>label[dir=rtl]{padding-left:0;padding-right:4px;}.mdc-form-field--nowrap>label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.mdc-form-field--align-end>label{margin-left:auto;margin-right:0;padding-left:0;padding-right:4px;order:-1}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{margin-left:0;margin-right:auto;}[dir=rtl] .mdc-form-field--align-end>label,.mdc-form-field--align-end>label[dir=rtl]{padding-left:4px;padding-right:0;}.mdc-form-field--space-between{justify-content:space-between}.mdc-form-field--space-between>label{margin:0}[dir=rtl] .mdc-form-field--space-between>label,.mdc-form-field--space-between>label[dir=rtl]{margin:0;}.mdc-form-field{display:flex}.mdc-form-field .mdc-radio .mdc-radio__native-control:enabled+.mdc-radio__background .mdc-radio__inner-circle{border-color:#26a69a;border-color:var(--mdc-theme-primary, #26a69a)}.mdc-radio .mdc-radio__native-control:enabled:not(:checked)+.mdc-radio__background .mdc-radio__outer-circle{border-color:var(--mdc-checkbox-unchecked-color)}:host(.has-striped-rows) .mdc-deprecated-list{border:1px solid rgb(var(--contrast-400))}:host(.has-striped-rows) .mdc-deprecated-list-item:nth-child(even),:host(.has-striped-rows.has-interactive-items) .mdc-deprecated-list-item:nth-child(even){background-color:var(--list-background-color-of-odd-interactive-items, rgb(var(--contrast-200)))}:host(.has-striped-rows) .mdc-deprecated-list-item:nth-child(odd),:host(.has-striped-rows.has-interactive-items) .mdc-deprecated-list-item:nth-child(odd){background-color:var(--list-background-color-of-even-interactive-items, rgb(var(--contrast-100)))}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled){transition:color var(--limel-clickable-transition-speed, 0.4s) ease, background-color var(--limel-clickable-transition-speed, 0.4s) ease, box-shadow var(--limel-clickable-transform-speed, 0.4s) ease, transform var(--limel-clickable-transform-speed, 0.4s) var(--limel-clickable-transform-timing-function, ease);cursor:pointer;color:var(--mdc-theme-on-surface);background-color:transparent}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):hover,:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):focus,:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):focus-visible{will-change:color, background-color, box-shadow, transform}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):hover{transform:translate3d(0, 0.01rem, 0);color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):active{--limel-clickable-transform-timing-function:cubic-bezier(\n 0.83,\n -0.15,\n 0.49,\n 1.16\n );transform:translate3d(0, 0.05rem, 0);box-shadow:var(--button-shadow-pressed)}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):hover,:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):active{--limel-clickable-transition-speed:0.2s;--limel-clickable-transform-speed:0.16s}:host(.has-interactive-items) .mdc-deprecated-list-item:not(.mdc-deprecated-list-item--disabled):hover{z-index:1}:host{--line-height-of-secondary-text:1rem}.mdc-deprecated-list-item{height:auto !important}.mdc-deprecated-list-item .mdc-deprecated-list-item__secondary-text{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:var(--maxLinesSecondaryText);line-height:var(--line-height-of-secondary-text)}:host(.has-grid-layout){--gap:var(--list-grid-gap, 0.75rem);padding:var(--gap);}:host(.has-grid-layout) .mdc-deprecated-list{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fit, minmax(min(100%, max(var(--list-grid-item-max-width, 10rem) - var(--gap), var(--list-grid-item-min-width, 7.5rem))), 1fr));max-width:var(--list-grid-max-width, 100%)}:host(.has-grid-layout) .mdc-deprecated-list-divider{grid-column:1/-1}:host(.has-grid-layout) .mdc-deprecated-list-item{border-radius:0.25rem;background-color:rgb(var(--contrast-100))}:host(.has-grid-layout) .mdc-deprecated-list--avatar-list limel-icon{margin-right:0.25rem;margin-left:-0.5rem}:host(.static-actions-list){z-index:1;background-color:var(--mdc-theme-surface)}:host(.has-position-sticky){position:sticky;box-shadow:0 0 0.75rem 0.5rem var(--mdc-theme-surface)}:host(.has-position-sticky.is-on-top){top:0}:host(.has-position-sticky.is-at-bottom){bottom:0}:host(.is-on-top){border-bottom:1px solid rgb(var(--contrast-400));margin-bottom:0.5rem;padding-bottom:0.25rem}:host(.is-at-bottom){border-top:1px solid rgb(var(--contrast-400));margin-top:0.5rem;padding-top:0.25rem}";
|
|
2440
|
+
|
|
2441
|
+
const { ACTION_EVENT } = strings$2;
|
|
2442
|
+
const List = class {
|
|
2443
|
+
constructor(hostRef) {
|
|
2444
|
+
index.registerInstance(this, hostRef);
|
|
2445
|
+
this.change = index.createEvent(this, "change", 7);
|
|
2446
|
+
this.select = index.createEvent(this, "select", 7);
|
|
2447
|
+
this.listRenderer = new ListRenderer();
|
|
2448
|
+
this.setup = () => {
|
|
2449
|
+
this.setupList();
|
|
2450
|
+
this.setupListeners();
|
|
2451
|
+
};
|
|
2452
|
+
this.setupList = () => {
|
|
2453
|
+
if (this.mdcList) {
|
|
2454
|
+
this.teardown();
|
|
2455
|
+
this.mdcList = null;
|
|
2456
|
+
}
|
|
2457
|
+
const element = this.element.shadowRoot.querySelector('.mdc-deprecated-list');
|
|
2458
|
+
if (!element) {
|
|
2459
|
+
return;
|
|
2460
|
+
}
|
|
2461
|
+
this.mdcList = new MDCList(element);
|
|
2462
|
+
this.mdcList.hasTypeahead = true;
|
|
2463
|
+
};
|
|
2464
|
+
this.setupListeners = () => {
|
|
2465
|
+
if (!this.mdcList) {
|
|
2466
|
+
return;
|
|
2467
|
+
}
|
|
2468
|
+
this.mdcList.unlisten(ACTION_EVENT, this.handleAction);
|
|
2469
|
+
this.selectable = ['selectable', 'radio', 'checkbox'].includes(this.type);
|
|
2470
|
+
this.multiple = this.type === 'checkbox';
|
|
2471
|
+
if (!this.selectable) {
|
|
2472
|
+
return;
|
|
2473
|
+
}
|
|
2474
|
+
this.mdcList.listen(ACTION_EVENT, this.handleAction);
|
|
2475
|
+
this.mdcList.singleSelection = !this.multiple;
|
|
2476
|
+
};
|
|
2477
|
+
this.teardown = () => {
|
|
2478
|
+
var _a, _b;
|
|
2479
|
+
(_a = this.mdcList) === null || _a === void 0 ? void 0 : _a.unlisten(ACTION_EVENT, this.handleAction);
|
|
2480
|
+
(_b = this.mdcList) === null || _b === void 0 ? void 0 : _b.destroy();
|
|
2481
|
+
};
|
|
2482
|
+
this.handleAction = (event) => {
|
|
2483
|
+
if (!this.multiple) {
|
|
2484
|
+
this.handleSingleSelect(event.detail.index);
|
|
2485
|
+
return;
|
|
2486
|
+
}
|
|
2487
|
+
this.handleMultiSelect(event.detail.index);
|
|
2488
|
+
};
|
|
2489
|
+
this.handleSingleSelect = (index) => {
|
|
2490
|
+
const listItems = this.items.filter(this.isListItem);
|
|
2491
|
+
if (listItems[index].disabled) {
|
|
2492
|
+
return;
|
|
2493
|
+
}
|
|
2494
|
+
const selectedItem = listItems.find((item) => {
|
|
2495
|
+
return !!item.selected;
|
|
2496
|
+
});
|
|
2497
|
+
if (selectedItem) {
|
|
2498
|
+
if (this.type !== 'radio') {
|
|
2499
|
+
this.mdcList.selectedIndex = -1;
|
|
2500
|
+
}
|
|
2501
|
+
this.change.emit(Object.assign(Object.assign({}, selectedItem), { selected: false }));
|
|
2502
|
+
}
|
|
2503
|
+
if (listItems[index] !== selectedItem) {
|
|
2504
|
+
this.change.emit(Object.assign(Object.assign({}, listItems[index]), { selected: true }));
|
|
2505
|
+
}
|
|
2506
|
+
};
|
|
2507
|
+
this.handleMultiSelect = (index) => {
|
|
2508
|
+
const listItems = this.items.filter(this.isListItem);
|
|
2509
|
+
if (listItems[index].disabled) {
|
|
2510
|
+
return;
|
|
2511
|
+
}
|
|
2512
|
+
const selectedItems = listItems
|
|
2513
|
+
.filter((item, listIndex) => {
|
|
2514
|
+
if (listIndex === index) {
|
|
2515
|
+
// This is the item that was selected or deselected,
|
|
2516
|
+
// so we negate its previous selection status.
|
|
2517
|
+
return !item.selected;
|
|
2518
|
+
}
|
|
2519
|
+
// This is an item that didn't change, so we keep its selection status.
|
|
2520
|
+
return item.selected;
|
|
2521
|
+
})
|
|
2522
|
+
.map((item) => {
|
|
2523
|
+
return Object.assign(Object.assign({}, item), { selected: true });
|
|
2524
|
+
});
|
|
2525
|
+
this.change.emit(selectedItems);
|
|
2526
|
+
};
|
|
2527
|
+
this.isListItem = (item) => {
|
|
2528
|
+
return !('separator' in item);
|
|
2529
|
+
};
|
|
2530
|
+
this.items = undefined;
|
|
2531
|
+
this.badgeIcons = undefined;
|
|
2532
|
+
this.iconSize = 'small';
|
|
2533
|
+
this.type = undefined;
|
|
2534
|
+
this.maxLinesSecondaryText = 3;
|
|
2535
|
+
}
|
|
2536
|
+
connectedCallback() {
|
|
2537
|
+
this.setup();
|
|
2538
|
+
}
|
|
2539
|
+
disconnectedCallback() {
|
|
2540
|
+
this.teardown();
|
|
2541
|
+
}
|
|
2542
|
+
componentDidLoad() {
|
|
2543
|
+
this.setup();
|
|
2544
|
+
this.triggerIconColorWarning();
|
|
2545
|
+
}
|
|
2546
|
+
render() {
|
|
2547
|
+
var _a;
|
|
2548
|
+
this.config = {
|
|
2549
|
+
badgeIcons: this.badgeIcons,
|
|
2550
|
+
type: this.type,
|
|
2551
|
+
iconSize: this.iconSize,
|
|
2552
|
+
};
|
|
2553
|
+
let maxLinesSecondaryText = +((_a = this.maxLinesSecondaryText) === null || _a === void 0 ? void 0 : _a.toFixed());
|
|
2554
|
+
if (this.maxLinesSecondaryText < 1) {
|
|
2555
|
+
maxLinesSecondaryText = 1;
|
|
2556
|
+
}
|
|
2557
|
+
const html = this.listRenderer.render(this.items, this.config);
|
|
2558
|
+
return (index.h(index.Host, { style: {
|
|
2559
|
+
'--maxLinesSecondaryText': `${maxLinesSecondaryText}`,
|
|
2560
|
+
} }, html));
|
|
2561
|
+
}
|
|
2562
|
+
handleType() {
|
|
2563
|
+
this.setupListeners();
|
|
2564
|
+
}
|
|
2565
|
+
itemsChanged() {
|
|
2566
|
+
if (!this.mdcList) {
|
|
2567
|
+
return;
|
|
2568
|
+
}
|
|
2569
|
+
setTimeout(() => {
|
|
2570
|
+
this.setup();
|
|
2571
|
+
const listItems = this.items.filter(this.isListItem);
|
|
2572
|
+
if (this.multiple) {
|
|
2573
|
+
this.mdcList.selectedIndex = listItems
|
|
2574
|
+
.filter((item) => item.selected)
|
|
2575
|
+
.map((item) => listItems.indexOf(item));
|
|
2576
|
+
}
|
|
2577
|
+
else {
|
|
2578
|
+
const selectedIndex = listItems.findIndex((item) => item.selected);
|
|
2579
|
+
if (selectedIndex === -1) {
|
|
2580
|
+
this.mdcList.initializeListType();
|
|
2581
|
+
}
|
|
2582
|
+
else {
|
|
2583
|
+
this.mdcList.selectedIndex = selectedIndex;
|
|
2584
|
+
}
|
|
2585
|
+
}
|
|
2586
|
+
}, 0);
|
|
2587
|
+
}
|
|
2588
|
+
triggerIconColorWarning() {
|
|
2589
|
+
var _a;
|
|
2590
|
+
if ((_a = this.items) === null || _a === void 0 ? void 0 : _a.some((item) => 'iconColor' in item)) {
|
|
2591
|
+
/* eslint-disable-next-line no-console */
|
|
2592
|
+
console.warn("The `iconColor` prop is deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name'` write `icon {name: 'icon-name', color: 'color-name'}`.");
|
|
2593
|
+
}
|
|
2594
|
+
}
|
|
2595
|
+
static get delegatesFocus() { return true; }
|
|
2596
|
+
get element() { return index.getElement(this); }
|
|
2597
|
+
static get watchers() { return {
|
|
2598
|
+
"type": ["handleType"],
|
|
2599
|
+
"items": ["itemsChanged"]
|
|
2600
|
+
}; }
|
|
2601
|
+
};
|
|
2602
|
+
List.style = listCss;
|
|
2603
|
+
|
|
2604
|
+
const menuCss = ":host(limel-menu){isolation:isolate;position:relative;display:inline-block;--badge-background-color:var(\n --notification-badge-background-color,\n rgb(var(--color-red-default))\n );--badge-text-color:var(\n --notification-badge-text-color,\n rgb(var(--color-white))\n )}:host([hidden]){display:none}.menu__trigger{border-color:transparent;border-width:1px;border-style:solid;background:none;color:rgb(var(--contrast-800));height:2.25rem}.menu__trigger-enabled:hover{border-color:rgb(var(--contrast-800));color:rgb(var(--contrast-1100))}.mdc-menu-surface--anchor{position:relative}limel-badge{position:absolute;top:-0.25rem;right:-0.25rem}";
|
|
2605
|
+
|
|
2606
|
+
const DEFAULT_ROOT_BREADCRUMBS_ITEM = {
|
|
2607
|
+
text: '',
|
|
2608
|
+
icon: {
|
|
2609
|
+
name: 'home',
|
|
2610
|
+
},
|
|
2611
|
+
type: 'icon-only',
|
|
2612
|
+
};
|
|
2613
|
+
const Menu = class {
|
|
2614
|
+
constructor(hostRef) {
|
|
2615
|
+
index.registerInstance(this, hostRef);
|
|
2616
|
+
this.cancel = index.createEvent(this, "cancel", 7);
|
|
2617
|
+
this.select = index.createEvent(this, "select", 7);
|
|
2618
|
+
this.navigateMenu = index.createEvent(this, "navigateMenu", 7);
|
|
2619
|
+
this.renderLoader = () => {
|
|
2620
|
+
if (!this.loadingSubItems && !this.loading) {
|
|
2621
|
+
return;
|
|
2622
|
+
}
|
|
2623
|
+
const cssProperties = this.getCssProperties();
|
|
2624
|
+
return (index.h("div", { style: {
|
|
2625
|
+
width: cssProperties['--menu-surface-width'],
|
|
2626
|
+
display: 'flex',
|
|
2627
|
+
'align-items': 'center',
|
|
2628
|
+
'justify-content': 'center',
|
|
2629
|
+
padding: '0.5rem 0',
|
|
2630
|
+
} }, index.h("limel-spinner", { size: "mini", limeBranded: false })));
|
|
2631
|
+
};
|
|
2632
|
+
this.renderBreadcrumb = () => {
|
|
2633
|
+
const breadcrumbsItems = this.getBreadcrumbsItems();
|
|
2634
|
+
if (!breadcrumbsItems.length) {
|
|
2635
|
+
return;
|
|
2636
|
+
}
|
|
2637
|
+
return (index.h("limel-breadcrumbs", { style: {
|
|
2638
|
+
'border-bottom': 'solid 1px rgb(var(--contrast-500))',
|
|
2639
|
+
'flex-shrink': '0',
|
|
2640
|
+
}, onSelect: this.handleBreadcrumbsSelect, items: breadcrumbsItems }));
|
|
2641
|
+
};
|
|
2642
|
+
this.handleBreadcrumbsSelect = (event) => {
|
|
2643
|
+
if (!event.detail.menuItem) {
|
|
2644
|
+
this.currentSubMenu = null;
|
|
2645
|
+
this.clearSearch();
|
|
2646
|
+
this.navigateMenu.emit(null);
|
|
2647
|
+
this.setFocus();
|
|
2648
|
+
return;
|
|
2649
|
+
}
|
|
2650
|
+
this.handleSelect(event.detail.menuItem);
|
|
2651
|
+
};
|
|
2652
|
+
this.renderSearchField = () => {
|
|
2653
|
+
if (!this.searcher) {
|
|
2654
|
+
return;
|
|
2655
|
+
}
|
|
2656
|
+
return (index.h("limel-input-field", { tabindex: "0", ref: this.setSearchElement, type: "search", leadingIcon: "search", style: {
|
|
2657
|
+
padding: '0.25rem',
|
|
2658
|
+
'box-sizing': 'border-box',
|
|
2659
|
+
}, value: this.searchValue, onChange: this.handleTextInput, onKeyDown: this.handleInputKeyDown }));
|
|
2660
|
+
};
|
|
2661
|
+
this.renderEmptyMessage = () => {
|
|
2662
|
+
var _a;
|
|
2663
|
+
if (this.loading ||
|
|
2664
|
+
this.loadingSubItems ||
|
|
2665
|
+
!this.emptyResultMessage ||
|
|
2666
|
+
!Array.isArray(this.searchResults) ||
|
|
2667
|
+
((_a = this.searchResults) === null || _a === void 0 ? void 0 : _a.length)) {
|
|
2668
|
+
return null;
|
|
2669
|
+
}
|
|
2670
|
+
return (index.h("p", { style: {
|
|
2671
|
+
padding: '0 1rem',
|
|
2672
|
+
'text-align': 'center',
|
|
2673
|
+
} }, this.emptyResultMessage));
|
|
2674
|
+
};
|
|
2675
|
+
this.renderMenuList = () => {
|
|
2676
|
+
let items = this.visibleItems;
|
|
2677
|
+
if (this.loadingSubItems || this.loading) {
|
|
2678
|
+
items = [];
|
|
2679
|
+
}
|
|
2680
|
+
return (index.h("limel-menu-list", { style: {
|
|
2681
|
+
'overflow-y': 'auto',
|
|
2682
|
+
'flex-grow': '1',
|
|
2683
|
+
}, class: {
|
|
2684
|
+
'has-grid-layout has-interactive-items': this.gridLayout,
|
|
2685
|
+
}, items: items, type: "menu", badgeIcons: this.badgeIcons, onSelect: this.onSelect, ref: this.setListElement, onKeyDown: this.handleMenuKeyDown }));
|
|
2686
|
+
};
|
|
2687
|
+
this.handleTextInput = async (event) => {
|
|
2688
|
+
event.stopPropagation();
|
|
2689
|
+
const query = event.detail;
|
|
2690
|
+
this.searchValue = query;
|
|
2691
|
+
if (query === '') {
|
|
2692
|
+
this.searchResults = null;
|
|
2693
|
+
this.loadingSubItems = false;
|
|
2694
|
+
return;
|
|
2695
|
+
}
|
|
2696
|
+
this.loadingSubItems = true;
|
|
2697
|
+
const result = await this.searcher(query);
|
|
2698
|
+
if (this.searchValue !== query) {
|
|
2699
|
+
return;
|
|
2700
|
+
}
|
|
2701
|
+
this.searchResults = result;
|
|
2702
|
+
this.loadingSubItems = false;
|
|
2703
|
+
};
|
|
2704
|
+
// Key handler for the input search field
|
|
2705
|
+
// Will change focus to the first/last item in the dropdown
|
|
2706
|
+
// list to enable selection with the keyboard
|
|
2707
|
+
this.handleInputKeyDown = (event) => {
|
|
2708
|
+
const isForwardTab = (event.key === keycodes.TAB || event.keyCode === keycodes.TAB_KEY_CODE) &&
|
|
2709
|
+
!event.altKey &&
|
|
2710
|
+
!event.metaKey &&
|
|
2711
|
+
!event.shiftKey;
|
|
2712
|
+
const isUp = event.key === keycodes.ARROW_UP || event.keyCode === keycodes.ARROW_UP_KEY_CODE;
|
|
2713
|
+
const isDown = event.key === keycodes.ARROW_DOWN || event.keyCode === keycodes.ARROW_DOWN_KEY_CODE;
|
|
2714
|
+
if (!isForwardTab && !isUp && !isDown) {
|
|
2715
|
+
return;
|
|
2716
|
+
}
|
|
2717
|
+
if (!this.list) {
|
|
2718
|
+
return;
|
|
2719
|
+
}
|
|
2720
|
+
event.stopPropagation();
|
|
2721
|
+
event.preventDefault();
|
|
2722
|
+
if (isForwardTab || isDown) {
|
|
2723
|
+
const listItems = this.list.shadowRoot.querySelectorAll('.mdc-deprecated-list-item');
|
|
2724
|
+
const listElement = listItems[0];
|
|
2725
|
+
listElement === null || listElement === void 0 ? void 0 : listElement.focus();
|
|
2726
|
+
return;
|
|
2727
|
+
}
|
|
2728
|
+
if (isUp) {
|
|
2729
|
+
const listItems = this.list.shadowRoot.querySelectorAll('.mdc-deprecated-list-item');
|
|
2730
|
+
const listElement = listItems[listItems.length - 1];
|
|
2731
|
+
listElement === null || listElement === void 0 ? void 0 : listElement.focus();
|
|
2732
|
+
}
|
|
2733
|
+
};
|
|
2734
|
+
// Key handler for the menu list
|
|
2735
|
+
// Will change focus to the search field if using shift+tab
|
|
2736
|
+
// And can go forward/back with righ/left arrow keys
|
|
2737
|
+
this.handleMenuKeyDown = (event) => {
|
|
2738
|
+
var _a;
|
|
2739
|
+
const isBackwardTab = (event.key === keycodes.TAB || event.keyCode === keycodes.TAB_KEY_CODE) &&
|
|
2740
|
+
!event.altKey &&
|
|
2741
|
+
!event.metaKey &&
|
|
2742
|
+
event.shiftKey;
|
|
2743
|
+
const isLeft = event.key === keycodes.ARROW_LEFT || event.keyCode === keycodes.ARROW_LEFT_KEY_CODE;
|
|
2744
|
+
const isRight = event.key === keycodes.ARROW_RIGHT || event.keyCode === keycodes.ARROW_RIGHT_KEY_CODE;
|
|
2745
|
+
if (!isBackwardTab && !isLeft && !isRight) {
|
|
2746
|
+
return;
|
|
2747
|
+
}
|
|
2748
|
+
if (isBackwardTab) {
|
|
2749
|
+
event.stopPropagation();
|
|
2750
|
+
event.preventDefault();
|
|
2751
|
+
(_a = this.searchInput) === null || _a === void 0 ? void 0 : _a.focus();
|
|
2752
|
+
}
|
|
2753
|
+
else if (!this.gridLayout) {
|
|
792
2754
|
const currentItem = this.getCurrentItem();
|
|
793
2755
|
event.stopPropagation();
|
|
794
2756
|
event.preventDefault();
|
|
795
2757
|
if (isRight) {
|
|
796
2758
|
this.goForward(currentItem);
|
|
797
2759
|
}
|
|
798
|
-
else if (isLeft) {
|
|
799
|
-
this.goBack();
|
|
2760
|
+
else if (isLeft) {
|
|
2761
|
+
this.goBack();
|
|
2762
|
+
}
|
|
2763
|
+
}
|
|
2764
|
+
};
|
|
2765
|
+
this.clearSearch = () => {
|
|
2766
|
+
this.searchValue = '';
|
|
2767
|
+
this.searchResults = null;
|
|
2768
|
+
this.loadingSubItems = false;
|
|
2769
|
+
};
|
|
2770
|
+
this.getCurrentItem = () => {
|
|
2771
|
+
var _a, _b, _c;
|
|
2772
|
+
const activeItem = (_b = (_a = this.list) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('[role="menuitem"][tabindex="0"]');
|
|
2773
|
+
const attrIndex = (_c = activeItem === null || activeItem === void 0 ? void 0 : activeItem.attributes) === null || _c === void 0 ? void 0 : _c.getNamedItem('data-index');
|
|
2774
|
+
const dataIndex = parseInt((attrIndex === null || attrIndex === void 0 ? void 0 : attrIndex.value) || '0', 10);
|
|
2775
|
+
return this.visibleItems[dataIndex];
|
|
2776
|
+
};
|
|
2777
|
+
this.goForward = (currentItem) => {
|
|
2778
|
+
this.handleSelect(currentItem, false);
|
|
2779
|
+
};
|
|
2780
|
+
this.goBack = () => {
|
|
2781
|
+
if (!this.currentSubMenu) {
|
|
2782
|
+
// Already in the root of the menu
|
|
2783
|
+
return;
|
|
2784
|
+
}
|
|
2785
|
+
const parent = this.currentSubMenu.parentItem;
|
|
2786
|
+
if (!parent) {
|
|
2787
|
+
// If only one step down, go to the root of the menu.
|
|
2788
|
+
// No need to load a sub-menu.
|
|
2789
|
+
this.currentSubMenu = null;
|
|
2790
|
+
this.clearSearch();
|
|
2791
|
+
this.navigateMenu.emit(null);
|
|
2792
|
+
this.setFocus();
|
|
2793
|
+
return;
|
|
2794
|
+
}
|
|
2795
|
+
this.handleSelect(parent);
|
|
2796
|
+
};
|
|
2797
|
+
this.setTriggerAttributes = (element) => {
|
|
2798
|
+
const attributes = {
|
|
2799
|
+
'aria-haspopup': true,
|
|
2800
|
+
'aria-expanded': this.open,
|
|
2801
|
+
'aria-controls': this.portalId,
|
|
2802
|
+
disabled: this.disabled,
|
|
2803
|
+
role: 'button',
|
|
2804
|
+
};
|
|
2805
|
+
for (const [key, value] of Object.entries(attributes)) {
|
|
2806
|
+
if (!value) {
|
|
2807
|
+
element.removeAttribute(key);
|
|
2808
|
+
}
|
|
2809
|
+
else {
|
|
2810
|
+
element.setAttribute(key, String(value));
|
|
2811
|
+
}
|
|
2812
|
+
}
|
|
2813
|
+
};
|
|
2814
|
+
this.onClose = () => {
|
|
2815
|
+
this.cancel.emit();
|
|
2816
|
+
this.open = false;
|
|
2817
|
+
this.currentSubMenu = null;
|
|
2818
|
+
};
|
|
2819
|
+
this.onTriggerClick = (event) => {
|
|
2820
|
+
event.stopPropagation();
|
|
2821
|
+
if (this.disabled) {
|
|
2822
|
+
return;
|
|
2823
|
+
}
|
|
2824
|
+
this.open = !this.open;
|
|
2825
|
+
};
|
|
2826
|
+
this.handleSelect = async (menuItem, selectOnEmptyChildren = true) => {
|
|
2827
|
+
if (Array.isArray(menuItem === null || menuItem === void 0 ? void 0 : menuItem.items) && menuItem.items.length > 0) {
|
|
2828
|
+
this.selectedMenuItem = menuItem;
|
|
2829
|
+
this.clearSearch();
|
|
2830
|
+
this.currentSubMenu = menuItem;
|
|
2831
|
+
this.navigateMenu.emit(menuItem);
|
|
2832
|
+
this.setFocus();
|
|
2833
|
+
return;
|
|
2834
|
+
}
|
|
2835
|
+
else if (eq.isFunction(menuItem === null || menuItem === void 0 ? void 0 : menuItem.items)) {
|
|
2836
|
+
const menuLoader = menuItem.items;
|
|
2837
|
+
this.selectedMenuItem = menuItem;
|
|
2838
|
+
this.loadingSubItems = true;
|
|
2839
|
+
const subItems = await menuLoader(menuItem);
|
|
2840
|
+
if (this.selectedMenuItem !== menuItem) {
|
|
2841
|
+
return;
|
|
2842
|
+
}
|
|
2843
|
+
menuItem.items = subItems;
|
|
2844
|
+
this.loadingSubItems = false;
|
|
2845
|
+
if (subItems === null || subItems === void 0 ? void 0 : subItems.length) {
|
|
2846
|
+
this.currentSubMenu = menuItem;
|
|
2847
|
+
this.clearSearch();
|
|
2848
|
+
this.navigateMenu.emit(menuItem);
|
|
2849
|
+
this.setFocus();
|
|
2850
|
+
return;
|
|
2851
|
+
}
|
|
2852
|
+
}
|
|
2853
|
+
if (!selectOnEmptyChildren) {
|
|
2854
|
+
return;
|
|
2855
|
+
}
|
|
2856
|
+
this.selectedMenuItem = menuItem;
|
|
2857
|
+
this.loadingSubItems = false;
|
|
2858
|
+
this.select.emit(menuItem);
|
|
2859
|
+
this.open = false;
|
|
2860
|
+
this.currentSubMenu = null;
|
|
2861
|
+
this.setFocus();
|
|
2862
|
+
};
|
|
2863
|
+
this.onSelect = (event) => {
|
|
2864
|
+
event.stopPropagation();
|
|
2865
|
+
this.handleSelect(event.detail);
|
|
2866
|
+
};
|
|
2867
|
+
this.setListElement = (element) => {
|
|
2868
|
+
this.list = element;
|
|
2869
|
+
};
|
|
2870
|
+
this.setFocus = () => {
|
|
2871
|
+
setTimeout(() => {
|
|
2872
|
+
if (this.searchInput && this.searcher) {
|
|
2873
|
+
const observer = new IntersectionObserver(() => {
|
|
2874
|
+
observer.unobserve(this.searchInput);
|
|
2875
|
+
if (this.searchInput === window.document.activeElement) {
|
|
2876
|
+
return;
|
|
2877
|
+
}
|
|
2878
|
+
this.searchInput.focus();
|
|
2879
|
+
});
|
|
2880
|
+
observer.observe(this.searchInput);
|
|
2881
|
+
}
|
|
2882
|
+
else if (this.list) {
|
|
2883
|
+
const observer = new IntersectionObserver(() => {
|
|
2884
|
+
observer.unobserve(this.list);
|
|
2885
|
+
this.focusMenuItem();
|
|
2886
|
+
});
|
|
2887
|
+
observer.observe(this.list);
|
|
2888
|
+
}
|
|
2889
|
+
}, 0);
|
|
2890
|
+
};
|
|
2891
|
+
this.setSearchElement = (element) => {
|
|
2892
|
+
this.searchInput = element;
|
|
2893
|
+
};
|
|
2894
|
+
this.focusMenuItem = () => {
|
|
2895
|
+
var _a;
|
|
2896
|
+
if (!this.list) {
|
|
2897
|
+
return;
|
|
2898
|
+
}
|
|
2899
|
+
const activeElement = this.list.shadowRoot.activeElement;
|
|
2900
|
+
activeElement === null || activeElement === void 0 ? void 0 : activeElement.blur();
|
|
2901
|
+
const menuItems = this.visibleItems.filter(this.isMenuItem);
|
|
2902
|
+
const selectedIndex = Math.max(menuItems.findIndex((item) => item.selected), 0);
|
|
2903
|
+
const menuElements = Array.from(this.list.shadowRoot.querySelectorAll('[role="menuitem"]'));
|
|
2904
|
+
(_a = menuElements[selectedIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
2905
|
+
};
|
|
2906
|
+
this.renderNotificationBadge = () => {
|
|
2907
|
+
if (this.items.some(this.hasNotificationBadge)) {
|
|
2908
|
+
return index.h("limel-badge", null);
|
|
2909
|
+
}
|
|
2910
|
+
};
|
|
2911
|
+
this.hasNotificationBadge = (item) => this.isMenuItem(item) && item.badge !== undefined;
|
|
2912
|
+
this.setTriggerRef = (elm) => {
|
|
2913
|
+
this.triggerElement = elm;
|
|
2914
|
+
};
|
|
2915
|
+
this.items = [];
|
|
2916
|
+
this.disabled = false;
|
|
2917
|
+
this.openDirection = 'bottom-start';
|
|
2918
|
+
this.surfaceWidth = 'inherit-from-items';
|
|
2919
|
+
this.open = false;
|
|
2920
|
+
this.badgeIcons = false;
|
|
2921
|
+
this.gridLayout = false;
|
|
2922
|
+
this.loading = false;
|
|
2923
|
+
this.currentSubMenu = undefined;
|
|
2924
|
+
this.rootItem = DEFAULT_ROOT_BREADCRUMBS_ITEM;
|
|
2925
|
+
this.searcher = undefined;
|
|
2926
|
+
this.emptyResultMessage = undefined;
|
|
2927
|
+
this.loadingSubItems = undefined;
|
|
2928
|
+
this.searchValue = undefined;
|
|
2929
|
+
this.searchResults = undefined;
|
|
2930
|
+
this.portalId = randomString.createRandomString();
|
|
2931
|
+
}
|
|
2932
|
+
componentDidRender() {
|
|
2933
|
+
const slotElement = this.host.shadowRoot.querySelector('slot');
|
|
2934
|
+
slotElement.assignedElements().forEach(this.setTriggerAttributes);
|
|
2935
|
+
}
|
|
2936
|
+
render() {
|
|
2937
|
+
const cssProperties = this.getCssProperties();
|
|
2938
|
+
const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
|
|
2939
|
+
const menuSurfaceWidth = this.getMenuSurfaceWidth(cssProperties['--menu-surface-width']);
|
|
2940
|
+
return (index.h("div", { class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, index.h("slot", { ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), index.h("limel-portal", { visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, index.h("limel-menu-surface", { open: this.open, onDismiss: this.onClose, style: Object.assign(Object.assign({}, cssProperties), { '--mdc-menu-min-width': menuSurfaceWidth, '--limel-menu-surface-display': 'flex', '--limel-menu-surface-flex-direction': 'column' }), class: {
|
|
2941
|
+
'has-grid-layout': this.gridLayout,
|
|
2942
|
+
} }, this.renderSearchField(), this.renderBreadcrumb(), this.renderLoader(), this.renderEmptyMessage(), this.renderMenuList()))));
|
|
2943
|
+
}
|
|
2944
|
+
itemsWatcher() {
|
|
2945
|
+
this.clearSearch();
|
|
2946
|
+
this.setFocus();
|
|
2947
|
+
}
|
|
2948
|
+
openWatcher(newValue) {
|
|
2949
|
+
if (newValue) {
|
|
2950
|
+
this.setFocus();
|
|
2951
|
+
}
|
|
2952
|
+
else {
|
|
2953
|
+
this.clearSearch();
|
|
2954
|
+
}
|
|
2955
|
+
}
|
|
2956
|
+
getBreadcrumbsItems() {
|
|
2957
|
+
const breadCrumbItems = [];
|
|
2958
|
+
let currentItem = this.currentSubMenu;
|
|
2959
|
+
while (currentItem) {
|
|
2960
|
+
breadCrumbItems.push({
|
|
2961
|
+
text: currentItem.text,
|
|
2962
|
+
icon: currentItem.icon,
|
|
2963
|
+
menuItem: currentItem,
|
|
2964
|
+
});
|
|
2965
|
+
currentItem = currentItem.parentItem;
|
|
2966
|
+
}
|
|
2967
|
+
if (breadCrumbItems.length ||
|
|
2968
|
+
this.rootItem !== DEFAULT_ROOT_BREADCRUMBS_ITEM) {
|
|
2969
|
+
breadCrumbItems.push(this.rootItem);
|
|
2970
|
+
}
|
|
2971
|
+
return breadCrumbItems.reverse();
|
|
2972
|
+
}
|
|
2973
|
+
getCssProperties() {
|
|
2974
|
+
const propertyNames = [
|
|
2975
|
+
'--menu-surface-width',
|
|
2976
|
+
'--list-grid-item-max-width',
|
|
2977
|
+
'--list-grid-item-min-width',
|
|
2978
|
+
'--list-grid-gap',
|
|
2979
|
+
'--notification-badge-background-color',
|
|
2980
|
+
'--notification-badge-text-color',
|
|
2981
|
+
];
|
|
2982
|
+
const style = getComputedStyle(this.host);
|
|
2983
|
+
const values = propertyNames.map((property) => {
|
|
2984
|
+
return style.getPropertyValue(property);
|
|
2985
|
+
});
|
|
2986
|
+
return zipObject.zipObject(propertyNames, values);
|
|
2987
|
+
}
|
|
2988
|
+
isMenuItem(item) {
|
|
2989
|
+
return !('separator' in item);
|
|
2990
|
+
}
|
|
2991
|
+
getMenuSurfaceWidth(customWidth) {
|
|
2992
|
+
var _a, _b, _c, _d;
|
|
2993
|
+
if (customWidth) {
|
|
2994
|
+
return customWidth;
|
|
2995
|
+
}
|
|
2996
|
+
if (this.surfaceWidth === 'inherit-from-trigger') {
|
|
2997
|
+
const assignedTriggers = (_a = this.triggerElement) === null || _a === void 0 ? void 0 : _a.assignedElements();
|
|
2998
|
+
if (!(assignedTriggers === null || assignedTriggers === void 0 ? void 0 : assignedTriggers.length) ||
|
|
2999
|
+
!((_b = assignedTriggers[0]) === null || _b === void 0 ? void 0 : _b.clientWidth)) {
|
|
3000
|
+
return '';
|
|
3001
|
+
}
|
|
3002
|
+
return `${assignedTriggers[0].clientWidth}px`;
|
|
3003
|
+
}
|
|
3004
|
+
else if (this.surfaceWidth === 'inherit-from-menu') {
|
|
3005
|
+
if (!((_c = this.host) === null || _c === void 0 ? void 0 : _c.clientWidth)) {
|
|
3006
|
+
return '';
|
|
3007
|
+
}
|
|
3008
|
+
return `${(_d = this.host) === null || _d === void 0 ? void 0 : _d.clientWidth}px`;
|
|
3009
|
+
}
|
|
3010
|
+
return '';
|
|
3011
|
+
}
|
|
3012
|
+
get visibleItems() {
|
|
3013
|
+
var _a;
|
|
3014
|
+
if (Array.isArray(this.searchResults) && this.searchValue) {
|
|
3015
|
+
return this.searchResults;
|
|
3016
|
+
}
|
|
3017
|
+
else if (Array.isArray((_a = this.currentSubMenu) === null || _a === void 0 ? void 0 : _a.items)) {
|
|
3018
|
+
return this.currentSubMenu.items.map((item) => (Object.assign(Object.assign({}, item), { parentItem: this.currentSubMenu })));
|
|
3019
|
+
}
|
|
3020
|
+
return this.items;
|
|
3021
|
+
}
|
|
3022
|
+
get host() { return index.getElement(this); }
|
|
3023
|
+
static get watchers() { return {
|
|
3024
|
+
"items": ["itemsWatcher"],
|
|
3025
|
+
"open": ["openWatcher"]
|
|
3026
|
+
}; }
|
|
3027
|
+
};
|
|
3028
|
+
Menu.style = menuCss;
|
|
3029
|
+
|
|
3030
|
+
/**
|
|
3031
|
+
* @license
|
|
3032
|
+
* Copyright 2018 Google Inc.
|
|
3033
|
+
*
|
|
3034
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
3035
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
3036
|
+
* in the Software without restriction, including without limitation the rights
|
|
3037
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
3038
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
3039
|
+
* furnished to do so, subject to the following conditions:
|
|
3040
|
+
*
|
|
3041
|
+
* The above copyright notice and this permission notice shall be included in
|
|
3042
|
+
* all copies or substantial portions of the Software.
|
|
3043
|
+
*
|
|
3044
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
3045
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
3046
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
3047
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
3048
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
3049
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
3050
|
+
* THE SOFTWARE.
|
|
3051
|
+
*/
|
|
3052
|
+
var cssClasses$1 = {
|
|
3053
|
+
ANCHOR: 'mdc-menu-surface--anchor',
|
|
3054
|
+
ANIMATING_CLOSED: 'mdc-menu-surface--animating-closed',
|
|
3055
|
+
ANIMATING_OPEN: 'mdc-menu-surface--animating-open',
|
|
3056
|
+
FIXED: 'mdc-menu-surface--fixed',
|
|
3057
|
+
IS_OPEN_BELOW: 'mdc-menu-surface--is-open-below',
|
|
3058
|
+
OPEN: 'mdc-menu-surface--open',
|
|
3059
|
+
ROOT: 'mdc-menu-surface',
|
|
3060
|
+
};
|
|
3061
|
+
// tslint:disable:object-literal-sort-keys
|
|
3062
|
+
var strings$1 = {
|
|
3063
|
+
CLOSED_EVENT: 'MDCMenuSurface:closed',
|
|
3064
|
+
CLOSING_EVENT: 'MDCMenuSurface:closing',
|
|
3065
|
+
OPENED_EVENT: 'MDCMenuSurface:opened',
|
|
3066
|
+
FOCUSABLE_ELEMENTS: [
|
|
3067
|
+
'button:not(:disabled)',
|
|
3068
|
+
'[href]:not([aria-disabled="true"])',
|
|
3069
|
+
'input:not(:disabled)',
|
|
3070
|
+
'select:not(:disabled)',
|
|
3071
|
+
'textarea:not(:disabled)',
|
|
3072
|
+
'[tabindex]:not([tabindex="-1"]):not([aria-disabled="true"])',
|
|
3073
|
+
].join(', '),
|
|
3074
|
+
};
|
|
3075
|
+
// tslint:enable:object-literal-sort-keys
|
|
3076
|
+
var numbers$1 = {
|
|
3077
|
+
/** Total duration of menu-surface open animation. */
|
|
3078
|
+
TRANSITION_OPEN_DURATION: 120,
|
|
3079
|
+
/** Total duration of menu-surface close animation. */
|
|
3080
|
+
TRANSITION_CLOSE_DURATION: 75,
|
|
3081
|
+
/**
|
|
3082
|
+
* Margin left to the edge of the viewport when menu-surface is at maximum
|
|
3083
|
+
* possible height. Also used as a viewport margin.
|
|
3084
|
+
*/
|
|
3085
|
+
MARGIN_TO_EDGE: 32,
|
|
3086
|
+
/**
|
|
3087
|
+
* Ratio of anchor width to menu-surface width for switching from corner
|
|
3088
|
+
* positioning to center positioning.
|
|
3089
|
+
*/
|
|
3090
|
+
ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO: 0.67,
|
|
3091
|
+
/**
|
|
3092
|
+
* Amount of time to wait before restoring focus when closing the menu
|
|
3093
|
+
* surface. This is important because if a touch event triggered the menu
|
|
3094
|
+
* close, and the subsequent mouse event occurs after focus is restored, then
|
|
3095
|
+
* the restored focus would be lost.
|
|
3096
|
+
*/
|
|
3097
|
+
TOUCH_EVENT_WAIT_MS: 30,
|
|
3098
|
+
};
|
|
3099
|
+
/**
|
|
3100
|
+
* Enum for bits in the {@see Corner) bitmap.
|
|
3101
|
+
*/
|
|
3102
|
+
var CornerBit;
|
|
3103
|
+
(function (CornerBit) {
|
|
3104
|
+
CornerBit[CornerBit["BOTTOM"] = 1] = "BOTTOM";
|
|
3105
|
+
CornerBit[CornerBit["CENTER"] = 2] = "CENTER";
|
|
3106
|
+
CornerBit[CornerBit["RIGHT"] = 4] = "RIGHT";
|
|
3107
|
+
CornerBit[CornerBit["FLIP_RTL"] = 8] = "FLIP_RTL";
|
|
3108
|
+
})(CornerBit || (CornerBit = {}));
|
|
3109
|
+
/**
|
|
3110
|
+
* Enum for representing an element corner for positioning the menu-surface.
|
|
3111
|
+
*
|
|
3112
|
+
* The START constants map to LEFT if element directionality is left
|
|
3113
|
+
* to right and RIGHT if the directionality is right to left.
|
|
3114
|
+
* Likewise END maps to RIGHT or LEFT depending on the directionality.
|
|
3115
|
+
*/
|
|
3116
|
+
var Corner;
|
|
3117
|
+
(function (Corner) {
|
|
3118
|
+
Corner[Corner["TOP_LEFT"] = 0] = "TOP_LEFT";
|
|
3119
|
+
Corner[Corner["TOP_RIGHT"] = 4] = "TOP_RIGHT";
|
|
3120
|
+
Corner[Corner["BOTTOM_LEFT"] = 1] = "BOTTOM_LEFT";
|
|
3121
|
+
Corner[Corner["BOTTOM_RIGHT"] = 5] = "BOTTOM_RIGHT";
|
|
3122
|
+
Corner[Corner["TOP_START"] = 8] = "TOP_START";
|
|
3123
|
+
Corner[Corner["TOP_END"] = 12] = "TOP_END";
|
|
3124
|
+
Corner[Corner["BOTTOM_START"] = 9] = "BOTTOM_START";
|
|
3125
|
+
Corner[Corner["BOTTOM_END"] = 13] = "BOTTOM_END";
|
|
3126
|
+
})(Corner || (Corner = {}));
|
|
3127
|
+
|
|
3128
|
+
/**
|
|
3129
|
+
* @license
|
|
3130
|
+
* Copyright 2018 Google Inc.
|
|
3131
|
+
*
|
|
3132
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
3133
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
3134
|
+
* in the Software without restriction, including without limitation the rights
|
|
3135
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
3136
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
3137
|
+
* furnished to do so, subject to the following conditions:
|
|
3138
|
+
*
|
|
3139
|
+
* The above copyright notice and this permission notice shall be included in
|
|
3140
|
+
* all copies or substantial portions of the Software.
|
|
3141
|
+
*
|
|
3142
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
3143
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
3144
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
3145
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
3146
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
3147
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
3148
|
+
* THE SOFTWARE.
|
|
3149
|
+
*/
|
|
3150
|
+
var MDCMenuSurfaceFoundation = /** @class */ (function (_super) {
|
|
3151
|
+
ponyfill.__extends(MDCMenuSurfaceFoundation, _super);
|
|
3152
|
+
function MDCMenuSurfaceFoundation(adapter) {
|
|
3153
|
+
var _this = _super.call(this, ponyfill.__assign(ponyfill.__assign({}, MDCMenuSurfaceFoundation.defaultAdapter), adapter)) || this;
|
|
3154
|
+
_this.isSurfaceOpen = false;
|
|
3155
|
+
_this.isQuickOpen = false;
|
|
3156
|
+
_this.isHoistedElement = false;
|
|
3157
|
+
_this.isFixedPosition = false;
|
|
3158
|
+
_this.isHorizontallyCenteredOnViewport = false;
|
|
3159
|
+
_this.maxHeight = 0;
|
|
3160
|
+
_this.openAnimationEndTimerId = 0;
|
|
3161
|
+
_this.closeAnimationEndTimerId = 0;
|
|
3162
|
+
_this.animationRequestId = 0;
|
|
3163
|
+
_this.anchorCorner = Corner.TOP_START;
|
|
3164
|
+
/**
|
|
3165
|
+
* Corner of the menu surface to which menu surface is attached to anchor.
|
|
3166
|
+
*
|
|
3167
|
+
* Anchor corner --->+----------+
|
|
3168
|
+
* | ANCHOR |
|
|
3169
|
+
* +----------+
|
|
3170
|
+
* Origin corner --->+--------------+
|
|
3171
|
+
* | |
|
|
3172
|
+
* | |
|
|
3173
|
+
* | MENU SURFACE |
|
|
3174
|
+
* | |
|
|
3175
|
+
* | |
|
|
3176
|
+
* +--------------+
|
|
3177
|
+
*/
|
|
3178
|
+
_this.originCorner = Corner.TOP_START;
|
|
3179
|
+
_this.anchorMargin = { top: 0, right: 0, bottom: 0, left: 0 };
|
|
3180
|
+
_this.position = { x: 0, y: 0 };
|
|
3181
|
+
return _this;
|
|
3182
|
+
}
|
|
3183
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "cssClasses", {
|
|
3184
|
+
get: function () {
|
|
3185
|
+
return cssClasses$1;
|
|
3186
|
+
},
|
|
3187
|
+
enumerable: false,
|
|
3188
|
+
configurable: true
|
|
3189
|
+
});
|
|
3190
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "strings", {
|
|
3191
|
+
get: function () {
|
|
3192
|
+
return strings$1;
|
|
3193
|
+
},
|
|
3194
|
+
enumerable: false,
|
|
3195
|
+
configurable: true
|
|
3196
|
+
});
|
|
3197
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "numbers", {
|
|
3198
|
+
get: function () {
|
|
3199
|
+
return numbers$1;
|
|
3200
|
+
},
|
|
3201
|
+
enumerable: false,
|
|
3202
|
+
configurable: true
|
|
3203
|
+
});
|
|
3204
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "Corner", {
|
|
3205
|
+
get: function () {
|
|
3206
|
+
return Corner;
|
|
3207
|
+
},
|
|
3208
|
+
enumerable: false,
|
|
3209
|
+
configurable: true
|
|
3210
|
+
});
|
|
3211
|
+
Object.defineProperty(MDCMenuSurfaceFoundation, "defaultAdapter", {
|
|
3212
|
+
/**
|
|
3213
|
+
* @see {@link MDCMenuSurfaceAdapter} for typing information on parameters and return types.
|
|
3214
|
+
*/
|
|
3215
|
+
get: function () {
|
|
3216
|
+
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
|
|
3217
|
+
return {
|
|
3218
|
+
addClass: function () { return undefined; },
|
|
3219
|
+
removeClass: function () { return undefined; },
|
|
3220
|
+
hasClass: function () { return false; },
|
|
3221
|
+
hasAnchor: function () { return false; },
|
|
3222
|
+
isElementInContainer: function () { return false; },
|
|
3223
|
+
isFocused: function () { return false; },
|
|
3224
|
+
isRtl: function () { return false; },
|
|
3225
|
+
getInnerDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
3226
|
+
getAnchorDimensions: function () { return null; },
|
|
3227
|
+
getWindowDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
3228
|
+
getBodyDimensions: function () { return ({ height: 0, width: 0 }); },
|
|
3229
|
+
getWindowScroll: function () { return ({ x: 0, y: 0 }); },
|
|
3230
|
+
setPosition: function () { return undefined; },
|
|
3231
|
+
setMaxHeight: function () { return undefined; },
|
|
3232
|
+
setTransformOrigin: function () { return undefined; },
|
|
3233
|
+
saveFocus: function () { return undefined; },
|
|
3234
|
+
restoreFocus: function () { return undefined; },
|
|
3235
|
+
notifyClose: function () { return undefined; },
|
|
3236
|
+
notifyOpen: function () { return undefined; },
|
|
3237
|
+
notifyClosing: function () { return undefined; },
|
|
3238
|
+
};
|
|
3239
|
+
// tslint:enable:object-literal-sort-keys
|
|
3240
|
+
},
|
|
3241
|
+
enumerable: false,
|
|
3242
|
+
configurable: true
|
|
3243
|
+
});
|
|
3244
|
+
MDCMenuSurfaceFoundation.prototype.init = function () {
|
|
3245
|
+
var _a = MDCMenuSurfaceFoundation.cssClasses, ROOT = _a.ROOT, OPEN = _a.OPEN;
|
|
3246
|
+
if (!this.adapter.hasClass(ROOT)) {
|
|
3247
|
+
throw new Error(ROOT + " class required in root element.");
|
|
3248
|
+
}
|
|
3249
|
+
if (this.adapter.hasClass(OPEN)) {
|
|
3250
|
+
this.isSurfaceOpen = true;
|
|
800
3251
|
}
|
|
801
|
-
}
|
|
802
3252
|
};
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
3253
|
+
MDCMenuSurfaceFoundation.prototype.destroy = function () {
|
|
3254
|
+
clearTimeout(this.openAnimationEndTimerId);
|
|
3255
|
+
clearTimeout(this.closeAnimationEndTimerId);
|
|
3256
|
+
// Cancel any currently running animations.
|
|
3257
|
+
cancelAnimationFrame(this.animationRequestId);
|
|
807
3258
|
};
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
|
|
812
|
-
|
|
813
|
-
|
|
3259
|
+
/**
|
|
3260
|
+
* @param corner Default anchor corner alignment of top-left menu surface
|
|
3261
|
+
* corner.
|
|
3262
|
+
*/
|
|
3263
|
+
MDCMenuSurfaceFoundation.prototype.setAnchorCorner = function (corner) {
|
|
3264
|
+
this.anchorCorner = corner;
|
|
814
3265
|
};
|
|
815
|
-
|
|
816
|
-
|
|
3266
|
+
/**
|
|
3267
|
+
* Flip menu corner horizontally.
|
|
3268
|
+
*/
|
|
3269
|
+
MDCMenuSurfaceFoundation.prototype.flipCornerHorizontally = function () {
|
|
3270
|
+
this.originCorner = this.originCorner ^ CornerBit.RIGHT;
|
|
817
3271
|
};
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
// No need to load a sub-menu.
|
|
827
|
-
this.currentSubMenu = null;
|
|
828
|
-
this.clearSearch();
|
|
829
|
-
this.navigateMenu.emit(null);
|
|
830
|
-
this.setFocus();
|
|
831
|
-
return;
|
|
832
|
-
}
|
|
833
|
-
this.handleSelect(parent);
|
|
3272
|
+
/**
|
|
3273
|
+
* @param margin Set of margin values from anchor.
|
|
3274
|
+
*/
|
|
3275
|
+
MDCMenuSurfaceFoundation.prototype.setAnchorMargin = function (margin) {
|
|
3276
|
+
this.anchorMargin.top = margin.top || 0;
|
|
3277
|
+
this.anchorMargin.right = margin.right || 0;
|
|
3278
|
+
this.anchorMargin.bottom = margin.bottom || 0;
|
|
3279
|
+
this.anchorMargin.left = margin.left || 0;
|
|
834
3280
|
};
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
3281
|
+
/** Used to indicate if the menu-surface is hoisted to the body. */
|
|
3282
|
+
MDCMenuSurfaceFoundation.prototype.setIsHoisted = function (isHoisted) {
|
|
3283
|
+
this.isHoistedElement = isHoisted;
|
|
3284
|
+
};
|
|
3285
|
+
/**
|
|
3286
|
+
* Used to set the menu-surface calculations based on a fixed position menu.
|
|
3287
|
+
*/
|
|
3288
|
+
MDCMenuSurfaceFoundation.prototype.setFixedPosition = function (isFixedPosition) {
|
|
3289
|
+
this.isFixedPosition = isFixedPosition;
|
|
3290
|
+
};
|
|
3291
|
+
/**
|
|
3292
|
+
* @return Returns true if menu is in fixed (`position: fixed`) position.
|
|
3293
|
+
*/
|
|
3294
|
+
MDCMenuSurfaceFoundation.prototype.isFixed = function () {
|
|
3295
|
+
return this.isFixedPosition;
|
|
3296
|
+
};
|
|
3297
|
+
/** Sets the menu-surface position on the page. */
|
|
3298
|
+
MDCMenuSurfaceFoundation.prototype.setAbsolutePosition = function (x, y) {
|
|
3299
|
+
this.position.x = this.isFinite(x) ? x : 0;
|
|
3300
|
+
this.position.y = this.isFinite(y) ? y : 0;
|
|
3301
|
+
};
|
|
3302
|
+
/** Sets whether menu-surface should be horizontally centered to viewport. */
|
|
3303
|
+
MDCMenuSurfaceFoundation.prototype.setIsHorizontallyCenteredOnViewport = function (isCentered) {
|
|
3304
|
+
this.isHorizontallyCenteredOnViewport = isCentered;
|
|
3305
|
+
};
|
|
3306
|
+
MDCMenuSurfaceFoundation.prototype.setQuickOpen = function (quickOpen) {
|
|
3307
|
+
this.isQuickOpen = quickOpen;
|
|
3308
|
+
};
|
|
3309
|
+
/**
|
|
3310
|
+
* Sets maximum menu-surface height on open.
|
|
3311
|
+
* @param maxHeight The desired max-height. Set to 0 (default) to
|
|
3312
|
+
* automatically calculate max height based on available viewport space.
|
|
3313
|
+
*/
|
|
3314
|
+
MDCMenuSurfaceFoundation.prototype.setMaxHeight = function (maxHeight) {
|
|
3315
|
+
this.maxHeight = maxHeight;
|
|
3316
|
+
};
|
|
3317
|
+
MDCMenuSurfaceFoundation.prototype.isOpen = function () {
|
|
3318
|
+
return this.isSurfaceOpen;
|
|
3319
|
+
};
|
|
3320
|
+
/**
|
|
3321
|
+
* Open the menu surface.
|
|
3322
|
+
*/
|
|
3323
|
+
MDCMenuSurfaceFoundation.prototype.open = function () {
|
|
3324
|
+
var _this = this;
|
|
3325
|
+
if (this.isSurfaceOpen) {
|
|
3326
|
+
return;
|
|
3327
|
+
}
|
|
3328
|
+
this.adapter.saveFocus();
|
|
3329
|
+
if (this.isQuickOpen) {
|
|
3330
|
+
this.isSurfaceOpen = true;
|
|
3331
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
3332
|
+
this.dimensions = this.adapter.getInnerDimensions();
|
|
3333
|
+
this.autoposition();
|
|
3334
|
+
this.adapter.notifyOpen();
|
|
846
3335
|
}
|
|
847
3336
|
else {
|
|
848
|
-
|
|
3337
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
|
|
3338
|
+
this.animationRequestId = requestAnimationFrame(function () {
|
|
3339
|
+
_this.dimensions = _this.adapter.getInnerDimensions();
|
|
3340
|
+
_this.autoposition();
|
|
3341
|
+
_this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
3342
|
+
_this.openAnimationEndTimerId = setTimeout(function () {
|
|
3343
|
+
_this.openAnimationEndTimerId = 0;
|
|
3344
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_OPEN);
|
|
3345
|
+
_this.adapter.notifyOpen();
|
|
3346
|
+
}, numbers$1.TRANSITION_OPEN_DURATION);
|
|
3347
|
+
});
|
|
3348
|
+
this.isSurfaceOpen = true;
|
|
849
3349
|
}
|
|
850
|
-
}
|
|
851
3350
|
};
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
|
|
3351
|
+
/**
|
|
3352
|
+
* Closes the menu surface.
|
|
3353
|
+
*/
|
|
3354
|
+
MDCMenuSurfaceFoundation.prototype.close = function (skipRestoreFocus) {
|
|
3355
|
+
var _this = this;
|
|
3356
|
+
if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
|
|
3357
|
+
if (!this.isSurfaceOpen) {
|
|
3358
|
+
return;
|
|
3359
|
+
}
|
|
3360
|
+
this.adapter.notifyClosing();
|
|
3361
|
+
if (this.isQuickOpen) {
|
|
3362
|
+
this.isSurfaceOpen = false;
|
|
3363
|
+
if (!skipRestoreFocus) {
|
|
3364
|
+
this.maybeRestoreFocus();
|
|
3365
|
+
}
|
|
3366
|
+
this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
3367
|
+
this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
3368
|
+
this.adapter.notifyClose();
|
|
3369
|
+
return;
|
|
3370
|
+
}
|
|
3371
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
|
|
3372
|
+
requestAnimationFrame(function () {
|
|
3373
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.OPEN);
|
|
3374
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
3375
|
+
_this.closeAnimationEndTimerId = setTimeout(function () {
|
|
3376
|
+
_this.closeAnimationEndTimerId = 0;
|
|
3377
|
+
_this.adapter.removeClass(MDCMenuSurfaceFoundation.cssClasses.ANIMATING_CLOSED);
|
|
3378
|
+
_this.adapter.notifyClose();
|
|
3379
|
+
}, numbers$1.TRANSITION_CLOSE_DURATION);
|
|
3380
|
+
});
|
|
3381
|
+
this.isSurfaceOpen = false;
|
|
3382
|
+
if (!skipRestoreFocus) {
|
|
3383
|
+
this.maybeRestoreFocus();
|
|
3384
|
+
}
|
|
856
3385
|
};
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
|
|
861
|
-
|
|
862
|
-
|
|
3386
|
+
/** Handle clicks and close if not within menu-surface element. */
|
|
3387
|
+
MDCMenuSurfaceFoundation.prototype.handleBodyClick = function (evt) {
|
|
3388
|
+
var el = evt.target;
|
|
3389
|
+
if (this.adapter.isElementInContainer(el)) {
|
|
3390
|
+
return;
|
|
3391
|
+
}
|
|
3392
|
+
this.close();
|
|
863
3393
|
};
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
this.setFocus();
|
|
871
|
-
return;
|
|
872
|
-
}
|
|
873
|
-
else if (eq.isFunction(menuItem === null || menuItem === void 0 ? void 0 : menuItem.items)) {
|
|
874
|
-
const menuLoader = menuItem.items;
|
|
875
|
-
this.selectedMenuItem = menuItem;
|
|
876
|
-
this.loadingSubItems = true;
|
|
877
|
-
const subItems = await menuLoader(menuItem);
|
|
878
|
-
if (this.selectedMenuItem !== menuItem) {
|
|
879
|
-
return;
|
|
3394
|
+
/** Handle keys that close the surface. */
|
|
3395
|
+
MDCMenuSurfaceFoundation.prototype.handleKeydown = function (evt) {
|
|
3396
|
+
var keyCode = evt.keyCode, key = evt.key;
|
|
3397
|
+
var isEscape = key === 'Escape' || keyCode === 27;
|
|
3398
|
+
if (isEscape) {
|
|
3399
|
+
this.close();
|
|
880
3400
|
}
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
3401
|
+
};
|
|
3402
|
+
MDCMenuSurfaceFoundation.prototype.autoposition = function () {
|
|
3403
|
+
var _a;
|
|
3404
|
+
// Compute measurements for autoposition methods reuse.
|
|
3405
|
+
this.measurements = this.getAutoLayoutmeasurements();
|
|
3406
|
+
var corner = this.getoriginCorner();
|
|
3407
|
+
var maxMenuSurfaceHeight = this.getMenuSurfaceMaxHeight(corner);
|
|
3408
|
+
var verticalAlignment = this.hasBit(corner, CornerBit.BOTTOM) ? 'bottom' : 'top';
|
|
3409
|
+
var horizontalAlignment = this.hasBit(corner, CornerBit.RIGHT) ? 'right' : 'left';
|
|
3410
|
+
var horizontalOffset = this.getHorizontalOriginOffset(corner);
|
|
3411
|
+
var verticalOffset = this.getVerticalOriginOffset(corner);
|
|
3412
|
+
var _b = this.measurements, anchorSize = _b.anchorSize, surfaceSize = _b.surfaceSize;
|
|
3413
|
+
var position = (_a = {},
|
|
3414
|
+
_a[horizontalAlignment] = horizontalOffset,
|
|
3415
|
+
_a[verticalAlignment] = verticalOffset,
|
|
3416
|
+
_a);
|
|
3417
|
+
// Center align when anchor width is comparable or greater than menu
|
|
3418
|
+
// surface, otherwise keep corner.
|
|
3419
|
+
if (anchorSize.width / surfaceSize.width >
|
|
3420
|
+
numbers$1.ANCHOR_TO_MENU_SURFACE_WIDTH_RATIO) {
|
|
3421
|
+
horizontalAlignment = 'center';
|
|
3422
|
+
}
|
|
3423
|
+
// If the menu-surface has been hoisted to the body, it's no longer relative
|
|
3424
|
+
// to the anchor element
|
|
3425
|
+
if (this.isHoistedElement || this.isFixedPosition) {
|
|
3426
|
+
this.adjustPositionForHoistedElement(position);
|
|
3427
|
+
}
|
|
3428
|
+
this.adapter.setTransformOrigin(horizontalAlignment + " " + verticalAlignment);
|
|
3429
|
+
this.adapter.setPosition(position);
|
|
3430
|
+
this.adapter.setMaxHeight(maxMenuSurfaceHeight ? maxMenuSurfaceHeight + 'px' : '');
|
|
3431
|
+
// If it is opened from the top then add is-open-below class
|
|
3432
|
+
if (!this.hasBit(corner, CornerBit.BOTTOM)) {
|
|
3433
|
+
this.adapter.addClass(MDCMenuSurfaceFoundation.cssClasses.IS_OPEN_BELOW);
|
|
3434
|
+
}
|
|
3435
|
+
};
|
|
3436
|
+
/**
|
|
3437
|
+
* @return Measurements used to position menu surface popup.
|
|
3438
|
+
*/
|
|
3439
|
+
MDCMenuSurfaceFoundation.prototype.getAutoLayoutmeasurements = function () {
|
|
3440
|
+
var anchorRect = this.adapter.getAnchorDimensions();
|
|
3441
|
+
var bodySize = this.adapter.getBodyDimensions();
|
|
3442
|
+
var viewportSize = this.adapter.getWindowDimensions();
|
|
3443
|
+
var windowScroll = this.adapter.getWindowScroll();
|
|
3444
|
+
if (!anchorRect) {
|
|
3445
|
+
// tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
|
|
3446
|
+
anchorRect = {
|
|
3447
|
+
top: this.position.y,
|
|
3448
|
+
right: this.position.x,
|
|
3449
|
+
bottom: this.position.y,
|
|
3450
|
+
left: this.position.x,
|
|
3451
|
+
width: 0,
|
|
3452
|
+
height: 0,
|
|
3453
|
+
};
|
|
3454
|
+
// tslint:enable:object-literal-sort-keys
|
|
3455
|
+
}
|
|
3456
|
+
return {
|
|
3457
|
+
anchorSize: anchorRect,
|
|
3458
|
+
bodySize: bodySize,
|
|
3459
|
+
surfaceSize: this.dimensions,
|
|
3460
|
+
viewportDistance: {
|
|
3461
|
+
// tslint:disable:object-literal-sort-keys Positional properties are more readable when they're grouped together
|
|
3462
|
+
top: anchorRect.top,
|
|
3463
|
+
right: viewportSize.width - anchorRect.right,
|
|
3464
|
+
bottom: viewportSize.height - anchorRect.bottom,
|
|
3465
|
+
left: anchorRect.left,
|
|
3466
|
+
// tslint:enable:object-literal-sort-keys
|
|
3467
|
+
},
|
|
3468
|
+
viewportSize: viewportSize,
|
|
3469
|
+
windowScroll: windowScroll,
|
|
3470
|
+
};
|
|
3471
|
+
};
|
|
3472
|
+
/**
|
|
3473
|
+
* Computes the corner of the anchor from which to animate and position the
|
|
3474
|
+
* menu surface.
|
|
3475
|
+
*
|
|
3476
|
+
* Only LEFT or RIGHT bit is used to position the menu surface ignoring RTL
|
|
3477
|
+
* context. E.g., menu surface will be positioned from right side on TOP_END.
|
|
3478
|
+
*/
|
|
3479
|
+
MDCMenuSurfaceFoundation.prototype.getoriginCorner = function () {
|
|
3480
|
+
var corner = this.originCorner;
|
|
3481
|
+
var _a = this.measurements, viewportDistance = _a.viewportDistance, anchorSize = _a.anchorSize, surfaceSize = _a.surfaceSize;
|
|
3482
|
+
var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
|
|
3483
|
+
var isAnchoredToBottom = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
3484
|
+
var availableTop;
|
|
3485
|
+
var availableBottom;
|
|
3486
|
+
if (isAnchoredToBottom) {
|
|
3487
|
+
availableTop =
|
|
3488
|
+
viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.bottom;
|
|
3489
|
+
availableBottom =
|
|
3490
|
+
viewportDistance.bottom - MARGIN_TO_EDGE - this.anchorMargin.bottom;
|
|
3491
|
+
}
|
|
3492
|
+
else {
|
|
3493
|
+
availableTop =
|
|
3494
|
+
viewportDistance.top - MARGIN_TO_EDGE + this.anchorMargin.top;
|
|
3495
|
+
availableBottom = viewportDistance.bottom - MARGIN_TO_EDGE +
|
|
3496
|
+
anchorSize.height - this.anchorMargin.top;
|
|
3497
|
+
}
|
|
3498
|
+
var isAvailableBottom = availableBottom - surfaceSize.height > 0;
|
|
3499
|
+
if (!isAvailableBottom && availableTop > availableBottom) {
|
|
3500
|
+
// Attach bottom side of surface to the anchor.
|
|
3501
|
+
corner = this.setBit(corner, CornerBit.BOTTOM);
|
|
3502
|
+
}
|
|
3503
|
+
var isRtl = this.adapter.isRtl();
|
|
3504
|
+
var isFlipRtl = this.hasBit(this.anchorCorner, CornerBit.FLIP_RTL);
|
|
3505
|
+
var hasRightBit = this.hasBit(this.anchorCorner, CornerBit.RIGHT) ||
|
|
3506
|
+
this.hasBit(corner, CornerBit.RIGHT);
|
|
3507
|
+
// Whether surface attached to right side of anchor element.
|
|
3508
|
+
var isAnchoredToRight = false;
|
|
3509
|
+
// Anchored to start
|
|
3510
|
+
if (isRtl && isFlipRtl) {
|
|
3511
|
+
isAnchoredToRight = !hasRightBit;
|
|
3512
|
+
}
|
|
3513
|
+
else {
|
|
3514
|
+
// Anchored to right
|
|
3515
|
+
isAnchoredToRight = hasRightBit;
|
|
3516
|
+
}
|
|
3517
|
+
var availableLeft;
|
|
3518
|
+
var availableRight;
|
|
3519
|
+
if (isAnchoredToRight) {
|
|
3520
|
+
availableLeft =
|
|
3521
|
+
viewportDistance.left + anchorSize.width + this.anchorMargin.right;
|
|
3522
|
+
availableRight = viewportDistance.right - this.anchorMargin.right;
|
|
3523
|
+
}
|
|
3524
|
+
else {
|
|
3525
|
+
availableLeft = viewportDistance.left + this.anchorMargin.left;
|
|
3526
|
+
availableRight =
|
|
3527
|
+
viewportDistance.right + anchorSize.width - this.anchorMargin.left;
|
|
3528
|
+
}
|
|
3529
|
+
var isAvailableLeft = availableLeft - surfaceSize.width > 0;
|
|
3530
|
+
var isAvailableRight = availableRight - surfaceSize.width > 0;
|
|
3531
|
+
var isOriginCornerAlignedToEnd = this.hasBit(corner, CornerBit.FLIP_RTL) &&
|
|
3532
|
+
this.hasBit(corner, CornerBit.RIGHT);
|
|
3533
|
+
if (isAvailableRight && isOriginCornerAlignedToEnd && isRtl ||
|
|
3534
|
+
!isAvailableLeft && isOriginCornerAlignedToEnd) {
|
|
3535
|
+
// Attach left side of surface to the anchor.
|
|
3536
|
+
corner = this.unsetBit(corner, CornerBit.RIGHT);
|
|
3537
|
+
}
|
|
3538
|
+
else if (isAvailableLeft && isAnchoredToRight && isRtl ||
|
|
3539
|
+
(isAvailableLeft && !isAnchoredToRight && hasRightBit) ||
|
|
3540
|
+
(!isAvailableRight && availableLeft >= availableRight)) {
|
|
3541
|
+
// Attach right side of surface to the anchor.
|
|
3542
|
+
corner = this.setBit(corner, CornerBit.RIGHT);
|
|
3543
|
+
}
|
|
3544
|
+
return corner;
|
|
3545
|
+
};
|
|
3546
|
+
/**
|
|
3547
|
+
* @param corner Origin corner of the menu surface.
|
|
3548
|
+
* @return Maximum height of the menu surface, based on available space. 0
|
|
3549
|
+
* indicates should not be set.
|
|
3550
|
+
*/
|
|
3551
|
+
MDCMenuSurfaceFoundation.prototype.getMenuSurfaceMaxHeight = function (corner) {
|
|
3552
|
+
if (this.maxHeight > 0) {
|
|
3553
|
+
return this.maxHeight;
|
|
3554
|
+
}
|
|
3555
|
+
var viewportDistance = this.measurements.viewportDistance;
|
|
3556
|
+
var maxHeight = 0;
|
|
3557
|
+
var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
|
|
3558
|
+
var isBottomAnchored = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
3559
|
+
var MARGIN_TO_EDGE = MDCMenuSurfaceFoundation.numbers.MARGIN_TO_EDGE;
|
|
3560
|
+
// When maximum height is not specified, it is handled from CSS.
|
|
3561
|
+
if (isBottomAligned) {
|
|
3562
|
+
maxHeight = viewportDistance.top + this.anchorMargin.top - MARGIN_TO_EDGE;
|
|
3563
|
+
if (!isBottomAnchored) {
|
|
3564
|
+
maxHeight += this.measurements.anchorSize.height;
|
|
3565
|
+
}
|
|
3566
|
+
}
|
|
3567
|
+
else {
|
|
3568
|
+
maxHeight = viewportDistance.bottom - this.anchorMargin.bottom +
|
|
3569
|
+
this.measurements.anchorSize.height - MARGIN_TO_EDGE;
|
|
3570
|
+
if (isBottomAnchored) {
|
|
3571
|
+
maxHeight -= this.measurements.anchorSize.height;
|
|
3572
|
+
}
|
|
3573
|
+
}
|
|
3574
|
+
return maxHeight;
|
|
3575
|
+
};
|
|
3576
|
+
/**
|
|
3577
|
+
* @param corner Origin corner of the menu surface.
|
|
3578
|
+
* @return Horizontal offset of menu surface origin corner from corresponding
|
|
3579
|
+
* anchor corner.
|
|
3580
|
+
*/
|
|
3581
|
+
MDCMenuSurfaceFoundation.prototype.getHorizontalOriginOffset = function (corner) {
|
|
3582
|
+
var anchorSize = this.measurements.anchorSize;
|
|
3583
|
+
// isRightAligned corresponds to using the 'right' property on the surface.
|
|
3584
|
+
var isRightAligned = this.hasBit(corner, CornerBit.RIGHT);
|
|
3585
|
+
var avoidHorizontalOverlap = this.hasBit(this.anchorCorner, CornerBit.RIGHT);
|
|
3586
|
+
if (isRightAligned) {
|
|
3587
|
+
var rightOffset = avoidHorizontalOverlap ?
|
|
3588
|
+
anchorSize.width - this.anchorMargin.left :
|
|
3589
|
+
this.anchorMargin.right;
|
|
3590
|
+
// For hoisted or fixed elements, adjust the offset by the difference
|
|
3591
|
+
// between viewport width and body width so when we calculate the right
|
|
3592
|
+
// value (`adjustPositionForHoistedElement`) based on the element
|
|
3593
|
+
// position, the right property is correct.
|
|
3594
|
+
if (this.isHoistedElement || this.isFixedPosition) {
|
|
3595
|
+
return rightOffset -
|
|
3596
|
+
(this.measurements.viewportSize.width -
|
|
3597
|
+
this.measurements.bodySize.width);
|
|
3598
|
+
}
|
|
3599
|
+
return rightOffset;
|
|
3600
|
+
}
|
|
3601
|
+
return avoidHorizontalOverlap ? anchorSize.width - this.anchorMargin.right :
|
|
3602
|
+
this.anchorMargin.left;
|
|
3603
|
+
};
|
|
3604
|
+
/**
|
|
3605
|
+
* @param corner Origin corner of the menu surface.
|
|
3606
|
+
* @return Vertical offset of menu surface origin corner from corresponding
|
|
3607
|
+
* anchor corner.
|
|
3608
|
+
*/
|
|
3609
|
+
MDCMenuSurfaceFoundation.prototype.getVerticalOriginOffset = function (corner) {
|
|
3610
|
+
var anchorSize = this.measurements.anchorSize;
|
|
3611
|
+
var isBottomAligned = this.hasBit(corner, CornerBit.BOTTOM);
|
|
3612
|
+
var avoidVerticalOverlap = this.hasBit(this.anchorCorner, CornerBit.BOTTOM);
|
|
3613
|
+
var y = 0;
|
|
3614
|
+
if (isBottomAligned) {
|
|
3615
|
+
y = avoidVerticalOverlap ? anchorSize.height - this.anchorMargin.top :
|
|
3616
|
+
-this.anchorMargin.bottom;
|
|
3617
|
+
}
|
|
3618
|
+
else {
|
|
3619
|
+
y = avoidVerticalOverlap ?
|
|
3620
|
+
(anchorSize.height + this.anchorMargin.bottom) :
|
|
3621
|
+
this.anchorMargin.top;
|
|
3622
|
+
}
|
|
3623
|
+
return y;
|
|
3624
|
+
};
|
|
3625
|
+
/**
|
|
3626
|
+
* Calculates the offsets for positioning the menu-surface when the
|
|
3627
|
+
* menu-surface has been hoisted to the body.
|
|
3628
|
+
*/
|
|
3629
|
+
MDCMenuSurfaceFoundation.prototype.adjustPositionForHoistedElement = function (position) {
|
|
3630
|
+
var e_1, _a;
|
|
3631
|
+
var _b = this.measurements, windowScroll = _b.windowScroll, viewportDistance = _b.viewportDistance, surfaceSize = _b.surfaceSize, viewportSize = _b.viewportSize;
|
|
3632
|
+
var props = Object.keys(position);
|
|
3633
|
+
try {
|
|
3634
|
+
for (var props_1 = ponyfill.__values(props), props_1_1 = props_1.next(); !props_1_1.done; props_1_1 = props_1.next()) {
|
|
3635
|
+
var prop = props_1_1.value;
|
|
3636
|
+
var value = position[prop] || 0;
|
|
3637
|
+
if (this.isHorizontallyCenteredOnViewport &&
|
|
3638
|
+
(prop === 'left' || prop === 'right')) {
|
|
3639
|
+
position[prop] = (viewportSize.width - surfaceSize.width) / 2;
|
|
3640
|
+
continue;
|
|
3641
|
+
}
|
|
3642
|
+
// Hoisted surfaces need to have the anchor elements location on the page
|
|
3643
|
+
// added to the position properties for proper alignment on the body.
|
|
3644
|
+
value += viewportDistance[prop];
|
|
3645
|
+
// Surfaces that are absolutely positioned need to have additional
|
|
3646
|
+
// calculations for scroll and bottom positioning.
|
|
3647
|
+
if (!this.isFixedPosition) {
|
|
3648
|
+
if (prop === 'top') {
|
|
3649
|
+
value += windowScroll.y;
|
|
3650
|
+
}
|
|
3651
|
+
else if (prop === 'bottom') {
|
|
3652
|
+
value -= windowScroll.y;
|
|
3653
|
+
}
|
|
3654
|
+
else if (prop === 'left') {
|
|
3655
|
+
value += windowScroll.x;
|
|
3656
|
+
}
|
|
3657
|
+
else { // prop === 'right'
|
|
3658
|
+
value -= windowScroll.x;
|
|
3659
|
+
}
|
|
3660
|
+
}
|
|
3661
|
+
position[prop] = value;
|
|
3662
|
+
}
|
|
3663
|
+
}
|
|
3664
|
+
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
3665
|
+
finally {
|
|
3666
|
+
try {
|
|
3667
|
+
if (props_1_1 && !props_1_1.done && (_a = props_1.return)) _a.call(props_1);
|
|
3668
|
+
}
|
|
3669
|
+
finally { if (e_1) throw e_1.error; }
|
|
3670
|
+
}
|
|
3671
|
+
};
|
|
3672
|
+
/**
|
|
3673
|
+
* The last focused element when the menu surface was opened should regain
|
|
3674
|
+
* focus, if the user is focused on or within the menu surface when it is
|
|
3675
|
+
* closed.
|
|
3676
|
+
*/
|
|
3677
|
+
MDCMenuSurfaceFoundation.prototype.maybeRestoreFocus = function () {
|
|
3678
|
+
var _this = this;
|
|
3679
|
+
var isRootFocused = this.adapter.isFocused();
|
|
3680
|
+
var childHasFocus = document.activeElement &&
|
|
3681
|
+
this.adapter.isElementInContainer(document.activeElement);
|
|
3682
|
+
if (isRootFocused || childHasFocus) {
|
|
3683
|
+
// Wait before restoring focus when closing the menu surface. This is
|
|
3684
|
+
// important because if a touch event triggered the menu close, and the
|
|
3685
|
+
// subsequent mouse event occurs after focus is restored, then the
|
|
3686
|
+
// restored focus would be lost.
|
|
3687
|
+
setTimeout(function () {
|
|
3688
|
+
_this.adapter.restoreFocus();
|
|
3689
|
+
}, numbers$1.TOUCH_EVENT_WAIT_MS);
|
|
3690
|
+
}
|
|
3691
|
+
};
|
|
3692
|
+
MDCMenuSurfaceFoundation.prototype.hasBit = function (corner, bit) {
|
|
3693
|
+
return Boolean(corner & bit); // tslint:disable-line:no-bitwise
|
|
3694
|
+
};
|
|
3695
|
+
MDCMenuSurfaceFoundation.prototype.setBit = function (corner, bit) {
|
|
3696
|
+
return corner | bit; // tslint:disable-line:no-bitwise
|
|
3697
|
+
};
|
|
3698
|
+
MDCMenuSurfaceFoundation.prototype.unsetBit = function (corner, bit) {
|
|
3699
|
+
return corner ^ bit;
|
|
3700
|
+
};
|
|
3701
|
+
/**
|
|
3702
|
+
* isFinite that doesn't force conversion to number type.
|
|
3703
|
+
* Equivalent to Number.isFinite in ES2015, which is not supported in IE.
|
|
3704
|
+
*/
|
|
3705
|
+
MDCMenuSurfaceFoundation.prototype.isFinite = function (num) {
|
|
3706
|
+
return typeof num === 'number' && isFinite(num);
|
|
3707
|
+
};
|
|
3708
|
+
return MDCMenuSurfaceFoundation;
|
|
3709
|
+
}(ponyfill.MDCFoundation));
|
|
3710
|
+
|
|
3711
|
+
/**
|
|
3712
|
+
* @license
|
|
3713
|
+
* Copyright 2018 Google Inc.
|
|
3714
|
+
*
|
|
3715
|
+
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
3716
|
+
* of this software and associated documentation files (the "Software"), to deal
|
|
3717
|
+
* in the Software without restriction, including without limitation the rights
|
|
3718
|
+
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
3719
|
+
* copies of the Software, and to permit persons to whom the Software is
|
|
3720
|
+
* furnished to do so, subject to the following conditions:
|
|
3721
|
+
*
|
|
3722
|
+
* The above copyright notice and this permission notice shall be included in
|
|
3723
|
+
* all copies or substantial portions of the Software.
|
|
3724
|
+
*
|
|
3725
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
3726
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
3727
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
3728
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
3729
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
3730
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
3731
|
+
* THE SOFTWARE.
|
|
3732
|
+
*/
|
|
3733
|
+
var MDCMenuSurface = /** @class */ (function (_super) {
|
|
3734
|
+
ponyfill.__extends(MDCMenuSurface, _super);
|
|
3735
|
+
function MDCMenuSurface() {
|
|
3736
|
+
return _super !== null && _super.apply(this, arguments) || this;
|
|
3737
|
+
}
|
|
3738
|
+
MDCMenuSurface.attachTo = function (root) {
|
|
3739
|
+
return new MDCMenuSurface(root);
|
|
3740
|
+
};
|
|
3741
|
+
MDCMenuSurface.prototype.initialSyncWithDOM = function () {
|
|
3742
|
+
var _this = this;
|
|
3743
|
+
var parentEl = this.root.parentElement;
|
|
3744
|
+
this.anchorElement = parentEl && parentEl.classList.contains(cssClasses$1.ANCHOR) ? parentEl : null;
|
|
3745
|
+
if (this.root.classList.contains(cssClasses$1.FIXED)) {
|
|
3746
|
+
this.setFixedPosition(true);
|
|
889
3747
|
}
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
895
|
-
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
3748
|
+
this.handleKeydown = function (event) {
|
|
3749
|
+
_this.foundation.handleKeydown(event);
|
|
3750
|
+
};
|
|
3751
|
+
this.handleBodyClick = function (event) {
|
|
3752
|
+
_this.foundation.handleBodyClick(event);
|
|
3753
|
+
};
|
|
3754
|
+
// capture so that no race between handleBodyClick and quickOpen when
|
|
3755
|
+
// menusurface opened on button click which registers this listener
|
|
3756
|
+
this.registerBodyClickListener = function () {
|
|
3757
|
+
document.body.addEventListener('click', _this.handleBodyClick, { capture: true });
|
|
3758
|
+
};
|
|
3759
|
+
this.deregisterBodyClickListener = function () {
|
|
3760
|
+
document.body.removeEventListener('click', _this.handleBodyClick, { capture: true });
|
|
3761
|
+
};
|
|
3762
|
+
this.listen('keydown', this.handleKeydown);
|
|
3763
|
+
this.listen(strings$1.OPENED_EVENT, this.registerBodyClickListener);
|
|
3764
|
+
this.listen(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
|
|
900
3765
|
};
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
3766
|
+
MDCMenuSurface.prototype.destroy = function () {
|
|
3767
|
+
this.unlisten('keydown', this.handleKeydown);
|
|
3768
|
+
this.unlisten(strings$1.OPENED_EVENT, this.registerBodyClickListener);
|
|
3769
|
+
this.unlisten(strings$1.CLOSED_EVENT, this.deregisterBodyClickListener);
|
|
3770
|
+
_super.prototype.destroy.call(this);
|
|
904
3771
|
};
|
|
905
|
-
|
|
906
|
-
|
|
3772
|
+
MDCMenuSurface.prototype.isOpen = function () {
|
|
3773
|
+
return this.foundation.isOpen();
|
|
907
3774
|
};
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
3775
|
+
MDCMenuSurface.prototype.open = function () {
|
|
3776
|
+
this.foundation.open();
|
|
3777
|
+
};
|
|
3778
|
+
MDCMenuSurface.prototype.close = function (skipRestoreFocus) {
|
|
3779
|
+
if (skipRestoreFocus === void 0) { skipRestoreFocus = false; }
|
|
3780
|
+
this.foundation.close(skipRestoreFocus);
|
|
3781
|
+
};
|
|
3782
|
+
Object.defineProperty(MDCMenuSurface.prototype, "quickOpen", {
|
|
3783
|
+
set: function (quickOpen) {
|
|
3784
|
+
this.foundation.setQuickOpen(quickOpen);
|
|
3785
|
+
},
|
|
3786
|
+
enumerable: false,
|
|
3787
|
+
configurable: true
|
|
3788
|
+
});
|
|
3789
|
+
/** Sets the foundation to use page offsets for an positioning when the menu is hoisted to the body. */
|
|
3790
|
+
MDCMenuSurface.prototype.setIsHoisted = function (isHoisted) {
|
|
3791
|
+
this.foundation.setIsHoisted(isHoisted);
|
|
3792
|
+
};
|
|
3793
|
+
/** Sets the element that the menu-surface is anchored to. */
|
|
3794
|
+
MDCMenuSurface.prototype.setMenuSurfaceAnchorElement = function (element) {
|
|
3795
|
+
this.anchorElement = element;
|
|
3796
|
+
};
|
|
3797
|
+
/** Sets the menu-surface to position: fixed. */
|
|
3798
|
+
MDCMenuSurface.prototype.setFixedPosition = function (isFixed) {
|
|
3799
|
+
if (isFixed) {
|
|
3800
|
+
this.root.classList.add(cssClasses$1.FIXED);
|
|
919
3801
|
}
|
|
920
|
-
else
|
|
921
|
-
|
|
922
|
-
observer.unobserve(this.list);
|
|
923
|
-
this.focusMenuItem();
|
|
924
|
-
});
|
|
925
|
-
observer.observe(this.list);
|
|
3802
|
+
else {
|
|
3803
|
+
this.root.classList.remove(cssClasses$1.FIXED);
|
|
926
3804
|
}
|
|
927
|
-
|
|
3805
|
+
this.foundation.setFixedPosition(isFixed);
|
|
928
3806
|
};
|
|
929
|
-
|
|
930
|
-
|
|
3807
|
+
/** Sets the absolute x/y position to position based on. Requires the menu to be hoisted. */
|
|
3808
|
+
MDCMenuSurface.prototype.setAbsolutePosition = function (x, y) {
|
|
3809
|
+
this.foundation.setAbsolutePosition(x, y);
|
|
3810
|
+
this.setIsHoisted(true);
|
|
931
3811
|
};
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
const activeElement = this.list.shadowRoot.activeElement;
|
|
938
|
-
activeElement === null || activeElement === void 0 ? void 0 : activeElement.blur();
|
|
939
|
-
const menuItems = this.visibleItems.filter(this.isMenuItem);
|
|
940
|
-
const selectedIndex = Math.max(menuItems.findIndex((item) => item.selected), 0);
|
|
941
|
-
const menuElements = Array.from(this.list.shadowRoot.querySelectorAll('[role="menuitem"]'));
|
|
942
|
-
(_a = menuElements[selectedIndex]) === null || _a === void 0 ? void 0 : _a.focus();
|
|
3812
|
+
/**
|
|
3813
|
+
* @param corner Default anchor corner alignment of top-left surface corner.
|
|
3814
|
+
*/
|
|
3815
|
+
MDCMenuSurface.prototype.setAnchorCorner = function (corner) {
|
|
3816
|
+
this.foundation.setAnchorCorner(corner);
|
|
943
3817
|
};
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
return index.h("limel-badge", null);
|
|
947
|
-
}
|
|
3818
|
+
MDCMenuSurface.prototype.setAnchorMargin = function (margin) {
|
|
3819
|
+
this.foundation.setAnchorMargin(margin);
|
|
948
3820
|
};
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
3821
|
+
MDCMenuSurface.prototype.getDefaultFoundation = function () {
|
|
3822
|
+
var _this = this;
|
|
3823
|
+
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
|
|
3824
|
+
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
|
|
3825
|
+
// tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
|
|
3826
|
+
var adapter = {
|
|
3827
|
+
addClass: function (className) { return _this.root.classList.add(className); },
|
|
3828
|
+
removeClass: function (className) { return _this.root.classList.remove(className); },
|
|
3829
|
+
hasClass: function (className) { return _this.root.classList.contains(className); },
|
|
3830
|
+
hasAnchor: function () { return !!_this.anchorElement; },
|
|
3831
|
+
notifyClose: function () {
|
|
3832
|
+
return _this.emit(MDCMenuSurfaceFoundation.strings.CLOSED_EVENT, {});
|
|
3833
|
+
},
|
|
3834
|
+
notifyClosing: function () {
|
|
3835
|
+
_this.emit(MDCMenuSurfaceFoundation.strings.CLOSING_EVENT, {});
|
|
3836
|
+
},
|
|
3837
|
+
notifyOpen: function () {
|
|
3838
|
+
return _this.emit(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, {});
|
|
3839
|
+
},
|
|
3840
|
+
isElementInContainer: function (el) { return _this.root.contains(el); },
|
|
3841
|
+
isRtl: function () {
|
|
3842
|
+
return getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl';
|
|
3843
|
+
},
|
|
3844
|
+
setTransformOrigin: function (origin) {
|
|
3845
|
+
var propertyName = util.getCorrectPropertyName(window, 'transform') + "-origin";
|
|
3846
|
+
_this.root.style.setProperty(propertyName, origin);
|
|
3847
|
+
},
|
|
3848
|
+
isFocused: function () { return document.activeElement === _this.root; },
|
|
3849
|
+
saveFocus: function () {
|
|
3850
|
+
_this.previousFocus =
|
|
3851
|
+
document.activeElement;
|
|
3852
|
+
},
|
|
3853
|
+
restoreFocus: function () {
|
|
3854
|
+
if (_this.root.contains(document.activeElement)) {
|
|
3855
|
+
if (_this.previousFocus && _this.previousFocus.focus) {
|
|
3856
|
+
_this.previousFocus.focus();
|
|
3857
|
+
}
|
|
3858
|
+
}
|
|
3859
|
+
},
|
|
3860
|
+
getInnerDimensions: function () {
|
|
3861
|
+
return {
|
|
3862
|
+
width: _this.root.offsetWidth,
|
|
3863
|
+
height: _this.root.offsetHeight
|
|
3864
|
+
};
|
|
3865
|
+
},
|
|
3866
|
+
getAnchorDimensions: function () { return _this.anchorElement ?
|
|
3867
|
+
_this.anchorElement.getBoundingClientRect() :
|
|
3868
|
+
null; },
|
|
3869
|
+
getWindowDimensions: function () {
|
|
3870
|
+
return { width: window.innerWidth, height: window.innerHeight };
|
|
3871
|
+
},
|
|
3872
|
+
getBodyDimensions: function () {
|
|
3873
|
+
return { width: document.body.clientWidth, height: document.body.clientHeight };
|
|
3874
|
+
},
|
|
3875
|
+
getWindowScroll: function () {
|
|
3876
|
+
return { x: window.pageXOffset, y: window.pageYOffset };
|
|
3877
|
+
},
|
|
3878
|
+
setPosition: function (position) {
|
|
3879
|
+
var rootHTML = _this.root;
|
|
3880
|
+
rootHTML.style.left = 'left' in position ? position.left + "px" : '';
|
|
3881
|
+
rootHTML.style.right = 'right' in position ? position.right + "px" : '';
|
|
3882
|
+
rootHTML.style.top = 'top' in position ? position.top + "px" : '';
|
|
3883
|
+
rootHTML.style.bottom =
|
|
3884
|
+
'bottom' in position ? position.bottom + "px" : '';
|
|
3885
|
+
},
|
|
3886
|
+
setMaxHeight: function (height) {
|
|
3887
|
+
_this.root.style.maxHeight = height;
|
|
3888
|
+
},
|
|
3889
|
+
};
|
|
3890
|
+
// tslint:enable:object-literal-sort-keys
|
|
3891
|
+
return new MDCMenuSurfaceFoundation(adapter);
|
|
952
3892
|
};
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
this.openDirection = 'bottom-start';
|
|
956
|
-
this.surfaceWidth = 'inherit-from-items';
|
|
957
|
-
this.open = false;
|
|
958
|
-
this.badgeIcons = false;
|
|
959
|
-
this.gridLayout = false;
|
|
960
|
-
this.loading = false;
|
|
961
|
-
this.currentSubMenu = undefined;
|
|
962
|
-
this.rootItem = DEFAULT_ROOT_BREADCRUMBS_ITEM;
|
|
963
|
-
this.searcher = undefined;
|
|
964
|
-
this.emptyResultMessage = undefined;
|
|
965
|
-
this.loadingSubItems = undefined;
|
|
966
|
-
this.searchValue = undefined;
|
|
967
|
-
this.searchResults = undefined;
|
|
968
|
-
this.portalId = randomString.createRandomString();
|
|
969
|
-
}
|
|
970
|
-
componentDidRender() {
|
|
971
|
-
const slotElement = this.host.shadowRoot.querySelector('slot');
|
|
972
|
-
slotElement.assignedElements().forEach(this.setTriggerAttributes);
|
|
973
|
-
}
|
|
974
|
-
render() {
|
|
975
|
-
const cssProperties = this.getCssProperties();
|
|
976
|
-
const dropdownZIndex = getComputedStyle(this.host).getPropertyValue('--dropdown-z-index');
|
|
977
|
-
const menuSurfaceWidth = this.getMenuSurfaceWidth(cssProperties['--menu-surface-width']);
|
|
978
|
-
return (index.h("div", { class: "mdc-menu-surface--anchor", onClick: this.onTriggerClick }, index.h("slot", { ref: this.setTriggerRef, name: "trigger" }), this.renderNotificationBadge(), index.h("limel-portal", { visible: this.open, containerId: this.portalId, openDirection: this.openDirection, position: "absolute", containerStyle: { 'z-index': dropdownZIndex } }, index.h("limel-menu-surface", { open: this.open, onDismiss: this.onClose, style: Object.assign(Object.assign({}, cssProperties), { '--mdc-menu-min-width': menuSurfaceWidth, '--limel-menu-surface-display': 'flex', '--limel-menu-surface-flex-direction': 'column' }), class: {
|
|
979
|
-
'has-grid-layout': this.gridLayout,
|
|
980
|
-
} }, this.renderSearchField(), this.renderBreadcrumb(), this.renderLoader(), this.renderEmptyMessage(), this.renderMenuList()))));
|
|
981
|
-
}
|
|
982
|
-
itemsWatcher() {
|
|
983
|
-
this.clearSearch();
|
|
984
|
-
this.setFocus();
|
|
985
|
-
}
|
|
986
|
-
openWatcher(newValue) {
|
|
987
|
-
if (newValue) {
|
|
988
|
-
this.setFocus();
|
|
989
|
-
}
|
|
990
|
-
else {
|
|
991
|
-
this.clearSearch();
|
|
992
|
-
}
|
|
993
|
-
}
|
|
994
|
-
getBreadcrumbsItems() {
|
|
995
|
-
const breadCrumbItems = [];
|
|
996
|
-
let currentItem = this.currentSubMenu;
|
|
997
|
-
while (currentItem) {
|
|
998
|
-
breadCrumbItems.push({
|
|
999
|
-
text: currentItem.text,
|
|
1000
|
-
icon: currentItem.icon,
|
|
1001
|
-
menuItem: currentItem,
|
|
1002
|
-
});
|
|
1003
|
-
currentItem = currentItem.parentItem;
|
|
1004
|
-
}
|
|
1005
|
-
if (breadCrumbItems.length ||
|
|
1006
|
-
this.rootItem !== DEFAULT_ROOT_BREADCRUMBS_ITEM) {
|
|
1007
|
-
breadCrumbItems.push(this.rootItem);
|
|
1008
|
-
}
|
|
1009
|
-
return breadCrumbItems.reverse();
|
|
1010
|
-
}
|
|
1011
|
-
getCssProperties() {
|
|
1012
|
-
const propertyNames = [
|
|
1013
|
-
'--menu-surface-width',
|
|
1014
|
-
'--list-grid-item-max-width',
|
|
1015
|
-
'--list-grid-item-min-width',
|
|
1016
|
-
'--list-grid-gap',
|
|
1017
|
-
'--notification-badge-background-color',
|
|
1018
|
-
'--notification-badge-text-color',
|
|
1019
|
-
];
|
|
1020
|
-
const style = getComputedStyle(this.host);
|
|
1021
|
-
const values = propertyNames.map((property) => {
|
|
1022
|
-
return style.getPropertyValue(property);
|
|
1023
|
-
});
|
|
1024
|
-
return zipObject.zipObject(propertyNames, values);
|
|
1025
|
-
}
|
|
1026
|
-
isMenuItem(item) {
|
|
1027
|
-
return !('separator' in item);
|
|
1028
|
-
}
|
|
1029
|
-
getMenuSurfaceWidth(customWidth) {
|
|
1030
|
-
var _a, _b, _c, _d;
|
|
1031
|
-
if (customWidth) {
|
|
1032
|
-
return customWidth;
|
|
1033
|
-
}
|
|
1034
|
-
if (this.surfaceWidth === 'inherit-from-trigger') {
|
|
1035
|
-
const assignedTriggers = (_a = this.triggerElement) === null || _a === void 0 ? void 0 : _a.assignedElements();
|
|
1036
|
-
if (!(assignedTriggers === null || assignedTriggers === void 0 ? void 0 : assignedTriggers.length) ||
|
|
1037
|
-
!((_b = assignedTriggers[0]) === null || _b === void 0 ? void 0 : _b.clientWidth)) {
|
|
1038
|
-
return '';
|
|
1039
|
-
}
|
|
1040
|
-
return `${assignedTriggers[0].clientWidth}px`;
|
|
1041
|
-
}
|
|
1042
|
-
else if (this.surfaceWidth === 'inherit-from-menu') {
|
|
1043
|
-
if (!((_c = this.host) === null || _c === void 0 ? void 0 : _c.clientWidth)) {
|
|
1044
|
-
return '';
|
|
1045
|
-
}
|
|
1046
|
-
return `${(_d = this.host) === null || _d === void 0 ? void 0 : _d.clientWidth}px`;
|
|
1047
|
-
}
|
|
1048
|
-
return '';
|
|
1049
|
-
}
|
|
1050
|
-
get visibleItems() {
|
|
1051
|
-
var _a;
|
|
1052
|
-
if (Array.isArray(this.searchResults) && this.searchValue) {
|
|
1053
|
-
return this.searchResults;
|
|
1054
|
-
}
|
|
1055
|
-
else if (Array.isArray((_a = this.currentSubMenu) === null || _a === void 0 ? void 0 : _a.items)) {
|
|
1056
|
-
return this.currentSubMenu.items.map((item) => (Object.assign(Object.assign({}, item), { parentItem: this.currentSubMenu })));
|
|
1057
|
-
}
|
|
1058
|
-
return this.items;
|
|
1059
|
-
}
|
|
1060
|
-
get host() { return index.getElement(this); }
|
|
1061
|
-
static get watchers() { return {
|
|
1062
|
-
"items": ["itemsWatcher"],
|
|
1063
|
-
"open": ["openWatcher"]
|
|
1064
|
-
}; }
|
|
1065
|
-
};
|
|
1066
|
-
Menu.style = menuCss;
|
|
3893
|
+
return MDCMenuSurface;
|
|
3894
|
+
}(ponyfill.MDCComponent));
|
|
1067
3895
|
|
|
1068
3896
|
/**
|
|
1069
3897
|
* @license
|
|
@@ -1220,7 +4048,7 @@ var MDCMenuFoundation = /** @class */ (function (_super) {
|
|
|
1220
4048
|
_this.adapter.isSelectableItemAtIndex(recomputedIndex)) {
|
|
1221
4049
|
_this.setSelectedIndex(recomputedIndex);
|
|
1222
4050
|
}
|
|
1223
|
-
},
|
|
4051
|
+
}, MDCMenuSurfaceFoundation.numbers.TRANSITION_CLOSE_DURATION);
|
|
1224
4052
|
};
|
|
1225
4053
|
MDCMenuFoundation.prototype.handleMenuSurfaceOpened = function () {
|
|
1226
4054
|
switch (this.defaultFocusState) {
|
|
@@ -1276,11 +4104,11 @@ var MDCMenuFoundation = /** @class */ (function (_super) {
|
|
|
1276
4104
|
MDCMenuFoundation.prototype.setEnabled = function (index, isEnabled) {
|
|
1277
4105
|
this.validatedIndex(index);
|
|
1278
4106
|
if (isEnabled) {
|
|
1279
|
-
this.adapter.removeClassFromElementAtIndex(index,
|
|
4107
|
+
this.adapter.removeClassFromElementAtIndex(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS);
|
|
1280
4108
|
this.adapter.addAttributeToElementAtIndex(index, strings.ARIA_DISABLED_ATTR, 'false');
|
|
1281
4109
|
}
|
|
1282
4110
|
else {
|
|
1283
|
-
this.adapter.addClassToElementAtIndex(index,
|
|
4111
|
+
this.adapter.addClassToElementAtIndex(index, cssClasses$2.LIST_ITEM_DISABLED_CLASS);
|
|
1284
4112
|
this.adapter.addAttributeToElementAtIndex(index, strings.ARIA_DISABLED_ATTR, 'true');
|
|
1285
4113
|
}
|
|
1286
4114
|
};
|
|
@@ -1325,8 +4153,8 @@ var MDCMenu = /** @class */ (function (_super) {
|
|
|
1325
4153
|
return new MDCMenu(root);
|
|
1326
4154
|
};
|
|
1327
4155
|
MDCMenu.prototype.initialize = function (menuSurfaceFactory, listFactory) {
|
|
1328
|
-
if (menuSurfaceFactory === void 0) { menuSurfaceFactory = function (el) { return new
|
|
1329
|
-
if (listFactory === void 0) { listFactory = function (el) { return new
|
|
4156
|
+
if (menuSurfaceFactory === void 0) { menuSurfaceFactory = function (el) { return new MDCMenuSurface(el); }; }
|
|
4157
|
+
if (listFactory === void 0) { listFactory = function (el) { return new MDCList(el); }; }
|
|
1330
4158
|
this.menuSurfaceFactory = menuSurfaceFactory;
|
|
1331
4159
|
this.listFactory = listFactory;
|
|
1332
4160
|
};
|
|
@@ -1350,18 +4178,18 @@ var MDCMenu = /** @class */ (function (_super) {
|
|
|
1350
4178
|
this.handleMenuSurfaceOpened = function () {
|
|
1351
4179
|
_this.foundation.handleMenuSurfaceOpened();
|
|
1352
4180
|
};
|
|
1353
|
-
this.menuSurface.listen(
|
|
4181
|
+
this.menuSurface.listen(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);
|
|
1354
4182
|
this.listen('keydown', this.handleKeydown);
|
|
1355
|
-
this.listen(
|
|
4183
|
+
this.listen(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);
|
|
1356
4184
|
};
|
|
1357
4185
|
MDCMenu.prototype.destroy = function () {
|
|
1358
4186
|
if (this.list) {
|
|
1359
4187
|
this.list.destroy();
|
|
1360
4188
|
}
|
|
1361
4189
|
this.menuSurface.destroy();
|
|
1362
|
-
this.menuSurface.unlisten(
|
|
4190
|
+
this.menuSurface.unlisten(MDCMenuSurfaceFoundation.strings.OPENED_EVENT, this.handleMenuSurfaceOpened);
|
|
1363
4191
|
this.unlisten('keydown', this.handleKeydown);
|
|
1364
|
-
this.unlisten(
|
|
4192
|
+
this.unlisten(MDCListFoundation.strings.ACTION_EVENT, this.handleItemAction);
|
|
1365
4193
|
_super.prototype.destroy.call(this);
|
|
1366
4194
|
};
|
|
1367
4195
|
Object.defineProperty(MDCMenu.prototype, "open", {
|
|
@@ -1476,7 +4304,7 @@ var MDCMenu = /** @class */ (function (_super) {
|
|
|
1476
4304
|
* radio lists, and an array of numbers for checkbox lists.
|
|
1477
4305
|
*/
|
|
1478
4306
|
get: function () {
|
|
1479
|
-
return this.list ? this.list.selectedIndex :
|
|
4307
|
+
return this.list ? this.list.selectedIndex : numbers$2.UNSET_INDEX;
|
|
1480
4308
|
},
|
|
1481
4309
|
/**
|
|
1482
4310
|
* Sets the selected index of the list. Only applicable to select menus.
|
|
@@ -1828,7 +4656,7 @@ const MenuList = class {
|
|
|
1828
4656
|
this.mdcMenu = new MDCMenu(element);
|
|
1829
4657
|
this.mdcMenu.hasTypeahead = true;
|
|
1830
4658
|
this.mdcMenu.wrapFocus = true;
|
|
1831
|
-
this.mdcMenu.items.forEach((item) => new component$
|
|
4659
|
+
this.mdcMenu.items.forEach((item) => new component$1.MDCRipple(item));
|
|
1832
4660
|
};
|
|
1833
4661
|
this.setupListeners = () => {
|
|
1834
4662
|
if (!this.mdcMenu) {
|
|
@@ -1912,6 +4740,113 @@ const MenuList = class {
|
|
|
1912
4740
|
};
|
|
1913
4741
|
MenuList.style = menuListCss;
|
|
1914
4742
|
|
|
4743
|
+
const menuSurfaceCss = ":host(limel-menu-surface){display:block;max-height:inherit}.mdc-menu-surface{display:none;position:absolute;box-sizing:border-box;max-width:calc(100vw - 32px);max-width:var(--mdc-menu-max-width, calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:var(--mdc-menu-max-height, calc(100vh - 32px));margin:0;padding:0;transform:scale(1);transform-origin:top left;opacity:0;overflow:auto;will-change:transform, opacity;z-index:8;transition:opacity 0.03s linear, transform 0.12s cubic-bezier(0, 0, 0.2, 1), height 250ms cubic-bezier(0, 0, 0.2, 1);box-shadow:0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12);background-color:#fff;background-color:var(--mdc-theme-surface, #fff);color:#000;color:var(--mdc-theme-on-surface, #000);border-radius:4px;border-radius:var(--mdc-shape-medium, 4px);transform-origin-left:top left;transform-origin-right:top right}.mdc-menu-surface:focus{outline:none}.mdc-menu-surface--animating-open{display:inline-block;transform:scale(0.8);opacity:0}.mdc-menu-surface--open{display:inline-block;transform:scale(1);opacity:1}.mdc-menu-surface--animating-closed{display:inline-block;opacity:0;transition:opacity 0.075s linear}[dir=rtl] .mdc-menu-surface,.mdc-menu-surface[dir=rtl]{transform-origin-left:top right;transform-origin-right:top left;}.mdc-menu-surface--anchor{position:relative;overflow:visible}.mdc-menu-surface--fixed{position:fixed}.mdc-menu-surface--fullwidth{width:100%}@keyframes mdc-ripple-fg-radius-in{from{animation-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transform:translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1)}to{transform:translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1))}}@keyframes mdc-ripple-fg-opacity-in{from{animation-timing-function:linear;opacity:0}to{opacity:var(--mdc-ripple-fg-opacity, 0)}}@keyframes mdc-ripple-fg-opacity-out{from{animation-timing-function:linear;opacity:var(--mdc-ripple-fg-opacity, 0)}to{opacity:0}}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1);background-color:#fff;background-color:var(--mdc-elevation-overlay-color, #fff)}.mdc-menu{min-width:112px;min-width:var(--mdc-menu-min-width, 112px)}.mdc-menu .mdc-deprecated-list-item__meta{color:rgba(0, 0, 0, 0.87)}.mdc-menu .mdc-deprecated-list-item__graphic{color:rgba(0, 0, 0, 0.87)}.mdc-menu .mdc-deprecated-list{color:rgba(0, 0, 0, 0.87)}.mdc-menu .mdc-deprecated-list,.mdc-menu .mdc-list{position:relative}.mdc-menu .mdc-deprecated-list .mdc-elevation-overlay,.mdc-menu .mdc-list .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-menu .mdc-deprecated-list-divider{margin:8px 0}.mdc-menu .mdc-deprecated-list-item{user-select:none}.mdc-menu .mdc-deprecated-list-item--disabled{cursor:auto}.mdc-menu a.mdc-deprecated-list-item .mdc-deprecated-list-item__text,.mdc-menu a.mdc-deprecated-list-item .mdc-deprecated-list-item__graphic{pointer-events:none}.mdc-menu__selection-group{padding:0;fill:currentColor}.mdc-menu__selection-group .mdc-deprecated-list-item{padding-left:56px;padding-right:16px}[dir=rtl] .mdc-menu__selection-group .mdc-deprecated-list-item,.mdc-menu__selection-group .mdc-deprecated-list-item[dir=rtl]{padding-left:16px;padding-right:56px;}.mdc-menu__selection-group .mdc-menu__selection-group-icon{left:16px;right:initial;display:none;position:absolute;top:50%;transform:translateY(-50%)}[dir=rtl] .mdc-menu__selection-group .mdc-menu__selection-group-icon,.mdc-menu__selection-group .mdc-menu__selection-group-icon[dir=rtl]{left:initial;right:16px;}.mdc-menu-item--selected .mdc-menu__selection-group-icon{display:inline}.mdc-menu-surface{opacity:1;display:var(--limel-menu-surface-display, block);flex-direction:var(--limel-menu-surface-flex-direction, row);max-height:inherit;position:relative;--mdc-menu-max-width:var(\n --menu-surface-width,\n min(calc(100vw - 2rem), 20rem)\n );background-color:var(--lime-elevated-surface-background-color)}:host(limel-menu-surface.has-grid-layout) .mdc-menu-surface{width:var(--menu-surface-width, min(100vw - 2rem, 40rem));max-width:unset}";
|
|
4744
|
+
|
|
4745
|
+
const MenuSurface = class {
|
|
4746
|
+
constructor(hostRef) {
|
|
4747
|
+
index.registerInstance(this, hostRef);
|
|
4748
|
+
this.dismiss = index.createEvent(this, "dismiss", 7);
|
|
4749
|
+
this.setup = () => {
|
|
4750
|
+
const menuElement = this.host.shadowRoot.querySelector('.mdc-menu-surface');
|
|
4751
|
+
if (!menuElement) {
|
|
4752
|
+
return;
|
|
4753
|
+
}
|
|
4754
|
+
this.menuSurface = new MDCMenuSurface(menuElement);
|
|
4755
|
+
this.menuSurface.setAnchorCorner(Corner.TOP_START);
|
|
4756
|
+
document.addEventListener('mousedown', this.handleDocumentClick, {
|
|
4757
|
+
capture: true,
|
|
4758
|
+
});
|
|
4759
|
+
this.host.addEventListener('keydown', this.handleKeyDown);
|
|
4760
|
+
};
|
|
4761
|
+
this.teardown = () => {
|
|
4762
|
+
var _a;
|
|
4763
|
+
(_a = this.menuSurface) === null || _a === void 0 ? void 0 : _a.destroy();
|
|
4764
|
+
document.removeEventListener('mousedown', this.handleDocumentClick, {
|
|
4765
|
+
capture: true,
|
|
4766
|
+
});
|
|
4767
|
+
this.host.removeEventListener('keydown', this.handleKeyDown);
|
|
4768
|
+
};
|
|
4769
|
+
this.handleDocumentClick = (event) => {
|
|
4770
|
+
const elementPath = event.composedPath ? event.composedPath() : [];
|
|
4771
|
+
if (!this.open) {
|
|
4772
|
+
return;
|
|
4773
|
+
}
|
|
4774
|
+
if (dom.isDescendant(event.target, this.host)) {
|
|
4775
|
+
return;
|
|
4776
|
+
}
|
|
4777
|
+
if (this.allowClicksElement) {
|
|
4778
|
+
const clickedInAllowedElement = elementPath.includes(this.allowClicksElement);
|
|
4779
|
+
if (clickedInAllowedElement) {
|
|
4780
|
+
return;
|
|
4781
|
+
}
|
|
4782
|
+
}
|
|
4783
|
+
this.dismiss.emit();
|
|
4784
|
+
this.preventClickEventPropagation();
|
|
4785
|
+
};
|
|
4786
|
+
this.preventClickEventPropagation = () => {
|
|
4787
|
+
// When the menu surface is open, we want to stop the `click` event from propagating
|
|
4788
|
+
// when clicking outside the surface itself. This is to prevent any dialog that might
|
|
4789
|
+
// be open from closing, etc. However, when dragging a scrollbar no `click` event is emitted,
|
|
4790
|
+
// only mousedown and mouseup. So we listen for `mousedown` and attach a one-time listener
|
|
4791
|
+
// for `click`, so we can capture and "kill" it.
|
|
4792
|
+
document.addEventListener('click', this.stopEvent, {
|
|
4793
|
+
capture: true,
|
|
4794
|
+
once: true,
|
|
4795
|
+
});
|
|
4796
|
+
// We also capture and "kill" the next `mouseup` event.
|
|
4797
|
+
document.addEventListener('mouseup', this.stopEvent, {
|
|
4798
|
+
capture: true,
|
|
4799
|
+
once: true,
|
|
4800
|
+
});
|
|
4801
|
+
// If the user dragged the scrollbar, no `click` event happens. So when we get the
|
|
4802
|
+
// `mouseup` event, remove the handler for `click` if it's still there.
|
|
4803
|
+
// Otherwise, we would catch the next click even though the menu is no longer open.
|
|
4804
|
+
document.addEventListener('mouseup', () => {
|
|
4805
|
+
document.removeEventListener('click', this.stopEvent, {
|
|
4806
|
+
capture: true,
|
|
4807
|
+
});
|
|
4808
|
+
}, {
|
|
4809
|
+
once: true,
|
|
4810
|
+
});
|
|
4811
|
+
};
|
|
4812
|
+
this.stopEvent = (event) => {
|
|
4813
|
+
event.stopPropagation();
|
|
4814
|
+
event.preventDefault();
|
|
4815
|
+
};
|
|
4816
|
+
this.handleKeyDown = (event) => {
|
|
4817
|
+
const isEscape = event.key === keycodes.ESCAPE || event.keyCode === keycodes.ESCAPE_KEY_CODE;
|
|
4818
|
+
const isTab = event.key === keycodes.TAB || event.keyCode === keycodes.TAB_KEY_CODE;
|
|
4819
|
+
if (this.open && (isEscape || isTab)) {
|
|
4820
|
+
event.stopPropagation();
|
|
4821
|
+
this.dismiss.emit();
|
|
4822
|
+
}
|
|
4823
|
+
};
|
|
4824
|
+
this.open = false;
|
|
4825
|
+
this.allowClicksElement = undefined;
|
|
4826
|
+
}
|
|
4827
|
+
connectedCallback() {
|
|
4828
|
+
this.setup();
|
|
4829
|
+
}
|
|
4830
|
+
disconnectedCallback() {
|
|
4831
|
+
this.teardown();
|
|
4832
|
+
}
|
|
4833
|
+
componentDidLoad() {
|
|
4834
|
+
this.setup();
|
|
4835
|
+
}
|
|
4836
|
+
render() {
|
|
4837
|
+
const classList = {
|
|
4838
|
+
'mdc-menu': true,
|
|
4839
|
+
'mdc-menu-surface': true,
|
|
4840
|
+
'mdc-menu-surface--open': this.open,
|
|
4841
|
+
'mdc-elevation-transition': true,
|
|
4842
|
+
'mdc-elevation--z4': true,
|
|
4843
|
+
};
|
|
4844
|
+
return (index.h("div", { class: classList, tabindex: "-1" }, index.h("slot", null)));
|
|
4845
|
+
}
|
|
4846
|
+
get host() { return index.getElement(this); }
|
|
4847
|
+
};
|
|
4848
|
+
MenuSurface.style = menuSurfaceCss;
|
|
4849
|
+
|
|
1915
4850
|
const spinnerCss = ":host{--mdc-theme-primary:var(\n --lime-primary-color,\n rgb(var(--color-teal-default))\n );--mdc-theme-secondary:var(\n --lime-secondary-color,\n rgb(var(--contrast-1100))\n );--mdc-theme-on-primary:var(\n --lime-on-primary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-secondary:var(\n --lime-on-secondary-color,\n rgb(var(--contrast-100))\n );--mdc-theme-text-disabled-on-background:var(\n --lime-text-disabled-on-background-color,\n rgba(var(--contrast-1700), 0.38)\n );--mdc-theme-text-primary-on-background:var(\n --lime-text-primary-on-background-color,\n rgba(var(--contrast-1700), 0.87)\n );--mdc-theme-text-secondary-on-background:var(\n --lime-text-secondary-on-background-color,\n rgba(var(--contrast-1700), 0.54)\n );--mdc-theme-error:var(\n --lime-error-background-color,\n rgb(var(--color-red-dark))\n );--lime-error-text-color:rgb(var(--color-red-darker));--mdc-theme-surface:var(\n --lime-surface-background-color,\n rgb(var(--contrast-100))\n );--mdc-theme-on-surface:var(\n --lime-on-surface-color,\n rgb(var(--contrast-1500))\n )}:host(limel-spinner){display:block}@keyframes spin{50%{transform:rotate(180deg)}100%{transform:rotate(720deg)}}@keyframes fade-in-the-spinner{0%{transform:scale(0.7);opacity:0}100%{transform:scale(1);opacity:1}}@keyframes animate-colored-circles{5%{stroke-dashoffset:0}10%,100%{stroke-dashoffset:63}}:host([hidden]){display:none}:host{box-sizing:border-box;display:flex;align-items:center;justify-content:center;height:1.5rem;width:1.5rem;transform:translate3d(0, 0, 0);animation:fade-in-the-spinner 0.5s ease forwards}:host([size=x-small]){height:2rem;width:2rem}:host([size=small]){height:2.125rem;width:2.125rem}:host([size=medium]){height:2.75rem;width:2.75rem}:host([size=large]){height:4rem;width:4rem}.spinner{animation:spin 1s linear infinite;transform-origin:center}.color{animation:animate-colored-circles 10s linear infinite;fill:none;stroke-dasharray:63;stroke-dashoffset:63;stroke-linecap:round;stroke-width:4}.color.thick{stroke-width:10}.color:nth-child(1){stroke:var(--spinner-color-1, rgb(var(--lime-brand-color-lime-green)))}.color:nth-child(2){stroke:var(--spinner-color-2, rgb(var(--lime-brand-color-ocean-teal)));animation-delay:1s}.color:nth-child(3){stroke:var(--spinner-color-3, rgb(var(--lime-brand-color-aqua)));animation-delay:2s}.color:nth-child(4){stroke:var(--spinner-color-4, rgb(var(--lime-brand-color-bubble-gum)));animation-delay:3s}.color:nth-child(5){stroke:var(--spinner-color-5, rgb(var(--lime-brand-color-sunny-orange)));animation-delay:4s}.color:nth-child(6){stroke:var(--spinner-color-6, rgb(var(--lime-brand-color-lime-green)));animation-delay:5s}.color:nth-child(7){stroke:var(--spinner-color-7, rgb(var(--lime-brand-color-ocean-teal)));animation-delay:6s}.color:nth-child(8){stroke:var(--spinner-color-8, rgb(var(--lime-brand-color-aqua)));animation-delay:7s}.color:nth-child(9){stroke:var(--spinner-color-9, rgb(var(--lime-brand-color-bubble-gum)));animation-delay:8s}.color:nth-child(10){stroke:var(--spinner-color-10, rgb(var(--contrast-700)));animation-delay:9s}.outline{stroke:rgba(var(--lime-brand-color-light-grey), 0.3);fill:none;stroke-linecap:round;stroke-width:4}.outline.thick{stroke-width:10}";
|
|
1916
4851
|
|
|
1917
4852
|
const Spinner = class {
|
|
@@ -1936,8 +4871,10 @@ Spinner.style = spinnerCss;
|
|
|
1936
4871
|
|
|
1937
4872
|
exports.limel_breadcrumbs = Breadcrumbs;
|
|
1938
4873
|
exports.limel_input_field = InputField;
|
|
4874
|
+
exports.limel_list = List;
|
|
1939
4875
|
exports.limel_menu = Menu;
|
|
1940
4876
|
exports.limel_menu_list = MenuList;
|
|
4877
|
+
exports.limel_menu_surface = MenuSurface;
|
|
1941
4878
|
exports.limel_spinner = Spinner;
|
|
1942
4879
|
|
|
1943
|
-
//# sourceMappingURL=limel-
|
|
4880
|
+
//# sourceMappingURL=limel-breadcrumbs_7.cjs.entry.js.map
|