@bcgov/design-system-react-components 0.7.0-pr689 → 0.7.0-pr697

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,18 +1,18 @@
1
- import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { DisclosureProps, DisclosureGroupProps, DialogProps as DialogProps$1, ButtonProps as ButtonProps$1, CalendarProps, DateValue, CheckboxProps, CheckboxGroupProps as CheckboxGroupProps$1, ValidationResult, DatePickerProps as DatePickerProps$1, FormProps, HeadingProps as HeadingProps$1, LinkProps as LinkProps$1, ModalOverlayProps, ProgressBarProps as ProgressBarProps$1, RadioProps, RadioGroupProps as RadioGroupProps$1, SelectProps as SelectProps$1, ListBoxItemProps as ListBoxItemProps$1, Key, SeparatorProps as SeparatorProps$1, TagProps as TagProps$1, TagGroupProps as TagGroupProps$1, TagListProps as TagListProps$1, TextProps as TextProps$1, TextFieldProps as TextFieldProps$1, TimeValue, TimeFieldProps as TimeFieldProps$1, ToggleButtonProps as ToggleButtonProps$1, ToggleButtonGroupProps as ToggleButtonGroupProps$1, SwitchProps as SwitchProps$1, TooltipProps, NumberFieldProps as NumberFieldProps$1 } from 'react-aria-components';
3
- export { DialogTrigger, TooltipTrigger } from 'react-aria-components';
1
+ import * as react from 'react';
4
2
  import { PropsWithChildren } from 'react';
3
+ import { DisclosureProps, DisclosureGroupProps, DialogProps as DialogProps$1, ButtonProps as ButtonProps$1, CalendarProps, DateValue, CheckboxProps, CheckboxGroupProps as CheckboxGroupProps$1, ValidationResult, DatePickerProps as DatePickerProps$1, FormProps, HeadingProps as HeadingProps$1, LinkProps as LinkProps$1, MenuItemProps as MenuItemProps$1, MenuItemRenderProps, MenuProps as MenuProps$1, Key, PopoverProps, ModalOverlayProps, ProgressBarProps as ProgressBarProps$1, RadioProps, RadioGroupProps as RadioGroupProps$1, TagProps as TagProps$1, SelectProps as SelectProps$1, ListBoxItemProps as ListBoxItemProps$1, SeparatorProps as SeparatorProps$1, TagGroupProps as TagGroupProps$1, TagListProps as TagListProps$1, TextProps as TextProps$1, TextFieldProps as TextFieldProps$1, TimeValue, TimeFieldProps as TimeFieldProps$1, ToggleButtonProps as ToggleButtonProps$1, ToggleButtonGroupProps as ToggleButtonGroupProps$1, SwitchProps as SwitchProps$1, TooltipProps, NumberFieldProps as NumberFieldProps$1 } from 'react-aria-components';
4
+ export { DialogTrigger, MenuSection, Header as MenuSectionHeader, MenuTrigger, SubmenuTrigger, TooltipTrigger } from 'react-aria-components';
5
5
 
6
6
  interface AccordionProps extends DisclosureProps {
7
7
  label?: string;
8
8
  }
9
- declare function Accordion({ label, children, ...props }: AccordionProps): react_jsx_runtime.JSX.Element;
9
+ declare function Accordion({ label, children, ...props }: AccordionProps): react.JSX.Element;
10
10
 
11
11
  interface AccordionGroupProps extends DisclosureGroupProps {
12
12
  title?: string;
13
13
  titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
14
14
  }
15
- declare function AccordionGroup({ title, titleElement, children, ...props }: AccordionGroupProps): react_jsx_runtime.JSX.Element;
15
+ declare function AccordionGroup({ title, titleElement, children, ...props }: AccordionGroupProps): react.JSX.Element;
16
16
 
17
17
  interface AlertBannerProps extends React.PropsWithChildren {
18
18
  size?: "small" | "medium";
@@ -24,7 +24,7 @@ interface AlertBannerProps extends React.PropsWithChildren {
24
24
  customIcon?: React.ReactNode;
25
25
  onClose?: () => void;
26
26
  }
27
- declare function AlertBanner({ variant, size, layout, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): react_jsx_runtime.JSX.Element;
27
+ declare function AlertBanner({ variant, size, layout, isIconHidden, isCloseable, role, onClose, children, customIcon, ...props }: AlertBannerProps): react.JSX.Element;
28
28
 
29
29
  interface AlertDialogProps extends DialogProps$1 {
30
30
  variant?: "info" | "confirmation" | "warning" | "error" | "destructive";
@@ -33,7 +33,7 @@ interface AlertDialogProps extends DialogProps$1 {
33
33
  isCloseable?: boolean;
34
34
  buttons?: React.ReactNode;
35
35
  }
36
- declare function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): react_jsx_runtime.JSX.Element;
36
+ declare function AlertDialog({ children, variant, role, title, isCloseable, isIconHidden, buttons, ...props }: AlertDialogProps): react.JSX.Element;
37
37
 
38
38
  interface ButtonProps extends ButtonProps$1 {
39
39
  /**
@@ -53,16 +53,16 @@ interface ButtonProps extends ButtonProps$1 {
53
53
  */
54
54
  isIconButton?: boolean;
55
55
  }
56
- declare function Button({ size, variant, danger, isIconButton, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
56
+ declare function Button({ size, variant, danger, isIconButton, ...props }: ButtonProps): react.JSX.Element;
57
57
 
58
58
  interface ButtonGroupProps extends React.PropsWithChildren {
59
59
  orientation?: "horizontal" | "vertical";
60
60
  alignment?: "start" | "center" | "end";
61
61
  ariaLabel?: string | undefined;
62
62
  }
63
- declare function ButtonGroup({ orientation, alignment, ariaLabel, children, ...props }: ButtonGroupProps): react_jsx_runtime.JSX.Element;
63
+ declare function ButtonGroup({ orientation, alignment, ariaLabel, children, ...props }: ButtonGroupProps): react.JSX.Element;
64
64
 
65
- declare function Calendar({ visibleDuration, ...props }: CalendarProps<DateValue>): react_jsx_runtime.JSX.Element;
65
+ declare function Calendar({ visibleDuration, ...props }: CalendarProps<DateValue>): react.JSX.Element;
66
66
 
67
67
  interface CalloutProps extends React.PropsWithChildren {
68
68
  variant?: "lightGrey" | "lightBlue" | "lightGold" | "Blue" | "Grey" | "Black";
@@ -72,9 +72,9 @@ interface CalloutProps extends React.PropsWithChildren {
72
72
  role?: React.AriaRole | undefined;
73
73
  isLeftBorderDisabled?: boolean;
74
74
  }
75
- declare function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): react_jsx_runtime.JSX.Element;
75
+ declare function Callout({ variant, title, description, buttons, role, isLeftBorderDisabled, children, ...props }: CalloutProps): react.JSX.Element;
76
76
 
77
- declare function Checkbox({ value, children, ...props }: CheckboxProps): react_jsx_runtime.JSX.Element;
77
+ declare function Checkbox({ value, children, ...props }: CheckboxProps): react.JSX.Element;
78
78
 
79
79
  interface CheckboxGroupProps extends CheckboxGroupProps$1 {
80
80
  orientation?: "horizontal" | "vertical";
@@ -84,7 +84,7 @@ interface CheckboxGroupProps extends CheckboxGroupProps$1 {
84
84
  /** `flex-wrap` style property, defaults to `nowrap` */
85
85
  flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
86
86
  }
87
- declare function CheckboxGroup({ orientation, label, description, errorMessage, flexWrap, children, ...props }: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
87
+ declare function CheckboxGroup({ orientation, label, description, errorMessage, flexWrap, children, ...props }: CheckboxGroupProps): react.JSX.Element;
88
88
 
89
89
  interface DatePickerProps<T extends DateValue> extends DatePickerProps$1<T> {
90
90
  size?: "small" | "medium";
@@ -96,12 +96,12 @@ interface DatePickerProps<T extends DateValue> extends DatePickerProps$1<T> {
96
96
  isBrowserLocaleUsed?: boolean;
97
97
  }
98
98
 
99
- declare function DatePicker<T extends DateValue>({ size, label, description, errorMessage, showFormatHelpText, isRequired, isCalendarDisabled, isBrowserLocaleUsed, ...props }: DatePickerProps<T>): react_jsx_runtime.JSX.Element;
99
+ declare function DatePicker<T extends DateValue>({ size, label, description, errorMessage, showFormatHelpText, isRequired, isCalendarDisabled, isBrowserLocaleUsed, ...props }: DatePickerProps<T>): react.JSX.Element;
100
100
 
101
101
  interface DialogProps extends DialogProps$1 {
102
102
  isCloseable?: boolean;
103
103
  }
104
- declare function Dialog({ isCloseable, role, children, ...props }: DialogProps): react_jsx_runtime.JSX.Element;
104
+ declare function Dialog({ isCloseable, role, children, ...props }: DialogProps): react.JSX.Element;
105
105
 
106
106
  interface FooterLinksProps {
107
107
  /**
@@ -119,7 +119,7 @@ interface FooterLinksProps {
119
119
  * @param {FooterLinksProps} props
120
120
  * @returns {React.ReactElement}
121
121
  */
122
- declare function FooterLinks({ title, links }: FooterLinksProps): react_jsx_runtime.JSX.Element;
122
+ declare function FooterLinks({ title, links }: FooterLinksProps): react.JSX.Element;
123
123
  interface FooterProps {
124
124
  /**
125
125
  * Land acknowledgement block (defaults to Gov.bc.ca land acknowledgement)
@@ -163,9 +163,9 @@ interface FooterProps {
163
163
  * @param {FooterProps} props
164
164
  * @returns {React.ReactElement}
165
165
  */
166
- declare function Footer({ children, acknowledgement, logo, contact, links, copyright, hideAcknowledgement, hideLogoAndLinks, hideCopyright, }: React.PropsWithChildren<FooterProps>): react_jsx_runtime.JSX.Element;
166
+ declare function Footer({ children, acknowledgement, logo, contact, links, copyright, hideAcknowledgement, hideLogoAndLinks, hideCopyright, }: React.PropsWithChildren<FooterProps>): react.JSX.Element;
167
167
 
168
- declare function Form({ ...props }: FormProps): react_jsx_runtime.JSX.Element;
168
+ declare function Form({ ...props }: FormProps): react.JSX.Element;
169
169
 
170
170
  interface HeaderProps {
171
171
  /**
@@ -193,13 +193,13 @@ interface HeaderProps {
193
193
  */
194
194
  titleElement?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "span" | "p";
195
195
  }
196
- declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react_jsx_runtime.JSX.Element;
196
+ declare function Header({ children, logoLinkElement, logoImage, skipLinks, title, titleElement, }: PropsWithChildren<HeaderProps>): react.JSX.Element;
197
197
 
198
198
  interface HeadingProps extends HeadingProps$1 {
199
199
  color?: "primary" | "primaryInvert" | "secondary" | "secondaryInvert" | "disabled" | "danger";
200
200
  isUnstyled?: boolean;
201
201
  }
202
- declare function Heading({ color, isUnstyled, ...props }: HeadingProps): react_jsx_runtime.JSX.Element;
202
+ declare function Heading({ color, isUnstyled, ...props }: HeadingProps): react.JSX.Element;
203
203
 
204
204
  interface InlineAlertProps extends React.PropsWithChildren {
205
205
  variant?: "info" | "success" | "warning" | "danger";
@@ -212,7 +212,7 @@ interface InlineAlertProps extends React.PropsWithChildren {
212
212
  role?: React.AriaRole | undefined;
213
213
  onClose?: () => void;
214
214
  }
215
- declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, customIcon, buttons, children, onClose, ...props }: InlineAlertProps): react_jsx_runtime.JSX.Element;
215
+ declare function InlineAlert({ variant, title, description, isIconHidden, isCloseable, role, customIcon, buttons, children, onClose, ...props }: InlineAlertProps): react.JSX.Element;
216
216
 
217
217
  interface LinkProps extends LinkProps$1 {
218
218
  children?: React.ReactNode;
@@ -225,21 +225,45 @@ interface LinkProps extends LinkProps$1 {
225
225
  iconLeft?: React.ReactElement;
226
226
  iconRight?: React.ReactElement;
227
227
  }
228
- declare function Link({ children, size, danger, isButton, buttonVariant, isUnstyled, iconLeft, iconRight, ariaLabel, ...props }: LinkProps): react_jsx_runtime.JSX.Element;
228
+ declare function Link({ children, size, danger, isButton, buttonVariant, isUnstyled, iconLeft, iconRight, ariaLabel, ...props }: LinkProps): react.JSX.Element;
229
229
 
230
- declare function Modal({ children, ...props }: ModalOverlayProps): react_jsx_runtime.JSX.Element;
230
+ interface MenuItemProps extends MenuItemProps$1 {
231
+ label?: string;
232
+ description?: string;
233
+ size?: "small" | "medium";
234
+ iconLeft?: React.ReactElement;
235
+ children?: React.ReactNode | ((props: MenuItemRenderProps & {
236
+ defaultChildren: React.ReactNode;
237
+ }) => React.ReactNode);
238
+ }
239
+ declare function MenuItem({ size, label, description, iconLeft, ...props }: MenuItemProps): react.JSX.Element;
240
+
241
+ interface MenuSectionProps {
242
+ id: Key;
243
+ header?: string;
244
+ items: MenuItemProps[];
245
+ }
246
+ interface MenuProps<T extends MenuItemProps> extends MenuProps$1<T> {
247
+ itemSize?: "small" | "medium";
248
+ items?: T[];
249
+ sections?: MenuSectionProps[];
250
+ placement?: PopoverProps["placement"];
251
+ }
252
+ declare function Menu<T extends MenuItemProps>({ itemSize, children, items, sections, placement, ...props }: MenuProps<T>): react.JSX.Element;
253
+
254
+ declare function Modal({ children, ...props }: ModalOverlayProps): react.JSX.Element;
231
255
 
232
256
  interface ProgressBarProps extends ProgressBarProps$1 {
233
257
  size?: "small" | "medium" | "large";
234
258
  }
235
- declare function ProgressBar({ size, valueLabel, ...props }: ProgressBarProps): react_jsx_runtime.JSX.Element;
259
+ declare function ProgressBar({ size, valueLabel, ...props }: ProgressBarProps): react.JSX.Element;
236
260
 
237
261
  interface ProgressCircleProps extends ProgressBarProps$1 {
238
262
  size?: "small" | "medium" | "large";
239
263
  }
240
- declare function ProgressCircle({ size, valueLabel, ...props }: ProgressCircleProps): react_jsx_runtime.JSX.Element;
264
+ declare function ProgressCircle({ size, valueLabel, ...props }: ProgressCircleProps): react.JSX.Element;
241
265
 
242
- declare function Radio({ value, children, ...props }: RadioProps): react_jsx_runtime.JSX.Element;
266
+ declare function Radio({ value, children, ...props }: RadioProps): react.JSX.Element;
243
267
 
244
268
  interface RadioGroupProps extends RadioGroupProps$1 {
245
269
  children?: React.ReactNode;
@@ -250,7 +274,27 @@ interface RadioGroupProps extends RadioGroupProps$1 {
250
274
  /** `flex-wrap` style property, defaults to `nowrap` */
251
275
  flexWrap?: "nowrap" | "wrap" | "wrap-reverse";
252
276
  }
253
- declare function RadioGroup({ orientation, label, description, children, errorMessage, flexWrap, ...props }: RadioGroupProps): react_jsx_runtime.JSX.Element;
277
+ declare function RadioGroup({ orientation, label, description, children, errorMessage, flexWrap, ...props }: RadioGroupProps): react.JSX.Element;
278
+
279
+ interface TagProps extends TagProps$1 {
280
+ /**
281
+ * Icon that appears to the left of the `textValue` field
282
+ */
283
+ icon?: React.ReactNode;
284
+ /**
285
+ * Background color
286
+ */
287
+ color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
288
+ /**
289
+ * tagStyle
290
+ */
291
+ tagStyle?: "rectangular" | "circular";
292
+ /**
293
+ * size
294
+ */
295
+ size?: "xsmall" | "small" | "medium";
296
+ }
297
+ declare function Tag({ color, tagStyle, size, icon, id, textValue, ...props }: TagProps): react.JSX.Element;
254
298
 
255
299
  interface ListBoxItemProps extends ListBoxItemProps$1 {
256
300
  /** Text label for the option. Provide an `id` if this is not unique. */
@@ -263,6 +307,10 @@ interface ListBoxItemProps extends ListBoxItemProps$1 {
263
307
  iconLeft?: React.ReactElement;
264
308
  /** Right icon slot */
265
309
  iconRight?: React.ReactElement;
310
+ /** Optional color token forwarded to selected tags */
311
+ color?: TagProps["color"];
312
+ /** Optional style token forwarded to selected tags */
313
+ tagStyle?: TagProps["tagStyle"];
266
314
  }
267
315
  interface SelectionSectionProps {
268
316
  id: Key;
@@ -271,7 +319,7 @@ interface SelectionSectionProps {
271
319
  /** Flat list of options within the section */
272
320
  items: ListBoxItemProps[];
273
321
  }
274
- interface SelectProps<T extends object> extends SelectProps$1<T> {
322
+ interface SelectProps<T extends object, M extends "single" | "multiple" = "single"> extends SelectProps$1<T, M> {
275
323
  /** Use `items` for a flat list of options */
276
324
  items?: ListBoxItemProps[];
277
325
  /** Use `sections` for a sectioned list with `items` options in each section */
@@ -286,116 +334,104 @@ interface SelectProps<T extends object> extends SelectProps$1<T> {
286
334
  description?: string;
287
335
  /** Used for data validation and error handling */
288
336
  errorMessage?: string | ((validation: ValidationResult) => string);
337
+ /** Overflow behaviour */
338
+ overflow?: "wrap" | "scroll";
289
339
  }
290
- /** Select displays a collapsible list of options and allows a user to select one of them. */
291
- declare function Select<T extends object>({ items, sections, label, description, placeholder, size, errorMessage, ...props }: SelectProps<T>): react_jsx_runtime.JSX.Element;
340
+ /** Select displays a collapsible list of options and allows a user to select one or more of them. */
341
+ declare function Select<T extends object, M extends "single" | "multiple" = "single">({ items, sections, label, description, placeholder, size, errorMessage, selectionMode, overflow, ...props }: SelectProps<T, M>): react.JSX.Element;
292
342
 
293
343
  interface SeparatorProps extends SeparatorProps$1 {
294
344
  size?: "small" | "medium" | "large";
295
345
  }
296
- declare function Separator({ size, ...props }: SeparatorProps): react_jsx_runtime.JSX.Element;
346
+ declare function Separator({ size, ...props }: SeparatorProps): react.JSX.Element;
297
347
 
298
348
  declare function SvgBcLogo({ id }: {
299
349
  id?: string | undefined;
300
- }): react_jsx_runtime.JSX.Element;
350
+ }): react.JSX.Element;
301
351
 
302
352
  declare function SvgBcOutlineIcon({ id }: {
303
353
  id?: string | undefined;
304
- }): react_jsx_runtime.JSX.Element;
354
+ }): react.JSX.Element;
305
355
 
306
356
  declare function SvgBetaIcon({ id }: {
307
357
  id?: string | undefined;
308
- }): react_jsx_runtime.JSX.Element;
358
+ }): react.JSX.Element;
309
359
 
310
360
  declare function SvgCalendarIcon({ ...props }: {
311
361
  [x: string]: any;
312
- }): react_jsx_runtime.JSX.Element;
362
+ }): react.JSX.Element;
313
363
 
314
364
  declare function SvgCheckIcon({ id }: {
315
365
  id?: string | undefined;
316
- }): react_jsx_runtime.JSX.Element;
366
+ }): react.JSX.Element;
317
367
 
318
368
  declare function SvgCheckCircleIcon({ id }: {
319
369
  id?: string | undefined;
320
- }): react_jsx_runtime.JSX.Element;
370
+ }): react.JSX.Element;
321
371
 
322
372
  declare function SvgChevronUpIcon({ id }: {
323
373
  id?: string | undefined;
324
- }): react_jsx_runtime.JSX.Element;
374
+ }): react.JSX.Element;
325
375
 
326
376
  declare function SvgChevronDownIcon({ id }: {
327
377
  id?: string | undefined;
328
- }): react_jsx_runtime.JSX.Element;
378
+ }): react.JSX.Element;
329
379
 
330
380
  declare function SvgChevronLeftIcon({ id }: {
331
381
  id?: string | undefined;
332
- }): react_jsx_runtime.JSX.Element;
382
+ }): react.JSX.Element;
333
383
 
334
384
  declare function SvgChevronRightIcon({ id }: {
335
385
  id?: string | undefined;
336
- }): react_jsx_runtime.JSX.Element;
386
+ }): react.JSX.Element;
337
387
 
338
388
  declare function SvgDashIcon$1({ id }: {
339
389
  id?: string | undefined;
340
- }): react_jsx_runtime.JSX.Element;
390
+ }): react.JSX.Element;
341
391
 
342
392
  declare function SvgExclamationIcon({ id }: {
343
393
  id?: string | undefined;
344
- }): react_jsx_runtime.JSX.Element;
394
+ }): react.JSX.Element;
345
395
 
346
396
  declare function SvgExclamationCircleIcon({ id, }: {
347
397
  id?: string | undefined;
348
- }): react_jsx_runtime.JSX.Element;
398
+ }): react.JSX.Element;
349
399
 
350
400
  declare function SvgCloseIcon({ id }: {
351
401
  id?: string | undefined;
352
- }): react_jsx_runtime.JSX.Element;
402
+ }): react.JSX.Element;
353
403
 
354
404
  declare function SvgInfoIcon({ id }: {
355
405
  id?: string | undefined;
356
- }): react_jsx_runtime.JSX.Element;
406
+ }): react.JSX.Element;
357
407
 
358
408
  declare function SvgDashIcon({ id }: {
359
409
  id?: string | undefined;
360
- }): react_jsx_runtime.JSX.Element;
410
+ }): react.JSX.Element;
411
+
412
+ interface SvgPlaceholderIconProps {
413
+ /** Width and height of the placeholder icon, defaults to 20 */
414
+ size?: number;
415
+ }
416
+ declare function SvgPlaceholderIcon({ size, ...props }: SvgPlaceholderIconProps): react.JSX.Element;
361
417
 
362
418
  declare function SvgPlusIcon({ id }: {
363
419
  id?: string | undefined;
364
- }): react_jsx_runtime.JSX.Element;
420
+ }): react.JSX.Element;
365
421
 
366
422
  declare function SvgTooltipArrowUp({ id }: {
367
423
  id?: string | undefined;
368
- }): react_jsx_runtime.JSX.Element;
424
+ }): react.JSX.Element;
369
425
 
370
426
  interface SvgUpRightFromSquareIconProps {
371
427
  size?: 16 | 20;
372
428
  id?: string;
373
429
  }
374
- declare function SvgUpRightFromSquareIcon({ size, id, }: SvgUpRightFromSquareIconProps): react_jsx_runtime.JSX.Element;
430
+ declare function SvgUpRightFromSquareIcon({ size, id, }: SvgUpRightFromSquareIconProps): react.JSX.Element;
375
431
 
376
432
  declare function SvgReactAriaIcon({ id }: {
377
433
  id?: string | undefined;
378
- }): react_jsx_runtime.JSX.Element;
379
-
380
- interface TagProps extends TagProps$1 {
381
- /**
382
- * Icon that appears to the left of the `textValue` field
383
- */
384
- icon?: React.ReactNode;
385
- /**
386
- * Background color
387
- */
388
- color?: "bc-blue" | "bc-gold" | "blue" | "dark" | "gray" | "grey" | "green" | "red" | "yellow";
389
- /**
390
- * tagStyle
391
- */
392
- tagStyle?: "rectangular" | "circular";
393
- /**
394
- * size
395
- */
396
- size?: "small" | "medium";
397
- }
398
- declare function Tag({ color, tagStyle, size, icon, id, textValue, }: TagProps): react_jsx_runtime.JSX.Element;
434
+ }): react.JSX.Element;
399
435
 
400
436
  interface TagGroupProps extends TagGroupProps$1 {
401
437
  /**
@@ -411,7 +447,7 @@ interface TagGroupProps extends TagGroupProps$1 {
411
447
  */
412
448
  errorMessage?: string;
413
449
  }
414
- declare function TagGroup({ children, label, description, errorMessage, ...props }: TagGroupProps): react_jsx_runtime.JSX.Element;
450
+ declare function TagGroup({ children, label, description, errorMessage, ...props }: TagGroupProps): react.JSX.Element;
415
451
 
416
452
  interface TagListProps<T> extends Pick<TagListProps$1<T>, "children" | "renderEmptyState"> {
417
453
  items: TagProps[];
@@ -420,21 +456,21 @@ interface TagListProps<T> extends Pick<TagListProps$1<T>, "children" | "renderEm
420
456
  */
421
457
  orientation?: "horizontal" | "vertical";
422
458
  }
423
- declare function TagList<T extends object>({ items, orientation, renderEmptyState, ...props }: TagListProps<T>): react_jsx_runtime.JSX.Element;
459
+ declare function TagList<T extends object>({ items, orientation, renderEmptyState, ...props }: TagListProps<T>): react.JSX.Element;
424
460
 
425
461
  interface TextProps extends TextProps$1 {
426
462
  size?: "small" | "medium" | "large";
427
463
  color?: "primary" | "primaryInvert" | "secondary" | "secondaryInvert" | "disabled" | "danger";
428
464
  isUnstyled?: boolean;
429
465
  }
430
- declare function Text({ elementType, size, color, isUnstyled, ...props }: TextProps): react_jsx_runtime.JSX.Element;
466
+ declare function Text({ elementType, size, color, isUnstyled, ...props }: TextProps): react.JSX.Element;
431
467
 
432
468
  interface TextAreaProps extends TextFieldProps$1 {
433
469
  label?: string;
434
470
  description?: string;
435
471
  errorMessage?: string | ((validation: ValidationResult) => string);
436
472
  }
437
- declare function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }: TextAreaProps): react_jsx_runtime.JSX.Element;
473
+ declare function TextArea({ label, description, errorMessage, maxLength, onChange, value, ...props }: TextAreaProps): react.JSX.Element;
438
474
 
439
475
  interface TextFieldProps extends TextFieldProps$1 {
440
476
  size?: "medium" | "small";
@@ -444,7 +480,7 @@ interface TextFieldProps extends TextFieldProps$1 {
444
480
  iconLeft?: React.ReactElement;
445
481
  iconRight?: React.ReactElement;
446
482
  }
447
- declare function TextField({ size, label, description, errorMessage, iconLeft, iconRight, ...props }: TextFieldProps): react_jsx_runtime.JSX.Element;
483
+ declare function TextField({ size, label, description, errorMessage, iconLeft, iconRight, ...props }: TextFieldProps): react.JSX.Element;
448
484
 
449
485
  interface TimeFieldProps<T extends TimeValue> extends TimeFieldProps$1<T> {
450
486
  size?: "medium" | "small";
@@ -452,26 +488,26 @@ interface TimeFieldProps<T extends TimeValue> extends TimeFieldProps$1<T> {
452
488
  description?: string;
453
489
  errorMessage?: string | ((validation: ValidationResult) => string);
454
490
  }
455
- declare function TimeField<T extends TimeValue>({ size, label, description, errorMessage, isRequired, ...props }: TimeFieldProps<T>): react_jsx_runtime.JSX.Element;
491
+ declare function TimeField<T extends TimeValue>({ size, label, description, errorMessage, isRequired, ...props }: TimeFieldProps<T>): react.JSX.Element;
456
492
 
457
493
  interface ToggleButtonProps extends ToggleButtonProps$1 {
458
494
  size?: "small" | "medium";
459
495
  isIconButton?: boolean;
460
496
  }
461
- declare function ToggleButton({ size, children, isIconButton, ...props }: ToggleButtonProps): react_jsx_runtime.JSX.Element;
497
+ declare function ToggleButton({ size, children, isIconButton, ...props }: ToggleButtonProps): react.JSX.Element;
462
498
 
463
499
  interface ToggleButtonGroupProps extends ToggleButtonGroupProps$1 {
464
500
  label?: string;
465
501
  size?: "small" | "medium";
466
502
  }
467
- declare function ToggleButtonGroup({ label, size, children, ...props }: ToggleButtonGroupProps): react_jsx_runtime.JSX.Element;
503
+ declare function ToggleButtonGroup({ label, size, children, ...props }: ToggleButtonGroupProps): react.JSX.Element;
468
504
 
469
505
  interface SwitchProps extends SwitchProps$1 {
470
506
  labelPosition?: "left" | "right";
471
507
  }
472
- declare function Switch({ labelPosition, children, ...props }: SwitchProps): react_jsx_runtime.JSX.Element;
508
+ declare function Switch({ labelPosition, children, ...props }: SwitchProps): react.JSX.Element;
473
509
 
474
- declare function Tooltip(props: TooltipProps): react_jsx_runtime.JSX.Element;
510
+ declare function Tooltip(props: TooltipProps): react.JSX.Element;
475
511
 
476
512
  interface NumberFieldProps extends NumberFieldProps$1 {
477
513
  size?: "small" | "medium";
@@ -479,6 +515,6 @@ interface NumberFieldProps extends NumberFieldProps$1 {
479
515
  description?: string;
480
516
  errorMessage?: string | ((validation: ValidationResult) => string);
481
517
  }
482
- declare function NumberField({ size, label, description, errorMessage, ...props }: NumberFieldProps): react_jsx_runtime.JSX.Element;
518
+ declare function NumberField({ size, label, description, errorMessage, ...props }: NumberFieldProps): react.JSX.Element;
483
519
 
484
- export { Accordion, AccordionGroup, AlertBanner, AlertDialog, Button, ButtonGroup, Calendar, Callout, Checkbox, CheckboxGroup, DatePicker, Dialog, Footer, FooterLinks, Form, Header, Heading, InlineAlert, Link, Modal, NumberField, ProgressBar, ProgressCircle, Radio, RadioGroup, Select, Separator, SvgBcLogo, SvgBcOutlineIcon, SvgBetaIcon, SvgCalendarIcon, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronLeftIcon, SvgChevronRightIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon$1 as SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgDashIcon as SvgMinusIcon, SvgPlusIcon, SvgReactAriaIcon, SvgTooltipArrowUp, SvgUpRightFromSquareIcon, Switch, Tag, TagGroup, TagList, Text, TextArea, TextField, TimeField, ToggleButton, ToggleButtonGroup, Tooltip };
520
+ export { Accordion, AccordionGroup, AlertBanner, AlertDialog, Button, ButtonGroup, Calendar, Callout, Checkbox, CheckboxGroup, DatePicker, Dialog, Footer, FooterLinks, Form, Header, Heading, InlineAlert, Link, Menu, MenuItem, Modal, NumberField, ProgressBar, ProgressCircle, Radio, RadioGroup, Select, Separator, SvgBcLogo, SvgBcOutlineIcon, SvgBetaIcon, SvgCalendarIcon, SvgCheckCircleIcon, SvgCheckIcon, SvgChevronDownIcon, SvgChevronLeftIcon, SvgChevronRightIcon, SvgChevronUpIcon, SvgCloseIcon, SvgDashIcon$1 as SvgDashIcon, SvgExclamationCircleIcon, SvgExclamationIcon, SvgInfoIcon, SvgDashIcon as SvgMinusIcon, SvgPlaceholderIcon, SvgPlusIcon, SvgReactAriaIcon, SvgTooltipArrowUp, SvgUpRightFromSquareIcon, Switch, Tag, TagGroup, TagList, Text, TextArea, TextField, TimeField, ToggleButton, ToggleButtonGroup, Tooltip };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bcgov/design-system-react-components",
3
- "version": "0.7.0-pr689",
3
+ "version": "0.7.0-pr697",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "git+https://github.com/bcgov/design-system.git",
@@ -68,7 +68,7 @@
68
68
  "@testing-library/jest-dom": "6.9.1",
69
69
  "@testing-library/react": "16.3.2",
70
70
  "@types/node": "25.9.1",
71
- "@types/react": "19.2.15",
71
+ "@types/react": "19.2.16",
72
72
  "@types/react-dom": "19.2.3",
73
73
  "@typescript-eslint/eslint-plugin": "8.59.4",
74
74
  "@typescript-eslint/parser": "8.59.4",
@@ -80,7 +80,7 @@
80
80
  "eslint-plugin-react-hooks": "7.1.1",
81
81
  "eslint-plugin-react-refresh": "0.5.2",
82
82
  "eslint-plugin-storybook": "10.4.0",
83
- "globals": "17.5.0",
83
+ "globals": "17.6.0",
84
84
  "jsdom": "29.1.1",
85
85
  "playwright": "1.60.0",
86
86
  "prettier": "3.8.3",