@carbon/react 1.59.0 → 1.60.1

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 (115) hide show
  1. package/.playwright/INTERNAL_AVT_REPORT_DO_NOT_USE.json +813 -813
  2. package/es/_virtual/_rollupPluginBabelHelpers.js +23 -34
  3. package/es/components/Button/ButtonBase.d.ts +1 -1
  4. package/es/components/CheckboxGroup/CheckboxGroup.d.ts +27 -0
  5. package/es/components/CheckboxGroup/CheckboxGroup.js +5 -5
  6. package/es/components/ComboBox/ComboBox.d.ts +6 -0
  7. package/es/components/ComboBox/ComboBox.js +36 -3
  8. package/es/components/ComboButton/index.d.ts +1 -1
  9. package/es/components/ComposedModal/ModalHeader.js +0 -1
  10. package/es/components/DataTable/DataTable.d.ts +3 -0
  11. package/es/components/DataTable/DataTable.js +4 -1
  12. package/es/components/DataTable/TableSelectAll.d.ts +14 -3
  13. package/es/components/DataTable/TableSelectAll.js +10 -3
  14. package/es/components/DataTable/TableSelectRow.d.ts +16 -4
  15. package/es/components/DataTable/TableSelectRow.js +11 -4
  16. package/es/components/DatePicker/DatePicker.d.ts +1 -1
  17. package/es/components/DatePicker/DatePicker.js +0 -1
  18. package/es/components/DatePicker/index.d.ts +2 -2
  19. package/es/components/DatePickerInput/DatePickerInput.d.ts +1 -1
  20. package/es/components/DatePickerInput/index.d.ts +2 -2
  21. package/es/components/FileUploader/FileUploaderItem.js +7 -4
  22. package/es/components/Heading/index.d.ts +1 -1
  23. package/es/components/Link/Link.d.ts +1 -1
  24. package/es/components/ListBox/ListBoxMenu.js +0 -1
  25. package/es/components/Menu/Menu.d.ts +2 -1
  26. package/es/components/Menu/Menu.js +18 -12
  27. package/es/components/MenuButton/index.d.ts +2 -1
  28. package/es/components/MenuButton/index.js +50 -29
  29. package/es/components/MultiSelect/FilterableMultiSelect.js +3 -5
  30. package/es/components/MultiSelect/MultiSelect.js +0 -1
  31. package/es/components/NumberInput/NumberInput.js +1 -0
  32. package/es/components/Pagination/Pagination.js +2 -0
  33. package/es/components/PaginationNav/PaginationNav.js +2 -0
  34. package/es/components/Popover/index.js +0 -1
  35. package/es/components/PrimaryButton/PrimaryButton.d.ts +1 -1
  36. package/es/components/RadioButton/RadioButton.d.ts +2 -2
  37. package/es/components/RadioButton/index.d.ts +2 -1
  38. package/es/components/RadioButtonGroup/RadioButtonGroup.d.ts +4 -3
  39. package/es/components/RadioButtonGroup/RadioButtonGroup.js +8 -10
  40. package/es/components/RadioButtonGroup/index.d.ts +2 -1
  41. package/es/components/SecondaryButton/SecondaryButton.d.ts +1 -1
  42. package/es/components/Tabs/Tabs.js +7 -4
  43. package/es/components/Tag/DismissibleTag.d.ts +1 -1
  44. package/es/components/Tag/OperationalTag.d.ts +1 -1
  45. package/es/components/Tag/SelectableTag.d.ts +1 -1
  46. package/es/components/Tag/Tag.d.ts +1 -1
  47. package/es/components/Text/index.d.ts +2 -2
  48. package/es/components/TextArea/TextArea.js +1 -0
  49. package/es/components/Toggletip/index.d.ts +1 -1
  50. package/es/components/Tooltip/DefinitionTooltip.js +22 -1
  51. package/es/components/UIShell/Content.d.ts +4 -7
  52. package/es/components/UIShell/Link.d.ts +1 -1
  53. package/es/components/UIShell/Link.js +1 -0
  54. package/es/components/UIShell/SideNav.js +1 -0
  55. package/es/components/UIShell/SwitcherItem.d.ts +1 -1
  56. package/es/index.js +1 -1
  57. package/es/internal/Selection.js +20 -17
  58. package/es/internal/useId.js +1 -1
  59. package/lib/_virtual/_rollupPluginBabelHelpers.js +23 -34
  60. package/lib/components/Button/ButtonBase.d.ts +1 -1
  61. package/lib/components/CheckboxGroup/CheckboxGroup.d.ts +27 -0
  62. package/lib/components/CheckboxGroup/CheckboxGroup.js +5 -5
  63. package/lib/components/ComboBox/ComboBox.d.ts +6 -0
  64. package/lib/components/ComboBox/ComboBox.js +35 -2
  65. package/lib/components/ComboButton/index.d.ts +1 -1
  66. package/lib/components/ComposedModal/ModalHeader.js +0 -1
  67. package/lib/components/DataTable/DataTable.d.ts +3 -0
  68. package/lib/components/DataTable/DataTable.js +4 -1
  69. package/lib/components/DataTable/TableSelectAll.d.ts +14 -3
  70. package/lib/components/DataTable/TableSelectAll.js +10 -3
  71. package/lib/components/DataTable/TableSelectRow.d.ts +16 -4
  72. package/lib/components/DataTable/TableSelectRow.js +11 -4
  73. package/lib/components/DatePicker/DatePicker.d.ts +1 -1
  74. package/lib/components/DatePicker/DatePicker.js +0 -1
  75. package/lib/components/DatePicker/index.d.ts +2 -2
  76. package/lib/components/DatePickerInput/DatePickerInput.d.ts +1 -1
  77. package/lib/components/DatePickerInput/index.d.ts +2 -2
  78. package/lib/components/FileUploader/FileUploaderItem.js +7 -4
  79. package/lib/components/Heading/index.d.ts +1 -1
  80. package/lib/components/Link/Link.d.ts +1 -1
  81. package/lib/components/ListBox/ListBoxMenu.js +0 -1
  82. package/lib/components/Menu/Menu.d.ts +2 -1
  83. package/lib/components/Menu/Menu.js +18 -12
  84. package/lib/components/MenuButton/index.d.ts +2 -1
  85. package/lib/components/MenuButton/index.js +46 -25
  86. package/lib/components/MultiSelect/FilterableMultiSelect.js +3 -5
  87. package/lib/components/MultiSelect/MultiSelect.js +0 -1
  88. package/lib/components/NumberInput/NumberInput.js +1 -0
  89. package/lib/components/Pagination/Pagination.js +2 -0
  90. package/lib/components/PaginationNav/PaginationNav.js +2 -0
  91. package/lib/components/Popover/index.js +0 -1
  92. package/lib/components/PrimaryButton/PrimaryButton.d.ts +1 -1
  93. package/lib/components/RadioButton/RadioButton.d.ts +2 -2
  94. package/lib/components/RadioButton/index.d.ts +2 -1
  95. package/lib/components/RadioButtonGroup/RadioButtonGroup.d.ts +4 -3
  96. package/lib/components/RadioButtonGroup/RadioButtonGroup.js +8 -10
  97. package/lib/components/RadioButtonGroup/index.d.ts +2 -1
  98. package/lib/components/SecondaryButton/SecondaryButton.d.ts +1 -1
  99. package/lib/components/Tabs/Tabs.js +7 -4
  100. package/lib/components/Tag/DismissibleTag.d.ts +1 -1
  101. package/lib/components/Tag/OperationalTag.d.ts +1 -1
  102. package/lib/components/Tag/SelectableTag.d.ts +1 -1
  103. package/lib/components/Tag/Tag.d.ts +1 -1
  104. package/lib/components/Text/index.d.ts +2 -2
  105. package/lib/components/TextArea/TextArea.js +1 -0
  106. package/lib/components/Toggletip/index.d.ts +1 -1
  107. package/lib/components/Tooltip/DefinitionTooltip.js +22 -1
  108. package/lib/components/UIShell/Content.d.ts +4 -7
  109. package/lib/components/UIShell/Link.d.ts +1 -1
  110. package/lib/components/UIShell/Link.js +1 -0
  111. package/lib/components/UIShell/SideNav.js +1 -0
  112. package/lib/components/UIShell/SwitcherItem.d.ts +1 -1
  113. package/lib/index.js +2 -2
  114. package/lib/internal/Selection.js +19 -16
  115. package/package.json +10 -9
@@ -22,6 +22,7 @@ import { Tab, Escape } from '../../internal/keyboard/keys.js';
22
22
 
23
23
  // TO-DO: comment back in when footer is added for rails
24
24
  // import SideNavFooter from './SideNavFooter';
25
+
25
26
  const SideNavContext = /*#__PURE__*/createContext({});
26
27
  function SideNavRenderFunction(_ref, ref) {
27
28
  let {
@@ -57,5 +57,5 @@ interface SwitcherItemWithAriaLabelledBy extends BaseSwitcherItemProps {
57
57
  'aria-labelledby': string;
58
58
  }
59
59
  type SwitcherItemProps = SwitcherItemWithAriaLabel | SwitcherItemWithAriaLabelledBy;
60
- declare const SwitcherItem: React.ForwardRefExoticComponent<SwitcherItemProps & React.RefAttributes<React.ElementType<any>>>;
60
+ declare const SwitcherItem: React.ForwardRefExoticComponent<SwitcherItemProps & React.RefAttributes<React.ElementType<any, keyof React.JSX.IntrinsicElements>>>;
61
61
  export default SwitcherItem;
package/es/index.js CHANGED
@@ -181,7 +181,6 @@ export { default as unstable__FluidTextInput } from './components/FluidTextInput
181
181
  export { default as unstable__FluidTextInputSkeleton } from './components/FluidTextInput/FluidTextInput.Skeleton.js';
182
182
  export { default as unstable_PageSelector } from './components/Pagination/experimental/PageSelector.js';
183
183
  export { default as unstable_Pagination } from './components/Pagination/experimental/Pagination.js';
184
- export { default as CheckboxGroup } from './components/CheckboxGroup/CheckboxGroup.js';
185
184
  export { default as ContainedListItem } from './components/ContainedList/ContainedListItem/ContainedListItem.js';
186
185
  export { default as ContainedList } from './components/ContainedList/ContainedList.js';
187
186
  export { default as useContextMenu } from './components/ContextMenu/useContextMenu.js';
@@ -208,6 +207,7 @@ export { default as unstable__ChatButton } from './components/ChatButton/ChatBut
208
207
  export { default as unstable__ChatButtonSkeleton } from './components/ChatButton/ChatButton.Skeleton.js';
209
208
  export { Text as unstable_Text } from './components/Text/Text.js';
210
209
  export { TextDirection as unstable_TextDirection } from './components/Text/TextDirection.js';
210
+ export { default as CheckboxGroup } from './components/CheckboxGroup/CheckboxGroup.js';
211
211
  export { default as DataTable } from './components/DataTable/DataTable.js';
212
212
  export { Table } from './components/DataTable/Table.js';
213
213
  export { default as TableActionList } from './components/DataTable/TableActionList.js';
@@ -6,7 +6,7 @@
6
6
  */
7
7
 
8
8
  import { defineProperty as _defineProperty } from '../_virtual/_rollupPluginBabelHelpers.js';
9
- import React__default, { useRef, useState, useEffect, useCallback } from 'react';
9
+ import React__default, { useRef, useState, useCallback, useEffect } from 'react';
10
10
  import PropTypes from 'prop-types';
11
11
  import isEqual from 'lodash.isequal';
12
12
 
@@ -39,19 +39,7 @@ function useSelection(_ref2) {
39
39
  const savedOnChange = useRef(onChange);
40
40
  const [uncontrolledItems, setUncontrolledItems] = useState(initialSelectedItems);
41
41
  const isControlled = !!controlledItems;
42
- const [selectedItems, setSelectedItems] = useState(isControlled ? controlledItems : uncontrolledItems);
43
- useEffect(() => {
44
- setSelectedItems(isControlled ? controlledItems : uncontrolledItems);
45
- }, [isControlled, controlledItems, uncontrolledItems]);
46
- useEffect(() => {
47
- callOnChangeHandler({
48
- isControlled,
49
- isMounted: isMounted.current,
50
- onChangeHandlerControlled: savedOnChange.current,
51
- onChangeHandlerUncontrolled: setUncontrolledItems,
52
- selectedItems: selectedItems
53
- });
54
- }, [isControlled, isMounted, selectedItems]);
42
+ const selectedItems = isControlled ? controlledItems : uncontrolledItems;
55
43
  const onItemChange = useCallback(item => {
56
44
  if (disabled) {
57
45
  return;
@@ -62,12 +50,27 @@ function useSelection(_ref2) {
62
50
  selectedIndex = index;
63
51
  }
64
52
  });
53
+ let newSelectedItems;
65
54
  if (selectedIndex === undefined) {
66
- setSelectedItems(selectedItems => selectedItems.concat(item));
55
+ newSelectedItems = selectedItems.concat(item);
56
+ callOnChangeHandler({
57
+ isControlled,
58
+ isMounted: isMounted.current,
59
+ onChangeHandlerControlled: savedOnChange.current,
60
+ onChangeHandlerUncontrolled: setUncontrolledItems,
61
+ selectedItems: newSelectedItems
62
+ });
67
63
  return;
68
64
  }
69
- setSelectedItems(selectedItems => removeAtIndex(selectedItems, selectedIndex));
70
- }, [disabled, selectedItems]);
65
+ newSelectedItems = removeAtIndex(selectedItems, selectedIndex);
66
+ callOnChangeHandler({
67
+ isControlled,
68
+ isMounted: isMounted.current,
69
+ onChangeHandlerControlled: savedOnChange.current,
70
+ onChangeHandlerUncontrolled: setUncontrolledItems,
71
+ selectedItems: newSelectedItems
72
+ });
73
+ }, [disabled, isControlled, selectedItems]);
71
74
  const clearSelection = useCallback(() => {
72
75
  if (disabled) {
73
76
  return;
@@ -5,7 +5,7 @@
5
5
  * LICENSE file in the root directory of this source tree.
6
6
  */
7
7
 
8
- import React__default, { useLayoutEffect, useEffect, useState } from 'react';
8
+ import React__default, { useState, useEffect, useLayoutEffect } from 'react';
9
9
  import setupGetInstanceId from '../tools/setupGetInstanceId.js';
10
10
  import { canUseDOM } from './environment.js';
11
11
  import { useIdPrefix } from './useIdPrefix.js';
@@ -9,47 +9,36 @@
9
9
 
10
10
  Object.defineProperty(exports, '__esModule', { value: true });
11
11
 
12
- function _defineProperty(obj, key, value) {
13
- key = _toPropertyKey(key);
14
- if (key in obj) {
15
- Object.defineProperty(obj, key, {
16
- value: value,
17
- enumerable: true,
18
- configurable: true,
19
- writable: true
20
- });
21
- } else {
22
- obj[key] = value;
23
- }
24
- return obj;
12
+ function _defineProperty(e, r, t) {
13
+ return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
14
+ value: t,
15
+ enumerable: !0,
16
+ configurable: !0,
17
+ writable: !0
18
+ }) : e[r] = t, e;
25
19
  }
26
20
  function _extends() {
27
- _extends = Object.assign ? Object.assign.bind() : function (target) {
28
- for (var i = 1; i < arguments.length; i++) {
29
- var source = arguments[i];
30
- for (var key in source) {
31
- if (Object.prototype.hasOwnProperty.call(source, key)) {
32
- target[key] = source[key];
33
- }
34
- }
21
+ return _extends = Object.assign ? Object.assign.bind() : function (n) {
22
+ for (var e = 1; e < arguments.length; e++) {
23
+ var t = arguments[e];
24
+ for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
35
25
  }
36
- return target;
37
- };
38
- return _extends.apply(this, arguments);
26
+ return n;
27
+ }, _extends.apply(null, arguments);
39
28
  }
40
- function _toPrimitive(input, hint) {
41
- if (typeof input !== "object" || input === null) return input;
42
- var prim = input[Symbol.toPrimitive];
43
- if (prim !== undefined) {
44
- var res = prim.call(input, hint || "default");
45
- if (typeof res !== "object") return res;
29
+ function _toPrimitive(t, r) {
30
+ if ("object" != typeof t || !t) return t;
31
+ var e = t[Symbol.toPrimitive];
32
+ if (void 0 !== e) {
33
+ var i = e.call(t, r || "default");
34
+ if ("object" != typeof i) return i;
46
35
  throw new TypeError("@@toPrimitive must return a primitive value.");
47
36
  }
48
- return (hint === "string" ? String : Number)(input);
37
+ return ("string" === r ? String : Number)(t);
49
38
  }
50
- function _toPropertyKey(arg) {
51
- var key = _toPrimitive(arg, "string");
52
- return typeof key === "symbol" ? key : String(key);
39
+ function _toPropertyKey(t) {
40
+ var i = _toPrimitive(t, "string");
41
+ return "symbol" == typeof i ? i : i + "";
53
42
  }
54
43
 
55
44
  exports.defineProperty = _defineProperty;
@@ -6,5 +6,5 @@
6
6
  */
7
7
  import React from 'react';
8
8
  import { ButtonProps } from './Button';
9
- declare const ButtonBase: React.ForwardRefExoticComponent<Omit<ButtonProps<React.ElementType<any>>, "ref"> & React.RefAttributes<unknown>>;
9
+ declare const ButtonBase: React.ForwardRefExoticComponent<Omit<ButtonProps<React.ElementType<any, keyof React.JSX.IntrinsicElements>>, "ref"> & React.RefAttributes<unknown>>;
10
10
  export default ButtonBase;
@@ -0,0 +1,27 @@
1
+ /**
2
+ * Copyright IBM Corp. 2016, 2023
3
+ *
4
+ * This source code is licensed under the Apache-2.0 license found in the
5
+ * LICENSE file in the root directory of this source tree.
6
+ */
7
+ import React, { ReactNode } from 'react';
8
+ export interface CheckboxGroupProps {
9
+ children?: ReactNode;
10
+ className?: string;
11
+ helperText?: ReactNode;
12
+ invalid?: boolean;
13
+ invalidText?: ReactNode;
14
+ legendId?: ReactNode;
15
+ orientation?: 'horizontal' | 'vertical';
16
+ legendText: ReactNode;
17
+ readOnly?: boolean;
18
+ slug?: ReactNode;
19
+ warn?: boolean;
20
+ warnText?: ReactNode;
21
+ }
22
+ export interface CustomType {
23
+ size: string;
24
+ kind: string;
25
+ }
26
+ declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
27
+ export default CheckboxGroup;
@@ -24,7 +24,7 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
24
24
  var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
25
25
 
26
26
  const getInstanceId = setupGetInstanceId["default"]();
27
- function CheckboxGroup(_ref) {
27
+ const CheckboxGroup = _ref => {
28
28
  let {
29
29
  children,
30
30
  className,
@@ -59,7 +59,7 @@ function CheckboxGroup(_ref) {
59
59
 
60
60
  // Slug is always size `mini`
61
61
  let normalizedSlug;
62
- if (slug && slug['type']?.displayName === 'Slug') {
62
+ if ( /*#__PURE__*/React__default["default"].isValidElement(slug) && slug['type']?.displayName === 'Slug') {
63
63
  normalizedSlug = /*#__PURE__*/React__default["default"].cloneElement(slug, {
64
64
  size: 'mini',
65
65
  kind: 'default'
@@ -70,7 +70,6 @@ function CheckboxGroup(_ref) {
70
70
  "data-invalid": invalid ? true : undefined,
71
71
  "aria-labelledby": rest['aria-labelledby'] || legendId,
72
72
  "aria-readonly": readOnly,
73
- orientation: "vertical",
74
73
  "aria-describedby": !invalid && !warn && helper ? helperId : undefined
75
74
  }, rest), /*#__PURE__*/React__default["default"].createElement("legend", {
76
75
  className: `${prefix}--label`,
@@ -86,7 +85,7 @@ function CheckboxGroup(_ref) {
86
85
  }), /*#__PURE__*/React__default["default"].createElement("div", {
87
86
  className: `${prefix}--form-requirement`
88
87
  }, warnText))), showHelper && helper);
89
- }
88
+ };
90
89
  CheckboxGroup.propTypes = {
91
90
  /**
92
91
  * Provide the children form elements to be rendered inside of the <fieldset>
@@ -138,5 +137,6 @@ CheckboxGroup.propTypes = {
138
137
  */
139
138
  warnText: PropTypes__default["default"].node
140
139
  };
140
+ var CheckboxGroup$1 = CheckboxGroup;
141
141
 
142
- exports["default"] = CheckboxGroup;
142
+ exports["default"] = CheckboxGroup$1;
@@ -29,6 +29,12 @@ export interface ComboBoxProps<ItemType> extends Omit<InputHTMLAttributes<HTMLIn
29
29
  * 'aria-label' of the ListBox component.
30
30
  */
31
31
  ariaLabel?: string;
32
+ /**
33
+ * **Experimental**: Will attempt to automatically align the floating
34
+ * element to avoid collisions with the viewport and being clipped by
35
+ * ancestor elements.
36
+ */
37
+ autoAlign?: boolean;
32
38
  /**
33
39
  * An optional className to add to the container node
34
40
  */
@@ -23,6 +23,7 @@ var deprecate = require('../../prop-types/deprecate.js');
23
23
  var usePrefix = require('../../internal/usePrefix.js');
24
24
  require('../FluidForm/FluidForm.js');
25
25
  var FormContext = require('../FluidForm/FormContext.js');
26
+ var react = require('@floating-ui/react');
26
27
  var Text = require('../Text/Text.js');
27
28
  var match = require('../../internal/keyboard/match.js');
28
29
  var ListBoxSelection = require('../ListBox/next/ListBoxSelection.js');
@@ -96,6 +97,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
96
97
  const {
97
98
  ['aria-label']: ariaLabel = 'Choose an item',
98
99
  ariaLabel: deprecatedAriaLabel,
100
+ autoAlign = false,
99
101
  className: containerClassName,
100
102
  direction = 'bottom',
101
103
  disabled = false,
@@ -125,6 +127,28 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
125
127
  slug,
126
128
  ...rest
127
129
  } = props;
130
+ const {
131
+ refs,
132
+ floatingStyles
133
+ } = react.useFloating(autoAlign ? {
134
+ placement: direction,
135
+ strategy: 'fixed',
136
+ middleware: [react.flip()],
137
+ whileElementsMounted: react.autoUpdate
138
+ } : {});
139
+ const parentWidth = refs?.reference?.current?.clientWidth;
140
+ React.useEffect(() => {
141
+ if (autoAlign) {
142
+ Object.keys(floatingStyles).forEach(style => {
143
+ if (refs.floating.current) {
144
+ refs.floating.current.style[style] = floatingStyles[style];
145
+ }
146
+ });
147
+ if (parentWidth && refs.floating.current) {
148
+ refs.floating.current.style.width = parentWidth + 'px';
149
+ }
150
+ }
151
+ }, [autoAlign, floatingStyles, refs.floating, parentWidth]);
128
152
  const prefix = usePrefix.usePrefix();
129
153
  const {
130
154
  isFluid
@@ -379,6 +403,7 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
379
403
  light: light,
380
404
  size: size,
381
405
  warn: warn,
406
+ ref: refs.setReference,
382
407
  warnText: warnText,
383
408
  warnTextId: warnTextId
384
409
  }, /*#__PURE__*/React__default["default"].createElement("div", {
@@ -389,9 +414,9 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
389
414
  type: "text",
390
415
  tabIndex: 0,
391
416
  "aria-haspopup": "listbox",
392
- "aria-owns": getMenuProps().id,
393
417
  title: textInput?.current?.value
394
418
  }, getInputProps({
419
+ 'aria-controls': isOpen ? undefined : getMenuProps().id,
395
420
  placeholder,
396
421
  ref: {
397
422
  ...mergeRefs["default"](textInput, ref)
@@ -453,8 +478,10 @@ const ComboBox = /*#__PURE__*/React.forwardRef((props, ref) => {
453
478
  // @ts-expect-error
454
479
  isOpen: isOpen,
455
480
  translateWithId: translateWithId
456
- }))), normalizedSlug, /*#__PURE__*/React__default["default"].createElement(index["default"].Menu, getMenuProps({
481
+ }))), normalizedSlug, /*#__PURE__*/React__default["default"].createElement(index["default"].Menu, _rollupPluginBabelHelpers["extends"]({}, getMenuProps({
457
482
  'aria-label': deprecatedAriaLabel || ariaLabel
483
+ }), {
484
+ ref: mergeRefs["default"](getMenuProps().ref, refs.setFloating)
458
485
  }), isOpen ? filterItems(items, itemToString, inputValue).map((item, index$1) => {
459
486
  const isObject = item !== null && typeof item === 'object';
460
487
  const title = isObject && 'text' in item && itemToElement ? item.text?.toString() : itemToString(item);
@@ -508,6 +535,12 @@ ComboBox.propTypes = {
508
535
  * 'aria-label' of the ListBox component.
509
536
  */
510
537
  ariaLabel: deprecate["default"](PropTypes__default["default"].string, 'This prop syntax has been deprecated. Please use the new `aria-label`.'),
538
+ /**
539
+ * **Experimental**: Will attempt to automatically align the floating
540
+ * element to avoid collisions with the viewport and being clipped by
541
+ * ancestor elements.
542
+ */
543
+ autoAlign: PropTypes__default["default"].bool,
511
544
  /**
512
545
  * An optional className to add to the container node
513
546
  */
@@ -8,7 +8,7 @@ import React from 'react';
8
8
  import { IconButton } from '../IconButton';
9
9
  import Button from '../Button';
10
10
  import { Menu } from '../Menu';
11
- export type MenuAlignment = 'top' | 'top-start' | 'top-end' | 'bottom' | 'bottom-start' | 'bottom-end';
11
+ import { MenuAlignment } from '../MenuButton';
12
12
  interface ComboButtonProps {
13
13
  /**
14
14
  * A collection of `MenuItems` to be rendered as additional actions for this `ComboButton`.
@@ -62,7 +62,6 @@ const ModalHeader = /*#__PURE__*/React__default["default"].forwardRef(function M
62
62
  className: closeClass,
63
63
  label: iconDescription,
64
64
  onClick: handleCloseButtonClick,
65
- title: iconDescription,
66
65
  "aria-label": iconDescription,
67
66
  align: "left"
68
67
  }, /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, {
@@ -115,6 +115,7 @@ export interface DataTableRenderProps<RowType, ColTypes extends any[]> {
115
115
  [key: string]: unknown;
116
116
  }) => {
117
117
  ariaLabel: string;
118
+ 'aria-label': string;
118
119
  checked: boolean | undefined;
119
120
  disabled?: boolean | undefined;
120
121
  id: string;
@@ -436,10 +437,12 @@ declare class DataTable<RowType, ColTypes extends any[]> extends React.Component
436
437
  id: string;
437
438
  name: string;
438
439
  ariaLabel: string;
440
+ 'aria-label': string;
439
441
  disabled: boolean | undefined;
440
442
  radio: true | null;
441
443
  } | {
442
444
  ariaLabel: string;
445
+ 'aria-label': string;
443
446
  checked: boolean;
444
447
  id: string;
445
448
  indeterminate: boolean;
@@ -266,6 +266,8 @@ class DataTable extends React__default["default"].Component {
266
266
  id: `${_this.getTablePrefix()}__select-row-${row.id}`,
267
267
  name: `select-row`,
268
268
  ariaLabel: t(translationKey),
269
+ // TODO remove in v12
270
+ 'aria-label': t(translationKey),
269
271
  disabled: row.disabled,
270
272
  radio: _this.props.radio || null
271
273
  };
@@ -281,6 +283,8 @@ class DataTable extends React__default["default"].Component {
281
283
  return {
282
284
  ...rest,
283
285
  ariaLabel: t(translationKey),
286
+ // TODO remove in v12
287
+ 'aria-label': t(translationKey),
284
288
  checked,
285
289
  id: `${_this.getTablePrefix()}__select-all`,
286
290
  indeterminate,
@@ -579,7 +583,6 @@ class DataTable extends React__default["default"].Component {
579
583
  ...getDerivedStateFromProps["default"](_props, {}),
580
584
  isExpandedAll: false // Start with collapsed state, treat `undefined` as neutral state
581
585
  };
582
-
583
586
  this.instanceId = getInstanceId();
584
587
  }
585
588
 
@@ -9,8 +9,14 @@ import React from 'react';
9
9
  interface TableSelectAllProps {
10
10
  /**
11
11
  * Specify the aria label for the underlying input control
12
+ * node
12
13
  */
13
- ariaLabel: string;
14
+ ['aria-label']?: string;
15
+ /**
16
+ * @deprecated please use `aria-label` instead.
17
+ * Specify the aria label for the underlying input control
18
+ */
19
+ ariaLabel?: string;
14
20
  /**
15
21
  * Specify whether all items are selected, or not
16
22
  */
@@ -41,12 +47,17 @@ interface TableSelectAllProps {
41
47
  onSelect: React.MouseEventHandler<HTMLInputElement>;
42
48
  }
43
49
  declare const TableSelectAll: {
44
- ({ ariaLabel, checked, id, indeterminate, name, onSelect, disabled, className, }: TableSelectAllProps): import("react/jsx-runtime").JSX.Element;
50
+ ({ ariaLabel: deprecatedAriaLabel, ["aria-label"]: ariaLabel, checked, id, indeterminate, name, onSelect, disabled, className, }: TableSelectAllProps): import("react/jsx-runtime").JSX.Element;
45
51
  propTypes: {
46
52
  /**
47
53
  * Specify the aria label for the underlying input control
48
54
  */
49
- ariaLabel: PropTypes.Validator<string>;
55
+ "aria-label": PropTypes.Requireable<string>;
56
+ /**
57
+ * Deprecated, please use `aria-label` instead.
58
+ * Specify the aria label for the underlying input control
59
+ */
60
+ ariaLabel: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
50
61
  /**
51
62
  * Specify whether all items are selected, or not
52
63
  */
@@ -14,6 +14,7 @@ var React = require('react');
14
14
  var InlineCheckbox = require('../InlineCheckbox/InlineCheckbox.js');
15
15
  var cx = require('classnames');
16
16
  var usePrefix = require('../../internal/usePrefix.js');
17
+ var deprecate = require('../../prop-types/deprecate.js');
17
18
 
18
19
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
19
20
 
@@ -23,7 +24,8 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
23
24
 
24
25
  const TableSelectAll = _ref => {
25
26
  let {
26
- ariaLabel = 'Select all rows in the table',
27
+ ariaLabel: deprecatedAriaLabel = 'Select all rows in the table',
28
+ ['aria-label']: ariaLabel,
27
29
  checked,
28
30
  id,
29
31
  indeterminate,
@@ -38,7 +40,7 @@ const TableSelectAll = _ref => {
38
40
  scope: "col",
39
41
  className: cx__default["default"](`${prefix}--table-column-checkbox`, className)
40
42
  }, /*#__PURE__*/React__default["default"].createElement(InlineCheckbox["default"], {
41
- "aria-label": ariaLabel,
43
+ "aria-label": ariaLabel || deprecatedAriaLabel,
42
44
  checked: checked,
43
45
  id: id,
44
46
  indeterminate: indeterminate,
@@ -51,7 +53,12 @@ TableSelectAll.propTypes = {
51
53
  /**
52
54
  * Specify the aria label for the underlying input control
53
55
  */
54
- ariaLabel: PropTypes__default["default"].string.isRequired,
56
+ ['aria-label']: PropTypes__default["default"].string,
57
+ /**
58
+ * Deprecated, please use `aria-label` instead.
59
+ * Specify the aria label for the underlying input control
60
+ */
61
+ ariaLabel: deprecate["default"](PropTypes__default["default"].string, 'This prop syntax has been deprecated. Please use the new `aria-label`.'),
55
62
  /**
56
63
  * Specify whether all items are selected, or not
57
64
  */
@@ -8,9 +8,16 @@ import PropTypes from 'prop-types';
8
8
  import React from 'react';
9
9
  export interface TableSelectRowProps {
10
10
  /**
11
- * Specify the aria label for the underlying input control
11
+ * Specify a label to be read by screen readers on the containing textbox
12
+ * node
12
13
  */
13
- ariaLabel: string;
14
+ ['aria-label']?: string;
15
+ /**
16
+ * @deprecated please use `aria-label` instead.
17
+ * Specify a label to be read by screen readers on the containing textbox
18
+ * node
19
+ */
20
+ ariaLabel?: string;
14
21
  /**
15
22
  * Specify whether this row is selected, or not
16
23
  */
@@ -45,12 +52,17 @@ export interface TableSelectRowProps {
45
52
  radio?: boolean;
46
53
  }
47
54
  declare const TableSelectRow: {
48
- ({ ariaLabel, checked, id, name, onSelect, onChange, disabled, radio, className, }: TableSelectRowProps): import("react/jsx-runtime").JSX.Element;
55
+ ({ ariaLabel: deprecatedAriaLabel, ["aria-label"]: ariaLabel, checked, id, name, onSelect, onChange, disabled, radio, className, }: TableSelectRowProps): import("react/jsx-runtime").JSX.Element;
49
56
  propTypes: {
50
57
  /**
51
58
  * Specify the aria label for the underlying input control
52
59
  */
53
- ariaLabel: PropTypes.Validator<string>;
60
+ "aria-label": PropTypes.Requireable<string>;
61
+ /**
62
+ * Deprecated, please use `aria-label` instead.
63
+ * Specify the aria label for the underlying input control
64
+ */
65
+ ariaLabel: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
54
66
  /**
55
67
  * Specify whether this row is selected, or not
56
68
  */
@@ -16,6 +16,7 @@ var cx = require('classnames');
16
16
  var InlineCheckbox = require('../InlineCheckbox/InlineCheckbox.js');
17
17
  var RadioButton = require('../RadioButton/RadioButton.js');
18
18
  var usePrefix = require('../../internal/usePrefix.js');
19
+ var deprecate = require('../../prop-types/deprecate.js');
19
20
 
20
21
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
21
22
 
@@ -25,7 +26,8 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
25
26
 
26
27
  const TableSelectRow = _ref => {
27
28
  let {
28
- ariaLabel,
29
+ ariaLabel: deprecatedAriaLabel,
30
+ ['aria-label']: ariaLabel,
29
31
  checked,
30
32
  id,
31
33
  name,
@@ -55,17 +57,22 @@ const TableSelectRow = _ref => {
55
57
  className: tableSelectRowClasses,
56
58
  "aria-live": "off"
57
59
  }, /*#__PURE__*/React__default["default"].createElement(InlineInputComponent, _rollupPluginBabelHelpers["extends"]({}, selectionInputProps, radio && {
58
- labelText: ariaLabel,
60
+ labelText: ariaLabel || deprecatedAriaLabel,
59
61
  hideLabel: true
60
62
  }, !radio && {
61
- ['aria-label']: ariaLabel
63
+ 'aria-label': ariaLabel || deprecatedAriaLabel
62
64
  })));
63
65
  };
64
66
  TableSelectRow.propTypes = {
65
67
  /**
66
68
  * Specify the aria label for the underlying input control
67
69
  */
68
- ariaLabel: PropTypes__default["default"].string.isRequired,
70
+ ['aria-label']: PropTypes__default["default"].string,
71
+ /**
72
+ * Deprecated, please use `aria-label` instead.
73
+ * Specify the aria label for the underlying input control
74
+ */
75
+ ariaLabel: deprecate["default"](PropTypes__default["default"].string, 'This prop syntax has been deprecated. Please use the new `aria-label`.'),
69
76
  /**
70
77
  * Specify whether this row is selected, or not
71
78
  */
@@ -20,7 +20,7 @@ export type CalRef = {
20
20
  plugins: [];
21
21
  clickOpens: any;
22
22
  };
23
- interface DatePickerProps {
23
+ export interface DatePickerProps {
24
24
  /**
25
25
  * Flatpickr prop passthrough enables direct date input, and when set to false,
26
26
  * we must clear dates manually by resetting the value prop to empty string making it a controlled input.
@@ -717,7 +717,6 @@ DatePicker.propTypes = {
717
717
  // Mandarin Traditional
718
718
  'zh' // Mandarin
719
719
  ])]),
720
-
721
720
  /**
722
721
  * The maximum date that a user can pick to.
723
722
  */
@@ -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 DatePicker from './DatePicker';
7
+ import DatePicker, { type DatePickerProps } from './DatePicker';
8
8
  export { default as DatePickerSkeleton, type DatePickerSkeletonProps, } from './DatePicker.Skeleton';
9
9
  export default DatePicker;
10
- export { DatePicker };
10
+ export { DatePicker, type DatePickerProps };
@@ -10,7 +10,7 @@ import { ReactAttr } from '../../types/common';
10
10
  type ExcludedAttributes = 'value' | 'onChange' | 'locale' | 'children';
11
11
  export type ReactNodeLike = ReactElementLike | ReactNodeArray | string | number | boolean | null | undefined;
12
12
  export type func = (...args: any[]) => any;
13
- interface DatePickerInputProps extends Omit<ReactAttr<HTMLInputElement>, ExcludedAttributes> {
13
+ export interface DatePickerInputProps extends Omit<ReactAttr<HTMLInputElement>, ExcludedAttributes> {
14
14
  /**
15
15
  * The type of the date picker:
16
16
  *
@@ -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 DatePickerInput from './DatePickerInput';
7
+ import DatePickerInput, { type DatePickerInputProps } from './DatePickerInput';
8
8
  export default DatePickerInput;
9
- export { DatePickerInput };
9
+ export { DatePickerInput, type DatePickerInputProps };