@dnb/eufemia 10.37.0 → 10.39.0

package/components/height-animation/useHeightAnimation.js

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useMemo, useRef, useState } from 'react';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
 import HeightAnimationInstance from './HeightAnimationInstance';
 const useLayoutEffect = typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect;
 export function useHeightAnimation(targetRef) {
@@ -9,6 +9,7 @@ export function useHeightAnimation(targetRef) {
     open = true,
     animate = true,
     children = null,
+    compensateForGap,
     onInit = null,
     onOpen = null,
     onAnimationStart = null,
@@ -20,9 +21,20 @@ export function useHeightAnimation(targetRef) {
   const [isVisible, setIsVisible] = useState(false);
   const [isAnimating, setIsAnimating] = useState(false);
   const [isVisibleParallax, setParallax] = useState(open);
+  const eventsRef = useRef({
+    onInit,
+    onAnimationEnd,
+    onAnimationStart,
+    onOpen
+  });
+  eventsRef.current.onInit = onInit;
+  eventsRef.current.onAnimationEnd = onAnimationEnd;
+  eventsRef.current.onAnimationStart = onAnimationStart;
+  eventsRef.current.onOpen = onOpen;
   useLayoutEffect(() => {
+    var _eventsRef$current$on, _eventsRef$current;
     instRef.current = new HeightAnimationInstance();
-    onInit === null || onInit === void 0 ? void 0 : onInit(instRef.current);
+    (_eventsRef$current$on = (_eventsRef$current = eventsRef.current).onInit) === null || _eventsRef$current$on === void 0 ? void 0 : _eventsRef$current$on.call(_eventsRef$current, instRef.current);
     return () => {
       var _instRef$current;
       (_instRef$current = instRef.current) === null || _instRef$current === void 0 ? void 0 : _instRef$current.remove();
@@ -39,10 +51,25 @@ export function useHeightAnimation(targetRef) {
       });
     }
   }, [animate]);
+  const handleCompensateForGap = useCallback(() => {
+    if (compensateForGap) {
+      let gap = compensateForGap;
+      const {
+        elem
+      } = instRef.current;
+      if (compensateForGap === 'auto') {
+        gap = window.getComputedStyle(elem.parentElement).getPropertyValue('row-gap');
+      }
+      elem.style.marginTop = `calc(${gap} * -1)`;
+      const inner = elem.querySelector('.compensateForGap');
+      inner.style.marginTop = gap;
+    }
+  }, [compensateForGap]);
   useLayoutEffect(() => {
     instRef.current.onStart(state => {
       switch (state) {
         case 'opening':
+          handleCompensateForGap();
           setIsVisible(true);
           setParallax(true);
           setIsAnimating(true);
@@ -56,33 +83,36 @@ export function useHeightAnimation(targetRef) {
           break;
       }
       if (!isInitialRenderRef.current) {
-        onAnimationStart === null || onAnimationStart === void 0 ? void 0 : onAnimationStart(state);
+        var _eventsRef$current$on2, _eventsRef$current2;
+        (_eventsRef$current$on2 = (_eventsRef$current2 = eventsRef.current).onAnimationStart) === null || _eventsRef$current$on2 === void 0 ? void 0 : _eventsRef$current$on2.call(_eventsRef$current2, state);
       }
     });
     instRef.current.onEnd(state => {
+      var _eventsRef$current$on3, _eventsRef$current3, _eventsRef$current$on4, _eventsRef$current4;
       switch (state) {
         case 'opened':
           setIsVisible(true);
           setIsOpen(true);
           setIsAnimating(false);
-          onOpen === null || onOpen === void 0 ? void 0 : onOpen(true);
+          (_eventsRef$current$on3 = (_eventsRef$current3 = eventsRef.current).onOpen) === null || _eventsRef$current$on3 === void 0 ? void 0 : _eventsRef$current$on3.call(_eventsRef$current3, true);
           break;
         case 'closed':
           setIsVisible(false);
           setIsOpen(false);
           setParallax(false);
           setIsAnimating(false);
-          onOpen === null || onOpen === void 0 ? void 0 : onOpen(false);
+          (_eventsRef$current$on4 = (_eventsRef$current4 = eventsRef.current).onOpen) === null || _eventsRef$current$on4 === void 0 ? void 0 : _eventsRef$current$on4.call(_eventsRef$current4, false);
           break;
         case 'adjusted':
           setIsAnimating(false);
           break;
       }
       if (!isInitialRenderRef.current) {
-        onAnimationEnd === null || onAnimationEnd === void 0 ? void 0 : onAnimationEnd(state);
+        var _eventsRef$current$on5, _eventsRef$current5;
+        (_eventsRef$current$on5 = (_eventsRef$current5 = eventsRef.current).onAnimationEnd) === null || _eventsRef$current$on5 === void 0 ? void 0 : _eventsRef$current$on5.call(_eventsRef$current5, state);
       }
     });
-  }, []);
+  }, [compensateForGap, handleCompensateForGap]);
   useOpenClose({
     open,
     instRef,

package/components/height-animation/useHeightAnimation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useHeightAnimation.js","names":["React","useMemo","useRef","useState","HeightAnimationInstance","useLayoutEffect","window","useEffect","useHeightAnimation","targetRef","_instRef$current2","open","animate","children","onInit","onOpen","onAnimationStart","onAnimationEnd","arguments","length","undefined","instRef","isInitialRenderRef","globalThis","readjustTime","isOpen","setIsOpen","isVisible","setIsVisible","isAnimating","setIsAnimating","isVisibleParallax","setParallax","current","_instRef$current","remove","setOptions","global","IS_TEST","onStart","state","onEnd","useOpenClose","useAdjust","firstPaintStyle","isInDOM","_ref","isTest","process","env","NODE_ENV","setElement","setAsOpen","setAsClosed","close","_targetRef$current","event","CustomEvent","dispatchEvent","run","bypassTime","_window$requestAnimat","_window","requestAnimationFrame","call","_ref2","fromHeight","timer","Date","now","shouldAdjust","_instRef$current3","_instRef$current4","getHeight","elem","style","height","toHeight","adjustTo"],"sources":["../../../../src/components/height-animation/useHeightAnimation.tsx"],"sourcesContent":["import React, { useMemo, useRef, useState } from 'react'\nimport HeightAnimationInstance from './HeightAnimationInstance'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type useHeightAnimationOptions = {\n  /**\n   * Set to `true`, when initially `false` was given, to animate from 0px to auto.\n   * Default: true\n   */\n  open?: boolean\n\n  /**\n   * Set to `false` to omit the animation.\n   * Default: true\n   */\n  animate?: boolean\n\n  /**\n   * In order to let the Hook know when children has changed\n   */\n  children?: React.ReactNode | HTMLElement\n\n  /**\n   * Is called once before mounting the component (useLayoutEffect)\n   */\n  onInit?: (instance: HeightAnimationInstance) => void\n\n  /**\n   * Is called when fully opened or closed\n   */\n  onOpen?: (isOpen: boolean) => void\n\n  /**\n   * Is called when animation has started.\n   */\n  onAnimationStart?: (state: HeightAnimationOnStartTypes) => void\n\n  /**\n   * Is called when animation is done and the full height is reached.\n   */\n  onAnimationEnd?: (state: HeightAnimationOnEndTypes) => void\n}\n\nexport type HeightAnimationOnStartTypes =\n  | 'opening'\n  | 'closing'\n  | 'adjusting'\n\nexport type HeightAnimationOnEndTypes = 'opened' | 'closed' | 'adjusted'\n\nexport function useHeightAnimation(\n  targetRef: React.RefObject<HTMLElement>,\n  {\n    open = true,\n    animate = true,\n    children = null,\n    onInit = null,\n    onOpen = null,\n    onAnimationStart = null,\n    onAnimationEnd = null,\n  }: useHeightAnimationOptions = {}\n) {\n  const instRef = useRef<HeightAnimationInstance>(null)\n  const isInitialRenderRef = useRef(\n    typeof globalThis !== 'undefined'\n      ? globalThis.readjustTime !== -1\n      : true\n  )\n\n  const [isOpen, setIsOpen] = useState(open)\n  const [isVisible, setIsVisible] = useState(false)\n  const [isAnimating, setIsAnimating] = useState(false)\n  const [isVisibleParallax, setParallax] = useState(open)\n\n  useLayoutEffect(() => {\n    instRef.current = new HeightAnimationInstance()\n    onInit?.(instRef.current)\n    return () => {\n      instRef.current?.remove()\n      instRef.current = null\n    }\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useLayoutEffect(() => {\n    instRef.current.setOptions({ animate })\n\n    if (typeof global !== 'undefined' && globalThis.IS_TEST) {\n      instRef.current.setOptions({ animate: false })\n    }\n  }, [animate])\n\n  useLayoutEffect(() => {\n    instRef.current.onStart((state: HeightAnimationOnStartTypes) => {\n      switch (state) {\n        case 'opening':\n          setIsVisible(true)\n          setParallax(true)\n          setIsAnimating(true)\n          break\n\n        case 'closing':\n          setParallax(false)\n          setIsAnimating(true)\n          break\n\n        case 'adjusting':\n          setIsAnimating(true)\n          break\n      }\n\n      if (!isInitialRenderRef.current) {\n        onAnimationStart?.(state)\n      }\n    })\n\n    instRef.current.onEnd((state: HeightAnimationOnEndTypes) => {\n      switch (state) {\n        case 'opened':\n          setIsVisible(true)\n          setIsOpen(true)\n          setIsAnimating(false)\n          onOpen?.(true)\n          break\n\n        case 'closed':\n          setIsVisible(false)\n          setIsOpen(false)\n          setParallax(false)\n          setIsAnimating(false)\n          onOpen?.(false)\n          break\n\n        case 'adjusted':\n          setIsAnimating(false)\n          break\n      }\n\n      if (!isInitialRenderRef.current) {\n        onAnimationEnd?.(state)\n      }\n    })\n  }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useOpenClose({ open, instRef, isInitialRenderRef, targetRef })\n  useAdjust({ children, instRef, isInitialRenderRef, targetRef })\n\n  /**\n   * Returns the first paint style, to be used for the initial render,\n   * to avoid flickering.\n   */\n  const firstPaintStyle:\n    | typeof instRef.current.firstPaintStyle\n    | Record<string, never> =\n    (open &&\n      !isVisible &&\n      !isAnimating &&\n      instRef.current?.firstPaintStyle) ||\n    {}\n  const isInDOM = open || isVisible\n\n  return {\n    open,\n    isOpen,\n    isInDOM,\n    isVisible,\n    isVisibleParallax,\n    isAnimating,\n    firstPaintStyle,\n  }\n}\n\nfunction useOpenClose({ open, instRef, isInitialRenderRef, targetRef }) {\n  const isTest =\n    typeof process !== 'undefined' &&\n    process.env.NODE_ENV === 'test' &&\n    typeof globalThis.IS_TEST === 'undefined'\n\n  useLayoutEffect(() => {\n    instRef.current.setElement(targetRef.current)\n\n    if (\n      !targetRef.current ||\n      (instRef.current.state === 'init' && isInitialRenderRef.current)\n    ) {\n      if (open) {\n        instRef.current.setAsOpen()\n      } else {\n        instRef.current.setAsClosed()\n      }\n    } else {\n      if (open) {\n        instRef.current.open()\n      } else {\n        instRef.current.close()\n      }\n    }\n\n    // For testing purposes, we need to trigger the transitionend event\n    if (isTest) {\n      const event = new CustomEvent('transitionend')\n      targetRef.current?.dispatchEvent(event)\n    }\n  }, [open, targetRef, instRef, isInitialRenderRef, isTest])\n\n  useLayoutEffect(() => {\n    const run = () => {\n      isInitialRenderRef.current = false\n    }\n    if (globalThis.bypassTime === -1 || isTest) {\n      run()\n    } else {\n      window.requestAnimationFrame?.(run)\n    }\n  }, [isInitialRenderRef, isTest])\n}\n\nfunction useAdjust({ children, instRef, isInitialRenderRef, targetRef }) {\n  const fromHeight = useRef(0)\n\n  const [timer] = useState(() => Date.now())\n\n  /**\n   * Wait for some criteria and a certain time, before we adjust the height,\n   * so it will not run when a open/close animation is running.\n   */\n  const shouldAdjust = () => {\n    switch (instRef.current?.state) {\n      case 'opened':\n      case 'adjusted':\n      case 'adjusting':\n        return (\n          !isInitialRenderRef.current &&\n          Date.now() - timer > (globalThis.readjustTime || 100)\n        )\n    }\n\n    return false\n  }\n\n  useMemo(() => {\n    if (shouldAdjust()) {\n      fromHeight.current = instRef.current?.getHeight()\n    }\n  }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useLayoutEffect(() => {\n    if (shouldAdjust()) {\n      /**\n       * In certain cases, the targetRef.current is outdated, so we need to set it again.\n       * E.g. in Tabs.js, when we switch tabs, the targetRef.current is not updated.\n       */\n      instRef.current.setElement(targetRef.current)\n\n      /**\n       * Ensure we don't have height, while we get the \"toHeight\" again.\n       * We may move this inside of the HeightAnimationInstance class later,\n       * but the \"GlobalStatus\" is currently relying on \"getUnknownHeight\" inside of adjustTo.\n       */\n      instRef.current.elem.style.height = ''\n\n      /**\n       * Use getHeight instead of getUnknownHeight because of the additional,\n       * disturbing DOM manipulation.\n       */\n      const toHeight = instRef.current.getHeight()\n\n      instRef.current.adjustTo(fromHeight.current, toHeight)\n    }\n  }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n}\n"],"mappings":"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"}
+{"version":3,"file":"useHeightAnimation.js","names":["React","useCallback","useMemo","useRef","useState","HeightAnimationInstance","useLayoutEffect","window","useEffect","useHeightAnimation","targetRef","_instRef$current2","open","animate","children","compensateForGap","onInit","onOpen","onAnimationStart","onAnimationEnd","arguments","length","undefined","instRef","isInitialRenderRef","globalThis","readjustTime","isOpen","setIsOpen","isVisible","setIsVisible","isAnimating","setIsAnimating","isVisibleParallax","setParallax","eventsRef","current","_eventsRef$current$on","_eventsRef$current","call","_instRef$current","remove","setOptions","global","IS_TEST","handleCompensateForGap","gap","elem","getComputedStyle","parentElement","getPropertyValue","style","marginTop","inner","querySelector","onStart","state","_eventsRef$current$on2","_eventsRef$current2","onEnd","_eventsRef$current$on3","_eventsRef$current3","_eventsRef$current$on4","_eventsRef$current4","_eventsRef$current$on5","_eventsRef$current5","useOpenClose","useAdjust","firstPaintStyle","isInDOM","_ref","isTest","process","env","NODE_ENV","setElement","setAsOpen","setAsClosed","close","_targetRef$current","event","CustomEvent","dispatchEvent","run","bypassTime","_window$requestAnimat","_window","requestAnimationFrame","_ref2","fromHeight","timer","Date","now","shouldAdjust","_instRef$current3","_instRef$current4","getHeight","height","toHeight","adjustTo"],"sources":["../../../../src/components/height-animation/useHeightAnimation.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useRef, useState } from 'react'\nimport HeightAnimationInstance from './HeightAnimationInstance'\n\n// SSR warning fix: https://gist.github.com/gaearon/e7d97cdf38a2907924ea12e4ebdf3c85\nconst useLayoutEffect =\n  typeof window === 'undefined' ? React.useEffect : React.useLayoutEffect\n\nexport type useHeightAnimationOptions = {\n  /**\n   * Set to `true`, when initially `false` was given, to animate from 0px to auto.\n   * Default: true\n   */\n  open?: boolean\n\n  /**\n   * Set to `false` to omit the animation.\n   * Default: true\n   */\n  animate?: boolean\n\n  /**\n   * To compensate for CSS gap between the rows, so animation does not jump during the animation.\n   * Provide a CSS unit or `var(--row-gap)`.\n   */\n  compensateForGap?: string | 'auto'\n\n  /**\n   * In order to let the Hook know when children has changed\n   */\n  children?: React.ReactNode | HTMLElement\n\n  /**\n   * Is called once before mounting the component (useLayoutEffect)\n   */\n  onInit?: (instance: HeightAnimationInstance) => void\n\n  /**\n   * Is called when fully opened or closed\n   */\n  onOpen?: (isOpen: boolean) => void\n\n  /**\n   * Is called when animation has started.\n   */\n  onAnimationStart?: (state: HeightAnimationOnStartTypes) => void\n\n  /**\n   * Is called when animation is done and the full height is reached.\n   */\n  onAnimationEnd?: (state: HeightAnimationOnEndTypes) => void\n}\n\nexport type HeightAnimationOnStartTypes =\n  | 'opening'\n  | 'closing'\n  | 'adjusting'\n\nexport type HeightAnimationOnEndTypes = 'opened' | 'closed' | 'adjusted'\n\nexport function useHeightAnimation(\n  targetRef: React.RefObject<HTMLElement>,\n  {\n    open = true,\n    animate = true,\n    children = null,\n    compensateForGap,\n    onInit = null,\n    onOpen = null,\n    onAnimationStart = null,\n    onAnimationEnd = null,\n  }: useHeightAnimationOptions = {}\n) {\n  const instRef = useRef<HeightAnimationInstance>(null)\n  const isInitialRenderRef = useRef(\n    typeof globalThis !== 'undefined'\n      ? globalThis.readjustTime !== -1\n      : true\n  )\n\n  const [isOpen, setIsOpen] = useState(open)\n  const [isVisible, setIsVisible] = useState(false)\n  const [isAnimating, setIsAnimating] = useState(false)\n  const [isVisibleParallax, setParallax] = useState(open)\n\n  const eventsRef = useRef({\n    onInit,\n    onAnimationEnd,\n    onAnimationStart,\n    onOpen,\n  })\n  eventsRef.current.onInit = onInit\n  eventsRef.current.onAnimationEnd = onAnimationEnd\n  eventsRef.current.onAnimationStart = onAnimationStart\n  eventsRef.current.onOpen = onOpen\n\n  useLayoutEffect(() => {\n    instRef.current = new HeightAnimationInstance()\n    eventsRef.current.onInit?.(instRef.current)\n    return () => {\n      instRef.current?.remove()\n      instRef.current = null\n    }\n  }, [])\n\n  useLayoutEffect(() => {\n    instRef.current.setOptions({ animate })\n\n    if (typeof global !== 'undefined' && globalThis.IS_TEST) {\n      instRef.current.setOptions({ animate: false })\n    }\n  }, [animate])\n\n  const handleCompensateForGap = useCallback(() => {\n    if (compensateForGap) {\n      let gap = compensateForGap\n      const { elem } = instRef.current\n      if (compensateForGap === 'auto') {\n        gap = window\n          .getComputedStyle(elem.parentElement)\n          .getPropertyValue('row-gap')\n      }\n      elem.style.marginTop = `calc(${gap} * -1)`\n      const inner = elem.querySelector('.compensateForGap') as HTMLElement\n      inner.style.marginTop = gap\n    }\n  }, [compensateForGap])\n\n  useLayoutEffect(() => {\n    instRef.current.onStart((state: HeightAnimationOnStartTypes) => {\n      switch (state) {\n        case 'opening':\n          handleCompensateForGap()\n          setIsVisible(true)\n          setParallax(true)\n          setIsAnimating(true)\n          break\n\n        case 'closing':\n          setParallax(false)\n          setIsAnimating(true)\n          break\n\n        case 'adjusting':\n          setIsAnimating(true)\n          break\n      }\n\n      if (!isInitialRenderRef.current) {\n        eventsRef.current.onAnimationStart?.(state)\n      }\n    })\n\n    instRef.current.onEnd((state: HeightAnimationOnEndTypes) => {\n      switch (state) {\n        case 'opened':\n          setIsVisible(true)\n          setIsOpen(true)\n          setIsAnimating(false)\n          eventsRef.current.onOpen?.(true)\n          break\n\n        case 'closed':\n          setIsVisible(false)\n          setIsOpen(false)\n          setParallax(false)\n          setIsAnimating(false)\n          eventsRef.current.onOpen?.(false)\n          break\n\n        case 'adjusted':\n          setIsAnimating(false)\n          break\n      }\n\n      if (!isInitialRenderRef.current) {\n        eventsRef.current.onAnimationEnd?.(state)\n      }\n    })\n  }, [compensateForGap, handleCompensateForGap])\n\n  useOpenClose({ open, instRef, isInitialRenderRef, targetRef })\n  useAdjust({ children, instRef, isInitialRenderRef, targetRef })\n\n  /**\n   * Returns the first paint style, to be used for the initial render,\n   * to avoid flickering.\n   */\n  const firstPaintStyle:\n    | typeof instRef.current.firstPaintStyle\n    | Record<string, never> =\n    (open &&\n      !isVisible &&\n      !isAnimating &&\n      instRef.current?.firstPaintStyle) ||\n    {}\n  const isInDOM = open || isVisible\n\n  return {\n    open,\n    isOpen,\n    isInDOM,\n    isVisible,\n    isVisibleParallax,\n    isAnimating,\n    firstPaintStyle,\n  }\n}\n\nfunction useOpenClose({ open, instRef, isInitialRenderRef, targetRef }) {\n  const isTest =\n    typeof process !== 'undefined' &&\n    process.env.NODE_ENV === 'test' &&\n    typeof globalThis.IS_TEST === 'undefined'\n\n  useLayoutEffect(() => {\n    instRef.current.setElement(targetRef.current)\n\n    if (\n      !targetRef.current ||\n      (instRef.current.state === 'init' && isInitialRenderRef.current)\n    ) {\n      if (open) {\n        instRef.current.setAsOpen()\n      } else {\n        instRef.current.setAsClosed()\n      }\n    } else {\n      if (open) {\n        instRef.current.open()\n      } else {\n        instRef.current.close()\n      }\n    }\n\n    // For testing purposes, we need to trigger the transitionend event\n    if (isTest) {\n      const event = new CustomEvent('transitionend')\n      targetRef.current?.dispatchEvent(event)\n    }\n  }, [open, targetRef, instRef, isInitialRenderRef, isTest])\n\n  useLayoutEffect(() => {\n    const run = () => {\n      isInitialRenderRef.current = false\n    }\n    if (globalThis.bypassTime === -1 || isTest) {\n      run()\n    } else {\n      window.requestAnimationFrame?.(run)\n    }\n  }, [isInitialRenderRef, isTest])\n}\n\nfunction useAdjust({ children, instRef, isInitialRenderRef, targetRef }) {\n  const fromHeight = useRef(0)\n\n  const [timer] = useState(() => Date.now())\n\n  /**\n   * Wait for some criteria and a certain time, before we adjust the height,\n   * so it will not run when a open/close animation is running.\n   */\n  const shouldAdjust = () => {\n    switch (instRef.current?.state) {\n      case 'opened':\n      case 'adjusted':\n      case 'adjusting':\n        return (\n          !isInitialRenderRef.current &&\n          Date.now() - timer > (globalThis.readjustTime || 100)\n        )\n    }\n\n    return false\n  }\n\n  useMemo(() => {\n    if (shouldAdjust()) {\n      fromHeight.current = instRef.current?.getHeight()\n    }\n  }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n\n  useLayoutEffect(() => {\n    if (shouldAdjust()) {\n      /**\n       * In certain cases, the targetRef.current is outdated, so we need to set it again.\n       * E.g. in Tabs.js, when we switch tabs, the targetRef.current is not updated.\n       */\n      instRef.current.setElement(targetRef.current)\n\n      /**\n       * Ensure we don't have height, while we get the \"toHeight\" again.\n       * We may move this inside of the HeightAnimationInstance class later,\n       * but the \"GlobalStatus\" is currently relying on \"getUnknownHeight\" inside of adjustTo.\n       */\n      instRef.current.elem.style.height = ''\n\n      /**\n       * Use getHeight instead of getUnknownHeight because of the additional,\n       * disturbing DOM manipulation.\n       */\n      const toHeight = instRef.current.getHeight()\n\n      instRef.current.adjustTo(fromHeight.current, toHeight)\n    }\n  }, [children]) // eslint-disable-line react-hooks/exhaustive-deps\n}\n"],"mappings":"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"}

package/components/modal/Modal.js

@@ -344,7 +344,7 @@ class Modal extends React.PureComponent {
         title: title,
         onClick: this.toggleOpenClose,
         innerRef: this._triggerRef,
-        className: classnames('dnb-modal__trigger', createSpacingClasses(props), triggerAttributes.className)
+        className: classnames('dnb-modal__trigger', createSpacingClasses(props), triggerAttributes.className, triggerAttributes.class)
       })), modalActive && modal_content && React.createElement(ModalRoot, _extends({}, rest, {
         id: this._id,
         root_id: root_id,

package/components/modal/Modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.js","names":["React","classnames","SuffixContext","Context","warn","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","processChildren","dispatchCustomElementEvent","createSpacingClasses","HelpButtonInstance","getListOfModalRoots","getModalRoot","ModalInner","ModalHeader","ModalHeaderBar","CloseButton","ModalRoot","classWithCamelCaseProps","ANIMATION_DURATION","Modal","PureComponent","getContent","props","modal_content","getDerivedStateFromProps","state","window","animation_duration","no_animation","open_state","_open_state","hide","modalActive","constructor","_this","this","_defineProperty","preventAutoFocus","event","arguments","length","undefined","showModal","preventDefault","toggleNow","timeoutDuration","parseFloat","isInTransition","doItNow","setState","handleSideEffects","_closeTimeout","setTimeout","waitBeforeOpen","open_delay","delay","_openTimeout","clearTimeout","open_modal","fn","_onUnmount","push","close_modal","toggleOpenClose","setActiveState","_id","_this$_triggerRef","focus","elem","setAttribute","preventScroll","Promise","resolve","removeAttribute","String","_triggerRef","current","activeElement","HTMLElement","then","e","removeActiveState","ifIsLatest","triggeredBy","prevent_close","id","close","list","last","createRef","componentDidMount","openBasedOnStateUpdate","componentWillUnmount","forEach","componentDidUpdate","prevProps","document","documentElement","modalId","render","visualTestsPropsOverride","defaultProps","context","getTranslation","root_id","content_id","disabled","labelled_by","focus_selector","header_content","bar_content","bypass_invalidation_selectors","omit_trigger_button","trigger","trigger_attributes","rest","_objectWithoutProperties","_excluded","children","Object","freeze","_objectSpread","suffixProps","triggerAttributes","hidden","variant","icon_position","fallbackTitle","title","translation","HelpButton","TriggerButton","text","createElement","Fragment","_extends","onClick","innerRef","className","Consumer","spacing","dialog_title","close_title","hide_close_button","close_button_attributes","prevent_core_style","no_animation_on_mobile","fullscreen","min_width","max_width","align_content","container_placement","direct_dom_return","on_open","on_close","on_close_prevent","overlay_class","content_class","OriginalComponent"],"sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["/**\n * Web Modal Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { SuffixContext } from '../../shared/helpers/Suffix'\nimport Context, { ContextProps } from '../../shared/Context'\nimport {\n  warn,\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContextInClassComponent,\n  processChildren,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport HelpButtonInstance from '../help-button/HelpButtonInstance'\nimport { getListOfModalRoots, getModalRoot } from './helpers'\nimport ModalInner from './parts/ModalInner'\nimport { ModalProps } from './types'\n\nimport ModalHeader from './parts/ModalHeader'\nimport ModalHeaderBar from './parts/ModalHeaderBar'\nimport { ScrollViewAllProps } from '../../fragments/scroll-view/ScrollView'\nimport CloseButton from './parts/CloseButton'\nimport ModalRoot from './ModalRoot'\nimport type { SpacingProps } from '../../shared/types'\nimport {\n  classWithCamelCaseProps,\n  ToCamelCasePartial,\n} from '../../shared/helpers/withCamelCaseProps'\nimport type { ButtonProps } from '../button/Button'\n\nexport const ANIMATION_DURATION = 300\n\ninterface ModalState {\n  hide: boolean\n  modalActive: boolean\n  preventAutoFocus: boolean\n}\n\nexport type ModalPropTypes = ModalProps &\n  SpacingProps &\n  Omit<ScrollViewAllProps, 'children'>\n\nclass Modal extends React.PureComponent<\n  ModalPropTypes & ToCamelCasePartial<ModalPropTypes>,\n  ModalState\n> {\n  static contextType = Context\n\n  context!: ContextProps\n\n  static Bar = ModalHeaderBar\n  static Header = ModalHeader\n  static Content = ModalInner\n\n  static getContent(props) {\n    if (typeof props.modal_content === 'string') {\n      return props.modal_content\n    } else if (typeof props.modal_content === 'function') {\n      return props.modal_content(props)\n    }\n    return processChildren(props)\n  }\n\n  _id: string\n  _triggerRef: React.RefObject<any>\n  _onUnmount: Array<() => void>\n  _openTimeout: NodeJS.Timeout\n  _closeTimeout: NodeJS.Timeout\n  _sideEffectsTimeout: NodeJS.Timeout\n  _tryToOpenTimeout: NodeJS.Timeout\n  activeElement: Element\n  isInTransition: boolean\n\n  state = {\n    hide: false,\n    modalActive: false,\n    preventAutoFocus: true,\n    animation_duration: ANIMATION_DURATION,\n    no_animation: false,\n  }\n\n  static defaultProps = {\n    id: null,\n    focus_selector: null,\n    labelled_by: null,\n    title: null,\n    disabled: null,\n    spacing: true,\n    open_delay: null,\n    content_id: null,\n    dialog_title: 'Vindu',\n    close_title: 'Lukk', // Close Modal Window\n    hide_close_button: false,\n    close_button_attributes: null,\n    prevent_close: false,\n    prevent_core_style: false,\n    animation_duration: ANIMATION_DURATION,\n    no_animation: false,\n    no_animation_on_mobile: false,\n    fullscreen: 'auto',\n    min_width: null,\n    max_width: null,\n    align_content: 'left',\n    container_placement: null,\n    open_state: null,\n    direct_dom_return: false,\n    root_id: 'root',\n    omit_trigger_button: false,\n\n    className: null,\n    children: null,\n\n    on_open: null,\n    on_close: null,\n    on_close_prevent: null,\n    open_modal: null,\n    close_modal: null,\n\n    trigger: null,\n    trigger_attributes: null,\n\n    overlay_class: null,\n    content_class: null,\n\n    modal_content: null,\n    header_content: null,\n    bar_content: null,\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (typeof window !== 'undefined' && window['IS_TEST']) {\n      state.animation_duration = 0\n      state.no_animation = true\n    } else {\n      state.animation_duration = props.animation_duration\n      state.no_animation = props.no_animation\n    }\n\n    if (props.open_state !== state._open_state) {\n      switch (props.open_state) {\n        case 'opened':\n        case true:\n          state.hide = false\n          if (isTrue(state.no_animation)) {\n            state.modalActive = true\n          }\n          break\n        case 'closed':\n        case false:\n          state.hide = true\n          if (isTrue(state.no_animation)) {\n            state.modalActive = false\n          }\n          break\n      }\n    }\n    state._open_state = props.open_state\n\n    return state\n  }\n\n  constructor(props) {\n    super(props)\n    this._id = props.id || makeUniqueId('modal-')\n\n    this._triggerRef = React.createRef()\n\n    this._onUnmount = []\n  }\n\n  componentDidMount() {\n    this.openBasedOnStateUpdate()\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._openTimeout)\n    clearTimeout(this._closeTimeout)\n\n    this.removeActiveState()\n\n    this._onUnmount.forEach((fn) => {\n      if (typeof fn === 'function') {\n        fn()\n      }\n    })\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps !== this.props) {\n      this.openBasedOnStateUpdate()\n    }\n  }\n\n  openBasedOnStateUpdate() {\n    const { hide } = this.state\n    const { open_state } = this.props\n\n    if (!this.activeElement && typeof document !== 'undefined') {\n      this.activeElement = document.activeElement\n    }\n\n    if (!hide && (open_state === 'opened' || open_state === true)) {\n      this.toggleOpenClose(null, true)\n    } else if (hide && (open_state === 'closed' || open_state === false)) {\n      this.toggleOpenClose(null, false)\n    }\n  }\n\n  toggleOpenClose = (event = null, showModal = null) => {\n    if (event && event.preventDefault) {\n      event.preventDefault()\n    }\n\n    const toggleNow = () => {\n      const {\n        animation_duration = ANIMATION_DURATION,\n        no_animation = false,\n      } = this.state\n      const timeoutDuration =\n        typeof animation_duration === 'string'\n          ? parseFloat(animation_duration)\n          : animation_duration\n\n      const modalActive =\n        typeof showModal === 'boolean'\n          ? showModal\n          : !this.state.modalActive\n\n      this.isInTransition = true\n\n      const doItNow = () => {\n        this.setState(\n          {\n            hide: false,\n            modalActive,\n          },\n          () => {\n            this.isInTransition = false\n            this.handleSideEffects()\n          }\n        )\n      }\n\n      if (modalActive === false && !isTrue(no_animation)) {\n        this.setState({\n          hide: true,\n        })\n\n        this._closeTimeout = setTimeout(doItNow, timeoutDuration) // delay because of the animation\n      } else {\n        doItNow()\n      }\n    }\n\n    const waitBeforeOpen = () => {\n      const { open_delay } = this.props\n      const { no_animation } = this.state\n      const delay =\n        typeof open_delay === 'string'\n          ? parseFloat(open_delay)\n          : open_delay\n      if (delay > 0 && !isTrue(no_animation)) {\n        this._openTimeout = setTimeout(toggleNow, delay) // custom delay\n      } else {\n        toggleNow()\n      }\n    }\n\n    clearTimeout(this._closeTimeout)\n    clearTimeout(this._openTimeout)\n\n    const { open_modal } = this.props\n    if (typeof open_modal === 'function') {\n      const fn = open_modal(waitBeforeOpen, this)\n      if (fn) {\n        this._onUnmount.push(fn)\n      }\n    } else {\n      waitBeforeOpen()\n    }\n  }\n\n  handleSideEffects = () => {\n    const { modalActive, preventAutoFocus, animation_duration } =\n      this.state\n    const { close_modal, open_state } = this.props\n\n    if (modalActive) {\n      if (typeof close_modal === 'function') {\n        const fn = close_modal(() => {\n          this.toggleOpenClose(null, false)\n        }, this)\n        if (fn) {\n          this._onUnmount.push(fn)\n        }\n      }\n      this.setActiveState(this._id)\n    } else if (modalActive === false && !preventAutoFocus) {\n      const focus = (elem: HTMLElement) => {\n        // So we can omit showing a Tooltip on the trigger button\n        elem.setAttribute('data-autofocus', 'true')\n        elem.focus({ preventScroll: true })\n\n        return new Promise<void>((resolve) => {\n          setTimeout(\n            () => {\n              elem?.removeAttribute('data-autofocus')\n              resolve()\n            },\n            parseFloat(String(animation_duration)) / 3\n          )\n        })\n      }\n\n      if (this._triggerRef?.current) {\n        focus(this._triggerRef.current)\n      }\n\n      // because the open_state was set to opened, we force\n      if (\n        (open_state === 'opened' || open_state === true) &&\n        this.activeElement instanceof HTMLElement\n      ) {\n        try {\n          focus(this.activeElement).then(() => {\n            this.activeElement = null\n          })\n        } catch (e) {\n          //\n        }\n      }\n\n      this.removeActiveState()\n    }\n\n    if (preventAutoFocus) {\n      this.setState({ preventAutoFocus: false })\n    }\n  }\n\n  open = (e: Event) => {\n    this.toggleOpenClose(e, true)\n  }\n\n  close = (\n    event: Event,\n    { ifIsLatest, triggeredBy = null } = { ifIsLatest: true }\n  ) => {\n    const { prevent_close = false } = this.props\n\n    if (isTrue(prevent_close)) {\n      const id = this._id\n      dispatchCustomElementEvent(this, 'on_close_prevent', {\n        id,\n        event,\n        triggeredBy,\n        close: (e) => {\n          this.toggleOpenClose(e, false)\n        },\n      })\n    } else {\n      if (ifIsLatest) {\n        const list = getListOfModalRoots()\n        if (list.length > 1) {\n          const last = getModalRoot(-1)\n          if (last !== this) {\n            return // stop here\n          }\n        }\n      }\n\n      this.toggleOpenClose(event, false)\n    }\n  }\n\n  removeActiveState() {\n    const last = getModalRoot(-1)\n\n    // If this instance is not the last one,\n    // make the current one to as the active one\n    if (last?._id && last._id !== this._id) {\n      return this.setActiveState(last._id)\n    }\n\n    try {\n      document.documentElement.removeAttribute('data-dnb-modal-active')\n    } catch (e) {\n      warn('Modal: Error on remove \"data-dnb-modal-active\"', e)\n    }\n  }\n\n  /**\n   * Prevent scrolling on the background\n   * But checks if this instance was the last one or not\n   *\n   * @param {string} modalId Will remove the attribute if false is given\n   */\n  setActiveState(modalId: string) {\n    if (!modalId) {\n      warn('Modal: A valid modalId is required')\n    }\n    // prevent scrolling on the background\n    if (typeof document !== 'undefined') {\n      try {\n        document.documentElement.setAttribute(\n          'data-dnb-modal-active',\n          modalId\n        )\n      } catch (e) {\n        warn('Modal: Error on set \"data-dnb-modal-active\"', e)\n      }\n    }\n  }\n\n  render() {\n    const visualTestsPropsOverride =\n      typeof window !== 'undefined' && window['IS_TEST']\n        ? {\n            animation_duration: 0,\n            no_animation: true,\n          }\n        : {}\n\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Modal.defaultProps,\n      this.context.getTranslation(this.props).Modal,\n      this.context.Modal,\n      visualTestsPropsOverride\n    )\n\n    const {\n      root_id = 'root',\n      content_id = null,\n      disabled = null,\n      labelled_by = null,\n      focus_selector = null,\n      header_content = null,\n      bar_content = null,\n      bypass_invalidation_selectors = null,\n\n      id, // eslint-disable-line\n      open_state, // eslint-disable-line\n      open_delay, // eslint-disable-line\n\n      omit_trigger_button = false,\n      trigger = null,\n      trigger_attributes = null,\n      ...rest\n    } = props\n\n    const { hide, modalActive } = this.state\n    const modal_content = Modal.getContent(\n      typeof this.props.children === 'function'\n        ? Object.freeze({ ...this.props, close: this.close })\n        : this.props\n    )\n\n    const render = (suffixProps) => {\n      const triggerAttributes = {\n        hidden: false,\n        variant: 'secondary',\n        icon_position: 'left',\n        ...trigger_attributes,\n      } as ButtonProps\n\n      if (isTrue(disabled)) {\n        triggerAttributes.disabled = true\n      }\n\n      if (triggerAttributes.id) {\n        this._id = triggerAttributes.id\n      }\n\n      let fallbackTitle: string\n      if (triggerAttributes.title) {\n        fallbackTitle = triggerAttributes.title\n      }\n      // in case the modal is used in suffix and no title is given\n      // suffixProps.label is also available, so we could use that too\n      else if (suffixProps) {\n        fallbackTitle = this.context.translation.HelpButton.title\n      }\n\n      const TriggerButton = trigger\n        ? (trigger as React.FC)\n        : HelpButtonInstance\n\n      const title = (\n        !triggerAttributes.text ? rest.title || fallbackTitle : null\n      ) as string\n\n      return (\n        <>\n          {TriggerButton && !isTrue(omit_trigger_button) && (\n            <TriggerButton\n              {...triggerAttributes}\n              id={this._id}\n              title={title}\n              onClick={this.toggleOpenClose}\n              innerRef={this._triggerRef}\n              className={classnames(\n                'dnb-modal__trigger',\n                createSpacingClasses(props),\n                triggerAttributes.className\n              )}\n            />\n          )}\n\n          {modalActive && modal_content && (\n            <ModalRoot\n              {...rest}\n              id={this._id}\n              root_id={root_id}\n              content_id={content_id || `dnb-modal-${this._id}`}\n              labelled_by={labelled_by}\n              focus_selector={focus_selector}\n              modal_content={modal_content}\n              header_content={header_content}\n              bar_content={bar_content}\n              bypass_invalidation_selectors={bypass_invalidation_selectors}\n              close={this.close}\n              hide={hide}\n              title={rest.title || fallbackTitle}\n            />\n          )}\n        </>\n      )\n    }\n\n    return <SuffixContext.Consumer>{render}</SuffixContext.Consumer>\n  }\n}\n\nexport { CloseButton, Modal as OriginalComponent }\n\nexport default classWithCamelCaseProps(Modal)\n"],"mappings":"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"}
+{"version":3,"file":"Modal.js","names":["React","classnames","SuffixContext","Context","warn","isTrue","makeUniqueId","extendPropsWithContextInClassComponent","processChildren","dispatchCustomElementEvent","createSpacingClasses","HelpButtonInstance","getListOfModalRoots","getModalRoot","ModalInner","ModalHeader","ModalHeaderBar","CloseButton","ModalRoot","classWithCamelCaseProps","ANIMATION_DURATION","Modal","PureComponent","getContent","props","modal_content","getDerivedStateFromProps","state","window","animation_duration","no_animation","open_state","_open_state","hide","modalActive","constructor","_this","this","_defineProperty","preventAutoFocus","event","arguments","length","undefined","showModal","preventDefault","toggleNow","timeoutDuration","parseFloat","isInTransition","doItNow","setState","handleSideEffects","_closeTimeout","setTimeout","waitBeforeOpen","open_delay","delay","_openTimeout","clearTimeout","open_modal","fn","_onUnmount","push","close_modal","toggleOpenClose","setActiveState","_id","_this$_triggerRef","focus","elem","setAttribute","preventScroll","Promise","resolve","removeAttribute","String","_triggerRef","current","activeElement","HTMLElement","then","e","removeActiveState","ifIsLatest","triggeredBy","prevent_close","id","close","list","last","createRef","componentDidMount","openBasedOnStateUpdate","componentWillUnmount","forEach","componentDidUpdate","prevProps","document","documentElement","modalId","render","visualTestsPropsOverride","defaultProps","context","getTranslation","root_id","content_id","disabled","labelled_by","focus_selector","header_content","bar_content","bypass_invalidation_selectors","omit_trigger_button","trigger","trigger_attributes","rest","_objectWithoutProperties","_excluded","children","Object","freeze","_objectSpread","suffixProps","triggerAttributes","hidden","variant","icon_position","fallbackTitle","title","translation","HelpButton","TriggerButton","text","createElement","Fragment","_extends","onClick","innerRef","className","class","Consumer","spacing","dialog_title","close_title","hide_close_button","close_button_attributes","prevent_core_style","no_animation_on_mobile","fullscreen","min_width","max_width","align_content","container_placement","direct_dom_return","on_open","on_close","on_close_prevent","overlay_class","content_class","OriginalComponent"],"sources":["../../../../src/components/modal/Modal.tsx"],"sourcesContent":["/**\n * Web Modal Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport { SuffixContext } from '../../shared/helpers/Suffix'\nimport Context, { ContextProps } from '../../shared/Context'\nimport {\n  warn,\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContextInClassComponent,\n  processChildren,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport HelpButtonInstance from '../help-button/HelpButtonInstance'\nimport { getListOfModalRoots, getModalRoot } from './helpers'\nimport ModalInner from './parts/ModalInner'\nimport { ModalProps } from './types'\n\nimport ModalHeader from './parts/ModalHeader'\nimport ModalHeaderBar from './parts/ModalHeaderBar'\nimport { ScrollViewAllProps } from '../../fragments/scroll-view/ScrollView'\nimport CloseButton from './parts/CloseButton'\nimport ModalRoot from './ModalRoot'\nimport type { SpacingProps } from '../../shared/types'\nimport {\n  classWithCamelCaseProps,\n  ToCamelCasePartial,\n} from '../../shared/helpers/withCamelCaseProps'\nimport type { ButtonProps } from '../button/Button'\n\nexport const ANIMATION_DURATION = 300\n\ninterface ModalState {\n  hide: boolean\n  modalActive: boolean\n  preventAutoFocus: boolean\n}\n\nexport type ModalPropTypes = ModalProps &\n  SpacingProps &\n  Omit<ScrollViewAllProps, 'children'>\n\nclass Modal extends React.PureComponent<\n  ModalPropTypes & ToCamelCasePartial<ModalPropTypes>,\n  ModalState\n> {\n  static contextType = Context\n\n  context!: ContextProps\n\n  static Bar = ModalHeaderBar\n  static Header = ModalHeader\n  static Content = ModalInner\n\n  static getContent(props) {\n    if (typeof props.modal_content === 'string') {\n      return props.modal_content\n    } else if (typeof props.modal_content === 'function') {\n      return props.modal_content(props)\n    }\n    return processChildren(props)\n  }\n\n  _id: string\n  _triggerRef: React.RefObject<any>\n  _onUnmount: Array<() => void>\n  _openTimeout: NodeJS.Timeout\n  _closeTimeout: NodeJS.Timeout\n  _sideEffectsTimeout: NodeJS.Timeout\n  _tryToOpenTimeout: NodeJS.Timeout\n  activeElement: Element\n  isInTransition: boolean\n\n  state = {\n    hide: false,\n    modalActive: false,\n    preventAutoFocus: true,\n    animation_duration: ANIMATION_DURATION,\n    no_animation: false,\n  }\n\n  static defaultProps = {\n    id: null,\n    focus_selector: null,\n    labelled_by: null,\n    title: null,\n    disabled: null,\n    spacing: true,\n    open_delay: null,\n    content_id: null,\n    dialog_title: 'Vindu',\n    close_title: 'Lukk', // Close Modal Window\n    hide_close_button: false,\n    close_button_attributes: null,\n    prevent_close: false,\n    prevent_core_style: false,\n    animation_duration: ANIMATION_DURATION,\n    no_animation: false,\n    no_animation_on_mobile: false,\n    fullscreen: 'auto',\n    min_width: null,\n    max_width: null,\n    align_content: 'left',\n    container_placement: null,\n    open_state: null,\n    direct_dom_return: false,\n    root_id: 'root',\n    omit_trigger_button: false,\n\n    className: null,\n    children: null,\n\n    on_open: null,\n    on_close: null,\n    on_close_prevent: null,\n    open_modal: null,\n    close_modal: null,\n\n    trigger: null,\n    trigger_attributes: null,\n\n    overlay_class: null,\n    content_class: null,\n\n    modal_content: null,\n    header_content: null,\n    bar_content: null,\n  }\n\n  static getDerivedStateFromProps(props, state) {\n    if (typeof window !== 'undefined' && window['IS_TEST']) {\n      state.animation_duration = 0\n      state.no_animation = true\n    } else {\n      state.animation_duration = props.animation_duration\n      state.no_animation = props.no_animation\n    }\n\n    if (props.open_state !== state._open_state) {\n      switch (props.open_state) {\n        case 'opened':\n        case true:\n          state.hide = false\n          if (isTrue(state.no_animation)) {\n            state.modalActive = true\n          }\n          break\n        case 'closed':\n        case false:\n          state.hide = true\n          if (isTrue(state.no_animation)) {\n            state.modalActive = false\n          }\n          break\n      }\n    }\n    state._open_state = props.open_state\n\n    return state\n  }\n\n  constructor(props) {\n    super(props)\n    this._id = props.id || makeUniqueId('modal-')\n\n    this._triggerRef = React.createRef()\n\n    this._onUnmount = []\n  }\n\n  componentDidMount() {\n    this.openBasedOnStateUpdate()\n  }\n\n  componentWillUnmount() {\n    clearTimeout(this._openTimeout)\n    clearTimeout(this._closeTimeout)\n\n    this.removeActiveState()\n\n    this._onUnmount.forEach((fn) => {\n      if (typeof fn === 'function') {\n        fn()\n      }\n    })\n  }\n\n  componentDidUpdate(prevProps) {\n    if (prevProps !== this.props) {\n      this.openBasedOnStateUpdate()\n    }\n  }\n\n  openBasedOnStateUpdate() {\n    const { hide } = this.state\n    const { open_state } = this.props\n\n    if (!this.activeElement && typeof document !== 'undefined') {\n      this.activeElement = document.activeElement\n    }\n\n    if (!hide && (open_state === 'opened' || open_state === true)) {\n      this.toggleOpenClose(null, true)\n    } else if (hide && (open_state === 'closed' || open_state === false)) {\n      this.toggleOpenClose(null, false)\n    }\n  }\n\n  toggleOpenClose = (event = null, showModal = null) => {\n    if (event && event.preventDefault) {\n      event.preventDefault()\n    }\n\n    const toggleNow = () => {\n      const {\n        animation_duration = ANIMATION_DURATION,\n        no_animation = false,\n      } = this.state\n      const timeoutDuration =\n        typeof animation_duration === 'string'\n          ? parseFloat(animation_duration)\n          : animation_duration\n\n      const modalActive =\n        typeof showModal === 'boolean'\n          ? showModal\n          : !this.state.modalActive\n\n      this.isInTransition = true\n\n      const doItNow = () => {\n        this.setState(\n          {\n            hide: false,\n            modalActive,\n          },\n          () => {\n            this.isInTransition = false\n            this.handleSideEffects()\n          }\n        )\n      }\n\n      if (modalActive === false && !isTrue(no_animation)) {\n        this.setState({\n          hide: true,\n        })\n\n        this._closeTimeout = setTimeout(doItNow, timeoutDuration) // delay because of the animation\n      } else {\n        doItNow()\n      }\n    }\n\n    const waitBeforeOpen = () => {\n      const { open_delay } = this.props\n      const { no_animation } = this.state\n      const delay =\n        typeof open_delay === 'string'\n          ? parseFloat(open_delay)\n          : open_delay\n      if (delay > 0 && !isTrue(no_animation)) {\n        this._openTimeout = setTimeout(toggleNow, delay) // custom delay\n      } else {\n        toggleNow()\n      }\n    }\n\n    clearTimeout(this._closeTimeout)\n    clearTimeout(this._openTimeout)\n\n    const { open_modal } = this.props\n    if (typeof open_modal === 'function') {\n      const fn = open_modal(waitBeforeOpen, this)\n      if (fn) {\n        this._onUnmount.push(fn)\n      }\n    } else {\n      waitBeforeOpen()\n    }\n  }\n\n  handleSideEffects = () => {\n    const { modalActive, preventAutoFocus, animation_duration } =\n      this.state\n    const { close_modal, open_state } = this.props\n\n    if (modalActive) {\n      if (typeof close_modal === 'function') {\n        const fn = close_modal(() => {\n          this.toggleOpenClose(null, false)\n        }, this)\n        if (fn) {\n          this._onUnmount.push(fn)\n        }\n      }\n      this.setActiveState(this._id)\n    } else if (modalActive === false && !preventAutoFocus) {\n      const focus = (elem: HTMLElement) => {\n        // So we can omit showing a Tooltip on the trigger button\n        elem.setAttribute('data-autofocus', 'true')\n        elem.focus({ preventScroll: true })\n\n        return new Promise<void>((resolve) => {\n          setTimeout(\n            () => {\n              elem?.removeAttribute('data-autofocus')\n              resolve()\n            },\n            parseFloat(String(animation_duration)) / 3\n          )\n        })\n      }\n\n      if (this._triggerRef?.current) {\n        focus(this._triggerRef.current)\n      }\n\n      // because the open_state was set to opened, we force\n      if (\n        (open_state === 'opened' || open_state === true) &&\n        this.activeElement instanceof HTMLElement\n      ) {\n        try {\n          focus(this.activeElement).then(() => {\n            this.activeElement = null\n          })\n        } catch (e) {\n          //\n        }\n      }\n\n      this.removeActiveState()\n    }\n\n    if (preventAutoFocus) {\n      this.setState({ preventAutoFocus: false })\n    }\n  }\n\n  open = (e: Event) => {\n    this.toggleOpenClose(e, true)\n  }\n\n  close = (\n    event: Event,\n    { ifIsLatest, triggeredBy = null } = { ifIsLatest: true }\n  ) => {\n    const { prevent_close = false } = this.props\n\n    if (isTrue(prevent_close)) {\n      const id = this._id\n      dispatchCustomElementEvent(this, 'on_close_prevent', {\n        id,\n        event,\n        triggeredBy,\n        close: (e) => {\n          this.toggleOpenClose(e, false)\n        },\n      })\n    } else {\n      if (ifIsLatest) {\n        const list = getListOfModalRoots()\n        if (list.length > 1) {\n          const last = getModalRoot(-1)\n          if (last !== this) {\n            return // stop here\n          }\n        }\n      }\n\n      this.toggleOpenClose(event, false)\n    }\n  }\n\n  removeActiveState() {\n    const last = getModalRoot(-1)\n\n    // If this instance is not the last one,\n    // make the current one to as the active one\n    if (last?._id && last._id !== this._id) {\n      return this.setActiveState(last._id)\n    }\n\n    try {\n      document.documentElement.removeAttribute('data-dnb-modal-active')\n    } catch (e) {\n      warn('Modal: Error on remove \"data-dnb-modal-active\"', e)\n    }\n  }\n\n  /**\n   * Prevent scrolling on the background\n   * But checks if this instance was the last one or not\n   *\n   * @param {string} modalId Will remove the attribute if false is given\n   */\n  setActiveState(modalId: string) {\n    if (!modalId) {\n      warn('Modal: A valid modalId is required')\n    }\n    // prevent scrolling on the background\n    if (typeof document !== 'undefined') {\n      try {\n        document.documentElement.setAttribute(\n          'data-dnb-modal-active',\n          modalId\n        )\n      } catch (e) {\n        warn('Modal: Error on set \"data-dnb-modal-active\"', e)\n      }\n    }\n  }\n\n  render() {\n    const visualTestsPropsOverride =\n      typeof window !== 'undefined' && window['IS_TEST']\n        ? {\n            animation_duration: 0,\n            no_animation: true,\n          }\n        : {}\n\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      Modal.defaultProps,\n      this.context.getTranslation(this.props).Modal,\n      this.context.Modal,\n      visualTestsPropsOverride\n    )\n\n    const {\n      root_id = 'root',\n      content_id = null,\n      disabled = null,\n      labelled_by = null,\n      focus_selector = null,\n      header_content = null,\n      bar_content = null,\n      bypass_invalidation_selectors = null,\n\n      id, // eslint-disable-line\n      open_state, // eslint-disable-line\n      open_delay, // eslint-disable-line\n\n      omit_trigger_button = false,\n      trigger = null,\n      trigger_attributes = null,\n      ...rest\n    } = props\n\n    const { hide, modalActive } = this.state\n    const modal_content = Modal.getContent(\n      typeof this.props.children === 'function'\n        ? Object.freeze({ ...this.props, close: this.close })\n        : this.props\n    )\n\n    const render = (suffixProps) => {\n      const triggerAttributes = {\n        hidden: false,\n        variant: 'secondary',\n        icon_position: 'left',\n        ...trigger_attributes,\n      } as ButtonProps\n\n      if (isTrue(disabled)) {\n        triggerAttributes.disabled = true\n      }\n\n      if (triggerAttributes.id) {\n        this._id = triggerAttributes.id\n      }\n\n      let fallbackTitle: string\n      if (triggerAttributes.title) {\n        fallbackTitle = triggerAttributes.title\n      }\n      // in case the modal is used in suffix and no title is given\n      // suffixProps.label is also available, so we could use that too\n      else if (suffixProps) {\n        fallbackTitle = this.context.translation.HelpButton.title\n      }\n\n      const TriggerButton = trigger\n        ? (trigger as React.FC)\n        : HelpButtonInstance\n\n      const title = (\n        !triggerAttributes.text ? rest.title || fallbackTitle : null\n      ) as string\n\n      return (\n        <>\n          {TriggerButton && !isTrue(omit_trigger_button) && (\n            <TriggerButton\n              {...triggerAttributes}\n              id={this._id}\n              title={title}\n              onClick={this.toggleOpenClose}\n              innerRef={this._triggerRef}\n              className={classnames(\n                'dnb-modal__trigger',\n                createSpacingClasses(props),\n                triggerAttributes.className,\n\n                // @deprecated – can be removed in v11\n                triggerAttributes.class\n              )}\n            />\n          )}\n\n          {modalActive && modal_content && (\n            <ModalRoot\n              {...rest}\n              id={this._id}\n              root_id={root_id}\n              content_id={content_id || `dnb-modal-${this._id}`}\n              labelled_by={labelled_by}\n              focus_selector={focus_selector}\n              modal_content={modal_content}\n              header_content={header_content}\n              bar_content={bar_content}\n              bypass_invalidation_selectors={bypass_invalidation_selectors}\n              close={this.close}\n              hide={hide}\n              title={rest.title || fallbackTitle}\n            />\n          )}\n        </>\n      )\n    }\n\n    return <SuffixContext.Consumer>{render}</SuffixContext.Consumer>\n  }\n}\n\nexport { CloseButton, Modal as OriginalComponent }\n\nexport default classWithCamelCaseProps(Modal)\n"],"mappings":"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"}

package/components/modal/types.d.ts

@@ -199,6 +199,10 @@ export interface ModalContentProps {
      * Give the content wrapper a custom class name (maps to `dnb-modal__content`).
      */
     content_class?: string;
+    /**
+     * @deprecated – use className instead. Will be removed in v11.
+     */
+    class?: string;
     /**
      * Give the page overlay a custom class name (maps to `dnb-modal__overlay`).
      */

package/components/modal/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/modal/types.ts"],"sourcesContent":["import * as React from 'react'\nimport type { CloseButtonProps } from './parts/CloseButton'\nimport type { ButtonProps } from '../button/Button'\nimport type { ModalRootProps } from './ModalRoot'\n\nexport type ReactChildType = React.ReactNode | ((...args: any[]) => any)\n\nexport type ModalFullscreen = 'auto' | boolean\nexport type ModalAlignContent = 'left' | 'center' | 'centered' | 'right'\nexport type ModalContainerPlacement = 'left' | 'right' | 'top' | 'bottom'\nexport type ModalOpenState = 'opened' | 'closed' | boolean\nexport type ModalTriggerVariant =\n  | 'primary'\n  | 'secondary'\n  | 'tertiary'\n  | 'signal'\nexport type ModalTriggerIconPosition = 'left' | 'right'\nexport type ModalContentMinWidth = string | number\nexport type ModalContentMaxWidth = string | number\n\nexport interface ModalProps extends ModalRootProps {\n  /**\n   * The id used internal in the modal/drawer root element. Defaults to `root`, so the element id will be `dnb-modal-root`.\n   */\n  id?: string\n\n  /**\n   * Will disable the trigger button.\n   */\n  disabled?: boolean\n\n  /**\n   * Forces the modal/drawer to delay the opening. The delay is given in `ms`.\n   */\n  open_delay?: string | number\n\n  /**\n   * If set to `true` (boolean or string), then the user can&#39;t close the modal/drawer.\n   */\n  prevent_close?: boolean\n\n  /**\n   * Duration of animation open/close in ms. Defaults to 300ms.\n   */\n  animation_duration?: string | number\n\n  /**\n   * If set to `true`, no open/close animation will be shown. Defaults to false.\n   */\n  no_animation?: boolean\n\n  /**\n   * Use this prop to control the open/close state by setting either: `opened` / `closed` or `true` / `false`.\n   */\n  open_state?: ModalOpenState\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  children?: ReactChildType\n\n  /**\n   * Omits default showing trigger button\n   */\n  omit_trigger_button?: boolean\n\n  /**\n   * This event gets triggered once the modal shows up. Returns the modal id: `{ id }`.\n   */\n  on_open?: ({ id }: { id?: string }) => void\n\n  /**\n   * This event gets triggered once the modal gets closed. Returns the modal id: `{ id, event, triggeredBy }`.\n   */\n  on_close?: ({\n    id,\n    event,\n    triggeredBy,\n  }: {\n    id?: string\n    event?: Event\n    triggeredBy?: string\n  }) => void\n\n  /**\n   * This event gets triggered once the user tries to close the modal, but `prevent_close` is set to \"true\". Returns a callback `close` you can call to trigger the close mechanism. More details below. Returns the modal id: `{ id, event, close: Method, triggeredBy }`\n   */\n  on_close_prevent?: ({\n    id,\n    event,\n    triggeredBy,\n    close,\n  }: {\n    id?: string\n    event?: Event\n    triggeredBy?: string\n    close?: (...args: any[]) => any\n  }) => void\n\n  /**\n   * Set a function to call the callback function, once the modal/drawer should open: `open_modal={(open) => open()}`\n   */\n  open_modal?: (open?: (e: Event) => void, elem?: any) => () => void | void\n\n  /**\n   * Set a function to call the callback function, once the modal/drawer should close: `close_modal={(close) => close()}`\n   */\n  close_modal?: (\n    close?: (...args: any[]) => void,\n    elem?: any\n  ) => () => void | void\n\n  /**\n   * Provide a custom trigger component. Like trigger={<Anchor href=\"/\" />}. It will set the focus on it when the modal/drawer gets closed.\n   */\n  trigger?: ReactChildType\n\n  /**\n   * Send along custom HTML attributes or properties to the trigger button.\n   */\n  trigger_attributes?: TriggerAttributes\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  modal_content?: ReactChildType\n\n  /**\n   * If true, the drawer will not open in a new DOM but directly in current DOM. Defaults to `false`.\n   */\n  direct_dom_return?: boolean\n\n  /**\n   * To get the inner content Element, pass in your own React ref\n   */\n  content_ref?: React.RefObject<HTMLElement>\n\n  /**\n   * To get the scroll Element, pass in your own React ref\n   */\n  scroll_ref?: React.RefObject<HTMLElement>\n}\n\nexport interface ModalContentProps {\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  modal_content?: ReactChildType\n\n  /**\n   * The content which will appear in the bar, above the header, and side-by-side the close button.\n   */\n  bar_content?: ReactChildType\n\n  /**\n   * The content which will appear in the header of the modal/drawer the modal/drawer.\n   */\n  header_content?: ReactChildType\n  hide?: boolean\n\n  /**\n   * The id used internal for the trigger button and modal component.\n   */\n  id?: string\n\n  /**\n   * The id used internal in the modal/drawer root element. Defaults to `root`, so the element id will be `dnb-modal-root`.\n   */\n  root_id?: string\n\n  /**\n   * The ID of the trigger component, describing the modal/drawer content. Defaults to the internal `trigger`, so make sure you define the trigger title.\n   */\n  labelled_by?: string\n\n  /**\n   * The Modal handles the first focus – automatically. How ever, you can defined a custom focus selector the will be used instead `focus_selector=\".css-selector\"`.\n   */\n  focus_selector?: string\n\n  /**\n   * Defines an unique identifier to a modal. Use it in case you have to refer in some way to the modal/drawer content wrapper.\n   */\n  content_id?: string\n\n  /**\n   * The modal/drawer title. Displays on the very top of the content.\n   */\n  title?: React.ReactNode\n\n  /**\n   * The aria label of the dialog when no labelled_by and no title is given. Defaults to `Vindu`.\n   */\n  dialog_title?: string\n\n  /**\n   * If boolean, the close button will not be shown.\n   */\n  hide_close_button?: boolean\n\n  /**\n   * Define any valid Eufemia Button property or HTML attribute inside an object.\n   */\n  close_button_attributes?: CloseButtonProps\n\n  /**\n   * If set to `false` then the modal/drawer content will be shown without any spacing. Defaults to `true`.\n   */\n  spacing?: boolean\n\n  /**\n   * By default the modal/drawer content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.\n   */\n  prevent_core_style?: boolean\n  animation_duration?: string | number\n\n  /**\n   * Disable clicking the background overlay to close the modal\n   */\n  prevent_overlay_close?: boolean\n\n  /**\n   * If set to `true`, no open/close animation will be shown. Defaults to false.\n   */\n  no_animation?: boolean\n\n  /**\n   * Same as `no_animation`, but gets triggered only if the viewport width is less than `40em`. Defaults to false.\n   */\n  no_animation_on_mobile?: boolean\n\n  /**\n   * The minimum Modal content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `min_width` so you don&#39;t break responsiveness. Defaults to `30rem` (average width is set to `60vw`).\n   */\n  min_width?: ModalContentMinWidth\n\n  /**\n   * The maximum Modal content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).\n   */\n  max_width?: ModalContentMaxWidth\n\n  /**\n   * If set to `true` then the modal/drawer content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`.\n   */\n  fullscreen?: ModalFullscreen\n\n  /**\n   * Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.\n   */\n  align_content?: 'right' | 'left' | 'centered' | 'center'\n\n  /**\n   * For `drawer` mode only. Defines the placement on what side the Drawer should be opened. Can be set to `left`, `right`, `top` and `bottom`. Defaults to `right`.\n   */\n  container_placement?: 'left' | 'right' | 'top' | 'bottom'\n\n  /**\n   * Give the content wrapper a custom class name (maps to `dnb-modal__content`).\n   */\n  content_class?: string\n\n  /**\n   * Give the page overlay a custom class name (maps to `dnb-modal__overlay`).\n   */\n  overlay_class?: string\n\n  /**\n   * Define an array with HTML class selectors (`['.element-selector']`) which should not get invalidated when the modal opens/closes. Use this in order to let some parts of your site still be accessible by screen readers.\n   */\n  bypass_invalidation_selectors?: Array<string>\n\n  /**\n   * For internal usage\n   * Will close the modal\n   */\n  close?: (...args: any[]) => any\n\n  /**\n   * Give the inner Dialog or Drawer component a className (only works with mode)\n   */\n  className?: string\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  children?: ReactChildType\n\n  /**\n   * The displayed text for the 'close' button. Defaults to `Lukk`.\n   */\n  close_title?: string\n\n  /**\n   * Internal\n   */\n  dialog_role?: 'dialog' | 'alertdialog' | 'region'\n  content_ref?: React.RefObject<HTMLElement>\n  scroll_ref?: React.RefObject<HTMLElement>\n}\n\nexport type TriggerAttributes = ButtonProps\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../src/components/modal/types.ts"],"sourcesContent":["import * as React from 'react'\nimport type { CloseButtonProps } from './parts/CloseButton'\nimport type { ButtonProps } from '../button/Button'\nimport type { ModalRootProps } from './ModalRoot'\n\nexport type ReactChildType = React.ReactNode | ((...args: any[]) => any)\n\nexport type ModalFullscreen = 'auto' | boolean\nexport type ModalAlignContent = 'left' | 'center' | 'centered' | 'right'\nexport type ModalContainerPlacement = 'left' | 'right' | 'top' | 'bottom'\nexport type ModalOpenState = 'opened' | 'closed' | boolean\nexport type ModalTriggerVariant =\n  | 'primary'\n  | 'secondary'\n  | 'tertiary'\n  | 'signal'\nexport type ModalTriggerIconPosition = 'left' | 'right'\nexport type ModalContentMinWidth = string | number\nexport type ModalContentMaxWidth = string | number\n\nexport interface ModalProps extends ModalRootProps {\n  /**\n   * The id used internal in the modal/drawer root element. Defaults to `root`, so the element id will be `dnb-modal-root`.\n   */\n  id?: string\n\n  /**\n   * Will disable the trigger button.\n   */\n  disabled?: boolean\n\n  /**\n   * Forces the modal/drawer to delay the opening. The delay is given in `ms`.\n   */\n  open_delay?: string | number\n\n  /**\n   * If set to `true` (boolean or string), then the user can&#39;t close the modal/drawer.\n   */\n  prevent_close?: boolean\n\n  /**\n   * Duration of animation open/close in ms. Defaults to 300ms.\n   */\n  animation_duration?: string | number\n\n  /**\n   * If set to `true`, no open/close animation will be shown. Defaults to false.\n   */\n  no_animation?: boolean\n\n  /**\n   * Use this prop to control the open/close state by setting either: `opened` / `closed` or `true` / `false`.\n   */\n  open_state?: ModalOpenState\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  children?: ReactChildType\n\n  /**\n   * Omits default showing trigger button\n   */\n  omit_trigger_button?: boolean\n\n  /**\n   * This event gets triggered once the modal shows up. Returns the modal id: `{ id }`.\n   */\n  on_open?: ({ id }: { id?: string }) => void\n\n  /**\n   * This event gets triggered once the modal gets closed. Returns the modal id: `{ id, event, triggeredBy }`.\n   */\n  on_close?: ({\n    id,\n    event,\n    triggeredBy,\n  }: {\n    id?: string\n    event?: Event\n    triggeredBy?: string\n  }) => void\n\n  /**\n   * This event gets triggered once the user tries to close the modal, but `prevent_close` is set to \"true\". Returns a callback `close` you can call to trigger the close mechanism. More details below. Returns the modal id: `{ id, event, close: Method, triggeredBy }`\n   */\n  on_close_prevent?: ({\n    id,\n    event,\n    triggeredBy,\n    close,\n  }: {\n    id?: string\n    event?: Event\n    triggeredBy?: string\n    close?: (...args: any[]) => any\n  }) => void\n\n  /**\n   * Set a function to call the callback function, once the modal/drawer should open: `open_modal={(open) => open()}`\n   */\n  open_modal?: (open?: (e: Event) => void, elem?: any) => () => void | void\n\n  /**\n   * Set a function to call the callback function, once the modal/drawer should close: `close_modal={(close) => close()}`\n   */\n  close_modal?: (\n    close?: (...args: any[]) => void,\n    elem?: any\n  ) => () => void | void\n\n  /**\n   * Provide a custom trigger component. Like trigger={<Anchor href=\"/\" />}. It will set the focus on it when the modal/drawer gets closed.\n   */\n  trigger?: ReactChildType\n\n  /**\n   * Send along custom HTML attributes or properties to the trigger button.\n   */\n  trigger_attributes?: TriggerAttributes\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  modal_content?: ReactChildType\n\n  /**\n   * If true, the drawer will not open in a new DOM but directly in current DOM. Defaults to `false`.\n   */\n  direct_dom_return?: boolean\n\n  /**\n   * To get the inner content Element, pass in your own React ref\n   */\n  content_ref?: React.RefObject<HTMLElement>\n\n  /**\n   * To get the scroll Element, pass in your own React ref\n   */\n  scroll_ref?: React.RefObject<HTMLElement>\n}\n\nexport interface ModalContentProps {\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  modal_content?: ReactChildType\n\n  /**\n   * The content which will appear in the bar, above the header, and side-by-side the close button.\n   */\n  bar_content?: ReactChildType\n\n  /**\n   * The content which will appear in the header of the modal/drawer the modal/drawer.\n   */\n  header_content?: ReactChildType\n  hide?: boolean\n\n  /**\n   * The id used internal for the trigger button and modal component.\n   */\n  id?: string\n\n  /**\n   * The id used internal in the modal/drawer root element. Defaults to `root`, so the element id will be `dnb-modal-root`.\n   */\n  root_id?: string\n\n  /**\n   * The ID of the trigger component, describing the modal/drawer content. Defaults to the internal `trigger`, so make sure you define the trigger title.\n   */\n  labelled_by?: string\n\n  /**\n   * The Modal handles the first focus – automatically. How ever, you can defined a custom focus selector the will be used instead `focus_selector=\".css-selector\"`.\n   */\n  focus_selector?: string\n\n  /**\n   * Defines an unique identifier to a modal. Use it in case you have to refer in some way to the modal/drawer content wrapper.\n   */\n  content_id?: string\n\n  /**\n   * The modal/drawer title. Displays on the very top of the content.\n   */\n  title?: React.ReactNode\n\n  /**\n   * The aria label of the dialog when no labelled_by and no title is given. Defaults to `Vindu`.\n   */\n  dialog_title?: string\n\n  /**\n   * If boolean, the close button will not be shown.\n   */\n  hide_close_button?: boolean\n\n  /**\n   * Define any valid Eufemia Button property or HTML attribute inside an object.\n   */\n  close_button_attributes?: CloseButtonProps\n\n  /**\n   * If set to `false` then the modal/drawer content will be shown without any spacing. Defaults to `true`.\n   */\n  spacing?: boolean\n\n  /**\n   * By default the modal/drawer content gets added the core style class `dnb-core-style`. Use `false` to disable this behavior.\n   */\n  prevent_core_style?: boolean\n  animation_duration?: string | number\n\n  /**\n   * Disable clicking the background overlay to close the modal\n   */\n  prevent_overlay_close?: boolean\n\n  /**\n   * If set to `true`, no open/close animation will be shown. Defaults to false.\n   */\n  no_animation?: boolean\n\n  /**\n   * Same as `no_animation`, but gets triggered only if the viewport width is less than `40em`. Defaults to false.\n   */\n  no_animation_on_mobile?: boolean\n\n  /**\n   * The minimum Modal content width, defined by a CSS width value like `50vw` (50% of the viewport). Be careful on using fixed `min_width` so you don&#39;t break responsiveness. Defaults to `30rem` (average width is set to `60vw`).\n   */\n  min_width?: ModalContentMinWidth\n\n  /**\n   * The maximum Modal content width, defined by a CSS width value like `20rem`. Defaults to `60rem` (average width is set to `60vw`).\n   */\n  max_width?: ModalContentMaxWidth\n\n  /**\n   * If set to `true` then the modal/drawer content will be shown as fullscreen, without showing the original content behind. Can be set to `false` to omit the auto fullscreen. Defaults to `auto`.\n   */\n  fullscreen?: ModalFullscreen\n\n  /**\n   * Define the inner horizontal alignment of the content. Can be set to `left`, `center`, `right` and `centered`. If `centered`, then the content will also be centered vertically. Defaults to `left`.\n   */\n  align_content?: 'right' | 'left' | 'centered' | 'center'\n\n  /**\n   * For `drawer` mode only. Defines the placement on what side the Drawer should be opened. Can be set to `left`, `right`, `top` and `bottom`. Defaults to `right`.\n   */\n  container_placement?: 'left' | 'right' | 'top' | 'bottom'\n\n  /**\n   * Give the content wrapper a custom class name (maps to `dnb-modal__content`).\n   */\n  content_class?: string\n\n  /**\n   * @deprecated – use className instead. Will be removed in v11.\n   */\n  class?: string\n\n  /**\n   * Give the page overlay a custom class name (maps to `dnb-modal__overlay`).\n   */\n  overlay_class?: string\n\n  /**\n   * Define an array with HTML class selectors (`['.element-selector']`) which should not get invalidated when the modal opens/closes. Use this in order to let some parts of your site still be accessible by screen readers.\n   */\n  bypass_invalidation_selectors?: Array<string>\n\n  /**\n   * For internal usage\n   * Will close the modal\n   */\n  close?: (...args: any[]) => any\n\n  /**\n   * Give the inner Dialog or Drawer component a className (only works with mode)\n   */\n  className?: string\n\n  /**\n   * The content which will appear when triggering the modal/drawer.\n   */\n  children?: ReactChildType\n\n  /**\n   * The displayed text for the 'close' button. Defaults to `Lukk`.\n   */\n  close_title?: string\n\n  /**\n   * Internal\n   */\n  dialog_role?: 'dialog' | 'alertdialog' | 'region'\n  content_ref?: React.RefObject<HTMLElement>\n  scroll_ref?: React.RefObject<HTMLElement>\n}\n\nexport type TriggerAttributes = ButtonProps\n"],"mappings":""}

package/components/radio/RadioGroup.js

@@ -111,9 +111,11 @@ export default class RadioGroup extends React.PureComponent {
       value: context
     }, React.createElement("div", {
       className: classes
-    }, _AlignmentHelper || (_AlignmentHelper = React.createElement(AlignmentHelper, null)), React.createElement(Fieldset, null, React.createElement(Flex.Container, {
+    }, _AlignmentHelper || (_AlignmentHelper = React.createElement(AlignmentHelper, null)), React.createElement(Fieldset, {
+      className: "dnb-toggle-button-group__fieldset"
+    }, React.createElement(Flex.Container, {
       direction: vertical || label_direction === 'vertical' ? 'vertical' : 'horizontal',
-      spacing: vertical ? 'x-small' : 'small'
+      gap: vertical ? 'x-small' : 'small'
     }, label && React.createElement(FormLabel, {
       element: "legend",
       id: id + '-label',

package/components/radio/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","makeUniqueId","validateDOMAttributes","getStatusState","combineDescribedBy","combineLabelledBy","dispatchCustomElementEvent","pickFormElementProps","spacingPropTypes","createSpacingClasses","AlignmentHelper","Space","FormLabel","FormStatus","Flex","Context","Suffix","RadioGroupContext","RadioGroup","PureComponent","getDerivedStateFromProps","props","state","_listenForPropChanges","value","_value","constructor","_defineProperty","_ref","event","setState","_refInput","createRef","_id","id","_name","name","render","_this$context","_this$context2","defaultProps","context","FormRow","formElement","status","status_state","status_props","status_no_animation","globalStatus","suffix","label","label_direction","label_sr_only","label_position","vertical","layout_direction","size","disabled","skeleton","className","children","on_change","rest","_objectWithoutProperties","_excluded","showStatus","classes","params","_objectSpread","onChange","onChangeHandler","Fieldset","createElement","Provider","_AlignmentHelper","Container","direction","spacing","element","srOnly","_extends","role","show","text","text_id","width_selector","no_animation","title","undefined","attributes","test","String","process","env","NODE_ENV","propTypes","oneOfType","string","func","node","oneOf","bool","object","shape","message","_supportsSpacingProps"],"sources":["../../../../src/components/radio/RadioGroup.js"],"sourcesContent":["/**\n * Web RadioGroup Component\n *\n * This is a legacy component.\n * For referencing while developing new features, please use a Functional component.\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  makeUniqueId,\n  validateDOMAttributes,\n  getStatusState,\n  combineDescribedBy,\n  combineLabelledBy,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { pickFormElementProps } from '../../shared/helpers/filterValidProps'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport Space from '../Space'\nimport FormLabel from '../FormLabel'\nimport FormStatus from '../FormStatus'\nimport Flex from '../Flex'\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport RadioGroupContext from './RadioGroupContext'\n\n/**\n * The radio component is our enhancement of the classic radio button. It acts like a radio. Example: On/off, yes/no.\n */\nexport default class RadioGroup extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    label: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    label_direction: PropTypes.oneOf(['horizontal', 'vertical']),\n    label_sr_only: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    label_position: PropTypes.oneOf(['left', 'right']),\n    title: PropTypes.string,\n    disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    id: PropTypes.string,\n    name: PropTypes.string,\n    size: PropTypes.oneOf(['default', 'medium', 'large']),\n    status: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    status_state: PropTypes.string,\n    status_props: PropTypes.object,\n    status_no_animation: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n    ]),\n    globalStatus: PropTypes.shape({\n      id: PropTypes.string,\n      message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n    }),\n    suffix: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    layout_direction: PropTypes.oneOf(['column', 'row']),\n    vertical: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    value: PropTypes.string,\n    attributes: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n    ...spacingPropTypes,\n\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n\n    on_change: PropTypes.func,\n  }\n\n  static defaultProps = {\n    label: null,\n    label_direction: null,\n    label_sr_only: null,\n    label_position: null,\n    title: null,\n    disabled: null,\n    skeleton: null,\n    id: null,\n    name: null,\n    size: null,\n    status: null,\n    status_state: 'error',\n    status_props: null,\n    status_no_animation: null,\n    globalStatus: null,\n    suffix: null,\n    vertical: null,\n    layout_direction: 'row',\n    value: undefined,\n    attributes: null,\n\n    className: null,\n    children: null,\n\n    on_change: null,\n  }\n\n  static parseChecked = (state) => /true|on/.test(String(state))\n\n  static getDerivedStateFromProps(props, state) {\n    if (state._listenForPropChanges) {\n      if (props.value !== state._value) {\n        state.value = props.value\n      }\n      if (typeof props.value !== 'undefined') {\n        state._value = props.value\n      }\n    }\n    state._listenForPropChanges = true\n\n    return state\n  }\n\n  constructor(props) {\n    super(props)\n    this._refInput = React.createRef()\n    this._id = props.id || makeUniqueId() // cause we need an id anyway\n    this._name = props.name || this._id\n    this.state = {\n      _listenForPropChanges: true,\n    }\n  }\n\n  onChangeHandler = ({ value, event }) => {\n    this.setState({ value, _listenForPropChanges: false })\n    dispatchCustomElementEvent(this, 'on_change', {\n      value,\n      event,\n    })\n  }\n\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      RadioGroup.defaultProps,\n      // Deprecated – can be removed in v11\n      pickFormElementProps(this.context?.FormRow),\n      pickFormElementProps(this.context?.formElement),\n      this.context.RadioGroup\n    )\n\n    const {\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      suffix,\n      label,\n      label_direction,\n      label_sr_only,\n      label_position,\n      vertical,\n      layout_direction,\n      size,\n      disabled,\n      skeleton,\n      className,\n\n      id: _id, // eslint-disable-line\n      name: _name, // eslint-disable-line\n      value: _value, // eslint-disable-line\n      children, // eslint-disable-line\n      on_change, // eslint-disable-line\n\n      ...rest\n    } = props\n\n    const { value } = this.state\n\n    const id = this._id\n    const showStatus = getStatusState(status)\n\n    const classes = classnames(\n      'dnb-radio-group',\n      status && `dnb-radio-group__status--${status_state}`,\n      `dnb-radio-group--${layout_direction}`,\n      'dnb-form-component',\n      createSpacingClasses(props),\n      className\n    )\n\n    const params = {\n      ...rest,\n    }\n\n    if (showStatus || suffix) {\n      params['aria-describedby'] = combineDescribedBy(\n        params,\n        showStatus ? id + '-status' : null,\n        suffix ? id + '-suffix' : null\n      )\n    }\n    if (label) {\n      params['aria-labelledby'] = combineLabelledBy(params, id + '-label')\n    }\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, params)\n\n    const context = {\n      name: this._name,\n      value,\n      size,\n      disabled,\n      label_position,\n      onChange: this.onChangeHandler,\n    }\n\n    const Fieldset = label ? 'fieldset' : 'div'\n\n    return (\n      <RadioGroupContext.Provider value={context}>\n        <div className={classes}>\n          <AlignmentHelper />\n          <Fieldset>\n            <Flex.Container\n              // align=\"baseline\"\n              direction={\n                vertical || label_direction === 'vertical'\n                  ? 'vertical'\n                  : 'horizontal'\n              }\n              spacing={vertical ? 'x-small' : 'small'}\n            >\n              {label && (\n                <FormLabel\n                  element=\"legend\"\n                  id={id + '-label'}\n                  srOnly={label_sr_only}\n                >\n                  {label}\n                </FormLabel>\n              )}\n\n              <Space\n                element=\"span\"\n                id={id}\n                className=\"dnb-radio-group__shell\"\n                role=\"radiogroup\"\n                {...params}\n              >\n                {children}\n\n                {suffix && (\n                  <Suffix\n                    className=\"dnb-radio-group__suffix\"\n                    id={id + '-suffix'} // used for \"aria-describedby\"\n                    context={props}\n                  >\n                    {suffix}\n                  </Suffix>\n                )}\n\n                <FormStatus\n                  show={showStatus}\n                  id={id + '-form-status'}\n                  globalStatus={globalStatus}\n                  label={label}\n                  text={status}\n                  state={status_state}\n                  text_id={id + '-status'} // used for \"aria-describedby\"\n                  width_selector={id + ', ' + id + '-label'}\n                  no_animation={status_no_animation}\n                  skeleton={skeleton}\n                  {...status_props}\n                />\n              </Space>\n            </Flex.Container>\n          </Fieldset>\n        </div>\n      </RadioGroupContext.Provider>\n    )\n  }\n}\n\nRadioGroup._supportsSpacingProps = true\n"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","names":["React","PropTypes","classnames","extendPropsWithContextInClassComponent","makeUniqueId","validateDOMAttributes","getStatusState","combineDescribedBy","combineLabelledBy","dispatchCustomElementEvent","pickFormElementProps","spacingPropTypes","createSpacingClasses","AlignmentHelper","Space","FormLabel","FormStatus","Flex","Context","Suffix","RadioGroupContext","RadioGroup","PureComponent","getDerivedStateFromProps","props","state","_listenForPropChanges","value","_value","constructor","_defineProperty","_ref","event","setState","_refInput","createRef","_id","id","_name","name","render","_this$context","_this$context2","defaultProps","context","FormRow","formElement","status","status_state","status_props","status_no_animation","globalStatus","suffix","label","label_direction","label_sr_only","label_position","vertical","layout_direction","size","disabled","skeleton","className","children","on_change","rest","_objectWithoutProperties","_excluded","showStatus","classes","params","_objectSpread","onChange","onChangeHandler","Fieldset","createElement","Provider","_AlignmentHelper","Container","direction","gap","element","srOnly","_extends","role","show","text","text_id","width_selector","no_animation","title","undefined","attributes","test","String","process","env","NODE_ENV","propTypes","oneOfType","string","func","node","oneOf","bool","object","shape","message","_supportsSpacingProps"],"sources":["../../../../src/components/radio/RadioGroup.js"],"sourcesContent":["/**\n * Web RadioGroup Component\n *\n * This is a legacy component.\n * For referencing while developing new features, please use a Functional component.\n */\n\nimport React from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport {\n  extendPropsWithContextInClassComponent,\n  makeUniqueId,\n  validateDOMAttributes,\n  getStatusState,\n  combineDescribedBy,\n  combineLabelledBy,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { pickFormElementProps } from '../../shared/helpers/filterValidProps'\nimport {\n  spacingPropTypes,\n  createSpacingClasses,\n} from '../space/SpacingHelper'\nimport AlignmentHelper from '../../shared/AlignmentHelper'\nimport Space from '../Space'\nimport FormLabel from '../FormLabel'\nimport FormStatus from '../FormStatus'\nimport Flex from '../Flex'\nimport Context from '../../shared/Context'\nimport Suffix from '../../shared/helpers/Suffix'\nimport RadioGroupContext from './RadioGroupContext'\n\n/**\n * The radio component is our enhancement of the classic radio button. It acts like a radio. Example: On/off, yes/no.\n */\nexport default class RadioGroup extends React.PureComponent {\n  static contextType = Context\n\n  static propTypes = {\n    label: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    label_direction: PropTypes.oneOf(['horizontal', 'vertical']),\n    label_sr_only: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    label_position: PropTypes.oneOf(['left', 'right']),\n    title: PropTypes.string,\n    disabled: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    skeleton: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    id: PropTypes.string,\n    name: PropTypes.string,\n    size: PropTypes.oneOf(['default', 'medium', 'large']),\n    status: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    status_state: PropTypes.string,\n    status_props: PropTypes.object,\n    status_no_animation: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.bool,\n    ]),\n    globalStatus: PropTypes.shape({\n      id: PropTypes.string,\n      message: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n    }),\n    suffix: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n    layout_direction: PropTypes.oneOf(['column', 'row']),\n    vertical: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),\n    value: PropTypes.string,\n    attributes: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),\n\n    ...spacingPropTypes,\n\n    className: PropTypes.string,\n    children: PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.func,\n      PropTypes.node,\n    ]),\n\n    on_change: PropTypes.func,\n  }\n\n  static defaultProps = {\n    label: null,\n    label_direction: null,\n    label_sr_only: null,\n    label_position: null,\n    title: null,\n    disabled: null,\n    skeleton: null,\n    id: null,\n    name: null,\n    size: null,\n    status: null,\n    status_state: 'error',\n    status_props: null,\n    status_no_animation: null,\n    globalStatus: null,\n    suffix: null,\n    vertical: null,\n    layout_direction: 'row',\n    value: undefined,\n    attributes: null,\n\n    className: null,\n    children: null,\n\n    on_change: null,\n  }\n\n  static parseChecked = (state) => /true|on/.test(String(state))\n\n  static getDerivedStateFromProps(props, state) {\n    if (state._listenForPropChanges) {\n      if (props.value !== state._value) {\n        state.value = props.value\n      }\n      if (typeof props.value !== 'undefined') {\n        state._value = props.value\n      }\n    }\n    state._listenForPropChanges = true\n\n    return state\n  }\n\n  constructor(props) {\n    super(props)\n    this._refInput = React.createRef()\n    this._id = props.id || makeUniqueId() // cause we need an id anyway\n    this._name = props.name || this._id\n    this.state = {\n      _listenForPropChanges: true,\n    }\n  }\n\n  onChangeHandler = ({ value, event }) => {\n    this.setState({ value, _listenForPropChanges: false })\n    dispatchCustomElementEvent(this, 'on_change', {\n      value,\n      event,\n    })\n  }\n\n  render() {\n    // use only the props from context, who are available here anyway\n    const props = extendPropsWithContextInClassComponent(\n      this.props,\n      RadioGroup.defaultProps,\n      // Deprecated – can be removed in v11\n      pickFormElementProps(this.context?.FormRow),\n      pickFormElementProps(this.context?.formElement),\n      this.context.RadioGroup\n    )\n\n    const {\n      status,\n      status_state,\n      status_props,\n      status_no_animation,\n      globalStatus,\n      suffix,\n      label,\n      label_direction,\n      label_sr_only,\n      label_position,\n      vertical,\n      layout_direction,\n      size,\n      disabled,\n      skeleton,\n      className,\n\n      id: _id, // eslint-disable-line\n      name: _name, // eslint-disable-line\n      value: _value, // eslint-disable-line\n      children, // eslint-disable-line\n      on_change, // eslint-disable-line\n\n      ...rest\n    } = props\n\n    const { value } = this.state\n\n    const id = this._id\n    const showStatus = getStatusState(status)\n\n    const classes = classnames(\n      'dnb-radio-group',\n      status && `dnb-radio-group__status--${status_state}`,\n      `dnb-radio-group--${layout_direction}`,\n      'dnb-form-component',\n      createSpacingClasses(props),\n      className\n    )\n\n    const params = {\n      ...rest,\n    }\n\n    if (showStatus || suffix) {\n      params['aria-describedby'] = combineDescribedBy(\n        params,\n        showStatus ? id + '-status' : null,\n        suffix ? id + '-suffix' : null\n      )\n    }\n    if (label) {\n      params['aria-labelledby'] = combineLabelledBy(params, id + '-label')\n    }\n\n    // also used for code markup simulation\n    validateDOMAttributes(this.props, params)\n\n    const context = {\n      name: this._name,\n      value,\n      size,\n      disabled,\n      label_position,\n      onChange: this.onChangeHandler,\n    }\n\n    const Fieldset = label ? 'fieldset' : 'div'\n\n    return (\n      <RadioGroupContext.Provider value={context}>\n        <div className={classes}>\n          <AlignmentHelper />\n          <Fieldset className=\"dnb-toggle-button-group__fieldset\">\n            <Flex.Container\n              direction={\n                vertical || label_direction === 'vertical'\n                  ? 'vertical'\n                  : 'horizontal'\n              }\n              gap={vertical ? 'x-small' : 'small'}\n            >\n              {label && (\n                <FormLabel\n                  element=\"legend\"\n                  id={id + '-label'}\n                  srOnly={label_sr_only}\n                >\n                  {label}\n                </FormLabel>\n              )}\n\n              <Space\n                element=\"span\"\n                id={id}\n                className=\"dnb-radio-group__shell\"\n                role=\"radiogroup\"\n                {...params}\n              >\n                {children}\n\n                {suffix && (\n                  <Suffix\n                    className=\"dnb-radio-group__suffix\"\n                    id={id + '-suffix'} // used for \"aria-describedby\"\n                    context={props}\n                  >\n                    {suffix}\n                  </Suffix>\n                )}\n\n                <FormStatus\n                  show={showStatus}\n                  id={id + '-form-status'}\n                  globalStatus={globalStatus}\n                  label={label}\n                  text={status}\n                  state={status_state}\n                  text_id={id + '-status'} // used for \"aria-describedby\"\n                  width_selector={id + ', ' + id + '-label'}\n                  no_animation={status_no_animation}\n                  skeleton={skeleton}\n                  {...status_props}\n                />\n              </Space>\n            </Flex.Container>\n          </Fieldset>\n        </div>\n      </RadioGroupContext.Provider>\n    )\n  }\n}\n\nRadioGroup._supportsSpacingProps = true\n"],"mappings":"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"}

package/components/radio/style/dnb-radio.css

@@ -200,10 +200,13 @@ html[data-whatinput=keyboard] .dnb-radio__focus {
   transform: translateY(0.25rem); /* 4/16 */
 }
 .dnb-radio-group {
-  --radio-group-margin-bottom: 0.5rem;
-  --radio-group-margin-right: 1rem;
+  --radio-group-row-gap: 0.5rem;
+  --radio-group-column-gap: 1rem;
   display: inline-flex;
 }
+.dnb-radio-group, .dnb-radio-group__fieldset, .dnb-radio-group__shell {
+  flex-grow: 1;
+}
 .dnb-radio-group fieldset {
   margin: 0;
   padding: 0;
@@ -219,9 +222,9 @@ html[data-whatinput=keyboard] .dnb-radio__focus {
 .dnb-radio-group [role=radiogroup], .dnb-radio-group__shell {
   display: flex;
   flex-wrap: wrap;
-  -moz-column-gap: var(--radio-group-margin-right);
-       column-gap: var(--radio-group-margin-right);
-  row-gap: var(--radio-group-margin-bottom);
+  -moz-column-gap: var(--radio-group-column-gap);
+       column-gap: var(--radio-group-column-gap);
+  row-gap: var(--radio-group-row-gap);
 }
 .dnb-radio-group__shell > .dnb-form-status {
   margin-top: 0;

package/components/radio/style/dnb-radio.min.css

@@ -1 +1 @@
-:root{--radio-width--medium:1.5rem;--radio-height--medium:1.5rem}.dnb-radio{--radio-dot--medium:0.75rem;--radio-dot--large:1.125rem;--radio-width--large:2rem;--radio-height--large:2rem;--radio-border-width:0.09375rem;--radio-color-dot-on:#000;--radio-color-background-on:#fff;--radio-color-border-on:#000;--radio-color-background-off:#fff;--radio-color-border-off:#000;--radio-border-width--disabled:0.125rem;--radio-color-dot-on--disabled:#d3d3d3;--radio-color-background--disabled:#fff;--radio-color-border-on--disabled:#d3d3d3;--radio-color-border-off--disabled:#d3d3d3;--radio-color-dot-on--active:#d3d3d3;--radio-color-border-on--active:#d3d3d3;--radio-color-background-off--active:#d3d3d3;--radio-color-border-off--active:transparent;--radio-border-width--hover:0.125rem;--radio-border-width-on--hover:0.125rem;--radio-color-dot-on--hover:#d3d3d3;--radio-color-background-on--hover:#d3d3d3;--radio-color-background-off--hover:#d3d3d3;--radio-border-width--focus:0.125rem;--radio-color-background-on--focus:var(--color-white);--radio-color-background-off--focus:#d3d3d3;--radio-color-dot-on--error:red;--radio-color-border-on--error:red;--radio-color-border--error-hover:red;--radio-color-background-off--error-hover:#fff0f5;--radio-color-background-on--error-hover:#fff0f5;--radio-color-dot-on--error-hover:#fff0f5;--radio-focus-ring-width--error:var(--focus-ring-width);--radio-bounding--medium:1.75,1.5;--radio-bounding--large:1.25,1.12;font-size:var(--font-size-small);line-height:var(--line-height-basis)}.dnb-radio,.dnb-radio__inner{display:inline-flex;flex-direction:column}.dnb-radio__inner{align-self:center}.dnb-radio__shell{align-items:center;display:flex;flex-shrink:0;height:var(--radio-height--medium);justify-content:center;position:relative;-webkit-user-select:none;user-select:none;width:var(--radio-width--medium)}.dnb-radio__button,.dnb-radio__dot,.dnb-radio__focus{position:absolute;z-index:4}.dnb-radio__button{border:var(--radio-border-width) solid transparent}.dnb-radio__focus{display:none;outline:none}html[data-whatinput=keyboard] .dnb-radio__focus{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-radio__button,.dnb-radio__focus{border-radius:50%;height:calc(var(--radio-height--medium) - .25rem);width:calc(var(--radio-width--medium) - .25rem)}.dnb-radio--large .dnb-radio__button,.dnb-radio--large .dnb-radio__focus{height:var(--radio-height--large);width:var(--radio-width--large)}.dnb-radio__dot{background-color:var(--radio-color-dot-on);border-radius:50%;height:var(--radio-dot--medium);transition:opacity .2s ease-out,transform .2s ease-out;width:var(--radio-dot--medium)}.dnb-radio--large .dnb-radio__dot{height:var(--radio-dot--large);width:var(--radio-dot--large)}.dnb-radio__input{border:0;height:var(--radio-height--medium);left:auto;margin:0;opacity:0;padding:0;position:absolute;top:auto;transform:scale(var(--radio-bounding--medium));width:var(--radio-width--medium);z-index:5}.dnb-radio--large .dnb-radio__input{height:var(--radio-height--large);transform:scale(var(--radio-bounding--large));width:var(--radio-width--large)}.dnb-radio__input:not([disabled]){cursor:pointer}.dnb-radio__order{align-items:baseline;display:inline-flex}.dnb-radio-group--column .dnb-radio__order{display:flex}.dnb-radio__row{display:inline-flex}.dnb-radio__suffix{order:3}.dnb-radio__suffix .dnb-modal__trigger{margin-bottom:-.25rem;margin-top:-.25rem}.dnb-radio-group__suffix{font-size:var(--font-size-basis)}.dnb-radio--large,.dnb-radio--large .dnb-radio__suffix{line-height:var(--radio-height--large)}.dnb-radio--large .dnb-radio__shell{height:var(--radio-height--large);width:var(--radio-width--large)}.dnb-radio .dnb-form-label{margin-bottom:0;margin-left:0;margin-right:0}.dnb-radio--label-position-left .dnb-radio__order .dnb-radio__inner{order:2}.dnb-radio--label-position-left .dnb-radio__order .dnb-form-label{order:1;padding-right:.5rem}.dnb-radio--label-position-right .dnb-radio__order .dnb-radio__inner{order:1}.dnb-radio--label-position-right .dnb-radio__order .dnb-form-label{order:2;padding-left:.5rem}:not(.dnb-radio-group)>.dnb-form-label+.dnb-radio{vertical-align:top}.dnb-radio .dnb-form-status{margin-bottom:0;margin-top:.375rem;order:4}.dnb-radio+.dnb-form-status{margin-bottom:1rem;margin-top:.5rem}.dnb-radio>.dnb-form-status{transform:translateY(.25rem)}.dnb-radio-group{--radio-group-margin-bottom:0.5rem;--radio-group-margin-right:1rem;display:inline-flex}.dnb-radio-group fieldset{border:none;margin:0;padding:0}.dnb-radio-group--column .dnb-radio{display:flex;margin-right:0}.dnb-radio-group .dnb-radio:last-of-type{margin-right:0}.dnb-radio-group [role=radiogroup],.dnb-radio-group__shell{-moz-column-gap:var(--radio-group-margin-right);column-gap:var(--radio-group-margin-right);display:flex;flex-wrap:wrap;row-gap:var(--radio-group-margin-bottom)}.dnb-radio-group__shell>.dnb-form-status{margin-bottom:0;margin-top:0}.dnb-radio-group--column .dnb-radio-group__shell{flex-direction:column}.dnb-radio__input:checked~.dnb-radio__button,.dnb-radio__input[data-checked=true]~.dnb-radio__button{background-color:var(--radio-color-background-on);border-color:var(--radio-color-border-on)}.dnb-radio__input:checked~.dnb-radio__dot,.dnb-radio__input[data-checked=true]~.dnb-radio__dot{opacity:1;transform:scale(1)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__dot{opacity:0;transform:scale(.8)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__button{background-color:var(--radio-color-background-off);border-color:var(--radio-color-border-off)}.dnb-radio__input[disabled]~.dnb-radio__button{border-width:var(--radio-border-width--disabled)}.dnb-radio__input[disabled]:checked~.dnb-radio__button,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__button{background-color:var(--radio-color-background--disabled);border-color:var(--radio-color-border-on--disabled)}.dnb-radio__input[disabled]:checked~.dnb-radio__dot,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__dot{background-color:var(--radio-color-dot-on--disabled)}.dnb-radio__input[disabled]:not(:checked):not([data-checked=true])~.dnb-radio__button:not(.dnb-skeleton){background-color:var(--radio-color-background--disabled);border-color:var(--radio-color-border-off--disabled)}.dnb-radio__input[disabled]~.dnb-radio__button.dnb-skeleton{border-color:var(--skeleton-color)}.dnb-radio__input[disabled]~.dnb-radio__button.dnb-skeleton:before{border-radius:0}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__button,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__button{border-color:var(--radio-color-border-on--active)}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__dot,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__dot{background-color:var(--radio-color-dot-on--active)}.dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):active~.dnb-radio__button{background-color:var(--radio-color-background-off--active);border-color:var(--radio-color-border-off--active)}.dnb-radio__input:not([disabled]):not(:focus):checked:hover~.dnb-radio__dot,.dnb-radio__input:not([disabled]):not(:focus)[data-checked=true]:hover~.dnb-radio__dot{background-color:var(--radio-color-dot-on--hover)}.dnb-radio__input:not([disabled]):not(:focus):checked:hover~.dnb-radio__button,.dnb-radio__input:not([disabled]):not(:focus)[data-checked=true]:hover~.dnb-radio__button{background-color:var(--radio-color-background-on--hover);border-width:var(--radio-border-width-on--hover)}.dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button{background-color:var(--radio-color-background-off--hover);border-width:var(--radio-border-width--hover)}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):focus~.dnb-radio__button{border:none}.dnb-radio__input:not([disabled]):active~.dnb-radio__focus,.dnb-radio__input:not([disabled]):focus~.dnb-radio__focus{display:block}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover):checked:focus~.dnb-radio__button,html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover)[data-checked=true]:focus~.dnb-radio__button{background-color:var(--radio-color-background-on--focus)}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover):checked:focus~.dnb-radio__dot,html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover)[data-checked=true]:focus~.dnb-radio__dot{background-color:var(--radio-color-dot-on--focus,var(--focus-ring-color))}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):focus~.dnb-radio__button{background-color:var(--radio-color-background-off--focus)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__button{border:none}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__focus{--border-color:var(--radio-color-border-on--error);--border-width:var(--radio-focus-ring-width--error);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color);display:block}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):hover~.dnb-radio__focus{--border-color:var(--radio-color-border--error-hover);--border-width:var(--radio-focus-ring-width--error);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover):checked~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover)[data-checked=true]~.dnb-radio__dot{background-color:var(--radio-color-dot-on--error)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):checked:hover~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)[data-checked=true]:hover~.dnb-radio__dot{background-color:var(--radio-color-dot-on--error-hover)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):checked:hover~.dnb-radio__button,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)[data-checked=true]:hover~.dnb-radio__button{background-color:var(--radio-color-background-on--error-hover)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button{background-color:var(--radio-color-background-off--error-hover)}
+:root{--radio-width--medium:1.5rem;--radio-height--medium:1.5rem}.dnb-radio{--radio-dot--medium:0.75rem;--radio-dot--large:1.125rem;--radio-width--large:2rem;--radio-height--large:2rem;--radio-border-width:0.09375rem;--radio-color-dot-on:#000;--radio-color-background-on:#fff;--radio-color-border-on:#000;--radio-color-background-off:#fff;--radio-color-border-off:#000;--radio-border-width--disabled:0.125rem;--radio-color-dot-on--disabled:#d3d3d3;--radio-color-background--disabled:#fff;--radio-color-border-on--disabled:#d3d3d3;--radio-color-border-off--disabled:#d3d3d3;--radio-color-dot-on--active:#d3d3d3;--radio-color-border-on--active:#d3d3d3;--radio-color-background-off--active:#d3d3d3;--radio-color-border-off--active:transparent;--radio-border-width--hover:0.125rem;--radio-border-width-on--hover:0.125rem;--radio-color-dot-on--hover:#d3d3d3;--radio-color-background-on--hover:#d3d3d3;--radio-color-background-off--hover:#d3d3d3;--radio-border-width--focus:0.125rem;--radio-color-background-on--focus:var(--color-white);--radio-color-background-off--focus:#d3d3d3;--radio-color-dot-on--error:red;--radio-color-border-on--error:red;--radio-color-border--error-hover:red;--radio-color-background-off--error-hover:#fff0f5;--radio-color-background-on--error-hover:#fff0f5;--radio-color-dot-on--error-hover:#fff0f5;--radio-focus-ring-width--error:var(--focus-ring-width);--radio-bounding--medium:1.75,1.5;--radio-bounding--large:1.25,1.12;font-size:var(--font-size-small);line-height:var(--line-height-basis)}.dnb-radio,.dnb-radio__inner{display:inline-flex;flex-direction:column}.dnb-radio__inner{align-self:center}.dnb-radio__shell{align-items:center;display:flex;flex-shrink:0;height:var(--radio-height--medium);justify-content:center;position:relative;-webkit-user-select:none;user-select:none;width:var(--radio-width--medium)}.dnb-radio__button,.dnb-radio__dot,.dnb-radio__focus{position:absolute;z-index:4}.dnb-radio__button{border:var(--radio-border-width) solid transparent}.dnb-radio__focus{display:none;outline:none}html[data-whatinput=keyboard] .dnb-radio__focus{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-radio__button,.dnb-radio__focus{border-radius:50%;height:calc(var(--radio-height--medium) - .25rem);width:calc(var(--radio-width--medium) - .25rem)}.dnb-radio--large .dnb-radio__button,.dnb-radio--large .dnb-radio__focus{height:var(--radio-height--large);width:var(--radio-width--large)}.dnb-radio__dot{background-color:var(--radio-color-dot-on);border-radius:50%;height:var(--radio-dot--medium);transition:opacity .2s ease-out,transform .2s ease-out;width:var(--radio-dot--medium)}.dnb-radio--large .dnb-radio__dot{height:var(--radio-dot--large);width:var(--radio-dot--large)}.dnb-radio__input{border:0;height:var(--radio-height--medium);left:auto;margin:0;opacity:0;padding:0;position:absolute;top:auto;transform:scale(var(--radio-bounding--medium));width:var(--radio-width--medium);z-index:5}.dnb-radio--large .dnb-radio__input{height:var(--radio-height--large);transform:scale(var(--radio-bounding--large));width:var(--radio-width--large)}.dnb-radio__input:not([disabled]){cursor:pointer}.dnb-radio__order{align-items:baseline;display:inline-flex}.dnb-radio-group--column .dnb-radio__order{display:flex}.dnb-radio__row{display:inline-flex}.dnb-radio__suffix{order:3}.dnb-radio__suffix .dnb-modal__trigger{margin-bottom:-.25rem;margin-top:-.25rem}.dnb-radio-group__suffix{font-size:var(--font-size-basis)}.dnb-radio--large,.dnb-radio--large .dnb-radio__suffix{line-height:var(--radio-height--large)}.dnb-radio--large .dnb-radio__shell{height:var(--radio-height--large);width:var(--radio-width--large)}.dnb-radio .dnb-form-label{margin-bottom:0;margin-left:0;margin-right:0}.dnb-radio--label-position-left .dnb-radio__order .dnb-radio__inner{order:2}.dnb-radio--label-position-left .dnb-radio__order .dnb-form-label{order:1;padding-right:.5rem}.dnb-radio--label-position-right .dnb-radio__order .dnb-radio__inner{order:1}.dnb-radio--label-position-right .dnb-radio__order .dnb-form-label{order:2;padding-left:.5rem}:not(.dnb-radio-group)>.dnb-form-label+.dnb-radio{vertical-align:top}.dnb-radio .dnb-form-status{margin-bottom:0;margin-top:.375rem;order:4}.dnb-radio+.dnb-form-status{margin-bottom:1rem;margin-top:.5rem}.dnb-radio>.dnb-form-status{transform:translateY(.25rem)}.dnb-radio-group{--radio-group-row-gap:0.5rem;--radio-group-column-gap:1rem;display:inline-flex}.dnb-radio-group,.dnb-radio-group__fieldset,.dnb-radio-group__shell{flex-grow:1}.dnb-radio-group fieldset{border:none;margin:0;padding:0}.dnb-radio-group--column .dnb-radio{display:flex;margin-right:0}.dnb-radio-group .dnb-radio:last-of-type{margin-right:0}.dnb-radio-group [role=radiogroup],.dnb-radio-group__shell{-moz-column-gap:var(--radio-group-column-gap);column-gap:var(--radio-group-column-gap);display:flex;flex-wrap:wrap;row-gap:var(--radio-group-row-gap)}.dnb-radio-group__shell>.dnb-form-status{margin-bottom:0;margin-top:0}.dnb-radio-group--column .dnb-radio-group__shell{flex-direction:column}.dnb-radio__input:checked~.dnb-radio__button,.dnb-radio__input[data-checked=true]~.dnb-radio__button{background-color:var(--radio-color-background-on);border-color:var(--radio-color-border-on)}.dnb-radio__input:checked~.dnb-radio__dot,.dnb-radio__input[data-checked=true]~.dnb-radio__dot{opacity:1;transform:scale(1)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__dot{opacity:0;transform:scale(.8)}.dnb-radio__input:not(:checked):not([data-checked=true])~.dnb-radio__button{background-color:var(--radio-color-background-off);border-color:var(--radio-color-border-off)}.dnb-radio__input[disabled]~.dnb-radio__button{border-width:var(--radio-border-width--disabled)}.dnb-radio__input[disabled]:checked~.dnb-radio__button,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__button{background-color:var(--radio-color-background--disabled);border-color:var(--radio-color-border-on--disabled)}.dnb-radio__input[disabled]:checked~.dnb-radio__dot,.dnb-radio__input[disabled][data-checked=true]~.dnb-radio__dot{background-color:var(--radio-color-dot-on--disabled)}.dnb-radio__input[disabled]:not(:checked):not([data-checked=true])~.dnb-radio__button:not(.dnb-skeleton){background-color:var(--radio-color-background--disabled);border-color:var(--radio-color-border-off--disabled)}.dnb-radio__input[disabled]~.dnb-radio__button.dnb-skeleton{border-color:var(--skeleton-color)}.dnb-radio__input[disabled]~.dnb-radio__button.dnb-skeleton:before{border-radius:0}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__button,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__button{border-color:var(--radio-color-border-on--active)}.dnb-radio__input:not([disabled]):checked:active~.dnb-radio__dot,.dnb-radio__input:not([disabled])[data-checked=true]:active~.dnb-radio__dot{background-color:var(--radio-color-dot-on--active)}.dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):active~.dnb-radio__button{background-color:var(--radio-color-background-off--active);border-color:var(--radio-color-border-off--active)}.dnb-radio__input:not([disabled]):not(:focus):checked:hover~.dnb-radio__dot,.dnb-radio__input:not([disabled]):not(:focus)[data-checked=true]:hover~.dnb-radio__dot{background-color:var(--radio-color-dot-on--hover)}.dnb-radio__input:not([disabled]):not(:focus):checked:hover~.dnb-radio__button,.dnb-radio__input:not([disabled]):not(:focus)[data-checked=true]:hover~.dnb-radio__button{background-color:var(--radio-color-background-on--hover);border-width:var(--radio-border-width-on--hover)}.dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button{background-color:var(--radio-color-background-off--hover);border-width:var(--radio-border-width--hover)}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):focus~.dnb-radio__button{border:none}.dnb-radio__input:not([disabled]):active~.dnb-radio__focus,.dnb-radio__input:not([disabled]):focus~.dnb-radio__focus{display:block}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover):checked:focus~.dnb-radio__button,html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover)[data-checked=true]:focus~.dnb-radio__button{background-color:var(--radio-color-background-on--focus)}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover):checked:focus~.dnb-radio__dot,html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:active):not(:hover)[data-checked=true]:focus~.dnb-radio__dot{background-color:var(--radio-color-dot-on--focus,var(--focus-ring-color))}html[data-whatinput=keyboard] .dnb-radio__input:not([disabled]):not(:checked):not([data-checked=true]):focus~.dnb-radio__button{background-color:var(--radio-color-background-off--focus)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__button{border:none}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)~.dnb-radio__focus{--border-color:var(--radio-color-border-on--error);--border-width:var(--radio-focus-ring-width--error);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color);display:block}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):hover~.dnb-radio__focus{--border-color:var(--radio-color-border--error-hover);--border-width:var(--radio-focus-ring-width--error);border-color:transparent;box-shadow:0 0 0 var(--border-width) var(--border-color)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover):checked~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):not(:hover)[data-checked=true]~.dnb-radio__dot{background-color:var(--radio-color-dot-on--error)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):checked:hover~.dnb-radio__dot,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)[data-checked=true]:hover~.dnb-radio__dot{background-color:var(--radio-color-dot-on--error-hover)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active):checked:hover~.dnb-radio__button,.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:active)[data-checked=true]:hover~.dnb-radio__button{background-color:var(--radio-color-background-on--error-hover)}.dnb-radio__status--error .dnb-radio__input:not([disabled]):not(:focus):not(:checked):not([data-checked=true]):hover~.dnb-radio__button{background-color:var(--radio-color-background-off--error-hover)}