@vertigis/react-ui 9.3.0 → 9.3.1

package/MenuItemSecondaryAction/MenuItemSecondaryAction.d.ts

@@ -0,0 +1,11 @@
+import { FC } from "react";
+import { ListItemSecondaryActionProps } from "../ListItemSecondaryAction";
+/**
+ * For use within a MenuList (or other list that implements arrow key
+ * navigation). The standard ListItemSecondaryAction will break keyboard
+ * navigation in this type of list.
+ *
+ * @param props The component properties.
+ */
+declare const MenuItemSecondaryAction: FC<ListItemSecondaryActionProps>;
+export default MenuItemSecondaryAction;

package/MenuItemSecondaryAction/MenuItemSecondaryAction.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useRef } from "react";
+import GcxListItemSecondaryAction from "../ListItemSecondaryAction";
+import { styled } from "../styles";
+const StyledListItemSecondaryAction = styled(GcxListItemSecondaryAction)({
+    display: "flex",
+    flexShrink: 0,
+});
+/**
+ * For use within a MenuList (or other list that implements arrow key
+ * navigation). The standard ListItemSecondaryAction will break keyboard
+ * navigation in this type of list.
+ *
+ * @param props The component properties.
+ */
+const MenuItemSecondaryAction = (props) => {
+    const ref = useRef(null);
+    const { className, ...otherProps } = props;
+    const onKeyDown = (event) => {
+        var _a, _b;
+        const { key } = event;
+        if (key === "ArrowUp" || key === "ArrowDown" || key === "Home" || key === "End") {
+            // Switch focus to the parent list item, then let the key event
+            // propagate to get the normal behavior of pressing these keys.
+            (_b = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.focus();
+        }
+        else if (key !== "Escape") {
+            // Prevent propagation to the primary action.
+            event.stopPropagation();
+        }
+    };
+    return (_jsx(StyledListItemSecondaryAction, Object.assign({ className: className, onClick: (event) => {
+            event.stopPropagation();
+        }, onKeyDown: onKeyDown, onMouseDown: (event) => {
+            // This will stop child ripples from propagating.
+            event.stopPropagation();
+        }, ref: ref }, otherProps), void 0));
+};
+export default MenuItemSecondaryAction;

package/MenuItemSecondaryAction/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./MenuItemSecondaryAction";
+export * from "./MenuItemSecondaryAction";

package/MenuItemSecondaryAction/index.js

@@ -0,0 +1,2 @@
+export { default } from "./MenuItemSecondaryAction";
+export * from "./MenuItemSecondaryAction";

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@vertigis/react-ui",
-    "version": "9.3.0",
+    "version": "9.3.1",
     "description": "Utilities and React components used in VertiGIS applications.",
     "keywords": [
         "vertigis",