@carbon/react 1.38.0 → 1.39.0-rc.0

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 (44) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +1225 -759
  2. package/es/components/CodeSnippet/CodeSnippet.js +7 -0
  3. package/es/components/ComboBox/ComboBox.d.ts +30 -27
  4. package/es/components/ComboBox/ComboBox.js +23 -24
  5. package/es/components/Copy/Copy.js +6 -1
  6. package/es/components/CopyButton/CopyButton.js +6 -0
  7. package/es/components/FileUploader/FileUploader.js +1 -1
  8. package/es/components/Grid/index.d.ts +1 -0
  9. package/es/components/Link/Link.d.ts +1 -1
  10. package/es/components/Link/index.d.ts +2 -2
  11. package/es/components/Popover/index.d.ts +9 -5
  12. package/es/components/Popover/index.js +2 -3
  13. package/es/components/UIShell/HeaderContainer.d.ts +1 -1
  14. package/es/components/UIShell/HeaderMenuButton.d.ts +4 -2
  15. package/es/components/UIShell/HeaderMenuItem.d.ts +1 -1
  16. package/es/components/UIShell/HeaderName.d.ts +1 -1
  17. package/es/components/UIShell/HeaderNavigation.d.ts +2 -5
  18. package/es/components/UIShell/HeaderSideNavItems.d.ts +1 -1
  19. package/es/components/UIShell/SideNav.d.ts +1 -1
  20. package/es/components/UIShell/SkipToContent.d.ts +1 -1
  21. package/es/components/UIShell/index.d.ts +8 -8
  22. package/es/index.js +1 -0
  23. package/lib/components/CodeSnippet/CodeSnippet.js +7 -0
  24. package/lib/components/ComboBox/ComboBox.d.ts +30 -27
  25. package/lib/components/ComboBox/ComboBox.js +22 -23
  26. package/lib/components/Copy/Copy.js +6 -1
  27. package/lib/components/CopyButton/CopyButton.js +6 -0
  28. package/lib/components/FileUploader/FileUploader.js +1 -1
  29. package/lib/components/Grid/index.d.ts +1 -0
  30. package/lib/components/Link/Link.d.ts +1 -1
  31. package/lib/components/Link/index.d.ts +2 -2
  32. package/lib/components/Popover/index.d.ts +9 -5
  33. package/lib/components/Popover/index.js +2 -3
  34. package/lib/components/UIShell/HeaderContainer.d.ts +1 -1
  35. package/lib/components/UIShell/HeaderMenuButton.d.ts +4 -2
  36. package/lib/components/UIShell/HeaderMenuItem.d.ts +1 -1
  37. package/lib/components/UIShell/HeaderName.d.ts +1 -1
  38. package/lib/components/UIShell/HeaderNavigation.d.ts +2 -5
  39. package/lib/components/UIShell/HeaderSideNavItems.d.ts +1 -1
  40. package/lib/components/UIShell/SideNav.d.ts +1 -1
  41. package/lib/components/UIShell/SkipToContent.d.ts +1 -1
  42. package/lib/components/UIShell/index.d.ts +8 -8
  43. package/lib/index.js +2 -0
  44. package/package.json +4 -5
@@ -5,11 +5,14 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import Downshift from 'downshift';
8
- import { ReactNodeLike } from 'prop-types';
9
- import React from 'react';
8
+ import { type ComponentProps, type ReactNode, type ComponentType, type ReactElement, type RefAttributes, type PropsWithChildren, type PropsWithoutRef, type InputHTMLAttributes, type MouseEvent } from 'react';
10
9
  import { ListBoxType, ListBoxSize } from '../ListBox';
11
10
  type ExcludedAttributes = 'id' | 'onChange' | 'onClick' | 'type' | 'size';
12
- export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes> {
11
+ interface OnChangeData<ItemType> {
12
+ selectedItem: ItemType | null;
13
+ }
14
+ type ItemToStringHandler<ItemType> = (item: ItemType | null) => string;
15
+ export interface ComboBoxProps<ItemType> extends Omit<InputHTMLAttributes<HTMLInputElement>, ExcludedAttributes> {
13
16
  /**
14
17
  * Specify a label to be read by screen readers on the container node
15
18
  * 'aria-label' of the ListBox component.
@@ -35,12 +38,12 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
35
38
  /**
36
39
  * Additional props passed to Downshift
37
40
  */
38
- downshiftProps?: React.ComponentProps<typeof Downshift>;
41
+ downshiftProps?: ComponentProps<typeof Downshift<ItemType>>;
39
42
  /**
40
43
  * Provide helper text that is used alongside the control label for
41
44
  * additional help
42
45
  */
43
- helperText?: string;
46
+ helperText?: ReactNode;
44
47
  /**
45
48
  * Specify a custom `id` for the input
46
49
  */
@@ -49,7 +52,7 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
49
52
  * Allow users to pass in an arbitrary item or a string (in case their items are an array of strings)
50
53
  * from their collection that are pre-selected
51
54
  */
52
- initialSelectedItem?: object | string | number;
55
+ initialSelectedItem?: ItemType;
53
56
  /**
54
57
  * Specify if the currently selected value is invalid.
55
58
  */
@@ -57,23 +60,23 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
57
60
  /**
58
61
  * Message which is displayed if the value is invalid.
59
62
  */
60
- invalidText?: ReactNodeLike;
63
+ invalidText?: ReactNode;
61
64
  /**
62
65
  * Optional function to render items as custom components instead of strings.
63
66
  * Defaults to null and is overridden by a getter
64
67
  */
65
- itemToElement?: React.ComponentType | null;
68
+ itemToElement?: ComponentType<ItemType> | null;
66
69
  /**
67
70
  * Helper function passed to downshift that allows the library to render a
68
71
  * given item to a string label. By default, it extracts the `label` field
69
72
  * from a given item to serve as the item label in the list
70
73
  */
71
- itemToString?: (item: unknown) => string;
74
+ itemToString?: ItemToStringHandler<ItemType>;
72
75
  /**
73
76
  * We try to stay as generic as possible here to allow individuals to pass
74
77
  * in a collection of whatever kind of data structure they prefer
75
78
  */
76
- items: (object | string | number)[];
79
+ items: ItemType[];
77
80
  /**
78
81
  * @deprecated
79
82
  * should use "light theme" (white background)?
@@ -85,9 +88,7 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
85
88
  * `({ selectedItem }) => void`
86
89
  // * @param {{ selectedItem }}
87
90
  */
88
- onChange: (data: {
89
- selectedItem: any;
90
- }) => void;
91
+ onChange: (data: OnChangeData<ItemType>) => void;
91
92
  /**
92
93
  * Callback function to notify consumer when the text input changes.
93
94
  * This provides support to change available items based on the text.
@@ -95,18 +96,12 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
95
96
  * @param {string} inputText
96
97
  */
97
98
  onInputChange?: (inputText: string) => void;
98
- /**
99
- * Helper function passed to Downshift that allows the user to observe internal
100
- * state changes
101
- * `(changes, stateAndHelpers) => void`
102
- */
103
- onStateChange?: (changes: object, stateAndHelpers: object) => void;
104
99
  /**
105
100
  * Callback function that fires when the combobox menu toggle is clicked
106
101
  * `(evt) => void`
107
102
  * @param {MouseEvent} event
108
103
  */
109
- onToggleClick?: (evt: MouseEvent) => void;
104
+ onToggleClick?: (evt: MouseEvent<HTMLButtonElement>) => void;
110
105
  /**
111
106
  * Used to provide a placeholder text node before a user enters any input.
112
107
  * This is only present if the control has no items selected
@@ -119,13 +114,17 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
119
114
  /**
120
115
  * For full control of the selection
121
116
  */
122
- selectedItem?: object | string | number;
117
+ selectedItem?: ItemType | null;
123
118
  /**
124
119
  * Specify your own filtering logic by passing in a `shouldFilterItem`
125
120
  * function that takes in the current input and an item and passes back
126
121
  * whether or not the item should be filtered.
127
122
  */
128
- shouldFilterItem?: (input: any) => boolean;
123
+ shouldFilterItem?: (input: {
124
+ item: ItemType;
125
+ itemToString?: ItemToStringHandler<ItemType>;
126
+ inputValue: string | null;
127
+ }) => boolean;
129
128
  /**
130
129
  * Specify the size of the ListBox. Currently supports either `sm`, `md` or `lg` as an option.
131
130
  */
@@ -134,12 +133,12 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
134
133
  * Provide text to be used in a `<label>` element that is tied to the
135
134
  * combobox via ARIA attributes.
136
135
  */
137
- titleText?: ReactNodeLike;
136
+ titleText?: ReactNode;
138
137
  /**
139
138
  * Specify a custom translation function that takes in a message identifier
140
139
  * and returns the localized string for the message
141
140
  */
142
- translateWithId?: (id: any) => string;
141
+ translateWithId?: (id: string) => string;
143
142
  /**
144
143
  * Currently supports either the default type, or an inline variant
145
144
  */
@@ -151,7 +150,11 @@ export interface ComboBoxProps extends Omit<React.InputHTMLAttributes<HTMLInputE
151
150
  /**
152
151
  * Provide the text that is displayed when the control is in warning state
153
152
  */
154
- warnText?: ReactNodeLike;
153
+ warnText?: ReactNode;
154
+ }
155
+ type ComboboxComponentProps<ItemType> = PropsWithoutRef<PropsWithChildren<ComboBoxProps<ItemType>> & RefAttributes<HTMLInputElement>>;
156
+ interface ComboBoxComponent {
157
+ <ItemType>(props: ComboboxComponentProps<ItemType>): ReactElement | null;
155
158
  }
156
- declare const ComboBox: React.ForwardRefExoticComponent<ComboBoxProps & React.RefAttributes<unknown>>;
157
- export default ComboBox;
159
+ declare const _default: ComboBoxComponent;
160
+ export default _default;
@@ -49,7 +49,13 @@ const defaultItemToString = item => {
49
49
  if (typeof item === 'string') {
50
50
  return item;
51
51
  }
52
- return item && item.label;
52
+ if (typeof item === 'number') {
53
+ return `${item}`;
54
+ }
55
+ if (item !== null && typeof item === 'object' && 'label' in item && typeof item['label'] === 'string') {
56
+ return item['label'];
57
+ }
58
+ return '';
53
59
  };
54
60
  const defaultShouldFilterItem = () => true;
55
61
  const getInputValue = _ref => {
@@ -85,10 +91,10 @@ const findHighlightedIndex = (_ref2, inputValue) => {
85
91
  return -1;
86
92
  };
87
93
  const getInstanceId = setupGetInstanceId["default"]();
88
- const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref) => {
94
+ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
89
95
  var _Text;
90
96
  const {
91
- ['aria-label']: ariaLabel,
97
+ ['aria-label']: ariaLabel = 'Choose an item',
92
98
  ariaLabel: deprecatedAriaLabel,
93
99
  className: containerClassName,
94
100
  direction,
@@ -101,7 +107,7 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
101
107
  invalidText,
102
108
  items,
103
109
  itemToElement,
104
- itemToString,
110
+ itemToString = defaultItemToString,
105
111
  light,
106
112
  onChange,
107
113
  onInputChange,
@@ -109,14 +115,13 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
109
115
  placeholder,
110
116
  readOnly,
111
117
  selectedItem,
112
- shouldFilterItem,
118
+ shouldFilterItem = defaultShouldFilterItem,
113
119
  size,
114
120
  titleText,
115
121
  translateWithId,
116
122
  type: _type,
117
123
  warn,
118
124
  warnText,
119
- onStateChange: _onStateChange,
120
125
  ...rest
121
126
  } = props;
122
127
  const prefix = usePrefix.usePrefix();
@@ -179,7 +184,7 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
179
184
  const {
180
185
  inputValue
181
186
  } = changes;
182
- const filteredItems = filterItems(items, itemToString, inputValue);
187
+ const filteredItems = filterItems(items, itemToString, inputValue || null);
183
188
  const indexToHighlight = findHighlightedIndex({
184
189
  ...props,
185
190
  items: filteredItems
@@ -187,7 +192,7 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
187
192
  setHighlightedIndex(indexToHighlight);
188
193
  return indexToHighlight;
189
194
  }
190
- return highlightedIndex;
195
+ return highlightedIndex || 0;
191
196
  };
192
197
  const handleOnStateChange = (changes, _ref3) => {
193
198
  let {
@@ -362,7 +367,7 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
362
367
  disabled: disabled,
363
368
  className: inputClasses,
364
369
  type: "text",
365
- tabIndex: "0",
370
+ tabIndex: 0,
366
371
  "aria-autocomplete": "list",
367
372
  "aria-expanded": rootProps['aria-expanded'],
368
373
  "aria-haspopup": "listbox",
@@ -389,24 +394,24 @@ const ComboBox = /*#__PURE__*/React__default["default"].forwardRef((props, ref)
389
394
  }))), /*#__PURE__*/React__default["default"].createElement(index["default"].Menu, getMenuProps({
390
395
  'aria-label': deprecatedAriaLabel || ariaLabel
391
396
  }), isOpen ? filterItems(items, itemToString, inputValue).map((item, index$1) => {
397
+ const isObject = item !== null && typeof item === 'object';
398
+ const title = isObject && 'text' in item && itemToElement ? item.text?.toString() : itemToString(item);
399
+ const disabled = isObject && 'disabled' in item ? !!item.disabled : undefined;
392
400
  const itemProps = getItemProps({
393
401
  item,
394
402
  index: index$1,
395
403
  ['aria-current']: selectedItem === item ? 'true' : 'false',
396
404
  ['aria-selected']: highlightedIndex === index$1 ? 'true' : 'false',
397
- disabled: item.disabled
405
+ disabled
398
406
  });
399
407
  return /*#__PURE__*/React__default["default"].createElement(index["default"].MenuItem, _rollupPluginBabelHelpers["extends"]({
400
408
  key: itemProps.id,
401
409
  isActive: selectedItem === item,
402
410
  isHighlighted: highlightedIndex === index$1,
403
- title: itemToElement ? item.text : itemToString ? itemToString(item) : undefined
404
- }, itemProps), itemToElement ?
405
- /*#__PURE__*/
406
- // @ts-ignore
407
- React__default["default"].createElement(ItemToElement, _rollupPluginBabelHelpers["extends"]({
411
+ title: title
412
+ }, itemProps), ItemToElement ? /*#__PURE__*/React__default["default"].createElement(ItemToElement, _rollupPluginBabelHelpers["extends"]({
408
413
  key: itemProps.id
409
- }, item)) : itemToString ? itemToString(item) : defaultItemToString(item), selectedItem === item && /*#__PURE__*/React__default["default"].createElement(iconsReact.Checkmark, {
414
+ }, item)) : itemToString(item), selectedItem === item && /*#__PURE__*/React__default["default"].createElement(iconsReact.Checkmark, {
410
415
  className: `${prefix}--list-box__menu-item__selected-icon`
411
416
  }));
412
417
  }) : null)), helperText && !invalid && !warn && !isFluid && (_Text || (_Text = /*#__PURE__*/React__default["default"].createElement(Text.Text, {
@@ -450,7 +455,7 @@ ComboBox.propTypes = {
450
455
  * Provide helper text that is used alongside the control label for
451
456
  * additional help
452
457
  */
453
- helperText: PropTypes__default["default"].string,
458
+ helperText: PropTypes__default["default"].node,
454
459
  /**
455
460
  * Specify a custom `id` for the input
456
461
  */
@@ -502,12 +507,6 @@ ComboBox.propTypes = {
502
507
  * @param {string} inputText
503
508
  */
504
509
  onInputChange: PropTypes__default["default"].func,
505
- /**
506
- * Helper function passed to Downshift that allows the user to observe internal
507
- * state changes
508
- * `(changes, stateAndHelpers) => void`
509
- */
510
- onStateChange: PropTypes__default["default"].func,
511
510
  /**
512
511
  * Callback function that fires when the combobox menu toggle is clicked
513
512
  * `(evt) => void`
@@ -27,6 +27,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
27
27
 
28
28
  function Copy(_ref) {
29
29
  let {
30
+ align = 'bottom',
30
31
  children,
31
32
  className,
32
33
  feedback,
@@ -60,7 +61,7 @@ function Copy(_ref) {
60
61
  const initialLabel = other['aria-label'] ?? '';
61
62
  return /*#__PURE__*/React__default["default"].createElement(index.IconButton, _rollupPluginBabelHelpers["extends"]({
62
63
  closeOnActivation: false,
63
- align: "bottom",
64
+ align: align,
64
65
  className: classNames,
65
66
  label: animation ? feedback : initialLabel,
66
67
  onClick: events.composeEventHandlers([onClick, handleClick]),
@@ -70,6 +71,10 @@ function Copy(_ref) {
70
71
  }), children);
71
72
  }
72
73
  Copy.propTypes = {
74
+ /**
75
+ * Specify how the trigger should align with the tooltip
76
+ */
77
+ align: PropTypes__default["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'right']),
73
78
  /**
74
79
  * Pass in content to be rendered in the underlying `<button>`
75
80
  */
@@ -26,6 +26,7 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
26
26
 
27
27
  function CopyButton(_ref) {
28
28
  let {
29
+ align = 'bottom',
29
30
  iconDescription,
30
31
  className,
31
32
  ...other
@@ -37,6 +38,7 @@ function CopyButton(_ref) {
37
38
  max: 'lg'
38
39
  }
39
40
  }, /*#__PURE__*/React__default["default"].createElement(Copy["default"], _rollupPluginBabelHelpers["extends"]({
41
+ align: align,
40
42
  className: cx__default["default"](className, `${prefix}--copy-btn`),
41
43
  "aria-label": iconDescription
42
44
  }, other), /*#__PURE__*/React__default["default"].createElement(iconsReact.Copy, {
@@ -44,6 +46,10 @@ function CopyButton(_ref) {
44
46
  })));
45
47
  }
46
48
  CopyButton.propTypes = {
49
+ /**
50
+ * Specify how the trigger should align with the tooltip
51
+ */
52
+ align: PropTypes__default["default"].oneOf(['top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right', 'left', 'right']),
47
53
  /**
48
54
  * Specify an optional className to be applied to the underlying `<button>`
49
55
  */
@@ -38,7 +38,7 @@ class FileUploader extends React__default["default"].Component {
38
38
  evt.stopPropagation();
39
39
  const filenames = Array.prototype.map.call(evt.target.files, file => file.name);
40
40
  this.setState({
41
- filenames: this.props.multiple ? this.state.filenames.concat(filenames) : filenames
41
+ filenames: this.props.multiple ? [...new Set([...this.state.filenames, ...filenames])] : filenames
42
42
  });
43
43
  if (this.props.onChange) {
44
44
  this.props.onChange(evt);
@@ -9,3 +9,4 @@ export { Grid } from './Grid';
9
9
  export { default as Row } from './Row';
10
10
  export { default as Column } from './Column';
11
11
  export { ColumnHang } from './ColumnHang';
12
+ export { GridSettings } from './GridContext';
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import React, { AnchorHTMLAttributes, AriaAttributes, ComponentType, HTMLAttributeAnchorTarget } from 'react';
8
- interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
8
+ export interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
9
9
  /**
10
10
  * @description Indicates the element that represents the
11
11
  * current item within a container or set of related
@@ -4,6 +4,6 @@
4
4
  * This source code is licensed under the Apache-2.0 license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- import Link from './Link';
7
+ import Link, { type LinkProps } from './Link';
8
8
  export default Link;
9
- export { Link };
9
+ export { Link, type LinkProps };
@@ -4,7 +4,7 @@
4
4
  * This source code is licensed under the Apache-2.0 license found in the
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
- import React, { type WeakValidationMap, type ElementType } from 'react';
7
+ import React, { type ForwardedRef, type WeakValidationMap, type ElementType } from 'react';
8
8
  import { type PolymorphicProps } from '../../types/common';
9
9
  export type PopoverAlignment = 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' | 'left' | 'left-bottom' | 'left-top' | 'right' | 'right-bottom' | 'right-top';
10
10
  interface PopoverBaseProps {
@@ -52,10 +52,14 @@ interface PopoverBaseProps {
52
52
  open: boolean;
53
53
  }
54
54
  export type PopoverProps<E extends ElementType> = PolymorphicProps<E, PopoverBaseProps>;
55
- export declare const Popover: (<E extends React.ElementType<any> = "span">(props: PopoverProps<E>) => JSX.Element) & {
56
- displayName?: string | undefined;
57
- propTypes?: WeakValidationMap<PopoverProps<any>> | undefined;
58
- };
55
+ export interface PopoverComponent {
56
+ <E extends ElementType = 'span'>(props: PopoverProps<E> & {
57
+ forwardRef?: ForwardedRef<ElementType>;
58
+ }): JSX.Element | null;
59
+ displayName?: string;
60
+ propTypes?: WeakValidationMap<PopoverProps<any>>;
61
+ }
62
+ export declare const Popover: PopoverComponent;
59
63
  export type PopoverContentProps = React.HTMLAttributes<HTMLSpanElement>;
60
64
  export declare const PopoverContent: React.ForwardRefExoticComponent<PopoverContentProps & React.RefAttributes<HTMLSpanElement>>;
61
65
  export {};
@@ -29,7 +29,7 @@ const PopoverContext = /*#__PURE__*/React__default["default"].createContext({
29
29
  current: null
30
30
  }
31
31
  });
32
- function PopoverRenderFunction(_ref, forwardRef) {
32
+ const Popover = /*#__PURE__*/React__default["default"].forwardRef(function PopoverRenderFunction(_ref, forwardRef) {
33
33
  let {
34
34
  isTabTip,
35
35
  align = isTabTip ? 'bottom-left' : 'bottom',
@@ -189,8 +189,7 @@ function PopoverRenderFunction(_ref, forwardRef) {
189
189
  className: className,
190
190
  ref: ref
191
191
  }), isTabTip ? mappedChildren : children));
192
- }
193
- const Popover = /*#__PURE__*/React__default["default"].forwardRef(PopoverRenderFunction);
192
+ });
194
193
 
195
194
  // Note: this displayName is temporarily set so that Storybook ArgTable
196
195
  // correctly displays the name of this component
@@ -10,7 +10,7 @@ interface HeaderContainerRenderProps {
10
10
  isSideNavExpanded: boolean;
11
11
  onClickSideNavExpand: () => void;
12
12
  }
13
- interface HeaderContainerProps {
13
+ export interface HeaderContainerProps {
14
14
  isSideNavExpanded?: boolean;
15
15
  render: React.ComponentType<HeaderContainerRenderProps>;
16
16
  }
@@ -7,7 +7,7 @@
7
7
  import { type ComponentProps } from 'react';
8
8
  import PropTypes from 'prop-types';
9
9
  type HeaderMenuButtonBaseProps = Omit<ComponentProps<'button'>, 'title' | 'type'>;
10
- interface HeaderMenuButtonProps extends HeaderMenuButtonBaseProps {
10
+ export interface HeaderMenuButtonProps extends HeaderMenuButtonBaseProps {
11
11
  'aria-label'?: string;
12
12
  'aria-labelledby'?: string;
13
13
  className?: string;
@@ -74,7 +74,9 @@ declare namespace HeaderMenuButton {
74
74
  fill(value: string, start?: number | undefined, end?: number | undefined): [key: string];
75
75
  copyWithin(target: number, start: number, end?: number | undefined): [key: string];
76
76
  entries(): IterableIterator<[number, string]>;
77
- keys(): IterableIterator<number>;
77
+ keys(): IterableIterator<number>; /**
78
+ * Specify whether the menu button is collapsible.
79
+ */
78
80
  values(): IterableIterator<string>;
79
81
  includes(searchElement: string, fromIndex?: number | undefined): boolean;
80
82
  flatMap<U_3, This = undefined>(callback: (this: This, value: string, index: number, array: string[]) => U_3 | readonly U_3[], thisArg?: This | undefined): U_3[];
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import { type ComponentProps, type ForwardedRef, type ReactNode, ElementType, WeakValidationMap } from 'react';
8
8
  import { LinkProps } from './Link';
9
- type HeaderMenuItemProps<E extends ElementType> = LinkProps<E> & {
9
+ export type HeaderMenuItemProps<E extends ElementType> = LinkProps<E> & {
10
10
  className?: string | undefined;
11
11
  isActive?: boolean | undefined;
12
12
  isCurrentPage?: boolean | undefined;
@@ -7,7 +7,7 @@
7
7
  import { type ElementType } from 'react';
8
8
  import PropTypes from 'prop-types';
9
9
  import { type LinkProps } from './Link';
10
- type HeaderNameProps<E extends ElementType> = LinkProps<E> & {
10
+ export type HeaderNameProps<E extends ElementType> = LinkProps<E> & {
11
11
  prefix?: string | undefined;
12
12
  };
13
13
  declare function HeaderName<E extends ElementType = 'a'>({ children, className: customClassName, prefix, ...rest }: HeaderNameProps<E>): JSX.Element;
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import { type ComponentProps } from 'react';
8
8
  import PropTypes from 'prop-types';
9
- type HeaderNavigationProps = ComponentProps<'nav'>;
9
+ export type HeaderNavigationProps = ComponentProps<'nav'>;
10
10
  declare function HeaderNavigation({ 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, children, className: customClassName, ...rest }: HeaderNavigationProps): JSX.Element;
11
11
  declare namespace HeaderNavigation {
12
12
  var propTypes: {
@@ -61,10 +61,7 @@ declare namespace HeaderNavigation {
61
61
  includes(searchElement: string, fromIndex?: number | undefined): boolean;
62
62
  flatMap<U_3, This = undefined>(callback: (this: This, value: string, index: number, array: string[]) => U_3 | readonly U_3[], thisArg?: This | undefined): U_3[];
63
63
  flat<A, D extends number = 1>(this: A, depth?: D | undefined): FlatArray<A, D>[];
64
- at(index: number): string | undefined; /**
65
- * Provide valid children of HeaderNavigation, for example `HeaderMenuItem`
66
- * or `HeaderMenu`
67
- */
64
+ at(index: number): string | undefined;
68
65
  [Symbol.iterator](): IterableIterator<string>;
69
66
  [Symbol.unscopables](): {
70
67
  copyWithin: boolean;
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import { type ReactNode } from 'react';
8
8
  import PropTypes from 'prop-types';
9
- interface HeaderSideNavItemsProps {
9
+ export interface HeaderSideNavItemsProps {
10
10
  className?: string | undefined;
11
11
  children?: ReactNode;
12
12
  hasDivider?: boolean | undefined;
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  import React, { type ComponentProps, type FocusEvent, type KeyboardEvent, type MouseEventHandler } from 'react';
8
- interface SideNavProps extends ComponentProps<'nav'> {
8
+ export interface SideNavProps extends ComponentProps<'nav'> {
9
9
  expanded?: boolean | undefined;
10
10
  defaultExpanded?: boolean | undefined;
11
11
  isChildOfHeader?: boolean | undefined;
@@ -6,7 +6,7 @@
6
6
  */
7
7
  import { ComponentProps } from 'react';
8
8
  import PropTypes from 'prop-types';
9
- type SkipToContentProps = Omit<ComponentProps<'a'>, 'children'> & {
9
+ export type SkipToContentProps = Omit<ComponentProps<'a'>, 'children'> & {
10
10
  children?: string | undefined;
11
11
  };
12
12
  declare function SkipToContent({ children, className: customClassName, href, tabIndex, ...rest }: SkipToContentProps): JSX.Element;
@@ -6,21 +6,21 @@
6
6
  */
7
7
  export { default as Content } from './Content';
8
8
  export { default as Header } from './Header';
9
- export { default as HeaderContainer } from './HeaderContainer';
9
+ export { default as HeaderContainer, type HeaderContainerProps, } from './HeaderContainer';
10
10
  export { default as HeaderGlobalAction } from './HeaderGlobalAction';
11
11
  export { default as HeaderGlobalBar } from './HeaderGlobalBar';
12
12
  export { default as HeaderMenu } from './HeaderMenu';
13
- export { default as HeaderMenuButton } from './HeaderMenuButton';
14
- export { default as HeaderMenuItem } from './HeaderMenuItem';
15
- export { default as HeaderName } from './HeaderName';
16
- export { default as HeaderNavigation } from './HeaderNavigation';
13
+ export { default as HeaderMenuButton, type HeaderMenuButtonProps, } from './HeaderMenuButton';
14
+ export { default as HeaderMenuItem, type HeaderMenuItemProps, } from './HeaderMenuItem';
15
+ export { default as HeaderName, type HeaderNameProps } from './HeaderName';
16
+ export { default as HeaderNavigation, type HeaderNavigationProps, } from './HeaderNavigation';
17
17
  export { default as HeaderPanel } from './HeaderPanel';
18
- export { default as HeaderSideNavItems } from './HeaderSideNavItems';
18
+ export { default as HeaderSideNavItems, type HeaderSideNavItemsProps, } from './HeaderSideNavItems';
19
19
  export { default as Switcher } from './Switcher';
20
20
  export { default as SwitcherItem } from './SwitcherItem';
21
21
  export { default as SwitcherDivider } from './SwitcherDivider';
22
- export { default as SkipToContent } from './SkipToContent';
23
- export { default as SideNav } from './SideNav';
22
+ export { default as SkipToContent, type SkipToContentProps, } from './SkipToContent';
23
+ export { default as SideNav, type SideNavProps } from './SideNav';
24
24
  export { default as SideNavDetails } from './SideNavDetails';
25
25
  export { default as SideNavDivider } from './SideNavDivider';
26
26
  export { default as SideNavFooter } from './SideNavFooter';
package/lib/index.js CHANGED
@@ -54,6 +54,7 @@ var Grid = require('./components/Grid/Grid.js');
54
54
  var Row = require('./components/Grid/Row.js');
55
55
  var Column = require('./components/Grid/Column.js');
56
56
  var ColumnHang = require('./components/Grid/ColumnHang.js');
57
+ var GridContext = require('./components/Grid/GridContext.js');
57
58
  var Icon_Skeleton = require('./components/Icon/Icon.Skeleton.js');
58
59
  var index$6 = require('./components/IdPrefix/index.js');
59
60
  var Link = require('./components/Link/Link.js');
@@ -274,6 +275,7 @@ exports.Grid = Grid.Grid;
274
275
  exports.Row = Row["default"];
275
276
  exports.Column = Column["default"];
276
277
  exports.ColumnHang = ColumnHang.ColumnHang;
278
+ exports.GridSettings = GridContext.GridSettings;
277
279
  exports.IconSkeleton = Icon_Skeleton["default"];
278
280
  exports.IdPrefix = index$6.IdPrefix;
279
281
  exports.Link = Link["default"];
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@carbon/react",
3
3
  "description": "React components for the Carbon Design System",
4
- "version": "1.38.0",
4
+ "version": "1.39.0-rc.0",
5
5
  "license": "Apache-2.0",
6
6
  "main": "lib/index.js",
7
7
  "module": "es/index.js",
@@ -47,9 +47,9 @@
47
47
  "dependencies": {
48
48
  "@babel/runtime": "^7.18.3",
49
49
  "@carbon/feature-flags": "^0.16.0",
50
- "@carbon/icons-react": "^11.27.0",
50
+ "@carbon/icons-react": "^11.28.0-rc.0",
51
51
  "@carbon/layout": "^11.19.0",
52
- "@carbon/styles": "^1.38.0",
52
+ "@carbon/styles": "^1.39.0-rc.0",
53
53
  "@carbon/telemetry": "0.1.0",
54
54
  "classnames": "2.3.2",
55
55
  "copy-to-clipboard": "^3.3.1",
@@ -117,7 +117,6 @@
117
117
  "rimraf": "^5.0.0",
118
118
  "rollup": "^2.79.1",
119
119
  "rollup-plugin-strip-banner": "^3.0.0",
120
- "rtlcss": "^4.0.0",
121
120
  "sass": "^1.51.0",
122
121
  "sass-loader": "^13.0.0",
123
122
  "storybook": "^7.1.0",
@@ -139,5 +138,5 @@
139
138
  "**/*.scss",
140
139
  "**/*.css"
141
140
  ],
142
- "gitHead": "33f414ff39064f1c432898ab8204b89b7b02cfb4"
141
+ "gitHead": "39b377be9e59d22de4a45c874227a6e2fe578557"
143
142
  }