@deque/cauldron-react 6.0.0 → 6.1.0-canary.33d6b541

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 (135) hide show
  1. package/lib/__tests__/setupTests.d.ts +2 -0
  2. package/lib/cauldron.css +2 -0
  3. package/lib/index.js +63 -23
  4. package/lib/src/axe.d.ts +3 -0
  5. package/lib/src/components/Button/index.test.d.ts +1 -0
  6. package/lib/src/components/Checkbox/Checkbox.test.d.ts +1 -0
  7. package/lib/{components → src/components}/Combobox/Combobox.d.ts +1 -1
  8. package/lib/src/components/Combobox/Combobox.test.d.ts +1 -0
  9. package/lib/{components → src/components}/IconButton/index.d.ts +1 -0
  10. package/lib/src/components/Tag/index.test.d.ts +1 -0
  11. package/lib/src/components/TextField/TextField.test.d.ts +1 -0
  12. package/lib/{components → src/components}/TextField/index.d.ts +1 -1
  13. package/lib/src/components/Timeline/Timeline.d.ts +6 -0
  14. package/lib/src/components/Timeline/TimelineItem.d.ts +6 -0
  15. package/lib/src/components/Timeline/index.d.ts +2 -0
  16. package/lib/src/components/Timeline/timeline.test.d.ts +1 -0
  17. package/lib/{index.d.ts → src/index.d.ts} +1 -0
  18. package/lib/src/utils/setRef.d.ts +1 -0
  19. package/package.json +12 -21
  20. package/lib/utils/setRef.d.ts +0 -1
  21. /package/lib/{components → src/components}/Accordion/Accordion.d.ts +0 -0
  22. /package/lib/{components → src/components}/Accordion/index.d.ts +0 -0
  23. /package/lib/{components → src/components}/Address/index.d.ts +0 -0
  24. /package/lib/{components → src/components}/Alert/index.d.ts +0 -0
  25. /package/lib/{components → src/components}/Breadcrumb/Breadcrumb.d.ts +0 -0
  26. /package/lib/{components → src/components}/Breadcrumb/BreadcrumbItem.d.ts +0 -0
  27. /package/lib/{components → src/components}/Breadcrumb/BreadcrumbLink.d.ts +0 -0
  28. /package/lib/{components → src/components}/Breadcrumb/index.d.ts +0 -0
  29. /package/lib/{components → src/components}/Button/index.d.ts +0 -0
  30. /package/lib/{components → src/components}/Checkbox/index.d.ts +0 -0
  31. /package/lib/{components → src/components}/ClickOutsideListener/index.d.ts +0 -0
  32. /package/lib/{components → src/components}/Code/index.d.ts +0 -0
  33. /package/lib/{components → src/components}/Combobox/ComboboxContext.d.ts +0 -0
  34. /package/lib/{components → src/components}/Combobox/ComboboxGroup.d.ts +0 -0
  35. /package/lib/{components → src/components}/Combobox/ComboboxOption.d.ts +0 -0
  36. /package/lib/{components → src/components}/Combobox/index.d.ts +0 -0
  37. /package/lib/{components → src/components}/DescriptionList/index.d.ts +0 -0
  38. /package/lib/{components → src/components}/Dialog/index.d.ts +0 -0
  39. /package/lib/{components → src/components}/ExpandCollapsePanel/ExpandCollapsePanel.d.ts +0 -0
  40. /package/lib/{components → src/components}/ExpandCollapsePanel/PanelTrigger.d.ts +0 -0
  41. /package/lib/{components → src/components}/ExpandCollapsePanel/index.d.ts +0 -0
  42. /package/lib/{components → src/components}/FieldWrap/index.d.ts +0 -0
  43. /package/lib/{components → src/components}/Icon/index.d.ts +0 -0
  44. /package/lib/{components → src/components}/Icon/types.d.ts +0 -0
  45. /package/lib/{components → src/components}/Layout/index.d.ts +0 -0
  46. /package/lib/{components → src/components}/Line/index.d.ts +0 -0
  47. /package/lib/{components → src/components}/Link/index.d.ts +0 -0
  48. /package/lib/{components → src/components}/Listbox/Listbox.d.ts +0 -0
  49. /package/lib/{components → src/components}/Listbox/ListboxContext.d.ts +0 -0
  50. /package/lib/{components → src/components}/Listbox/ListboxGroup.d.ts +0 -0
  51. /package/lib/{components → src/components}/Listbox/ListboxOption.d.ts +0 -0
  52. /package/lib/{components → src/components}/Listbox/index.d.ts +0 -0
  53. /package/lib/{components → src/components}/Loader/index.d.ts +0 -0
  54. /package/lib/{components → src/components}/LoaderOverlay/axe-loader.d.ts +0 -0
  55. /package/lib/{components → src/components}/LoaderOverlay/index.d.ts +0 -0
  56. /package/lib/{components → src/components}/Main/index.d.ts +0 -0
  57. /package/lib/{components → src/components}/MenuBar/index.d.ts +0 -0
  58. /package/lib/{components → src/components}/MenuItem/click-link.d.ts +0 -0
  59. /package/lib/{components → src/components}/MenuItem/index.d.ts +0 -0
  60. /package/lib/{components → src/components}/Modal/index.d.ts +0 -0
  61. /package/lib/{components → src/components}/NavBar/NavBar.d.ts +0 -0
  62. /package/lib/{components → src/components}/NavBar/NavItem.d.ts +0 -0
  63. /package/lib/{components → src/components}/NavBar/index.d.ts +0 -0
  64. /package/lib/{components → src/components}/Notice/index.d.ts +0 -0
  65. /package/lib/{components → src/components}/Offscreen/index.d.ts +0 -0
  66. /package/lib/{components → src/components}/OptionsMenu/OptionsMenu.d.ts +0 -0
  67. /package/lib/{components → src/components}/OptionsMenu/OptionsMenuItem.d.ts +0 -0
  68. /package/lib/{components → src/components}/OptionsMenu/OptionsMenuList.d.ts +0 -0
  69. /package/lib/{components → src/components}/OptionsMenu/OptionsMenuTrigger.d.ts +0 -0
  70. /package/lib/{components → src/components}/OptionsMenu/OptionsMenuWrapper.d.ts +0 -0
  71. /package/lib/{components → src/components}/OptionsMenu/index.d.ts +0 -0
  72. /package/lib/{components → src/components}/Pagination/Pagination.d.ts +0 -0
  73. /package/lib/{components → src/components}/Pagination/index.d.ts +0 -0
  74. /package/lib/{components → src/components}/Pagination/usePagination.d.ts +0 -0
  75. /package/lib/{components → src/components}/Panel/Panel.d.ts +0 -0
  76. /package/lib/{components → src/components}/Panel/PanelContent.d.ts +0 -0
  77. /package/lib/{components → src/components}/Panel/PanelHeader.d.ts +0 -0
  78. /package/lib/{components → src/components}/Panel/index.d.ts +0 -0
  79. /package/lib/{components → src/components}/Popover/index.d.ts +0 -0
  80. /package/lib/{components → src/components}/ProgressBar/index.d.ts +0 -0
  81. /package/lib/{components → src/components}/RadioCardGroup/index.d.ts +0 -0
  82. /package/lib/{components → src/components}/RadioGroup/index.d.ts +0 -0
  83. /package/lib/{components → src/components}/Scrim/index.d.ts +0 -0
  84. /package/lib/{components → src/components}/Select/index.d.ts +0 -0
  85. /package/lib/{components → src/components}/SideBar/SideBar.d.ts +0 -0
  86. /package/lib/{components → src/components}/SideBar/SideBarItem.d.ts +0 -0
  87. /package/lib/{components → src/components}/SideBar/index.d.ts +0 -0
  88. /package/lib/{components → src/components}/SkipLink/index.d.ts +0 -0
  89. /package/lib/{components → src/components}/Stepper/index.d.ts +0 -0
  90. /package/lib/{components → src/components}/Table/Table.d.ts +0 -0
  91. /package/lib/{components → src/components}/Table/TableBody.d.ts +0 -0
  92. /package/lib/{components → src/components}/Table/TableCell.d.ts +0 -0
  93. /package/lib/{components → src/components}/Table/TableFooter.d.ts +0 -0
  94. /package/lib/{components → src/components}/Table/TableHead.d.ts +0 -0
  95. /package/lib/{components → src/components}/Table/TableHeader.d.ts +0 -0
  96. /package/lib/{components → src/components}/Table/TableRow.d.ts +0 -0
  97. /package/lib/{components → src/components}/Table/index.d.ts +0 -0
  98. /package/lib/{components → src/components}/Tabs/Tab.d.ts +0 -0
  99. /package/lib/{components → src/components}/Tabs/TabPanel.d.ts +0 -0
  100. /package/lib/{components → src/components}/Tabs/Tabs.d.ts +0 -0
  101. /package/lib/{components → src/components}/Tabs/index.d.ts +0 -0
  102. /package/lib/{components → src/components}/Tag/index.d.ts +0 -0
  103. /package/lib/{components → src/components}/TagButton/index.d.ts +0 -0
  104. /package/lib/{components → src/components}/Toast/index.d.ts +0 -0
  105. /package/lib/{components → src/components}/Toast/utils.d.ts +0 -0
  106. /package/lib/{components → src/components}/Tooltip/index.d.ts +0 -0
  107. /package/lib/{components → src/components}/TooltipTabstop/index.d.ts +0 -0
  108. /package/lib/{components → src/components}/TopBar/TopBar.d.ts +0 -0
  109. /package/lib/{components → src/components}/TopBar/TopBarMenu.d.ts +0 -0
  110. /package/lib/{components → src/components}/TopBar/TopBarTrigger.d.ts +0 -0
  111. /package/lib/{components → src/components}/TopBar/index.d.ts +0 -0
  112. /package/lib/{components → src/components}/TwoColumnPanel/ColumnGroupHeader.d.ts +0 -0
  113. /package/lib/{components → src/components}/TwoColumnPanel/ColumnHeader.d.ts +0 -0
  114. /package/lib/{components → src/components}/TwoColumnPanel/ColumnLeft.d.ts +0 -0
  115. /package/lib/{components → src/components}/TwoColumnPanel/ColumnList.d.ts +0 -0
  116. /package/lib/{components → src/components}/TwoColumnPanel/ColumnRight.d.ts +0 -0
  117. /package/lib/{components → src/components}/TwoColumnPanel/TwoColumnPanel.d.ts +0 -0
  118. /package/lib/{components → src/components}/TwoColumnPanel/index.d.ts +0 -0
  119. /package/lib/{components → src/components}/Workspace/index.d.ts +0 -0
  120. /package/lib/{constants.d.ts → src/constants.d.ts} +0 -0
  121. /package/lib/{contexts → src/contexts}/theme.d.ts +0 -0
  122. /package/lib/{types.d.ts → src/types.d.ts} +0 -0
  123. /package/lib/{utils → src/utils}/aria-isolate/index.d.ts +0 -0
  124. /package/lib/{utils → src/utils}/focusable-selector/index.d.ts +0 -0
  125. /package/lib/{utils → src/utils}/is-browser/index.d.ts +0 -0
  126. /package/lib/{utils → src/utils}/polymorphic-type/index.d.ts +0 -0
  127. /package/lib/{utils → src/utils}/query-all/index.d.ts +0 -0
  128. /package/lib/{utils → src/utils}/remove-ids/index.d.ts +0 -0
  129. /package/lib/{utils → src/utils}/rndid/index.d.ts +0 -0
  130. /package/lib/{utils → src/utils}/stylesheets/index.d.ts +0 -0
  131. /package/lib/{utils → src/utils}/token-list/index.d.ts +0 -0
  132. /package/lib/{utils → src/utils}/use-did-update/index.d.ts +0 -0
  133. /package/lib/{utils → src/utils}/useIntersectionRef.d.ts +0 -0
  134. /package/lib/{utils → src/utils}/useSharedRef.d.ts +0 -0
  135. /package/lib/{utils → src/utils}/viewport/index.d.ts +0 -0
@@ -0,0 +1,2 @@
1
+ import '@testing-library/jest-dom';
2
+ import 'jest-axe/extend-expect';
package/lib/cauldron.css CHANGED
@@ -56,6 +56,8 @@ a.Button--thin {
56
56
 
57
57
  .Icon svg {
58
58
  display: block;
59
+ height: var(--icon-size);
60
+ width: var(--icon-size);
59
61
  }
60
62
 
61
63
  /* Icon--down is the default orientation */
package/lib/index.js CHANGED
@@ -1345,7 +1345,8 @@ SideBarItem.defaultProps = {
1345
1345
  */
1346
1346
  var AriaIsolate = /** @class */ (function () {
1347
1347
  function AriaIsolate(el) {
1348
- if (!(el instanceof HTMLElement)) {
1348
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-constructor
1349
+ if (typeof HTMLElement === 'undefined' || !(el instanceof HTMLElement)) {
1349
1350
  throw new Error('AriaIsolate must be instantiated with a valid HTML element');
1350
1351
  }
1351
1352
  this.element = el;
@@ -1735,7 +1736,9 @@ function Tooltip(_a) {
1735
1736
  }), ref: setTooltipElement, role: "tooltip", style: styles.popper }, attributes.popper, props),
1736
1737
  variant !== 'big' && (React__default["default"].createElement("div", { className: "TooltipArrow", ref: setArrowElement, style: styles.arrow })),
1737
1738
  children), (portal && 'current' in portal ? portal.current : portal) ||
1738
- document.body)
1739
+ (
1740
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
1741
+ document === null || document === void 0 ? void 0 : document.body))
1739
1742
  : null));
1740
1743
  }
1741
1744
  Tooltip.displayName = 'Tooltip';
@@ -1756,7 +1759,7 @@ var TooltipContent = function (_a) {
1756
1759
  */
1757
1760
  // eslint-disable-next-line react/display-name
1758
1761
  var IconButton = React.forwardRef(function (_a, ref) {
1759
- var _b = _a.as, Component = _b === void 0 ? 'button' : _b, icon = _a.icon, label = _a.label, _c = _a.tooltipPlacement, tooltipPlacement = _c === void 0 ? 'auto' : _c, tooltipVariant = _a.tooltipVariant, tooltipPortal = _a.tooltipPortal, className = _a.className, _d = _a.variant, variant = _d === void 0 ? 'secondary' : _d, disabled = _a.disabled, _e = _a.tabIndex, tabIndex = _e === void 0 ? 0 : _e, other = tslib.__rest(_a, ["as", "icon", "label", "tooltipPlacement", "tooltipVariant", "tooltipPortal", "className", "variant", "disabled", "tabIndex"]);
1762
+ var _b = _a.as, Component = _b === void 0 ? 'button' : _b, icon = _a.icon, label = _a.label, _c = _a.tooltipPlacement, tooltipPlacement = _c === void 0 ? 'auto' : _c, tooltipVariant = _a.tooltipVariant, tooltipPortal = _a.tooltipPortal, className = _a.className, _d = _a.variant, variant = _d === void 0 ? 'secondary' : _d, disabled = _a.disabled, _e = _a.tabIndex, tabIndex = _e === void 0 ? 0 : _e, large = _a.large, other = tslib.__rest(_a, ["as", "icon", "label", "tooltipPlacement", "tooltipVariant", "tooltipPortal", "className", "variant", "disabled", "tabIndex", "large"]);
1760
1763
  var internalRef = React.useRef();
1761
1764
  React.useImperativeHandle(ref, function () { return internalRef.current; });
1762
1765
  // Configure additional properties based on the type of the Component
@@ -1779,7 +1782,8 @@ var IconButton = React.forwardRef(function (_a, ref) {
1779
1782
  IconButton: true,
1780
1783
  'IconButton--primary': variant === 'primary',
1781
1784
  'IconButton--secondary': variant === 'secondary',
1782
- 'IconButton--error': variant === 'error'
1785
+ 'IconButton--error': variant === 'error',
1786
+ 'IconButton--large': large
1783
1787
  }), ref: internalRef, disabled: disabled, tabIndex: disabled ? -1 : tabIndex }, accessibilityProps, other),
1784
1788
  React__default["default"].createElement(Icon, { type: icon }),
1785
1789
  disabled && React__default["default"].createElement(Offscreen, null, label)),
@@ -2338,7 +2342,7 @@ var TextField = /** @class */ (function (_super) {
2338
2342
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
2339
2343
  _a.onChange;
2340
2344
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
2341
- _a.defaultValue; var _b = _a.error, error = _b === void 0 ? null : _b, requiredText = _a.requiredText, multiline = _a.multiline, ariaDescribedby = _a["aria-describedby"], other = tslib.__rest(_a, ["label", "fieldRef", "value", "onChange", "defaultValue", "error", "requiredText", "multiline", 'aria-describedby']);
2345
+ _a.defaultValue; var _b = _a.error, error = _b === void 0 ? null : _b, requiredText = _a.requiredText, multiline = _a.multiline, ariaDescribedby = _a["aria-describedby"], className = _a.className, other = tslib.__rest(_a, ["label", "fieldRef", "value", "onChange", "defaultValue", "error", "requiredText", "multiline", 'aria-describedby', "className"]);
2342
2346
  // typescript can't infer the type so it's complaining about
2343
2347
  // textarea and input props being incompatible
2344
2348
  // we should probably fix this
@@ -2355,7 +2359,7 @@ var TextField = /** @class */ (function (_super) {
2355
2359
  }), htmlFor: this.inputId },
2356
2360
  React__default["default"].createElement("span", null, label),
2357
2361
  isRequired && (React__default["default"].createElement("span", { className: "Field__required-text" }, requiredText))),
2358
- React__default["default"].createElement(Field, tslib.__assign({ className: classNames__default["default"]({
2362
+ React__default["default"].createElement(Field, tslib.__assign({ className: classNames__default["default"](className, {
2359
2363
  'Field__text-input': !multiline,
2360
2364
  Field__textarea: multiline,
2361
2365
  'Field--has-error': error
@@ -2368,7 +2372,7 @@ var TextField = /** @class */ (function (_super) {
2368
2372
  TextField.prototype.onChange = function (e) {
2369
2373
  var _a, _b;
2370
2374
  if (this.props.onChange) {
2371
- this.props.onChange(((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) || '', e);
2375
+ this.props.onChange(((_a = this.input) === null || _a === void 0 ? void 0 : _a.value) || /* istanbul ignore next: default value */ '', e);
2372
2376
  }
2373
2377
  if (typeof this.props.value !== 'undefined') {
2374
2378
  return;
@@ -2751,7 +2755,7 @@ var Step = function (props) {
2751
2755
  liProps = other;
2752
2756
  }
2753
2757
  return (React__default["default"].createElement("li", tslib.__assign({ className: classNames__default["default"]('Stepper__step', "Stepper__step--".concat(status), className), "aria-current": status === 'current' ? 'step' : 'false' }, liProps),
2754
- React__default["default"].createElement("div", { className: "Stepper__step-line" }),
2758
+ React__default["default"].createElement("div", { className: classNames__default["default"]('Stepper__step-line', "Stepper__step--".concat(status, "-line")) }),
2755
2759
  React__default["default"].createElement("div", { className: "Stepper__step-content" }, isTooltip ? (React__default["default"].createElement(TooltipTabstop, { placement: "bottom", tooltip: tooltip,
2756
2760
  // the pseudo content (ex: "1") is conveyed
2757
2761
  // by the list item's position in the set of
@@ -2759,9 +2763,9 @@ var Step = function (props) {
2759
2763
  // it with the contents of the tooltip in the
2760
2764
  // tab stop's accessible name.
2761
2765
  association: "aria-labelledby", "aria-label": tooltipText },
2762
- React__default["default"].createElement("div", { className: "Stepper__step-indicator" }))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
2763
- React__default["default"].createElement("div", { className: "Stepper__step-indicator" }),
2764
- children ? (React__default["default"].createElement("div", { className: "Stepper__step-label" }, children)) : null)))));
2766
+ React__default["default"].createElement("div", { className: classNames__default["default"]('Stepper__step-indicator', "Stepper__step--".concat(status, "-indicator")) }, status === 'complete' && React__default["default"].createElement(Icon, { type: 'check' })))) : (React__default["default"].createElement(React__default["default"].Fragment, null,
2767
+ React__default["default"].createElement("div", { className: classNames__default["default"]('Stepper__step-indicator', "Stepper__step--".concat(status, "-indicator")) }, status === 'complete' && React__default["default"].createElement(Icon, { type: 'check' })),
2768
+ children ? (React__default["default"].createElement("div", { className: classNames__default["default"]('Stepper__step-label', "Stepper__step--".concat(status, "-label")) }, children)) : null)))));
2765
2769
  };
2766
2770
  Step.displayName = 'Step';
2767
2771
  var Stepper = function (_a) {
@@ -3548,8 +3552,12 @@ var Combobox = React.forwardRef(function (_a, ref) {
3548
3552
  }
3549
3553
  }, [open]);
3550
3554
  React.useEffect(function () {
3555
+ var _a = tslib.__read(Array.from(matchingOptions.entries()).find(function (_a) {
3556
+ var _b = tslib.__read(_a, 2), selected = _b[1].selected;
3557
+ return selected;
3558
+ }) || [], 2), element = _a[0], option = _a[1];
3551
3559
  if (autocomplete === 'manual') {
3552
- setActiveDescendant(null);
3560
+ setActiveDescendant(!element ? null : tslib.__assign({ element: element }, option));
3553
3561
  }
3554
3562
  else if (autocomplete === 'automatic' &&
3555
3563
  matchingOptions.size &&
@@ -3588,7 +3596,9 @@ var Combobox = React.forwardRef(function (_a, ref) {
3588
3596
  var handleComboboxOptionClick = React.useCallback(function () {
3589
3597
  var _a;
3590
3598
  // maintain focus on the input
3591
- (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
3599
+ if (inputRef.current !== document.activeElement) {
3600
+ (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus();
3601
+ }
3592
3602
  }, []);
3593
3603
  var handleBlur = React.useCallback(function (event) {
3594
3604
  var _a;
@@ -3606,8 +3616,11 @@ var Combobox = React.forwardRef(function (_a, ref) {
3606
3616
  var enterKeypress = event.key === Enter;
3607
3617
  var escKeypress = event.key === Escape;
3608
3618
  var arrowKeypress = ['ArrowDown', 'ArrowUp'].includes(event.key);
3609
- if ([Home, End].includes(event.key)) {
3610
- // prevent the page from scrolling and allow start/end option activation
3619
+ if (
3620
+ // prevent the page from scrolling and allow start/end option activation
3621
+ [Home, End].includes(event.key) ||
3622
+ // prevent combobox from submitting any forms when the listbox is expanded
3623
+ (enterKeypress && open)) {
3611
3624
  event.preventDefault();
3612
3625
  }
3613
3626
  if (escKeypress) {
@@ -3684,7 +3697,7 @@ var Combobox = React.forwardRef(function (_a, ref) {
3684
3697
  var noMatchingOptions = !!(value === null || value === void 0 ? void 0 : value.length) && !matchingOptions.size && (React__default["default"].createElement(NoMatchingOptions, null));
3685
3698
  var comboboxListbox = (React__default["default"].createElement(Listbox, { className: classNames__default["default"]('Combobox__listbox', {
3686
3699
  'Combobox__listbox--open': open
3687
- }), role: "listbox", "aria-labelledby": "".concat(id, "-label"), id: "".concat(id, "-listbox"), value: selectedValue, onMouseDown: handleComboboxOptionMouseDown, onClick: handleComboboxOptionClick, onSelectionChange: handleSelectionChange, onActiveChange: handleActiveChange, ref: listboxRef, tabIndex: undefined, "aria-activedescendant": undefined },
3700
+ }), role: noMatchingOptions ? 'presentation' : 'listbox', "aria-labelledby": noMatchingOptions ? undefined : "".concat(id, "-label"), id: "".concat(id, "-listbox"), value: selectedValue, onMouseDown: handleComboboxOptionMouseDown, onClick: handleComboboxOptionClick, onSelectionChange: handleSelectionChange, onActiveChange: handleActiveChange, ref: listboxRef, tabIndex: undefined, "aria-activedescendant": undefined },
3688
3701
  comboboxOptions,
3689
3702
  noMatchingOptions));
3690
3703
  var errorId = "".concat(id, "-error");
@@ -3707,10 +3720,13 @@ var Combobox = React.forwardRef(function (_a, ref) {
3707
3720
  onClick: handleInputClick },
3708
3721
  React__default["default"].createElement("input", tslib.__assign({ type: "text", id: "".concat(id, "-input"), ref: inputRef, value: value, role: "combobox", "aria-autocomplete": !isAutoComplete ? 'none' : 'list', "aria-controls": "".concat(id, "-listbox"), "aria-expanded": open, "aria-haspopup": "listbox", "aria-activedescendant": open && activeDescendant ? activeDescendant.element.id : undefined }, inputProps, { onChange: handleChange, onKeyDown: handleKeyDown, onFocus: handleFocus, onBlur: handleBlur })),
3709
3722
  React__default["default"].createElement("span", { className: "Combobox__arrow" })),
3710
- React__default["default"].createElement(ComboboxProvider, { autocomplete: autocomplete, inputValue: value, formValue: formValue, selectedValue: selectedValue, matches: !isAutoComplete || defaultAutoCompleteMatches, matchingOptions: matchingOptions, setMatchingOptions: setMatchingOptions, setFormValue: setFormValue }, portal
3711
- ? reactDom.createPortal(comboboxListbox, portal instanceof HTMLElement
3723
+ React__default["default"].createElement(ComboboxProvider, { autocomplete: autocomplete, inputValue: value, formValue: formValue, selectedValue: selectedValue, matches: !isAutoComplete || defaultAutoCompleteMatches, matchingOptions: matchingOptions, setMatchingOptions: setMatchingOptions, setFormValue: setFormValue }, portal && typeof document !== 'undefined'
3724
+ ? reactDom.createPortal(comboboxListbox,
3725
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
3726
+ portal instanceof HTMLElement
3712
3727
  ? portal
3713
3728
  : portal.current ||
3729
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
3714
3730
  /* istanbul ignore next: default fallback value */ document.body)
3715
3731
  : comboboxListbox),
3716
3732
  hasError && (React__default["default"].createElement("div", { className: "Error", id: errorId }, error))));
@@ -3858,10 +3874,25 @@ var Popover = React.forwardRef(function (_a, ref) {
3858
3874
  }), ref: popoverRef, role: "dialog", style: styles.popper }, attributes.popper, additionalProps, props),
3859
3875
  React__default["default"].createElement("div", { className: "Popover__popoverArrow", ref: setArrowElement, style: styles.arrow }),
3860
3876
  React__default["default"].createElement("div", { className: "Popover__borderLeft" }),
3861
- variant === 'prompt' ? (React__default["default"].createElement(PromptPopoverContent, { applyButtonText: applyButtonText, onApply: onApply, closeButtonText: closeButtonText, infoText: infoText || '', onClose: handleClosePopover, infoTextId: "".concat(id, "-label") })) : (children)))), (portal && 'current' in portal ? portal.current : portal) || document.body);
3877
+ variant === 'prompt' ? (React__default["default"].createElement(PromptPopoverContent, { applyButtonText: applyButtonText, onApply: onApply, closeButtonText: closeButtonText, infoText: infoText || '', onClose: handleClosePopover, infoTextId: "".concat(id, "-label") })) : (children)))), (portal && 'current' in portal ? portal.current : portal) ||
3878
+ // Dependent on "isBrowser" check above:
3879
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
3880
+ document.body);
3862
3881
  });
3863
3882
  Popover.displayName = 'Popover';
3864
3883
 
3884
+ function Timeline(_a) {
3885
+ var className = _a.className, children = _a.children, props = tslib.__rest(_a, ["className", "children"]);
3886
+ return (React__default["default"].createElement("ol", tslib.__assign({ className: classNames__default["default"]('Timeline', className) }, props), children));
3887
+ }
3888
+
3889
+ function TimelineItem(_a) {
3890
+ var className = _a.className, children = _a.children, icon = _a.icon, props = tslib.__rest(_a, ["className", "children", "icon"]);
3891
+ return (React__default["default"].createElement("li", tslib.__assign({ className: classNames__default["default"]('TimelineItem', className) }, props),
3892
+ React__default["default"].createElement("span", { className: "TimelineItem__separator" }, icon),
3893
+ React__default["default"].createElement("div", { className: "TimelineItem__details" }, children)));
3894
+ }
3895
+
3865
3896
  var LIGHT_THEME_CLASS = 'cauldron--theme-light';
3866
3897
  var DARK_THEME_CLASS = 'cauldron--theme-dark';
3867
3898
  var ThemeContext = React.createContext({
@@ -3871,17 +3902,21 @@ var ThemeContext = React.createContext({
3871
3902
  }
3872
3903
  });
3873
3904
  var ThemeProvider = function (_a) {
3874
- var children = _a.children, _b = _a.context, context = _b === void 0 ? document.body : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
3905
+ var children = _a.children,
3906
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
3907
+ _b = _a.context,
3908
+ // eslint-disable-next-line ssr-friendly/no-dom-globals-in-react-fc
3909
+ context = _b === void 0 ? document === null || document === void 0 ? void 0 : document.body : _b, _c = _a.initialTheme, initialTheme = _c === void 0 ? 'light' : _c;
3875
3910
  var _d = tslib.__read(React.useState(initialTheme), 2), theme = _d[0], setTheme = _d[1];
3876
3911
  var getThemeFromContext = function () {
3877
- return context.classList.contains(DARK_THEME_CLASS) ? 'dark' : 'light';
3912
+ return (context === null || context === void 0 ? void 0 : context.classList.contains(DARK_THEME_CLASS)) ? 'dark' : 'light';
3878
3913
  };
3879
3914
  var toggleTheme = function () {
3880
3915
  return setTheme(getThemeFromContext() === 'dark' ? 'light' : 'dark');
3881
3916
  };
3882
3917
  React.useEffect(function () {
3883
- context.classList.toggle(LIGHT_THEME_CLASS, theme === 'light');
3884
- context.classList.toggle(DARK_THEME_CLASS, theme === 'dark');
3918
+ context === null || context === void 0 ? void 0 : context.classList.toggle(LIGHT_THEME_CLASS, theme === 'light');
3919
+ context === null || context === void 0 ? void 0 : context.classList.toggle(DARK_THEME_CLASS, theme === 'dark');
3885
3920
  }, [context, theme]);
3886
3921
  // Use a MutationObserver to track changes to the classes outside of the context of React
3887
3922
  var handleMutation = function (mutationList) {
@@ -3904,6 +3939,9 @@ var ThemeProvider = function (_a) {
3904
3939
  }
3905
3940
  };
3906
3941
  React.useEffect(function () {
3942
+ if (!context) {
3943
+ return;
3944
+ }
3907
3945
  var observer = new MutationObserver(handleMutation);
3908
3946
  observer.observe(context, {
3909
3947
  childList: false,
@@ -4014,6 +4052,8 @@ exports.TagLabel = TagLabel;
4014
4052
  exports.TextField = TextField;
4015
4053
  exports.ThemeContext = ThemeContext;
4016
4054
  exports.ThemeProvider = ThemeProvider;
4055
+ exports.Timeline = Timeline;
4056
+ exports.TimelineItem = TimelineItem;
4017
4057
  exports.Toast = Toast;
4018
4058
  exports.Tooltip = Tooltip;
4019
4059
  exports.TooltipContent = TooltipContent;
@@ -0,0 +1,3 @@
1
+ import { JestAxe } from 'jest-axe';
2
+ declare const axe: JestAxe;
3
+ export default axe;
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -28,5 +28,5 @@ interface ComboboxProps extends React.InputHTMLAttributes<Omit<HTMLInputElement,
28
28
  portal?: React.RefObject<HTMLElement> | HTMLElement;
29
29
  inputRef?: React.Ref<HTMLInputElement>;
30
30
  }
31
- declare const Combobox: React.ForwardRefExoticComponent<ComboboxProps & React.RefAttributes<HTMLInputElement>>;
31
+ declare const Combobox: React.ForwardRefExoticComponent<ComboboxProps & React.RefAttributes<HTMLDivElement>>;
32
32
  export default Combobox;
@@ -0,0 +1 @@
1
+ export {};
@@ -15,6 +15,7 @@ export interface IconButtonOwnProps {
15
15
  tooltipVariant?: TooltipProps['variant'];
16
16
  tooltipPortal?: TooltipProps['portal'];
17
17
  variant?: 'primary' | 'secondary' | 'error';
18
+ large?: boolean;
18
19
  }
19
20
  type PolymorphicIconButton = Polymorphic.ForwardRefComponent<'button', IconButtonOwnProps>;
20
21
  /**
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -4,7 +4,7 @@ export interface TextFieldProps extends Omit<React.InputHTMLAttributes<HTMLInput
4
4
  error?: React.ReactNode;
5
5
  defaultValue?: string;
6
6
  onChange?: (value: string, e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
7
- fieldRef: React.Ref<HTMLInputElement | HTMLTextAreaElement>;
7
+ fieldRef?: React.Ref<HTMLInputElement | HTMLTextAreaElement>;
8
8
  requiredText?: string;
9
9
  multiline?: boolean;
10
10
  }
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ interface TimelineProps extends React.HTMLAttributes<HTMLOListElement> {
3
+ className?: string;
4
+ }
5
+ export default function Timeline({ className, children, ...props }: TimelineProps): JSX.Element;
6
+ export {};
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ interface TimelineItemProps extends React.HTMLAttributes<HTMLLIElement> {
3
+ icon?: React.ReactElement;
4
+ }
5
+ export default function TimelineItem({ className, children, icon, ...props }: TimelineItemProps): JSX.Element;
6
+ export {};
@@ -0,0 +1,2 @@
1
+ export { default } from './Timeline';
2
+ export { default as TimelineItem } from './TimelineItem';
@@ -0,0 +1 @@
1
+ export {};
@@ -53,6 +53,7 @@ export { default as Notice } from './components/Notice';
53
53
  export { default as Listbox, ListboxOption, ListboxGroup } from './components/Listbox';
54
54
  export { default as Combobox, ComboboxOption, ComboboxGroup } from './components/Combobox';
55
55
  export { default as Popover } from './components/Popover';
56
+ export { default as Timeline, TimelineItem } from './components/Timeline';
56
57
  /**
57
58
  * Helpers / Utils
58
59
  */
@@ -0,0 +1 @@
1
+ export default function setRef<T>(ref: React.Ref<T> | undefined, element: T): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deque/cauldron-react",
3
- "version": "6.0.0",
3
+ "version": "6.1.0-canary.33d6b541",
4
4
  "license": "MPL-2.0",
5
5
  "description": "Fully accessible react components library for Deque Cauldron",
6
6
  "homepage": "https://cauldron.dequelabs.com/",
@@ -43,19 +43,27 @@
43
43
  "@rollup/plugin-dynamic-import-vars": "^1.4.2",
44
44
  "@rollup/plugin-typescript": "^11.1.2",
45
45
  "@svgr/rollup": "^6.1.2",
46
+ "@testing-library/jest-dom": "^6.1.3",
47
+ "@testing-library/react": "^12",
48
+ "@testing-library/user-event": "^14.5.2",
46
49
  "@types/classnames": "^2.2.10",
50
+ "@types/enzyme-adapter-react-16": "^1.0.9",
51
+ "@types/jest": "^29.5.11",
52
+ "@types/jest-axe": "^3.5.4",
47
53
  "@types/node": "^17.0.42",
48
54
  "@types/react": "^18.0.12",
49
55
  "@types/react-dom": "^18.0.5",
50
56
  "@types/react-syntax-highlighter": "^15.5.2",
57
+ "@types/sinon": "^10",
51
58
  "autoprefixer": "^9.7.6",
52
59
  "babel-plugin-module-resolver": "^4.0.0",
53
60
  "babel-plugin-transform-export-extensions": "^6.22.0",
54
61
  "concurrently": "^5.3.0",
55
62
  "enzyme": "^3.11.0",
56
63
  "enzyme-adapter-react-16": "^1.15.2",
57
- "jest": "^24.7.1",
64
+ "jest": "^29.7.0",
58
65
  "jest-axe": "^8.0.0",
66
+ "jest-environment-jsdom": "^29.7.0",
59
67
  "nyc": "^15.0.1",
60
68
  "postcss-cli": "^7.1.1",
61
69
  "postcss-import": "^12.0.1",
@@ -64,6 +72,7 @@
64
72
  "react-dom": "^16.13.1",
65
73
  "rollup": "^2.23.0",
66
74
  "sinon": "^10.0.0",
75
+ "ts-node": "^10.9.2",
67
76
  "typescript": "~5.0.0"
68
77
  },
69
78
  "repository": {
@@ -85,27 +94,9 @@
85
94
  "functions": 85,
86
95
  "lines": 85,
87
96
  "exclude": [
88
- "dist",
97
+ "lib",
89
98
  "coverage",
90
99
  "test/**/*.js"
91
100
  ]
92
- },
93
- "jest": {
94
- "setupFilesAfterEnv": [
95
- "<rootDir>__tests__/setupTests.js"
96
- ],
97
- "testMatch": [
98
- "**/__tests__/src/**/*.js",
99
- "**/__tests__/demo/**/*.js"
100
- ],
101
- "collectCoverageFrom": [
102
- "**/src/**/*.{ts,tsx}"
103
- ],
104
- "moduleNameMapper": {
105
- "\\.(css|less)$": "<rootDir>/__tests__/styleMock.js",
106
- "react-syntax-highlighter/dist/esm/light": "<rootDir>/__tests__/reactSyntaxHighlighterMock.js",
107
- "react-syntax-highlighter/dist/esm/languages/hljs/(.*)": "<rootDir>/__tests__/hljsMock.js",
108
- "\\.svg$": "<rootDir>/__tests__/svgMock.js"
109
- }
110
101
  }
111
102
  }
@@ -1 +0,0 @@
1
- export default function setRef<T>(ref: React.Ref<T>, element: T): void;
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes
File without changes