@dxc-technology/halstack-react 0.0.0-b39a2d8 → 0.0.0-b3e1a2f

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 (162) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +1 -4
  3. package/ThemeContext.d.ts +15 -0
  4. package/ThemeContext.js +5 -8
  5. package/V3Select/V3Select.js +2 -2
  6. package/V3Textarea/V3Textarea.js +2 -2
  7. package/accordion/Accordion.js +2 -2
  8. package/accordion/Accordion.stories.tsx +307 -0
  9. package/accordion/types.d.ts +1 -1
  10. package/accordion-group/AccordionGroup.js +2 -2
  11. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  12. package/accordion-group/types.d.ts +1 -1
  13. package/alert/Alert.js +2 -2
  14. package/badge/Badge.js +1 -1
  15. package/bleed/Bleed.d.ts +3 -0
  16. package/bleed/Bleed.js +84 -0
  17. package/bleed/Bleed.stories.tsx +342 -0
  18. package/bleed/types.d.ts +13 -0
  19. package/bleed/types.js +5 -0
  20. package/box/Box.js +2 -2
  21. package/button/Button.d.ts +1 -1
  22. package/button/Button.js +13 -19
  23. package/button/Button.stories.tsx +6 -8
  24. package/button/types.d.ts +5 -9
  25. package/card/Card.js +1 -1
  26. package/card/Card.stories.tsx +1 -1
  27. package/checkbox/Checkbox.js +2 -2
  28. package/checkbox/types.d.ts +1 -1
  29. package/chip/Chip.d.ts +4 -0
  30. package/chip/Chip.js +5 -27
  31. package/chip/types.d.ts +53 -0
  32. package/chip/types.js +5 -0
  33. package/common/variables.js +57 -22
  34. package/date/Date.js +1 -1
  35. package/date-input/DateInput.js +10 -13
  36. package/dialog/Dialog.js +4 -3
  37. package/dropdown/Dropdown.js +1 -1
  38. package/dropdown/Dropdown.stories.tsx +247 -0
  39. package/dropdown/types.d.ts +1 -1
  40. package/file-input/FileInput.d.ts +1 -1
  41. package/file-input/FileInput.js +160 -81
  42. package/file-input/FileInput.stories.tsx +507 -0
  43. package/file-input/FileItem.js +8 -6
  44. package/file-input/types.d.ts +32 -7
  45. package/footer/Footer.d.ts +1 -1
  46. package/footer/Footer.js +12 -18
  47. package/footer/{Footer.stories.jsx → Footer.stories.tsx} +1 -22
  48. package/footer/Icons.d.ts +2 -0
  49. package/footer/Icons.js +3 -3
  50. package/footer/types.d.ts +21 -17
  51. package/header/Header.js +2 -2
  52. package/header/Icons.d.ts +2 -0
  53. package/heading/Heading.js +1 -1
  54. package/heading/Heading.stories.tsx +54 -0
  55. package/input-text/InputText.js +2 -2
  56. package/inset/Inset.d.ts +3 -0
  57. package/inset/Inset.js +84 -0
  58. package/inset/Inset.stories.tsx +229 -0
  59. package/inset/types.d.ts +13 -0
  60. package/inset/types.js +5 -0
  61. package/layout/ApplicationLayout.d.ts +10 -0
  62. package/layout/ApplicationLayout.js +9 -19
  63. package/layout/ApplicationLayout.stories.tsx +171 -0
  64. package/layout/types.d.ts +57 -0
  65. package/layout/types.js +5 -0
  66. package/link/Link.js +1 -1
  67. package/list/List.d.ts +4 -0
  68. package/list/List.js +47 -0
  69. package/list/List.stories.tsx +95 -0
  70. package/list/types.d.ts +7 -0
  71. package/list/types.js +5 -0
  72. package/main.d.ts +7 -3
  73. package/main.js +34 -2
  74. package/number-input/NumberInput.js +3 -6
  75. package/number-input/NumberInputContext.d.ts +4 -0
  76. package/number-input/NumberInputContext.js +5 -2
  77. package/number-input/numberInputContextTypes.d.ts +19 -0
  78. package/number-input/numberInputContextTypes.js +5 -0
  79. package/package.json +4 -2
  80. package/paginator/Paginator.js +2 -8
  81. package/password-input/PasswordInput.js +19 -18
  82. package/password-input/PasswordInput.stories.tsx +3 -3
  83. package/password-input/types.d.ts +17 -10
  84. package/progress-bar/ProgressBar.js +4 -4
  85. package/radio/Radio.js +2 -2
  86. package/radio-group/Radio.d.ts +4 -0
  87. package/radio-group/Radio.js +130 -0
  88. package/radio-group/RadioGroup.d.ts +4 -0
  89. package/radio-group/RadioGroup.js +268 -0
  90. package/radio-group/RadioGroup.stories.tsx +79 -0
  91. package/radio-group/types.d.ts +36 -0
  92. package/radio-group/types.js +5 -0
  93. package/resultsetTable/ResultsetTable.d.ts +4 -0
  94. package/resultsetTable/ResultsetTable.js +5 -28
  95. package/resultsetTable/ResultsetTable.stories.tsx +275 -0
  96. package/resultsetTable/types.d.ts +67 -0
  97. package/resultsetTable/types.js +5 -0
  98. package/row/Row.d.ts +3 -0
  99. package/row/Row.js +127 -0
  100. package/row/Row.stories.tsx +237 -0
  101. package/row/types.d.ts +10 -0
  102. package/row/types.js +5 -0
  103. package/select/Select.d.ts +4 -0
  104. package/select/Select.js +20 -22
  105. package/select/types.d.ts +170 -0
  106. package/select/types.js +5 -0
  107. package/sidenav/Sidenav.js +2 -2
  108. package/sidenav/Sidenav.stories.tsx +182 -0
  109. package/slider/Slider.js +4 -4
  110. package/spinner/Spinner.js +2 -2
  111. package/spinner/Spinner.stories.jsx +1 -0
  112. package/stack/Stack.d.ts +3 -0
  113. package/stack/Stack.js +97 -0
  114. package/stack/Stack.stories.tsx +164 -0
  115. package/stack/types.d.ts +9 -0
  116. package/stack/types.js +5 -0
  117. package/switch/Switch.js +2 -2
  118. package/switch/Switch.stories.tsx +1 -1
  119. package/table/Table.js +3 -3
  120. package/table/Table.stories.jsx +2 -1
  121. package/tabs/Tabs.js +11 -9
  122. package/tabs/Tabs.stories.tsx +120 -0
  123. package/tabs/types.d.ts +23 -15
  124. package/tag/Tag.js +1 -1
  125. package/tag/Tag.stories.tsx +1 -1
  126. package/text/Text.d.ts +7 -0
  127. package/text/Text.js +30 -0
  128. package/text/Text.stories.tsx +19 -0
  129. package/text-input/TextInput.d.ts +4 -0
  130. package/text-input/TextInput.js +54 -85
  131. package/text-input/TextInput.stories.tsx +456 -0
  132. package/text-input/types.d.ts +159 -0
  133. package/text-input/types.js +5 -0
  134. package/textarea/Textarea.d.ts +4 -0
  135. package/textarea/Textarea.js +27 -60
  136. package/textarea/Textarea.stories.jsx +4 -3
  137. package/textarea/types.d.ts +130 -0
  138. package/textarea/types.js +5 -0
  139. package/toggle/Toggle.js +1 -1
  140. package/toggle-group/ToggleGroup.d.ts +4 -0
  141. package/toggle-group/ToggleGroup.js +16 -45
  142. package/toggle-group/ToggleGroup.stories.tsx +23 -28
  143. package/toggle-group/types.d.ts +97 -0
  144. package/toggle-group/types.js +5 -0
  145. package/upload/buttons-upload/ButtonsUpload.js +2 -2
  146. package/upload/dragAndDropArea/DragAndDropArea.js +2 -2
  147. package/upload/file-upload/FileToUpload.js +1 -1
  148. package/upload/files-upload/FilesToUpload.js +1 -1
  149. package/upload/transaction/Transaction.js +2 -2
  150. package/upload/transactions/Transactions.js +1 -1
  151. package/useTheme.d.ts +2 -0
  152. package/useTheme.js +1 -1
  153. package/wizard/Wizard.js +59 -9
  154. package/wizard/{Wizard.stories.jsx → Wizard.stories.tsx} +0 -0
  155. package/wizard/types.d.ts +3 -7
  156. package/chip/index.d.ts +0 -22
  157. package/resultsetTable/index.d.ts +0 -19
  158. package/select/index.d.ts +0 -131
  159. package/text-input/index.d.ts +0 -135
  160. package/textarea/index.d.ts +0 -117
  161. package/toggle-group/index.d.ts +0 -21
  162. package/wizard/Icons.js +0 -65
@@ -1,117 +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 textarea.
13
- */
14
- label?: string;
15
- /**
16
- * Name attribute of the textarea element.
17
- */
18
- name?: string;
19
- /**
20
- * Value of the textarea. If undefined, the component will be uncontrolled and the value will be managed internally.
21
- */
22
- value?: string;
23
- /**
24
- * Helper text to be placed above the textarea.
25
- */
26
- helperText?: string;
27
- /**
28
- * Text to be put as placeholder of the textarea.
29
- */
30
- placeholder?: string;
31
- /**
32
- * If true, the component will be disabled.
33
- */
34
- disabled?: boolean;
35
- /**
36
- * If true, the textarea will be optional, showing '(Optional)'
37
- * next to the label. Otherwise, the field will be considered required
38
- * and an error will be passed as a parameter to the OnBlur and onChange functions
39
- * when it has not been filled.
40
- */
41
- optional?: boolean;
42
- /**
43
- * Defines the textarea's ability to resize vertically. It can be:
44
- * - 'auto': The textarea grows or shrinks automatically in order to fit the content.
45
- * - 'manual': The height of the textarea is enabled to be manually modified.
46
- * - 'none': The textarea has a fixed height and can't be modified.
47
- */
48
- verticalGrow?: "auto" | "manual" | "none";
49
- /**
50
- * Number of rows of the textarea.
51
- */
52
- rows?: number;
53
- /**
54
- * This function will be called when the user types within the textarea.
55
- * An object including the current value and the error (if the value
56
- * entered is not valid) will be passed to this function.
57
- * If there is no error, error will be null.
58
- */
59
- onChange?: (val: { value: string; error: string }) => void;
60
- /**
61
- * This function will be called when the textarea loses the focus. An
62
- * object including the textarea value and the error (if the value entered
63
- * is not valid) will be passed to this function. If there is no error,
64
- * error will be null.
65
- */
66
- onBlur?: (val: { value: string; error: string }) => void;
67
- /**
68
- * If it is defined, the component will change its appearance, showing
69
- * the error below the textarea. If it is not defined, the error
70
- * messages will be managed internally, but never displayed on its own.
71
- */
72
- error?: string;
73
- /**
74
- * Regular expression that defines the valid format allowed by the
75
- * textarea. This will be checked both when the textarea loses the focus
76
- * and while typing within it. If the string entered does not match the
77
- * pattern, the onBlur and onChange functions will be called with the
78
- * current value and an internal error informing that this value does not
79
- * match the pattern. If the pattern is met, the error parameter of both
80
- * events will be null.
81
- */
82
- pattern?: string;
83
- /**
84
- * Specifies the minimun and maximum length allowed by the textarea.
85
- * This will be checked both when the textarea loses the
86
- * focus and while typing within it. If the string entered does not
87
- * comply the length, the onBlur and onChange functions will be called
88
- * with the current value and an internal error informing that the value
89
- * length does not comply the specified range. If a valid length is
90
- * reached, the error parameter of both events will be null.
91
- */
92
- length?: { min: number; max: number };
93
- /**
94
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the textarea value.
95
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
96
- */
97
- autocomplete?: string;
98
- /**
99
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
100
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
101
- */
102
- margin?: Space | Margin;
103
- /**
104
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
105
- */
106
- size?: Size;
107
- /**
108
- * Value of the tabindex attribute.
109
- */
110
- tabIndex?: number;
111
- /**
112
- * Reference to the component.
113
- */
114
- ref?: React.RefObject<HTMLDivElement>;
115
- };
116
-
117
- export default function DxcTextarea(props: Props): JSX.Element;
@@ -1,21 +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
- label?: string;
11
- helperText?: string;
12
- value?: any;
13
- onChange?: void;
14
- disabled?: boolean;
15
- options?: any;
16
- multiple?: boolean;
17
- margin?: Space | Margin;
18
- tabIndex?: number;
19
- };
20
-
21
- export default function DxcToggleGroup(props: Props): JSX.Element;
package/wizard/Icons.js DELETED
@@ -1,65 +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.validIcon = exports.invalidIcon = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var invalidIcon = /*#__PURE__*/_react["default"].createElement("svg", {
13
- id: "highlight_off_black_18dp",
14
- xmlns: "http://www.w3.org/2000/svg",
15
- width: "18",
16
- height: "18",
17
- viewBox: "0 0 18 18"
18
- }, /*#__PURE__*/_react["default"].createElement("path", {
19
- id: "Path_2943",
20
- "data-name": "Path 2943",
21
- d: "M0,0H18V18H0Z",
22
- fill: "none"
23
- }), /*#__PURE__*/_react["default"].createElement("path", {
24
- id: "Path_2944",
25
- "data-name": "Path 2944",
26
- d: "M10,4a6,6,0,1,0,6,6A6.01,6.01,0,0,0,10,4Zm3,7.945L11.945,13,10,11.06,8.059,13,7,11.945,8.944,10,7,8.059,8.059,7,10,8.944,11.945,7,13,8.059,11.06,10Z",
27
- transform: "translate(-1.002 -1.002)",
28
- fill: "#ffe6e9"
29
- }), /*#__PURE__*/_react["default"].createElement("path", {
30
- id: "Path_2945",
31
- "data-name": "Path 2945",
32
- d: "M11.444,6.5,9.5,8.443,7.558,6.5,6.5,7.558,8.443,9.5,6.5,11.444,7.558,12.5,9.5,10.558,11.444,12.5,12.5,11.444,10.558,9.5,12.5,7.558ZM9.5,2A7.5,7.5,0,1,0,17,9.5,7.494,7.494,0,0,0,9.5,2Zm0,13.5a6,6,0,1,1,6-6A6.009,6.009,0,0,1,9.5,15.5Z",
33
- transform: "translate(-0.501 -0.501)",
34
- fill: "#d0011b"
35
- }));
36
-
37
- exports.invalidIcon = invalidIcon;
38
-
39
- var validIcon = /*#__PURE__*/_react["default"].createElement("svg", {
40
- id: "check_circle_black_18dp",
41
- xmlns: "http://www.w3.org/2000/svg",
42
- width: "18",
43
- height: "18",
44
- viewBox: "0 0 18 18"
45
- }, /*#__PURE__*/_react["default"].createElement("path", {
46
- id: "Path_2946",
47
- "data-name": "Path 2946",
48
- d: "M0,0H18V18H0Z",
49
- fill: "none"
50
- }), /*#__PURE__*/_react["default"].createElement("path", {
51
- id: "Path_2947",
52
- "data-name": "Path 2947",
53
- d: "M9.986,4a5.986,5.986,0,1,0,5.986,5.986A5.994,5.994,0,0,0,9.986,4Zm-1.5,9.727L5.5,10.734,6.551,9.679l1.938,1.93L13.42,6.679l1.055,1.063Z",
54
- transform: "translate(-0.986 -0.986)",
55
- fill: "#eafaef",
56
- opacity: "0.999"
57
- }), /*#__PURE__*/_react["default"].createElement("path", {
58
- id: "Path_2948",
59
- "data-name": "Path 2948",
60
- d: "M9.493,2a7.493,7.493,0,1,0,7.493,7.493A7.5,7.5,0,0,0,9.493,2Zm0,13.487a5.994,5.994,0,1,1,5.994-5.994A6,6,0,0,1,9.493,15.487Zm3.439-9.306L7.994,11.119,6.054,9.186,5,10.242l3,3,5.994-5.994Z",
61
- transform: "translate(-0.493 -0.493)",
62
- fill: "#24a148"
63
- }));
64
-
65
- exports.validIcon = validIcon;