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.
@@ -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 | "inherit" | "false" | "true";
85
+ contentEditable?: boolean | "true" | "false" | "inherit";
86
86
  contextMenu?: string;
87
87
  dir?: string;
88
- draggable?: boolean | "false" | "true";
88
+ draggable?: boolean | "true" | "false";
89
89
  hidden?: boolean;
90
90
  id?: string;
91
91
  lang?: string;
92
92
  slot?: string;
93
- spellCheck?: boolean | "false" | "true";
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 | "false" | "true";
124
- 'aria-autocomplete'?: "both" | "none" | "inline" | "list";
125
- 'aria-busy'?: boolean | "false" | "true";
126
- 'aria-checked'?: boolean | "mixed" | "false" | "true";
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" | "page" | "false" | "true" | "step" | "location" | "date";
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 | "false" | "true";
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 | "false" | "true";
137
+ 'aria-expanded'?: boolean | "true" | "false";
138
138
  'aria-flowto'?: string;
139
- 'aria-grabbed'?: boolean | "false" | "true";
140
- 'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree";
141
- 'aria-hidden'?: boolean | "false" | "true";
142
- 'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling";
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 | "false" | "true";
149
- 'aria-multiline'?: boolean | "false" | "true";
150
- 'aria-multiselectable'?: boolean | "false" | "true";
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 | "mixed" | "false" | "true";
156
- 'aria-readonly'?: boolean | "false" | "true";
157
- 'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
158
- 'aria-required'?: boolean | "false" | "true";
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 | "false" | "true";
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 | "inherit" | "false" | "true";
417
+ contentEditable?: boolean | "true" | "false" | "inherit";
418
418
  contextMenu?: string;
419
419
  dir?: string;
420
- draggable?: boolean | "false" | "true";
420
+ draggable?: boolean | "true" | "false";
421
421
  hidden?: boolean;
422
422
  id?: string;
423
423
  lang?: string;
424
424
  slot?: string;
425
- spellCheck?: boolean | "false" | "true";
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 | "false" | "true";
456
- 'aria-autocomplete'?: "both" | "none" | "inline" | "list";
457
- 'aria-busy'?: boolean | "false" | "true";
458
- 'aria-checked'?: boolean | "mixed" | "false" | "true";
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" | "page" | "false" | "true" | "step" | "location" | "date";
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 | "false" | "true";
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 | "false" | "true";
469
+ 'aria-expanded'?: boolean | "true" | "false";
470
470
  'aria-flowto'?: string;
471
- 'aria-grabbed'?: boolean | "false" | "true";
472
- 'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree";
473
- 'aria-hidden'?: boolean | "false" | "true";
474
- 'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling";
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 | "false" | "true";
481
- 'aria-multiline'?: boolean | "false" | "true";
482
- 'aria-multiselectable'?: boolean | "false" | "true";
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 | "mixed" | "false" | "true";
488
- 'aria-readonly'?: boolean | "false" | "true";
489
- 'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
490
- 'aria-required'?: boolean | "false" | "true";
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 | "false" | "true";
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 | "inherit" | "false" | "true";
746
+ contentEditable?: boolean | "true" | "false" | "inherit";
747
747
  contextMenu?: string;
748
748
  dir?: string;
749
- draggable?: boolean | "false" | "true";
749
+ draggable?: boolean | "true" | "false";
750
750
  hidden?: boolean;
751
751
  id?: string;
752
752
  lang?: string;
753
753
  slot?: string;
754
- spellCheck?: boolean | "false" | "true";
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 | "false" | "true";
785
- 'aria-autocomplete'?: "both" | "none" | "inline" | "list";
786
- 'aria-busy'?: boolean | "false" | "true";
787
- 'aria-checked'?: boolean | "mixed" | "false" | "true";
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" | "page" | "false" | "true" | "step" | "location" | "date";
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 | "false" | "true";
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 | "false" | "true";
798
+ 'aria-expanded'?: boolean | "true" | "false";
799
799
  'aria-flowto'?: string;
800
- 'aria-grabbed'?: boolean | "false" | "true";
801
- 'aria-haspopup'?: boolean | "dialog" | "menu" | "grid" | "listbox" | "false" | "true" | "tree";
802
- 'aria-hidden'?: boolean | "false" | "true";
803
- 'aria-invalid'?: boolean | "false" | "true" | "grammar" | "spelling";
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 | "false" | "true";
810
- 'aria-multiline'?: boolean | "false" | "true";
811
- 'aria-multiselectable'?: boolean | "false" | "true";
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 | "mixed" | "false" | "true";
817
- 'aria-readonly'?: boolean | "false" | "true";
818
- 'aria-relevant'?: "text" | "all" | "additions" | "additions removals" | "additions text" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals";
819
- 'aria-required'?: boolean | "false" | "true";
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 | "false" | "true";
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>;
@@ -1,2 +1,3 @@
1
1
  export * from './Step';
2
2
  export * from './Stepper';
3
+ export * from './ResponsiveStepperContainer';