@momentum-design/components 0.63.0 → 0.64.1

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.
@@ -11,6 +11,10 @@ declare const List_base: import("../../utils/mixins/index.types").Constructor<im
11
11
  * @slot default - This is a default/unnamed slot
12
12
  */
13
13
  declare class List extends List_base {
14
+ /**
15
+ * @internal
16
+ * Get all listitem elements which are not disabled in the list.
17
+ */
14
18
  listItems: Array<HTMLElement>;
15
19
  /**
16
20
  * The header text of the list.
@@ -129,7 +129,7 @@ class List extends DataAriaLabelMixin(Component) {
129
129
  }
130
130
  List.styles = [...Component.styles, ...styles];
131
131
  __decorate([
132
- queryAssignedElements({ selector: LISTITEM_TAGNAME }),
132
+ queryAssignedElements({ selector: `${LISTITEM_TAGNAME}:not([disabled])` }),
133
133
  __metadata("design:type", Array)
134
134
  ], List.prototype, "listItems", void 0);
135
135
  __decorate([
@@ -12257,13 +12257,6 @@
12257
12257
  }
12258
12258
  ],
12259
12259
  "members": [
12260
- {
12261
- "kind": "field",
12262
- "name": "listItems",
12263
- "type": {
12264
- "text": "Array<HTMLElement>"
12265
- }
12266
- },
12267
12260
  {
12268
12261
  "kind": "field",
12269
12262
  "name": "headerText",
@@ -19944,139 +19937,6 @@
19944
19937
  }
19945
19938
  ]
19946
19939
  },
19947
- {
19948
- "kind": "javascript-module",
19949
- "path": "components/spinner/spinner.component.js",
19950
- "declarations": [
19951
- {
19952
- "kind": "class",
19953
- "description": "`mdc-spinner` is loading spinner which is an indeterminate progress indicator, meaning\nit's best for cases where the progress or duration of a process is variable or unknown.\n\nSpinner Variants:\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, the color is changed internally to be the same color as the button’s\nicon or label text.\n\nSpinner Sizes:\n- **Large (96px)**: Use when replacing entire regions or pages that are still loading\n- **MidSize (48px) (Default)**: Use for most use cases.\n- **Small (24px)**: Use for inline with loading text.\n\nCustomisation of the spinner size is allowed by setting the size to undefined and using the --mdc-spinner-size\nCSS property.\n\nSpinner Colors:\n- **Default**: Use for most use cases.\n- **Inverted**: Only to be used within inverted components, such as coachmarks.\n\nRegarding accessibility, if an aria-label is provided, the role will be set to 'img'; if it is absent, the role\nwill be unset\nand aria-hidden will be set to 'true' so the spinner will be ignored by screen readers.",
19954
- "name": "Spinner",
19955
- "cssProperties": [
19956
- {
19957
- "description": "Allows customization of the default spinner color.",
19958
- "name": "--mdc-spinner-default-color"
19959
- },
19960
- {
19961
- "description": "Allows customization of the inverted spinner color.",
19962
- "name": "--mdc-spinner-inverted-color"
19963
- },
19964
- {
19965
- "description": "Allows customization of the spinner Button variant color.",
19966
- "name": "--mdc-spinner-button-variant-color"
19967
- },
19968
- {
19969
- "description": "Allows customization of the spinner size.",
19970
- "name": "--mdc-spinner-size"
19971
- }
19972
- ],
19973
- "cssParts": [
19974
- {
19975
- "description": "The svg which contains the circle spinner.",
19976
- "name": "container"
19977
- },
19978
- {
19979
- "description": "The circle of the spinner.",
19980
- "name": "circle"
19981
- }
19982
- ],
19983
- "members": [
19984
- {
19985
- "kind": "field",
19986
- "name": "inverted",
19987
- "description": "The spinner color can be inverted by setting the inverted attribute to true.",
19988
- "default": "false",
19989
- "attribute": "inverted",
19990
- "reflects": true
19991
- },
19992
- {
19993
- "kind": "field",
19994
- "name": "size",
19995
- "type": {
19996
- "text": "SpinnerSize | undefined"
19997
- },
19998
- "description": "Size of the spinner.\nAcceptable values include:\n\n- 'small'\n- 'midsize'\n- 'large'\n- 'undefined'",
19999
- "default": "midsize",
20000
- "attribute": "size",
20001
- "reflects": true
20002
- },
20003
- {
20004
- "kind": "field",
20005
- "name": "ariaLabel",
20006
- "type": {
20007
- "text": "string | null"
20008
- },
20009
- "default": "null",
20010
- "description": "Aria-label attribute to be set for accessibility",
20011
- "attribute": "aria-label"
20012
- },
20013
- {
20014
- "kind": "field",
20015
- "name": "variant",
20016
- "type": {
20017
- "text": "SpinnerVariant"
20018
- },
20019
- "description": "There are 2 variants of spinner: default and button. Their coloring is different.\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, change the active indicator color to be the same color as the button’s\nicon or label text.",
20020
- "default": "standalone",
20021
- "attribute": "variant",
20022
- "reflects": true
20023
- }
20024
- ],
20025
- "attributes": [
20026
- {
20027
- "name": "inverted",
20028
- "description": "The spinner color can be inverted by setting the inverted attribute to true.",
20029
- "default": "false",
20030
- "fieldName": "inverted"
20031
- },
20032
- {
20033
- "name": "size",
20034
- "type": {
20035
- "text": "SpinnerSize | undefined"
20036
- },
20037
- "description": "Size of the spinner.\nAcceptable values include:\n\n- 'small'\n- 'midsize'\n- 'large'\n- 'undefined'",
20038
- "default": "midsize",
20039
- "fieldName": "size"
20040
- },
20041
- {
20042
- "name": "aria-label",
20043
- "type": {
20044
- "text": "string | null"
20045
- },
20046
- "default": "null",
20047
- "description": "Aria-label attribute to be set for accessibility",
20048
- "fieldName": "ariaLabel"
20049
- },
20050
- {
20051
- "name": "variant",
20052
- "type": {
20053
- "text": "SpinnerVariant"
20054
- },
20055
- "description": "There are 2 variants of spinner: default and button. Their coloring is different.\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, change the active indicator color to be the same color as the button’s\nicon or label text.",
20056
- "default": "standalone",
20057
- "fieldName": "variant"
20058
- }
20059
- ],
20060
- "superclass": {
20061
- "name": "Component",
20062
- "module": "/src/models"
20063
- },
20064
- "tagName": "mdc-spinner",
20065
- "jsDoc": "/**\n * `mdc-spinner` is loading spinner which is an indeterminate progress indicator, meaning\n * it's best for cases where the progress or duration of a process is variable or unknown.\n *\n * Spinner Variants:\n * - **Standalone (Default)**: Track has a blue color.\n * - **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\n * To ensure a minimum 3:1 contrast ratio, the color is changed internally to be the same color as the button’s\n * icon or label text.\n *\n * Spinner Sizes:\n * - **Large (96px)**: Use when replacing entire regions or pages that are still loading\n * - **MidSize (48px) (Default)**: Use for most use cases.\n * - **Small (24px)**: Use for inline with loading text.\n *\n * Customisation of the spinner size is allowed by setting the size to undefined and using the --mdc-spinner-size\n * CSS property.\n *\n * Spinner Colors:\n * - **Default**: Use for most use cases.\n * - **Inverted**: Only to be used within inverted components, such as coachmarks.\n *\n * Regarding accessibility, if an aria-label is provided, the role will be set to 'img'; if it is absent, the role\n * will be unset\n * and aria-hidden will be set to 'true' so the spinner will be ignored by screen readers.\n *\n * @tagname mdc-spinner\n *\n * @cssproperty --mdc-spinner-default-color - Allows customization of the default spinner color.\n * @cssproperty --mdc-spinner-inverted-color - Allows customization of the inverted spinner color.\n * @cssproperty --mdc-spinner-button-variant-color - Allows customization of the spinner Button variant color.\n * @cssproperty --mdc-spinner-size - Allows customization of the spinner size.\n *\n * @csspart container - The svg which contains the circle spinner.\n * @csspart circle - The circle of the spinner.\n */",
20066
- "customElement": true
20067
- }
20068
- ],
20069
- "exports": [
20070
- {
20071
- "kind": "js",
20072
- "name": "default",
20073
- "declaration": {
20074
- "name": "Spinner",
20075
- "module": "components/spinner/spinner.component.js"
20076
- }
20077
- }
20078
- ]
20079
- },
20080
19940
  {
20081
19941
  "kind": "javascript-module",
20082
19942
  "path": "components/staticcheckbox/staticcheckbox.component.js",
@@ -20221,6 +20081,139 @@
20221
20081
  }
20222
20082
  ]
20223
20083
  },
20084
+ {
20085
+ "kind": "javascript-module",
20086
+ "path": "components/spinner/spinner.component.js",
20087
+ "declarations": [
20088
+ {
20089
+ "kind": "class",
20090
+ "description": "`mdc-spinner` is loading spinner which is an indeterminate progress indicator, meaning\nit's best for cases where the progress or duration of a process is variable or unknown.\n\nSpinner Variants:\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, the color is changed internally to be the same color as the button’s\nicon or label text.\n\nSpinner Sizes:\n- **Large (96px)**: Use when replacing entire regions or pages that are still loading\n- **MidSize (48px) (Default)**: Use for most use cases.\n- **Small (24px)**: Use for inline with loading text.\n\nCustomisation of the spinner size is allowed by setting the size to undefined and using the --mdc-spinner-size\nCSS property.\n\nSpinner Colors:\n- **Default**: Use for most use cases.\n- **Inverted**: Only to be used within inverted components, such as coachmarks.\n\nRegarding accessibility, if an aria-label is provided, the role will be set to 'img'; if it is absent, the role\nwill be unset\nand aria-hidden will be set to 'true' so the spinner will be ignored by screen readers.",
20091
+ "name": "Spinner",
20092
+ "cssProperties": [
20093
+ {
20094
+ "description": "Allows customization of the default spinner color.",
20095
+ "name": "--mdc-spinner-default-color"
20096
+ },
20097
+ {
20098
+ "description": "Allows customization of the inverted spinner color.",
20099
+ "name": "--mdc-spinner-inverted-color"
20100
+ },
20101
+ {
20102
+ "description": "Allows customization of the spinner Button variant color.",
20103
+ "name": "--mdc-spinner-button-variant-color"
20104
+ },
20105
+ {
20106
+ "description": "Allows customization of the spinner size.",
20107
+ "name": "--mdc-spinner-size"
20108
+ }
20109
+ ],
20110
+ "cssParts": [
20111
+ {
20112
+ "description": "The svg which contains the circle spinner.",
20113
+ "name": "container"
20114
+ },
20115
+ {
20116
+ "description": "The circle of the spinner.",
20117
+ "name": "circle"
20118
+ }
20119
+ ],
20120
+ "members": [
20121
+ {
20122
+ "kind": "field",
20123
+ "name": "inverted",
20124
+ "description": "The spinner color can be inverted by setting the inverted attribute to true.",
20125
+ "default": "false",
20126
+ "attribute": "inverted",
20127
+ "reflects": true
20128
+ },
20129
+ {
20130
+ "kind": "field",
20131
+ "name": "size",
20132
+ "type": {
20133
+ "text": "SpinnerSize | undefined"
20134
+ },
20135
+ "description": "Size of the spinner.\nAcceptable values include:\n\n- 'small'\n- 'midsize'\n- 'large'\n- 'undefined'",
20136
+ "default": "midsize",
20137
+ "attribute": "size",
20138
+ "reflects": true
20139
+ },
20140
+ {
20141
+ "kind": "field",
20142
+ "name": "ariaLabel",
20143
+ "type": {
20144
+ "text": "string | null"
20145
+ },
20146
+ "default": "null",
20147
+ "description": "Aria-label attribute to be set for accessibility",
20148
+ "attribute": "aria-label"
20149
+ },
20150
+ {
20151
+ "kind": "field",
20152
+ "name": "variant",
20153
+ "type": {
20154
+ "text": "SpinnerVariant"
20155
+ },
20156
+ "description": "There are 2 variants of spinner: default and button. Their coloring is different.\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, change the active indicator color to be the same color as the button’s\nicon or label text.",
20157
+ "default": "standalone",
20158
+ "attribute": "variant",
20159
+ "reflects": true
20160
+ }
20161
+ ],
20162
+ "attributes": [
20163
+ {
20164
+ "name": "inverted",
20165
+ "description": "The spinner color can be inverted by setting the inverted attribute to true.",
20166
+ "default": "false",
20167
+ "fieldName": "inverted"
20168
+ },
20169
+ {
20170
+ "name": "size",
20171
+ "type": {
20172
+ "text": "SpinnerSize | undefined"
20173
+ },
20174
+ "description": "Size of the spinner.\nAcceptable values include:\n\n- 'small'\n- 'midsize'\n- 'large'\n- 'undefined'",
20175
+ "default": "midsize",
20176
+ "fieldName": "size"
20177
+ },
20178
+ {
20179
+ "name": "aria-label",
20180
+ "type": {
20181
+ "text": "string | null"
20182
+ },
20183
+ "default": "null",
20184
+ "description": "Aria-label attribute to be set for accessibility",
20185
+ "fieldName": "ariaLabel"
20186
+ },
20187
+ {
20188
+ "name": "variant",
20189
+ "type": {
20190
+ "text": "SpinnerVariant"
20191
+ },
20192
+ "description": "There are 2 variants of spinner: default and button. Their coloring is different.\n- **Standalone (Default)**: Track has a blue color.\n- **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\nTo ensure a minimum 3:1 contrast ratio, change the active indicator color to be the same color as the button’s\nicon or label text.",
20193
+ "default": "standalone",
20194
+ "fieldName": "variant"
20195
+ }
20196
+ ],
20197
+ "superclass": {
20198
+ "name": "Component",
20199
+ "module": "/src/models"
20200
+ },
20201
+ "tagName": "mdc-spinner",
20202
+ "jsDoc": "/**\n * `mdc-spinner` is loading spinner which is an indeterminate progress indicator, meaning\n * it's best for cases where the progress or duration of a process is variable or unknown.\n *\n * Spinner Variants:\n * - **Standalone (Default)**: Track has a blue color.\n * - **Button**: To be used when placed in a button to show that the button’s action is currently in progress.\n * To ensure a minimum 3:1 contrast ratio, the color is changed internally to be the same color as the button’s\n * icon or label text.\n *\n * Spinner Sizes:\n * - **Large (96px)**: Use when replacing entire regions or pages that are still loading\n * - **MidSize (48px) (Default)**: Use for most use cases.\n * - **Small (24px)**: Use for inline with loading text.\n *\n * Customisation of the spinner size is allowed by setting the size to undefined and using the --mdc-spinner-size\n * CSS property.\n *\n * Spinner Colors:\n * - **Default**: Use for most use cases.\n * - **Inverted**: Only to be used within inverted components, such as coachmarks.\n *\n * Regarding accessibility, if an aria-label is provided, the role will be set to 'img'; if it is absent, the role\n * will be unset\n * and aria-hidden will be set to 'true' so the spinner will be ignored by screen readers.\n *\n * @tagname mdc-spinner\n *\n * @cssproperty --mdc-spinner-default-color - Allows customization of the default spinner color.\n * @cssproperty --mdc-spinner-inverted-color - Allows customization of the inverted spinner color.\n * @cssproperty --mdc-spinner-button-variant-color - Allows customization of the spinner Button variant color.\n * @cssproperty --mdc-spinner-size - Allows customization of the spinner size.\n *\n * @csspart container - The svg which contains the circle spinner.\n * @csspart circle - The circle of the spinner.\n */",
20203
+ "customElement": true
20204
+ }
20205
+ ],
20206
+ "exports": [
20207
+ {
20208
+ "kind": "js",
20209
+ "name": "default",
20210
+ "declaration": {
20211
+ "name": "Spinner",
20212
+ "module": "components/spinner/spinner.component.js"
20213
+ }
20214
+ }
20215
+ ]
20216
+ },
20224
20217
  {
20225
20218
  "kind": "javascript-module",
20226
20219
  "path": "components/staticradio/staticradio.component.js",
@@ -40,8 +40,8 @@ export { default as RadioGroup } from './radiogroup';
40
40
  export { default as ScreenreaderAnnouncer } from './screenreaderannouncer';
41
41
  export { default as Searchfield } from './searchfield';
42
42
  export { default as Select } from './select';
43
- export { default as Spinner } from './spinner';
44
43
  export { default as StaticCheckbox } from './staticcheckbox';
44
+ export { default as Spinner } from './spinner';
45
45
  export { default as StaticRadio } from './staticradio';
46
46
  export { default as StaticToggle } from './statictoggle';
47
47
  export { default as Tab } from './tab';
@@ -40,8 +40,8 @@ export { default as RadioGroup } from './radiogroup';
40
40
  export { default as ScreenreaderAnnouncer } from './screenreaderannouncer';
41
41
  export { default as Searchfield } from './searchfield';
42
42
  export { default as Select } from './select';
43
- export { default as Spinner } from './spinner';
44
43
  export { default as StaticCheckbox } from './staticcheckbox';
44
+ export { default as Spinner } from './spinner';
45
45
  export { default as StaticRadio } from './staticradio';
46
46
  export { default as StaticToggle } from './statictoggle';
47
47
  export { default as Tab } from './tab';
package/package.json CHANGED
@@ -39,5 +39,5 @@
39
39
  "lit": "^3.2.0",
40
40
  "uuid": "^11.0.5"
41
41
  },
42
- "version": "0.63.0"
42
+ "version": "0.64.1"
43
43
  }