@momentum-design/components 0.120.26 → 0.120.28

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.
Files changed (4) hide show
  1. package/dist/custom-elements.json +1424 -1424
  2. package/dist/react/index.d.ts +8 -8
  3. package/dist/react/index.js +8 -8
  4. package/package.json +1 -1
package/dist/custom-elements.json CHANGED
@@ -4766,6 +4766,77 @@
4766
4766
  }
4767
4767
  ]
4768
4768
  },
4769
+ {
4770
+ "kind": "javascript-module",
4771
+ "path": "components/bullet/bullet.component.js",
4772
+ "declarations": [
4773
+ {
4774
+ "kind": "class",
4775
+ "description": "Bullet component, which is a visual marker\nand be used to organize and present items in a list format.",
4776
+ "name": "Bullet",
4777
+ "cssProperties": [
4778
+ {
4779
+ "description": "background color of the bullet",
4780
+ "name": "--mdc-bullet-background-color"
4781
+ },
4782
+ {
4783
+ "description": "small size value of the bullet",
4784
+ "name": "--mdc-bullet-size-small"
4785
+ },
4786
+ {
4787
+ "description": "medium size value of the bullet",
4788
+ "name": "--mdc-bullet-size-medium"
4789
+ },
4790
+ {
4791
+ "description": "large size value of the bullet",
4792
+ "name": "--mdc-bullet-size-large"
4793
+ }
4794
+ ],
4795
+ "members": [
4796
+ {
4797
+ "kind": "field",
4798
+ "name": "size",
4799
+ "type": {
4800
+ "text": "Size"
4801
+ },
4802
+ "privacy": "public",
4803
+ "description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
4804
+ "default": "small",
4805
+ "attribute": "size",
4806
+ "reflects": true
4807
+ }
4808
+ ],
4809
+ "attributes": [
4810
+ {
4811
+ "name": "size",
4812
+ "type": {
4813
+ "text": "Size"
4814
+ },
4815
+ "description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
4816
+ "default": "small",
4817
+ "fieldName": "size"
4818
+ }
4819
+ ],
4820
+ "superclass": {
4821
+ "name": "Component",
4822
+ "module": "/src/models"
4823
+ },
4824
+ "tagName": "mdc-bullet",
4825
+ "jsDoc": "/**\n * Bullet component, which is a visual marker\n * and be used to organize and present items in a list format.\n *\n * @tagname mdc-bullet\n *\n * @cssproperty --mdc-bullet-background-color - background color of the bullet\n * @cssproperty --mdc-bullet-size-small - small size value of the bullet\n * @cssproperty --mdc-bullet-size-medium - medium size value of the bullet\n * @cssproperty --mdc-bullet-size-large - large size value of the bullet\n */",
4826
+ "customElement": true
4827
+ }
4828
+ ],
4829
+ "exports": [
4830
+ {
4831
+ "kind": "js",
4832
+ "name": "default",
4833
+ "declaration": {
4834
+ "name": "Bullet",
4835
+ "module": "components/bullet/bullet.component.js"
4836
+ }
4837
+ }
4838
+ ]
4839
+ },
4769
4840
  {
4770
4841
  "kind": "javascript-module",
4771
4842
  "path": "components/brandvisual/brandvisual.component.js",
@@ -4942,77 +5013,6 @@
4942
5013
  }
4943
5014
  ]
4944
5015
  },
4945
- {
4946
- "kind": "javascript-module",
4947
- "path": "components/bullet/bullet.component.js",
4948
- "declarations": [
4949
- {
4950
- "kind": "class",
4951
- "description": "Bullet component, which is a visual marker\nand be used to organize and present items in a list format.",
4952
- "name": "Bullet",
4953
- "cssProperties": [
4954
- {
4955
- "description": "background color of the bullet",
4956
- "name": "--mdc-bullet-background-color"
4957
- },
4958
- {
4959
- "description": "small size value of the bullet",
4960
- "name": "--mdc-bullet-size-small"
4961
- },
4962
- {
4963
- "description": "medium size value of the bullet",
4964
- "name": "--mdc-bullet-size-medium"
4965
- },
4966
- {
4967
- "description": "large size value of the bullet",
4968
- "name": "--mdc-bullet-size-large"
4969
- }
4970
- ],
4971
- "members": [
4972
- {
4973
- "kind": "field",
4974
- "name": "size",
4975
- "type": {
4976
- "text": "Size"
4977
- },
4978
- "privacy": "public",
4979
- "description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
4980
- "default": "small",
4981
- "attribute": "size",
4982
- "reflects": true
4983
- }
4984
- ],
4985
- "attributes": [
4986
- {
4987
- "name": "size",
4988
- "type": {
4989
- "text": "Size"
4990
- },
4991
- "description": "Size of the bullet\n\nPossible values: 'small', 'medium', 'large'",
4992
- "default": "small",
4993
- "fieldName": "size"
4994
- }
4995
- ],
4996
- "superclass": {
4997
- "name": "Component",
4998
- "module": "/src/models"
4999
- },
5000
- "tagName": "mdc-bullet",
5001
- "jsDoc": "/**\n * Bullet component, which is a visual marker\n * and be used to organize and present items in a list format.\n *\n * @tagname mdc-bullet\n *\n * @cssproperty --mdc-bullet-background-color - background color of the bullet\n * @cssproperty --mdc-bullet-size-small - small size value of the bullet\n * @cssproperty --mdc-bullet-size-medium - medium size value of the bullet\n * @cssproperty --mdc-bullet-size-large - large size value of the bullet\n */",
5002
- "customElement": true
5003
- }
5004
- ],
5005
- "exports": [
5006
- {
5007
- "kind": "js",
5008
- "name": "default",
5009
- "declaration": {
5010
- "name": "Bullet",
5011
- "module": "components/bullet/bullet.component.js"
5012
- }
5013
- }
5014
- ]
5015
- },
5016
5016
  {
5017
5017
  "kind": "javascript-module",
5018
5018
  "path": "components/button/button.component.js",
@@ -21996,231 +21996,6 @@
21996
21996
  }
21997
21997
  ]
21998
21998
  },
21999
- {
22000
- "kind": "javascript-module",
22001
- "path": "components/list/list.component.js",
22002
- "declarations": [
22003
- {
22004
- "kind": "class",
22005
- "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.",
22006
- "name": "List",
22007
- "cssParts": [
22008
- {
22009
- "description": "The container slot around the list items",
22010
- "name": "container"
22011
- }
22012
- ],
22013
- "slots": [
22014
- {
22015
- "description": "This is a default/unnamed slot, where listitems can be placed.",
22016
- "name": "default"
22017
- },
22018
- {
22019
- "description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
22020
- "name": "list-header"
22021
- }
22022
- ],
22023
- "members": [
22024
- {
22025
- "kind": "field",
22026
- "name": "loop",
22027
- "type": {
22028
- "text": "'true' | 'false'"
22029
- },
22030
- "privacy": "public",
22031
- "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.",
22032
- "default": "''",
22033
- "attribute": "loop",
22034
- "reflects": true
22035
- },
22036
- {
22037
- "kind": "field",
22038
- "name": "initialFocus",
22039
- "type": {
22040
- "text": "number"
22041
- },
22042
- "privacy": "public",
22043
- "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.",
22044
- "default": "0",
22045
- "attribute": "initial-focus",
22046
- "reflects": true
22047
- },
22048
- {
22049
- "kind": "field",
22050
- "name": "itemsStore",
22051
- "default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
22052
- },
22053
- {
22054
- "kind": "method",
22055
- "name": "getCurrentIndex",
22056
- "privacy": "private",
22057
- "return": {
22058
- "type": {
22059
- "text": ""
22060
- }
22061
- },
22062
- "parameters": [
22063
- {
22064
- "name": "target",
22065
- "type": {
22066
- "text": "HTMLElement | null"
22067
- },
22068
- "description": "The target element that triggered the event."
22069
- }
22070
- ],
22071
- "description": "Retrieves the current index of the item that triggered the event.",
22072
- "inheritedFrom": {
22073
- "name": "ListNavigationMixin",
22074
- "module": "utils/mixins/ListNavigationMixin.js"
22075
- }
22076
- },
22077
- {
22078
- "kind": "method",
22079
- "name": "resetTabIndexes",
22080
- "privacy": "protected",
22081
- "parameters": [
22082
- {
22083
- "name": "index",
22084
- "type": {
22085
- "text": "number"
22086
- },
22087
- "description": "The index of the currently focused item."
22088
- }
22089
- ],
22090
- "description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
22091
- "inheritedFrom": {
22092
- "name": "ListNavigationMixin",
22093
- "module": "utils/mixins/ListNavigationMixin.js"
22094
- }
22095
- },
22096
- {
22097
- "kind": "method",
22098
- "name": "resetTabIndexAndSetFocus",
22099
- "privacy": "protected",
22100
- "parameters": [
22101
- {
22102
- "name": "newIndex",
22103
- "type": {
22104
- "text": "number"
22105
- },
22106
- "description": "The index of the new item to focus."
22107
- },
22108
- {
22109
- "name": "oldIndex",
22110
- "optional": true,
22111
- "type": {
22112
- "text": "number"
22113
- },
22114
- "description": "The index of the currently focused item."
22115
- },
22116
- {
22117
- "name": "focusNewItem",
22118
- "default": "true",
22119
- "description": "Call focus() on the new item or not. It should be false during firstUpdate"
22120
- }
22121
- ],
22122
- "description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
22123
- "return": {
22124
- "type": {
22125
- "text": ""
22126
- }
22127
- },
22128
- "inheritedFrom": {
22129
- "name": "ListNavigationMixin",
22130
- "module": "utils/mixins/ListNavigationMixin.js"
22131
- }
22132
- },
22133
- {
22134
- "kind": "method",
22135
- "name": "resolveDirectionKey",
22136
- "privacy": "private",
22137
- "parameters": [
22138
- {
22139
- "name": "key",
22140
- "type": {
22141
- "text": "string"
22142
- },
22143
- "description": "The key pressed by the user."
22144
- },
22145
- {
22146
- "name": "isRtl",
22147
- "type": {
22148
- "text": "boolean"
22149
- },
22150
- "description": "A boolean indicating if the layout is right-to-left (RTL)."
22151
- }
22152
- ],
22153
- "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.",
22154
- "return": {
22155
- "type": {
22156
- "text": ""
22157
- }
22158
- },
22159
- "inheritedFrom": {
22160
- "name": "ListNavigationMixin",
22161
- "module": "utils/mixins/ListNavigationMixin.js"
22162
- }
22163
- },
22164
- {
22165
- "kind": "method",
22166
- "name": "shouldLoop",
22167
- "privacy": "private",
22168
- "inheritedFrom": {
22169
- "name": "ListNavigationMixin",
22170
- "module": "utils/mixins/ListNavigationMixin.js"
22171
- }
22172
- }
22173
- ],
22174
- "attributes": [
22175
- {
22176
- "name": "loop",
22177
- "type": {
22178
- "text": "'true' | 'false'"
22179
- },
22180
- "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.",
22181
- "default": "''",
22182
- "fieldName": "loop"
22183
- },
22184
- {
22185
- "name": "initial-focus",
22186
- "type": {
22187
- "text": "number"
22188
- },
22189
- "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.",
22190
- "default": "0",
22191
- "fieldName": "initialFocus"
22192
- }
22193
- ],
22194
- "mixins": [
22195
- {
22196
- "name": "ListNavigationMixin",
22197
- "module": "/src/utils/mixins/ListNavigationMixin"
22198
- },
22199
- {
22200
- "name": "CaptureDestroyEventForChildElement",
22201
- "module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
22202
- }
22203
- ],
22204
- "superclass": {
22205
- "name": "Component",
22206
- "module": "/src/models"
22207
- },
22208
- "tagName": "mdc-list",
22209
- "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 */",
22210
- "customElement": true
22211
- }
22212
- ],
22213
- "exports": [
22214
- {
22215
- "kind": "js",
22216
- "name": "default",
22217
- "declaration": {
22218
- "name": "List",
22219
- "module": "components/list/list.component.js"
22220
- }
22221
- }
22222
- ]
22223
- },
22224
21999
  {
22225
22000
  "kind": "javascript-module",
22226
22001
  "path": "components/listbox/listbox.component.js",
@@ -22514,6 +22289,231 @@
22514
22289
  }
22515
22290
  ]
22516
22291
  },
22292
+ {
22293
+ "kind": "javascript-module",
22294
+ "path": "components/list/list.component.js",
22295
+ "declarations": [
22296
+ {
22297
+ "kind": "class",
22298
+ "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.",
22299
+ "name": "List",
22300
+ "cssParts": [
22301
+ {
22302
+ "description": "The container slot around the list items",
22303
+ "name": "container"
22304
+ }
22305
+ ],
22306
+ "slots": [
22307
+ {
22308
+ "description": "This is a default/unnamed slot, where listitems can be placed.",
22309
+ "name": "default"
22310
+ },
22311
+ {
22312
+ "description": "This slot is used to pass a header for the list, which can be a `mdc-listheader` component.",
22313
+ "name": "list-header"
22314
+ }
22315
+ ],
22316
+ "members": [
22317
+ {
22318
+ "kind": "field",
22319
+ "name": "loop",
22320
+ "type": {
22321
+ "text": "'true' | 'false'"
22322
+ },
22323
+ "privacy": "public",
22324
+ "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.",
22325
+ "default": "''",
22326
+ "attribute": "loop",
22327
+ "reflects": true
22328
+ },
22329
+ {
22330
+ "kind": "field",
22331
+ "name": "initialFocus",
22332
+ "type": {
22333
+ "text": "number"
22334
+ },
22335
+ "privacy": "public",
22336
+ "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.",
22337
+ "default": "0",
22338
+ "attribute": "initial-focus",
22339
+ "reflects": true
22340
+ },
22341
+ {
22342
+ "kind": "field",
22343
+ "name": "itemsStore",
22344
+ "default": "new ElementStore<ListItem>(this, { isValidItem: this.isValidItem, })"
22345
+ },
22346
+ {
22347
+ "kind": "method",
22348
+ "name": "getCurrentIndex",
22349
+ "privacy": "private",
22350
+ "return": {
22351
+ "type": {
22352
+ "text": ""
22353
+ }
22354
+ },
22355
+ "parameters": [
22356
+ {
22357
+ "name": "target",
22358
+ "type": {
22359
+ "text": "HTMLElement | null"
22360
+ },
22361
+ "description": "The target element that triggered the event."
22362
+ }
22363
+ ],
22364
+ "description": "Retrieves the current index of the item that triggered the event.",
22365
+ "inheritedFrom": {
22366
+ "name": "ListNavigationMixin",
22367
+ "module": "utils/mixins/ListNavigationMixin.js"
22368
+ }
22369
+ },
22370
+ {
22371
+ "kind": "method",
22372
+ "name": "resetTabIndexes",
22373
+ "privacy": "protected",
22374
+ "parameters": [
22375
+ {
22376
+ "name": "index",
22377
+ "type": {
22378
+ "text": "number"
22379
+ },
22380
+ "description": "The index of the currently focused item."
22381
+ }
22382
+ ],
22383
+ "description": "Reset all tabindex to -1 and set the tabindex of the current item to 0",
22384
+ "inheritedFrom": {
22385
+ "name": "ListNavigationMixin",
22386
+ "module": "utils/mixins/ListNavigationMixin.js"
22387
+ }
22388
+ },
22389
+ {
22390
+ "kind": "method",
22391
+ "name": "resetTabIndexAndSetFocus",
22392
+ "privacy": "protected",
22393
+ "parameters": [
22394
+ {
22395
+ "name": "newIndex",
22396
+ "type": {
22397
+ "text": "number"
22398
+ },
22399
+ "description": "The index of the new item to focus."
22400
+ },
22401
+ {
22402
+ "name": "oldIndex",
22403
+ "optional": true,
22404
+ "type": {
22405
+ "text": "number"
22406
+ },
22407
+ "description": "The index of the currently focused item."
22408
+ },
22409
+ {
22410
+ "name": "focusNewItem",
22411
+ "default": "true",
22412
+ "description": "Call focus() on the new item or not. It should be false during firstUpdate"
22413
+ }
22414
+ ],
22415
+ "description": "Resets the tabindex of the currently focused item and sets focus to a new item.",
22416
+ "return": {
22417
+ "type": {
22418
+ "text": ""
22419
+ }
22420
+ },
22421
+ "inheritedFrom": {
22422
+ "name": "ListNavigationMixin",
22423
+ "module": "utils/mixins/ListNavigationMixin.js"
22424
+ }
22425
+ },
22426
+ {
22427
+ "kind": "method",
22428
+ "name": "resolveDirectionKey",
22429
+ "privacy": "private",
22430
+ "parameters": [
22431
+ {
22432
+ "name": "key",
22433
+ "type": {
22434
+ "text": "string"
22435
+ },
22436
+ "description": "The key pressed by the user."
22437
+ },
22438
+ {
22439
+ "name": "isRtl",
22440
+ "type": {
22441
+ "text": "boolean"
22442
+ },
22443
+ "description": "A boolean indicating if the layout is right-to-left (RTL)."
22444
+ }
22445
+ ],
22446
+ "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.",
22447
+ "return": {
22448
+ "type": {
22449
+ "text": ""
22450
+ }
22451
+ },
22452
+ "inheritedFrom": {
22453
+ "name": "ListNavigationMixin",
22454
+ "module": "utils/mixins/ListNavigationMixin.js"
22455
+ }
22456
+ },
22457
+ {
22458
+ "kind": "method",
22459
+ "name": "shouldLoop",
22460
+ "privacy": "private",
22461
+ "inheritedFrom": {
22462
+ "name": "ListNavigationMixin",
22463
+ "module": "utils/mixins/ListNavigationMixin.js"
22464
+ }
22465
+ }
22466
+ ],
22467
+ "attributes": [
22468
+ {
22469
+ "name": "loop",
22470
+ "type": {
22471
+ "text": "'true' | 'false'"
22472
+ },
22473
+ "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.",
22474
+ "default": "''",
22475
+ "fieldName": "loop"
22476
+ },
22477
+ {
22478
+ "name": "initial-focus",
22479
+ "type": {
22480
+ "text": "number"
22481
+ },
22482
+ "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.",
22483
+ "default": "0",
22484
+ "fieldName": "initialFocus"
22485
+ }
22486
+ ],
22487
+ "mixins": [
22488
+ {
22489
+ "name": "ListNavigationMixin",
22490
+ "module": "/src/utils/mixins/ListNavigationMixin"
22491
+ },
22492
+ {
22493
+ "name": "CaptureDestroyEventForChildElement",
22494
+ "module": "/src/utils/mixins/lifecycle/CaptureDestroyEventForChildElement"
22495
+ }
22496
+ ],
22497
+ "superclass": {
22498
+ "name": "Component",
22499
+ "module": "/src/models"
22500
+ },
22501
+ "tagName": "mdc-list",
22502
+ "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 */",
22503
+ "customElement": true
22504
+ }
22505
+ ],
22506
+ "exports": [
22507
+ {
22508
+ "kind": "js",
22509
+ "name": "default",
22510
+ "declaration": {
22511
+ "name": "List",
22512
+ "module": "components/list/list.component.js"
22513
+ }
22514
+ }
22515
+ ]
22516
+ },
22517
22517
  {
22518
22518
  "kind": "javascript-module",
22519
22519
  "path": "components/listheader/listheader.component.js",
@@ -32647,6 +32647,253 @@
32647
32647
  }
32648
32648
  ]
32649
32649
  },
32650
+ {
32651
+ "kind": "javascript-module",
32652
+ "path": "components/presence/presence.component.js",
32653
+ "declarations": [
32654
+ {
32655
+ "kind": "class",
32656
+ "description": "The `mdc-presence` component is a versatile UI element used to\ndisplay the presence status of a user or entity within an avatar component.\n\nThis component is ideal for use within avatar UIs where the presence status\nneeds to be visually represented.",
32657
+ "name": "Presence",
32658
+ "cssProperties": [
32659
+ {
32660
+ "description": "The background color of the presence type active.",
32661
+ "name": "--mdc-presence-active-background-color"
32662
+ },
32663
+ {
32664
+ "description": "The background color of the presence type away.",
32665
+ "name": "--mdc-presence-away-background-color"
32666
+ },
32667
+ {
32668
+ "description": "The background color of the presence type away-calling.",
32669
+ "name": "--mdc-presence-away-calling-background-color"
32670
+ },
32671
+ {
32672
+ "description": "The background color of the presence type busy.",
32673
+ "name": "--mdc-presence-busy-background-color"
32674
+ },
32675
+ {
32676
+ "description": "The background color of the presence type dnd.",
32677
+ "name": "--mdc-presence-dnd-background-color"
32678
+ },
32679
+ {
32680
+ "description": "The background color of the presence type meeting.",
32681
+ "name": "--mdc-presence-meeting-background-color"
32682
+ },
32683
+ {
32684
+ "description": "The background color of the presence type on-call.",
32685
+ "name": "--mdc-presence-on-call-background-color"
32686
+ },
32687
+ {
32688
+ "description": "The background color of the presence type on-device.",
32689
+ "name": "--mdc-presence-on-device-background-color"
32690
+ },
32691
+ {
32692
+ "description": "The background color of the presence type on-mobile.",
32693
+ "name": "--mdc-presence-on-mobile-background-color"
32694
+ },
32695
+ {
32696
+ "description": "The background color of the presence type pause.",
32697
+ "name": "--mdc-presence-pause-background-color"
32698
+ },
32699
+ {
32700
+ "description": "The background color of the presence type pto.",
32701
+ "name": "--mdc-presence-pto-background-color"
32702
+ },
32703
+ {
32704
+ "description": "The background color of the presence type presenting.",
32705
+ "name": "--mdc-presence-presenting-background-color"
32706
+ },
32707
+ {
32708
+ "description": "The background color of the presence type quiet.",
32709
+ "name": "--mdc-presence-quiet-background-color"
32710
+ },
32711
+ {
32712
+ "description": "The background color of the presence type scheduled.",
32713
+ "name": "--mdc-presence-scheduled-background-color"
32714
+ },
32715
+ {
32716
+ "description": "The background color of the presence type overlay.",
32717
+ "name": "--mdc-presence-overlay-background-color"
32718
+ }
32719
+ ],
32720
+ "cssParts": [
32721
+ {
32722
+ "description": "The presence content.",
32723
+ "name": "presence-content"
32724
+ },
32725
+ {
32726
+ "description": "The presence icon.",
32727
+ "name": "mdc-presence-icon"
32728
+ },
32729
+ {
32730
+ "description": "The presence icon for active.",
32731
+ "name": "mdc-presence-icon__active"
32732
+ },
32733
+ {
32734
+ "description": "The presence icon for away.",
32735
+ "name": "mdc-presence-icon__away"
32736
+ },
32737
+ {
32738
+ "description": "The presence icon for away-calling.",
32739
+ "name": "mdc-presence-icon__away-calling"
32740
+ },
32741
+ {
32742
+ "description": "The presence icon for busy.",
32743
+ "name": "mdc-presence-icon__busy"
32744
+ },
32745
+ {
32746
+ "description": "The presence icon for dnd.",
32747
+ "name": "mdc-presence-icon__dnd"
32748
+ },
32749
+ {
32750
+ "description": "The presence icon for meeting.",
32751
+ "name": "mdc-presence-icon__meeting"
32752
+ },
32753
+ {
32754
+ "description": "The presence icon for on-call.",
32755
+ "name": "mdc-presence-icon__on-call"
32756
+ },
32757
+ {
32758
+ "description": "The presence icon for on-device.",
32759
+ "name": "mdc-presence-icon__on-device"
32760
+ },
32761
+ {
32762
+ "description": "The presence icon for on-mobile.",
32763
+ "name": "mdc-presence-icon__on-mobile"
32764
+ },
32765
+ {
32766
+ "description": "The presence icon for pause.",
32767
+ "name": "mdc-presence-icon__pause"
32768
+ },
32769
+ {
32770
+ "description": "The presence icon for pto.",
32771
+ "name": "mdc-presence-icon__pto"
32772
+ },
32773
+ {
32774
+ "description": "The presence icon for presenting.",
32775
+ "name": "mdc-presence-icon__presenting"
32776
+ },
32777
+ {
32778
+ "description": "The presence icon for quiet.",
32779
+ "name": "mdc-presence-icon__quiet"
32780
+ },
32781
+ {
32782
+ "description": "The presence icon for scheduled.",
32783
+ "name": "mdc-presence-icon__scheduled"
32784
+ }
32785
+ ],
32786
+ "members": [
32787
+ {
32788
+ "kind": "field",
32789
+ "name": "type",
32790
+ "type": {
32791
+ "text": "PresenceType"
32792
+ },
32793
+ "description": "Supported presence types:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
32794
+ "default": "active",
32795
+ "attribute": "type",
32796
+ "reflects": true
32797
+ },
32798
+ {
32799
+ "kind": "field",
32800
+ "name": "size",
32801
+ "type": {
32802
+ "text": "PresenceSize"
32803
+ },
32804
+ "description": "Acceptable numeric values include:\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124\n\nPresence icons are minimum 14px in size, meaning 24, 32, and 48 presence\nicons will be no smaller than 14px (for sizes 24, 32, 48).",
32805
+ "default": "32",
32806
+ "attribute": "size",
32807
+ "reflects": true
32808
+ },
32809
+ {
32810
+ "kind": "method",
32811
+ "name": "setSize",
32812
+ "privacy": "private",
32813
+ "return": {
32814
+ "type": {
32815
+ "text": "void"
32816
+ }
32817
+ },
32818
+ "parameters": [
32819
+ {
32820
+ "name": "size",
32821
+ "type": {
32822
+ "text": "PresenceSize"
32823
+ }
32824
+ }
32825
+ ]
32826
+ },
32827
+ {
32828
+ "kind": "field",
32829
+ "name": "icon",
32830
+ "privacy": "private",
32831
+ "description": "Get the icon name based on the presence type",
32832
+ "readonly": true
32833
+ },
32834
+ {
32835
+ "kind": "method",
32836
+ "name": "handleOnLoad",
32837
+ "privacy": "private",
32838
+ "return": {
32839
+ "type": {
32840
+ "text": "void"
32841
+ }
32842
+ },
32843
+ "description": "Handles the successful load of an icon.\nSets the `currentIconType` property to match the `type` property."
32844
+ },
32845
+ {
32846
+ "kind": "method",
32847
+ "name": "handleOnError",
32848
+ "privacy": "private",
32849
+ "return": {
32850
+ "type": {
32851
+ "text": "void"
32852
+ }
32853
+ },
32854
+ "description": "Handles an error that occurs when loading an icon."
32855
+ }
32856
+ ],
32857
+ "attributes": [
32858
+ {
32859
+ "name": "type",
32860
+ "type": {
32861
+ "text": "PresenceType"
32862
+ },
32863
+ "description": "Supported presence types:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
32864
+ "default": "active",
32865
+ "fieldName": "type"
32866
+ },
32867
+ {
32868
+ "name": "size",
32869
+ "type": {
32870
+ "text": "PresenceSize"
32871
+ },
32872
+ "description": "Acceptable numeric values include:\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124\n\nPresence icons are minimum 14px in size, meaning 24, 32, and 48 presence\nicons will be no smaller than 14px (for sizes 24, 32, 48).",
32873
+ "default": "32",
32874
+ "fieldName": "size"
32875
+ }
32876
+ ],
32877
+ "superclass": {
32878
+ "name": "Component",
32879
+ "module": "/src/models"
32880
+ },
32881
+ "tagName": "mdc-presence",
32882
+ "jsDoc": "/**\n * The `mdc-presence` component is a versatile UI element used to\n * display the presence status of a user or entity within an avatar component.\n *\n * This component is ideal for use within avatar UIs where the presence status\n * needs to be visually represented.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-presence\n *\n * @cssproperty --mdc-presence-active-background-color - The background color of the presence type active.\n * @cssproperty --mdc-presence-away-background-color - The background color of the presence type away.\n * @cssproperty --mdc-presence-away-calling-background-color - The background color of the presence type away-calling.\n * @cssproperty --mdc-presence-busy-background-color - The background color of the presence type busy.\n * @cssproperty --mdc-presence-dnd-background-color - The background color of the presence type dnd.\n * @cssproperty --mdc-presence-meeting-background-color - The background color of the presence type meeting.\n * @cssproperty --mdc-presence-on-call-background-color - The background color of the presence type on-call.\n * @cssproperty --mdc-presence-on-device-background-color - The background color of the presence type on-device.\n * @cssproperty --mdc-presence-on-mobile-background-color - The background color of the presence type on-mobile.\n * @cssproperty --mdc-presence-pause-background-color - The background color of the presence type pause.\n * @cssproperty --mdc-presence-pto-background-color - The background color of the presence type pto.\n * @cssproperty --mdc-presence-presenting-background-color - The background color of the presence type presenting.\n * @cssproperty --mdc-presence-quiet-background-color - The background color of the presence type quiet.\n * @cssproperty --mdc-presence-scheduled-background-color - The background color of the presence type scheduled.\n * @cssproperty --mdc-presence-overlay-background-color - The background color of the presence type overlay.\n *\n * @csspart presence-content - The presence content.\n * @csspart mdc-presence-icon - The presence icon.\n * @csspart mdc-presence-icon__active - The presence icon for active.\n * @csspart mdc-presence-icon__away - The presence icon for away.\n * @csspart mdc-presence-icon__away-calling - The presence icon for away-calling.\n * @csspart mdc-presence-icon__busy - The presence icon for busy.\n * @csspart mdc-presence-icon__dnd - The presence icon for dnd.\n * @csspart mdc-presence-icon__meeting - The presence icon for meeting.\n * @csspart mdc-presence-icon__on-call - The presence icon for on-call.\n * @csspart mdc-presence-icon__on-device - The presence icon for on-device.\n * @csspart mdc-presence-icon__on-mobile - The presence icon for on-mobile.\n * @csspart mdc-presence-icon__pause - The presence icon for pause.\n * @csspart mdc-presence-icon__pto - The presence icon for pto.\n * @csspart mdc-presence-icon__presenting - The presence icon for presenting.\n * @csspart mdc-presence-icon__quiet - The presence icon for quiet.\n * @csspart mdc-presence-icon__scheduled - The presence icon for scheduled.\n */",
32883
+ "customElement": true
32884
+ }
32885
+ ],
32886
+ "exports": [
32887
+ {
32888
+ "kind": "js",
32889
+ "name": "default",
32890
+ "declaration": {
32891
+ "name": "Presence",
32892
+ "module": "components/presence/presence.component.js"
32893
+ }
32894
+ }
32895
+ ]
32896
+ },
32650
32897
  {
32651
32898
  "kind": "javascript-module",
32652
32899
  "path": "components/popover/popover.component.js",
@@ -34211,253 +34458,6 @@
34211
34458
  }
34212
34459
  ]
34213
34460
  },
34214
- {
34215
- "kind": "javascript-module",
34216
- "path": "components/presence/presence.component.js",
34217
- "declarations": [
34218
- {
34219
- "kind": "class",
34220
- "description": "The `mdc-presence` component is a versatile UI element used to\ndisplay the presence status of a user or entity within an avatar component.\n\nThis component is ideal for use within avatar UIs where the presence status\nneeds to be visually represented.",
34221
- "name": "Presence",
34222
- "cssProperties": [
34223
- {
34224
- "description": "The background color of the presence type active.",
34225
- "name": "--mdc-presence-active-background-color"
34226
- },
34227
- {
34228
- "description": "The background color of the presence type away.",
34229
- "name": "--mdc-presence-away-background-color"
34230
- },
34231
- {
34232
- "description": "The background color of the presence type away-calling.",
34233
- "name": "--mdc-presence-away-calling-background-color"
34234
- },
34235
- {
34236
- "description": "The background color of the presence type busy.",
34237
- "name": "--mdc-presence-busy-background-color"
34238
- },
34239
- {
34240
- "description": "The background color of the presence type dnd.",
34241
- "name": "--mdc-presence-dnd-background-color"
34242
- },
34243
- {
34244
- "description": "The background color of the presence type meeting.",
34245
- "name": "--mdc-presence-meeting-background-color"
34246
- },
34247
- {
34248
- "description": "The background color of the presence type on-call.",
34249
- "name": "--mdc-presence-on-call-background-color"
34250
- },
34251
- {
34252
- "description": "The background color of the presence type on-device.",
34253
- "name": "--mdc-presence-on-device-background-color"
34254
- },
34255
- {
34256
- "description": "The background color of the presence type on-mobile.",
34257
- "name": "--mdc-presence-on-mobile-background-color"
34258
- },
34259
- {
34260
- "description": "The background color of the presence type pause.",
34261
- "name": "--mdc-presence-pause-background-color"
34262
- },
34263
- {
34264
- "description": "The background color of the presence type pto.",
34265
- "name": "--mdc-presence-pto-background-color"
34266
- },
34267
- {
34268
- "description": "The background color of the presence type presenting.",
34269
- "name": "--mdc-presence-presenting-background-color"
34270
- },
34271
- {
34272
- "description": "The background color of the presence type quiet.",
34273
- "name": "--mdc-presence-quiet-background-color"
34274
- },
34275
- {
34276
- "description": "The background color of the presence type scheduled.",
34277
- "name": "--mdc-presence-scheduled-background-color"
34278
- },
34279
- {
34280
- "description": "The background color of the presence type overlay.",
34281
- "name": "--mdc-presence-overlay-background-color"
34282
- }
34283
- ],
34284
- "cssParts": [
34285
- {
34286
- "description": "The presence content.",
34287
- "name": "presence-content"
34288
- },
34289
- {
34290
- "description": "The presence icon.",
34291
- "name": "mdc-presence-icon"
34292
- },
34293
- {
34294
- "description": "The presence icon for active.",
34295
- "name": "mdc-presence-icon__active"
34296
- },
34297
- {
34298
- "description": "The presence icon for away.",
34299
- "name": "mdc-presence-icon__away"
34300
- },
34301
- {
34302
- "description": "The presence icon for away-calling.",
34303
- "name": "mdc-presence-icon__away-calling"
34304
- },
34305
- {
34306
- "description": "The presence icon for busy.",
34307
- "name": "mdc-presence-icon__busy"
34308
- },
34309
- {
34310
- "description": "The presence icon for dnd.",
34311
- "name": "mdc-presence-icon__dnd"
34312
- },
34313
- {
34314
- "description": "The presence icon for meeting.",
34315
- "name": "mdc-presence-icon__meeting"
34316
- },
34317
- {
34318
- "description": "The presence icon for on-call.",
34319
- "name": "mdc-presence-icon__on-call"
34320
- },
34321
- {
34322
- "description": "The presence icon for on-device.",
34323
- "name": "mdc-presence-icon__on-device"
34324
- },
34325
- {
34326
- "description": "The presence icon for on-mobile.",
34327
- "name": "mdc-presence-icon__on-mobile"
34328
- },
34329
- {
34330
- "description": "The presence icon for pause.",
34331
- "name": "mdc-presence-icon__pause"
34332
- },
34333
- {
34334
- "description": "The presence icon for pto.",
34335
- "name": "mdc-presence-icon__pto"
34336
- },
34337
- {
34338
- "description": "The presence icon for presenting.",
34339
- "name": "mdc-presence-icon__presenting"
34340
- },
34341
- {
34342
- "description": "The presence icon for quiet.",
34343
- "name": "mdc-presence-icon__quiet"
34344
- },
34345
- {
34346
- "description": "The presence icon for scheduled.",
34347
- "name": "mdc-presence-icon__scheduled"
34348
- }
34349
- ],
34350
- "members": [
34351
- {
34352
- "kind": "field",
34353
- "name": "type",
34354
- "type": {
34355
- "text": "PresenceType"
34356
- },
34357
- "description": "Supported presence types:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
34358
- "default": "active",
34359
- "attribute": "type",
34360
- "reflects": true
34361
- },
34362
- {
34363
- "kind": "field",
34364
- "name": "size",
34365
- "type": {
34366
- "text": "PresenceSize"
34367
- },
34368
- "description": "Acceptable numeric values include:\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124\n\nPresence icons are minimum 14px in size, meaning 24, 32, and 48 presence\nicons will be no smaller than 14px (for sizes 24, 32, 48).",
34369
- "default": "32",
34370
- "attribute": "size",
34371
- "reflects": true
34372
- },
34373
- {
34374
- "kind": "method",
34375
- "name": "setSize",
34376
- "privacy": "private",
34377
- "return": {
34378
- "type": {
34379
- "text": "void"
34380
- }
34381
- },
34382
- "parameters": [
34383
- {
34384
- "name": "size",
34385
- "type": {
34386
- "text": "PresenceSize"
34387
- }
34388
- }
34389
- ]
34390
- },
34391
- {
34392
- "kind": "field",
34393
- "name": "icon",
34394
- "privacy": "private",
34395
- "description": "Get the icon name based on the presence type",
34396
- "readonly": true
34397
- },
34398
- {
34399
- "kind": "method",
34400
- "name": "handleOnLoad",
34401
- "privacy": "private",
34402
- "return": {
34403
- "type": {
34404
- "text": "void"
34405
- }
34406
- },
34407
- "description": "Handles the successful load of an icon.\nSets the `currentIconType` property to match the `type` property."
34408
- },
34409
- {
34410
- "kind": "method",
34411
- "name": "handleOnError",
34412
- "privacy": "private",
34413
- "return": {
34414
- "type": {
34415
- "text": "void"
34416
- }
34417
- },
34418
- "description": "Handles an error that occurs when loading an icon."
34419
- }
34420
- ],
34421
- "attributes": [
34422
- {
34423
- "name": "type",
34424
- "type": {
34425
- "text": "PresenceType"
34426
- },
34427
- "description": "Supported presence types:\n- `active`\n- `away`\n- `away-calling`\n- `busy`\n- `dnd`\n- `meeting`\n- `on-call`\n- `on-device`\n- `on-mobile`\n- `pause`\n- `pto`\n- `presenting`\n- `quiet`\n- `scheduled`",
34428
- "default": "active",
34429
- "fieldName": "type"
34430
- },
34431
- {
34432
- "name": "size",
34433
- "type": {
34434
- "text": "PresenceSize"
34435
- },
34436
- "description": "Acceptable numeric values include:\n- 24\n- 32\n- 48\n- 64\n- 72\n- 88\n- 124\n\nPresence icons are minimum 14px in size, meaning 24, 32, and 48 presence\nicons will be no smaller than 14px (for sizes 24, 32, 48).",
34437
- "default": "32",
34438
- "fieldName": "size"
34439
- }
34440
- ],
34441
- "superclass": {
34442
- "name": "Component",
34443
- "module": "/src/models"
34444
- },
34445
- "tagName": "mdc-presence",
34446
- "jsDoc": "/**\n * The `mdc-presence` component is a versatile UI element used to\n * display the presence status of a user or entity within an avatar component.\n *\n * This component is ideal for use within avatar UIs where the presence status\n * needs to be visually represented.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-presence\n *\n * @cssproperty --mdc-presence-active-background-color - The background color of the presence type active.\n * @cssproperty --mdc-presence-away-background-color - The background color of the presence type away.\n * @cssproperty --mdc-presence-away-calling-background-color - The background color of the presence type away-calling.\n * @cssproperty --mdc-presence-busy-background-color - The background color of the presence type busy.\n * @cssproperty --mdc-presence-dnd-background-color - The background color of the presence type dnd.\n * @cssproperty --mdc-presence-meeting-background-color - The background color of the presence type meeting.\n * @cssproperty --mdc-presence-on-call-background-color - The background color of the presence type on-call.\n * @cssproperty --mdc-presence-on-device-background-color - The background color of the presence type on-device.\n * @cssproperty --mdc-presence-on-mobile-background-color - The background color of the presence type on-mobile.\n * @cssproperty --mdc-presence-pause-background-color - The background color of the presence type pause.\n * @cssproperty --mdc-presence-pto-background-color - The background color of the presence type pto.\n * @cssproperty --mdc-presence-presenting-background-color - The background color of the presence type presenting.\n * @cssproperty --mdc-presence-quiet-background-color - The background color of the presence type quiet.\n * @cssproperty --mdc-presence-scheduled-background-color - The background color of the presence type scheduled.\n * @cssproperty --mdc-presence-overlay-background-color - The background color of the presence type overlay.\n *\n * @csspart presence-content - The presence content.\n * @csspart mdc-presence-icon - The presence icon.\n * @csspart mdc-presence-icon__active - The presence icon for active.\n * @csspart mdc-presence-icon__away - The presence icon for away.\n * @csspart mdc-presence-icon__away-calling - The presence icon for away-calling.\n * @csspart mdc-presence-icon__busy - The presence icon for busy.\n * @csspart mdc-presence-icon__dnd - The presence icon for dnd.\n * @csspart mdc-presence-icon__meeting - The presence icon for meeting.\n * @csspart mdc-presence-icon__on-call - The presence icon for on-call.\n * @csspart mdc-presence-icon__on-device - The presence icon for on-device.\n * @csspart mdc-presence-icon__on-mobile - The presence icon for on-mobile.\n * @csspart mdc-presence-icon__pause - The presence icon for pause.\n * @csspart mdc-presence-icon__pto - The presence icon for pto.\n * @csspart mdc-presence-icon__presenting - The presence icon for presenting.\n * @csspart mdc-presence-icon__quiet - The presence icon for quiet.\n * @csspart mdc-presence-icon__scheduled - The presence icon for scheduled.\n */",
34447
- "customElement": true
34448
- }
34449
- ],
34450
- "exports": [
34451
- {
34452
- "kind": "js",
34453
- "name": "default",
34454
- "declaration": {
34455
- "name": "Presence",
34456
- "module": "components/presence/presence.component.js"
34457
- }
34458
- }
34459
- ]
34460
- },
34461
34461
  {
34462
34462
  "kind": "javascript-module",
34463
34463
  "path": "components/progressbar/progressbar.component.js",
@@ -42525,94 +42525,6 @@
42525
42525
  }
42526
42526
  ]
42527
42527
  },
42528
- {
42529
- "kind": "javascript-module",
42530
- "path": "components/stepperconnector/stepperconnector.component.js",
42531
- "declarations": [
42532
- {
42533
- "kind": "class",
42534
- "description": "StepperConnector component visually represents the connection between two stepper items.\nIndicates whether the connection is complete or incomplete, and supports vertical or horizontal orientation.\nThey are used between 2 `mdc-stepperitem` components to visually connect them and wrapped in a `mdc-stepper` component.",
42535
- "name": "StepperConnector",
42536
- "cssProperties": [
42537
- {
42538
- "description": "Background color for the complete connector",
42539
- "name": "--mdc-stepperconnector-complete-background"
42540
- },
42541
- {
42542
- "description": "Background color for the incomplete connector",
42543
- "name": "--mdc-stepperconnector-incomplete-background"
42544
- }
42545
- ],
42546
- "cssParts": [
42547
- {
42548
- "description": "The main connector line between steps",
42549
- "name": "connector"
42550
- }
42551
- ],
42552
- "members": [
42553
- {
42554
- "kind": "field",
42555
- "name": "status",
42556
- "type": {
42557
- "text": "StatusType"
42558
- },
42559
- "description": "The status of the connector (complete or incomplete)",
42560
- "default": "\"incomplete\"",
42561
- "attribute": "status",
42562
- "reflects": true
42563
- },
42564
- {
42565
- "kind": "field",
42566
- "name": "orientation",
42567
- "type": {
42568
- "text": "OrientationType"
42569
- },
42570
- "description": "The orientation of the connector (vertical or horizontal)",
42571
- "default": "\"horizontal\"",
42572
- "attribute": "orientation",
42573
- "reflects": true
42574
- }
42575
- ],
42576
- "attributes": [
42577
- {
42578
- "name": "status",
42579
- "type": {
42580
- "text": "StatusType"
42581
- },
42582
- "description": "The status of the connector (complete or incomplete)",
42583
- "default": "\"incomplete\"",
42584
- "fieldName": "status"
42585
- },
42586
- {
42587
- "name": "orientation",
42588
- "type": {
42589
- "text": "OrientationType"
42590
- },
42591
- "description": "The orientation of the connector (vertical or horizontal)",
42592
- "default": "\"horizontal\"",
42593
- "fieldName": "orientation"
42594
- }
42595
- ],
42596
- "superclass": {
42597
- "name": "Component",
42598
- "module": "/src/models"
42599
- },
42600
- "tagName": "mdc-stepperconnector",
42601
- "jsDoc": "/**\n * StepperConnector component visually represents the connection between two stepper items.\n * Indicates whether the connection is complete or incomplete, and supports vertical or horizontal orientation.\n * They are used between 2 `mdc-stepperitem` components to visually connect them and wrapped in a `mdc-stepper` component.\n *\n * @tagname mdc-stepperconnector\n *\n * @csspart connector - The main connector line between steps\n *\n * @cssproperty --mdc-stepperconnector-complete-background - Background color for the complete connector\n * @cssproperty --mdc-stepperconnector-incomplete-background - Background color for the incomplete connector\n */",
42602
- "customElement": true
42603
- }
42604
- ],
42605
- "exports": [
42606
- {
42607
- "kind": "js",
42608
- "name": "default",
42609
- "declaration": {
42610
- "name": "StepperConnector",
42611
- "module": "components/stepperconnector/stepperconnector.component.js"
42612
- }
42613
- }
42614
- ]
42615
- },
42616
42528
  {
42617
42529
  "kind": "javascript-module",
42618
42530
  "path": "components/stepperitem/stepperitem.component.js",
@@ -42910,6 +42822,194 @@
42910
42822
  }
42911
42823
  ]
42912
42824
  },
42825
+ {
42826
+ "kind": "javascript-module",
42827
+ "path": "components/stepperconnector/stepperconnector.component.js",
42828
+ "declarations": [
42829
+ {
42830
+ "kind": "class",
42831
+ "description": "StepperConnector component visually represents the connection between two stepper items.\nIndicates whether the connection is complete or incomplete, and supports vertical or horizontal orientation.\nThey are used between 2 `mdc-stepperitem` components to visually connect them and wrapped in a `mdc-stepper` component.",
42832
+ "name": "StepperConnector",
42833
+ "cssProperties": [
42834
+ {
42835
+ "description": "Background color for the complete connector",
42836
+ "name": "--mdc-stepperconnector-complete-background"
42837
+ },
42838
+ {
42839
+ "description": "Background color for the incomplete connector",
42840
+ "name": "--mdc-stepperconnector-incomplete-background"
42841
+ }
42842
+ ],
42843
+ "cssParts": [
42844
+ {
42845
+ "description": "The main connector line between steps",
42846
+ "name": "connector"
42847
+ }
42848
+ ],
42849
+ "members": [
42850
+ {
42851
+ "kind": "field",
42852
+ "name": "status",
42853
+ "type": {
42854
+ "text": "StatusType"
42855
+ },
42856
+ "description": "The status of the connector (complete or incomplete)",
42857
+ "default": "\"incomplete\"",
42858
+ "attribute": "status",
42859
+ "reflects": true
42860
+ },
42861
+ {
42862
+ "kind": "field",
42863
+ "name": "orientation",
42864
+ "type": {
42865
+ "text": "OrientationType"
42866
+ },
42867
+ "description": "The orientation of the connector (vertical or horizontal)",
42868
+ "default": "\"horizontal\"",
42869
+ "attribute": "orientation",
42870
+ "reflects": true
42871
+ }
42872
+ ],
42873
+ "attributes": [
42874
+ {
42875
+ "name": "status",
42876
+ "type": {
42877
+ "text": "StatusType"
42878
+ },
42879
+ "description": "The status of the connector (complete or incomplete)",
42880
+ "default": "\"incomplete\"",
42881
+ "fieldName": "status"
42882
+ },
42883
+ {
42884
+ "name": "orientation",
42885
+ "type": {
42886
+ "text": "OrientationType"
42887
+ },
42888
+ "description": "The orientation of the connector (vertical or horizontal)",
42889
+ "default": "\"horizontal\"",
42890
+ "fieldName": "orientation"
42891
+ }
42892
+ ],
42893
+ "superclass": {
42894
+ "name": "Component",
42895
+ "module": "/src/models"
42896
+ },
42897
+ "tagName": "mdc-stepperconnector",
42898
+ "jsDoc": "/**\n * StepperConnector component visually represents the connection between two stepper items.\n * Indicates whether the connection is complete or incomplete, and supports vertical or horizontal orientation.\n * They are used between 2 `mdc-stepperitem` components to visually connect them and wrapped in a `mdc-stepper` component.\n *\n * @tagname mdc-stepperconnector\n *\n * @csspart connector - The main connector line between steps\n *\n * @cssproperty --mdc-stepperconnector-complete-background - Background color for the complete connector\n * @cssproperty --mdc-stepperconnector-incomplete-background - Background color for the incomplete connector\n */",
42899
+ "customElement": true
42900
+ }
42901
+ ],
42902
+ "exports": [
42903
+ {
42904
+ "kind": "js",
42905
+ "name": "default",
42906
+ "declaration": {
42907
+ "name": "StepperConnector",
42908
+ "module": "components/stepperconnector/stepperconnector.component.js"
42909
+ }
42910
+ }
42911
+ ]
42912
+ },
42913
+ {
42914
+ "kind": "javascript-module",
42915
+ "path": "components/tablist/tablist.component.js",
42916
+ "declarations": [
42917
+ {
42918
+ "kind": "class",
42919
+ "description": "Tab list organizes tabs into a container.\n\nChildren of the tab list are `mdc-tab` elements, sent to the default slot.\n\nThe tabs can be navigated using the left/right arrow keys, and selected by clicking,\n or pressing the Enter and Space keys.\n\n**Implicit accessibility rules**\n\n- The element that serves as the container for the set of tabs has role `tablist`.\n- Each element that serves as a tab has role `tab` and is contained within the element with role `tablist`.\n- The active tab element has the state `aria-selected` set to `true`\n and all other tab elements have it set to `false`.\n\n\n**Accessibility notes for consuming (have to be explicitly set when you consume the component)**\n\n- Each element that contains the `content panel` for a `tab` has role `tabpanel`.\n- The `tablist` element needs to have a label provided by `data-aria-label`.\n- Each element with role `tab` has the property `aria-controls`\n that should refer to its associated `tabpanel` element.\n- Each element with role `tabpanel` has the property `aria-labelledby` referring to its associated `tab` element.\n- If a `tab` element has a popup menu, it needs to have the property `aria-haspopup` set to either `menu` or `true`.",
42920
+ "name": "TabList",
42921
+ "cssProperties": [
42922
+ {
42923
+ "description": "Gap between tabs",
42924
+ "name": "--mdc-tablist-gap"
42925
+ },
42926
+ {
42927
+ "description": "Width of the tablist",
42928
+ "name": "--mdc-tablist-width"
42929
+ },
42930
+ {
42931
+ "description": "Margin value for the arrow button",
42932
+ "name": "--mdc-tablist-arrow-button-margin"
42933
+ }
42934
+ ],
42935
+ "cssParts": [
42936
+ {
42937
+ "description": "The tablist container.",
42938
+ "name": "container"
42939
+ }
42940
+ ],
42941
+ "slots": [
42942
+ {
42943
+ "description": "slot for mdc-tab elements.",
42944
+ "name": "Default"
42945
+ }
42946
+ ],
42947
+ "members": [
42948
+ {
42949
+ "kind": "field",
42950
+ "name": "activeTabId",
42951
+ "type": {
42952
+ "text": "string | undefined"
42953
+ },
42954
+ "description": "ID of the active tab, defaults to the first tab if not provided",
42955
+ "attribute": "active-tab-id",
42956
+ "reflects": true
42957
+ },
42958
+ {
42959
+ "kind": "field",
42960
+ "name": "dataAriaLabel",
42961
+ "type": {
42962
+ "text": "string | undefined"
42963
+ },
42964
+ "description": "Label for the tablist.\nThis is used when the tablist does not have a visible label.",
42965
+ "attribute": "data-aria-label"
42966
+ }
42967
+ ],
42968
+ "events": [
42969
+ {
42970
+ "description": "(React: onChange) This event is dispatched when the tab is selected. Event that fires when user changes the active tab. The function sent as the argument will receive the fired event and the new tab id can be fetched from event.detail.tabId. `(event: CustomEvent) => handleTabChange(event.detail.tabId);`",
42971
+ "name": "change",
42972
+ "reactName": "onChange"
42973
+ }
42974
+ ],
42975
+ "attributes": [
42976
+ {
42977
+ "name": "active-tab-id",
42978
+ "type": {
42979
+ "text": "string | undefined"
42980
+ },
42981
+ "description": "ID of the active tab, defaults to the first tab if not provided",
42982
+ "fieldName": "activeTabId"
42983
+ },
42984
+ {
42985
+ "name": "data-aria-label",
42986
+ "type": {
42987
+ "text": "string | undefined"
42988
+ },
42989
+ "description": "Label for the tablist.\nThis is used when the tablist does not have a visible label.",
42990
+ "fieldName": "dataAriaLabel"
42991
+ }
42992
+ ],
42993
+ "superclass": {
42994
+ "name": "Component",
42995
+ "module": "/src/models"
42996
+ },
42997
+ "tagName": "mdc-tablist",
42998
+ "jsDoc": "/**\n * Tab list organizes tabs into a container.\n *\n * Children of the tab list are `mdc-tab` elements, sent to the default slot.\n *\n * The tabs can be navigated using the left/right arrow keys, and selected by clicking,\n * or pressing the Enter and Space keys.\n *\n * **Implicit accessibility rules**\n *\n * - The element that serves as the container for the set of tabs has role `tablist`.\n * - Each element that serves as a tab has role `tab` and is contained within the element with role `tablist`.\n * - The active tab element has the state `aria-selected` set to `true`\n * and all other tab elements have it set to `false`.\n *\n *\n * **Accessibility notes for consuming (have to be explicitly set when you consume the component)**\n *\n * - Each element that contains the `content panel` for a `tab` has role `tabpanel`.\n * - The `tablist` element needs to have a label provided by `data-aria-label`.\n * - Each element with role `tab` has the property `aria-controls`\n * that should refer to its associated `tabpanel` element.\n * - Each element with role `tabpanel` has the property `aria-labelledby` referring to its associated `tab` element.\n * - If a `tab` element has a popup menu, it needs to have the property `aria-haspopup` set to either `menu` or `true`.\n *\n * @tagname mdc-tablist\n *\n * @dependency mdc-tab\n * @dependency mdc-button\n *\n * @event change - (React: onChange) This event is dispatched when the tab is selected.\n * Event that fires when user changes the active tab.\n * The function sent as the argument will receive the fired event\n * and the new tab id can be fetched from event.detail.tabId.\n *\n * `(event: CustomEvent) => handleTabChange(event.detail.tabId);`\n *\n * @slot Default slot for mdc-tab elements.\n *\n * @cssproperty --mdc-tablist-gap - Gap between tabs\n * @cssproperty --mdc-tablist-width - Width of the tablist\n * @cssproperty --mdc-tablist-arrow-button-margin - Margin value for the arrow button\n *\n * @csspart container - The tablist container.\n */",
42999
+ "customElement": true
43000
+ }
43001
+ ],
43002
+ "exports": [
43003
+ {
43004
+ "kind": "js",
43005
+ "name": "default",
43006
+ "declaration": {
43007
+ "name": "TabList",
43008
+ "module": "components/tablist/tablist.component.js"
43009
+ }
43010
+ }
43011
+ ]
43012
+ },
42913
43013
  {
42914
43014
  "kind": "javascript-module",
42915
43015
  "path": "components/tab/tab.component.js",
@@ -43827,106 +43927,6 @@
43827
43927
  }
43828
43928
  ]
43829
43929
  },
43830
- {
43831
- "kind": "javascript-module",
43832
- "path": "components/tablist/tablist.component.js",
43833
- "declarations": [
43834
- {
43835
- "kind": "class",
43836
- "description": "Tab list organizes tabs into a container.\n\nChildren of the tab list are `mdc-tab` elements, sent to the default slot.\n\nThe tabs can be navigated using the left/right arrow keys, and selected by clicking,\n or pressing the Enter and Space keys.\n\n**Implicit accessibility rules**\n\n- The element that serves as the container for the set of tabs has role `tablist`.\n- Each element that serves as a tab has role `tab` and is contained within the element with role `tablist`.\n- The active tab element has the state `aria-selected` set to `true`\n and all other tab elements have it set to `false`.\n\n\n**Accessibility notes for consuming (have to be explicitly set when you consume the component)**\n\n- Each element that contains the `content panel` for a `tab` has role `tabpanel`.\n- The `tablist` element needs to have a label provided by `data-aria-label`.\n- Each element with role `tab` has the property `aria-controls`\n that should refer to its associated `tabpanel` element.\n- Each element with role `tabpanel` has the property `aria-labelledby` referring to its associated `tab` element.\n- If a `tab` element has a popup menu, it needs to have the property `aria-haspopup` set to either `menu` or `true`.",
43837
- "name": "TabList",
43838
- "cssProperties": [
43839
- {
43840
- "description": "Gap between tabs",
43841
- "name": "--mdc-tablist-gap"
43842
- },
43843
- {
43844
- "description": "Width of the tablist",
43845
- "name": "--mdc-tablist-width"
43846
- },
43847
- {
43848
- "description": "Margin value for the arrow button",
43849
- "name": "--mdc-tablist-arrow-button-margin"
43850
- }
43851
- ],
43852
- "cssParts": [
43853
- {
43854
- "description": "The tablist container.",
43855
- "name": "container"
43856
- }
43857
- ],
43858
- "slots": [
43859
- {
43860
- "description": "slot for mdc-tab elements.",
43861
- "name": "Default"
43862
- }
43863
- ],
43864
- "members": [
43865
- {
43866
- "kind": "field",
43867
- "name": "activeTabId",
43868
- "type": {
43869
- "text": "string | undefined"
43870
- },
43871
- "description": "ID of the active tab, defaults to the first tab if not provided",
43872
- "attribute": "active-tab-id",
43873
- "reflects": true
43874
- },
43875
- {
43876
- "kind": "field",
43877
- "name": "dataAriaLabel",
43878
- "type": {
43879
- "text": "string | undefined"
43880
- },
43881
- "description": "Label for the tablist.\nThis is used when the tablist does not have a visible label.",
43882
- "attribute": "data-aria-label"
43883
- }
43884
- ],
43885
- "events": [
43886
- {
43887
- "description": "(React: onChange) This event is dispatched when the tab is selected. Event that fires when user changes the active tab. The function sent as the argument will receive the fired event and the new tab id can be fetched from event.detail.tabId. `(event: CustomEvent) => handleTabChange(event.detail.tabId);`",
43888
- "name": "change",
43889
- "reactName": "onChange"
43890
- }
43891
- ],
43892
- "attributes": [
43893
- {
43894
- "name": "active-tab-id",
43895
- "type": {
43896
- "text": "string | undefined"
43897
- },
43898
- "description": "ID of the active tab, defaults to the first tab if not provided",
43899
- "fieldName": "activeTabId"
43900
- },
43901
- {
43902
- "name": "data-aria-label",
43903
- "type": {
43904
- "text": "string | undefined"
43905
- },
43906
- "description": "Label for the tablist.\nThis is used when the tablist does not have a visible label.",
43907
- "fieldName": "dataAriaLabel"
43908
- }
43909
- ],
43910
- "superclass": {
43911
- "name": "Component",
43912
- "module": "/src/models"
43913
- },
43914
- "tagName": "mdc-tablist",
43915
- "jsDoc": "/**\n * Tab list organizes tabs into a container.\n *\n * Children of the tab list are `mdc-tab` elements, sent to the default slot.\n *\n * The tabs can be navigated using the left/right arrow keys, and selected by clicking,\n * or pressing the Enter and Space keys.\n *\n * **Implicit accessibility rules**\n *\n * - The element that serves as the container for the set of tabs has role `tablist`.\n * - Each element that serves as a tab has role `tab` and is contained within the element with role `tablist`.\n * - The active tab element has the state `aria-selected` set to `true`\n * and all other tab elements have it set to `false`.\n *\n *\n * **Accessibility notes for consuming (have to be explicitly set when you consume the component)**\n *\n * - Each element that contains the `content panel` for a `tab` has role `tabpanel`.\n * - The `tablist` element needs to have a label provided by `data-aria-label`.\n * - Each element with role `tab` has the property `aria-controls`\n * that should refer to its associated `tabpanel` element.\n * - Each element with role `tabpanel` has the property `aria-labelledby` referring to its associated `tab` element.\n * - If a `tab` element has a popup menu, it needs to have the property `aria-haspopup` set to either `menu` or `true`.\n *\n * @tagname mdc-tablist\n *\n * @dependency mdc-tab\n * @dependency mdc-button\n *\n * @event change - (React: onChange) This event is dispatched when the tab is selected.\n * Event that fires when user changes the active tab.\n * The function sent as the argument will receive the fired event\n * and the new tab id can be fetched from event.detail.tabId.\n *\n * `(event: CustomEvent) => handleTabChange(event.detail.tabId);`\n *\n * @slot Default slot for mdc-tab elements.\n *\n * @cssproperty --mdc-tablist-gap - Gap between tabs\n * @cssproperty --mdc-tablist-width - Width of the tablist\n * @cssproperty --mdc-tablist-arrow-button-margin - Margin value for the arrow button\n *\n * @csspart container - The tablist container.\n */",
43916
- "customElement": true
43917
- }
43918
- ],
43919
- "exports": [
43920
- {
43921
- "kind": "js",
43922
- "name": "default",
43923
- "declaration": {
43924
- "name": "TabList",
43925
- "module": "components/tablist/tablist.component.js"
43926
- }
43927
- }
43928
- ]
43929
- },
43930
43930
  {
43931
43931
  "kind": "javascript-module",
43932
43932
  "path": "components/text/text.component.js",
@@ -45134,506 +45134,6 @@
45134
45134
  }
45135
45135
  ]
45136
45136
  },
45137
- {
45138
- "kind": "javascript-module",
45139
- "path": "components/themeprovider/themeprovider.component.js",
45140
- "declarations": [
45141
- {
45142
- "kind": "class",
45143
- "description": "ThemeProvider component, which sets the passed in themeclass as class.\nIf the themeclass switches, the existing themeclass will be removed as a class\nand the new themeclass will be added.\n\nCSS variables defined in the themeclass will be used for the styling of child dom nodes.\n\nAvailable Momentum theme classes:\n\n`mds-theme-stable-darkWebex`, `mds-theme-stable-lightWebex`\n\n`mds-theme-stable-darkBronzeWebex`, `mds-theme-stable-lightBronzeWebex`\n\n`mds-theme-stable-darkIndigoWebex`, `mds-theme-stable-lightIndigoWebex`\n\n`mds-theme-stable-darkJadeWebex`, `mds-theme-stable-lightJadeWebex`\n\n`mds-theme-stable-darkLavenderWebex`, `mds-theme-stable-lightLavenderWebex`\n\n`mds-theme-stable-darkRoseWebex`, `mds-theme-stable-lightRoseWebex`\n\nThemeclass context can be be consumed from Lit child components\n(see providerUtils.consume for how to consume)\n\nThemeProvider also includes basic font defaults for text.",
45144
- "name": "ThemeProvider",
45145
- "cssProperties": [
45146
- {
45147
- "description": "Option to override the default color, default: color-theme-text-primary-normal",
45148
- "name": "--mdc-themeprovider-color-default"
45149
- },
45150
- {
45151
- "description": "Option to override the font family, default: `Momentum` (from momentum-design/fonts)",
45152
- "name": "--mdc-themeprovider-font-family"
45153
- },
45154
- {
45155
- "description": "Option to override the font weight, default: `400`",
45156
- "name": "--mdc-themeprovider-font-weight"
45157
- },
45158
- {
45159
- "description": "Option to override the default letter-spacing, default: `-0.25px` (this is to match the old CiscoSans)",
45160
- "name": "--mdc-themeprovider-letter-spacing-adjustment"
45161
- },
45162
- {
45163
- "description": "Option to override the font feature settings, default: `\"ss02\" on`",
45164
- "name": "--mdc-themeprovider-font-feature-settings"
45165
- },
45166
- {
45167
- "description": "Option to override the color of the scrollbar track.",
45168
- "name": "--mdc-themeprovider-scrollbar-track-color"
45169
- },
45170
- {
45171
- "description": "Option to override the color of the scrollbar thumb.",
45172
- "name": "--mdc-themeprovider-scrollbar-thumb-color"
45173
- }
45174
- ],
45175
- "slots": [
45176
- {
45177
- "description": "children",
45178
- "name": ""
45179
- }
45180
- ],
45181
- "members": [
45182
- {
45183
- "kind": "field",
45184
- "name": "Context",
45185
- "privacy": "public",
45186
- "static": true,
45187
- "description": "Context object of the ThemeProvider, to be consumed by child components",
45188
- "readonly": true
45189
- },
45190
- {
45191
- "kind": "field",
45192
- "name": "themeclass",
45193
- "type": {
45194
- "text": "string"
45195
- },
45196
- "description": "Current theme class\n\nHas to be fully qualified, such that\nthe theme class matches the class of the respective\ntheme stylesheet\n\nDefault: 'mds-theme-stable-darkWebex'",
45197
- "attribute": "themeclass"
45198
- },
45199
- {
45200
- "kind": "method",
45201
- "name": "updateContext",
45202
- "privacy": "protected",
45203
- "return": {
45204
- "type": {
45205
- "text": "void"
45206
- }
45207
- },
45208
- "description": "Update all observing components of this\nprovider to update the themeclass\n\nIs called on every re-render, see Provider class"
45209
- },
45210
- {
45211
- "kind": "method",
45212
- "name": "setThemeInClassList",
45213
- "privacy": "private",
45214
- "description": "Function to update the active theme classnames to update the theme tokens\nas CSS variables on the web component."
45215
- }
45216
- ],
45217
- "attributes": [
45218
- {
45219
- "name": "themeclass",
45220
- "type": {
45221
- "text": "string"
45222
- },
45223
- "description": "Current theme class\n\nHas to be fully qualified, such that\nthe theme class matches the class of the respective\ntheme stylesheet\n\nDefault: 'mds-theme-stable-darkWebex'",
45224
- "fieldName": "themeclass"
45225
- }
45226
- ],
45227
- "superclass": {
45228
- "name": "Provider",
45229
- "module": "/src/models"
45230
- },
45231
- "tagName": "mdc-themeprovider",
45232
- "jsDoc": "/**\n * ThemeProvider component, which sets the passed in themeclass as class.\n * If the themeclass switches, the existing themeclass will be removed as a class\n * and the new themeclass will be added.\n *\n * CSS variables defined in the themeclass will be used for the styling of child dom nodes.\n *\n * Available Momentum theme classes:\n *\n * `mds-theme-stable-darkWebex`, `mds-theme-stable-lightWebex`\n *\n * `mds-theme-stable-darkBronzeWebex`, `mds-theme-stable-lightBronzeWebex`\n *\n * `mds-theme-stable-darkIndigoWebex`, `mds-theme-stable-lightIndigoWebex`\n *\n * `mds-theme-stable-darkJadeWebex`, `mds-theme-stable-lightJadeWebex`\n *\n * `mds-theme-stable-darkLavenderWebex`, `mds-theme-stable-lightLavenderWebex`\n *\n * `mds-theme-stable-darkRoseWebex`, `mds-theme-stable-lightRoseWebex`\n *\n * Themeclass context can be be consumed from Lit child components\n * (see providerUtils.consume for how to consume)\n *\n * ThemeProvider also includes basic font defaults for text.\n *\n * @tagname mdc-themeprovider\n *\n * @slot - children\n *\n * @cssproperty --mdc-themeprovider-color-default - Option to override the default color,\n * default: color-theme-text-primary-normal\n * @cssproperty --mdc-themeprovider-font-family - Option to override the font family,\n * default: `Momentum` (from momentum-design/fonts)\n * @cssproperty --mdc-themeprovider-font-weight - Option to override the font weight, default: `400`\n * @cssproperty --mdc-themeprovider-letter-spacing-adjustment - Option to override the default letter-spacing,\n * default: `-0.25px` (this is to match the old CiscoSans)\n * @cssproperty --mdc-themeprovider-font-feature-settings - Option to override the font feature settings,\n * default: `\"ss02\" on`\n * @cssproperty --mdc-themeprovider-scrollbar-track-color - Option to override the color of the scrollbar track.\n * @cssproperty --mdc-themeprovider-scrollbar-thumb-color - Option to override the color of the scrollbar thumb.\n */",
45233
- "customElement": true
45234
- }
45235
- ],
45236
- "exports": [
45237
- {
45238
- "kind": "js",
45239
- "name": "default",
45240
- "declaration": {
45241
- "name": "ThemeProvider",
45242
- "module": "components/themeprovider/themeprovider.component.js"
45243
- }
45244
- }
45245
- ]
45246
- },
45247
- {
45248
- "kind": "javascript-module",
45249
- "path": "components/toast/toast.component.js",
45250
- "declarations": [
45251
- {
45252
- "kind": "class",
45253
- "description": "`mdc-toast` is a lightweight, non-blocking alert used to inform users about application processes.\nIt supports success, warning, error, and custom messages, and is designed to be controlled externally.\n\n**Note**: When using `slot=\"toast-body-normal\"` and `slot=\"toast-body-detailed\"`, it's strongly recommended to wrap the content with `<mdc-text tagname=\"span\">`.\nIf not used, ensure your custom content is styled appropriately to match the design and alignment expectations of the toast component.",
45254
- "name": "Toast",
45255
- "cssProperties": [
45256
- {
45257
- "description": "Background color of the toast.",
45258
- "name": "--mdc-toast-background-color"
45259
- },
45260
- {
45261
- "description": "Border color of the toast.",
45262
- "name": "--mdc-toast-border-color"
45263
- },
45264
- {
45265
- "description": "Color of the header text in the toast.",
45266
- "name": "--mdc-toast-header-text-color"
45267
- },
45268
- {
45269
- "description": "Color of the icon in the toast.",
45270
- "name": "--mdc-toast-icon-color"
45271
- },
45272
- {
45273
- "description": "Elevation effect applied to the toast.",
45274
- "name": "--mdc-toast-elevation-3"
45275
- },
45276
- {
45277
- "description": "Width of the toast.",
45278
- "name": "--mdc-toast-width"
45279
- },
45280
- {
45281
- "description": "Padding inside the toast.",
45282
- "name": "--mdc-toast-padding"
45283
- }
45284
- ],
45285
- "cssParts": [
45286
- {
45287
- "description": "The container for the toast's main content, including icon, text, and close button.",
45288
- "name": "content-container"
45289
- },
45290
- {
45291
- "description": "The icon shown at the start of the toast, styled by variant.",
45292
- "name": "toast-prefix-icon"
45293
- },
45294
- {
45295
- "description": "The container for the header and body content of the toast.",
45296
- "name": "toast-content"
45297
- },
45298
- {
45299
- "description": "The header text of the toast.",
45300
- "name": "toast-header"
45301
- },
45302
- {
45303
- "description": "The container for the toast's footer, including toggle and action buttons.",
45304
- "name": "footer"
45305
- },
45306
- {
45307
- "description": "The toggle button for showing/hiding detailed content.",
45308
- "name": "footer-button-toggle"
45309
- },
45310
- {
45311
- "description": "The close button for the toast.",
45312
- "name": "toast-close-btn"
45313
- },
45314
- {
45315
- "description": "Applied to the footer when it contains buttons or a toggle button.",
45316
- "name": "has-footer-buttons"
45317
- }
45318
- ],
45319
- "slots": [
45320
- {
45321
- "description": "Slot for custom content before the icon (only for custom variant).",
45322
- "name": "content-prefix"
45323
- },
45324
- {
45325
- "description": "Slot for the main body content of the toast.",
45326
- "name": "toast-body-normal"
45327
- },
45328
- {
45329
- "description": "Slot for additional detailed content, shown when expanded.",
45330
- "name": "toast-body-detailed"
45331
- },
45332
- {
45333
- "description": "Slot for custom footer content. Prefer using footer-button-primary and footer-button-secondary slots.",
45334
- "name": "footer"
45335
- },
45336
- {
45337
- "description": "Slot for passing the primary variant of `mdc-button` in the footer.",
45338
- "name": "footer-button-primary"
45339
- },
45340
- {
45341
- "description": "Slot for passing the secondary variant of `mdc-button` in the footer.",
45342
- "name": "footer-button-secondary"
45343
- }
45344
- ],
45345
- "members": [
45346
- {
45347
- "kind": "field",
45348
- "name": "variant",
45349
- "type": {
45350
- "text": "ToastVariant"
45351
- },
45352
- "description": "Type of toast\n- Can be `custom`, `success`, `warning` or `error`.\n\nNote: When using the `custom` variant, provide your own icon via the `content-prefix` slot; otherwise, no icon will be shown.",
45353
- "default": "'custom'",
45354
- "attribute": "variant",
45355
- "reflects": true
45356
- },
45357
- {
45358
- "kind": "field",
45359
- "name": "closeButtonAriaLabel",
45360
- "type": {
45361
- "text": "string | undefined"
45362
- },
45363
- "description": "Defines aria-label attribute for close button accessibility",
45364
- "attribute": "close-button-aria-label"
45365
- },
45366
- {
45367
- "kind": "field",
45368
- "name": "headerText",
45369
- "type": {
45370
- "text": "string | undefined"
45371
- },
45372
- "description": "Defines a string value to display as the title of the toast",
45373
- "attribute": "header-text",
45374
- "reflects": true
45375
- },
45376
- {
45377
- "kind": "field",
45378
- "name": "headerTagName",
45379
- "type": {
45380
- "text": "TagName"
45381
- },
45382
- "description": "The html tag to be used for the header text",
45383
- "default": "'h2'",
45384
- "attribute": "header-tag-name",
45385
- "reflects": true
45386
- },
45387
- {
45388
- "kind": "field",
45389
- "name": "ariaLabel",
45390
- "type": {
45391
- "text": "string | null"
45392
- },
45393
- "default": "null",
45394
- "description": "Defines aria-label attribute when header is not used",
45395
- "attribute": "aria-label",
45396
- "reflects": true
45397
- },
45398
- {
45399
- "kind": "field",
45400
- "name": "showMoreText",
45401
- "type": {
45402
- "text": "string | undefined"
45403
- },
45404
- "description": "Defines the text shown on the linkbutton when detailed content is hidden.",
45405
- "attribute": "show-more-text",
45406
- "reflects": true
45407
- },
45408
- {
45409
- "kind": "field",
45410
- "name": "showLessText",
45411
- "type": {
45412
- "text": "string | undefined"
45413
- },
45414
- "description": "Defines the text shown on the linkbutton when detailed content is visible.",
45415
- "attribute": "show-less-text",
45416
- "reflects": true
45417
- },
45418
- {
45419
- "kind": "field",
45420
- "name": "isDetailVisible",
45421
- "type": {
45422
- "text": "boolean"
45423
- },
45424
- "privacy": "private",
45425
- "default": "false"
45426
- },
45427
- {
45428
- "kind": "field",
45429
- "name": "hasDetailedSlot",
45430
- "type": {
45431
- "text": "boolean"
45432
- },
45433
- "privacy": "private",
45434
- "default": "false"
45435
- },
45436
- {
45437
- "kind": "field",
45438
- "name": "detailedElements",
45439
- "type": {
45440
- "text": "HTMLElement[]"
45441
- },
45442
- "privacy": "private"
45443
- },
45444
- {
45445
- "kind": "field",
45446
- "name": "hasFooterButtons",
45447
- "type": {
45448
- "text": "string"
45449
- },
45450
- "privacy": "private",
45451
- "default": "''"
45452
- },
45453
- {
45454
- "kind": "method",
45455
- "name": "closeToast",
45456
- "privacy": "private",
45457
- "description": "Fired when Close Button is clicked using mouse or keyboard.\nThis method dispatches the close event.\nIt is used to notify that the toast should be closed."
45458
- },
45459
- {
45460
- "kind": "method",
45461
- "name": "toggleDetailVisibility",
45462
- "privacy": "private"
45463
- },
45464
- {
45465
- "kind": "method",
45466
- "name": "updateDetailedSlotPresence",
45467
- "privacy": "private"
45468
- },
45469
- {
45470
- "kind": "method",
45471
- "name": "updateFooterButtonsPresence",
45472
- "privacy": "private"
45473
- },
45474
- {
45475
- "kind": "method",
45476
- "name": "renderIcon",
45477
- "privacy": "protected",
45478
- "parameters": [
45479
- {
45480
- "name": "iconName",
45481
- "type": {
45482
- "text": "string"
45483
- }
45484
- }
45485
- ]
45486
- },
45487
- {
45488
- "kind": "method",
45489
- "name": "shouldRenderToggleButton",
45490
- "privacy": "private"
45491
- },
45492
- {
45493
- "kind": "method",
45494
- "name": "renderToggleDetailButton",
45495
- "privacy": "private"
45496
- },
45497
- {
45498
- "kind": "method",
45499
- "name": "renderHeader",
45500
- "privacy": "protected"
45501
- },
45502
- {
45503
- "kind": "method",
45504
- "name": "handleFooterSlot",
45505
- "privacy": "protected",
45506
- "return": {
45507
- "type": {
45508
- "text": "void"
45509
- }
45510
- },
45511
- "parameters": [
45512
- {
45513
- "name": "tagname",
45514
- "type": {
45515
- "text": "string"
45516
- }
45517
- },
45518
- {
45519
- "name": "variant",
45520
- "optional": true,
45521
- "type": {
45522
- "text": "string | undefined"
45523
- }
45524
- }
45525
- ]
45526
- },
45527
- {
45528
- "kind": "method",
45529
- "name": "renderFooter",
45530
- "privacy": "protected",
45531
- "description": "Renders the footer of the card if footer-link,\nfooter-button-primary, or footer-button-secondary slots are provided",
45532
- "return": {
45533
- "type": {
45534
- "text": ""
45535
- }
45536
- },
45537
- "inheritedFrom": {
45538
- "name": "FooterMixin",
45539
- "module": "utils/mixins/FooterMixin.js"
45540
- }
45541
- }
45542
- ],
45543
- "events": [
45544
- {
45545
- "description": "(React: onClose) Dispatched when the Close Button is clicked using mouse or keyboard.",
45546
- "name": "close",
45547
- "reactName": "onClose"
45548
- }
45549
- ],
45550
- "attributes": [
45551
- {
45552
- "name": "variant",
45553
- "type": {
45554
- "text": "ToastVariant"
45555
- },
45556
- "description": "Type of toast\n- Can be `custom`, `success`, `warning` or `error`.\n\nNote: When using the `custom` variant, provide your own icon via the `content-prefix` slot; otherwise, no icon will be shown.",
45557
- "default": "'custom'",
45558
- "fieldName": "variant"
45559
- },
45560
- {
45561
- "name": "close-button-aria-label",
45562
- "type": {
45563
- "text": "string | undefined"
45564
- },
45565
- "description": "Defines aria-label attribute for close button accessibility",
45566
- "fieldName": "closeButtonAriaLabel"
45567
- },
45568
- {
45569
- "name": "header-text",
45570
- "type": {
45571
- "text": "string | undefined"
45572
- },
45573
- "description": "Defines a string value to display as the title of the toast",
45574
- "fieldName": "headerText"
45575
- },
45576
- {
45577
- "name": "header-tag-name",
45578
- "type": {
45579
- "text": "TagName"
45580
- },
45581
- "description": "The html tag to be used for the header text",
45582
- "default": "'h2'",
45583
- "fieldName": "headerTagName"
45584
- },
45585
- {
45586
- "name": "aria-label",
45587
- "type": {
45588
- "text": "string | null"
45589
- },
45590
- "default": "null",
45591
- "description": "Defines aria-label attribute when header is not used",
45592
- "fieldName": "ariaLabel"
45593
- },
45594
- {
45595
- "name": "show-more-text",
45596
- "type": {
45597
- "text": "string | undefined"
45598
- },
45599
- "description": "Defines the text shown on the linkbutton when detailed content is hidden.",
45600
- "fieldName": "showMoreText"
45601
- },
45602
- {
45603
- "name": "show-less-text",
45604
- "type": {
45605
- "text": "string | undefined"
45606
- },
45607
- "description": "Defines the text shown on the linkbutton when detailed content is visible.",
45608
- "fieldName": "showLessText"
45609
- }
45610
- ],
45611
- "mixins": [
45612
- {
45613
- "name": "FooterMixin",
45614
- "module": "/src/utils/mixins/FooterMixin"
45615
- }
45616
- ],
45617
- "superclass": {
45618
- "name": "Component",
45619
- "module": "/src/models"
45620
- },
45621
- "tagName": "mdc-toast",
45622
- "jsDoc": "/**\n * `mdc-toast` is a lightweight, non-blocking alert used to inform users about application processes.\n * It supports success, warning, error, and custom messages, and is designed to be controlled externally.\n *\n * **Note**: When using `slot=\"toast-body-normal\"` and `slot=\"toast-body-detailed\"`, it's strongly recommended to wrap the content with `<mdc-text tagname=\"span\">`.\n * If not used, ensure your custom content is styled appropriately to match the design and alignment expectations of the toast component.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @slot content-prefix - Slot for custom content before the icon (only for custom variant).\n * @slot toast-body-normal - Slot for the main body content of the toast.\n * @slot toast-body-detailed - Slot for additional detailed content, shown when expanded.\n * @slot footer - Slot for custom footer content. Prefer using footer-button-primary and footer-button-secondary slots.\n * @slot footer-button-primary - Slot for passing the primary variant of `mdc-button` in the footer.\n * @slot footer-button-secondary - Slot for passing the secondary variant of `mdc-button` in the footer.\n *\n * @tagname mdc-toast\n *\n * @event close - (React: onClose) Dispatched when the Close Button is clicked using mouse or keyboard.\n *\n * @csspart content-container - The container for the toast's main content, including icon, text, and close button.\n * @csspart toast-prefix-icon - The icon shown at the start of the toast, styled by variant.\n * @csspart toast-content - The container for the header and body content of the toast.\n * @csspart toast-header - The header text of the toast.\n * @csspart footer - The container for the toast's footer, including toggle and action buttons.\n * @csspart footer-button-toggle - The toggle button for showing/hiding detailed content.\n * @csspart toast-close-btn - The close button for the toast.\n * @csspart has-footer-buttons - Applied to the footer when it contains buttons or a toggle button.\n *\n * @cssproperty --mdc-toast-background-color - Background color of the toast.\n * @cssproperty --mdc-toast-border-color - Border color of the toast.\n * @cssproperty --mdc-toast-header-text-color - Color of the header text in the toast.\n * @cssproperty --mdc-toast-icon-color - Color of the icon in the toast.\n * @cssproperty --mdc-toast-elevation-3 - Elevation effect applied to the toast.\n * @cssproperty --mdc-toast-width - Width of the toast.\n * @cssproperty --mdc-toast-padding - Padding inside the toast.\n */",
45623
- "customElement": true
45624
- }
45625
- ],
45626
- "exports": [
45627
- {
45628
- "kind": "js",
45629
- "name": "default",
45630
- "declaration": {
45631
- "name": "Toast",
45632
- "module": "components/toast/toast.component.js"
45633
- }
45634
- }
45635
- ]
45636
- },
45637
45137
  {
45638
45138
  "kind": "javascript-module",
45639
45139
  "path": "components/toggle/toggle.component.js",
@@ -46588,24 +46088,528 @@
46588
46088
  },
46589
46089
  {
46590
46090
  "kind": "javascript-module",
46591
- "path": "components/toggletip/toggletip.component.js",
46091
+ "path": "components/toast/toast.component.js",
46592
46092
  "declarations": [
46593
46093
  {
46594
46094
  "kind": "class",
46595
- "description": "A toggletip is triggered by clicking a trigger element.\n\nIt can contain interactive content and can be closed by\nclicking outside the toggletip or pressing the escape key.\n\nIt can have optional close button to close the toggletip.\n\nToggletip component uses `mdc-screenreaderannouncer` internally to\nannounce the toggletip text content with screen readers when the toggletip is shown.\n\n`screenreader-announcer-identity` attribute can be used to provide ID of an element\nin DOM to which announcement elements are added. If not set, a visually hidden\ndiv element is created in DOM to which announcement elements are added.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
46596
- "name": "ToggleTip",
46095
+ "description": "`mdc-toast` is a lightweight, non-blocking alert used to inform users about application processes.\nIt supports success, warning, error, and custom messages, and is designed to be controlled externally.\n\n**Note**: When using `slot=\"toast-body-normal\"` and `slot=\"toast-body-detailed\"`, it's strongly recommended to wrap the content with `<mdc-text tagname=\"span\">`.\nIf not used, ensure your custom content is styled appropriately to match the design and alignment expectations of the toast component.",
46096
+ "name": "Toast",
46597
46097
  "cssProperties": [
46598
46098
  {
46599
- "description": "The maximum width of the toggletip.",
46600
- "name": "--mdc-toggletip-max-width"
46099
+ "description": "Background color of the toast.",
46100
+ "name": "--mdc-toast-background-color"
46601
46101
  },
46602
46102
  {
46603
- "description": "The text color of the toggletip.",
46604
- "name": "--mdc-toggletip-text-color"
46103
+ "description": "Border color of the toast.",
46104
+ "name": "--mdc-toast-border-color"
46605
46105
  },
46606
46106
  {
46607
- "description": "The text color of the toggletip when the color is contrast.",
46608
- "name": "--mdc-toggletip-text-color-contrast"
46107
+ "description": "Color of the header text in the toast.",
46108
+ "name": "--mdc-toast-header-text-color"
46109
+ },
46110
+ {
46111
+ "description": "Color of the icon in the toast.",
46112
+ "name": "--mdc-toast-icon-color"
46113
+ },
46114
+ {
46115
+ "description": "Elevation effect applied to the toast.",
46116
+ "name": "--mdc-toast-elevation-3"
46117
+ },
46118
+ {
46119
+ "description": "Width of the toast.",
46120
+ "name": "--mdc-toast-width"
46121
+ },
46122
+ {
46123
+ "description": "Padding inside the toast.",
46124
+ "name": "--mdc-toast-padding"
46125
+ }
46126
+ ],
46127
+ "cssParts": [
46128
+ {
46129
+ "description": "The container for the toast's main content, including icon, text, and close button.",
46130
+ "name": "content-container"
46131
+ },
46132
+ {
46133
+ "description": "The icon shown at the start of the toast, styled by variant.",
46134
+ "name": "toast-prefix-icon"
46135
+ },
46136
+ {
46137
+ "description": "The container for the header and body content of the toast.",
46138
+ "name": "toast-content"
46139
+ },
46140
+ {
46141
+ "description": "The header text of the toast.",
46142
+ "name": "toast-header"
46143
+ },
46144
+ {
46145
+ "description": "The container for the toast's footer, including toggle and action buttons.",
46146
+ "name": "footer"
46147
+ },
46148
+ {
46149
+ "description": "The toggle button for showing/hiding detailed content.",
46150
+ "name": "footer-button-toggle"
46151
+ },
46152
+ {
46153
+ "description": "The close button for the toast.",
46154
+ "name": "toast-close-btn"
46155
+ },
46156
+ {
46157
+ "description": "Applied to the footer when it contains buttons or a toggle button.",
46158
+ "name": "has-footer-buttons"
46159
+ }
46160
+ ],
46161
+ "slots": [
46162
+ {
46163
+ "description": "Slot for custom content before the icon (only for custom variant).",
46164
+ "name": "content-prefix"
46165
+ },
46166
+ {
46167
+ "description": "Slot for the main body content of the toast.",
46168
+ "name": "toast-body-normal"
46169
+ },
46170
+ {
46171
+ "description": "Slot for additional detailed content, shown when expanded.",
46172
+ "name": "toast-body-detailed"
46173
+ },
46174
+ {
46175
+ "description": "Slot for custom footer content. Prefer using footer-button-primary and footer-button-secondary slots.",
46176
+ "name": "footer"
46177
+ },
46178
+ {
46179
+ "description": "Slot for passing the primary variant of `mdc-button` in the footer.",
46180
+ "name": "footer-button-primary"
46181
+ },
46182
+ {
46183
+ "description": "Slot for passing the secondary variant of `mdc-button` in the footer.",
46184
+ "name": "footer-button-secondary"
46185
+ }
46186
+ ],
46187
+ "members": [
46188
+ {
46189
+ "kind": "field",
46190
+ "name": "variant",
46191
+ "type": {
46192
+ "text": "ToastVariant"
46193
+ },
46194
+ "description": "Type of toast\n- Can be `custom`, `success`, `warning` or `error`.\n\nNote: When using the `custom` variant, provide your own icon via the `content-prefix` slot; otherwise, no icon will be shown.",
46195
+ "default": "'custom'",
46196
+ "attribute": "variant",
46197
+ "reflects": true
46198
+ },
46199
+ {
46200
+ "kind": "field",
46201
+ "name": "closeButtonAriaLabel",
46202
+ "type": {
46203
+ "text": "string | undefined"
46204
+ },
46205
+ "description": "Defines aria-label attribute for close button accessibility",
46206
+ "attribute": "close-button-aria-label"
46207
+ },
46208
+ {
46209
+ "kind": "field",
46210
+ "name": "headerText",
46211
+ "type": {
46212
+ "text": "string | undefined"
46213
+ },
46214
+ "description": "Defines a string value to display as the title of the toast",
46215
+ "attribute": "header-text",
46216
+ "reflects": true
46217
+ },
46218
+ {
46219
+ "kind": "field",
46220
+ "name": "headerTagName",
46221
+ "type": {
46222
+ "text": "TagName"
46223
+ },
46224
+ "description": "The html tag to be used for the header text",
46225
+ "default": "'h2'",
46226
+ "attribute": "header-tag-name",
46227
+ "reflects": true
46228
+ },
46229
+ {
46230
+ "kind": "field",
46231
+ "name": "ariaLabel",
46232
+ "type": {
46233
+ "text": "string | null"
46234
+ },
46235
+ "default": "null",
46236
+ "description": "Defines aria-label attribute when header is not used",
46237
+ "attribute": "aria-label",
46238
+ "reflects": true
46239
+ },
46240
+ {
46241
+ "kind": "field",
46242
+ "name": "showMoreText",
46243
+ "type": {
46244
+ "text": "string | undefined"
46245
+ },
46246
+ "description": "Defines the text shown on the linkbutton when detailed content is hidden.",
46247
+ "attribute": "show-more-text",
46248
+ "reflects": true
46249
+ },
46250
+ {
46251
+ "kind": "field",
46252
+ "name": "showLessText",
46253
+ "type": {
46254
+ "text": "string | undefined"
46255
+ },
46256
+ "description": "Defines the text shown on the linkbutton when detailed content is visible.",
46257
+ "attribute": "show-less-text",
46258
+ "reflects": true
46259
+ },
46260
+ {
46261
+ "kind": "field",
46262
+ "name": "isDetailVisible",
46263
+ "type": {
46264
+ "text": "boolean"
46265
+ },
46266
+ "privacy": "private",
46267
+ "default": "false"
46268
+ },
46269
+ {
46270
+ "kind": "field",
46271
+ "name": "hasDetailedSlot",
46272
+ "type": {
46273
+ "text": "boolean"
46274
+ },
46275
+ "privacy": "private",
46276
+ "default": "false"
46277
+ },
46278
+ {
46279
+ "kind": "field",
46280
+ "name": "detailedElements",
46281
+ "type": {
46282
+ "text": "HTMLElement[]"
46283
+ },
46284
+ "privacy": "private"
46285
+ },
46286
+ {
46287
+ "kind": "field",
46288
+ "name": "hasFooterButtons",
46289
+ "type": {
46290
+ "text": "string"
46291
+ },
46292
+ "privacy": "private",
46293
+ "default": "''"
46294
+ },
46295
+ {
46296
+ "kind": "method",
46297
+ "name": "closeToast",
46298
+ "privacy": "private",
46299
+ "description": "Fired when Close Button is clicked using mouse or keyboard.\nThis method dispatches the close event.\nIt is used to notify that the toast should be closed."
46300
+ },
46301
+ {
46302
+ "kind": "method",
46303
+ "name": "toggleDetailVisibility",
46304
+ "privacy": "private"
46305
+ },
46306
+ {
46307
+ "kind": "method",
46308
+ "name": "updateDetailedSlotPresence",
46309
+ "privacy": "private"
46310
+ },
46311
+ {
46312
+ "kind": "method",
46313
+ "name": "updateFooterButtonsPresence",
46314
+ "privacy": "private"
46315
+ },
46316
+ {
46317
+ "kind": "method",
46318
+ "name": "renderIcon",
46319
+ "privacy": "protected",
46320
+ "parameters": [
46321
+ {
46322
+ "name": "iconName",
46323
+ "type": {
46324
+ "text": "string"
46325
+ }
46326
+ }
46327
+ ]
46328
+ },
46329
+ {
46330
+ "kind": "method",
46331
+ "name": "shouldRenderToggleButton",
46332
+ "privacy": "private"
46333
+ },
46334
+ {
46335
+ "kind": "method",
46336
+ "name": "renderToggleDetailButton",
46337
+ "privacy": "private"
46338
+ },
46339
+ {
46340
+ "kind": "method",
46341
+ "name": "renderHeader",
46342
+ "privacy": "protected"
46343
+ },
46344
+ {
46345
+ "kind": "method",
46346
+ "name": "handleFooterSlot",
46347
+ "privacy": "protected",
46348
+ "return": {
46349
+ "type": {
46350
+ "text": "void"
46351
+ }
46352
+ },
46353
+ "parameters": [
46354
+ {
46355
+ "name": "tagname",
46356
+ "type": {
46357
+ "text": "string"
46358
+ }
46359
+ },
46360
+ {
46361
+ "name": "variant",
46362
+ "optional": true,
46363
+ "type": {
46364
+ "text": "string | undefined"
46365
+ }
46366
+ }
46367
+ ]
46368
+ },
46369
+ {
46370
+ "kind": "method",
46371
+ "name": "renderFooter",
46372
+ "privacy": "protected",
46373
+ "description": "Renders the footer of the card if footer-link,\nfooter-button-primary, or footer-button-secondary slots are provided",
46374
+ "return": {
46375
+ "type": {
46376
+ "text": ""
46377
+ }
46378
+ },
46379
+ "inheritedFrom": {
46380
+ "name": "FooterMixin",
46381
+ "module": "utils/mixins/FooterMixin.js"
46382
+ }
46383
+ }
46384
+ ],
46385
+ "events": [
46386
+ {
46387
+ "description": "(React: onClose) Dispatched when the Close Button is clicked using mouse or keyboard.",
46388
+ "name": "close",
46389
+ "reactName": "onClose"
46390
+ }
46391
+ ],
46392
+ "attributes": [
46393
+ {
46394
+ "name": "variant",
46395
+ "type": {
46396
+ "text": "ToastVariant"
46397
+ },
46398
+ "description": "Type of toast\n- Can be `custom`, `success`, `warning` or `error`.\n\nNote: When using the `custom` variant, provide your own icon via the `content-prefix` slot; otherwise, no icon will be shown.",
46399
+ "default": "'custom'",
46400
+ "fieldName": "variant"
46401
+ },
46402
+ {
46403
+ "name": "close-button-aria-label",
46404
+ "type": {
46405
+ "text": "string | undefined"
46406
+ },
46407
+ "description": "Defines aria-label attribute for close button accessibility",
46408
+ "fieldName": "closeButtonAriaLabel"
46409
+ },
46410
+ {
46411
+ "name": "header-text",
46412
+ "type": {
46413
+ "text": "string | undefined"
46414
+ },
46415
+ "description": "Defines a string value to display as the title of the toast",
46416
+ "fieldName": "headerText"
46417
+ },
46418
+ {
46419
+ "name": "header-tag-name",
46420
+ "type": {
46421
+ "text": "TagName"
46422
+ },
46423
+ "description": "The html tag to be used for the header text",
46424
+ "default": "'h2'",
46425
+ "fieldName": "headerTagName"
46426
+ },
46427
+ {
46428
+ "name": "aria-label",
46429
+ "type": {
46430
+ "text": "string | null"
46431
+ },
46432
+ "default": "null",
46433
+ "description": "Defines aria-label attribute when header is not used",
46434
+ "fieldName": "ariaLabel"
46435
+ },
46436
+ {
46437
+ "name": "show-more-text",
46438
+ "type": {
46439
+ "text": "string | undefined"
46440
+ },
46441
+ "description": "Defines the text shown on the linkbutton when detailed content is hidden.",
46442
+ "fieldName": "showMoreText"
46443
+ },
46444
+ {
46445
+ "name": "show-less-text",
46446
+ "type": {
46447
+ "text": "string | undefined"
46448
+ },
46449
+ "description": "Defines the text shown on the linkbutton when detailed content is visible.",
46450
+ "fieldName": "showLessText"
46451
+ }
46452
+ ],
46453
+ "mixins": [
46454
+ {
46455
+ "name": "FooterMixin",
46456
+ "module": "/src/utils/mixins/FooterMixin"
46457
+ }
46458
+ ],
46459
+ "superclass": {
46460
+ "name": "Component",
46461
+ "module": "/src/models"
46462
+ },
46463
+ "tagName": "mdc-toast",
46464
+ "jsDoc": "/**\n * `mdc-toast` is a lightweight, non-blocking alert used to inform users about application processes.\n * It supports success, warning, error, and custom messages, and is designed to be controlled externally.\n *\n * **Note**: When using `slot=\"toast-body-normal\"` and `slot=\"toast-body-detailed\"`, it's strongly recommended to wrap the content with `<mdc-text tagname=\"span\">`.\n * If not used, ensure your custom content is styled appropriately to match the design and alignment expectations of the toast component.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n *\n * @slot content-prefix - Slot for custom content before the icon (only for custom variant).\n * @slot toast-body-normal - Slot for the main body content of the toast.\n * @slot toast-body-detailed - Slot for additional detailed content, shown when expanded.\n * @slot footer - Slot for custom footer content. Prefer using footer-button-primary and footer-button-secondary slots.\n * @slot footer-button-primary - Slot for passing the primary variant of `mdc-button` in the footer.\n * @slot footer-button-secondary - Slot for passing the secondary variant of `mdc-button` in the footer.\n *\n * @tagname mdc-toast\n *\n * @event close - (React: onClose) Dispatched when the Close Button is clicked using mouse or keyboard.\n *\n * @csspart content-container - The container for the toast's main content, including icon, text, and close button.\n * @csspart toast-prefix-icon - The icon shown at the start of the toast, styled by variant.\n * @csspart toast-content - The container for the header and body content of the toast.\n * @csspart toast-header - The header text of the toast.\n * @csspart footer - The container for the toast's footer, including toggle and action buttons.\n * @csspart footer-button-toggle - The toggle button for showing/hiding detailed content.\n * @csspart toast-close-btn - The close button for the toast.\n * @csspart has-footer-buttons - Applied to the footer when it contains buttons or a toggle button.\n *\n * @cssproperty --mdc-toast-background-color - Background color of the toast.\n * @cssproperty --mdc-toast-border-color - Border color of the toast.\n * @cssproperty --mdc-toast-header-text-color - Color of the header text in the toast.\n * @cssproperty --mdc-toast-icon-color - Color of the icon in the toast.\n * @cssproperty --mdc-toast-elevation-3 - Elevation effect applied to the toast.\n * @cssproperty --mdc-toast-width - Width of the toast.\n * @cssproperty --mdc-toast-padding - Padding inside the toast.\n */",
46465
+ "customElement": true
46466
+ }
46467
+ ],
46468
+ "exports": [
46469
+ {
46470
+ "kind": "js",
46471
+ "name": "default",
46472
+ "declaration": {
46473
+ "name": "Toast",
46474
+ "module": "components/toast/toast.component.js"
46475
+ }
46476
+ }
46477
+ ]
46478
+ },
46479
+ {
46480
+ "kind": "javascript-module",
46481
+ "path": "components/themeprovider/themeprovider.component.js",
46482
+ "declarations": [
46483
+ {
46484
+ "kind": "class",
46485
+ "description": "ThemeProvider component, which sets the passed in themeclass as class.\nIf the themeclass switches, the existing themeclass will be removed as a class\nand the new themeclass will be added.\n\nCSS variables defined in the themeclass will be used for the styling of child dom nodes.\n\nAvailable Momentum theme classes:\n\n`mds-theme-stable-darkWebex`, `mds-theme-stable-lightWebex`\n\n`mds-theme-stable-darkBronzeWebex`, `mds-theme-stable-lightBronzeWebex`\n\n`mds-theme-stable-darkIndigoWebex`, `mds-theme-stable-lightIndigoWebex`\n\n`mds-theme-stable-darkJadeWebex`, `mds-theme-stable-lightJadeWebex`\n\n`mds-theme-stable-darkLavenderWebex`, `mds-theme-stable-lightLavenderWebex`\n\n`mds-theme-stable-darkRoseWebex`, `mds-theme-stable-lightRoseWebex`\n\nThemeclass context can be be consumed from Lit child components\n(see providerUtils.consume for how to consume)\n\nThemeProvider also includes basic font defaults for text.",
46486
+ "name": "ThemeProvider",
46487
+ "cssProperties": [
46488
+ {
46489
+ "description": "Option to override the default color, default: color-theme-text-primary-normal",
46490
+ "name": "--mdc-themeprovider-color-default"
46491
+ },
46492
+ {
46493
+ "description": "Option to override the font family, default: `Momentum` (from momentum-design/fonts)",
46494
+ "name": "--mdc-themeprovider-font-family"
46495
+ },
46496
+ {
46497
+ "description": "Option to override the font weight, default: `400`",
46498
+ "name": "--mdc-themeprovider-font-weight"
46499
+ },
46500
+ {
46501
+ "description": "Option to override the default letter-spacing, default: `-0.25px` (this is to match the old CiscoSans)",
46502
+ "name": "--mdc-themeprovider-letter-spacing-adjustment"
46503
+ },
46504
+ {
46505
+ "description": "Option to override the font feature settings, default: `\"ss02\" on`",
46506
+ "name": "--mdc-themeprovider-font-feature-settings"
46507
+ },
46508
+ {
46509
+ "description": "Option to override the color of the scrollbar track.",
46510
+ "name": "--mdc-themeprovider-scrollbar-track-color"
46511
+ },
46512
+ {
46513
+ "description": "Option to override the color of the scrollbar thumb.",
46514
+ "name": "--mdc-themeprovider-scrollbar-thumb-color"
46515
+ }
46516
+ ],
46517
+ "slots": [
46518
+ {
46519
+ "description": "children",
46520
+ "name": ""
46521
+ }
46522
+ ],
46523
+ "members": [
46524
+ {
46525
+ "kind": "field",
46526
+ "name": "Context",
46527
+ "privacy": "public",
46528
+ "static": true,
46529
+ "description": "Context object of the ThemeProvider, to be consumed by child components",
46530
+ "readonly": true
46531
+ },
46532
+ {
46533
+ "kind": "field",
46534
+ "name": "themeclass",
46535
+ "type": {
46536
+ "text": "string"
46537
+ },
46538
+ "description": "Current theme class\n\nHas to be fully qualified, such that\nthe theme class matches the class of the respective\ntheme stylesheet\n\nDefault: 'mds-theme-stable-darkWebex'",
46539
+ "attribute": "themeclass"
46540
+ },
46541
+ {
46542
+ "kind": "method",
46543
+ "name": "updateContext",
46544
+ "privacy": "protected",
46545
+ "return": {
46546
+ "type": {
46547
+ "text": "void"
46548
+ }
46549
+ },
46550
+ "description": "Update all observing components of this\nprovider to update the themeclass\n\nIs called on every re-render, see Provider class"
46551
+ },
46552
+ {
46553
+ "kind": "method",
46554
+ "name": "setThemeInClassList",
46555
+ "privacy": "private",
46556
+ "description": "Function to update the active theme classnames to update the theme tokens\nas CSS variables on the web component."
46557
+ }
46558
+ ],
46559
+ "attributes": [
46560
+ {
46561
+ "name": "themeclass",
46562
+ "type": {
46563
+ "text": "string"
46564
+ },
46565
+ "description": "Current theme class\n\nHas to be fully qualified, such that\nthe theme class matches the class of the respective\ntheme stylesheet\n\nDefault: 'mds-theme-stable-darkWebex'",
46566
+ "fieldName": "themeclass"
46567
+ }
46568
+ ],
46569
+ "superclass": {
46570
+ "name": "Provider",
46571
+ "module": "/src/models"
46572
+ },
46573
+ "tagName": "mdc-themeprovider",
46574
+ "jsDoc": "/**\n * ThemeProvider component, which sets the passed in themeclass as class.\n * If the themeclass switches, the existing themeclass will be removed as a class\n * and the new themeclass will be added.\n *\n * CSS variables defined in the themeclass will be used for the styling of child dom nodes.\n *\n * Available Momentum theme classes:\n *\n * `mds-theme-stable-darkWebex`, `mds-theme-stable-lightWebex`\n *\n * `mds-theme-stable-darkBronzeWebex`, `mds-theme-stable-lightBronzeWebex`\n *\n * `mds-theme-stable-darkIndigoWebex`, `mds-theme-stable-lightIndigoWebex`\n *\n * `mds-theme-stable-darkJadeWebex`, `mds-theme-stable-lightJadeWebex`\n *\n * `mds-theme-stable-darkLavenderWebex`, `mds-theme-stable-lightLavenderWebex`\n *\n * `mds-theme-stable-darkRoseWebex`, `mds-theme-stable-lightRoseWebex`\n *\n * Themeclass context can be be consumed from Lit child components\n * (see providerUtils.consume for how to consume)\n *\n * ThemeProvider also includes basic font defaults for text.\n *\n * @tagname mdc-themeprovider\n *\n * @slot - children\n *\n * @cssproperty --mdc-themeprovider-color-default - Option to override the default color,\n * default: color-theme-text-primary-normal\n * @cssproperty --mdc-themeprovider-font-family - Option to override the font family,\n * default: `Momentum` (from momentum-design/fonts)\n * @cssproperty --mdc-themeprovider-font-weight - Option to override the font weight, default: `400`\n * @cssproperty --mdc-themeprovider-letter-spacing-adjustment - Option to override the default letter-spacing,\n * default: `-0.25px` (this is to match the old CiscoSans)\n * @cssproperty --mdc-themeprovider-font-feature-settings - Option to override the font feature settings,\n * default: `\"ss02\" on`\n * @cssproperty --mdc-themeprovider-scrollbar-track-color - Option to override the color of the scrollbar track.\n * @cssproperty --mdc-themeprovider-scrollbar-thumb-color - Option to override the color of the scrollbar thumb.\n */",
46575
+ "customElement": true
46576
+ }
46577
+ ],
46578
+ "exports": [
46579
+ {
46580
+ "kind": "js",
46581
+ "name": "default",
46582
+ "declaration": {
46583
+ "name": "ThemeProvider",
46584
+ "module": "components/themeprovider/themeprovider.component.js"
46585
+ }
46586
+ }
46587
+ ]
46588
+ },
46589
+ {
46590
+ "kind": "javascript-module",
46591
+ "path": "components/tooltip/tooltip.component.js",
46592
+ "declarations": [
46593
+ {
46594
+ "kind": "class",
46595
+ "description": "A tooltip is triggered by mouse hover or by keyboard focus\nand will disappear upon mouse exit or focus change.\n\nNote: Tooltips cannot contain content that can be focused or interacted with.",
46596
+ "name": "Tooltip",
46597
+ "cssProperties": [
46598
+ {
46599
+ "description": "The maximum width of the tooltip.",
46600
+ "name": "--mdc-tooltip-max-width"
46601
+ },
46602
+ {
46603
+ "description": "The padding of the tooltip.",
46604
+ "name": "--mdc-tooltip-padding"
46605
+ },
46606
+ {
46607
+ "description": "The text color of the tooltip.",
46608
+ "name": "--mdc-tooltip-text-color"
46609
+ },
46610
+ {
46611
+ "description": "The text color of the tooltip when the color is contrast.",
46612
+ "name": "--mdc-tooltip-text-color-contrast"
46609
46613
  },
46610
46614
  {
46611
46615
  "description": "radius of the arrow border",
@@ -46696,53 +46700,29 @@
46696
46700
  }
46697
46701
  }
46698
46702
  ],
46699
- "slots": [
46700
- {
46701
- "description": "Default slot for the toggletip content",
46702
- "name": "",
46703
- "inheritedFrom": {
46704
- "name": "Popover",
46705
- "module": "src/components/popover/popover.component.ts"
46706
- }
46707
- }
46708
- ],
46709
46703
  "members": [
46710
46704
  {
46711
46705
  "kind": "field",
46712
- "name": "defaultSlotNodes",
46713
- "type": {
46714
- "text": "Array<Node>"
46715
- },
46716
- "privacy": "private"
46717
- },
46718
- {
46719
- "kind": "field",
46720
- "name": "screenreaderAnnouncerIdentity",
46706
+ "name": "tooltipType",
46721
46707
  "type": {
46722
- "text": "string | undefined"
46708
+ "text": "TooltipType"
46723
46709
  },
46724
- "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
46725
- "attribute": "screenreader-announcer-identity",
46710
+ "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
46711
+ "default": "'description'",
46712
+ "attribute": "tooltip-type",
46726
46713
  "reflects": true
46727
46714
  },
46728
46715
  {
46729
46716
  "kind": "field",
46730
- "name": "placement",
46717
+ "name": "defaultSlotNodes",
46731
46718
  "type": {
46732
- "text": "PopoverPlacement"
46719
+ "text": "Array<Node>"
46733
46720
  },
46734
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
46735
- "default": "bottom",
46736
- "attribute": "placement",
46737
- "reflects": true,
46738
- "inheritedFrom": {
46739
- "name": "Popover",
46740
- "module": "components/popover/popover.component.js"
46741
- }
46721
+ "privacy": "private"
46742
46722
  },
46743
46723
  {
46744
46724
  "kind": "method",
46745
- "name": "getToggleTipText",
46725
+ "name": "getTooltipText",
46746
46726
  "privacy": "private",
46747
46727
  "return": {
46748
46728
  "type": {
@@ -46750,6 +46730,37 @@
46750
46730
  }
46751
46731
  }
46752
46732
  },
46733
+ {
46734
+ "kind": "method",
46735
+ "name": "setTooltipType",
46736
+ "privacy": "private",
46737
+ "return": {
46738
+ "type": {
46739
+ "text": "void"
46740
+ }
46741
+ },
46742
+ "parameters": [
46743
+ {
46744
+ "name": "type",
46745
+ "type": {
46746
+ "text": "TooltipType"
46747
+ },
46748
+ "description": "The type to set."
46749
+ }
46750
+ ],
46751
+ "description": "Sets the type attribute for the tooltip component.\nIf the provided type is not included in the TOOLTIP_TYPES,\nit defaults to the value specified in DEFAULTS.TOOLTIP_TYPE."
46752
+ },
46753
+ {
46754
+ "kind": "method",
46755
+ "name": "onIdUpdated",
46756
+ "privacy": "private",
46757
+ "return": {
46758
+ "type": {
46759
+ "text": "Promise<void>"
46760
+ }
46761
+ },
46762
+ "description": "Updates the tooltip id if it is empty."
46763
+ },
46753
46764
  {
46754
46765
  "kind": "method",
46755
46766
  "name": "onPlacementUpdated",
@@ -46759,7 +46770,27 @@
46759
46770
  "text": "void"
46760
46771
  }
46761
46772
  },
46762
- "description": "Updates the placement attribute if it is not a valid placement.\nDefault placement for toggle tip is top."
46773
+ "description": "Updates the placement attribute if it is not a valid placement.\nOverriding the default from Popover"
46774
+ },
46775
+ {
46776
+ "kind": "method",
46777
+ "name": "onTooltipTypeUpdated",
46778
+ "privacy": "private",
46779
+ "return": {
46780
+ "type": {
46781
+ "text": "void"
46782
+ }
46783
+ },
46784
+ "parameters": [
46785
+ {
46786
+ "name": "changedProperties",
46787
+ "type": {
46788
+ "text": "PropertyValues"
46789
+ },
46790
+ "description": "The changed properties."
46791
+ }
46792
+ ],
46793
+ "description": "Updates the tooltip type attribute and sets the appropriate aria props on the trigger component."
46763
46794
  },
46764
46795
  {
46765
46796
  "kind": "field",
@@ -47351,6 +47382,21 @@
47351
47382
  "module": "components/popover/popover.component.js"
47352
47383
  }
47353
47384
  },
47385
+ {
47386
+ "kind": "field",
47387
+ "name": "placement",
47388
+ "type": {
47389
+ "text": "PopoverPlacement"
47390
+ },
47391
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
47392
+ "default": "bottom",
47393
+ "attribute": "placement",
47394
+ "reflects": true,
47395
+ "inheritedFrom": {
47396
+ "name": "Popover",
47397
+ "module": "components/popover/popover.component.js"
47398
+ }
47399
+ },
47354
47400
  {
47355
47401
  "kind": "field",
47356
47402
  "name": "color",
@@ -48052,7 +48098,7 @@
48052
48098
  ],
48053
48099
  "events": [
48054
48100
  {
48055
- "description": "(React: onShown) This event is dispatched when the toggletip is shown",
48101
+ "description": "(React: onShown) This event is dispatched when the tooltip is shown",
48056
48102
  "name": "shown",
48057
48103
  "reactName": "onShown",
48058
48104
  "inheritedFrom": {
@@ -48061,7 +48107,7 @@
48061
48107
  }
48062
48108
  },
48063
48109
  {
48064
- "description": "(React: onHidden) This event is dispatched when the toggletip is hidden",
48110
+ "description": "(React: onHidden) This event is dispatched when the tooltip is hidden",
48065
48111
  "name": "hidden",
48066
48112
  "reactName": "onHidden",
48067
48113
  "inheritedFrom": {
@@ -48070,7 +48116,7 @@
48070
48116
  }
48071
48117
  },
48072
48118
  {
48073
- "description": "(React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)",
48119
+ "description": "(React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)",
48074
48120
  "name": "created",
48075
48121
  "reactName": "onCreated",
48076
48122
  "inheritedFrom": {
@@ -48079,7 +48125,7 @@
48079
48125
  }
48080
48126
  },
48081
48127
  {
48082
- "description": "(React: onDestroyed) This event is dispatched when the toggletip is destroyed (removed from the DOM)",
48128
+ "description": "(React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)",
48083
48129
  "name": "destroyed",
48084
48130
  "reactName": "onDestroyed",
48085
48131
  "inheritedFrom": {
@@ -48090,25 +48136,13 @@
48090
48136
  ],
48091
48137
  "attributes": [
48092
48138
  {
48093
- "name": "screenreader-announcer-identity",
48094
- "type": {
48095
- "text": "string | undefined"
48096
- },
48097
- "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
48098
- "fieldName": "screenreaderAnnouncerIdentity"
48099
- },
48100
- {
48101
- "name": "placement",
48139
+ "name": "tooltip-type",
48102
48140
  "type": {
48103
- "text": "PopoverPlacement"
48141
+ "text": "TooltipType"
48104
48142
  },
48105
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
48106
- "default": "bottom",
48107
- "fieldName": "placement",
48108
- "inheritedFrom": {
48109
- "name": "Popover",
48110
- "module": "src/components/popover/popover.component.ts"
48111
- }
48143
+ "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
48144
+ "default": "'description'",
48145
+ "fieldName": "tooltipType"
48112
48146
  },
48113
48147
  {
48114
48148
  "name": "should-focus-trap-wrap",
@@ -48162,6 +48196,19 @@
48162
48196
  "module": "src/components/popover/popover.component.ts"
48163
48197
  }
48164
48198
  },
48199
+ {
48200
+ "name": "placement",
48201
+ "type": {
48202
+ "text": "PopoverPlacement"
48203
+ },
48204
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
48205
+ "default": "bottom",
48206
+ "fieldName": "placement",
48207
+ "inheritedFrom": {
48208
+ "name": "Popover",
48209
+ "module": "src/components/popover/popover.component.ts"
48210
+ }
48211
+ },
48165
48212
  {
48166
48213
  "name": "color",
48167
48214
  "type": {
@@ -48569,9 +48616,19 @@
48569
48616
  "name": "Popover",
48570
48617
  "module": "/src/components/popover/popover.component"
48571
48618
  },
48572
- "tagName": "mdc-toggletip",
48573
- "jsDoc": "/**\n * A toggletip is triggered by clicking a trigger element.\n *\n * It can contain interactive content and can be closed by\n * clicking outside the toggletip or pressing the escape key.\n *\n * It can have optional close button to close the toggletip.\n *\n * Toggletip component uses `mdc-screenreaderannouncer` internally to\n * announce the toggletip text content with screen readers when the toggletip is shown.\n *\n * `screenreader-announcer-identity` attribute can be used to provide ID of an element\n * in DOM to which announcement elements are added. If not set, a visually hidden\n * div element is created in DOM to which announcement elements are added.\n *\n * Please refer to the `mdc-screenreaderannouncer` component for more details.\n *\n * @dependency mdc-screenreaderannouncer\n * @dependency mdc-button\n *\n * @tagname mdc-toggletip\n *\n * @event shown - (React: onShown) This event is dispatched when the toggletip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the toggletip is hidden\n * @event created - (React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the toggletip\n * is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-toggletip-max-width - The maximum width of the toggletip.\n * @cssproperty --mdc-toggletip-text-color - The text color of the toggletip.\n * @cssproperty --mdc-toggletip-text-color-contrast - The text color of the toggletip\n * when the color is contrast.\n *\n * @slot - Default slot for the toggletip content\n */",
48619
+ "tagName": "mdc-tooltip",
48620
+ "jsDoc": "/**\n * A tooltip is triggered by mouse hover or by keyboard focus\n * and will disappear upon mouse exit or focus change.\n *\n * Note: Tooltips cannot contain content that can be focused or interacted with.\n *\n * @tagname mdc-tooltip\n *\n * @event shown - (React: onShown) This event is dispatched when the tooltip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the tooltip is hidden\n * @event created - (React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-tooltip-max-width - The maximum width of the tooltip.\n * @cssproperty --mdc-tooltip-padding - The padding of the tooltip.\n * @cssproperty --mdc-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --mdc-tooltip-text-color-contrast - The text color of the tooltip when the color is contrast.\n *\n */",
48574
48621
  "customElement": true,
48622
+ "slots": [
48623
+ {
48624
+ "description": "Default slot for the popover content",
48625
+ "name": "",
48626
+ "inheritedFrom": {
48627
+ "name": "Popover",
48628
+ "module": "src/components/popover/popover.component.ts"
48629
+ }
48630
+ }
48631
+ ],
48575
48632
  "cssParts": [
48576
48633
  {
48577
48634
  "description": "The close button of the popover.",
@@ -48605,36 +48662,32 @@
48605
48662
  "kind": "js",
48606
48663
  "name": "default",
48607
48664
  "declaration": {
48608
- "name": "ToggleTip",
48609
- "module": "components/toggletip/toggletip.component.js"
48665
+ "name": "Tooltip",
48666
+ "module": "components/tooltip/tooltip.component.js"
48610
48667
  }
48611
48668
  }
48612
48669
  ]
48613
48670
  },
48614
48671
  {
48615
48672
  "kind": "javascript-module",
48616
- "path": "components/tooltip/tooltip.component.js",
48673
+ "path": "components/toggletip/toggletip.component.js",
48617
48674
  "declarations": [
48618
48675
  {
48619
48676
  "kind": "class",
48620
- "description": "A tooltip is triggered by mouse hover or by keyboard focus\nand will disappear upon mouse exit or focus change.\n\nNote: Tooltips cannot contain content that can be focused or interacted with.",
48621
- "name": "Tooltip",
48677
+ "description": "A toggletip is triggered by clicking a trigger element.\n\nIt can contain interactive content and can be closed by\nclicking outside the toggletip or pressing the escape key.\n\nIt can have optional close button to close the toggletip.\n\nToggletip component uses `mdc-screenreaderannouncer` internally to\nannounce the toggletip text content with screen readers when the toggletip is shown.\n\n`screenreader-announcer-identity` attribute can be used to provide ID of an element\nin DOM to which announcement elements are added. If not set, a visually hidden\ndiv element is created in DOM to which announcement elements are added.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
48678
+ "name": "ToggleTip",
48622
48679
  "cssProperties": [
48623
48680
  {
48624
- "description": "The maximum width of the tooltip.",
48625
- "name": "--mdc-tooltip-max-width"
48626
- },
48627
- {
48628
- "description": "The padding of the tooltip.",
48629
- "name": "--mdc-tooltip-padding"
48681
+ "description": "The maximum width of the toggletip.",
48682
+ "name": "--mdc-toggletip-max-width"
48630
48683
  },
48631
48684
  {
48632
- "description": "The text color of the tooltip.",
48633
- "name": "--mdc-tooltip-text-color"
48685
+ "description": "The text color of the toggletip.",
48686
+ "name": "--mdc-toggletip-text-color"
48634
48687
  },
48635
48688
  {
48636
- "description": "The text color of the tooltip when the color is contrast.",
48637
- "name": "--mdc-tooltip-text-color-contrast"
48689
+ "description": "The text color of the toggletip when the color is contrast.",
48690
+ "name": "--mdc-toggletip-text-color-contrast"
48638
48691
  },
48639
48692
  {
48640
48693
  "description": "radius of the arrow border",
@@ -48725,18 +48778,17 @@
48725
48778
  }
48726
48779
  }
48727
48780
  ],
48728
- "members": [
48781
+ "slots": [
48729
48782
  {
48730
- "kind": "field",
48731
- "name": "tooltipType",
48732
- "type": {
48733
- "text": "TooltipType"
48734
- },
48735
- "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
48736
- "default": "'description'",
48737
- "attribute": "tooltip-type",
48738
- "reflects": true
48739
- },
48783
+ "description": "Default slot for the toggletip content",
48784
+ "name": "",
48785
+ "inheritedFrom": {
48786
+ "name": "Popover",
48787
+ "module": "src/components/popover/popover.component.ts"
48788
+ }
48789
+ }
48790
+ ],
48791
+ "members": [
48740
48792
  {
48741
48793
  "kind": "field",
48742
48794
  "name": "defaultSlotNodes",
@@ -48746,76 +48798,50 @@
48746
48798
  "privacy": "private"
48747
48799
  },
48748
48800
  {
48749
- "kind": "method",
48750
- "name": "getTooltipText",
48751
- "privacy": "private",
48752
- "return": {
48753
- "type": {
48754
- "text": ""
48755
- }
48756
- }
48757
- },
48758
- {
48759
- "kind": "method",
48760
- "name": "setTooltipType",
48761
- "privacy": "private",
48762
- "return": {
48763
- "type": {
48764
- "text": "void"
48765
- }
48801
+ "kind": "field",
48802
+ "name": "screenreaderAnnouncerIdentity",
48803
+ "type": {
48804
+ "text": "string | undefined"
48766
48805
  },
48767
- "parameters": [
48768
- {
48769
- "name": "type",
48770
- "type": {
48771
- "text": "TooltipType"
48772
- },
48773
- "description": "The type to set."
48774
- }
48775
- ],
48776
- "description": "Sets the type attribute for the tooltip component.\nIf the provided type is not included in the TOOLTIP_TYPES,\nit defaults to the value specified in DEFAULTS.TOOLTIP_TYPE."
48806
+ "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
48807
+ "attribute": "screenreader-announcer-identity",
48808
+ "reflects": true
48777
48809
  },
48778
48810
  {
48779
- "kind": "method",
48780
- "name": "onIdUpdated",
48781
- "privacy": "private",
48782
- "return": {
48783
- "type": {
48784
- "text": "Promise<void>"
48785
- }
48811
+ "kind": "field",
48812
+ "name": "placement",
48813
+ "type": {
48814
+ "text": "PopoverPlacement"
48786
48815
  },
48787
- "description": "Updates the tooltip id if it is empty."
48816
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
48817
+ "default": "bottom",
48818
+ "attribute": "placement",
48819
+ "reflects": true,
48820
+ "inheritedFrom": {
48821
+ "name": "Popover",
48822
+ "module": "components/popover/popover.component.js"
48823
+ }
48788
48824
  },
48789
48825
  {
48790
48826
  "kind": "method",
48791
- "name": "onPlacementUpdated",
48827
+ "name": "getToggleTipText",
48792
48828
  "privacy": "private",
48793
48829
  "return": {
48794
48830
  "type": {
48795
- "text": "void"
48831
+ "text": ""
48796
48832
  }
48797
- },
48798
- "description": "Updates the placement attribute if it is not a valid placement.\nOverriding the default from Popover"
48833
+ }
48799
48834
  },
48800
48835
  {
48801
48836
  "kind": "method",
48802
- "name": "onTooltipTypeUpdated",
48837
+ "name": "onPlacementUpdated",
48803
48838
  "privacy": "private",
48804
48839
  "return": {
48805
48840
  "type": {
48806
48841
  "text": "void"
48807
48842
  }
48808
48843
  },
48809
- "parameters": [
48810
- {
48811
- "name": "changedProperties",
48812
- "type": {
48813
- "text": "PropertyValues"
48814
- },
48815
- "description": "The changed properties."
48816
- }
48817
- ],
48818
- "description": "Updates the tooltip type attribute and sets the appropriate aria props on the trigger component."
48844
+ "description": "Updates the placement attribute if it is not a valid placement.\nDefault placement for toggle tip is top."
48819
48845
  },
48820
48846
  {
48821
48847
  "kind": "field",
@@ -49407,21 +49433,6 @@
49407
49433
  "module": "components/popover/popover.component.js"
49408
49434
  }
49409
49435
  },
49410
- {
49411
- "kind": "field",
49412
- "name": "placement",
49413
- "type": {
49414
- "text": "PopoverPlacement"
49415
- },
49416
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
49417
- "default": "bottom",
49418
- "attribute": "placement",
49419
- "reflects": true,
49420
- "inheritedFrom": {
49421
- "name": "Popover",
49422
- "module": "components/popover/popover.component.js"
49423
- }
49424
- },
49425
49436
  {
49426
49437
  "kind": "field",
49427
49438
  "name": "color",
@@ -50123,7 +50134,7 @@
50123
50134
  ],
50124
50135
  "events": [
50125
50136
  {
50126
- "description": "(React: onShown) This event is dispatched when the tooltip is shown",
50137
+ "description": "(React: onShown) This event is dispatched when the toggletip is shown",
50127
50138
  "name": "shown",
50128
50139
  "reactName": "onShown",
50129
50140
  "inheritedFrom": {
@@ -50132,7 +50143,7 @@
50132
50143
  }
50133
50144
  },
50134
50145
  {
50135
- "description": "(React: onHidden) This event is dispatched when the tooltip is hidden",
50146
+ "description": "(React: onHidden) This event is dispatched when the toggletip is hidden",
50136
50147
  "name": "hidden",
50137
50148
  "reactName": "onHidden",
50138
50149
  "inheritedFrom": {
@@ -50141,7 +50152,7 @@
50141
50152
  }
50142
50153
  },
50143
50154
  {
50144
- "description": "(React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)",
50155
+ "description": "(React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)",
50145
50156
  "name": "created",
50146
50157
  "reactName": "onCreated",
50147
50158
  "inheritedFrom": {
@@ -50150,7 +50161,7 @@
50150
50161
  }
50151
50162
  },
50152
50163
  {
50153
- "description": "(React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)",
50164
+ "description": "(React: onDestroyed) This event is dispatched when the toggletip is destroyed (removed from the DOM)",
50154
50165
  "name": "destroyed",
50155
50166
  "reactName": "onDestroyed",
50156
50167
  "inheritedFrom": {
@@ -50161,13 +50172,25 @@
50161
50172
  ],
50162
50173
  "attributes": [
50163
50174
  {
50164
- "name": "tooltip-type",
50175
+ "name": "screenreader-announcer-identity",
50165
50176
  "type": {
50166
- "text": "TooltipType"
50177
+ "text": "string | undefined"
50167
50178
  },
50168
- "description": "The type of tooltip.\n- **description** sets aria-describedby on the trigger component which refers to the tooltip id.\n- **label** sets aria-labelledby on the trigger component which refers to the tooltip id.\n- **none** no aria props set on trigger component referring to the tooltip id.",
50169
- "default": "'description'",
50170
- "fieldName": "tooltipType"
50179
+ "description": "Set this attribute with the id of the element in the DOM, to which announcement\nelements will be appended.\nIf an id is provided, the announcement elements will be appended to this element.\nIf id is not provided, a visually hidden div element will be created in the DOM.\n\nPlease refer to the `mdc-screenreaderannouncer` component for more details.",
50180
+ "fieldName": "screenreaderAnnouncerIdentity"
50181
+ },
50182
+ {
50183
+ "name": "placement",
50184
+ "type": {
50185
+ "text": "PopoverPlacement"
50186
+ },
50187
+ "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
50188
+ "default": "bottom",
50189
+ "fieldName": "placement",
50190
+ "inheritedFrom": {
50191
+ "name": "Popover",
50192
+ "module": "src/components/popover/popover.component.ts"
50193
+ }
50171
50194
  },
50172
50195
  {
50173
50196
  "name": "should-focus-trap-wrap",
@@ -50221,19 +50244,6 @@
50221
50244
  "module": "src/components/popover/popover.component.ts"
50222
50245
  }
50223
50246
  },
50224
- {
50225
- "name": "placement",
50226
- "type": {
50227
- "text": "PopoverPlacement"
50228
- },
50229
- "description": "The placement of the popover.\n- **top**\n- **top-start**\n- **top-end**\n- **bottom**\n- **bottom-start**\n- **bottom-end**\n- **left**\n- **left-start**\n- **left-end**\n- **right**\n- **right-start**\n- **right-end**",
50230
- "default": "bottom",
50231
- "fieldName": "placement",
50232
- "inheritedFrom": {
50233
- "name": "Popover",
50234
- "module": "src/components/popover/popover.component.ts"
50235
- }
50236
- },
50237
50247
  {
50238
50248
  "name": "color",
50239
50249
  "type": {
@@ -50641,19 +50651,9 @@
50641
50651
  "name": "Popover",
50642
50652
  "module": "/src/components/popover/popover.component"
50643
50653
  },
50644
- "tagName": "mdc-tooltip",
50645
- "jsDoc": "/**\n * A tooltip is triggered by mouse hover or by keyboard focus\n * and will disappear upon mouse exit or focus change.\n *\n * Note: Tooltips cannot contain content that can be focused or interacted with.\n *\n * @tagname mdc-tooltip\n *\n * @event shown - (React: onShown) This event is dispatched when the tooltip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the tooltip is hidden\n * @event created - (React: onCreated) This event is dispatched when the tooltip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the tooltip is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-tooltip-max-width - The maximum width of the tooltip.\n * @cssproperty --mdc-tooltip-padding - The padding of the tooltip.\n * @cssproperty --mdc-tooltip-text-color - The text color of the tooltip.\n * @cssproperty --mdc-tooltip-text-color-contrast - The text color of the tooltip when the color is contrast.\n *\n */",
50654
+ "tagName": "mdc-toggletip",
50655
+ "jsDoc": "/**\n * A toggletip is triggered by clicking a trigger element.\n *\n * It can contain interactive content and can be closed by\n * clicking outside the toggletip or pressing the escape key.\n *\n * It can have optional close button to close the toggletip.\n *\n * Toggletip component uses `mdc-screenreaderannouncer` internally to\n * announce the toggletip text content with screen readers when the toggletip is shown.\n *\n * `screenreader-announcer-identity` attribute can be used to provide ID of an element\n * in DOM to which announcement elements are added. If not set, a visually hidden\n * div element is created in DOM to which announcement elements are added.\n *\n * Please refer to the `mdc-screenreaderannouncer` component for more details.\n *\n * @dependency mdc-screenreaderannouncer\n * @dependency mdc-button\n *\n * @tagname mdc-toggletip\n *\n * @event shown - (React: onShown) This event is dispatched when the toggletip is shown\n * @event hidden - (React: onHidden) This event is dispatched when the toggletip is hidden\n * @event created - (React: onCreated) This event is dispatched when the toggletip is created (added to the DOM)\n * @event destroyed - (React: onDestroyed) This event is dispatched when the toggletip\n * is destroyed (removed from the DOM)\n *\n * @cssproperty --mdc-toggletip-max-width - The maximum width of the toggletip.\n * @cssproperty --mdc-toggletip-text-color - The text color of the toggletip.\n * @cssproperty --mdc-toggletip-text-color-contrast - The text color of the toggletip\n * when the color is contrast.\n *\n * @slot - Default slot for the toggletip content\n */",
50646
50656
  "customElement": true,
50647
- "slots": [
50648
- {
50649
- "description": "Default slot for the popover content",
50650
- "name": "",
50651
- "inheritedFrom": {
50652
- "name": "Popover",
50653
- "module": "src/components/popover/popover.component.ts"
50654
- }
50655
- }
50656
- ],
50657
50657
  "cssParts": [
50658
50658
  {
50659
50659
  "description": "The close button of the popover.",
@@ -50687,8 +50687,8 @@
50687
50687
  "kind": "js",
50688
50688
  "name": "default",
50689
50689
  "declaration": {
50690
- "name": "Tooltip",
50691
- "module": "components/tooltip/tooltip.component.js"
50690
+ "name": "ToggleTip",
50691
+ "module": "components/toggletip/toggletip.component.js"
50692
50692
  }
50693
50693
  }
50694
50694
  ]