react-magma-dom 4.7.0-next.12 → 4.7.0-next.13
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/components/ButtonGroup/ButtonGroup.stories.d.ts +22 -22
- package/dist/components/CharacterCounter/CharacterCounter.stories.d.ts +44 -44
- package/dist/components/Datagrid/Datagrid.stories.d.ts +8 -8
- package/dist/components/IconButton/IconButton.stories.d.ts +4 -4
- package/dist/components/Input/Input.stories.d.ts +69 -69
- package/dist/components/Stepper/ResponsiveStepperContainer.d.ts +17 -0
- package/dist/components/Stepper/Step.d.ts +5 -1
- package/dist/components/Stepper/Stepper.d.ts +13 -0
- package/dist/components/Stepper/Stepper.stories.d.ts +2 -0
- package/dist/components/Stepper/index.d.ts +1 -0
- package/dist/components/Table/Table.stories.d.ts +132 -132
- package/dist/components/Tag/Tag.stories.d.ts +58 -58
- package/dist/components/Textarea/Textarea.stories.d.ts +22 -22
- package/dist/components/ToggleButton/ToggleButton.stories.d.ts +88 -88
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.stories.d.ts +44 -44
- package/dist/esm/index.js +237 -144
- package/dist/esm/index.js.map +1 -1
- package/dist/index.d.ts +2 -1
- package/dist/properties.json +72 -6
- package/dist/react-magma-dom.cjs.development.js +215 -104
- package/dist/react-magma-dom.cjs.development.js.map +1 -1
- package/dist/react-magma-dom.cjs.production.min.js +1 -1
- package/dist/react-magma-dom.cjs.production.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/types-6-0").ReactFramework, import("@storybook/react/types-6-0").Args>;
|
|
2
2
|
export default _default;
|
|
3
3
|
export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, ({} & import(".").IconTextButtonProps) | ({
|
|
4
|
-
children?: never;
|
|
5
4
|
iconPosition?: never;
|
|
5
|
+
children?: never;
|
|
6
6
|
} & import(".").IconOnlyButtonProps)>;
|
|
7
7
|
export declare const Inverse: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, ({} & import(".").IconTextButtonProps) | ({
|
|
8
|
-
children?: never;
|
|
9
8
|
iconPosition?: never;
|
|
9
|
+
children?: never;
|
|
10
10
|
} & import(".").IconOnlyButtonProps)>;
|
|
11
11
|
export declare const IconOnly: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, ({} & import(".").IconTextButtonProps) | ({
|
|
12
|
-
children?: never;
|
|
13
12
|
iconPosition?: never;
|
|
13
|
+
children?: never;
|
|
14
14
|
} & import(".").IconOnlyButtonProps)>;
|
|
15
15
|
export declare const AnimatedIcon: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, ({} & import(".").IconTextButtonProps) | ({
|
|
16
|
-
children?: never;
|
|
17
16
|
iconPosition?: never;
|
|
17
|
+
children?: never;
|
|
18
18
|
} & import(".").IconOnlyButtonProps)>;
|
|
@@ -12,9 +12,9 @@ export declare const IconPositions: {
|
|
|
12
12
|
args: {
|
|
13
13
|
placeholder: string;
|
|
14
14
|
helperMessage: any;
|
|
15
|
-
isInverse?: boolean;
|
|
16
15
|
testId?: string;
|
|
17
16
|
iconPosition?: InputIconPosition;
|
|
17
|
+
isInverse?: boolean;
|
|
18
18
|
containerStyle?: React.CSSProperties;
|
|
19
19
|
actionable?: boolean;
|
|
20
20
|
errorMessage?: React.ReactNode;
|
|
@@ -82,15 +82,15 @@ export declare const IconPositions: {
|
|
|
82
82
|
suppressHydrationWarning?: boolean;
|
|
83
83
|
accessKey?: string;
|
|
84
84
|
className?: string;
|
|
85
|
-
contentEditable?: boolean | "
|
|
85
|
+
contentEditable?: boolean | "true" | "false" | "inherit";
|
|
86
86
|
contextMenu?: string;
|
|
87
87
|
dir?: string;
|
|
88
|
-
draggable?: boolean | "
|
|
88
|
+
draggable?: boolean | "true" | "false";
|
|
89
89
|
hidden?: boolean;
|
|
90
90
|
id?: string;
|
|
91
91
|
lang?: string;
|
|
92
92
|
slot?: string;
|
|
93
|
-
spellCheck?: boolean | "
|
|
93
|
+
spellCheck?: boolean | "true" | "false";
|
|
94
94
|
style?: React.CSSProperties;
|
|
95
95
|
tabIndex?: number;
|
|
96
96
|
title?: string;
|
|
@@ -120,47 +120,47 @@ export declare const IconPositions: {
|
|
|
120
120
|
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal";
|
|
121
121
|
is?: string;
|
|
122
122
|
'aria-activedescendant'?: string;
|
|
123
|
-
'aria-atomic'?: boolean | "
|
|
124
|
-
'aria-autocomplete'?: "
|
|
125
|
-
'aria-busy'?: boolean | "
|
|
126
|
-
'aria-checked'?: boolean | "
|
|
123
|
+
'aria-atomic'?: boolean | "true" | "false";
|
|
124
|
+
'aria-autocomplete'?: "list" | "none" | "inline" | "both";
|
|
125
|
+
'aria-busy'?: boolean | "true" | "false";
|
|
126
|
+
'aria-checked'?: boolean | "true" | "false" | "mixed";
|
|
127
127
|
'aria-colcount'?: number;
|
|
128
128
|
'aria-colindex'?: number;
|
|
129
129
|
'aria-colspan'?: number;
|
|
130
130
|
'aria-controls'?: string;
|
|
131
|
-
'aria-current'?: boolean | "time" | "
|
|
131
|
+
'aria-current'?: boolean | "time" | "true" | "false" | "step" | "page" | "location" | "date";
|
|
132
132
|
'aria-describedby'?: string;
|
|
133
133
|
'aria-details'?: string;
|
|
134
|
-
'aria-disabled'?: boolean | "
|
|
134
|
+
'aria-disabled'?: boolean | "true" | "false";
|
|
135
135
|
'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup";
|
|
136
136
|
'aria-errormessage'?: string;
|
|
137
|
-
'aria-expanded'?: boolean | "
|
|
137
|
+
'aria-expanded'?: boolean | "true" | "false";
|
|
138
138
|
'aria-flowto'?: string;
|
|
139
|
-
'aria-grabbed'?: boolean | "
|
|
140
|
-
'aria-haspopup'?: boolean | "dialog" | "menu" | "
|
|
141
|
-
'aria-hidden'?: boolean | "
|
|
142
|
-
'aria-invalid'?: boolean | "
|
|
139
|
+
'aria-grabbed'?: boolean | "true" | "false";
|
|
140
|
+
'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree";
|
|
141
|
+
'aria-hidden'?: boolean | "true" | "false";
|
|
142
|
+
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling";
|
|
143
143
|
'aria-keyshortcuts'?: string;
|
|
144
144
|
'aria-label'?: string;
|
|
145
145
|
'aria-labelledby'?: string;
|
|
146
146
|
'aria-level'?: number;
|
|
147
147
|
'aria-live'?: "off" | "assertive" | "polite";
|
|
148
|
-
'aria-modal'?: boolean | "
|
|
149
|
-
'aria-multiline'?: boolean | "
|
|
150
|
-
'aria-multiselectable'?: boolean | "
|
|
148
|
+
'aria-modal'?: boolean | "true" | "false";
|
|
149
|
+
'aria-multiline'?: boolean | "true" | "false";
|
|
150
|
+
'aria-multiselectable'?: boolean | "true" | "false";
|
|
151
151
|
'aria-orientation'?: "horizontal" | "vertical";
|
|
152
152
|
'aria-owns'?: string;
|
|
153
153
|
'aria-placeholder'?: string;
|
|
154
154
|
'aria-posinset'?: number;
|
|
155
|
-
'aria-pressed'?: boolean | "
|
|
156
|
-
'aria-readonly'?: boolean | "
|
|
157
|
-
'aria-relevant'?: "text" | "
|
|
158
|
-
'aria-required'?: boolean | "
|
|
155
|
+
'aria-pressed'?: boolean | "true" | "false" | "mixed";
|
|
156
|
+
'aria-readonly'?: boolean | "true" | "false";
|
|
157
|
+
'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
|
|
158
|
+
'aria-required'?: boolean | "true" | "false";
|
|
159
159
|
'aria-roledescription'?: string;
|
|
160
160
|
'aria-rowcount'?: number;
|
|
161
161
|
'aria-rowindex'?: number;
|
|
162
162
|
'aria-rowspan'?: number;
|
|
163
|
-
'aria-selected'?: boolean | "
|
|
163
|
+
'aria-selected'?: boolean | "true" | "false";
|
|
164
164
|
'aria-setsize'?: number;
|
|
165
165
|
'aria-sort'?: "none" | "ascending" | "descending" | "other";
|
|
166
166
|
'aria-valuemax'?: number;
|
|
@@ -342,9 +342,9 @@ export declare const Inverse: import("@storybook/csf").AnnotatedStoryFn<import("
|
|
|
342
342
|
export declare const WithChildren: {
|
|
343
343
|
(args: any): JSX.Element;
|
|
344
344
|
args: {
|
|
345
|
-
isInverse?: boolean;
|
|
346
345
|
testId?: string;
|
|
347
346
|
iconPosition?: InputIconPosition;
|
|
347
|
+
isInverse?: boolean;
|
|
348
348
|
containerStyle?: React.CSSProperties;
|
|
349
349
|
actionable?: boolean;
|
|
350
350
|
errorMessage?: React.ReactNode;
|
|
@@ -414,15 +414,15 @@ export declare const WithChildren: {
|
|
|
414
414
|
suppressHydrationWarning?: boolean;
|
|
415
415
|
accessKey?: string;
|
|
416
416
|
className?: string;
|
|
417
|
-
contentEditable?: boolean | "
|
|
417
|
+
contentEditable?: boolean | "true" | "false" | "inherit";
|
|
418
418
|
contextMenu?: string;
|
|
419
419
|
dir?: string;
|
|
420
|
-
draggable?: boolean | "
|
|
420
|
+
draggable?: boolean | "true" | "false";
|
|
421
421
|
hidden?: boolean;
|
|
422
422
|
id?: string;
|
|
423
423
|
lang?: string;
|
|
424
424
|
slot?: string;
|
|
425
|
-
spellCheck?: boolean | "
|
|
425
|
+
spellCheck?: boolean | "true" | "false";
|
|
426
426
|
style?: React.CSSProperties;
|
|
427
427
|
tabIndex?: number;
|
|
428
428
|
title?: string;
|
|
@@ -452,47 +452,47 @@ export declare const WithChildren: {
|
|
|
452
452
|
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal";
|
|
453
453
|
is?: string;
|
|
454
454
|
'aria-activedescendant'?: string;
|
|
455
|
-
'aria-atomic'?: boolean | "
|
|
456
|
-
'aria-autocomplete'?: "
|
|
457
|
-
'aria-busy'?: boolean | "
|
|
458
|
-
'aria-checked'?: boolean | "
|
|
455
|
+
'aria-atomic'?: boolean | "true" | "false";
|
|
456
|
+
'aria-autocomplete'?: "list" | "none" | "inline" | "both";
|
|
457
|
+
'aria-busy'?: boolean | "true" | "false";
|
|
458
|
+
'aria-checked'?: boolean | "true" | "false" | "mixed";
|
|
459
459
|
'aria-colcount'?: number;
|
|
460
460
|
'aria-colindex'?: number;
|
|
461
461
|
'aria-colspan'?: number;
|
|
462
462
|
'aria-controls'?: string;
|
|
463
|
-
'aria-current'?: boolean | "time" | "
|
|
463
|
+
'aria-current'?: boolean | "time" | "true" | "false" | "step" | "page" | "location" | "date";
|
|
464
464
|
'aria-describedby'?: string;
|
|
465
465
|
'aria-details'?: string;
|
|
466
|
-
'aria-disabled'?: boolean | "
|
|
466
|
+
'aria-disabled'?: boolean | "true" | "false";
|
|
467
467
|
'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup";
|
|
468
468
|
'aria-errormessage'?: string;
|
|
469
|
-
'aria-expanded'?: boolean | "
|
|
469
|
+
'aria-expanded'?: boolean | "true" | "false";
|
|
470
470
|
'aria-flowto'?: string;
|
|
471
|
-
'aria-grabbed'?: boolean | "
|
|
472
|
-
'aria-haspopup'?: boolean | "dialog" | "menu" | "
|
|
473
|
-
'aria-hidden'?: boolean | "
|
|
474
|
-
'aria-invalid'?: boolean | "
|
|
471
|
+
'aria-grabbed'?: boolean | "true" | "false";
|
|
472
|
+
'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree";
|
|
473
|
+
'aria-hidden'?: boolean | "true" | "false";
|
|
474
|
+
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling";
|
|
475
475
|
'aria-keyshortcuts'?: string;
|
|
476
476
|
'aria-label'?: string;
|
|
477
477
|
'aria-labelledby'?: string;
|
|
478
478
|
'aria-level'?: number;
|
|
479
479
|
'aria-live'?: "off" | "assertive" | "polite";
|
|
480
|
-
'aria-modal'?: boolean | "
|
|
481
|
-
'aria-multiline'?: boolean | "
|
|
482
|
-
'aria-multiselectable'?: boolean | "
|
|
480
|
+
'aria-modal'?: boolean | "true" | "false";
|
|
481
|
+
'aria-multiline'?: boolean | "true" | "false";
|
|
482
|
+
'aria-multiselectable'?: boolean | "true" | "false";
|
|
483
483
|
'aria-orientation'?: "horizontal" | "vertical";
|
|
484
484
|
'aria-owns'?: string;
|
|
485
485
|
'aria-placeholder'?: string;
|
|
486
486
|
'aria-posinset'?: number;
|
|
487
|
-
'aria-pressed'?: boolean | "
|
|
488
|
-
'aria-readonly'?: boolean | "
|
|
489
|
-
'aria-relevant'?: "text" | "
|
|
490
|
-
'aria-required'?: boolean | "
|
|
487
|
+
'aria-pressed'?: boolean | "true" | "false" | "mixed";
|
|
488
|
+
'aria-readonly'?: boolean | "true" | "false";
|
|
489
|
+
'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
|
|
490
|
+
'aria-required'?: boolean | "true" | "false";
|
|
491
491
|
'aria-roledescription'?: string;
|
|
492
492
|
'aria-rowcount'?: number;
|
|
493
493
|
'aria-rowindex'?: number;
|
|
494
494
|
'aria-rowspan'?: number;
|
|
495
|
-
'aria-selected'?: boolean | "
|
|
495
|
+
'aria-selected'?: boolean | "true" | "false";
|
|
496
496
|
'aria-setsize'?: number;
|
|
497
497
|
'aria-sort'?: "none" | "ascending" | "descending" | "other";
|
|
498
498
|
'aria-valuemax'?: number;
|
|
@@ -671,9 +671,9 @@ export declare const WithChildren: {
|
|
|
671
671
|
export declare const WithTwoIcons: {
|
|
672
672
|
(args: any): JSX.Element;
|
|
673
673
|
args: {
|
|
674
|
-
isInverse?: boolean;
|
|
675
674
|
testId?: string;
|
|
676
675
|
iconPosition?: InputIconPosition;
|
|
676
|
+
isInverse?: boolean;
|
|
677
677
|
containerStyle?: React.CSSProperties;
|
|
678
678
|
actionable?: boolean;
|
|
679
679
|
errorMessage?: React.ReactNode;
|
|
@@ -743,15 +743,15 @@ export declare const WithTwoIcons: {
|
|
|
743
743
|
suppressHydrationWarning?: boolean;
|
|
744
744
|
accessKey?: string;
|
|
745
745
|
className?: string;
|
|
746
|
-
contentEditable?: boolean | "
|
|
746
|
+
contentEditable?: boolean | "true" | "false" | "inherit";
|
|
747
747
|
contextMenu?: string;
|
|
748
748
|
dir?: string;
|
|
749
|
-
draggable?: boolean | "
|
|
749
|
+
draggable?: boolean | "true" | "false";
|
|
750
750
|
hidden?: boolean;
|
|
751
751
|
id?: string;
|
|
752
752
|
lang?: string;
|
|
753
753
|
slot?: string;
|
|
754
|
-
spellCheck?: boolean | "
|
|
754
|
+
spellCheck?: boolean | "true" | "false";
|
|
755
755
|
style?: React.CSSProperties;
|
|
756
756
|
tabIndex?: number;
|
|
757
757
|
title?: string;
|
|
@@ -781,47 +781,47 @@ export declare const WithTwoIcons: {
|
|
|
781
781
|
inputMode?: "text" | "none" | "search" | "tel" | "url" | "email" | "numeric" | "decimal";
|
|
782
782
|
is?: string;
|
|
783
783
|
'aria-activedescendant'?: string;
|
|
784
|
-
'aria-atomic'?: boolean | "
|
|
785
|
-
'aria-autocomplete'?: "
|
|
786
|
-
'aria-busy'?: boolean | "
|
|
787
|
-
'aria-checked'?: boolean | "
|
|
784
|
+
'aria-atomic'?: boolean | "true" | "false";
|
|
785
|
+
'aria-autocomplete'?: "list" | "none" | "inline" | "both";
|
|
786
|
+
'aria-busy'?: boolean | "true" | "false";
|
|
787
|
+
'aria-checked'?: boolean | "true" | "false" | "mixed";
|
|
788
788
|
'aria-colcount'?: number;
|
|
789
789
|
'aria-colindex'?: number;
|
|
790
790
|
'aria-colspan'?: number;
|
|
791
791
|
'aria-controls'?: string;
|
|
792
|
-
'aria-current'?: boolean | "time" | "
|
|
792
|
+
'aria-current'?: boolean | "time" | "true" | "false" | "step" | "page" | "location" | "date";
|
|
793
793
|
'aria-describedby'?: string;
|
|
794
794
|
'aria-details'?: string;
|
|
795
|
-
'aria-disabled'?: boolean | "
|
|
795
|
+
'aria-disabled'?: boolean | "true" | "false";
|
|
796
796
|
'aria-dropeffect'?: "link" | "none" | "copy" | "execute" | "move" | "popup";
|
|
797
797
|
'aria-errormessage'?: string;
|
|
798
|
-
'aria-expanded'?: boolean | "
|
|
798
|
+
'aria-expanded'?: boolean | "true" | "false";
|
|
799
799
|
'aria-flowto'?: string;
|
|
800
|
-
'aria-grabbed'?: boolean | "
|
|
801
|
-
'aria-haspopup'?: boolean | "dialog" | "menu" | "
|
|
802
|
-
'aria-hidden'?: boolean | "
|
|
803
|
-
'aria-invalid'?: boolean | "
|
|
800
|
+
'aria-grabbed'?: boolean | "true" | "false";
|
|
801
|
+
'aria-haspopup'?: boolean | "dialog" | "menu" | "true" | "false" | "grid" | "listbox" | "tree";
|
|
802
|
+
'aria-hidden'?: boolean | "true" | "false";
|
|
803
|
+
'aria-invalid'?: boolean | "true" | "false" | "grammar" | "spelling";
|
|
804
804
|
'aria-keyshortcuts'?: string;
|
|
805
805
|
'aria-label'?: string;
|
|
806
806
|
'aria-labelledby'?: string;
|
|
807
807
|
'aria-level'?: number;
|
|
808
808
|
'aria-live'?: "off" | "assertive" | "polite";
|
|
809
|
-
'aria-modal'?: boolean | "
|
|
810
|
-
'aria-multiline'?: boolean | "
|
|
811
|
-
'aria-multiselectable'?: boolean | "
|
|
809
|
+
'aria-modal'?: boolean | "true" | "false";
|
|
810
|
+
'aria-multiline'?: boolean | "true" | "false";
|
|
811
|
+
'aria-multiselectable'?: boolean | "true" | "false";
|
|
812
812
|
'aria-orientation'?: "horizontal" | "vertical";
|
|
813
813
|
'aria-owns'?: string;
|
|
814
814
|
'aria-placeholder'?: string;
|
|
815
815
|
'aria-posinset'?: number;
|
|
816
|
-
'aria-pressed'?: boolean | "
|
|
817
|
-
'aria-readonly'?: boolean | "
|
|
818
|
-
'aria-relevant'?: "text" | "
|
|
819
|
-
'aria-required'?: boolean | "
|
|
816
|
+
'aria-pressed'?: boolean | "true" | "false" | "mixed";
|
|
817
|
+
'aria-readonly'?: boolean | "true" | "false";
|
|
818
|
+
'aria-relevant'?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
|
|
819
|
+
'aria-required'?: boolean | "true" | "false";
|
|
820
820
|
'aria-roledescription'?: string;
|
|
821
821
|
'aria-rowcount'?: number;
|
|
822
822
|
'aria-rowindex'?: number;
|
|
823
823
|
'aria-rowspan'?: number;
|
|
824
|
-
'aria-selected'?: boolean | "
|
|
824
|
+
'aria-selected'?: boolean | "true" | "false";
|
|
825
825
|
'aria-setsize'?: number;
|
|
826
826
|
'aria-sort'?: "none" | "ascending" | "descending" | "other";
|
|
827
827
|
'aria-valuemax'?: number;
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { StepperProps } from './Stepper';
|
|
3
|
+
export interface ResponsiveStepperContainerProps extends Omit<StepperProps, 'currentStep'> {
|
|
4
|
+
/**
|
|
5
|
+
* @children
|
|
6
|
+
*/
|
|
7
|
+
children?: React.ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* Steps of the Stepper.
|
|
10
|
+
*/
|
|
11
|
+
steps: React.ReactNode[];
|
|
12
|
+
/**
|
|
13
|
+
* Current step value.
|
|
14
|
+
*/
|
|
15
|
+
currentStep: number;
|
|
16
|
+
}
|
|
17
|
+
export declare const ResponsiveStepperContainer: React.FunctionComponent<ResponsiveStepperContainerProps>;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ThemeInterface } from '../../theme/magma';
|
|
3
|
-
import { StepperLayout } from './Stepper';
|
|
3
|
+
import { StepperLayout, StepperOrientation } from './Stepper';
|
|
4
4
|
export interface StepProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
5
5
|
/**
|
|
6
6
|
* Error state for each step.
|
|
@@ -27,6 +27,10 @@ export interface StepProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
27
27
|
* @internal
|
|
28
28
|
*/
|
|
29
29
|
index?: number;
|
|
30
|
+
/**
|
|
31
|
+
* @internal
|
|
32
|
+
*/
|
|
33
|
+
orientation?: StepperOrientation;
|
|
30
34
|
/**
|
|
31
35
|
* @internal
|
|
32
36
|
*/
|
|
@@ -17,6 +17,10 @@ export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
17
17
|
* Changes the Stepper view for responsive layouts, needs a minimum 'breakpoint' number.
|
|
18
18
|
*/
|
|
19
19
|
breakpointLayout?: StepperLayout;
|
|
20
|
+
/**
|
|
21
|
+
* Changes the Stepper orientation for responsive layouts, needs a minimum 'breakpoint' number.
|
|
22
|
+
*/
|
|
23
|
+
breakpointOrientation?: StepperOrientation;
|
|
20
24
|
/**
|
|
21
25
|
* Sets the Stepper view
|
|
22
26
|
* @default StepperLayout.showLabels
|
|
@@ -36,6 +40,11 @@ export interface StepperProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
36
40
|
* Current step value.
|
|
37
41
|
*/
|
|
38
42
|
currentStep: number;
|
|
43
|
+
/**
|
|
44
|
+
* Determines if the stepper is displayed vertically or horizontally
|
|
45
|
+
* @default StepperOrientation.horizontal
|
|
46
|
+
*/
|
|
47
|
+
orientation?: StepperOrientation;
|
|
39
48
|
/**
|
|
40
49
|
* Inverse styling.
|
|
41
50
|
*/
|
|
@@ -50,4 +59,8 @@ export declare enum StepperLayout {
|
|
|
50
59
|
hideLabels = "hideLabels",
|
|
51
60
|
summaryView = "summaryView"
|
|
52
61
|
}
|
|
62
|
+
export declare enum StepperOrientation {
|
|
63
|
+
horizontal = "horizontal",
|
|
64
|
+
vertical = "vertical"
|
|
65
|
+
}
|
|
53
66
|
export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -2,5 +2,7 @@ import { StepperProps } from './';
|
|
|
2
2
|
declare const _default: import("@storybook/csf").ComponentAnnotations<import("@storybook/react/types-6-0").ReactFramework, import("@storybook/react/types-6-0").Args>;
|
|
3
3
|
export default _default;
|
|
4
4
|
export declare const Default: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, StepperProps>;
|
|
5
|
+
export declare const Vertical: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, StepperProps>;
|
|
6
|
+
export declare const InsideDropdown: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, StepperProps>;
|
|
5
7
|
export declare const RealWorldExample: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, StepperProps>;
|
|
6
8
|
export declare const WithError: import("@storybook/csf").AnnotatedStoryFn<import("@storybook/react/types-6-0").ReactFramework, StepperProps>;
|