@dxc-technology/halstack-react 0.0.0-9253572 → 0.0.0-9439a0d

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (209) hide show
  1. package/BackgroundColorContext.js +8 -4
  2. package/ThemeContext.js +84 -88
  3. package/V3Select/V3Select.js +33 -127
  4. package/V3Textarea/V3Textarea.js +10 -14
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +35 -130
  7. package/accordion/types.d.ts +68 -0
  8. package/accordion/types.js +5 -0
  9. package/accordion-group/AccordionGroup.d.ts +7 -0
  10. package/accordion-group/AccordionGroup.js +65 -81
  11. package/accordion-group/types.d.ts +72 -0
  12. package/accordion-group/types.js +5 -0
  13. package/alert/Alert.d.ts +4 -0
  14. package/alert/Alert.js +38 -151
  15. package/alert/Alert.stories.tsx +170 -0
  16. package/alert/types.d.ts +49 -0
  17. package/alert/types.js +5 -0
  18. package/badge/Badge.js +9 -13
  19. package/box/Box.d.ts +4 -0
  20. package/box/Box.js +13 -43
  21. package/box/Box.stories.tsx +132 -0
  22. package/box/types.d.ts +43 -0
  23. package/box/types.js +5 -0
  24. package/button/Button.d.ts +4 -0
  25. package/button/Button.js +22 -83
  26. package/button/Button.stories.tsx +276 -0
  27. package/button/types.d.ts +57 -0
  28. package/button/types.js +5 -0
  29. package/card/Card.d.ts +4 -0
  30. package/card/Card.js +33 -123
  31. package/card/Card.stories.tsx +201 -0
  32. package/card/ice-cream.jpg +0 -0
  33. package/card/types.d.ts +69 -0
  34. package/card/types.js +5 -0
  35. package/checkbox/Checkbox.d.ts +4 -0
  36. package/checkbox/Checkbox.js +13 -59
  37. package/checkbox/Checkbox.stories.tsx +192 -0
  38. package/checkbox/types.d.ts +60 -0
  39. package/checkbox/types.js +5 -0
  40. package/chip/Chip.js +17 -61
  41. package/chip/Chip.stories.tsx +121 -0
  42. package/common/RequiredComponent.js +3 -11
  43. package/common/variables.js +33 -23
  44. package/date/Date.js +16 -22
  45. package/date-input/DateInput.d.ts +4 -0
  46. package/date-input/DateInput.js +22 -61
  47. package/date-input/DateInput.stories.tsx +138 -0
  48. package/date-input/types.d.ts +100 -0
  49. package/date-input/types.js +5 -0
  50. package/dialog/Dialog.d.ts +4 -0
  51. package/dialog/Dialog.js +20 -73
  52. package/dialog/Dialog.stories.tsx +212 -0
  53. package/dialog/types.d.ts +43 -0
  54. package/dialog/types.js +5 -0
  55. package/dropdown/Dropdown.d.ts +4 -0
  56. package/dropdown/Dropdown.js +44 -171
  57. package/dropdown/types.d.ts +89 -0
  58. package/dropdown/types.js +5 -0
  59. package/file-input/FileInput.d.ts +4 -0
  60. package/file-input/FileInput.js +55 -188
  61. package/file-input/FileItem.d.ts +14 -0
  62. package/file-input/FileItem.js +33 -138
  63. package/file-input/types.d.ts +87 -0
  64. package/file-input/types.js +5 -0
  65. package/footer/Footer.d.ts +4 -0
  66. package/footer/Footer.js +38 -193
  67. package/footer/Footer.stories.jsx +151 -0
  68. package/footer/Icons.js +13 -13
  69. package/footer/types.d.ts +61 -0
  70. package/footer/types.js +5 -0
  71. package/header/Header.d.ts +7 -0
  72. package/header/Header.js +60 -206
  73. package/header/Header.stories.tsx +162 -0
  74. package/header/Icons.js +7 -32
  75. package/header/types.d.ts +45 -0
  76. package/header/types.js +5 -0
  77. package/heading/Heading.d.ts +4 -0
  78. package/heading/Heading.js +24 -95
  79. package/heading/types.d.ts +33 -0
  80. package/heading/types.js +5 -0
  81. package/input-text/Icons.js +2 -2
  82. package/input-text/InputText.js +33 -127
  83. package/layout/ApplicationLayout.js +31 -123
  84. package/layout/Icons.js +7 -7
  85. package/link/Link.d.ts +3 -0
  86. package/link/Link.js +18 -94
  87. package/link/Link.stories.tsx +146 -0
  88. package/link/types.d.ts +74 -0
  89. package/link/types.js +5 -0
  90. package/main.d.ts +44 -40
  91. package/main.js +91 -87
  92. package/number-input/NumberInput.d.ts +4 -0
  93. package/number-input/NumberInput.js +7 -57
  94. package/number-input/NumberInput.stories.tsx +115 -0
  95. package/number-input/NumberInputContext.js +1 -1
  96. package/number-input/types.d.ts +117 -0
  97. package/number-input/types.js +5 -0
  98. package/package.json +15 -12
  99. package/paginator/Icons.js +9 -9
  100. package/paginator/Paginator.d.ts +4 -0
  101. package/paginator/Paginator.js +24 -131
  102. package/paginator/Paginator.stories.tsx +63 -0
  103. package/paginator/types.d.ts +38 -0
  104. package/paginator/types.js +5 -0
  105. package/password-input/PasswordInput.d.ts +4 -0
  106. package/password-input/PasswordInput.js +18 -59
  107. package/password-input/PasswordInput.stories.tsx +131 -0
  108. package/password-input/types.d.ts +100 -0
  109. package/password-input/types.js +5 -0
  110. package/progress-bar/ProgressBar.d.ts +4 -0
  111. package/progress-bar/ProgressBar.js +20 -92
  112. package/progress-bar/ProgressBar.stories.jsx +58 -0
  113. package/progress-bar/types.d.ts +37 -0
  114. package/progress-bar/types.js +5 -0
  115. package/radio/Radio.d.ts +4 -0
  116. package/radio/Radio.js +15 -50
  117. package/radio/Radio.stories.tsx +192 -0
  118. package/radio/types.d.ts +54 -0
  119. package/radio/types.js +5 -0
  120. package/resultsetTable/ResultsetTable.js +35 -119
  121. package/select/Select.js +161 -434
  122. package/select/Select.stories.tsx +572 -0
  123. package/select/index.d.ts +4 -4
  124. package/sidenav/Sidenav.d.ts +9 -0
  125. package/sidenav/Sidenav.js +19 -62
  126. package/sidenav/types.d.ts +50 -0
  127. package/sidenav/types.js +5 -0
  128. package/slider/Slider.d.ts +4 -0
  129. package/slider/Slider.js +71 -158
  130. package/slider/Slider.stories.tsx +177 -0
  131. package/slider/types.d.ts +78 -0
  132. package/slider/types.js +5 -0
  133. package/spinner/Spinner.d.ts +4 -0
  134. package/spinner/Spinner.js +43 -174
  135. package/spinner/Spinner.stories.jsx +102 -0
  136. package/spinner/types.d.ts +32 -0
  137. package/spinner/types.js +5 -0
  138. package/switch/Switch.d.ts +4 -0
  139. package/switch/Switch.js +26 -69
  140. package/switch/Switch.stories.tsx +160 -0
  141. package/switch/types.d.ts +58 -0
  142. package/switch/types.js +5 -0
  143. package/table/Table.d.ts +4 -0
  144. package/table/Table.js +10 -24
  145. package/table/Table.stories.jsx +276 -0
  146. package/table/types.d.ts +21 -0
  147. package/table/types.js +5 -0
  148. package/tabs/Tabs.d.ts +4 -0
  149. package/tabs/Tabs.js +29 -161
  150. package/tabs/types.d.ts +71 -0
  151. package/tabs/types.js +5 -0
  152. package/tag/Tag.d.ts +4 -0
  153. package/tag/Tag.js +37 -126
  154. package/tag/Tag.stories.tsx +145 -0
  155. package/tag/types.d.ts +60 -0
  156. package/tag/types.js +5 -0
  157. package/text-input/TextInput.js +104 -271
  158. package/text-input/index.d.ts +2 -2
  159. package/textarea/Textarea.js +20 -72
  160. package/textarea/Textarea.stories.jsx +135 -0
  161. package/toggle/Toggle.js +15 -49
  162. package/toggle-group/ToggleGroup.js +23 -107
  163. package/toggle-group/ToggleGroup.stories.tsx +178 -0
  164. package/upload/Upload.js +11 -15
  165. package/upload/buttons-upload/ButtonsUpload.js +13 -37
  166. package/upload/buttons-upload/Icons.js +7 -7
  167. package/upload/dragAndDropArea/DragAndDropArea.js +24 -128
  168. package/upload/dragAndDropArea/Icons.js +6 -6
  169. package/upload/file-upload/FileToUpload.js +16 -90
  170. package/upload/file-upload/Icons.js +13 -13
  171. package/upload/files-upload/FilesToUpload.js +12 -26
  172. package/upload/transaction/Icons.js +31 -31
  173. package/upload/transaction/Transaction.js +17 -61
  174. package/upload/transactions/Transactions.js +13 -57
  175. package/wizard/Icons.js +8 -8
  176. package/wizard/Wizard.d.ts +4 -0
  177. package/wizard/Wizard.js +32 -206
  178. package/wizard/Wizard.stories.jsx +224 -0
  179. package/wizard/types.d.ts +64 -0
  180. package/wizard/types.js +5 -0
  181. package/accordion/index.d.ts +0 -28
  182. package/accordion-group/index.d.ts +0 -16
  183. package/alert/index.d.ts +0 -51
  184. package/box/index.d.ts +0 -25
  185. package/button/Button.stories.js +0 -27
  186. package/button/index.d.ts +0 -24
  187. package/card/index.d.ts +0 -22
  188. package/checkbox/index.d.ts +0 -24
  189. package/date-input/index.d.ts +0 -95
  190. package/dialog/index.d.ts +0 -18
  191. package/dropdown/index.d.ts +0 -26
  192. package/file-input/index.d.ts +0 -81
  193. package/footer/index.d.ts +0 -25
  194. package/header/index.d.ts +0 -25
  195. package/heading/index.d.ts +0 -17
  196. package/link/index.d.ts +0 -23
  197. package/number-input/index.d.ts +0 -113
  198. package/paginator/index.d.ts +0 -20
  199. package/password-input/index.d.ts +0 -94
  200. package/progress-bar/index.d.ts +0 -18
  201. package/radio/index.d.ts +0 -23
  202. package/sidenav/index.d.ts +0 -13
  203. package/slider/index.d.ts +0 -29
  204. package/spinner/index.d.ts +0 -17
  205. package/switch/index.d.ts +0 -24
  206. package/table/index.d.ts +0 -13
  207. package/tabs/index.d.ts +0 -19
  208. package/tag/index.d.ts +0 -24
  209. package/wizard/index.d.ts +0 -18
@@ -1,28 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- type Padding = {
9
- top?: Space;
10
- bottom?: Space;
11
- left?: Space;
12
- right?: Space;
13
- };
14
-
15
- type Props = {
16
- label?: string;
17
- iconSrc?: string;
18
- icon?: any;
19
- assistiveText?: string;
20
- disabled?: boolean;
21
- onChange?: void;
22
- isExpanded?: boolean;
23
- margin?: Space | Margin;
24
- padding?: Space | Padding;
25
- tabIndex?: number;
26
- };
27
-
28
- export default function DxcAccordion(props: Props): JSX.Element;
@@ -1,16 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- disabled?: boolean;
11
- onActiveChange?: void;
12
- indexActive?: number;
13
- margin?: Space | Margin;
14
- };
15
-
16
- export default function DxcAccordionGroup(props: Props): JSX.Element;
package/alert/index.d.ts DELETED
@@ -1,51 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- /**
12
- * Uses on of the available alert types.
13
- */
14
- type?: "info" | "confirm" | "warning" | "error";
15
- /**
16
- * Uses on of the available alert modes:
17
- * 'inline': If onClose function is received, close button will be visible and the function will be executed when it's clicked.
18
- * There is no overlay layer. Position should be decided by the user.
19
- * 'modal': The alert will be displayed in the middle of the screen with an overlay layer behind.
20
- * The onClose function will be executed when the X button or the overlay is clicked. d
21
- * The user has the responsibility of hidding the modal in the onClose function, otherwise the modal will remain visible.
22
- */
23
- mode?: "inline" | "modal";
24
- /**
25
- * Text to display after icon and alert type and before content.
26
- */
27
- inlineText?: string;
28
- /**
29
- * This function will be called when the user clicks the close button. If there is no function we should close the alert by default.
30
- */
31
- onClose?: () => void;
32
- /**
33
- * The details section of the alert. Can be used to render custom content in this area.
34
- */
35
- children?: React.ReactNode;
36
- /**
37
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
38
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
39
- */
40
- margin?: Space | Margin;
41
- /**
42
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent' | 'fitContent').
43
- */
44
- size?: Size;
45
- /**
46
- * Tabindex value given to the close button.
47
- */
48
- tabIndex?: number;
49
- };
50
-
51
- export default function Alert(props: Props): JSX.Element;
package/box/index.d.ts DELETED
@@ -1,25 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
- type Padding = {
10
- top?: Space;
11
- bottom?: Space;
12
- left?: Space;
13
- right?: Space;
14
- };
15
-
16
-
17
- type Props = {
18
- shadowDepth?: 0 | 1 | 2;
19
- margin?: Space | Margin;
20
- padging?: Space | Padding;
21
- display: string;
22
- size: Size;
23
- };
24
-
25
- export default function DxcBox(props: Props): JSX.Element;
@@ -1,27 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.Primary = exports["default"] = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _Button = _interopRequireDefault(require("./Button"));
13
-
14
- var _default = {
15
- title: "Button",
16
- component: _Button["default"]
17
- };
18
- exports["default"] = _default;
19
-
20
- var Primary = function Primary() {
21
- return _react["default"].createElement(_Button["default"], {
22
- mode: "primary",
23
- label: "Primary Button"
24
- });
25
- };
26
-
27
- exports.Primary = Primary;
package/button/index.d.ts DELETED
@@ -1,24 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- label?: string;
12
- mode?: "primary" | "secondary" | "text";
13
- disabled?: boolean;
14
- iconPosition?: "before" | "after";
15
- type?: "button" | "reset" | "submit";
16
- iconSrc?: string;
17
- icon?: any;
18
- onClick?: void;
19
- margin?: Space | Margin;
20
- size?: Size;
21
- tabIndex?: number;
22
- };
23
-
24
- export default function DxcButton(props: Props): JSX.Element;
package/card/index.d.ts DELETED
@@ -1,22 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- imageSrc?: string;
11
- margin?: Space | Margin;
12
- contentPadding?: any;
13
- linkHref?: string;
14
- onClick?: void;
15
- imageBgColor?: string;
16
- imagePadding?: any;
17
- imagePosition?: "before" | "after";
18
- outlined?: boolean;
19
- imageCover?: boolean;
20
- };
21
-
22
- export default function DxcCard(props: Props): JSX.Element;
@@ -1,24 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- checked?: boolean;
12
- value?: any;
13
- label?: string;
14
- labelPosition?: "before" | "after";
15
- name?: string,
16
- disabled?: boolean;
17
- onChange?: void;
18
- required?: boolean;
19
- margin?: Space | Margin;
20
- size?: Size;
21
- tabIndex?: number;
22
- };
23
-
24
- export default function DxcCheckbox(props: Props): JSX.Element;
@@ -1,95 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- /**
12
- * Text to be placed above the date.
13
- */
14
- label?: string;
15
- /**
16
- * Name attribute of the input element.
17
- */
18
- name?: string;
19
- /**
20
- * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
21
- */
22
- value?: string;
23
- /**
24
- * The format in which the date value will be displayed. User must use this format when editing the value or it will be considered as an invalid date.
25
- */
26
- format?: string;
27
- /**
28
- * Helper text to be placed above the date.
29
- */
30
- helperText?: string;
31
- /**
32
- * If true, the date format will appear as placeholder in the field.
33
- */
34
- placeholder?: boolean;
35
- /**
36
- * If true, the date input will have an action to clear the entered value.
37
- */
38
- clearable?: boolean;
39
- /**
40
- * If true, the component will be disabled.
41
- */
42
- disabled?: boolean;
43
- /**
44
- * If true, the date will be optional, showing '(Optional)'
45
- * next to the label. Otherwise, the field will be considered required and an error will be
46
- * passed as a parameter to the OnBlur and onChange functions when it has
47
- * not been filled.
48
- */
49
- optional?: boolean;
50
- /**
51
- * This function will be called when the user types within the input
52
- * element of the component. An object including the string value, the
53
- * error and the date value will be passed to this function.
54
- * If the string value is a valid date, error will
55
- * be null. Also, if the string value is not a valid date, date will be null.
56
- */
57
- onChange?: (val: { value: string; error: string; date: Date }) => void;
58
- /**
59
- * This function will be called when the input element loses the focus.
60
- * An object including the string value, the error and the date value
61
- * will be passed to this function. If the string value is a valid date, error will
62
- * be null. Also, if the string value is not a valid date, date will be null.
63
- */
64
- onBlur?: (val: { value: string; error: string; date: Date }) => void;
65
- /**
66
- * If it is defined, the component will change its appearance, showing
67
- * the error below the date input component. If it is not defined, the error
68
- * messages will be managed internally, but never displayed on its own.
69
- */
70
- error?: string;
71
- /**
72
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the input value.
73
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
74
- */
75
- autocomplete?: string;
76
- /**
77
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
78
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
79
- */
80
- margin?: Space | Margin;
81
- /**
82
- * Size of the component ('medium' | 'large' | 'fillParent').
83
- */
84
- size?: Size;
85
- /**
86
- * Value of the tabindex attribute.
87
- */
88
- tabIndex?: number;
89
- /**
90
- * Reference to the component.
91
- */
92
- ref?: React.RefObject<HTMLDivElement>;
93
- };
94
-
95
- export default function DxcDateInput(props: Props): JSX.Element;
package/dialog/index.d.ts DELETED
@@ -1,18 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Padding = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- isCloseVisible?: boolean;
11
- onCloseClick?: void;
12
- overlay?: boolean;
13
- onBackgroundClick?: void;
14
- padding?: Padding,
15
- tabIndex?: number;
16
- };
17
-
18
- export default function DxcDialog(props: Props): JSX.Element;
@@ -1,26 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- options?: any;
12
- optionsIconPosition?: "before" | "after";
13
- icon?: any;
14
- iconSrc?: string;
15
- iconPosition?: "before" | "after";
16
- label?: string;
17
- disabled?: boolean;
18
- caretHidden?: boolean;
19
- onSelectOption?: void;
20
- expandOnHover?: boolean;
21
- margin?: Space | Margin;
22
- size?: Size;
23
- tabIndex?: number;
24
- };
25
-
26
- export default function DxcDropdown(props: Props): JSX.Element;
@@ -1,81 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
- type FileData = {
10
- error?: string;
11
- file?: File;
12
- preview?: string;
13
- };
14
-
15
- type Props = {
16
- /**
17
- * Name attribute of the file input element.
18
- */
19
- name?: string;
20
- /**
21
- * Text to be placed above the file input.
22
- */
23
- label?: string;
24
- /**
25
- * Uses one of the available file input modes:
26
- * 'file': Files are selected by clicking the button and selecting it through the file explorer.
27
- * 'filedrop': Files can be selected by clicking the button and selecting it through the file explorer or by dropping them inside the drag and drop area.
28
- * 'dropzone': Files can be selected by clicking the button and selecting it through the file explorer or by dropping them inside the drag and drop area.
29
- * The drag and drop area of this mode is bigger than the one of the filedrop mode.
30
- */
31
- mode?: "file" | "filedrop" | "dropzone";
32
- /**
33
- * Helper text to be placed above the file input.
34
- */
35
- helperText?: string;
36
- /**
37
- * Defines the file types accepted by the component. It is not possible to select a file with a non valid type.
38
- */
39
- accept?: string;
40
- /**
41
- * An array of FileData representing the selected files.
42
- */
43
- value?: FileData[];
44
- /**
45
- * Minimum file size allowed (in bytes). If the file size does not comply the minSize, an error will be passed to the FileData.
46
- */
47
- minSize?: number;
48
- /**
49
- * Maximum file size allowed (in bytes). If the file size does not comply the maxSize, an error will be passed to the FileData.
50
- */
51
- maxSize?: number;
52
- /**
53
- * If true and if the file is an image, a preview of it will be shown. If it is not an image, an icon refering to the file's type will be shown.
54
- * If mode is not multiple and there is one file already selected, the file will be replaced by the last selected one.
55
- */
56
- showPreview?: boolean;
57
- /**
58
- * If true, more than one file can be selected. If false, only one file can be selected.
59
- */
60
- multiple?: boolean;
61
- /**
62
- * If true, the component will be disabled.
63
- */
64
- disabled?: boolean;
65
- /**
66
- * This function will be called when the user selects or drops a file. The list of files will be sent as a parameter.
67
- * In this function, the files can be updated or returned as they come. These files must be passed to the value in order to be shown.
68
- */
69
- callbackFile?: (files: FileData[]) => void;
70
- /**
71
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
72
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
73
- */
74
- margin?: Space | Margin;
75
- /**
76
- * Value of the tabindex attribute.
77
- */
78
- tabIndex?: number;
79
- };
80
-
81
- export default function DxcFileInput(props: Props): JSX.Element;
package/footer/index.d.ts DELETED
@@ -1,25 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- type Padding = {
9
- top?: Space;
10
- bottom?: Space;
11
- left?: Space;
12
- right?: Space;
13
- };
14
-
15
- type Props = {
16
- socialLinks?: any;
17
- bottomLinks?: any;
18
- copyright?: string;
19
- padding?: Space | Padding;
20
- margin?: Space | Margin;
21
- tabIndex?: number;
22
-
23
- };
24
-
25
- export default function DxcFooter(props: Props): JSX.Element;
package/header/index.d.ts DELETED
@@ -1,25 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- type Padding = {
9
- top?: Space;
10
- bottom?: Space;
11
- left?: Space;
12
- right?: Space;
13
- };
14
-
15
- type Props = {
16
- underlined?: boolean;
17
- onClick?: void;
18
- content?: any;
19
- responsiveContent?: any;
20
- margin?: Space | Margin;
21
- padding?: Space | Padding;
22
- tabIndex?: number;
23
- };
24
-
25
- export default function DxcHeader(props: Props): JSX.Element;
@@ -1,17 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- level?: 1 | 2 | 3 | 4 | 5;
11
- text?: string;
12
- as?: "h1" | "h2" | "h3" | "h4" | "h5";
13
- weight?: "light" | "normal" | "bold";
14
- margin?: Space | Margin;
15
- };
16
-
17
- export default function DxcHeading(props: Props): JSX.Element;
package/link/index.d.ts DELETED
@@ -1,23 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- inheritColor?: boolean;
11
- disabled?: boolean;
12
- iconSrc?: string;
13
- icon?: any;
14
- iconPosition?: "before" | "after";
15
- href?: string;
16
- newWindow?: boolean;
17
- onClick?: void;
18
- text?: string;
19
- margin?: Space | Margin;
20
- tabIndex?: number;
21
- };
22
-
23
- export default function DxcLink(props: Props): JSX.Element;
@@ -1,113 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
- type Props = {
10
- /**
11
- * Text to be placed above the number.
12
- */
13
- label?: string;
14
- /**
15
- * Name attribute of the input element.
16
- */
17
- name?: string;
18
- /**
19
- * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
20
- */
21
- value?: string;
22
- /**
23
- * Helper text to be placed above the number.
24
- */
25
- helperText?: string;
26
- /**
27
- * Text to be put as placeholder of the number.
28
- */
29
- placeholder?: string;
30
- /**
31
- * If true, the component will be disabled.
32
- */
33
- disabled?: boolean;
34
- /**
35
- * If true, the number will be optional, showing '(Optional)'
36
- * next to the label. Otherwise, the field will be considered required
37
- * and an error will be passed as a parameter to the OnBlur and onChange
38
- * functions when it has not been filled.
39
- */
40
- optional?: boolean;
41
- /**
42
- * Prefix to be placed before the number value.
43
- */
44
- prefix?: string;
45
- /**
46
- * Suffix to be placed after the number value.
47
- */
48
- suffix?: string;
49
- /**
50
- * Minimum value allowed by the number input. If the typed value by the user is
51
- * lower than min, the onBlur and onChange functions will be called with
52
- * the current value and an internal error informing that the current
53
- * value is not correct. If a valid state is reached, the error parameter
54
- * will be null in both events.
55
- */
56
- min?: number;
57
- /**
58
- * Maximum value allowed by the number input. If the typed value by the user
59
- * surpasses max, the onBlur and onChange functions will be called with
60
- * the current value and an internal error informing that the current
61
- * value is not correct. If a valid state is reached, the error parameter
62
- * will be null in both events.
63
- */
64
- max?: number;
65
- /**
66
- * The step interval to use when using the up and down arrows to adjust the value.
67
- */
68
- step?: number;
69
- /**
70
- * This function will be called when the user types within the input
71
- * element of the component. An object including the current value and
72
- * the error (if the value entered is not valid) will be passed to this
73
- * function. If there is no error, error will be null.
74
- */
75
- onChange?: (val: { value: string; error: string }) => void;
76
- /**
77
- * This function will be called when the input element loses the focus.
78
- * An object including the input value and the error (if the value
79
- * entered is not valid) will be passed to this function. If there is no error,
80
- * error will be null.
81
- */
82
- onBlur?: (val: { value: string; error: string }) => void;
83
- /**
84
- * If it is defined, the component will change its appearance, showing
85
- * the error below the input component. If it is not defined, the error
86
- * messages will be managed internally, but never displayed on its own.
87
- */
88
- error?: string;
89
- /**
90
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the input value.
91
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
92
- */
93
- autocomplete?: string;
94
- /**
95
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
96
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
97
- */
98
- margin?: Space | Margin;
99
- /**
100
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
101
- */
102
- size?: Size;
103
- /**
104
- * Value of the tabindex attribute.
105
- */
106
- tabIndex?: number;
107
- /**
108
- * Reference to the component.
109
- */
110
- ref?: React.RefObject<HTMLDivElement>;
111
- };
112
-
113
- export default function DxcNumberInput(props: Props): JSX.Element;
@@ -1,20 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- currentPage?: number;
11
- itemsPerPage?: number;
12
- itemsPerPageOptions?: number[];
13
- totalItems?: number
14
- showGoToPage?: boolean,
15
- onPageChange?: void;
16
- itemsPerPageFunction?: void;
17
- tabIndex?: number;
18
- };
19
-
20
- export default function DxcPaginator(props: Props): JSX.Element;