@dnb/eufemia 10.37.0 → 10.38.0

package/components/accordion/Accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.js","names":["React","useContext","useState","useEffect","useRef","classnames","makeUniqueId","findElementInChildren","extendPropsWithContext","validateDOMAttributes","dispatchCustomElementEvent","createSpacingClasses","AccordionGroup","AccordionHeader","AccordionContent","AccordionContext","AccordionProviderContext","Context","AccordionStore","Store","rememberWarning","accordionDefaultProps","Accordion","_ref","variant","icon_size","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","group","id","current","store","previousExpanded","setPreviousExpanded","expanded","setExpanded","getInitialExpandedState","hasAddedCallbackRef","undefined","thisInstance","_id","handleDisabledClick","callOnChange","callOnChangeHandler","close","setExpandedState","state","window","addInstance","onInit","_window","_window$__dnbAccordio","removeInstance","flush_remembered_state","flush","expanded_id","collapseAllHandleRef","_context$collapseAcco","collapseAccordionCallbacks","push","changeOpened","expanded_ssr","remember_state","storedExpanded","getState","saveState","e","preventDefault","_len","arguments","length","params","Array","_key","onChange","_window2","_window2$__dnbAccordi","event","console","log","createElement","Consumer","globalContext","nestedContext","expandedState","extendedProps","skeleton","translation","className","prerender","prevent_rerender","prevent_rerender_conditional","single_container","disabled","no_animation","_expanded_ssr","children","_group","title","description","left_component","icon","icon_position","on_change","on_state_update","contentRef","restOfExtendedProps","_excluded2","mainParams","onClick","extendedPropsForContext","accordionContext","Provider","value","cur","type","_AccordionHeader","defaultProps","Group","expandedId","setExpandedId","instanceIDs","storedData","getData","currentIDs","includes","fallbackId","instance","_extends","Header","Content","_supportsSpacingProps"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["/**\n * Web Accordion Component\n *\n */\n\nimport React, {\n  useContext,\n  useState,\n  useEffect,\n  useRef,\n  HTMLProps,\n} from 'react'\n\nimport classnames from 'classnames'\nimport {\n  makeUniqueId,\n  findElementInChildren,\n  extendPropsWithContext,\n  validateDOMAttributes,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\n\nimport type { ButtonIconPosition } from '../Button'\nimport type { HeadingLevel } from '../Heading'\nimport type { IconIcon, IconSize } from '../Icon'\nimport type { SkeletonShow } from '../Skeleton'\nimport type { SpacingProps } from '../space/types'\n\nimport AccordionGroup from './AccordionGroup'\nimport AccordionHeader from './AccordionHeader'\nimport AccordionContent from './AccordionContent'\nimport AccordionContext from './AccordionContext'\nimport AccordionProviderContext from './AccordionProviderContext'\nimport Context from '../../shared/Context'\n\nimport { AccordionStore, Store, rememberWarning } from './AccordionStore'\nimport { accordionDefaultProps } from './defaultProps'\n\nexport type AccordionVariant = 'plain' | 'default' | 'outlined' | 'filled'\n\nexport type AccordionHeading = boolean | React.ReactNode\n\nexport type AccordionIcon =\n  | IconIcon\n  | {\n      closed?: IconIcon\n      /**\n       * If set to `true` the accordion will be expanded as its initial state.\n       */\n      expanded?: IconIcon\n    }\n\nexport type AccordionAttributes = string | Record<string, unknown>\n\nexport type AccordionIconPosition = ButtonIconPosition\n\nexport type AccordionProps = Omit<React.HTMLProps<HTMLElement>, 'ref'> &\n  SpacingProps & {\n    /**\n     * A title as a string or React element. It will be used as the button text.\n     */\n    title?: React.ReactNode\n    description?: React.ReactNode\n    /**\n     * If set to `true` the accordion will be expanded as its initial state.\n     */\n    expanded?: boolean\n    /**\n     * If set to `true`, the open and close animation will be omitted.\n     */\n    no_animation?: boolean\n    /**\n     * If set to `true` the accordion will be expanded during SSR. Can be potentially useful for SEO, although it will disturb client hydration, where React expects the same state. But that&#39;s mainly a technical aspect to consider.\n     */\n    expanded_ssr?: boolean\n    /**\n     */\n    prerender?: boolean\n    /**\n     * If set to `true` the accordion component will not re-render its content – can be useful for widgets you don&#39;t have control of storing the temporary state during an interaction.\n     */\n    prevent_rerender?: boolean\n    /**\n     * Use this prop together with `prevent_rerender` – and if it is to `true`, the accordion component will re-render if the children are a new React element and does not match the previous one anymore.\n     */\n    prevent_rerender_conditional?: boolean\n    /**\n     * If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the sate in the local storage.\n     */\n    remember_state?: boolean\n    /**\n     * Send along a custom React Ref for `.dnb-accordion__content`.\n     */\n    contentRef?: React.MutableRefObject<unknown>\n    /**\n     * If set to `true`, the saved (remembered) will be removed and the initial component state will be used and set.\n     */\n    flush_remembered_state?: boolean\n    /**\n     * If set to `true`, a group of accordions will be wrapped to sidebar looking menu for medium and larger screens.\n     */\n    single_container?: boolean\n    /**\n     * Defines the used styling. As of now, only `outlined` is available. Use `plain` for no styles. It defaults to `outlined`.\n     */\n    variant?: AccordionVariant\n    /**\n     * Will add a React element on the left side of the `title`, inside `AccordionHeaderContainer`.\n     */\n    left_component?: React.ReactNode\n    /**\n     * If set to `true`, the accordion button will be disabled (dimmed).\n     */\n    disabled?: boolean\n    /**\n     * If set to `true`, an overlaying skeleton with animation will be shown.\n     */\n    skeleton?: SkeletonShow\n    /**\n     * A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.\n     */\n    id?: string\n    group?: string\n    /**\n     * Gives you the option to replace the used `button` element. Provide a React element, including a string (HTML element). Defaults to a `div` with all the needed accessibility features included.\n     */\n    element?: React.ReactNode\n    /**\n     * If set to `true`, level 2 (h2) will be used. You can provide your own HTML heading (`h3`), or provide a `heading_level` property.\n     */\n    heading?: AccordionHeading\n    /**\n     * If `heading` is set to `true`, you can provide a numeric value to define a different heading level. Defaults to `2`.\n     */\n    heading_level?: HeadingLevel\n    /**\n     * Will replace the `chevron` icon. The icon will still rotate (by CSS). You can use an object to use two different icons, one for the closed state and one for the expanded state `{ closed, expanded }`.\n     */\n    icon?: AccordionIcon\n    /**\n     * Will set the placement of the icon. Defaults to `left`.\n     */\n    icon_position?: AccordionIconPosition\n    /**\n     * Define a different icon size. Defaults to `medium` (1.5rem).\n     */\n    icon_size?: IconSize\n    attributes?: AccordionAttributes\n    className?: string\n    children?: React.ReactNode\n    /**\n     * Will be called by user click interaction. Returns an object with a boolean state `expanded` inside `{ expanded, id, event, ...event }`.\n     */\n    on_change?: (...args: any[]) => any\n    on_state_update?: (...args: any[]) => any\n  }\n\nfunction Accordion({\n  variant = 'outlined',\n  icon_size = 'medium',\n  ...restOfProps\n}: AccordionProps) {\n  const props = { variant, icon_size, ...restOfProps }\n\n  const context = useContext(AccordionProviderContext)\n\n  const group = props.group || context?.group\n  const id = useRef(props.id || makeUniqueId()).current\n\n  const store = new Store({ id: props.id, group })\n\n  // States ordered last here to make sure that the getInitialExpandedState have access to the store\n  const [previousExpanded, setPreviousExpanded] = useState(props.expanded)\n  const [expanded, setExpanded] = useState<boolean>(\n    getInitialExpandedState()\n  )\n  const hasAddedCallbackRef = useRef<boolean>(false)\n\n  // replacement for getDerivedStateFromProps\n  if (props.expanded !== previousExpanded) {\n    setExpanded(props.expanded !== undefined ? props.expanded : false)\n    setPreviousExpanded(props.expanded)\n  }\n\n  const thisInstance = {\n    _id: id,\n    context,\n    handleDisabledClick,\n    callOnChange,\n    callOnChangeHandler,\n    close,\n    setExpandedState,\n    state: { expanded, group },\n    props,\n    store,\n  }\n\n  // Constructor\n  useEffect(() => {\n    if (group && typeof window !== 'undefined') {\n      window['__dnbAccordion'] = window['__dnbAccordion'] || {}\n      window['__dnbAccordion'][group] =\n        window['__dnbAccordion'][group] || new AccordionStore(group)\n\n      window['__dnbAccordion'][group].addInstance(thisInstance)\n    }\n\n    if (context && typeof context?.onInit === 'function') {\n      context.onInit(thisInstance)\n    }\n\n    return () => {\n      if (group && typeof window !== 'undefined') {\n        window?.['__dnbAccordion'][group]?.removeInstance(thisInstance)\n      }\n    }\n  }, [])\n\n  // componentDidUpdate\n  useEffect(() => {\n    if (context.flush_remembered_state) {\n      store.flush()\n      setExpanded(props.expanded)\n    }\n\n    if (context?.expanded_id && context.expanded_id === props.id) {\n      setExpanded(true)\n    }\n  }, [context.flush_remembered_state, context.expanded_id])\n\n  // Add callback for closing all accordions inside a group if collapseAllHandleRef is defined\n  if (context?.collapseAllHandleRef && !hasAddedCallbackRef.current) {\n    context?.collapseAccordionCallbacks?.current.push(() =>\n      changeOpened(false)\n    )\n    hasAddedCallbackRef.current = true\n  }\n\n  // Gets the initial expanded sate, to prevent the opening and closing of Accordion\n  // That happens when if we put this logic in a useEffect that runs after the initial expanded state is set\n  // Since useEffect runs after every render\n  function getInitialExpandedState() {\n    if (props.expanded_ssr || context?.expanded_ssr) {\n      return typeof window === 'undefined'\n    }\n\n    if (props.remember_state || context.remember_state) {\n      const storedExpanded = store.getState()\n\n      if (props.expanded && storedExpanded === false) {\n        return false\n      }\n\n      if (storedExpanded) {\n        return true\n      }\n    }\n\n    return props.expanded !== undefined\n      ? props.expanded\n      : context?.expanded !== undefined\n      ? context.expanded\n      : false\n  }\n\n  function setExpandedState(expanded: boolean) {\n    setExpanded(expanded)\n  }\n\n  function close() {\n    changeOpened(false)\n  }\n\n  function changeOpened(expanded: boolean) {\n    setExpanded(expanded)\n\n    // check if a event exists, because, then it's a user click\n    if (props.remember_state || context.remember_state) {\n      store.saveState(expanded)\n    }\n  }\n\n  function handleDisabledClick(e: React.MouseEvent<HTMLElement>) {\n    e.preventDefault()\n    return false\n  }\n\n  function callOnChangeHandler(...params: any[]) {\n    callOnChange(...params)\n    if (context?.onChange) {\n      context?.onChange(...params)\n    }\n    if (group && typeof window !== 'undefined') {\n      window?.['__dnbAccordion'][group]?.onChange(...params)\n    }\n  }\n\n  function callOnChange(...params: any[]) {\n    const { expanded, event } = params[0]\n\n    changeOpened(expanded)\n\n    dispatchCustomElementEvent(thisInstance, 'on_change', {\n      expanded,\n      event,\n    })\n  }\n  console.log('context', context)\n  return (\n    <Context.Consumer>\n      {(globalContext) => (\n        <AccordionContext.Consumer>\n          {(nestedContext) => {\n            // use only the props from context, who are available here anyway\n            let expandedState = expanded\n\n            const extendedProps = extendPropsWithContext(\n              props,\n              accordionDefaultProps,\n              context, // group context\n              nestedContext as Record<string, unknown>, // internal context\n              { skeleton: globalContext?.skeleton },\n              globalContext.Accordion, // global context\n              globalContext.translation['Accordion']\n            )\n\n            if (expandedState === undefined && globalContext.Accordion) {\n              if (globalContext.Accordion.expanded) {\n                expandedState = extendedProps.expanded\n              }\n            }\n\n            const {\n              variant,\n              className,\n              prerender,\n              prevent_rerender,\n              prevent_rerender_conditional,\n              single_container,\n              remember_state,\n              disabled,\n              skeleton,\n              no_animation,\n              expanded_ssr: _expanded_ssr, // eslint-disable-line\n              children,\n\n              id: _id, // eslint-disable-line\n              group: _group, // eslint-disable-line\n              // expanded: _expanded, // eslint-disable-line\n\n              title, // eslint-disable-line\n              description, // eslint-disable-line\n              left_component, // eslint-disable-line\n              icon, // eslint-disable-line\n              icon_position, // eslint-disable-line\n              icon_size, // eslint-disable-line\n              on_change, // eslint-disable-line\n              on_state_update, // eslint-disable-line\n\n              contentRef, // eslint-disable-line\n\n              ...restOfExtendedProps\n            } = extendedProps\n\n            const mainParams = {\n              id,\n              className: classnames(\n                'dnb-accordion',\n                expandedState && 'dnb-accordion--expanded',\n                variant && `dnb-accordion__variant--${variant}`,\n                prerender && 'dnb-accordion--prerender',\n                createSpacingClasses(extendedProps),\n                className\n              ),\n            } as HTMLProps<HTMLDivElement>\n\n            if (disabled) {\n              mainParams.onClick = handleDisabledClick\n            }\n\n            // to remove spacing props\n            validateDOMAttributes(props, restOfExtendedProps)\n\n            const extendedPropsForContext = extendPropsWithContext(\n              props,\n              accordionDefaultProps,\n              { expanded, group },\n              context\n            )\n\n            const accordionContext = {\n              ...extendedPropsForContext,\n              id,\n              expanded: expandedState,\n              prerender: prerender,\n              prevent_rerender: prevent_rerender,\n              prevent_rerender_conditional: prevent_rerender_conditional,\n              single_container: single_container,\n              remember_state: remember_state,\n              disabled: disabled,\n              skeleton: skeleton,\n              no_animation: no_animation,\n              callOnChange: callOnChangeHandler,\n            }\n\n            return (\n              <AccordionContext.Provider value={accordionContext}>\n                <div {...mainParams}>\n                  {findElementInChildren(\n                    children,\n                    (cur) => cur.type === AccordionHeader\n                  ) ? null : (\n                    <AccordionHeader />\n                  )}\n                  {findElementInChildren(\n                    children,\n                    (cur) => cur.type === AccordionContent\n                  ) ? (\n                    children\n                  ) : (\n                    <AccordionContent>{children}</AccordionContent>\n                  )}\n                </div>\n              </AccordionContext.Provider>\n            )\n          }}\n        </AccordionContext.Consumer>\n      )}\n    </Context.Consumer>\n  )\n}\n// TEMPORARY SOLUTION (defaultProps will be deprecated at one point). Needs to replacement with default prop parameters for example \"({expanded: null})\"\n// Only solved this way to prevent tests from failing, for when expanded is undefined instead of null\nAccordion.defaultProps = accordionDefaultProps\n\nexport type GroupProps = AccordionProps & {\n  allow_close_all?: boolean\n  /**\n   * ref handle to collapse all expanded accordions. Send in a ref and use `.current()` to collapse all accordions.\n   *\n   * Default: `undefined`\n   */\n  collapseAllHandleRef?: React.MutableRefObject<() => void>\n  expanded_id?: string\n}\n\nconst Group = (props: GroupProps) => {\n  if (props.remember_state && !props.id) {\n    rememberWarning('accordion group')\n  }\n\n  const [expandedId, setExpandedId] = useState<string | null>(null)\n\n  const instanceIDs = useRef<string[]>([])\n\n  const group = props?.id\n    ? props.id\n    : !props.group\n    ? '#' + makeUniqueId()\n    : undefined\n\n  const store = new Store({ group })\n\n  // Set stored expanded_id on mount\n  useEffect(() => {\n    const storedData = store.getData()\n    const currentIDs = instanceIDs?.current\n\n    if (!storedData?.id) {\n      return\n    }\n\n    if (currentIDs.includes(storedData?.id)) {\n      return\n    }\n\n    // 1. get the fallback id\n    const fallbackId = currentIDs[0]\n\n    if (!fallbackId) {\n      return\n    }\n\n    // 2. set the fallback ids\n    setExpandedId(fallbackId)\n  }, [])\n\n  // Store and reset fallback id\n  useEffect(() => {\n    if (!expandedId) {\n      return\n    }\n\n    // 3. save the fallback id\n    store.saveState(true, expandedId)\n\n    // 4. and reset the fallback id\n    setExpandedId(null)\n  }, [expandedId])\n\n  function onInit(instance) {\n    if (\n      instance.props.id &&\n      !instanceIDs.current.includes(instance.props.id)\n    ) {\n      instanceIDs.current.push(instance.props.id)\n    }\n  }\n\n  return (\n    <AccordionGroup\n      onInit={onInit}\n      {...props}\n      group={group}\n      expanded_id={expandedId || props.expanded_id}\n    />\n  )\n}\n\nAccordion.Provider = AccordionGroup\nAccordion.Header = AccordionHeader\nAccordion.Content = AccordionContent\n\nAccordion.Group = Group\n\nGroup.Store = (group: string, id: string = null) => {\n  return new Store({ group, id })\n}\n\nAccordion.Store = (id: string) => {\n  return new Store({ id })\n}\n\nAccordion._supportsSpacingProps = true\n\nexport default Accordion\n"],"mappings":"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"}
+{"version":3,"file":"Accordion.js","names":["React","useContext","useState","useEffect","useRef","useMemo","classnames","makeUniqueId","findElementInChildren","extendPropsWithContext","validateDOMAttributes","dispatchCustomElementEvent","createSpacingClasses","AccordionGroup","AccordionHeader","AccordionContent","AccordionContext","AccordionProviderContext","Context","AccordionStore","Store","rememberWarning","accordionDefaultProps","Accordion","_ref","variant","icon_size","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","group","id","current","store","previousExpanded","setPreviousExpanded","expanded","setExpanded","getInitialExpandedState","hasAddedCallbackRef","undefined","thisInstance","_id","handleDisabledClick","callOnChange","callOnChangeHandler","close","setExpandedState","state","window","addInstance","onInit","_window","_window$__dnbAccordio","removeInstance","flush_remembered_state","flush","expanded_id","collapseAllHandleRef","_context$collapseAcco","collapseAccordionCallbacks","push","expanded_ssr","remember_state","storedExpanded","getState","changeOpened","saveState","e","preventDefault","_len","arguments","length","params","Array","_key","onChange","_window2","_window2$__dnbAccordi","event","createElement","Consumer","globalContext","nestedContext","expandedState","extendedProps","skeleton","translation","className","prerender","prevent_rerender","prevent_rerender_conditional","single_container","disabled","no_animation","_expanded_ssr","children","_group","title","description","left_component","icon","icon_position","on_change","on_state_update","contentRef","restOfExtendedProps","_excluded2","mainParams","onClick","extendedPropsForContext","accordionContext","Provider","value","cur","type","_AccordionHeader","defaultProps","Group","_ref2","expandBehaviour","_excluded3","expandedId","setExpandedId","instanceIDs","storedData","getData","currentIDs","includes","fallbackId","instance","_extends","Header","Content","_supportsSpacingProps"],"sources":["../../../../src/components/accordion/Accordion.tsx"],"sourcesContent":["/**\n * Web Accordion Component\n *\n */\n\nimport React, {\n  useContext,\n  useState,\n  useEffect,\n  useRef,\n  HTMLProps,\n  useMemo,\n} from 'react'\n\nimport classnames from 'classnames'\nimport {\n  makeUniqueId,\n  findElementInChildren,\n  extendPropsWithContext,\n  validateDOMAttributes,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\n\nimport type { ButtonIconPosition } from '../Button'\nimport type { HeadingLevel } from '../Heading'\nimport type { IconIcon, IconSize } from '../Icon'\nimport type { SkeletonShow } from '../Skeleton'\nimport type { SpacingProps } from '../space/types'\n\nimport AccordionGroup from './AccordionGroup'\nimport AccordionHeader from './AccordionHeader'\nimport AccordionContent from './AccordionContent'\nimport AccordionContext from './AccordionContext'\nimport AccordionProviderContext from './AccordionProviderContext'\nimport Context from '../../shared/Context'\n\nimport { AccordionStore, Store, rememberWarning } from './AccordionStore'\nimport { accordionDefaultProps } from './defaultProps'\n\nexport type AccordionVariant = 'plain' | 'default' | 'outlined' | 'filled'\n\nexport type AccordionHeading = boolean | React.ReactNode\n\nexport type AccordionIcon =\n  | IconIcon\n  | {\n      closed?: IconIcon\n      /**\n       * If set to `true` the accordion will be expanded as its initial state.\n       */\n      expanded?: IconIcon\n    }\n\nexport type AccordionAttributes = string | Record<string, unknown>\n\nexport type AccordionIconPosition = ButtonIconPosition\n\nexport type AccordionProps = Omit<React.HTMLProps<HTMLElement>, 'ref'> &\n  SpacingProps & {\n    /**\n     * A title as a string or React element. It will be used as the button text.\n     */\n    title?: React.ReactNode\n    description?: React.ReactNode\n    /**\n     * If set to `true` the accordion will be expanded as its initial state.\n     */\n    expanded?: boolean\n    /**\n     * If set to `true`, the open and close animation will be omitted.\n     */\n    no_animation?: boolean\n    /**\n     * If set to `true` the accordion will be expanded during SSR. Can be potentially useful for SEO, although it will disturb client hydration, where React expects the same state. But that&#39;s mainly a technical aspect to consider.\n     */\n    expanded_ssr?: boolean\n    /**\n     */\n    prerender?: boolean\n    /**\n     * If set to `true` the accordion component will not re-render its content – can be useful for widgets you don&#39;t have control of storing the temporary state during an interaction.\n     */\n    prevent_rerender?: boolean\n    /**\n     * Use this prop together with `prevent_rerender` – and if it is to `true`, the accordion component will re-render if the children are a new React element and does not match the previous one anymore.\n     */\n    prevent_rerender_conditional?: boolean\n    /**\n     * If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the sate in the local storage.\n     */\n    remember_state?: boolean\n    /**\n     * Send along a custom React Ref for `.dnb-accordion__content`.\n     */\n    contentRef?: React.MutableRefObject<unknown>\n    /**\n     * If set to `true`, the saved (remembered) will be removed and the initial component state will be used and set.\n     */\n    flush_remembered_state?: boolean\n    /**\n     * If set to `true`, a group of accordions will be wrapped to sidebar looking menu for medium and larger screens.\n     */\n    single_container?: boolean\n    /**\n     * Defines the used styling. As of now, only `outlined` is available. Use `plain` for no styles. It defaults to `outlined`.\n     */\n    variant?: AccordionVariant\n    /**\n     * Will add a React element on the left side of the `title`, inside `AccordionHeaderContainer`.\n     */\n    left_component?: React.ReactNode\n    /**\n     * If set to `true`, the accordion button will be disabled (dimmed).\n     */\n    disabled?: boolean\n    /**\n     * If set to `true`, an overlaying skeleton with animation will be shown.\n     */\n    skeleton?: SkeletonShow\n    /**\n     * A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.\n     */\n    id?: string\n    group?: string\n    /**\n     * Gives you the option to replace the used `button` element. Provide a React element, including a string (HTML element). Defaults to a `div` with all the needed accessibility features included.\n     */\n    element?: React.ReactNode\n    /**\n     * If set to `true`, level 2 (h2) will be used. You can provide your own HTML heading (`h3`), or provide a `heading_level` property.\n     */\n    heading?: AccordionHeading\n    /**\n     * If `heading` is set to `true`, you can provide a numeric value to define a different heading level. Defaults to `2`.\n     */\n    heading_level?: HeadingLevel\n    /**\n     * Will replace the `chevron` icon. The icon will still rotate (by CSS). You can use an object to use two different icons, one for the closed state and one for the expanded state `{ closed, expanded }`.\n     */\n    icon?: AccordionIcon\n    /**\n     * Will set the placement of the icon. Defaults to `left`.\n     */\n    icon_position?: AccordionIconPosition\n    /**\n     * Define a different icon size. Defaults to `medium` (1.5rem).\n     */\n    icon_size?: IconSize\n    attributes?: AccordionAttributes\n    className?: string\n    children?: React.ReactNode\n    /**\n     * Will be called by user click interaction. Returns an object with a boolean state `expanded` inside `{ expanded, id, event, ...event }`.\n     */\n    on_change?: (...args: any[]) => any\n    on_state_update?: (...args: any[]) => any\n  }\n\nfunction Accordion({\n  variant = 'outlined',\n  icon_size = 'medium',\n  ...restOfProps\n}: AccordionProps) {\n  const props = { variant, icon_size, ...restOfProps }\n\n  const context = useContext(AccordionProviderContext)\n\n  const group = props.group || context?.group\n  const id = useRef(props.id || makeUniqueId()).current\n\n  const store = new Store({ id: props.id, group })\n\n  // States ordered last here to make sure that the getInitialExpandedState have access to the store\n  const [previousExpanded, setPreviousExpanded] = useState(props.expanded)\n  const [expanded, setExpanded] = useState<boolean>(\n    getInitialExpandedState()\n  )\n  const hasAddedCallbackRef = useRef<boolean>(false)\n\n  // replacement for getDerivedStateFromProps\n  if (props.expanded !== previousExpanded) {\n    setExpanded(props.expanded !== undefined ? props.expanded : false)\n    setPreviousExpanded(props.expanded)\n  }\n\n  const thisInstance = {\n    _id: id,\n    context,\n    handleDisabledClick,\n    callOnChange,\n    callOnChangeHandler,\n    close,\n    setExpandedState,\n    state: { expanded, group },\n    props,\n    store,\n  }\n\n  // Constructor\n  useEffect(() => {\n    if (group && typeof window !== 'undefined') {\n      window['__dnbAccordion'] = window['__dnbAccordion'] || {}\n      window['__dnbAccordion'][group] =\n        window['__dnbAccordion'][group] || new AccordionStore(group)\n\n      window['__dnbAccordion'][group].addInstance(thisInstance)\n    }\n\n    if (context && typeof context?.onInit === 'function') {\n      context.onInit(thisInstance)\n    }\n\n    return () => {\n      if (group && typeof window !== 'undefined') {\n        window?.['__dnbAccordion'][group]?.removeInstance(thisInstance)\n      }\n    }\n  }, [])\n\n  // componentDidUpdate\n  useEffect(() => {\n    if (context.flush_remembered_state) {\n      store.flush()\n      setExpanded(props.expanded)\n    }\n\n    if (context?.expanded_id && context.expanded_id === props.id) {\n      setExpanded(true)\n    }\n  }, [\n    context.flush_remembered_state,\n    context.expanded_id,\n    props.expanded,\n    props.id,\n    store,\n  ])\n\n  // Add callback for closing all accordions inside a group if collapseAllHandleRef is defined\n  if (context?.collapseAllHandleRef && !hasAddedCallbackRef.current) {\n    context?.collapseAccordionCallbacks?.current.push(close)\n    hasAddedCallbackRef.current = true\n  }\n\n  // Gets the initial expanded sate, to prevent the opening and closing of Accordion\n  // That happens when if we put this logic in a useEffect that runs after the initial expanded state is set\n  // Since useEffect runs after every render\n  function getInitialExpandedState() {\n    if (props.expanded_ssr || context?.expanded_ssr) {\n      return typeof window === 'undefined'\n    }\n\n    if (props.remember_state || context.remember_state) {\n      const storedExpanded = store.getState()\n\n      if (props.expanded && storedExpanded === false) {\n        return false\n      }\n\n      if (storedExpanded) {\n        return true\n      }\n    }\n\n    return props.expanded !== undefined\n      ? props.expanded\n      : context?.expanded !== undefined\n      ? context.expanded\n      : false\n  }\n\n  function setExpandedState(expanded: boolean) {\n    setExpanded(expanded)\n  }\n\n  function close() {\n    changeOpened(false)\n  }\n\n  function changeOpened(expanded: boolean) {\n    setExpanded(expanded)\n\n    // check if a event exists, because, then it's a user click\n    if (props.remember_state || context.remember_state) {\n      store.saveState(expanded)\n    }\n  }\n\n  function handleDisabledClick(e: React.MouseEvent<HTMLElement>) {\n    e.preventDefault()\n    return false\n  }\n\n  function callOnChangeHandler(...params: any[]) {\n    callOnChange(...params)\n    if (context?.onChange) {\n      context?.onChange(...params)\n    }\n    if (group && typeof window !== 'undefined') {\n      window?.['__dnbAccordion'][group]?.onChange(...params)\n    }\n  }\n\n  function callOnChange(...params: any[]) {\n    const { expanded, event } = params[0]\n\n    changeOpened(expanded)\n\n    dispatchCustomElementEvent(thisInstance, 'on_change', {\n      expanded,\n      event,\n    })\n  }\n\n  return (\n    <Context.Consumer>\n      {(globalContext) => (\n        <AccordionContext.Consumer>\n          {(nestedContext) => {\n            // use only the props from context, who are available here anyway\n            let expandedState = expanded\n\n            const extendedProps = extendPropsWithContext(\n              props,\n              accordionDefaultProps,\n              context, // group context\n              nestedContext as Record<string, unknown>, // internal context\n              { skeleton: globalContext?.skeleton },\n              globalContext.Accordion, // global context\n              globalContext.translation['Accordion']\n            )\n\n            if (expandedState === undefined && globalContext.Accordion) {\n              if (globalContext.Accordion.expanded) {\n                expandedState = extendedProps.expanded\n              }\n            }\n\n            const {\n              variant,\n              className,\n              prerender,\n              prevent_rerender,\n              prevent_rerender_conditional,\n              single_container,\n              remember_state,\n              disabled,\n              skeleton,\n              no_animation,\n              expanded_ssr: _expanded_ssr, // eslint-disable-line\n              children,\n\n              id: _id, // eslint-disable-line\n              group: _group, // eslint-disable-line\n              // expanded: _expanded, // eslint-disable-line\n\n              title, // eslint-disable-line\n              description, // eslint-disable-line\n              left_component, // eslint-disable-line\n              icon, // eslint-disable-line\n              icon_position, // eslint-disable-line\n              icon_size, // eslint-disable-line\n              on_change, // eslint-disable-line\n              on_state_update, // eslint-disable-line\n\n              contentRef, // eslint-disable-line\n\n              ...restOfExtendedProps\n            } = extendedProps\n\n            const mainParams = {\n              id,\n              className: classnames(\n                'dnb-accordion',\n                expandedState && 'dnb-accordion--expanded',\n                variant && `dnb-accordion__variant--${variant}`,\n                prerender && 'dnb-accordion--prerender',\n                createSpacingClasses(extendedProps),\n                className\n              ),\n            } as HTMLProps<HTMLDivElement>\n\n            if (disabled) {\n              mainParams.onClick = handleDisabledClick\n            }\n\n            // to remove spacing props\n            validateDOMAttributes(props, restOfExtendedProps)\n\n            const extendedPropsForContext = extendPropsWithContext(\n              props,\n              accordionDefaultProps,\n              { expanded, group },\n              context\n            )\n\n            const accordionContext = {\n              ...extendedPropsForContext,\n              id,\n              expanded: expandedState,\n              prerender: prerender,\n              prevent_rerender: prevent_rerender,\n              prevent_rerender_conditional: prevent_rerender_conditional,\n              single_container: single_container,\n              remember_state: remember_state,\n              disabled: disabled,\n              skeleton: skeleton,\n              no_animation: no_animation,\n              callOnChange: callOnChangeHandler,\n            }\n\n            return (\n              <AccordionContext.Provider value={accordionContext}>\n                <div {...mainParams}>\n                  {findElementInChildren(\n                    children,\n                    (cur) => cur.type === AccordionHeader\n                  ) ? null : (\n                    <AccordionHeader />\n                  )}\n                  {findElementInChildren(\n                    children,\n                    (cur) => cur.type === AccordionContent\n                  ) ? (\n                    children\n                  ) : (\n                    <AccordionContent>{children}</AccordionContent>\n                  )}\n                </div>\n              </AccordionContext.Provider>\n            )\n          }}\n        </AccordionContext.Consumer>\n      )}\n    </Context.Consumer>\n  )\n}\n// TEMPORARY SOLUTION (defaultProps will be deprecated at one point). Needs to replacement with default prop parameters for example \"({expanded: null})\"\n// Only solved this way to prevent tests from failing, for when expanded is undefined instead of null\nAccordion.defaultProps = accordionDefaultProps\n\nexport type GroupProps = AccordionProps & {\n  allow_close_all?: boolean\n  /**\n   * Determines how many accordions can be expanded at once.\n   * Default: `single`\n   */\n  expandBehaviour?: 'single' | 'multiple'\n  /**\n   * ref handle to collapse all expanded accordions. Send in a ref and use `.current()` to collapse all accordions.\n   *\n   * Default: `undefined`\n   */\n  expanded_id?: string\n  collapseAllHandleRef?: React.MutableRefObject<() => void>\n}\n\nconst Group = ({ expandBehaviour = 'single', ...props }: GroupProps) => {\n  if (props.remember_state && !props.id) {\n    rememberWarning('accordion group')\n  }\n\n  const [expandedId, setExpandedId] = useState<string | null>(null)\n\n  const instanceIDs = useRef<string[]>([])\n\n  const group = props?.id\n    ? props.id\n    : !props.group\n    ? '#' + makeUniqueId()\n    : undefined\n\n  const store = useMemo(() => new Store({ group }), [group])\n\n  // Set stored expanded_id on mount\n  useEffect(() => {\n    const storedData = store.getData()\n    const currentIDs = instanceIDs?.current\n\n    if (!storedData?.id) {\n      return\n    }\n\n    if (currentIDs.includes(storedData?.id)) {\n      return\n    }\n\n    // 1. get the fallback id\n    const fallbackId = currentIDs[0]\n\n    if (!fallbackId) {\n      return\n    }\n\n    // 2. set the fallback ids\n    setExpandedId(fallbackId)\n  }, [store])\n\n  // Store and reset fallback id\n  useEffect(() => {\n    if (!expandedId) {\n      return\n    }\n\n    // 3. save the fallback id\n    store.saveState(true, expandedId)\n\n    // 4. and reset the fallback id\n    setExpandedId(null)\n  }, [expandedId, store])\n\n  function onInit(instance) {\n    if (\n      instance.props.id &&\n      !instanceIDs.current.includes(instance.props.id)\n    ) {\n      instanceIDs.current.push(instance.props.id)\n    }\n  }\n\n  return (\n    <AccordionGroup\n      onInit={onInit}\n      {...props}\n      group={group}\n      expandBehaviour={expandBehaviour}\n      expanded_id={expandedId || props.expanded_id}\n    />\n  )\n}\n\nAccordion.Provider = AccordionGroup\nAccordion.Header = AccordionHeader\nAccordion.Content = AccordionContent\n\nAccordion.Group = Group\n\nGroup.Store = (group: string, id: string = null) => {\n  return new Store({ group, id })\n}\n\nAccordion.Store = (id: string) => {\n  return new Store({ id })\n}\n\nAccordion._supportsSpacingProps = true\n\nexport default Accordion\n"],"mappings":"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"}

package/components/accordion/AccordionContext.d.ts

@@ -5,8 +5,10 @@
 import React from 'react';
 import { SkeletonContextProps } from '../skeleton/SkeletonHelper';
 import { AccordionProps } from './Accordion';
+import { AccordionGroupProps } from './AccordionGroup';
 export type AccordionContextProps = AccordionProps & SkeletonContextProps & {
     allow_close_all?: boolean;
+    expandBehaviour: AccordionGroupProps['expandBehaviour'];
     callOnChange?: (parameters: {
         id: string;
         group: string;

package/components/accordion/AccordionContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionContext.js","names":["React","AccordionContext","createContext"],"sources":["../../../../src/components/accordion/AccordionContext.ts"],"sourcesContent":["/**\n * Web AccordionGroup Context\n *\n */\n\nimport React from 'react'\nimport { SkeletonContextProps } from '../skeleton/SkeletonHelper'\nimport { AccordionProps } from './Accordion'\n\nexport type AccordionContextProps = AccordionProps &\n  SkeletonContextProps & {\n    allow_close_all?: boolean\n    callOnChange?: (parameters: {\n      id: string\n      group: string\n      expanded: boolean\n      event:\n        | React.MouseEvent<HTMLElement>\n        | React.KeyboardEvent<HTMLElement>\n    }) => void\n  }\n\nconst AccordionContext = React.createContext<AccordionContextProps>({})\n\nexport default AccordionContext\n"],"mappings":"AAKA,OAAOA,KAAK,MAAM,OAAO;AAiBzB,MAAMC,gBAAgB,GAAGD,KAAK,CAACE,aAAa,CAAwB,CAAC,CAAC,CAAC;AAEvE,eAAeD,gBAAgB"}
+{"version":3,"file":"AccordionContext.js","names":["React","AccordionContext","createContext"],"sources":["../../../../src/components/accordion/AccordionContext.ts"],"sourcesContent":["/**\n * Web AccordionGroup Context\n *\n */\n\nimport React from 'react'\nimport { SkeletonContextProps } from '../skeleton/SkeletonHelper'\nimport { AccordionProps } from './Accordion'\nimport { AccordionGroupProps } from './AccordionGroup'\n\nexport type AccordionContextProps = AccordionProps &\n  SkeletonContextProps & {\n    allow_close_all?: boolean\n    expandBehaviour: AccordionGroupProps['expandBehaviour']\n    callOnChange?: (parameters: {\n      id: string\n      group: string\n      expanded: boolean\n      event:\n        | React.MouseEvent<HTMLElement>\n        | React.KeyboardEvent<HTMLElement>\n    }) => void\n  }\n\nconst AccordionContext = React.createContext<AccordionContextProps>({})\n\nexport default AccordionContext\n"],"mappings":"AAKA,OAAOA,KAAK,MAAM,OAAO;AAmBzB,MAAMC,gBAAgB,GAAGD,KAAK,CAACE,aAAa,CAAwB,CAAC,CAAC,CAAC;AAEvE,eAAeD,gBAAgB"}

package/components/accordion/AccordionDocs.js

@@ -131,6 +131,11 @@ export const AccordionProviderGroupProperties = {
     type: 'boolean',
     status: 'optional'
   },
+  expandBehaviour: {
+    doc: 'Determines how many accordions can be expanded at once. Defaults to `single`',
+    type: ['single', 'multiple'],
+    status: 'optional'
+  },
   expanded_id: {
     doc: 'Define an `id` of a nested accordion that will get expanded.',
     type: 'string',

package/components/accordion/AccordionDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionDocs.js","names":["AccordionProperties","id","doc","type","status","title","expanded","expanded_ssr","remember_state","flush_remembered_state","no_animation","variant","icon","icon_position","icon_size","left_component","prerender","prevent_rerender","prevent_rerender_conditional","single_container","element","heading","heading_level","disabled","skeleton","contentRef","collapseAllHandleRef","space","AccordionProviderGroupProperties","group","allow_close_all","expanded_id","AccordionEvents","on_change"],"sources":["../../../../src/components/accordion/AccordionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const AccordionProperties: PropertiesTableProps = {\n  id: {\n    doc: 'A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'A title as a string or React element. It will be used as the button text.',\n    type: 'string',\n    status: 'optional',\n  },\n  expanded: {\n    doc: 'If set to `true` the accordion will be expanded as its initial state.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  expanded_ssr: {\n    doc: \"If set to `true` the accordion will be expanded during SSR. Can be potentially useful for SEO, although it will disturb client hydration, where React expects the same state. But that's mainly a technical aspect to consider.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  remember_state: {\n    doc: 'If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the state in the local storage.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  flush_remembered_state: {\n    doc: 'If set to `true`, the saved (remembered) state will be removed and the initial component state will be used and set.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  no_animation: {\n    doc: 'If set to `true`, the open and close animation will be omitted.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  variant: {\n    doc: 'Defines the used styling. `Outlined`, `filled`, or `plain` (no styling). Defaults to `outlined`.',\n    type: ['outlined', 'filled', 'plain'],\n    status: 'optional',\n  },\n  icon: {\n    doc: 'Will replace the `chevron` icon. The icon will still rotate (by CSS). You can use an object to use two different icons, one for the closed state and one for the expanded state `{ closed, expanded }`.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  icon_position: {\n    doc: 'Will set the placement of the icon. Defaults to `left`.',\n    type: 'string',\n    status: 'optional',\n  },\n  icon_size: {\n    doc: 'Define a different icon size. Defaults to `medium` (1.5rem).',\n    type: 'string',\n    status: 'optional',\n  },\n  left_component: {\n    doc: 'Will add a React element on the left side of the `title`, inside `AccordionHeaderContainer`.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  prerender: {\n    doc: 'If set to `true` the content will be present, even the accordion is not expanded. Can be useful for assistive technology or SEO.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  prevent_rerender: {\n    doc: \"If set to `true` the accordion component will not re-render its content – can be useful for widgets you don't have control of storing the temporary state during an interaction.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  prevent_rerender_conditional: {\n    doc: 'Use this prop together with `prevent_rerender` – and if it is set to `true`, the accordion component will re-render if the children are a new React element and do not match the previous one anymore.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  single_container: {\n    doc: 'If set to `true`, a group of accordions will be wrapped to a sidebar looking menu for medium and larger screens.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Gives you the option to replace the used `button` element. Provide a React element, including a string (HTML element). Defaults to a `div` with all the needed accessibility features included.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  heading: {\n    doc: 'If set to `true`, level 2 (h2) will be used. You can provide your own HTML heading (`h3`), or provide a `heading_level` property.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  heading_level: {\n    doc: 'If `heading` is set to `true`, you can provide a numeric value to define a different heading level. Defaults to `2`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  disabled: {\n    doc: 'If set to `true`, the accordion button will be disabled (dimmed).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  contentRef: {\n    doc: 'Send along a custom React Ref for `.dnb-accordion__content`.',\n    type: 'function',\n    status: 'optional',\n  },\n  collapseAllHandleRef: {\n    doc: 'Ref handle to collapse all expanded accordions. Send in a ref and use `.current()` to collapse all accordions. Default: `undefined`.',\n    type: 'React.MutableRefObject<() => void>',\n    status: 'optional',\n  },\n  space: {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AccordionProviderGroupProperties: PropertiesTableProps = {\n  group: {\n    doc: \"Define a unique id, it will be used to 'group' several accordions into one.\",\n    type: 'string',\n    status: 'optional',\n  },\n  allow_close_all: {\n    doc: 'If set to `true`, the group of accordions will allow all to close.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  expanded_id: {\n    doc: 'Define an `id` of a nested accordion that will get expanded.',\n    type: 'string',\n    status: 'optional',\n  },\n  space: {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AccordionEvents: PropertiesTableProps = {\n  on_change: {\n    doc: 'Will be called by user click interaction. Returns an object with a boolean state `expanded` inside `{ expanded, id, event, ...event }`.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n"],"mappings":"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"}
+{"version":3,"file":"AccordionDocs.js","names":["AccordionProperties","id","doc","type","status","title","expanded","expanded_ssr","remember_state","flush_remembered_state","no_animation","variant","icon","icon_position","icon_size","left_component","prerender","prevent_rerender","prevent_rerender_conditional","single_container","element","heading","heading_level","disabled","skeleton","contentRef","collapseAllHandleRef","space","AccordionProviderGroupProperties","group","allow_close_all","expandBehaviour","expanded_id","AccordionEvents","on_change"],"sources":["../../../../src/components/accordion/AccordionDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const AccordionProperties: PropertiesTableProps = {\n  id: {\n    doc: 'A unique `id` that will be used on the button element. If you use `remember_state`, an id is required.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'A title as a string or React element. It will be used as the button text.',\n    type: 'string',\n    status: 'optional',\n  },\n  expanded: {\n    doc: 'If set to `true` the accordion will be expanded as its initial state.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  expanded_ssr: {\n    doc: \"If set to `true` the accordion will be expanded during SSR. Can be potentially useful for SEO, although it will disturb client hydration, where React expects the same state. But that's mainly a technical aspect to consider.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  remember_state: {\n    doc: 'If set to `true`, it will remember a changed state initiated by the user. It requires a unique `id`. It will store the state in the local storage.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  flush_remembered_state: {\n    doc: 'If set to `true`, the saved (remembered) state will be removed and the initial component state will be used and set.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  no_animation: {\n    doc: 'If set to `true`, the open and close animation will be omitted.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  variant: {\n    doc: 'Defines the used styling. `Outlined`, `filled`, or `plain` (no styling). Defaults to `outlined`.',\n    type: ['outlined', 'filled', 'plain'],\n    status: 'optional',\n  },\n  icon: {\n    doc: 'Will replace the `chevron` icon. The icon will still rotate (by CSS). You can use an object to use two different icons, one for the closed state and one for the expanded state `{ closed, expanded }`.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  icon_position: {\n    doc: 'Will set the placement of the icon. Defaults to `left`.',\n    type: 'string',\n    status: 'optional',\n  },\n  icon_size: {\n    doc: 'Define a different icon size. Defaults to `medium` (1.5rem).',\n    type: 'string',\n    status: 'optional',\n  },\n  left_component: {\n    doc: 'Will add a React element on the left side of the `title`, inside `AccordionHeaderContainer`.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  prerender: {\n    doc: 'If set to `true` the content will be present, even the accordion is not expanded. Can be useful for assistive technology or SEO.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  prevent_rerender: {\n    doc: \"If set to `true` the accordion component will not re-render its content – can be useful for widgets you don't have control of storing the temporary state during an interaction.\",\n    type: 'boolean',\n    status: 'optional',\n  },\n  prevent_rerender_conditional: {\n    doc: 'Use this prop together with `prevent_rerender` – and if it is set to `true`, the accordion component will re-render if the children are a new React element and do not match the previous one anymore.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  single_container: {\n    doc: 'If set to `true`, a group of accordions will be wrapped to a sidebar looking menu for medium and larger screens.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Gives you the option to replace the used `button` element. Provide a React element, including a string (HTML element). Defaults to a `div` with all the needed accessibility features included.',\n    type: 'React.ReactNode',\n    status: 'optional',\n  },\n  heading: {\n    doc: 'If set to `true`, level 2 (h2) will be used. You can provide your own HTML heading (`h3`), or provide a `heading_level` property.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  heading_level: {\n    doc: 'If `heading` is set to `true`, you can provide a numeric value to define a different heading level. Defaults to `2`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  disabled: {\n    doc: 'If set to `true`, the accordion button will be disabled (dimmed).',\n    type: 'boolean',\n    status: 'optional',\n  },\n  skeleton: {\n    doc: 'If set to `true`, an overlaying skeleton with animation will be shown.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  contentRef: {\n    doc: 'Send along a custom React Ref for `.dnb-accordion__content`.',\n    type: 'function',\n    status: 'optional',\n  },\n  collapseAllHandleRef: {\n    doc: 'Ref handle to collapse all expanded accordions. Send in a ref and use `.current()` to collapse all accordions. Default: `undefined`.',\n    type: 'React.MutableRefObject<() => void>',\n    status: 'optional',\n  },\n  space: {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AccordionProviderGroupProperties: PropertiesTableProps = {\n  group: {\n    doc: \"Define a unique id, it will be used to 'group' several accordions into one.\",\n    type: 'string',\n    status: 'optional',\n  },\n  allow_close_all: {\n    doc: 'If set to `true`, the group of accordions will allow all to close.',\n    type: 'boolean',\n    status: 'optional',\n  },\n\n  expandBehaviour: {\n    doc: 'Determines how many accordions can be expanded at once. Defaults to `single`',\n    type: ['single', 'multiple'],\n    status: 'optional',\n  },\n  expanded_id: {\n    doc: 'Define an `id` of a nested accordion that will get expanded.',\n    type: 'string',\n    status: 'optional',\n  },\n  space: {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n\nexport const AccordionEvents: PropertiesTableProps = {\n  on_change: {\n    doc: 'Will be called by user click interaction. Returns an object with a boolean state `expanded` inside `{ expanded, id, event, ...event }`.',\n    type: 'function',\n    status: 'optional',\n  },\n}\n"],"mappings":"AAEA,OAAO,MAAMA,mBAAyC,GAAG;EACvDC,EAAE,EAAE;IACFC,GAAG,EAAE,wGAAwG;IAC7GC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,2EAA2E;IAChFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDE,QAAQ,EAAE;IACRJ,GAAG,EAAE,uEAAuE;IAC5EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDG,YAAY,EAAE;IACZL,GAAG,EAAE,iOAAiO;IACtOC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDI,cAAc,EAAE;IACdN,GAAG,EAAE,oJAAoJ;IACzJC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDK,sBAAsB,EAAE;IACtBP,GAAG,EAAE,sHAAsH;IAC3HC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,YAAY,EAAE;IACZR,GAAG,EAAE,iEAAiE;IACtEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,kGAAkG;IACvGC,IAAI,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,OAAO,CAAC;IACrCC,MAAM,EAAE;EACV,CAAC;EACDQ,IAAI,EAAE;IACJV,GAAG,EAAE,yMAAyM;IAC9MC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDS,aAAa,EAAE;IACbX,GAAG,EAAE,yDAAyD;IAC9DC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDU,SAAS,EAAE;IACTZ,GAAG,EAAE,8DAA8D;IACnEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDW,cAAc,EAAE;IACdb,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDY,SAAS,EAAE;IACTd,GAAG,EAAE,kIAAkI;IACvIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDa,gBAAgB,EAAE;IAChBf,GAAG,EAAE,kLAAkL;IACvLC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDc,4BAA4B,EAAE;IAC5BhB,GAAG,EAAE,wMAAwM;IAC7MC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDe,gBAAgB,EAAE;IAChBjB,GAAG,EAAE,kHAAkH;IACvHC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDgB,OAAO,EAAE;IACPlB,GAAG,EAAE,iMAAiM;IACtMC,IAAI,EAAE,iBAAiB;IACvBC,MAAM,EAAE;EACV,CAAC;EACDiB,OAAO,EAAE;IACPnB,GAAG,EAAE,mIAAmI;IACxIC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDkB,aAAa,EAAE;IACbpB,GAAG,EAAE,sHAAsH;IAC3HC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDmB,QAAQ,EAAE;IACRrB,GAAG,EAAE,mEAAmE;IACxEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDoB,QAAQ,EAAE;IACRtB,GAAG,EAAE,wEAAwE;IAC7EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDqB,UAAU,EAAE;IACVvB,GAAG,EAAE,8DAA8D;IACnEC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV,CAAC;EACDsB,oBAAoB,EAAE;IACpBxB,GAAG,EAAE,sIAAsI;IAC3IC,IAAI,EAAE,oCAAoC;IAC1CC,MAAM,EAAE;EACV,CAAC;EACDuB,KAAK,EAAE;IACLzB,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAMwB,gCAAsD,GAAG;EACpEC,KAAK,EAAE;IACL3B,GAAG,EAAE,6EAA6E;IAClFC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACD0B,eAAe,EAAE;IACf5B,GAAG,EAAE,oEAAoE;IACzEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EAED2B,eAAe,EAAE;IACf7B,GAAG,EAAE,8EAA8E;IACnFC,IAAI,EAAE,CAAC,QAAQ,EAAE,UAAU,CAAC;IAC5BC,MAAM,EAAE;EACV,CAAC;EACD4B,WAAW,EAAE;IACX9B,GAAG,EAAE,8DAA8D;IACnEC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDuB,KAAK,EAAE;IACLzB,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC;AAED,OAAO,MAAM6B,eAAqC,GAAG;EACnDC,SAAS,EAAE;IACThC,GAAG,EAAE,yIAAyI;IAC9IC,IAAI,EAAE,UAAU;IAChBC,MAAM,EAAE;EACV;AACF,CAAC"}

package/components/accordion/AccordionGroup.js

@@ -3,7 +3,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["expanded", "expanded_id", "prerender", "prevent_rerender", "single_container", "contentRef", "allow_close_all", "remember_state", "flush_remembered_state", "disabled", "group", "onInit", "className", "id", "children", "collapseAllHandleRef"];
+const _excluded = ["expanded", "expanded_id", "prerender", "prevent_rerender", "single_container", "contentRef", "allow_close_all", "remember_state", "flush_remembered_state", "disabled", "group", "onInit", "className", "id", "children", "collapseAllHandleRef", "expandBehaviour"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { useContext, useEffect, useRef } from 'react';
@@ -46,7 +46,8 @@ const AccordionGroup = props => {
       className,
       id: _id,
       children,
-      collapseAllHandleRef
+      collapseAllHandleRef,
+      expandBehaviour
     } = extendedProps,
     restOfExtendedProps = _objectWithoutProperties(extendedProps, _excluded);
   const collapseAccordionCallbacks = useRef([]);
@@ -66,7 +67,9 @@ const AccordionGroup = props => {
   const contextForProvider = _objectSpread(_objectSpread({}, extendedProps), {}, {
     id,
     onChange: onChangeHandler,
-    collapseAccordionCallbacks
+    collapseAllHandleRef,
+    collapseAccordionCallbacks,
+    expandBehaviour
   });
   return React.createElement(AccordionGroupContext.Provider, {
     value: contextForProvider

package/components/accordion/AccordionGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionGroup.js","names":["React","useContext","useEffect","useRef","classnames","isTrue","makeUniqueId","extendPropsWithContext","validateDOMAttributes","dispatchCustomElementEvent","createSpacingClasses","Context","AccordionGroupContext","accordionDefaultProps","AccordionGroup","props","context","id","thisInstance","_id","onChangeHandler","event","expanded","extendedProps","Accordion","getTranslation","expanded_id","prerender","prevent_rerender","single_container","contentRef","allow_close_all","remember_state","flush_remembered_state","disabled","group","onInit","className","children","collapseAllHandleRef","restOfExtendedProps","_objectWithoutProperties","_excluded","collapseAccordionCallbacks","current","forEach","callback","classes","params","_objectSpread","contextForProvider","onChange","createElement","Provider","value","_extends","role","_supportsSpacingProps"],"sources":["../../../../src/components/accordion/AccordionGroup.tsx"],"sourcesContent":["/**\n * Web AccordionGroup Component\n *\n */\n\nimport React, { useContext, useEffect, useRef } from 'react'\n\nimport classnames from 'classnames'\nimport {\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContext,\n  validateDOMAttributes,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\n\nimport Context from '../../shared/Context'\nimport AccordionGroupContext from './AccordionProviderContext'\n\nimport type { GroupProps } from './Accordion'\nimport { accordionDefaultProps } from './defaultProps'\n\nexport type AccordionGroupProps = React.HTMLProps<HTMLElement> &\n  GroupProps & {\n    onInit?: (...args: any[]) => any\n  }\n\nconst AccordionGroup = (props: AccordionGroupProps) => {\n  const context = useContext(Context)\n  const id = props.id || makeUniqueId()\n\n  const thisInstance = {\n    _id: id,\n    props,\n    context,\n    onChangeHandler,\n  }\n\n  function onChangeHandler(event) {\n    dispatchCustomElementEvent(thisInstance, 'on_change', {\n      id: event.id,\n      expanded: event.expanded,\n      event,\n    })\n  }\n\n  // use only the props from context, who are available here anyway\n  const extendedProps = extendPropsWithContext(\n    props,\n    accordionDefaultProps,\n    context.Accordion,\n    context.getTranslation(props)['Accordion']\n  )\n\n  const {\n    expanded, // eslint-disable-line\n    expanded_id, // eslint-disable-line\n    prerender, // eslint-disable-line\n    prevent_rerender, // eslint-disable-line\n    single_container, // eslint-disable-line\n    contentRef, // eslint-disable-line\n    allow_close_all, // eslint-disable-line\n    remember_state, // eslint-disable-line\n    flush_remembered_state, // eslint-disable-line\n    disabled, // eslint-disable-line\n    group, // eslint-disable-line\n    onInit, // eslint-disable-line\n    className,\n\n    id: _id, // eslint-disable-line\n    children, // eslint-disable-line\n    collapseAllHandleRef,\n\n    ...restOfExtendedProps\n  } = extendedProps\n\n  const collapseAccordionCallbacks = useRef<(() => void)[]>([])\n\n  useEffect(() => {\n    if (collapseAllHandleRef) {\n      collapseAllHandleRef.current = () => {\n        collapseAccordionCallbacks.current.forEach((callback) =>\n          callback()\n        )\n      }\n    }\n  }, [collapseAllHandleRef])\n\n  const classes = classnames(\n    'dnb-accordion-group',\n    isTrue(single_container) && 'dnb-accordion-group--single-container',\n    createSpacingClasses(extendedProps),\n    className\n  )\n\n  const params = {\n    ...restOfExtendedProps,\n  }\n\n  // also used for code markup simulation\n  validateDOMAttributes(props, params)\n\n  if (!extendedProps?.group && isTrue(props.single_container)) {\n    extendedProps.group = makeUniqueId()\n  }\n\n  const contextForProvider = {\n    ...extendedProps,\n    id,\n    onChange: onChangeHandler,\n    collapseAccordionCallbacks,\n  }\n\n  return (\n    <AccordionGroupContext.Provider value={contextForProvider}>\n      <div className={classes}>\n        <span\n          id={id}\n          className=\"dnb-accordion-group__shell\"\n          role=\"group\"\n          {...params}\n        >\n          <span className=\"dnb-accordion-group__children\">{children}</span>\n        </span>\n      </div>\n    </AccordionGroupContext.Provider>\n  )\n}\n\nAccordionGroup._supportsSpacingProps = true\n\nexport default AccordionGroup\n"],"mappings":"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"}
+{"version":3,"file":"AccordionGroup.js","names":["React","useContext","useEffect","useRef","classnames","isTrue","makeUniqueId","extendPropsWithContext","validateDOMAttributes","dispatchCustomElementEvent","createSpacingClasses","Context","AccordionGroupContext","accordionDefaultProps","AccordionGroup","props","context","id","thisInstance","_id","onChangeHandler","event","expanded","extendedProps","Accordion","getTranslation","expanded_id","prerender","prevent_rerender","single_container","contentRef","allow_close_all","remember_state","flush_remembered_state","disabled","group","onInit","className","children","collapseAllHandleRef","expandBehaviour","restOfExtendedProps","_objectWithoutProperties","_excluded","collapseAccordionCallbacks","current","forEach","callback","classes","params","_objectSpread","contextForProvider","onChange","createElement","Provider","value","_extends","role","_supportsSpacingProps"],"sources":["../../../../src/components/accordion/AccordionGroup.tsx"],"sourcesContent":["/**\n * Web AccordionGroup Component\n *\n */\n\nimport React, { useContext, useEffect, useRef } from 'react'\n\nimport classnames from 'classnames'\nimport {\n  isTrue,\n  makeUniqueId,\n  extendPropsWithContext,\n  validateDOMAttributes,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\n\nimport Context from '../../shared/Context'\nimport AccordionGroupContext from './AccordionProviderContext'\n\nimport type { GroupProps } from './Accordion'\nimport { accordionDefaultProps } from './defaultProps'\n\nexport type AccordionGroupProps = React.HTMLProps<HTMLElement> &\n  GroupProps & {\n    onInit?: (...args: any[]) => any\n  }\n\nconst AccordionGroup = (props: AccordionGroupProps) => {\n  const context = useContext(Context)\n  const id = props.id || makeUniqueId()\n\n  const thisInstance = {\n    _id: id,\n    props,\n    context,\n    onChangeHandler,\n  }\n\n  function onChangeHandler(event) {\n    dispatchCustomElementEvent(thisInstance, 'on_change', {\n      id: event.id,\n      expanded: event.expanded,\n      event,\n    })\n  }\n\n  // use only the props from context, who are available here anyway\n  const extendedProps = extendPropsWithContext(\n    props,\n    accordionDefaultProps,\n    context.Accordion,\n    context.getTranslation(props)['Accordion']\n  )\n\n  const {\n    expanded, // eslint-disable-line\n    expanded_id, // eslint-disable-line\n    prerender, // eslint-disable-line\n    prevent_rerender, // eslint-disable-line\n    single_container, // eslint-disable-line\n    contentRef, // eslint-disable-line\n    allow_close_all, // eslint-disable-line\n    remember_state, // eslint-disable-line\n    flush_remembered_state, // eslint-disable-line\n    disabled, // eslint-disable-line\n    group, // eslint-disable-line\n    onInit, // eslint-disable-line\n    className,\n\n    id: _id, // eslint-disable-line\n    children, // eslint-disable-line\n    collapseAllHandleRef,\n    expandBehaviour,\n\n    ...restOfExtendedProps\n  } = extendedProps\n\n  const collapseAccordionCallbacks = useRef<(() => void)[]>([])\n\n  useEffect(() => {\n    if (collapseAllHandleRef) {\n      collapseAllHandleRef.current = () => {\n        collapseAccordionCallbacks.current.forEach((callback) =>\n          callback()\n        )\n      }\n    }\n  }, [collapseAllHandleRef])\n\n  const classes = classnames(\n    'dnb-accordion-group',\n    isTrue(single_container) && 'dnb-accordion-group--single-container',\n    createSpacingClasses(extendedProps),\n    className\n  )\n\n  const params = {\n    ...restOfExtendedProps,\n  }\n\n  // also used for code markup simulation\n  validateDOMAttributes(props, params)\n\n  if (!extendedProps?.group && isTrue(props.single_container)) {\n    extendedProps.group = makeUniqueId()\n  }\n\n  const contextForProvider = {\n    ...extendedProps,\n    id,\n    onChange: onChangeHandler,\n    collapseAllHandleRef,\n    collapseAccordionCallbacks,\n    expandBehaviour,\n  }\n\n  return (\n    <AccordionGroupContext.Provider value={contextForProvider}>\n      <div className={classes}>\n        <span\n          id={id}\n          className=\"dnb-accordion-group__shell\"\n          role=\"group\"\n          {...params}\n        >\n          <span className=\"dnb-accordion-group__children\">{children}</span>\n        </span>\n      </div>\n    </AccordionGroupContext.Provider>\n  )\n}\n\nAccordionGroup._supportsSpacingProps = true\n\nexport default AccordionGroup\n"],"mappings":"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"}

package/components/accordion/AccordionProviderContext.d.ts

@@ -3,6 +3,7 @@
  *
  */
 import React from 'react';
+import { AccordionGroupProps } from './AccordionGroup';
 type AccordionGroupContextProps = {
     expanded?: boolean;
     group?: string;
@@ -14,6 +15,7 @@ type AccordionGroupContextProps = {
     onInit?: (...args: any[]) => any;
     collapseAccordionCallbacks?: React.MutableRefObject<(() => void)[]>;
     collapseAllHandleRef?: React.MutableRefObject<() => void>;
+    expandBehaviour?: AccordionGroupProps['expandBehaviour'];
 };
 declare const AccordionGroupContext: React.Context<AccordionGroupContextProps>;
 export default AccordionGroupContext;

package/components/accordion/AccordionProviderContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionProviderContext.js","names":["React","AccordionGroupContext","createContext"],"sources":["../../../../src/components/accordion/AccordionProviderContext.ts"],"sourcesContent":["/**\n * Web AccordionGroup Context\n *\n */\n\nimport React from 'react'\n\ntype AccordionGroupContextProps = {\n  expanded?: boolean\n  group?: string\n  expanded_ssr?: boolean\n  remember_state?: boolean\n  flush_remembered_state?: boolean\n  expanded_id?: string\n  onChange?: (...params: unknown[]) => void\n  onInit?: (...args: any[]) => any\n  collapseAccordionCallbacks?: React.MutableRefObject<(() => void)[]>\n  collapseAllHandleRef?: React.MutableRefObject<() => void>\n}\n\nconst AccordionGroupContext =\n  React.createContext<AccordionGroupContextProps>({})\n\nexport default AccordionGroupContext\n"],"mappings":"AAKA,OAAOA,KAAK,MAAM,OAAO;AAezB,MAAMC,qBAAqB,GACzBD,KAAK,CAACE,aAAa,CAA6B,CAAC,CAAC,CAAC;AAErD,eAAeD,qBAAqB"}
+{"version":3,"file":"AccordionProviderContext.js","names":["React","AccordionGroupContext","createContext"],"sources":["../../../../src/components/accordion/AccordionProviderContext.ts"],"sourcesContent":["/**\n * Web AccordionGroup Context\n *\n */\n\nimport React from 'react'\nimport { AccordionGroupProps } from './AccordionGroup'\n\ntype AccordionGroupContextProps = {\n  expanded?: boolean\n  group?: string\n  expanded_ssr?: boolean\n  remember_state?: boolean\n  flush_remembered_state?: boolean\n  expanded_id?: string\n  onChange?: (...params: unknown[]) => void\n  onInit?: (...args: any[]) => any\n  collapseAccordionCallbacks?: React.MutableRefObject<(() => void)[]>\n  collapseAllHandleRef?: React.MutableRefObject<() => void>\n  expandBehaviour?: AccordionGroupProps['expandBehaviour']\n}\n\nconst AccordionGroupContext =\n  React.createContext<AccordionGroupContextProps>({})\n\nexport default AccordionGroupContext\n"],"mappings":"AAKA,OAAOA,KAAK,MAAM,OAAO;AAiBzB,MAAMC,qBAAqB,GACzBD,KAAK,CAACE,aAAa,CAA6B,CAAC,CAAC,CAAC;AAErD,eAAeD,qBAAqB"}

package/components/accordion/AccordionStore.d.ts

@@ -1,4 +1,6 @@
+import { AccordionContextProps } from './AccordionContext';
 type AccordionStoreInstance = {
+    context: AccordionContextProps;
     _id: string;
     close: () => void;
 };

package/components/accordion/AccordionStore.js

@@ -12,7 +12,7 @@ export class AccordionStore {
       id
     } = _ref;
     this._instances.forEach(inst => {
-      if (inst._id !== id) {
+      if (inst.context.expandBehaviour === 'single' && inst._id !== id) {
         inst.close();
       }
     });

package/components/accordion/AccordionStore.js.map

@@ -1 +1 @@
-{"version":3,"file":"AccordionStore.js","names":["warn","AccordionStore","constructor","id","_defineProperty","_id","_instances","onChange","_ref","forEach","inst","close","addInstance","instance","push","removeInstance","filter","Store","_ref2","group","storeId","arguments","length","undefined","saveState","expanded","opts","store","getData","force","window","localStorage","setItem","JSON","stringify","e","rememberWarning","Object","prototype","hasOwnProperty","call","parse","getItem","getState","state","flush","type"],"sources":["../../../../src/components/accordion/AccordionStore.ts"],"sourcesContent":["import { warn } from '../../shared/component-helper'\n\ntype AccordionStoreInstance = {\n  _id: string\n  close: () => void\n}\nexport class AccordionStore {\n  _instances: Array<AccordionStoreInstance>\n  _id: string\n  constructor(id: string) {\n    this._id = id\n    this._instances = []\n  }\n  onChange({ id }: { id: string }) {\n    this._instances.forEach((inst) => {\n      if (inst._id !== id) {\n        inst.close()\n      }\n    })\n  }\n  addInstance(instance: AccordionStoreInstance) {\n    this._instances.push(instance)\n  }\n  removeInstance(instance) {\n    this._instances = this._instances.filter((inst) => inst !== instance)\n  }\n}\n\nexport type StoreDataReturn = {\n  id: string\n  expanded: boolean\n}\nexport type StoreOptions = {\n  force?: boolean\n}\n\ntype StoreProps = {\n  id?: string\n  group?: string\n}\n\nexport class Store {\n  id?: string\n  group?: string\n\n  constructor({ id, group }: StoreProps) {\n    this.id = id\n    this.group = group\n    return this\n  }\n\n  storeId(id = this.id) {\n    if (this.group) {\n      // Skip using the random ID\n      if (this.group[0] === '#') {\n        return null\n      }\n      id = this.group\n    }\n    return `dnb-accordion-${id}`\n  }\n\n  saveState(expanded: boolean, id = this.id, opts: StoreOptions = {}) {\n    if (id) {\n      try {\n        const store = this.getData() || ({} as StoreDataReturn)\n\n        if (this.group) {\n          if (expanded) {\n            store.id = id\n          } else if (opts && opts.force) {\n            store.id = null\n          }\n        } else {\n          store.expanded = expanded\n        }\n\n        const storeId = this.storeId(id)\n        if (storeId) {\n          window.localStorage.setItem(storeId, JSON.stringify(store))\n        }\n      } catch (e) {\n        //\n      }\n    } else {\n      rememberWarning()\n    }\n  }\n\n  getData(id = this.id): StoreDataReturn {\n    const storeId = this.storeId(id)\n\n    if (storeId) {\n      try {\n        if (\n          Object.prototype.hasOwnProperty.call(\n            window.localStorage,\n            storeId\n          )\n        ) {\n          return JSON.parse(window.localStorage.getItem(storeId))\n        }\n      } catch (e) {\n        //\n      }\n    }\n\n    return null\n  }\n\n  getState(id = this.id) {\n    let state = null\n\n    const store = this.getData(id)\n\n    if (store) {\n      if (typeof store.id !== 'undefined') {\n        state = id === store.id\n      } else if (typeof store.expanded !== 'undefined') {\n        state = store.expanded\n      }\n    }\n\n    return state\n  }\n\n  flush(id = this.id) {\n    if (id) {\n      try {\n        const storeId = this.storeId(id)\n        if (storeId) {\n          window.localStorage.setItem(storeId, null)\n        }\n      } catch (e) {\n        //\n      }\n    }\n  }\n}\n\nexport function rememberWarning(type = 'accordion') {\n  warn(`Missing \"id\" prop the ${type}! \"remember_state\" is enabled.`)\n}\n"],"mappings":"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"}
+{"version":3,"file":"AccordionStore.js","names":["warn","AccordionStore","constructor","id","_defineProperty","_id","_instances","onChange","_ref","forEach","inst","context","expandBehaviour","close","addInstance","instance","push","removeInstance","filter","Store","_ref2","group","storeId","arguments","length","undefined","saveState","expanded","opts","store","getData","force","window","localStorage","setItem","JSON","stringify","e","rememberWarning","Object","prototype","hasOwnProperty","call","parse","getItem","getState","state","flush","type"],"sources":["../../../../src/components/accordion/AccordionStore.ts"],"sourcesContent":["import { warn } from '../../shared/component-helper'\nimport { AccordionContextProps } from './AccordionContext'\n\ntype AccordionStoreInstance = {\n  context: AccordionContextProps\n  _id: string\n  close: () => void\n}\nexport class AccordionStore {\n  _instances: Array<AccordionStoreInstance>\n  _id: string\n  constructor(id: string) {\n    this._id = id\n    this._instances = []\n  }\n  onChange({ id }: { id: string }) {\n    this._instances.forEach((inst) => {\n      if (inst.context.expandBehaviour === 'single' && inst._id !== id) {\n        inst.close()\n      }\n    })\n  }\n  addInstance(instance: AccordionStoreInstance) {\n    this._instances.push(instance)\n  }\n  removeInstance(instance) {\n    this._instances = this._instances.filter((inst) => inst !== instance)\n  }\n}\n\nexport type StoreDataReturn = {\n  id: string\n  expanded: boolean\n}\nexport type StoreOptions = {\n  force?: boolean\n}\n\ntype StoreProps = {\n  id?: string\n  group?: string\n}\n\nexport class Store {\n  id?: string\n  group?: string\n\n  constructor({ id, group }: StoreProps) {\n    this.id = id\n    this.group = group\n    return this\n  }\n\n  storeId(id = this.id) {\n    if (this.group) {\n      // Skip using the random ID\n      if (this.group[0] === '#') {\n        return null\n      }\n      id = this.group\n    }\n    return `dnb-accordion-${id}`\n  }\n\n  saveState(expanded: boolean, id = this.id, opts: StoreOptions = {}) {\n    if (id) {\n      try {\n        const store = this.getData() || ({} as StoreDataReturn)\n\n        if (this.group) {\n          if (expanded) {\n            store.id = id\n          } else if (opts && opts.force) {\n            store.id = null\n          }\n        } else {\n          store.expanded = expanded\n        }\n\n        const storeId = this.storeId(id)\n        if (storeId) {\n          window.localStorage.setItem(storeId, JSON.stringify(store))\n        }\n      } catch (e) {\n        //\n      }\n    } else {\n      rememberWarning()\n    }\n  }\n\n  getData(id = this.id): StoreDataReturn {\n    const storeId = this.storeId(id)\n\n    if (storeId) {\n      try {\n        if (\n          Object.prototype.hasOwnProperty.call(\n            window.localStorage,\n            storeId\n          )\n        ) {\n          return JSON.parse(window.localStorage.getItem(storeId))\n        }\n      } catch (e) {\n        //\n      }\n    }\n\n    return null\n  }\n\n  getState(id = this.id) {\n    let state = null\n\n    const store = this.getData(id)\n\n    if (store) {\n      if (typeof store.id !== 'undefined') {\n        state = id === store.id\n      } else if (typeof store.expanded !== 'undefined') {\n        state = store.expanded\n      }\n    }\n\n    return state\n  }\n\n  flush(id = this.id) {\n    if (id) {\n      try {\n        const storeId = this.storeId(id)\n        if (storeId) {\n          window.localStorage.setItem(storeId, null)\n        }\n      } catch (e) {\n        //\n      }\n    }\n  }\n}\n\nexport function rememberWarning(type = 'accordion') {\n  warn(`Missing \"id\" prop the ${type}! \"remember_state\" is enabled.`)\n}\n"],"mappings":"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"}

package/components/accordion/style/themes/dnb-accordion-theme-ui.css

@@ -85,6 +85,7 @@ html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:hover:not([di
   --ui-accordion-after-click-background: var(--color-sea-green);
   --ui-accordion-after-click-border-color: var(--color-sea-green);
   --ui-accordion-after-click-description-color: var(--color-white);
+  z-index: 1;
 }
 .dnb-accordion__header--outlined:active[disabled], html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:active[disabled] {
   cursor: not-allowed;

package/components/accordion/style/themes/dnb-accordion-theme-ui.min.css

@@ -8,7 +8,7 @@
     --ui-accordion-border-color
   );--ui-accordion-expanded-description-color:var(
     --ui-accordion-description-color
-  );--ui-accordion-after-click-color:var(--color-white);--ui-accordion-after-click-background:var(--color-sea-green);--ui-accordion-after-click-border-color:var(--color-sea-green);--ui-accordion-after-click-description-color:var(--color-white)}.dnb-accordion__header--outlined:active[disabled],html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:active[disabled]{cursor:not-allowed}.dnb-accordion__header--outlined:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:active:not([disabled]){--accordion-border-width:0.0625rem;--ui-accordion-background:var(--color-pistachio);--ui-accordion-border-inset:inset}.dnb-accordion__header--filled{--accordion-border-width:0.125rem;--accordion-title-font-weight--expanded:var(--font-weight-basis);--ui-accordion-color:var(--color-emerald-green);--ui-accordion-background:var(--color-pistachio);--ui-accordion-border-color:var(--color-pistachio);--ui-accordion-description-color:var(--color-black-55)}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:hover:not([disabled]){--ui-accordion-background:var(--color-white)}.dnb-accordion__header--filled:active[disabled],html:not([data-whatintent=touch]) .dnb-accordion__header--filled:active[disabled]{cursor:not-allowed}.dnb-accordion__header--filled:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-accordion__header--filled:active:not([disabled]){--ui-accordion-color:var(--color-white);--ui-accordion-background:var(--color-sea-green);--ui-accordion-border-color:var(--color-sea-green);--ui-accordion-description-color:ar(--color-white)}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:focus-visible[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:focus-visible:not([disabled]){--ui-accordion-border-color:var(--color-sea-green)}.dnb-accordion__header--expanded{--ui-accordion-color--override:var(
+  );--ui-accordion-after-click-color:var(--color-white);--ui-accordion-after-click-background:var(--color-sea-green);--ui-accordion-after-click-border-color:var(--color-sea-green);--ui-accordion-after-click-description-color:var(--color-white);z-index:1}.dnb-accordion__header--outlined:active[disabled],html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:active[disabled]{cursor:not-allowed}.dnb-accordion__header--outlined:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-accordion__header--outlined:active:not([disabled]){--accordion-border-width:0.0625rem;--ui-accordion-background:var(--color-pistachio);--ui-accordion-border-inset:inset}.dnb-accordion__header--filled{--accordion-border-width:0.125rem;--accordion-title-font-weight--expanded:var(--font-weight-basis);--ui-accordion-color:var(--color-emerald-green);--ui-accordion-background:var(--color-pistachio);--ui-accordion-border-color:var(--color-pistachio);--ui-accordion-description-color:var(--color-black-55)}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:hover:not([disabled]){--ui-accordion-background:var(--color-white)}.dnb-accordion__header--filled:active[disabled],html:not([data-whatintent=touch]) .dnb-accordion__header--filled:active[disabled]{cursor:not-allowed}.dnb-accordion__header--filled:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-accordion__header--filled:active:not([disabled]){--ui-accordion-color:var(--color-white);--ui-accordion-background:var(--color-sea-green);--ui-accordion-border-color:var(--color-sea-green);--ui-accordion-description-color:ar(--color-white)}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:focus-visible[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-accordion__header--filled:focus-visible:not([disabled]){--ui-accordion-border-color:var(--color-sea-green)}.dnb-accordion__header--expanded{--ui-accordion-color--override:var(
     --ui-accordion-expanded-color--override,var(--ui-accordion-expanded-color)
   );--ui-accordion-background--override:var(
     --ui-accordion-expanded-background--override,var(--ui-accordion-expanded-background)

package/components/accordion/style/themes/dnb-accordion-theme-ui.scss

@@ -85,6 +85,7 @@
         --ui-accordion-background: var(--color-white);
         --ui-accordion-border-color: var(--color-emerald-green);
         --ui-accordion-description-color: var(--color-black-55);
+        // Removes the optional 'inset' property on the box-shadow border, on hover.
         --ui-accordion-border-inset: ;
 
         // state = expanded
@@ -102,6 +103,8 @@
         --ui-accordion-after-click-background: var(--color-sea-green);
         --ui-accordion-after-click-border-color: var(--color-sea-green);
         --ui-accordion-after-click-description-color: var(--color-white);
+
+        z-index: 1;
       }
 
       @include active() {

package/components/button/Button.d.ts

@@ -60,7 +60,7 @@ export type ButtonProps = {
    */
   variant?: ButtonVariant;
   /**
-   * The size of the button. For now there is "medium", "default" and "large".
+   * The size of the button. For now there is "small", "medium", "default" and "large".
    */
   size?: ButtonSize;
   /**

package/components/card/Card.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["className", "stack", "direction", "gap", "spacing", "innerSpace", "alignSelf", "divider", "rowGap", "responsive", "filled", "title", "children"];
+const _excluded = ["className", "stack", "direction", "gap", "spacing", "innerSpace", "alignSelf", "align", "divider", "rowGap", "responsive", "filled", "title", "children"];
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React from 'react';
@@ -20,6 +20,7 @@ function Card(props) {
       spacing,
       innerSpace,
       alignSelf = 'stretch',
+      align,
       divider = 'space',
       rowGap,
       responsive = true,
@@ -53,7 +54,7 @@ function Card(props) {
     className: classnames('dnb-card', className, responsive && 'dnb-card--responsive', filled && 'dnb-card--filled'),
     breakout: responsive ? trueWhenSmall : false,
     roundedCorner: responsive ? falseWhenSmall : true,
-    outline: true,
+    outline: '--outline-card-color',
     innerSpace: innerSpace !== null && innerSpace !== void 0 ? innerSpace : {
       small: smallSpace,
       medium: basisSpace,
@@ -69,7 +70,7 @@ function Card(props) {
     direction: direction !== null && direction !== void 0 ? direction : 'vertical',
     divider: divider,
     alignSelf: alignSelf,
-    align: stack ? 'stretch' : undefined,
+    align: stack ? 'stretch' : align,
     wrap: !stack,
     gap: stack ? 'medium' : (gap !== null && gap !== void 0 ? gap : spacing) || false,
     rowGap: rowGap || false

package/components/card/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","gap","spacing","innerSpace","alignSelf","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","align","undefined","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    gap,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: true,\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        align={stack ? 'stretch' : undefined}\n        wrap={!stack}\n        gap={stack ? 'medium' : (gap ?? spacing) || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":"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"}
+{"version":3,"file":"Card.js","names":["React","classnames","Flex","SectionParams","combineLabelledBy","useId","Space","Card","props","className","stack","direction","gap","spacing","innerSpace","alignSelf","align","divider","rowGap","responsive","filled","title","children","rest","_objectWithoutProperties","_excluded","titleId","falseWhenSmall","small","medium","large","trueWhenSmall","basisSpace","top","right","bottom","left","smallSpace","_objectSpread","params","breakout","roundedCorner","outline","createElement","Item","_extends","element","Container","wrap","id","_supportsSpacingProps"],"sources":["../../../../src/components/card/Card.tsx"],"sourcesContent":["import React from 'react'\nimport classnames from 'classnames'\nimport Flex from '../flex/Flex'\nimport { SectionParams, SectionProps } from '../section/Section'\nimport { combineLabelledBy } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\n\nimport type { BasicProps as FlexContainerProps } from '../flex/Container'\nimport type { BasicProps as FlexItemProps } from '../flex/Item'\nimport type { SpaceTypeMedia } from '../../shared/types'\nimport type { SpaceProps } from '../Space'\nimport Space from '../Space'\n\nexport type Props = {\n  /**\n   * Define a title that appears on top of the Card\n   */\n  title?: React.ReactNode\n\n  /**\n   * Define if the Card should behave responsive. Defaults to `true`\n   */\n  responsive?: boolean\n\n  /**\n   * Define if the Card should get the same background color as the outline border\n   */\n  filled?: boolean\n} & FlexContainerProps &\n  FlexItemProps & {\n    stack?: boolean\n  } & SpaceProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref' | 'wrap' | 'size'>\n\nfunction Card(props: Props) {\n  const {\n    className,\n    stack,\n    direction,\n    gap,\n    spacing,\n    innerSpace,\n    alignSelf = 'stretch',\n    align,\n    divider = 'space',\n    rowGap,\n    responsive = true,\n    filled,\n    title,\n    children,\n    ...rest\n  } = props\n\n  const titleId = useId()\n  const falseWhenSmall = { small: false, medium: true, large: true }\n  const trueWhenSmall = { small: true, medium: false, large: false }\n  const basisSpace = {\n    top: 'medium',\n    right: 'medium',\n    bottom: 'large',\n    left: 'medium',\n  }\n  const smallSpace = responsive\n    ? {\n        ...basisSpace,\n        right: 0,\n        left: 0,\n      }\n    : basisSpace\n\n  const params = SectionParams({\n    className: classnames(\n      'dnb-card',\n      className,\n      responsive && 'dnb-card--responsive',\n      filled && 'dnb-card--filled'\n    ),\n    breakout: responsive ? trueWhenSmall : false,\n    roundedCorner: responsive ? falseWhenSmall : true,\n    outline: '--outline-card-color',\n    innerSpace:\n      innerSpace ??\n      ({\n        small: smallSpace,\n        medium: basisSpace,\n        large: basisSpace,\n      } as SpaceTypeMedia),\n    ...(rest as SectionProps),\n    'aria-labelledby': combineLabelledBy(rest, title && titleId),\n  })\n\n  return (\n    <Flex.Item alignSelf={alignSelf} element=\"section\" {...params}>\n      <Flex.Container\n        direction={direction ?? 'vertical'}\n        divider={divider}\n        alignSelf={alignSelf}\n        align={stack ? 'stretch' : align}\n        wrap={!stack}\n        gap={stack ? 'medium' : (gap ?? spacing) || false}\n        rowGap={rowGap || false}\n      >\n        {title && (\n          <Space id={titleId} className=\"dnb-card__title\">\n            {title}\n          </Space>\n        )}\n        {children}\n      </Flex.Container>\n    </Flex.Item>\n  )\n}\n\nCard._supportsSpacingProps = true\n\nexport default Card\n"],"mappings":"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"}

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

@@ -17,8 +17,24 @@
   padding: 1rem;
 }
 .dnb-card.dnb-section {
+  --outline-color: var(--card-outline-color);
+  --outline-width: var(--card-outline-width);
+  --background-color: var(--card-background-color);
   background-color: var(--background-color);
 }
+.dnb-card .dnb-section {
+  z-index: 1;
+}
+@media screen and (min-width: 40em) {
+  .dnb-card {
+    --nested-space-l: calc(var(--padding-left, 0px) * -1);
+    --nested-space-r: calc(var(--padding-right, 0px) * -1);
+  }
+  .dnb-card .dnb-section::after {
+    --left: var(--nested-space-l);
+    --width: calc(100% - var(--nested-space-r) * 2);
+  }
+}
 .dnb-card--filled.dnb-card.dnb-section {
   --background-color: var(--outline-color);
 }

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

@@ -1 +1 @@
-.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{background-color:var(--background-color)}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}.dnb-card>.dnb-flex-container--align-stretch>.dnb-button{align-self:flex-start}
+.dnb-card__heading{font-size:var(--font-size-basis);font-weight:var(--font-weight-medium)}.dnb-card+.dnb-card__heading{margin-top:var(--spacing-small)}.dnb-card__title{font-size:var(--font-size-small);font-weight:var(--font-weight-medium);padding-bottom:1rem}.dnb-card:not([style*="--space-"]) .dnb-card__title{padding:1rem}.dnb-card.dnb-section{--outline-color:var(--card-outline-color);--outline-width:var(--card-outline-width);--background-color:var(--card-background-color);background-color:var(--background-color)}.dnb-card .dnb-section{z-index:1}@media screen and (min-width:40em){.dnb-card{--nested-space-l:calc(var(--padding-left, 0px)*-1);--nested-space-r:calc(var(--padding-right, 0px)*-1)}.dnb-card .dnb-section:after{--left:var(--nested-space-l);--width:calc(100% - var(--nested-space-r)*2)}}.dnb-card--filled.dnb-card.dnb-section{--background-color:var(--outline-color)}@media screen and (max-width:40em){.dnb-card--responsive.dnb-section:before{--outline:99vw 0 0 0 var(--background-color),198vw 0 0 0 var(--background-color),297vw 0 0 0 var(--background-color),396vw 0 0 0 var(--background-color),0 var(--outline-width) 0 0 var(--outline-color),99vw var(--outline-width) 0 0 var(--outline-color),0 calc(var(--outline-width)*-1) 0 0 var(--outline-color),99vw calc(var(--outline-width)*-1) 0 0 var(--outline-color),198vw var(--outline-width) 0 0 var(--outline-color),198vw calc(var(--outline-width)*-1) 0 0 var(--outline-color);left:var(--left)}.dnb-card+.dnb-card--responsive:not([class*=space__top]){background:linear-gradient(to left,var(--background-color),var(--background-color)) no-repeat 0 var(--outline-width)}.dnb-card+.dnb-card--responsive:not([class*=space__top]):before{top:var(--outline-width)}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive{margin-top:0}.dnb-flex-container.dnb-flex-container--divider-space .dnb-card+.dnb-card--responsive:before{top:var(--outline-width);z-index:0}}.dnb-card .dnb-flex-container:has(>.dnb-card__title+.dnb-scroll-view){align-items:stretch;flex-wrap:nowrap}.dnb-card--filled .dnb-scroll-view{clip-path:inset(0 0 0 0 round var(--rounded-corner) var(--rounded-corner) var(--rounded-corner) var(--rounded-corner))}.dnb-card>.dnb-flex-container>.dnb-space:has(>.dnb-scroll-view){width:100%}.dnb-card>.dnb-flex-container--align-stretch>.dnb-button{align-self:flex-start}

package/components/card/style/dnb-card.scss

@@ -20,9 +20,26 @@
   }
 
   &.dnb-section {
+    --outline-color: var(--card-outline-color);
+    --outline-width: var(--card-outline-width);
+    --background-color: var(--card-background-color);
+
     background-color: var(--background-color);
   }
 
+  & .dnb-section {
+    z-index: 1;
+  }
+  @include allAbove(small) {
+    // These vars needs to be declared outside of the nested .dnb-section
+    --nested-space-l: calc(var(--padding-left, 0px) * -1);
+    --nested-space-r: calc(var(--padding-right, 0px) * -1);
+    & .dnb-section::after {
+      --left: var(--nested-space-l);
+      --width: calc(100% - var(--nested-space-r) * 2);
+    }
+  }
+
   &--filled#{&}.dnb-section {
     --background-color: var(--outline-color);
   }

package/components/card/style/themes/dnb-card-theme-sbanken.css

@@ -1,5 +1,5 @@
-.dnb-card.dnb-section {
-  --outline-color: var(--border-color, var(--sb-color-gray-light));
-  --outline-width: 0.0625rem;
-  --background-color: var(--sb-color-white);
+.dnb-card {
+  --card-outline-color: var(--border-color, var(--sb-color-gray-light));
+  --card-outline-width: 0.0625rem;
+  --card-background-color: var(--sb-color-white);
 }

package/components/card/style/themes/dnb-card-theme-sbanken.min.css

@@ -1 +1 @@
-.dnb-card.dnb-section{--outline-color:var(--border-color,var(--sb-color-gray-light));--outline-width:0.0625rem;--background-color:var(--sb-color-white)}
+.dnb-card{--card-outline-color:var(--border-color,var(--sb-color-gray-light));--card-outline-width:0.0625rem;--card-background-color:var(--sb-color-white)}