@momentum-design/components 0.80.0 → 0.80.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/browser/index.js +420 -398
- package/dist/browser/index.js.map +4 -4
- package/dist/components/checkbox/checkbox.component.d.ts +4 -0
- package/dist/components/checkbox/checkbox.component.js +4 -0
- package/dist/components/checkbox/index.d.ts +4 -1
- package/dist/components/checkbox/index.js +5 -2
- package/dist/components/dialog/dialog.component.d.ts +25 -8
- package/dist/components/dialog/dialog.component.js +50 -19
- package/dist/components/formfieldgroup/formfieldgroup.component.d.ts +5 -0
- package/dist/components/formfieldgroup/formfieldgroup.component.js +5 -0
- package/dist/components/formfieldgroup/index.d.ts +4 -2
- package/dist/components/formfieldgroup/index.js +4 -2
- package/dist/components/formfieldwrapper/formfieldwrapper.component.d.ts +21 -1
- package/dist/components/formfieldwrapper/formfieldwrapper.component.js +40 -2
- package/dist/components/formfieldwrapper/formfieldwrapper.constants.d.ts +3 -0
- package/dist/components/formfieldwrapper/formfieldwrapper.constants.js +3 -0
- package/dist/components/formfieldwrapper/index.d.ts +3 -1
- package/dist/components/formfieldwrapper/index.js +4 -2
- package/dist/components/input/index.d.ts +2 -1
- package/dist/components/input/index.js +3 -2
- package/dist/components/input/input.component.d.ts +1 -0
- package/dist/components/input/input.component.js +1 -0
- package/dist/components/input/input.constants.d.ts +1 -1
- package/dist/components/popover/popover.component.d.ts +1 -1
- package/dist/components/popover/popover.component.js +2 -6
- package/dist/components/progressbar/progressbar.component.js +2 -0
- package/dist/components/radio/index.d.ts +5 -1
- package/dist/components/radio/index.js +5 -1
- package/dist/components/radio/radio.component.d.ts +6 -1
- package/dist/components/radio/radio.component.js +6 -1
- package/dist/components/select/index.d.ts +2 -0
- package/dist/components/select/index.js +2 -0
- package/dist/components/select/select.component.d.ts +2 -1
- package/dist/components/select/select.component.js +7 -6
- package/dist/components/textarea/index.d.ts +1 -0
- package/dist/components/textarea/index.js +1 -0
- package/dist/components/textarea/textarea.component.d.ts +2 -2
- package/dist/components/textarea/textarea.component.js +2 -2
- package/dist/components/toggle/index.d.ts +3 -0
- package/dist/components/toggle/index.js +3 -0
- package/dist/components/toggle/toggle.component.d.ts +3 -0
- package/dist/components/toggle/toggle.component.js +3 -0
- package/dist/components/toggletip/toggletip.component.d.ts +1 -1
- package/dist/components/toggletip/toggletip.component.js +5 -12
- package/dist/components/toggletip/toggletip.styles.js +2 -2
- package/dist/custom-elements.json +2328 -1498
- package/dist/react/checkbox/index.d.ts +4 -0
- package/dist/react/checkbox/index.js +4 -0
- package/dist/react/formfieldgroup/index.d.ts +5 -0
- package/dist/react/formfieldgroup/index.js +5 -0
- package/dist/react/formfieldwrapper/index.d.ts +5 -1
- package/dist/react/formfieldwrapper/index.js +5 -1
- package/dist/react/index.d.ts +1 -1
- package/dist/react/index.js +1 -1
- package/dist/react/input/index.d.ts +1 -0
- package/dist/react/input/index.js +1 -0
- package/dist/react/radio/index.d.ts +6 -1
- package/dist/react/radio/index.js +6 -1
- package/dist/react/select/index.d.ts +2 -0
- package/dist/react/select/index.js +2 -0
- package/dist/react/textarea/index.d.ts +2 -2
- package/dist/react/textarea/index.js +2 -2
- package/dist/react/toggle/index.d.ts +3 -0
- package/dist/react/toggle/index.js +3 -0
- package/dist/utils/mixins/CardAndDialogFooterMixin.d.ts +3 -3
- package/dist/utils/mixins/CardAndDialogFooterMixin.js +20 -16
- package/package.json +1 -1
- package/dist/components/dialog/dialog.utils.d.ts +0 -7
- package/dist/components/dialog/dialog.utils.js +0 -33
@@ -6764,6 +6764,49 @@
|
|
6764
6764
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
6765
6765
|
}
|
6766
6766
|
},
|
6767
|
+
{
|
6768
|
+
"kind": "field",
|
6769
|
+
"name": "toggletipText",
|
6770
|
+
"type": {
|
6771
|
+
"text": "string | undefined"
|
6772
|
+
},
|
6773
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
6774
|
+
"attribute": "toggletip-text",
|
6775
|
+
"reflects": true,
|
6776
|
+
"inheritedFrom": {
|
6777
|
+
"name": "FormfieldWrapper",
|
6778
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
6779
|
+
}
|
6780
|
+
},
|
6781
|
+
{
|
6782
|
+
"kind": "field",
|
6783
|
+
"name": "toggletipPlacement",
|
6784
|
+
"type": {
|
6785
|
+
"text": "PopoverPlacement"
|
6786
|
+
},
|
6787
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
6788
|
+
"default": "'top'",
|
6789
|
+
"attribute": "toggletip-placement",
|
6790
|
+
"reflects": true,
|
6791
|
+
"inheritedFrom": {
|
6792
|
+
"name": "FormfieldWrapper",
|
6793
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
6794
|
+
}
|
6795
|
+
},
|
6796
|
+
{
|
6797
|
+
"kind": "field",
|
6798
|
+
"name": "infoIconAriaLabel",
|
6799
|
+
"type": {
|
6800
|
+
"text": "string | undefined"
|
6801
|
+
},
|
6802
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
6803
|
+
"attribute": "info-icon-aria-label",
|
6804
|
+
"reflects": true,
|
6805
|
+
"inheritedFrom": {
|
6806
|
+
"name": "FormfieldWrapper",
|
6807
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
6808
|
+
}
|
6809
|
+
},
|
6767
6810
|
{
|
6768
6811
|
"kind": "method",
|
6769
6812
|
"name": "renderLabelElement",
|
@@ -7010,6 +7053,43 @@
|
|
7010
7053
|
"name": "FormfieldWrapper",
|
7011
7054
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
7012
7055
|
}
|
7056
|
+
},
|
7057
|
+
{
|
7058
|
+
"name": "toggletip-text",
|
7059
|
+
"type": {
|
7060
|
+
"text": "string | undefined"
|
7061
|
+
},
|
7062
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
7063
|
+
"fieldName": "toggletipText",
|
7064
|
+
"inheritedFrom": {
|
7065
|
+
"name": "FormfieldWrapper",
|
7066
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
7067
|
+
}
|
7068
|
+
},
|
7069
|
+
{
|
7070
|
+
"name": "toggletip-placement",
|
7071
|
+
"type": {
|
7072
|
+
"text": "PopoverPlacement"
|
7073
|
+
},
|
7074
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
7075
|
+
"default": "'top'",
|
7076
|
+
"fieldName": "toggletipPlacement",
|
7077
|
+
"inheritedFrom": {
|
7078
|
+
"name": "FormfieldWrapper",
|
7079
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
7080
|
+
}
|
7081
|
+
},
|
7082
|
+
{
|
7083
|
+
"name": "info-icon-aria-label",
|
7084
|
+
"type": {
|
7085
|
+
"text": "string | undefined"
|
7086
|
+
},
|
7087
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
7088
|
+
"fieldName": "infoIconAriaLabel",
|
7089
|
+
"inheritedFrom": {
|
7090
|
+
"name": "FormfieldWrapper",
|
7091
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
7092
|
+
}
|
7013
7093
|
}
|
7014
7094
|
],
|
7015
7095
|
"mixins": [
|
@@ -7027,18 +7107,8 @@
|
|
7027
7107
|
"module": "/src/components/formfieldwrapper/formfieldwrapper.component"
|
7028
7108
|
},
|
7029
7109
|
"tagName": "mdc-checkbox",
|
7030
|
-
"jsDoc": "/**\n * Checkboxes allow users to select multiple options from a list or turn an item/feature on or off.\n * These are often used in forms, settings, and selections in lists.\n *\n * A checkbox component contains an optional label and an optional helper text.\n *\n * To create a group of checkboxes, use the FormFieldGroup component.\n *\n * @dependency mdc-icon\n *\n * @tagname mdc-checkbox\n *\n * @event change - (React: onChange) Event that gets dispatched when the checkbox state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the checkbox receives focus.\n *\n * @cssproperty --mdc-checkbox-background-color-hover - Allows customization of the background color on hover.\n * @cssproperty --mdc-checkbox-checked-background-color-hover - Background color for a selected checkbox when hovered.\n * @cssproperty --mdc-checkbox-checked-pressed-icon-color - Background color for a selected checkbox when pressed.\n * @cssproperty --mdc-checkbox-pressed-icon-color - Background color for a selected checkbox when pressed.\n * @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a selected checkbox when disabled.\n */",
|
7031
|
-
"customElement": true
|
7032
|
-
"slots": [
|
7033
|
-
{
|
7034
|
-
"description": "slot to add the label info icon",
|
7035
|
-
"name": "label-info",
|
7036
|
-
"inheritedFrom": {
|
7037
|
-
"name": "FormfieldWrapper",
|
7038
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
7039
|
-
}
|
7040
|
-
}
|
7041
|
-
]
|
7110
|
+
"jsDoc": "/**\n * Checkboxes allow users to select multiple options from a list or turn an item/feature on or off.\n * These are often used in forms, settings, and selections in lists.\n *\n * A checkbox component contains an optional label and an optional helper text.\n *\n * To create a group of checkboxes, use the FormFieldGroup component.\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-staticcheckbox\n * @dependency mdc-text\n * @dependency mdc-toggletip\n *\n * @tagname mdc-checkbox\n *\n * @event change - (React: onChange) Event that gets dispatched when the checkbox state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the checkbox receives focus.\n *\n * @cssproperty --mdc-checkbox-background-color-hover - Allows customization of the background color on hover.\n * @cssproperty --mdc-checkbox-checked-background-color-hover - Background color for a selected checkbox when hovered.\n * @cssproperty --mdc-checkbox-checked-pressed-icon-color - Background color for a selected checkbox when pressed.\n * @cssproperty --mdc-checkbox-pressed-icon-color - Background color for a selected checkbox when pressed.\n * @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a selected checkbox when disabled.\n */",
|
7111
|
+
"customElement": true
|
7042
7112
|
}
|
7043
7113
|
],
|
7044
7114
|
"exports": [
|
@@ -8510,10 +8580,10 @@
|
|
8510
8580
|
"kind": "field",
|
8511
8581
|
"name": "appendTo",
|
8512
8582
|
"type": {
|
8513
|
-
"text": "string"
|
8583
|
+
"text": "string | undefined"
|
8514
8584
|
},
|
8515
|
-
"default": "''",
|
8516
8585
|
"description": "Element ID that the popover append to.",
|
8586
|
+
"default": "''",
|
8517
8587
|
"attribute": "append-to",
|
8518
8588
|
"reflects": true,
|
8519
8589
|
"inheritedFrom": {
|
@@ -9135,10 +9205,10 @@
|
|
9135
9205
|
{
|
9136
9206
|
"name": "append-to",
|
9137
9207
|
"type": {
|
9138
|
-
"text": "string"
|
9208
|
+
"text": "string | undefined"
|
9139
9209
|
},
|
9140
|
-
"default": "''",
|
9141
9210
|
"description": "Element ID that the popover append to.",
|
9211
|
+
"default": "''",
|
9142
9212
|
"fieldName": "appendTo",
|
9143
9213
|
"inheritedFrom": {
|
9144
9214
|
"name": "Popover",
|
@@ -9290,10 +9360,10 @@
|
|
9290
9360
|
"kind": "field",
|
9291
9361
|
"name": "triggerId",
|
9292
9362
|
"type": {
|
9293
|
-
"text": "string"
|
9363
|
+
"text": "string | undefined"
|
9294
9364
|
},
|
9295
|
-
"default": "''",
|
9296
9365
|
"description": "The ID of the element that triggers the dialog",
|
9366
|
+
"default": "undefined",
|
9297
9367
|
"attribute": "triggerId",
|
9298
9368
|
"reflects": true
|
9299
9369
|
},
|
@@ -9336,6 +9406,8 @@
|
|
9336
9406
|
"type": {
|
9337
9407
|
"text": "DialogVariant"
|
9338
9408
|
},
|
9409
|
+
"description": "The variant of the dialog, can be 'default' or 'promotional'",
|
9410
|
+
"default": "default",
|
9339
9411
|
"attribute": "variant",
|
9340
9412
|
"reflects": true
|
9341
9413
|
},
|
@@ -9375,9 +9447,8 @@
|
|
9375
9447
|
"kind": "field",
|
9376
9448
|
"name": "headerText",
|
9377
9449
|
"type": {
|
9378
|
-
"text": "string"
|
9450
|
+
"text": "string | undefined"
|
9379
9451
|
},
|
9380
|
-
"default": "''",
|
9381
9452
|
"description": "Defines a string value to display as the title of the dialog",
|
9382
9453
|
"attribute": "header-text",
|
9383
9454
|
"reflects": true
|
@@ -9386,9 +9457,8 @@
|
|
9386
9457
|
"kind": "field",
|
9387
9458
|
"name": "descriptionText",
|
9388
9459
|
"type": {
|
9389
|
-
"text": "string"
|
9460
|
+
"text": "string | undefined"
|
9390
9461
|
},
|
9391
|
-
"default": "''",
|
9392
9462
|
"description": "Defines a string value to display as the under-header description of the dialog",
|
9393
9463
|
"attribute": "description-text",
|
9394
9464
|
"reflects": true
|
@@ -9981,10 +10051,10 @@
|
|
9981
10051
|
{
|
9982
10052
|
"name": "triggerId",
|
9983
10053
|
"type": {
|
9984
|
-
"text": "string"
|
10054
|
+
"text": "string | undefined"
|
9985
10055
|
},
|
9986
|
-
"default": "''",
|
9987
10056
|
"description": "The ID of the element that triggers the dialog",
|
10057
|
+
"default": "undefined",
|
9988
10058
|
"fieldName": "triggerId"
|
9989
10059
|
},
|
9990
10060
|
{
|
@@ -10019,6 +10089,8 @@
|
|
10019
10089
|
"type": {
|
10020
10090
|
"text": "DialogVariant"
|
10021
10091
|
},
|
10092
|
+
"description": "The variant of the dialog, can be 'default' or 'promotional'",
|
10093
|
+
"default": "default",
|
10022
10094
|
"fieldName": "variant"
|
10023
10095
|
},
|
10024
10096
|
{
|
@@ -10051,18 +10123,16 @@
|
|
10051
10123
|
{
|
10052
10124
|
"name": "header-text",
|
10053
10125
|
"type": {
|
10054
|
-
"text": "string"
|
10126
|
+
"text": "string | undefined"
|
10055
10127
|
},
|
10056
|
-
"default": "''",
|
10057
10128
|
"description": "Defines a string value to display as the title of the dialog",
|
10058
10129
|
"fieldName": "headerText"
|
10059
10130
|
},
|
10060
10131
|
{
|
10061
10132
|
"name": "description-text",
|
10062
10133
|
"type": {
|
10063
|
-
"text": "string"
|
10134
|
+
"text": "string | undefined"
|
10064
10135
|
},
|
10065
|
-
"default": "''",
|
10066
10136
|
"description": "Defines a string value to display as the under-header description of the dialog",
|
10067
10137
|
"fieldName": "descriptionText"
|
10068
10138
|
},
|
@@ -11029,14 +11099,6 @@
|
|
11029
11099
|
{
|
11030
11100
|
"description": "This is a default slot for checkbox or toggle components.",
|
11031
11101
|
"name": "default"
|
11032
|
-
},
|
11033
|
-
{
|
11034
|
-
"description": "slot to add the label info icon",
|
11035
|
-
"name": "label-info",
|
11036
|
-
"inheritedFrom": {
|
11037
|
-
"name": "FormfieldWrapper",
|
11038
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11039
|
-
}
|
11040
11102
|
}
|
11041
11103
|
],
|
11042
11104
|
"members": [
|
@@ -11141,6 +11203,49 @@
|
|
11141
11203
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
11142
11204
|
}
|
11143
11205
|
},
|
11206
|
+
{
|
11207
|
+
"kind": "field",
|
11208
|
+
"name": "toggletipText",
|
11209
|
+
"type": {
|
11210
|
+
"text": "string | undefined"
|
11211
|
+
},
|
11212
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
11213
|
+
"attribute": "toggletip-text",
|
11214
|
+
"reflects": true,
|
11215
|
+
"inheritedFrom": {
|
11216
|
+
"name": "FormfieldWrapper",
|
11217
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
11218
|
+
}
|
11219
|
+
},
|
11220
|
+
{
|
11221
|
+
"kind": "field",
|
11222
|
+
"name": "toggletipPlacement",
|
11223
|
+
"type": {
|
11224
|
+
"text": "PopoverPlacement"
|
11225
|
+
},
|
11226
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
11227
|
+
"default": "'top'",
|
11228
|
+
"attribute": "toggletip-placement",
|
11229
|
+
"reflects": true,
|
11230
|
+
"inheritedFrom": {
|
11231
|
+
"name": "FormfieldWrapper",
|
11232
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
11233
|
+
}
|
11234
|
+
},
|
11235
|
+
{
|
11236
|
+
"kind": "field",
|
11237
|
+
"name": "infoIconAriaLabel",
|
11238
|
+
"type": {
|
11239
|
+
"text": "string | undefined"
|
11240
|
+
},
|
11241
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
11242
|
+
"attribute": "info-icon-aria-label",
|
11243
|
+
"reflects": true,
|
11244
|
+
"inheritedFrom": {
|
11245
|
+
"name": "FormfieldWrapper",
|
11246
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
11247
|
+
}
|
11248
|
+
},
|
11144
11249
|
{
|
11145
11250
|
"kind": "method",
|
11146
11251
|
"name": "renderLabelElement",
|
@@ -11228,7 +11333,7 @@
|
|
11228
11333
|
"module": "/src/components/formfieldwrapper/formfieldwrapper.component"
|
11229
11334
|
},
|
11230
11335
|
"tagName": "mdc-formfieldgroup",
|
11231
|
-
"jsDoc": "/**\n * `mdc-formfieldgroup` component, groups the form field components together.\n * All passed in children will have a gap of 12px (0.75rem) each applied.\n *\n * This component is specifically for creating a `checkbox` group and a `toggle` group component.\n * For the radiogroup use the RadioGroup component instead.\n *\n * The header text and description text are displayed above the items with accessible labels.<br/>\n * The consumer has to provide atleast the header-text or the aria-label,\n * like one of them <b>has</b> to be passed in always, otherwise its not accessible.\n *\n * The role will be set to `group`.\n * The aria-label will be set with the data-aria-label property.\n * The aria-labelledby will be set with the header id which contains the header text information.\n * The aria-describedby will be set with the description id which contains the description text information.\n *\n * @tagname mdc-formfieldgroup\n *\n * @slot default - This is a default slot for checkbox or toggle components.\n */",
|
11336
|
+
"jsDoc": "/**\n * `mdc-formfieldgroup` component, groups the form field components together.\n * All passed in children will have a gap of 12px (0.75rem) each applied.\n *\n * This component is specifically for creating a `checkbox` group and a `toggle` group component.\n * For the radiogroup use the RadioGroup component instead.\n *\n * The header text and description text are displayed above the items with accessible labels.<br/>\n * The consumer has to provide atleast the header-text or the aria-label,\n * like one of them <b>has</b> to be passed in always, otherwise its not accessible.\n *\n * The role will be set to `group`.\n * The aria-label will be set with the data-aria-label property.\n * The aria-labelledby will be set with the header id which contains the header text information.\n * The aria-describedby will be set with the description id which contains the description text information.\n *\n * @tagname mdc-formfieldgroup\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-toggletip\n *\n * @slot default - This is a default slot for checkbox or toggle components.\n */",
|
11232
11337
|
"customElement": true,
|
11233
11338
|
"attributes": [
|
11234
11339
|
{
|
@@ -11318,6 +11423,43 @@
|
|
11318
11423
|
"name": "FormfieldWrapper",
|
11319
11424
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11320
11425
|
}
|
11426
|
+
},
|
11427
|
+
{
|
11428
|
+
"name": "toggletip-text",
|
11429
|
+
"type": {
|
11430
|
+
"text": "string | undefined"
|
11431
|
+
},
|
11432
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
11433
|
+
"fieldName": "toggletipText",
|
11434
|
+
"inheritedFrom": {
|
11435
|
+
"name": "FormfieldWrapper",
|
11436
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11437
|
+
}
|
11438
|
+
},
|
11439
|
+
{
|
11440
|
+
"name": "toggletip-placement",
|
11441
|
+
"type": {
|
11442
|
+
"text": "PopoverPlacement"
|
11443
|
+
},
|
11444
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
11445
|
+
"default": "'top'",
|
11446
|
+
"fieldName": "toggletipPlacement",
|
11447
|
+
"inheritedFrom": {
|
11448
|
+
"name": "FormfieldWrapper",
|
11449
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11450
|
+
}
|
11451
|
+
},
|
11452
|
+
{
|
11453
|
+
"name": "info-icon-aria-label",
|
11454
|
+
"type": {
|
11455
|
+
"text": "string | undefined"
|
11456
|
+
},
|
11457
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
11458
|
+
"fieldName": "infoIconAriaLabel",
|
11459
|
+
"inheritedFrom": {
|
11460
|
+
"name": "FormfieldWrapper",
|
11461
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
11462
|
+
}
|
11321
11463
|
}
|
11322
11464
|
]
|
11323
11465
|
}
|
@@ -11341,12 +11483,6 @@
|
|
11341
11483
|
"kind": "class",
|
11342
11484
|
"description": "formfieldwrapper is a component that contains the label and helper/validation text\n that can be configured in various ways to suit different use cases (most of the input related components).\nIt is used as an internal component and is not intended to be used directly by consumers.",
|
11343
11485
|
"name": "FormfieldWrapper",
|
11344
|
-
"slots": [
|
11345
|
-
{
|
11346
|
-
"description": "slot to add the label info icon",
|
11347
|
-
"name": "label-info"
|
11348
|
-
}
|
11349
|
-
],
|
11350
11486
|
"members": [
|
11351
11487
|
{
|
11352
11488
|
"kind": "field",
|
@@ -11399,6 +11535,37 @@
|
|
11399
11535
|
"attribute": "help-text",
|
11400
11536
|
"reflects": true
|
11401
11537
|
},
|
11538
|
+
{
|
11539
|
+
"kind": "field",
|
11540
|
+
"name": "toggletipText",
|
11541
|
+
"type": {
|
11542
|
+
"text": "string | undefined"
|
11543
|
+
},
|
11544
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
11545
|
+
"attribute": "toggletip-text",
|
11546
|
+
"reflects": true
|
11547
|
+
},
|
11548
|
+
{
|
11549
|
+
"kind": "field",
|
11550
|
+
"name": "toggletipPlacement",
|
11551
|
+
"type": {
|
11552
|
+
"text": "PopoverPlacement"
|
11553
|
+
},
|
11554
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
11555
|
+
"default": "'top'",
|
11556
|
+
"attribute": "toggletip-placement",
|
11557
|
+
"reflects": true
|
11558
|
+
},
|
11559
|
+
{
|
11560
|
+
"kind": "field",
|
11561
|
+
"name": "infoIconAriaLabel",
|
11562
|
+
"type": {
|
11563
|
+
"text": "string | undefined"
|
11564
|
+
},
|
11565
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
11566
|
+
"attribute": "info-icon-aria-label",
|
11567
|
+
"reflects": true
|
11568
|
+
},
|
11402
11569
|
{
|
11403
11570
|
"kind": "method",
|
11404
11571
|
"name": "renderLabelElement",
|
@@ -11513,6 +11680,31 @@
|
|
11513
11680
|
"description": "The help text that is displayed below the input field.",
|
11514
11681
|
"fieldName": "helpText"
|
11515
11682
|
},
|
11683
|
+
{
|
11684
|
+
"name": "toggletip-text",
|
11685
|
+
"type": {
|
11686
|
+
"text": "string | undefined"
|
11687
|
+
},
|
11688
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
11689
|
+
"fieldName": "toggletipText"
|
11690
|
+
},
|
11691
|
+
{
|
11692
|
+
"name": "toggletip-placement",
|
11693
|
+
"type": {
|
11694
|
+
"text": "PopoverPlacement"
|
11695
|
+
},
|
11696
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
11697
|
+
"default": "'top'",
|
11698
|
+
"fieldName": "toggletipPlacement"
|
11699
|
+
},
|
11700
|
+
{
|
11701
|
+
"name": "info-icon-aria-label",
|
11702
|
+
"type": {
|
11703
|
+
"text": "string | undefined"
|
11704
|
+
},
|
11705
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
11706
|
+
"fieldName": "infoIconAriaLabel"
|
11707
|
+
},
|
11516
11708
|
{
|
11517
11709
|
"name": "disabled",
|
11518
11710
|
"type": {
|
@@ -11538,7 +11730,7 @@
|
|
11538
11730
|
"module": "/src/models"
|
11539
11731
|
},
|
11540
11732
|
"tagName": "mdc-formfieldwrapper",
|
11541
|
-
"jsDoc": "/**\n * formfieldwrapper is a component that contains the label and helper/validation text\n * that can be configured in various ways to suit different use cases (most of the input related components).\n * It is used as an internal component and is not intended to be used directly by consumers.\n *\n * @tagname mdc-formfieldwrapper\n *\n * @
|
11733
|
+
"jsDoc": "/**\n * formfieldwrapper is a component that contains the label and helper/validation text\n * that can be configured in various ways to suit different use cases (most of the input related components).\n * It is used as an internal component and is not intended to be used directly by consumers.\n *\n * @tagname mdc-formfieldwrapper\n *\n * @dependency mdc-text\n * @dependency mdc-icon\n * @dependency mdc-button\n * @dependency mdc-toggletip\n *\n *\n */",
|
11542
11734
|
"customElement": true
|
11543
11735
|
}
|
11544
11736
|
],
|
@@ -12534,6 +12726,49 @@
|
|
12534
12726
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
12535
12727
|
}
|
12536
12728
|
},
|
12729
|
+
{
|
12730
|
+
"kind": "field",
|
12731
|
+
"name": "toggletipText",
|
12732
|
+
"type": {
|
12733
|
+
"text": "string | undefined"
|
12734
|
+
},
|
12735
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
12736
|
+
"attribute": "toggletip-text",
|
12737
|
+
"reflects": true,
|
12738
|
+
"inheritedFrom": {
|
12739
|
+
"name": "FormfieldWrapper",
|
12740
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
12741
|
+
}
|
12742
|
+
},
|
12743
|
+
{
|
12744
|
+
"kind": "field",
|
12745
|
+
"name": "toggletipPlacement",
|
12746
|
+
"type": {
|
12747
|
+
"text": "PopoverPlacement"
|
12748
|
+
},
|
12749
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
12750
|
+
"default": "'top'",
|
12751
|
+
"attribute": "toggletip-placement",
|
12752
|
+
"reflects": true,
|
12753
|
+
"inheritedFrom": {
|
12754
|
+
"name": "FormfieldWrapper",
|
12755
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
12756
|
+
}
|
12757
|
+
},
|
12758
|
+
{
|
12759
|
+
"kind": "field",
|
12760
|
+
"name": "infoIconAriaLabel",
|
12761
|
+
"type": {
|
12762
|
+
"text": "string | undefined"
|
12763
|
+
},
|
12764
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
12765
|
+
"attribute": "info-icon-aria-label",
|
12766
|
+
"reflects": true,
|
12767
|
+
"inheritedFrom": {
|
12768
|
+
"name": "FormfieldWrapper",
|
12769
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
12770
|
+
}
|
12771
|
+
},
|
12537
12772
|
{
|
12538
12773
|
"kind": "method",
|
12539
12774
|
"name": "renderLabelElement",
|
@@ -12891,35 +13126,62 @@
|
|
12891
13126
|
"name": "FormfieldWrapper",
|
12892
13127
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
12893
13128
|
}
|
12894
|
-
}
|
12895
|
-
],
|
12896
|
-
"mixins": [
|
12897
|
-
{
|
12898
|
-
"name": "FormInternalsMixin",
|
12899
|
-
"module": "/src/utils/mixins/FormInternalsMixin"
|
12900
13129
|
},
|
12901
13130
|
{
|
12902
|
-
"name": "
|
12903
|
-
"
|
12904
|
-
|
12905
|
-
|
12906
|
-
|
12907
|
-
|
12908
|
-
|
12909
|
-
|
12910
|
-
|
12911
|
-
|
12912
|
-
|
12913
|
-
|
13131
|
+
"name": "toggletip-text",
|
13132
|
+
"type": {
|
13133
|
+
"text": "string | undefined"
|
13134
|
+
},
|
13135
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
13136
|
+
"fieldName": "toggletipText",
|
13137
|
+
"inheritedFrom": {
|
13138
|
+
"name": "FormfieldWrapper",
|
13139
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
13140
|
+
}
|
13141
|
+
},
|
13142
|
+
{
|
13143
|
+
"name": "toggletip-placement",
|
13144
|
+
"type": {
|
13145
|
+
"text": "PopoverPlacement"
|
13146
|
+
},
|
13147
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
13148
|
+
"default": "'top'",
|
13149
|
+
"fieldName": "toggletipPlacement",
|
13150
|
+
"inheritedFrom": {
|
13151
|
+
"name": "FormfieldWrapper",
|
13152
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
13153
|
+
}
|
13154
|
+
},
|
12914
13155
|
{
|
12915
|
-
"
|
12916
|
-
"
|
13156
|
+
"name": "info-icon-aria-label",
|
13157
|
+
"type": {
|
13158
|
+
"text": "string | undefined"
|
13159
|
+
},
|
13160
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
13161
|
+
"fieldName": "infoIconAriaLabel",
|
12917
13162
|
"inheritedFrom": {
|
12918
13163
|
"name": "FormfieldWrapper",
|
12919
13164
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
12920
13165
|
}
|
12921
13166
|
}
|
12922
|
-
]
|
13167
|
+
],
|
13168
|
+
"mixins": [
|
13169
|
+
{
|
13170
|
+
"name": "FormInternalsMixin",
|
13171
|
+
"module": "/src/utils/mixins/FormInternalsMixin"
|
13172
|
+
},
|
13173
|
+
{
|
13174
|
+
"name": "DataAriaLabelMixin",
|
13175
|
+
"module": "/src/utils/mixins/DataAriaLabelMixin"
|
13176
|
+
}
|
13177
|
+
],
|
13178
|
+
"superclass": {
|
13179
|
+
"name": "FormfieldWrapper",
|
13180
|
+
"module": "/src/components/formfieldwrapper"
|
13181
|
+
},
|
13182
|
+
"tagName": "mdc-input",
|
13183
|
+
"jsDoc": "/**\n * mdc-input is a component that allows users to input text.\n * It contains:\n * - label field - describe the input field.\n * - input field - contains the value\n * - help text or validation message - displayed below the input field.\n * - trailing button - it displays a clear the input field.\n * - prefix text - displayed before the input field.\n * - leading icon - displayed before the input field.\n * - clear-aria-label - aria label for the trailing button.\n * - all the attributes of the input field.\n *\n * @tagname mdc-input\n *\n * @event input - (React: onInput) This event is dispatched when the value of the input field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the input field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the input receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the input loses focus.\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-button\n * @dependency mdc-toggletip\n *\n * @cssproperty --mdc-input-disabled-border-color - Border color for the input container when disabled\n * @cssproperty --mdc-input-disabled-text-color - Text color for the input field when disabled\n * @cssproperty --mdc-input-disabled-background-color - Background color for the input field when disabled\n * @cssproperty --mdc-input-border-color - Border color for the input container\n * @cssproperty --mdc-input-text-color - Text color for the input field\n * @cssproperty --mdc-input-background-color - Background color for the input field\n * @cssproperty --mdc-input-selection-background-color - Background color for the selected text\n * @cssproperty --mdc-input-selection-text-color - Text color for the selected text\n * @cssproperty --mdc-input-support-text-color - Text color for the help text\n * @cssproperty --mdc-input-hover-background-color - Background color for the input field when hovered\n * @cssproperty --mdc-input-focused-background-color - Background color for the input field when focused\n * @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused\n * @cssproperty --mdc-input-error-border-color - Border color for the input container when error\n * @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning\n * @cssproperty --mdc-input-success-border-color - Border color for the input container when success\n * @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary\n *\n */",
|
13184
|
+
"customElement": true
|
12923
13185
|
}
|
12924
13186
|
],
|
12925
13187
|
"exports": [
|
@@ -19086,10 +19348,10 @@
|
|
19086
19348
|
"kind": "field",
|
19087
19349
|
"name": "appendTo",
|
19088
19350
|
"type": {
|
19089
|
-
"text": "string"
|
19351
|
+
"text": "string | undefined"
|
19090
19352
|
},
|
19091
|
-
"default": "''",
|
19092
19353
|
"description": "Element ID that the popover append to.",
|
19354
|
+
"default": "''",
|
19093
19355
|
"attribute": "append-to",
|
19094
19356
|
"reflects": true,
|
19095
19357
|
"inheritedFrom": {
|
@@ -19701,10 +19963,10 @@
|
|
19701
19963
|
{
|
19702
19964
|
"name": "append-to",
|
19703
19965
|
"type": {
|
19704
|
-
"text": "string"
|
19966
|
+
"text": "string | undefined"
|
19705
19967
|
},
|
19706
|
-
"default": "''",
|
19707
19968
|
"description": "Element ID that the popover append to.",
|
19969
|
+
"default": "''",
|
19708
19970
|
"fieldName": "appendTo",
|
19709
19971
|
"inheritedFrom": {
|
19710
19972
|
"name": "Popover",
|
@@ -21270,10 +21532,10 @@
|
|
21270
21532
|
"kind": "field",
|
21271
21533
|
"name": "appendTo",
|
21272
21534
|
"type": {
|
21273
|
-
"text": "string"
|
21535
|
+
"text": "string | undefined"
|
21274
21536
|
},
|
21275
|
-
"default": "''",
|
21276
21537
|
"description": "Element ID that the popover append to.",
|
21538
|
+
"default": "''",
|
21277
21539
|
"attribute": "append-to",
|
21278
21540
|
"reflects": true
|
21279
21541
|
},
|
@@ -22149,10 +22411,10 @@
|
|
22149
22411
|
{
|
22150
22412
|
"name": "append-to",
|
22151
22413
|
"type": {
|
22152
|
-
"text": "string"
|
22414
|
+
"text": "string | undefined"
|
22153
22415
|
},
|
22154
|
-
"default": "''",
|
22155
22416
|
"description": "Element ID that the popover append to.",
|
22417
|
+
"default": "''",
|
22156
22418
|
"fieldName": "appendTo"
|
22157
22419
|
},
|
22158
22420
|
{
|
@@ -22622,6 +22884,49 @@
|
|
22622
22884
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
22623
22885
|
}
|
22624
22886
|
},
|
22887
|
+
{
|
22888
|
+
"kind": "field",
|
22889
|
+
"name": "toggletipText",
|
22890
|
+
"type": {
|
22891
|
+
"text": "string | undefined"
|
22892
|
+
},
|
22893
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
22894
|
+
"attribute": "toggletip-text",
|
22895
|
+
"reflects": true,
|
22896
|
+
"inheritedFrom": {
|
22897
|
+
"name": "FormfieldWrapper",
|
22898
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
22899
|
+
}
|
22900
|
+
},
|
22901
|
+
{
|
22902
|
+
"kind": "field",
|
22903
|
+
"name": "toggletipPlacement",
|
22904
|
+
"type": {
|
22905
|
+
"text": "PopoverPlacement"
|
22906
|
+
},
|
22907
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
22908
|
+
"default": "'top'",
|
22909
|
+
"attribute": "toggletip-placement",
|
22910
|
+
"reflects": true,
|
22911
|
+
"inheritedFrom": {
|
22912
|
+
"name": "FormfieldWrapper",
|
22913
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
22914
|
+
}
|
22915
|
+
},
|
22916
|
+
{
|
22917
|
+
"kind": "field",
|
22918
|
+
"name": "infoIconAriaLabel",
|
22919
|
+
"type": {
|
22920
|
+
"text": "string | undefined"
|
22921
|
+
},
|
22922
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
22923
|
+
"attribute": "info-icon-aria-label",
|
22924
|
+
"reflects": true,
|
22925
|
+
"inheritedFrom": {
|
22926
|
+
"name": "FormfieldWrapper",
|
22927
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
22928
|
+
}
|
22929
|
+
},
|
22625
22930
|
{
|
22626
22931
|
"kind": "method",
|
22627
22932
|
"name": "renderLabelElement",
|
@@ -22813,6 +23118,43 @@
|
|
22813
23118
|
"name": "FormfieldWrapper",
|
22814
23119
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
22815
23120
|
}
|
23121
|
+
},
|
23122
|
+
{
|
23123
|
+
"name": "toggletip-text",
|
23124
|
+
"type": {
|
23125
|
+
"text": "string | undefined"
|
23126
|
+
},
|
23127
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
23128
|
+
"fieldName": "toggletipText",
|
23129
|
+
"inheritedFrom": {
|
23130
|
+
"name": "FormfieldWrapper",
|
23131
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23132
|
+
}
|
23133
|
+
},
|
23134
|
+
{
|
23135
|
+
"name": "toggletip-placement",
|
23136
|
+
"type": {
|
23137
|
+
"text": "PopoverPlacement"
|
23138
|
+
},
|
23139
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
23140
|
+
"default": "'top'",
|
23141
|
+
"fieldName": "toggletipPlacement",
|
23142
|
+
"inheritedFrom": {
|
23143
|
+
"name": "FormfieldWrapper",
|
23144
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23145
|
+
}
|
23146
|
+
},
|
23147
|
+
{
|
23148
|
+
"name": "info-icon-aria-label",
|
23149
|
+
"type": {
|
23150
|
+
"text": "string | undefined"
|
23151
|
+
},
|
23152
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
23153
|
+
"fieldName": "infoIconAriaLabel",
|
23154
|
+
"inheritedFrom": {
|
23155
|
+
"name": "FormfieldWrapper",
|
23156
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23157
|
+
}
|
22816
23158
|
}
|
22817
23159
|
],
|
22818
23160
|
"mixins": [
|
@@ -22827,17 +23169,7 @@
|
|
22827
23169
|
},
|
22828
23170
|
"tagName": "mdc-progressbar",
|
22829
23171
|
"jsDoc": "/**\n * mdc-progressbar component visually represents a progress indicator, typically used to show\n * the completion state of an ongoing process (e.g., loading, file upload, etc.).\n * It contains an optional label and an optional helper text.\n *\n * - It supports mainly two types: Default and Inline\n * - It supports three validation variants: Default, Success and Error.\n *\n * This component is created by extending FormfieldWrapper.\n *\n * @tagname mdc-progressbar\n *\n * @dependency mdc-icon\n * @dependency mdc-text\n *\n * @cssproperty --mdc-progressbar-default-background-color - Background color of the progressbar when inactive.\n * @cssproperty --mdc-progressbar-default-active-background-color - Background color of the progressbar when active.\n * @cssproperty --mdc-progressbar-success-background-color - Background color of the progressbar when in success state.\n * @cssproperty --mdc-progressbar-error-background-color - Background color of the progressbar when in error state.\n * @cssproperty --mdc-progressbar-height - The height of the progressbar.\n * @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.\n * @cssproperty --mdc-progressbar-label-color - Color of the progressbar label text.\n * @cssproperty --mdc-progressbar-label-lineheight - Line height of the label text.\n * @cssproperty --mdc-progressbar-label-fontsize - Font size of the label text.\n * @cssproperty --mdc-progressbar-label-fontweight - Font weight of the label text.\n * @cssproperty --mdc-progressbar-help-text-color - Color of the help text.\n */",
|
22830
|
-
"customElement": true
|
22831
|
-
"slots": [
|
22832
|
-
{
|
22833
|
-
"description": "slot to add the label info icon",
|
22834
|
-
"name": "label-info",
|
22835
|
-
"inheritedFrom": {
|
22836
|
-
"name": "FormfieldWrapper",
|
22837
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
22838
|
-
}
|
22839
|
-
}
|
22840
|
-
]
|
23172
|
+
"customElement": true
|
22841
23173
|
}
|
22842
23174
|
],
|
22843
23175
|
"exports": [
|
@@ -23157,6 +23489,49 @@
|
|
23157
23489
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23158
23490
|
}
|
23159
23491
|
},
|
23492
|
+
{
|
23493
|
+
"kind": "field",
|
23494
|
+
"name": "toggletipText",
|
23495
|
+
"type": {
|
23496
|
+
"text": "string | undefined"
|
23497
|
+
},
|
23498
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
23499
|
+
"attribute": "toggletip-text",
|
23500
|
+
"reflects": true,
|
23501
|
+
"inheritedFrom": {
|
23502
|
+
"name": "FormfieldWrapper",
|
23503
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23504
|
+
}
|
23505
|
+
},
|
23506
|
+
{
|
23507
|
+
"kind": "field",
|
23508
|
+
"name": "toggletipPlacement",
|
23509
|
+
"type": {
|
23510
|
+
"text": "PopoverPlacement"
|
23511
|
+
},
|
23512
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
23513
|
+
"default": "'top'",
|
23514
|
+
"attribute": "toggletip-placement",
|
23515
|
+
"reflects": true,
|
23516
|
+
"inheritedFrom": {
|
23517
|
+
"name": "FormfieldWrapper",
|
23518
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23519
|
+
}
|
23520
|
+
},
|
23521
|
+
{
|
23522
|
+
"kind": "field",
|
23523
|
+
"name": "infoIconAriaLabel",
|
23524
|
+
"type": {
|
23525
|
+
"text": "string | undefined"
|
23526
|
+
},
|
23527
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
23528
|
+
"attribute": "info-icon-aria-label",
|
23529
|
+
"reflects": true,
|
23530
|
+
"inheritedFrom": {
|
23531
|
+
"name": "FormfieldWrapper",
|
23532
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23533
|
+
}
|
23534
|
+
},
|
23160
23535
|
{
|
23161
23536
|
"kind": "method",
|
23162
23537
|
"name": "renderLabelElement",
|
@@ -23367,12 +23742,39 @@
|
|
23367
23742
|
"name": "FormfieldWrapper",
|
23368
23743
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23369
23744
|
}
|
23370
|
-
}
|
23371
|
-
|
23372
|
-
|
23745
|
+
},
|
23746
|
+
{
|
23747
|
+
"name": "toggletip-text",
|
23748
|
+
"type": {
|
23749
|
+
"text": "string | undefined"
|
23750
|
+
},
|
23751
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
23752
|
+
"fieldName": "toggletipText",
|
23753
|
+
"inheritedFrom": {
|
23754
|
+
"name": "FormfieldWrapper",
|
23755
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23756
|
+
}
|
23757
|
+
},
|
23758
|
+
{
|
23759
|
+
"name": "toggletip-placement",
|
23760
|
+
"type": {
|
23761
|
+
"text": "PopoverPlacement"
|
23762
|
+
},
|
23763
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
23764
|
+
"default": "'top'",
|
23765
|
+
"fieldName": "toggletipPlacement",
|
23766
|
+
"inheritedFrom": {
|
23767
|
+
"name": "FormfieldWrapper",
|
23768
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
23769
|
+
}
|
23770
|
+
},
|
23373
23771
|
{
|
23374
|
-
"
|
23375
|
-
"
|
23772
|
+
"name": "info-icon-aria-label",
|
23773
|
+
"type": {
|
23774
|
+
"text": "string | undefined"
|
23775
|
+
},
|
23776
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
23777
|
+
"fieldName": "infoIconAriaLabel",
|
23376
23778
|
"inheritedFrom": {
|
23377
23779
|
"name": "FormfieldWrapper",
|
23378
23780
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
@@ -23394,326 +23796,34 @@
|
|
23394
23796
|
},
|
23395
23797
|
{
|
23396
23798
|
"kind": "javascript-module",
|
23397
|
-
"path": "components/
|
23799
|
+
"path": "components/radiogroup/radiogroup.component.js",
|
23398
23800
|
"declarations": [
|
23399
23801
|
{
|
23400
23802
|
"kind": "class",
|
23401
|
-
"description": "
|
23402
|
-
"name": "
|
23803
|
+
"description": "`mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\nIt can have a header text and a description. It enables users to select a single option from a set of options.\nIt is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.",
|
23804
|
+
"name": "RadioGroup",
|
23403
23805
|
"cssProperties": [
|
23404
23806
|
{
|
23405
|
-
"description": "color of the
|
23406
|
-
"name": "--mdc-
|
23407
|
-
},
|
23408
|
-
{
|
23409
|
-
"description": "color of the radio button when inactive and hovered",
|
23410
|
-
"name": "--mdc-radio-control-inactive-hover"
|
23411
|
-
},
|
23412
|
-
{
|
23413
|
-
"description": "color of the radio button when inactive and pressed",
|
23414
|
-
"name": "--mdc-radio-control-inactive-pressed-color"
|
23415
|
-
},
|
23416
|
-
{
|
23417
|
-
"description": "color of the radio button when active and hovered",
|
23418
|
-
"name": "--mdc-radio-control-active-hover-color"
|
23419
|
-
},
|
23420
|
-
{
|
23421
|
-
"description": "color of the radio button when active and pressed",
|
23422
|
-
"name": "--mdc-radio-control-active-pressed-color"
|
23423
|
-
},
|
23424
|
-
{
|
23425
|
-
"description": "color of the radio button when disabled",
|
23426
|
-
"name": "--mdc-radio-disabled-border-color"
|
23427
|
-
},
|
23428
|
-
{
|
23429
|
-
"description": "color of the radio button when active and disabled",
|
23430
|
-
"name": "--mdc-radio-control-active-disabled-background"
|
23431
|
-
},
|
23432
|
-
{
|
23433
|
-
"description": "color of the radio button when inactive and disabled",
|
23434
|
-
"name": "--mdc-radio-control-inactive-disabled-background"
|
23807
|
+
"description": "color of the description text",
|
23808
|
+
"name": "--mdc-radiogroup-description-text-normal"
|
23435
23809
|
}
|
23436
23810
|
],
|
23437
23811
|
"members": [
|
23438
23812
|
{
|
23439
23813
|
"kind": "field",
|
23440
|
-
"name": "
|
23814
|
+
"name": "name",
|
23441
23815
|
"type": {
|
23442
|
-
"text": "
|
23816
|
+
"text": "string"
|
23443
23817
|
},
|
23444
|
-
"default": "
|
23445
|
-
"description": "
|
23446
|
-
"attribute": "
|
23447
|
-
"reflects": true
|
23818
|
+
"default": "''",
|
23819
|
+
"description": "Name of the radio group.\nThey are used to group elements in a form together.",
|
23820
|
+
"attribute": "name"
|
23448
23821
|
},
|
23449
23822
|
{
|
23450
23823
|
"kind": "field",
|
23451
|
-
"name": "
|
23824
|
+
"name": "dataAriaLabel",
|
23452
23825
|
"type": {
|
23453
|
-
"text": "
|
23454
|
-
},
|
23455
|
-
"default": "false",
|
23456
|
-
"description": "Determines whether the radio is read-only.",
|
23457
|
-
"attribute": "readonly",
|
23458
|
-
"reflects": true
|
23459
|
-
},
|
23460
|
-
{
|
23461
|
-
"kind": "field",
|
23462
|
-
"name": "autofocus",
|
23463
|
-
"type": {
|
23464
|
-
"text": "boolean"
|
23465
|
-
},
|
23466
|
-
"default": "false",
|
23467
|
-
"description": "Automatically focus on the element when the page loads.\n[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)",
|
23468
|
-
"attribute": "autofocus",
|
23469
|
-
"reflects": true
|
23470
|
-
},
|
23471
|
-
{
|
23472
|
-
"kind": "method",
|
23473
|
-
"name": "getAllRadiosWithinSameGroup",
|
23474
|
-
"privacy": "private",
|
23475
|
-
"return": {
|
23476
|
-
"type": {
|
23477
|
-
"text": "Radio[]"
|
23478
|
-
}
|
23479
|
-
},
|
23480
|
-
"description": "Returns all radios within the same group (name)."
|
23481
|
-
},
|
23482
|
-
{
|
23483
|
-
"kind": "method",
|
23484
|
-
"name": "dispatchChangeEvent",
|
23485
|
-
"privacy": "private",
|
23486
|
-
"return": {
|
23487
|
-
"type": {
|
23488
|
-
"text": "void"
|
23489
|
-
}
|
23490
|
-
},
|
23491
|
-
"parameters": [
|
23492
|
-
{
|
23493
|
-
"name": "event",
|
23494
|
-
"type": {
|
23495
|
-
"text": "Event"
|
23496
|
-
}
|
23497
|
-
}
|
23498
|
-
],
|
23499
|
-
"description": "The 'change' event does not bubble up through the shadow DOM as it was not composed.\nTherefore, we need to re-dispatch the same event to ensure it is propagated correctly.\nRead more: https://developer.mozilla.org/en-US/docs/Web/API/Event/composed"
|
23500
|
-
},
|
23501
|
-
{
|
23502
|
-
"kind": "method",
|
23503
|
-
"name": "setGroupValidity",
|
23504
|
-
"privacy": "private",
|
23505
|
-
"parameters": [
|
23506
|
-
{
|
23507
|
-
"name": "radios",
|
23508
|
-
"type": {
|
23509
|
-
"text": "Radio[]"
|
23510
|
-
},
|
23511
|
-
"description": "Array of radios of the same group"
|
23512
|
-
},
|
23513
|
-
{
|
23514
|
-
"name": "isValid",
|
23515
|
-
"type": {
|
23516
|
-
"text": "boolean"
|
23517
|
-
},
|
23518
|
-
"description": "Boolean value to set the validity of the group"
|
23519
|
-
}
|
23520
|
-
],
|
23521
|
-
"description": "Sets the validity of the group of radios."
|
23522
|
-
},
|
23523
|
-
{
|
23524
|
-
"kind": "method",
|
23525
|
-
"name": "setActualFormValue",
|
23526
|
-
"privacy": "private",
|
23527
|
-
"description": "Updates the form value to reflect the current state of the radio.\nIf checked, the value is set to the user-provided value.\nIf unchecked, the value is set to null."
|
23528
|
-
},
|
23529
|
-
{
|
23530
|
-
"kind": "method",
|
23531
|
-
"name": "handleChange",
|
23532
|
-
"privacy": "private",
|
23533
|
-
"return": {
|
23534
|
-
"type": {
|
23535
|
-
"text": "void"
|
23536
|
-
}
|
23537
|
-
},
|
23538
|
-
"parameters": [
|
23539
|
-
{
|
23540
|
-
"name": "event",
|
23541
|
-
"type": {
|
23542
|
-
"text": "Event"
|
23543
|
-
}
|
23544
|
-
}
|
23545
|
-
],
|
23546
|
-
"description": "Handles the change event on the radio element.\nThis will toggle the state of the radio element.\nDispatches the change event."
|
23547
|
-
},
|
23548
|
-
{
|
23549
|
-
"kind": "method",
|
23550
|
-
"name": "updateRadio",
|
23551
|
-
"privacy": "private",
|
23552
|
-
"parameters": [
|
23553
|
-
{
|
23554
|
-
"name": "enabledRadios",
|
23555
|
-
"type": {
|
23556
|
-
"text": "Radio[]"
|
23557
|
-
},
|
23558
|
-
"description": "An array of enabled radio buttons within the same group."
|
23559
|
-
},
|
23560
|
-
{
|
23561
|
-
"name": "index",
|
23562
|
-
"type": {
|
23563
|
-
"text": "number"
|
23564
|
-
},
|
23565
|
-
"description": "The index of the radio button to be updated within the enabled radios array."
|
23566
|
-
},
|
23567
|
-
{
|
23568
|
-
"name": "event",
|
23569
|
-
"type": {
|
23570
|
-
"text": "Event"
|
23571
|
-
},
|
23572
|
-
"description": "The event that triggered the update."
|
23573
|
-
}
|
23574
|
-
],
|
23575
|
-
"description": "Updates the state of the radio button at the specified index within the enabled radios.\nFocuses the radio button and triggers the change event if the radio button is not read-only."
|
23576
|
-
},
|
23577
|
-
{
|
23578
|
-
"kind": "method",
|
23579
|
-
"name": "handleKeyDown",
|
23580
|
-
"privacy": "private",
|
23581
|
-
"return": {
|
23582
|
-
"type": {
|
23583
|
-
"text": "void"
|
23584
|
-
}
|
23585
|
-
},
|
23586
|
-
"parameters": [
|
23587
|
-
{
|
23588
|
-
"name": "event",
|
23589
|
-
"type": {
|
23590
|
-
"text": "KeyboardEvent"
|
23591
|
-
}
|
23592
|
-
}
|
23593
|
-
],
|
23594
|
-
"description": "Handles the keydown event (Arrow Up/Down/Left/Right) on the radio element."
|
23595
|
-
},
|
23596
|
-
{
|
23597
|
-
"kind": "method",
|
23598
|
-
"name": "updateTabIndex",
|
23599
|
-
"privacy": "private",
|
23600
|
-
"return": {
|
23601
|
-
"type": {
|
23602
|
-
"text": "void"
|
23603
|
-
}
|
23604
|
-
},
|
23605
|
-
"description": "Update tab index for all radios in the same group (name)\nIf any radio group is checked, it will have a tab index of 0\nIf no radio group is checked, the first enabled radio will have a tab index of 0"
|
23606
|
-
},
|
23607
|
-
{
|
23608
|
-
"kind": "field",
|
23609
|
-
"name": "renderLabelAndHelperText",
|
23610
|
-
"privacy": "private"
|
23611
|
-
},
|
23612
|
-
{
|
23613
|
-
"kind": "field",
|
23614
|
-
"name": "name",
|
23615
|
-
"type": {
|
23616
|
-
"text": "string"
|
23617
|
-
},
|
23618
|
-
"default": "''",
|
23619
|
-
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
23620
|
-
"attribute": "name",
|
23621
|
-
"reflects": true,
|
23622
|
-
"inheritedFrom": {
|
23623
|
-
"name": "FormInternalsMixin",
|
23624
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23625
|
-
}
|
23626
|
-
},
|
23627
|
-
{
|
23628
|
-
"kind": "field",
|
23629
|
-
"name": "value",
|
23630
|
-
"type": {
|
23631
|
-
"text": "string"
|
23632
|
-
},
|
23633
|
-
"default": "''",
|
23634
|
-
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
23635
|
-
"attribute": "value",
|
23636
|
-
"reflects": true,
|
23637
|
-
"inheritedFrom": {
|
23638
|
-
"name": "FormInternalsMixin",
|
23639
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23640
|
-
}
|
23641
|
-
},
|
23642
|
-
{
|
23643
|
-
"kind": "field",
|
23644
|
-
"name": "validationMessage",
|
23645
|
-
"type": {
|
23646
|
-
"text": "string | undefined"
|
23647
|
-
},
|
23648
|
-
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
23649
|
-
"attribute": "validation-message",
|
23650
|
-
"reflects": true,
|
23651
|
-
"inheritedFrom": {
|
23652
|
-
"name": "FormInternalsMixin",
|
23653
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23654
|
-
}
|
23655
|
-
},
|
23656
|
-
{
|
23657
|
-
"kind": "field",
|
23658
|
-
"name": "validity",
|
23659
|
-
"type": {
|
23660
|
-
"text": "ValidityState"
|
23661
|
-
},
|
23662
|
-
"readonly": true,
|
23663
|
-
"inheritedFrom": {
|
23664
|
-
"name": "FormInternalsMixin",
|
23665
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23666
|
-
}
|
23667
|
-
},
|
23668
|
-
{
|
23669
|
-
"kind": "field",
|
23670
|
-
"name": "willValidate",
|
23671
|
-
"readonly": true,
|
23672
|
-
"inheritedFrom": {
|
23673
|
-
"name": "FormInternalsMixin",
|
23674
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23675
|
-
}
|
23676
|
-
},
|
23677
|
-
{
|
23678
|
-
"kind": "method",
|
23679
|
-
"name": "setValidity",
|
23680
|
-
"description": "Sets the validity of the input field based on the input field's validity.",
|
23681
|
-
"return": {
|
23682
|
-
"type": {
|
23683
|
-
"text": ""
|
23684
|
-
}
|
23685
|
-
},
|
23686
|
-
"inheritedFrom": {
|
23687
|
-
"name": "FormInternalsMixin",
|
23688
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23689
|
-
}
|
23690
|
-
},
|
23691
|
-
{
|
23692
|
-
"kind": "method",
|
23693
|
-
"name": "checkValidity",
|
23694
|
-
"return": {
|
23695
|
-
"type": {
|
23696
|
-
"text": "boolean"
|
23697
|
-
}
|
23698
|
-
},
|
23699
|
-
"inheritedFrom": {
|
23700
|
-
"name": "FormInternalsMixin",
|
23701
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23702
|
-
}
|
23703
|
-
},
|
23704
|
-
{
|
23705
|
-
"kind": "method",
|
23706
|
-
"name": "reportValidity",
|
23707
|
-
"inheritedFrom": {
|
23708
|
-
"name": "FormInternalsMixin",
|
23709
|
-
"module": "utils/mixins/FormInternalsMixin.js"
|
23710
|
-
}
|
23711
|
-
},
|
23712
|
-
{
|
23713
|
-
"kind": "field",
|
23714
|
-
"name": "dataAriaLabel",
|
23715
|
-
"type": {
|
23716
|
-
"text": "string | null"
|
23826
|
+
"text": "string | null"
|
23717
23827
|
},
|
23718
23828
|
"default": "null",
|
23719
23829
|
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
@@ -23811,8 +23921,51 @@
|
|
23811
23921
|
}
|
23812
23922
|
},
|
23813
23923
|
{
|
23814
|
-
"kind": "
|
23815
|
-
"name": "
|
23924
|
+
"kind": "field",
|
23925
|
+
"name": "toggletipText",
|
23926
|
+
"type": {
|
23927
|
+
"text": "string | undefined"
|
23928
|
+
},
|
23929
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
23930
|
+
"attribute": "toggletip-text",
|
23931
|
+
"reflects": true,
|
23932
|
+
"inheritedFrom": {
|
23933
|
+
"name": "FormfieldWrapper",
|
23934
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23935
|
+
}
|
23936
|
+
},
|
23937
|
+
{
|
23938
|
+
"kind": "field",
|
23939
|
+
"name": "toggletipPlacement",
|
23940
|
+
"type": {
|
23941
|
+
"text": "PopoverPlacement"
|
23942
|
+
},
|
23943
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
23944
|
+
"default": "'top'",
|
23945
|
+
"attribute": "toggletip-placement",
|
23946
|
+
"reflects": true,
|
23947
|
+
"inheritedFrom": {
|
23948
|
+
"name": "FormfieldWrapper",
|
23949
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23950
|
+
}
|
23951
|
+
},
|
23952
|
+
{
|
23953
|
+
"kind": "field",
|
23954
|
+
"name": "infoIconAriaLabel",
|
23955
|
+
"type": {
|
23956
|
+
"text": "string | undefined"
|
23957
|
+
},
|
23958
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
23959
|
+
"attribute": "info-icon-aria-label",
|
23960
|
+
"reflects": true,
|
23961
|
+
"inheritedFrom": {
|
23962
|
+
"name": "FormfieldWrapper",
|
23963
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
23964
|
+
}
|
23965
|
+
},
|
23966
|
+
{
|
23967
|
+
"kind": "method",
|
23968
|
+
"name": "renderLabelElement",
|
23816
23969
|
"privacy": "protected",
|
23817
23970
|
"description": "creates the label element when the label property is set.\nid is used to link the label with the input field.",
|
23818
23971
|
"return": {
|
@@ -23886,88 +24039,15 @@
|
|
23886
24039
|
}
|
23887
24040
|
}
|
23888
24041
|
],
|
23889
|
-
"events": [
|
23890
|
-
{
|
23891
|
-
"type": {
|
23892
|
-
"text": "EventConstructor"
|
23893
|
-
}
|
23894
|
-
},
|
23895
|
-
{
|
23896
|
-
"description": "(React: onChange) Event that gets dispatched when the radio state changes.",
|
23897
|
-
"name": "change",
|
23898
|
-
"reactName": "onChange"
|
23899
|
-
},
|
23900
|
-
{
|
23901
|
-
"description": "(React: onFocus) Event that gets dispatched when the radio receives focus.",
|
23902
|
-
"name": "focus",
|
23903
|
-
"reactName": "onFocus"
|
23904
|
-
}
|
23905
|
-
],
|
23906
24042
|
"attributes": [
|
23907
|
-
{
|
23908
|
-
"name": "checked",
|
23909
|
-
"type": {
|
23910
|
-
"text": "boolean"
|
23911
|
-
},
|
23912
|
-
"default": "false",
|
23913
|
-
"description": "Determines whether the radio is selected or unselected.",
|
23914
|
-
"fieldName": "checked"
|
23915
|
-
},
|
23916
|
-
{
|
23917
|
-
"name": "readonly",
|
23918
|
-
"type": {
|
23919
|
-
"text": "boolean"
|
23920
|
-
},
|
23921
|
-
"default": "false",
|
23922
|
-
"description": "Determines whether the radio is read-only.",
|
23923
|
-
"fieldName": "readonly"
|
23924
|
-
},
|
23925
|
-
{
|
23926
|
-
"name": "autofocus",
|
23927
|
-
"type": {
|
23928
|
-
"text": "boolean"
|
23929
|
-
},
|
23930
|
-
"default": "false",
|
23931
|
-
"description": "Automatically focus on the element when the page loads.\n[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)",
|
23932
|
-
"fieldName": "autofocus"
|
23933
|
-
},
|
23934
24043
|
{
|
23935
24044
|
"name": "name",
|
23936
24045
|
"type": {
|
23937
24046
|
"text": "string"
|
23938
24047
|
},
|
23939
24048
|
"default": "''",
|
23940
|
-
"description": "
|
23941
|
-
"fieldName": "name"
|
23942
|
-
"inheritedFrom": {
|
23943
|
-
"name": "FormInternalsMixin",
|
23944
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
23945
|
-
}
|
23946
|
-
},
|
23947
|
-
{
|
23948
|
-
"name": "value",
|
23949
|
-
"type": {
|
23950
|
-
"text": "string"
|
23951
|
-
},
|
23952
|
-
"default": "''",
|
23953
|
-
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
23954
|
-
"fieldName": "value",
|
23955
|
-
"inheritedFrom": {
|
23956
|
-
"name": "FormInternalsMixin",
|
23957
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
23958
|
-
}
|
23959
|
-
},
|
23960
|
-
{
|
23961
|
-
"name": "validation-message",
|
23962
|
-
"type": {
|
23963
|
-
"text": "string | undefined"
|
23964
|
-
},
|
23965
|
-
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
23966
|
-
"fieldName": "validationMessage",
|
23967
|
-
"inheritedFrom": {
|
23968
|
-
"name": "FormInternalsMixin",
|
23969
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
23970
|
-
}
|
24049
|
+
"description": "Name of the radio group.\nThey are used to group elements in a form together.",
|
24050
|
+
"fieldName": "name"
|
23971
24051
|
},
|
23972
24052
|
{
|
23973
24053
|
"name": "data-aria-label",
|
@@ -24056,32 +24136,59 @@
|
|
24056
24136
|
"name": "FormfieldWrapper",
|
24057
24137
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24058
24138
|
}
|
24059
|
-
}
|
24060
|
-
],
|
24061
|
-
"mixins": [
|
24139
|
+
},
|
24062
24140
|
{
|
24063
|
-
"name": "
|
24064
|
-
"
|
24141
|
+
"name": "toggletip-text",
|
24142
|
+
"type": {
|
24143
|
+
"text": "string | undefined"
|
24144
|
+
},
|
24145
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
24146
|
+
"fieldName": "toggletipText",
|
24147
|
+
"inheritedFrom": {
|
24148
|
+
"name": "FormfieldWrapper",
|
24149
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24150
|
+
}
|
24065
24151
|
},
|
24066
24152
|
{
|
24067
|
-
"name": "
|
24068
|
-
"
|
24153
|
+
"name": "toggletip-placement",
|
24154
|
+
"type": {
|
24155
|
+
"text": "PopoverPlacement"
|
24156
|
+
},
|
24157
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
24158
|
+
"default": "'top'",
|
24159
|
+
"fieldName": "toggletipPlacement",
|
24160
|
+
"inheritedFrom": {
|
24161
|
+
"name": "FormfieldWrapper",
|
24162
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24163
|
+
}
|
24164
|
+
},
|
24165
|
+
{
|
24166
|
+
"name": "info-icon-aria-label",
|
24167
|
+
"type": {
|
24168
|
+
"text": "string | undefined"
|
24169
|
+
},
|
24170
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
24171
|
+
"fieldName": "infoIconAriaLabel",
|
24172
|
+
"inheritedFrom": {
|
24173
|
+
"name": "FormfieldWrapper",
|
24174
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24175
|
+
}
|
24069
24176
|
}
|
24070
24177
|
],
|
24071
24178
|
"superclass": {
|
24072
|
-
"name": "
|
24073
|
-
"module": "/src/components/
|
24179
|
+
"name": "FormfieldGroup",
|
24180
|
+
"module": "/src/components/formfieldgroup"
|
24074
24181
|
},
|
24075
|
-
"tagName": "mdc-
|
24076
|
-
"jsDoc": "/**\n *
|
24182
|
+
"tagName": "mdc-radiogroup",
|
24183
|
+
"jsDoc": "/**\n * `mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\n * It can have a header text and a description. It enables users to select a single option from a set of options.\n * It is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.\n *\n * @tagname mdc-radiogroup\n *\n * @cssproperty --mdc-radiogroup-description-text-normal - color of the description text\n *\n */",
|
24077
24184
|
"customElement": true,
|
24078
24185
|
"slots": [
|
24079
24186
|
{
|
24080
|
-
"description": "slot
|
24081
|
-
"name": "
|
24187
|
+
"description": "This is a default slot for checkbox or toggle components.",
|
24188
|
+
"name": "default",
|
24082
24189
|
"inheritedFrom": {
|
24083
|
-
"name": "
|
24084
|
-
"module": "src/components/
|
24190
|
+
"name": "FormfieldGroup",
|
24191
|
+
"module": "src/components/formfieldgroup/formfieldgroup.component.ts"
|
24085
24192
|
}
|
24086
24193
|
}
|
24087
24194
|
]
|
@@ -24092,109 +24199,762 @@
|
|
24092
24199
|
"kind": "js",
|
24093
24200
|
"name": "default",
|
24094
24201
|
"declaration": {
|
24095
|
-
"name": "
|
24096
|
-
"module": "components/
|
24202
|
+
"name": "RadioGroup",
|
24203
|
+
"module": "components/radiogroup/radiogroup.component.js"
|
24097
24204
|
}
|
24098
24205
|
}
|
24099
24206
|
]
|
24100
24207
|
},
|
24101
24208
|
{
|
24102
24209
|
"kind": "javascript-module",
|
24103
|
-
"path": "components/
|
24210
|
+
"path": "components/screenreaderannouncer/screenreaderannouncer.component.js",
|
24104
24211
|
"declarations": [
|
24105
24212
|
{
|
24106
24213
|
"kind": "class",
|
24107
|
-
"description": "`mdc-
|
24108
|
-
"name": "
|
24109
|
-
"cssProperties": [
|
24110
|
-
{
|
24111
|
-
"description": "color of the description text",
|
24112
|
-
"name": "--mdc-radiogroup-description-text-normal"
|
24113
|
-
}
|
24114
|
-
],
|
24214
|
+
"description": "`mdc-screenreaderannouncer` can be used to announce messages with the screen reader.\n\nTo make an announcement set `announcement` attribute on the `mdc-screenreaderannouncer` element.\n\n**Internal logic**\n\nWhen the screenreader announcer is connected to the DOM, if the `identity` attribute is not\nprovided, it is set to `mdc-screenreaderannouncer-identity` and a `<div>` element with this id is created\nin the DOM. If the `identity` attribute is provided, the identity element is used and no new element\nis created in the DOM.\n\nWhen the `announcement` attribute is set, the screenreader announcer will create a `<div>` element with\n`aria-live` attribute set to the value of `data-aria-live` attribute and append it to the `identity` element.\nAfter delay of `delay` milliseconds, a <p> element with the announcement text is appended to the `<div>` element.\n\nThe announcement `<div>` element is removed from the DOM after `timeout` milliseconds.\n\nWhen the screen announcer component is disconnected from the DOM, all the timeouts are cleared and\nall the announcement elements added are removed from the DOM and timeouts cleared.\n\n**Note**\n1. The default delay of 150 miliseconds is used as we dynamically generate the\naria-live region in the DOM and add the announcement text to it.\n3. If no `identity` is provided, all the screen reader components will create and use only one\n`<div>` element with id `mdc-screenreaderannouncer-identity` in the DOM.\n\nReference: https://patrickhlauke.github.io/aria/tests/live-regions/",
|
24215
|
+
"name": "ScreenreaderAnnouncer",
|
24115
24216
|
"members": [
|
24116
24217
|
{
|
24117
24218
|
"kind": "field",
|
24118
|
-
"name": "
|
24219
|
+
"name": "announcement",
|
24119
24220
|
"type": {
|
24120
24221
|
"text": "string"
|
24121
24222
|
},
|
24122
24223
|
"default": "''",
|
24123
|
-
"description": "
|
24124
|
-
"attribute": "
|
24224
|
+
"description": "The announcement attribute is a string that is used to announce messages to the screen reader.\nThe announcement is made when the announcement attribute is set to a non-empty string.",
|
24225
|
+
"attribute": "announcement",
|
24226
|
+
"reflects": true
|
24125
24227
|
},
|
24126
24228
|
{
|
24127
24229
|
"kind": "field",
|
24128
|
-
"name": "
|
24230
|
+
"name": "identity",
|
24129
24231
|
"type": {
|
24130
|
-
"text": "string
|
24232
|
+
"text": "string"
|
24131
24233
|
},
|
24132
|
-
"default": "
|
24133
|
-
"description": "
|
24134
|
-
"attribute": "
|
24135
|
-
"reflects": true
|
24136
|
-
"inheritedFrom": {
|
24137
|
-
"name": "DataAriaLabelMixin",
|
24138
|
-
"module": "utils/mixins/DataAriaLabelMixin.js"
|
24139
|
-
}
|
24234
|
+
"default": "''",
|
24235
|
+
"description": "The id of the element in the light dom, to which announcement elements will be appended.\n\nIf id is not provided, it will be set to `mdc-screenreaderannouncer-identity` and\na div element with this id will be created in the light dom.",
|
24236
|
+
"attribute": "identity",
|
24237
|
+
"reflects": true
|
24140
24238
|
},
|
24141
24239
|
{
|
24142
24240
|
"kind": "field",
|
24143
|
-
"name": "
|
24241
|
+
"name": "dataAriaLive",
|
24144
24242
|
"type": {
|
24145
|
-
"text": "
|
24243
|
+
"text": "AriaLive"
|
24146
24244
|
},
|
24147
|
-
"description": "
|
24148
|
-
"default": "
|
24149
|
-
"attribute": "
|
24150
|
-
"reflects": true
|
24151
|
-
"inheritedFrom": {
|
24152
|
-
"name": "FormfieldWrapper",
|
24153
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24154
|
-
}
|
24245
|
+
"description": "Aria live value for announcement.",
|
24246
|
+
"default": "'polite'",
|
24247
|
+
"attribute": "data-aria-live",
|
24248
|
+
"reflects": true
|
24155
24249
|
},
|
24156
24250
|
{
|
24157
24251
|
"kind": "field",
|
24158
|
-
"name": "
|
24252
|
+
"name": "delay",
|
24159
24253
|
"type": {
|
24160
|
-
"text": "
|
24254
|
+
"text": "number"
|
24161
24255
|
},
|
24162
|
-
"description": "
|
24163
|
-
"
|
24164
|
-
"
|
24165
|
-
"
|
24166
|
-
"name": "FormfieldWrapper",
|
24167
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24168
|
-
}
|
24256
|
+
"description": "Milliseconds to wait before adding the announcement to the identiy region in\nDOM, which will announce the message to the screen reader.",
|
24257
|
+
"default": "150",
|
24258
|
+
"attribute": "delay",
|
24259
|
+
"reflects": true
|
24169
24260
|
},
|
24170
24261
|
{
|
24171
24262
|
"kind": "field",
|
24172
|
-
"name": "
|
24263
|
+
"name": "timeout",
|
24173
24264
|
"type": {
|
24174
|
-
"text": "
|
24265
|
+
"text": "number"
|
24175
24266
|
},
|
24176
|
-
"
|
24177
|
-
"
|
24178
|
-
"attribute": "
|
24179
|
-
"reflects": true
|
24180
|
-
"inheritedFrom": {
|
24181
|
-
"name": "FormfieldWrapper",
|
24182
|
-
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24183
|
-
}
|
24267
|
+
"description": "Milliseconds to wait after which the announcement element will be removed from\nidentity region in DOM, causing the screen reader to not announcing the message.",
|
24268
|
+
"default": "20_000",
|
24269
|
+
"attribute": "timeout",
|
24270
|
+
"reflects": true
|
24184
24271
|
},
|
24185
24272
|
{
|
24186
|
-
"kind": "
|
24187
|
-
"name": "
|
24188
|
-
"
|
24189
|
-
|
24190
|
-
|
24191
|
-
|
24192
|
-
|
24193
|
-
|
24194
|
-
|
24195
|
-
|
24196
|
-
|
24197
|
-
|
24273
|
+
"kind": "method",
|
24274
|
+
"name": "announce",
|
24275
|
+
"parameters": [
|
24276
|
+
{
|
24277
|
+
"name": "announcement",
|
24278
|
+
"type": {
|
24279
|
+
"text": "string"
|
24280
|
+
},
|
24281
|
+
"description": "The announcement to be made."
|
24282
|
+
},
|
24283
|
+
{
|
24284
|
+
"name": "delay",
|
24285
|
+
"type": {
|
24286
|
+
"text": "number"
|
24287
|
+
},
|
24288
|
+
"description": "The delay in milliseconds before announcing the message."
|
24289
|
+
},
|
24290
|
+
{
|
24291
|
+
"name": "timeout",
|
24292
|
+
"type": {
|
24293
|
+
"text": "number"
|
24294
|
+
},
|
24295
|
+
"description": "The timeout in milliseconds before removing the announcement."
|
24296
|
+
},
|
24297
|
+
{
|
24298
|
+
"name": "ariaLive",
|
24299
|
+
"type": {
|
24300
|
+
"text": "AriaLive"
|
24301
|
+
},
|
24302
|
+
"description": "The aria live value for the announcement."
|
24303
|
+
}
|
24304
|
+
],
|
24305
|
+
"description": "Announces the given announcement to the screen reader.\n\nA div element with aria-live attribute set to the given ariaLive value is created\nand a p element with the announcement text is appended to it.\n\nThe div element is appended to the element in the DOM identified with id as\nidentity attribute."
|
24306
|
+
},
|
24307
|
+
{
|
24308
|
+
"kind": "method",
|
24309
|
+
"name": "clearTimeOutsAndAnnouncements",
|
24310
|
+
"privacy": "private",
|
24311
|
+
"description": "Clears all timeouts and removes all announcements from the screen reader."
|
24312
|
+
},
|
24313
|
+
{
|
24314
|
+
"kind": "method",
|
24315
|
+
"name": "createAnnouncementAriaLiveRegion",
|
24316
|
+
"privacy": "private",
|
24317
|
+
"description": "Creates a div element with id as identity attribute in the DOM.\n\nIf the identity attribute is not provided, it is set internally to\n`mdc-screenreaderannouncer-identity`."
|
24318
|
+
}
|
24319
|
+
],
|
24320
|
+
"attributes": [
|
24321
|
+
{
|
24322
|
+
"name": "announcement",
|
24323
|
+
"type": {
|
24324
|
+
"text": "string"
|
24325
|
+
},
|
24326
|
+
"default": "''",
|
24327
|
+
"description": "The announcement attribute is a string that is used to announce messages to the screen reader.\nThe announcement is made when the announcement attribute is set to a non-empty string.",
|
24328
|
+
"fieldName": "announcement"
|
24329
|
+
},
|
24330
|
+
{
|
24331
|
+
"name": "identity",
|
24332
|
+
"type": {
|
24333
|
+
"text": "string"
|
24334
|
+
},
|
24335
|
+
"default": "''",
|
24336
|
+
"description": "The id of the element in the light dom, to which announcement elements will be appended.\n\nIf id is not provided, it will be set to `mdc-screenreaderannouncer-identity` and\na div element with this id will be created in the light dom.",
|
24337
|
+
"fieldName": "identity"
|
24338
|
+
},
|
24339
|
+
{
|
24340
|
+
"name": "data-aria-live",
|
24341
|
+
"type": {
|
24342
|
+
"text": "AriaLive"
|
24343
|
+
},
|
24344
|
+
"description": "Aria live value for announcement.",
|
24345
|
+
"default": "'polite'",
|
24346
|
+
"fieldName": "dataAriaLive"
|
24347
|
+
},
|
24348
|
+
{
|
24349
|
+
"name": "delay",
|
24350
|
+
"type": {
|
24351
|
+
"text": "number"
|
24352
|
+
},
|
24353
|
+
"description": "Milliseconds to wait before adding the announcement to the identiy region in\nDOM, which will announce the message to the screen reader.",
|
24354
|
+
"default": "150",
|
24355
|
+
"fieldName": "delay"
|
24356
|
+
},
|
24357
|
+
{
|
24358
|
+
"name": "timeout",
|
24359
|
+
"type": {
|
24360
|
+
"text": "number"
|
24361
|
+
},
|
24362
|
+
"description": "Milliseconds to wait after which the announcement element will be removed from\nidentity region in DOM, causing the screen reader to not announcing the message.",
|
24363
|
+
"default": "20_000",
|
24364
|
+
"fieldName": "timeout"
|
24365
|
+
}
|
24366
|
+
],
|
24367
|
+
"superclass": {
|
24368
|
+
"name": "Component",
|
24369
|
+
"module": "/src/models"
|
24370
|
+
},
|
24371
|
+
"tagName": "mdc-screenreaderannouncer",
|
24372
|
+
"jsDoc": "/**\n * `mdc-screenreaderannouncer` can be used to announce messages with the screen reader.\n *\n * To make an announcement set `announcement` attribute on the `mdc-screenreaderannouncer` element.\n *\n * **Internal logic**\n *\n * When the screenreader announcer is connected to the DOM, if the `identity` attribute is not\n * provided, it is set to `mdc-screenreaderannouncer-identity` and a `<div>` element with this id is created\n * in the DOM. If the `identity` attribute is provided, the identity element is used and no new element\n * is created in the DOM.\n *\n * When the `announcement` attribute is set, the screenreader announcer will create a `<div>` element with\n * `aria-live` attribute set to the value of `data-aria-live` attribute and append it to the `identity` element.\n * After delay of `delay` milliseconds, a <p> element with the announcement text is appended to the `<div>` element.\n *\n * The announcement `<div>` element is removed from the DOM after `timeout` milliseconds.\n *\n * When the screen announcer component is disconnected from the DOM, all the timeouts are cleared and\n * all the announcement elements added are removed from the DOM and timeouts cleared.\n *\n * **Note**\n * 1. The default delay of 150 miliseconds is used as we dynamically generate the\n * aria-live region in the DOM and add the announcement text to it.\n * 3. If no `identity` is provided, all the screen reader components will create and use only one\n * `<div>` element with id `mdc-screenreaderannouncer-identity` in the DOM.\n *\n * Reference: https://patrickhlauke.github.io/aria/tests/live-regions/\n *\n * @tagname mdc-screenreaderannouncer\n */",
|
24373
|
+
"customElement": true
|
24374
|
+
}
|
24375
|
+
],
|
24376
|
+
"exports": [
|
24377
|
+
{
|
24378
|
+
"kind": "js",
|
24379
|
+
"name": "default",
|
24380
|
+
"declaration": {
|
24381
|
+
"name": "ScreenreaderAnnouncer",
|
24382
|
+
"module": "components/screenreaderannouncer/screenreaderannouncer.component.js"
|
24383
|
+
}
|
24384
|
+
}
|
24385
|
+
]
|
24386
|
+
},
|
24387
|
+
{
|
24388
|
+
"kind": "javascript-module",
|
24389
|
+
"path": "components/searchfield/searchfield.component.js",
|
24390
|
+
"declarations": [
|
24391
|
+
{
|
24392
|
+
"kind": "class",
|
24393
|
+
"description": "searchfield component is used as an input field for search functionality.\n\nIt supports `mdc-inputchip` as filters.\n\nThis component is built by extending the `mdc-input` component.",
|
24394
|
+
"name": "Searchfield",
|
24395
|
+
"slots": [
|
24396
|
+
{
|
24397
|
+
"description": "Slot for input chips",
|
24398
|
+
"name": "filters"
|
24399
|
+
}
|
24400
|
+
],
|
24401
|
+
"members": [
|
24402
|
+
{
|
24403
|
+
"kind": "field",
|
24404
|
+
"name": "inputChips",
|
24405
|
+
"type": {
|
24406
|
+
"text": "Array<HTMLElement> | undefined"
|
24407
|
+
}
|
24408
|
+
},
|
24409
|
+
{
|
24410
|
+
"kind": "method",
|
24411
|
+
"name": "handleKeyDown",
|
24412
|
+
"privacy": "protected",
|
24413
|
+
"parameters": [
|
24414
|
+
{
|
24415
|
+
"name": "event",
|
24416
|
+
"type": {
|
24417
|
+
"text": "KeyboardEvent"
|
24418
|
+
},
|
24419
|
+
"description": "Keyboard event"
|
24420
|
+
}
|
24421
|
+
],
|
24422
|
+
"description": "Handles the keydown event of the search field.\nIf the key pressed is 'Enter', it submits the form.\nIf the key pressed is 'Escape', it clears the input text.",
|
24423
|
+
"inheritedFrom": {
|
24424
|
+
"name": "Input",
|
24425
|
+
"module": "components/input/input.component.js"
|
24426
|
+
}
|
24427
|
+
},
|
24428
|
+
{
|
24429
|
+
"kind": "method",
|
24430
|
+
"name": "renderInputChips",
|
24431
|
+
"privacy": "private",
|
24432
|
+
"description": "This method is used to render the input chips inside filters slot.\nIt will remove any elements that are not input chips."
|
24433
|
+
},
|
24434
|
+
{
|
24435
|
+
"kind": "method",
|
24436
|
+
"name": "clearInputText",
|
24437
|
+
"privacy": "protected",
|
24438
|
+
"description": "Clears the input field.",
|
24439
|
+
"inheritedFrom": {
|
24440
|
+
"name": "Input",
|
24441
|
+
"module": "components/input/input.component.js"
|
24442
|
+
}
|
24443
|
+
},
|
24444
|
+
{
|
24445
|
+
"kind": "field",
|
24446
|
+
"name": "name",
|
24447
|
+
"type": {
|
24448
|
+
"text": "string"
|
24449
|
+
},
|
24450
|
+
"default": "''",
|
24451
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
24452
|
+
"attribute": "name",
|
24453
|
+
"reflects": true,
|
24454
|
+
"inheritedFrom": {
|
24455
|
+
"name": "FormInternalsMixin",
|
24456
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24457
|
+
}
|
24458
|
+
},
|
24459
|
+
{
|
24460
|
+
"kind": "field",
|
24461
|
+
"name": "value",
|
24462
|
+
"type": {
|
24463
|
+
"text": "string"
|
24464
|
+
},
|
24465
|
+
"default": "''",
|
24466
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
24467
|
+
"attribute": "value",
|
24468
|
+
"reflects": true,
|
24469
|
+
"inheritedFrom": {
|
24470
|
+
"name": "FormInternalsMixin",
|
24471
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24472
|
+
}
|
24473
|
+
},
|
24474
|
+
{
|
24475
|
+
"kind": "field",
|
24476
|
+
"name": "validationMessage",
|
24477
|
+
"type": {
|
24478
|
+
"text": "string | undefined"
|
24479
|
+
},
|
24480
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
24481
|
+
"attribute": "validation-message",
|
24482
|
+
"reflects": true,
|
24483
|
+
"inheritedFrom": {
|
24484
|
+
"name": "FormInternalsMixin",
|
24485
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24486
|
+
}
|
24487
|
+
},
|
24488
|
+
{
|
24489
|
+
"kind": "field",
|
24490
|
+
"name": "validity",
|
24491
|
+
"type": {
|
24492
|
+
"text": "ValidityState"
|
24493
|
+
},
|
24494
|
+
"readonly": true,
|
24495
|
+
"inheritedFrom": {
|
24496
|
+
"name": "FormInternalsMixin",
|
24497
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24498
|
+
}
|
24499
|
+
},
|
24500
|
+
{
|
24501
|
+
"kind": "field",
|
24502
|
+
"name": "willValidate",
|
24503
|
+
"readonly": true,
|
24504
|
+
"inheritedFrom": {
|
24505
|
+
"name": "FormInternalsMixin",
|
24506
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24507
|
+
}
|
24508
|
+
},
|
24509
|
+
{
|
24510
|
+
"kind": "method",
|
24511
|
+
"name": "setValidity",
|
24512
|
+
"description": "Sets the validity of the input field based on the input field's validity.",
|
24513
|
+
"return": {
|
24514
|
+
"type": {
|
24515
|
+
"text": ""
|
24516
|
+
}
|
24517
|
+
},
|
24518
|
+
"inheritedFrom": {
|
24519
|
+
"name": "FormInternalsMixin",
|
24520
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24521
|
+
}
|
24522
|
+
},
|
24523
|
+
{
|
24524
|
+
"kind": "method",
|
24525
|
+
"name": "checkValidity",
|
24526
|
+
"return": {
|
24527
|
+
"type": {
|
24528
|
+
"text": "boolean"
|
24529
|
+
}
|
24530
|
+
},
|
24531
|
+
"inheritedFrom": {
|
24532
|
+
"name": "FormInternalsMixin",
|
24533
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24534
|
+
}
|
24535
|
+
},
|
24536
|
+
{
|
24537
|
+
"kind": "method",
|
24538
|
+
"name": "reportValidity",
|
24539
|
+
"inheritedFrom": {
|
24540
|
+
"name": "FormInternalsMixin",
|
24541
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
24542
|
+
}
|
24543
|
+
},
|
24544
|
+
{
|
24545
|
+
"kind": "field",
|
24546
|
+
"name": "dataAriaLabel",
|
24547
|
+
"type": {
|
24548
|
+
"text": "string | null"
|
24549
|
+
},
|
24550
|
+
"default": "null",
|
24551
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
24552
|
+
"attribute": "data-aria-label",
|
24553
|
+
"reflects": true,
|
24554
|
+
"inheritedFrom": {
|
24555
|
+
"name": "DataAriaLabelMixin",
|
24556
|
+
"module": "utils/mixins/DataAriaLabelMixin.js"
|
24557
|
+
}
|
24558
|
+
},
|
24559
|
+
{
|
24560
|
+
"kind": "field",
|
24561
|
+
"name": "placeholder",
|
24562
|
+
"type": {
|
24563
|
+
"text": "string"
|
24564
|
+
},
|
24565
|
+
"default": "''",
|
24566
|
+
"description": "The placeholder text that is displayed when the input field is empty.",
|
24567
|
+
"attribute": "placeholder",
|
24568
|
+
"inheritedFrom": {
|
24569
|
+
"name": "Input",
|
24570
|
+
"module": "components/input/input.component.js"
|
24571
|
+
}
|
24572
|
+
},
|
24573
|
+
{
|
24574
|
+
"kind": "field",
|
24575
|
+
"name": "readonly",
|
24576
|
+
"type": {
|
24577
|
+
"text": "boolean"
|
24578
|
+
},
|
24579
|
+
"default": "false",
|
24580
|
+
"description": "readonly attribute of the input field. If true, the input field is read-only.",
|
24581
|
+
"attribute": "readonly",
|
24582
|
+
"inheritedFrom": {
|
24583
|
+
"name": "Input",
|
24584
|
+
"module": "components/input/input.component.js"
|
24585
|
+
}
|
24586
|
+
},
|
24587
|
+
{
|
24588
|
+
"kind": "field",
|
24589
|
+
"name": "prefixText",
|
24590
|
+
"type": {
|
24591
|
+
"text": "string | undefined"
|
24592
|
+
},
|
24593
|
+
"description": "The prefix text that is displayed before the input field. It has a max length of 10 characters.\nWhen the prefix text is set, make sure to set the 'data-aria-label'\nattribute with the appropriate value for accessibility.",
|
24594
|
+
"attribute": "prefix-text",
|
24595
|
+
"inheritedFrom": {
|
24596
|
+
"name": "Input",
|
24597
|
+
"module": "components/input/input.component.js"
|
24598
|
+
}
|
24599
|
+
},
|
24600
|
+
{
|
24601
|
+
"kind": "field",
|
24602
|
+
"name": "leadingIcon",
|
24603
|
+
"type": {
|
24604
|
+
"text": "IconNames | undefined"
|
24605
|
+
},
|
24606
|
+
"description": "The leading icon that is displayed before the input field.",
|
24607
|
+
"attribute": "leading-icon",
|
24608
|
+
"inheritedFrom": {
|
24609
|
+
"name": "Input",
|
24610
|
+
"module": "components/input/input.component.js"
|
24611
|
+
}
|
24612
|
+
},
|
24613
|
+
{
|
24614
|
+
"kind": "field",
|
24615
|
+
"name": "trailingButton",
|
24616
|
+
"type": {
|
24617
|
+
"text": "boolean"
|
24618
|
+
},
|
24619
|
+
"default": "false",
|
24620
|
+
"description": "The trailing button when set to true, shows a clear button that clears the input field.",
|
24621
|
+
"attribute": "trailing-button",
|
24622
|
+
"inheritedFrom": {
|
24623
|
+
"name": "Input",
|
24624
|
+
"module": "components/input/input.component.js"
|
24625
|
+
}
|
24626
|
+
},
|
24627
|
+
{
|
24628
|
+
"kind": "field",
|
24629
|
+
"name": "maxlength",
|
24630
|
+
"type": {
|
24631
|
+
"text": "number | undefined"
|
24632
|
+
},
|
24633
|
+
"description": "The maximum number of characters that the input field can accept.",
|
24634
|
+
"attribute": "maxlength",
|
24635
|
+
"inheritedFrom": {
|
24636
|
+
"name": "Input",
|
24637
|
+
"module": "components/input/input.component.js"
|
24638
|
+
}
|
24639
|
+
},
|
24640
|
+
{
|
24641
|
+
"kind": "field",
|
24642
|
+
"name": "minlength",
|
24643
|
+
"type": {
|
24644
|
+
"text": "number | undefined"
|
24645
|
+
},
|
24646
|
+
"description": "The minimum number of characters that the input field can accept.",
|
24647
|
+
"attribute": "minlength",
|
24648
|
+
"inheritedFrom": {
|
24649
|
+
"name": "Input",
|
24650
|
+
"module": "components/input/input.component.js"
|
24651
|
+
}
|
24652
|
+
},
|
24653
|
+
{
|
24654
|
+
"kind": "field",
|
24655
|
+
"name": "autocapitalize",
|
24656
|
+
"type": {
|
24657
|
+
"text": "AutoCapitalizeType"
|
24658
|
+
},
|
24659
|
+
"description": "The autocapitalize attribute of the input field.",
|
24660
|
+
"default": "'off'",
|
24661
|
+
"attribute": "autocapitalize",
|
24662
|
+
"inheritedFrom": {
|
24663
|
+
"name": "Input",
|
24664
|
+
"module": "components/input/input.component.js"
|
24665
|
+
}
|
24666
|
+
},
|
24667
|
+
{
|
24668
|
+
"kind": "field",
|
24669
|
+
"name": "autocomplete",
|
24670
|
+
"type": {
|
24671
|
+
"text": "AutoCompleteType"
|
24672
|
+
},
|
24673
|
+
"description": "The autocomplete attribute of the input field.",
|
24674
|
+
"default": "'off'",
|
24675
|
+
"attribute": "autocomplete",
|
24676
|
+
"inheritedFrom": {
|
24677
|
+
"name": "Input",
|
24678
|
+
"module": "components/input/input.component.js"
|
24679
|
+
}
|
24680
|
+
},
|
24681
|
+
{
|
24682
|
+
"kind": "field",
|
24683
|
+
"name": "autofocus",
|
24684
|
+
"type": {
|
24685
|
+
"text": "boolean"
|
24686
|
+
},
|
24687
|
+
"default": "false",
|
24688
|
+
"description": "If true, the input field is focused when the component is rendered.",
|
24689
|
+
"attribute": "autofocus",
|
24690
|
+
"inheritedFrom": {
|
24691
|
+
"name": "Input",
|
24692
|
+
"module": "components/input/input.component.js"
|
24693
|
+
}
|
24694
|
+
},
|
24695
|
+
{
|
24696
|
+
"kind": "field",
|
24697
|
+
"name": "dirname",
|
24698
|
+
"type": {
|
24699
|
+
"text": "string | undefined"
|
24700
|
+
},
|
24701
|
+
"description": "Specifies the name of the directionality of text for submission purposes (e.g., \"rtl\" for right-to-left).",
|
24702
|
+
"attribute": "dirname",
|
24703
|
+
"inheritedFrom": {
|
24704
|
+
"name": "Input",
|
24705
|
+
"module": "components/input/input.component.js"
|
24706
|
+
}
|
24707
|
+
},
|
24708
|
+
{
|
24709
|
+
"kind": "field",
|
24710
|
+
"name": "pattern",
|
24711
|
+
"type": {
|
24712
|
+
"text": "string | undefined"
|
24713
|
+
},
|
24714
|
+
"description": "The pattern attribute of the input field.\nSpecifies a regular expression that the input value must match for validation purposes.",
|
24715
|
+
"attribute": "pattern",
|
24716
|
+
"inheritedFrom": {
|
24717
|
+
"name": "Input",
|
24718
|
+
"module": "components/input/input.component.js"
|
24719
|
+
}
|
24720
|
+
},
|
24721
|
+
{
|
24722
|
+
"kind": "field",
|
24723
|
+
"name": "list",
|
24724
|
+
"type": {
|
24725
|
+
"text": "string | undefined"
|
24726
|
+
},
|
24727
|
+
"description": "The list attribute of the input field.\nIdentifies a list of pre-defined options to suggest to the user.",
|
24728
|
+
"attribute": "list",
|
24729
|
+
"inheritedFrom": {
|
24730
|
+
"name": "Input",
|
24731
|
+
"module": "components/input/input.component.js"
|
24732
|
+
}
|
24733
|
+
},
|
24734
|
+
{
|
24735
|
+
"kind": "field",
|
24736
|
+
"name": "size",
|
24737
|
+
"type": {
|
24738
|
+
"text": "number | undefined | undefined"
|
24739
|
+
},
|
24740
|
+
"description": "The size attribute of the input field.\nSpecifies the width of the input field.",
|
24741
|
+
"default": "undefined",
|
24742
|
+
"attribute": "size",
|
24743
|
+
"inheritedFrom": {
|
24744
|
+
"name": "Input",
|
24745
|
+
"module": "components/input/input.component.js"
|
24746
|
+
}
|
24747
|
+
},
|
24748
|
+
{
|
24749
|
+
"kind": "field",
|
24750
|
+
"name": "clearAriaLabel",
|
24751
|
+
"type": {
|
24752
|
+
"text": "string"
|
24753
|
+
},
|
24754
|
+
"default": "''",
|
24755
|
+
"description": "Aria label for the trailing button. If trailing button is set to true, this label is used for the clear button.",
|
24756
|
+
"attribute": "clear-aria-label",
|
24757
|
+
"inheritedFrom": {
|
24758
|
+
"name": "Input",
|
24759
|
+
"module": "components/input/input.component.js"
|
24760
|
+
}
|
24761
|
+
},
|
24762
|
+
{
|
24763
|
+
"kind": "method",
|
24764
|
+
"name": "handleValueChange",
|
24765
|
+
"description": "Handles the value change of the input field.\nSets the form value and updates the validity of the input field.",
|
24766
|
+
"return": {
|
24767
|
+
"type": {
|
24768
|
+
"text": ""
|
24769
|
+
}
|
24770
|
+
},
|
24771
|
+
"inheritedFrom": {
|
24772
|
+
"name": "Input",
|
24773
|
+
"module": "components/input/input.component.js"
|
24774
|
+
}
|
24775
|
+
},
|
24776
|
+
{
|
24777
|
+
"kind": "method",
|
24778
|
+
"name": "setInputValidity",
|
24779
|
+
"privacy": "private",
|
24780
|
+
"inheritedFrom": {
|
24781
|
+
"name": "Input",
|
24782
|
+
"module": "components/input/input.component.js"
|
24783
|
+
}
|
24784
|
+
},
|
24785
|
+
{
|
24786
|
+
"kind": "method",
|
24787
|
+
"name": "updateValue",
|
24788
|
+
"privacy": "private",
|
24789
|
+
"description": "Updates the value of the input field.\nSets the form value.",
|
24790
|
+
"return": {
|
24791
|
+
"type": {
|
24792
|
+
"text": ""
|
24793
|
+
}
|
24794
|
+
},
|
24795
|
+
"inheritedFrom": {
|
24796
|
+
"name": "Input",
|
24797
|
+
"module": "components/input/input.component.js"
|
24798
|
+
}
|
24799
|
+
},
|
24800
|
+
{
|
24801
|
+
"kind": "method",
|
24802
|
+
"name": "onInput",
|
24803
|
+
"privacy": "private",
|
24804
|
+
"description": "Handles the input event of the input field.\nUpdates the value and sets the validity of the input field.",
|
24805
|
+
"inheritedFrom": {
|
24806
|
+
"name": "Input",
|
24807
|
+
"module": "components/input/input.component.js"
|
24808
|
+
}
|
24809
|
+
},
|
24810
|
+
{
|
24811
|
+
"kind": "method",
|
24812
|
+
"name": "onChange",
|
24813
|
+
"privacy": "private",
|
24814
|
+
"parameters": [
|
24815
|
+
{
|
24816
|
+
"name": "event",
|
24817
|
+
"type": {
|
24818
|
+
"text": "Event"
|
24819
|
+
},
|
24820
|
+
"description": "Event which contains information about the value change."
|
24821
|
+
}
|
24822
|
+
],
|
24823
|
+
"description": "Handles the change event of the input field.\nUpdates the value and sets the validity of the input field.\n\nThe 'change' event does not bubble up through the shadow DOM as it was not composed.\nTherefore, we need to re-dispatch the same event to ensure it is propagated correctly.\nRead more: https://developer.mozilla.org/en-US/docs/Web/API/Event/composed",
|
24824
|
+
"inheritedFrom": {
|
24825
|
+
"name": "Input",
|
24826
|
+
"module": "components/input/input.component.js"
|
24827
|
+
}
|
24828
|
+
},
|
24829
|
+
{
|
24830
|
+
"kind": "method",
|
24831
|
+
"name": "renderLeadingIcon",
|
24832
|
+
"privacy": "protected",
|
24833
|
+
"description": "Renders the leading icon before the input field.\nIf the leading icon is not set, it will not be displayed.",
|
24834
|
+
"return": {
|
24835
|
+
"type": {
|
24836
|
+
"text": ""
|
24837
|
+
}
|
24838
|
+
},
|
24839
|
+
"inheritedFrom": {
|
24840
|
+
"name": "Input",
|
24841
|
+
"module": "components/input/input.component.js"
|
24842
|
+
}
|
24843
|
+
},
|
24844
|
+
{
|
24845
|
+
"kind": "method",
|
24846
|
+
"name": "renderPrefixText",
|
24847
|
+
"privacy": "protected",
|
24848
|
+
"description": "Renders the prefix text before the input field.\nIf the prefix text is more than 10 characters,\n- it will not be displayed.\n- the validation messsage will be displayed.\n\n Note: We are setting aria-hidden so that the screen reader does not read the prefix text.\n The consumers should set the appropriate aria-label for the input field using 'data-aria-label' attribute.",
|
24849
|
+
"return": {
|
24850
|
+
"type": {
|
24851
|
+
"text": ""
|
24852
|
+
}
|
24853
|
+
},
|
24854
|
+
"inheritedFrom": {
|
24855
|
+
"name": "Input",
|
24856
|
+
"module": "components/input/input.component.js"
|
24857
|
+
}
|
24858
|
+
},
|
24859
|
+
{
|
24860
|
+
"kind": "method",
|
24861
|
+
"name": "renderTrailingButton",
|
24862
|
+
"privacy": "protected",
|
24863
|
+
"parameters": [
|
24864
|
+
{
|
24865
|
+
"name": "show",
|
24866
|
+
"default": "false"
|
24867
|
+
}
|
24868
|
+
],
|
24869
|
+
"description": "Renders the trailing button to clear the input field if the trailingButton is set to true.",
|
24870
|
+
"return": {
|
24871
|
+
"type": {
|
24872
|
+
"text": ""
|
24873
|
+
}
|
24874
|
+
},
|
24875
|
+
"inheritedFrom": {
|
24876
|
+
"name": "Input",
|
24877
|
+
"module": "components/input/input.component.js"
|
24878
|
+
}
|
24879
|
+
},
|
24880
|
+
{
|
24881
|
+
"kind": "method",
|
24882
|
+
"name": "renderInputElement",
|
24883
|
+
"privacy": "protected",
|
24884
|
+
"parameters": [
|
24885
|
+
{
|
24886
|
+
"name": "type",
|
24887
|
+
"type": {
|
24888
|
+
"text": "InputType"
|
24889
|
+
}
|
24890
|
+
},
|
24891
|
+
{
|
24892
|
+
"name": "hidePlaceholder",
|
24893
|
+
"default": "false"
|
24894
|
+
}
|
24895
|
+
],
|
24896
|
+
"inheritedFrom": {
|
24897
|
+
"name": "Input",
|
24898
|
+
"module": "components/input/input.component.js"
|
24899
|
+
}
|
24900
|
+
},
|
24901
|
+
{
|
24902
|
+
"kind": "field",
|
24903
|
+
"name": "disabled",
|
24904
|
+
"type": {
|
24905
|
+
"text": "boolean | undefined"
|
24906
|
+
},
|
24907
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
24908
|
+
"default": "undefined",
|
24909
|
+
"attribute": "disabled",
|
24910
|
+
"reflects": true,
|
24911
|
+
"inheritedFrom": {
|
24912
|
+
"name": "FormfieldWrapper",
|
24913
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24914
|
+
}
|
24915
|
+
},
|
24916
|
+
{
|
24917
|
+
"kind": "field",
|
24918
|
+
"name": "label",
|
24919
|
+
"type": {
|
24920
|
+
"text": "string | undefined"
|
24921
|
+
},
|
24922
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
24923
|
+
"attribute": "label",
|
24924
|
+
"reflects": true,
|
24925
|
+
"inheritedFrom": {
|
24926
|
+
"name": "FormfieldWrapper",
|
24927
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24928
|
+
}
|
24929
|
+
},
|
24930
|
+
{
|
24931
|
+
"kind": "field",
|
24932
|
+
"name": "required",
|
24933
|
+
"type": {
|
24934
|
+
"text": "boolean"
|
24935
|
+
},
|
24936
|
+
"default": "false",
|
24937
|
+
"description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
|
24938
|
+
"attribute": "required",
|
24939
|
+
"reflects": true,
|
24940
|
+
"inheritedFrom": {
|
24941
|
+
"name": "FormfieldWrapper",
|
24942
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24943
|
+
}
|
24944
|
+
},
|
24945
|
+
{
|
24946
|
+
"kind": "field",
|
24947
|
+
"name": "id",
|
24948
|
+
"type": {
|
24949
|
+
"text": "string"
|
24950
|
+
},
|
24951
|
+
"default": "''",
|
24952
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
24953
|
+
"attribute": "id",
|
24954
|
+
"inheritedFrom": {
|
24955
|
+
"name": "FormfieldWrapper",
|
24956
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24957
|
+
}
|
24198
24958
|
},
|
24199
24959
|
{
|
24200
24960
|
"kind": "field",
|
@@ -24224,6 +24984,49 @@
|
|
24224
24984
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24225
24985
|
}
|
24226
24986
|
},
|
24987
|
+
{
|
24988
|
+
"kind": "field",
|
24989
|
+
"name": "toggletipText",
|
24990
|
+
"type": {
|
24991
|
+
"text": "string | undefined"
|
24992
|
+
},
|
24993
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
24994
|
+
"attribute": "toggletip-text",
|
24995
|
+
"reflects": true,
|
24996
|
+
"inheritedFrom": {
|
24997
|
+
"name": "FormfieldWrapper",
|
24998
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
24999
|
+
}
|
25000
|
+
},
|
25001
|
+
{
|
25002
|
+
"kind": "field",
|
25003
|
+
"name": "toggletipPlacement",
|
25004
|
+
"type": {
|
25005
|
+
"text": "PopoverPlacement"
|
25006
|
+
},
|
25007
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
25008
|
+
"default": "'top'",
|
25009
|
+
"attribute": "toggletip-placement",
|
25010
|
+
"reflects": true,
|
25011
|
+
"inheritedFrom": {
|
25012
|
+
"name": "FormfieldWrapper",
|
25013
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
25014
|
+
}
|
25015
|
+
},
|
25016
|
+
{
|
25017
|
+
"kind": "field",
|
25018
|
+
"name": "infoIconAriaLabel",
|
25019
|
+
"type": {
|
25020
|
+
"text": "string | undefined"
|
25021
|
+
},
|
25022
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
25023
|
+
"attribute": "info-icon-aria-label",
|
25024
|
+
"reflects": true,
|
25025
|
+
"inheritedFrom": {
|
25026
|
+
"name": "FormfieldWrapper",
|
25027
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
25028
|
+
}
|
25029
|
+
},
|
24227
25030
|
{
|
24228
25031
|
"kind": "method",
|
24229
25032
|
"name": "renderLabelElement",
|
@@ -24300,6 +25103,13 @@
|
|
24300
25103
|
}
|
24301
25104
|
}
|
24302
25105
|
],
|
25106
|
+
"superclass": {
|
25107
|
+
"name": "Input",
|
25108
|
+
"module": "/src/components/input/input.component"
|
25109
|
+
},
|
25110
|
+
"tagName": "mdc-searchfield",
|
25111
|
+
"jsDoc": "/**\n * searchfield component is used as an input field for search functionality.\n *\n * It supports `mdc-inputchip` as filters.\n *\n * This component is built by extending the `mdc-input` component.\n *\n * @tagname mdc-searchfield\n *\n * @slot filters - Slot for input chips\n *\n */",
|
25112
|
+
"customElement": true,
|
24303
25113
|
"attributes": [
|
24304
25114
|
{
|
24305
25115
|
"name": "name",
|
@@ -24307,8 +25117,37 @@
|
|
24307
25117
|
"text": "string"
|
24308
25118
|
},
|
24309
25119
|
"default": "''",
|
24310
|
-
"description": "
|
24311
|
-
"fieldName": "name"
|
25120
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
25121
|
+
"fieldName": "name",
|
25122
|
+
"inheritedFrom": {
|
25123
|
+
"name": "FormInternalsMixin",
|
25124
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25125
|
+
}
|
25126
|
+
},
|
25127
|
+
{
|
25128
|
+
"name": "value",
|
25129
|
+
"type": {
|
25130
|
+
"text": "string"
|
25131
|
+
},
|
25132
|
+
"default": "''",
|
25133
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
25134
|
+
"fieldName": "value",
|
25135
|
+
"inheritedFrom": {
|
25136
|
+
"name": "FormInternalsMixin",
|
25137
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25138
|
+
}
|
25139
|
+
},
|
25140
|
+
{
|
25141
|
+
"name": "validation-message",
|
25142
|
+
"type": {
|
25143
|
+
"text": "string | undefined"
|
25144
|
+
},
|
25145
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
25146
|
+
"fieldName": "validationMessage",
|
25147
|
+
"inheritedFrom": {
|
25148
|
+
"name": "FormInternalsMixin",
|
25149
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25150
|
+
}
|
24312
25151
|
},
|
24313
25152
|
{
|
24314
25153
|
"name": "data-aria-label",
|
@@ -24324,818 +25163,826 @@
|
|
24324
25163
|
}
|
24325
25164
|
},
|
24326
25165
|
{
|
24327
|
-
"name": "
|
25166
|
+
"name": "placeholder",
|
24328
25167
|
"type": {
|
24329
|
-
"text": "
|
25168
|
+
"text": "string"
|
24330
25169
|
},
|
24331
|
-
"
|
24332
|
-
"
|
24333
|
-
"fieldName": "
|
25170
|
+
"default": "''",
|
25171
|
+
"description": "The placeholder text that is displayed when the input field is empty.",
|
25172
|
+
"fieldName": "placeholder",
|
24334
25173
|
"inheritedFrom": {
|
24335
|
-
"name": "
|
24336
|
-
"module": "src/components/
|
25174
|
+
"name": "Input",
|
25175
|
+
"module": "src/components/input/input.component.ts"
|
24337
25176
|
}
|
24338
25177
|
},
|
24339
25178
|
{
|
24340
|
-
"name": "
|
25179
|
+
"name": "readonly",
|
24341
25180
|
"type": {
|
24342
|
-
"text": "
|
25181
|
+
"text": "boolean"
|
24343
25182
|
},
|
24344
|
-
"
|
24345
|
-
"
|
25183
|
+
"default": "false",
|
25184
|
+
"description": "readonly attribute of the input field. If true, the input field is read-only.",
|
25185
|
+
"fieldName": "readonly",
|
24346
25186
|
"inheritedFrom": {
|
24347
|
-
"name": "
|
24348
|
-
"module": "src/components/
|
25187
|
+
"name": "Input",
|
25188
|
+
"module": "src/components/input/input.component.ts"
|
24349
25189
|
}
|
24350
25190
|
},
|
24351
25191
|
{
|
24352
|
-
"name": "
|
25192
|
+
"name": "prefix-text",
|
24353
25193
|
"type": {
|
24354
|
-
"text": "
|
25194
|
+
"text": "string | undefined"
|
24355
25195
|
},
|
24356
|
-
"
|
24357
|
-
"
|
24358
|
-
"fieldName": "required",
|
25196
|
+
"description": "The prefix text that is displayed before the input field. It has a max length of 10 characters.\nWhen the prefix text is set, make sure to set the 'data-aria-label'\nattribute with the appropriate value for accessibility.",
|
25197
|
+
"fieldName": "prefixText",
|
24359
25198
|
"inheritedFrom": {
|
24360
|
-
"name": "
|
24361
|
-
"module": "src/components/
|
25199
|
+
"name": "Input",
|
25200
|
+
"module": "src/components/input/input.component.ts"
|
24362
25201
|
}
|
24363
25202
|
},
|
24364
25203
|
{
|
24365
|
-
"name": "
|
25204
|
+
"name": "leading-icon",
|
24366
25205
|
"type": {
|
24367
|
-
"text": "
|
25206
|
+
"text": "IconNames | undefined"
|
24368
25207
|
},
|
24369
|
-
"
|
24370
|
-
"
|
24371
|
-
"fieldName": "id",
|
25208
|
+
"description": "The leading icon that is displayed before the input field.",
|
25209
|
+
"fieldName": "leadingIcon",
|
24372
25210
|
"inheritedFrom": {
|
24373
|
-
"name": "
|
24374
|
-
"module": "src/components/
|
25211
|
+
"name": "Input",
|
25212
|
+
"module": "src/components/input/input.component.ts"
|
24375
25213
|
}
|
24376
25214
|
},
|
24377
25215
|
{
|
24378
|
-
"name": "
|
25216
|
+
"name": "trailing-button",
|
24379
25217
|
"type": {
|
24380
|
-
"text": "
|
25218
|
+
"text": "boolean"
|
24381
25219
|
},
|
24382
|
-
"
|
24383
|
-
"
|
25220
|
+
"default": "false",
|
25221
|
+
"description": "The trailing button when set to true, shows a clear button that clears the input field.",
|
25222
|
+
"fieldName": "trailingButton",
|
24384
25223
|
"inheritedFrom": {
|
24385
|
-
"name": "
|
24386
|
-
"module": "src/components/
|
25224
|
+
"name": "Input",
|
25225
|
+
"module": "src/components/input/input.component.ts"
|
24387
25226
|
}
|
24388
25227
|
},
|
24389
25228
|
{
|
24390
|
-
"name": "
|
25229
|
+
"name": "maxlength",
|
24391
25230
|
"type": {
|
24392
|
-
"text": "
|
25231
|
+
"text": "number | undefined"
|
24393
25232
|
},
|
24394
|
-
"description": "The
|
24395
|
-
"fieldName": "
|
24396
|
-
"inheritedFrom": {
|
24397
|
-
"name": "FormfieldWrapper",
|
24398
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24399
|
-
}
|
24400
|
-
}
|
24401
|
-
],
|
24402
|
-
"superclass": {
|
24403
|
-
"name": "FormfieldGroup",
|
24404
|
-
"module": "/src/components/formfieldgroup"
|
24405
|
-
},
|
24406
|
-
"tagName": "mdc-radiogroup",
|
24407
|
-
"jsDoc": "/**\n * `mdc-radiogroup` - This is the wrapper component for radio buttons which are grouped together.\n * It can have a header text and a description. It enables users to select a single option from a set of options.\n * It is often used in forms, settings, and selection in lists. It automatically group the radio buttons inside it.\n *\n * @tagname mdc-radiogroup\n *\n * @cssproperty --mdc-radiogroup-description-text-normal - color of the description text\n *\n */",
|
24408
|
-
"customElement": true,
|
24409
|
-
"slots": [
|
24410
|
-
{
|
24411
|
-
"description": "This is a default slot for checkbox or toggle components.",
|
24412
|
-
"name": "default",
|
25233
|
+
"description": "The maximum number of characters that the input field can accept.",
|
25234
|
+
"fieldName": "maxlength",
|
24413
25235
|
"inheritedFrom": {
|
24414
|
-
"name": "
|
24415
|
-
"module": "src/components/
|
25236
|
+
"name": "Input",
|
25237
|
+
"module": "src/components/input/input.component.ts"
|
24416
25238
|
}
|
24417
25239
|
},
|
24418
25240
|
{
|
24419
|
-
"
|
24420
|
-
"
|
25241
|
+
"name": "minlength",
|
25242
|
+
"type": {
|
25243
|
+
"text": "number | undefined"
|
25244
|
+
},
|
25245
|
+
"description": "The minimum number of characters that the input field can accept.",
|
25246
|
+
"fieldName": "minlength",
|
24421
25247
|
"inheritedFrom": {
|
24422
|
-
"name": "
|
24423
|
-
"module": "src/components/
|
25248
|
+
"name": "Input",
|
25249
|
+
"module": "src/components/input/input.component.ts"
|
24424
25250
|
}
|
24425
|
-
}
|
24426
|
-
]
|
24427
|
-
}
|
24428
|
-
],
|
24429
|
-
"exports": [
|
24430
|
-
{
|
24431
|
-
"kind": "js",
|
24432
|
-
"name": "default",
|
24433
|
-
"declaration": {
|
24434
|
-
"name": "RadioGroup",
|
24435
|
-
"module": "components/radiogroup/radiogroup.component.js"
|
24436
|
-
}
|
24437
|
-
}
|
24438
|
-
]
|
24439
|
-
},
|
24440
|
-
{
|
24441
|
-
"kind": "javascript-module",
|
24442
|
-
"path": "components/screenreaderannouncer/screenreaderannouncer.component.js",
|
24443
|
-
"declarations": [
|
24444
|
-
{
|
24445
|
-
"kind": "class",
|
24446
|
-
"description": "`mdc-screenreaderannouncer` can be used to announce messages with the screen reader.\n\nTo make an announcement set `announcement` attribute on the `mdc-screenreaderannouncer` element.\n\n**Internal logic**\n\nWhen the screenreader announcer is connected to the DOM, if the `identity` attribute is not\nprovided, it is set to `mdc-screenreaderannouncer-identity` and a `<div>` element with this id is created\nin the DOM. If the `identity` attribute is provided, the identity element is used and no new element\nis created in the DOM.\n\nWhen the `announcement` attribute is set, the screenreader announcer will create a `<div>` element with\n`aria-live` attribute set to the value of `data-aria-live` attribute and append it to the `identity` element.\nAfter delay of `delay` milliseconds, a <p> element with the announcement text is appended to the `<div>` element.\n\nThe announcement `<div>` element is removed from the DOM after `timeout` milliseconds.\n\nWhen the screen announcer component is disconnected from the DOM, all the timeouts are cleared and\nall the announcement elements added are removed from the DOM and timeouts cleared.\n\n**Note**\n1. The default delay of 150 miliseconds is used as we dynamically generate the\naria-live region in the DOM and add the announcement text to it.\n3. If no `identity` is provided, all the screen reader components will create and use only one\n`<div>` element with id `mdc-screenreaderannouncer-identity` in the DOM.\n\nReference: https://patrickhlauke.github.io/aria/tests/live-regions/",
|
24447
|
-
"name": "ScreenreaderAnnouncer",
|
24448
|
-
"members": [
|
25251
|
+
},
|
24449
25252
|
{
|
24450
|
-
"
|
24451
|
-
"name": "announcement",
|
25253
|
+
"name": "autocapitalize",
|
24452
25254
|
"type": {
|
24453
|
-
"text": "
|
25255
|
+
"text": "AutoCapitalizeType"
|
24454
25256
|
},
|
24455
|
-
"
|
24456
|
-
"
|
24457
|
-
"
|
24458
|
-
"
|
25257
|
+
"description": "The autocapitalize attribute of the input field.",
|
25258
|
+
"default": "'off'",
|
25259
|
+
"fieldName": "autocapitalize",
|
25260
|
+
"inheritedFrom": {
|
25261
|
+
"name": "Input",
|
25262
|
+
"module": "src/components/input/input.component.ts"
|
25263
|
+
}
|
24459
25264
|
},
|
24460
25265
|
{
|
24461
|
-
"
|
24462
|
-
"name": "identity",
|
25266
|
+
"name": "autocomplete",
|
24463
25267
|
"type": {
|
24464
|
-
"text": "
|
25268
|
+
"text": "AutoCompleteType"
|
24465
25269
|
},
|
24466
|
-
"
|
24467
|
-
"
|
24468
|
-
"
|
24469
|
-
"
|
25270
|
+
"description": "The autocomplete attribute of the input field.",
|
25271
|
+
"default": "'off'",
|
25272
|
+
"fieldName": "autocomplete",
|
25273
|
+
"inheritedFrom": {
|
25274
|
+
"name": "Input",
|
25275
|
+
"module": "src/components/input/input.component.ts"
|
25276
|
+
}
|
24470
25277
|
},
|
24471
25278
|
{
|
24472
|
-
"
|
24473
|
-
"name": "dataAriaLive",
|
25279
|
+
"name": "autofocus",
|
24474
25280
|
"type": {
|
24475
|
-
"text": "
|
25281
|
+
"text": "boolean"
|
24476
25282
|
},
|
24477
|
-
"
|
24478
|
-
"
|
24479
|
-
"
|
24480
|
-
"
|
25283
|
+
"default": "false",
|
25284
|
+
"description": "If true, the input field is focused when the component is rendered.",
|
25285
|
+
"fieldName": "autofocus",
|
25286
|
+
"inheritedFrom": {
|
25287
|
+
"name": "Input",
|
25288
|
+
"module": "src/components/input/input.component.ts"
|
25289
|
+
}
|
24481
25290
|
},
|
24482
25291
|
{
|
24483
|
-
"
|
24484
|
-
"name": "delay",
|
25292
|
+
"name": "dirname",
|
24485
25293
|
"type": {
|
24486
|
-
"text": "
|
25294
|
+
"text": "string | undefined"
|
24487
25295
|
},
|
24488
|
-
"description": "
|
24489
|
-
"
|
24490
|
-
"
|
24491
|
-
|
25296
|
+
"description": "Specifies the name of the directionality of text for submission purposes (e.g., \"rtl\" for right-to-left).",
|
25297
|
+
"fieldName": "dirname",
|
25298
|
+
"inheritedFrom": {
|
25299
|
+
"name": "Input",
|
25300
|
+
"module": "src/components/input/input.component.ts"
|
25301
|
+
}
|
24492
25302
|
},
|
24493
25303
|
{
|
24494
|
-
"
|
24495
|
-
"name": "timeout",
|
25304
|
+
"name": "pattern",
|
24496
25305
|
"type": {
|
24497
|
-
"text": "
|
25306
|
+
"text": "string | undefined"
|
24498
25307
|
},
|
24499
|
-
"description": "
|
24500
|
-
"
|
24501
|
-
"
|
24502
|
-
|
24503
|
-
|
24504
|
-
|
24505
|
-
"kind": "method",
|
24506
|
-
"name": "announce",
|
24507
|
-
"parameters": [
|
24508
|
-
{
|
24509
|
-
"name": "announcement",
|
24510
|
-
"type": {
|
24511
|
-
"text": "string"
|
24512
|
-
},
|
24513
|
-
"description": "The announcement to be made."
|
24514
|
-
},
|
24515
|
-
{
|
24516
|
-
"name": "delay",
|
24517
|
-
"type": {
|
24518
|
-
"text": "number"
|
24519
|
-
},
|
24520
|
-
"description": "The delay in milliseconds before announcing the message."
|
24521
|
-
},
|
24522
|
-
{
|
24523
|
-
"name": "timeout",
|
24524
|
-
"type": {
|
24525
|
-
"text": "number"
|
24526
|
-
},
|
24527
|
-
"description": "The timeout in milliseconds before removing the announcement."
|
24528
|
-
},
|
24529
|
-
{
|
24530
|
-
"name": "ariaLive",
|
24531
|
-
"type": {
|
24532
|
-
"text": "AriaLive"
|
24533
|
-
},
|
24534
|
-
"description": "The aria live value for the announcement."
|
24535
|
-
}
|
24536
|
-
],
|
24537
|
-
"description": "Announces the given announcement to the screen reader.\n\nA div element with aria-live attribute set to the given ariaLive value is created\nand a p element with the announcement text is appended to it.\n\nThe div element is appended to the element in the DOM identified with id as\nidentity attribute."
|
25308
|
+
"description": "The pattern attribute of the input field.\nSpecifies a regular expression that the input value must match for validation purposes.",
|
25309
|
+
"fieldName": "pattern",
|
25310
|
+
"inheritedFrom": {
|
25311
|
+
"name": "Input",
|
25312
|
+
"module": "src/components/input/input.component.ts"
|
25313
|
+
}
|
24538
25314
|
},
|
24539
25315
|
{
|
24540
|
-
"
|
24541
|
-
"
|
24542
|
-
|
24543
|
-
|
25316
|
+
"name": "list",
|
25317
|
+
"type": {
|
25318
|
+
"text": "string | undefined"
|
25319
|
+
},
|
25320
|
+
"description": "The list attribute of the input field.\nIdentifies a list of pre-defined options to suggest to the user.",
|
25321
|
+
"fieldName": "list",
|
25322
|
+
"inheritedFrom": {
|
25323
|
+
"name": "Input",
|
25324
|
+
"module": "src/components/input/input.component.ts"
|
25325
|
+
}
|
24544
25326
|
},
|
24545
25327
|
{
|
24546
|
-
"
|
24547
|
-
"name": "createAnnouncementAriaLiveRegion",
|
24548
|
-
"privacy": "private",
|
24549
|
-
"description": "Creates a div element with id as identity attribute in the DOM.\n\nIf the identity attribute is not provided, it is set internally to\n`mdc-screenreaderannouncer-identity`."
|
24550
|
-
}
|
24551
|
-
],
|
24552
|
-
"attributes": [
|
24553
|
-
{
|
24554
|
-
"name": "announcement",
|
25328
|
+
"name": "size",
|
24555
25329
|
"type": {
|
24556
|
-
"text": "
|
25330
|
+
"text": "number | undefined | undefined"
|
24557
25331
|
},
|
24558
|
-
"
|
24559
|
-
"
|
24560
|
-
"fieldName": "
|
25332
|
+
"description": "The size attribute of the input field.\nSpecifies the width of the input field.",
|
25333
|
+
"default": "undefined",
|
25334
|
+
"fieldName": "size",
|
25335
|
+
"inheritedFrom": {
|
25336
|
+
"name": "Input",
|
25337
|
+
"module": "src/components/input/input.component.ts"
|
25338
|
+
}
|
24561
25339
|
},
|
24562
25340
|
{
|
24563
|
-
"name": "
|
25341
|
+
"name": "clear-aria-label",
|
24564
25342
|
"type": {
|
24565
25343
|
"text": "string"
|
24566
25344
|
},
|
24567
25345
|
"default": "''",
|
24568
|
-
"description": "
|
24569
|
-
"fieldName": "
|
25346
|
+
"description": "Aria label for the trailing button. If trailing button is set to true, this label is used for the clear button.",
|
25347
|
+
"fieldName": "clearAriaLabel",
|
25348
|
+
"inheritedFrom": {
|
25349
|
+
"name": "Input",
|
25350
|
+
"module": "src/components/input/input.component.ts"
|
25351
|
+
}
|
24570
25352
|
},
|
24571
25353
|
{
|
24572
|
-
"name": "
|
25354
|
+
"name": "disabled",
|
24573
25355
|
"type": {
|
24574
|
-
"text": "
|
25356
|
+
"text": "boolean | undefined"
|
24575
25357
|
},
|
24576
|
-
"description": "
|
24577
|
-
"default": "
|
24578
|
-
"fieldName": "
|
25358
|
+
"description": "Indicates whether the component is disabled.\nWhen the component is disabled for user interaction; it is not focusable or clickable.",
|
25359
|
+
"default": "undefined",
|
25360
|
+
"fieldName": "disabled",
|
25361
|
+
"inheritedFrom": {
|
25362
|
+
"name": "FormfieldWrapper",
|
25363
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25364
|
+
}
|
24579
25365
|
},
|
24580
25366
|
{
|
24581
|
-
"name": "
|
25367
|
+
"name": "label",
|
24582
25368
|
"type": {
|
24583
|
-
"text": "
|
25369
|
+
"text": "string | undefined"
|
24584
25370
|
},
|
24585
|
-
"description": "
|
24586
|
-
"
|
24587
|
-
"
|
25371
|
+
"description": "The label of the input field. It is linked to the input field using the `for` attribute.",
|
25372
|
+
"fieldName": "label",
|
25373
|
+
"inheritedFrom": {
|
25374
|
+
"name": "FormfieldWrapper",
|
25375
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25376
|
+
}
|
24588
25377
|
},
|
24589
25378
|
{
|
24590
|
-
"name": "
|
25379
|
+
"name": "required",
|
24591
25380
|
"type": {
|
24592
|
-
"text": "
|
25381
|
+
"text": "boolean"
|
24593
25382
|
},
|
24594
|
-
"
|
24595
|
-
"
|
24596
|
-
"fieldName": "
|
24597
|
-
}
|
24598
|
-
],
|
24599
|
-
"superclass": {
|
24600
|
-
"name": "Component",
|
24601
|
-
"module": "/src/models"
|
24602
|
-
},
|
24603
|
-
"tagName": "mdc-screenreaderannouncer",
|
24604
|
-
"jsDoc": "/**\n * `mdc-screenreaderannouncer` can be used to announce messages with the screen reader.\n *\n * To make an announcement set `announcement` attribute on the `mdc-screenreaderannouncer` element.\n *\n * **Internal logic**\n *\n * When the screenreader announcer is connected to the DOM, if the `identity` attribute is not\n * provided, it is set to `mdc-screenreaderannouncer-identity` and a `<div>` element with this id is created\n * in the DOM. If the `identity` attribute is provided, the identity element is used and no new element\n * is created in the DOM.\n *\n * When the `announcement` attribute is set, the screenreader announcer will create a `<div>` element with\n * `aria-live` attribute set to the value of `data-aria-live` attribute and append it to the `identity` element.\n * After delay of `delay` milliseconds, a <p> element with the announcement text is appended to the `<div>` element.\n *\n * The announcement `<div>` element is removed from the DOM after `timeout` milliseconds.\n *\n * When the screen announcer component is disconnected from the DOM, all the timeouts are cleared and\n * all the announcement elements added are removed from the DOM and timeouts cleared.\n *\n * **Note**\n * 1. The default delay of 150 miliseconds is used as we dynamically generate the\n * aria-live region in the DOM and add the announcement text to it.\n * 3. If no `identity` is provided, all the screen reader components will create and use only one\n * `<div>` element with id `mdc-screenreaderannouncer-identity` in the DOM.\n *\n * Reference: https://patrickhlauke.github.io/aria/tests/live-regions/\n *\n * @tagname mdc-screenreaderannouncer\n */",
|
24605
|
-
"customElement": true
|
24606
|
-
}
|
24607
|
-
],
|
24608
|
-
"exports": [
|
24609
|
-
{
|
24610
|
-
"kind": "js",
|
24611
|
-
"name": "default",
|
24612
|
-
"declaration": {
|
24613
|
-
"name": "ScreenreaderAnnouncer",
|
24614
|
-
"module": "components/screenreaderannouncer/screenreaderannouncer.component.js"
|
24615
|
-
}
|
24616
|
-
}
|
24617
|
-
]
|
24618
|
-
},
|
24619
|
-
{
|
24620
|
-
"kind": "javascript-module",
|
24621
|
-
"path": "components/searchfield/searchfield.component.js",
|
24622
|
-
"declarations": [
|
24623
|
-
{
|
24624
|
-
"kind": "class",
|
24625
|
-
"description": "searchfield component is used as an input field for search functionality.\n\nIt supports `mdc-inputchip` as filters.\n\nThis component is built by extending the `mdc-input` component.",
|
24626
|
-
"name": "Searchfield",
|
24627
|
-
"slots": [
|
24628
|
-
{
|
24629
|
-
"description": "Slot for input chips",
|
24630
|
-
"name": "filters"
|
24631
|
-
},
|
24632
|
-
{
|
24633
|
-
"description": "slot to add the label info icon",
|
24634
|
-
"name": "label-info",
|
25383
|
+
"default": "false",
|
25384
|
+
"description": "The required attribute to indicate that the input field is required.\nIt is used to append a required indicator (*) to the label.",
|
25385
|
+
"fieldName": "required",
|
24635
25386
|
"inheritedFrom": {
|
24636
25387
|
"name": "FormfieldWrapper",
|
24637
25388
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24638
25389
|
}
|
24639
|
-
}
|
24640
|
-
],
|
24641
|
-
"members": [
|
25390
|
+
},
|
24642
25391
|
{
|
24643
|
-
"
|
24644
|
-
"name": "inputChips",
|
25392
|
+
"name": "id",
|
24645
25393
|
"type": {
|
24646
|
-
"text": "
|
25394
|
+
"text": "string"
|
25395
|
+
},
|
25396
|
+
"default": "''",
|
25397
|
+
"description": "The unique id of the input field. It is used to link the input field with the label.",
|
25398
|
+
"fieldName": "id",
|
25399
|
+
"inheritedFrom": {
|
25400
|
+
"name": "FormfieldWrapper",
|
25401
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24647
25402
|
}
|
24648
25403
|
},
|
24649
25404
|
{
|
24650
|
-
"
|
24651
|
-
"
|
24652
|
-
|
24653
|
-
|
24654
|
-
|
24655
|
-
|
24656
|
-
"type": {
|
24657
|
-
"text": "KeyboardEvent"
|
24658
|
-
},
|
24659
|
-
"description": "Keyboard event"
|
24660
|
-
}
|
24661
|
-
],
|
24662
|
-
"description": "Handles the keydown event of the search field.\nIf the key pressed is 'Enter', it submits the form.\nIf the key pressed is 'Escape', it clears the input text.",
|
25405
|
+
"name": "help-text-type",
|
25406
|
+
"type": {
|
25407
|
+
"text": "ValidationType"
|
25408
|
+
},
|
25409
|
+
"description": "The type of help text. It can be 'default', 'error', 'warning', 'success', 'priority'.",
|
25410
|
+
"fieldName": "helpTextType",
|
24663
25411
|
"inheritedFrom": {
|
24664
|
-
"name": "
|
24665
|
-
"module": "components/
|
25412
|
+
"name": "FormfieldWrapper",
|
25413
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24666
25414
|
}
|
24667
25415
|
},
|
24668
25416
|
{
|
24669
|
-
"
|
24670
|
-
"
|
24671
|
-
|
24672
|
-
|
24673
|
-
|
24674
|
-
|
24675
|
-
"kind": "method",
|
24676
|
-
"name": "clearInputText",
|
24677
|
-
"privacy": "protected",
|
24678
|
-
"description": "Clears the input field.",
|
25417
|
+
"name": "help-text",
|
25418
|
+
"type": {
|
25419
|
+
"text": "string | undefined"
|
25420
|
+
},
|
25421
|
+
"description": "The help text that is displayed below the input field.",
|
25422
|
+
"fieldName": "helpText",
|
24679
25423
|
"inheritedFrom": {
|
24680
|
-
"name": "
|
24681
|
-
"module": "components/
|
25424
|
+
"name": "FormfieldWrapper",
|
25425
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24682
25426
|
}
|
24683
25427
|
},
|
24684
25428
|
{
|
24685
|
-
"
|
24686
|
-
"name": "name",
|
25429
|
+
"name": "toggletip-text",
|
24687
25430
|
"type": {
|
24688
|
-
"text": "string"
|
25431
|
+
"text": "string | undefined"
|
24689
25432
|
},
|
24690
|
-
"
|
24691
|
-
"
|
24692
|
-
"attribute": "name",
|
24693
|
-
"reflects": true,
|
25433
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
25434
|
+
"fieldName": "toggletipText",
|
24694
25435
|
"inheritedFrom": {
|
24695
|
-
"name": "
|
24696
|
-
"module": "
|
25436
|
+
"name": "FormfieldWrapper",
|
25437
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24697
25438
|
}
|
24698
25439
|
},
|
24699
25440
|
{
|
24700
|
-
"
|
24701
|
-
"name": "value",
|
25441
|
+
"name": "toggletip-placement",
|
24702
25442
|
"type": {
|
24703
|
-
"text": "
|
25443
|
+
"text": "PopoverPlacement"
|
24704
25444
|
},
|
24705
|
-
"
|
24706
|
-
"
|
24707
|
-
"
|
24708
|
-
"reflects": true,
|
25445
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
25446
|
+
"default": "'top'",
|
25447
|
+
"fieldName": "toggletipPlacement",
|
24709
25448
|
"inheritedFrom": {
|
24710
|
-
"name": "
|
24711
|
-
"module": "
|
25449
|
+
"name": "FormfieldWrapper",
|
25450
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
24712
25451
|
}
|
24713
25452
|
},
|
24714
25453
|
{
|
24715
|
-
"
|
24716
|
-
"name": "validationMessage",
|
25454
|
+
"name": "info-icon-aria-label",
|
24717
25455
|
"type": {
|
24718
25456
|
"text": "string | undefined"
|
24719
25457
|
},
|
24720
|
-
"description": "
|
24721
|
-
"
|
24722
|
-
"reflects": true,
|
25458
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
25459
|
+
"fieldName": "infoIconAriaLabel",
|
24723
25460
|
"inheritedFrom": {
|
24724
|
-
"name": "
|
24725
|
-
"module": "
|
25461
|
+
"name": "FormfieldWrapper",
|
25462
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25463
|
+
}
|
25464
|
+
}
|
25465
|
+
],
|
25466
|
+
"cssProperties": [
|
25467
|
+
{
|
25468
|
+
"description": "Border color for the input container when disabled",
|
25469
|
+
"name": "--mdc-input-disabled-border-color",
|
25470
|
+
"inheritedFrom": {
|
25471
|
+
"name": "Input",
|
25472
|
+
"module": "src/components/input/input.component.ts"
|
24726
25473
|
}
|
24727
25474
|
},
|
24728
25475
|
{
|
24729
|
-
"
|
24730
|
-
"name": "
|
24731
|
-
"type": {
|
24732
|
-
"text": "ValidityState"
|
24733
|
-
},
|
24734
|
-
"readonly": true,
|
25476
|
+
"description": "Text color for the input field when disabled",
|
25477
|
+
"name": "--mdc-input-disabled-text-color",
|
24735
25478
|
"inheritedFrom": {
|
24736
|
-
"name": "
|
24737
|
-
"module": "
|
25479
|
+
"name": "Input",
|
25480
|
+
"module": "src/components/input/input.component.ts"
|
24738
25481
|
}
|
24739
25482
|
},
|
24740
25483
|
{
|
24741
|
-
"
|
24742
|
-
"name": "
|
24743
|
-
"readonly": true,
|
25484
|
+
"description": "Background color for the input field when disabled",
|
25485
|
+
"name": "--mdc-input-disabled-background-color",
|
24744
25486
|
"inheritedFrom": {
|
24745
|
-
"name": "
|
24746
|
-
"module": "
|
25487
|
+
"name": "Input",
|
25488
|
+
"module": "src/components/input/input.component.ts"
|
24747
25489
|
}
|
24748
25490
|
},
|
24749
25491
|
{
|
24750
|
-
"
|
24751
|
-
"name": "
|
24752
|
-
"description": "Sets the validity of the input field based on the input field's validity.",
|
24753
|
-
"return": {
|
24754
|
-
"type": {
|
24755
|
-
"text": ""
|
24756
|
-
}
|
24757
|
-
},
|
25492
|
+
"description": "Border color for the input container",
|
25493
|
+
"name": "--mdc-input-border-color",
|
24758
25494
|
"inheritedFrom": {
|
24759
|
-
"name": "
|
24760
|
-
"module": "
|
25495
|
+
"name": "Input",
|
25496
|
+
"module": "src/components/input/input.component.ts"
|
25497
|
+
}
|
25498
|
+
},
|
25499
|
+
{
|
25500
|
+
"description": "Text color for the input field",
|
25501
|
+
"name": "--mdc-input-text-color",
|
25502
|
+
"inheritedFrom": {
|
25503
|
+
"name": "Input",
|
25504
|
+
"module": "src/components/input/input.component.ts"
|
24761
25505
|
}
|
24762
25506
|
},
|
24763
25507
|
{
|
24764
|
-
"
|
24765
|
-
"name": "
|
24766
|
-
"return": {
|
24767
|
-
"type": {
|
24768
|
-
"text": "boolean"
|
24769
|
-
}
|
24770
|
-
},
|
25508
|
+
"description": "Background color for the input field",
|
25509
|
+
"name": "--mdc-input-background-color",
|
24771
25510
|
"inheritedFrom": {
|
24772
|
-
"name": "
|
24773
|
-
"module": "
|
25511
|
+
"name": "Input",
|
25512
|
+
"module": "src/components/input/input.component.ts"
|
24774
25513
|
}
|
24775
25514
|
},
|
24776
25515
|
{
|
24777
|
-
"
|
24778
|
-
"name": "
|
25516
|
+
"description": "Background color for the selected text",
|
25517
|
+
"name": "--mdc-input-selection-background-color",
|
24779
25518
|
"inheritedFrom": {
|
24780
|
-
"name": "
|
24781
|
-
"module": "
|
25519
|
+
"name": "Input",
|
25520
|
+
"module": "src/components/input/input.component.ts"
|
24782
25521
|
}
|
24783
25522
|
},
|
24784
25523
|
{
|
24785
|
-
"
|
24786
|
-
"name": "
|
24787
|
-
"type": {
|
24788
|
-
"text": "string | null"
|
24789
|
-
},
|
24790
|
-
"default": "null",
|
24791
|
-
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
24792
|
-
"attribute": "data-aria-label",
|
24793
|
-
"reflects": true,
|
25524
|
+
"description": "Text color for the selected text",
|
25525
|
+
"name": "--mdc-input-selection-text-color",
|
24794
25526
|
"inheritedFrom": {
|
24795
|
-
"name": "
|
24796
|
-
"module": "
|
25527
|
+
"name": "Input",
|
25528
|
+
"module": "src/components/input/input.component.ts"
|
24797
25529
|
}
|
24798
25530
|
},
|
24799
25531
|
{
|
24800
|
-
"
|
24801
|
-
"name": "
|
24802
|
-
"type": {
|
24803
|
-
"text": "string"
|
24804
|
-
},
|
24805
|
-
"default": "''",
|
24806
|
-
"description": "The placeholder text that is displayed when the input field is empty.",
|
24807
|
-
"attribute": "placeholder",
|
25532
|
+
"description": "Text color for the help text",
|
25533
|
+
"name": "--mdc-input-support-text-color",
|
24808
25534
|
"inheritedFrom": {
|
24809
25535
|
"name": "Input",
|
24810
|
-
"module": "components/input/input.component.
|
25536
|
+
"module": "src/components/input/input.component.ts"
|
24811
25537
|
}
|
24812
25538
|
},
|
24813
25539
|
{
|
24814
|
-
"
|
24815
|
-
"name": "
|
24816
|
-
"type": {
|
24817
|
-
"text": "boolean"
|
24818
|
-
},
|
24819
|
-
"default": "false",
|
24820
|
-
"description": "readonly attribute of the input field. If true, the input field is read-only.",
|
24821
|
-
"attribute": "readonly",
|
25540
|
+
"description": "Background color for the input field when hovered",
|
25541
|
+
"name": "--mdc-input-hover-background-color",
|
24822
25542
|
"inheritedFrom": {
|
24823
25543
|
"name": "Input",
|
24824
|
-
"module": "components/input/input.component.
|
25544
|
+
"module": "src/components/input/input.component.ts"
|
24825
25545
|
}
|
24826
25546
|
},
|
24827
25547
|
{
|
24828
|
-
"
|
24829
|
-
"name": "
|
24830
|
-
"type": {
|
24831
|
-
"text": "string | undefined"
|
24832
|
-
},
|
24833
|
-
"description": "The prefix text that is displayed before the input field. It has a max length of 10 characters.\nWhen the prefix text is set, make sure to set the 'data-aria-label'\nattribute with the appropriate value for accessibility.",
|
24834
|
-
"attribute": "prefix-text",
|
25548
|
+
"description": "Background color for the input field when focused",
|
25549
|
+
"name": "--mdc-input-focused-background-color",
|
24835
25550
|
"inheritedFrom": {
|
24836
25551
|
"name": "Input",
|
24837
|
-
"module": "components/input/input.component.
|
25552
|
+
"module": "src/components/input/input.component.ts"
|
24838
25553
|
}
|
24839
25554
|
},
|
24840
25555
|
{
|
24841
|
-
"
|
24842
|
-
"name": "
|
24843
|
-
"type": {
|
24844
|
-
"text": "IconNames | undefined"
|
24845
|
-
},
|
24846
|
-
"description": "The leading icon that is displayed before the input field.",
|
24847
|
-
"attribute": "leading-icon",
|
25556
|
+
"description": "Border color for the input container when focused",
|
25557
|
+
"name": "--mdc-input-focused-border-color",
|
24848
25558
|
"inheritedFrom": {
|
24849
25559
|
"name": "Input",
|
24850
|
-
"module": "components/input/input.component.
|
25560
|
+
"module": "src/components/input/input.component.ts"
|
24851
25561
|
}
|
24852
25562
|
},
|
24853
25563
|
{
|
24854
|
-
"
|
24855
|
-
"name": "
|
24856
|
-
"type": {
|
24857
|
-
"text": "boolean"
|
24858
|
-
},
|
24859
|
-
"default": "false",
|
24860
|
-
"description": "The trailing button when set to true, shows a clear button that clears the input field.",
|
24861
|
-
"attribute": "trailing-button",
|
25564
|
+
"description": "Border color for the input container when error",
|
25565
|
+
"name": "--mdc-input-error-border-color",
|
24862
25566
|
"inheritedFrom": {
|
24863
25567
|
"name": "Input",
|
24864
|
-
"module": "components/input/input.component.
|
25568
|
+
"module": "src/components/input/input.component.ts"
|
24865
25569
|
}
|
24866
25570
|
},
|
24867
25571
|
{
|
24868
|
-
"
|
24869
|
-
"name": "
|
24870
|
-
"type": {
|
24871
|
-
"text": "number | undefined"
|
24872
|
-
},
|
24873
|
-
"description": "The maximum number of characters that the input field can accept.",
|
24874
|
-
"attribute": "maxlength",
|
25572
|
+
"description": "Border color for the input container when warning",
|
25573
|
+
"name": "--mdc-input-warning-border-color",
|
24875
25574
|
"inheritedFrom": {
|
24876
25575
|
"name": "Input",
|
24877
|
-
"module": "components/input/input.component.
|
25576
|
+
"module": "src/components/input/input.component.ts"
|
24878
25577
|
}
|
24879
25578
|
},
|
24880
25579
|
{
|
24881
|
-
"
|
24882
|
-
"name": "
|
24883
|
-
"type": {
|
24884
|
-
"text": "number | undefined"
|
24885
|
-
},
|
24886
|
-
"description": "The minimum number of characters that the input field can accept.",
|
24887
|
-
"attribute": "minlength",
|
25580
|
+
"description": "Border color for the input container when success",
|
25581
|
+
"name": "--mdc-input-success-border-color",
|
24888
25582
|
"inheritedFrom": {
|
24889
25583
|
"name": "Input",
|
24890
|
-
"module": "components/input/input.component.
|
25584
|
+
"module": "src/components/input/input.component.ts"
|
24891
25585
|
}
|
24892
25586
|
},
|
24893
25587
|
{
|
24894
|
-
"
|
24895
|
-
"name": "
|
24896
|
-
"type": {
|
24897
|
-
"text": "AutoCapitalizeType"
|
24898
|
-
},
|
24899
|
-
"description": "The autocapitalize attribute of the input field.",
|
24900
|
-
"default": "'off'",
|
24901
|
-
"attribute": "autocapitalize",
|
25588
|
+
"description": "Border color for the input container when primary",
|
25589
|
+
"name": "--mdc-input-primary-border-color",
|
24902
25590
|
"inheritedFrom": {
|
24903
25591
|
"name": "Input",
|
24904
|
-
"module": "components/input/input.component.
|
25592
|
+
"module": "src/components/input/input.component.ts"
|
24905
25593
|
}
|
24906
|
-
}
|
25594
|
+
}
|
25595
|
+
],
|
25596
|
+
"events": [
|
24907
25597
|
{
|
24908
|
-
"kind": "field",
|
24909
|
-
"name": "autocomplete",
|
24910
25598
|
"type": {
|
24911
|
-
"text": "
|
25599
|
+
"text": "EventConstructor"
|
24912
25600
|
},
|
24913
|
-
"description": "The autocomplete attribute of the input field.",
|
24914
|
-
"default": "'off'",
|
24915
|
-
"attribute": "autocomplete",
|
24916
25601
|
"inheritedFrom": {
|
24917
25602
|
"name": "Input",
|
24918
|
-
"module": "components/input/input.component.
|
25603
|
+
"module": "src/components/input/input.component.ts"
|
24919
25604
|
}
|
24920
25605
|
},
|
24921
25606
|
{
|
24922
|
-
"
|
24923
|
-
"name": "
|
24924
|
-
"
|
24925
|
-
"text": "boolean"
|
24926
|
-
},
|
24927
|
-
"default": "false",
|
24928
|
-
"description": "If true, the input field is focused when the component is rendered.",
|
24929
|
-
"attribute": "autofocus",
|
25607
|
+
"description": "(React: onInput) This event is dispatched when the value of the input field changes (every press).",
|
25608
|
+
"name": "input",
|
25609
|
+
"reactName": "onInput",
|
24930
25610
|
"inheritedFrom": {
|
24931
25611
|
"name": "Input",
|
24932
|
-
"module": "components/input/input.component.
|
25612
|
+
"module": "src/components/input/input.component.ts"
|
24933
25613
|
}
|
24934
25614
|
},
|
24935
25615
|
{
|
24936
|
-
"
|
24937
|
-
"name": "
|
24938
|
-
"
|
24939
|
-
"text": "string | undefined"
|
24940
|
-
},
|
24941
|
-
"description": "Specifies the name of the directionality of text for submission purposes (e.g., \"rtl\" for right-to-left).",
|
24942
|
-
"attribute": "dirname",
|
25616
|
+
"description": "(React: onChange) This event is dispatched when the value of the input field changes (on blur).",
|
25617
|
+
"name": "change",
|
25618
|
+
"reactName": "onChange",
|
24943
25619
|
"inheritedFrom": {
|
24944
25620
|
"name": "Input",
|
24945
|
-
"module": "components/input/input.component.
|
25621
|
+
"module": "src/components/input/input.component.ts"
|
24946
25622
|
}
|
24947
25623
|
},
|
24948
25624
|
{
|
24949
|
-
"
|
24950
|
-
"name": "
|
24951
|
-
"
|
24952
|
-
"text": "string | undefined"
|
24953
|
-
},
|
24954
|
-
"description": "The pattern attribute of the input field.\nSpecifies a regular expression that the input value must match for validation purposes.",
|
24955
|
-
"attribute": "pattern",
|
25625
|
+
"description": "(React: onFocus) This event is dispatched when the input receives focus.",
|
25626
|
+
"name": "focus",
|
25627
|
+
"reactName": "onFocus",
|
24956
25628
|
"inheritedFrom": {
|
24957
25629
|
"name": "Input",
|
24958
|
-
"module": "components/input/input.component.
|
25630
|
+
"module": "src/components/input/input.component.ts"
|
24959
25631
|
}
|
24960
25632
|
},
|
24961
25633
|
{
|
24962
|
-
"
|
24963
|
-
"name": "
|
24964
|
-
"
|
24965
|
-
"text": "string | undefined"
|
24966
|
-
},
|
24967
|
-
"description": "The list attribute of the input field.\nIdentifies a list of pre-defined options to suggest to the user.",
|
24968
|
-
"attribute": "list",
|
25634
|
+
"description": "(React: onBlur) This event is dispatched when the input loses focus.",
|
25635
|
+
"name": "blur",
|
25636
|
+
"reactName": "onBlur",
|
24969
25637
|
"inheritedFrom": {
|
24970
25638
|
"name": "Input",
|
24971
|
-
"module": "components/input/input.component.
|
25639
|
+
"module": "src/components/input/input.component.ts"
|
24972
25640
|
}
|
25641
|
+
}
|
25642
|
+
]
|
25643
|
+
}
|
25644
|
+
],
|
25645
|
+
"exports": [
|
25646
|
+
{
|
25647
|
+
"kind": "js",
|
25648
|
+
"name": "default",
|
25649
|
+
"declaration": {
|
25650
|
+
"name": "Searchfield",
|
25651
|
+
"module": "components/searchfield/searchfield.component.js"
|
25652
|
+
}
|
25653
|
+
}
|
25654
|
+
]
|
25655
|
+
},
|
25656
|
+
{
|
25657
|
+
"kind": "javascript-module",
|
25658
|
+
"path": "components/radio/radio.component.js",
|
25659
|
+
"declarations": [
|
25660
|
+
{
|
25661
|
+
"kind": "class",
|
25662
|
+
"description": "Radio allow users to select single options from a list or turn an item/feature on or off.\nThese are often used in forms, settings, and selection in lists.\n\nA radio component contains an optional label, optional info icon and an optional helper text.",
|
25663
|
+
"name": "Radio",
|
25664
|
+
"cssProperties": [
|
25665
|
+
{
|
25666
|
+
"description": "color of the label when disabled",
|
25667
|
+
"name": "--mdc-radio-text-disabled-color"
|
25668
|
+
},
|
25669
|
+
{
|
25670
|
+
"description": "color of the radio button when inactive and hovered",
|
25671
|
+
"name": "--mdc-radio-control-inactive-hover"
|
25672
|
+
},
|
25673
|
+
{
|
25674
|
+
"description": "color of the radio button when inactive and pressed",
|
25675
|
+
"name": "--mdc-radio-control-inactive-pressed-color"
|
25676
|
+
},
|
25677
|
+
{
|
25678
|
+
"description": "color of the radio button when active and hovered",
|
25679
|
+
"name": "--mdc-radio-control-active-hover-color"
|
25680
|
+
},
|
25681
|
+
{
|
25682
|
+
"description": "color of the radio button when active and pressed",
|
25683
|
+
"name": "--mdc-radio-control-active-pressed-color"
|
25684
|
+
},
|
25685
|
+
{
|
25686
|
+
"description": "color of the radio button when disabled",
|
25687
|
+
"name": "--mdc-radio-disabled-border-color"
|
25688
|
+
},
|
25689
|
+
{
|
25690
|
+
"description": "color of the radio button when active and disabled",
|
25691
|
+
"name": "--mdc-radio-control-active-disabled-background"
|
25692
|
+
},
|
25693
|
+
{
|
25694
|
+
"description": "color of the radio button when inactive and disabled",
|
25695
|
+
"name": "--mdc-radio-control-inactive-disabled-background"
|
25696
|
+
}
|
25697
|
+
],
|
25698
|
+
"members": [
|
25699
|
+
{
|
25700
|
+
"kind": "field",
|
25701
|
+
"name": "checked",
|
25702
|
+
"type": {
|
25703
|
+
"text": "boolean"
|
25704
|
+
},
|
25705
|
+
"default": "false",
|
25706
|
+
"description": "Determines whether the radio is selected or unselected.",
|
25707
|
+
"attribute": "checked",
|
25708
|
+
"reflects": true
|
24973
25709
|
},
|
24974
25710
|
{
|
24975
25711
|
"kind": "field",
|
24976
|
-
"name": "
|
25712
|
+
"name": "readonly",
|
24977
25713
|
"type": {
|
24978
|
-
"text": "
|
25714
|
+
"text": "boolean"
|
24979
25715
|
},
|
24980
|
-
"
|
24981
|
-
"
|
24982
|
-
"attribute": "
|
24983
|
-
"
|
24984
|
-
"name": "Input",
|
24985
|
-
"module": "components/input/input.component.js"
|
24986
|
-
}
|
25716
|
+
"default": "false",
|
25717
|
+
"description": "Determines whether the radio is read-only.",
|
25718
|
+
"attribute": "readonly",
|
25719
|
+
"reflects": true
|
24987
25720
|
},
|
24988
25721
|
{
|
24989
25722
|
"kind": "field",
|
24990
|
-
"name": "
|
25723
|
+
"name": "autofocus",
|
24991
25724
|
"type": {
|
24992
|
-
"text": "
|
25725
|
+
"text": "boolean"
|
24993
25726
|
},
|
24994
|
-
"default": "
|
24995
|
-
"description": "
|
24996
|
-
"attribute": "
|
24997
|
-
"
|
24998
|
-
"name": "Input",
|
24999
|
-
"module": "components/input/input.component.js"
|
25000
|
-
}
|
25727
|
+
"default": "false",
|
25728
|
+
"description": "Automatically focus on the element when the page loads.\n[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)",
|
25729
|
+
"attribute": "autofocus",
|
25730
|
+
"reflects": true
|
25001
25731
|
},
|
25002
25732
|
{
|
25003
25733
|
"kind": "method",
|
25004
|
-
"name": "
|
25005
|
-
"
|
25734
|
+
"name": "getAllRadiosWithinSameGroup",
|
25735
|
+
"privacy": "private",
|
25006
25736
|
"return": {
|
25007
25737
|
"type": {
|
25008
|
-
"text": ""
|
25738
|
+
"text": "Radio[]"
|
25009
25739
|
}
|
25010
25740
|
},
|
25011
|
-
"
|
25012
|
-
"name": "Input",
|
25013
|
-
"module": "components/input/input.component.js"
|
25014
|
-
}
|
25741
|
+
"description": "Returns all radios within the same group (name)."
|
25015
25742
|
},
|
25016
25743
|
{
|
25017
25744
|
"kind": "method",
|
25018
|
-
"name": "
|
25745
|
+
"name": "dispatchChangeEvent",
|
25019
25746
|
"privacy": "private",
|
25020
|
-
"
|
25021
|
-
"
|
25022
|
-
|
25023
|
-
|
25747
|
+
"return": {
|
25748
|
+
"type": {
|
25749
|
+
"text": "void"
|
25750
|
+
}
|
25751
|
+
},
|
25752
|
+
"parameters": [
|
25753
|
+
{
|
25754
|
+
"name": "event",
|
25755
|
+
"type": {
|
25756
|
+
"text": "Event"
|
25757
|
+
}
|
25758
|
+
}
|
25759
|
+
],
|
25760
|
+
"description": "The 'change' event does not bubble up through the shadow DOM as it was not composed.\nTherefore, we need to re-dispatch the same event to ensure it is propagated correctly.\nRead more: https://developer.mozilla.org/en-US/docs/Web/API/Event/composed"
|
25024
25761
|
},
|
25025
25762
|
{
|
25026
25763
|
"kind": "method",
|
25027
|
-
"name": "
|
25764
|
+
"name": "setGroupValidity",
|
25028
25765
|
"privacy": "private",
|
25029
|
-
"
|
25030
|
-
|
25031
|
-
|
25032
|
-
"
|
25766
|
+
"parameters": [
|
25767
|
+
{
|
25768
|
+
"name": "radios",
|
25769
|
+
"type": {
|
25770
|
+
"text": "Radio[]"
|
25771
|
+
},
|
25772
|
+
"description": "Array of radios of the same group"
|
25773
|
+
},
|
25774
|
+
{
|
25775
|
+
"name": "isValid",
|
25776
|
+
"type": {
|
25777
|
+
"text": "boolean"
|
25778
|
+
},
|
25779
|
+
"description": "Boolean value to set the validity of the group"
|
25033
25780
|
}
|
25034
|
-
|
25035
|
-
"
|
25036
|
-
"name": "Input",
|
25037
|
-
"module": "components/input/input.component.js"
|
25038
|
-
}
|
25781
|
+
],
|
25782
|
+
"description": "Sets the validity of the group of radios."
|
25039
25783
|
},
|
25040
25784
|
{
|
25041
25785
|
"kind": "method",
|
25042
|
-
"name": "
|
25786
|
+
"name": "setActualFormValue",
|
25043
25787
|
"privacy": "private",
|
25044
|
-
"description": "
|
25045
|
-
"inheritedFrom": {
|
25046
|
-
"name": "Input",
|
25047
|
-
"module": "components/input/input.component.js"
|
25048
|
-
}
|
25788
|
+
"description": "Updates the form value to reflect the current state of the radio.\nIf checked, the value is set to the user-provided value.\nIf unchecked, the value is set to null."
|
25049
25789
|
},
|
25050
25790
|
{
|
25051
25791
|
"kind": "method",
|
25052
|
-
"name": "
|
25792
|
+
"name": "handleChange",
|
25053
25793
|
"privacy": "private",
|
25794
|
+
"return": {
|
25795
|
+
"type": {
|
25796
|
+
"text": "void"
|
25797
|
+
}
|
25798
|
+
},
|
25054
25799
|
"parameters": [
|
25055
25800
|
{
|
25056
25801
|
"name": "event",
|
25057
25802
|
"type": {
|
25058
25803
|
"text": "Event"
|
25804
|
+
}
|
25805
|
+
}
|
25806
|
+
],
|
25807
|
+
"description": "Handles the change event on the radio element.\nThis will toggle the state of the radio element.\nDispatches the change event."
|
25808
|
+
},
|
25809
|
+
{
|
25810
|
+
"kind": "method",
|
25811
|
+
"name": "updateRadio",
|
25812
|
+
"privacy": "private",
|
25813
|
+
"parameters": [
|
25814
|
+
{
|
25815
|
+
"name": "enabledRadios",
|
25816
|
+
"type": {
|
25817
|
+
"text": "Radio[]"
|
25059
25818
|
},
|
25060
|
-
"description": "
|
25819
|
+
"description": "An array of enabled radio buttons within the same group."
|
25820
|
+
},
|
25821
|
+
{
|
25822
|
+
"name": "index",
|
25823
|
+
"type": {
|
25824
|
+
"text": "number"
|
25825
|
+
},
|
25826
|
+
"description": "The index of the radio button to be updated within the enabled radios array."
|
25827
|
+
},
|
25828
|
+
{
|
25829
|
+
"name": "event",
|
25830
|
+
"type": {
|
25831
|
+
"text": "Event"
|
25832
|
+
},
|
25833
|
+
"description": "The event that triggered the update."
|
25061
25834
|
}
|
25062
25835
|
],
|
25063
|
-
"description": "
|
25064
|
-
"inheritedFrom": {
|
25065
|
-
"name": "Input",
|
25066
|
-
"module": "components/input/input.component.js"
|
25067
|
-
}
|
25836
|
+
"description": "Updates the state of the radio button at the specified index within the enabled radios.\nFocuses the radio button and triggers the change event if the radio button is not read-only."
|
25068
25837
|
},
|
25069
25838
|
{
|
25070
25839
|
"kind": "method",
|
25071
|
-
"name": "
|
25072
|
-
"privacy": "
|
25073
|
-
"description": "Renders the leading icon before the input field.\nIf the leading icon is not set, it will not be displayed.",
|
25840
|
+
"name": "handleKeyDown",
|
25841
|
+
"privacy": "private",
|
25074
25842
|
"return": {
|
25075
25843
|
"type": {
|
25076
|
-
"text": ""
|
25844
|
+
"text": "void"
|
25077
25845
|
}
|
25078
25846
|
},
|
25079
|
-
"
|
25080
|
-
|
25081
|
-
|
25082
|
-
|
25847
|
+
"parameters": [
|
25848
|
+
{
|
25849
|
+
"name": "event",
|
25850
|
+
"type": {
|
25851
|
+
"text": "KeyboardEvent"
|
25852
|
+
}
|
25853
|
+
}
|
25854
|
+
],
|
25855
|
+
"description": "Handles the keydown event (Arrow Up/Down/Left/Right) on the radio element."
|
25083
25856
|
},
|
25084
25857
|
{
|
25085
25858
|
"kind": "method",
|
25086
|
-
"name": "
|
25087
|
-
"privacy": "
|
25088
|
-
"description": "Renders the prefix text before the input field.\nIf the prefix text is more than 10 characters,\n- it will not be displayed.\n- the validation messsage will be displayed.\n\n Note: We are setting aria-hidden so that the screen reader does not read the prefix text.\n The consumers should set the appropriate aria-label for the input field using 'data-aria-label' attribute.",
|
25859
|
+
"name": "updateTabIndex",
|
25860
|
+
"privacy": "private",
|
25089
25861
|
"return": {
|
25090
25862
|
"type": {
|
25091
|
-
"text": ""
|
25863
|
+
"text": "void"
|
25092
25864
|
}
|
25093
25865
|
},
|
25866
|
+
"description": "Update tab index for all radios in the same group (name)\nIf any radio group is checked, it will have a tab index of 0\nIf no radio group is checked, the first enabled radio will have a tab index of 0"
|
25867
|
+
},
|
25868
|
+
{
|
25869
|
+
"kind": "field",
|
25870
|
+
"name": "renderLabelAndHelperText",
|
25871
|
+
"privacy": "private"
|
25872
|
+
},
|
25873
|
+
{
|
25874
|
+
"kind": "field",
|
25875
|
+
"name": "name",
|
25876
|
+
"type": {
|
25877
|
+
"text": "string"
|
25878
|
+
},
|
25879
|
+
"default": "''",
|
25880
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
25881
|
+
"attribute": "name",
|
25882
|
+
"reflects": true,
|
25094
25883
|
"inheritedFrom": {
|
25095
|
-
"name": "
|
25096
|
-
"module": "
|
25884
|
+
"name": "FormInternalsMixin",
|
25885
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25886
|
+
}
|
25887
|
+
},
|
25888
|
+
{
|
25889
|
+
"kind": "field",
|
25890
|
+
"name": "value",
|
25891
|
+
"type": {
|
25892
|
+
"text": "string"
|
25893
|
+
},
|
25894
|
+
"default": "''",
|
25895
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
25896
|
+
"attribute": "value",
|
25897
|
+
"reflects": true,
|
25898
|
+
"inheritedFrom": {
|
25899
|
+
"name": "FormInternalsMixin",
|
25900
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25901
|
+
}
|
25902
|
+
},
|
25903
|
+
{
|
25904
|
+
"kind": "field",
|
25905
|
+
"name": "validationMessage",
|
25906
|
+
"type": {
|
25907
|
+
"text": "string | undefined"
|
25908
|
+
},
|
25909
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
25910
|
+
"attribute": "validation-message",
|
25911
|
+
"reflects": true,
|
25912
|
+
"inheritedFrom": {
|
25913
|
+
"name": "FormInternalsMixin",
|
25914
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25915
|
+
}
|
25916
|
+
},
|
25917
|
+
{
|
25918
|
+
"kind": "field",
|
25919
|
+
"name": "validity",
|
25920
|
+
"type": {
|
25921
|
+
"text": "ValidityState"
|
25922
|
+
},
|
25923
|
+
"readonly": true,
|
25924
|
+
"inheritedFrom": {
|
25925
|
+
"name": "FormInternalsMixin",
|
25926
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25927
|
+
}
|
25928
|
+
},
|
25929
|
+
{
|
25930
|
+
"kind": "field",
|
25931
|
+
"name": "willValidate",
|
25932
|
+
"readonly": true,
|
25933
|
+
"inheritedFrom": {
|
25934
|
+
"name": "FormInternalsMixin",
|
25935
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25097
25936
|
}
|
25098
25937
|
},
|
25099
25938
|
{
|
25100
25939
|
"kind": "method",
|
25101
|
-
"name": "
|
25102
|
-
"
|
25103
|
-
"
|
25104
|
-
{
|
25105
|
-
"
|
25106
|
-
"default": "false"
|
25940
|
+
"name": "setValidity",
|
25941
|
+
"description": "Sets the validity of the input field based on the input field's validity.",
|
25942
|
+
"return": {
|
25943
|
+
"type": {
|
25944
|
+
"text": ""
|
25107
25945
|
}
|
25108
|
-
|
25109
|
-
"
|
25946
|
+
},
|
25947
|
+
"inheritedFrom": {
|
25948
|
+
"name": "FormInternalsMixin",
|
25949
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25950
|
+
}
|
25951
|
+
},
|
25952
|
+
{
|
25953
|
+
"kind": "method",
|
25954
|
+
"name": "checkValidity",
|
25110
25955
|
"return": {
|
25111
25956
|
"type": {
|
25112
|
-
"text": ""
|
25957
|
+
"text": "boolean"
|
25113
25958
|
}
|
25114
25959
|
},
|
25115
25960
|
"inheritedFrom": {
|
25116
|
-
"name": "
|
25117
|
-
"module": "
|
25961
|
+
"name": "FormInternalsMixin",
|
25962
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25118
25963
|
}
|
25119
25964
|
},
|
25120
25965
|
{
|
25121
25966
|
"kind": "method",
|
25122
|
-
"name": "
|
25123
|
-
"privacy": "protected",
|
25124
|
-
"parameters": [
|
25125
|
-
{
|
25126
|
-
"name": "type",
|
25127
|
-
"type": {
|
25128
|
-
"text": "InputType"
|
25129
|
-
}
|
25130
|
-
},
|
25131
|
-
{
|
25132
|
-
"name": "hidePlaceholder",
|
25133
|
-
"default": "false"
|
25134
|
-
}
|
25135
|
-
],
|
25967
|
+
"name": "reportValidity",
|
25136
25968
|
"inheritedFrom": {
|
25137
|
-
"name": "
|
25138
|
-
"module": "
|
25969
|
+
"name": "FormInternalsMixin",
|
25970
|
+
"module": "utils/mixins/FormInternalsMixin.js"
|
25971
|
+
}
|
25972
|
+
},
|
25973
|
+
{
|
25974
|
+
"kind": "field",
|
25975
|
+
"name": "dataAriaLabel",
|
25976
|
+
"type": {
|
25977
|
+
"text": "string | null"
|
25978
|
+
},
|
25979
|
+
"default": "null",
|
25980
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
25981
|
+
"attribute": "data-aria-label",
|
25982
|
+
"reflects": true,
|
25983
|
+
"inheritedFrom": {
|
25984
|
+
"name": "DataAriaLabelMixin",
|
25985
|
+
"module": "utils/mixins/DataAriaLabelMixin.js"
|
25139
25986
|
}
|
25140
25987
|
},
|
25141
25988
|
{
|
@@ -25224,6 +26071,49 @@
|
|
25224
26071
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
25225
26072
|
}
|
25226
26073
|
},
|
26074
|
+
{
|
26075
|
+
"kind": "field",
|
26076
|
+
"name": "toggletipText",
|
26077
|
+
"type": {
|
26078
|
+
"text": "string | undefined"
|
26079
|
+
},
|
26080
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
26081
|
+
"attribute": "toggletip-text",
|
26082
|
+
"reflects": true,
|
26083
|
+
"inheritedFrom": {
|
26084
|
+
"name": "FormfieldWrapper",
|
26085
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
26086
|
+
}
|
26087
|
+
},
|
26088
|
+
{
|
26089
|
+
"kind": "field",
|
26090
|
+
"name": "toggletipPlacement",
|
26091
|
+
"type": {
|
26092
|
+
"text": "PopoverPlacement"
|
26093
|
+
},
|
26094
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
26095
|
+
"default": "'top'",
|
26096
|
+
"attribute": "toggletip-placement",
|
26097
|
+
"reflects": true,
|
26098
|
+
"inheritedFrom": {
|
26099
|
+
"name": "FormfieldWrapper",
|
26100
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
26101
|
+
}
|
26102
|
+
},
|
26103
|
+
{
|
26104
|
+
"kind": "field",
|
26105
|
+
"name": "infoIconAriaLabel",
|
26106
|
+
"type": {
|
26107
|
+
"text": "string | undefined"
|
26108
|
+
},
|
26109
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
26110
|
+
"attribute": "info-icon-aria-label",
|
26111
|
+
"reflects": true,
|
26112
|
+
"inheritedFrom": {
|
26113
|
+
"name": "FormfieldWrapper",
|
26114
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
26115
|
+
}
|
26116
|
+
},
|
25227
26117
|
{
|
25228
26118
|
"kind": "method",
|
25229
26119
|
"name": "renderLabelElement",
|
@@ -25300,251 +26190,100 @@
|
|
25300
26190
|
}
|
25301
26191
|
}
|
25302
26192
|
],
|
25303
|
-
"
|
25304
|
-
"name": "Input",
|
25305
|
-
"module": "/src/components/input/input.component"
|
25306
|
-
},
|
25307
|
-
"tagName": "mdc-searchfield",
|
25308
|
-
"jsDoc": "/**\n * searchfield component is used as an input field for search functionality.\n *\n * It supports `mdc-inputchip` as filters.\n *\n * This component is built by extending the `mdc-input` component.\n *\n * @tagname mdc-searchfield\n *\n * @slot filters - Slot for input chips\n *\n */",
|
25309
|
-
"customElement": true,
|
25310
|
-
"attributes": [
|
25311
|
-
{
|
25312
|
-
"name": "name",
|
25313
|
-
"type": {
|
25314
|
-
"text": "string"
|
25315
|
-
},
|
25316
|
-
"default": "''",
|
25317
|
-
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
25318
|
-
"fieldName": "name",
|
25319
|
-
"inheritedFrom": {
|
25320
|
-
"name": "FormInternalsMixin",
|
25321
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25322
|
-
}
|
25323
|
-
},
|
25324
|
-
{
|
25325
|
-
"name": "value",
|
25326
|
-
"type": {
|
25327
|
-
"text": "string"
|
25328
|
-
},
|
25329
|
-
"default": "''",
|
25330
|
-
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
25331
|
-
"fieldName": "value",
|
25332
|
-
"inheritedFrom": {
|
25333
|
-
"name": "FormInternalsMixin",
|
25334
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25335
|
-
}
|
25336
|
-
},
|
25337
|
-
{
|
25338
|
-
"name": "validation-message",
|
25339
|
-
"type": {
|
25340
|
-
"text": "string | undefined"
|
25341
|
-
},
|
25342
|
-
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
25343
|
-
"fieldName": "validationMessage",
|
25344
|
-
"inheritedFrom": {
|
25345
|
-
"name": "FormInternalsMixin",
|
25346
|
-
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25347
|
-
}
|
25348
|
-
},
|
25349
|
-
{
|
25350
|
-
"name": "data-aria-label",
|
25351
|
-
"type": {
|
25352
|
-
"text": "string | null"
|
25353
|
-
},
|
25354
|
-
"default": "null",
|
25355
|
-
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
25356
|
-
"fieldName": "dataAriaLabel",
|
25357
|
-
"inheritedFrom": {
|
25358
|
-
"name": "DataAriaLabelMixin",
|
25359
|
-
"module": "src/utils/mixins/DataAriaLabelMixin.ts"
|
25360
|
-
}
|
25361
|
-
},
|
25362
|
-
{
|
25363
|
-
"name": "placeholder",
|
25364
|
-
"type": {
|
25365
|
-
"text": "string"
|
25366
|
-
},
|
25367
|
-
"default": "''",
|
25368
|
-
"description": "The placeholder text that is displayed when the input field is empty.",
|
25369
|
-
"fieldName": "placeholder",
|
25370
|
-
"inheritedFrom": {
|
25371
|
-
"name": "Input",
|
25372
|
-
"module": "src/components/input/input.component.ts"
|
25373
|
-
}
|
25374
|
-
},
|
26193
|
+
"events": [
|
25375
26194
|
{
|
25376
|
-
"name": "readonly",
|
25377
26195
|
"type": {
|
25378
|
-
"text": "
|
25379
|
-
},
|
25380
|
-
"default": "false",
|
25381
|
-
"description": "readonly attribute of the input field. If true, the input field is read-only.",
|
25382
|
-
"fieldName": "readonly",
|
25383
|
-
"inheritedFrom": {
|
25384
|
-
"name": "Input",
|
25385
|
-
"module": "src/components/input/input.component.ts"
|
26196
|
+
"text": "EventConstructor"
|
25386
26197
|
}
|
25387
26198
|
},
|
25388
26199
|
{
|
25389
|
-
"
|
25390
|
-
"
|
25391
|
-
|
25392
|
-
},
|
25393
|
-
"description": "The prefix text that is displayed before the input field. It has a max length of 10 characters.\nWhen the prefix text is set, make sure to set the 'data-aria-label'\nattribute with the appropriate value for accessibility.",
|
25394
|
-
"fieldName": "prefixText",
|
25395
|
-
"inheritedFrom": {
|
25396
|
-
"name": "Input",
|
25397
|
-
"module": "src/components/input/input.component.ts"
|
25398
|
-
}
|
26200
|
+
"description": "(React: onChange) Event that gets dispatched when the radio state changes.",
|
26201
|
+
"name": "change",
|
26202
|
+
"reactName": "onChange"
|
25399
26203
|
},
|
25400
26204
|
{
|
25401
|
-
"
|
25402
|
-
"
|
25403
|
-
|
25404
|
-
|
25405
|
-
|
25406
|
-
|
25407
|
-
"inheritedFrom": {
|
25408
|
-
"name": "Input",
|
25409
|
-
"module": "src/components/input/input.component.ts"
|
25410
|
-
}
|
25411
|
-
},
|
26205
|
+
"description": "(React: onFocus) Event that gets dispatched when the radio receives focus.",
|
26206
|
+
"name": "focus",
|
26207
|
+
"reactName": "onFocus"
|
26208
|
+
}
|
26209
|
+
],
|
26210
|
+
"attributes": [
|
25412
26211
|
{
|
25413
|
-
"name": "
|
26212
|
+
"name": "checked",
|
25414
26213
|
"type": {
|
25415
26214
|
"text": "boolean"
|
25416
26215
|
},
|
25417
26216
|
"default": "false",
|
25418
|
-
"description": "
|
25419
|
-
"fieldName": "
|
25420
|
-
"inheritedFrom": {
|
25421
|
-
"name": "Input",
|
25422
|
-
"module": "src/components/input/input.component.ts"
|
25423
|
-
}
|
25424
|
-
},
|
25425
|
-
{
|
25426
|
-
"name": "maxlength",
|
25427
|
-
"type": {
|
25428
|
-
"text": "number | undefined"
|
25429
|
-
},
|
25430
|
-
"description": "The maximum number of characters that the input field can accept.",
|
25431
|
-
"fieldName": "maxlength",
|
25432
|
-
"inheritedFrom": {
|
25433
|
-
"name": "Input",
|
25434
|
-
"module": "src/components/input/input.component.ts"
|
25435
|
-
}
|
25436
|
-
},
|
25437
|
-
{
|
25438
|
-
"name": "minlength",
|
25439
|
-
"type": {
|
25440
|
-
"text": "number | undefined"
|
25441
|
-
},
|
25442
|
-
"description": "The minimum number of characters that the input field can accept.",
|
25443
|
-
"fieldName": "minlength",
|
25444
|
-
"inheritedFrom": {
|
25445
|
-
"name": "Input",
|
25446
|
-
"module": "src/components/input/input.component.ts"
|
25447
|
-
}
|
25448
|
-
},
|
25449
|
-
{
|
25450
|
-
"name": "autocapitalize",
|
25451
|
-
"type": {
|
25452
|
-
"text": "AutoCapitalizeType"
|
25453
|
-
},
|
25454
|
-
"description": "The autocapitalize attribute of the input field.",
|
25455
|
-
"default": "'off'",
|
25456
|
-
"fieldName": "autocapitalize",
|
25457
|
-
"inheritedFrom": {
|
25458
|
-
"name": "Input",
|
25459
|
-
"module": "src/components/input/input.component.ts"
|
25460
|
-
}
|
25461
|
-
},
|
25462
|
-
{
|
25463
|
-
"name": "autocomplete",
|
25464
|
-
"type": {
|
25465
|
-
"text": "AutoCompleteType"
|
25466
|
-
},
|
25467
|
-
"description": "The autocomplete attribute of the input field.",
|
25468
|
-
"default": "'off'",
|
25469
|
-
"fieldName": "autocomplete",
|
25470
|
-
"inheritedFrom": {
|
25471
|
-
"name": "Input",
|
25472
|
-
"module": "src/components/input/input.component.ts"
|
25473
|
-
}
|
26217
|
+
"description": "Determines whether the radio is selected or unselected.",
|
26218
|
+
"fieldName": "checked"
|
25474
26219
|
},
|
25475
26220
|
{
|
25476
|
-
"name": "
|
26221
|
+
"name": "readonly",
|
25477
26222
|
"type": {
|
25478
26223
|
"text": "boolean"
|
25479
26224
|
},
|
25480
26225
|
"default": "false",
|
25481
|
-
"description": "
|
25482
|
-
"fieldName": "
|
25483
|
-
"inheritedFrom": {
|
25484
|
-
"name": "Input",
|
25485
|
-
"module": "src/components/input/input.component.ts"
|
25486
|
-
}
|
26226
|
+
"description": "Determines whether the radio is read-only.",
|
26227
|
+
"fieldName": "readonly"
|
25487
26228
|
},
|
25488
26229
|
{
|
25489
|
-
"name": "
|
26230
|
+
"name": "autofocus",
|
25490
26231
|
"type": {
|
25491
|
-
"text": "
|
26232
|
+
"text": "boolean"
|
25492
26233
|
},
|
25493
|
-
"
|
25494
|
-
"
|
25495
|
-
"
|
25496
|
-
"name": "Input",
|
25497
|
-
"module": "src/components/input/input.component.ts"
|
25498
|
-
}
|
26234
|
+
"default": "false",
|
26235
|
+
"description": "Automatically focus on the element when the page loads.\n[MDN Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus)",
|
26236
|
+
"fieldName": "autofocus"
|
25499
26237
|
},
|
25500
26238
|
{
|
25501
|
-
"name": "
|
26239
|
+
"name": "name",
|
25502
26240
|
"type": {
|
25503
|
-
"text": "string
|
26241
|
+
"text": "string"
|
25504
26242
|
},
|
25505
|
-
"
|
25506
|
-
"
|
26243
|
+
"default": "''",
|
26244
|
+
"description": "Indicates the name of the component group.\nThey are used to group elements in a form together.",
|
26245
|
+
"fieldName": "name",
|
25507
26246
|
"inheritedFrom": {
|
25508
|
-
"name": "
|
25509
|
-
"module": "src/
|
26247
|
+
"name": "FormInternalsMixin",
|
26248
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25510
26249
|
}
|
25511
26250
|
},
|
25512
26251
|
{
|
25513
|
-
"name": "
|
26252
|
+
"name": "value",
|
25514
26253
|
"type": {
|
25515
|
-
"text": "string
|
26254
|
+
"text": "string"
|
25516
26255
|
},
|
25517
|
-
"
|
25518
|
-
"
|
26256
|
+
"default": "''",
|
26257
|
+
"description": "Indicates the value of the component group (ex: input, checkbox, radio, select etc...)",
|
26258
|
+
"fieldName": "value",
|
25519
26259
|
"inheritedFrom": {
|
25520
|
-
"name": "
|
25521
|
-
"module": "src/
|
26260
|
+
"name": "FormInternalsMixin",
|
26261
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25522
26262
|
}
|
25523
26263
|
},
|
25524
26264
|
{
|
25525
|
-
"name": "
|
26265
|
+
"name": "validation-message",
|
25526
26266
|
"type": {
|
25527
|
-
"text": "
|
26267
|
+
"text": "string | undefined"
|
25528
26268
|
},
|
25529
|
-
"description": "
|
25530
|
-
"
|
25531
|
-
"fieldName": "size",
|
26269
|
+
"description": "Custom validation message that will override the default message and displayed when the input is invalid.",
|
26270
|
+
"fieldName": "validationMessage",
|
25532
26271
|
"inheritedFrom": {
|
25533
|
-
"name": "
|
25534
|
-
"module": "src/
|
26272
|
+
"name": "FormInternalsMixin",
|
26273
|
+
"module": "src/utils/mixins/FormInternalsMixin.ts"
|
25535
26274
|
}
|
25536
26275
|
},
|
25537
26276
|
{
|
25538
|
-
"name": "
|
26277
|
+
"name": "data-aria-label",
|
25539
26278
|
"type": {
|
25540
|
-
"text": "string"
|
26279
|
+
"text": "string | null"
|
25541
26280
|
},
|
25542
|
-
"default": "
|
25543
|
-
"description": "
|
25544
|
-
"fieldName": "
|
26281
|
+
"default": "null",
|
26282
|
+
"description": "Defines a string value that labels the current element.\nThe Aria-Label attribute to be set for accessibility.",
|
26283
|
+
"fieldName": "dataAriaLabel",
|
25545
26284
|
"inheritedFrom": {
|
25546
|
-
"name": "
|
25547
|
-
"module": "src/
|
26285
|
+
"name": "DataAriaLabelMixin",
|
26286
|
+
"module": "src/utils/mixins/DataAriaLabelMixin.ts"
|
25548
26287
|
}
|
25549
26288
|
},
|
25550
26289
|
{
|
@@ -25621,185 +26360,62 @@
|
|
25621
26360
|
"name": "FormfieldWrapper",
|
25622
26361
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25623
26362
|
}
|
25624
|
-
}
|
25625
|
-
],
|
25626
|
-
"cssProperties": [
|
25627
|
-
{
|
25628
|
-
"description": "Border color for the input container when disabled",
|
25629
|
-
"name": "--mdc-input-disabled-border-color",
|
25630
|
-
"inheritedFrom": {
|
25631
|
-
"name": "Input",
|
25632
|
-
"module": "src/components/input/input.component.ts"
|
25633
|
-
}
|
25634
|
-
},
|
25635
|
-
{
|
25636
|
-
"description": "Text color for the input field when disabled",
|
25637
|
-
"name": "--mdc-input-disabled-text-color",
|
25638
|
-
"inheritedFrom": {
|
25639
|
-
"name": "Input",
|
25640
|
-
"module": "src/components/input/input.component.ts"
|
25641
|
-
}
|
25642
|
-
},
|
25643
|
-
{
|
25644
|
-
"description": "Background color for the input field when disabled",
|
25645
|
-
"name": "--mdc-input-disabled-background-color",
|
25646
|
-
"inheritedFrom": {
|
25647
|
-
"name": "Input",
|
25648
|
-
"module": "src/components/input/input.component.ts"
|
25649
|
-
}
|
25650
|
-
},
|
25651
|
-
{
|
25652
|
-
"description": "Border color for the input container",
|
25653
|
-
"name": "--mdc-input-border-color",
|
25654
|
-
"inheritedFrom": {
|
25655
|
-
"name": "Input",
|
25656
|
-
"module": "src/components/input/input.component.ts"
|
25657
|
-
}
|
25658
|
-
},
|
25659
|
-
{
|
25660
|
-
"description": "Text color for the input field",
|
25661
|
-
"name": "--mdc-input-text-color",
|
25662
|
-
"inheritedFrom": {
|
25663
|
-
"name": "Input",
|
25664
|
-
"module": "src/components/input/input.component.ts"
|
25665
|
-
}
|
25666
|
-
},
|
25667
|
-
{
|
25668
|
-
"description": "Background color for the input field",
|
25669
|
-
"name": "--mdc-input-background-color",
|
25670
|
-
"inheritedFrom": {
|
25671
|
-
"name": "Input",
|
25672
|
-
"module": "src/components/input/input.component.ts"
|
25673
|
-
}
|
25674
|
-
},
|
25675
|
-
{
|
25676
|
-
"description": "Background color for the selected text",
|
25677
|
-
"name": "--mdc-input-selection-background-color",
|
25678
|
-
"inheritedFrom": {
|
25679
|
-
"name": "Input",
|
25680
|
-
"module": "src/components/input/input.component.ts"
|
25681
|
-
}
|
25682
|
-
},
|
25683
|
-
{
|
25684
|
-
"description": "Text color for the selected text",
|
25685
|
-
"name": "--mdc-input-selection-text-color",
|
25686
|
-
"inheritedFrom": {
|
25687
|
-
"name": "Input",
|
25688
|
-
"module": "src/components/input/input.component.ts"
|
25689
|
-
}
|
25690
|
-
},
|
25691
|
-
{
|
25692
|
-
"description": "Text color for the help text",
|
25693
|
-
"name": "--mdc-input-support-text-color",
|
25694
|
-
"inheritedFrom": {
|
25695
|
-
"name": "Input",
|
25696
|
-
"module": "src/components/input/input.component.ts"
|
25697
|
-
}
|
25698
|
-
},
|
25699
|
-
{
|
25700
|
-
"description": "Background color for the input field when hovered",
|
25701
|
-
"name": "--mdc-input-hover-background-color",
|
25702
|
-
"inheritedFrom": {
|
25703
|
-
"name": "Input",
|
25704
|
-
"module": "src/components/input/input.component.ts"
|
25705
|
-
}
|
25706
|
-
},
|
25707
|
-
{
|
25708
|
-
"description": "Background color for the input field when focused",
|
25709
|
-
"name": "--mdc-input-focused-background-color",
|
25710
|
-
"inheritedFrom": {
|
25711
|
-
"name": "Input",
|
25712
|
-
"module": "src/components/input/input.component.ts"
|
25713
|
-
}
|
25714
|
-
},
|
25715
|
-
{
|
25716
|
-
"description": "Border color for the input container when focused",
|
25717
|
-
"name": "--mdc-input-focused-border-color",
|
25718
|
-
"inheritedFrom": {
|
25719
|
-
"name": "Input",
|
25720
|
-
"module": "src/components/input/input.component.ts"
|
25721
|
-
}
|
25722
|
-
},
|
25723
|
-
{
|
25724
|
-
"description": "Border color for the input container when error",
|
25725
|
-
"name": "--mdc-input-error-border-color",
|
25726
|
-
"inheritedFrom": {
|
25727
|
-
"name": "Input",
|
25728
|
-
"module": "src/components/input/input.component.ts"
|
25729
|
-
}
|
25730
|
-
},
|
25731
|
-
{
|
25732
|
-
"description": "Border color for the input container when warning",
|
25733
|
-
"name": "--mdc-input-warning-border-color",
|
25734
|
-
"inheritedFrom": {
|
25735
|
-
"name": "Input",
|
25736
|
-
"module": "src/components/input/input.component.ts"
|
25737
|
-
}
|
25738
|
-
},
|
25739
|
-
{
|
25740
|
-
"description": "Border color for the input container when success",
|
25741
|
-
"name": "--mdc-input-success-border-color",
|
25742
|
-
"inheritedFrom": {
|
25743
|
-
"name": "Input",
|
25744
|
-
"module": "src/components/input/input.component.ts"
|
25745
|
-
}
|
25746
26363
|
},
|
25747
26364
|
{
|
25748
|
-
"
|
25749
|
-
"name": "--mdc-input-primary-border-color",
|
25750
|
-
"inheritedFrom": {
|
25751
|
-
"name": "Input",
|
25752
|
-
"module": "src/components/input/input.component.ts"
|
25753
|
-
}
|
25754
|
-
}
|
25755
|
-
],
|
25756
|
-
"events": [
|
25757
|
-
{
|
26365
|
+
"name": "toggletip-text",
|
25758
26366
|
"type": {
|
25759
|
-
"text": "
|
26367
|
+
"text": "string | undefined"
|
25760
26368
|
},
|
26369
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
26370
|
+
"fieldName": "toggletipText",
|
25761
26371
|
"inheritedFrom": {
|
25762
|
-
"name": "
|
25763
|
-
"module": "src/components/
|
26372
|
+
"name": "FormfieldWrapper",
|
26373
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25764
26374
|
}
|
25765
26375
|
},
|
25766
26376
|
{
|
25767
|
-
"
|
25768
|
-
"
|
25769
|
-
|
26377
|
+
"name": "toggletip-placement",
|
26378
|
+
"type": {
|
26379
|
+
"text": "PopoverPlacement"
|
26380
|
+
},
|
26381
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
26382
|
+
"default": "'top'",
|
26383
|
+
"fieldName": "toggletipPlacement",
|
25770
26384
|
"inheritedFrom": {
|
25771
|
-
"name": "
|
25772
|
-
"module": "src/components/
|
26385
|
+
"name": "FormfieldWrapper",
|
26386
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25773
26387
|
}
|
25774
26388
|
},
|
25775
26389
|
{
|
25776
|
-
"
|
25777
|
-
"
|
25778
|
-
|
26390
|
+
"name": "info-icon-aria-label",
|
26391
|
+
"type": {
|
26392
|
+
"text": "string | undefined"
|
26393
|
+
},
|
26394
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
26395
|
+
"fieldName": "infoIconAriaLabel",
|
25779
26396
|
"inheritedFrom": {
|
25780
|
-
"name": "
|
25781
|
-
"module": "src/components/
|
26397
|
+
"name": "FormfieldWrapper",
|
26398
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25782
26399
|
}
|
25783
|
-
}
|
26400
|
+
}
|
26401
|
+
],
|
26402
|
+
"mixins": [
|
25784
26403
|
{
|
25785
|
-
"
|
25786
|
-
"
|
25787
|
-
"reactName": "onFocus",
|
25788
|
-
"inheritedFrom": {
|
25789
|
-
"name": "Input",
|
25790
|
-
"module": "src/components/input/input.component.ts"
|
25791
|
-
}
|
26404
|
+
"name": "FormInternalsMixin",
|
26405
|
+
"module": "/src/utils/mixins/FormInternalsMixin"
|
25792
26406
|
},
|
25793
26407
|
{
|
25794
|
-
"
|
25795
|
-
"
|
25796
|
-
"reactName": "onBlur",
|
25797
|
-
"inheritedFrom": {
|
25798
|
-
"name": "Input",
|
25799
|
-
"module": "src/components/input/input.component.ts"
|
25800
|
-
}
|
26408
|
+
"name": "DataAriaLabelMixin",
|
26409
|
+
"module": "/src/utils/mixins/DataAriaLabelMixin"
|
25801
26410
|
}
|
25802
|
-
]
|
26411
|
+
],
|
26412
|
+
"superclass": {
|
26413
|
+
"name": "FormfieldWrapper",
|
26414
|
+
"module": "/src/components/formfieldwrapper/formfieldwrapper.component"
|
26415
|
+
},
|
26416
|
+
"tagName": "mdc-radio",
|
26417
|
+
"jsDoc": "/**\n * Radio allow users to select single options from a list or turn an item/feature on or off.\n * These are often used in forms, settings, and selection in lists.\n *\n * A radio component contains an optional label, optional info icon and an optional helper text.\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-staticradio\n * @dependency mdc-toggletip\n *\n * @tagname mdc-radio\n *\n * @event change - (React: onChange) Event that gets dispatched when the radio state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the radio receives focus.\n *\n * @cssproperty --mdc-radio-text-disabled-color - color of the label when disabled\n * @cssproperty --mdc-radio-control-inactive-hover - color of the radio button when inactive and hovered\n * @cssproperty --mdc-radio-control-inactive-pressed-color - color of the radio button when inactive and pressed\n * @cssproperty --mdc-radio-control-active-hover-color - color of the radio button when active and hovered\n * @cssproperty --mdc-radio-control-active-pressed-color - color of the radio button when active and pressed\n * @cssproperty --mdc-radio-disabled-border-color - color of the radio button when disabled\n * @cssproperty --mdc-radio-control-active-disabled-background - color of the radio button when active and disabled\n * @cssproperty --mdc-radio-control-inactive-disabled-background - color of the radio button when inactive and disabled\n *\n */",
|
26418
|
+
"customElement": true
|
25803
26419
|
}
|
25804
26420
|
],
|
25805
26421
|
"exports": [
|
@@ -25807,8 +26423,8 @@
|
|
25807
26423
|
"kind": "js",
|
25808
26424
|
"name": "default",
|
25809
26425
|
"declaration": {
|
25810
|
-
"name": "
|
25811
|
-
"module": "components/
|
26426
|
+
"name": "Radio",
|
26427
|
+
"module": "components/radio/radio.component.js"
|
25812
26428
|
}
|
25813
26429
|
}
|
25814
26430
|
]
|
@@ -25825,14 +26441,6 @@
|
|
25825
26441
|
{
|
25826
26442
|
"description": "This is a default/unnamed slot for options and/or option group.",
|
25827
26443
|
"name": "default"
|
25828
|
-
},
|
25829
|
-
{
|
25830
|
-
"description": "slot to add the label info icon",
|
25831
|
-
"name": "label-info",
|
25832
|
-
"inheritedFrom": {
|
25833
|
-
"name": "FormfieldWrapper",
|
25834
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
25835
|
-
}
|
25836
26444
|
}
|
25837
26445
|
],
|
25838
26446
|
"members": [
|
@@ -26096,6 +26704,7 @@
|
|
26096
26704
|
"parameters": [
|
26097
26705
|
{
|
26098
26706
|
"name": "target",
|
26707
|
+
"optional": true,
|
26099
26708
|
"type": {
|
26100
26709
|
"text": "EventTarget | null"
|
26101
26710
|
}
|
@@ -26384,6 +26993,49 @@
|
|
26384
26993
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
26385
26994
|
}
|
26386
26995
|
},
|
26996
|
+
{
|
26997
|
+
"kind": "field",
|
26998
|
+
"name": "toggletipText",
|
26999
|
+
"type": {
|
27000
|
+
"text": "string | undefined"
|
27001
|
+
},
|
27002
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
27003
|
+
"attribute": "toggletip-text",
|
27004
|
+
"reflects": true,
|
27005
|
+
"inheritedFrom": {
|
27006
|
+
"name": "FormfieldWrapper",
|
27007
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
27008
|
+
}
|
27009
|
+
},
|
27010
|
+
{
|
27011
|
+
"kind": "field",
|
27012
|
+
"name": "toggletipPlacement",
|
27013
|
+
"type": {
|
27014
|
+
"text": "PopoverPlacement"
|
27015
|
+
},
|
27016
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
27017
|
+
"default": "'top'",
|
27018
|
+
"attribute": "toggletip-placement",
|
27019
|
+
"reflects": true,
|
27020
|
+
"inheritedFrom": {
|
27021
|
+
"name": "FormfieldWrapper",
|
27022
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
27023
|
+
}
|
27024
|
+
},
|
27025
|
+
{
|
27026
|
+
"kind": "field",
|
27027
|
+
"name": "infoIconAriaLabel",
|
27028
|
+
"type": {
|
27029
|
+
"text": "string | undefined"
|
27030
|
+
},
|
27031
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
27032
|
+
"attribute": "info-icon-aria-label",
|
27033
|
+
"reflects": true,
|
27034
|
+
"inheritedFrom": {
|
27035
|
+
"name": "FormfieldWrapper",
|
27036
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
27037
|
+
}
|
27038
|
+
},
|
26387
27039
|
{
|
26388
27040
|
"kind": "method",
|
26389
27041
|
"name": "renderLabelElement",
|
@@ -26637,6 +27289,43 @@
|
|
26637
27289
|
"name": "FormfieldWrapper",
|
26638
27290
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
26639
27291
|
}
|
27292
|
+
},
|
27293
|
+
{
|
27294
|
+
"name": "toggletip-text",
|
27295
|
+
"type": {
|
27296
|
+
"text": "string | undefined"
|
27297
|
+
},
|
27298
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
27299
|
+
"fieldName": "toggletipText",
|
27300
|
+
"inheritedFrom": {
|
27301
|
+
"name": "FormfieldWrapper",
|
27302
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
27303
|
+
}
|
27304
|
+
},
|
27305
|
+
{
|
27306
|
+
"name": "toggletip-placement",
|
27307
|
+
"type": {
|
27308
|
+
"text": "PopoverPlacement"
|
27309
|
+
},
|
27310
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
27311
|
+
"default": "'top'",
|
27312
|
+
"fieldName": "toggletipPlacement",
|
27313
|
+
"inheritedFrom": {
|
27314
|
+
"name": "FormfieldWrapper",
|
27315
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
27316
|
+
}
|
27317
|
+
},
|
27318
|
+
{
|
27319
|
+
"name": "info-icon-aria-label",
|
27320
|
+
"type": {
|
27321
|
+
"text": "string | undefined"
|
27322
|
+
},
|
27323
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
27324
|
+
"fieldName": "infoIconAriaLabel",
|
27325
|
+
"inheritedFrom": {
|
27326
|
+
"name": "FormfieldWrapper",
|
27327
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
27328
|
+
}
|
26640
27329
|
}
|
26641
27330
|
],
|
26642
27331
|
"mixins": [
|
@@ -26654,7 +27343,7 @@
|
|
26654
27343
|
"module": "/src/components/formfieldwrapper/formfieldwrapper.component"
|
26655
27344
|
},
|
26656
27345
|
"tagName": "mdc-select",
|
26657
|
-
"jsDoc": "/**\n * The mdc-select component is a dropdown selection control that allows users to pick an option from a predefined list.\n * It is designed to work with `mdc-option` for individual options and `mdc-optgroup` for grouping related options.\n * The component ensures accessibility and usability while handling various use cases,\n * including long text truncation with tooltip support.\n *\n * @dependency mdc-icon\n * @dependency mdc-popover\n * @dependency mdc-text\n *\n * @tagname mdc-select\n *\n * @slot default - This is a default/unnamed slot for options and/or option group.\n *\n * @event click - (React: onClick) This event is dispatched when the select is clicked.\n * @event change - (React: onChange) This event is dispatched when the select is changed.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the select.\n * @event focus - (React: onFocus) This event is dispatched when the select receives focus.\n */",
|
27346
|
+
"jsDoc": "/**\n * The mdc-select component is a dropdown selection control that allows users to pick an option from a predefined list.\n * It is designed to work with `mdc-option` for individual options and `mdc-optgroup` for grouping related options.\n * The component ensures accessibility and usability while handling various use cases,\n * including long text truncation with tooltip support.\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-popover\n * @dependency mdc-text\n * @dependency mdc-toggletip\n *\n * @tagname mdc-select\n *\n * @slot default - This is a default/unnamed slot for options and/or option group.\n *\n * @event click - (React: onClick) This event is dispatched when the select is clicked.\n * @event change - (React: onChange) This event is dispatched when the select is changed.\n * @event keydown - (React: onKeyDown) This event is dispatched when a key is pressed down on the select.\n * @event focus - (React: onFocus) This event is dispatched when the select receives focus.\n */",
|
26658
27347
|
"customElement": true
|
26659
27348
|
}
|
26660
27349
|
],
|
@@ -28723,6 +29412,49 @@
|
|
28723
29412
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
28724
29413
|
}
|
28725
29414
|
},
|
29415
|
+
{
|
29416
|
+
"kind": "field",
|
29417
|
+
"name": "toggletipText",
|
29418
|
+
"type": {
|
29419
|
+
"text": "string | undefined"
|
29420
|
+
},
|
29421
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
29422
|
+
"attribute": "toggletip-text",
|
29423
|
+
"reflects": true,
|
29424
|
+
"inheritedFrom": {
|
29425
|
+
"name": "FormfieldWrapper",
|
29426
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
29427
|
+
}
|
29428
|
+
},
|
29429
|
+
{
|
29430
|
+
"kind": "field",
|
29431
|
+
"name": "toggletipPlacement",
|
29432
|
+
"type": {
|
29433
|
+
"text": "PopoverPlacement"
|
29434
|
+
},
|
29435
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
29436
|
+
"default": "'top'",
|
29437
|
+
"attribute": "toggletip-placement",
|
29438
|
+
"reflects": true,
|
29439
|
+
"inheritedFrom": {
|
29440
|
+
"name": "FormfieldWrapper",
|
29441
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
29442
|
+
}
|
29443
|
+
},
|
29444
|
+
{
|
29445
|
+
"kind": "field",
|
29446
|
+
"name": "infoIconAriaLabel",
|
29447
|
+
"type": {
|
29448
|
+
"text": "string | undefined"
|
29449
|
+
},
|
29450
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
29451
|
+
"attribute": "info-icon-aria-label",
|
29452
|
+
"reflects": true,
|
29453
|
+
"inheritedFrom": {
|
29454
|
+
"name": "FormfieldWrapper",
|
29455
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
29456
|
+
}
|
29457
|
+
},
|
28726
29458
|
{
|
28727
29459
|
"kind": "method",
|
28728
29460
|
"name": "renderLabelElement",
|
@@ -29057,6 +29789,43 @@
|
|
29057
29789
|
"name": "FormfieldWrapper",
|
29058
29790
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29059
29791
|
}
|
29792
|
+
},
|
29793
|
+
{
|
29794
|
+
"name": "toggletip-text",
|
29795
|
+
"type": {
|
29796
|
+
"text": "string | undefined"
|
29797
|
+
},
|
29798
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
29799
|
+
"fieldName": "toggletipText",
|
29800
|
+
"inheritedFrom": {
|
29801
|
+
"name": "FormfieldWrapper",
|
29802
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29803
|
+
}
|
29804
|
+
},
|
29805
|
+
{
|
29806
|
+
"name": "toggletip-placement",
|
29807
|
+
"type": {
|
29808
|
+
"text": "PopoverPlacement"
|
29809
|
+
},
|
29810
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
29811
|
+
"default": "'top'",
|
29812
|
+
"fieldName": "toggletipPlacement",
|
29813
|
+
"inheritedFrom": {
|
29814
|
+
"name": "FormfieldWrapper",
|
29815
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29816
|
+
}
|
29817
|
+
},
|
29818
|
+
{
|
29819
|
+
"name": "info-icon-aria-label",
|
29820
|
+
"type": {
|
29821
|
+
"text": "string | undefined"
|
29822
|
+
},
|
29823
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
29824
|
+
"fieldName": "infoIconAriaLabel",
|
29825
|
+
"inheritedFrom": {
|
29826
|
+
"name": "FormfieldWrapper",
|
29827
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29828
|
+
}
|
29060
29829
|
}
|
29061
29830
|
],
|
29062
29831
|
"mixins": [
|
@@ -29074,18 +29843,8 @@
|
|
29074
29843
|
"module": "/src/components/formfieldwrapper"
|
29075
29844
|
},
|
29076
29845
|
"tagName": "mdc-textarea",
|
29077
|
-
"jsDoc": "/**\n * mdc-textarea component, which is used to get the multi-line text input from the user.\n * It contains:\n * - label: It is the title of the textarea field.\n * - required: A boolean attribute depicting that the textarea field is required.\n * - Textarea: It is the multi-line text input field.\n * - helper-text: It is the text that provides additional information about the textarea field.\n * - max-character-limit: It is the text that shows the character count of the textarea field.\n * - Error, Warning, Success, Priority Help Text type: It is the text that provides additional information\n * about the textarea field based on the validation state.\n * - limitexceeded: It is the event that is dispatched when the character limit exceeds or restored.\n * This event exposes 3 properties:\n * - currentCharacterCount - the current number of characters in the textarea field,\n * - maxCharacterLimit - the maximum number of characters allowed in the textarea field,\n * - value - the current value of the textarea field,\n *\n * **Note**: Consumers must set the help-text-type with 'error' and\n * help-text attribute with the error message using limitexceeded event.\n * The same help-text value will be used for the validation message to be displayed.\n *\n * @tagname mdc-textarea\n *\n * @event input - (React: onInput) This event is dispatched when the value of the textarea field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the textarea field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the textarea receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the textarea loses focus.\n * @event limitexceeded - (React: onLimitExceeded) This event is dispatched once when the character limit\n * exceeds or restored.\n *\n
|
29078
|
-
"customElement": true
|
29079
|
-
"slots": [
|
29080
|
-
{
|
29081
|
-
"description": "slot to add the label info icon",
|
29082
|
-
"name": "label-info",
|
29083
|
-
"inheritedFrom": {
|
29084
|
-
"name": "FormfieldWrapper",
|
29085
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29086
|
-
}
|
29087
|
-
}
|
29088
|
-
]
|
29846
|
+
"jsDoc": "/**\n * mdc-textarea component, which is used to get the multi-line text input from the user.\n * It contains:\n * - label: It is the title of the textarea field.\n * - required: A boolean attribute depicting that the textarea field is required.\n * - Textarea: It is the multi-line text input field.\n * - helper-text: It is the text that provides additional information about the textarea field.\n * - max-character-limit: It is the text that shows the character count of the textarea field.\n * - Error, Warning, Success, Priority Help Text type: It is the text that provides additional information\n * about the textarea field based on the validation state.\n * - limitexceeded: It is the event that is dispatched when the character limit exceeds or restored.\n * This event exposes 3 properties:\n * - currentCharacterCount - the current number of characters in the textarea field,\n * - maxCharacterLimit - the maximum number of characters allowed in the textarea field,\n * - value - the current value of the textarea field,\n *\n * **Note**: Consumers must set the help-text-type with 'error' and\n * help-text attribute with the error message using limitexceeded event.\n * The same help-text value will be used for the validation message to be displayed.\n *\n * @tagname mdc-textarea\n *\n * @event input - (React: onInput) This event is dispatched when the value of the textarea field changes (every press).\n * @event change - (React: onChange) This event is dispatched when the value of the textarea field changes (on blur).\n * @event focus - (React: onFocus) This event is dispatched when the textarea receives focus.\n * @event blur - (React: onBlur) This event is dispatched when the textarea loses focus.\n * @event limitexceeded - (React: onLimitExceeded) This event is dispatched once when the character limit\n * exceeds or restored.\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-text\n * @dependency mdc-toggletip\n *\n * @cssproperty --mdc-textarea-disabled-border-color - Border color for the textarea container when disabled\n * @cssproperty --mdc-textarea-disabled-text-color - Text color for the textarea field when disabled\n * @cssproperty --mdc-textarea-disabled-background-color - Background color for the textarea field when disabled\n * @cssproperty --mdc-textarea-text-color - Text color for the textarea field\n * @cssproperty --mdc-textarea-background-color - Background color for the textarea field\n * @cssproperty --mdc-textarea-border-color - Border color for the textarea field\n * @cssproperty --mdc-textarea-text-secondary-normal - Text color for the character counter\n * @cssproperty --mdc-textarea-error-border-color - Border color for the error related help text\n * @cssproperty --mdc-textarea-warning-border-color - Border color for the warning related help text\n * @cssproperty --mdc-textarea-success-border-color - Border color for the success related help text\n * @cssproperty --mdc-textarea-primary-border-color - Border color for the priority related help text\n * @cssproperty --mdc-textarea-hover-background-color - Background color for the textarea container when hover\n * @cssproperty --mdc-textarea-focused-background-color - Background color for the textarea container when focused\n * @cssproperty --mdc-textarea-focused-border-color - Border color for the textarea container when focused\n */",
|
29847
|
+
"customElement": true
|
29089
29848
|
}
|
29090
29849
|
],
|
29091
29850
|
"exports": [
|
@@ -29586,6 +30345,49 @@
|
|
29586
30345
|
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
29587
30346
|
}
|
29588
30347
|
},
|
30348
|
+
{
|
30349
|
+
"kind": "field",
|
30350
|
+
"name": "toggletipText",
|
30351
|
+
"type": {
|
30352
|
+
"text": "string | undefined"
|
30353
|
+
},
|
30354
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
30355
|
+
"attribute": "toggletip-text",
|
30356
|
+
"reflects": true,
|
30357
|
+
"inheritedFrom": {
|
30358
|
+
"name": "FormfieldWrapper",
|
30359
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
30360
|
+
}
|
30361
|
+
},
|
30362
|
+
{
|
30363
|
+
"kind": "field",
|
30364
|
+
"name": "toggletipPlacement",
|
30365
|
+
"type": {
|
30366
|
+
"text": "PopoverPlacement"
|
30367
|
+
},
|
30368
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
30369
|
+
"default": "'top'",
|
30370
|
+
"attribute": "toggletip-placement",
|
30371
|
+
"reflects": true,
|
30372
|
+
"inheritedFrom": {
|
30373
|
+
"name": "FormfieldWrapper",
|
30374
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
30375
|
+
}
|
30376
|
+
},
|
30377
|
+
{
|
30378
|
+
"kind": "field",
|
30379
|
+
"name": "infoIconAriaLabel",
|
30380
|
+
"type": {
|
30381
|
+
"text": "string | undefined"
|
30382
|
+
},
|
30383
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
30384
|
+
"attribute": "info-icon-aria-label",
|
30385
|
+
"reflects": true,
|
30386
|
+
"inheritedFrom": {
|
30387
|
+
"name": "FormfieldWrapper",
|
30388
|
+
"module": "components/formfieldwrapper/formfieldwrapper.component.js"
|
30389
|
+
}
|
30390
|
+
},
|
29589
30391
|
{
|
29590
30392
|
"kind": "method",
|
29591
30393
|
"name": "renderLabelElement",
|
@@ -29832,6 +30634,43 @@
|
|
29832
30634
|
"name": "FormfieldWrapper",
|
29833
30635
|
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29834
30636
|
}
|
30637
|
+
},
|
30638
|
+
{
|
30639
|
+
"name": "toggletip-text",
|
30640
|
+
"type": {
|
30641
|
+
"text": "string | undefined"
|
30642
|
+
},
|
30643
|
+
"description": "The toggletip text that is displayed when the label is hovered.\nIt is used to provide additional information about the label.",
|
30644
|
+
"fieldName": "toggletipText",
|
30645
|
+
"inheritedFrom": {
|
30646
|
+
"name": "FormfieldWrapper",
|
30647
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
30648
|
+
}
|
30649
|
+
},
|
30650
|
+
{
|
30651
|
+
"name": "toggletip-placement",
|
30652
|
+
"type": {
|
30653
|
+
"text": "PopoverPlacement"
|
30654
|
+
},
|
30655
|
+
"description": "The placement of the toggletip that is displayed when the info icon is hovered.",
|
30656
|
+
"default": "'top'",
|
30657
|
+
"fieldName": "toggletipPlacement",
|
30658
|
+
"inheritedFrom": {
|
30659
|
+
"name": "FormfieldWrapper",
|
30660
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
30661
|
+
}
|
30662
|
+
},
|
30663
|
+
{
|
30664
|
+
"name": "info-icon-aria-label",
|
30665
|
+
"type": {
|
30666
|
+
"text": "string | undefined"
|
30667
|
+
},
|
30668
|
+
"description": "Aria label for the info icon that is displayed next to the label when `toggletipText` is set.\nThis is used for accessibility purposes to provide a description of the icon.",
|
30669
|
+
"fieldName": "infoIconAriaLabel",
|
30670
|
+
"inheritedFrom": {
|
30671
|
+
"name": "FormfieldWrapper",
|
30672
|
+
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
30673
|
+
}
|
29835
30674
|
}
|
29836
30675
|
],
|
29837
30676
|
"mixins": [
|
@@ -29849,18 +30688,8 @@
|
|
29849
30688
|
"module": "/src/components/formfieldwrapper"
|
29850
30689
|
},
|
29851
30690
|
"tagName": "mdc-toggle",
|
29852
|
-
"jsDoc": "/**\n * Toggle Component is an interactive control used to switch between two mutually exclusive options,\n * such as On/Off, Active/Inactive. These are commonly used in settings panels, forms, and preference selections\n * where users need to enable or disable a feature.\n * It contains an optional label and an optional helper text.\n *\n * To create a group of toggles, use the FormFieldGroup component.\n *\n * Note: It internally renders a checkbox styled as a toggle switch.\n *\n * @dependency mdc-icon\n * @dependency mdc-statictoggle\n *\n * @tagname mdc-toggle\n *\n * @event change - (React: onChange) Event that gets dispatched when the toggle state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the toggle receives focus.\n *\n * @cssproperty --mdc-toggle-width - Width of the toggle\n * @cssproperty --mdc-toggle-height - Height of the toggle\n * @cssproperty --mdc-toggle-width-compact - Width of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-height-compact - Height of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-label-lineheight - Line height of the toggle label\n * @cssproperty --mdc-toggle-label-fontsize - Font size of the toggle label\n * @cssproperty --mdc-toggle-label-fontweight - Font weight of the toggle label\n * @cssproperty --mdc-toggle-label-color-disabled - Color of the toggle label and help text in disabled state\n * @cssproperty --mdc-toggle-help-text-color - Color of the help text label\n * @cssproperty --mdc-toggle-active-hover-color - Background color of the active toggle in hover state\n * @cssproperty --mdc-toggle-active-pressed-color - Background color of the active toggle in pressed state\n * @cssproperty --mdc-toggle-inactive-hover-color - Background color of the inactive toggle in hover state\n * @cssproperty --mdc-toggle-inactive-pressed-color - Background color of the inactive toggle in pressed state\n */",
|
29853
|
-
"customElement": true
|
29854
|
-
"slots": [
|
29855
|
-
{
|
29856
|
-
"description": "slot to add the label info icon",
|
29857
|
-
"name": "label-info",
|
29858
|
-
"inheritedFrom": {
|
29859
|
-
"name": "FormfieldWrapper",
|
29860
|
-
"module": "src/components/formfieldwrapper/formfieldwrapper.component.ts"
|
29861
|
-
}
|
29862
|
-
}
|
29863
|
-
]
|
30691
|
+
"jsDoc": "/**\n * Toggle Component is an interactive control used to switch between two mutually exclusive options,\n * such as On/Off, Active/Inactive. These are commonly used in settings panels, forms, and preference selections\n * where users need to enable or disable a feature.\n * It contains an optional label and an optional helper text.\n *\n * To create a group of toggles, use the FormFieldGroup component.\n *\n * Note: It internally renders a checkbox styled as a toggle switch.\n *\n * @dependency mdc-button\n * @dependency mdc-icon\n * @dependency mdc-statictoggle\n * @dependency mdc-text\n * @dependency mdc-toggletip\n *\n * @tagname mdc-toggle\n *\n * @event change - (React: onChange) Event that gets dispatched when the toggle state changes.\n * @event focus - (React: onFocus) Event that gets dispatched when the toggle receives focus.\n *\n * @cssproperty --mdc-toggle-width - Width of the toggle\n * @cssproperty --mdc-toggle-height - Height of the toggle\n * @cssproperty --mdc-toggle-width-compact - Width of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-height-compact - Height of the toggle when it's size is compact\n * @cssproperty --mdc-toggle-label-lineheight - Line height of the toggle label\n * @cssproperty --mdc-toggle-label-fontsize - Font size of the toggle label\n * @cssproperty --mdc-toggle-label-fontweight - Font weight of the toggle label\n * @cssproperty --mdc-toggle-label-color-disabled - Color of the toggle label and help text in disabled state\n * @cssproperty --mdc-toggle-help-text-color - Color of the help text label\n * @cssproperty --mdc-toggle-active-hover-color - Background color of the active toggle in hover state\n * @cssproperty --mdc-toggle-active-pressed-color - Background color of the active toggle in pressed state\n * @cssproperty --mdc-toggle-inactive-hover-color - Background color of the inactive toggle in hover state\n * @cssproperty --mdc-toggle-inactive-pressed-color - Background color of the inactive toggle in pressed state\n */",
|
30692
|
+
"customElement": true
|
29864
30693
|
}
|
29865
30694
|
],
|
29866
30695
|
"exports": [
|
@@ -29999,9 +30828,8 @@
|
|
29999
30828
|
"kind": "field",
|
30000
30829
|
"name": "screenreaderAnnouncerIdentity",
|
30001
30830
|
"type": {
|
30002
|
-
"text": "string"
|
30831
|
+
"text": "string | undefined"
|
30003
30832
|
},
|
30004
|
-
"default": "''",
|
30005
30833
|
"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.",
|
30006
30834
|
"attribute": "screenreader-announcer-identity",
|
30007
30835
|
"reflects": true
|
@@ -30812,10 +31640,10 @@
|
|
30812
31640
|
"kind": "field",
|
30813
31641
|
"name": "appendTo",
|
30814
31642
|
"type": {
|
30815
|
-
"text": "string"
|
31643
|
+
"text": "string | undefined"
|
30816
31644
|
},
|
30817
|
-
"default": "''",
|
30818
31645
|
"description": "Element ID that the popover append to.",
|
31646
|
+
"default": "''",
|
30819
31647
|
"attribute": "append-to",
|
30820
31648
|
"reflects": true,
|
30821
31649
|
"inheritedFrom": {
|
@@ -31140,9 +31968,8 @@
|
|
31140
31968
|
{
|
31141
31969
|
"name": "screenreader-announcer-identity",
|
31142
31970
|
"type": {
|
31143
|
-
"text": "string"
|
31971
|
+
"text": "string | undefined"
|
31144
31972
|
},
|
31145
|
-
"default": "''",
|
31146
31973
|
"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.",
|
31147
31974
|
"fieldName": "screenreaderAnnouncerIdentity"
|
31148
31975
|
},
|
@@ -31448,10 +32275,10 @@
|
|
31448
32275
|
{
|
31449
32276
|
"name": "append-to",
|
31450
32277
|
"type": {
|
31451
|
-
"text": "string"
|
32278
|
+
"text": "string | undefined"
|
31452
32279
|
},
|
31453
|
-
"default": "''",
|
31454
32280
|
"description": "Element ID that the popover append to.",
|
32281
|
+
"default": "''",
|
31455
32282
|
"fieldName": "appendTo",
|
31456
32283
|
"inheritedFrom": {
|
31457
32284
|
"name": "Popover",
|
@@ -32527,10 +33354,10 @@
|
|
32527
33354
|
"kind": "field",
|
32528
33355
|
"name": "appendTo",
|
32529
33356
|
"type": {
|
32530
|
-
"text": "string"
|
33357
|
+
"text": "string | undefined"
|
32531
33358
|
},
|
32532
|
-
"default": "''",
|
32533
33359
|
"description": "Element ID that the popover append to.",
|
33360
|
+
"default": "''",
|
32534
33361
|
"attribute": "append-to",
|
32535
33362
|
"reflects": true,
|
32536
33363
|
"inheritedFrom": {
|
@@ -33163,10 +33990,10 @@
|
|
33163
33990
|
{
|
33164
33991
|
"name": "append-to",
|
33165
33992
|
"type": {
|
33166
|
-
"text": "string"
|
33993
|
+
"text": "string | undefined"
|
33167
33994
|
},
|
33168
|
-
"default": "''",
|
33169
33995
|
"description": "Element ID that the popover append to.",
|
33996
|
+
"default": "''",
|
33170
33997
|
"fieldName": "appendTo",
|
33171
33998
|
"inheritedFrom": {
|
33172
33999
|
"name": "Popover",
|
@@ -33889,21 +34716,24 @@
|
|
33889
34716
|
"name": "footerLink",
|
33890
34717
|
"type": {
|
33891
34718
|
"text": "Array<HTMLElement> | undefined"
|
33892
|
-
}
|
34719
|
+
},
|
34720
|
+
"privacy": "protected"
|
33893
34721
|
},
|
33894
34722
|
{
|
33895
34723
|
"kind": "field",
|
33896
34724
|
"name": "footerButtonPrimary",
|
33897
34725
|
"type": {
|
33898
34726
|
"text": "Array<HTMLElement> | undefined"
|
33899
|
-
}
|
34727
|
+
},
|
34728
|
+
"privacy": "protected"
|
33900
34729
|
},
|
33901
34730
|
{
|
33902
34731
|
"kind": "field",
|
33903
34732
|
"name": "footerButtonSecondary",
|
33904
34733
|
"type": {
|
33905
34734
|
"text": "Array<HTMLElement> | undefined"
|
33906
|
-
}
|
34735
|
+
},
|
34736
|
+
"privacy": "protected"
|
33907
34737
|
},
|
33908
34738
|
{
|
33909
34739
|
"kind": "method",
|