@momentum-design/components 0.120.19 → 0.120.21
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 +174 -247
- package/dist/browser/index.js.map +3 -3
- package/dist/components/checkbox/checkbox.component.d.ts +8 -0
- package/dist/components/checkbox/checkbox.component.js +8 -0
- package/dist/components/checkbox/checkbox.styles.js +3 -3
- package/dist/components/combobox/combobox.component.d.ts +8 -6
- package/dist/components/combobox/combobox.component.js +8 -6
- package/dist/components/combobox/combobox.styles.js +5 -25
- package/dist/components/formfieldgroup/formfieldgroup.component.d.ts +9 -0
- package/dist/components/formfieldgroup/formfieldgroup.component.js +9 -0
- package/dist/components/formfieldwrapper/formfieldwrapper.component.d.ts +9 -0
- package/dist/components/formfieldwrapper/formfieldwrapper.component.js +9 -0
- package/dist/components/formfieldwrapper/formfieldwrapper.styles.d.ts +2 -2
- package/dist/components/formfieldwrapper/formfieldwrapper.styles.js +68 -66
- package/dist/components/input/input.component.d.ts +11 -13
- package/dist/components/input/input.component.js +11 -13
- package/dist/components/input/input.styles.js +33 -50
- package/dist/components/password/password.component.d.ts +31 -27
- package/dist/components/password/password.component.js +31 -27
- package/dist/components/progressbar/progressbar.component.d.ts +15 -20
- package/dist/components/progressbar/progressbar.component.js +16 -21
- package/dist/components/progressbar/progressbar.styles.js +7 -19
- package/dist/components/searchfield/searchfield.component.d.ts +30 -0
- package/dist/components/searchfield/searchfield.component.js +30 -0
- package/dist/components/select/select.component.d.ts +19 -21
- package/dist/components/select/select.component.js +19 -21
- package/dist/components/select/select.styles.js +14 -29
- package/dist/components/tab/tab.component.js +0 -1
- package/dist/components/tab/tab.styles.js +16 -8
- package/dist/components/textarea/textarea.component.d.ts +20 -18
- package/dist/components/textarea/textarea.component.js +20 -18
- package/dist/components/textarea/textarea.styles.js +27 -49
- package/dist/custom-elements.json +1708 -1324
- package/dist/react/checkbox/index.d.ts +8 -0
- package/dist/react/checkbox/index.js +8 -0
- package/dist/react/combobox/index.d.ts +8 -6
- package/dist/react/combobox/index.js +8 -6
- package/dist/react/formfieldgroup/index.d.ts +9 -0
- package/dist/react/formfieldgroup/index.js +9 -0
- package/dist/react/formfieldwrapper/index.d.ts +9 -0
- package/dist/react/formfieldwrapper/index.js +9 -0
- package/dist/react/index.d.ts +3 -3
- package/dist/react/index.js +3 -3
- package/dist/react/input/index.d.ts +11 -13
- package/dist/react/input/index.js +11 -13
- package/dist/react/password/index.d.ts +31 -27
- package/dist/react/password/index.js +31 -27
- package/dist/react/progressbar/index.d.ts +15 -20
- package/dist/react/progressbar/index.js +15 -20
- package/dist/react/searchfield/index.d.ts +30 -0
- package/dist/react/searchfield/index.js +30 -0
- package/dist/react/select/index.d.ts +19 -21
- package/dist/react/select/index.js +19 -21
- package/dist/react/textarea/index.d.ts +20 -18
- package/dist/react/textarea/index.js +20 -18
- package/package.json +1 -1
@@ -25,6 +25,14 @@ import type { Events } from '../../components/checkbox/checkbox.types';
|
|
25
25
|
* @cssproperty --mdc-checkbox-checked-pressed-icon-color - Background color for a selected checkbox when pressed.
|
26
26
|
* @cssproperty --mdc-checkbox-pressed-icon-color - Background color for a selected checkbox when pressed.
|
27
27
|
* @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a selected checkbox when disabled.
|
28
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
29
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
30
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
31
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
32
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
33
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
34
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
28
36
|
*
|
29
37
|
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
30
38
|
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
@@ -26,6 +26,14 @@ import { TAG_NAME } from '../../components/checkbox/checkbox.constants';
|
|
26
26
|
* @cssproperty --mdc-checkbox-checked-pressed-icon-color - Background color for a selected checkbox when pressed.
|
27
27
|
* @cssproperty --mdc-checkbox-pressed-icon-color - Background color for a selected checkbox when pressed.
|
28
28
|
* @cssproperty --mdc-checkbox-disabled-checked-icon-color - Background color for a selected checkbox when disabled.
|
29
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
30
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
31
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
32
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
33
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
34
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
36
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
29
37
|
*
|
30
38
|
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
31
39
|
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
@@ -49,13 +49,15 @@ import type { Events } from '../../components/combobox/combobox.types';
|
|
49
49
|
* @cssproperty --mdc-combobox-listbox-width - The width of the listbox inside the combobox
|
50
50
|
* @cssproperty --mdc-combobox-width - The width of the combobox
|
51
51
|
* @cssproperty --mdc-combobox-hover-background-color - The background color of the combobox when hovered
|
52
|
-
* @cssproperty --mdc-combobox-focused-background-color - The background color of the combobox when focused
|
53
|
-
* @cssproperty --mdc-combobox-error-border-color - The border color of the combobox when in error state
|
54
|
-
* @cssproperty --mdc-combobox-warning-border-color - The border color of the combobox when in warning state
|
55
|
-
* @cssproperty --mdc-combobox-success-border-color - The border color of the combobox when in success state
|
56
|
-
* @cssproperty --mdc-combobox-primary-border-color - The border color of the combobox when in primary state
|
57
52
|
* @cssproperty --mdc-combobox-text-color-disabled - The text color of the combobox when disabled
|
58
|
-
* @cssproperty --mdc-
|
53
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
54
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
55
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
56
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
57
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
58
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
59
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
60
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
59
61
|
*
|
60
62
|
* @csspart label - The label element.
|
61
63
|
* @csspart label-text - The container for the label and required indicator elements.
|
@@ -50,13 +50,15 @@ import { TAG_NAME } from '../../components/combobox/combobox.constants';
|
|
50
50
|
* @cssproperty --mdc-combobox-listbox-width - The width of the listbox inside the combobox
|
51
51
|
* @cssproperty --mdc-combobox-width - The width of the combobox
|
52
52
|
* @cssproperty --mdc-combobox-hover-background-color - The background color of the combobox when hovered
|
53
|
-
* @cssproperty --mdc-combobox-focused-background-color - The background color of the combobox when focused
|
54
|
-
* @cssproperty --mdc-combobox-error-border-color - The border color of the combobox when in error state
|
55
|
-
* @cssproperty --mdc-combobox-warning-border-color - The border color of the combobox when in warning state
|
56
|
-
* @cssproperty --mdc-combobox-success-border-color - The border color of the combobox when in success state
|
57
|
-
* @cssproperty --mdc-combobox-primary-border-color - The border color of the combobox when in primary state
|
58
53
|
* @cssproperty --mdc-combobox-text-color-disabled - The text color of the combobox when disabled
|
59
|
-
* @cssproperty --mdc-
|
54
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
55
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
56
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
57
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
58
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
59
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
60
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
61
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
60
62
|
*
|
61
63
|
* @csspart label - The label element.
|
62
64
|
* @csspart label-text - The container for the label and required indicator elements.
|
@@ -38,6 +38,15 @@ import Component from '../../components/formfieldgroup';
|
|
38
38
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
39
39
|
* @csspart container - Formfieldgroup host container
|
40
40
|
* @csspart group-header - This contains the label and help text for the group
|
41
|
+
*
|
42
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
43
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
44
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
45
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
46
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
47
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
48
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
49
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
41
50
|
*/
|
42
51
|
declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
|
43
52
|
export default reactWrapper;
|
@@ -41,6 +41,15 @@ import { TAG_NAME } from '../../components/formfieldgroup/formfieldgroup.constan
|
|
41
41
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
42
42
|
* @csspart container - Formfieldgroup host container
|
43
43
|
* @csspart group-header - This contains the label and help text for the group
|
44
|
+
*
|
45
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
46
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
47
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
48
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
49
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
50
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
51
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
52
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
44
53
|
*/
|
45
54
|
const reactWrapper = createComponent({
|
46
55
|
tagName: TAG_NAME,
|
@@ -24,6 +24,15 @@ import Component from '../../components/formfieldwrapper';
|
|
24
24
|
* @csspart help-text - The helper/validation text element.
|
25
25
|
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
26
26
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
27
|
+
*
|
28
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
29
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
30
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
31
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
32
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
33
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
34
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
27
36
|
*/
|
28
37
|
declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
|
29
38
|
export default reactWrapper;
|
@@ -27,6 +27,15 @@ import { TAG_NAME } from '../../components/formfieldwrapper/formfieldwrapper.con
|
|
27
27
|
* @csspart help-text - The helper/validation text element.
|
28
28
|
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
29
29
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
30
|
+
*
|
31
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
32
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
33
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
34
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
35
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
36
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
37
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
38
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
30
39
|
*/
|
31
40
|
const reactWrapper = createComponent({
|
32
41
|
tagName: TAG_NAME,
|
package/dist/react/index.d.ts
CHANGED
@@ -1,11 +1,11 @@
|
|
1
|
-
export { default as Accordion } from './accordion';
|
2
1
|
export { default as AccordionButton } from './accordionbutton';
|
2
|
+
export { default as Accordion } from './accordion';
|
3
3
|
export { default as AccordionGroup } from './accordiongroup';
|
4
4
|
export { default as AlertChip } from './alertchip';
|
5
|
-
export { default as Animation } from './animation';
|
6
5
|
export { default as AnnouncementDialog } from './announcementdialog';
|
7
6
|
export { default as Appheader } from './appheader';
|
8
7
|
export { default as Avatar } from './avatar';
|
8
|
+
export { default as Animation } from './animation';
|
9
9
|
export { default as AvatarButton } from './avatarbutton';
|
10
10
|
export { default as Badge } from './badge';
|
11
11
|
export { default as Banner } from './banner';
|
@@ -68,9 +68,9 @@ export { default as Skeleton } from './skeleton';
|
|
68
68
|
export { default as Slider } from './slider';
|
69
69
|
export { default as Spinner } from './spinner';
|
70
70
|
export { default as StaticCheckbox } from './staticcheckbox';
|
71
|
-
export { default as StaticChip } from './staticchip';
|
72
71
|
export { default as StaticRadio } from './staticradio';
|
73
72
|
export { default as StaticToggle } from './statictoggle';
|
73
|
+
export { default as StaticChip } from './staticchip';
|
74
74
|
export { default as Stepper } from './stepper';
|
75
75
|
export { default as StepperConnector } from './stepperconnector';
|
76
76
|
export { default as StepperItem } from './stepperitem';
|
package/dist/react/index.js
CHANGED
@@ -1,11 +1,11 @@
|
|
1
|
-
export { default as Accordion } from './accordion';
|
2
1
|
export { default as AccordionButton } from './accordionbutton';
|
2
|
+
export { default as Accordion } from './accordion';
|
3
3
|
export { default as AccordionGroup } from './accordiongroup';
|
4
4
|
export { default as AlertChip } from './alertchip';
|
5
|
-
export { default as Animation } from './animation';
|
6
5
|
export { default as AnnouncementDialog } from './announcementdialog';
|
7
6
|
export { default as Appheader } from './appheader';
|
8
7
|
export { default as Avatar } from './avatar';
|
8
|
+
export { default as Animation } from './animation';
|
9
9
|
export { default as AvatarButton } from './avatarbutton';
|
10
10
|
export { default as Badge } from './badge';
|
11
11
|
export { default as Banner } from './banner';
|
@@ -68,9 +68,9 @@ export { default as Skeleton } from './skeleton';
|
|
68
68
|
export { default as Slider } from './slider';
|
69
69
|
export { default as Spinner } from './spinner';
|
70
70
|
export { default as StaticCheckbox } from './staticcheckbox';
|
71
|
-
export { default as StaticChip } from './staticchip';
|
72
71
|
export { default as StaticRadio } from './staticradio';
|
73
72
|
export { default as StaticToggle } from './statictoggle';
|
73
|
+
export { default as StaticChip } from './staticchip';
|
74
74
|
export { default as Stepper } from './stepper';
|
75
75
|
export { default as StepperConnector } from './stepperconnector';
|
76
76
|
export { default as StepperItem } from './stepperitem';
|
@@ -35,22 +35,20 @@ import type { Events } from '../../components/input/input.types';
|
|
35
35
|
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
36
36
|
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
37
37
|
*
|
38
|
-
* @cssproperty --mdc-
|
39
|
-
* @cssproperty --mdc-
|
40
|
-
* @cssproperty --mdc-
|
41
|
-
* @cssproperty --mdc-
|
38
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
39
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
40
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
41
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
42
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
43
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
44
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
45
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
42
46
|
* @cssproperty --mdc-input-text-color - Text color for the input field
|
47
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
43
48
|
* @cssproperty --mdc-input-background-color - Background color for the input field
|
44
|
-
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
45
|
-
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
46
49
|
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
47
|
-
* @cssproperty --mdc-input-
|
48
|
-
* @cssproperty --mdc-input-
|
49
|
-
* @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused
|
50
|
-
* @cssproperty --mdc-input-error-border-color - Border color for the input container when error
|
51
|
-
* @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning
|
52
|
-
* @cssproperty --mdc-input-success-border-color - Border color for the input container when success
|
53
|
-
* @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary
|
50
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
51
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
54
52
|
*
|
55
53
|
* @csspart label - The label element.
|
56
54
|
* @csspart label-text - The container for the label and required indicator elements.
|
@@ -36,22 +36,20 @@ import { TAG_NAME } from '../../components/input/input.constants';
|
|
36
36
|
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
37
37
|
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
38
38
|
*
|
39
|
-
* @cssproperty --mdc-
|
40
|
-
* @cssproperty --mdc-
|
41
|
-
* @cssproperty --mdc-
|
42
|
-
* @cssproperty --mdc-
|
39
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
40
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
41
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
42
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
43
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
44
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
45
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
46
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
43
47
|
* @cssproperty --mdc-input-text-color - Text color for the input field
|
48
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
44
49
|
* @cssproperty --mdc-input-background-color - Background color for the input field
|
45
|
-
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
46
|
-
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
47
50
|
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
48
|
-
* @cssproperty --mdc-input-
|
49
|
-
* @cssproperty --mdc-input-
|
50
|
-
* @cssproperty --mdc-input-focused-border-color - Border color for the input container when focused
|
51
|
-
* @cssproperty --mdc-input-error-border-color - Border color for the input container when error
|
52
|
-
* @cssproperty --mdc-input-warning-border-color - Border color for the input container when warning
|
53
|
-
* @cssproperty --mdc-input-success-border-color - Border color for the input container when success
|
54
|
-
* @cssproperty --mdc-input-primary-border-color - Border color for the input container when primary
|
51
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
52
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
55
53
|
*
|
56
54
|
* @csspart label - The label element.
|
57
55
|
* @csspart label-text - The container for the label and required indicator elements.
|
@@ -24,35 +24,39 @@ import type { Events as EventsInherited } from '../../components/input/input.typ
|
|
24
24
|
* @dependency mdc-button
|
25
25
|
* @dependency mdc-toggletip
|
26
26
|
*
|
27
|
-
* @
|
28
|
-
* @
|
29
|
-
* @
|
30
|
-
* @
|
31
|
-
* @
|
32
|
-
* @
|
33
|
-
* @
|
34
|
-
* @
|
35
|
-
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
36
|
-
* @cssproperty --mdc-input-hover-background-color - Background color for the password field when hovered
|
37
|
-
* @cssproperty --mdc-input-focused-background-color - Background color for the password field when focused
|
38
|
-
* @cssproperty --mdc-input-focused-border-color - Border color for the password container when focused
|
39
|
-
* @cssproperty --mdc-input-error-border-color - Border color for the password container when error
|
40
|
-
* @cssproperty --mdc-input-warning-border-color - Border color for the password container when warning
|
41
|
-
* @cssproperty --mdc-input-success-border-color - Border color for the password container when success
|
42
|
-
* @cssproperty --mdc-input-primary-border-color - Border color for the password container when primary
|
27
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
28
|
+
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
29
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
30
|
+
* @slot help-text - Slot for the helper/validation text. If not provided, the `helpText` property will be used to render the helper/validation text.
|
31
|
+
* @slot input - Slot for the input element. If not provided, the input field will be rendered.
|
32
|
+
* @slot input-leading-icon - Slot for the leading icon before the input field. If not provided, the `leadingIcon` property will be used to render the leading icon.
|
33
|
+
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
34
|
+
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
43
35
|
*
|
44
|
-
* @csspart
|
45
|
-
* @csspart
|
46
|
-
* @csspart required-indicator - The required indicator element that is displayed next to the label when the `required` property is set to true.
|
47
|
-
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
48
|
-
* @csspart label-toggletip - The toggletip element that is displayed when the info icon button is clicked.
|
49
|
-
* @csspart help-text - The helper/validation text element.
|
50
|
-
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
51
|
-
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
52
|
-
* @csspart input-container - The container for the input field, leading icon, prefix text, and trailing button elements.
|
53
|
-
* @csspart input-section - The container for the input field, leading icon, and prefix text elements.
|
36
|
+
* @csspart input-container - The container that wraps the input field, leading icon, prefix text, and trailing button.
|
37
|
+
* @csspart input-section - The container that wraps the input field and prefix text.
|
54
38
|
* @csspart input-text - The input field element.
|
55
|
-
* @csspart trailing-button - The trailing button element
|
39
|
+
* @csspart trailing-button - The trailing button element.
|
40
|
+
* @csspart label - The label element.
|
41
|
+
* @csspart helper-text - The helper/validation text element.
|
42
|
+
* @csspart helper-icon - The helper/validation icon element.
|
43
|
+
* @csspart toggletip - The toggletip icon button element.
|
44
|
+
* @csspart toggletip-text - The toggletip text element.
|
45
|
+
*
|
46
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
47
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
48
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
49
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
50
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
51
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
52
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
53
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
54
|
+
* @cssproperty --mdc-input-text-color - Text color for the input field
|
55
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
56
|
+
* @cssproperty --mdc-input-background-color - Background color for the input field
|
57
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
58
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
59
|
+
*
|
56
60
|
*/
|
57
61
|
declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {
|
58
62
|
onInput: EventName<EventsInherited["onInputEvent"]>;
|
@@ -25,35 +25,39 @@ import { TAG_NAME } from '../../components/password/password.constants';
|
|
25
25
|
* @dependency mdc-button
|
26
26
|
* @dependency mdc-toggletip
|
27
27
|
*
|
28
|
-
* @
|
29
|
-
* @
|
30
|
-
* @
|
31
|
-
* @
|
32
|
-
* @
|
33
|
-
* @
|
34
|
-
* @
|
35
|
-
* @
|
36
|
-
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
37
|
-
* @cssproperty --mdc-input-hover-background-color - Background color for the password field when hovered
|
38
|
-
* @cssproperty --mdc-input-focused-background-color - Background color for the password field when focused
|
39
|
-
* @cssproperty --mdc-input-focused-border-color - Border color for the password container when focused
|
40
|
-
* @cssproperty --mdc-input-error-border-color - Border color for the password container when error
|
41
|
-
* @cssproperty --mdc-input-warning-border-color - Border color for the password container when warning
|
42
|
-
* @cssproperty --mdc-input-success-border-color - Border color for the password container when success
|
43
|
-
* @cssproperty --mdc-input-primary-border-color - Border color for the password container when primary
|
28
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
29
|
+
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
30
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
31
|
+
* @slot help-text - Slot for the helper/validation text. If not provided, the `helpText` property will be used to render the helper/validation text.
|
32
|
+
* @slot input - Slot for the input element. If not provided, the input field will be rendered.
|
33
|
+
* @slot input-leading-icon - Slot for the leading icon before the input field. If not provided, the `leadingIcon` property will be used to render the leading icon.
|
34
|
+
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
35
|
+
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
44
36
|
*
|
45
|
-
* @csspart
|
46
|
-
* @csspart
|
47
|
-
* @csspart required-indicator - The required indicator element that is displayed next to the label when the `required` property is set to true.
|
48
|
-
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
49
|
-
* @csspart label-toggletip - The toggletip element that is displayed when the info icon button is clicked.
|
50
|
-
* @csspart help-text - The helper/validation text element.
|
51
|
-
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
52
|
-
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
53
|
-
* @csspart input-container - The container for the input field, leading icon, prefix text, and trailing button elements.
|
54
|
-
* @csspart input-section - The container for the input field, leading icon, and prefix text elements.
|
37
|
+
* @csspart input-container - The container that wraps the input field, leading icon, prefix text, and trailing button.
|
38
|
+
* @csspart input-section - The container that wraps the input field and prefix text.
|
55
39
|
* @csspart input-text - The input field element.
|
56
|
-
* @csspart trailing-button - The trailing button element
|
40
|
+
* @csspart trailing-button - The trailing button element.
|
41
|
+
* @csspart label - The label element.
|
42
|
+
* @csspart helper-text - The helper/validation text element.
|
43
|
+
* @csspart helper-icon - The helper/validation icon element.
|
44
|
+
* @csspart toggletip - The toggletip icon button element.
|
45
|
+
* @csspart toggletip-text - The toggletip text element.
|
46
|
+
*
|
47
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
48
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
49
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
50
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
51
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
52
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
53
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
54
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
55
|
+
* @cssproperty --mdc-input-text-color - Text color for the input field
|
56
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
57
|
+
* @cssproperty --mdc-input-background-color - Background color for the input field
|
58
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
59
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
60
|
+
*
|
57
61
|
*/
|
58
62
|
const reactWrapper = createComponent({
|
59
63
|
tagName: TAG_NAME,
|
@@ -14,31 +14,26 @@ import Component from '../../components/progressbar';
|
|
14
14
|
* @dependency mdc-icon
|
15
15
|
* @dependency mdc-text
|
16
16
|
*
|
17
|
-
* @
|
18
|
-
* @
|
19
|
-
* @cssproperty --mdc-progressbar-success-color - Background color of the progressbar when in success state.
|
20
|
-
* @cssproperty --mdc-progressbar-error-color - Background color of the progressbar when in error state.
|
21
|
-
* @cssproperty --mdc-progressbar-height - The height of the progressbar.
|
22
|
-
* @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.
|
23
|
-
* @cssproperty --mdc-progressbar-label-color - Color of the progressbar label text.
|
24
|
-
* @cssproperty --mdc-progressbar-label-line-height - Line height of the label text.
|
25
|
-
* @cssproperty --mdc-progressbar-label-font-size - Font size of the label text.
|
26
|
-
* @cssproperty --mdc-progressbar-label-font-weight - Font weight of the label text.
|
27
|
-
* @cssproperty --mdc-progressbar-help-text-color - Color of the help text.
|
17
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
18
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
28
19
|
*
|
29
20
|
* @csspart label - The label element.
|
30
21
|
* @csspart label-text - The container for the label and required indicator elements.
|
31
|
-
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
32
22
|
* @csspart help-text - The helper/validation text element.
|
33
|
-
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
34
23
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
35
|
-
*
|
36
|
-
* @
|
37
|
-
* @
|
38
|
-
* @
|
39
|
-
* @
|
40
|
-
* @
|
41
|
-
* @
|
24
|
+
*
|
25
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
26
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
27
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
28
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
29
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
30
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
31
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
32
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
33
|
+
* @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.
|
34
|
+
* @cssproperty --mdc-progressbar-progress-background-color - Background color of the elapsed progressbar portion.
|
35
|
+
* @cssproperty --mdc-progressbar-height - The height of the progressbar.
|
36
|
+
* @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.
|
42
37
|
*/
|
43
38
|
declare const reactWrapper: import("@lit/react").ReactWebComponent<Component, {}>;
|
44
39
|
export default reactWrapper;
|
@@ -17,31 +17,26 @@ import { TAG_NAME } from '../../components/progressbar/progressbar.constants';
|
|
17
17
|
* @dependency mdc-icon
|
18
18
|
* @dependency mdc-text
|
19
19
|
*
|
20
|
-
* @
|
21
|
-
* @
|
22
|
-
* @cssproperty --mdc-progressbar-success-color - Background color of the progressbar when in success state.
|
23
|
-
* @cssproperty --mdc-progressbar-error-color - Background color of the progressbar when in error state.
|
24
|
-
* @cssproperty --mdc-progressbar-height - The height of the progressbar.
|
25
|
-
* @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.
|
26
|
-
* @cssproperty --mdc-progressbar-label-color - Color of the progressbar label text.
|
27
|
-
* @cssproperty --mdc-progressbar-label-line-height - Line height of the label text.
|
28
|
-
* @cssproperty --mdc-progressbar-label-font-size - Font size of the label text.
|
29
|
-
* @cssproperty --mdc-progressbar-label-font-weight - Font weight of the label text.
|
30
|
-
* @cssproperty --mdc-progressbar-help-text-color - Color of the help text.
|
20
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
21
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
31
22
|
*
|
32
23
|
* @csspart label - The label element.
|
33
24
|
* @csspart label-text - The container for the label and required indicator elements.
|
34
|
-
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
35
25
|
* @csspart help-text - The helper/validation text element.
|
36
|
-
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
37
26
|
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
38
|
-
*
|
39
|
-
* @
|
40
|
-
* @
|
41
|
-
* @
|
42
|
-
* @
|
43
|
-
* @
|
44
|
-
* @
|
27
|
+
*
|
28
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
29
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
30
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
31
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
32
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
33
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
34
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
36
|
+
* @cssproperty --mdc-progressbar-background-color - Background color of the remaining progressbar portion.
|
37
|
+
* @cssproperty --mdc-progressbar-progress-background-color - Background color of the elapsed progressbar portion.
|
38
|
+
* @cssproperty --mdc-progressbar-height - The height of the progressbar.
|
39
|
+
* @cssproperty --mdc-progressbar-border-radius - The border radius of the progressbar.
|
45
40
|
*/
|
46
41
|
const reactWrapper = createComponent({
|
47
42
|
tagName: TAG_NAME,
|
@@ -17,10 +17,40 @@ import type { Events as EventsInherited } from '../../components/input/input.typ
|
|
17
17
|
* @event clear - (React: onClear) This event is dispatched when the input text is cleared.
|
18
18
|
*
|
19
19
|
* @slot filters - Slot for input chips
|
20
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
21
|
+
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
22
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
23
|
+
* @slot help-text - Slot for the helper/validation text. If not provided, the `helpText` property will be used to render the helper/validation text.
|
24
|
+
* @slot input - Slot for the input element. If not provided, the input field will be rendered.
|
25
|
+
* @slot input-leading-icon - Slot for the leading icon before the input field. If not provided, the `leadingIcon` property will be used to render the leading icon.
|
26
|
+
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
27
|
+
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
28
|
+
*
|
29
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
30
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
31
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
32
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
33
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
34
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
36
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
37
|
+
* @cssproperty --mdc-input-text-color - Text color for the input field
|
38
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
39
|
+
* @cssproperty --mdc-input-background-color - Background color for the input field
|
40
|
+
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
41
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
42
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
20
43
|
*
|
21
44
|
* @csspart label - The label element.
|
22
45
|
* @csspart label-text - The container for the label and required indicator elements.
|
46
|
+
* @csspart required-indicator - The required indicator element that is displayed next to the label when the `required` property is set to true.
|
47
|
+
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
48
|
+
* @csspart label-toggletip - The toggletip element that is displayed when the info icon button is clicked.
|
49
|
+
* @csspart help-text - The helper/validation text element.
|
50
|
+
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
51
|
+
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
23
52
|
* @csspart leading-icon - The leading icon element that is displayed before the input field.
|
53
|
+
* @csspart prefix-text - The prefix text element that is displayed before the input field.
|
24
54
|
* @csspart input-container - The container for the input field, leading icon, prefix text, and trailing button elements.
|
25
55
|
* @csspart input-section - The container for the input field, leading icon, and prefix text elements.
|
26
56
|
* @csspart input-text - The input field element.
|
@@ -18,10 +18,40 @@ import { TAG_NAME } from '../../components/searchfield/searchfield.constants';
|
|
18
18
|
* @event clear - (React: onClear) This event is dispatched when the input text is cleared.
|
19
19
|
*
|
20
20
|
* @slot filters - Slot for input chips
|
21
|
+
* @slot label - Slot for the label element. If not provided, the `label` property will be used to render the label.
|
22
|
+
* @slot toggletip - Slot for the toggletip info icon button. If not provided, the `toggletip-text` property will be used to render the info icon button and toggletip.
|
23
|
+
* @slot help-icon - Slot for the helper/validation icon. If not provided, the icon will be rendered based on the `helpTextType` property.
|
24
|
+
* @slot help-text - Slot for the helper/validation text. If not provided, the `helpText` property will be used to render the helper/validation text.
|
25
|
+
* @slot input - Slot for the input element. If not provided, the input field will be rendered.
|
26
|
+
* @slot input-leading-icon - Slot for the leading icon before the input field. If not provided, the `leadingIcon` property will be used to render the leading icon.
|
27
|
+
* @slot input-prefix-text - Slot for the prefix text before the input field. If not provided, the `prefixText` property will be used to render the prefix text.
|
28
|
+
* @slot trailing-button - Slot for the trailing button to clear the input field. If not provided, the clear button will be rendered when `trailingButton` property is set to true.
|
29
|
+
*
|
30
|
+
* @cssproperty --mdc-label-font-size - Font size for the label text.
|
31
|
+
* @cssproperty --mdc-label-font-weight - Font weight for the label text.
|
32
|
+
* @cssproperty --mdc-label-line-height - Line height for the label text.
|
33
|
+
* @cssproperty --mdc-label-color - Color for the label text.
|
34
|
+
* @cssproperty --mdc-help-text-font-size - Font size for the help text.
|
35
|
+
* @cssproperty --mdc-help-text-font-weight - Font weight for the help text.
|
36
|
+
* @cssproperty --mdc-help-text-line-height - Line height for the help text.
|
37
|
+
* @cssproperty --mdc-help-text-color - Color for the help text.
|
38
|
+
* @cssproperty --mdc-input-text-color - Text color for the input field
|
39
|
+
* @cssproperty --mdc-input-border-color - Border color for the input container
|
40
|
+
* @cssproperty --mdc-input-background-color - Background color for the input field
|
41
|
+
* @cssproperty --mdc-input-support-text-color - Text color for the help text
|
42
|
+
* @cssproperty --mdc-input-selection-text-color - Text color for the selected text
|
43
|
+
* @cssproperty --mdc-input-selection-background-color - Background color for the selected text
|
21
44
|
*
|
22
45
|
* @csspart label - The label element.
|
23
46
|
* @csspart label-text - The container for the label and required indicator elements.
|
47
|
+
* @csspart required-indicator - The required indicator element that is displayed next to the label when the `required` property is set to true.
|
48
|
+
* @csspart info-icon-btn - The info icon button element that is displayed next to the label when the `toggletip-text` property is set.
|
49
|
+
* @csspart label-toggletip - The toggletip element that is displayed when the info icon button is clicked.
|
50
|
+
* @csspart help-text - The helper/validation text element.
|
51
|
+
* @csspart helper-icon - The helper/validation icon element that is displayed next to the helper/validation text.
|
52
|
+
* @csspart help-text-container - The container for the helper/validation icon and text elements.
|
24
53
|
* @csspart leading-icon - The leading icon element that is displayed before the input field.
|
54
|
+
* @csspart prefix-text - The prefix text element that is displayed before the input field.
|
25
55
|
* @csspart input-container - The container for the input field, leading icon, prefix text, and trailing button elements.
|
26
56
|
* @csspart input-section - The container for the input field, leading icon, and prefix text elements.
|
27
57
|
* @csspart input-text - The input field element.
|