@dxc-technology/halstack-react 0.0.0-ebe476f → 0.0.0-ebf1ceb

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 (5) hide show
  1. package/dist/index.d.mts +902 -1005
  2. package/dist/index.d.ts +902 -1005
  3. package/dist/index.js +14244 -1
  4. package/dist/index.mjs +14187 -1
  5. package/package.json +11 -13
package/dist/index.d.mts CHANGED
@@ -1,34 +1,45 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
1
  import * as react from 'react';
2
+ import { ReactNode, SVGProps, ReactElement, MouseEvent, ReactEventHandler } from 'react';
3
+ import * as react_jsx_runtime from 'react/jsx-runtime';
4
+ import { SortColumn } from 'react-data-grid';
3
5
  import * as styled_components from 'styled-components';
4
6
 
5
- type Space$u = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
6
- type Margin$p = {
7
- top?: Space$u;
8
- bottom?: Space$u;
9
- left?: Space$u;
10
- right?: Space$u;
7
+ type Space$1 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
8
+ type Margin = {
9
+ top?: Space$1;
10
+ bottom?: Space$1;
11
+ left?: Space$1;
12
+ right?: Space$1;
11
13
  };
12
- type SVG$i = React.ReactNode & React.SVGProps<SVGSVGElement>;
13
- type Props$L = {
14
+ type SVG = ReactNode & SVGProps<SVGSVGElement>;
15
+
16
+ type AccordionItemProps = {
14
17
  /**
15
18
  * The panel label.
16
19
  */
17
20
  label: string;
18
21
  /**
19
- * Initial state of the panel, only when it is uncontrolled.
22
+ * Additional info label positioned under the label.
20
23
  */
21
- defaultIsExpanded?: boolean;
24
+ subLabel?: string;
22
25
  /**
23
- * Represents the state of the panel. When true, the component will be
24
- * expanded. If undefined, the component will be uncontrolled and its
25
- * value will be managed internally by the component.
26
+ * Badge component to add extra value to the accordion.
26
27
  */
27
- isExpanded?: boolean;
28
+ badge?: {
29
+ position: "before" | "after";
30
+ element: ReactNode;
31
+ };
28
32
  /**
29
- * Material Symbol name or SVG element used as the icon that will be placed next to panel label.
33
+ * Status light component to add extra value to the accordion.
30
34
  */
31
- icon?: string | SVG$i;
35
+ statusLight?: ReactNode;
36
+ /**
37
+ * Material Symbol name or SVG element used as the icon that will be
38
+ * placed next to panel label. When using Material Symbols, replace spaces with underscores.
39
+ * By default they are outlined if you want it to be filled
40
+ * prefix the symbol name with "filled_".
41
+ */
42
+ icon?: string | SVG;
32
43
  /**
33
44
  * Assistive text to be placed on the right side of the panel.
34
45
  */
@@ -37,156 +48,170 @@ type Props$L = {
37
48
  * If true, the component will be disabled.
38
49
  */
39
50
  disabled?: boolean;
40
- /**
41
- * This function will be called when the user clicks the accordion to expand or collapse
42
- * the panel. The new state of the panel will be passed as a parameter.
43
- */
44
- onChange?: (isExpanded: boolean) => void;
45
51
  /**
46
52
  * The expanded panel of the accordion. This area can be used to render
47
53
  * custom content.
48
54
  */
49
- children: React.ReactNode;
50
- /**
51
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
52
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
53
- */
54
- margin?: Space$u | Margin$p;
55
+ children: ReactNode;
55
56
  /**
56
57
  * Value of the tabindex attribute.
57
58
  */
58
59
  tabIndex?: number;
59
60
  };
60
-
61
- declare const DxcAccordion: ({ label, defaultIsExpanded, isExpanded, icon, assistiveText, disabled, onChange, children, margin, tabIndex, }: Props$L) => JSX.Element;
62
-
63
- type Space$t = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
64
- type Margin$o = {
65
- top?: Space$t;
66
- bottom?: Space$t;
67
- left?: Space$t;
68
- right?: Space$t;
69
- };
70
- type SVG$h = React.ReactNode & React.SVGProps<SVGSVGElement>;
71
- type AccordionPropsType = {
61
+ type CommonProps$9 = {
72
62
  /**
73
- * The panel label.
63
+ * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
64
+ * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
74
65
  */
75
- label: string;
66
+ margin?: Space$1 | Margin;
76
67
  /**
77
- * Material Symbol name or SVG element used as the icon that will be placed next to panel label.
68
+ * Contains one or more accordion items.
78
69
  */
79
- icon?: string | SVG$h;
70
+ children: ReactElement<AccordionItemProps>[] | ReactElement<AccordionItemProps>;
71
+ };
72
+ type IndependentProps = CommonProps$9 & {
80
73
  /**
81
- * Assistive text to be placed on the right side of the panel.
74
+ * When true, limits the user to single-open section at a time. When false, multiple sections can be opened simultaneously.
82
75
  */
83
- assistiveText?: string;
76
+ independent: true;
84
77
  /**
85
- * If true, the component will be disabled.
78
+ * Initially active accordion, only when it is uncontrolled.If the accordion is not independent,
79
+ * several accordions can be activated by default.
86
80
  */
87
- disabled?: boolean;
81
+ defaultIndexActive?: number;
88
82
  /**
89
- * The expanded panel of the accordion. This area can be used to render
90
- * custom content.
83
+ * The index of the active accordion. If undefined, the component will be uncontrolled and the active
84
+ * accordion will be managed internally by the component. If null, the component will be controlled and all
85
+ * accordions will be closed. If the accordion is not independent, several accordions can be activated.
86
+ */
87
+ indexActive?: number;
88
+ /**
89
+ * This function will be called when the user clicks on an accordion. The index of the clicked accordion will be passed as a parameter.
91
90
  */
92
- children: React.ReactNode;
91
+ onActiveChange?: (index: number) => void;
93
92
  };
94
- type Props$K = {
93
+ type NonIndependentProps = CommonProps$9 & {
95
94
  /**
96
- * Initially active accordion, only when it is uncontrolled.
95
+ * When true, limits the user to single-open section at a time. When false, multiple sections can be opened simultaneously.
97
96
  */
98
- defaultIndexActive?: number;
97
+ independent?: false;
99
98
  /**
100
- * The index of the active accordion. If undefined, the component will be uncontrolled and the active accordion will be managed internally by the component.
101
- * If null, the component will be controlled and all accordions will be closed.
99
+ * Initially active accordion, only when it is uncontrolled. If the accordion is not independent,
100
+ * several accordions can be activated by default.
102
101
  */
103
- indexActive?: number;
102
+ defaultIndexActive?: number[];
104
103
  /**
105
- * If true, the component will be disabled.
104
+ * The index of the active accordion. If undefined, the component will be uncontrolled and the active
105
+ * accordion will be managed internally by the component. If null, the component will be controlled and all
106
+ * accordions will be closed. If the accordion is not independent, several accordions can be activated.
106
107
  */
107
- disabled?: boolean;
108
+ indexActive?: number[];
108
109
  /**
109
110
  * This function will be called when the user clicks on an accordion. The index of the clicked accordion will be passed as a parameter.
110
111
  */
111
- onActiveChange?: (indexActive: number) => void;
112
+ onActiveChange?: (index: number[]) => void;
113
+ };
114
+ type Props$J = IndependentProps | NonIndependentProps;
115
+
116
+ declare const DxcAccordion: {
117
+ (props: Props$J): JSX.Element;
118
+ AccordionItem: ({ label, subLabel, badge, statusLight, icon, assistiveText, disabled, children, tabIndex, }: AccordionItemProps) => JSX.Element;
119
+ };
120
+
121
+ type Action$2 = {
112
122
  /**
113
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
114
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
123
+ * The icon of the action. It can be a string with the name of the icon or an SVG component.
115
124
  */
116
- margin?: Space$t | Margin$o;
125
+ icon?: string | SVG;
117
126
  /**
118
- * Customized accordion(s) that are allowed inside an Accordion Group.
127
+ * The label of the action.
119
128
  */
120
- children: React.ReactElement<AccordionPropsType>[] | React.ReactElement<AccordionPropsType>;
121
- };
122
-
123
- declare const DxcAccordionGroup: {
124
- ({ defaultIndexActive, indexActive, disabled, onActiveChange, margin, children, }: Props$K): JSX.Element;
125
- Accordion: ({ ...childProps }: AccordionPropsType) => JSX.Element;
129
+ label: string;
130
+ /**
131
+ * The function that will be executed when the user clicks on the action button.
132
+ */
133
+ onClick: () => void;
126
134
  };
127
-
128
- type Space$s = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
129
- type Margin$n = {
130
- top?: Space$s;
131
- bottom?: Space$s;
132
- left?: Space$s;
133
- right?: Space$s;
135
+ type Message = {
136
+ /**
137
+ * The function that will be executed when the user clicks on the close action button.
138
+ */
139
+ onClose?: () => void;
140
+ /**
141
+ * The content of the message. The only Halstack component allowed within the text of an alert is the Link component,
142
+ * and it should be used exclusively to direct users to additional resources or relevant pages.
143
+ * No other components are permitted within the content of an alert.
144
+ */
145
+ text: ReactNode;
134
146
  };
135
- type Props$J = {
147
+ type CommonProps$8 = {
136
148
  /**
137
- * Uses on of the available alert types.
149
+ * If true, the alert will have a close button that will remove the message from the alert,
150
+ * only in banner and inline modes. The rest of the functionality will depend
151
+ * on the onClose event of each message (e.g. closing the modal alert).
138
152
  */
139
- type?: "info" | "confirm" | "warning" | "error";
153
+ closable?: boolean;
140
154
  /**
141
- * Uses on of the available alert modes:
142
- * 'inline': If onClose function is received, close button will be visible and the function will be executed when it's clicked.
143
- * There is no overlay layer. Position should be decided by the user.
144
- * 'modal': The alert will be displayed in the middle of the screen with an overlay layer behind.
145
- * The onClose function will be executed when the X button or the overlay is clicked. d
146
- * The user has the responsibility of hiding the modal in the onClose function, otherwise the modal will remain visible.
155
+ * Primary action of the alert.
147
156
  */
148
- mode?: "inline" | "modal";
157
+ primaryAction?: Action$2;
149
158
  /**
150
- * Text to display after icon and alert type and before content.
159
+ * Secondary action of the alert.
151
160
  */
152
- inlineText?: string;
161
+ secondaryAction?: Action$2;
153
162
  /**
154
- * This function will be called when the user clicks the close button. If there is no function we should close the alert by default.
163
+ * Specifies the semantic meaning of the alert.
155
164
  */
156
- onClose?: () => void;
165
+ semantic?: "error" | "info" | "success" | "warning";
157
166
  /**
158
- * The details section of the alert. Can be used to render custom content in this area.
167
+ * Title of the alert.
159
168
  */
160
- children?: React.ReactNode;
169
+ title: string;
170
+ };
171
+ type ModeSpecificProps = {
161
172
  /**
162
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
163
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
173
+ * List of messages to be displayed. Each message has a close action that will,
174
+ * apart from remove from the alert the current message, call the onClose if it is defined.
175
+ * If the message is an array, the alert will show a navigation bar to move between the messages.
176
+ * The modal mode only allows one message per alert. In this case, the message must be an object
177
+ * and the presence of the onClose attribute is mandatory, since the management of the closing
178
+ * of the alert relies completely on the user.
164
179
  */
165
- margin?: Space$s | Margin$n;
180
+ message?: Message | Message[];
166
181
  /**
167
- * Size of the component.
182
+ * The mode of the alert.
168
183
  */
169
- size?: "small" | "medium" | "large" | "fillParent" | "fitContent";
184
+ mode?: "inline" | "banner";
185
+ } | {
170
186
  /**
171
- * Value of the tabindex attribute applied to the close button.
187
+ * List of messages to be displayed. Each message has a close action that will,
188
+ * apart from remove from the alert the current message, call the onClose if it is defined.
189
+ * If the message is an array, the alert will show a navigation bar to move between the messages.
190
+ * The modal mode only allows one message per alert. In this case, the message must be an object
191
+ * and the presence of the onClose attribute is mandatory, since the management of the closing
192
+ * of the alert relies completely on the user.
172
193
  */
173
- tabIndex?: number;
194
+ message: Required<Message>;
195
+ /**
196
+ * The mode of the alert.
197
+ */
198
+ mode: "modal";
174
199
  };
200
+ type Props$I = CommonProps$8 & ModeSpecificProps;
175
201
 
176
- declare const DxcAlert: ({ type, mode, inlineText, onClose, children, margin, size, tabIndex, }: Props$J) => JSX.Element;
202
+ declare function DxcAlert({ closable, message, mode, primaryAction, secondaryAction, semantic, title, }: Props$I): react_jsx_runtime.JSX.Element;
177
203
 
178
- type SVG$g = React.ReactNode & React.SVGProps<SVGSVGElement>;
179
204
  type SidenavTitlePropsType = {
180
205
  /**
181
206
  * The area inside the sidenav title. This area can be used to render custom content.
182
207
  */
183
- children: React.ReactNode;
208
+ children: ReactNode;
184
209
  };
185
210
  type SidenavSectionPropsType = {
186
211
  /**
187
212
  * The area inside the sidenav section. This area can be used to render sidenav groups, links and custom content.
188
213
  */
189
- children: React.ReactNode;
214
+ children: ReactNode;
190
215
  };
191
216
  type SidenavGroupPropsType = {
192
217
  /**
@@ -201,11 +226,11 @@ type SidenavGroupPropsType = {
201
226
  /**
202
227
  * Material Symbol name or SVG icon to be displayed next to the title of the group.
203
228
  */
204
- icon?: string | SVG$g;
229
+ icon?: string | SVG;
205
230
  /**
206
231
  * The area inside the sidenav group. This area can be used to render sidenav links.
207
232
  */
208
- children: React.ReactNode;
233
+ children: ReactNode;
209
234
  };
210
235
  type SidenavLinkPropsType = {
211
236
  /**
@@ -219,7 +244,7 @@ type SidenavLinkPropsType = {
219
244
  /**
220
245
  * The Material symbol or SVG element used as the icon that will be placed to the left of the link text.
221
246
  */
222
- icon?: string | SVG$g;
247
+ icon?: string | SVG;
223
248
  /**
224
249
  * If true, the link will be marked as selected. Moreover, in that same case,
225
250
  * if it is contained within a collapsed group, and consequently, the currently selected link is not visible,
@@ -229,99 +254,28 @@ type SidenavLinkPropsType = {
229
254
  /**
230
255
  * This function will be called when the user clicks the link and the event will be passed to this function.
231
256
  */
232
- onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
257
+ onClick?: (event: MouseEvent<HTMLAnchorElement>) => void;
233
258
  /**
234
259
  * The area inside the sidenav link.
235
260
  */
236
- children: React.ReactNode;
261
+ children: ReactNode;
237
262
  /**
238
263
  * Value of the tabindex.
239
264
  */
240
265
  tabIndex?: number;
241
266
  };
242
- type Props$I = {
267
+ type Props$H = {
243
268
  /**
244
269
  * The area assigned to render the sidenav title. It is highly recommended to use the sidenav title.
245
270
  */
246
- title?: React.ReactNode;
271
+ title?: ReactNode;
247
272
  /**
248
273
  * The area inside the sidenav. This area can be used to render the content inside the sidenav.
249
274
  */
250
- children: React.ReactNode;
275
+ children: ReactNode;
251
276
  };
252
277
 
253
- type Space$r = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
254
- type SVG$f = React.ReactNode & React.SVGProps<SVGSVGElement>;
255
- type SocialLink = {
256
- /**
257
- * URL of the page the link goes to.
258
- */
259
- href: string;
260
- /**
261
- * Material Symbol name or SVG element as the icon used for the link.
262
- */
263
- logo: string | SVG$f;
264
- /**
265
- * Value for the HTML properties title and aria-label.
266
- */
267
- title: string;
268
- };
269
- type BottomLink = {
270
- /**
271
- * URL of the page the link goes to.
272
- */
273
- href: string;
274
- /**
275
- * Text for the link.
276
- */
277
- text: string;
278
- };
279
- type FooterPropsType = {
280
- /**
281
- * An array of objects representing the links that will be rendered as
282
- * icons at the top-right side of the footer.
283
- */
284
- socialLinks?: SocialLink[];
285
- /**
286
- * An array of objects representing the links that will be rendered at
287
- * the bottom part of the footer.
288
- */
289
- bottomLinks?: BottomLink[];
290
- /**
291
- * The text that will be displayed as copyright disclaimer.
292
- */
293
- copyright?: string;
294
- /**
295
- * The center section of the footer. Can be used to render custom
296
- * content in this area.
297
- */
298
- children?: React.ReactNode;
299
- /**
300
- * Size of the top margin to be applied to the footer.
301
- */
302
- margin?: Space$r;
303
- /**
304
- * Value of the tabindex for all interactive elements, except those
305
- * inside the custom area.
306
- */
307
- tabIndex?: number;
308
- /**
309
- * Determines the visual style and layout
310
- * - "default": The default mode with full content and styling.
311
- * - "reduced": A reduced mode with minimal content and styling.
312
- */
313
- mode?: "default" | "reduced";
314
- };
315
-
316
- type Space$q = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
317
- type Margin$m = {
318
- top?: Space$q;
319
- bottom?: Space$q;
320
- left?: Space$q;
321
- right?: Space$q;
322
- };
323
278
  type Size$4 = "small" | "medium" | "large" | "fillParent" | "fitContent";
324
- type SVG$e = React.ReactNode & React.SVGProps<SVGSVGElement>;
325
279
  type Option$1 = {
326
280
  /**
327
281
  * Option display value.
@@ -330,13 +284,13 @@ type Option$1 = {
330
284
  /**
331
285
  * Material Symbol name or SVG element as the icon that will be placed next to the label.
332
286
  */
333
- icon?: string | SVG$e;
287
+ icon?: string | SVG;
334
288
  /**
335
289
  * Option inner value.
336
290
  */
337
291
  value: string;
338
292
  };
339
- type Props$H = {
293
+ type Props$G = {
340
294
  /**
341
295
  * An array of objects representing the options.
342
296
  */
@@ -349,7 +303,7 @@ type Props$H = {
349
303
  /**
350
304
  * Material Symbol name or SVG element as the icon that will be placed next to the label.
351
305
  */
352
- icon?: string | SVG$e;
306
+ icon?: string | SVG;
353
307
  /**
354
308
  * Whether the icon should appear after or before the label.
355
309
  */
@@ -380,7 +334,7 @@ type Props$H = {
380
334
  * You can pass an object with 'top', 'bottom', 'left' and 'right'
381
335
  * properties in order to specify different margin sizes.
382
336
  */
383
- margin?: Space$q | Margin$m;
337
+ margin?: Space$1 | Margin;
384
338
  /**
385
339
  * Size of the component.
386
340
  */
@@ -389,10 +343,14 @@ type Props$H = {
389
343
  * Value of the tabindex attribute.
390
344
  */
391
345
  tabIndex?: number;
346
+ /**
347
+ * Text representing advisory information related to the dropdown's trigger action.
348
+ * Under the hood, this prop also serves as an accessible label for the component.
349
+ */
350
+ title?: string;
392
351
  };
393
352
 
394
- type Space$p = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
395
- type Props$G = {
353
+ type Props$F = {
396
354
  /**
397
355
  * Whether a contrast line should appear at the bottom of the header.
398
356
  */
@@ -402,12 +360,12 @@ type Props$G = {
402
360
  * for the first child in the content, so we recommend the use of React.Fragment
403
361
  * to be applied correctly. Otherwise, the styles can be modified.
404
362
  */
405
- content?: React.ReactNode;
363
+ content?: ReactNode;
406
364
  /**
407
365
  * Content shown in responsive version. It receives the close menu handler that can
408
366
  * be used to add that functionality when a element is clicked.
409
367
  */
410
- responsiveContent?: (closeHandler: () => void) => React.ReactNode;
368
+ responsiveContent?: (closeHandler: () => void) => ReactNode;
411
369
  /**
412
370
  * This function will be called when the user clicks the header logo.
413
371
  */
@@ -415,7 +373,7 @@ type Props$G = {
415
373
  /**
416
374
  * Size of the bottom margin to be applied to the header.
417
375
  */
418
- margin?: Space$p;
376
+ margin?: Space$1;
419
377
  /**
420
378
  * Value of the tabindex for all interactive elements, except those inside the
421
379
  * custom area.
@@ -423,13 +381,74 @@ type Props$G = {
423
381
  tabIndex?: number;
424
382
  };
425
383
 
384
+ type SocialLink = {
385
+ /**
386
+ * URL of the page the link goes to.
387
+ */
388
+ href: string;
389
+ /**
390
+ * Material Symbol name or SVG element as the icon used for the link.
391
+ */
392
+ logo: string | SVG;
393
+ /**
394
+ * Value for the HTML properties title and aria-label.
395
+ */
396
+ title: string;
397
+ };
398
+ type BottomLink = {
399
+ /**
400
+ * URL of the page the link goes to.
401
+ */
402
+ href: string;
403
+ /**
404
+ * Text for the link.
405
+ */
406
+ text: string;
407
+ };
408
+ type FooterPropsType = {
409
+ /**
410
+ * An array of objects representing the links that will be rendered as
411
+ * icons at the top-right side of the footer.
412
+ */
413
+ socialLinks?: SocialLink[];
414
+ /**
415
+ * An array of objects representing the links that will be rendered at
416
+ * the bottom part of the footer.
417
+ */
418
+ bottomLinks?: BottomLink[];
419
+ /**
420
+ * The text that will be displayed as copyright disclaimer.
421
+ */
422
+ copyright?: string;
423
+ /**
424
+ * The center section of the footer. Can be used to render custom
425
+ * content in this area.
426
+ */
427
+ children?: ReactNode;
428
+ /**
429
+ * Size of the top margin to be applied to the footer.
430
+ */
431
+ margin?: Space$1;
432
+ /**
433
+ * Value of the tabindex for all interactive elements, except those
434
+ * inside the custom area.
435
+ */
436
+ tabIndex?: number;
437
+ /**
438
+ * Determines the visual style and layout
439
+ * - "default": The default mode with full content and styling.
440
+ * - "reduced": A reduced mode with minimal content and styling.
441
+ */
442
+ mode?: "default" | "reduced";
443
+ };
444
+
426
445
  type AppLayoutMainPropsType = {
427
446
  /**
428
447
  * Everything between the tags will be displayed as the content of the main part of the application.
429
448
  */
430
- children: React.ReactNode;
449
+ children: ReactNode;
431
450
  };
432
- type AppLayoutPropsType = {
451
+ type ApplicationLayoutPropsType = {
433
452
  /**
434
453
  * Text to be placed next to the hamburger button that toggles the
435
454
  * visibility of the sidenav.
@@ -438,40 +457,39 @@ type AppLayoutPropsType = {
438
457
  /**
439
458
  * Header content.
440
459
  */
441
- header?: React.ReactNode;
460
+ header?: ReactNode;
442
461
  /**
443
462
  * Sidenav content
444
463
  */
445
- sidenav?: React.ReactNode;
464
+ sidenav?: ReactNode;
446
465
  /**
447
466
  * Footer content
448
467
  */
449
- footer?: React.ReactNode;
468
+ footer?: ReactNode;
450
469
  /**
451
470
  * Use the DxcApplicationLayout.Main provided to render main content.
452
471
  */
453
- children: React.ReactElement<AppLayoutMainPropsType>;
472
+ children: ReactElement<AppLayoutMainPropsType>;
454
473
  };
455
474
 
456
475
  declare const DxcApplicationLayout: {
457
- ({ visibilityToggleLabel, header, sidenav, footer, children, }: AppLayoutPropsType): JSX.Element;
476
+ ({ visibilityToggleLabel, header, sidenav, footer, children, }: ApplicationLayoutPropsType): JSX.Element;
477
+ Footer: ({ socialLinks, bottomLinks, copyright, children, margin, tabIndex, mode, }: FooterPropsType) => JSX.Element;
458
478
  Header: {
459
- ({ underlined, content, responsiveContent, onClick, margin, tabIndex, }: Props$G): JSX.Element;
460
- Dropdown: (props: react.ComponentProps<({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, }: Props$H) => JSX.Element>) => react_jsx_runtime.JSX.Element;
479
+ ({ underlined, content, responsiveContent, onClick, margin, tabIndex, }: Props$F): JSX.Element;
480
+ Dropdown: (props: react.ComponentProps<({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$G) => react_jsx_runtime.JSX.Element>) => react_jsx_runtime.JSX.Element;
461
481
  };
462
482
  Main: ({ children }: AppLayoutMainPropsType) => JSX.Element;
463
- Footer: ({ socialLinks, bottomLinks, copyright, children, margin, tabIndex, mode, }: FooterPropsType) => JSX.Element;
464
483
  SideNav: {
465
- ({ title, children }: Props$I): JSX.Element;
484
+ ({ title, children }: Props$H): JSX.Element;
466
485
  Section: ({ children }: SidenavSectionPropsType) => JSX.Element;
467
486
  Group: ({ title, collapsable, icon, children }: SidenavGroupPropsType) => JSX.Element;
468
487
  Link: react.ForwardRefExoticComponent<SidenavLinkPropsType & react.RefAttributes<HTMLAnchorElement>>;
469
488
  Title: ({ children }: SidenavTitlePropsType) => JSX.Element;
470
489
  };
471
- useResponsiveSidenavVisibility: () => (isSidenavVisible: boolean) => void;
490
+ useResponsiveSidenavVisibility: () => ((_isSidenavVisible: boolean) => void) | null;
472
491
  };
473
492
 
474
- type SVG$d = React.ReactNode & React.SVGProps<SVGSVGElement>;
475
493
  type ContextualProps = {
476
494
  /**
477
495
  * Text to be placed in the badge.
@@ -508,7 +526,7 @@ type NotificationProps = {
508
526
  */
509
527
  color?: never;
510
528
  };
511
- type CommonProps$6 = {
529
+ type CommonProps$7 = {
512
530
  /**
513
531
  * Text representing advisory information related to the badge. Under the hood, this prop also serves as an accessible label for the component.
514
532
  */
@@ -516,89 +534,54 @@ type CommonProps$6 = {
516
534
  /**
517
535
  * Material Symbol name or SVG element used as the icon that will be placed next to the badge label in contextual mode.
518
536
  */
519
- icon?: string | SVG$d;
537
+ icon?: string | SVG;
520
538
  /**
521
539
  * Size of the component.
522
540
  */
523
541
  size?: "small" | "medium" | "large";
524
542
  };
525
- type Props$F = (ContextualProps | NotificationProps) & CommonProps$6;
543
+ type Props$E = (ContextualProps | NotificationProps) & CommonProps$7;
526
544
 
527
- declare const DxcBadge: ({ label, title, mode, color, icon, notificationLimit, size, }: Props$F) => JSX.Element;
545
+ declare const DxcBadge: ({ label, title, mode, color, icon, notificationLimit, size, }: Props$E) => JSX.Element;
528
546
 
529
- type Spacing$1 = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
530
- type Props$E = {
547
+ type CoreSpacingTokensType = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "0.75rem" | "1rem" | "1.5rem" | "2rem" | "2.5rem" | "3rem" | "3.5rem" | "4rem" | "5rem" | "6rem" | "7rem";
548
+
549
+ type Props$D = {
531
550
  /**
532
551
  * Applies the spacing scale to all sides.
533
552
  */
534
- space?: Spacing$1;
553
+ space?: CoreSpacingTokensType;
535
554
  /**
536
555
  * Applies the spacing scale to the left and right sides.
537
556
  */
538
- horizontal?: Spacing$1;
557
+ horizontal?: CoreSpacingTokensType;
539
558
  /**
540
559
  * Applies the spacing scale to the top and bottom sides.
541
560
  */
542
- vertical?: Spacing$1;
561
+ vertical?: CoreSpacingTokensType;
543
562
  /**
544
563
  * Applies the spacing scale to the top side.
545
564
  */
546
- top?: Spacing$1;
565
+ top?: CoreSpacingTokensType;
547
566
  /**
548
567
  * Applies the spacing scale to the right side.
549
568
  */
550
- right?: Spacing$1;
569
+ right?: CoreSpacingTokensType;
551
570
  /**
552
571
  * Applies the spacing scale to the bottom side.
553
572
  */
554
- bottom?: Spacing$1;
573
+ bottom?: CoreSpacingTokensType;
555
574
  /**
556
575
  * Applies the spacing scale to the left side.
557
576
  */
558
- left?: Spacing$1;
577
+ left?: CoreSpacingTokensType;
559
578
  /**
560
579
  * Custom content inside the bleed.
561
580
  */
562
- children: React.ReactNode;
581
+ children: ReactNode;
563
582
  };
564
583
 
565
- declare function Bleed({ space, horizontal, vertical, top, right, bottom, left, children, }: Props$E): JSX.Element;
566
-
567
- type Space$o = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
568
- type Margin$l = {
569
- top?: Space$o;
570
- bottom?: Space$o;
571
- left?: Space$o;
572
- right?: Space$o;
573
- };
574
- type Props$D = {
575
- /**
576
- * The size of the shadow to be displayed around the box.
577
- */
578
- shadowDepth?: 0 | 1 | 2;
579
- /**
580
- * Changes the display CSS property of the box div.
581
- */
582
- display?: string;
583
- /**
584
- * Custom content that will be placed in the box component.
585
- */
586
- children: React.ReactNode;
587
- /**
588
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
589
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
590
- */
591
- margin?: Space$o | Margin$l;
592
- /**
593
- * Size of the component.
594
- */
595
- size?: "small" | "medium" | "large" | "fillParent" | "fitContent";
596
- };
597
-
598
- /**
599
- * @deprecated
600
- */
601
- declare const DxcBox: ({ shadowDepth, display, children, margin, size, }: Props$D) => JSX.Element;
584
+ declare const Bleed: ({ space, horizontal, vertical, top, right, bottom, left, children }: Props$D) => react_jsx_runtime.JSX.Element;
602
585
 
603
586
  type Item$1 = {
604
587
  href?: string;
@@ -638,7 +621,6 @@ type Props$C = {
638
621
 
639
622
  declare const DxcBreadcrumbs: ({ ariaLabel, items, itemsBeforeCollapse, onItemClick, showRoot, }: Props$C) => react_jsx_runtime.JSX.Element;
640
623
 
641
- type SVG$c = React.ReactNode & React.SVGProps<SVGSVGElement>;
642
624
  type IconProps = {
643
625
  /**
644
626
  * Defines the style of the bullet point in the list.
@@ -647,11 +629,11 @@ type IconProps = {
647
629
  /**
648
630
  * Icon to display as bullet.
649
631
  */
650
- icon: string | SVG$c;
632
+ icon: string | SVG;
651
633
  /**
652
634
  * Text to be shown in the list.
653
635
  */
654
- children: React.ReactNode;
636
+ children: ReactNode;
655
637
  };
656
638
  type OtherProps = {
657
639
  /**
@@ -665,7 +647,7 @@ type OtherProps = {
665
647
  /**
666
648
  * Text to be shown in the list.
667
649
  */
668
- children: React.ReactNode;
650
+ children: ReactNode;
669
651
  };
670
652
  type Props$B = IconProps | OtherProps;
671
653
 
@@ -673,7 +655,7 @@ type BulletedListItemPropsType = {
673
655
  /**
674
656
  * Text to be shown in the list.
675
657
  */
676
- children?: React.ReactNode;
658
+ children?: ReactNode;
677
659
  };
678
660
 
679
661
  declare const DxcBulletedList: {
@@ -681,17 +663,11 @@ declare const DxcBulletedList: {
681
663
  Item: ({ children }: BulletedListItemPropsType) => JSX.Element;
682
664
  };
683
665
 
684
- type Space$n = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
685
- type Margin$k = {
686
- top?: Space$n;
687
- bottom?: Space$n;
688
- left?: Space$n;
689
- right?: Space$n;
690
- };
691
- type SVG$b = React.ReactNode & React.SVGProps<SVGSVGElement>;
666
+ type Semantic = "default" | "error" | "warning" | "success" | "info";
667
+ type Mode$1 = "primary" | "secondary" | "tertiary";
692
668
  type Size$3 = {
693
669
  /**
694
- * Height of the component.
670
+ * Height of the button.
695
671
  */
696
672
  height?: "small" | "medium" | "large";
697
673
  width?: "small" | "medium" | "large" | "fillParent" | "fitContent";
@@ -704,11 +680,11 @@ type Props$A = {
704
680
  /**
705
681
  * The available button modes.
706
682
  */
707
- mode?: "primary" | "secondary" | "tertiary";
683
+ mode?: Mode$1;
708
684
  /**
709
685
  * Specifies the semantic meaning of the buttons, which determines its color.
710
686
  */
711
- semantic?: "default" | "error" | "warning" | "success" | "info";
687
+ semantic?: Semantic;
712
688
  /**
713
689
  * If true, the component will be disabled.
714
690
  */
@@ -728,7 +704,7 @@ type Props$A = {
728
704
  /**
729
705
  * Material Symbol name or SVG element as the icon that will be placed next to the label.
730
706
  */
731
- icon?: string | SVG$b;
707
+ icon?: string | SVG;
732
708
  /**
733
709
  * This function will be called when the user clicks the button.
734
710
  */
@@ -737,7 +713,7 @@ type Props$A = {
737
713
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
738
714
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
739
715
  */
740
- margin?: Space$n | Margin$k;
716
+ margin?: Space$1 | Margin;
741
717
  /**
742
718
  * Size of the component.
743
719
  */
@@ -748,14 +724,13 @@ type Props$A = {
748
724
  tabIndex?: number;
749
725
  };
750
726
 
751
- declare const DxcButton: ({ label, mode, semantic, disabled, iconPosition, title, type, icon, onClick, margin, size, tabIndex, }: Props$A) => JSX.Element;
727
+ declare const DxcButton: ({ disabled, icon, iconPosition, label, margin, mode, onClick, semantic, size, tabIndex, title, type, }: Props$A) => JSX.Element;
752
728
 
753
- type Space$m = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
754
729
  type Size$2 = {
755
- top?: Space$m;
756
- bottom?: Space$m;
757
- left?: Space$m;
758
- right?: Space$m;
730
+ top?: Space$1;
731
+ bottom?: Space$1;
732
+ left?: Space$1;
733
+ right?: Space$1;
759
734
  };
760
735
  type Props$z = {
761
736
  /**
@@ -773,7 +748,7 @@ type Props$z = {
773
748
  * component. You can pass an object with 'top', 'bottom', 'left'
774
749
  * and 'right' properties in order to specify different padding sizes.
775
750
  */
776
- imagePadding?: Space$m | Size$2;
751
+ imagePadding?: Space$1 | Size$2;
777
752
  /**
778
753
  * Whether the image should appear in relation to the content.
779
754
  */
@@ -796,7 +771,7 @@ type Props$z = {
796
771
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
797
772
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
798
773
  */
799
- margin?: Space$m | Size$2;
774
+ margin?: Space$1 | Size$2;
800
775
  /**
801
776
  * Value of the tabindex attribute applied when the component is clickable.
802
777
  */
@@ -808,33 +783,29 @@ type Props$z = {
808
783
  /**
809
784
  * Custom content that will be placed inside the component.
810
785
  */
811
- children?: React.ReactNode;
786
+ children?: ReactNode;
812
787
  };
813
788
 
814
789
  declare const DxcCard: ({ imageSrc, imageBgColor, imagePadding, imagePosition, linkHref, onClick, imageCover, margin, tabIndex, outlined, children, }: Props$z) => JSX.Element;
815
790
 
816
- type Space$l = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
817
- type Margin$j = {
818
- top?: Space$l;
819
- bottom?: Space$l;
820
- left?: Space$l;
821
- right?: Space$l;
822
- };
823
791
  type Props$y = {
824
792
  /**
825
- * Initial state of the checkbox, only when it is uncontrolled.
793
+ * Specifies a string to be used as the name for the checkbox element when no `label` is provided.
826
794
  */
827
- defaultChecked?: boolean;
795
+ ariaLabel?: string;
828
796
  /**
829
797
  * If true, the component is checked. If undefined the component will be
830
798
  * uncontrolled and the value will be managed internally by the component.
831
799
  */
832
800
  checked?: boolean;
833
801
  /**
834
- * Will be passed to the value attribute of the html input element.
835
- * When inside a form, this value will be only submitted if the checkbox is checked.
802
+ * Initial state of the checkbox, only when it is uncontrolled.
836
803
  */
837
- value?: string;
804
+ defaultChecked?: boolean;
805
+ /**
806
+ * If true, the component will be disabled.
807
+ */
808
+ disabled?: boolean;
838
809
  /**
839
810
  * Text to be placed next to the checkbox.
840
811
  */
@@ -843,14 +814,22 @@ type Props$y = {
843
814
  * Whether the label should appear after or before the checkbox.
844
815
  */
845
816
  labelPosition?: "before" | "after";
817
+ /**
818
+ * Size of the margin to be applied to the component
819
+ * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
820
+ * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
821
+ * in order to specify different margin sizes.
822
+ */
823
+ margin?: Space$1 | Margin;
846
824
  /**
847
825
  * Name attribute of the input element.
848
826
  */
849
827
  name?: string;
850
828
  /**
851
- * If true, the component will be disabled.
829
+ * This function will be called when the user clicks the checkbox.
830
+ * The new value will be passed as a parameter.
852
831
  */
853
- disabled?: boolean;
832
+ onChange?: (value: boolean) => void;
854
833
  /**
855
834
  * If true, the component will display '(Optional)' next to the label.
856
835
  */
@@ -859,18 +838,6 @@ type Props$y = {
859
838
  * If true, the component will not be mutable, meaning the user can not edit the control.
860
839
  */
861
840
  readOnly?: boolean;
862
- /**
863
- * This function will be called when the user clicks the checkbox.
864
- * The new value will be passed as a parameter.
865
- */
866
- onChange?: (value: boolean) => void;
867
- /**
868
- * Size of the margin to be applied to the component
869
- * ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
870
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
871
- * in order to specify different margin sizes.
872
- */
873
- margin?: Space$l | Margin$j;
874
841
  /**
875
842
  * Size of the component.
876
843
  */
@@ -879,18 +846,15 @@ type Props$y = {
879
846
  * Value of the tabindex.
880
847
  */
881
848
  tabIndex?: number;
849
+ /**
850
+ * Will be passed to the value attribute of the html input element.
851
+ * When inside a form, this value will be only submitted if the checkbox is checked.
852
+ */
853
+ value?: string;
882
854
  };
883
855
 
884
856
  declare const DxcCheckbox: react.ForwardRefExoticComponent<Props$y & react.RefAttributes<HTMLDivElement>>;
885
857
 
886
- type Space$k = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
887
- type Margin$i = {
888
- top?: Space$k;
889
- bottom?: Space$k;
890
- left?: Space$k;
891
- right?: Space$k;
892
- };
893
- type SVG$a = React.ReactNode & React.SVGProps<SVGSVGElement>;
894
858
  type Props$x = {
895
859
  /**
896
860
  * Text to be placed on the chip.
@@ -899,11 +863,11 @@ type Props$x = {
899
863
  /**
900
864
  * Element or path used as icon to be placed after the chip label.
901
865
  */
902
- suffixIcon?: string | SVG$a;
866
+ suffixIcon?: string | SVG;
903
867
  /**
904
868
  * Element or path used as icon to be placed before the chip label.
905
869
  */
906
- prefixIcon?: string | SVG$a;
870
+ prefixIcon?: string | SVG;
907
871
  /**
908
872
  * This function will be called when the suffix is clicked.
909
873
  */
@@ -920,112 +884,20 @@ type Props$x = {
920
884
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
921
885
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
922
886
  */
923
- margin?: Space$k | Margin$i;
887
+ margin?: Space$1 | Margin;
924
888
  /**
925
889
  * Value of the tabindex attribute.
926
890
  */
927
891
  tabIndex?: number;
928
892
  };
929
893
 
930
- declare const DxcChip: ({ label, suffixIcon, prefixIcon, onClickSuffix, onClickPrefix, disabled, margin, tabIndex, }: Props$x) => JSX.Element;
894
+ declare const DxcChip: ({ label, suffixIcon, prefixIcon, onClickSuffix, onClickPrefix, disabled, margin, tabIndex, }: Props$x) => react_jsx_runtime.JSX.Element;
931
895
 
932
- /**
933
- * Halstack Color Palette
934
- * @link https://developer.dxc.com/halstack/next/principles/color/#color-tokens-core-color-tokens
935
- */
936
- declare const CoreColorTokens: {
937
- color_black: string;
938
- color_white: string;
939
- color_transparent: string;
940
- color_grey_50: string;
941
- color_grey_100: string;
942
- color_grey_200: string;
943
- color_grey_300: string;
944
- color_grey_400: string;
945
- color_grey_500: string;
946
- color_grey_600: string;
947
- color_grey_700: string;
948
- color_grey_800: string;
949
- color_grey_900: string;
950
- color_grey_50_a: string;
951
- color_grey_100_a: string;
952
- color_grey_200_a: string;
953
- color_grey_300_a: string;
954
- color_grey_400_a: string;
955
- color_grey_500_a: string;
956
- color_grey_600_a: string;
957
- color_grey_700_a: string;
958
- color_grey_800_a: string;
959
- color_grey_900_a: string;
960
- color_purple_50: string;
961
- color_purple_100: string;
962
- color_purple_200: string;
963
- color_purple_300: string;
964
- color_purple_400: string;
965
- color_purple_500: string;
966
- color_purple_600: string;
967
- color_purple_700: string;
968
- color_purple_800: string;
969
- color_purple_900: string;
970
- color_blue_50: string;
971
- color_blue_100: string;
972
- color_blue_200: string;
973
- color_blue_300: string;
974
- color_blue_400: string;
975
- color_blue_500: string;
976
- color_blue_600: string;
977
- color_blue_700: string;
978
- color_blue_800: string;
979
- color_blue_900: string;
980
- color_red_50: string;
981
- color_red_100: string;
982
- color_red_200: string;
983
- color_red_300: string;
984
- color_red_400: string;
985
- color_red_500: string;
986
- color_red_600: string;
987
- color_red_700: string;
988
- color_red_800: string;
989
- color_red_900: string;
990
- color_green_50: string;
991
- color_green_100: string;
992
- color_green_200: string;
993
- color_green_300: string;
994
- color_green_400: string;
995
- color_green_500: string;
996
- color_green_600: string;
997
- color_green_700: string;
998
- color_green_800: string;
999
- color_green_900: string;
1000
- color_yellow_50: string;
1001
- color_yellow_100: string;
1002
- color_yellow_200: string;
1003
- color_yellow_300: string;
1004
- color_yellow_400: string;
1005
- color_yellow_500: string;
1006
- color_yellow_600: string;
1007
- color_yellow_700: string;
1008
- color_yellow_800: string;
1009
- color_yellow_900: string;
1010
- color_orange_50: string;
1011
- color_orange_100: string;
1012
- color_orange_200: string;
1013
- color_orange_300: string;
1014
- color_orange_400: string;
1015
- color_orange_500: string;
1016
- color_orange_600: string;
1017
- color_orange_700: string;
1018
- color_orange_800: string;
1019
- color_orange_900: string;
1020
- };
1021
- type CoreColorTokensType = keyof typeof CoreColorTokens;
1022
-
1023
- type SpacingValues = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
1024
- type Space$j = SpacingValues | {
1025
- top?: SpacingValues;
1026
- right?: SpacingValues;
1027
- bottom?: SpacingValues;
1028
- left?: SpacingValues;
896
+ type Space = Space$1 | {
897
+ top?: Space$1;
898
+ right?: Space$1;
899
+ bottom?: Space$1;
900
+ left?: Space$1;
1029
901
  };
1030
902
  type Inset$1 = {
1031
903
  top?: string;
@@ -1036,7 +908,7 @@ type Inset$1 = {
1036
908
  type Background = {
1037
909
  attachment?: string;
1038
910
  clip?: string;
1039
- color?: CoreColorTokensType;
911
+ color?: string;
1040
912
  image?: string;
1041
913
  origin?: string;
1042
914
  position?: string;
@@ -1045,8 +917,8 @@ type Background = {
1045
917
  };
1046
918
  type BorderProperties = {
1047
919
  width?: string;
1048
- style?: "none" | "dotted" | "dashed" | "solid" | "double" | "groove" | "ridge" | "inset" | "outset";
1049
- color?: CoreColorTokensType;
920
+ style?: string;
921
+ color?: string;
1050
922
  };
1051
923
  type Border = BorderProperties | {
1052
924
  top?: BorderProperties;
@@ -1094,7 +966,7 @@ type Props$w = {
1094
966
  /**
1095
967
  * Custom content inside the container.
1096
968
  */
1097
- children: React.ReactNode;
969
+ children: ReactNode;
1098
970
  /**
1099
971
  * Sets the display CSS property.
1100
972
  * The set of values is limited to the ones related to the outer display type.
@@ -1126,7 +998,7 @@ type Props$w = {
1126
998
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
1127
999
  * in order to specify different margin sizes.
1128
1000
  */
1129
- margin?: Space$j;
1001
+ margin?: Space;
1130
1002
  /**
1131
1003
  * Sets the max-height CSS property.
1132
1004
  *
@@ -1167,7 +1039,7 @@ type Props$w = {
1167
1039
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties
1168
1040
  * in order to specify different margin sizes.
1169
1041
  */
1170
- padding?: Space$j;
1042
+ padding?: Space;
1171
1043
  /**
1172
1044
  * Sets the position CSS property.
1173
1045
  *
@@ -1188,12 +1060,11 @@ type Props$w = {
1188
1060
  zIndex?: "auto" | number;
1189
1061
  };
1190
1062
 
1191
- declare const DxcContainer: ({ display, width, height, overflow, ...props }: Props$w) => react_jsx_runtime.JSX.Element;
1063
+ declare function DxcContainer({ display, width, height, overflow, ...props }: Props$w): react_jsx_runtime.JSX.Element;
1192
1064
 
1193
- type SVG$9 = React.ReactNode & React.SVGProps<SVGSVGElement>;
1194
1065
  type CommonItemProps = {
1195
- badge?: React.ReactElement;
1196
- icon?: string | SVG$9;
1066
+ badge?: ReactElement;
1067
+ icon?: string | SVG;
1197
1068
  label: string;
1198
1069
  };
1199
1070
  type Item = CommonItemProps & {
@@ -1209,48 +1080,140 @@ type Section = {
1209
1080
  };
1210
1081
  type Props$v = {
1211
1082
  /**
1212
- * Array of items to be displayed in the Contextual menu.
1213
- * Each item can be a single/simple item, a group item or a section.
1083
+ * Array of items to be displayed in the Contextual menu.
1084
+ * Each item can be a single/simple item, a group item or a section.
1085
+ */
1086
+ items: (Item | GroupItem)[] | Section[];
1087
+ };
1088
+
1089
+ declare function DxcContextualMenu({ items }: Props$v): react_jsx_runtime.JSX.Element;
1090
+
1091
+ type ActionCellsPropsType = {
1092
+ actions: ActionsPropsType;
1093
+ };
1094
+ type ActionsPropsType = Array<{
1095
+ icon: string | SVG;
1096
+ title: string;
1097
+ onClick: () => void;
1098
+ disabled?: boolean;
1099
+ tabIndex?: number;
1100
+ options?: never;
1101
+ } | {
1102
+ icon?: never;
1103
+ title: string;
1104
+ onClick: (value?: string) => void;
1105
+ disabled?: boolean;
1106
+ tabIndex?: number;
1107
+ options: Option$1[];
1108
+ }>;
1109
+ type Props$u = {
1110
+ /**
1111
+ * The center section of the table. Can be used to render custom
1112
+ * content in this area.
1214
1113
  */
1215
- items: (Item | GroupItem)[] | Section[];
1114
+ children: ReactNode;
1115
+ /**
1116
+ * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
1117
+ * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
1118
+ */
1119
+ margin?: Space$1 | Margin;
1120
+ /**
1121
+ * Determines the visual style and layout
1122
+ * - "default": Default table size.
1123
+ * - "reduced": More compact table with less spacing for high density information.
1124
+ */
1125
+ mode?: "default" | "reduced";
1216
1126
  };
1217
1127
 
1218
- declare const DxcContextualMenu: ({ items }: Props$v) => react_jsx_runtime.JSX.Element;
1219
-
1220
1128
  type GridColumn = {
1129
+ /**
1130
+ * Key that will be rendered from each row in rows.
1131
+ */
1221
1132
  key: string;
1133
+ /**
1134
+ * Label that will be used for the column header.
1135
+ */
1222
1136
  label: string;
1137
+ /**
1138
+ * Whether the column is resizable or not.
1139
+ */
1223
1140
  resizable?: boolean;
1141
+ /**
1142
+ * Whether the column is sortable or not.
1143
+ */
1224
1144
  sortable?: boolean;
1145
+ /**
1146
+ * Custom criteria for sorting the column.
1147
+ */
1148
+ sortFn?: (_a: ReactNode, _b: ReactNode) => 0 | 1 | -1;
1149
+ /**
1150
+ * Whether the column is draggable or not.
1151
+ */
1225
1152
  draggable?: boolean;
1153
+ /**
1154
+ * Whether the column cells are editable or not.
1155
+ */
1226
1156
  textEditable?: boolean;
1157
+ /**
1158
+ * Value that will be rendered from the summaryRow.
1159
+ */
1227
1160
  summaryKey?: string;
1161
+ /**
1162
+ * Sets the alignment inside the cells.
1163
+ */
1228
1164
  alignment?: "left" | "right" | "center";
1229
1165
  };
1230
1166
  type GridRow = {
1231
- [key: string]: React.ReactNode | undefined;
1167
+ /**
1168
+ * List of rows that will be rendered in each cell based on the key in each column.
1169
+ */
1170
+ [key: string]: ReactNode | undefined;
1232
1171
  };
1233
1172
  type HierarchyGridRow = GridRow & {
1234
1173
  childRows?: HierarchyGridRow[] | GridRow[];
1235
1174
  };
1236
1175
  type ExpandableGridRow = GridRow & {
1237
- expandedContent?: React.ReactNode;
1176
+ expandedContent?: ReactNode;
1238
1177
  expandedContentHeight?: number;
1239
1178
  };
1240
1179
  type ExpandableRows = {
1241
1180
  rows: ExpandableGridRow[];
1181
+ /**
1182
+ * Whether the rows can expand or not.
1183
+ */
1242
1184
  expandable: true;
1185
+ /**
1186
+ * This prop indicates the unique key that can be used to identify each row. This prop is mandatory if selectable is set to true, expandable is set to true or rows is of type HierarchyGridRow[].
1187
+ */
1243
1188
  uniqueRowId: string;
1244
1189
  };
1245
1190
  type HierarchyRows = {
1246
1191
  rows: HierarchyGridRow[];
1192
+ /**
1193
+ * This prop indicates the unique key that can be used to identify each row. This prop is mandatory if selectable is set to true, expandable is set to true or rows is of type HierarchyGridRow[].
1194
+ */
1247
1195
  uniqueRowId: string;
1196
+ /**
1197
+ * Whether the rows can expand or not.
1198
+ */
1248
1199
  expandable?: false;
1249
1200
  };
1250
1201
  type SelectableGridProps = {
1202
+ /**
1203
+ * Whether the rows are selectable or not.
1204
+ */
1251
1205
  selectable: true;
1206
+ /**
1207
+ * Set of selected rows. This prop is mandatory if selectable is set to true. The uniqueRowId key will be used to identify the each row.
1208
+ */
1252
1209
  selectedRows: Set<string | number>;
1210
+ /**
1211
+ * Function called whenever the selected values changes. This prop is mandatory if selectable is set to true.The uniqueRowId key will be used to identify the rows.
1212
+ */
1253
1213
  onSelectRows: (selectedRows: Set<number | string>) => void;
1214
+ /**
1215
+ * This prop indicates the unique key that can be used to identify each row. This prop is mandatory if selectable is set to true, expandable is set to true or rows is of type HierarchyGridRow[].
1216
+ */
1254
1217
  uniqueRowId: string;
1255
1218
  } | {
1256
1219
  selectable?: false;
@@ -1258,27 +1221,99 @@ type SelectableGridProps = {
1258
1221
  onSelectRows?: never;
1259
1222
  uniqueRowId?: string;
1260
1223
  };
1261
- type CommonProps$5 = {
1224
+ type PaginatedProps$1 = {
1225
+ /**
1226
+ * If true, paginator will be displayed.
1227
+ */
1228
+ showPaginator?: true;
1229
+ /**
1230
+ * Number of total items.
1231
+ */
1232
+ totalItems?: number;
1233
+ /**
1234
+ * If true, a select component for navigation between pages will be displayed.
1235
+ */
1236
+ showGoToPage?: boolean;
1237
+ /**
1238
+ * Number of items per page.
1239
+ */
1240
+ itemsPerPage?: number;
1241
+ /**
1242
+ * An array of numbers representing the items per page options.
1243
+ */
1244
+ itemsPerPageOptions?: number[];
1245
+ /**
1246
+ * This function will be called when the user selects an item per page
1247
+ * option. The value selected will be passed as a parameter.
1248
+ */
1249
+ itemsPerPageFunction?: (value: number) => void;
1250
+ /**
1251
+ * Function called whenever the current page is changed.
1252
+ */
1253
+ onPageChange?: (_page: number) => void;
1254
+ };
1255
+ type NonPaginatedProps$1 = {
1256
+ /**
1257
+ * If true, paginator will be displayed.
1258
+ */
1259
+ showPaginator: false;
1260
+ /**
1261
+ * Number of total items.
1262
+ */
1263
+ totalItems?: never;
1264
+ /**
1265
+ * If true, a select component for navigation between pages will be displayed.
1266
+ */
1267
+ showGoToPage?: never;
1268
+ /**
1269
+ * Number of items per page.
1270
+ */
1271
+ itemsPerPage?: never;
1272
+ /**
1273
+ * An array of numbers representing the items per page options.
1274
+ */
1275
+ itemsPerPageOptions?: never;
1276
+ /**
1277
+ * This function will be called when the user selects an item per page
1278
+ * option. The value selected will be passed as a parameter.
1279
+ */
1280
+ itemsPerPageFunction?: never;
1281
+ /**
1282
+ * Function called whenever the current page is changed.
1283
+ */
1284
+ onPageChange?: never;
1285
+ };
1286
+ type CommonProps$6 = {
1262
1287
  columns: GridColumn[];
1288
+ /**
1289
+ * Extra row that will be always visible.
1290
+ */
1263
1291
  summaryRow?: GridRow;
1264
- onGridRowsChange?: (rows: GridRow[] | HierarchyGridRow[] | ExpandableGridRow[]) => void;
1292
+ /**
1293
+ * Function called whenever a cell is edited.
1294
+ */
1295
+ onGridRowsChange?: (_rows: GridRow[] | HierarchyGridRow[] | ExpandableGridRow[]) => void;
1296
+ /**
1297
+ * Function called whenever a column is sorted. Receives the sorted
1298
+ * column and direction, or `undefined` if no sorting is applied.
1299
+ */
1300
+ onSort?: (_sortColumn?: SortColumn) => void;
1265
1301
  };
1266
1302
  type BasicGridProps = {
1267
1303
  rows: GridRow[];
1304
+ /**
1305
+ * Whether the rows can expand or not.
1306
+ */
1268
1307
  expandable?: false;
1269
1308
  };
1270
- type Props$u = CommonProps$5 & ((BasicGridProps & SelectableGridProps) | (ExpandableRows & SelectableGridProps) | (HierarchyRows & SelectableGridProps));
1271
-
1272
- declare const DxcDataGrid: ({ columns, rows, selectable, expandable, onSelectRows, selectedRows, uniqueRowId, summaryRow, onGridRowsChange, }: Props$u) => JSX.Element;
1309
+ type Props$t = CommonProps$6 & (PaginatedProps$1 | NonPaginatedProps$1) & ((BasicGridProps & SelectableGridProps) | (ExpandableRows & SelectableGridProps) | (HierarchyRows & SelectableGridProps));
1273
1310
 
1274
- type Space$i = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
1275
- type Margin$h = {
1276
- top?: Space$i;
1277
- bottom?: Space$i;
1278
- left?: Space$i;
1279
- right?: Space$i;
1311
+ declare const DxcDataGrid: {
1312
+ ({ columns, rows, selectable, expandable, onSelectRows, selectedRows, uniqueRowId, summaryRow, onGridRowsChange, showPaginator, showGoToPage, itemsPerPage, itemsPerPageOptions, itemsPerPageFunction, onSort, onPageChange, totalItems, }: Props$t): JSX.Element;
1313
+ ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
1280
1314
  };
1281
- type Props$t = {
1315
+
1316
+ type Props$s = {
1282
1317
  /**
1283
1318
  * Initial value of the input element, only when it is uncontrolled.
1284
1319
  */
@@ -1369,24 +1404,28 @@ type Props$t = {
1369
1404
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
1370
1405
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
1371
1406
  */
1372
- margin?: Space$i | Margin$h;
1407
+ margin?: Space$1 | Margin;
1373
1408
  /**
1374
1409
  * Size of the component.
1375
1410
  */
1376
- size?: "medium" | "large" | "fillParent";
1411
+ size?: "small" | "medium" | "large" | "fillParent";
1377
1412
  /**
1378
1413
  * Value of the tabindex attribute.
1379
1414
  */
1380
1415
  tabIndex?: number;
1416
+ /**
1417
+ * Specifies a string to be used as the name for the date input element when no `label` is provided.
1418
+ */
1419
+ ariaLabel?: string;
1381
1420
  };
1382
1421
 
1383
- declare const DxcDateInput: react.ForwardRefExoticComponent<Props$t & react.RefAttributes<HTMLDivElement>>;
1422
+ declare const DxcDateInput: react.ForwardRefExoticComponent<Props$s & react.RefAttributes<HTMLDivElement>>;
1384
1423
 
1385
- type Props$s = {
1424
+ type Props$r = {
1386
1425
  /**
1387
1426
  * If true, the close button will be visible.
1388
1427
  */
1389
- isCloseVisible?: boolean;
1428
+ closable?: boolean;
1390
1429
  /**
1391
1430
  * This function will be called when the user clicks the close button.
1392
1431
  * The responsibility of hiding the dialog lies with the user.
@@ -1408,7 +1447,7 @@ type Props$s = {
1408
1447
  * can lead to unpredictable behaviour for keyboard users, affecting
1409
1448
  * the order of focus and focus locking within the dialog.
1410
1449
  */
1411
- children: React.ReactNode;
1450
+ children: ReactNode;
1412
1451
  /**
1413
1452
  * Value of the tabindex applied to the close button.
1414
1453
  * Note that values greater than 0 are strongly discouraged. It can
@@ -1417,9 +1456,9 @@ type Props$s = {
1417
1456
  tabIndex?: number;
1418
1457
  };
1419
1458
 
1420
- declare const DxcDialog: ({ isCloseVisible, onCloseClick, children, overlay, onBackgroundClick, tabIndex, }: Props$s) => JSX.Element;
1459
+ declare const DxcDialog: ({ children, closable, onBackgroundClick, onCloseClick, overlay, tabIndex, }: Props$r) => JSX.Element;
1421
1460
 
1422
- type Props$r = {
1461
+ type Props$q = {
1423
1462
  /**
1424
1463
  * The divider can be shown in horizontal or vertical.
1425
1464
  */
@@ -1440,17 +1479,10 @@ type Props$r = {
1440
1479
  decorative?: boolean;
1441
1480
  };
1442
1481
 
1443
- declare const DxcDivider: ({ orientation, weight, color, decorative, }: Props$r) => JSX.Element;
1482
+ declare const DxcDivider: ({ orientation, weight, color, decorative, }: Props$q) => react_jsx_runtime.JSX.Element;
1444
1483
 
1445
- declare const DxcDropdown: ({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, }: Props$H) => JSX.Element;
1484
+ declare const DxcDropdown: ({ options, optionsIconPosition, icon, iconPosition, label, caretHidden, disabled, expandOnHover, onSelectOption, margin, size, tabIndex, title, }: Props$G) => react_jsx_runtime.JSX.Element;
1446
1485
 
1447
- type Space$h = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
1448
- type Margin$g = {
1449
- top?: Space$h;
1450
- bottom?: Space$h;
1451
- left?: Space$h;
1452
- right?: Space$h;
1453
- };
1454
1486
  type FileData = {
1455
1487
  /**
1456
1488
  * Selected file.
@@ -1465,7 +1497,7 @@ type FileData = {
1465
1497
  */
1466
1498
  preview?: string;
1467
1499
  };
1468
- type CommonProps$4 = {
1500
+ type CommonProps$5 = {
1469
1501
  /**
1470
1502
  * Text to be placed above the component.
1471
1503
  */
@@ -1516,13 +1548,13 @@ type CommonProps$4 = {
1516
1548
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
1517
1549
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
1518
1550
  */
1519
- margin?: Space$h | Margin$g;
1551
+ margin?: Space$1 | Margin;
1520
1552
  /**
1521
1553
  * Value of the tabindex attribute.
1522
1554
  */
1523
1555
  tabIndex?: number;
1524
1556
  };
1525
- type DropModeProps = CommonProps$4 & {
1557
+ type DropModeProps = CommonProps$5 & {
1526
1558
  /**
1527
1559
  * Uses one of the available file input modes:
1528
1560
  * 'file': Files are selected by clicking the button and selecting it through the file explorer.
@@ -1536,7 +1568,7 @@ type DropModeProps = CommonProps$4 & {
1536
1568
  */
1537
1569
  dropAreaLabel?: string;
1538
1570
  };
1539
- type FileModeProps = CommonProps$4 & {
1571
+ type FileModeProps = CommonProps$5 & {
1540
1572
  /**
1541
1573
  * Uses one of the available file input modes:
1542
1574
  * 'file': Files are selected by clicking the button and selecting it through the file explorer.
@@ -1550,31 +1582,30 @@ type FileModeProps = CommonProps$4 & {
1550
1582
  */
1551
1583
  dropAreaLabel?: never;
1552
1584
  };
1553
- type Props$q = DropModeProps | FileModeProps;
1585
+ type Props$p = DropModeProps | FileModeProps;
1554
1586
 
1555
- declare const DxcFileInput: react.ForwardRefExoticComponent<Props$q & react.RefAttributes<HTMLDivElement>>;
1587
+ declare const DxcFileInput: react.ForwardRefExoticComponent<Props$p & react.RefAttributes<HTMLDivElement>>;
1556
1588
 
1557
- type Spaces$1 = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
1558
1589
  type Gap$1 = {
1559
- rowGap: Spaces$1;
1560
- columnGap?: Spaces$1;
1590
+ rowGap: CoreSpacingTokensType;
1591
+ columnGap?: CoreSpacingTokensType;
1561
1592
  } | {
1562
- rowGap?: Spaces$1;
1563
- columnGap: Spaces$1;
1564
- } | Spaces$1;
1565
- type CommonProps$3 = {
1593
+ rowGap?: CoreSpacingTokensType;
1594
+ columnGap: CoreSpacingTokensType;
1595
+ } | CoreSpacingTokensType;
1596
+ type CommonProps$4 = {
1566
1597
  /**
1567
1598
  * Sets the justify-content CSS property.
1568
1599
  *
1569
1600
  * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content
1570
1601
  */
1571
- justifyContent?: "flex-start" | "flex-end" | "start" | "end" | "left" | "right" | "center" | "space-between" | "space-around" | "space-evenly";
1602
+ justifyContent?: "flex-start" | "flex-end" | "start" | "end" | "left" | "normal" | "right" | "center" | "space-between" | "space-around" | "space-evenly";
1572
1603
  /**
1573
1604
  * Sets the align-items CSS property.
1574
1605
  *
1575
1606
  * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/align-items
1576
1607
  */
1577
- alignItems?: "stretch" | "flex-start" | "flex-end" | "start" | "end" | "self-start" | "self-end" | "center" | "baseline";
1608
+ alignItems?: "stretch" | "flex-start" | "flex-end" | "start" | "end" | "self-start" | "self-end" | "center" | "baseline" | "normal";
1578
1609
  /**
1579
1610
  * Sets the align-content CSS property.
1580
1611
  *
@@ -1588,7 +1619,7 @@ type CommonProps$3 = {
1588
1619
  */
1589
1620
  alignSelf?: "auto" | "flex-start" | "flex-end" | "center" | "baseline" | "stretch";
1590
1621
  };
1591
- type Props$p = CommonProps$3 & {
1622
+ type Props$o = CommonProps$4 & {
1592
1623
  /**
1593
1624
  * Sets the flex-direction CSS property.
1594
1625
  *
@@ -1638,19 +1669,18 @@ type Props$p = CommonProps$3 & {
1638
1669
  /**
1639
1670
  * Custom content inside the flex container.
1640
1671
  */
1641
- children: React.ReactNode;
1672
+ children: ReactNode;
1642
1673
  };
1643
1674
 
1644
- declare const DxcFlex: ({ direction, wrap, gap, order, grow, shrink, basis, children, ...props }: Props$p) => JSX.Element;
1675
+ declare const DxcFlex: ({ basis, direction, gap, grow, order, shrink, wrap, ...props }: Props$o) => react_jsx_runtime.JSX.Element;
1645
1676
 
1646
- type Spaces = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
1647
1677
  type Gap = {
1648
- rowGap: Spaces;
1649
- columnGap?: Spaces;
1678
+ rowGap: CoreSpacingTokensType;
1679
+ columnGap?: CoreSpacingTokensType;
1650
1680
  } | {
1651
- rowGap?: Spaces;
1652
- columnGap: Spaces;
1653
- } | Spaces;
1681
+ rowGap?: CoreSpacingTokensType;
1682
+ columnGap: CoreSpacingTokensType;
1683
+ } | CoreSpacingTokensType;
1654
1684
  type GridCell = {
1655
1685
  start: number | string;
1656
1686
  end: number | string;
@@ -1698,9 +1728,9 @@ type GridItemProps = {
1698
1728
  /**
1699
1729
  * Custom content inside the grid container.
1700
1730
  */
1701
- children: React.ReactNode;
1731
+ children: ReactNode;
1702
1732
  };
1703
- type Props$o = GridItemProps & {
1733
+ type Props$n = GridItemProps & {
1704
1734
  /**
1705
1735
  * Sets the grid-auto-columns CSS property.
1706
1736
  *
@@ -1724,7 +1754,7 @@ type Props$o = GridItemProps & {
1724
1754
  *
1725
1755
  * See MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/gap
1726
1756
  */
1727
- gap?: Spaces | Gap;
1757
+ gap?: CoreSpacingTokensType | Gap;
1728
1758
  /**
1729
1759
  * Sets the place-content CSS property.
1730
1760
  *
@@ -1758,18 +1788,11 @@ type Props$o = GridItemProps & {
1758
1788
  };
1759
1789
 
1760
1790
  declare const DxcGrid: {
1761
- (props: Props$o): JSX.Element;
1791
+ (props: Props$n): react_jsx_runtime.JSX.Element;
1762
1792
  Item: styled_components.StyledComponent<"div", any, GridItemProps, never>;
1763
1793
  };
1764
1794
 
1765
- type Space$g = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
1766
- type Margin$f = {
1767
- top?: Space$g;
1768
- bottom?: Space$g;
1769
- left?: Space$g;
1770
- right?: Space$g;
1771
- };
1772
- type Props$n = {
1795
+ type Props$m = {
1773
1796
  /**
1774
1797
  * Defines the heading level from 1 to 5. The styles of the heading are applied according to the level.
1775
1798
  * The html tag of the heading will be the one specified in the 'as' prop.
@@ -1792,12 +1815,12 @@ type Props$n = {
1792
1815
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
1793
1816
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
1794
1817
  */
1795
- margin?: Space$g | Margin$f;
1818
+ margin?: Space$1 | Margin;
1796
1819
  };
1797
1820
 
1798
- declare const DxcHeading: ({ level, text, as, weight, margin }: Props$n) => JSX.Element;
1821
+ declare const DxcHeading: ({ level, text, as, weight, margin }: Props$m) => JSX.Element;
1799
1822
 
1800
- type Props$m = {
1823
+ type Props$l = {
1801
1824
  /**
1802
1825
  * Alternative text description displayed when the specified image is not loaded.
1803
1826
  *
@@ -1856,61 +1879,52 @@ type Props$m = {
1856
1879
  /**
1857
1880
  * This function will be called when the image is loaded.
1858
1881
  */
1859
- onLoad?: React.ReactEventHandler<HTMLImageElement>;
1882
+ onLoad?: ReactEventHandler<HTMLImageElement>;
1860
1883
  /**
1861
1884
  * This function will be called when the image fails to load.
1862
1885
  */
1863
- onError?: React.ReactEventHandler<HTMLImageElement>;
1886
+ onError?: ReactEventHandler<HTMLImageElement>;
1864
1887
  };
1865
1888
 
1866
- declare const DxcImage: ({ alt, caption, lazyLoading, src, srcSet, sizes, width, height, objectFit, objectPosition, onLoad, onError, }: Props$m) => react_jsx_runtime.JSX.Element;
1889
+ declare function DxcImage({ alt, caption, lazyLoading, src, srcSet, sizes, width, height, objectFit, objectPosition, onLoad, onError, }: Props$l): react_jsx_runtime.JSX.Element;
1867
1890
 
1868
- type Spacing = "0rem" | "0.125rem" | "0.25rem" | "0.5rem" | "1rem" | "1.5rem" | "2rem" | "3rem" | "4rem" | "5rem";
1869
- type Props$l = {
1891
+ type Props$k = {
1870
1892
  /**
1871
1893
  * Applies the spacing scale to all sides.
1872
1894
  */
1873
- space?: Spacing;
1895
+ space?: CoreSpacingTokensType;
1874
1896
  /**
1875
1897
  * Applies the spacing scale to the left and right sides.
1876
1898
  */
1877
- horizontal?: Spacing;
1899
+ horizontal?: CoreSpacingTokensType;
1878
1900
  /**
1879
1901
  * Applies the spacing scale to the top and bottom sides.
1880
1902
  */
1881
- vertical?: Spacing;
1903
+ vertical?: CoreSpacingTokensType;
1882
1904
  /**
1883
1905
  * Applies the spacing scale to the top side.
1884
1906
  */
1885
- top?: Spacing;
1907
+ top?: CoreSpacingTokensType;
1886
1908
  /**
1887
1909
  * Applies the spacing scale to the right side.
1888
1910
  */
1889
- right?: Spacing;
1911
+ right?: CoreSpacingTokensType;
1890
1912
  /**
1891
1913
  * Applies the spacing scale to the bottom side.
1892
1914
  */
1893
- bottom?: Spacing;
1915
+ bottom?: CoreSpacingTokensType;
1894
1916
  /**
1895
1917
  * Applies the spacing scale to the left side.
1896
1918
  */
1897
- left?: Spacing;
1919
+ left?: CoreSpacingTokensType;
1898
1920
  /**
1899
1921
  * Custom content inside the inset.
1900
1922
  */
1901
- children: React.ReactNode;
1923
+ children: ReactNode;
1902
1924
  };
1903
1925
 
1904
- declare function Inset({ space, horizontal, vertical, top, right, bottom, left, children, }: Props$l): JSX.Element;
1926
+ declare const Inset: ({ space, horizontal, vertical, top, right, bottom, left, children }: Props$k) => react_jsx_runtime.JSX.Element;
1905
1927
 
1906
- type Space$f = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
1907
- type Margin$e = {
1908
- top?: Space$f;
1909
- bottom?: Space$f;
1910
- left?: Space$f;
1911
- right?: Space$f;
1912
- };
1913
- type SVG$8 = React.ReactNode & React.SVGProps<SVGSVGElement>;
1914
1928
  type LinkProps = {
1915
1929
  /**
1916
1930
  * If true, the link is disabled.
@@ -1923,7 +1937,7 @@ type LinkProps = {
1923
1937
  /**
1924
1938
  * Material Symbol name or SVG element as the icon that will be placed next to the link text.
1925
1939
  */
1926
- icon?: string | SVG$8;
1940
+ icon?: string | SVG;
1927
1941
  /**
1928
1942
  * Indicates the position of the icon in the component.
1929
1943
  */
@@ -1949,7 +1963,7 @@ type LinkProps = {
1949
1963
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
1950
1964
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
1951
1965
  */
1952
- margin?: Space$f | Margin$e;
1966
+ margin?: Space$1 | Margin;
1953
1967
  /**
1954
1968
  * Value of the tabindex.
1955
1969
  */
@@ -1958,7 +1972,6 @@ type LinkProps = {
1958
1972
 
1959
1973
  declare const DxcLink: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLAnchorElement>>;
1960
1974
 
1961
- type SVG$7 = React.ReactNode & React.SVGProps<SVGSVGElement>;
1962
1975
  type TabProps$1 = {
1963
1976
  /**
1964
1977
  * Whether the tab is active or not.
@@ -1975,7 +1988,7 @@ type TabProps$1 = {
1975
1988
  /**
1976
1989
  * Material Symbol name or SVG element used as the icon that will be displayed in the tab.
1977
1990
  */
1978
- icon?: string | SVG$7;
1991
+ icon?: string | SVG;
1979
1992
  /**
1980
1993
  * If the value is 'true', an empty badge will appear.
1981
1994
  * If it is 'false', no badge will appear.
@@ -1989,7 +2002,7 @@ type TabProps$1 = {
1989
2002
  */
1990
2003
  children: string;
1991
2004
  };
1992
- type Props$k = {
2005
+ type Props$j = {
1993
2006
  /**
1994
2007
  * Whether the icon should appear above or to the left of the label.
1995
2008
  */
@@ -1997,7 +2010,7 @@ type Props$k = {
1997
2010
  /**
1998
2011
  * Contains one or more DxcNavTabs.Tab.
1999
2012
  */
2000
- children: React.ReactNode;
2013
+ children: ReactNode;
2001
2014
  /**
2002
2015
  * Value of the tabindex attribute applied to each tab.
2003
2016
  */
@@ -2005,18 +2018,11 @@ type Props$k = {
2005
2018
  };
2006
2019
 
2007
2020
  declare const DxcNavTabs: {
2008
- ({ iconPosition, tabIndex, children }: Props$k): JSX.Element;
2021
+ ({ iconPosition, tabIndex, children }: Props$j): JSX.Element;
2009
2022
  Tab: react.ForwardRefExoticComponent<TabProps$1 & react.RefAttributes<HTMLAnchorElement>>;
2010
2023
  };
2011
2024
 
2012
- type Space$e = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2013
- type Margin$d = {
2014
- top?: Space$e;
2015
- bottom?: Space$e;
2016
- left?: Space$e;
2017
- right?: Space$e;
2018
- };
2019
- type Props$j = {
2025
+ type Props$i = {
2020
2026
  /**
2021
2027
  * Text to be placed above the number.
2022
2028
  */
@@ -2124,7 +2130,7 @@ type Props$j = {
2124
2130
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2125
2131
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2126
2132
  */
2127
- margin?: Space$e | Margin$d;
2133
+ margin?: Space$1 | Margin;
2128
2134
  /**
2129
2135
  * Size of the component.
2130
2136
  */
@@ -2133,11 +2139,19 @@ type Props$j = {
2133
2139
  * Value of the tabindex attribute.
2134
2140
  */
2135
2141
  tabIndex?: number;
2142
+ /**
2143
+ * Specifies a string to be used as the name for the number input element when no `label` is provided.
2144
+ */
2145
+ ariaLabel?: string;
2146
+ /**
2147
+ * Decides whether the number input has actions to increase or decrease the value, following the defined step.
2148
+ */
2149
+ showControls?: boolean;
2136
2150
  };
2137
2151
 
2138
- declare const DxcNumberInput: react.ForwardRefExoticComponent<Props$j & react.RefAttributes<HTMLDivElement>>;
2152
+ declare const DxcNumberInput: react.ForwardRefExoticComponent<Props$i & react.RefAttributes<HTMLDivElement>>;
2139
2153
 
2140
- type Props$i = {
2154
+ type Props$h = {
2141
2155
  /**
2142
2156
  * Number of the current selected page.
2143
2157
  */
@@ -2175,20 +2189,13 @@ type Props$i = {
2175
2189
  tabIndex?: number;
2176
2190
  };
2177
2191
 
2178
- declare const DxcPaginator: ({ currentPage, itemsPerPage, itemsPerPageOptions, totalItems, showGoToPage, onPageChange, itemsPerPageFunction, tabIndex, }: Props$i) => JSX.Element;
2192
+ declare const DxcPaginator: ({ currentPage, itemsPerPage, itemsPerPageOptions, totalItems, showGoToPage, onPageChange, itemsPerPageFunction, tabIndex, }: Props$h) => JSX.Element;
2179
2193
 
2180
- declare const DxcParagraph: ({ children }: {
2181
- children: React.ReactNode;
2182
- }) => JSX.Element;
2194
+ declare function DxcParagraph({ children }: {
2195
+ children: ReactNode;
2196
+ }): react_jsx_runtime.JSX.Element;
2183
2197
 
2184
- type Space$d = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2185
- type Margin$c = {
2186
- top?: Space$d;
2187
- bottom?: Space$d;
2188
- left?: Space$d;
2189
- right?: Space$d;
2190
- };
2191
- type Props$h = {
2198
+ type Props$g = {
2192
2199
  /**
2193
2200
  * Text to be placed above the password input.
2194
2201
  */
@@ -2277,7 +2284,7 @@ type Props$h = {
2277
2284
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2278
2285
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2279
2286
  */
2280
- margin?: Space$d | Margin$c;
2287
+ margin?: Space$1 | Margin;
2281
2288
  /**
2282
2289
  * Size of the component.
2283
2290
  */
@@ -2286,18 +2293,21 @@ type Props$h = {
2286
2293
  * Value of the tabindex attribute.
2287
2294
  */
2288
2295
  tabIndex?: number;
2296
+ /**
2297
+ * Specifies a string to be used as the name for the password input element when no `label` is provided.
2298
+ */
2299
+ ariaLabel?: string;
2289
2300
  };
2290
2301
 
2291
- declare const DxcPasswordInput: react.ForwardRefExoticComponent<Props$h & react.RefAttributes<HTMLDivElement>>;
2302
+ declare const DxcPasswordInput: react.ForwardRefExoticComponent<Props$g & react.RefAttributes<HTMLDivElement>>;
2292
2303
 
2293
- type Space$c = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2294
2304
  type Size$1 = {
2295
- top?: Space$c;
2296
- bottom?: Space$c;
2297
- left?: Space$c;
2298
- right?: Space$c;
2305
+ top?: Space$1;
2306
+ bottom?: Space$1;
2307
+ left?: Space$1;
2308
+ right?: Space$1;
2299
2309
  };
2300
- type Props$g = {
2310
+ type Props$f = {
2301
2311
  /**
2302
2312
  * Text to be placed above the progress bar.
2303
2313
  */
@@ -2324,10 +2334,14 @@ type Props$g = {
2324
2334
  * an object with 'top', 'bottom', 'left' and 'right' properties
2325
2335
  * in order to specify different margin sizes.
2326
2336
  */
2327
- margin?: Space$c | Size$1;
2337
+ margin?: Space$1 | Size$1;
2338
+ /**
2339
+ * Specifies a string to be used as the name for the progress bar element when no `label` is provided.
2340
+ */
2341
+ ariaLabel?: string;
2328
2342
  };
2329
2343
 
2330
- declare const DxcProgressBar: ({ label, helperText, overlay, value, showValue, margin, }: Props$g) => JSX.Element;
2344
+ declare const DxcProgressBar: ({ label, helperText, overlay, value, showValue, margin, ariaLabel, }: Props$f) => JSX.Element;
2331
2345
 
2332
2346
  type Link = {
2333
2347
  /**
@@ -2339,7 +2353,7 @@ type Link = {
2339
2353
  */
2340
2354
  links?: Link[];
2341
2355
  };
2342
- type Props$f = {
2356
+ type Props$e = {
2343
2357
  /**
2344
2358
  * Title of the quick nav component.
2345
2359
  */
@@ -2350,7 +2364,7 @@ type Props$f = {
2350
2364
  links: Link[];
2351
2365
  };
2352
2366
 
2353
- declare const DxcQuickNav: ({ title, links }: Props$f) => JSX.Element;
2367
+ declare const DxcQuickNav: ({ title, links }: Props$e) => JSX.Element;
2354
2368
 
2355
2369
  type RadioOption = {
2356
2370
  /**
@@ -2447,66 +2461,19 @@ type RadioGroupProps = {
2447
2461
  * Value of the tabindex attribute.
2448
2462
  */
2449
2463
  tabIndex?: number;
2450
- };
2451
-
2452
- declare const DxcRadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
2453
-
2454
- type Space$b = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2455
- type Margin$b = {
2456
- top?: Space$b;
2457
- bottom?: Space$b;
2458
- left?: Space$b;
2459
- right?: Space$b;
2460
- };
2461
- type SVG$6 = React.ReactNode & React.SVGProps<SVGSVGElement>;
2462
- type ActionCellsPropsType = {
2463
- actions: Array<{
2464
- icon: string | SVG$6;
2465
- title: string;
2466
- onClick: () => void;
2467
- disabled?: boolean;
2468
- tabIndex?: number;
2469
- options?: never;
2470
- } | {
2471
- icon?: never;
2472
- title: string;
2473
- onClick: (value?: string) => void;
2474
- disabled?: boolean;
2475
- tabIndex?: number;
2476
- options: Option$1[];
2477
- }>;
2478
- };
2479
- type Props$e = {
2480
- /**
2481
- * The center section of the table. Can be used to render custom
2482
- * content in this area.
2483
- */
2484
- children: React.ReactNode;
2485
- /**
2486
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2487
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2488
- */
2489
- margin?: Space$b | Margin$b;
2490
2464
  /**
2491
- * Determines the visual style and layout
2492
- * - "default": Default table size.
2493
- * - "reduced": More compact table with less spacing for high density information.
2465
+ * Specifies a string to be used as the name for the radio group when no `label` is provided.
2494
2466
  */
2495
- mode?: "default" | "reduced";
2467
+ ariaLabel?: string;
2496
2468
  };
2497
2469
 
2498
- type Space$a = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2499
- type Margin$a = {
2500
- top?: Space$a;
2501
- bottom?: Space$a;
2502
- left?: Space$a;
2503
- right?: Space$a;
2504
- };
2470
+ declare const DxcRadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
2471
+
2505
2472
  type Column = {
2506
2473
  /**
2507
2474
  * Column display value.
2508
2475
  */
2509
- displayValue: React.ReactNode;
2476
+ displayValue: ReactNode;
2510
2477
  /**
2511
2478
  * Boolean value to indicate whether the column is sortable or not.
2512
2479
  */
@@ -2516,7 +2483,7 @@ type Cell = {
2516
2483
  /**
2517
2484
  * Value to be displayed in the cell.
2518
2485
  */
2519
- displayValue: React.ReactNode;
2486
+ displayValue: ReactNode;
2520
2487
  /**
2521
2488
  * Value to be used when sorting the table by that
2522
2489
  * column. If not indicated displayValue will be used for sorting.
@@ -2524,7 +2491,7 @@ type Cell = {
2524
2491
  sortValue?: string | number | Date;
2525
2492
  };
2526
2493
  type Row = Cell[];
2527
- type CommonProps$2 = {
2494
+ type CommonProps$3 = {
2528
2495
  /**
2529
2496
  * An array of objects representing the columns of the table.
2530
2497
  */
@@ -2538,7 +2505,7 @@ type CommonProps$2 = {
2538
2505
  * Size of the margin to be applied to the component. You can pass an object with 'top',
2539
2506
  * 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2540
2507
  */
2541
- margin?: Space$a | Margin$a;
2508
+ margin?: Space$1 | Margin;
2542
2509
  /**
2543
2510
  * Value of the tabindex attribute applied to the sortable icon.
2544
2511
  */
@@ -2550,7 +2517,7 @@ type CommonProps$2 = {
2550
2517
  */
2551
2518
  mode?: "default" | "reduced";
2552
2519
  };
2553
- type PaginatedProps = CommonProps$2 & {
2520
+ type PaginatedProps = CommonProps$3 & {
2554
2521
  hidePaginator?: false;
2555
2522
  /**
2556
2523
  * If true, a select component for navigation between pages will be displayed.
@@ -2570,7 +2537,7 @@ type PaginatedProps = CommonProps$2 & {
2570
2537
  */
2571
2538
  itemsPerPageFunction?: (value: number) => void;
2572
2539
  };
2573
- type NonPaginatedProps = CommonProps$2 & {
2540
+ type NonPaginatedProps = CommonProps$3 & {
2574
2541
  /**
2575
2542
  * If true, paginator will not be displayed.
2576
2543
  */
@@ -2600,14 +2567,6 @@ declare const DxcResultsetTable: {
2600
2567
  ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
2601
2568
  };
2602
2569
 
2603
- type Space$9 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2604
- type Margin$9 = {
2605
- top?: Space$9;
2606
- bottom?: Space$9;
2607
- left?: Space$9;
2608
- right?: Space$9;
2609
- };
2610
- type SVG$5 = React.ReactNode & React.SVGProps<SVGSVGElement>;
2611
2570
  type ListOptionGroupType = {
2612
2571
  /**
2613
2572
  * Label of the group to be shown in the select's listbox.
@@ -2625,7 +2584,7 @@ type ListOptionType = {
2625
2584
  * is the chosen one, take into account that the component's
2626
2585
  * color styling tokens will not be applied to the image.
2627
2586
  */
2628
- icon?: string | SVG$5;
2587
+ icon?: string | SVG;
2629
2588
  /**
2630
2589
  * Label of the option to be shown in the select's listbox.
2631
2590
  */
@@ -2637,7 +2596,7 @@ type ListOptionType = {
2637
2596
  */
2638
2597
  value: string;
2639
2598
  };
2640
- type CommonProps$1 = {
2599
+ type CommonProps$2 = {
2641
2600
  /**
2642
2601
  * Text to be placed above the select.
2643
2602
  */
@@ -2691,7 +2650,7 @@ type CommonProps$1 = {
2691
2650
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2692
2651
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2693
2652
  */
2694
- margin?: Space$9 | Margin$9;
2653
+ margin?: Space$1 | Margin;
2695
2654
  /**
2696
2655
  * Size of the component.
2697
2656
  */
@@ -2700,8 +2659,12 @@ type CommonProps$1 = {
2700
2659
  * Value of the tabindex attribute.
2701
2660
  */
2702
2661
  tabIndex?: number;
2662
+ /**
2663
+ * Specifies a string to be used as the name for the select element when no `label` is provided.
2664
+ */
2665
+ ariaLabel?: string;
2703
2666
  };
2704
- type SingleSelect = CommonProps$1 & {
2667
+ type SingleSelect = CommonProps$2 & {
2705
2668
  /**
2706
2669
  * If true, the select component will support multiple selected options.
2707
2670
  * In that case, value will be an array of strings with each selected
@@ -2737,7 +2700,7 @@ type SingleSelect = CommonProps$1 & {
2737
2700
  error?: string;
2738
2701
  }) => void;
2739
2702
  };
2740
- type MultipleSelect = CommonProps$1 & {
2703
+ type MultipleSelect = CommonProps$2 & {
2741
2704
  /**
2742
2705
  * If true, the select component will support multiple selected options.
2743
2706
  * In that case, value will be an array of strings with each selected
@@ -2777,62 +2740,53 @@ type Props$c = SingleSelect | MultipleSelect;
2777
2740
 
2778
2741
  declare const DxcSelect: react.ForwardRefExoticComponent<Props$c & react.RefAttributes<HTMLDivElement>>;
2779
2742
 
2780
- type Space$8 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2781
- type Margin$8 = {
2782
- top?: Space$8;
2783
- bottom?: Space$8;
2784
- left?: Space$8;
2785
- right?: Space$8;
2786
- };
2787
2743
  type Props$b = {
2788
2744
  /**
2789
- * Text to be placed above the slider.
2790
- */
2791
- label?: string;
2792
- /**
2793
- * Name attribute of the input element.
2745
+ * Specifies a string to be used as the name for the slider element when no `label` is provided.
2794
2746
  */
2795
- name?: string;
2747
+ ariaLabel?: string;
2796
2748
  /**
2797
2749
  * Initial value of the slider, only when it is uncontrolled.
2798
2750
  */
2799
2751
  defaultValue?: number;
2800
2752
  /**
2801
- * The selected value. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
2753
+ * If true, the component will be disabled.
2802
2754
  */
2803
- value?: number;
2755
+ disabled?: boolean;
2804
2756
  /**
2805
2757
  * Helper text to be placed above the slider.
2806
2758
  */
2807
2759
  helperText?: string;
2808
2760
  /**
2809
- * The minimum value available for selection.
2761
+ * Text to be placed above the slider.
2810
2762
  */
2811
- minValue?: number;
2763
+ label?: string;
2812
2764
  /**
2813
- * The maximum value available for selection.
2765
+ * This function will be used to format the labels displayed next to the slider.
2766
+ * The value will be passed as parameter and the function must return the formatted value.
2814
2767
  */
2815
- maxValue?: number;
2768
+ labelFormatCallback?: (value: number) => string;
2816
2769
  /**
2817
- * The step interval between values available for selection.
2770
+ * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2771
+ * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2818
2772
  */
2819
- step?: number;
2773
+ margin?: Space$1 | Margin;
2820
2774
  /**
2821
- * Whether the min/max value labels should be displayed next to the slider
2775
+ * Whether the marks between each step should be shown or not.
2822
2776
  */
2823
- showLimitsValues?: boolean;
2777
+ marks?: boolean;
2824
2778
  /**
2825
- * Whether the input element for displaying/controlling the slider value should be displayed next to the slider.
2779
+ * The maximum value available for selection.
2826
2780
  */
2827
- showInput?: boolean;
2781
+ maxValue?: number;
2828
2782
  /**
2829
- * If true, the component will be disabled.
2783
+ * The minimum value available for selection.
2830
2784
  */
2831
- disabled?: boolean;
2785
+ minValue?: number;
2832
2786
  /**
2833
- * Whether the marks between each step should be shown or not.
2787
+ * Name attribute of the input element.
2834
2788
  */
2835
- marks?: boolean;
2789
+ name?: string;
2836
2790
  /**
2837
2791
  * This function will be called when the slider changes its value, as it's being dragged.
2838
2792
  * The new value will be passed as a parameter when this function is executed.
@@ -2844,30 +2798,29 @@ type Props$b = {
2844
2798
  */
2845
2799
  onDragEnd?: (value: number) => void;
2846
2800
  /**
2847
- * This function will be used to format the labels displayed next to the slider.
2848
- * The value will be passed as parameter and the function must return the formatted value.
2801
+ * Whether the input element for displaying/controlling the slider value should be displayed next to the slider.
2849
2802
  */
2850
- labelFormatCallback?: (value: number) => string;
2803
+ showInput?: boolean;
2851
2804
  /**
2852
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2853
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2805
+ * Whether the min/max value labels should be displayed next to the slider
2854
2806
  */
2855
- margin?: Space$8 | Margin$8;
2807
+ showLimitsValues?: boolean;
2856
2808
  /**
2857
2809
  * Size of the component.
2858
2810
  */
2859
2811
  size?: "medium" | "large" | "fillParent";
2812
+ /**
2813
+ * The step interval between values available for selection.
2814
+ */
2815
+ step?: number;
2816
+ /**
2817
+ * The selected value. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
2818
+ */
2819
+ value?: number;
2860
2820
  };
2861
2821
 
2862
2822
  declare const DxcSlider: react.ForwardRefExoticComponent<Props$b & react.RefAttributes<HTMLDivElement>>;
2863
2823
 
2864
- type Space$7 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2865
- type Margin$7 = {
2866
- top?: Space$7;
2867
- bottom?: Space$7;
2868
- left?: Space$7;
2869
- right?: Space$7;
2870
- };
2871
2824
  type Props$a = {
2872
2825
  /**
2873
2826
  * Text to be placed inside the spinner.
@@ -2890,10 +2843,14 @@ type Props$a = {
2890
2843
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2891
2844
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2892
2845
  */
2893
- margin?: Space$7 | Margin$7;
2846
+ margin?: Space$1 | Margin;
2847
+ /**
2848
+ * Specifies a string to be used as the name for the spinner element when no `label` is provided or the `mode` is set to small.
2849
+ */
2850
+ ariaLabel?: string;
2894
2851
  };
2895
2852
 
2896
- declare const DxcSpinner: ({ label, value, showValue, mode, margin }: Props$a) => JSX.Element;
2853
+ declare const DxcSpinner: ({ ariaLabel, label, margin, mode, showValue, value }: Props$a) => react_jsx_runtime.JSX.Element;
2897
2854
 
2898
2855
  type Mode = "default" | "info" | "success" | "warning" | "error";
2899
2856
  type Size = "small" | "medium" | "large";
@@ -2912,15 +2869,8 @@ type Props$9 = {
2912
2869
  size?: Size;
2913
2870
  };
2914
2871
 
2915
- declare const DxcStatusLight: ({ mode, label, size }: Props$9) => JSX.Element;
2872
+ declare function DxcStatusLight({ label, mode, size }: Props$9): react_jsx_runtime.JSX.Element;
2916
2873
 
2917
- type Space$6 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2918
- type Margin$6 = {
2919
- top?: Space$6;
2920
- bottom?: Space$6;
2921
- left?: Space$6;
2922
- right?: Space$6;
2923
- };
2924
2874
  type Props$8 = {
2925
2875
  /**
2926
2876
  * Initial state of the switch, only when it is uncontrolled.
@@ -2965,7 +2915,7 @@ type Props$8 = {
2965
2915
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
2966
2916
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
2967
2917
  */
2968
- margin?: Space$6 | Margin$6;
2918
+ margin?: Space$1 | Margin;
2969
2919
  /**
2970
2920
  * Size of the component.
2971
2921
  */
@@ -2974,23 +2924,19 @@ type Props$8 = {
2974
2924
  * Value of the tabindex.
2975
2925
  */
2976
2926
  tabIndex?: number;
2927
+ /**
2928
+ * Specifies a string to be used as the name for the switch element when no `label` is provided.
2929
+ */
2930
+ ariaLabel?: string;
2977
2931
  };
2978
2932
 
2979
2933
  declare const DxcSwitch: react.ForwardRefExoticComponent<Props$8 & react.RefAttributes<HTMLDivElement>>;
2980
2934
 
2981
2935
  declare const DxcTable: {
2982
- ({ children, margin, mode }: Props$e): JSX.Element;
2936
+ ({ children, margin, mode }: Props$u): JSX.Element;
2983
2937
  ActionsCell: ({ actions }: ActionCellsPropsType) => JSX.Element;
2984
2938
  };
2985
2939
 
2986
- type Space$5 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2987
- type Margin$5 = {
2988
- top?: Space$5;
2989
- bottom?: Space$5;
2990
- left?: Space$5;
2991
- right?: Space$5;
2992
- };
2993
- type SVG$4 = React.ReactNode & React.SVGProps<SVGSVGElement>;
2994
2940
  type TabCommonProps = {
2995
2941
  /**
2996
2942
  * Whether the tab is disabled or not.
@@ -3013,7 +2959,7 @@ type TabLabelProps = TabCommonProps & {
3013
2959
  /**
3014
2960
  * Material Symbol name or SVG element used as the icon that will be displayed in the tab.
3015
2961
  */
3016
- icon?: string | SVG$4;
2962
+ icon?: string | SVG;
3017
2963
  };
3018
2964
  type TabIconProps = TabCommonProps & {
3019
2965
  /**
@@ -3023,17 +2969,17 @@ type TabIconProps = TabCommonProps & {
3023
2969
  /**
3024
2970
  * Material Symbol name or SVG element used as the icon that will be displayed in the tab.
3025
2971
  */
3026
- icon: string | SVG$4;
2972
+ icon: string | SVG;
3027
2973
  };
3028
2974
  type TabProps = {
3029
2975
  defaultActive?: boolean;
3030
2976
  active?: boolean;
3031
- icon?: string | SVG$4;
3032
- label?: string;
2977
+ icon?: string | SVG;
2978
+ label: string;
3033
2979
  title?: string;
3034
2980
  disabled?: boolean;
3035
2981
  notificationNumber?: boolean | number;
3036
- children: React.ReactNode;
2982
+ children: ReactNode;
3037
2983
  onClick?: () => void;
3038
2984
  onHover?: () => void;
3039
2985
  };
@@ -3064,12 +3010,12 @@ type LegacyProps = {
3064
3010
  * This function will be called when the user hovers a tab.The index of the
3065
3011
  * hovered tab will be passed as a parameter.
3066
3012
  */
3067
- onTabHover?: (index: number) => void;
3013
+ onTabHover?: (index: number | null) => void;
3068
3014
  /**
3069
3015
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3070
3016
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3071
3017
  */
3072
- margin?: Space$5 | Margin$5;
3018
+ margin?: Space$1 | Margin;
3073
3019
  /**
3074
3020
  * Value of the tabindex attribute applied to each tab.
3075
3021
  */
@@ -3084,7 +3030,7 @@ type NewProps = {
3084
3030
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3085
3031
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3086
3032
  */
3087
- margin?: Space$5 | Margin$5;
3033
+ margin?: Space$1 | Margin;
3088
3034
  /**
3089
3035
  * Value of the tabindex attribute applied to each tab.
3090
3036
  */
@@ -3092,23 +3038,15 @@ type NewProps = {
3092
3038
  /**
3093
3039
  * Contains one or more DxcTabs.Tab.
3094
3040
  */
3095
- children?: React.ReactNode;
3041
+ children?: ReactNode;
3096
3042
  };
3097
3043
  type Props$7 = LegacyProps & NewProps;
3098
3044
 
3099
3045
  declare const DxcTabs: {
3100
- ({ defaultActiveTabIndex, activeTabIndex, tabs, onTabClick, onTabHover, margin, iconPosition, tabIndex, children, }: Props$7): JSX.Element;
3046
+ ({ defaultActiveTabIndex, activeTabIndex, tabs, onTabClick, onTabHover, margin, iconPosition, tabIndex, children, }: Props$7): false | react_jsx_runtime.JSX.Element;
3101
3047
  Tab: react.ForwardRefExoticComponent<TabProps & react.RefAttributes<HTMLButtonElement>>;
3102
3048
  };
3103
3049
 
3104
- type Space$4 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3105
- type Margin$4 = {
3106
- top?: Space$4;
3107
- bottom?: Space$4;
3108
- left?: Space$4;
3109
- right?: Space$4;
3110
- };
3111
- type SVG$3 = React.ReactNode & React.SVGProps<SVGSVGElement>;
3112
3050
  type TagCommonProps = {
3113
3051
  /**
3114
3052
  * If defined, the tag will be displayed as an anchor, using this prop as "href".
@@ -3137,7 +3075,7 @@ type TagCommonProps = {
3137
3075
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3138
3076
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3139
3077
  */
3140
- margin?: Space$4 | Margin$4;
3078
+ margin?: Space$1 | Margin;
3141
3079
  /**
3142
3080
  * Size of the component.
3143
3081
  */
@@ -3151,7 +3089,7 @@ type TagLabelProps = TagCommonProps & {
3151
3089
  /**
3152
3090
  * Material Symbol name or SVG element used as the icon that will be placed next to the label.
3153
3091
  */
3154
- icon?: string | SVG$3;
3092
+ icon?: string | SVG;
3155
3093
  /**
3156
3094
  * Text to be placed next inside the tag.
3157
3095
  */
@@ -3161,7 +3099,7 @@ type TagIconProps = TagCommonProps & {
3161
3099
  /**
3162
3100
  * Material Symbol name or SVG element used as the icon that will be placed next to the label.
3163
3101
  */
3164
- icon: string | SVG$3;
3102
+ icon: string | SVG;
3165
3103
  /**
3166
3104
  * Text to be placed next inside the tag.
3167
3105
  */
@@ -3169,15 +3107,11 @@ type TagIconProps = TagCommonProps & {
3169
3107
  };
3170
3108
  type Props$6 = TagLabelProps | TagIconProps;
3171
3109
 
3110
+ /**
3111
+ * @deprecated
3112
+ */
3172
3113
  declare const DxcTag: ({ icon, label, linkHref, onClick, iconBgColor, labelPosition, newWindow, margin, size, tabIndex, }: Props$6) => JSX.Element;
3173
3114
 
3174
- type Space$3 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3175
- type Margin$3 = {
3176
- top?: Space$3;
3177
- bottom?: Space$3;
3178
- left?: Space$3;
3179
- right?: Space$3;
3180
- };
3181
3115
  type Props$5 = {
3182
3116
  /**
3183
3117
  * Text to be placed above the textarea.
@@ -3297,7 +3231,7 @@ type Props$5 = {
3297
3231
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3298
3232
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3299
3233
  */
3300
- margin?: Space$3 | Margin$3;
3234
+ margin?: Space$1 | Margin;
3301
3235
  /**
3302
3236
  * Size of the component.
3303
3237
  */
@@ -3306,19 +3240,15 @@ type Props$5 = {
3306
3240
  * Value of the tabindex attribute.
3307
3241
  */
3308
3242
  tabIndex?: number;
3243
+ /**
3244
+ * Specifies a string to be used as the name for the textarea element when no `label` is provided.
3245
+ */
3246
+ ariaLabel?: string;
3309
3247
  };
3310
3248
 
3311
3249
  declare const DxcTextarea: react.ForwardRefExoticComponent<Props$5 & react.RefAttributes<HTMLDivElement>>;
3312
3250
 
3313
- type Space$2 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3314
- type Margin$2 = {
3315
- top?: Space$2;
3316
- bottom?: Space$2;
3317
- left?: Space$2;
3318
- right?: Space$2;
3319
- };
3320
- type SVG$2 = React.ReactNode & React.SVGProps<SVGSVGElement>;
3321
- type Action = {
3251
+ type Action$1 = {
3322
3252
  /**
3323
3253
  * This function will be called when the user clicks the action.
3324
3254
  */
@@ -3326,7 +3256,7 @@ type Action = {
3326
3256
  /**
3327
3257
  * Icon to be placed in the action..
3328
3258
  */
3329
- icon: string | SVG$2;
3259
+ icon: string | SVG;
3330
3260
  /**
3331
3261
  * Text representing advisory information related
3332
3262
  * to the button's action. Under the hood, this prop also serves
@@ -3362,7 +3292,7 @@ type Props$4 = {
3362
3292
  /**
3363
3293
  * Action to be shown in the input.
3364
3294
  */
3365
- action?: Action;
3295
+ action?: Action$1;
3366
3296
  /**
3367
3297
  * If true, the input will have an action to clear the entered value.
3368
3298
  */
@@ -3468,7 +3398,7 @@ type Props$4 = {
3468
3398
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3469
3399
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3470
3400
  */
3471
- margin?: Space$2 | Margin$2;
3401
+ margin?: Space$1 | Margin;
3472
3402
  /**
3473
3403
  * Size of the component.
3474
3404
  */
@@ -3477,18 +3407,69 @@ type Props$4 = {
3477
3407
  * Value of the tabindex attribute.
3478
3408
  */
3479
3409
  tabIndex?: number;
3410
+ /**
3411
+ * Specifies a string to be used as the name for the textInput element when no `label` is provided.
3412
+ */
3413
+ ariaLabel?: string;
3480
3414
  };
3481
3415
 
3482
3416
  declare const DxcTextInput: react.ForwardRefExoticComponent<Props$4 & react.RefAttributes<HTMLDivElement>>;
3483
3417
 
3484
- type Space$1 = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3485
- type Margin$1 = {
3486
- top?: Space$1;
3487
- bottom?: Space$1;
3488
- left?: Space$1;
3489
- right?: Space$1;
3418
+ type Action = {
3419
+ /**
3420
+ * The icon of the action. It can be a string with the name of the icon or an SVG component.
3421
+ */
3422
+ icon?: string | SVG;
3423
+ /**
3424
+ * The label of the action.
3425
+ */
3426
+ label: string;
3427
+ /**
3428
+ * The function that will be executed when the user clicks on the action button.
3429
+ */
3430
+ onClick: () => void;
3431
+ };
3432
+ type CommonProps$1 = {
3433
+ /**
3434
+ * Tertiary button which performs a custom action, specified by the user.
3435
+ */
3436
+ action?: Action;
3437
+ /**
3438
+ * Message to be displayed as a toast.
3439
+ */
3440
+ message: string;
3441
+ };
3442
+ type DefaultToast = CommonProps$1 & {
3443
+ /**
3444
+ * Material Symbol name or SVG element as the icon that will be placed next to the panel label.
3445
+ * When using Material Symbols, replace spaces with underscores.
3446
+ * By default they are outlined if you want it to be filled prefix the symbol name with "filled_".
3447
+ */
3448
+ icon?: string | SVG;
3449
+ };
3450
+ type LoadingToast = CommonProps$1 & {
3451
+ loading: boolean;
3452
+ };
3453
+ type SemanticToast = CommonProps$1 & {
3454
+ /**
3455
+ * Flag that allows to hide the semantic icon of the toast.
3456
+ */
3457
+ hideSemanticIcon?: boolean;
3458
+ };
3459
+ type ToastsQueuePropsType = {
3460
+ /**
3461
+ * Duration in milliseconds before a toast automatically hides itself.
3462
+ * The range goes from 3000ms to 5000ms, any other value will not be taken into consideration.
3463
+ */
3464
+ duration?: number;
3465
+ /**
3466
+ * Tree of components from which the useToast hook can be triggered.
3467
+ */
3468
+ children: ReactNode;
3490
3469
  };
3491
- type SVG$1 = React.ReactNode & React.SVGProps<SVGSVGElement>;
3470
+
3471
+ declare const DxcToastsQueue: ({ children, duration }: ToastsQueuePropsType) => react_jsx_runtime.JSX.Element;
3472
+
3492
3473
  type OptionIcon = {
3493
3474
  /**
3494
3475
  * String with the option display value.
@@ -3497,7 +3478,7 @@ type OptionIcon = {
3497
3478
  /**
3498
3479
  * Material Symbols icon or SVG element. Icon and label can't be used at same time.
3499
3480
  */
3500
- icon: string | SVG$1;
3481
+ icon: string | SVG;
3501
3482
  /**
3502
3483
  * Value for the HTML properties title and aria-label.
3503
3484
  * When a label is defined, this prop can not be use.
@@ -3512,7 +3493,7 @@ type OptionLabel = {
3512
3493
  /**
3513
3494
  * Material Symbols icon or SVG element. Icon and label can't be used at same time.
3514
3495
  */
3515
- icon?: string | SVG$1;
3496
+ icon?: string | SVG;
3516
3497
  /**
3517
3498
  * Value for the HTML properties title and aria-label.
3518
3499
  * When a label is defined, this prop can not be use.
@@ -3546,7 +3527,7 @@ type CommonProps = {
3546
3527
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3547
3528
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3548
3529
  */
3549
- margin?: Space$1 | Margin$1;
3530
+ margin?: Space$1 | Margin;
3550
3531
  /**
3551
3532
  * Value of the tabindex.
3552
3533
  */
@@ -3598,23 +3579,25 @@ declare const DxcToggleGroup: ({ label, helperText, defaultValue, value, onChang
3598
3579
 
3599
3580
  type Props$2 = {
3600
3581
  /**
3601
- * Preferred position for displaying the tooltip. It may adjust automatically based on available space.
3582
+ * Content in which the Tooltip will be displayed.
3602
3583
  */
3603
- position?: "bottom" | "top" | "left" | "right";
3584
+ children: ReactNode;
3604
3585
  /**
3605
3586
  * Text to be displayed inside the tooltip.
3606
3587
  */
3607
- label: string;
3588
+ label?: string;
3608
3589
  /**
3609
- * Content in which the Tooltip will be displayed.
3590
+ * Preferred position for displaying the tooltip. It may adjust automatically based on available space.
3610
3591
  */
3611
- children: React.ReactNode;
3592
+ position?: "bottom" | "top" | "left" | "right";
3612
3593
  };
3613
3594
 
3614
- declare const DxcTooltip: ({ position, label, children }: Props$2) => JSX.Element;
3595
+ declare function DxcTooltip(props: Props$2): react_jsx_runtime.JSX.Element;
3615
3596
 
3616
3597
  type Props$1 = {
3617
- as?: keyof HTMLElementTagNameMap;
3598
+ as?: "a" | "blockquote" | "cite" | "code" | "div" | "em" | "figcaption" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | "pre" | "small" | "span" | "strong";
3599
+ children: ReactNode;
3600
+ color?: string;
3618
3601
  display?: "inline" | "block";
3619
3602
  fontFamily?: "Open Sans, sans-serif" | "Source Code Pro, monospace";
3620
3603
  fontSize?: "0.75rem" | "0.875rem" | "1rem" | "1.25rem" | "1.5rem" | "2rem" | "3rem" | "3.75rem";
@@ -3623,23 +3606,13 @@ type Props$1 = {
3623
3606
  letterSpacing?: "-0.025em" | "-0.0125em" | "0em" | "0.025em" | "0.05em" | "0.1em";
3624
3607
  lineHeight?: "1em" | "1.25em" | "1.365em" | "1.5em" | "1.715em" | "2em";
3625
3608
  textAlign?: "left" | "center" | "right";
3626
- color?: string;
3627
3609
  textDecoration?: "none" | "underline" | "line-through";
3628
3610
  textOverflow?: "clip" | "ellipsis" | "unset";
3629
3611
  whiteSpace?: "normal" | "nowrap" | "pre" | "pre-line" | "pre-wrap";
3630
- children: React.ReactNode;
3631
3612
  };
3632
3613
 
3633
- declare const DxcTypography: ({ textOverflow, whiteSpace, children, ...props }: Props$1) => JSX.Element;
3614
+ declare function DxcTypography({ children, ...props }: Props$1): react_jsx_runtime.JSX.Element;
3634
3615
 
3635
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3636
- type Margin = {
3637
- top?: Space;
3638
- bottom?: Space;
3639
- left?: Space;
3640
- right?: Space;
3641
- };
3642
- type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
3643
3616
  type StepProps = {
3644
3617
  /**
3645
3618
  * Step label.
@@ -3688,41 +3661,41 @@ type Props = {
3688
3661
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
3689
3662
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
3690
3663
  */
3691
- margin?: Space | Margin;
3664
+ margin?: Space$1 | Margin;
3692
3665
  /**
3693
3666
  * Value of the tabindex attribute that is given to all the steps.
3694
3667
  */
3695
3668
  tabIndex?: number;
3696
3669
  };
3697
3670
 
3698
- declare const DxcWizard: ({ mode, defaultCurrentStep, currentStep, onStepClick, steps, margin, tabIndex, }: Props) => JSX.Element;
3671
+ declare function DxcWizard({ currentStep, defaultCurrentStep, margin, mode, onStepClick, steps, tabIndex, }: Props): react_jsx_runtime.JSX.Element;
3699
3672
 
3700
3673
  declare const componentTokens: {
3701
3674
  accordion: {
3702
3675
  backgroundColor: string;
3703
3676
  hoverBackgroundColor: string;
3677
+ focusBackgroundColor: string;
3678
+ activeBackgroundColor: string;
3704
3679
  arrowColor: string;
3705
3680
  disabledArrowColor: string;
3681
+ subLabelFontFamily: string;
3682
+ subLabelFontSize: string;
3683
+ subLabelFontWeight: string;
3684
+ subLabelFontStyle: string;
3685
+ subLabelFontColor: string;
3686
+ disabledSubLabelFontColor: string;
3706
3687
  assistiveTextFontFamily: string;
3707
3688
  assistiveTextFontSize: string;
3708
3689
  assistiveTextFontWeight: string;
3709
3690
  assistiveTextFontStyle: string;
3710
- assistiveTextLetterSpacing: string;
3711
3691
  assistiveTextFontColor: string;
3712
3692
  disabledAssistiveTextFontColor: string;
3713
- assistiveTextMinWidth: string;
3714
- assistiveTextPaddingRight: string;
3715
- assistiveTextPaddingLeft: string;
3716
3693
  titleLabelFontFamily: string;
3717
3694
  titleLabelFontSize: string;
3718
3695
  titleLabelFontWeight: string;
3719
3696
  titleLabelFontStyle: string;
3720
3697
  titleLabelFontColor: string;
3721
3698
  disabledTitleLabelFontColor: string;
3722
- titleLabelPaddingTop: string;
3723
- titleLabelPaddingBottom: string;
3724
- titleLabelPaddingLeft: string;
3725
- titleLabelPaddingRight: string;
3726
3699
  focusBorderColor: string;
3727
3700
  focusBorderStyle: string;
3728
3701
  focusBorderThickness: string;
@@ -3730,81 +3703,34 @@ declare const componentTokens: {
3730
3703
  boxShadowOffsetX: string;
3731
3704
  boxShadowOffsetY: string;
3732
3705
  boxShadowBlur: string;
3706
+ boxShadowSpread: string;
3733
3707
  boxShadowColor: string;
3734
3708
  iconColor: string;
3735
3709
  disabledIconColor: string;
3736
3710
  iconSize: string;
3737
- iconMarginLeft: string;
3738
- iconMarginRight: string;
3739
- accordionGroupSeparatorBorderColor: string;
3740
- accordionGroupSeparatorBorderThickness: string;
3741
- accordionGroupSeparatorBorderRadius: string;
3742
- accordionGroupSeparatorBorderStyle: string;
3711
+ accordionSeparatorBorderColor: string;
3712
+ accordionSeparatorBorderThickness: string;
3713
+ accordionSeparatorBorderStyle: string;
3743
3714
  };
3744
3715
  alert: {
3745
- titleFontFamily: string;
3746
- titleFontColor: string;
3747
- titleFontSize: string;
3748
- titleFontStyle: string;
3749
- titleFontWeight: string;
3750
- titleTextTransform: string;
3751
- titlePaddingRight: string;
3752
- titlePaddingLeft: string;
3753
- inlineTextFontFamily: string;
3754
- inlineTextFontColor: string;
3755
- inlineTextFontSize: string;
3756
- inlineTextFontStyle: string;
3757
- inlineTextFontWeight: string;
3758
- inlineTextPaddingLeft: string;
3759
- inlineTextPaddingRight: string;
3760
- contentPaddingLeft: string;
3761
- contentPaddingRight: string;
3762
- contentPaddingTop: string;
3763
- contentPaddingBottom: string;
3764
- borderRadius: string;
3765
- borderStyle: string;
3766
- borderThickness: string;
3767
- infoBorderColor: string;
3768
- successBorderColor: string;
3769
- warningBorderColor: string;
3770
- errorBorderColor: string;
3771
- iconSize: string;
3772
- iconPaddingLeft: string;
3773
- iconPaddingRight: string;
3774
- infoIconColor: string;
3775
- successIconColor: string;
3776
- warningIconColor: string;
3716
+ errorBackgroundColor: string;
3777
3717
  errorIconColor: string;
3718
+ fontColor: string;
3719
+ fontFamily: string;
3720
+ fontSize: string;
3721
+ fontStyle: string;
3722
+ fontWeight: string;
3723
+ iconSize: string;
3778
3724
  infoBackgroundColor: string;
3725
+ infoIconColor: string;
3726
+ modalBackgroundColor: string;
3727
+ modalTitleFontSize: string;
3728
+ modalTitleFontWeight: string;
3729
+ overlayColor: string;
3779
3730
  successBackgroundColor: string;
3731
+ successIconColor: string;
3780
3732
  warningBackgroundColor: string;
3781
- errorBackgroundColor: string;
3782
- hoverActionBackgroundColor: string;
3783
- activeActionBackgroundColor: string;
3784
- focusActionBorderColor: string;
3785
- overlayColor: string;
3786
- };
3787
- box: {
3788
- backgroundColor: string;
3789
- borderRadius: string;
3790
- borderThickness: string;
3791
- borderStyle: string;
3792
- borderColor: string;
3793
- noneShadowDepthShadowOffsetX: string;
3794
- noneShadowDepthShadowOffsetY: string;
3795
- noneShadowDepthShadowBlur: string;
3796
- noneShadowDepthShadowSpread: string;
3797
- noneShadowDepthShadowColor: string;
3798
- oneShadowDepthShadowOffsetX: string;
3799
- oneShadowDepthShadowOffsetY: string;
3800
- oneShadowDepthShadowBlur: string;
3801
- oneShadowDepthShadowSpread: string;
3802
- oneShadowDepthShadowColor: string;
3803
- twoShadowDepthShadowOffsetX: string;
3804
- twoShadowDepthShadowOffsetY: string;
3805
- twoShadowDepthShadowBlur: string;
3806
- twoShadowDepthShadowSpread: string;
3807
- twoShadowDepthShadowColor: string;
3733
+ warningIconColor: string;
3808
3734
  };
3809
3735
  bulletedList: {
3810
3736
  fontColor: string;
@@ -4085,6 +4011,16 @@ declare const componentTokens: {
4085
4011
  focusColor: string;
4086
4012
  scrollBarThumbColor: string;
4087
4013
  scrollBarTrackColor: string;
4014
+ actionIconColor: string;
4015
+ disabledActionIconColor: string;
4016
+ hoverActionIconColor: string;
4017
+ focusActionIconColor: string;
4018
+ activeActionIconColor: string;
4019
+ actionBackgroundColor: string;
4020
+ disabledActionBackgroundColor: string;
4021
+ hoverActionBackgroundColor: string;
4022
+ focusActionBorderColor: string;
4023
+ activeActionBackgroundColor: string;
4088
4024
  };
4089
4025
  dateInput: {
4090
4026
  pickerBackgroundColor: string;
@@ -4120,15 +4056,8 @@ declare const componentTokens: {
4120
4056
  dialog: {
4121
4057
  overlayColor: string;
4122
4058
  backgroundColor: string;
4123
- closeIconSize: string;
4124
- closeIconTopPosition: string;
4125
- closeIconRightPosition: string;
4126
4059
  closeIconBackgroundColor: string;
4127
- closeIconBorderColor: string;
4128
4060
  closeIconColor: string;
4129
- closeIconBorderThickness: string;
4130
- closeIconBorderStyle: string;
4131
- closeIconBorderRadius: string;
4132
4061
  boxShadowOffsetX: string;
4133
4062
  boxShadowOffsetY: string;
4134
4063
  boxShadowBlur: string;
@@ -4192,7 +4121,7 @@ declare const componentTokens: {
4192
4121
  helperTextFontColor: string;
4193
4122
  dropLabelFontColor: string;
4194
4123
  disabledLabelFontColor: string;
4195
- disabledHelperTextFontcolor: string;
4124
+ disabledHelperTextFontColor: string;
4196
4125
  disabledDropLabelFontColor: string;
4197
4126
  focusDropBorderColor: string;
4198
4127
  disabledDropBorderColor: string;
@@ -4263,15 +4192,15 @@ declare const componentTokens: {
4263
4192
  };
4264
4193
  header: {
4265
4194
  backgroundColor: string;
4266
- hamburguerFocusColor: string;
4267
- hamburguerFontFamily: string;
4268
- hamburguerFontStyle: string;
4269
- hamburguerFontColor: string;
4270
- hamburguerFontSize: string;
4271
- hamburguerFontWeight: string;
4272
- hamburguerTextTransform: string;
4273
- hamburguerIconColor: string;
4274
- hamburguerHoverColor: string;
4195
+ hamburgerFocusColor: string;
4196
+ hamburgerFontFamily: string;
4197
+ hamburgerFontStyle: string;
4198
+ hamburgerFontColor: string;
4199
+ hamburgerFontSize: string;
4200
+ hamburgerFontWeight: string;
4201
+ hamburgerTextTransform: string;
4202
+ hamburgerIconColor: string;
4203
+ hamburgerHoverColor: string;
4275
4204
  logo: string;
4276
4205
  logoResponsive: string;
4277
4206
  logoHeight: string;
@@ -4913,7 +4842,7 @@ declare const componentTokens: {
4913
4842
  labelFontColor: string;
4914
4843
  disabledLabelFontColor: string;
4915
4844
  helperTextFontColor: string;
4916
- disabledHelperTextFontcolor: string;
4845
+ disabledHelperTextFontColor: string;
4917
4846
  unselectedBackgroundColor: string;
4918
4847
  unselectedHoverBackgroundColor: string;
4919
4848
  unselectedActiveBackgroundColor: string;
@@ -5022,6 +4951,7 @@ type OpinionatedTheme = {
5022
4951
  accordion: {
5023
4952
  accentColor: string;
5024
4953
  titleFontColor: string;
4954
+ subLabelFontColor: string;
5025
4955
  assistiveTextFontColor: string;
5026
4956
  };
5027
4957
  alert: {
@@ -5029,9 +4959,6 @@ type OpinionatedTheme = {
5029
4959
  accentColor: string;
5030
4960
  overlayColor: string;
5031
4961
  };
5032
- box: {
5033
- baseColor: string;
5034
- };
5035
4962
  button: {
5036
4963
  baseColor: string;
5037
4964
  primaryFontColor: string;
@@ -5086,7 +5013,7 @@ type OpinionatedTheme = {
5086
5013
  accentColor: string;
5087
5014
  fontColor: string;
5088
5015
  menuBaseColor: string;
5089
- hamburguerColor: string;
5016
+ hamburgerColor: string;
5090
5017
  logo: string;
5091
5018
  logoResponsive: string;
5092
5019
  contentColor: string;
@@ -5176,22 +5103,20 @@ type OpinionatedTheme = {
5176
5103
  };
5177
5104
  };
5178
5105
  declare const defaultTranslatedComponentLabels: {
5179
- formFields: {
5180
- optionalLabel: string;
5181
- requiredSelectionErrorMessage: string;
5182
- requiredValueErrorMessage: string;
5183
- formatRequestedErrorMessage: string;
5184
- lengthErrorMessage: (minLength?: number, maxLength?: number) => string;
5185
- logoAlternativeText: string;
5186
- };
5187
5106
  applicationLayout: {
5188
5107
  visibilityToggleTitle: string;
5189
5108
  };
5190
5109
  alert: {
5191
- infoTitleText: string;
5192
- successTitleText: string;
5193
- warningTitleText: string;
5194
- errorTitleText: string;
5110
+ previousMessageActionTitle: string;
5111
+ nextMessageActionTitle: string;
5112
+ closeAlertActionTitle: string;
5113
+ closeMessageActionTitle: string;
5114
+ };
5115
+ calendar: {
5116
+ daysShort: string[];
5117
+ months: string[];
5118
+ previousMonthTitle: string;
5119
+ nextMonthTitle: string;
5195
5120
  };
5196
5121
  dateInput: {
5197
5122
  invalidDateErrorMessage: string;
@@ -5212,9 +5137,17 @@ declare const defaultTranslatedComponentLabels: {
5212
5137
  footer: {
5213
5138
  copyrightText: (year: number) => string;
5214
5139
  };
5140
+ formFields: {
5141
+ optionalLabel: string;
5142
+ requiredSelectionErrorMessage: string;
5143
+ requiredValueErrorMessage: string;
5144
+ formatRequestedErrorMessage: string;
5145
+ lengthErrorMessage: (minLength?: number, maxLength?: number) => string;
5146
+ logoAlternativeText: string;
5147
+ };
5215
5148
  header: {
5216
5149
  closeIcon: string;
5217
- hamburguerTitle: string;
5150
+ hamburgerTitle: string;
5218
5151
  };
5219
5152
  numberInput: {
5220
5153
  valueGreaterThanOrEqualToErrorMessage: (value: number) => string;
@@ -5252,41 +5185,45 @@ declare const defaultTranslatedComponentLabels: {
5252
5185
  searchingMessage: string;
5253
5186
  fetchingDataErrorMessage: string;
5254
5187
  };
5255
- calendar: {
5256
- daysShort: string[];
5257
- months: string[];
5258
- previousMonthTitle: string;
5259
- nextMonthTitle: string;
5188
+ toast: {
5189
+ clearToastActionTitle: string;
5260
5190
  };
5261
5191
  };
5262
5192
  type TranslatedLabels = typeof defaultTranslatedComponentLabels;
5263
5193
 
5264
- declare const HalstackContext: react.Context<DeepPartial<{
5194
+ /**
5195
+ * This type is used to allow partial themes and labels objects to be passed to the HalstackProvider.
5196
+ * This is an extension of the already existing Partial type, which only allows one level of partiality.
5197
+ */
5198
+ type DeepPartial<T> = {
5199
+ [P in keyof T]?: Partial<T[P]>;
5200
+ };
5201
+ declare const HalstackContext: react.Context<{
5265
5202
  accordion: {
5266
5203
  backgroundColor: string;
5267
5204
  hoverBackgroundColor: string;
5205
+ focusBackgroundColor: string;
5206
+ activeBackgroundColor: string;
5268
5207
  arrowColor: string;
5269
5208
  disabledArrowColor: string;
5209
+ subLabelFontFamily: string;
5210
+ subLabelFontSize: string;
5211
+ subLabelFontWeight: string;
5212
+ subLabelFontStyle: string;
5213
+ subLabelFontColor: string;
5214
+ disabledSubLabelFontColor: string;
5270
5215
  assistiveTextFontFamily: string;
5271
5216
  assistiveTextFontSize: string;
5272
5217
  assistiveTextFontWeight: string;
5273
5218
  assistiveTextFontStyle: string;
5274
- assistiveTextLetterSpacing: string;
5275
5219
  assistiveTextFontColor: string;
5276
5220
  disabledAssistiveTextFontColor: string;
5277
- assistiveTextMinWidth: string;
5278
- assistiveTextPaddingRight: string;
5279
- assistiveTextPaddingLeft: string;
5280
5221
  titleLabelFontFamily: string;
5281
5222
  titleLabelFontSize: string;
5282
5223
  titleLabelFontWeight: string;
5283
5224
  titleLabelFontStyle: string;
5284
5225
  titleLabelFontColor: string;
5285
5226
  disabledTitleLabelFontColor: string;
5286
- titleLabelPaddingTop: string;
5287
- titleLabelPaddingBottom: string;
5288
- titleLabelPaddingLeft: string;
5289
- titleLabelPaddingRight: string;
5290
5227
  focusBorderColor: string;
5291
5228
  focusBorderStyle: string;
5292
5229
  focusBorderThickness: string;
@@ -5294,81 +5231,34 @@ declare const HalstackContext: react.Context<DeepPartial<{
5294
5231
  boxShadowOffsetX: string;
5295
5232
  boxShadowOffsetY: string;
5296
5233
  boxShadowBlur: string;
5234
+ boxShadowSpread: string;
5297
5235
  boxShadowColor: string;
5298
5236
  iconColor: string;
5299
5237
  disabledIconColor: string;
5300
5238
  iconSize: string;
5301
- iconMarginLeft: string;
5302
- iconMarginRight: string;
5303
- accordionGroupSeparatorBorderColor: string;
5304
- accordionGroupSeparatorBorderThickness: string;
5305
- accordionGroupSeparatorBorderRadius: string;
5306
- accordionGroupSeparatorBorderStyle: string;
5239
+ accordionSeparatorBorderColor: string;
5240
+ accordionSeparatorBorderThickness: string;
5241
+ accordionSeparatorBorderStyle: string;
5307
5242
  };
5308
5243
  alert: {
5309
- titleFontFamily: string;
5310
- titleFontColor: string;
5311
- titleFontSize: string;
5312
- titleFontStyle: string;
5313
- titleFontWeight: string;
5314
- titleTextTransform: string;
5315
- titlePaddingRight: string;
5316
- titlePaddingLeft: string;
5317
- inlineTextFontFamily: string;
5318
- inlineTextFontColor: string;
5319
- inlineTextFontSize: string;
5320
- inlineTextFontStyle: string;
5321
- inlineTextFontWeight: string;
5322
- inlineTextPaddingLeft: string;
5323
- inlineTextPaddingRight: string;
5324
- contentPaddingLeft: string;
5325
- contentPaddingRight: string;
5326
- contentPaddingTop: string;
5327
- contentPaddingBottom: string;
5328
- borderRadius: string;
5329
- borderStyle: string;
5330
- borderThickness: string;
5331
- infoBorderColor: string;
5332
- successBorderColor: string;
5333
- warningBorderColor: string;
5334
- errorBorderColor: string;
5335
- iconSize: string;
5336
- iconPaddingLeft: string;
5337
- iconPaddingRight: string;
5338
- infoIconColor: string;
5339
- successIconColor: string;
5340
- warningIconColor: string;
5244
+ errorBackgroundColor: string;
5341
5245
  errorIconColor: string;
5246
+ fontColor: string;
5247
+ fontFamily: string;
5248
+ fontSize: string;
5249
+ fontStyle: string;
5250
+ fontWeight: string;
5251
+ iconSize: string;
5342
5252
  infoBackgroundColor: string;
5253
+ infoIconColor: string;
5254
+ modalBackgroundColor: string;
5255
+ modalTitleFontSize: string;
5256
+ modalTitleFontWeight: string;
5257
+ overlayColor: string;
5343
5258
  successBackgroundColor: string;
5259
+ successIconColor: string;
5344
5260
  warningBackgroundColor: string;
5345
- errorBackgroundColor: string;
5346
- hoverActionBackgroundColor: string;
5347
- activeActionBackgroundColor: string;
5348
- focusActionBorderColor: string;
5349
- overlayColor: string;
5350
- };
5351
- box: {
5352
- backgroundColor: string;
5353
- borderRadius: string;
5354
- borderThickness: string;
5355
- borderStyle: string;
5356
- borderColor: string;
5357
- noneShadowDepthShadowOffsetX: string;
5358
- noneShadowDepthShadowOffsetY: string;
5359
- noneShadowDepthShadowBlur: string;
5360
- noneShadowDepthShadowSpread: string;
5361
- noneShadowDepthShadowColor: string;
5362
- oneShadowDepthShadowOffsetX: string;
5363
- oneShadowDepthShadowOffsetY: string;
5364
- oneShadowDepthShadowBlur: string;
5365
- oneShadowDepthShadowSpread: string;
5366
- oneShadowDepthShadowColor: string;
5367
- twoShadowDepthShadowOffsetX: string;
5368
- twoShadowDepthShadowOffsetY: string;
5369
- twoShadowDepthShadowBlur: string;
5370
- twoShadowDepthShadowSpread: string;
5371
- twoShadowDepthShadowColor: string;
5261
+ warningIconColor: string;
5372
5262
  };
5373
5263
  bulletedList: {
5374
5264
  fontColor: string;
@@ -5649,6 +5539,16 @@ declare const HalstackContext: react.Context<DeepPartial<{
5649
5539
  focusColor: string;
5650
5540
  scrollBarThumbColor: string;
5651
5541
  scrollBarTrackColor: string;
5542
+ actionIconColor: string;
5543
+ disabledActionIconColor: string;
5544
+ hoverActionIconColor: string;
5545
+ focusActionIconColor: string;
5546
+ activeActionIconColor: string;
5547
+ actionBackgroundColor: string;
5548
+ disabledActionBackgroundColor: string;
5549
+ hoverActionBackgroundColor: string;
5550
+ focusActionBorderColor: string;
5551
+ activeActionBackgroundColor: string;
5652
5552
  };
5653
5553
  dateInput: {
5654
5554
  pickerBackgroundColor: string;
@@ -5684,15 +5584,8 @@ declare const HalstackContext: react.Context<DeepPartial<{
5684
5584
  dialog: {
5685
5585
  overlayColor: string;
5686
5586
  backgroundColor: string;
5687
- closeIconSize: string;
5688
- closeIconTopPosition: string;
5689
- closeIconRightPosition: string;
5690
5587
  closeIconBackgroundColor: string;
5691
- closeIconBorderColor: string;
5692
5588
  closeIconColor: string;
5693
- closeIconBorderThickness: string;
5694
- closeIconBorderStyle: string;
5695
- closeIconBorderRadius: string;
5696
5589
  boxShadowOffsetX: string;
5697
5590
  boxShadowOffsetY: string;
5698
5591
  boxShadowBlur: string;
@@ -5756,7 +5649,7 @@ declare const HalstackContext: react.Context<DeepPartial<{
5756
5649
  helperTextFontColor: string;
5757
5650
  dropLabelFontColor: string;
5758
5651
  disabledLabelFontColor: string;
5759
- disabledHelperTextFontcolor: string;
5652
+ disabledHelperTextFontColor: string;
5760
5653
  disabledDropLabelFontColor: string;
5761
5654
  focusDropBorderColor: string;
5762
5655
  disabledDropBorderColor: string;
@@ -5827,15 +5720,15 @@ declare const HalstackContext: react.Context<DeepPartial<{
5827
5720
  };
5828
5721
  header: {
5829
5722
  backgroundColor: string;
5830
- hamburguerFocusColor: string;
5831
- hamburguerFontFamily: string;
5832
- hamburguerFontStyle: string;
5833
- hamburguerFontColor: string;
5834
- hamburguerFontSize: string;
5835
- hamburguerFontWeight: string;
5836
- hamburguerTextTransform: string;
5837
- hamburguerIconColor: string;
5838
- hamburguerHoverColor: string;
5723
+ hamburgerFocusColor: string;
5724
+ hamburgerFontFamily: string;
5725
+ hamburgerFontStyle: string;
5726
+ hamburgerFontColor: string;
5727
+ hamburgerFontSize: string;
5728
+ hamburgerFontWeight: string;
5729
+ hamburgerTextTransform: string;
5730
+ hamburgerIconColor: string;
5731
+ hamburgerHoverColor: string;
5839
5732
  logo: string;
5840
5733
  logoResponsive: string;
5841
5734
  logoHeight: string;
@@ -6477,7 +6370,7 @@ declare const HalstackContext: react.Context<DeepPartial<{
6477
6370
  labelFontColor: string;
6478
6371
  disabledLabelFontColor: string;
6479
6372
  helperTextFontColor: string;
6480
- disabledHelperTextFontcolor: string;
6373
+ disabledHelperTextFontColor: string;
6481
6374
  unselectedBackgroundColor: string;
6482
6375
  unselectedHoverBackgroundColor: string;
6483
6376
  unselectedActiveBackgroundColor: string;
@@ -6580,24 +6473,22 @@ declare const HalstackContext: react.Context<DeepPartial<{
6580
6473
  separatorColor: string;
6581
6474
  focusColor: string;
6582
6475
  };
6583
- }>>;
6584
- declare const HalstackLanguageContext: react.Context<DeepPartial<{
6585
- formFields: {
6586
- optionalLabel: string;
6587
- requiredSelectionErrorMessage: string;
6588
- requiredValueErrorMessage: string;
6589
- formatRequestedErrorMessage: string;
6590
- lengthErrorMessage: (minLength?: number, maxLength?: number) => string;
6591
- logoAlternativeText: string;
6592
- };
6476
+ }>;
6477
+ declare const HalstackLanguageContext: react.Context<{
6593
6478
  applicationLayout: {
6594
6479
  visibilityToggleTitle: string;
6595
6480
  };
6596
6481
  alert: {
6597
- infoTitleText: string;
6598
- successTitleText: string;
6599
- warningTitleText: string;
6600
- errorTitleText: string;
6482
+ previousMessageActionTitle: string;
6483
+ nextMessageActionTitle: string;
6484
+ closeAlertActionTitle: string;
6485
+ closeMessageActionTitle: string;
6486
+ };
6487
+ calendar: {
6488
+ daysShort: string[];
6489
+ months: string[];
6490
+ previousMonthTitle: string;
6491
+ nextMonthTitle: string;
6601
6492
  };
6602
6493
  dateInput: {
6603
6494
  invalidDateErrorMessage: string;
@@ -6618,9 +6509,17 @@ declare const HalstackLanguageContext: react.Context<DeepPartial<{
6618
6509
  footer: {
6619
6510
  copyrightText: (year: number) => string;
6620
6511
  };
6512
+ formFields: {
6513
+ optionalLabel: string;
6514
+ requiredSelectionErrorMessage: string;
6515
+ requiredValueErrorMessage: string;
6516
+ formatRequestedErrorMessage: string;
6517
+ lengthErrorMessage: (minLength?: number, maxLength?: number) => string;
6518
+ logoAlternativeText: string;
6519
+ };
6621
6520
  header: {
6622
6521
  closeIcon: string;
6623
- hamburguerTitle: string;
6522
+ hamburgerTitle: string;
6624
6523
  };
6625
6524
  numberInput: {
6626
6525
  valueGreaterThanOrEqualToErrorMessage: (value: number) => string;
@@ -6658,26 +6557,24 @@ declare const HalstackLanguageContext: react.Context<DeepPartial<{
6658
6557
  searchingMessage: string;
6659
6558
  fetchingDataErrorMessage: string;
6660
6559
  };
6661
- calendar: {
6662
- daysShort: string[];
6663
- months: string[];
6664
- previousMonthTitle: string;
6665
- nextMonthTitle: string;
6560
+ toast: {
6561
+ clearToastActionTitle: string;
6666
6562
  };
6667
- }>>;
6668
- /**
6669
- * This type is used to allow partial themes and labels objects to be passed to the HalstackProvider.
6670
- * This is an extension of the already existing Partial type, which only allows one level of partiality.
6671
- */
6672
- type DeepPartial<T> = {
6673
- [P in keyof T]?: Partial<T[P]>;
6674
- };
6563
+ }>;
6675
6564
  type HalstackProviderPropsType = {
6676
6565
  theme?: DeepPartial<OpinionatedTheme>;
6677
6566
  advancedTheme?: DeepPartial<AdvancedTheme>;
6678
6567
  labels?: DeepPartial<TranslatedLabels>;
6679
- children: React.ReactNode;
6568
+ children: ReactNode;
6680
6569
  };
6681
6570
  declare const HalstackProvider: ({ theme, advancedTheme, labels, children }: HalstackProviderPropsType) => JSX.Element;
6682
6571
 
6683
- export { DxcAccordion, DxcAccordionGroup, DxcAlert, DxcApplicationLayout, DxcBadge, Bleed as DxcBleed, DxcBox, DxcBreadcrumbs, DxcBulletedList, DxcButton, DxcCard, DxcCheckbox, DxcChip, DxcContainer, DxcContextualMenu, DxcDataGrid, DxcDateInput, DxcDialog, DxcDivider, DxcDropdown, DxcFileInput, DxcFlex, DxcGrid, DxcHeading, DxcImage, Inset as DxcInset, DxcLink, DxcNavTabs, DxcNumberInput, DxcPaginator, DxcParagraph, DxcPasswordInput, DxcProgressBar, DxcQuickNav, DxcRadioGroup, DxcResultsetTable, DxcSelect, DxcSlider, DxcSpinner, DxcStatusLight, DxcSwitch, DxcTable, DxcTabs, DxcTag, DxcTextInput, DxcTextarea, DxcToggleGroup, DxcTooltip, DxcTypography, DxcWizard, HalstackContext, HalstackLanguageContext, HalstackProvider };
6572
+ declare const useToast: () => {
6573
+ default: (toast: DefaultToast) => (() => void) | undefined;
6574
+ success: (toast: SemanticToast) => (() => void) | undefined;
6575
+ warning: (toast: SemanticToast) => (() => void) | undefined;
6576
+ info: (toast: SemanticToast) => (() => void) | undefined;
6577
+ loading: (toast: Omit<LoadingToast, "loading">) => (() => void) | undefined;
6578
+ };
6579
+
6580
+ export { DxcAccordion, DxcAlert, DxcApplicationLayout, DxcBadge, Bleed as DxcBleed, DxcBreadcrumbs, DxcBulletedList, DxcButton, DxcCard, DxcCheckbox, DxcChip, DxcContainer, DxcContextualMenu, DxcDataGrid, DxcDateInput, DxcDialog, DxcDivider, DxcDropdown, DxcFileInput, DxcFlex, DxcGrid, DxcHeading, DxcImage, Inset as DxcInset, DxcLink, DxcNavTabs, DxcNumberInput, DxcPaginator, DxcParagraph, DxcPasswordInput, DxcProgressBar, DxcQuickNav, DxcRadioGroup, DxcResultsetTable, DxcSelect, DxcSlider, DxcSpinner, DxcStatusLight, DxcSwitch, DxcTable, DxcTabs, DxcTag, DxcTextInput, DxcTextarea, DxcToastsQueue, DxcToggleGroup, DxcTooltip, DxcTypography, DxcWizard, HalstackContext, HalstackLanguageContext, HalstackProvider, useToast };