@deque/cauldron-react 6.21.0-canary.52118e5a → 6.21.0-canary.6afe1a38

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 (3) hide show
  1. package/lib/components/ActionList/ActionListItem.d.ts +0 -2
  2. package/lib/index.js +17 -13
  3. package/package.json +1 -1
package/lib/components/ActionList/ActionListItem.d.ts CHANGED
@@ -20,8 +20,6 @@ interface ActionListItemProps extends PolymorphicProps<React.HTMLAttributes<HTML
20
20
  disabled?: boolean;
21
21
  /** A callback function that is called when an action item is selected. */
22
22
  onAction?: (event: onActionEvent) => void;
23
- /** Alternative variant for action items */
24
- variant?: 'default' | 'danger';
25
23
  }
26
24
  declare const ActionListItem: PolymorphicComponent<ActionListItemProps>;
27
25
  export default ActionListItem;
package/lib/index.js CHANGED
@@ -3795,16 +3795,11 @@ var Listbox = React.forwardRef(function (_a, ref) {
3795
3795
  setActiveOption(lastOption);
3796
3796
  break;
3797
3797
  case enter:
3798
- case space: {
3799
- if (activeOption && !isDisabledOption(activeOption)) {
3800
- // Since focus is managed in the listbox using `aria-activedescendant`
3801
- // we want to simulate a keypress on the current active list item
3802
- activeOption.element.click();
3803
- }
3798
+ case space:
3799
+ activeOption && handleSelect(activeOption);
3804
3800
  break;
3805
- }
3806
3801
  }
3807
- }, [options, activeOption, navigation]);
3802
+ }, [options, activeOption, navigation, handleSelect]);
3808
3803
  var handleFocus = React.useCallback(function (event) {
3809
3804
  if (focusStrategy === 'first') {
3810
3805
  var firstOption = !focusDisabledOptions
@@ -4937,6 +4932,17 @@ var ActionList = React.forwardRef(function (_a, ref) {
4937
4932
  onAction(key, event);
4938
4933
  }
4939
4934
  }, [onAction]);
4935
+ var handleKeyDown = React.useCallback(function (event) {
4936
+ var _a;
4937
+ if (event.defaultPrevented) {
4938
+ return;
4939
+ }
4940
+ // Since focus is managed in the action list using `aria-activedescendant`
4941
+ // we want to simulate a keypress on the current active list item
4942
+ if (event.key === 'Enter' || event.key === ' ') {
4943
+ (_a = activeElement.current) === null || _a === void 0 ? void 0 : _a.click();
4944
+ }
4945
+ }, []);
4940
4946
  return (
4941
4947
  // Note: we should be able to use listbox without passing a prop
4942
4948
  // value for "multiselect"
@@ -4946,13 +4952,13 @@ var ActionList = React.forwardRef(function (_a, ref) {
4946
4952
  /* Listbox comes with an explicit role of "listbox", but we want to either
4947
4953
  * use the role from props, or default to the intrinsic role */
4948
4954
  // eslint-disable-next-line jsx-a11y/aria-role
4949
- role: undefined, "aria-multiselectable": actionListContext.role === 'listbox' ? undefined : null, className: classNames__default["default"]('ActionList', className) }, props, { onActiveChange: handleActiveChange, navigation: "bound" }),
4955
+ role: undefined, "aria-multiselectable": actionListContext.role === 'listbox' ? undefined : null, className: classNames__default["default"]('ActionList', className) }, props, { onKeyDown: handleKeyDown, onActiveChange: handleActiveChange, navigation: "bound" }),
4950
4956
  React__default["default"].createElement(ActionListProvider, { role: props.role || 'list', onAction: handleAction, selectionType: selectionType }, children)));
4951
4957
  });
4952
4958
  ActionList.displayName = 'ActionList';
4953
4959
 
4954
4960
  var ActionListItem = React.forwardRef(function (_a, ref) {
4955
- var _b = _a.as, Component = _b === void 0 ? 'li' : _b, actionKey = _a.actionKey, className = _a.className, description = _a.description, selected = _a.selected, leadingIcon = _a.leadingIcon, trailingIcon = _a.trailingIcon, onAction = _a.onAction, children = _a.children, variant = _a.variant, props = tslib.__rest(_a, ["as", "actionKey", "className", "description", "selected", "leadingIcon", "trailingIcon", "onAction", "children", "variant"]);
4961
+ var _b = _a.as, Component = _b === void 0 ? 'li' : _b, actionKey = _a.actionKey, className = _a.className, description = _a.description, selected = _a.selected, leadingIcon = _a.leadingIcon, trailingIcon = _a.trailingIcon, onAction = _a.onAction, children = _a.children, props = tslib.__rest(_a, ["as", "actionKey", "className", "description", "selected", "leadingIcon", "trailingIcon", "onAction", "children"]);
4956
4962
  var _c = tslib.__read(nextId.useId(1, 'action-list-item'), 1), id = _c[0];
4957
4963
  var actionListItemRef = useSharedRef(ref);
4958
4964
  var labelRef = React.useRef(null);
@@ -5018,9 +5024,7 @@ var ActionListItem = React.forwardRef(function (_a, ref) {
5018
5024
  }, [isActive]);
5019
5025
  var allowsSelection = !!selectionType;
5020
5026
  var isSelected = allowsSelection ? !!selected : undefined;
5021
- return (React__default["default"].createElement(ListboxOption, tslib.__assign({ as: Component, ref: actionListItemRef, id: id, role: listItemRole, className: classNames__default["default"]('ActionListItem', className, {
5022
- 'ActionListItem--danger': variant === 'danger'
5023
- }), activeClass: "ActionListItem--active", "aria-selected": undefined, "aria-checked": listItemRole !== 'option' ? isSelected : undefined, onClick: handleAction }, props),
5027
+ return (React__default["default"].createElement(ListboxOption, tslib.__assign({ as: Component, ref: actionListItemRef, id: id, role: listItemRole, className: classNames__default["default"]('ActionListItem', className), activeClass: "ActionListItem--active", "aria-selected": undefined, "aria-checked": listItemRole !== 'option' ? isSelected : undefined, onClick: handleAction }, props),
5024
5028
  allowsSelection && (React__default["default"].createElement("span", { className: "ActionListItem__selection" },
5025
5029
  React__default["default"].createElement(Icon, { type: "check" }))),
5026
5030
  leadingIcon && (React__default["default"].createElement("span", { className: "ActionListItem__leadingIcon" },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@deque/cauldron-react",
3
- "version": "6.21.0-canary.52118e5a",
3
+ "version": "6.21.0-canary.6afe1a38",
4
4
  "license": "MPL-2.0",
5
5
  "description": "Fully accessible react components library for Deque Cauldron",
6
6
  "homepage": "https://cauldron.dequelabs.com/",