@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.
- package/lib/__tests__/setupTests.d.ts +2 -0
- package/lib/cauldron.css +2 -0
- package/lib/index.js +63 -23
- package/lib/src/axe.d.ts +3 -0
- package/lib/src/components/Button/index.test.d.ts +1 -0
- package/lib/src/components/Checkbox/Checkbox.test.d.ts +1 -0
- package/lib/{components → src/components}/Combobox/Combobox.d.ts +1 -1
- package/lib/src/components/Combobox/Combobox.test.d.ts +1 -0
- package/lib/{components → src/components}/IconButton/index.d.ts +1 -0
- package/lib/src/components/Tag/index.test.d.ts +1 -0
- package/lib/src/components/TextField/TextField.test.d.ts +1 -0
- package/lib/{components → src/components}/TextField/index.d.ts +1 -1
- package/lib/src/components/Timeline/Timeline.d.ts +6 -0
- package/lib/src/components/Timeline/TimelineItem.d.ts +6 -0
- package/lib/src/components/Timeline/index.d.ts +2 -0
- package/lib/src/components/Timeline/timeline.test.d.ts +1 -0
- package/lib/{index.d.ts → src/index.d.ts} +1 -0
- package/lib/src/utils/setRef.d.ts +1 -0
- package/package.json +12 -21
- package/lib/utils/setRef.d.ts +0 -1
- /package/lib/{components → src/components}/Accordion/Accordion.d.ts +0 -0
- /package/lib/{components → src/components}/Accordion/index.d.ts +0 -0
- /package/lib/{components → src/components}/Address/index.d.ts +0 -0
- /package/lib/{components → src/components}/Alert/index.d.ts +0 -0
- /package/lib/{components → src/components}/Breadcrumb/Breadcrumb.d.ts +0 -0
- /package/lib/{components → src/components}/Breadcrumb/BreadcrumbItem.d.ts +0 -0
- /package/lib/{components → src/components}/Breadcrumb/BreadcrumbLink.d.ts +0 -0
- /package/lib/{components → src/components}/Breadcrumb/index.d.ts +0 -0
- /package/lib/{components → src/components}/Button/index.d.ts +0 -0
- /package/lib/{components → src/components}/Checkbox/index.d.ts +0 -0
- /package/lib/{components → src/components}/ClickOutsideListener/index.d.ts +0 -0
- /package/lib/{components → src/components}/Code/index.d.ts +0 -0
- /package/lib/{components → src/components}/Combobox/ComboboxContext.d.ts +0 -0
- /package/lib/{components → src/components}/Combobox/ComboboxGroup.d.ts +0 -0
- /package/lib/{components → src/components}/Combobox/ComboboxOption.d.ts +0 -0
- /package/lib/{components → src/components}/Combobox/index.d.ts +0 -0
- /package/lib/{components → src/components}/DescriptionList/index.d.ts +0 -0
- /package/lib/{components → src/components}/Dialog/index.d.ts +0 -0
- /package/lib/{components → src/components}/ExpandCollapsePanel/ExpandCollapsePanel.d.ts +0 -0
- /package/lib/{components → src/components}/ExpandCollapsePanel/PanelTrigger.d.ts +0 -0
- /package/lib/{components → src/components}/ExpandCollapsePanel/index.d.ts +0 -0
- /package/lib/{components → src/components}/FieldWrap/index.d.ts +0 -0
- /package/lib/{components → src/components}/Icon/index.d.ts +0 -0
- /package/lib/{components → src/components}/Icon/types.d.ts +0 -0
- /package/lib/{components → src/components}/Layout/index.d.ts +0 -0
- /package/lib/{components → src/components}/Line/index.d.ts +0 -0
- /package/lib/{components → src/components}/Link/index.d.ts +0 -0
- /package/lib/{components → src/components}/Listbox/Listbox.d.ts +0 -0
- /package/lib/{components → src/components}/Listbox/ListboxContext.d.ts +0 -0
- /package/lib/{components → src/components}/Listbox/ListboxGroup.d.ts +0 -0
- /package/lib/{components → src/components}/Listbox/ListboxOption.d.ts +0 -0
- /package/lib/{components → src/components}/Listbox/index.d.ts +0 -0
- /package/lib/{components → src/components}/Loader/index.d.ts +0 -0
- /package/lib/{components → src/components}/LoaderOverlay/axe-loader.d.ts +0 -0
- /package/lib/{components → src/components}/LoaderOverlay/index.d.ts +0 -0
- /package/lib/{components → src/components}/Main/index.d.ts +0 -0
- /package/lib/{components → src/components}/MenuBar/index.d.ts +0 -0
- /package/lib/{components → src/components}/MenuItem/click-link.d.ts +0 -0
- /package/lib/{components → src/components}/MenuItem/index.d.ts +0 -0
- /package/lib/{components → src/components}/Modal/index.d.ts +0 -0
- /package/lib/{components → src/components}/NavBar/NavBar.d.ts +0 -0
- /package/lib/{components → src/components}/NavBar/NavItem.d.ts +0 -0
- /package/lib/{components → src/components}/NavBar/index.d.ts +0 -0
- /package/lib/{components → src/components}/Notice/index.d.ts +0 -0
- /package/lib/{components → src/components}/Offscreen/index.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/OptionsMenu.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/OptionsMenuItem.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/OptionsMenuList.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/OptionsMenuTrigger.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/OptionsMenuWrapper.d.ts +0 -0
- /package/lib/{components → src/components}/OptionsMenu/index.d.ts +0 -0
- /package/lib/{components → src/components}/Pagination/Pagination.d.ts +0 -0
- /package/lib/{components → src/components}/Pagination/index.d.ts +0 -0
- /package/lib/{components → src/components}/Pagination/usePagination.d.ts +0 -0
- /package/lib/{components → src/components}/Panel/Panel.d.ts +0 -0
- /package/lib/{components → src/components}/Panel/PanelContent.d.ts +0 -0
- /package/lib/{components → src/components}/Panel/PanelHeader.d.ts +0 -0
- /package/lib/{components → src/components}/Panel/index.d.ts +0 -0
- /package/lib/{components → src/components}/Popover/index.d.ts +0 -0
- /package/lib/{components → src/components}/ProgressBar/index.d.ts +0 -0
- /package/lib/{components → src/components}/RadioCardGroup/index.d.ts +0 -0
- /package/lib/{components → src/components}/RadioGroup/index.d.ts +0 -0
- /package/lib/{components → src/components}/Scrim/index.d.ts +0 -0
- /package/lib/{components → src/components}/Select/index.d.ts +0 -0
- /package/lib/{components → src/components}/SideBar/SideBar.d.ts +0 -0
- /package/lib/{components → src/components}/SideBar/SideBarItem.d.ts +0 -0
- /package/lib/{components → src/components}/SideBar/index.d.ts +0 -0
- /package/lib/{components → src/components}/SkipLink/index.d.ts +0 -0
- /package/lib/{components → src/components}/Stepper/index.d.ts +0 -0
- /package/lib/{components → src/components}/Table/Table.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableBody.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableCell.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableFooter.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableHead.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableHeader.d.ts +0 -0
- /package/lib/{components → src/components}/Table/TableRow.d.ts +0 -0
- /package/lib/{components → src/components}/Table/index.d.ts +0 -0
- /package/lib/{components → src/components}/Tabs/Tab.d.ts +0 -0
- /package/lib/{components → src/components}/Tabs/TabPanel.d.ts +0 -0
- /package/lib/{components → src/components}/Tabs/Tabs.d.ts +0 -0
- /package/lib/{components → src/components}/Tabs/index.d.ts +0 -0
- /package/lib/{components → src/components}/Tag/index.d.ts +0 -0
- /package/lib/{components → src/components}/TagButton/index.d.ts +0 -0
- /package/lib/{components → src/components}/Toast/index.d.ts +0 -0
- /package/lib/{components → src/components}/Toast/utils.d.ts +0 -0
- /package/lib/{components → src/components}/Tooltip/index.d.ts +0 -0
- /package/lib/{components → src/components}/TooltipTabstop/index.d.ts +0 -0
- /package/lib/{components → src/components}/TopBar/TopBar.d.ts +0 -0
- /package/lib/{components → src/components}/TopBar/TopBarMenu.d.ts +0 -0
- /package/lib/{components → src/components}/TopBar/TopBarTrigger.d.ts +0 -0
- /package/lib/{components → src/components}/TopBar/index.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/ColumnGroupHeader.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/ColumnHeader.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/ColumnLeft.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/ColumnList.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/ColumnRight.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/TwoColumnPanel.d.ts +0 -0
- /package/lib/{components → src/components}/TwoColumnPanel/index.d.ts +0 -0
- /package/lib/{components → src/components}/Workspace/index.d.ts +0 -0
- /package/lib/{constants.d.ts → src/constants.d.ts} +0 -0
- /package/lib/{contexts → src/contexts}/theme.d.ts +0 -0
- /package/lib/{types.d.ts → src/types.d.ts} +0 -0
- /package/lib/{utils → src/utils}/aria-isolate/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/focusable-selector/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/is-browser/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/polymorphic-type/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/query-all/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/remove-ids/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/rndid/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/stylesheets/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/token-list/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/use-did-update/index.d.ts +0 -0
- /package/lib/{utils → src/utils}/useIntersectionRef.d.ts +0 -0
- /package/lib/{utils → src/utils}/useSharedRef.d.ts +0 -0
- /package/lib/{utils → src/utils}/viewport/index.d.ts +0 -0
package/lib/cauldron.css
CHANGED
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
|
-
|
|
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
|
-
|
|
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
|
-
(
|
|
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 (
|
|
3610
|
-
|
|
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:
|
|
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,
|
|
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) ||
|
|
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,
|
|
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;
|
package/lib/src/axe.d.ts
ADDED
|
@@ -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<
|
|
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
|
|
7
|
+
fieldRef?: React.Ref<HTMLInputElement | HTMLTextAreaElement>;
|
|
8
8
|
requiredText?: string;
|
|
9
9
|
multiline?: boolean;
|
|
10
10
|
}
|
|
@@ -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.
|
|
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": "^
|
|
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
|
-
"
|
|
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
|
}
|
package/lib/utils/setRef.d.ts
DELETED
|
@@ -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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
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
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|