grep-components 2.18.0 → 2.19.0

package/dist/components/ToC/styles/nav.style.d.ts

@@ -2,7 +2,7 @@ export declare const useStyles: (params: void, muiStyleOverridesParams?: {
     props: Record<string, unknown>;
     ownerState?: Record<string, unknown> | undefined;
 } | undefined) => {
-    classes: Record<"root" | "keyboardHint", string>;
+    classes: Record<"root", string>;
     theme: import("@mui/material").Theme;
     css: import("tss-react").Css;
     cx: import("tss-react").Cx;

package/dist/index.js

@@ -10321,19 +10321,6 @@ const useStyles = makeStyles()(() => ({
             background: 'transparent' /* Optional: just make scrollbar invisible */,
         },
     },
-    keyboardHint: {
-        position: 'relative',
-        '&::after': {
-            content: '"innholdsfortegnelse: [ alt + i ]"',
-            fontSize: 12,
-            position: 'absolute',
-            display: 'block',
-            top: 5,
-            right: 5,
-            background: convertToRgba('#000', 0.1),
-            padding: '2px 5px',
-        },
-    },
 }));
 
 const getElementLevel = (el) => {
@@ -10366,7 +10353,6 @@ const buildTree = (elements, normalizer = normalize) => {
 };
 
 const GrepTableOfContentNav = (props) => {
-    const [showKeyboardHint, setShowKeyboardHint] = useState(false);
     const ref = useRef(null);
     const { elements, classes, selected, setSelected } = useContext(context);
     const tree = useMemo(() => buildTree(Object.values(elements)), [elements]);
@@ -10384,16 +10370,6 @@ const GrepTableOfContentNav = (props) => {
         });
     }, [ref]);
     const onKeyDown = (e) => {
-        if (selected && e.key === Key.Tab && e.shiftKey === false) {
-            const tabindex = selected.getAttribute('tabindex');
-            selected.setAttribute('tabindex', '0');
-            selected.focus();
-            requestAnimationFrame(() => {
-                tabindex === null
-                    ? selected.removeAttribute('tabindex')
-                    : selected.setAttribute('tabindex', tabindex);
-            });
-        }
         if (e.key === Key.ArrowUp || e.key === Key.ArrowDown) {
             e.preventDefault();
             e.stopPropagation();
@@ -10405,25 +10381,8 @@ const GrepTableOfContentNav = (props) => {
             focusSelected();
         }
     };
-    useEffect(() => {
-        const onKeyDown = (e) => {
-            e.key === Key.Alt && setShowKeyboardHint(true);
-            if (e.altKey) {
-                e.key === Key.I && focusSelected();
-            }
-        };
-        const onKeyUp = (e) => {
-            e.key === Key.Alt && setShowKeyboardHint(false);
-        };
-        window.addEventListener('keydown', onKeyDown);
-        window.addEventListener('keyup', onKeyUp);
-        return () => {
-            window.removeEventListener('keydown', onKeyDown);
-            window.removeEventListener('keyup', onKeyUp);
-        };
-    }, [focusSelected]);
     const { classes: style } = useStyles();
-    const className = clsx('grep-toc__nav', style.root, classes?.nav, props.className, showKeyboardHint && style.keyboardHint);
+    const className = clsx('grep-toc__nav', style.root, classes?.nav, props.className);
     return (React__default.createElement("nav", { className: className, style: props.style, tabIndex: selected ? -1 : 0, onKeyDown: onKeyDown, ref: ref },
         React__default.createElement(NavTree, { elements: tree, setSelectedValue: props.setSelectedValue, percentageRendered: props.percentageRendered })));
 };