@limetech/lime-elements 37.2.8 → 37.4.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 +35 -0
- package/dist/cjs/{component-6c4222b7.js → component-cba208a8.js} +137 -18
- package/dist/cjs/component-cba208a8.js.map +1 -0
- package/dist/cjs/{get-icon-props-d74b10c9.js → get-icon-props-50be7440.js} +1 -19
- package/dist/cjs/get-icon-props-50be7440.js.map +1 -0
- package/dist/cjs/lime-elements.cjs.js +1 -1
- package/dist/cjs/limel-action-bar-item_2.cjs.entry.js +1 -1
- package/dist/cjs/limel-breadcrumbs_3.cjs.entry.js +3 -4
- package/dist/cjs/limel-breadcrumbs_3.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-chip_2.cjs.entry.js +608 -0
- package/dist/cjs/limel-chip_2.cjs.entry.js.map +1 -0
- package/dist/cjs/limel-collapsible-section.cjs.entry.js +1 -1
- package/dist/cjs/limel-collapsible-section.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-color-picker-palette.cjs.entry.js +1 -1
- package/dist/cjs/limel-color-picker-palette.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-color-picker.cjs.entry.js +1 -1
- package/dist/cjs/limel-color-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-file.cjs.entry.js +1 -1
- package/dist/cjs/limel-form.cjs.entry.js +1 -1
- package/dist/cjs/limel-form.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-header.cjs.entry.js +1 -1
- package/dist/cjs/limel-header.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-helper-line.cjs.entry.js +1 -1
- package/dist/cjs/limel-helper-line.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-input-field_3.cjs.entry.js +4 -5
- package/dist/cjs/limel-input-field_3.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-picker.cjs.entry.js +1 -1
- package/dist/cjs/limel-progress-flow-item.cjs.entry.js +1 -1
- package/dist/cjs/limel-progress-flow.cjs.entry.js +2 -2
- package/dist/cjs/limel-progress-flow.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-select.cjs.entry.js +2 -2
- package/dist/cjs/limel-select.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-slider.cjs.entry.js +1 -1
- package/dist/cjs/limel-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/limel-tab-bar.cjs.entry.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/chip/chip.css +3 -0
- package/dist/collection/components/chip/chip.js +41 -14
- package/dist/collection/components/chip/chip.js.map +1 -1
- package/dist/collection/components/chip-set/chip-set.css +42 -734
- package/dist/collection/components/chip-set/chip-set.js +83 -108
- package/dist/collection/components/chip-set/chip-set.js.map +1 -1
- package/dist/collection/components/chip-set/chip.types.js.map +1 -1
- package/dist/collection/components/collapsible-section/collapsible-section.css +1 -2
- package/dist/collection/components/color-picker/color-picker-palette.css +71 -4
- package/dist/collection/components/color-picker/color-picker.css +71 -4
- package/dist/collection/components/form/form.css +1 -2
- package/dist/collection/components/header/header.js +1 -0
- package/dist/collection/components/header/header.js.map +1 -1
- package/dist/collection/components/helper-line/helper-line.css +1 -0
- package/dist/collection/components/input-field/input-field.css +24 -5
- package/dist/collection/components/list/list.css +2 -5
- package/dist/collection/components/menu-list/menu-list.css +2 -5
- package/dist/collection/components/progress-flow/progress-flow.css +1 -1
- package/dist/collection/components/select/select.css +9 -19
- package/dist/collection/components/select/select.js +0 -1
- package/dist/collection/components/select/select.js.map +1 -1
- package/dist/collection/components/slider/slider.css +12 -9
- package/dist/collection/style/internal/shared_input-select-picker.scss +11 -2
- package/dist/esm/{component-703e23db.js → component-db286494.js} +121 -2
- package/dist/esm/component-db286494.js.map +1 -0
- package/dist/esm/{get-icon-props-f581151a.js → get-icon-props-0b65f85e.js} +2 -19
- package/dist/esm/get-icon-props-0b65f85e.js.map +1 -0
- package/dist/esm/{keycodes-22fb659d.js → keycodes-bf11a644.js} +2 -2
- package/dist/esm/{keycodes-22fb659d.js.map → keycodes-bf11a644.js.map} +1 -1
- package/dist/esm/lime-elements.js +1 -1
- package/dist/esm/limel-action-bar-item_2.entry.js +1 -1
- package/dist/esm/limel-breadcrumbs_3.entry.js +4 -5
- package/dist/esm/limel-breadcrumbs_3.entry.js.map +1 -1
- package/dist/esm/limel-chip_2.entry.js +603 -0
- package/dist/esm/limel-chip_2.entry.js.map +1 -0
- package/dist/esm/limel-collapsible-section.entry.js +1 -1
- package/dist/esm/limel-collapsible-section.entry.js.map +1 -1
- package/dist/esm/limel-color-picker-palette.entry.js +1 -1
- package/dist/esm/limel-color-picker-palette.entry.js.map +1 -1
- package/dist/esm/limel-color-picker.entry.js +1 -1
- package/dist/esm/limel-color-picker.entry.js.map +1 -1
- package/dist/esm/limel-file.entry.js +1 -1
- package/dist/esm/limel-form.entry.js +1 -1
- package/dist/esm/limel-form.entry.js.map +1 -1
- package/dist/esm/limel-header.entry.js +1 -1
- package/dist/esm/limel-header.entry.js.map +1 -1
- package/dist/esm/limel-helper-line.entry.js +1 -1
- package/dist/esm/limel-helper-line.entry.js.map +1 -1
- package/dist/esm/limel-input-field_3.entry.js +5 -6
- package/dist/esm/limel-input-field_3.entry.js.map +1 -1
- package/dist/esm/limel-picker.entry.js +2 -2
- package/dist/esm/limel-popover_2.entry.js +1 -1
- package/dist/esm/limel-progress-flow-item.entry.js +1 -1
- package/dist/esm/limel-progress-flow.entry.js +2 -2
- package/dist/esm/limel-progress-flow.entry.js.map +1 -1
- package/dist/esm/limel-select.entry.js +3 -3
- package/dist/esm/limel-select.entry.js.map +1 -1
- package/dist/esm/limel-slider.entry.js +1 -1
- package/dist/esm/limel-slider.entry.js.map +1 -1
- package/dist/esm/limel-tab-bar.entry.js +1 -1
- package/dist/esm/loader.js +1 -1
- 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-4a8ac53b.entry.js → p-00064897.entry.js} +4 -4
- package/dist/lime-elements/{p-4a8ac53b.entry.js.map → p-00064897.entry.js.map} +1 -1
- package/dist/lime-elements/p-027b500e.entry.js +2 -0
- package/dist/lime-elements/p-027b500e.entry.js.map +1 -0
- package/dist/lime-elements/{p-79fa180b.entry.js → p-0345e5c9.entry.js} +4 -4
- package/dist/lime-elements/{p-79fa180b.entry.js.map → p-0345e5c9.entry.js.map} +1 -1
- package/dist/lime-elements/p-104120ab.entry.js +2 -0
- package/dist/lime-elements/p-104120ab.entry.js.map +1 -0
- package/dist/lime-elements/p-27330d1d.entry.js +2 -0
- package/dist/lime-elements/p-27330d1d.entry.js.map +1 -0
- package/dist/lime-elements/{p-854343a1.entry.js → p-27d64a5a.entry.js} +2 -2
- package/dist/lime-elements/p-2f777fdb.js +2 -0
- package/dist/lime-elements/p-2f777fdb.js.map +1 -0
- package/dist/lime-elements/{p-554cdf9e.entry.js → p-5903e050.entry.js} +2 -2
- package/dist/lime-elements/{p-554cdf9e.entry.js.map → p-5903e050.entry.js.map} +1 -1
- package/dist/lime-elements/p-68cb9574.entry.js +2 -0
- package/dist/lime-elements/p-68cb9574.entry.js.map +1 -0
- package/dist/lime-elements/{p-af53d049.entry.js → p-71282352.entry.js} +2 -2
- package/dist/lime-elements/{p-af53d049.entry.js.map → p-71282352.entry.js.map} +1 -1
- package/dist/lime-elements/{p-60063e02.entry.js → p-870d72f1.entry.js} +2 -2
- package/dist/lime-elements/{p-60063e02.entry.js.map → p-870d72f1.entry.js.map} +1 -1
- package/dist/lime-elements/p-8d13a44f.entry.js +2 -0
- package/dist/lime-elements/{p-f613f943.entry.js.map → p-8d13a44f.entry.js.map} +1 -1
- package/dist/lime-elements/p-a1d841db.entry.js +2 -0
- package/dist/lime-elements/p-a1d841db.entry.js.map +1 -0
- package/dist/lime-elements/{p-acd589ef.entry.js → p-b03c1b71.entry.js} +2 -2
- package/dist/lime-elements/{p-85a770a4.entry.js → p-b51fd0c7.entry.js} +2 -2
- package/dist/lime-elements/{p-e53b7ccf.entry.js → p-b89d2cc3.entry.js} +2 -2
- package/dist/lime-elements/{p-c022dd0d.entry.js → p-d9ad1ebe.entry.js} +3 -3
- package/dist/lime-elements/{p-c022dd0d.entry.js.map → p-d9ad1ebe.entry.js.map} +1 -1
- package/dist/lime-elements/p-dfa06174.entry.js +2 -0
- package/dist/lime-elements/p-dfa06174.entry.js.map +1 -0
- package/dist/lime-elements/{p-93c6d561.js → p-e03dfe70.js} +2 -2
- package/dist/lime-elements/{p-38151879.js → p-f764b655.js} +32 -10
- package/dist/lime-elements/p-f764b655.js.map +1 -0
- package/dist/lime-elements/{p-bbe3ce51.entry.js → p-fdae60a1.entry.js} +2 -2
- package/dist/lime-elements/style/internal/shared_input-select-picker.scss +11 -2
- package/dist/types/components/chip/chip.d.ts +17 -4
- package/dist/types/components/chip-set/chip-set.d.ts +15 -15
- package/dist/types/components/chip-set/chip.types.d.ts +7 -1
- package/dist/types/components/header/header.d.ts +1 -0
- package/dist/types/components/select/select.d.ts +0 -1
- package/dist/types/components.d.ts +22 -12
- package/package.json +6 -6
- package/dist/cjs/component-6c4222b7.js.map +0 -1
- package/dist/cjs/get-icon-props-d74b10c9.js.map +0 -1
- package/dist/cjs/keyboard-9477d3a8.js +0 -133
- package/dist/cjs/keyboard-9477d3a8.js.map +0 -1
- package/dist/cjs/limel-chip-set.cjs.entry.js +0 -2095
- package/dist/cjs/limel-chip-set.cjs.entry.js.map +0 -1
- package/dist/cjs/limel-chip.cjs.entry.js +0 -105
- package/dist/cjs/limel-chip.cjs.entry.js.map +0 -1
- package/dist/esm/component-703e23db.js.map +0 -1
- package/dist/esm/get-icon-props-f581151a.js.map +0 -1
- package/dist/esm/keyboard-4b9e12e3.js +0 -129
- package/dist/esm/keyboard-4b9e12e3.js.map +0 -1
- package/dist/esm/limel-chip-set.entry.js +0 -2091
- package/dist/esm/limel-chip-set.entry.js.map +0 -1
- package/dist/esm/limel-chip.entry.js +0 -101
- package/dist/esm/limel-chip.entry.js.map +0 -1
- package/dist/lime-elements/p-1291ed2c.entry.js +0 -2
- package/dist/lime-elements/p-1291ed2c.entry.js.map +0 -1
- package/dist/lime-elements/p-38151879.js.map +0 -1
- package/dist/lime-elements/p-48aa89a6.entry.js +0 -2
- package/dist/lime-elements/p-48aa89a6.entry.js.map +0 -1
- package/dist/lime-elements/p-4d92b6fb.js +0 -2
- package/dist/lime-elements/p-4d92b6fb.js.map +0 -1
- package/dist/lime-elements/p-5240b8a3.entry.js +0 -2
- package/dist/lime-elements/p-5240b8a3.entry.js.map +0 -1
- package/dist/lime-elements/p-6e219bb4.js +0 -24
- package/dist/lime-elements/p-6e219bb4.js.map +0 -1
- package/dist/lime-elements/p-711c8538.entry.js +0 -2
- package/dist/lime-elements/p-711c8538.entry.js.map +0 -1
- package/dist/lime-elements/p-8a9d91cf.entry.js +0 -222
- package/dist/lime-elements/p-8a9d91cf.entry.js.map +0 -1
- package/dist/lime-elements/p-bccf626e.entry.js +0 -2
- package/dist/lime-elements/p-bccf626e.entry.js.map +0 -1
- package/dist/lime-elements/p-e0f37631.entry.js +0 -2
- package/dist/lime-elements/p-e0f37631.entry.js.map +0 -1
- package/dist/lime-elements/p-f613f943.entry.js +0 -2
- /package/dist/lime-elements/{p-854343a1.entry.js.map → p-27d64a5a.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-acd589ef.entry.js.map → p-b03c1b71.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-85a770a4.entry.js.map → p-b51fd0c7.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-e53b7ccf.entry.js.map → p-b89d2cc3.entry.js.map} +0 -0
- /package/dist/lime-elements/{p-93c6d561.js.map → p-e03dfe70.js.map} +0 -0
- /package/dist/lime-elements/{p-bbe3ce51.entry.js.map → p-fdae60a1.entry.js.map} +0 -0
|
@@ -1,2095 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
-
|
|
5
|
-
const index = require('./index-38eb64b5.js');
|
|
6
|
-
const keycodes = require('./keycodes-3949f425.js');
|
|
7
|
-
const translations = require('./translations-a384b596.js');
|
|
8
|
-
const linkHelper = require('./link-helper-b7e6c8df.js');
|
|
9
|
-
const getIconProps = require('./get-icon-props-d74b10c9.js');
|
|
10
|
-
const component$2 = require('./component-37425b99.js');
|
|
11
|
-
const isEqual = require('./isEqual-d2a13a24.js');
|
|
12
|
-
const component = require('./component-b37fd9bc.js');
|
|
13
|
-
const component$1 = require('./component-a4eb183b.js');
|
|
14
|
-
const keyboard = require('./keyboard-9477d3a8.js');
|
|
15
|
-
require('./ponyfill-98ca4766.js');
|
|
16
|
-
require('./component-55b926ef.js');
|
|
17
|
-
require('./eq-9a943b00.js');
|
|
18
|
-
require('./isObject-e28b7997.js');
|
|
19
|
-
require('./_getNative-60328036.js');
|
|
20
|
-
require('./isArray-d188a04f.js');
|
|
21
|
-
require('./isObjectLike-3e3f0cba.js');
|
|
22
|
-
require('./isArrayLike-ac53bdac.js');
|
|
23
|
-
|
|
24
|
-
/**
|
|
25
|
-
* @license
|
|
26
|
-
* Copyright 2020 Google Inc.
|
|
27
|
-
*
|
|
28
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
29
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
30
|
-
* in the Software without restriction, including without limitation the rights
|
|
31
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
32
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
33
|
-
* furnished to do so, subject to the following conditions:
|
|
34
|
-
*
|
|
35
|
-
* The above copyright notice and this permission notice shall be included in
|
|
36
|
-
* all copies or substantial portions of the Software.
|
|
37
|
-
*
|
|
38
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
39
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
40
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
41
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
42
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
43
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
44
|
-
* THE SOFTWARE.
|
|
45
|
-
*/
|
|
46
|
-
var InteractionTrigger;
|
|
47
|
-
(function (InteractionTrigger) {
|
|
48
|
-
InteractionTrigger[InteractionTrigger["UNSPECIFIED"] = 0] = "UNSPECIFIED";
|
|
49
|
-
InteractionTrigger[InteractionTrigger["CLICK"] = 1] = "CLICK";
|
|
50
|
-
InteractionTrigger[InteractionTrigger["BACKSPACE_KEY"] = 2] = "BACKSPACE_KEY";
|
|
51
|
-
InteractionTrigger[InteractionTrigger["DELETE_KEY"] = 3] = "DELETE_KEY";
|
|
52
|
-
InteractionTrigger[InteractionTrigger["SPACEBAR_KEY"] = 4] = "SPACEBAR_KEY";
|
|
53
|
-
InteractionTrigger[InteractionTrigger["ENTER_KEY"] = 5] = "ENTER_KEY";
|
|
54
|
-
})(InteractionTrigger || (InteractionTrigger = {}));
|
|
55
|
-
var strings$2 = {
|
|
56
|
-
ARIA_HIDDEN: 'aria-hidden',
|
|
57
|
-
INTERACTION_EVENT: 'MDCChipTrailingAction:interaction',
|
|
58
|
-
NAVIGATION_EVENT: 'MDCChipTrailingAction:navigation',
|
|
59
|
-
TAB_INDEX: 'tabindex',
|
|
60
|
-
};
|
|
61
|
-
|
|
62
|
-
/**
|
|
63
|
-
* @license
|
|
64
|
-
* Copyright 2020 Google Inc.
|
|
65
|
-
*
|
|
66
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
67
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
68
|
-
* in the Software without restriction, including without limitation the rights
|
|
69
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
70
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
71
|
-
* furnished to do so, subject to the following conditions:
|
|
72
|
-
*
|
|
73
|
-
* The above copyright notice and this permission notice shall be included in
|
|
74
|
-
* all copies or substantial portions of the Software.
|
|
75
|
-
*
|
|
76
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
77
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
78
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
79
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
80
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
81
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
82
|
-
* THE SOFTWARE.
|
|
83
|
-
*/
|
|
84
|
-
var MDCChipTrailingActionFoundation = /** @class */ (function (_super) {
|
|
85
|
-
component.__extends(MDCChipTrailingActionFoundation, _super);
|
|
86
|
-
function MDCChipTrailingActionFoundation(adapter) {
|
|
87
|
-
return _super.call(this, component.__assign(component.__assign({}, MDCChipTrailingActionFoundation.defaultAdapter), adapter)) || this;
|
|
88
|
-
}
|
|
89
|
-
Object.defineProperty(MDCChipTrailingActionFoundation, "strings", {
|
|
90
|
-
get: function () {
|
|
91
|
-
return strings$2;
|
|
92
|
-
},
|
|
93
|
-
enumerable: false,
|
|
94
|
-
configurable: true
|
|
95
|
-
});
|
|
96
|
-
Object.defineProperty(MDCChipTrailingActionFoundation, "defaultAdapter", {
|
|
97
|
-
get: function () {
|
|
98
|
-
return {
|
|
99
|
-
focus: function () { return undefined; },
|
|
100
|
-
getAttribute: function () { return null; },
|
|
101
|
-
setAttribute: function () { return undefined; },
|
|
102
|
-
notifyInteraction: function () { return undefined; },
|
|
103
|
-
notifyNavigation: function () { return undefined; },
|
|
104
|
-
};
|
|
105
|
-
},
|
|
106
|
-
enumerable: false,
|
|
107
|
-
configurable: true
|
|
108
|
-
});
|
|
109
|
-
MDCChipTrailingActionFoundation.prototype.handleClick = function (evt) {
|
|
110
|
-
evt.stopPropagation();
|
|
111
|
-
this.adapter.notifyInteraction(InteractionTrigger.CLICK);
|
|
112
|
-
};
|
|
113
|
-
MDCChipTrailingActionFoundation.prototype.handleKeydown = function (evt) {
|
|
114
|
-
evt.stopPropagation();
|
|
115
|
-
var key = keyboard.normalizeKey(evt);
|
|
116
|
-
if (this.shouldNotifyInteractionFromKey(key)) {
|
|
117
|
-
var trigger = this.getTriggerFromKey(key);
|
|
118
|
-
this.adapter.notifyInteraction(trigger);
|
|
119
|
-
return;
|
|
120
|
-
}
|
|
121
|
-
if (keyboard.isNavigationEvent(evt)) {
|
|
122
|
-
this.adapter.notifyNavigation(key);
|
|
123
|
-
return;
|
|
124
|
-
}
|
|
125
|
-
};
|
|
126
|
-
MDCChipTrailingActionFoundation.prototype.removeFocus = function () {
|
|
127
|
-
this.adapter.setAttribute(strings$2.TAB_INDEX, '-1');
|
|
128
|
-
};
|
|
129
|
-
MDCChipTrailingActionFoundation.prototype.focus = function () {
|
|
130
|
-
this.adapter.setAttribute(strings$2.TAB_INDEX, '0');
|
|
131
|
-
this.adapter.focus();
|
|
132
|
-
};
|
|
133
|
-
MDCChipTrailingActionFoundation.prototype.isNavigable = function () {
|
|
134
|
-
return this.adapter.getAttribute(strings$2.ARIA_HIDDEN) !== 'true';
|
|
135
|
-
};
|
|
136
|
-
MDCChipTrailingActionFoundation.prototype.shouldNotifyInteractionFromKey = function (key) {
|
|
137
|
-
var isFromActionKey = key === keyboard.KEY.ENTER || key === keyboard.KEY.SPACEBAR;
|
|
138
|
-
var isFromDeleteKey = key === keyboard.KEY.BACKSPACE || key === keyboard.KEY.DELETE;
|
|
139
|
-
return isFromActionKey || isFromDeleteKey;
|
|
140
|
-
};
|
|
141
|
-
MDCChipTrailingActionFoundation.prototype.getTriggerFromKey = function (key) {
|
|
142
|
-
if (key === keyboard.KEY.SPACEBAR) {
|
|
143
|
-
return InteractionTrigger.SPACEBAR_KEY;
|
|
144
|
-
}
|
|
145
|
-
if (key === keyboard.KEY.ENTER) {
|
|
146
|
-
return InteractionTrigger.ENTER_KEY;
|
|
147
|
-
}
|
|
148
|
-
if (key === keyboard.KEY.DELETE) {
|
|
149
|
-
return InteractionTrigger.DELETE_KEY;
|
|
150
|
-
}
|
|
151
|
-
if (key === keyboard.KEY.BACKSPACE) {
|
|
152
|
-
return InteractionTrigger.BACKSPACE_KEY;
|
|
153
|
-
}
|
|
154
|
-
// Default case, should never be returned
|
|
155
|
-
return InteractionTrigger.UNSPECIFIED;
|
|
156
|
-
};
|
|
157
|
-
return MDCChipTrailingActionFoundation;
|
|
158
|
-
}(component.MDCFoundation));
|
|
159
|
-
|
|
160
|
-
/**
|
|
161
|
-
* @license
|
|
162
|
-
* Copyright 2020 Google Inc.
|
|
163
|
-
*
|
|
164
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
165
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
166
|
-
* in the Software without restriction, including without limitation the rights
|
|
167
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
168
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
169
|
-
* furnished to do so, subject to the following conditions:
|
|
170
|
-
*
|
|
171
|
-
* The above copyright notice and this permission notice shall be included in
|
|
172
|
-
* all copies or substantial portions of the Software.
|
|
173
|
-
*
|
|
174
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
175
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
176
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
177
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
178
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
179
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
180
|
-
* THE SOFTWARE.
|
|
181
|
-
*/
|
|
182
|
-
var MDCChipTrailingAction = /** @class */ (function (_super) {
|
|
183
|
-
component.__extends(MDCChipTrailingAction, _super);
|
|
184
|
-
function MDCChipTrailingAction() {
|
|
185
|
-
return _super !== null && _super.apply(this, arguments) || this;
|
|
186
|
-
}
|
|
187
|
-
Object.defineProperty(MDCChipTrailingAction.prototype, "ripple", {
|
|
188
|
-
get: function () {
|
|
189
|
-
return this.rippleSurface;
|
|
190
|
-
},
|
|
191
|
-
enumerable: false,
|
|
192
|
-
configurable: true
|
|
193
|
-
});
|
|
194
|
-
MDCChipTrailingAction.attachTo = function (root) {
|
|
195
|
-
return new MDCChipTrailingAction(root);
|
|
196
|
-
};
|
|
197
|
-
MDCChipTrailingAction.prototype.initialize = function (rippleFactory) {
|
|
198
|
-
if (rippleFactory === void 0) { rippleFactory = function (el, foundation) {
|
|
199
|
-
return new component$1.MDCRipple(el, foundation);
|
|
200
|
-
}; }
|
|
201
|
-
// DO NOT INLINE this variable. For backward compatibility, foundations take
|
|
202
|
-
// a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
|
|
203
|
-
// methods, we need a separate, strongly typed adapter variable.
|
|
204
|
-
var rippleAdapter = component$1.MDCRipple.createAdapter(this);
|
|
205
|
-
this.rippleSurface =
|
|
206
|
-
rippleFactory(this.root, new component$1.MDCRippleFoundation(rippleAdapter));
|
|
207
|
-
};
|
|
208
|
-
MDCChipTrailingAction.prototype.initialSyncWithDOM = function () {
|
|
209
|
-
var _this = this;
|
|
210
|
-
this.handleClick = function (evt) {
|
|
211
|
-
_this.foundation.handleClick(evt);
|
|
212
|
-
};
|
|
213
|
-
this.handleKeydown = function (evt) {
|
|
214
|
-
_this.foundation.handleKeydown(evt);
|
|
215
|
-
};
|
|
216
|
-
this.listen('click', this.handleClick);
|
|
217
|
-
this.listen('keydown', this.handleKeydown);
|
|
218
|
-
};
|
|
219
|
-
MDCChipTrailingAction.prototype.destroy = function () {
|
|
220
|
-
this.rippleSurface.destroy();
|
|
221
|
-
this.unlisten('click', this.handleClick);
|
|
222
|
-
this.unlisten('keydown', this.handleKeydown);
|
|
223
|
-
_super.prototype.destroy.call(this);
|
|
224
|
-
};
|
|
225
|
-
MDCChipTrailingAction.prototype.getDefaultFoundation = function () {
|
|
226
|
-
var _this = this;
|
|
227
|
-
// DO NOT INLINE this variable. For backward compatibility, foundations take
|
|
228
|
-
// a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
|
|
229
|
-
// methods, we need a separate, strongly typed adapter variable.
|
|
230
|
-
var adapter = {
|
|
231
|
-
focus: function () {
|
|
232
|
-
// TODO(b/157231863): Migate MDCComponent#root to HTMLElement
|
|
233
|
-
_this.root.focus();
|
|
234
|
-
},
|
|
235
|
-
getAttribute: function (attr) { return _this.root.getAttribute(attr); },
|
|
236
|
-
notifyInteraction: function (trigger) {
|
|
237
|
-
return _this.emit(strings$2.INTERACTION_EVENT, { trigger: trigger }, true /* shouldBubble */);
|
|
238
|
-
},
|
|
239
|
-
notifyNavigation: function (key) {
|
|
240
|
-
_this.emit(strings$2.NAVIGATION_EVENT, { key: key }, true /* shouldBubble */);
|
|
241
|
-
},
|
|
242
|
-
setAttribute: function (attr, value) {
|
|
243
|
-
_this.root.setAttribute(attr, value);
|
|
244
|
-
},
|
|
245
|
-
};
|
|
246
|
-
return new MDCChipTrailingActionFoundation(adapter);
|
|
247
|
-
};
|
|
248
|
-
MDCChipTrailingAction.prototype.isNavigable = function () {
|
|
249
|
-
return this.foundation.isNavigable();
|
|
250
|
-
};
|
|
251
|
-
MDCChipTrailingAction.prototype.focus = function () {
|
|
252
|
-
this.foundation.focus();
|
|
253
|
-
};
|
|
254
|
-
MDCChipTrailingAction.prototype.removeFocus = function () {
|
|
255
|
-
this.foundation.removeFocus();
|
|
256
|
-
};
|
|
257
|
-
return MDCChipTrailingAction;
|
|
258
|
-
}(component.MDCComponent));
|
|
259
|
-
|
|
260
|
-
/**
|
|
261
|
-
* @license
|
|
262
|
-
* Copyright 2016 Google Inc.
|
|
263
|
-
*
|
|
264
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
265
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
266
|
-
* in the Software without restriction, including without limitation the rights
|
|
267
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
268
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
269
|
-
* furnished to do so, subject to the following conditions:
|
|
270
|
-
*
|
|
271
|
-
* The above copyright notice and this permission notice shall be included in
|
|
272
|
-
* all copies or substantial portions of the Software.
|
|
273
|
-
*
|
|
274
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
275
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
276
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
277
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
278
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
279
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
280
|
-
* THE SOFTWARE.
|
|
281
|
-
*/
|
|
282
|
-
var Direction;
|
|
283
|
-
(function (Direction) {
|
|
284
|
-
Direction["LEFT"] = "left";
|
|
285
|
-
Direction["RIGHT"] = "right";
|
|
286
|
-
})(Direction || (Direction = {}));
|
|
287
|
-
var EventSource;
|
|
288
|
-
(function (EventSource) {
|
|
289
|
-
EventSource["PRIMARY"] = "primary";
|
|
290
|
-
EventSource["TRAILING"] = "trailing";
|
|
291
|
-
EventSource["NONE"] = "none";
|
|
292
|
-
})(EventSource || (EventSource = {}));
|
|
293
|
-
var strings$1 = {
|
|
294
|
-
ADDED_ANNOUNCEMENT_ATTRIBUTE: 'data-mdc-chip-added-announcement',
|
|
295
|
-
ARIA_CHECKED: 'aria-checked',
|
|
296
|
-
ARROW_DOWN_KEY: 'ArrowDown',
|
|
297
|
-
ARROW_LEFT_KEY: 'ArrowLeft',
|
|
298
|
-
ARROW_RIGHT_KEY: 'ArrowRight',
|
|
299
|
-
ARROW_UP_KEY: 'ArrowUp',
|
|
300
|
-
BACKSPACE_KEY: 'Backspace',
|
|
301
|
-
CHECKMARK_SELECTOR: '.mdc-chip__checkmark',
|
|
302
|
-
DELETE_KEY: 'Delete',
|
|
303
|
-
END_KEY: 'End',
|
|
304
|
-
ENTER_KEY: 'Enter',
|
|
305
|
-
ENTRY_ANIMATION_NAME: 'mdc-chip-entry',
|
|
306
|
-
HOME_KEY: 'Home',
|
|
307
|
-
IE_ARROW_DOWN_KEY: 'Down',
|
|
308
|
-
IE_ARROW_LEFT_KEY: 'Left',
|
|
309
|
-
IE_ARROW_RIGHT_KEY: 'Right',
|
|
310
|
-
IE_ARROW_UP_KEY: 'Up',
|
|
311
|
-
IE_DELETE_KEY: 'Del',
|
|
312
|
-
INTERACTION_EVENT: 'MDCChip:interaction',
|
|
313
|
-
LEADING_ICON_SELECTOR: '.mdc-chip__icon--leading',
|
|
314
|
-
NAVIGATION_EVENT: 'MDCChip:navigation',
|
|
315
|
-
PRIMARY_ACTION_SELECTOR: '.mdc-chip__primary-action',
|
|
316
|
-
REMOVED_ANNOUNCEMENT_ATTRIBUTE: 'data-mdc-chip-removed-announcement',
|
|
317
|
-
REMOVAL_EVENT: 'MDCChip:removal',
|
|
318
|
-
SELECTION_EVENT: 'MDCChip:selection',
|
|
319
|
-
SPACEBAR_KEY: ' ',
|
|
320
|
-
TAB_INDEX: 'tabindex',
|
|
321
|
-
TRAILING_ACTION_SELECTOR: '.mdc-chip-trailing-action',
|
|
322
|
-
TRAILING_ICON_INTERACTION_EVENT: 'MDCChip:trailingIconInteraction',
|
|
323
|
-
TRAILING_ICON_SELECTOR: '.mdc-chip__icon--trailing',
|
|
324
|
-
};
|
|
325
|
-
var cssClasses$1 = {
|
|
326
|
-
CHECKMARK: 'mdc-chip__checkmark',
|
|
327
|
-
CHIP_EXIT: 'mdc-chip--exit',
|
|
328
|
-
DELETABLE: 'mdc-chip--deletable',
|
|
329
|
-
EDITABLE: 'mdc-chip--editable',
|
|
330
|
-
EDITING: 'mdc-chip--editing',
|
|
331
|
-
HIDDEN_LEADING_ICON: 'mdc-chip__icon--leading-hidden',
|
|
332
|
-
LEADING_ICON: 'mdc-chip__icon--leading',
|
|
333
|
-
PRIMARY_ACTION: 'mdc-chip__primary-action',
|
|
334
|
-
PRIMARY_ACTION_FOCUSED: 'mdc-chip--primary-action-focused',
|
|
335
|
-
SELECTED: 'mdc-chip--selected',
|
|
336
|
-
TEXT: 'mdc-chip__text',
|
|
337
|
-
TRAILING_ACTION: 'mdc-chip__trailing-action',
|
|
338
|
-
TRAILING_ICON: 'mdc-chip__icon--trailing',
|
|
339
|
-
};
|
|
340
|
-
var navigationKeys = new Set();
|
|
341
|
-
// IE11 has no support for new Set with iterable so we need to initialize this by hand
|
|
342
|
-
navigationKeys.add(strings$1.ARROW_LEFT_KEY);
|
|
343
|
-
navigationKeys.add(strings$1.ARROW_RIGHT_KEY);
|
|
344
|
-
navigationKeys.add(strings$1.ARROW_DOWN_KEY);
|
|
345
|
-
navigationKeys.add(strings$1.ARROW_UP_KEY);
|
|
346
|
-
navigationKeys.add(strings$1.END_KEY);
|
|
347
|
-
navigationKeys.add(strings$1.HOME_KEY);
|
|
348
|
-
navigationKeys.add(strings$1.IE_ARROW_LEFT_KEY);
|
|
349
|
-
navigationKeys.add(strings$1.IE_ARROW_RIGHT_KEY);
|
|
350
|
-
navigationKeys.add(strings$1.IE_ARROW_DOWN_KEY);
|
|
351
|
-
navigationKeys.add(strings$1.IE_ARROW_UP_KEY);
|
|
352
|
-
var jumpChipKeys = new Set();
|
|
353
|
-
// IE11 has no support for new Set with iterable so we need to initialize this by hand
|
|
354
|
-
jumpChipKeys.add(strings$1.ARROW_UP_KEY);
|
|
355
|
-
jumpChipKeys.add(strings$1.ARROW_DOWN_KEY);
|
|
356
|
-
jumpChipKeys.add(strings$1.HOME_KEY);
|
|
357
|
-
jumpChipKeys.add(strings$1.END_KEY);
|
|
358
|
-
jumpChipKeys.add(strings$1.IE_ARROW_UP_KEY);
|
|
359
|
-
jumpChipKeys.add(strings$1.IE_ARROW_DOWN_KEY);
|
|
360
|
-
|
|
361
|
-
/**
|
|
362
|
-
* @license
|
|
363
|
-
* Copyright 2016 Google Inc.
|
|
364
|
-
*
|
|
365
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
366
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
367
|
-
* in the Software without restriction, including without limitation the rights
|
|
368
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
369
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
370
|
-
* furnished to do so, subject to the following conditions:
|
|
371
|
-
*
|
|
372
|
-
* The above copyright notice and this permission notice shall be included in
|
|
373
|
-
* all copies or substantial portions of the Software.
|
|
374
|
-
*
|
|
375
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
376
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
377
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
378
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
379
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
380
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
381
|
-
* THE SOFTWARE.
|
|
382
|
-
*/
|
|
383
|
-
var emptyClientRect = {
|
|
384
|
-
bottom: 0,
|
|
385
|
-
height: 0,
|
|
386
|
-
left: 0,
|
|
387
|
-
right: 0,
|
|
388
|
-
top: 0,
|
|
389
|
-
width: 0,
|
|
390
|
-
};
|
|
391
|
-
var FocusBehavior;
|
|
392
|
-
(function (FocusBehavior) {
|
|
393
|
-
FocusBehavior[FocusBehavior["SHOULD_FOCUS"] = 0] = "SHOULD_FOCUS";
|
|
394
|
-
FocusBehavior[FocusBehavior["SHOULD_NOT_FOCUS"] = 1] = "SHOULD_NOT_FOCUS";
|
|
395
|
-
})(FocusBehavior || (FocusBehavior = {}));
|
|
396
|
-
var MDCChipFoundation = /** @class */ (function (_super) {
|
|
397
|
-
component.__extends(MDCChipFoundation, _super);
|
|
398
|
-
function MDCChipFoundation(adapter) {
|
|
399
|
-
var _this = _super.call(this, component.__assign(component.__assign({}, MDCChipFoundation.defaultAdapter), adapter)) || this;
|
|
400
|
-
/** Whether a trailing icon click should immediately trigger exit/removal of the chip. */
|
|
401
|
-
_this.shouldRemoveOnTrailingIconClick = true;
|
|
402
|
-
/**
|
|
403
|
-
* Whether the primary action should receive focus on click. Should only be
|
|
404
|
-
* set to true for clients who programmatically give focus to a different
|
|
405
|
-
* element on the page when a chip is clicked (like a menu).
|
|
406
|
-
*/
|
|
407
|
-
_this.shouldFocusPrimaryActionOnClick = true;
|
|
408
|
-
return _this;
|
|
409
|
-
}
|
|
410
|
-
Object.defineProperty(MDCChipFoundation, "strings", {
|
|
411
|
-
get: function () {
|
|
412
|
-
return strings$1;
|
|
413
|
-
},
|
|
414
|
-
enumerable: false,
|
|
415
|
-
configurable: true
|
|
416
|
-
});
|
|
417
|
-
Object.defineProperty(MDCChipFoundation, "cssClasses", {
|
|
418
|
-
get: function () {
|
|
419
|
-
return cssClasses$1;
|
|
420
|
-
},
|
|
421
|
-
enumerable: false,
|
|
422
|
-
configurable: true
|
|
423
|
-
});
|
|
424
|
-
Object.defineProperty(MDCChipFoundation, "defaultAdapter", {
|
|
425
|
-
get: function () {
|
|
426
|
-
return {
|
|
427
|
-
addClass: function () { return undefined; },
|
|
428
|
-
addClassToLeadingIcon: function () { return undefined; },
|
|
429
|
-
eventTargetHasClass: function () { return false; },
|
|
430
|
-
focusPrimaryAction: function () { return undefined; },
|
|
431
|
-
focusTrailingAction: function () { return undefined; },
|
|
432
|
-
getAttribute: function () { return null; },
|
|
433
|
-
getCheckmarkBoundingClientRect: function () { return emptyClientRect; },
|
|
434
|
-
getComputedStyleValue: function () { return ''; },
|
|
435
|
-
getRootBoundingClientRect: function () { return emptyClientRect; },
|
|
436
|
-
hasClass: function () { return false; },
|
|
437
|
-
hasLeadingIcon: function () { return false; },
|
|
438
|
-
isRTL: function () { return false; },
|
|
439
|
-
isTrailingActionNavigable: function () { return false; },
|
|
440
|
-
notifyEditFinish: function () { return undefined; },
|
|
441
|
-
notifyEditStart: function () { return undefined; },
|
|
442
|
-
notifyInteraction: function () { return undefined; },
|
|
443
|
-
notifyNavigation: function () { return undefined; },
|
|
444
|
-
notifyRemoval: function () { return undefined; },
|
|
445
|
-
notifySelection: function () { return undefined; },
|
|
446
|
-
notifyTrailingIconInteraction: function () { return undefined; },
|
|
447
|
-
removeClass: function () { return undefined; },
|
|
448
|
-
removeClassFromLeadingIcon: function () { return undefined; },
|
|
449
|
-
removeTrailingActionFocus: function () { return undefined; },
|
|
450
|
-
setPrimaryActionAttr: function () { return undefined; },
|
|
451
|
-
setStyleProperty: function () { return undefined; },
|
|
452
|
-
};
|
|
453
|
-
},
|
|
454
|
-
enumerable: false,
|
|
455
|
-
configurable: true
|
|
456
|
-
});
|
|
457
|
-
MDCChipFoundation.prototype.isSelected = function () {
|
|
458
|
-
return this.adapter.hasClass(cssClasses$1.SELECTED);
|
|
459
|
-
};
|
|
460
|
-
MDCChipFoundation.prototype.isEditable = function () {
|
|
461
|
-
return this.adapter.hasClass(cssClasses$1.EDITABLE);
|
|
462
|
-
};
|
|
463
|
-
MDCChipFoundation.prototype.isEditing = function () {
|
|
464
|
-
return this.adapter.hasClass(cssClasses$1.EDITING);
|
|
465
|
-
};
|
|
466
|
-
MDCChipFoundation.prototype.setSelected = function (selected) {
|
|
467
|
-
this.setSelectedImpl(selected);
|
|
468
|
-
this.notifySelection(selected);
|
|
469
|
-
};
|
|
470
|
-
MDCChipFoundation.prototype.setSelectedFromChipSet = function (selected, shouldNotifyClients) {
|
|
471
|
-
this.setSelectedImpl(selected);
|
|
472
|
-
if (shouldNotifyClients) {
|
|
473
|
-
this.notifyIgnoredSelection(selected);
|
|
474
|
-
}
|
|
475
|
-
};
|
|
476
|
-
MDCChipFoundation.prototype.getShouldRemoveOnTrailingIconClick = function () {
|
|
477
|
-
return this.shouldRemoveOnTrailingIconClick;
|
|
478
|
-
};
|
|
479
|
-
MDCChipFoundation.prototype.setShouldRemoveOnTrailingIconClick = function (shouldRemove) {
|
|
480
|
-
this.shouldRemoveOnTrailingIconClick = shouldRemove;
|
|
481
|
-
};
|
|
482
|
-
MDCChipFoundation.prototype.setShouldFocusPrimaryActionOnClick = function (shouldFocus) {
|
|
483
|
-
this.shouldFocusPrimaryActionOnClick = shouldFocus;
|
|
484
|
-
};
|
|
485
|
-
MDCChipFoundation.prototype.getDimensions = function () {
|
|
486
|
-
var _this = this;
|
|
487
|
-
var getRootRect = function () { return _this.adapter.getRootBoundingClientRect(); };
|
|
488
|
-
var getCheckmarkRect = function () {
|
|
489
|
-
return _this.adapter.getCheckmarkBoundingClientRect();
|
|
490
|
-
};
|
|
491
|
-
// When a chip has a checkmark and not a leading icon, the bounding rect changes in size depending on the current
|
|
492
|
-
// size of the checkmark.
|
|
493
|
-
if (!this.adapter.hasLeadingIcon()) {
|
|
494
|
-
var checkmarkRect = getCheckmarkRect();
|
|
495
|
-
if (checkmarkRect) {
|
|
496
|
-
var rootRect = getRootRect();
|
|
497
|
-
// Checkmark is a square, meaning the client rect's width and height are identical once the animation completes.
|
|
498
|
-
// However, the checkbox is initially hidden by setting the width to 0.
|
|
499
|
-
// To account for an initial width of 0, we use the checkbox's height instead (which equals the end-state width)
|
|
500
|
-
// when adding it to the root client rect's width.
|
|
501
|
-
return {
|
|
502
|
-
bottom: rootRect.bottom,
|
|
503
|
-
height: rootRect.height,
|
|
504
|
-
left: rootRect.left,
|
|
505
|
-
right: rootRect.right,
|
|
506
|
-
top: rootRect.top,
|
|
507
|
-
width: rootRect.width + checkmarkRect.height,
|
|
508
|
-
};
|
|
509
|
-
}
|
|
510
|
-
}
|
|
511
|
-
return getRootRect();
|
|
512
|
-
};
|
|
513
|
-
/**
|
|
514
|
-
* Begins the exit animation which leads to removal of the chip.
|
|
515
|
-
*/
|
|
516
|
-
MDCChipFoundation.prototype.beginExit = function () {
|
|
517
|
-
this.adapter.addClass(cssClasses$1.CHIP_EXIT);
|
|
518
|
-
};
|
|
519
|
-
MDCChipFoundation.prototype.handleClick = function () {
|
|
520
|
-
this.adapter.notifyInteraction();
|
|
521
|
-
this.setPrimaryActionFocusable(this.getFocusBehavior());
|
|
522
|
-
};
|
|
523
|
-
MDCChipFoundation.prototype.handleDoubleClick = function () {
|
|
524
|
-
if (this.isEditable()) {
|
|
525
|
-
this.startEditing();
|
|
526
|
-
}
|
|
527
|
-
};
|
|
528
|
-
/**
|
|
529
|
-
* Handles a transition end event on the root element.
|
|
530
|
-
*/
|
|
531
|
-
MDCChipFoundation.prototype.handleTransitionEnd = function (evt) {
|
|
532
|
-
var _this = this;
|
|
533
|
-
// Handle transition end event on the chip when it is about to be removed.
|
|
534
|
-
var shouldHandle = this.adapter.eventTargetHasClass(evt.target, cssClasses$1.CHIP_EXIT);
|
|
535
|
-
var widthIsAnimating = evt.propertyName === 'width';
|
|
536
|
-
var opacityIsAnimating = evt.propertyName === 'opacity';
|
|
537
|
-
if (shouldHandle && opacityIsAnimating) {
|
|
538
|
-
// See: https://css-tricks.com/using-css-transitions-auto-dimensions/#article-header-id-5
|
|
539
|
-
var chipWidth_1 = this.adapter.getComputedStyleValue('width');
|
|
540
|
-
// On the next frame (once we get the computed width), explicitly set the chip's width
|
|
541
|
-
// to its current pixel width, so we aren't transitioning out of 'auto'.
|
|
542
|
-
requestAnimationFrame(function () {
|
|
543
|
-
_this.adapter.setStyleProperty('width', chipWidth_1);
|
|
544
|
-
// To mitigate jitter, start transitioning padding and margin before width.
|
|
545
|
-
_this.adapter.setStyleProperty('padding', '0');
|
|
546
|
-
_this.adapter.setStyleProperty('margin', '0');
|
|
547
|
-
// On the next frame (once width is explicitly set), transition width to 0.
|
|
548
|
-
requestAnimationFrame(function () {
|
|
549
|
-
_this.adapter.setStyleProperty('width', '0');
|
|
550
|
-
});
|
|
551
|
-
});
|
|
552
|
-
return;
|
|
553
|
-
}
|
|
554
|
-
if (shouldHandle && widthIsAnimating) {
|
|
555
|
-
this.removeFocus();
|
|
556
|
-
var removedAnnouncement = this.adapter.getAttribute(strings$1.REMOVED_ANNOUNCEMENT_ATTRIBUTE);
|
|
557
|
-
this.adapter.notifyRemoval(removedAnnouncement);
|
|
558
|
-
}
|
|
559
|
-
// Handle a transition end event on the leading icon or checkmark, since the transition end event bubbles.
|
|
560
|
-
if (!opacityIsAnimating) {
|
|
561
|
-
return;
|
|
562
|
-
}
|
|
563
|
-
var shouldHideLeadingIcon = this.adapter.eventTargetHasClass(evt.target, cssClasses$1.LEADING_ICON) &&
|
|
564
|
-
this.adapter.hasClass(cssClasses$1.SELECTED);
|
|
565
|
-
var shouldShowLeadingIcon = this.adapter.eventTargetHasClass(evt.target, cssClasses$1.CHECKMARK) &&
|
|
566
|
-
!this.adapter.hasClass(cssClasses$1.SELECTED);
|
|
567
|
-
if (shouldHideLeadingIcon) {
|
|
568
|
-
this.adapter.addClassToLeadingIcon(cssClasses$1.HIDDEN_LEADING_ICON);
|
|
569
|
-
return;
|
|
570
|
-
}
|
|
571
|
-
if (shouldShowLeadingIcon) {
|
|
572
|
-
this.adapter.removeClassFromLeadingIcon(cssClasses$1.HIDDEN_LEADING_ICON);
|
|
573
|
-
return;
|
|
574
|
-
}
|
|
575
|
-
};
|
|
576
|
-
MDCChipFoundation.prototype.handleFocusIn = function (evt) {
|
|
577
|
-
// Early exit if the event doesn't come from the primary action
|
|
578
|
-
if (!this.eventFromPrimaryAction(evt)) {
|
|
579
|
-
return;
|
|
580
|
-
}
|
|
581
|
-
this.adapter.addClass(cssClasses$1.PRIMARY_ACTION_FOCUSED);
|
|
582
|
-
};
|
|
583
|
-
MDCChipFoundation.prototype.handleFocusOut = function (evt) {
|
|
584
|
-
// Early exit if the event doesn't come from the primary action
|
|
585
|
-
if (!this.eventFromPrimaryAction(evt)) {
|
|
586
|
-
return;
|
|
587
|
-
}
|
|
588
|
-
if (this.isEditing()) {
|
|
589
|
-
this.finishEditing();
|
|
590
|
-
}
|
|
591
|
-
this.adapter.removeClass(cssClasses$1.PRIMARY_ACTION_FOCUSED);
|
|
592
|
-
};
|
|
593
|
-
/**
|
|
594
|
-
* Handles an interaction event on the trailing icon element. This is used to
|
|
595
|
-
* prevent the ripple from activating on interaction with the trailing icon.
|
|
596
|
-
*/
|
|
597
|
-
MDCChipFoundation.prototype.handleTrailingActionInteraction = function () {
|
|
598
|
-
this.adapter.notifyTrailingIconInteraction();
|
|
599
|
-
this.removeChip();
|
|
600
|
-
};
|
|
601
|
-
/**
|
|
602
|
-
* Handles a keydown event from the root element.
|
|
603
|
-
*/
|
|
604
|
-
MDCChipFoundation.prototype.handleKeydown = function (evt) {
|
|
605
|
-
if (this.isEditing()) {
|
|
606
|
-
if (this.shouldFinishEditing(evt)) {
|
|
607
|
-
evt.preventDefault();
|
|
608
|
-
this.finishEditing();
|
|
609
|
-
}
|
|
610
|
-
// When editing, the foundation should only handle key events that finish
|
|
611
|
-
// the editing process.
|
|
612
|
-
return;
|
|
613
|
-
}
|
|
614
|
-
if (this.isEditable()) {
|
|
615
|
-
if (this.shouldStartEditing(evt)) {
|
|
616
|
-
evt.preventDefault();
|
|
617
|
-
this.startEditing();
|
|
618
|
-
}
|
|
619
|
-
}
|
|
620
|
-
if (this.shouldNotifyInteraction(evt)) {
|
|
621
|
-
this.adapter.notifyInteraction();
|
|
622
|
-
this.setPrimaryActionFocusable(this.getFocusBehavior());
|
|
623
|
-
return;
|
|
624
|
-
}
|
|
625
|
-
if (this.isDeleteAction(evt)) {
|
|
626
|
-
evt.preventDefault();
|
|
627
|
-
this.removeChip();
|
|
628
|
-
return;
|
|
629
|
-
}
|
|
630
|
-
// Early exit if the key is not usable
|
|
631
|
-
if (!navigationKeys.has(evt.key)) {
|
|
632
|
-
return;
|
|
633
|
-
}
|
|
634
|
-
// Prevent default behavior for movement keys which could include scrolling
|
|
635
|
-
evt.preventDefault();
|
|
636
|
-
this.focusNextAction(evt.key, EventSource.PRIMARY);
|
|
637
|
-
};
|
|
638
|
-
MDCChipFoundation.prototype.handleTrailingActionNavigation = function (evt) {
|
|
639
|
-
this.focusNextAction(evt.detail.key, EventSource.TRAILING);
|
|
640
|
-
};
|
|
641
|
-
/**
|
|
642
|
-
* Called by the chip set to remove focus from the chip actions.
|
|
643
|
-
*/
|
|
644
|
-
MDCChipFoundation.prototype.removeFocus = function () {
|
|
645
|
-
this.adapter.setPrimaryActionAttr(strings$1.TAB_INDEX, '-1');
|
|
646
|
-
this.adapter.removeTrailingActionFocus();
|
|
647
|
-
};
|
|
648
|
-
/**
|
|
649
|
-
* Called by the chip set to focus the primary action.
|
|
650
|
-
*
|
|
651
|
-
*/
|
|
652
|
-
MDCChipFoundation.prototype.focusPrimaryAction = function () {
|
|
653
|
-
this.setPrimaryActionFocusable(FocusBehavior.SHOULD_FOCUS);
|
|
654
|
-
};
|
|
655
|
-
/**
|
|
656
|
-
* Called by the chip set to focus the trailing action (if present), otherwise
|
|
657
|
-
* gives focus to the trailing action.
|
|
658
|
-
*/
|
|
659
|
-
MDCChipFoundation.prototype.focusTrailingAction = function () {
|
|
660
|
-
var trailingActionIsNavigable = this.adapter.isTrailingActionNavigable();
|
|
661
|
-
if (trailingActionIsNavigable) {
|
|
662
|
-
this.adapter.setPrimaryActionAttr(strings$1.TAB_INDEX, '-1');
|
|
663
|
-
this.adapter.focusTrailingAction();
|
|
664
|
-
return;
|
|
665
|
-
}
|
|
666
|
-
this.focusPrimaryAction();
|
|
667
|
-
};
|
|
668
|
-
MDCChipFoundation.prototype.setPrimaryActionFocusable = function (focusBehavior) {
|
|
669
|
-
this.adapter.setPrimaryActionAttr(strings$1.TAB_INDEX, '0');
|
|
670
|
-
if (focusBehavior === FocusBehavior.SHOULD_FOCUS) {
|
|
671
|
-
this.adapter.focusPrimaryAction();
|
|
672
|
-
}
|
|
673
|
-
this.adapter.removeTrailingActionFocus();
|
|
674
|
-
};
|
|
675
|
-
MDCChipFoundation.prototype.getFocusBehavior = function () {
|
|
676
|
-
if (this.shouldFocusPrimaryActionOnClick) {
|
|
677
|
-
return FocusBehavior.SHOULD_FOCUS;
|
|
678
|
-
}
|
|
679
|
-
return FocusBehavior.SHOULD_NOT_FOCUS;
|
|
680
|
-
};
|
|
681
|
-
MDCChipFoundation.prototype.focusNextAction = function (key, source) {
|
|
682
|
-
var isTrailingActionNavigable = this.adapter.isTrailingActionNavigable();
|
|
683
|
-
var dir = this.getDirection(key);
|
|
684
|
-
// Early exit if the key should jump chips
|
|
685
|
-
if (jumpChipKeys.has(key) || !isTrailingActionNavigable) {
|
|
686
|
-
this.adapter.notifyNavigation(key, source);
|
|
687
|
-
return;
|
|
688
|
-
}
|
|
689
|
-
if (source === EventSource.PRIMARY && dir === Direction.RIGHT) {
|
|
690
|
-
this.focusTrailingAction();
|
|
691
|
-
return;
|
|
692
|
-
}
|
|
693
|
-
if (source === EventSource.TRAILING && dir === Direction.LEFT) {
|
|
694
|
-
this.focusPrimaryAction();
|
|
695
|
-
return;
|
|
696
|
-
}
|
|
697
|
-
this.adapter.notifyNavigation(key, EventSource.NONE);
|
|
698
|
-
};
|
|
699
|
-
MDCChipFoundation.prototype.getDirection = function (key) {
|
|
700
|
-
var isRTL = this.adapter.isRTL();
|
|
701
|
-
var isLeftKey = key === strings$1.ARROW_LEFT_KEY || key === strings$1.IE_ARROW_LEFT_KEY;
|
|
702
|
-
var isRightKey = key === strings$1.ARROW_RIGHT_KEY || key === strings$1.IE_ARROW_RIGHT_KEY;
|
|
703
|
-
if (!isRTL && isLeftKey || isRTL && isRightKey) {
|
|
704
|
-
return Direction.LEFT;
|
|
705
|
-
}
|
|
706
|
-
return Direction.RIGHT;
|
|
707
|
-
};
|
|
708
|
-
MDCChipFoundation.prototype.removeChip = function () {
|
|
709
|
-
if (this.shouldRemoveOnTrailingIconClick) {
|
|
710
|
-
this.beginExit();
|
|
711
|
-
}
|
|
712
|
-
};
|
|
713
|
-
MDCChipFoundation.prototype.shouldStartEditing = function (evt) {
|
|
714
|
-
return this.eventFromPrimaryAction(evt) && evt.key === strings$1.ENTER_KEY;
|
|
715
|
-
};
|
|
716
|
-
MDCChipFoundation.prototype.shouldFinishEditing = function (evt) {
|
|
717
|
-
return evt.key === strings$1.ENTER_KEY;
|
|
718
|
-
};
|
|
719
|
-
MDCChipFoundation.prototype.shouldNotifyInteraction = function (evt) {
|
|
720
|
-
return evt.key === strings$1.ENTER_KEY || evt.key === strings$1.SPACEBAR_KEY;
|
|
721
|
-
};
|
|
722
|
-
MDCChipFoundation.prototype.isDeleteAction = function (evt) {
|
|
723
|
-
var isDeletable = this.adapter.hasClass(cssClasses$1.DELETABLE);
|
|
724
|
-
return isDeletable &&
|
|
725
|
-
(evt.key === strings$1.BACKSPACE_KEY || evt.key === strings$1.DELETE_KEY ||
|
|
726
|
-
evt.key === strings$1.IE_DELETE_KEY);
|
|
727
|
-
};
|
|
728
|
-
MDCChipFoundation.prototype.setSelectedImpl = function (selected) {
|
|
729
|
-
if (selected) {
|
|
730
|
-
this.adapter.addClass(cssClasses$1.SELECTED);
|
|
731
|
-
this.adapter.setPrimaryActionAttr(strings$1.ARIA_CHECKED, 'true');
|
|
732
|
-
}
|
|
733
|
-
else {
|
|
734
|
-
this.adapter.removeClass(cssClasses$1.SELECTED);
|
|
735
|
-
this.adapter.setPrimaryActionAttr(strings$1.ARIA_CHECKED, 'false');
|
|
736
|
-
}
|
|
737
|
-
};
|
|
738
|
-
MDCChipFoundation.prototype.notifySelection = function (selected) {
|
|
739
|
-
this.adapter.notifySelection(selected, false);
|
|
740
|
-
};
|
|
741
|
-
MDCChipFoundation.prototype.notifyIgnoredSelection = function (selected) {
|
|
742
|
-
this.adapter.notifySelection(selected, true);
|
|
743
|
-
};
|
|
744
|
-
MDCChipFoundation.prototype.eventFromPrimaryAction = function (evt) {
|
|
745
|
-
return this.adapter.eventTargetHasClass(evt.target, cssClasses$1.PRIMARY_ACTION);
|
|
746
|
-
};
|
|
747
|
-
MDCChipFoundation.prototype.startEditing = function () {
|
|
748
|
-
this.adapter.addClass(cssClasses$1.EDITING);
|
|
749
|
-
this.adapter.notifyEditStart();
|
|
750
|
-
};
|
|
751
|
-
MDCChipFoundation.prototype.finishEditing = function () {
|
|
752
|
-
this.adapter.removeClass(cssClasses$1.EDITING);
|
|
753
|
-
this.adapter.notifyEditFinish();
|
|
754
|
-
};
|
|
755
|
-
return MDCChipFoundation;
|
|
756
|
-
}(component.MDCFoundation));
|
|
757
|
-
|
|
758
|
-
/**
|
|
759
|
-
* @license
|
|
760
|
-
* Copyright 2016 Google Inc.
|
|
761
|
-
*
|
|
762
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
763
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
764
|
-
* in the Software without restriction, including without limitation the rights
|
|
765
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
766
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
767
|
-
* furnished to do so, subject to the following conditions:
|
|
768
|
-
*
|
|
769
|
-
* The above copyright notice and this permission notice shall be included in
|
|
770
|
-
* all copies or substantial portions of the Software.
|
|
771
|
-
*
|
|
772
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
773
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
774
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
775
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
776
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
777
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
778
|
-
* THE SOFTWARE.
|
|
779
|
-
*/
|
|
780
|
-
var MDCChip = /** @class */ (function (_super) {
|
|
781
|
-
component.__extends(MDCChip, _super);
|
|
782
|
-
function MDCChip() {
|
|
783
|
-
return _super !== null && _super.apply(this, arguments) || this;
|
|
784
|
-
}
|
|
785
|
-
Object.defineProperty(MDCChip.prototype, "selected", {
|
|
786
|
-
/**
|
|
787
|
-
* @return Whether the chip is selected.
|
|
788
|
-
*/
|
|
789
|
-
get: function () {
|
|
790
|
-
return this.foundation.isSelected();
|
|
791
|
-
},
|
|
792
|
-
/**
|
|
793
|
-
* Sets selected state on the chip.
|
|
794
|
-
*/
|
|
795
|
-
set: function (selected) {
|
|
796
|
-
this.foundation.setSelected(selected);
|
|
797
|
-
},
|
|
798
|
-
enumerable: false,
|
|
799
|
-
configurable: true
|
|
800
|
-
});
|
|
801
|
-
Object.defineProperty(MDCChip.prototype, "shouldRemoveOnTrailingIconClick", {
|
|
802
|
-
/**
|
|
803
|
-
* @return Whether a trailing icon click should trigger exit/removal of the chip.
|
|
804
|
-
*/
|
|
805
|
-
get: function () {
|
|
806
|
-
return this.foundation.getShouldRemoveOnTrailingIconClick();
|
|
807
|
-
},
|
|
808
|
-
/**
|
|
809
|
-
* Sets whether a trailing icon click should trigger exit/removal of the chip.
|
|
810
|
-
*/
|
|
811
|
-
set: function (shouldRemove) {
|
|
812
|
-
this.foundation.setShouldRemoveOnTrailingIconClick(shouldRemove);
|
|
813
|
-
},
|
|
814
|
-
enumerable: false,
|
|
815
|
-
configurable: true
|
|
816
|
-
});
|
|
817
|
-
Object.defineProperty(MDCChip.prototype, "setShouldFocusPrimaryActionOnClick", {
|
|
818
|
-
/**
|
|
819
|
-
* Sets whether a clicking on the chip should focus the primary action.
|
|
820
|
-
*/
|
|
821
|
-
set: function (shouldFocus) {
|
|
822
|
-
this.foundation.setShouldFocusPrimaryActionOnClick(shouldFocus);
|
|
823
|
-
},
|
|
824
|
-
enumerable: false,
|
|
825
|
-
configurable: true
|
|
826
|
-
});
|
|
827
|
-
Object.defineProperty(MDCChip.prototype, "ripple", {
|
|
828
|
-
get: function () {
|
|
829
|
-
return this.rippleSurface;
|
|
830
|
-
},
|
|
831
|
-
enumerable: false,
|
|
832
|
-
configurable: true
|
|
833
|
-
});
|
|
834
|
-
Object.defineProperty(MDCChip.prototype, "id", {
|
|
835
|
-
get: function () {
|
|
836
|
-
return this.root.id;
|
|
837
|
-
},
|
|
838
|
-
enumerable: false,
|
|
839
|
-
configurable: true
|
|
840
|
-
});
|
|
841
|
-
MDCChip.attachTo = function (root) {
|
|
842
|
-
return new MDCChip(root);
|
|
843
|
-
};
|
|
844
|
-
MDCChip.prototype.initialize = function (rippleFactory, trailingActionFactory) {
|
|
845
|
-
var _this = this;
|
|
846
|
-
if (rippleFactory === void 0) { rippleFactory = function (el, foundation) { return new component$1.MDCRipple(el, foundation); }; }
|
|
847
|
-
if (trailingActionFactory === void 0) { trailingActionFactory = function (el) { return new MDCChipTrailingAction(el); }; }
|
|
848
|
-
this.leadingIcon = this.root.querySelector(strings$1.LEADING_ICON_SELECTOR);
|
|
849
|
-
this.checkmark = this.root.querySelector(strings$1.CHECKMARK_SELECTOR);
|
|
850
|
-
this.primaryAction =
|
|
851
|
-
this.root.querySelector(strings$1.PRIMARY_ACTION_SELECTOR);
|
|
852
|
-
var trailingActionEl = this.root.querySelector(strings$1.TRAILING_ACTION_SELECTOR);
|
|
853
|
-
if (trailingActionEl) {
|
|
854
|
-
this.trailingAction = trailingActionFactory(trailingActionEl);
|
|
855
|
-
}
|
|
856
|
-
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
|
|
857
|
-
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
|
|
858
|
-
var rippleAdapter = component.__assign(component.__assign({}, component$1.MDCRipple.createAdapter(this)), { computeBoundingRect: function () { return _this.foundation.getDimensions(); } });
|
|
859
|
-
this.rippleSurface =
|
|
860
|
-
rippleFactory(this.root, new component$1.MDCRippleFoundation(rippleAdapter));
|
|
861
|
-
};
|
|
862
|
-
MDCChip.prototype.initialSyncWithDOM = function () {
|
|
863
|
-
var _this = this;
|
|
864
|
-
// Custom events
|
|
865
|
-
this.handleTrailingActionInteraction = function () {
|
|
866
|
-
_this.foundation.handleTrailingActionInteraction();
|
|
867
|
-
};
|
|
868
|
-
this.handleTrailingActionNavigation =
|
|
869
|
-
function (evt) {
|
|
870
|
-
_this.foundation.handleTrailingActionNavigation(evt);
|
|
871
|
-
};
|
|
872
|
-
// Native events
|
|
873
|
-
this.handleClick = function () {
|
|
874
|
-
_this.foundation.handleClick();
|
|
875
|
-
};
|
|
876
|
-
this.handleKeydown = function (evt) {
|
|
877
|
-
_this.foundation.handleKeydown(evt);
|
|
878
|
-
};
|
|
879
|
-
this.handleTransitionEnd = function (evt) {
|
|
880
|
-
_this.foundation.handleTransitionEnd(evt);
|
|
881
|
-
};
|
|
882
|
-
this.handleFocusIn = function (evt) {
|
|
883
|
-
_this.foundation.handleFocusIn(evt);
|
|
884
|
-
};
|
|
885
|
-
this.handleFocusOut = function (evt) {
|
|
886
|
-
_this.foundation.handleFocusOut(evt);
|
|
887
|
-
};
|
|
888
|
-
this.listen('transitionend', this.handleTransitionEnd);
|
|
889
|
-
this.listen('click', this.handleClick);
|
|
890
|
-
this.listen('keydown', this.handleKeydown);
|
|
891
|
-
this.listen('focusin', this.handleFocusIn);
|
|
892
|
-
this.listen('focusout', this.handleFocusOut);
|
|
893
|
-
if (this.trailingAction) {
|
|
894
|
-
this.listen(strings$2.INTERACTION_EVENT, this.handleTrailingActionInteraction);
|
|
895
|
-
this.listen(strings$2.NAVIGATION_EVENT, this.handleTrailingActionNavigation);
|
|
896
|
-
}
|
|
897
|
-
};
|
|
898
|
-
MDCChip.prototype.destroy = function () {
|
|
899
|
-
this.rippleSurface.destroy();
|
|
900
|
-
this.unlisten('transitionend', this.handleTransitionEnd);
|
|
901
|
-
this.unlisten('keydown', this.handleKeydown);
|
|
902
|
-
this.unlisten('click', this.handleClick);
|
|
903
|
-
this.unlisten('focusin', this.handleFocusIn);
|
|
904
|
-
this.unlisten('focusout', this.handleFocusOut);
|
|
905
|
-
if (this.trailingAction) {
|
|
906
|
-
this.unlisten(strings$2.INTERACTION_EVENT, this.handleTrailingActionInteraction);
|
|
907
|
-
this.unlisten(strings$2.NAVIGATION_EVENT, this.handleTrailingActionNavigation);
|
|
908
|
-
}
|
|
909
|
-
_super.prototype.destroy.call(this);
|
|
910
|
-
};
|
|
911
|
-
/**
|
|
912
|
-
* Begins the exit animation which leads to removal of the chip.
|
|
913
|
-
*/
|
|
914
|
-
MDCChip.prototype.beginExit = function () {
|
|
915
|
-
this.foundation.beginExit();
|
|
916
|
-
};
|
|
917
|
-
MDCChip.prototype.getDefaultFoundation = function () {
|
|
918
|
-
var _this = this;
|
|
919
|
-
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
|
|
920
|
-
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
|
|
921
|
-
var adapter = {
|
|
922
|
-
addClass: function (className) { return _this.root.classList.add(className); },
|
|
923
|
-
addClassToLeadingIcon: function (className) {
|
|
924
|
-
if (_this.leadingIcon) {
|
|
925
|
-
_this.leadingIcon.classList.add(className);
|
|
926
|
-
}
|
|
927
|
-
},
|
|
928
|
-
eventTargetHasClass: function (target, className) {
|
|
929
|
-
return target ? target.classList.contains(className) : false;
|
|
930
|
-
},
|
|
931
|
-
focusPrimaryAction: function () {
|
|
932
|
-
if (_this.primaryAction) {
|
|
933
|
-
_this.primaryAction.focus();
|
|
934
|
-
}
|
|
935
|
-
},
|
|
936
|
-
focusTrailingAction: function () {
|
|
937
|
-
if (_this.trailingAction) {
|
|
938
|
-
_this.trailingAction.focus();
|
|
939
|
-
}
|
|
940
|
-
},
|
|
941
|
-
getAttribute: function (attr) { return _this.root.getAttribute(attr); },
|
|
942
|
-
getCheckmarkBoundingClientRect: function () {
|
|
943
|
-
return _this.checkmark ? _this.checkmark.getBoundingClientRect() : null;
|
|
944
|
-
},
|
|
945
|
-
getComputedStyleValue: function (propertyName) {
|
|
946
|
-
return window.getComputedStyle(_this.root).getPropertyValue(propertyName);
|
|
947
|
-
},
|
|
948
|
-
getRootBoundingClientRect: function () { return _this.root.getBoundingClientRect(); },
|
|
949
|
-
hasClass: function (className) { return _this.root.classList.contains(className); },
|
|
950
|
-
hasLeadingIcon: function () { return !!_this.leadingIcon; },
|
|
951
|
-
isRTL: function () { return window.getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl'; },
|
|
952
|
-
isTrailingActionNavigable: function () {
|
|
953
|
-
if (_this.trailingAction) {
|
|
954
|
-
return _this.trailingAction.isNavigable();
|
|
955
|
-
}
|
|
956
|
-
return false;
|
|
957
|
-
},
|
|
958
|
-
notifyInteraction: function () { return _this.emit(strings$1.INTERACTION_EVENT, { chipId: _this.id }, true /* shouldBubble */); },
|
|
959
|
-
notifyNavigation: function (key, source) {
|
|
960
|
-
return _this.emit(strings$1.NAVIGATION_EVENT, { chipId: _this.id, key: key, source: source }, true /* shouldBubble */);
|
|
961
|
-
},
|
|
962
|
-
notifyRemoval: function (removedAnnouncement) {
|
|
963
|
-
_this.emit(strings$1.REMOVAL_EVENT, { chipId: _this.id, removedAnnouncement: removedAnnouncement }, true /* shouldBubble */);
|
|
964
|
-
},
|
|
965
|
-
notifySelection: function (selected, shouldIgnore) {
|
|
966
|
-
return _this.emit(strings$1.SELECTION_EVENT, { chipId: _this.id, selected: selected, shouldIgnore: shouldIgnore }, true /* shouldBubble */);
|
|
967
|
-
},
|
|
968
|
-
notifyTrailingIconInteraction: function () {
|
|
969
|
-
return _this.emit(strings$1.TRAILING_ICON_INTERACTION_EVENT, { chipId: _this.id }, true /* shouldBubble */);
|
|
970
|
-
},
|
|
971
|
-
notifyEditStart: function () { },
|
|
972
|
-
notifyEditFinish: function () { },
|
|
973
|
-
removeClass: function (className) { return _this.root.classList.remove(className); },
|
|
974
|
-
removeClassFromLeadingIcon: function (className) {
|
|
975
|
-
if (_this.leadingIcon) {
|
|
976
|
-
_this.leadingIcon.classList.remove(className);
|
|
977
|
-
}
|
|
978
|
-
},
|
|
979
|
-
removeTrailingActionFocus: function () {
|
|
980
|
-
if (_this.trailingAction) {
|
|
981
|
-
_this.trailingAction.removeFocus();
|
|
982
|
-
}
|
|
983
|
-
},
|
|
984
|
-
setPrimaryActionAttr: function (attr, value) {
|
|
985
|
-
if (_this.primaryAction) {
|
|
986
|
-
_this.primaryAction.setAttribute(attr, value);
|
|
987
|
-
}
|
|
988
|
-
},
|
|
989
|
-
setStyleProperty: function (propertyName, value) {
|
|
990
|
-
return _this.root.style.setProperty(propertyName, value);
|
|
991
|
-
},
|
|
992
|
-
};
|
|
993
|
-
return new MDCChipFoundation(adapter);
|
|
994
|
-
};
|
|
995
|
-
MDCChip.prototype.setSelectedFromChipSet = function (selected, shouldNotifyClients) {
|
|
996
|
-
this.foundation.setSelectedFromChipSet(selected, shouldNotifyClients);
|
|
997
|
-
};
|
|
998
|
-
MDCChip.prototype.focusPrimaryAction = function () {
|
|
999
|
-
this.foundation.focusPrimaryAction();
|
|
1000
|
-
};
|
|
1001
|
-
MDCChip.prototype.focusTrailingAction = function () {
|
|
1002
|
-
this.foundation.focusTrailingAction();
|
|
1003
|
-
};
|
|
1004
|
-
MDCChip.prototype.removeFocus = function () {
|
|
1005
|
-
this.foundation.removeFocus();
|
|
1006
|
-
};
|
|
1007
|
-
MDCChip.prototype.remove = function () {
|
|
1008
|
-
var parent = this.root.parentNode;
|
|
1009
|
-
if (parent !== null) {
|
|
1010
|
-
parent.removeChild(this.root);
|
|
1011
|
-
}
|
|
1012
|
-
};
|
|
1013
|
-
return MDCChip;
|
|
1014
|
-
}(component.MDCComponent));
|
|
1015
|
-
|
|
1016
|
-
/**
|
|
1017
|
-
* @license
|
|
1018
|
-
* Copyright 2020 Google Inc.
|
|
1019
|
-
*
|
|
1020
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1021
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
1022
|
-
* in the Software without restriction, including without limitation the rights
|
|
1023
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1024
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
1025
|
-
* furnished to do so, subject to the following conditions:
|
|
1026
|
-
*
|
|
1027
|
-
* The above copyright notice and this permission notice shall be included in
|
|
1028
|
-
* all copies or substantial portions of the Software.
|
|
1029
|
-
*
|
|
1030
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1031
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1032
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1033
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1034
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1035
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1036
|
-
* THE SOFTWARE.
|
|
1037
|
-
*/
|
|
1038
|
-
/**
|
|
1039
|
-
* Priorities for the announce function.
|
|
1040
|
-
*/
|
|
1041
|
-
var AnnouncerPriority;
|
|
1042
|
-
(function (AnnouncerPriority) {
|
|
1043
|
-
AnnouncerPriority["POLITE"] = "polite";
|
|
1044
|
-
AnnouncerPriority["ASSERTIVE"] = "assertive";
|
|
1045
|
-
})(AnnouncerPriority || (AnnouncerPriority = {}));
|
|
1046
|
-
/**
|
|
1047
|
-
* Data attribute added to live region element.
|
|
1048
|
-
*/
|
|
1049
|
-
var DATA_MDC_DOM_ANNOUNCE = 'data-mdc-dom-announce';
|
|
1050
|
-
/**
|
|
1051
|
-
* Announces the given message with optional priority, defaulting to "polite"
|
|
1052
|
-
*/
|
|
1053
|
-
function announce(message, options) {
|
|
1054
|
-
Announcer.getInstance().say(message, options);
|
|
1055
|
-
}
|
|
1056
|
-
var Announcer = /** @class */ (function () {
|
|
1057
|
-
// Constructor made private to ensure only the singleton is used
|
|
1058
|
-
function Announcer() {
|
|
1059
|
-
this.liveRegions = new Map();
|
|
1060
|
-
}
|
|
1061
|
-
Announcer.getInstance = function () {
|
|
1062
|
-
if (!Announcer.instance) {
|
|
1063
|
-
Announcer.instance = new Announcer();
|
|
1064
|
-
}
|
|
1065
|
-
return Announcer.instance;
|
|
1066
|
-
};
|
|
1067
|
-
Announcer.prototype.say = function (message, options) {
|
|
1068
|
-
var _a, _b;
|
|
1069
|
-
var priority = (_a = options === null || options === void 0 ? void 0 : options.priority) !== null && _a !== void 0 ? _a : AnnouncerPriority.POLITE;
|
|
1070
|
-
var ownerDocument = (_b = options === null || options === void 0 ? void 0 : options.ownerDocument) !== null && _b !== void 0 ? _b : document;
|
|
1071
|
-
var liveRegion = this.getLiveRegion(priority, ownerDocument);
|
|
1072
|
-
// Reset the region to pick up the message, even if the message is the
|
|
1073
|
-
// exact same as before.
|
|
1074
|
-
liveRegion.textContent = '';
|
|
1075
|
-
// Timeout is necessary for screen readers like NVDA and VoiceOver.
|
|
1076
|
-
setTimeout(function () {
|
|
1077
|
-
liveRegion.textContent = message;
|
|
1078
|
-
ownerDocument.addEventListener('click', clearLiveRegion);
|
|
1079
|
-
}, 1);
|
|
1080
|
-
function clearLiveRegion() {
|
|
1081
|
-
liveRegion.textContent = '';
|
|
1082
|
-
ownerDocument.removeEventListener('click', clearLiveRegion);
|
|
1083
|
-
}
|
|
1084
|
-
};
|
|
1085
|
-
Announcer.prototype.getLiveRegion = function (priority, ownerDocument) {
|
|
1086
|
-
var documentLiveRegions = this.liveRegions.get(ownerDocument);
|
|
1087
|
-
if (!documentLiveRegions) {
|
|
1088
|
-
documentLiveRegions = new Map();
|
|
1089
|
-
this.liveRegions.set(ownerDocument, documentLiveRegions);
|
|
1090
|
-
}
|
|
1091
|
-
var existingLiveRegion = documentLiveRegions.get(priority);
|
|
1092
|
-
if (existingLiveRegion &&
|
|
1093
|
-
ownerDocument.body.contains(existingLiveRegion)) {
|
|
1094
|
-
return existingLiveRegion;
|
|
1095
|
-
}
|
|
1096
|
-
var liveRegion = this.createLiveRegion(priority, ownerDocument);
|
|
1097
|
-
documentLiveRegions.set(priority, liveRegion);
|
|
1098
|
-
return liveRegion;
|
|
1099
|
-
};
|
|
1100
|
-
Announcer.prototype.createLiveRegion = function (priority, ownerDocument) {
|
|
1101
|
-
var el = ownerDocument.createElement('div');
|
|
1102
|
-
el.style.position = 'absolute';
|
|
1103
|
-
el.style.top = '-9999px';
|
|
1104
|
-
el.style.left = '-9999px';
|
|
1105
|
-
el.style.height = '1px';
|
|
1106
|
-
el.style.overflow = 'hidden';
|
|
1107
|
-
el.setAttribute('aria-atomic', 'true');
|
|
1108
|
-
el.setAttribute('aria-live', priority);
|
|
1109
|
-
el.setAttribute(DATA_MDC_DOM_ANNOUNCE, 'true');
|
|
1110
|
-
ownerDocument.body.appendChild(el);
|
|
1111
|
-
return el;
|
|
1112
|
-
};
|
|
1113
|
-
return Announcer;
|
|
1114
|
-
}());
|
|
1115
|
-
|
|
1116
|
-
/**
|
|
1117
|
-
* @license
|
|
1118
|
-
* Copyright 2016 Google Inc.
|
|
1119
|
-
*
|
|
1120
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1121
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
1122
|
-
* in the Software without restriction, including without limitation the rights
|
|
1123
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1124
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
1125
|
-
* furnished to do so, subject to the following conditions:
|
|
1126
|
-
*
|
|
1127
|
-
* The above copyright notice and this permission notice shall be included in
|
|
1128
|
-
* all copies or substantial portions of the Software.
|
|
1129
|
-
*
|
|
1130
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1131
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1132
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1133
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1134
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1135
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1136
|
-
* THE SOFTWARE.
|
|
1137
|
-
*/
|
|
1138
|
-
var strings = {
|
|
1139
|
-
CHIP_SELECTOR: '.mdc-chip',
|
|
1140
|
-
};
|
|
1141
|
-
var cssClasses = {
|
|
1142
|
-
CHOICE: 'mdc-chip-set--choice',
|
|
1143
|
-
FILTER: 'mdc-chip-set--filter',
|
|
1144
|
-
};
|
|
1145
|
-
|
|
1146
|
-
/**
|
|
1147
|
-
* @license
|
|
1148
|
-
* Copyright 2017 Google Inc.
|
|
1149
|
-
*
|
|
1150
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1151
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
1152
|
-
* in the Software without restriction, including without limitation the rights
|
|
1153
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1154
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
1155
|
-
* furnished to do so, subject to the following conditions:
|
|
1156
|
-
*
|
|
1157
|
-
* The above copyright notice and this permission notice shall be included in
|
|
1158
|
-
* all copies or substantial portions of the Software.
|
|
1159
|
-
*
|
|
1160
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1161
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1162
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1163
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1164
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1165
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1166
|
-
* THE SOFTWARE.
|
|
1167
|
-
*/
|
|
1168
|
-
var MDCChipSetFoundation = /** @class */ (function (_super) {
|
|
1169
|
-
component.__extends(MDCChipSetFoundation, _super);
|
|
1170
|
-
function MDCChipSetFoundation(adapter) {
|
|
1171
|
-
var _this = _super.call(this, component.__assign(component.__assign({}, MDCChipSetFoundation.defaultAdapter), adapter)) || this;
|
|
1172
|
-
/**
|
|
1173
|
-
* The ids of the selected chips in the set. Only used for choice chip set or filter chip set.
|
|
1174
|
-
*/
|
|
1175
|
-
_this.selectedChipIds = [];
|
|
1176
|
-
return _this;
|
|
1177
|
-
}
|
|
1178
|
-
Object.defineProperty(MDCChipSetFoundation, "strings", {
|
|
1179
|
-
get: function () {
|
|
1180
|
-
return strings;
|
|
1181
|
-
},
|
|
1182
|
-
enumerable: false,
|
|
1183
|
-
configurable: true
|
|
1184
|
-
});
|
|
1185
|
-
Object.defineProperty(MDCChipSetFoundation, "cssClasses", {
|
|
1186
|
-
get: function () {
|
|
1187
|
-
return cssClasses;
|
|
1188
|
-
},
|
|
1189
|
-
enumerable: false,
|
|
1190
|
-
configurable: true
|
|
1191
|
-
});
|
|
1192
|
-
Object.defineProperty(MDCChipSetFoundation, "defaultAdapter", {
|
|
1193
|
-
get: function () {
|
|
1194
|
-
return {
|
|
1195
|
-
announceMessage: function () { return undefined; },
|
|
1196
|
-
focusChipPrimaryActionAtIndex: function () { return undefined; },
|
|
1197
|
-
focusChipTrailingActionAtIndex: function () { return undefined; },
|
|
1198
|
-
getChipListCount: function () { return -1; },
|
|
1199
|
-
getIndexOfChipById: function () { return -1; },
|
|
1200
|
-
hasClass: function () { return false; },
|
|
1201
|
-
isRTL: function () { return false; },
|
|
1202
|
-
removeChipAtIndex: function () { return undefined; },
|
|
1203
|
-
removeFocusFromChipAtIndex: function () { return undefined; },
|
|
1204
|
-
selectChipAtIndex: function () { return undefined; },
|
|
1205
|
-
};
|
|
1206
|
-
},
|
|
1207
|
-
enumerable: false,
|
|
1208
|
-
configurable: true
|
|
1209
|
-
});
|
|
1210
|
-
/**
|
|
1211
|
-
* Returns an array of the IDs of all selected chips.
|
|
1212
|
-
*/
|
|
1213
|
-
MDCChipSetFoundation.prototype.getSelectedChipIds = function () {
|
|
1214
|
-
return this.selectedChipIds.slice();
|
|
1215
|
-
};
|
|
1216
|
-
/**
|
|
1217
|
-
* Selects the chip with the given id. Deselects all other chips if the chip set is of the choice variant.
|
|
1218
|
-
* Does not notify clients of the updated selection state.
|
|
1219
|
-
*/
|
|
1220
|
-
MDCChipSetFoundation.prototype.select = function (chipId) {
|
|
1221
|
-
this.selectImpl(chipId, false);
|
|
1222
|
-
};
|
|
1223
|
-
/**
|
|
1224
|
-
* Handles a chip interaction event
|
|
1225
|
-
*/
|
|
1226
|
-
MDCChipSetFoundation.prototype.handleChipInteraction = function (_a) {
|
|
1227
|
-
var chipId = _a.chipId;
|
|
1228
|
-
var index = this.adapter.getIndexOfChipById(chipId);
|
|
1229
|
-
this.removeFocusFromChipsExcept(index);
|
|
1230
|
-
if (this.adapter.hasClass(cssClasses.CHOICE) ||
|
|
1231
|
-
this.adapter.hasClass(cssClasses.FILTER)) {
|
|
1232
|
-
this.toggleSelect(chipId);
|
|
1233
|
-
}
|
|
1234
|
-
};
|
|
1235
|
-
/**
|
|
1236
|
-
* Handles a chip selection event, used to handle discrepancy when selection state is set directly on the Chip.
|
|
1237
|
-
*/
|
|
1238
|
-
MDCChipSetFoundation.prototype.handleChipSelection = function (_a) {
|
|
1239
|
-
var chipId = _a.chipId, selected = _a.selected, shouldIgnore = _a.shouldIgnore;
|
|
1240
|
-
// Early exit if we should ignore the event
|
|
1241
|
-
if (shouldIgnore) {
|
|
1242
|
-
return;
|
|
1243
|
-
}
|
|
1244
|
-
var chipIsSelected = this.selectedChipIds.indexOf(chipId) >= 0;
|
|
1245
|
-
if (selected && !chipIsSelected) {
|
|
1246
|
-
this.select(chipId);
|
|
1247
|
-
}
|
|
1248
|
-
else if (!selected && chipIsSelected) {
|
|
1249
|
-
this.deselectImpl(chipId);
|
|
1250
|
-
}
|
|
1251
|
-
};
|
|
1252
|
-
/**
|
|
1253
|
-
* Handles the event when a chip is removed.
|
|
1254
|
-
*/
|
|
1255
|
-
MDCChipSetFoundation.prototype.handleChipRemoval = function (_a) {
|
|
1256
|
-
var chipId = _a.chipId, removedAnnouncement = _a.removedAnnouncement;
|
|
1257
|
-
if (removedAnnouncement) {
|
|
1258
|
-
this.adapter.announceMessage(removedAnnouncement);
|
|
1259
|
-
}
|
|
1260
|
-
var index = this.adapter.getIndexOfChipById(chipId);
|
|
1261
|
-
this.deselectAndNotifyClients(chipId);
|
|
1262
|
-
this.adapter.removeChipAtIndex(index);
|
|
1263
|
-
var maxIndex = this.adapter.getChipListCount() - 1;
|
|
1264
|
-
if (maxIndex < 0) {
|
|
1265
|
-
return;
|
|
1266
|
-
}
|
|
1267
|
-
var nextIndex = Math.min(index, maxIndex);
|
|
1268
|
-
this.removeFocusFromChipsExcept(nextIndex);
|
|
1269
|
-
// After removing a chip, we should focus the trailing action for the next chip.
|
|
1270
|
-
this.adapter.focusChipTrailingActionAtIndex(nextIndex);
|
|
1271
|
-
};
|
|
1272
|
-
/**
|
|
1273
|
-
* Handles a chip navigation event.
|
|
1274
|
-
*/
|
|
1275
|
-
MDCChipSetFoundation.prototype.handleChipNavigation = function (_a) {
|
|
1276
|
-
var chipId = _a.chipId, key = _a.key, source = _a.source;
|
|
1277
|
-
var maxIndex = this.adapter.getChipListCount() - 1;
|
|
1278
|
-
var index = this.adapter.getIndexOfChipById(chipId);
|
|
1279
|
-
// Early exit if the index is out of range or the key is unusable
|
|
1280
|
-
if (index === -1 || !navigationKeys.has(key)) {
|
|
1281
|
-
return;
|
|
1282
|
-
}
|
|
1283
|
-
var isRTL = this.adapter.isRTL();
|
|
1284
|
-
var isLeftKey = key === strings$1.ARROW_LEFT_KEY ||
|
|
1285
|
-
key === strings$1.IE_ARROW_LEFT_KEY;
|
|
1286
|
-
var isRightKey = key === strings$1.ARROW_RIGHT_KEY ||
|
|
1287
|
-
key === strings$1.IE_ARROW_RIGHT_KEY;
|
|
1288
|
-
var isDownKey = key === strings$1.ARROW_DOWN_KEY ||
|
|
1289
|
-
key === strings$1.IE_ARROW_DOWN_KEY;
|
|
1290
|
-
var shouldIncrement = !isRTL && isRightKey || isRTL && isLeftKey || isDownKey;
|
|
1291
|
-
var isHome = key === strings$1.HOME_KEY;
|
|
1292
|
-
var isEnd = key === strings$1.END_KEY;
|
|
1293
|
-
if (shouldIncrement) {
|
|
1294
|
-
index++;
|
|
1295
|
-
}
|
|
1296
|
-
else if (isHome) {
|
|
1297
|
-
index = 0;
|
|
1298
|
-
}
|
|
1299
|
-
else if (isEnd) {
|
|
1300
|
-
index = maxIndex;
|
|
1301
|
-
}
|
|
1302
|
-
else {
|
|
1303
|
-
index--;
|
|
1304
|
-
}
|
|
1305
|
-
// Early exit if the index is out of bounds
|
|
1306
|
-
if (index < 0 || index > maxIndex) {
|
|
1307
|
-
return;
|
|
1308
|
-
}
|
|
1309
|
-
this.removeFocusFromChipsExcept(index);
|
|
1310
|
-
this.focusChipAction(index, key, source);
|
|
1311
|
-
};
|
|
1312
|
-
MDCChipSetFoundation.prototype.focusChipAction = function (index, key, source) {
|
|
1313
|
-
var shouldJumpChips = jumpChipKeys.has(key);
|
|
1314
|
-
if (shouldJumpChips && source === EventSource.PRIMARY) {
|
|
1315
|
-
return this.adapter.focusChipPrimaryActionAtIndex(index);
|
|
1316
|
-
}
|
|
1317
|
-
if (shouldJumpChips && source === EventSource.TRAILING) {
|
|
1318
|
-
return this.adapter.focusChipTrailingActionAtIndex(index);
|
|
1319
|
-
}
|
|
1320
|
-
var dir = this.getDirection(key);
|
|
1321
|
-
if (dir === Direction.LEFT) {
|
|
1322
|
-
return this.adapter.focusChipTrailingActionAtIndex(index);
|
|
1323
|
-
}
|
|
1324
|
-
if (dir === Direction.RIGHT) {
|
|
1325
|
-
return this.adapter.focusChipPrimaryActionAtIndex(index);
|
|
1326
|
-
}
|
|
1327
|
-
};
|
|
1328
|
-
MDCChipSetFoundation.prototype.getDirection = function (key) {
|
|
1329
|
-
var isRTL = this.adapter.isRTL();
|
|
1330
|
-
var isLeftKey = key === strings$1.ARROW_LEFT_KEY ||
|
|
1331
|
-
key === strings$1.IE_ARROW_LEFT_KEY;
|
|
1332
|
-
var isRightKey = key === strings$1.ARROW_RIGHT_KEY ||
|
|
1333
|
-
key === strings$1.IE_ARROW_RIGHT_KEY;
|
|
1334
|
-
if (!isRTL && isLeftKey || isRTL && isRightKey) {
|
|
1335
|
-
return Direction.LEFT;
|
|
1336
|
-
}
|
|
1337
|
-
return Direction.RIGHT;
|
|
1338
|
-
};
|
|
1339
|
-
/**
|
|
1340
|
-
* Deselects the chip with the given id and optionally notifies clients.
|
|
1341
|
-
*/
|
|
1342
|
-
MDCChipSetFoundation.prototype.deselectImpl = function (chipId, shouldNotifyClients) {
|
|
1343
|
-
if (shouldNotifyClients === void 0) { shouldNotifyClients = false; }
|
|
1344
|
-
var index = this.selectedChipIds.indexOf(chipId);
|
|
1345
|
-
if (index >= 0) {
|
|
1346
|
-
this.selectedChipIds.splice(index, 1);
|
|
1347
|
-
var chipIndex = this.adapter.getIndexOfChipById(chipId);
|
|
1348
|
-
this.adapter.selectChipAtIndex(chipIndex, /** isSelected */ false, shouldNotifyClients);
|
|
1349
|
-
}
|
|
1350
|
-
};
|
|
1351
|
-
/**
|
|
1352
|
-
* Deselects the chip with the given id and notifies clients.
|
|
1353
|
-
*/
|
|
1354
|
-
MDCChipSetFoundation.prototype.deselectAndNotifyClients = function (chipId) {
|
|
1355
|
-
this.deselectImpl(chipId, true);
|
|
1356
|
-
};
|
|
1357
|
-
/**
|
|
1358
|
-
* Toggles selection of the chip with the given id.
|
|
1359
|
-
*/
|
|
1360
|
-
MDCChipSetFoundation.prototype.toggleSelect = function (chipId) {
|
|
1361
|
-
if (this.selectedChipIds.indexOf(chipId) >= 0) {
|
|
1362
|
-
this.deselectAndNotifyClients(chipId);
|
|
1363
|
-
}
|
|
1364
|
-
else {
|
|
1365
|
-
this.selectAndNotifyClients(chipId);
|
|
1366
|
-
}
|
|
1367
|
-
};
|
|
1368
|
-
MDCChipSetFoundation.prototype.removeFocusFromChipsExcept = function (index) {
|
|
1369
|
-
var chipCount = this.adapter.getChipListCount();
|
|
1370
|
-
for (var i = 0; i < chipCount; i++) {
|
|
1371
|
-
if (i !== index) {
|
|
1372
|
-
this.adapter.removeFocusFromChipAtIndex(i);
|
|
1373
|
-
}
|
|
1374
|
-
}
|
|
1375
|
-
};
|
|
1376
|
-
MDCChipSetFoundation.prototype.selectAndNotifyClients = function (chipId) {
|
|
1377
|
-
this.selectImpl(chipId, true);
|
|
1378
|
-
};
|
|
1379
|
-
MDCChipSetFoundation.prototype.selectImpl = function (chipId, shouldNotifyClients) {
|
|
1380
|
-
if (this.selectedChipIds.indexOf(chipId) >= 0) {
|
|
1381
|
-
return;
|
|
1382
|
-
}
|
|
1383
|
-
if (this.adapter.hasClass(cssClasses.CHOICE) &&
|
|
1384
|
-
this.selectedChipIds.length > 0) {
|
|
1385
|
-
var previouslySelectedChip = this.selectedChipIds[0];
|
|
1386
|
-
var previouslySelectedIndex = this.adapter.getIndexOfChipById(previouslySelectedChip);
|
|
1387
|
-
this.selectedChipIds = [];
|
|
1388
|
-
this.adapter.selectChipAtIndex(previouslySelectedIndex, /** isSelected */ false, shouldNotifyClients);
|
|
1389
|
-
}
|
|
1390
|
-
this.selectedChipIds.push(chipId);
|
|
1391
|
-
var index = this.adapter.getIndexOfChipById(chipId);
|
|
1392
|
-
this.adapter.selectChipAtIndex(index, /** isSelected */ true, shouldNotifyClients);
|
|
1393
|
-
};
|
|
1394
|
-
return MDCChipSetFoundation;
|
|
1395
|
-
}(component.MDCFoundation));
|
|
1396
|
-
|
|
1397
|
-
/**
|
|
1398
|
-
* @license
|
|
1399
|
-
* Copyright 2016 Google Inc.
|
|
1400
|
-
*
|
|
1401
|
-
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
1402
|
-
* of this software and associated documentation files (the "Software"), to deal
|
|
1403
|
-
* in the Software without restriction, including without limitation the rights
|
|
1404
|
-
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
1405
|
-
* copies of the Software, and to permit persons to whom the Software is
|
|
1406
|
-
* furnished to do so, subject to the following conditions:
|
|
1407
|
-
*
|
|
1408
|
-
* The above copyright notice and this permission notice shall be included in
|
|
1409
|
-
* all copies or substantial portions of the Software.
|
|
1410
|
-
*
|
|
1411
|
-
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
1412
|
-
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
1413
|
-
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
1414
|
-
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
1415
|
-
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
1416
|
-
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
|
1417
|
-
* THE SOFTWARE.
|
|
1418
|
-
*/
|
|
1419
|
-
var _a = MDCChipFoundation.strings, INTERACTION_EVENT = _a.INTERACTION_EVENT, SELECTION_EVENT = _a.SELECTION_EVENT, REMOVAL_EVENT = _a.REMOVAL_EVENT, NAVIGATION_EVENT = _a.NAVIGATION_EVENT;
|
|
1420
|
-
var CHIP_SELECTOR = MDCChipSetFoundation.strings.CHIP_SELECTOR;
|
|
1421
|
-
var idCounter = 0;
|
|
1422
|
-
var MDCChipSet = /** @class */ (function (_super) {
|
|
1423
|
-
component.__extends(MDCChipSet, _super);
|
|
1424
|
-
function MDCChipSet() {
|
|
1425
|
-
return _super !== null && _super.apply(this, arguments) || this;
|
|
1426
|
-
}
|
|
1427
|
-
MDCChipSet.attachTo = function (root) {
|
|
1428
|
-
return new MDCChipSet(root);
|
|
1429
|
-
};
|
|
1430
|
-
Object.defineProperty(MDCChipSet.prototype, "chips", {
|
|
1431
|
-
get: function () {
|
|
1432
|
-
return this.chipsList.slice();
|
|
1433
|
-
},
|
|
1434
|
-
enumerable: false,
|
|
1435
|
-
configurable: true
|
|
1436
|
-
});
|
|
1437
|
-
Object.defineProperty(MDCChipSet.prototype, "selectedChipIds", {
|
|
1438
|
-
/**
|
|
1439
|
-
* @return An array of the IDs of all selected chips.
|
|
1440
|
-
*/
|
|
1441
|
-
get: function () {
|
|
1442
|
-
return this.foundation.getSelectedChipIds();
|
|
1443
|
-
},
|
|
1444
|
-
enumerable: false,
|
|
1445
|
-
configurable: true
|
|
1446
|
-
});
|
|
1447
|
-
/**
|
|
1448
|
-
* @param chipFactory A function which creates a new MDCChip.
|
|
1449
|
-
*/
|
|
1450
|
-
MDCChipSet.prototype.initialize = function (chipFactory) {
|
|
1451
|
-
if (chipFactory === void 0) { chipFactory = function (el) { return new MDCChip(el); }; }
|
|
1452
|
-
this.chipFactory = chipFactory;
|
|
1453
|
-
this.chipsList = this.instantiateChips(this.chipFactory);
|
|
1454
|
-
};
|
|
1455
|
-
MDCChipSet.prototype.initialSyncWithDOM = function () {
|
|
1456
|
-
var e_1, _a;
|
|
1457
|
-
var _this = this;
|
|
1458
|
-
try {
|
|
1459
|
-
for (var _b = component.__values(this.chipsList), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
1460
|
-
var chip = _c.value;
|
|
1461
|
-
if (chip.id && chip.selected) {
|
|
1462
|
-
this.foundation.select(chip.id);
|
|
1463
|
-
}
|
|
1464
|
-
}
|
|
1465
|
-
}
|
|
1466
|
-
catch (e_1_1) { e_1 = { error: e_1_1 }; }
|
|
1467
|
-
finally {
|
|
1468
|
-
try {
|
|
1469
|
-
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
1470
|
-
}
|
|
1471
|
-
finally { if (e_1) throw e_1.error; }
|
|
1472
|
-
}
|
|
1473
|
-
this.handleChipInteraction = function (evt) {
|
|
1474
|
-
return _this.foundation.handleChipInteraction(evt.detail);
|
|
1475
|
-
};
|
|
1476
|
-
this.handleChipSelection = function (evt) {
|
|
1477
|
-
return _this.foundation.handleChipSelection(evt.detail);
|
|
1478
|
-
};
|
|
1479
|
-
this.handleChipRemoval = function (evt) {
|
|
1480
|
-
return _this.foundation.handleChipRemoval(evt.detail);
|
|
1481
|
-
};
|
|
1482
|
-
this.handleChipNavigation = function (evt) {
|
|
1483
|
-
return _this.foundation.handleChipNavigation(evt.detail);
|
|
1484
|
-
};
|
|
1485
|
-
this.listen(INTERACTION_EVENT, this.handleChipInteraction);
|
|
1486
|
-
this.listen(SELECTION_EVENT, this.handleChipSelection);
|
|
1487
|
-
this.listen(REMOVAL_EVENT, this.handleChipRemoval);
|
|
1488
|
-
this.listen(NAVIGATION_EVENT, this.handleChipNavigation);
|
|
1489
|
-
};
|
|
1490
|
-
MDCChipSet.prototype.destroy = function () {
|
|
1491
|
-
var e_2, _a;
|
|
1492
|
-
try {
|
|
1493
|
-
for (var _b = component.__values(this.chipsList), _c = _b.next(); !_c.done; _c = _b.next()) {
|
|
1494
|
-
var chip = _c.value;
|
|
1495
|
-
chip.destroy();
|
|
1496
|
-
}
|
|
1497
|
-
}
|
|
1498
|
-
catch (e_2_1) { e_2 = { error: e_2_1 }; }
|
|
1499
|
-
finally {
|
|
1500
|
-
try {
|
|
1501
|
-
if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
|
|
1502
|
-
}
|
|
1503
|
-
finally { if (e_2) throw e_2.error; }
|
|
1504
|
-
}
|
|
1505
|
-
this.unlisten(INTERACTION_EVENT, this.handleChipInteraction);
|
|
1506
|
-
this.unlisten(SELECTION_EVENT, this.handleChipSelection);
|
|
1507
|
-
this.unlisten(REMOVAL_EVENT, this.handleChipRemoval);
|
|
1508
|
-
this.unlisten(NAVIGATION_EVENT, this.handleChipNavigation);
|
|
1509
|
-
_super.prototype.destroy.call(this);
|
|
1510
|
-
};
|
|
1511
|
-
/**
|
|
1512
|
-
* Adds a new chip object to the chip set from the given chip element.
|
|
1513
|
-
*/
|
|
1514
|
-
MDCChipSet.prototype.addChip = function (chipEl) {
|
|
1515
|
-
chipEl.id = chipEl.id || "mdc-chip-" + ++idCounter;
|
|
1516
|
-
this.chipsList.push(this.chipFactory(chipEl));
|
|
1517
|
-
};
|
|
1518
|
-
MDCChipSet.prototype.getDefaultFoundation = function () {
|
|
1519
|
-
var _this = this;
|
|
1520
|
-
// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
|
|
1521
|
-
// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
|
|
1522
|
-
var adapter = {
|
|
1523
|
-
announceMessage: function (message) {
|
|
1524
|
-
announce(message);
|
|
1525
|
-
},
|
|
1526
|
-
focusChipPrimaryActionAtIndex: function (index) {
|
|
1527
|
-
_this.chipsList[index].focusPrimaryAction();
|
|
1528
|
-
},
|
|
1529
|
-
focusChipTrailingActionAtIndex: function (index) {
|
|
1530
|
-
_this.chipsList[index].focusTrailingAction();
|
|
1531
|
-
},
|
|
1532
|
-
getChipListCount: function () { return _this.chips.length; },
|
|
1533
|
-
getIndexOfChipById: function (chipId) {
|
|
1534
|
-
return _this.findChipIndex(chipId);
|
|
1535
|
-
},
|
|
1536
|
-
hasClass: function (className) { return _this.root.classList.contains(className); },
|
|
1537
|
-
isRTL: function () { return window.getComputedStyle(_this.root).getPropertyValue('direction') === 'rtl'; },
|
|
1538
|
-
removeChipAtIndex: function (index) {
|
|
1539
|
-
if (index >= 0 && index < _this.chips.length) {
|
|
1540
|
-
_this.chipsList[index].destroy();
|
|
1541
|
-
_this.chipsList[index].remove();
|
|
1542
|
-
_this.chipsList.splice(index, 1);
|
|
1543
|
-
}
|
|
1544
|
-
},
|
|
1545
|
-
removeFocusFromChipAtIndex: function (index) {
|
|
1546
|
-
_this.chipsList[index].removeFocus();
|
|
1547
|
-
},
|
|
1548
|
-
selectChipAtIndex: function (index, selected, shouldNotifyClients) {
|
|
1549
|
-
if (index >= 0 && index < _this.chips.length) {
|
|
1550
|
-
_this.chipsList[index].setSelectedFromChipSet(selected, shouldNotifyClients);
|
|
1551
|
-
}
|
|
1552
|
-
},
|
|
1553
|
-
};
|
|
1554
|
-
return new MDCChipSetFoundation(adapter);
|
|
1555
|
-
};
|
|
1556
|
-
/**
|
|
1557
|
-
* Instantiates chip components on all of the chip set's child chip elements.
|
|
1558
|
-
*/
|
|
1559
|
-
MDCChipSet.prototype.instantiateChips = function (chipFactory) {
|
|
1560
|
-
var chipElements = [].slice.call(this.root.querySelectorAll(CHIP_SELECTOR));
|
|
1561
|
-
return chipElements.map(function (el) {
|
|
1562
|
-
el.id = el.id || "mdc-chip-" + ++idCounter;
|
|
1563
|
-
return chipFactory(el);
|
|
1564
|
-
});
|
|
1565
|
-
};
|
|
1566
|
-
/**
|
|
1567
|
-
* Returns the index of the chip with the given id, or -1 if the chip does not exist.
|
|
1568
|
-
*/
|
|
1569
|
-
MDCChipSet.prototype.findChipIndex = function (chipId) {
|
|
1570
|
-
for (var i = 0; i < this.chips.length; i++) {
|
|
1571
|
-
if (this.chipsList[i].id === chipId) {
|
|
1572
|
-
return i;
|
|
1573
|
-
}
|
|
1574
|
-
}
|
|
1575
|
-
return -1;
|
|
1576
|
-
};
|
|
1577
|
-
return MDCChipSet;
|
|
1578
|
-
}(component.MDCComponent));
|
|
1579
|
-
|
|
1580
|
-
/**
|
|
1581
|
-
* Key handler for the input field.
|
|
1582
|
-
* Lets the user select, activate, and remove chips with the keyboard.
|
|
1583
|
-
*
|
|
1584
|
-
* @param event - event
|
|
1585
|
-
|
|
1586
|
-
*/
|
|
1587
|
-
function handleKeyboardEvent(event) {
|
|
1588
|
-
if (this.textValue.length) {
|
|
1589
|
-
// If there is any text in the input field, keyboard input should
|
|
1590
|
-
// navigate the text, not the chips.
|
|
1591
|
-
return;
|
|
1592
|
-
}
|
|
1593
|
-
if (!this.value || !this.value.length) {
|
|
1594
|
-
// If there are no chips, there is nothing to select.
|
|
1595
|
-
return;
|
|
1596
|
-
}
|
|
1597
|
-
const isLeft = event.key === keycodes.ARROW_LEFT || event.keyCode === keycodes.ARROW_LEFT_KEY_CODE;
|
|
1598
|
-
const isRight = event.key === keycodes.ARROW_RIGHT || event.keyCode === keycodes.ARROW_RIGHT_KEY_CODE;
|
|
1599
|
-
const isEnter = event.key === keycodes.ENTER || event.keyCode === keycodes.ENTER_KEY_CODE;
|
|
1600
|
-
const isDelete = event.key === keycodes.DELETE || event.keyCode === keycodes.DELETE_KEY_CODE;
|
|
1601
|
-
const isBackspace = event.key === keycodes.BACKSPACE || event.keyCode === keycodes.BACKSPACE_KEY_CODE;
|
|
1602
|
-
const isEscape = event.key === keycodes.ESCAPE || event.keyCode === keycodes.ESCAPE_KEY_CODE;
|
|
1603
|
-
if (isLeft) {
|
|
1604
|
-
return handleLeft(this, event);
|
|
1605
|
-
}
|
|
1606
|
-
if (isRight) {
|
|
1607
|
-
return handleRight(this, event);
|
|
1608
|
-
}
|
|
1609
|
-
if (isEnter) {
|
|
1610
|
-
return handleEnter(this, event);
|
|
1611
|
-
}
|
|
1612
|
-
if (isDelete) {
|
|
1613
|
-
return handleDelete(this, event);
|
|
1614
|
-
}
|
|
1615
|
-
if (isBackspace) {
|
|
1616
|
-
return handleBackspace(this, event);
|
|
1617
|
-
}
|
|
1618
|
-
if (isEscape) {
|
|
1619
|
-
return handleEscape(this, event);
|
|
1620
|
-
}
|
|
1621
|
-
}
|
|
1622
|
-
function handleLeft(host, event) {
|
|
1623
|
-
event.preventDefault();
|
|
1624
|
-
if (host.inputChipIndexSelected === null) {
|
|
1625
|
-
host.inputChipIndexSelected = host.value.length - 1;
|
|
1626
|
-
return;
|
|
1627
|
-
}
|
|
1628
|
-
if (host.inputChipIndexSelected <= 0) {
|
|
1629
|
-
return;
|
|
1630
|
-
}
|
|
1631
|
-
host.inputChipIndexSelected -= 1;
|
|
1632
|
-
}
|
|
1633
|
-
function handleRight(host, event) {
|
|
1634
|
-
event.preventDefault();
|
|
1635
|
-
if (host.inputChipIndexSelected === null) {
|
|
1636
|
-
host.inputChipIndexSelected = 0;
|
|
1637
|
-
return;
|
|
1638
|
-
}
|
|
1639
|
-
if (host.inputChipIndexSelected >= host.value.length - 1) {
|
|
1640
|
-
return;
|
|
1641
|
-
}
|
|
1642
|
-
host.inputChipIndexSelected += 1;
|
|
1643
|
-
}
|
|
1644
|
-
function handleEnter(host, event) {
|
|
1645
|
-
if (host.inputChipIndexSelected !== null) {
|
|
1646
|
-
event.preventDefault();
|
|
1647
|
-
host.emitInteraction(host.value[host.inputChipIndexSelected]);
|
|
1648
|
-
}
|
|
1649
|
-
}
|
|
1650
|
-
function handleEscape(host, event) {
|
|
1651
|
-
if (host.inputChipIndexSelected !== null) {
|
|
1652
|
-
event.preventDefault();
|
|
1653
|
-
host.inputChipIndexSelected = null;
|
|
1654
|
-
}
|
|
1655
|
-
}
|
|
1656
|
-
function handleDelete(host, event) {
|
|
1657
|
-
if (host.inputChipIndexSelected !== null) {
|
|
1658
|
-
event.preventDefault();
|
|
1659
|
-
removeChip(host);
|
|
1660
|
-
}
|
|
1661
|
-
}
|
|
1662
|
-
function handleBackspace(host, event) {
|
|
1663
|
-
if (host.inputChipIndexSelected !== null) {
|
|
1664
|
-
event.preventDefault();
|
|
1665
|
-
removeChip(host);
|
|
1666
|
-
}
|
|
1667
|
-
else if (!event.repeat) {
|
|
1668
|
-
host.inputChipIndexSelected = host.value.length - 1;
|
|
1669
|
-
}
|
|
1670
|
-
}
|
|
1671
|
-
function removeChip(host) {
|
|
1672
|
-
if (host.inputChipIndexSelected !== null) {
|
|
1673
|
-
host.removeChip(host.value[host.inputChipIndexSelected].id);
|
|
1674
|
-
host.inputChipIndexSelected = null;
|
|
1675
|
-
}
|
|
1676
|
-
}
|
|
1677
|
-
|
|
1678
|
-
const chipSetCss = "@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 )}.mdc-notched-outline{display:flex;position:absolute;top:0;right:0;left:0;box-sizing:border-box;width:100%;max-width:100%;height:100%;text-align:left;pointer-events:none}[dir=rtl] .mdc-notched-outline,.mdc-notched-outline[dir=rtl]{text-align:right;}.mdc-notched-outline__leading,.mdc-notched-outline__notch,.mdc-notched-outline__trailing{box-sizing:border-box;height:100%;border-top:1px solid;border-bottom:1px solid;pointer-events:none}.mdc-notched-outline__leading{border-left:1px solid;border-right:none;width:12px}[dir=rtl] .mdc-notched-outline__leading,.mdc-notched-outline__leading[dir=rtl]{border-left:none;border-right:1px solid;}.mdc-notched-outline__trailing{border-left:none;border-right:1px solid;flex-grow:1}[dir=rtl] .mdc-notched-outline__trailing,.mdc-notched-outline__trailing[dir=rtl]{border-left:1px solid;border-right:none;}.mdc-notched-outline__notch{flex:0 0 auto;width:auto;max-width:calc(100% - 12px * 2)}.mdc-notched-outline .mdc-floating-label{display:inline-block;position:relative;max-width:100%}.mdc-notched-outline .mdc-floating-label--float-above{text-overflow:clip}.mdc-notched-outline--upgraded .mdc-floating-label--float-above{max-width:133.3333333333%}.mdc-notched-outline--notched .mdc-notched-outline__notch{padding-left:0;padding-right:8px;border-top:none}[dir=rtl] .mdc-notched-outline--notched .mdc-notched-outline__notch,.mdc-notched-outline--notched .mdc-notched-outline__notch[dir=rtl]{padding-left:8px;padding-right:0;}.mdc-notched-outline--no-label .mdc-notched-outline__notch{display:none}.mdc-floating-label{-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);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);position:absolute;left:0;-webkit-transform-origin:left top;transform-origin:left top;line-height:1.15rem;text-align:left;text-overflow:ellipsis;white-space:nowrap;cursor:text;overflow:hidden;will-change:transform;transition:transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1)}[dir=rtl] .mdc-floating-label,.mdc-floating-label[dir=rtl]{right:0;left:auto;-webkit-transform-origin:right top;transform-origin:right top;text-align:right;}.mdc-floating-label--float-above{cursor:auto}.mdc-floating-label--required::after{margin-left:1px;margin-right:0px;content:\"*\"}[dir=rtl] .mdc-floating-label--required,.mdc-floating-label--required[dir=rtl]{}[dir=rtl] .mdc-floating-label--required::after,.mdc-floating-label--required[dir=rtl]::after{margin-left:0;margin-right:1px}.mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-standard 250ms 1}@keyframes mdc-floating-label-shake-float-above-standard{0%{transform:translateX(calc(0 - 0%)) translateY(-106%) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-106%) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-106%) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-106%) scale(0.75)}}.mdc-touch-target-wrapper{display:inline}.mdc-deprecated-chip-trailing-action__touch{position:absolute;top:50%;height:48px;left:50%;width:48px;transform:translate(-50%, -50%)}.mdc-deprecated-chip-trailing-action{border:none;display:inline-flex;position:relative;align-items:center;justify-content:center;box-sizing:border-box;padding:0;outline:none;cursor:pointer;-webkit-appearance:none;background:none}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__touch{width:26px}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__icon{fill:currentColor;color:inherit}@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-deprecated-chip-trailing-action{--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-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--unbounded .mdc-deprecated-chip-trailing-action__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-activation .mdc-deprecated-chip-trailing-action__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--foreground-deactivation .mdc-deprecated-chip-trailing-action__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-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{top:calc(50% - 50%);left:calc(50% - 50%);width:100%;height:100%}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__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-deprecated-chip-trailing-action.mdc-ripple-upgraded .mdc-deprecated-chip-trailing-action__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple::after{background-color:#000;background-color:var(--mdc-ripple-color, var(--mdc-theme-on-surface, #000))}.mdc-deprecated-chip-trailing-action:hover .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action.mdc-ripple-surface--hover .mdc-deprecated-chip-trailing-action__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded--background-focused .mdc-deprecated-chip-trailing-action__ripple::before,.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):focus .mdc-deprecated-chip-trailing-action__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded) .mdc-deprecated-chip-trailing-action__ripple::after{transition:opacity 150ms linear}.mdc-deprecated-chip-trailing-action:not(.mdc-ripple-upgraded):active .mdc-deprecated-chip-trailing-action__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-deprecated-chip-trailing-action .mdc-deprecated-chip-trailing-action__ripple{position:absolute;box-sizing:content-box;width:100%;height:100%;overflow:hidden}.mdc-chip__icon--leading{color:rgba(0, 0, 0, 0.54)}.mdc-deprecated-chip-trailing-action{color:#000}.mdc-chip__icon--trailing{color:rgba(0, 0, 0, 0.54)}.mdc-chip__icon--trailing:hover{color:rgba(0, 0, 0, 0.62)}.mdc-chip__icon--trailing:focus{color:rgba(0, 0, 0, 0.87)}.mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px;}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px;}.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-chip{border-radius:16px;background-color:#e0e0e0;color:rgba(0, 0, 0, 0.87);-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);height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip:hover{color:rgba(0, 0, 0, 0.87)}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px;}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip:hover{color:#000;color:var(--mdc-theme-on-surface, #000)}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{transition:opacity 75ms cubic-bezier(0.4, 0, 0.2, 1), width 150ms cubic-bezier(0, 0, 0.2, 1), padding 100ms linear, margin 100ms linear;opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__icon--leading{color:rgba(38, 166, 154, 0.54)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover{color:#26a69a;color:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip .mdc-chip__checkmark-path{stroke:#26a69a;stroke:var(--mdc-theme-primary, #26a69a)}.mdc-chip-set--choice .mdc-chip--selected{background-color:#fff;background-color:var(--mdc-theme-surface, #fff)}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}.mdc-chip{--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-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-chip .mdc-chip__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-chip .mdc-chip__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-chip.mdc-ripple-upgraded--unbounded .mdc-chip__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-chip.mdc-ripple-upgraded--foreground-activation .mdc-chip__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-chip.mdc-ripple-upgraded--foreground-deactivation .mdc-chip__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-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-chip.mdc-ripple-upgraded .mdc-chip__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-chip .mdc-chip__ripple::before,.mdc-chip .mdc-chip__ripple::after{background-color:rgba(0, 0, 0, 0.87);background-color:var(--mdc-ripple-color, rgba(0, 0, 0, 0.87))}.mdc-chip:hover .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-chip.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-chip:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.12)}.mdc-chip .mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;overflow:hidden}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before{opacity:0.16;opacity:var(--mdc-ripple-selected-opacity, 0.16)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected .mdc-chip__ripple::after{background-color:#26a69a;background-color:var(--mdc-ripple-color, var(--mdc-theme-primary, #26a69a))}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:hover .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-surface--hover .mdc-chip__ripple::before{opacity:0.24;opacity:var(--mdc-ripple-hover-opacity, 0.24)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded--background-focused .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded:focus-within .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus .mdc-chip__ripple::before,.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):focus-within .mdc-chip__ripple::before{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-focus-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded) .mdc-chip__ripple::after{transition:opacity 150ms linear}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected:not(.mdc-ripple-upgraded):active .mdc-chip__ripple::after{transition-duration:75ms;opacity:0.4;opacity:var(--mdc-ripple-press-opacity, 0.4)}.mdc-chip-set--choice .mdc-chip.mdc-chip--selected.mdc-ripple-upgraded{--mdc-ripple-fg-opacity:var(--mdc-ripple-press-opacity, 0.4)}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:0.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mdc-text-field--filled{--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-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{position:absolute;border-radius:50%;opacity:0;pointer-events:none;content:\"\"}.mdc-text-field--filled .mdc-text-field__ripple::before{transition:opacity 15ms linear, background-color 15ms linear;z-index:1;z-index:var(--mdc-ripple-z-index, 1)}.mdc-text-field--filled .mdc-text-field__ripple::after{z-index:0;z-index:var(--mdc-ripple-z-index, 0)}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::before{transform:scale(var(--mdc-ripple-fg-scale, 1))}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::after{top:0;left:0;transform:scale(0);transform-origin:center center}.mdc-text-field--filled.mdc-ripple-upgraded--unbounded .mdc-text-field__ripple::after{top:var(--mdc-ripple-top, 0);left:var(--mdc-ripple-left, 0)}.mdc-text-field--filled.mdc-ripple-upgraded--foreground-activation .mdc-text-field__ripple::after{animation:mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards}.mdc-text-field--filled.mdc-ripple-upgraded--foreground-deactivation .mdc-text-field__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-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{top:calc(50% - 100%);left:calc(50% - 100%);width:200%;height:200%}.mdc-text-field--filled.mdc-ripple-upgraded .mdc-text-field__ripple::after{width:var(--mdc-ripple-fg-size, 100%);height:var(--mdc-ripple-fg-size, 100%)}.mdc-text-field__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-text-field{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:0;border-bottom-left-radius:0;display:inline-flex;align-items:baseline;padding:0 16px;position:relative;box-sizing:border-box;overflow:hidden;will-change:opacity, transform, color}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input{color:rgba(0, 0, 0, 0.87)}@media all{.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input::placeholder{color:rgba(0, 0, 0, 0.54)}}@media all{.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input:-ms-input-placeholder{color:rgba(0, 0, 0, 0.54)}}.mdc-text-field .mdc-text-field__input{caret-color:#26a69a;caret-color:var(--mdc-theme-primary, #26a69a)}.mdc-text-field:not(.mdc-text-field--disabled)+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field-character-counter,.mdc-text-field:not(.mdc-text-field--disabled)+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon--leading{color:rgba(0, 0, 0, 0.54)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__icon--trailing{color:rgba(0, 0, 0, 0.54)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__affix--prefix{color:rgba(0, 0, 0, 0.6)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__affix--suffix{color:rgba(0, 0, 0, 0.6)}.mdc-text-field .mdc-floating-label{top:50%;transform:translateY(-50%);pointer-events:none}.mdc-text-field__input{-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);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);height:28px;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);width:100%;min-width:0;border:none;border-radius:0;background:none;appearance:none;padding:0}.mdc-text-field__input::-ms-clear{display:none}.mdc-text-field__input::-webkit-calendar-picker-indicator{display:none}.mdc-text-field__input:focus{outline:none}.mdc-text-field__input:invalid{box-shadow:none}@media all{.mdc-text-field__input::placeholder{transition:opacity 67ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0}}@media all{.mdc-text-field__input:-ms-input-placeholder{transition:opacity 67ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0}}@media all{.mdc-text-field--no-label .mdc-text-field__input::placeholder,.mdc-text-field--focused .mdc-text-field__input::placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}}@media all{.mdc-text-field--no-label .mdc-text-field__input:-ms-input-placeholder,.mdc-text-field--focused .mdc-text-field__input:-ms-input-placeholder{transition-delay:40ms;transition-duration:110ms;opacity:1}}.mdc-text-field__affix{-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);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);height:28px;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);opacity:0;white-space:nowrap}.mdc-text-field--label-floating .mdc-text-field__affix,.mdc-text-field--no-label .mdc-text-field__affix{opacity:1}@supports (-webkit-hyphens: none){.mdc-text-field--outlined .mdc-text-field__affix{align-items:center;align-self:center;display:inline-flex;height:100%}}.mdc-text-field__affix--prefix{padding-left:0;padding-right:2px}[dir=rtl] .mdc-text-field__affix--prefix,.mdc-text-field__affix--prefix[dir=rtl]{padding-left:2px;padding-right:0;}.mdc-text-field--end-aligned .mdc-text-field__affix--prefix{padding-left:0;padding-right:12px}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__affix--prefix,.mdc-text-field--end-aligned .mdc-text-field__affix--prefix[dir=rtl]{padding-left:12px;padding-right:0;}.mdc-text-field__affix--suffix{padding-left:12px;padding-right:0}[dir=rtl] .mdc-text-field__affix--suffix,.mdc-text-field__affix--suffix[dir=rtl]{padding-left:0;padding-right:12px;}.mdc-text-field--end-aligned .mdc-text-field__affix--suffix{padding-left:2px;padding-right:0}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__affix--suffix,.mdc-text-field--end-aligned .mdc-text-field__affix--suffix[dir=rtl]{padding-left:0;padding-right:2px;}.mdc-text-field--filled{height:56px}.mdc-text-field--filled .mdc-text-field__ripple::before,.mdc-text-field--filled .mdc-text-field__ripple::after{background-color:rgba(0, 0, 0, 0.87);background-color:var(--mdc-ripple-color, rgba(0, 0, 0, 0.87))}.mdc-text-field--filled:hover .mdc-text-field__ripple::before,.mdc-text-field--filled.mdc-ripple-surface--hover .mdc-text-field__ripple::before{opacity:0.04;opacity:var(--mdc-ripple-hover-opacity, 0.04)}.mdc-text-field--filled.mdc-ripple-upgraded--background-focused .mdc-text-field__ripple::before,.mdc-text-field--filled:not(.mdc-ripple-upgraded):focus .mdc-text-field__ripple::before{transition-duration:75ms;opacity:0.12;opacity:var(--mdc-ripple-focus-opacity, 0.12)}.mdc-text-field--filled::before{display:inline-block;width:0;height:40px;content:\"\";vertical-align:0}.mdc-text-field--filled:not(.mdc-text-field--disabled){background-color:whitesmoke}.mdc-text-field--filled:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.42)}.mdc-text-field--filled:not(.mdc-text-field--disabled):hover .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.87)}.mdc-text-field--filled .mdc-line-ripple::after{border-bottom-color:#26a69a;border-bottom-color:var(--mdc-theme-primary, #26a69a)}.mdc-text-field--filled .mdc-floating-label{left:16px;right:initial}[dir=rtl] .mdc-text-field--filled .mdc-floating-label,.mdc-text-field--filled .mdc-floating-label[dir=rtl]{left:initial;right:16px;}.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-106%) scale(0.75)}.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{height:100%}.mdc-text-field--filled.mdc-text-field--no-label .mdc-floating-label{display:none}.mdc-text-field--filled.mdc-text-field--no-label::before{display:none}@supports (-webkit-hyphens: none){.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__affix{align-items:center;align-self:center;display:inline-flex;height:100%}}.mdc-text-field--outlined{height:56px;overflow:visible}.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) scale(1)}.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) scale(0.75)}.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined 250ms 1}@keyframes mdc-floating-label-shake-float-above-text-field-outlined{0%{transform:translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-34.75px) scale(0.75)}}.mdc-text-field--outlined .mdc-text-field__input{height:100%}.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.38)}.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.87)}.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--outlined:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#26a69a;border-color:var(--mdc-theme-primary, #26a69a)}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px;border-bottom-left-radius:var(--mdc-shape-small, 4px)}[dir=rtl] .mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading[dir=rtl]{border-top-left-radius:0;border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:4px;border-bottom-right-radius:var(--mdc-shape-small, 4px);border-bottom-left-radius:0;}@supports (top: max(0%)){.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__leading{width:max(12px, var(--mdc-shape-small, 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__notch{max-width:calc(100% - max(12px, var(--mdc-shape-small, 4px)) * 2)}}.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing{border-top-left-radius:0;border-top-right-radius:4px;border-top-right-radius:var(--mdc-shape-small, 4px);border-bottom-right-radius:4px;border-bottom-right-radius:var(--mdc-shape-small, 4px);border-bottom-left-radius:0}[dir=rtl] .mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing,.mdc-text-field--outlined .mdc-notched-outline .mdc-notched-outline__trailing[dir=rtl]{border-top-left-radius:4px;border-top-left-radius:var(--mdc-shape-small, 4px);border-top-right-radius:0;border-bottom-right-radius:0;border-bottom-left-radius:4px;border-bottom-left-radius:var(--mdc-shape-small, 4px);}@supports (top: max(0%)){.mdc-text-field--outlined{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined{padding-right:max(16px, var(--mdc-shape-small, 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined+.mdc-text-field-helper-line{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}@supports (top: max(0%)){.mdc-text-field--outlined+.mdc-text-field-helper-line{padding-right:max(16px, var(--mdc-shape-small, 4px))}}.mdc-text-field--outlined.mdc-text-field--with-leading-icon{padding-left:0}@supports (top: max(0%)){.mdc-text-field--outlined.mdc-text-field--with-leading-icon{padding-right:max(16px, var(--mdc-shape-small, 4px))}}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-leading-icon,.mdc-text-field--outlined.mdc-text-field--with-leading-icon[dir=rtl]{padding-right:0;}@supports (top: max(0%)){[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-leading-icon,.mdc-text-field--outlined.mdc-text-field--with-leading-icon[dir=rtl]{padding-left:max(16px, var(--mdc-shape-small, 4px))}}.mdc-text-field--outlined.mdc-text-field--with-trailing-icon{padding-right:0}@supports (top: max(0%)){.mdc-text-field--outlined.mdc-text-field--with-trailing-icon{padding-left:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-trailing-icon,.mdc-text-field--outlined.mdc-text-field--with-trailing-icon[dir=rtl]{padding-left:0;}@supports (top: max(0%)){[dir=rtl] .mdc-text-field--outlined.mdc-text-field--with-trailing-icon,.mdc-text-field--outlined.mdc-text-field--with-trailing-icon[dir=rtl]{padding-right:max(16px, calc(var(--mdc-shape-small, 4px) + 4px))}}.mdc-text-field--outlined.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon{padding-left:0;padding-right:0}.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:1px}.mdc-text-field--outlined .mdc-text-field__ripple::before,.mdc-text-field--outlined .mdc-text-field__ripple::after{content:none}.mdc-text-field--outlined .mdc-floating-label{left:4px;right:initial}[dir=rtl] .mdc-text-field--outlined .mdc-floating-label,.mdc-text-field--outlined .mdc-floating-label[dir=rtl]{left:initial;right:4px;}.mdc-text-field--outlined .mdc-text-field__input{display:flex;border:none !important;background-color:transparent}.mdc-text-field--outlined .mdc-notched-outline{z-index:1}.mdc-text-field--textarea{flex-direction:column;align-items:center;width:auto;height:auto;padding:0;transition:none}.mdc-text-field--textarea .mdc-floating-label{top:19px}.mdc-text-field--textarea .mdc-floating-label:not(.mdc-floating-label--float-above){transform:none}.mdc-text-field--textarea .mdc-text-field__input{flex-grow:1;height:auto;min-height:1.5rem;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;resize:none;padding:0 16px;line-height:1.5rem}.mdc-text-field--textarea.mdc-text-field--filled::before{display:none}.mdc-text-field--textarea.mdc-text-field--filled .mdc-floating-label--float-above{transform:translateY(-10.25px) scale(0.75)}.mdc-text-field--textarea.mdc-text-field--filled .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-textarea-filled 250ms 1}@keyframes mdc-floating-label-shake-float-above-textarea-filled{0%{transform:translateX(calc(0 - 0%)) translateY(-10.25px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-10.25px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-10.25px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-10.25px) scale(0.75)}}.mdc-text-field--textarea.mdc-text-field--filled .mdc-text-field__input{margin-top:23px;margin-bottom:9px}.mdc-text-field--textarea.mdc-text-field--filled.mdc-text-field--no-label .mdc-text-field__input{margin-top:16px;margin-bottom:16px}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:0}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-27.25px) scale(1)}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--textarea.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-24.75px) scale(0.75)}.mdc-text-field--textarea.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--textarea.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-textarea-outlined 250ms 1}@keyframes mdc-floating-label-shake-float-above-textarea-outlined{0%{transform:translateX(calc(0 - 0%)) translateY(-24.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 0%)) translateY(-24.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 0%)) translateY(-24.75px) scale(0.75)}100%{transform:translateX(calc(0 - 0%)) translateY(-24.75px) scale(0.75)}}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-text-field__input{margin-top:16px;margin-bottom:16px}.mdc-text-field--textarea.mdc-text-field--outlined .mdc-floating-label{top:18px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field__input{margin-bottom:2px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter{align-self:flex-end;padding:0 16px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter::after{display:inline-block;width:0;height:16px;content:\"\";vertical-align:-16px}.mdc-text-field--textarea.mdc-text-field--with-internal-counter .mdc-text-field-character-counter::before{display:none}.mdc-text-field__resizer{align-self:stretch;display:inline-flex;flex-direction:column;flex-grow:1;max-height:100%;max-width:100%;min-height:56px;min-width:fit-content;min-width:-moz-available;min-width:-webkit-fill-available;overflow:hidden;resize:both}.mdc-text-field--filled .mdc-text-field__resizer{transform:translateY(-1px)}.mdc-text-field--filled .mdc-text-field__resizer .mdc-text-field__input,.mdc-text-field--filled .mdc-text-field__resizer .mdc-text-field-character-counter{transform:translateY(1px)}.mdc-text-field--outlined .mdc-text-field__resizer{transform:translateX(-1px) translateY(-1px)}[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer,.mdc-text-field--outlined .mdc-text-field__resizer[dir=rtl]{transform:translateX(1px) translateY(-1px);}.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input,.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter{transform:translateX(1px) translateY(1px)}[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input,[dir=rtl] .mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter,.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field__input[dir=rtl],.mdc-text-field--outlined .mdc-text-field__resizer .mdc-text-field-character-counter[dir=rtl]{transform:translateX(-1px) translateY(1px);}.mdc-text-field--with-leading-icon{padding-left:0;padding-right:16px}[dir=rtl] .mdc-text-field--with-leading-icon,.mdc-text-field--with-leading-icon[dir=rtl]{padding-left:16px;padding-right:0;}.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 48px);left:48px;right:initial}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label,.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label[dir=rtl]{left:initial;right:48px;}.mdc-text-field--with-leading-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 64px / 0.75)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label{left:36px;right:initial}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label[dir=rtl]{left:initial;right:36px;}.mdc-text-field--with-leading-icon.mdc-text-field--outlined :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch{max-width:calc(100% - 60px)}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above{transform:translateY(-37.25px) translateX(-32px) scale(1)}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above[dir=rtl]{transform:translateY(-37.25px) translateX(32px) scale(1);}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--float-above{font-size:0.75rem}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{transform:translateY(-34.75px) translateX(-32px) scale(0.75)}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl],.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above[dir=rtl]{transform:translateY(-34.75px) translateX(32px) scale(0.75);}.mdc-text-field--with-leading-icon.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:1rem}.mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon{0%{transform:translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - 32px)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - 32px)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - 32px)) translateY(-34.75px) scale(0.75)}}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir=rtl]{}[dir=rtl] .mdc-text-field--with-leading-icon.mdc-text-field--outlined .mdc-floating-label--shake,.mdc-text-field--with-leading-icon.mdc-text-field--outlined[dir=rtl] .mdc-floating-label--shake{animation:mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1}@keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl{0%{transform:translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75)}33%{animation-timing-function:cubic-bezier(0.5, 0, 0.701732, 0.495819);transform:translateX(calc(4% - -32px)) translateY(-34.75px) scale(0.75)}66%{animation-timing-function:cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);transform:translateX(calc(-4% - -32px)) translateY(-34.75px) scale(0.75)}100%{transform:translateX(calc(0 - -32px)) translateY(-34.75px) scale(0.75)}}.mdc-text-field--with-trailing-icon{padding-left:16px;padding-right:0}[dir=rtl] .mdc-text-field--with-trailing-icon,.mdc-text-field--with-trailing-icon[dir=rtl]{padding-left:0;padding-right:16px;}.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 64px)}.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 64px / 0.75)}.mdc-text-field--with-trailing-icon.mdc-text-field--outlined :not(.mdc-notched-outline--notched) .mdc-notched-outline__notch{max-width:calc(100% - 60px)}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon{padding-left:0;padding-right:0}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label{max-width:calc(100% - 96px)}.mdc-text-field--with-leading-icon.mdc-text-field--with-trailing-icon.mdc-text-field--filled .mdc-floating-label--float-above{max-width:calc(100% / 0.75 - 96px / 0.75)}.mdc-text-field-helper-line{display:flex;justify-content:space-between;box-sizing:border-box}.mdc-text-field+.mdc-text-field-helper-line{padding-right:16px;padding-left:16px}.mdc-form-field>.mdc-text-field+label{align-self:flex-start}.mdc-text-field--focused:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(38, 166, 154, 0.87)}.mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--focused .mdc-notched-outline__trailing{border-width:2px}.mdc-text-field--focused+.mdc-text-field-helper-line .mdc-text-field-helper-text:not(.mdc-text-field-helper-text--validation-msg){opacity:1}.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:2px}.mdc-text-field--focused.mdc-text-field--outlined.mdc-text-field--textarea .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:0}.mdc-text-field--invalid:not(.mdc-text-field--disabled):hover .mdc-line-ripple::before,.force-invalid:not(.mdc-text-field--disabled):hover .mdc-line-ripple::before{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after,.force-invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-floating-label,.force-invalid:not(.mdc-text-field--disabled) .mdc-floating-label{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg,.force-invalid:not(.mdc-text-field--disabled)+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid .mdc-text-field__input,.force-invalid .mdc-text-field__input{caret-color:#b00020;caret-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-text-field__icon--trailing,.force-invalid:not(.mdc-text-field--disabled) .mdc-text-field__icon--trailing{color:#b00020;color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::before,.force-invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::before{border-bottom-color:#b00020;border-bottom-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,.force-invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,.force-invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing,.force-invalid:not(.mdc-text-field--disabled) .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading,.force-invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch,.force-invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing,.force-invalid:not(.mdc-text-field--disabled):not(.mdc-text-field--focused):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.force-invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.force-invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field--invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing,.force-invalid:not(.mdc-text-field--disabled).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:#b00020;border-color:var(--mdc-theme-error, #b00020)}.mdc-text-field--invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg,.force-invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg{opacity:1}.mdc-text-field--disabled{pointer-events:none}.mdc-text-field--disabled .mdc-text-field__input{color:rgba(0, 0, 0, 0.38)}@media all{.mdc-text-field--disabled .mdc-text-field__input::placeholder{color:rgba(0, 0, 0, 0.38)}}@media all{.mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder{color:rgba(0, 0, 0, 0.38)}}.mdc-text-field--disabled .mdc-floating-label{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field-character-counter,.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field__icon--leading{color:rgba(0, 0, 0, 0.3)}.mdc-text-field--disabled .mdc-text-field__icon--trailing{color:rgba(0, 0, 0, 0.3)}.mdc-text-field--disabled .mdc-text-field__affix--prefix{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-text-field__affix--suffix{color:rgba(0, 0, 0, 0.38)}.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:rgba(0, 0, 0, 0.06)}.mdc-text-field--disabled .mdc-notched-outline__leading,.mdc-text-field--disabled .mdc-notched-outline__notch,.mdc-text-field--disabled .mdc-notched-outline__trailing{border-color:rgba(0, 0, 0, 0.06)}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__input::placeholder{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__input:-ms-input-placeholder{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-floating-label{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-helper-text{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field-character-counter,.mdc-text-field--disabled+.mdc-text-field-helper-line .mdc-text-field-character-counter{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__icon--leading{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__icon--trailing{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__affix--prefix{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-text-field__affix--suffix{color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-line-ripple::before{border-bottom-color:GrayText}}@media screen and (forced-colors: active), (-ms-high-contrast: active){.mdc-text-field--disabled .mdc-notched-outline__leading,.mdc-text-field--disabled .mdc-notched-outline__notch,.mdc-text-field--disabled .mdc-notched-outline__trailing{border-color:GrayText}}@media screen and (forced-colors: active){.mdc-text-field--disabled .mdc-text-field__input{background-color:Window}.mdc-text-field--disabled .mdc-floating-label{z-index:1}}.mdc-text-field--disabled .mdc-floating-label{cursor:default}.mdc-text-field--disabled.mdc-text-field--filled{background-color:#fafafa}.mdc-text-field--disabled.mdc-text-field--filled .mdc-text-field__ripple{display:none}.mdc-text-field--disabled .mdc-text-field__input{pointer-events:auto}.mdc-text-field--end-aligned .mdc-text-field__input{text-align:right}[dir=rtl] .mdc-text-field--end-aligned .mdc-text-field__input,.mdc-text-field--end-aligned .mdc-text-field__input[dir=rtl]{text-align:left;}[dir=rtl] .mdc-text-field--ltr-text,.mdc-text-field--ltr-text[dir=rtl]{}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__input,[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__input,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix{direction:ltr}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--prefix{padding-left:0;padding-right:2px}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--suffix{padding-left:12px;padding-right:0}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__icon--leading,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__icon--leading{order:1}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--suffix{order:2}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__input,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__input{order:3}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__affix--prefix{order:4}[dir=rtl] .mdc-text-field--ltr-text .mdc-text-field__icon--trailing,.mdc-text-field--ltr-text[dir=rtl] .mdc-text-field__icon--trailing{order:5}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl]{}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__input,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__input{text-align:right}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__affix--prefix,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__affix--prefix{padding-right:12px}[dir=rtl] .mdc-text-field--ltr-text.mdc-text-field--end-aligned .mdc-text-field__affix--suffix,.mdc-text-field--ltr-text.mdc-text-field--end-aligned[dir=rtl] .mdc-text-field__affix--suffix{padding-left:2px}.mdc-text-field-helper-text{-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);display:block;margin-top:0;line-height:normal;margin:0;opacity:0;will-change:opacity;transition:opacity 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-text-field-helper-text::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}.mdc-text-field-helper-text--persistent{transition:none;opacity:1;will-change:initial}.mdc-text-field-character-counter{-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);display:block;margin-top:0;line-height:normal;margin-left:auto;margin-right:0;padding-left:16px;padding-right:0;white-space:nowrap}.mdc-text-field-character-counter::before{display:inline-block;width:0;height:16px;content:\"\";vertical-align:0}[dir=rtl] .mdc-text-field-character-counter,.mdc-text-field-character-counter[dir=rtl]{margin-left:0;margin-right:auto;}[dir=rtl] .mdc-text-field-character-counter,.mdc-text-field-character-counter[dir=rtl]{padding-left:0;padding-right:16px;}.mdc-text-field__icon{align-self:center;cursor:pointer}.mdc-text-field__icon:not([tabindex]),.mdc-text-field__icon[tabindex=\"-1\"]{cursor:default;pointer-events:none}.mdc-text-field__icon svg{display:block}.mdc-text-field__icon--leading{margin-left:16px;margin-right:8px}[dir=rtl] .mdc-text-field__icon--leading,.mdc-text-field__icon--leading[dir=rtl]{margin-left:8px;margin-right:16px;}.mdc-text-field__icon--trailing{padding:12px;margin-left:0px;margin-right:0px}[dir=rtl] .mdc-text-field__icon--trailing,.mdc-text-field__icon--trailing[dir=rtl]{margin-left:0px;margin-right:0px;}.mdc-text-field__icon{align-self:center;cursor:pointer}.mdc-text-field__icon:not([tabindex]),.mdc-text-field__icon[tabindex=\"-1\"]{cursor:default;pointer-events:none}.mdc-text-field__icon svg{display:block}.mdc-text-field__icon--leading{margin-left:16px;margin-right:8px}[dir=rtl] .mdc-text-field__icon--leading,.mdc-text-field__icon--leading[dir=rtl]{margin-left:8px;margin-right:16px;}.mdc-text-field__icon--trailing{padding:12px;margin-left:0px;margin-right:0px}[dir=rtl] .mdc-text-field__icon--trailing,.mdc-text-field__icon--trailing[dir=rtl]{margin-left:0px;margin-right:0px;}.mdc-text-field.mdc-text-field--outlined{transition:background-color 0.2s ease;border-radius:0.25rem}.mdc-text-field.mdc-text-field--outlined .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--outlined .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--outlined .mdc-notched-outline__trailing{transition:border-color 0.2s ease}.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled){background-color:rgba(var(--contrast-200), 0.5)}.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):hover{background-color:rgba(var(--contrast-200), 1)}.mdc-text-field.mdc-text-field--outlined.mdc-text-field--focused{background-color:rgba(var(--contrast-100), 0.8)}.mdc-text-field.mdc-text-field--outlined.mdc-text-field--disabled{background-color:transparent}.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid) .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid) .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid) .mdc-notched-outline__trailing{border-color:rgba(var(--contrast-700), 0.65)}.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):not(.mdc-text-field--focused):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):hover .mdc-notched-outline .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):not(.mdc-text-field--focused):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):hover .mdc-notched-outline .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):not(.mdc-text-field--focused):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid):hover .mdc-notched-outline .mdc-notched-outline__trailing{border-color:rgba(var(--contrast-700), 1)}.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid).mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid).mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--outlined:not(.mdc-text-field--disabled):not(.mdc-text-field--invalid):not(.force-invalid):not(.force-invalid).mdc-text-field--focused .mdc-notched-outline__trailing{border-color:var(--mdc-theme-primary)}.mdc-text-field .mdc-notched-outline__leading,.mdc-text-field .mdc-notched-outline__notch,.mdc-text-field .mdc-notched-outline__trailing,.mdc-text-field.mdc-text-field--focused .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--focused .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--focused .mdc-notched-outline__trailing{border-width:1px}.mdc-text-field.mdc-text-field--focused.mdc-text-field--outlined .mdc-notched-outline--notched .mdc-notched-outline__notch{padding-top:0}.mdc-text-field__icon{color:rgb(var(--contrast-900));flex-shrink:0}.mdc-text-field__input,.mdc-floating-label{font-family:inherit}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-floating-label{color:rgba(var(--contrast-1200), 1)}.mdc-text-field:not(.mdc-text-field--disabled) .mdc-text-field__input{color:rgba(var(--contrast-1400), 1)}.mdc-text-field.mdc-text-field--disabled .mdc-floating-label{color:rgba(var(--contrast-1200), 0.5)}.mdc-text-field.mdc-text-field--disabled .mdc-text-field__input{color:rgba(var(--contrast-1400), 0.5)}.mdc-text-field--outlined.mdc-text-field--with-leading-icon.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined.mdc-text-field--with-leading-icon .mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined.mdc-text-field--textarea.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined.mdc-text-field--textarea .mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined.mdc-notched-outline--upgraded .mdc-floating-label--float-above,.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above{font-size:0.875rem}.mdc-text-field--disabled{background-color:transparent}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .mdc-text-field__input{background-color:transparent;color:rgba(var(--contrast-1400), 1)}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .lime-looks-like-input-value{color:rgba(var(--contrast-1400), 1);opacity:1}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .mdc-floating-label{color:rgba(var(--contrast-1200), 1)}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .mdc-notched-outline__leading,.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .mdc-notched-outline__notch,.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly .mdc-notched-outline__trailing{border-color:transparent}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg,.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.force-invalid+.mdc-text-field-helper-line .mdc-text-field-helper-text--validation-msg{color:var(--lime-error-text-color)}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--invalid .mdc-text-field__icon--trailing,.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.force-invalid .mdc-text-field__icon--trailing{color:var(--lime-error-text-color)}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--with-trailing-icon input.mdc-text-field__input{pointer-events:none}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--with-trailing-icon .mdc-text-field__icon--trailing{width:calc(100% - 1rem);position:absolute;left:0;display:flex;justify-content:flex-end;align-items:center;pointer-events:auto;color:rgba(var(--contrast-1200), 1);border-radius:0.25rem}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--with-trailing-icon .mdc-text-field__icon--trailing limel-icon{width:1.5rem;margin-right:0.5rem}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--with-trailing-icon:hover .mdc-text-field__icon--trailing:hover{box-shadow:var(--button-shadow-hovered)}.mdc-text-field.mdc-text-field--disabled.lime-text-field--readonly.mdc-text-field--with-trailing-icon:hover .mdc-text-field__icon--trailing:active{box-shadow:var(--button-shadow-pressed)}.mdc-text-field__icon{color:rgb(var(--contrast-900));width:1.5rem;height:1.5rem}.lime-empty-value-for-readonly{z-index:1;position:absolute;top:0.875rem;left:1rem}.lime-looks-like-input-value{line-height:1.75rem;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;color:rgba(var(--contrast-1400), 1);font-size:0.875rem;font-weight:400;letter-spacing:0.009375em}.mdc-text-field--disabled .lime-looks-like-input-value{cursor:not-allowed;opacity:0.4}:host(limel-chip-set){isolation:isolate}.mdc-chip{font-family:inherit}.mdc-chip{transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-normal);max-width:100%;min-width:2rem;padding:0 0.0625rem;display:inline-grid;grid-auto-flow:column}.mdc-chip:hover{color:var(--mdc-theme-on-surface);background-color:var(--lime-elevated-surface-background-color);box-shadow:var(--button-shadow-hovered)}.mdc-chip:active{background-color:var(--mdc-theme-surface);box-shadow:var(--button-shadow-inset-pressed);transform:translate3d(0, 0.05rem, 0)}.mdc-chip span[role=gridcell]{min-width:0}.mdc-chip span[role=gridcell]:only-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip span[role=gridcell]:first-child .mdc-chip__text{padding-left:0.75rem}.mdc-chip span[role=gridcell] a[role=button]:focus-visible:after,.mdc-chip span[role=gridcell] span[role=checkbox]:focus-visible:after{content:\"\";display:block;position:absolute;top:0;right:0;bottom:0;left:0;border-radius:3.75rem;box-shadow:var(--shadow-depth-8-focused)}.mdc-chip.mdc-chip--selected{color:var(--mdc-theme-primary) !important;background-color:var(--mdc-theme-surface) !important;box-shadow:var(--button-shadow-inset)}.mdc-chip.mdc-chip--selected:active{box-shadow:var(--button-shadow-inset-pressed)}.mdc-chip.mdc-chip--selected .mdc-chip__icon--leading{color:var(--mdc-theme-primary) !important}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip__checkmark{margin-right:0.25rem;margin-left:0.5rem}limel-badge{margin-right:0.25rem;margin-left:-0.25rem}.mdc-chip__text{overflow:hidden;text-overflow:ellipsis;display:block;padding:0 0.75rem 0 0.25rem;color:inherit;text-decoration:none}.mdc-chip__text:focus,.mdc-chip__text:focus-visible{outline:none}limel-icon.mdc-chip__icon.mdc-chip__icon--leading{background-color:var(--icon-background-color, transparent);margin:0 !important;color:var(--icon-color, rgb(var(--contrast-1100)))}.mdc-chip-set{align-items:center;min-height:3.5rem;position:relative}.mdc-chip-set.chip-set--with-label .lime-floating-label--float-above{padding-left:0.25rem}.mdc-chip-set.mdc-chip-set--input{padding:0.5rem;width:100%}.mdc-chip-set.mdc-chip-set--input .mdc-chip--selected{box-shadow:var(--shadow-depth-8-error)}.mdc-chip-set.mdc-chip-set--input .mdc-chip--selected .mdc-chip__icon--trailing{color:rgb(var(--color-red-dark));background-color:rgba(var(--color-red-default), 0.2)}.mdc-chip-set.mdc-chip-set--input .mdc-chip--selected .mdc-chip__icon--trailing svg{transform:scale(0.7)}.mdc-chip-set.has-clear-all-button.mdc-chip-set--input{padding-right:2rem}.mdc-chip__icon.mdc-chip__icon--trailing{transition:background-color 0.2s ease, color 0.2s ease;color:var(--mdc-theme-on-surface);margin-left:0;margin-right:0.3125rem;width:1.375rem;height:1.375rem}.mdc-chip__icon.mdc-chip__icon--trailing:hover{background-color:rgba(var(--color-red-default), 0.2)}.mdc-chip__icon.mdc-chip__icon--trailing:hover svg{transform:scale(0.7)}.mdc-chip__icon.mdc-chip__icon--trailing svg{transition:transform 0.2s ease;display:block;transform:scale(0.9)}.mdc-text-field{height:auto;cursor:text}.mdc-text-field .mdc-text-field__input{width:auto;height:2.25rem;line-height:2.25rem;padding:0 0.75rem;flex-grow:1;flex-shrink:0}.mdc-text-field .mdc-text-field__input::placeholder{color:rgb(var(--contrast-900)) !important}.mdc-text-field .mdc-text-field__input.hidden{transition:all 0s;opacity:0;position:absolute;z-index:-100}.mdc-text-field .mdc-text-field__input[type=search]{-webkit-appearance:textfield;background-color:transparent}.mdc-text-field .mdc-text-field__input[type=search]::-webkit-search-cancel-button{display:none}.mdc-text-field--disabled .mdc-chip{pointer-events:all}.mdc-text-field--disabled .mdc-chip.disabled{cursor:not-allowed;opacity:0.4;pointer-events:none}.chip-set__label{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;width:120%;top:0.8125rem;padding-left:1.25rem}.lime-notched-outline--notched .mdc-notched-outline__notch{border-top:1px solid transparent !important}.lime-notched-outline--notched .mdc-notched-outline__notch .lime-floating-label--float-above{top:1.6875rem;transform:translateY(-34.75px) scale(0.75);font-size:0.875rem}.clear-all-button{transition:color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease-out;cursor:pointer;color:var(--mdc-theme-on-surface);background-color:rgb(var(--contrast-900));cursor:pointer;height:1.25rem;width:1.25rem;border-radius:50%;background-repeat:no-repeat;background-position:center;background-size:0.75rem;background-image:url(\"data:image/svg+xml; utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><defs/><path fill='rgb(255,255,255)' d='M7.219 5.781L5.78 7.22 14.563 16 5.78 24.781 7.22 26.22 16 17.437l8.781 8.782 1.438-1.438L17.437 16l8.782-8.781L24.78 5.78 16 14.563z'/></svg>\");position:absolute;right:0.5rem;top:1.125rem;opacity:0}.clear-all-button:hover{color:var(--mdc-theme-on-surface);background-color:rgb(var(--contrast-1100));box-shadow:var(--button-shadow-hovered)}.clear-all-button:active{box-shadow:var(--button-shadow-pressed);transform:translate3d(0, 0.08rem, 0)}.clear-all-button:focus{outline:none}.clear-all-button:focus-visible{outline:none;box-shadow:var(--shadow-depth-8-focused)}.clear-all-button:focus,.has-chips:not(.mdc-text-field--disabled):hover .clear-all-button,.has-chips:not(.mdc-text-field--disabled).mdc-text-field--focused .clear-all-button{opacity:1;outline:none}:not(.has-chips) .clear-all-button,.has-chips.mdc-text-field--disabled .clear-all-button{display:none}.has-leading-icon:not(.has-chips) .mdc-text-field__input{padding-left:2.5rem}.has-leading-icon:not(.has-chips) .mdc-floating-label:not(.lime-floating-label--float-above){left:2.5rem}.has-leading-icon:not(.has-chips) .mdc-floating-label.mdc-floating-label--float-above{left:0.25rem}.has-leading-icon .mdc-chip:first-of-type{margin-left:40px}.has-leading-icon .search-icon{transition:transform 0.2s ease;position:absolute;top:1rem;left:1rem}.has-leading-icon limel-icon{background-color:transparent}.delimiter{opacity:0.5;padding:0 0.125rem;color:var(--mdc-theme-on-surface)}:host(.is-file-picker.shows-dropzone[readonly]) .mdc-text-field:not(.has-chips) .mdc-notched-outline:before,:host(.is-file-picker.shows-dropzone[readonly]) .mdc-text-field:not(.has-chips) .mdc-notched-outline:after{display:none}:host{--dropzone-margin:0.25rem;--dropzone-color:rgb(var(--contrast-600))}:host(.highlight-dropzone){--dropzone-color:rgb(var(--color-lime-light))}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips) .mdc-notched-outline:before,:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips) .mdc-notched-outline:after{box-sizing:border-box;position:absolute;margin:auto;top:var(--dropzone-margin);right:var(--dropzone-margin);bottom:var(--dropzone-margin)}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips) .mdc-notched-outline:before{content:attr(dropzone-tip);display:inline-flex;align-items:center;justify-content:flex-end;padding:0 0.75rem;font-size:0.8125rem;line-height:1;color:var(--mdc-theme-text-secondary-on-background)}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips) .mdc-notched-outline:after{content:\"\";left:var(--dropzone-margin);border-radius:0.375rem;border:2px dashed var(--dropzone-color);cursor:pointer}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips).mdc-text-field--disabled .mdc-notched-outline:before,:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips).mdc-text-field--disabled .mdc-notched-outline:after{cursor:not-allowed;opacity:0.4;pointer-events:none}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips):not(.lime-text-field--readonly) .mdc-notched-outline:before{width:50%;text-align:right}:host(.is-file-picker.shows-dropzone) .mdc-text-field:not(.has-chips):not(.lime-text-field--readonly) .mdc-notched-outline .mdc-notched-outline__notch{max-width:40%}:host(limel-chip-set:focus),:host(limel-chip-set:focus-visible),:host(limel-chip-set:focus-within),:host(limel-chip-set[invalid]:not([invalid=false])),:host(limel-chip-set[invalid=true]){--limel-h-l-grid-template-rows-transition-speed:0.46s;--limel-h-l-grid-template-rows:1fr}:host(limel-chip-set){--limel-h-l-grid-template-rows-transition-speed:0.3s;--limel-h-l-grid-template-rows:0fr}:host(limel-chip-set:focus) limel-helper-line,:host(limel-chip-set:focus-visible) limel-helper-line,:host(limel-chip-set:focus-within) limel-helper-line,:host(limel-chip-set:hover) limel-helper-line{will-change:grid-template-rows}";
|
|
1679
|
-
|
|
1680
|
-
const SELECTED_CHIP_CLASS = 'mdc-chip--selected';
|
|
1681
|
-
const INPUT_FIELD_TABINDEX = 1;
|
|
1682
|
-
const ChipSet = class {
|
|
1683
|
-
constructor(hostRef) {
|
|
1684
|
-
index.registerInstance(this, hostRef);
|
|
1685
|
-
this.interact = index.createEvent(this, "interact", 7);
|
|
1686
|
-
this.change = index.createEvent(this, "change", 7);
|
|
1687
|
-
this.startEdit = index.createEvent(this, "startEdit", 7);
|
|
1688
|
-
this.stopEdit = index.createEvent(this, "stopEdit", 7);
|
|
1689
|
-
this.input = index.createEvent(this, "input", 7);
|
|
1690
|
-
this.handleKeyDown = handleKeyboardEvent;
|
|
1691
|
-
this.renderEmptyValueForReadonly = () => {
|
|
1692
|
-
if (this.readonly && this.value.length === 0) {
|
|
1693
|
-
return (index.h("span", { class: "lime-empty-value-for-readonly lime-looks-like-input-value" }, "\u2013"));
|
|
1694
|
-
}
|
|
1695
|
-
};
|
|
1696
|
-
this.floatLabelAbove = () => {
|
|
1697
|
-
if (!!this.value.length || this.editMode || this.readonly) {
|
|
1698
|
-
return true;
|
|
1699
|
-
}
|
|
1700
|
-
};
|
|
1701
|
-
this.dropZoneTip = () => {
|
|
1702
|
-
return translations.translate.get('file.drag-and-drop-tips', this.language);
|
|
1703
|
-
};
|
|
1704
|
-
this.hasHelperText = () => {
|
|
1705
|
-
return this.helperText !== null && this.helperText !== undefined;
|
|
1706
|
-
};
|
|
1707
|
-
this.renderHelperLine = () => {
|
|
1708
|
-
if (!this.maxItems && !this.hasHelperText()) {
|
|
1709
|
-
return;
|
|
1710
|
-
}
|
|
1711
|
-
return (index.h("limel-helper-line", { length: this.value.length, maxLength: this.maxItems, helperText: this.helperText, invalid: this.isInvalid() }));
|
|
1712
|
-
};
|
|
1713
|
-
this.clearAllChipsLabel = () => {
|
|
1714
|
-
return translations.translate.get('chip-set.clear-all', this.language);
|
|
1715
|
-
};
|
|
1716
|
-
this.removeChipLabel = () => {
|
|
1717
|
-
return translations.translate.get('chip-set.remove-chip', this.language);
|
|
1718
|
-
};
|
|
1719
|
-
this.value = [];
|
|
1720
|
-
this.type = undefined;
|
|
1721
|
-
this.label = undefined;
|
|
1722
|
-
this.helperText = undefined;
|
|
1723
|
-
this.disabled = false;
|
|
1724
|
-
this.readonly = false;
|
|
1725
|
-
this.invalid = false;
|
|
1726
|
-
this.inputType = 'text';
|
|
1727
|
-
this.maxItems = undefined;
|
|
1728
|
-
this.required = false;
|
|
1729
|
-
this.searchLabel = undefined;
|
|
1730
|
-
this.emptyInputOnBlur = true;
|
|
1731
|
-
this.clearAllButton = true;
|
|
1732
|
-
this.leadingIcon = null;
|
|
1733
|
-
this.delimiter = null;
|
|
1734
|
-
this.language = 'en';
|
|
1735
|
-
this.editMode = false;
|
|
1736
|
-
this.textValue = '';
|
|
1737
|
-
this.blurred = false;
|
|
1738
|
-
this.inputChipIndexSelected = null;
|
|
1739
|
-
this.renderChip = this.renderChip.bind(this);
|
|
1740
|
-
this.renderInputChip = this.renderInputChip.bind(this);
|
|
1741
|
-
this.isFull = this.isFull.bind(this);
|
|
1742
|
-
this.handleInteractionEvent = this.handleInteractionEvent.bind(this);
|
|
1743
|
-
this.handleSelection = this.handleSelection.bind(this);
|
|
1744
|
-
this.handleTextFieldFocus = this.handleTextFieldFocus.bind(this);
|
|
1745
|
-
this.handleInputBlur = this.handleInputBlur.bind(this);
|
|
1746
|
-
this.handleTextInput = this.handleTextInput.bind(this);
|
|
1747
|
-
this.inputFieldOnChange = this.inputFieldOnChange.bind(this);
|
|
1748
|
-
this.handleKeyDown = this.handleKeyDown.bind(this);
|
|
1749
|
-
this.inputHidden = this.inputHidden.bind(this);
|
|
1750
|
-
this.handleDeleteAllIconClick =
|
|
1751
|
-
this.handleDeleteAllIconClick.bind(this);
|
|
1752
|
-
this.renderDelimiter = this.renderDelimiter.bind(this);
|
|
1753
|
-
}
|
|
1754
|
-
/**
|
|
1755
|
-
* Used to find out whether the chip-set is in edit mode.
|
|
1756
|
-
*
|
|
1757
|
-
* @returns `true` if the chip-set is in edit mode, `false` otherwise.
|
|
1758
|
-
*/
|
|
1759
|
-
async getEditMode() {
|
|
1760
|
-
return this.editMode;
|
|
1761
|
-
}
|
|
1762
|
-
/**
|
|
1763
|
-
* Used to set focus to the chip-set input field.
|
|
1764
|
-
*
|
|
1765
|
-
* @param emptyInput - if `true`, any text in the input is discarded
|
|
1766
|
-
* @returns does not return anything, but methods have to be async
|
|
1767
|
-
*/
|
|
1768
|
-
async setFocus(emptyInput = false) {
|
|
1769
|
-
if (this.disabled || this.readonly) {
|
|
1770
|
-
return;
|
|
1771
|
-
}
|
|
1772
|
-
this.editMode = true;
|
|
1773
|
-
if (emptyInput) {
|
|
1774
|
-
this.textValue = '';
|
|
1775
|
-
}
|
|
1776
|
-
this.host.shadowRoot.querySelector('input').focus();
|
|
1777
|
-
this.startEdit.emit();
|
|
1778
|
-
}
|
|
1779
|
-
/**
|
|
1780
|
-
* Used to empty the input field. Used in conjunction with `emptyInputOnBlur` to let the
|
|
1781
|
-
* consumer control when the input is emptied.
|
|
1782
|
-
*
|
|
1783
|
-
* @returns does not return anything, but methods have to be async
|
|
1784
|
-
*/
|
|
1785
|
-
async emptyInput() {
|
|
1786
|
-
this.syncEmptyInput();
|
|
1787
|
-
}
|
|
1788
|
-
componentDidLoad() {
|
|
1789
|
-
this.triggerIconColorWarning(this.value);
|
|
1790
|
-
if (this.type === 'input') {
|
|
1791
|
-
this.mdcTextField = new component$2.MDCTextField(this.host.shadowRoot.querySelector('.mdc-text-field'));
|
|
1792
|
-
}
|
|
1793
|
-
this.createMDCChipSet();
|
|
1794
|
-
}
|
|
1795
|
-
componentWillUpdate() {
|
|
1796
|
-
this.destroyMDCChipSet();
|
|
1797
|
-
}
|
|
1798
|
-
componentDidUpdate() {
|
|
1799
|
-
this.createMDCChipSet();
|
|
1800
|
-
const input = this.host.shadowRoot.querySelector('input');
|
|
1801
|
-
if (input && this.editMode) {
|
|
1802
|
-
input.focus();
|
|
1803
|
-
}
|
|
1804
|
-
}
|
|
1805
|
-
disconnectedCallback() {
|
|
1806
|
-
this.destroyMDCChipSet();
|
|
1807
|
-
if (this.mdcTextField) {
|
|
1808
|
-
this.mdcTextField.destroy();
|
|
1809
|
-
}
|
|
1810
|
-
}
|
|
1811
|
-
render() {
|
|
1812
|
-
if (this.type === 'input') {
|
|
1813
|
-
return this.renderInputChips();
|
|
1814
|
-
}
|
|
1815
|
-
const classes = {
|
|
1816
|
-
'mdc-chip-set': true,
|
|
1817
|
-
disabled: this.disabled || this.readonly,
|
|
1818
|
-
'mdc-text-field--with-trailing-icon': true,
|
|
1819
|
-
};
|
|
1820
|
-
if (this.type) {
|
|
1821
|
-
classes[`mdc-chip-set--${this.type}`] = true;
|
|
1822
|
-
}
|
|
1823
|
-
const chipSetLabel = this.renderChipSetLabel();
|
|
1824
|
-
if (chipSetLabel) {
|
|
1825
|
-
classes['chip-set--with-label'] = true;
|
|
1826
|
-
}
|
|
1827
|
-
return (index.h("div", { class: classes, role: "grid" }, chipSetLabel, this.value.map(this.renderChip), this.renderHelperLine()));
|
|
1828
|
-
}
|
|
1829
|
-
handleChangeChips(newValue, oldValue) {
|
|
1830
|
-
if (isEqual.isEqual(newValue, oldValue)) {
|
|
1831
|
-
return;
|
|
1832
|
-
}
|
|
1833
|
-
this.syncEmptyInput();
|
|
1834
|
-
}
|
|
1835
|
-
createMDCChipSet() {
|
|
1836
|
-
this.mdcChipSet = new MDCChipSet(this.host.shadowRoot.querySelector('.mdc-chip-set'));
|
|
1837
|
-
if (!this.type || this.type === 'input') {
|
|
1838
|
-
this.mdcChipSet.listen('MDCChip:interaction', this.handleInteractionEvent);
|
|
1839
|
-
}
|
|
1840
|
-
if (this.type === 'choice' || this.type === 'filter') {
|
|
1841
|
-
this.mdcChipSet.listen('MDCChip:selection', this.handleSelection);
|
|
1842
|
-
}
|
|
1843
|
-
}
|
|
1844
|
-
destroyMDCChipSet() {
|
|
1845
|
-
if (this.mdcChipSet) {
|
|
1846
|
-
this.mdcChipSet.unlisten('MDCChip:interaction', this.handleInteractionEvent);
|
|
1847
|
-
this.mdcChipSet.unlisten('MDCChip:selection', this.handleSelection);
|
|
1848
|
-
this.mdcChipSet.destroy();
|
|
1849
|
-
}
|
|
1850
|
-
}
|
|
1851
|
-
renderChipSetLabel() {
|
|
1852
|
-
if (!this.label) {
|
|
1853
|
-
return;
|
|
1854
|
-
}
|
|
1855
|
-
return (index.h("label", { class: "chip-set__label mdc-floating-label mdc-floating-label--float-above" }, this.label));
|
|
1856
|
-
}
|
|
1857
|
-
renderInputChips() {
|
|
1858
|
-
return [
|
|
1859
|
-
index.h("div", { class: {
|
|
1860
|
-
'mdc-text-field mdc-text-field--outlined': true,
|
|
1861
|
-
'mdc-chip-set mdc-chip-set--input': true,
|
|
1862
|
-
'force-invalid': this.isInvalid(),
|
|
1863
|
-
'mdc-text-field--disabled': this.readonly || this.disabled,
|
|
1864
|
-
'lime-text-field--readonly': this.readonly,
|
|
1865
|
-
'has-chips mdc-text-field--label-floating': this.value.length !== 0,
|
|
1866
|
-
'has-leading-icon': this.leadingIcon !== null,
|
|
1867
|
-
'has-clear-all-button': this.clearAllButton,
|
|
1868
|
-
}, onClick: this.handleTextFieldFocus }, this.value.map(this.renderInputChip), index.h("input", { tabIndex: INPUT_FIELD_TABINDEX, type: this.inputType, id: "input-element", disabled: this.readonly || this.disabled, class: {
|
|
1869
|
-
'mdc-text-field__input': true,
|
|
1870
|
-
hidden: this.inputHidden(),
|
|
1871
|
-
}, value: this.textValue, onBlur: this.handleInputBlur, onFocus: this.handleTextFieldFocus, onKeyDown: this.handleKeyDown, onInput: this.handleTextInput,
|
|
1872
|
-
// Some browsers emit a change event on input elements, we need to stop
|
|
1873
|
-
// that event from propagating since we are emitting our own change event
|
|
1874
|
-
onChange: this.inputFieldOnChange, placeholder: this.isFull() ? '' : this.searchLabel, readonly: this.isFull() }), index.h("div", { class: {
|
|
1875
|
-
'mdc-notched-outline': true,
|
|
1876
|
-
'mdc-notched-outline--upgraded': true,
|
|
1877
|
-
'mdc-text-field--required': this.required,
|
|
1878
|
-
'lime-notched-outline--notched': this.floatLabelAbove(),
|
|
1879
|
-
}, "dropzone-tip": this.dropZoneTip() }, index.h("div", { class: "mdc-notched-outline__leading" }), this.renderLabel(), index.h("div", { class: "mdc-notched-outline__trailing" })), this.renderLeadingIcon(), this.renderEmptyValueForReadonly(), this.renderClearAllChipsButton()),
|
|
1880
|
-
this.renderHelperLine(),
|
|
1881
|
-
];
|
|
1882
|
-
}
|
|
1883
|
-
renderLabel() {
|
|
1884
|
-
const labelClassList = {
|
|
1885
|
-
'mdc-floating-label': true,
|
|
1886
|
-
'mdc-text-field--disabled': this.readonly || this.disabled,
|
|
1887
|
-
'mdc-floating-label--required': this.required,
|
|
1888
|
-
'lime-floating-label--float-above': this.floatLabelAbove(),
|
|
1889
|
-
};
|
|
1890
|
-
if (!this.label) {
|
|
1891
|
-
return;
|
|
1892
|
-
}
|
|
1893
|
-
return (index.h("div", { class: "mdc-notched-outline__notch" }, index.h("label", { class: labelClassList, htmlFor: "input-element" }, this.label)));
|
|
1894
|
-
}
|
|
1895
|
-
isFull() {
|
|
1896
|
-
return !!this.maxItems && this.value.length >= this.maxItems;
|
|
1897
|
-
}
|
|
1898
|
-
isInvalid() {
|
|
1899
|
-
if (this.readonly) {
|
|
1900
|
-
// A readonly field can never be invalid.
|
|
1901
|
-
return false;
|
|
1902
|
-
}
|
|
1903
|
-
if (this.invalid) {
|
|
1904
|
-
return true;
|
|
1905
|
-
}
|
|
1906
|
-
if (!this.required) {
|
|
1907
|
-
return false;
|
|
1908
|
-
}
|
|
1909
|
-
if (!this.blurred) {
|
|
1910
|
-
return false;
|
|
1911
|
-
}
|
|
1912
|
-
return !this.value || !this.value.length;
|
|
1913
|
-
}
|
|
1914
|
-
inputFieldOnChange(event) {
|
|
1915
|
-
event.stopPropagation();
|
|
1916
|
-
}
|
|
1917
|
-
/**
|
|
1918
|
-
* Enter edit mode when the text field receives focus. When editMode is true, the input element will be visible
|
|
1919
|
-
*/
|
|
1920
|
-
handleTextFieldFocus() {
|
|
1921
|
-
if (this.disabled || this.readonly) {
|
|
1922
|
-
return;
|
|
1923
|
-
}
|
|
1924
|
-
if (this.editMode) {
|
|
1925
|
-
return;
|
|
1926
|
-
}
|
|
1927
|
-
this.editMode = true;
|
|
1928
|
-
this.startEdit.emit();
|
|
1929
|
-
}
|
|
1930
|
-
/**
|
|
1931
|
-
* Exit edit mode when the input element loses focus. This makes sure the input element does not take up any
|
|
1932
|
-
* additional space when the user it not typing anything
|
|
1933
|
-
*/
|
|
1934
|
-
handleInputBlur() {
|
|
1935
|
-
if (this.emptyInputOnBlur) {
|
|
1936
|
-
this.syncEmptyInput();
|
|
1937
|
-
}
|
|
1938
|
-
this.editMode = false;
|
|
1939
|
-
this.blurred = true;
|
|
1940
|
-
this.inputChipIndexSelected = null;
|
|
1941
|
-
// This timeout is needed in order to let a new element receive focus
|
|
1942
|
-
setTimeout(() => {
|
|
1943
|
-
this.stopEdit.emit();
|
|
1944
|
-
}, 0);
|
|
1945
|
-
}
|
|
1946
|
-
syncEmptyInput() {
|
|
1947
|
-
this.textValue = '';
|
|
1948
|
-
}
|
|
1949
|
-
inputHidden() {
|
|
1950
|
-
if (this.editMode) {
|
|
1951
|
-
return this.isFull();
|
|
1952
|
-
}
|
|
1953
|
-
// If there are chips in the picker, hide the input to avoid the input
|
|
1954
|
-
// being placed on a new line and adding ugly space beneath the chips.
|
|
1955
|
-
// If there are no chips, show the input, or the picker will look weird.
|
|
1956
|
-
return !!(this.value && this.value.length);
|
|
1957
|
-
}
|
|
1958
|
-
handleTextInput(event) {
|
|
1959
|
-
event.stopPropagation();
|
|
1960
|
-
this.inputChipIndexSelected = null;
|
|
1961
|
-
this.textValue = event.target.value;
|
|
1962
|
-
this.input.emit(event.target.value && event.target.value.trim());
|
|
1963
|
-
}
|
|
1964
|
-
handleInteractionEvent(event) {
|
|
1965
|
-
const chip = this.value.find((item) => {
|
|
1966
|
-
return `${item.id}` === event.detail.chipId;
|
|
1967
|
-
});
|
|
1968
|
-
this.emitInteraction(chip);
|
|
1969
|
-
}
|
|
1970
|
-
emitInteraction(chip) {
|
|
1971
|
-
this.interact.emit(chip);
|
|
1972
|
-
}
|
|
1973
|
-
handleSelection(event) {
|
|
1974
|
-
let chip = this.value.find((item) => {
|
|
1975
|
-
return `${item.id}` === event.detail.chipId;
|
|
1976
|
-
});
|
|
1977
|
-
chip = Object.assign(Object.assign({}, chip), { selected: event.detail.selected });
|
|
1978
|
-
this.change.emit(chip);
|
|
1979
|
-
}
|
|
1980
|
-
removeChip(id) {
|
|
1981
|
-
const newValue = this.value.filter((chip) => {
|
|
1982
|
-
return `${chip.id}` !== `${id}`;
|
|
1983
|
-
});
|
|
1984
|
-
this.change.emit(newValue);
|
|
1985
|
-
}
|
|
1986
|
-
renderChip(chip) {
|
|
1987
|
-
if (this.type === 'filter') {
|
|
1988
|
-
return this.renderFilterChip(chip);
|
|
1989
|
-
}
|
|
1990
|
-
return this.renderDefaultChip(chip);
|
|
1991
|
-
}
|
|
1992
|
-
renderDefaultChip(chip) {
|
|
1993
|
-
return (index.h("div", { class: `mdc-chip ${chip.selected ? SELECTED_CHIP_CLASS : ''}`, role: "row", id: `${chip.id}` }, chip.icon ? this.renderChipIcon(chip) : null, chip.text ? this.renderChipLabel(chip) : null));
|
|
1994
|
-
}
|
|
1995
|
-
renderChipLabel(chip) {
|
|
1996
|
-
const attributes = {};
|
|
1997
|
-
if (chip.href) {
|
|
1998
|
-
attributes.href = linkHelper.getHref(chip.href);
|
|
1999
|
-
attributes.target = linkHelper.getTarget(chip.href);
|
|
2000
|
-
}
|
|
2001
|
-
return (index.h("span", { role: "gridcell" }, index.h("a", Object.assign({ role: "button", tabindex: this.disabled ? '-1' : '0', class: "mdc-chip__text" }, attributes), chip.text)));
|
|
2002
|
-
}
|
|
2003
|
-
renderFilterChip(chip) {
|
|
2004
|
-
return (index.h("div", { class: `mdc-chip ${chip.selected ? SELECTED_CHIP_CLASS : ''}`, role: "row", id: `${chip.id}` }, index.h("span", { class: "mdc-chip__checkmark" }, index.h("svg", { class: "mdc-chip__checkmark-svg", viewBox: "-2 -3 30 30" }, index.h("path", { class: "mdc-chip__checkmark-path", fill: "none", stroke: "currentColor", d: "M1.73,12.91 8.1,19.28 22.79,4.59" }))), index.h("span", { role: "gridcell" }, index.h("span", { role: "checkbox", tabindex: this.disabled ? '-1' : '0', "aria-checked": "false", class: "mdc-chip__text" }, chip.text)), this.renderBadge(chip)));
|
|
2005
|
-
}
|
|
2006
|
-
renderInputChip(chip, index$1) {
|
|
2007
|
-
return [
|
|
2008
|
-
index.h("div", { class: {
|
|
2009
|
-
'mdc-chip': true,
|
|
2010
|
-
'mdc-chip--selected': this.inputChipIndexSelected === index$1,
|
|
2011
|
-
disabled: this.disabled,
|
|
2012
|
-
}, role: "row", id: `${chip.id}`, onClick: this.catchInputChipClicks }, chip.icon ? this.renderChipIcon(chip) : null, this.renderChipLabel(chip), this.renderChipRemoveButton(chip)),
|
|
2013
|
-
this.renderDelimiter(),
|
|
2014
|
-
];
|
|
2015
|
-
}
|
|
2016
|
-
catchInputChipClicks(event) {
|
|
2017
|
-
event.stopPropagation();
|
|
2018
|
-
}
|
|
2019
|
-
renderChipIcon(chip) {
|
|
2020
|
-
const name = getIconProps.getIconName(chip.icon);
|
|
2021
|
-
const color = getIconProps.getIconColor(chip.icon, chip.iconFillColor);
|
|
2022
|
-
const backgroundColor = getIconProps.getIconBackgroundColor(chip.icon, chip.iconBackgroundColor);
|
|
2023
|
-
const title = getIconProps.getIconTitle(chip.icon, chip.iconTitle);
|
|
2024
|
-
const style = {};
|
|
2025
|
-
if (color) {
|
|
2026
|
-
style['--icon-color'] = color;
|
|
2027
|
-
}
|
|
2028
|
-
if (backgroundColor) {
|
|
2029
|
-
style['--icon-background-color'] = backgroundColor;
|
|
2030
|
-
}
|
|
2031
|
-
return (index.h("limel-icon", { class: "mdc-chip__icon mdc-chip__icon--leading", name: name, style: style, size: "small", badge: true, title: title }));
|
|
2032
|
-
}
|
|
2033
|
-
renderLeadingIcon() {
|
|
2034
|
-
if (!this.leadingIcon) {
|
|
2035
|
-
return;
|
|
2036
|
-
}
|
|
2037
|
-
return (index.h("i", { class: "mdc-text-field__icon search-icon" }, index.h("limel-icon", { name: this.leadingIcon })));
|
|
2038
|
-
}
|
|
2039
|
-
renderChipRemoveButton(chip) {
|
|
2040
|
-
if (!chip.removable || this.readonly || this.disabled) {
|
|
2041
|
-
return;
|
|
2042
|
-
}
|
|
2043
|
-
const svgData = `<svg style="height:100%;width:100%;" width="32" height="32" x="0px" y="0px" viewBox="0 0 32 32" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">
|
|
2044
|
-
<line fill="none" id="svg_1" stroke="currentColor" stroke-width="2" x1="8" x2="24" y1="8" y2="24"/>
|
|
2045
|
-
<line fill="none" id="svg_2" stroke="currentColor" stroke-width="2" x1="24" x2="8" y1="8" y2="24"/>
|
|
2046
|
-
</svg>`;
|
|
2047
|
-
const removeFunc = (event) => {
|
|
2048
|
-
event.stopPropagation();
|
|
2049
|
-
this.removeChip(chip.id);
|
|
2050
|
-
};
|
|
2051
|
-
return (index.h("button", { class: "mdc-chip__icon mdc-chip__icon--trailing mdc-deprecated-chip-trailing-action", "aria-label": this.removeChipLabel, tabindex: "-1", innerHTML: svgData, onClick: removeFunc }));
|
|
2052
|
-
}
|
|
2053
|
-
renderClearAllChipsButton() {
|
|
2054
|
-
if (this.disabled || this.readonly || !this.clearAllButton) {
|
|
2055
|
-
return;
|
|
2056
|
-
}
|
|
2057
|
-
return (index.h("a", { href: "", onClick: this.handleDeleteAllIconClick, class: "mdc-text-field__icon clear-all-button", tabindex: "0", role: "button", title: this.clearAllChipsLabel(), "aria-label": this.clearAllChipsLabel() }));
|
|
2058
|
-
}
|
|
2059
|
-
handleDeleteAllIconClick(event) {
|
|
2060
|
-
event.preventDefault();
|
|
2061
|
-
this.change.emit([]);
|
|
2062
|
-
}
|
|
2063
|
-
renderDelimiter() {
|
|
2064
|
-
if (!this.delimiter) {
|
|
2065
|
-
return;
|
|
2066
|
-
}
|
|
2067
|
-
return index.h("div", { class: "delimiter" }, this.delimiter);
|
|
2068
|
-
}
|
|
2069
|
-
renderBadge(chip) {
|
|
2070
|
-
if (!chip.badge) {
|
|
2071
|
-
return;
|
|
2072
|
-
}
|
|
2073
|
-
return index.h("limel-badge", { label: chip.badge });
|
|
2074
|
-
}
|
|
2075
|
-
triggerIconColorWarning(value) {
|
|
2076
|
-
for (const chip of value) {
|
|
2077
|
-
if (chip.icon &&
|
|
2078
|
-
(chip.iconFillColor ||
|
|
2079
|
-
chip.iconBackgroundColor ||
|
|
2080
|
-
chip.iconTitle)) {
|
|
2081
|
-
/* eslint-disable-next-line no-console */
|
|
2082
|
-
console.warn("The `iconFillColor`, `iconBackgroundColor`, and `iconTitle` props are deprecated now! Use the new `Icon` interface and instead of `iconColor: 'color-name', `iconBackgroundColor: 'color-name', and `iconTitle: 'title'`, write `icon { name: 'icon-name', color: 'color-name', backgroundColor: 'color-name', title: 'title' }`.");
|
|
2083
|
-
}
|
|
2084
|
-
}
|
|
2085
|
-
}
|
|
2086
|
-
get host() { return index.getElement(this); }
|
|
2087
|
-
static get watchers() { return {
|
|
2088
|
-
"value": ["handleChangeChips"]
|
|
2089
|
-
}; }
|
|
2090
|
-
};
|
|
2091
|
-
ChipSet.style = chipSetCss;
|
|
2092
|
-
|
|
2093
|
-
exports.limel_chip_set = ChipSet;
|
|
2094
|
-
|
|
2095
|
-
//# sourceMappingURL=limel-chip-set.cjs.entry.js.map
|