@navikt/ds-react 7.32.2 → 7.32.4

package/esm/util/hideNonTargetElements.js

@@ -0,0 +1,139 @@
+/**
+ * Modified version of `aria-hidden`-package.
+ * - Removed "inert"-functionality.
+ * - Removed flexibility for different data-attributes.
+ * https://github.com/theKashey/aria-hidden/blob/720e8a8e1cfa047bd299a929d95d47ac860a5c1a/src/index.ts
+ */
+import { ownerDocument } from "./owner.js";
+let ariaHiddenCounter = new WeakMap();
+let markerCounter = new WeakMap();
+let uncontrolledElementsSet = new WeakSet();
+let lockCount = 0;
+const controlAttribute = "aria-hidden";
+const markerName = "data-aksel-hidden";
+/**
+ * Unwraps a Shadow DOM host to find the actual Element in the light DOM.
+ */
+function unwrapHost(node) {
+    return (node &&
+        (node.host || unwrapHost(node.parentNode)));
+}
+/**
+ * Corrects the target elements by unwrapping Shadow DOM hosts if necessary.
+ *
+ * @param parent - The parent HTMLElement to check containment against.
+ * @param targets - An array of target Elements to correct.
+ * @returns An array of corrected Elements that are contained within the parent.
+ */
+function correctElements(parent, targets) {
+    return targets
+        .map((target) => {
+        if (parent.contains(target)) {
+            return target;
+        }
+        const correctedTarget = unwrapHost(target);
+        if (parent.contains(correctedTarget)) {
+            return correctedTarget;
+        }
+        return null;
+    })
+        .filter((x) => x !== null);
+}
+/**
+ * Applies the aria-hidden attribute to all elements in the body except the specified avoid elements.
+ */
+function applyAttributeToOthers(uncorrectedAvoidElements, body) {
+    const avoidElements = correctElements(body, uncorrectedAvoidElements);
+    const elementsToAvoidWithParents = new Set();
+    const elementsToAvoidUpdating = new Set(avoidElements);
+    const hiddenElements = [];
+    avoidElements.forEach(addToAvoidList);
+    applyAttributes(body);
+    elementsToAvoidWithParents.clear();
+    function addToAvoidList(el) {
+        if (!el || elementsToAvoidWithParents.has(el)) {
+            return;
+        }
+        elementsToAvoidWithParents.add(el);
+        if (el.parentNode) {
+            addToAvoidList(el.parentNode);
+        }
+    }
+    function applyAttributes(parent) {
+        if (!parent || elementsToAvoidUpdating.has(parent)) {
+            return;
+        }
+        const parentChildren = parent.children;
+        for (let index = 0; index < parentChildren.length; index += 1) {
+            const node = parentChildren[index];
+            if (elementsToAvoidWithParents.has(node)) {
+                applyAttributes(node);
+            }
+            else {
+                const attr = node.getAttribute(controlAttribute);
+                /*
+                 * We only check for falsy values here since since arbitrary values
+                 * (e.g. "true", "foo", "") are all valid for indicating that the element is already hidden.
+                 */
+                const alreadyHidden = attr !== null && attr !== "false";
+                const counterValue = (ariaHiddenCounter.get(node) || 0) + 1;
+                const markerValue = (markerCounter.get(node) || 0) + 1;
+                ariaHiddenCounter.set(node, counterValue);
+                markerCounter.set(node, markerValue);
+                hiddenElements.push(node);
+                if (counterValue === 1 && alreadyHidden) {
+                    uncontrolledElementsSet.add(node);
+                }
+                if (markerValue === 1) {
+                    node.setAttribute(markerName, "");
+                }
+                if (!alreadyHidden) {
+                    node.setAttribute(controlAttribute, "true");
+                }
+            }
+        }
+    }
+    lockCount += 1;
+    /* Cleanup */
+    return () => {
+        for (const element of hiddenElements) {
+            const currentCounterValue = ariaHiddenCounter.get(element) || 0;
+            const counterValue = currentCounterValue - 1;
+            const markerValue = (markerCounter.get(element) || 0) - 1;
+            ariaHiddenCounter.set(element, counterValue);
+            markerCounter.set(element, markerValue);
+            if (!counterValue) {
+                if (!uncontrolledElementsSet.has(element)) {
+                    element.removeAttribute(controlAttribute);
+                }
+                uncontrolledElementsSet.delete(element);
+            }
+            if (!markerValue) {
+                element.removeAttribute(markerName);
+            }
+        }
+        lockCount -= 1;
+        /* Reset */
+        if (!lockCount) {
+            ariaHiddenCounter = new WeakMap();
+            uncontrolledElementsSet = new WeakSet();
+            markerCounter = new WeakMap();
+        }
+    };
+}
+/**
+ * Hides all elements in the document body for assertive technologies except the specified elements with `aria-hidden`.
+ * @param avoidElements - An array of elements to avoid hiding.
+ * @returns A function that, when called, will undo the hiding of elements.
+ */
+function hideNonTargetElements(avoidElements) {
+    const body = ownerDocument(avoidElements[0]).body;
+    /**
+     * Assume that elements with `aria-live` or `script` tags should not be hidden.
+     * This ensures that live regions and scripts continue to function properly.
+     */
+    const ingoredElements = Array.from(body.querySelectorAll("[aria-live], script"));
+    return applyAttributeToOthers(avoidElements.concat(ingoredElements), body);
+}
+export { hideNonTargetElements };
+//# sourceMappingURL=hideNonTargetElements.js.map

package/esm/util/hideNonTargetElements.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hideNonTargetElements.js","sourceRoot":"","sources":["../../src/util/hideNonTargetElements.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAIxC,IAAI,iBAAiB,GAAG,IAAI,OAAO,EAAmB,CAAC;AACvD,IAAI,aAAa,GAAG,IAAI,OAAO,EAAmB,CAAC;AAEnD,IAAI,uBAAuB,GAAG,IAAI,OAAO,EAAW,CAAC;AACrD,IAAI,SAAS,GAAG,CAAC,CAAC;AAElB,MAAM,gBAAgB,GAAG,aAAa,CAAC;AACvC,MAAM,UAAU,GAAG,mBAAmB,CAAC;AAEvC;;GAEG;AACH,SAAS,UAAU,CAAC,IAA0B;IAC5C,OAAO,CACL,IAAI;QACJ,CAAE,IAAmB,CAAC,IAAI,IAAI,UAAU,CAAC,IAAI,CAAC,UAAqB,CAAC,CAAC,CACtE,CAAC;AACJ,CAAC;AAED;;;;;;GAMG;AACH,SAAS,eAAe,CAAC,MAAmB,EAAE,OAAkB;IAC9D,OAAO,OAAO;SACX,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;QACd,IAAI,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAC5B,OAAO,MAAM,CAAC;QAChB,CAAC;QAED,MAAM,eAAe,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC;QAE3C,IAAI,MAAM,CAAC,QAAQ,CAAC,eAAe,CAAC,EAAE,CAAC;YACrC,OAAO,eAAe,CAAC;QACzB,CAAC;QAED,OAAO,IAAI,CAAC;IACd,CAAC,CAAC;SACD,MAAM,CAAC,CAAC,CAAC,EAAgB,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC;AAC7C,CAAC;AAED;;GAEG;AACH,SAAS,sBAAsB,CAC7B,wBAAmC,EACnC,IAAiB;IAEjB,MAAM,aAAa,GAAG,eAAe,CAAC,IAAI,EAAE,wBAAwB,CAAC,CAAC;IACtE,MAAM,0BAA0B,GAAG,IAAI,GAAG,EAAQ,CAAC;IACnD,MAAM,uBAAuB,GAAG,IAAI,GAAG,CAAO,aAAa,CAAC,CAAC;IAC7D,MAAM,cAAc,GAAc,EAAE,CAAC;IAErC,aAAa,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IACtC,eAAe,CAAC,IAAI,CAAC,CAAC;IACtB,0BAA0B,CAAC,KAAK,EAAE,CAAC;IAEnC,SAAS,cAAc,CAAC,EAAoB;QAC1C,IAAI,CAAC,EAAE,IAAI,0BAA0B,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC;YAC9C,OAAO;QACT,CAAC;QAED,0BAA0B,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;QACnC,IAAI,EAAE,CAAC,UAAU,EAAE,CAAC;YAClB,cAAc,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC;QAChC,CAAC;IACH,CAAC;IAED,SAAS,eAAe,CAAC,MAAsB;QAC7C,IAAI,CAAC,MAAM,IAAI,uBAAuB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC;YACnD,OAAO;QACT,CAAC;QAED,MAAM,cAAc,GAAG,MAAM,CAAC,QAAQ,CAAC;QAEvC,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,cAAc,CAAC,MAAM,EAAE,KAAK,IAAI,CAAC,EAAE,CAAC;YAC9D,MAAM,IAAI,GAAG,cAAc,CAAC,KAAK,CAAY,CAAC;YAE9C,IAAI,0BAA0B,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;gBACzC,eAAe,CAAC,IAAI,CAAC,CAAC;YACxB,CAAC;iBAAM,CAAC;gBACN,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAC,CAAC;gBAEjD;;;mBAGG;gBACH,MAAM,aAAa,GAAG,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,OAAO,CAAC;gBACxD,MAAM,YAAY,GAAG,CAAC,iBAAiB,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;gBAC5D,MAAM,WAAW,GAAG,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;gBAEvD,iBAAiB,CAAC,GAAG,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC;gBAC1C,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,WAAW,CAAC,CAAC;gBACrC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;gBAE1B,IAAI,YAAY,KAAK,CAAC,IAAI,aAAa,EAAE,CAAC;oBACxC,uBAAuB,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;gBACpC,CAAC;gBAED,IAAI,WAAW,KAAK,CAAC,EAAE,CAAC;oBACtB,IAAI,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;gBACpC,CAAC;gBAED,IAAI,CAAC,aAAa,EAAE,CAAC;oBACnB,IAAI,CAAC,YAAY,CAAC,gBAAgB,EAAE,MAAM,CAAC,CAAC;gBAC9C,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,SAAS,IAAI,CAAC,CAAC;IAEf,aAAa;IACb,OAAO,GAAG,EAAE;QACV,KAAK,MAAM,OAAO,IAAI,cAAc,EAAE,CAAC;YACrC,MAAM,mBAAmB,GAAG,iBAAiB,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;YAChE,MAAM,YAAY,GAAG,mBAAmB,GAAG,CAAC,CAAC;YAC7C,MAAM,WAAW,GAAG,CAAC,aAAa,CAAC,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;YAE1D,iBAAiB,CAAC,GAAG,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC;YAC7C,aAAa,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;YAExC,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,IAAI,CAAC,uBAAuB,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE,CAAC;oBAC1C,OAAO,CAAC,eAAe,CAAC,gBAAgB,CAAC,CAAC;gBAC5C,CAAC;gBAED,uBAAuB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;YAC1C,CAAC;YAED,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,OAAO,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;YACtC,CAAC;QACH,CAAC;QAED,SAAS,IAAI,CAAC,CAAC;QAEf,WAAW;QACX,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,iBAAiB,GAAG,IAAI,OAAO,EAAE,CAAC;YAClC,uBAAuB,GAAG,IAAI,OAAO,EAAE,CAAC;YACxC,aAAa,GAAG,IAAI,OAAO,EAAE,CAAC;QAChC,CAAC;IACH,CAAC,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAS,qBAAqB,CAAC,aAAwB;IACrD,MAAM,IAAI,GAAG,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;IAElD;;;OAGG;IACH,MAAM,eAAe,GAAG,KAAK,CAAC,IAAI,CAChC,IAAI,CAAC,gBAAgB,CAAC,qBAAqB,CAAC,CAC7C,CAAC;IAEF,OAAO,sBAAsB,CAAC,aAAa,CAAC,MAAM,CAAC,eAAe,CAAC,EAAE,IAAI,CAAC,CAAC;AAC7E,CAAC;AAED,OAAO,EAAE,qBAAqB,EAAE,CAAC"}

package/esm/util/hooks/descendants/useDescendant.js

@@ -31,9 +31,12 @@ export function createDescendantContext() {
             return () => {
                 if (!ref.current)
                     return;
+                // eslint-disable-next-line react-hooks/exhaustive-deps
                 descendants.unregister(ref.current);
             };
+            // eslint-disable-next-line react-hooks/exhaustive-deps
         }, []);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
         useClientLayoutEffect(() => {
             if (!ref.current)
                 return;

package/esm/util/hooks/descendants/useDescendant.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDescendant.js","sourceRoot":"","sources":["../../../../src/util/hooks/descendants/useDescendant.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAqB,kBAAkB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B;;GAEG;AACH,MAAM,UAAU,uBAAuB;IAIrC,MAAM,CAAC,0BAA0B,EAAE,qBAAqB,CAAC,GAAG,aAAa,CAEvE;QACA,IAAI,EAAE,qBAAqB;QAC3B,YAAY,EACV,+DAA+D;KAClE,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,IAAI,CAC1B,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,oBAAC,0BAA0B,oBAAK,KAAK,CAAC,KAAK,GACxC,KAAK,CAAC,QAAQ,CACY,CAC9B,CACF,CAAC;IAEF;;;;;;OAMG;IACH,SAAS,aAAa,CAAC,OAA8B;QACnD,MAAM,WAAW,GAAG,qBAAqB,EAAE,CAAC;QAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QACvC,MAAM,GAAG,GAAG,MAAM,CAAI,IAAI,CAAC,CAAC;QAE5B,qBAAqB,CAAC,GAAG,EAAE;YACzB,OAAO,GAAG,EAAE;gBACV,IAAI,CAAC,GAAG,CAAC,OAAO;oBAAE,OAAO;gBACzB,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC;QACJ,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,qBAAqB,CAAC,GAAG,EAAE;YACzB,IAAI,CAAC,GAAG,CAAC,OAAO;gBAAE,OAAO;YACzB,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;YACpD,IAAI,KAAK,KAAK,SAAS,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC;gBACpD,QAAQ,CAAC,SAAS,CAAC,CAAC;YACtB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,MAAM,WAAW,GAAG,OAAO;YACzB,CAAC,CAAC,IAAI,CAAuB,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YAC3D,CAAC,CAAC,IAAI,CAAuB,WAAW,CAAC,QAAQ,CAAC,CAAC;QAErD,OAAO;YACL,WAAW;YACX,KAAK;YACL,YAAY,EAAE,WAAW,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC;YACrD,QAAQ,EAAE,SAAS,CAAC,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;SACxC,CAAC;IACJ,CAAC;IAED;;;OAGG;IACH,SAAS,cAAc;QACrB,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,kBAAkB,EAAQ,CAAC,CAAC,OAAO,CAAC;QAEnE,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,OAAO;QACL,mBAAmB;QACnB,eAAe;QACf,+CAA+C;QAC/C,qBAAqB;QACrB,8EAA8E;QAC9E,cAAc;QACd,+BAA+B;QAC/B,aAAa;KACL,CAAC;AACb,CAAC"}
+{"version":3,"file":"useDescendant.js","sourceRoot":"","sources":["../../../../src/util/hooks/descendants/useDescendant.tsx"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAC;AACrD,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,EAAqB,kBAAkB,EAAE,MAAM,cAAc,CAAC;AACrE,OAAO,EAAE,IAAI,EAAE,MAAM,SAAS,CAAC;AAE/B;;GAEG;AACH,MAAM,UAAU,uBAAuB;IAIrC,MAAM,CAAC,0BAA0B,EAAE,qBAAqB,CAAC,GAAG,aAAa,CAEvE;QACA,IAAI,EAAE,qBAAqB;QAC3B,YAAY,EACV,+DAA+D;KAClE,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,IAAI,CAC1B,CAAC,KAAK,EAAE,EAAE,CAAC,CACT,oBAAC,0BAA0B,oBAAK,KAAK,CAAC,KAAK,GACxC,KAAK,CAAC,QAAQ,CACY,CAC9B,CACF,CAAC;IAEF;;;;;;OAMG;IACH,SAAS,aAAa,CAAC,OAA8B;QACnD,MAAM,WAAW,GAAG,qBAAqB,EAAE,CAAC;QAC5C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QACvC,MAAM,GAAG,GAAG,MAAM,CAAI,IAAI,CAAC,CAAC;QAE5B,qBAAqB,CAAC,GAAG,EAAE;YACzB,OAAO,GAAG,EAAE;gBACV,IAAI,CAAC,GAAG,CAAC,OAAO;oBAAE,OAAO;gBACzB,uDAAuD;gBACvD,WAAW,CAAC,UAAU,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;YACtC,CAAC,CAAC;YACF,uDAAuD;QACzD,CAAC,EAAE,EAAE,CAAC,CAAC;QAEP,uDAAuD;QACvD,qBAAqB,CAAC,GAAG,EAAE;YACzB,IAAI,CAAC,GAAG,CAAC,OAAO;gBAAE,OAAO;YACzB,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;YACpD,IAAI,KAAK,KAAK,SAAS,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,CAAC;gBACpD,QAAQ,CAAC,SAAS,CAAC,CAAC;YACtB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,MAAM,WAAW,GAAG,OAAO;YACzB,CAAC,CAAC,IAAI,CAAuB,WAAW,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC;YAC3D,CAAC,CAAC,IAAI,CAAuB,WAAW,CAAC,QAAQ,CAAC,CAAC;QAErD,OAAO;YACL,WAAW;YACX,KAAK;YACL,YAAY,EAAE,WAAW,CAAC,cAAc,CAAC,GAAG,CAAC,OAAO,CAAC;YACrD,QAAQ,EAAE,SAAS,CAAC,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;SACxC,CAAC;IACJ,CAAC;IAED;;;OAGG;IACH,SAAS,cAAc;QACrB,MAAM,WAAW,GAAG,MAAM,CAAC,IAAI,kBAAkB,EAAQ,CAAC,CAAC,OAAO,CAAC;QAEnE,OAAO,WAAW,CAAC;IACrB,CAAC;IAED,OAAO;QACL,mBAAmB;QACnB,eAAe;QACf,+CAA+C;QAC/C,qBAAqB;QACrB,8EAA8E;QAC9E,cAAc;QACd,+BAA+B;QAC/B,aAAa;KACL,CAAC;AACb,CAAC"}

package/esm/util/hooks/useLatestRef.js

@@ -4,6 +4,7 @@ import { useRefWithInit } from "./useRefWithInit.js";
 export function useLatestRef(value) {
     const latest = useRefWithInit(createLatestRef, value).current;
     latest.next = value;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     useClientLayoutEffect(latest.effect);
     return latest;
 }

package/esm/util/hooks/useLatestRef.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLatestRef.js","sourceRoot":"","sources":["../../../src/util/hooks/useLatestRef.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,UAAU,YAAY,CAAI,KAAQ;IACtC,MAAM,MAAM,GAAG,cAAc,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,OAAQ,CAAC;IAE/D,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC;IAEpB,qBAAqB,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IAErC,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,eAAe,CAAI,KAAQ;IAClC,MAAM,MAAM,GAAG;QACb,OAAO,EAAE,KAAK;QACd,IAAI,EAAE,KAAK;QACX,MAAM,EAAE,GAAG,EAAE;YACX,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC;QAC/B,CAAC;KACF,CAAC;IACF,OAAO,MAAM,CAAC;AAChB,CAAC"}
+{"version":3,"file":"useLatestRef.js","sourceRoot":"","sources":["../../../src/util/hooks/useLatestRef.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,UAAU,YAAY,CAAI,KAAQ;IACtC,MAAM,MAAM,GAAG,cAAc,CAAC,eAAe,EAAE,KAAK,CAAC,CAAC,OAAQ,CAAC;IAE/D,MAAM,CAAC,IAAI,GAAG,KAAK,CAAC;IAEpB,uDAAuD;IACvD,qBAAqB,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;IAErC,OAAO,MAAM,CAAC;AAChB,CAAC;AAED,SAAS,eAAe,CAAI,KAAQ;IAClC,MAAM,MAAM,GAAG;QACb,OAAO,EAAE,KAAK;QACd,IAAI,EAAE,KAAK;QACX,MAAM,EAAE,GAAG,EAAE;YACX,MAAM,CAAC,OAAO,GAAG,MAAM,CAAC,IAAI,CAAC;QAC/B,CAAC;KACF,CAAC;IACF,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "7.32.2",
+  "version": "7.32.4",
   "description": "React components from the Norwegian Labour and Welfare Administration.",
   "author": "Aksel, a team part of the Norwegian Labour and Welfare Administration.",
   "license": "MIT",
@@ -643,15 +643,15 @@
     "clean": "rimraf cjs esm",
     "build": "yarn i18n-jsdoc && concurrently \"tsc -p tsconfig.build.json\" \"tsc -p tsconfig.esm.json && tsc-alias -p tsconfig.esm.json && yarn write-packagejson\" && yarn i18n-jsdoc --cleanup && yarn copy-types",
     "watch": "tsc --watch -p tsconfig.esm.json",
-    "test": "TZ=UTC vitest run -c tests/vitest.config.ts --silent",
+    "test": "TZ=UTC vitest run -c tests/vitest.config.ts",
     "test:watch": "TZ=UTC vitest watch -c tests/vitest.config.ts",
     "copy-types": "copyfiles -f ./src/types/theme.d.ts ./esm/types"
   },
   "dependencies": {
     "@floating-ui/react": "0.27.8",
     "@floating-ui/react-dom": "^2.1.6",
-    "@navikt/aksel-icons": "^7.32.2",
-    "@navikt/ds-tokens": "^7.32.2",
+    "@navikt/aksel-icons": "^7.32.4",
+    "@navikt/ds-tokens": "^7.32.4",
     "clsx": "^2.1.0",
     "date-fns": "^4.0.0",
     "react-day-picker": "9.7.0"

package/src/accordion/AccordionHeader.tsx

@@ -33,7 +33,7 @@ const AccordionHeader = forwardRef<HTMLButtonElement, AccordionHeaderProps>(
 
     if (themeContext?.isDarkside) {
       /* Fallback to "medium" Accordion-size if any other sizes are used */
-      headingSize = accordionContext?.size === "small" ? "xsmall" : "small";
+      headingSize = accordionContext?.size === "large" ? "small" : "xsmall";
     }
 
     return (

package/src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx

@@ -13,6 +13,10 @@ const useTextHighlight = (text: string, searchTerm: string) => {
   const indexOfHighlightedText = text
     .toLowerCase()
     .indexOf(searchTerm.toLowerCase());
+  if (indexOfHighlightedText === -1) {
+    // This can happen if the consumer has implemented their own filtering logic
+    return [text, "", ""];
+  }
   const start = text.substring(0, indexOfHighlightedText);
   const highlight = text.substring(
     indexOfHighlightedText,

package/src/form/combobox/Input/ToggleListButton.tsx

@@ -12,7 +12,8 @@ export const ToggleListButton = forwardRef<HTMLDivElement>((_, ref) => {
   return (
     <div
       ref={ref}
-      onClick={() => {
+      onClick={(event) => {
+        event.stopPropagation();
         toggleIsListOpen();
         focusInput();
       }}

package/src/form/combobox/__tests__/combobox.test.tsx

@@ -1,5 +1,4 @@
-/* eslint-disable testing-library/no-unnecessary-act -- https://kentcdodds.com/blog/fix-the-not-wrapped-in-act-warning */
-import { act, render, screen } from "@testing-library/react";
+import { render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import React from "react";
 import { describe, expect, test, vi } from "vitest";
@@ -40,34 +39,20 @@ describe("Render combobox", () => {
     test("Should be able to search, select and remove selections", async () => {
       render(<App isMultiSelect options={options} />);
 
-      await act(async () => {
-        await userEvent.click(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-        );
-      });
-      await act(async () => {
-        await userEvent.type(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-          "apple",
-        );
-      });
-      await act(async () => {
-        await userEvent.click(
-          await screen.findByRole("option", { name: "apple" }),
-        );
+      const input = screen.getByRole("combobox", {
+        name: "Hva er dine favorittfrukter?",
       });
+      await userEvent.click(input);
+      await userEvent.type(input, "apple");
+      await userEvent.click(
+        await screen.findByRole("option", { name: "apple" }),
+      );
       expect(
         await screen.findByRole("option", { name: "apple", selected: true }),
       ).toBeInTheDocument();
-      await act(async () => {
-        await userEvent.click(
-          await screen.findByRole("button", { name: "apple slett" }),
-        );
-      });
+      await userEvent.click(
+        await screen.findByRole("button", { name: "apple slett" }),
+      );
     });
   });
 
@@ -81,24 +66,14 @@ describe("Render combobox", () => {
     test("Should not select previous focused element when closes", async () => {
       render(<App options={options} />);
 
-      await act(async () => {
-        await userEvent.click(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-        );
-      });
-      await act(async () => {
-        await userEvent.type(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-          "ban",
-        );
-        await userEvent.keyboard("{ArrowDown}");
-        await userEvent.keyboard("{ArrowUp}");
-        await userEvent.keyboard("{Enter}");
+      const input = screen.getByRole("combobox", {
+        name: "Hva er dine favorittfrukter?",
       });
+      await userEvent.click(input);
+      await userEvent.type(input, "ban");
+      await userEvent.keyboard("{ArrowDown}");
+      await userEvent.keyboard("{ArrowUp}");
+      await userEvent.keyboard("{Enter}");
 
       expect(screen.queryByRole("button", { name: "banana slett" })).toBeNull();
     });
@@ -106,24 +81,14 @@ describe("Render combobox", () => {
     test("Should reset list when resetting input (ESC)", async () => {
       render(<App options={options} />);
 
-      await act(async () => {
-        await userEvent.click(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-        );
-      });
-      await act(async () => {
-        await userEvent.type(
-          screen.getByRole("combobox", {
-            name: "Hva er dine favorittfrukter?",
-          }),
-          "apple",
-        );
-        await userEvent.keyboard("{ArrowDown}");
-        await userEvent.keyboard("{Escape}");
-        await userEvent.keyboard("{ArrowDown}");
+      const input = screen.getByRole("combobox", {
+        name: "Hva er dine favorittfrukter?",
       });
+      await userEvent.click(input);
+      await userEvent.type(input, "apple");
+      await userEvent.keyboard("{ArrowDown}");
+      await userEvent.keyboard("{Escape}");
+      await userEvent.keyboard("{ArrowDown}");
 
       expect(
         await screen.findByRole("option", { name: "banana" }),
@@ -145,13 +110,11 @@ describe("Render combobox", () => {
       );
 
       expect(screen.getByRole("combobox")).toBeInTheDocument();
-      const bananaOption = screen.getByRole("option", {
+      const option = screen.getByRole("option", {
         name: "Hjelpemidler [HJE]",
         selected: false,
       });
-      await act(async () => {
-        await userEvent.click(bananaOption);
-      });
+      await userEvent.click(option);
       expect(onToggleSelected).toHaveBeenCalledWith("HJE", true, false);
       expect(
         screen.getByRole("option", {
@@ -175,10 +138,8 @@ describe("Render combobox", () => {
       const combobox = screen.getByRole("combobox");
       expect(combobox).toBeInTheDocument();
 
-      await act(async () => {
-        await userEvent.click(combobox);
-        await userEvent.type(combobox, "Lemon");
-      });
+      await userEvent.click(combobox);
+      await userEvent.type(combobox, "Lemon");
       expect(onChange).toHaveBeenNthCalledWith(1, "L");
       expect(onChange).toHaveBeenNthCalledWith(2, "Le");
       expect(onChange).toHaveBeenNthCalledWith(3, "Lem");
@@ -205,13 +166,11 @@ describe("Render combobox", () => {
       const combobox = screen.getByRole("combobox");
       expect(combobox).toBeInTheDocument();
 
-      await act(async () => {
-        await userEvent.click(combobox);
-        await userEvent.type(combobox, "Syke");
-        await userEvent.keyboard("{ArrowRight}");
-        await userEvent.keyboard("{ArrowDown}");
-        await userEvent.keyboard("{Enter}");
-      });
+      await userEvent.click(combobox);
+      await userEvent.type(combobox, "Syke");
+      await userEvent.keyboard("{ArrowRight}");
+      await userEvent.keyboard("{ArrowDown}");
+      await userEvent.keyboard("{Enter}");
       expect(onChange).toHaveBeenNthCalledWith(1, "S");
       expect(onChange).toHaveBeenNthCalledWith(2, "Sy");
       expect(onChange).toHaveBeenNthCalledWith(3, "Syk");
@@ -228,18 +187,14 @@ describe("Render combobox", () => {
   });
 
   describe("search", () => {
-    test("should find matched anywhere in the label", async () => {
+    test("should find matches anywhere in the label", async () => {
       render(<App options={options} />);
 
       const combobox = screen.getByRole("combobox", {
         name: "Hva er dine favorittfrukter?",
       });
-
-      await act(async () => {
-        await userEvent.click(combobox);
-
-        await userEvent.type(combobox, "p");
-      });
+      await userEvent.click(combobox);
+      await userEvent.type(combobox, "p");
 
       const searchHits = [
         "apple",
@@ -273,18 +228,12 @@ describe("Render combobox", () => {
       const combobox = screen.getByRole("combobox", {
         name: "Hva er dine favorittfrukter?",
       });
-
-      await act(async () => {
-        await userEvent.click(combobox);
-
-        await userEvent.type(combobox, "p");
-      });
+      await userEvent.click(combobox);
+      await userEvent.type(combobox, "p");
 
       expect(combobox.getAttribute("value")).toBe("passion fruit");
 
-      await act(async () => {
-        await userEvent.keyboard("{Enter}");
-      });
+      await userEvent.keyboard("{Enter}");
 
       expect(onToggleSelected).toHaveBeenCalledWith(
         "passion fruit",
@@ -310,20 +259,14 @@ describe("Render combobox", () => {
       const combobox = screen.getByRole("combobox", {
         name: "Hva er dine favorittfrukter?",
       });
-
-      await act(async () => {
-        await userEvent.click(combobox);
-
-        await userEvent.type(combobox, "p");
-      });
+      await userEvent.click(combobox);
+      await userEvent.type(combobox, "p");
 
       expect(combobox.getAttribute("value")).toBe(
         "passion fruit (passion fruit)",
       );
 
-      await act(async () => {
-        await userEvent.keyboard("{Enter}");
-      });
+      await userEvent.keyboard("{Enter}");
 
       expect(onToggleSelected).toHaveBeenCalledWith(
         "passion fruit",
@@ -342,9 +285,7 @@ describe("Render combobox", () => {
       });
 
       const pressKey = async (key: string) => {
-        await act(async () => {
-          await userEvent.keyboard(`{${key}}`);
-        });
+        await userEvent.keyboard(`{${key}}`);
       };
 
       const hasVirtualFocus = (option: string) =>
@@ -352,9 +293,7 @@ describe("Render combobox", () => {
           screen.getByRole("option", { name: option }).id,
         );
 
-      await act(async () => {
-        await userEvent.click(combobox);
-      });
+      await userEvent.click(combobox);
 
       await pressKey("ArrowDown");
       hasVirtualFocus("apple");

package/src/form/switch/Switch.tsx

@@ -124,14 +124,14 @@ export const Switch = forwardRef<HTMLInputElement, SwitchProps>(
           htmlFor={inputProps.id}
           className={cn("navds-switch__label-wrapper")}
         >
-          <div
+          <span
             className={cn("navds-switch__content", {
               "navds-sr-only": hideLabel,
               "navds-switch--with-description": description && !hideLabel,
             })}
           >
             <BodyShort
-              as="div"
+              as="span"
               size={size}
               className={cn("navds-switch__label")}
             >
@@ -141,7 +141,7 @@ export const Switch = forwardRef<HTMLInputElement, SwitchProps>(
             {description && (
               <BodyShort
                 size={size}
-                as="div"
+                as="span"
                 className={cn(
                   "navds-form-field__subdescription navds-switch__description",
                 )}
@@ -149,7 +149,7 @@ export const Switch = forwardRef<HTMLInputElement, SwitchProps>(
                 {description}
               </BodyShort>
             )}
-          </div>
+          </span>
         </label>
       </div>
     );

package/src/popover/Popover.tsx

@@ -148,7 +148,7 @@ export const Popover = forwardRef<HTMLDivElement, PopoverProps>(
 
     useClientLayoutEffect(() => {
       refs.setReference(anchorEl);
-    }, [anchorEl]);
+    }, [anchorEl, refs]);
 
     const floatingRef = useMergeRefs(refs.setFloating, ref);