@momentum-design/components 0.121.3 → 0.121.5
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/dist/browser/index.js +97 -97
- package/dist/browser/index.js.map +3 -3
- package/dist/components/accordion/accordion.component.d.ts +8 -0
- package/dist/components/accordion/accordion.component.js +10 -2
- package/dist/components/slider/slider.component.d.ts +4 -0
- package/dist/components/slider/slider.component.js +9 -1
- package/dist/components/slider/slider.types.d.ts +1 -1
- package/dist/custom-elements.json +287 -233
- package/dist/index.d.ts +2 -1
- package/dist/react/index.d.ts +1 -1
- package/dist/react/index.js +1 -1
- package/package.json +1 -1
|
@@ -54,6 +54,14 @@ declare class Accordion extends AccordionButton {
|
|
|
54
54
|
leadingControlsSlot: Array<HTMLElement>;
|
|
55
55
|
/** @internal */
|
|
56
56
|
trailingControlsSlot: Array<HTMLElement>;
|
|
57
|
+
/**
|
|
58
|
+
* Aria-label attribute for the trigger button when accordion is collapsed.
|
|
59
|
+
*/
|
|
60
|
+
openButtonAriaLabel?: string;
|
|
61
|
+
/**
|
|
62
|
+
* Aria-label attribute for the trigger button when accordion is expanded.
|
|
63
|
+
*/
|
|
64
|
+
closeButtonAriaLabel?: string;
|
|
57
65
|
/**
|
|
58
66
|
* Handles property changes for the accordion.
|
|
59
67
|
* If the disabled property is updated, applies the same disabled state to all elements in the leading and trailing controls slots.
|
|
@@ -8,7 +8,7 @@ var __metadata = (this && this.__metadata) || function (k, v) {
|
|
|
8
8
|
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
|
|
9
9
|
};
|
|
10
10
|
import { html } from 'lit';
|
|
11
|
-
import { queryAssignedElements } from 'lit/decorators.js';
|
|
11
|
+
import { queryAssignedElements, property } from 'lit/decorators.js';
|
|
12
12
|
import { ifDefined } from 'lit/directives/if-defined.js';
|
|
13
13
|
import { ROLE } from '../../utils/roles';
|
|
14
14
|
import AccordionButton from '../accordionbutton/accordionbutton.component';
|
|
@@ -108,7 +108,7 @@ class Accordion extends AccordionButton {
|
|
|
108
108
|
@click="${this.handleHeaderClick}"
|
|
109
109
|
aria-controls="${this.bodySectionId}"
|
|
110
110
|
aria-expanded="${this.expanded}"
|
|
111
|
-
|
|
111
|
+
aria-label="${ifDefined(this.expanded ? this.closeButtonAriaLabel : this.openButtonAriaLabel)}"
|
|
112
112
|
prefix-icon="${this.getArrowIconName()}"
|
|
113
113
|
variant="${BUTTON_VARIANTS.TERTIARY}"
|
|
114
114
|
size="${ICON_BUTTON_SIZES[20]}"
|
|
@@ -127,4 +127,12 @@ __decorate([
|
|
|
127
127
|
queryAssignedElements({ slot: 'trailing-controls' }),
|
|
128
128
|
__metadata("design:type", Array)
|
|
129
129
|
], Accordion.prototype, "trailingControlsSlot", void 0);
|
|
130
|
+
__decorate([
|
|
131
|
+
property({ type: String, attribute: 'open-button-aria-label', reflect: true }),
|
|
132
|
+
__metadata("design:type", String)
|
|
133
|
+
], Accordion.prototype, "openButtonAriaLabel", void 0);
|
|
134
|
+
__decorate([
|
|
135
|
+
property({ type: String, attribute: 'close-button-aria-label', reflect: true }),
|
|
136
|
+
__metadata("design:type", String)
|
|
137
|
+
], Accordion.prototype, "closeButtonAriaLabel", void 0);
|
|
130
138
|
export default Accordion;
|
|
@@ -152,6 +152,10 @@ declare class Slider extends Component {
|
|
|
152
152
|
* Aria value text for the slider's end value displayed when range is true.
|
|
153
153
|
*/
|
|
154
154
|
endAriaValueText?: string;
|
|
155
|
+
/**
|
|
156
|
+
* Whether to hide the tooltip when the thumb is focused or hovered.
|
|
157
|
+
*/
|
|
158
|
+
hideTooltip?: boolean;
|
|
155
159
|
/**
|
|
156
160
|
* Targets all the input components with type='range'
|
|
157
161
|
* @internal
|
|
@@ -214,7 +214,11 @@ class Slider extends Component {
|
|
|
214
214
|
const [inputStart, inputEnd] = this.inputElements;
|
|
215
215
|
const input = source === 'end' ? inputEnd : inputStart;
|
|
216
216
|
const value = Number(input === null || input === void 0 ? void 0 : input.value);
|
|
217
|
-
if (typeof value !== 'number' ||
|
|
217
|
+
if (typeof value !== 'number' ||
|
|
218
|
+
Number.isNaN(value) ||
|
|
219
|
+
this.max === this.min ||
|
|
220
|
+
this.disabled ||
|
|
221
|
+
this.hideTooltip) {
|
|
218
222
|
return nothing;
|
|
219
223
|
}
|
|
220
224
|
const normalizedValue = (value - this.min) / (this.max - this.min);
|
|
@@ -581,6 +585,10 @@ __decorate([
|
|
|
581
585
|
property({ reflect: true, type: String, attribute: 'end-aria-valuetext' }),
|
|
582
586
|
__metadata("design:type", String)
|
|
583
587
|
], Slider.prototype, "endAriaValueText", void 0);
|
|
588
|
+
__decorate([
|
|
589
|
+
property({ reflect: true, type: Boolean, attribute: 'hide-tooltip' }),
|
|
590
|
+
__metadata("design:type", Boolean)
|
|
591
|
+
], Slider.prototype, "hideTooltip", void 0);
|
|
584
592
|
__decorate([
|
|
585
593
|
queryAll('input[type="range"]'),
|
|
586
594
|
__metadata("design:type", Array)
|
|
@@ -117,6 +117,26 @@
|
|
|
117
117
|
}
|
|
118
118
|
],
|
|
119
119
|
"members": [
|
|
120
|
+
{
|
|
121
|
+
"kind": "field",
|
|
122
|
+
"name": "openButtonAriaLabel",
|
|
123
|
+
"type": {
|
|
124
|
+
"text": "string | undefined"
|
|
125
|
+
},
|
|
126
|
+
"description": "Aria-label attribute for the trigger button when accordion is collapsed.",
|
|
127
|
+
"attribute": "open-button-aria-label",
|
|
128
|
+
"reflects": true
|
|
129
|
+
},
|
|
130
|
+
{
|
|
131
|
+
"kind": "field",
|
|
132
|
+
"name": "closeButtonAriaLabel",
|
|
133
|
+
"type": {
|
|
134
|
+
"text": "string | undefined"
|
|
135
|
+
},
|
|
136
|
+
"description": "Aria-label attribute for the trigger button when accordion is expanded.",
|
|
137
|
+
"attribute": "close-button-aria-label",
|
|
138
|
+
"reflects": true
|
|
139
|
+
},
|
|
120
140
|
{
|
|
121
141
|
"kind": "method",
|
|
122
142
|
"name": "renderHeader",
|
|
@@ -366,14 +386,23 @@
|
|
|
366
386
|
}
|
|
367
387
|
}
|
|
368
388
|
],
|
|
369
|
-
"superclass": {
|
|
370
|
-
"name": "AccordionButton",
|
|
371
|
-
"module": "/src/components/accordionbutton/accordionbutton.component"
|
|
372
|
-
},
|
|
373
|
-
"tagName": "mdc-accordion",
|
|
374
|
-
"jsDoc": "/**\n * An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n *\n * The header section contains:\n * - Prefix Icon\n * - Header Text\n * - Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n * - Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n *\n * The body section contains:\n * - Default slot - User can place any content inside the body section.\n *\n * The accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\n * There are two types of variants based on that the border styling of the accordion gets reflected. <br/>\n * There are two sizes of accordion, one is small and the other is large.\n * Small size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n *\n * By default, the header text in the accordion heading is of H3 with an aria-level of '3'.\n * If this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n *\n * An accordion can be disabled, and when it's disabled, the header section will not be clickable.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.\n *\n * @tagname mdc-accordion\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot leading-controls - The leading controls slot of the accordion on the header section.\n * @slot trailing-controls - The trailing controls slot of the accordion on the header section.\n * @slot default - The default slot contains the body section of the accordion. User can place anything inside this body slot.\n *\n * @event shown - (React: onShown) This event is triggered when the accordion is expanded.\n *\n * @cssproperty --mdc-accordionbutton-border-color - The border color of the accordion.\n * @cssproperty --mdc-accordionbutton-hover-color - The hover color of the accordion.\n * @cssproperty --mdc-accordionbutton-active-color - The active color of the accordion.\n * @cssproperty --mdc-accordionbutton-disabled-color - The disabled color of the accordion.\n *\n * @csspart body-section - The body section of the accordion.\n * @csspart header-section - The header section of the accordion.\n * @csspart leading-header - The leading header of the accordion.\n * @csspart trailing-header - The trailing header of the accordion.\n * @csspart trailing-header__button - The trailing header button of the accordion.\n */",
|
|
375
|
-
"customElement": true,
|
|
376
389
|
"attributes": [
|
|
390
|
+
{
|
|
391
|
+
"name": "open-button-aria-label",
|
|
392
|
+
"type": {
|
|
393
|
+
"text": "string | undefined"
|
|
394
|
+
},
|
|
395
|
+
"description": "Aria-label attribute for the trigger button when accordion is collapsed.",
|
|
396
|
+
"fieldName": "openButtonAriaLabel"
|
|
397
|
+
},
|
|
398
|
+
{
|
|
399
|
+
"name": "close-button-aria-label",
|
|
400
|
+
"type": {
|
|
401
|
+
"text": "string | undefined"
|
|
402
|
+
},
|
|
403
|
+
"description": "Aria-label attribute for the trigger button when accordion is expanded.",
|
|
404
|
+
"fieldName": "closeButtonAriaLabel"
|
|
405
|
+
},
|
|
377
406
|
{
|
|
378
407
|
"name": "disabled",
|
|
379
408
|
"type": {
|
|
@@ -463,7 +492,14 @@
|
|
|
463
492
|
"module": "src/components/accordionbutton/accordionbutton.component.ts"
|
|
464
493
|
}
|
|
465
494
|
}
|
|
466
|
-
]
|
|
495
|
+
],
|
|
496
|
+
"superclass": {
|
|
497
|
+
"name": "AccordionButton",
|
|
498
|
+
"module": "/src/components/accordionbutton/accordionbutton.component"
|
|
499
|
+
},
|
|
500
|
+
"tagName": "mdc-accordion",
|
|
501
|
+
"jsDoc": "/**\n * An accordion contains a header and body section with a focusable heading that can be expanded or collapsed.\n *\n * The header section contains:\n * - Prefix Icon\n * - Header Text\n * - Leading Slot - Contains the leading controls of the accordion on the header section. This will be placed on the leading side, after the header text.\n * - Trailing Slot - Contains the trailing controls of the accordion on the header section. This will be placed on the trailing side, before the expand/collapse button.\n *\n * The body section contains:\n * - Default slot - User can place any content inside the body section.\n *\n * The accordion can be expanded or collapsed. The visibility of the body section can be controlled by `expanded` attribute. <br/>\n * There are two types of variants based on that the border styling of the accordion gets reflected. <br/>\n * There are two sizes of accordion, one is small and the other is large.\n * Small size has a padding of 1rem (16px) and large size has a padding of 1.5rem (24px) for the body section of accordion.\n *\n * By default, the header text in the accordion heading is of H3 with an aria-level of '3'.\n * If this accordion is placed on any other level in the entire webpage, then do adjust the aria-level number based on that.\n *\n * An accordion can be disabled, and when it's disabled, the header section will not be clickable.\n *\n * If you don't need any controls on your accordion heading, then it's advised to use `accordionbutton` component.\n *\n * If an accordion is expanded by default, then the screen reader might loose focus when toggling the visibilty of the accordion.\n *\n * @tagname mdc-accordion\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @slot leading-controls - The leading controls slot of the accordion on the header section.\n * @slot trailing-controls - The trailing controls slot of the accordion on the header section.\n * @slot default - The default slot contains the body section of the accordion. User can place anything inside this body slot.\n *\n * @event shown - (React: onShown) This event is triggered when the accordion is expanded.\n *\n * @cssproperty --mdc-accordionbutton-border-color - The border color of the accordion.\n * @cssproperty --mdc-accordionbutton-hover-color - The hover color of the accordion.\n * @cssproperty --mdc-accordionbutton-active-color - The active color of the accordion.\n * @cssproperty --mdc-accordionbutton-disabled-color - The disabled color of the accordion.\n *\n * @csspart body-section - The body section of the accordion.\n * @csspart header-section - The header section of the accordion.\n * @csspart leading-header - The leading header of the accordion.\n * @csspart trailing-header - The trailing header of the accordion.\n * @csspart trailing-header__button - The trailing header button of the accordion.\n */",
|
|
502
|
+
"customElement": true
|
|
467
503
|
}
|
|
468
504
|
],
|
|
469
505
|
"exports": [
|
|
@@ -22060,6 +22096,231 @@
|
|
|
22060
22096
|
}
|
|
22061
22097
|
]
|
|
22062
22098
|
},
|
|
22099
|
+
{
|
|
22100
|
+
"kind": "javascript-module",
|
|
22101
|
+
"path": "components/list/list.component.js",
|
|
22102
|
+
"declarations": [
|
|
22103
|
+
{
|
|
22104
|
+
"kind": "class",
|
|
22105
|
+
"description": "mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n\nTo add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n`mdc-listitem` components can be placed in the default slot.",
|
|
22106
|
+
"name": "List",
|
|
22107
|
+
"cssParts": [
|
|
22108
|
+
{
|
|
22109
|
+
"description": "The container slot around the list items",
|
|
22110
|
+
"name": "container"
|
|
22111
|
+
}
|
|
22112
|
+
],
|
|
22113
|
+
"slots": [
|
|
22114
|
+
{
|
|
22115
|
+
"description": "This is a default/unnamed slot, where listitems can be placed.",
|
|
22116
|
+
"name": "default"
|
|
22117
|
+
},
|
|
22118
|
+
{
|
|
22119
|
+
"description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
|
|
22120
|
+
"name": "list-header"
|
|
22121
|
+
}
|
|
22122
|
+
],
|
|
22123
|
+
"members": [
|
|
22124
|
+
{
|
|
22125
|
+
"kind": "field",
|
|
22126
|
+
"name": "loop",
|
|
22127
|
+
"type": {
|
|
22128
|
+
"text": "'true' | 'false'"
|
|
22129
|
+
},
|
|
22130
|
+
"privacy": "public",
|
|
22131
|
+
"description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
|
|
22132
|
+
"default": "''",
|
|
22133
|
+
"attribute": "loop",
|
|
22134
|
+
"reflects": true
|
|
22135
|
+
},
|
|
22136
|
+
{
|
|
22137
|
+
"kind": "field",
|
|
22138
|
+
"name": "initialFocus",
|
|
22139
|
+
"type": {
|
|
22140
|
+
"text": "number"
|
|
22141
|
+
},
|
|
22142
|
+
"privacy": "public",
|
|
22143
|
+
"description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
|
|
22144
|
+
"default": "0",
|
|
22145
|
+
"attribute": "initial-focus",
|
|
22146
|
+
"reflects": true
|
|
22147
|
+
},
|
|
22148
|
+
{
|
|
22149
|
+
"kind": "field",
|
|
22150
|
+
"name": "itemsStore",
|
|
22151
|
+
"default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
|
|
22152
|
+
},
|
|
22153
|
+
{
|
|
22154
|
+
"kind": "method",
|
|
22155
|
+
"name": "getCurrentIndex",
|
|
22156
|
+
"privacy": "private",
|
|
22157
|
+
"return": {
|
|
22158
|
+
"type": {
|
|
22159
|
+
"text": ""
|
|
22160
|
+
}
|
|
22161
|
+
},
|
|
22162
|
+
"parameters": [
|
|
22163
|
+
{
|
|
22164
|
+
"name": "target",
|
|
22165
|
+
"type": {
|
|
22166
|
+
"text": "HTMLElement | null"
|
|
22167
|
+
},
|
|
22168
|
+
"description": "The target element that triggered the event."
|
|
22169
|
+
}
|
|
22170
|
+
],
|
|
22171
|
+
"description": "Retrieves the current index of the item that triggered the event.",
|
|
22172
|
+
"inheritedFrom": {
|
|
22173
|
+
"name": "ListNavigationMixin",
|
|
22174
|
+
"module": "utils/mixins/ListNavigationMixin.js"
|
|
22175
|
+
}
|
|
22176
|
+
},
|
|
22177
|
+
{
|
|
22178
|
+
"kind": "method",
|
|
22179
|
+
"name": "resetTabIndexes",
|
|
22180
|
+
"privacy": "protected",
|
|
22181
|
+
"parameters": [
|
|
22182
|
+
{
|
|
22183
|
+
"name": "index",
|
|
22184
|
+
"type": {
|
|
22185
|
+
"text": "number"
|
|
22186
|
+
},
|
|
22187
|
+
"description": "The index of the currently focused item."
|
|
22188
|
+
}
|
|
22189
|
+
],
|
|
22190
|
+
"description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
|
|
22191
|
+
"inheritedFrom": {
|
|
22192
|
+
"name": "ListNavigationMixin",
|
|
22193
|
+
"module": "utils/mixins/ListNavigationMixin.js"
|
|
22194
|
+
}
|
|
22195
|
+
},
|
|
22196
|
+
{
|
|
22197
|
+
"kind": "method",
|
|
22198
|
+
"name": "resetTabIndexAndSetFocus",
|
|
22199
|
+
"privacy": "protected",
|
|
22200
|
+
"parameters": [
|
|
22201
|
+
{
|
|
22202
|
+
"name": "newIndex",
|
|
22203
|
+
"type": {
|
|
22204
|
+
"text": "number"
|
|
22205
|
+
},
|
|
22206
|
+
"description": "The index of the new item to focus."
|
|
22207
|
+
},
|
|
22208
|
+
{
|
|
22209
|
+
"name": "oldIndex",
|
|
22210
|
+
"optional": true,
|
|
22211
|
+
"type": {
|
|
22212
|
+
"text": "number"
|
|
22213
|
+
},
|
|
22214
|
+
"description": "The index of the currently focused item."
|
|
22215
|
+
},
|
|
22216
|
+
{
|
|
22217
|
+
"name": "focusNewItem",
|
|
22218
|
+
"default": "true",
|
|
22219
|
+
"description": "Call focus() on the new item or not. It should be false during firstUpdate"
|
|
22220
|
+
}
|
|
22221
|
+
],
|
|
22222
|
+
"description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
|
|
22223
|
+
"return": {
|
|
22224
|
+
"type": {
|
|
22225
|
+
"text": ""
|
|
22226
|
+
}
|
|
22227
|
+
},
|
|
22228
|
+
"inheritedFrom": {
|
|
22229
|
+
"name": "ListNavigationMixin",
|
|
22230
|
+
"module": "utils/mixins/ListNavigationMixin.js"
|
|
22231
|
+
}
|
|
22232
|
+
},
|
|
22233
|
+
{
|
|
22234
|
+
"kind": "method",
|
|
22235
|
+
"name": "resolveDirectionKey",
|
|
22236
|
+
"privacy": "private",
|
|
22237
|
+
"parameters": [
|
|
22238
|
+
{
|
|
22239
|
+
"name": "key",
|
|
22240
|
+
"type": {
|
|
22241
|
+
"text": "string"
|
|
22242
|
+
},
|
|
22243
|
+
"description": "The key pressed by the user."
|
|
22244
|
+
},
|
|
22245
|
+
{
|
|
22246
|
+
"name": "isRtl",
|
|
22247
|
+
"type": {
|
|
22248
|
+
"text": "boolean"
|
|
22249
|
+
},
|
|
22250
|
+
"description": "A boolean indicating if the layout is right-to-left (RTL)."
|
|
22251
|
+
}
|
|
22252
|
+
],
|
|
22253
|
+
"description": "Resolves the key pressed by the user based on the direction of the layout.\nThis method is used to handle keyboard navigation in a right-to-left (RTL) layout.\nIt checks if the layout is RTL and adjusts the arrow keys accordingly.\nFor example, in RTL, the left arrow key behaves like the right arrow key and vice versa.",
|
|
22254
|
+
"return": {
|
|
22255
|
+
"type": {
|
|
22256
|
+
"text": ""
|
|
22257
|
+
}
|
|
22258
|
+
},
|
|
22259
|
+
"inheritedFrom": {
|
|
22260
|
+
"name": "ListNavigationMixin",
|
|
22261
|
+
"module": "utils/mixins/ListNavigationMixin.js"
|
|
22262
|
+
}
|
|
22263
|
+
},
|
|
22264
|
+
{
|
|
22265
|
+
"kind": "method",
|
|
22266
|
+
"name": "shouldLoop",
|
|
22267
|
+
"privacy": "private",
|
|
22268
|
+
"inheritedFrom": {
|
|
22269
|
+
"name": "ListNavigationMixin",
|
|
22270
|
+
"module": "utils/mixins/ListNavigationMixin.js"
|
|
22271
|
+
}
|
|
22272
|
+
}
|
|
22273
|
+
],
|
|
22274
|
+
"attributes": [
|
|
22275
|
+
{
|
|
22276
|
+
"name": "loop",
|
|
22277
|
+
"type": {
|
|
22278
|
+
"text": "'true' | 'false'"
|
|
22279
|
+
},
|
|
22280
|
+
"description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
|
|
22281
|
+
"default": "''",
|
|
22282
|
+
"fieldName": "loop"
|
|
22283
|
+
},
|
|
22284
|
+
{
|
|
22285
|
+
"name": "initial-focus",
|
|
22286
|
+
"type": {
|
|
22287
|
+
"text": "number"
|
|
22288
|
+
},
|
|
22289
|
+
"description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
|
|
22290
|
+
"default": "0",
|
|
22291
|
+
"fieldName": "initialFocus"
|
|
22292
|
+
}
|
|
22293
|
+
],
|
|
22294
|
+
"mixins": [
|
|
22295
|
+
{
|
|
22296
|
+
"name": "ListNavigationMixin",
|
|
22297
|
+
"module": "/src/utils/mixins/ListNavigationMixin"
|
|
22298
|
+
},
|
|
22299
|
+
{
|
|
22300
|
+
"name": "CaptureDestroyEventForChildElement",
|
|
22301
|
+
"module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
|
|
22302
|
+
}
|
|
22303
|
+
],
|
|
22304
|
+
"superclass": {
|
|
22305
|
+
"name": "Component",
|
|
22306
|
+
"module": "/src/models"
|
|
22307
|
+
},
|
|
22308
|
+
"tagName": "mdc-list",
|
|
22309
|
+
"jsDoc": "/**\n * mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n *\n * To add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n * `mdc-listitem` components can be placed in the default slot.\n *\n * @tagname mdc-list\n *\n * @slot default - This is a default/unnamed slot, where listitems can be placed.\n * @slot list-header - This slot is used to pass a header for the list, which can be a `mdc-listheader` component.\n *\n * @csspart container - The container slot around the list items\n */",
|
|
22310
|
+
"customElement": true
|
|
22311
|
+
}
|
|
22312
|
+
],
|
|
22313
|
+
"exports": [
|
|
22314
|
+
{
|
|
22315
|
+
"kind": "js",
|
|
22316
|
+
"name": "default",
|
|
22317
|
+
"declaration": {
|
|
22318
|
+
"name": "List",
|
|
22319
|
+
"module": "components/list/list.component.js"
|
|
22320
|
+
}
|
|
22321
|
+
}
|
|
22322
|
+
]
|
|
22323
|
+
},
|
|
22063
22324
|
{
|
|
22064
22325
|
"kind": "javascript-module",
|
|
22065
22326
|
"path": "components/listbox/listbox.component.js",
|
|
@@ -23024,231 +23285,6 @@
|
|
|
23024
23285
|
}
|
|
23025
23286
|
]
|
|
23026
23287
|
},
|
|
23027
|
-
{
|
|
23028
|
-
"kind": "javascript-module",
|
|
23029
|
-
"path": "components/list/list.component.js",
|
|
23030
|
-
"declarations": [
|
|
23031
|
-
{
|
|
23032
|
-
"kind": "class",
|
|
23033
|
-
"description": "mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n\nTo add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n`mdc-listitem` components can be placed in the default slot.",
|
|
23034
|
-
"name": "List",
|
|
23035
|
-
"cssParts": [
|
|
23036
|
-
{
|
|
23037
|
-
"description": "The container slot around the list items",
|
|
23038
|
-
"name": "container"
|
|
23039
|
-
}
|
|
23040
|
-
],
|
|
23041
|
-
"slots": [
|
|
23042
|
-
{
|
|
23043
|
-
"description": "This is a default/unnamed slot, where listitems can be placed.",
|
|
23044
|
-
"name": "default"
|
|
23045
|
-
},
|
|
23046
|
-
{
|
|
23047
|
-
"description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
|
|
23048
|
-
"name": "list-header"
|
|
23049
|
-
}
|
|
23050
|
-
],
|
|
23051
|
-
"members": [
|
|
23052
|
-
{
|
|
23053
|
-
"kind": "field",
|
|
23054
|
-
"name": "loop",
|
|
23055
|
-
"type": {
|
|
23056
|
-
"text": "'true' | 'false'"
|
|
23057
|
-
},
|
|
23058
|
-
"privacy": "public",
|
|
23059
|
-
"description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
|
|
23060
|
-
"default": "''",
|
|
23061
|
-
"attribute": "loop",
|
|
23062
|
-
"reflects": true
|
|
23063
|
-
},
|
|
23064
|
-
{
|
|
23065
|
-
"kind": "field",
|
|
23066
|
-
"name": "initialFocus",
|
|
23067
|
-
"type": {
|
|
23068
|
-
"text": "number"
|
|
23069
|
-
},
|
|
23070
|
-
"privacy": "public",
|
|
23071
|
-
"description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
|
|
23072
|
-
"default": "0",
|
|
23073
|
-
"attribute": "initial-focus",
|
|
23074
|
-
"reflects": true
|
|
23075
|
-
},
|
|
23076
|
-
{
|
|
23077
|
-
"kind": "field",
|
|
23078
|
-
"name": "itemsStore",
|
|
23079
|
-
"default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
|
|
23080
|
-
},
|
|
23081
|
-
{
|
|
23082
|
-
"kind": "method",
|
|
23083
|
-
"name": "getCurrentIndex",
|
|
23084
|
-
"privacy": "private",
|
|
23085
|
-
"return": {
|
|
23086
|
-
"type": {
|
|
23087
|
-
"text": ""
|
|
23088
|
-
}
|
|
23089
|
-
},
|
|
23090
|
-
"parameters": [
|
|
23091
|
-
{
|
|
23092
|
-
"name": "target",
|
|
23093
|
-
"type": {
|
|
23094
|
-
"text": "HTMLElement | null"
|
|
23095
|
-
},
|
|
23096
|
-
"description": "The target element that triggered the event."
|
|
23097
|
-
}
|
|
23098
|
-
],
|
|
23099
|
-
"description": "Retrieves the current index of the item that triggered the event.",
|
|
23100
|
-
"inheritedFrom": {
|
|
23101
|
-
"name": "ListNavigationMixin",
|
|
23102
|
-
"module": "utils/mixins/ListNavigationMixin.js"
|
|
23103
|
-
}
|
|
23104
|
-
},
|
|
23105
|
-
{
|
|
23106
|
-
"kind": "method",
|
|
23107
|
-
"name": "resetTabIndexes",
|
|
23108
|
-
"privacy": "protected",
|
|
23109
|
-
"parameters": [
|
|
23110
|
-
{
|
|
23111
|
-
"name": "index",
|
|
23112
|
-
"type": {
|
|
23113
|
-
"text": "number"
|
|
23114
|
-
},
|
|
23115
|
-
"description": "The index of the currently focused item."
|
|
23116
|
-
}
|
|
23117
|
-
],
|
|
23118
|
-
"description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
|
|
23119
|
-
"inheritedFrom": {
|
|
23120
|
-
"name": "ListNavigationMixin",
|
|
23121
|
-
"module": "utils/mixins/ListNavigationMixin.js"
|
|
23122
|
-
}
|
|
23123
|
-
},
|
|
23124
|
-
{
|
|
23125
|
-
"kind": "method",
|
|
23126
|
-
"name": "resetTabIndexAndSetFocus",
|
|
23127
|
-
"privacy": "protected",
|
|
23128
|
-
"parameters": [
|
|
23129
|
-
{
|
|
23130
|
-
"name": "newIndex",
|
|
23131
|
-
"type": {
|
|
23132
|
-
"text": "number"
|
|
23133
|
-
},
|
|
23134
|
-
"description": "The index of the new item to focus."
|
|
23135
|
-
},
|
|
23136
|
-
{
|
|
23137
|
-
"name": "oldIndex",
|
|
23138
|
-
"optional": true,
|
|
23139
|
-
"type": {
|
|
23140
|
-
"text": "number"
|
|
23141
|
-
},
|
|
23142
|
-
"description": "The index of the currently focused item."
|
|
23143
|
-
},
|
|
23144
|
-
{
|
|
23145
|
-
"name": "focusNewItem",
|
|
23146
|
-
"default": "true",
|
|
23147
|
-
"description": "Call focus() on the new item or not. It should be false during firstUpdate"
|
|
23148
|
-
}
|
|
23149
|
-
],
|
|
23150
|
-
"description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
|
|
23151
|
-
"return": {
|
|
23152
|
-
"type": {
|
|
23153
|
-
"text": ""
|
|
23154
|
-
}
|
|
23155
|
-
},
|
|
23156
|
-
"inheritedFrom": {
|
|
23157
|
-
"name": "ListNavigationMixin",
|
|
23158
|
-
"module": "utils/mixins/ListNavigationMixin.js"
|
|
23159
|
-
}
|
|
23160
|
-
},
|
|
23161
|
-
{
|
|
23162
|
-
"kind": "method",
|
|
23163
|
-
"name": "resolveDirectionKey",
|
|
23164
|
-
"privacy": "private",
|
|
23165
|
-
"parameters": [
|
|
23166
|
-
{
|
|
23167
|
-
"name": "key",
|
|
23168
|
-
"type": {
|
|
23169
|
-
"text": "string"
|
|
23170
|
-
},
|
|
23171
|
-
"description": "The key pressed by the user."
|
|
23172
|
-
},
|
|
23173
|
-
{
|
|
23174
|
-
"name": "isRtl",
|
|
23175
|
-
"type": {
|
|
23176
|
-
"text": "boolean"
|
|
23177
|
-
},
|
|
23178
|
-
"description": "A boolean indicating if the layout is right-to-left (RTL)."
|
|
23179
|
-
}
|
|
23180
|
-
],
|
|
23181
|
-
"description": "Resolves the key pressed by the user based on the direction of the layout.\nThis method is used to handle keyboard navigation in a right-to-left (RTL) layout.\nIt checks if the layout is RTL and adjusts the arrow keys accordingly.\nFor example, in RTL, the left arrow key behaves like the right arrow key and vice versa.",
|
|
23182
|
-
"return": {
|
|
23183
|
-
"type": {
|
|
23184
|
-
"text": ""
|
|
23185
|
-
}
|
|
23186
|
-
},
|
|
23187
|
-
"inheritedFrom": {
|
|
23188
|
-
"name": "ListNavigationMixin",
|
|
23189
|
-
"module": "utils/mixins/ListNavigationMixin.js"
|
|
23190
|
-
}
|
|
23191
|
-
},
|
|
23192
|
-
{
|
|
23193
|
-
"kind": "method",
|
|
23194
|
-
"name": "shouldLoop",
|
|
23195
|
-
"privacy": "private",
|
|
23196
|
-
"inheritedFrom": {
|
|
23197
|
-
"name": "ListNavigationMixin",
|
|
23198
|
-
"module": "utils/mixins/ListNavigationMixin.js"
|
|
23199
|
-
}
|
|
23200
|
-
}
|
|
23201
|
-
],
|
|
23202
|
-
"attributes": [
|
|
23203
|
-
{
|
|
23204
|
-
"name": "loop",
|
|
23205
|
-
"type": {
|
|
23206
|
-
"text": "'true' | 'false'"
|
|
23207
|
-
},
|
|
23208
|
-
"description": "Whether to loop navigation when reaching the end of the list.\nIf 'true', pressing the down arrow on the last item will focus the first item,\nand pressing the up arrow on the first item will focus the last item.\nIf 'false', navigation will stop at the first or last item.",
|
|
23209
|
-
"default": "''",
|
|
23210
|
-
"fieldName": "loop"
|
|
23211
|
-
},
|
|
23212
|
-
{
|
|
23213
|
-
"name": "initial-focus",
|
|
23214
|
-
"type": {
|
|
23215
|
-
"text": "number"
|
|
23216
|
-
},
|
|
23217
|
-
"description": "The index of the item that should receive focus when the list is first rendered.\nIf the index is out of bounds, the first item (index 0) will receive focus.",
|
|
23218
|
-
"default": "0",
|
|
23219
|
-
"fieldName": "initialFocus"
|
|
23220
|
-
}
|
|
23221
|
-
],
|
|
23222
|
-
"mixins": [
|
|
23223
|
-
{
|
|
23224
|
-
"name": "ListNavigationMixin",
|
|
23225
|
-
"module": "/src/utils/mixins/ListNavigationMixin"
|
|
23226
|
-
},
|
|
23227
|
-
{
|
|
23228
|
-
"name": "CaptureDestroyEventForChildElement",
|
|
23229
|
-
"module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
|
|
23230
|
-
}
|
|
23231
|
-
],
|
|
23232
|
-
"superclass": {
|
|
23233
|
-
"name": "Component",
|
|
23234
|
-
"module": "/src/models"
|
|
23235
|
-
},
|
|
23236
|
-
"tagName": "mdc-list",
|
|
23237
|
-
"jsDoc": "/**\n * mdc-list component is used to display a group of list items. It is used as a container to wrap other list items.\n *\n * To add a header to the list, use the `mdc-listheader` component and place it in the `list-header` slot.\n * `mdc-listitem` components can be placed in the default slot.\n *\n * @tagname mdc-list\n *\n * @slot default - This is a default/unnamed slot, where listitems can be placed.\n * @slot list-header - This slot is used to pass a header for the list, which can be a `mdc-listheader` component.\n *\n * @csspart container - The container slot around the list items\n */",
|
|
23238
|
-
"customElement": true
|
|
23239
|
-
}
|
|
23240
|
-
],
|
|
23241
|
-
"exports": [
|
|
23242
|
-
{
|
|
23243
|
-
"kind": "js",
|
|
23244
|
-
"name": "default",
|
|
23245
|
-
"declaration": {
|
|
23246
|
-
"name": "List",
|
|
23247
|
-
"module": "components/list/list.component.js"
|
|
23248
|
-
}
|
|
23249
|
-
}
|
|
23250
|
-
]
|
|
23251
|
-
},
|
|
23252
23288
|
{
|
|
23253
23289
|
"kind": "javascript-module",
|
|
23254
23290
|
"path": "components/marker/marker.component.js",
|
|
@@ -41344,6 +41380,16 @@
|
|
|
41344
41380
|
"attribute": "end-aria-valuetext",
|
|
41345
41381
|
"reflects": true
|
|
41346
41382
|
},
|
|
41383
|
+
{
|
|
41384
|
+
"kind": "field",
|
|
41385
|
+
"name": "hideTooltip",
|
|
41386
|
+
"type": {
|
|
41387
|
+
"text": "boolean | undefined"
|
|
41388
|
+
},
|
|
41389
|
+
"description": "Whether to hide the tooltip when the thumb is focused or hovered.",
|
|
41390
|
+
"attribute": "hide-tooltip",
|
|
41391
|
+
"reflects": true
|
|
41392
|
+
},
|
|
41347
41393
|
{
|
|
41348
41394
|
"kind": "method",
|
|
41349
41395
|
"name": "preventChange",
|
|
@@ -41754,6 +41800,14 @@
|
|
|
41754
41800
|
},
|
|
41755
41801
|
"description": "Aria value text for the slider's end value displayed when range is true.",
|
|
41756
41802
|
"fieldName": "endAriaValueText"
|
|
41803
|
+
},
|
|
41804
|
+
{
|
|
41805
|
+
"name": "hide-tooltip",
|
|
41806
|
+
"type": {
|
|
41807
|
+
"text": "boolean | undefined"
|
|
41808
|
+
},
|
|
41809
|
+
"description": "Whether to hide the tooltip when the thumb is focused or hovered.",
|
|
41810
|
+
"fieldName": "hideTooltip"
|
|
41757
41811
|
}
|
|
41758
41812
|
],
|
|
41759
41813
|
"superclass": {
|