@dnb/eufemia 10.12.0 → 10.13.0

package/components/pagination/PaginationBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"PaginationBar.js","names":["React","useContext","useRef","useEffect","useState","dispatchCustomElementEvent","extendPropsWithContext","calculatePagination","getDotsAriaLabel","PaginationContext","Context","Button","IconPrimary","styleProperties","defaultProps","button_title","prev_title","next_title","more_pages","contentRef","children","PaginationBar","localProps","context","props","pagination","currentPage","pageCount","disabled","skeleton","focusPage","onPageUpdate","elem","current","focus","e","keepPageHeight","pageHeight","offsetHeight","style","height","minHeight","setPage","event","arguments","length","undefined","setState","setContextState","updatePageContent","_objectSpread","pageNumber","setPrevPage","setNextPage","clickHandler","_ref","getTranslation","Pagination","prevIsDisabled","nextIsDisabled","paginationBarRef","currentScreenSize","useResizeObserver","pageNumberGroups","createElement","ref","className","key","variant","icon","icon_position","text","on_click","title","map","String","replace","slice","numbersList","idx","Fragment","role","size","element","currentSize","setSize","resizeObserver","_resizeObserver$curre","handleSizeChange","width","getSizeInPx","ResizeObserver","entries","contentRect","observe","clientWidth","_resizeObserver$curre2","disconnect","styleSize","includes","parseFloat","_supportsSpacingProps"],"sources":["../../../../src/components/pagination/PaginationBar.tsx"],"sourcesContent":["/**\n * Web Pagination Component\n *\n */\n\nimport React, { useContext, useRef, useEffect, useState } from 'react'\nimport classnames from 'classnames'\nimport {\n  dispatchCustomElementEvent,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\n\nimport {\n  calculatePagination,\n  getDotsAriaLabel,\n} from './PaginationCalculation'\nimport PaginationContext from './PaginationContext'\nimport Context from '../../shared/Context'\nimport Button from '../button/Button'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport styleProperties from '../../style/themes/theme-ui/properties'\nimport { LocaleProps } from '../../shared/types'\nimport type { SkeletonShow } from '../Skeleton'\n\nexport type PaginationBarProps = {\n  /**\n   * The title used in every button shown in the bar. Defaults to Side %s.\n   */\n  button_title?: string\n\n  /**\n   *  The title used in the previous page button. Defaults to Forrige side.\n   */\n  prev_title?: string\n\n  /**\n   *  The title used in the next page button. Defaults to Neste side.\n   */\n  next_title?: string\n\n  /**\n   * The title used in the dots. Relevant for screen-readers. Defaults to %s flere sider.\n   */\n  more_pages?: string\n\n  /**\n   * Reference to the parent component. Used to contain height between updates.\n   */\n  contentRef?: React.RefObject<HTMLElement>\n\n  /**\n   *  the given content can be either a function or a React node, depending on your needs. A function contains several helper functions. More details down below and have a look at the examples in the demos section.\n   */\n  children?: React.ReactNode | (() => React.ReactNode)\n\n  skeleton: SkeletonShow\n}\n\nexport type PaginationBarAllProps = PaginationBarProps &\n  LocaleProps &\n  React.HTMLProps<HTMLElement>\n\ntype PaginationBarContext = {\n  currentPage: number\n  pageCount: number\n  disabled: boolean\n  onPageUpdate: (cb: () => void) => void\n  setState: (state: { currentPage: number }) => void\n  updatePageContent: (currentPage: number) => void\n}\n\nconst defaultProps = {\n  button_title: null,\n  prev_title: null,\n  next_title: null,\n  more_pages: null,\n  contentRef: null,\n  children: null,\n}\n\nconst PaginationBar = (localProps: PaginationBarAllProps) => {\n  const context = useContext(PaginationContext)\n\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.pagination\n  ) as PaginationBarProps & PaginationBarContext\n\n  const { currentPage, pageCount, disabled, skeleton } = props\n\n  // because of accessibility\n  const focusPage = () => {\n    const { onPageUpdate, contentRef } = props\n\n    onPageUpdate(() => {\n      try {\n        const elem = contentRef.current\n        elem.focus()\n      } catch (e) {\n        //\n      }\n    })\n  }\n\n  const keepPageHeight = () => {\n    try {\n      const elem = props.contentRef.current\n      const pageHeight = elem.offsetHeight\n      elem.style.height = `${pageHeight / 16}rem`\n      elem.style.minHeight = elem.style.height // because of the \"min-height: inherit;\" in &__indicator\n    } catch (e) {\n      //\n    }\n\n    const { onPageUpdate } = props\n\n    onPageUpdate(() => {\n      try {\n        const elem = props.contentRef.current\n        elem.style.height = 'auto'\n        elem.style.minHeight = elem.style.height\n      } catch (e) {\n        //\n      }\n    })\n  }\n\n  const setPage = (currentPage: number, event = null) => {\n    keepPageHeight()\n\n    const { setState: setContextState, updatePageContent } = props\n    setContextState({\n      currentPage,\n    })\n    updatePageContent(currentPage)\n\n    dispatchCustomElementEvent(props, 'on_change', {\n      pageNumber: currentPage,\n      ...props,\n      event,\n    })\n  }\n\n  const setPrevPage = () => {\n    setPage(props.currentPage - 1)\n  }\n  const setNextPage = () => {\n    setPage(props.currentPage + 1)\n  }\n\n  const clickHandler = ({ pageNumber, event }) => {\n    setPage(pageNumber, event)\n    focusPage()\n  }\n\n  const { getTranslation } = useContext(Context)\n  const { button_title, prev_title, next_title, more_pages } =\n    extendPropsWithContext(\n      props,\n      defaultProps,\n      getTranslation(props as LocaleProps).Pagination\n    )\n\n  const prevIsDisabled = currentPage > -1 ? currentPage === 1 : true\n  const nextIsDisabled =\n    currentPage > -1 ? currentPage === pageCount || pageCount === 0 : true\n\n  const paginationBarRef = useRef(null)\n  const currentScreenSize = useResizeObserver(paginationBarRef)\n\n  const pageNumberGroups = calculatePagination(\n    pageCount,\n    currentPage,\n    currentScreenSize === 'small'\n  )\n\n  return (\n    <div\n      ref={paginationBarRef}\n      className={classnames(\n        'dnb-pagination__bar',\n        pageCount >= 8 && 'dnb-pagination--many-pages'\n      )}\n    >\n      <div className=\"dnb-pagination__bar__wrapper\">\n        <div className=\"dnb-pagination__bar__skip\">\n          <Button\n            key=\"left-arrow\"\n            disabled={disabled || prevIsDisabled}\n            skeleton={skeleton}\n            variant=\"tertiary\"\n            icon=\"chevron_left\"\n            icon_position=\"left\"\n            text={prev_title}\n            on_click={setPrevPage}\n            title={prevIsDisabled ? null : prev_title}\n          />\n\n          <Button\n            key=\"right-arrow\"\n            disabled={disabled || nextIsDisabled}\n            skeleton={skeleton}\n            variant=\"tertiary\"\n            icon=\"chevron_right\"\n            icon_position=\"right\"\n            text={next_title}\n            on_click={setNextPage}\n            title={nextIsDisabled ? null : next_title}\n          />\n        </div>\n\n        <div className=\"dnb-pagination__bar__inner\">\n          {(pageNumberGroups?.[0] || []).map((pageNumber) => (\n            <Button\n              key={pageNumber}\n              className=\"dnb-pagination__button\"\n              text={String(pageNumber)}\n              aria-label={button_title.replace('%s', String(pageNumber))}\n              variant={\n                pageNumber === currentPage ? 'primary' : 'secondary'\n              }\n              disabled={disabled}\n              skeleton={skeleton}\n              aria-current={pageNumber === currentPage ? 'page' : null}\n              on_click={(event) => clickHandler({ pageNumber, event })}\n            />\n          ))}\n\n          {pageNumberGroups.slice(1).map((numbersList, idx) => (\n            <React.Fragment key={idx}>\n              <IconPrimary\n                role=\"separator\"\n                aria-orientation=\"vertical\"\n                aria-hidden={false}\n                title={getDotsAriaLabel({\n                  more_pages,\n                  numbersList,\n                  pageNumberGroups,\n                })}\n                className=\"dnb-pagination__dots\"\n                icon=\"more\"\n                size=\"medium\"\n              />\n\n              {numbersList.map((pageNumber) => {\n                return (\n                  <Button\n                    key={(pageNumber || 0) + idx}\n                    className={classnames(\n                      'dnb-pagination__button',\n                      String(pageNumber).length > 3\n                        ? 'dnb-pagination__button--large-number'\n                        : null\n                    )}\n                    text={String(pageNumber)}\n                    aria-label={button_title.replace(\n                      '%s',\n                      String(pageNumber)\n                    )}\n                    variant={\n                      pageNumber === currentPage ? 'primary' : 'secondary'\n                    }\n                    disabled={disabled}\n                    skeleton={skeleton}\n                    aria-current={\n                      pageNumber === currentPage ? 'page' : null\n                    }\n                    on_click={(event) =>\n                      clickHandler({ pageNumber, event })\n                    }\n                  />\n                )\n              })}\n            </React.Fragment>\n          ))}\n        </div>\n      </div>\n\n      <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n        {button_title.replace('%s', String(currentPage))}\n      </span>\n    </div>\n  )\n}\n\nexport const useResizeObserver = (element) => {\n  const [currentSize, setSize] = useState('large')\n  const resizeObserver = useRef(null)\n\n  useEffect(() => {\n    try {\n      const handleSizeChange = (width) => {\n        if (width <= getSizeInPx('small') && currentSize !== 'small') {\n          setSize('small')\n        } else if (\n          width <= getSizeInPx('medium') &&\n          currentSize !== 'medium'\n        ) {\n          setSize('medium')\n        } else if (\n          width <= getSizeInPx('large') &&\n          currentSize !== 'large'\n        ) {\n          setSize('large')\n        } else if (\n          width <= getSizeInPx('x-large') &&\n          currentSize !== 'x-large'\n        ) {\n          setSize('x-large')\n        } else if (\n          width <= getSizeInPx('xx-large') &&\n          currentSize !== 'xx-large'\n        ) {\n          setSize('xx-large')\n        }\n      }\n      resizeObserver.current = new ResizeObserver((entries) => {\n        handleSizeChange(entries[0].contentRect.width)\n      })\n\n      resizeObserver.current?.observe(element.current)\n      handleSizeChange(element.current.clientWidth)\n    } catch (e) {\n      //\n    }\n\n    return () => {\n      resizeObserver.current?.disconnect()\n    }\n  }, [element]) // eslint-disable-line\n\n  return currentSize\n}\n\nconst getSizeInPx = (size) => {\n  const styleSize = styleProperties[`--layout-${size}`]\n\n  if (styleSize.includes('em')) {\n    return parseFloat(styleSize.replace(/(rem|em)$/, '')) * 16\n  }\n\n  return parseFloat(styleSize.replace(/(px)$/, ''))\n}\n\nPaginationBar._supportsSpacingProps = true\n\nexport default PaginationBar\n"],"mappings":"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"}
+{"version":3,"file":"PaginationBar.js","names":["React","useContext","useRef","useEffect","useState","dispatchCustomElementEvent","extendPropsWithContext","calculatePagination","getDotsAriaLabel","PaginationContext","Context","Button","IconPrimary","styleProperties","defaultProps","button_title","prev_title","next_title","more_pages","contentRef","children","PaginationBar","localProps","context","props","pagination","currentPage","pageCount","disabled","skeleton","focusPage","onPageUpdate","elem","current","focus","e","keepPageHeight","pageHeight","offsetHeight","style","height","minHeight","setPage","event","arguments","length","undefined","setState","setContextState","updatePageContent","_objectSpread","pageNumber","setPrevPage","setNextPage","clickHandler","_ref","getTranslation","Pagination","prevIsDisabled","nextIsDisabled","paginationBarRef","currentScreenSize","useResizeObserver","pageNumberGroups","createElement","ref","className","key","variant","icon","icon_position","text","on_click","title","map","String","replace","slice","numbersList","idx","Fragment","role","size","element","currentSize","setSize","resizeObserver","_resizeObserver$curre","handleSizeChange","width","getSizeInPx","ResizeObserver","entries","contentRect","observe","clientWidth","_resizeObserver$curre2","disconnect","styleSize","includes","parseFloat","_supportsSpacingProps"],"sources":["../../../../src/components/pagination/PaginationBar.tsx"],"sourcesContent":["/**\n * Web Pagination Component\n *\n */\n\nimport React, { useContext, useRef, useEffect, useState } from 'react'\nimport classnames from 'classnames'\nimport {\n  dispatchCustomElementEvent,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\n\nimport {\n  calculatePagination,\n  getDotsAriaLabel,\n} from './PaginationCalculation'\nimport PaginationContext from './PaginationContext'\nimport Context from '../../shared/Context'\nimport Button from '../button/Button'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport styleProperties from '../../style/themes/theme-ui/properties'\nimport { LocaleProps } from '../../shared/types'\nimport type { SkeletonShow } from '../Skeleton'\n\nexport type PaginationBarProps = {\n  /**\n   * The title used in every button shown in the bar. Defaults to Side %s.\n   */\n  button_title?: string\n\n  /**\n   *  The title used in the previous page button. Defaults to Forrige side.\n   */\n  prev_title?: string\n\n  /**\n   *  The title used in the next page button. Defaults to Neste side.\n   */\n  next_title?: string\n\n  /**\n   * The title used in the dots. Relevant for screen-readers. Defaults to %s flere sider.\n   */\n  more_pages?: string\n\n  /**\n   * Reference to the parent component. Used to contain height between updates.\n   */\n  contentRef?: React.RefObject<HTMLElement>\n\n  /**\n   *  the given content can be either a function or a React node, depending on your needs. A function contains several helper functions. More details down below and have a look at the examples in the demos section.\n   */\n  children?: React.ReactNode | (() => React.ReactNode)\n\n  skeleton: SkeletonShow\n}\n\nexport type PaginationBarAllProps = PaginationBarProps &\n  LocaleProps &\n  React.HTMLProps<HTMLElement>\n\ntype PaginationBarContext = {\n  currentPage: number\n  pageCount: number\n  disabled: boolean\n  onPageUpdate: (cb: () => void) => void\n  setState: (state: { currentPage: number }) => void\n  updatePageContent: (currentPage: number) => void\n}\n\nconst defaultProps = {\n  button_title: null,\n  prev_title: null,\n  next_title: null,\n  more_pages: null,\n  contentRef: null,\n  children: null,\n}\n\nconst PaginationBar = (localProps: PaginationBarAllProps) => {\n  const context = useContext(PaginationContext)\n\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.pagination\n  ) as PaginationBarProps & PaginationBarContext\n\n  const { currentPage, pageCount, disabled, skeleton } = props\n\n  // because of accessibility\n  const focusPage = () => {\n    const { onPageUpdate, contentRef } = props\n\n    onPageUpdate(() => {\n      try {\n        const elem = contentRef.current\n        elem.focus()\n      } catch (e) {\n        //\n      }\n    })\n  }\n\n  const keepPageHeight = () => {\n    try {\n      const elem = props.contentRef.current\n      const pageHeight = elem.offsetHeight\n      elem.style.height = `${pageHeight / 16}rem`\n      elem.style.minHeight = elem.style.height // because of the \"min-height: inherit;\" in &__indicator\n    } catch (e) {\n      //\n    }\n\n    const { onPageUpdate } = props\n\n    onPageUpdate(() => {\n      try {\n        const elem = props.contentRef.current\n        elem.style.height = 'auto'\n        elem.style.minHeight = elem.style.height\n      } catch (e) {\n        //\n      }\n    })\n  }\n\n  const setPage = (currentPage: number, event = null) => {\n    keepPageHeight()\n\n    const { setState: setContextState, updatePageContent } = props\n    setContextState({\n      currentPage,\n    })\n    updatePageContent(currentPage)\n\n    dispatchCustomElementEvent(props, 'on_change', {\n      pageNumber: currentPage,\n      ...props,\n      event,\n    })\n  }\n\n  const setPrevPage = () => {\n    setPage(props.currentPage - 1)\n  }\n  const setNextPage = () => {\n    setPage(props.currentPage + 1)\n  }\n\n  const clickHandler = ({ pageNumber, event }) => {\n    setPage(pageNumber, event)\n    focusPage()\n  }\n\n  const { getTranslation } = useContext(Context)\n  const { button_title, prev_title, next_title, more_pages } =\n    extendPropsWithContext(\n      props,\n      defaultProps,\n      getTranslation(props as LocaleProps).Pagination\n    )\n\n  const prevIsDisabled = currentPage > -1 ? currentPage === 1 : true\n  const nextIsDisabled =\n    currentPage > -1 ? currentPage === pageCount || pageCount === 0 : true\n\n  const paginationBarRef = useRef(null)\n  const currentScreenSize = useResizeObserver(paginationBarRef)\n\n  const pageNumberGroups = calculatePagination(\n    pageCount,\n    currentPage,\n    currentScreenSize === 'small'\n  )\n\n  return (\n    <div\n      ref={paginationBarRef}\n      className={classnames(\n        'dnb-pagination__bar',\n        pageCount >= 8 && 'dnb-pagination--many-pages'\n      )}\n    >\n      <div className=\"dnb-pagination__bar__wrapper\">\n        <div className=\"dnb-pagination__bar__skip\">\n          <Button\n            key=\"left-arrow\"\n            disabled={disabled || prevIsDisabled}\n            skeleton={skeleton}\n            variant=\"tertiary\"\n            icon=\"chevron_left\"\n            icon_position=\"left\"\n            text={prev_title}\n            on_click={setPrevPage}\n            title={prevIsDisabled ? null : prev_title}\n          />\n\n          <Button\n            key=\"right-arrow\"\n            disabled={disabled || nextIsDisabled}\n            skeleton={skeleton}\n            variant=\"tertiary\"\n            icon=\"chevron_right\"\n            icon_position=\"right\"\n            text={next_title}\n            on_click={setNextPage}\n            title={nextIsDisabled ? null : next_title}\n          />\n        </div>\n\n        <div className=\"dnb-pagination__bar__inner\">\n          {(pageNumberGroups?.[0] || []).map((pageNumber) => (\n            <Button\n              key={pageNumber}\n              className=\"dnb-pagination__button\"\n              text={String(pageNumber)}\n              aria-label={button_title.replace('%s', String(pageNumber))}\n              variant={\n                pageNumber === currentPage ? 'primary' : 'secondary'\n              }\n              disabled={disabled}\n              skeleton={skeleton}\n              aria-current={pageNumber === currentPage ? 'page' : null}\n              on_click={(event) => clickHandler({ pageNumber, event })}\n            />\n          ))}\n\n          {pageNumberGroups.slice(1).map((numbersList, idx) => (\n            <React.Fragment key={idx}>\n              <IconPrimary\n                role=\"separator\"\n                aria-orientation=\"vertical\"\n                aria-hidden={false}\n                title={getDotsAriaLabel({\n                  more_pages,\n                  numbersList,\n                  pageNumberGroups,\n                })}\n                className=\"dnb-pagination__dots\"\n                icon=\"more\"\n                size=\"medium\"\n              />\n\n              {numbersList.map((pageNumber) => {\n                return (\n                  <Button\n                    key={(pageNumber || 0) + idx}\n                    className={classnames(\n                      'dnb-pagination__button',\n                      String(pageNumber).length > 3\n                        ? 'dnb-pagination__button--large-number'\n                        : null\n                    )}\n                    text={String(pageNumber)}\n                    aria-label={button_title.replace(\n                      '%s',\n                      String(pageNumber)\n                    )}\n                    variant={\n                      pageNumber === currentPage ? 'primary' : 'secondary'\n                    }\n                    disabled={disabled}\n                    skeleton={skeleton}\n                    aria-current={\n                      pageNumber === currentPage ? 'page' : null\n                    }\n                    on_click={(event) =>\n                      clickHandler({ pageNumber, event })\n                    }\n                  />\n                )\n              })}\n            </React.Fragment>\n          ))}\n        </div>\n      </div>\n\n      <span className=\"dnb-sr-only\" aria-live=\"assertive\">\n        {button_title.replace('%s', String(currentPage))}\n      </span>\n    </div>\n  )\n}\n\nexport const useResizeObserver = (element) => {\n  const [currentSize, setSize] = useState('large')\n  const resizeObserver = useRef(null)\n\n  useEffect(() => {\n    try {\n      const handleSizeChange = (width) => {\n        if (width <= getSizeInPx('small') && currentSize !== 'small') {\n          setSize('small')\n        } else if (\n          width <= getSizeInPx('medium') &&\n          currentSize !== 'medium'\n        ) {\n          setSize('medium')\n        } else if (\n          width <= getSizeInPx('large') &&\n          currentSize !== 'large'\n        ) {\n          setSize('large')\n        } else if (\n          width <= getSizeInPx('x-large') &&\n          currentSize !== 'x-large'\n        ) {\n          setSize('x-large')\n        } else if (\n          width <= getSizeInPx('xx-large') &&\n          currentSize !== 'xx-large'\n        ) {\n          setSize('xx-large')\n        }\n      }\n      resizeObserver.current = new ResizeObserver((entries) => {\n        handleSizeChange(entries[0].contentRect.width)\n      })\n\n      resizeObserver.current?.observe(element.current)\n      handleSizeChange(element.current.clientWidth)\n    } catch (e) {\n      //\n    }\n\n    return () => {\n      resizeObserver.current?.disconnect()\n    }\n  }, [element]) // eslint-disable-line\n\n  return currentSize\n}\n\nconst getSizeInPx = (size) => {\n  const styleSize = styleProperties[`--layout-${size}`]\n\n  if (styleSize.includes('em')) {\n    return parseFloat(styleSize.replace(/(rem|em)$/, '')) * 16\n  }\n\n  return parseFloat(styleSize.replace(/(px)$/, ''))\n}\n\nPaginationBar._supportsSpacingProps = true\n\nexport default PaginationBar\n"],"mappings":"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"}

package/components/step-indicator/StepIndicatorContext.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["isSidebar"];

package/components/step-indicator/StepIndicatorContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorContext.js","names":["React","useContext","useEffect","useRef","useState","Context","stepIndicatorDefaultProps","extendPropsWithContext","onMediaQueryChange","filterAttributes","Object","keys","filter","item","includes","concat","StepIndicatorContext","createContext","StepIndicatorProvider","_ref","isSidebar","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","data","getData","countSteps","length","hasSidebar","setHasSidebar","hideSidebar","setHideSidebar","activeStep","setActiveStep","getActiveStepFromProps","openState","setOpenState","listOfReachedSteps","Boolean","current","mediaQueryListener","context","contextValue","makeContextValue","_document","container","document","getElementById","sidebar_id","min","max","runOnInit","currentStepFromProps","current_step","push","onChangeState","openHandler","closeHandler","JSON","parse","dataWithItems","itemWithCurrentStep","find","is_current","indexOf","globalContext","skeleton","getTranslation","StepIndicator","value","extendSafe","defaultProps","stepsLabel","updateStepTitle","step_title","stepsLabelExtended","step_title_extended","sidebarIsVisible","title","replace","String","window","forEach","key","startsWith","createElement","Provider","children","obj","_len","arguments","objects","Array","_key","itm","entries","reduce","acc","_ref2","k","v","_ref3"],"sources":["../../../../src/components/step-indicator/StepIndicatorContext.tsx"],"sourcesContent":["/**\n * Web StepIndicator Context\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\nimport Context, { ContextProps } from '../../shared/Context'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport { onMediaQueryChange } from '../../shared/MediaQueryUtils'\nimport {\n  StepIndicatorData,\n  StepIndicatorDataItem,\n  StepIndicatorMode,\n  StepIndicatorProps,\n} from './StepIndicator'\nimport { StepIndicatorItemProps } from './StepIndicatorItem'\n\n// We use this array to filter out unwanted properties\nconst filterAttributes = Object.keys(stepIndicatorDefaultProps)\n  .filter((item) => {\n    return !['class', 'className'].includes(item)\n  })\n  .concat([\n    'internalId',\n    'isSidebar',\n    'hasSidebar',\n    'hideSidebar',\n    'sidebarIsVisible',\n    'mainTitle',\n    'stepsLabel',\n    'stepsLabelExtended',\n    'listOfReachedSteps',\n    'setActiveStep',\n    'activeStep',\n    'countSteps',\n    'openState',\n    'onChangeState',\n    'openHandler',\n    'closeHandler',\n    'innerRef',\n    'hasSkeletonData',\n    'filterAttributes',\n    'onChangeState',\n  ])\n\nexport type StepIndicatorContextValues = StepIndicatorProviderProps &\n  StepIndicatorProviderStates &\n  ContextProps\n\nconst StepIndicatorContext =\n  React.createContext<StepIndicatorContextValues>(null)\n\nexport default StepIndicatorContext\n\nexport type StepIndicatorProviderProps = Omit<\n  StepIndicatorProps,\n  'mode' | 'data'\n> & {\n  /**\n   * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n   */\n  sidebar_id: string\n  /**\n   * <em>(required)</em> defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n   */\n  data?: StepIndicatorData\n  /**\n   * <em>(required)</em> defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n   */\n  mode?: StepIndicatorMode\n  children: React.ReactNode\n  isSidebar?: boolean\n}\n\nexport type StepIndicatorProviderStates = {\n  data: (string | StepIndicatorItemProps)[]\n  hasSidebar: boolean\n  hideSidebar: boolean\n  activeStep: number\n  openState: boolean\n  listOfReachedSteps: number[]\n  countSteps: number\n  stepsLabel: string\n  stepsLabelExtended: string\n  filterAttributes: string[]\n  setActiveStep: React.Dispatch<React.SetStateAction<number>>\n  sidebarIsVisible: boolean\n  onChangeState: () => void\n  openHandler: () => void\n  closeHandler: () => void\n}\n\nexport function StepIndicatorProvider({\n  isSidebar = false,\n  ...restOfProps\n}: StepIndicatorProviderProps) {\n  const props = { isSidebar, ...restOfProps }\n\n  const data = getData(props)\n  const countSteps = data.length\n\n  const [hasSidebar, setHasSidebar] = useState<boolean>(true)\n  const [hideSidebar, setHideSidebar] = useState<boolean>(false)\n  const [activeStep, setActiveStep] = useState<number>(\n    getActiveStepFromProps()\n  )\n  const [openState, setOpenState] = useState<boolean>(false)\n\n  const listOfReachedSteps = useRef([activeStep].filter(Boolean)).current\n\n  const mediaQueryListener = useRef(null)\n\n  const context = useContext(Context)\n  const contextValue = makeContextValue() as StepIndicatorContextValues\n\n  // Mount and dismount\n  useEffect(() => {\n    const container = document?.getElementById(\n      'sidebar__' + props.sidebar_id\n    )\n\n    setHasSidebar(Boolean(container))\n\n    mediaQueryListener.current = onMediaQueryChange(\n      {\n        min: '0',\n        max: 'medium',\n      },\n      (hideSidebar) => {\n        setHideSidebar(hideSidebar)\n      },\n      { runOnInit: true }\n    )\n\n    return () => {\n      if (mediaQueryListener.current) {\n        mediaQueryListener.current()\n      }\n    }\n  }, [])\n\n  // Keeps the activeStep state updated with changes to the current_step and data props\n  useEffect(() => {\n    const currentStepFromProps = getActiveStepFromProps()\n\n    if (currentStepFromProps !== activeStep) {\n      setActiveStep(currentStepFromProps)\n    }\n  }, [props.current_step, data])\n\n  // Keeps the listOfReachedSteps state up to date with the activeStep state\n  useEffect(() => {\n    if (!listOfReachedSteps.includes(activeStep)) {\n      listOfReachedSteps.push(activeStep)\n    }\n  }, [activeStep])\n\n  function onChangeState() {\n    setOpenState(false)\n  }\n\n  function openHandler() {\n    setOpenState(true)\n  }\n\n  function closeHandler() {\n    setOpenState(false)\n  }\n\n  function getData(\n    props: StepIndicatorProviderProps\n  ): string[] | StepIndicatorDataItem[] {\n    if (typeof props.data === 'string') {\n      return props.data[0] === '[' ? JSON.parse(props.data) : []\n    }\n\n    return props.data || []\n  }\n\n  function getActiveStepFromProps() {\n    if (typeof data[0] === 'string') {\n      return props.current_step\n    }\n\n    const dataWithItems = data as StepIndicatorDataItem[]\n\n    const itemWithCurrentStep = dataWithItems.find(\n      (item) => item.is_current\n    )\n    // Is current on data item has precedence(?) over current_step prop\n    return itemWithCurrentStep\n      ? dataWithItems.indexOf(itemWithCurrentStep)\n      : props.current_step\n  }\n\n  function makeContextValue() {\n    const globalContext = extendPropsWithContext(\n      props,\n      stepIndicatorDefaultProps,\n      { skeleton: context?.skeleton },\n      context.getTranslation(context).StepIndicator,\n      context.StepIndicator\n    )\n\n    const value = extendSafe(\n      { filterAttributes },\n      globalContext,\n      // Props\n      {\n        defaultProps: stepIndicatorDefaultProps,\n        props,\n      },\n      // State\n      {\n        hasSidebar,\n        hideSidebar,\n        activeStep,\n        openState,\n        listOfReachedSteps,\n        data,\n        countSteps,\n        stepsLabel: updateStepTitle(globalContext.step_title),\n        stepsLabelExtended: updateStepTitle(\n          globalContext.step_title_extended\n        ),\n      },\n      // Functions\n      {\n        setActiveStep,\n        onChangeState,\n        openHandler,\n        closeHandler,\n      }\n    ) as StepIndicatorContextValues\n\n    value.sidebarIsVisible = value.hasSidebar && !value.hideSidebar\n\n    return value\n  }\n\n  function updateStepTitle(title: string) {\n    return title\n      ?.replace('%step', String((activeStep || 0) + 1))\n      .replace('%count', String(data?.length || 1))\n  }\n\n  if (typeof window !== 'undefined' && window['IS_TEST']) {\n    contextValue['no_animation'] = true\n  }\n\n  // Filter out unwanted HTML attributes\n  Object.keys(contextValue).forEach((key) => {\n    if (key.startsWith('_')) {\n      delete contextValue[key]\n    }\n  })\n\n  return (\n    <StepIndicatorContext.Provider value={contextValue}>\n      {props.children}\n    </StepIndicatorContext.Provider>\n  )\n}\n\n/**\n * Like \"Object.assign\" – but safe\n * A new falsy value will not be used, if it exists already\n *\n * @param  {...object} objects\n * @returns object\n */\nfunction extendSafe(...objects): Record<string, unknown> {\n  const obj = {}\n\n  objects.forEach((itm) => {\n    if (itm.defaultProps && itm.props) {\n      itm = Object.entries(itm.props).reduce((acc, [k, v]) => {\n        if (itm.defaultProps[k] !== v) {\n          acc[k] = v\n        }\n        return acc\n      }, {})\n    }\n\n    Object.entries(itm).forEach(([k, v]) => {\n      if (!obj[k] || (obj[k] && v)) {\n        obj[k] = v\n      }\n    })\n  })\n\n  return obj\n}\n"],"mappings":"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"}
+{"version":3,"file":"StepIndicatorContext.js","names":["React","useContext","useEffect","useRef","useState","Context","stepIndicatorDefaultProps","extendPropsWithContext","onMediaQueryChange","filterAttributes","Object","keys","filter","item","includes","concat","StepIndicatorContext","createContext","StepIndicatorProvider","_ref","isSidebar","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","data","getData","countSteps","length","hasSidebar","setHasSidebar","hideSidebar","setHideSidebar","activeStep","setActiveStep","getActiveStepFromProps","openState","setOpenState","listOfReachedSteps","Boolean","current","mediaQueryListener","context","contextValue","makeContextValue","_document","container","document","getElementById","sidebar_id","min","max","runOnInit","currentStepFromProps","current_step","push","onChangeState","openHandler","closeHandler","JSON","parse","dataWithItems","itemWithCurrentStep","find","is_current","indexOf","globalContext","skeleton","getTranslation","StepIndicator","value","extendSafe","defaultProps","stepsLabel","updateStepTitle","step_title","stepsLabelExtended","step_title_extended","sidebarIsVisible","title","replace","String","window","forEach","key","startsWith","createElement","Provider","children","obj","_len","arguments","objects","Array","_key","itm","entries","reduce","acc","_ref2","k","v","_ref3"],"sources":["../../../../src/components/step-indicator/StepIndicatorContext.tsx"],"sourcesContent":["/**\n * Web StepIndicator Context\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\nimport Context, { ContextProps } from '../../shared/Context'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport { onMediaQueryChange } from '../../shared/MediaQueryUtils'\nimport {\n  StepIndicatorData,\n  StepIndicatorDataItem,\n  StepIndicatorMode,\n  StepIndicatorProps,\n} from './StepIndicator'\nimport { StepIndicatorItemProps } from './StepIndicatorItem'\n\n// We use this array to filter out unwanted properties\nconst filterAttributes = Object.keys(stepIndicatorDefaultProps)\n  .filter((item) => {\n    return !['class', 'className'].includes(item)\n  })\n  .concat([\n    'internalId',\n    'isSidebar',\n    'hasSidebar',\n    'hideSidebar',\n    'sidebarIsVisible',\n    'mainTitle',\n    'stepsLabel',\n    'stepsLabelExtended',\n    'listOfReachedSteps',\n    'setActiveStep',\n    'activeStep',\n    'countSteps',\n    'openState',\n    'onChangeState',\n    'openHandler',\n    'closeHandler',\n    'innerRef',\n    'hasSkeletonData',\n    'filterAttributes',\n    'onChangeState',\n  ])\n\nexport type StepIndicatorContextValues = StepIndicatorProviderProps &\n  StepIndicatorProviderStates &\n  ContextProps\n\nconst StepIndicatorContext =\n  React.createContext<StepIndicatorContextValues>(null)\n\nexport default StepIndicatorContext\n\nexport type StepIndicatorProviderProps = Omit<\n  StepIndicatorProps,\n  'mode' | 'data'\n> & {\n  /**\n   * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n   */\n  sidebar_id: string\n  /**\n   * <em>(required)</em> defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n   */\n  data?: StepIndicatorData\n  /**\n   * <em>(required)</em> defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n   */\n  mode?: StepIndicatorMode\n  children: React.ReactNode\n  isSidebar?: boolean\n}\n\nexport type StepIndicatorProviderStates = {\n  data: (string | StepIndicatorItemProps)[]\n  hasSidebar: boolean\n  hideSidebar: boolean\n  activeStep: number\n  openState: boolean\n  listOfReachedSteps: number[]\n  countSteps: number\n  stepsLabel: string\n  stepsLabelExtended: string\n  filterAttributes: string[]\n  setActiveStep: React.Dispatch<React.SetStateAction<number>>\n  sidebarIsVisible: boolean\n  onChangeState: () => void\n  openHandler: () => void\n  closeHandler: () => void\n}\n\nexport function StepIndicatorProvider({\n  isSidebar = false,\n  ...restOfProps\n}: StepIndicatorProviderProps) {\n  const props = { isSidebar, ...restOfProps }\n\n  const data = getData(props)\n  const countSteps = data.length\n\n  const [hasSidebar, setHasSidebar] = useState<boolean>(true)\n  const [hideSidebar, setHideSidebar] = useState<boolean>(false)\n  const [activeStep, setActiveStep] = useState<number>(\n    getActiveStepFromProps()\n  )\n  const [openState, setOpenState] = useState<boolean>(false)\n\n  const listOfReachedSteps = useRef([activeStep].filter(Boolean)).current\n\n  const mediaQueryListener = useRef(null)\n\n  const context = useContext(Context)\n  const contextValue = makeContextValue() as StepIndicatorContextValues\n\n  // Mount and dismount\n  useEffect(() => {\n    const container = document?.getElementById(\n      'sidebar__' + props.sidebar_id\n    )\n\n    setHasSidebar(Boolean(container))\n\n    mediaQueryListener.current = onMediaQueryChange(\n      {\n        min: '0',\n        max: 'medium',\n      },\n      (hideSidebar) => {\n        setHideSidebar(hideSidebar)\n      },\n      { runOnInit: true }\n    )\n\n    return () => {\n      if (mediaQueryListener.current) {\n        mediaQueryListener.current()\n      }\n    }\n  }, [])\n\n  // Keeps the activeStep state updated with changes to the current_step and data props\n  useEffect(() => {\n    const currentStepFromProps = getActiveStepFromProps()\n\n    if (currentStepFromProps !== activeStep) {\n      setActiveStep(currentStepFromProps)\n    }\n  }, [props.current_step, data])\n\n  // Keeps the listOfReachedSteps state up to date with the activeStep state\n  useEffect(() => {\n    if (!listOfReachedSteps.includes(activeStep)) {\n      listOfReachedSteps.push(activeStep)\n    }\n  }, [activeStep])\n\n  function onChangeState() {\n    setOpenState(false)\n  }\n\n  function openHandler() {\n    setOpenState(true)\n  }\n\n  function closeHandler() {\n    setOpenState(false)\n  }\n\n  function getData(\n    props: StepIndicatorProviderProps\n  ): string[] | StepIndicatorDataItem[] {\n    if (typeof props.data === 'string') {\n      return props.data[0] === '[' ? JSON.parse(props.data) : []\n    }\n\n    return props.data || []\n  }\n\n  function getActiveStepFromProps() {\n    if (typeof data[0] === 'string') {\n      return props.current_step\n    }\n\n    const dataWithItems = data as StepIndicatorDataItem[]\n\n    const itemWithCurrentStep = dataWithItems.find(\n      (item) => item.is_current\n    )\n    // Is current on data item has precedence(?) over current_step prop\n    return itemWithCurrentStep\n      ? dataWithItems.indexOf(itemWithCurrentStep)\n      : props.current_step\n  }\n\n  function makeContextValue() {\n    const globalContext = extendPropsWithContext(\n      props,\n      stepIndicatorDefaultProps,\n      { skeleton: context?.skeleton },\n      context.getTranslation(context).StepIndicator,\n      context.StepIndicator\n    )\n\n    const value = extendSafe(\n      { filterAttributes },\n      globalContext,\n      // Props\n      {\n        defaultProps: stepIndicatorDefaultProps,\n        props,\n      },\n      // State\n      {\n        hasSidebar,\n        hideSidebar,\n        activeStep,\n        openState,\n        listOfReachedSteps,\n        data,\n        countSteps,\n        stepsLabel: updateStepTitle(globalContext.step_title),\n        stepsLabelExtended: updateStepTitle(\n          globalContext.step_title_extended\n        ),\n      },\n      // Functions\n      {\n        setActiveStep,\n        onChangeState,\n        openHandler,\n        closeHandler,\n      }\n    ) as StepIndicatorContextValues\n\n    value.sidebarIsVisible = value.hasSidebar && !value.hideSidebar\n\n    return value\n  }\n\n  function updateStepTitle(title: string) {\n    return title\n      ?.replace('%step', String((activeStep || 0) + 1))\n      .replace('%count', String(data?.length || 1))\n  }\n\n  if (typeof window !== 'undefined' && window['IS_TEST']) {\n    contextValue['no_animation'] = true\n  }\n\n  // Filter out unwanted HTML attributes\n  Object.keys(contextValue).forEach((key) => {\n    if (key.startsWith('_')) {\n      delete contextValue[key]\n    }\n  })\n\n  return (\n    <StepIndicatorContext.Provider value={contextValue}>\n      {props.children}\n    </StepIndicatorContext.Provider>\n  )\n}\n\n/**\n * Like \"Object.assign\" – but safe\n * A new falsy value will not be used, if it exists already\n *\n * @param  {...object} objects\n * @returns object\n */\nfunction extendSafe(...objects): Record<string, unknown> {\n  const obj = {}\n\n  objects.forEach((itm) => {\n    if (itm.defaultProps && itm.props) {\n      itm = Object.entries(itm.props).reduce((acc, [k, v]) => {\n        if (itm.defaultProps[k] !== v) {\n          acc[k] = v\n        }\n        return acc\n      }, {})\n    }\n\n    Object.entries(itm).forEach(([k, v]) => {\n      if (!obj[k] || (obj[k] && v)) {\n        obj[k] = v\n      }\n    })\n  })\n\n  return obj\n}\n"],"mappings":"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"}

package/components/step-indicator/StepIndicatorItem.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
@@ -112,7 +114,7 @@ function StepIndicatorItem(_ref) {
     }
   });
   const hasPassedAndIsCurrent = mode === 'loose' || currentItemNum <= activeStep || listOfReachedSteps.includes(currentItemNum);
-  const isNavigateable = mode === 'strict' || mode === 'loose';
+  const isNavigatable = mode === 'strict' || mode === 'loose';
   let isInactive = inactive || mode === 'strict' && !hasPassedAndIsCurrent;
   const isVisited = currentItemNum < activeStep;
   const id = `${sidebar_id || makeUniqueId()}-${currentItemNum}`;
@@ -148,7 +150,7 @@ function StepIndicatorItem(_ref) {
   if (disabled) {
     buttonParams.disabled = true;
   }
-  if (isNavigateable && !isInactive) {
+  if (isNavigatable && !isInactive) {
     buttonParams.onClick = _ref3 => {
       let {
         event

package/components/step-indicator/StepIndicatorItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorItem.js","names":["React","useContext","useEffect","useLayoutEffect","useRef","useState","classnames","makeUniqueId","dispatchCustomElementEvent","HeightAnimationInstance","Button","Icon","WarnIcon","InfoIcon","ErrorIcon","StepIndicatorContext","stepIndicatorDefaultProps","StepIndicatorItem","_ref","status_state","status_state_default","inactive","inactive_default","disabled","disabled_default","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","previousStep","setPreviousStep","activeStep","heightAnim","animate","no_animation","undefined","current","ref","thisReference","onClickHandler","setElement","remove","height","getHeight","currentItemNum","toHeight","getUnknownHeight","adjustTo","_ref2","event","item","params","current_step","currentStep","onClickItem","onClickGlobal","setActiveStep","onChangeState","mode","filterAttributes","countSteps","listOfReachedSteps","hide_numbers","on_item_render","sidebar_id","step_title","title","is_current","status","on_render","on_click","attributes","_excluded2","Object","keys","forEach","key","includes","hasPassedAndIsCurrent","isNavigateable","isInactive","isVisited","id","ariaLabel","replace","String","isCurrent","element","createElement","StepItemWrapper","number","callbackProps","StepItem","itemParams","buttonParams","icon","onClick","_ref3","type","_extends","className","StepItemButton","inner_ref","_ref4","children","_excluded3","icons","info","error","warn","size","inherit_color","wrap","stretch","variant","icon_size","icon_position","_ref5"],"sources":["../../../../src/components/step-indicator/StepIndicatorItem.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, {\n  HTMLProps,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react'\n\nimport classnames from 'classnames'\nimport {\n  makeUniqueId,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport HeightAnimationInstance from '../height-animation/HeightAnimationInstance'\nimport Button, { ButtonProps } from '../button/Button'\nimport Icon, { IconIcon } from '../icon/Icon'\nimport { WarnIcon, InfoIcon, ErrorIcon } from '../form-status/FormStatus'\nimport StepIndicatorContext from './StepIndicatorContext'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport {\n  StepIndicatorMouseEvent,\n  StepIndicatorRenderCallback,\n} from './StepIndicator'\n\nexport type StepIndicatorStatusState = 'warn' | 'info' | 'error'\nexport type StepIndicatorItemProps = Omit<\n  React.HTMLProps<HTMLElement>,\n  'title' | 'data'\n> & {\n  title: string | React.ReactNode\n  /**\n   * If set to true, this item step will be set as the current current selected step. This can be used instead of `current_step` on the component itself.\n   */\n  is_current?: boolean\n  /**\n   * If set to true, this item step will be handled as an inactive step and will not be clickable.\n   * Defaults to `false`\n   */\n  inactive?: boolean\n  /**\n   * If set to true, this item step will be visible as an disabled button and will not be clickable.\n   * Defaults to false.\n   */\n  disabled?: boolean\n  /**\n   * Is used to set the status text.\n   */\n  status?: string | React.ReactNode\n  /**\n   * Used to set the status state to be either `info`, `error` or `warn`.\n   * Defaults to `warn`.\n   */\n  status_state?: StepIndicatorStatusState\n  /**\n   * Callback function to manipulate or wrap the step item. Has to return a React Node. You receive an object `{ StepItem, element, attributes, props, context }`.\n   */\n  on_render?: ({\n    StepItem,\n    element,\n    attributes,\n    props,\n    context,\n  }: StepIndicatorRenderCallback) => React.ReactNode\n  /**\n   * Will be called once the user clicks on the current or another step. Will be emitted on every click. Returns an object `{ event, item, current_step }`.\n   */\n  on_click?: ({\n    event,\n    item,\n    current_step,\n    currentStep,\n  }: StepIndicatorMouseEvent) => void\n  currentItemNum: number\n}\n\nfunction StepIndicatorItem({\n  status_state: status_state_default = 'warn',\n  inactive: inactive_default = false,\n  disabled: disabled_default = false,\n  ...restOfProps\n}: StepIndicatorItemProps) {\n  const props: StepIndicatorItemProps = {\n    status_state: status_state_default,\n    inactive: inactive_default,\n    disabled: disabled_default,\n    ...restOfProps,\n  }\n\n  const context = useContext(StepIndicatorContext)\n\n  const [previousStep, setPreviousStep] = useState<number>(\n    context.activeStep\n  )\n\n  const heightAnim = useRef(\n    new HeightAnimationInstance({\n      animate:\n        context?.no_animation !== undefined ? context.no_animation : false,\n    })\n  ).current\n\n  const ref = useRef(null)\n\n  const thisReference = {\n    context,\n    props,\n    onClickHandler,\n  }\n\n  // Mount and Dismount\n  useEffect(() => {\n    heightAnim.setElement(ref.current)\n\n    return () => {\n      heightAnim.remove()\n    }\n  }, [])\n\n  // Effect used to keep track of previous activeStep from context\n  useEffect(() => {\n    if (previousStep !== context.activeStep) {\n      setPreviousStep(context.activeStep)\n    }\n  }, [context.activeStep])\n\n  useLayoutEffect(() => {\n    const height = heightAnim.getHeight()\n\n    if (\n      previousStep !== context.activeStep &&\n      (props.currentItemNum === previousStep ||\n        props.currentItemNum === context.activeStep)\n    ) {\n      const toHeight = heightAnim.getUnknownHeight()\n      if (height !== toHeight) {\n        heightAnim.adjustTo(height, toHeight)\n      }\n    }\n  }, [previousStep, context.activeStep, heightAnim, props.currentItemNum])\n\n  function onClickHandler({ event, item, currentItemNum }) {\n    const params = {\n      event,\n      item,\n      current_step: currentItemNum,\n      currentStep: currentItemNum,\n    }\n\n    const onClickItem = dispatchCustomElementEvent(\n      thisReference,\n      'on_click',\n      params\n    )\n\n    const onClickGlobal = dispatchCustomElementEvent(\n      context,\n      'on_click',\n      params\n    )\n\n    if (onClickItem === false || onClickGlobal === false) {\n      return // stop here\n    }\n\n    if (context.activeStep !== currentItemNum) {\n      context.setActiveStep(currentItemNum)\n      if (typeof context.onChangeState === 'function') {\n        context.onChangeState()\n      }\n\n      dispatchCustomElementEvent(context, 'on_change', params)\n    }\n  }\n\n  const {\n    mode,\n    filterAttributes,\n    activeStep,\n    countSteps,\n    listOfReachedSteps,\n    hide_numbers,\n    on_item_render,\n    sidebar_id,\n    step_title,\n  } = context\n\n  const {\n    currentItemNum,\n\n    title,\n    is_current,\n    inactive,\n    disabled,\n    status,\n    status_state,\n\n    on_render,\n    on_click, // eslint-disable-line\n\n    ...attributes\n  } = props\n\n  Object.keys(attributes).forEach((key) => {\n    if (filterAttributes.includes(key)) {\n      delete attributes[key]\n    }\n  })\n\n  const hasPassedAndIsCurrent =\n    mode === 'loose' ||\n    currentItemNum <= activeStep ||\n    listOfReachedSteps.includes(currentItemNum)\n\n  const isNavigateable = mode === 'strict' || mode === 'loose'\n\n  let isInactive =\n    inactive || (mode === 'strict' && !hasPassedAndIsCurrent)\n\n  const isVisited = currentItemNum < activeStep\n\n  const id = `${sidebar_id || makeUniqueId()}-${currentItemNum}`\n  const ariaLabel = step_title\n    ?.replace('%step', String(currentItemNum + 1))\n    .replace('%count', String(countSteps))\n\n  const isCurrent = currentItemNum === activeStep\n\n  let element = (\n    <StepItemWrapper\n      number={currentItemNum + 1}\n      hide_numbers={hide_numbers}\n      status={status}\n    >\n      {title}\n    </StepItemWrapper>\n  ) as React.ReactNode\n\n  const callbackProps = {\n    StepItem: StepItemWrapper,\n    element,\n    attributes,\n    props,\n    context,\n  }\n\n  if (typeof on_render === 'function') {\n    element = on_render(callbackProps)\n  } else if (typeof on_item_render === 'function') {\n    element = on_item_render(callbackProps)\n  }\n\n  const itemParams = {} as HTMLProps<HTMLLIElement>\n  const buttonParams = {\n    icon: 'check',\n    status,\n    status_state,\n    'aria-describedby': id,\n  } as StepItemButtonProps\n\n  if (isCurrent) {\n    itemParams['aria-current'] = 'step'\n  }\n\n  if (disabled) {\n    buttonParams.disabled = true\n  }\n\n  if (isNavigateable && !isInactive) {\n    buttonParams.onClick = ({ event }: never) =>\n      onClickHandler({\n        event,\n        item: props,\n        currentItemNum,\n      })\n  }\n\n  if (!buttonParams.onClick) {\n    buttonParams.element = 'span'\n    buttonParams.type = ''\n    buttonParams.on_click = undefined\n    isInactive = true\n  }\n\n  return (\n    <li\n      {...itemParams}\n      className={classnames(\n        'dnb-step-indicator__item',\n        isCurrent && 'dnb-step-indicator__item--current',\n        isInactive && 'dnb-step-indicator__item--inactive',\n        isVisited && 'dnb-step-indicator__item--visited',\n        itemParams.className\n      )}\n    >\n      <StepItemButton {...buttonParams} inner_ref={ref}>\n        {element}\n      </StepItemButton>\n      <span id={id} aria-hidden className=\"dnb-sr-only\">\n        {ariaLabel}\n      </span>\n    </li>\n  )\n}\n\nexport type StepItemButtonProps = Omit<ButtonProps, 'status_state'> & {\n  status_state?: StepIndicatorStatusState\n}\n\nexport function StepItemButton({\n  children,\n  className,\n  status,\n  status_state,\n  inner_ref,\n  ...props\n}: StepItemButtonProps) {\n  const icons: Record<StepIndicatorStatusState, IconIcon> = {\n    info: InfoIcon,\n    error: ErrorIcon,\n    warn: WarnIcon,\n  }\n\n  if (status) {\n    props.icon = (\n      <Icon\n        icon={icons[status_state] || icons.warn}\n        className=\"dnb-button__icon\"\n        size=\"medium\"\n        inherit_color={false}\n      />\n    )\n  }\n\n  return (\n    <Button\n      className={classnames(\n        className,\n        status && 'dnb-step-indicator__button__status',\n        status && `dnb-step-indicator__button__status--${status_state}`\n      )}\n      wrap\n      stretch\n      variant=\"secondary\"\n      icon_size=\"medium\"\n      icon_position=\"right\"\n      inner_ref={inner_ref}\n      {...props}\n    >\n      {children}\n    </Button>\n  )\n}\n\nexport type StepItemWrapperProps = React.HTMLProps<HTMLElement> & {\n  children?: React.ReactNode\n  number?: number\n  /**\n   * Define whether to show automatically counted numbers or not. Defaults to `false`.\n   */\n  hide_numbers?: boolean\n  status?: string | React.ReactNode\n}\n\nexport function StepItemWrapper({\n  children,\n  number,\n  hide_numbers = stepIndicatorDefaultProps.hide_numbers,\n  status,\n}: StepItemWrapperProps) {\n  return (\n    <span className=\"dnb-step-indicator__item-content\">\n      {!hide_numbers && (\n        <span\n          aria-hidden // because we provide the hidden aria-describedby\n          className=\"dnb-step-indicator__item-content__number\"\n        >\n          {number}.\n        </span>\n      )}\n      <span className=\"dnb-step-indicator__item-content__wrapper\">\n        <span className=\"dnb-step-indicator__item-content__text\">\n          {children}\n        </span>\n        {status && (\n          <span className=\"dnb-step-indicator__item-content__status\">\n            {status}\n          </span>\n        )}\n      </span>\n    </span>\n  )\n}\n\nexport default StepIndicatorItem\n"],"mappings":";;;;;;;;AAKA,OAAOA,KAAK,IAEVC,UAAU,EACVC,SAAS,EACTC,eAAe,EACfC,MAAM,EACNC,QAAQ,QACH,OAAO;AAEd,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,YAAY,EACZC,0BAA0B,QACrB,+BAA+B;AACtC,OAAOC,uBAAuB,MAAM,6CAA6C;AACjF,OAAOC,MAAM,MAAuB,kBAAkB;AACtD,OAAOC,IAAI,MAAoB,cAAc;AAC7C,SAASC,QAAQ,EAAEC,QAAQ,EAAEC,SAAS,QAAQ,2BAA2B;AACzE,OAAOC,oBAAoB,MAAM,wBAAwB;AACzD,SAASC,yBAAyB,QAAQ,sBAAsB;AAyDhE,SAASC,iBAAiBA,CAAAC,IAAA,EAKC;EAAA,IALA;MACzBC,YAAY,EAAEC,oBAAoB,GAAG,MAAM;MAC3CC,QAAQ,EAAEC,gBAAgB,GAAG,KAAK;MAClCC,QAAQ,EAAEC,gBAAgB,GAAG;IAEP,CAAC,GAAAN,IAAA;IADpBO,WAAW,GAAAC,wBAAA,CAAAR,IAAA,EAAAS,SAAA;EAEd,MAAMC,KAA6B,GAAAC,aAAA;IACjCV,YAAY,EAAEC,oBAAoB;IAClCC,QAAQ,EAAEC,gBAAgB;IAC1BC,QAAQ,EAAEC;EAAgB,GACvBC,WAAW,CACf;EAED,MAAMK,OAAO,GAAG7B,UAAU,CAACc,oBAAoB,CAAC;EAEhD,MAAM,CAACgB,YAAY,EAAEC,eAAe,CAAC,GAAG3B,QAAQ,CAC9CyB,OAAO,CAACG,UACV,CAAC;EAED,MAAMC,UAAU,GAAG9B,MAAM,CACvB,IAAIK,uBAAuB,CAAC;IAC1B0B,OAAO,EACL,CAAAL,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEM,YAAY,MAAKC,SAAS,GAAGP,OAAO,CAACM,YAAY,GAAG;EACjE,CAAC,CACH,CAAC,CAACE,OAAO;EAET,MAAMC,GAAG,GAAGnC,MAAM,CAAC,IAAI,CAAC;EAExB,MAAMoC,aAAa,GAAG;IACpBV,OAAO;IACPF,KAAK;IACLa;EACF,CAAC;EAGDvC,SAAS,CAAC,MAAM;IACdgC,UAAU,CAACQ,UAAU,CAACH,GAAG,CAACD,OAAO,CAAC;IAElC,OAAO,MAAM;MACXJ,UAAU,CAACS,MAAM,CAAC,CAAC;IACrB,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;EAGNzC,SAAS,CAAC,MAAM;IACd,IAAI6B,YAAY,KAAKD,OAAO,CAACG,UAAU,EAAE;MACvCD,eAAe,CAACF,OAAO,CAACG,UAAU,CAAC;IACrC;EACF,CAAC,EAAE,CAACH,OAAO,CAACG,UAAU,CAAC,CAAC;EAExB9B,eAAe,CAAC,MAAM;IACpB,MAAMyC,MAAM,GAAGV,UAAU,CAACW,SAAS,CAAC,CAAC;IAErC,IACEd,YAAY,KAAKD,OAAO,CAACG,UAAU,KAClCL,KAAK,CAACkB,cAAc,KAAKf,YAAY,IACpCH,KAAK,CAACkB,cAAc,KAAKhB,OAAO,CAACG,UAAU,CAAC,EAC9C;MACA,MAAMc,QAAQ,GAAGb,UAAU,CAACc,gBAAgB,CAAC,CAAC;MAC9C,IAAIJ,MAAM,KAAKG,QAAQ,EAAE;QACvBb,UAAU,CAACe,QAAQ,CAACL,MAAM,EAAEG,QAAQ,CAAC;MACvC;IACF;EACF,CAAC,EAAE,CAAChB,YAAY,EAAED,OAAO,CAACG,UAAU,EAAEC,UAAU,EAAEN,KAAK,CAACkB,cAAc,CAAC,CAAC;EAExE,SAASL,cAAcA,CAAAS,KAAA,EAAkC;IAAA,IAAjC;MAAEC,KAAK;MAAEC,IAAI;MAAEN;IAAe,CAAC,GAAAI,KAAA;IACrD,MAAMG,MAAM,GAAG;MACbF,KAAK;MACLC,IAAI;MACJE,YAAY,EAAER,cAAc;MAC5BS,WAAW,EAAET;IACf,CAAC;IAED,MAAMU,WAAW,GAAGhD,0BAA0B,CAC5CgC,aAAa,EACb,UAAU,EACVa,MACF,CAAC;IAED,MAAMI,aAAa,GAAGjD,0BAA0B,CAC9CsB,OAAO,EACP,UAAU,EACVuB,MACF,CAAC;IAED,IAAIG,WAAW,KAAK,KAAK,IAAIC,aAAa,KAAK,KAAK,EAAE;MACpD;IACF;IAEA,IAAI3B,OAAO,CAACG,UAAU,KAAKa,cAAc,EAAE;MACzChB,OAAO,CAAC4B,aAAa,CAACZ,cAAc,CAAC;MACrC,IAAI,OAAOhB,OAAO,CAAC6B,aAAa,KAAK,UAAU,EAAE;QAC/C7B,OAAO,CAAC6B,aAAa,CAAC,CAAC;MACzB;MAEAnD,0BAA0B,CAACsB,OAAO,EAAE,WAAW,EAAEuB,MAAM,CAAC;IAC1D;EACF;EAEA,MAAM;IACJO,IAAI;IACJC,gBAAgB;IAChB5B,UAAU;IACV6B,UAAU;IACVC,kBAAkB;IAClBC,YAAY;IACZC,cAAc;IACdC,UAAU;IACVC;EACF,CAAC,GAAGrC,OAAO;EAEX,MAAM;MACJgB,cAAc;MAEdsB,KAAK;MACLC,UAAU;MACVhD,QAAQ;MACRE,QAAQ;MACR+C,MAAM;MACNnD,YAAY;MAEZoD,SAAS;MACTC;IAGF,CAAC,GAAG5C,KAAK;IADJ6C,UAAU,GAAA/C,wBAAA,CACXE,KAAK,EAAA8C,UAAA;EAETC,MAAM,CAACC,IAAI,CAACH,UAAU,CAAC,CAACI,OAAO,CAAEC,GAAG,IAAK;IACvC,IAAIjB,gBAAgB,CAACkB,QAAQ,CAACD,GAAG,CAAC,EAAE;MAClC,OAAOL,UAAU,CAACK,GAAG,CAAC;IACxB;EACF,CAAC,CAAC;EAEF,MAAME,qBAAqB,GACzBpB,IAAI,KAAK,OAAO,IAChBd,cAAc,IAAIb,UAAU,IAC5B8B,kBAAkB,CAACgB,QAAQ,CAACjC,cAAc,CAAC;EAE7C,MAAMmC,cAAc,GAAGrB,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,OAAO;EAE5D,IAAIsB,UAAU,GACZ7D,QAAQ,IAAKuC,IAAI,KAAK,QAAQ,IAAI,CAACoB,qBAAsB;EAE3D,MAAMG,SAAS,GAAGrC,cAAc,GAAGb,UAAU;EAE7C,MAAMmD,EAAE,GAAI,GAAElB,UAAU,IAAI3D,YAAY,CAAC,CAAE,IAAGuC,cAAe,EAAC;EAC9D,MAAMuC,SAAS,GAAGlB,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CACxBmB,OAAO,CAAC,OAAO,EAAEC,MAAM,CAACzC,cAAc,GAAG,CAAC,CAAC,CAAC,CAC7CwC,OAAO,CAAC,QAAQ,EAAEC,MAAM,CAACzB,UAAU,CAAC,CAAC;EAExC,MAAM0B,SAAS,GAAG1C,cAAc,KAAKb,UAAU;EAE/C,IAAIwD,OAAO,GACTzF,KAAA,CAAA0F,aAAA,CAACC,eAAe;IACdC,MAAM,EAAE9C,cAAc,GAAG,CAAE;IAC3BkB,YAAY,EAAEA,YAAa;IAC3BM,MAAM,EAAEA;EAAO,GAEdF,KACc,CACC;EAEpB,MAAMyB,aAAa,GAAG;IACpBC,QAAQ,EAAEH,eAAe;IACzBF,OAAO;IACPhB,UAAU;IACV7C,KAAK;IACLE;EACF,CAAC;EAED,IAAI,OAAOyC,SAAS,KAAK,UAAU,EAAE;IACnCkB,OAAO,GAAGlB,SAAS,CAACsB,aAAa,CAAC;EACpC,CAAC,MAAM,IAAI,OAAO5B,cAAc,KAAK,UAAU,EAAE;IAC/CwB,OAAO,GAAGxB,cAAc,CAAC4B,aAAa,CAAC;EACzC;EAEA,MAAME,UAAU,GAAG,CAAC,CAA6B;EACjD,MAAMC,YAAY,GAAG;IACnBC,IAAI,EAAE,OAAO;IACb3B,MAAM;IACNnD,YAAY;IACZ,kBAAkB,EAAEiE;EACtB,CAAwB;EAExB,IAAII,SAAS,EAAE;IACbO,UAAU,CAAC,cAAc,CAAC,GAAG,MAAM;EACrC;EAEA,IAAIxE,QAAQ,EAAE;IACZyE,YAAY,CAACzE,QAAQ,GAAG,IAAI;EAC9B;EAEA,IAAI0D,cAAc,IAAI,CAACC,UAAU,EAAE;IACjCc,YAAY,CAACE,OAAO,GAAGC,KAAA;MAAA,IAAC;QAAEhD;MAAa,CAAC,GAAAgD,KAAA;MAAA,OACtC1D,cAAc,CAAC;QACbU,KAAK;QACLC,IAAI,EAAExB,KAAK;QACXkB;MACF,CAAC,CAAC;IAAA;EACN;EAEA,IAAI,CAACkD,YAAY,CAACE,OAAO,EAAE;IACzBF,YAAY,CAACP,OAAO,GAAG,MAAM;IAC7BO,YAAY,CAACI,IAAI,GAAG,EAAE;IACtBJ,YAAY,CAACxB,QAAQ,GAAGnC,SAAS;IACjC6C,UAAU,GAAG,IAAI;EACnB;EAEA,OACElF,KAAA,CAAA0F,aAAA,OAAAW,QAAA,KACMN,UAAU;IACdO,SAAS,EAAEhG,UAAU,CACnB,0BAA0B,EAI1ByF,UAAU,CAACO,SAAS,EAHpBd,SAAS,IAAI,mCAAmC,EAChDN,UAAU,IAAI,oCAAoC,EAClDC,SAAS,IAAI,mCAEf;EAAE,IAEFnF,KAAA,CAAA0F,aAAA,CAACa,cAAc,EAAAF,QAAA,KAAKL,YAAY;IAAEQ,SAAS,EAAEjE;EAAI,IAC9CkD,OACa,CAAC,EACjBzF,KAAA,CAAA0F,aAAA;IAAMN,EAAE,EAAEA,EAAG;IAAC,mBAAW;IAACkB,SAAS,EAAC;EAAa,GAC9CjB,SACG,CACJ,CAAC;AAET;AAMA,OAAO,SAASkB,cAAcA,CAAAE,KAAA,EAON;EAAA,IAPO;MAC7BC,QAAQ;MACRJ,SAAS;MACThC,MAAM;MACNnD,YAAY;MACZqF;IAEmB,CAAC,GAAAC,KAAA;IADjB7E,KAAK,GAAAF,wBAAA,CAAA+E,KAAA,EAAAE,UAAA;EAER,MAAMC,KAAiD,GAAG;IACxDC,IAAI,EAAEhG,QAAQ;IACdiG,KAAK,EAAEhG,SAAS;IAChBiG,IAAI,EAAEnG;EACR,CAAC;EAED,IAAI0D,MAAM,EAAE;IACV1C,KAAK,CAACqE,IAAI,GACRjG,KAAA,CAAA0F,aAAA,CAAC/E,IAAI;MACHsF,IAAI,EAAEW,KAAK,CAACzF,YAAY,CAAC,IAAIyF,KAAK,CAACG,IAAK;MACxCT,SAAS,EAAC,kBAAkB;MAC5BU,IAAI,EAAC,QAAQ;MACbC,aAAa,EAAE;IAAM,CACtB,CACF;EACH;EAEA,OACEjH,KAAA,CAAA0F,aAAA,CAAChF,MAAM,EAAA2F,QAAA;IACLC,SAAS,EAAEhG,UAAU,CACnBgG,SAAS,EACThC,MAAM,8EAC2CnD,YAAa,EAChE,CAAE;IACF+F,IAAI;IACJC,OAAO;IACPC,OAAO,EAAC,WAAW;IACnBC,SAAS,EAAC,QAAQ;IAClBC,aAAa,EAAC,OAAO;IACrBd,SAAS,EAAEA;EAAU,GACjB5E,KAAK,GAER8E,QACK,CAAC;AAEb;AAYA,OAAO,SAASf,eAAeA,CAAA4B,KAAA,EAKN;EAAA,IALO;IAC9Bb,QAAQ;IACRd,MAAM;IACN5B,YAAY,GAAGhD,yBAAyB,CAACgD,YAAY;IACrDM;EACoB,CAAC,GAAAiD,KAAA;EACrB,OACEvH,KAAA,CAAA0F,aAAA;IAAMY,SAAS,EAAC;EAAkC,GAC/C,CAACtC,YAAY,IACZhE,KAAA,CAAA0F,aAAA;IACE,mBAAW;IACXY,SAAS,EAAC;EAA0C,GAEnDV,MAAM,EAAC,GACJ,CACP,EACD5F,KAAA,CAAA0F,aAAA;IAAMY,SAAS,EAAC;EAA2C,GACzDtG,KAAA,CAAA0F,aAAA;IAAMY,SAAS,EAAC;EAAwC,GACrDI,QACG,CAAC,EACNpC,MAAM,IACLtE,KAAA,CAAA0F,aAAA;IAAMY,SAAS,EAAC;EAA0C,GACvDhC,MACG,CAEJ,CACF,CAAC;AAEX;AAEA,eAAerD,iBAAiB"}
+{"version":3,"file":"StepIndicatorItem.js","names":["React","useContext","useEffect","useLayoutEffect","useRef","useState","classnames","makeUniqueId","dispatchCustomElementEvent","HeightAnimationInstance","Button","Icon","WarnIcon","InfoIcon","ErrorIcon","StepIndicatorContext","stepIndicatorDefaultProps","StepIndicatorItem","_ref","status_state","status_state_default","inactive","inactive_default","disabled","disabled_default","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","previousStep","setPreviousStep","activeStep","heightAnim","animate","no_animation","undefined","current","ref","thisReference","onClickHandler","setElement","remove","height","getHeight","currentItemNum","toHeight","getUnknownHeight","adjustTo","_ref2","event","item","params","current_step","currentStep","onClickItem","onClickGlobal","setActiveStep","onChangeState","mode","filterAttributes","countSteps","listOfReachedSteps","hide_numbers","on_item_render","sidebar_id","step_title","title","is_current","status","on_render","on_click","attributes","_excluded2","Object","keys","forEach","key","includes","hasPassedAndIsCurrent","isNavigatable","isInactive","isVisited","id","ariaLabel","replace","String","isCurrent","element","createElement","StepItemWrapper","number","callbackProps","StepItem","itemParams","buttonParams","icon","onClick","_ref3","type","_extends","className","StepItemButton","inner_ref","_ref4","children","_excluded3","icons","info","error","warn","size","inherit_color","wrap","stretch","variant","icon_size","icon_position","_ref5"],"sources":["../../../../src/components/step-indicator/StepIndicatorItem.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, {\n  HTMLProps,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react'\n\nimport classnames from 'classnames'\nimport {\n  makeUniqueId,\n  dispatchCustomElementEvent,\n} from '../../shared/component-helper'\nimport HeightAnimationInstance from '../height-animation/HeightAnimationInstance'\nimport Button, { ButtonProps } from '../button/Button'\nimport Icon, { IconIcon } from '../icon/Icon'\nimport { WarnIcon, InfoIcon, ErrorIcon } from '../form-status/FormStatus'\nimport StepIndicatorContext from './StepIndicatorContext'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport {\n  StepIndicatorMouseEvent,\n  StepIndicatorRenderCallback,\n} from './StepIndicator'\n\nexport type StepIndicatorStatusState = 'warn' | 'info' | 'error'\nexport type StepIndicatorItemProps = Omit<\n  React.HTMLProps<HTMLElement>,\n  'title' | 'data'\n> & {\n  title: string | React.ReactNode\n  /**\n   * If set to true, this item step will be set as the current current selected step. This can be used instead of `current_step` on the component itself.\n   */\n  is_current?: boolean\n  /**\n   * If set to true, this item step will be handled as an inactive step and will not be clickable.\n   * Defaults to `false`\n   */\n  inactive?: boolean\n  /**\n   * If set to true, this item step will be visible as an disabled button and will not be clickable.\n   * Defaults to false.\n   */\n  disabled?: boolean\n  /**\n   * Is used to set the status text.\n   */\n  status?: string | React.ReactNode\n  /**\n   * Used to set the status state to be either `info`, `error` or `warn`.\n   * Defaults to `warn`.\n   */\n  status_state?: StepIndicatorStatusState\n  /**\n   * Callback function to manipulate or wrap the step item. Has to return a React Node. You receive an object `{ StepItem, element, attributes, props, context }`.\n   */\n  on_render?: ({\n    StepItem,\n    element,\n    attributes,\n    props,\n    context,\n  }: StepIndicatorRenderCallback) => React.ReactNode\n  /**\n   * Will be called once the user clicks on the current or another step. Will be emitted on every click. Returns an object `{ event, item, current_step }`.\n   */\n  on_click?: ({\n    event,\n    item,\n    current_step,\n    currentStep,\n  }: StepIndicatorMouseEvent) => void\n  currentItemNum: number\n}\n\nfunction StepIndicatorItem({\n  status_state: status_state_default = 'warn',\n  inactive: inactive_default = false,\n  disabled: disabled_default = false,\n  ...restOfProps\n}: StepIndicatorItemProps) {\n  const props: StepIndicatorItemProps = {\n    status_state: status_state_default,\n    inactive: inactive_default,\n    disabled: disabled_default,\n    ...restOfProps,\n  }\n\n  const context = useContext(StepIndicatorContext)\n\n  const [previousStep, setPreviousStep] = useState<number>(\n    context.activeStep\n  )\n\n  const heightAnim = useRef(\n    new HeightAnimationInstance({\n      animate:\n        context?.no_animation !== undefined ? context.no_animation : false,\n    })\n  ).current\n\n  const ref = useRef(null)\n\n  const thisReference = {\n    context,\n    props,\n    onClickHandler,\n  }\n\n  // Mount and Dismount\n  useEffect(() => {\n    heightAnim.setElement(ref.current)\n\n    return () => {\n      heightAnim.remove()\n    }\n  }, [])\n\n  // Effect used to keep track of previous activeStep from context\n  useEffect(() => {\n    if (previousStep !== context.activeStep) {\n      setPreviousStep(context.activeStep)\n    }\n  }, [context.activeStep])\n\n  useLayoutEffect(() => {\n    const height = heightAnim.getHeight()\n\n    if (\n      previousStep !== context.activeStep &&\n      (props.currentItemNum === previousStep ||\n        props.currentItemNum === context.activeStep)\n    ) {\n      const toHeight = heightAnim.getUnknownHeight()\n      if (height !== toHeight) {\n        heightAnim.adjustTo(height, toHeight)\n      }\n    }\n  }, [previousStep, context.activeStep, heightAnim, props.currentItemNum])\n\n  function onClickHandler({ event, item, currentItemNum }) {\n    const params = {\n      event,\n      item,\n      current_step: currentItemNum,\n      currentStep: currentItemNum,\n    }\n\n    const onClickItem = dispatchCustomElementEvent(\n      thisReference,\n      'on_click',\n      params\n    )\n\n    const onClickGlobal = dispatchCustomElementEvent(\n      context,\n      'on_click',\n      params\n    )\n\n    if (onClickItem === false || onClickGlobal === false) {\n      return // stop here\n    }\n\n    if (context.activeStep !== currentItemNum) {\n      context.setActiveStep(currentItemNum)\n      if (typeof context.onChangeState === 'function') {\n        context.onChangeState()\n      }\n\n      dispatchCustomElementEvent(context, 'on_change', params)\n    }\n  }\n\n  const {\n    mode,\n    filterAttributes,\n    activeStep,\n    countSteps,\n    listOfReachedSteps,\n    hide_numbers,\n    on_item_render,\n    sidebar_id,\n    step_title,\n  } = context\n\n  const {\n    currentItemNum,\n\n    title,\n    is_current,\n    inactive,\n    disabled,\n    status,\n    status_state,\n\n    on_render,\n    on_click, // eslint-disable-line\n\n    ...attributes\n  } = props\n\n  Object.keys(attributes).forEach((key) => {\n    if (filterAttributes.includes(key)) {\n      delete attributes[key]\n    }\n  })\n\n  const hasPassedAndIsCurrent =\n    mode === 'loose' ||\n    currentItemNum <= activeStep ||\n    listOfReachedSteps.includes(currentItemNum)\n\n  const isNavigatable = mode === 'strict' || mode === 'loose'\n\n  let isInactive =\n    inactive || (mode === 'strict' && !hasPassedAndIsCurrent)\n\n  const isVisited = currentItemNum < activeStep\n\n  const id = `${sidebar_id || makeUniqueId()}-${currentItemNum}`\n  const ariaLabel = step_title\n    ?.replace('%step', String(currentItemNum + 1))\n    .replace('%count', String(countSteps))\n\n  const isCurrent = currentItemNum === activeStep\n\n  let element = (\n    <StepItemWrapper\n      number={currentItemNum + 1}\n      hide_numbers={hide_numbers}\n      status={status}\n    >\n      {title}\n    </StepItemWrapper>\n  ) as React.ReactNode\n\n  const callbackProps = {\n    StepItem: StepItemWrapper,\n    element,\n    attributes,\n    props,\n    context,\n  }\n\n  if (typeof on_render === 'function') {\n    element = on_render(callbackProps)\n  } else if (typeof on_item_render === 'function') {\n    element = on_item_render(callbackProps)\n  }\n\n  const itemParams = {} as HTMLProps<HTMLLIElement>\n  const buttonParams = {\n    icon: 'check',\n    status,\n    status_state,\n    'aria-describedby': id,\n  } as StepItemButtonProps\n\n  if (isCurrent) {\n    itemParams['aria-current'] = 'step'\n  }\n\n  if (disabled) {\n    buttonParams.disabled = true\n  }\n\n  if (isNavigatable && !isInactive) {\n    buttonParams.onClick = ({ event }: never) =>\n      onClickHandler({\n        event,\n        item: props,\n        currentItemNum,\n      })\n  }\n\n  if (!buttonParams.onClick) {\n    buttonParams.element = 'span'\n    buttonParams.type = ''\n    buttonParams.on_click = undefined\n    isInactive = true\n  }\n\n  return (\n    <li\n      {...itemParams}\n      className={classnames(\n        'dnb-step-indicator__item',\n        isCurrent && 'dnb-step-indicator__item--current',\n        isInactive && 'dnb-step-indicator__item--inactive',\n        isVisited && 'dnb-step-indicator__item--visited',\n        itemParams.className\n      )}\n    >\n      <StepItemButton {...buttonParams} inner_ref={ref}>\n        {element}\n      </StepItemButton>\n      <span id={id} aria-hidden className=\"dnb-sr-only\">\n        {ariaLabel}\n      </span>\n    </li>\n  )\n}\n\nexport type StepItemButtonProps = Omit<ButtonProps, 'status_state'> & {\n  status_state?: StepIndicatorStatusState\n}\n\nexport function StepItemButton({\n  children,\n  className,\n  status,\n  status_state,\n  inner_ref,\n  ...props\n}: StepItemButtonProps) {\n  const icons: Record<StepIndicatorStatusState, IconIcon> = {\n    info: InfoIcon,\n    error: ErrorIcon,\n    warn: WarnIcon,\n  }\n\n  if (status) {\n    props.icon = (\n      <Icon\n        icon={icons[status_state] || icons.warn}\n        className=\"dnb-button__icon\"\n        size=\"medium\"\n        inherit_color={false}\n      />\n    )\n  }\n\n  return (\n    <Button\n      className={classnames(\n        className,\n        status && 'dnb-step-indicator__button__status',\n        status && `dnb-step-indicator__button__status--${status_state}`\n      )}\n      wrap\n      stretch\n      variant=\"secondary\"\n      icon_size=\"medium\"\n      icon_position=\"right\"\n      inner_ref={inner_ref}\n      {...props}\n    >\n      {children}\n    </Button>\n  )\n}\n\nexport type StepItemWrapperProps = React.HTMLProps<HTMLElement> & {\n  children?: React.ReactNode\n  number?: number\n  /**\n   * Define whether to show automatically counted numbers or not. Defaults to `false`.\n   */\n  hide_numbers?: boolean\n  status?: string | React.ReactNode\n}\n\nexport function StepItemWrapper({\n  children,\n  number,\n  hide_numbers = stepIndicatorDefaultProps.hide_numbers,\n  status,\n}: StepItemWrapperProps) {\n  return (\n    <span className=\"dnb-step-indicator__item-content\">\n      {!hide_numbers && (\n        <span\n          aria-hidden // because we provide the hidden aria-describedby\n          className=\"dnb-step-indicator__item-content__number\"\n        >\n          {number}.\n        </span>\n      )}\n      <span className=\"dnb-step-indicator__item-content__wrapper\">\n        <span className=\"dnb-step-indicator__item-content__text\">\n          {children}\n        </span>\n        {status && (\n          <span className=\"dnb-step-indicator__item-content__status\">\n            {status}\n          </span>\n        )}\n      </span>\n    </span>\n  )\n}\n\nexport default StepIndicatorItem\n"],"mappings":"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"}

package/components/step-indicator/StepIndicatorList.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 const _excluded = ["mode", "filterAttributes", "skeleton", "data", "countSteps", "sidebar_id"];

package/components/step-indicator/StepIndicatorList.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorList.js","names":["React","useContext","classnames","combineLabelledBy","validateDOMAttributes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","StepIndicatorItem","StepIndicatorContext","StepIndicatorList","context","mode","filterAttributes","skeleton","data","countSteps","sidebar_id","rest","_objectWithoutProperties","_excluded","params","className","hasSidebar","listParams","Element","ariaLabelledbyValue","Object","keys","forEach","key","includes","createElement","map","itemData","i","item","title","_extends","currentItemNum"],"sources":["../../../../src/components/step-indicator/StepIndicatorList.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext } from 'react'\nimport classnames from 'classnames'\nimport {\n  combineLabelledBy,\n  validateDOMAttributes,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport StepIndicatorItem from './StepIndicatorItem'\nimport StepIndicatorContext from './StepIndicatorContext'\n\nfunction StepIndicatorList() {\n  const context = useContext(StepIndicatorContext)\n\n  const {\n    mode,\n    filterAttributes,\n    skeleton,\n    data,\n    countSteps,\n    sidebar_id,\n    ...rest\n  } = context\n\n  const params = {\n    sidebar_id,\n    className: classnames(\n      'dnb-step-indicator',\n      createSkeletonClass('font', skeleton),\n      context.hasSidebar && createSpacingClasses(context),\n      context.className\n    ),\n  }\n\n  const listParams = {\n    className: 'dnb-step-indicator__list',\n  }\n\n  const Element = mode === 'static' || !context.hasSidebar ? 'div' : 'nav'\n\n  const ariaLabelledbyValue = combineLabelledBy(rest, params.sidebar_id)\n\n  if (Element === 'nav') {\n    params['aria-labelledby'] = ariaLabelledbyValue\n  } else {\n    listParams['aria-labelledby'] = ariaLabelledbyValue\n  }\n\n  Object.keys(params).forEach((key) => {\n    if (filterAttributes.includes(key)) {\n      delete params[key]\n    }\n  })\n\n  skeletonDOMAttributes(params, skeleton)\n\n  validateDOMAttributes(context, params)\n\n  return (\n    <Element {...params}>\n      {countSteps > 0 && (\n        <ol {...listParams}>\n          {data.map((itemData, i) => {\n            const item =\n              typeof itemData === 'string' ? { title: itemData } : itemData\n\n            return (\n              <StepIndicatorItem key={i} currentItemNum={i} {...item} />\n            )\n          })}\n        </ol>\n      )}\n    </Element>\n  )\n}\n\nexport default StepIndicatorList\n"],"mappings":";;;AAKA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,iBAAiB,EACjBC,qBAAqB,QAChB,+BAA+B;AACtC,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SACEC,qBAAqB,EACrBC,mBAAmB,QACd,4BAA4B;AACnC,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,OAAOC,oBAAoB,MAAM,wBAAwB;AAEzD,SAASC,iBAAiBA,CAAA,EAAG;EAC3B,MAAMC,OAAO,GAAGV,UAAU,CAACQ,oBAAoB,CAAC;EAEhD,MAAM;MACJG,IAAI;MACJC,gBAAgB;MAChBC,QAAQ;MACRC,IAAI;MACJC,UAAU;MACVC;IAEF,CAAC,GAAGN,OAAO;IADNO,IAAI,GAAAC,wBAAA,CACLR,OAAO,EAAAS,SAAA;EAEX,MAAMC,MAAM,GAAG;IACbJ,UAAU;IACVK,SAAS,EAAEpB,UAAU,CACnB,oBAAoB,EACpBK,mBAAmB,CAAC,MAAM,EAAEO,QAAQ,CAAC,EAErCH,OAAO,CAACW,SAAS,EADjBX,OAAO,CAACY,UAAU,IAAIlB,oBAAoB,CAACM,OAAO,CAEpD;EACF,CAAC;EAED,MAAMa,UAAU,GAAG;IACjBF,SAAS,EAAE;EACb,CAAC;EAED,MAAMG,OAAO,GAAGb,IAAI,KAAK,QAAQ,IAAI,CAACD,OAAO,CAACY,UAAU,GAAG,KAAK,GAAG,KAAK;EAExE,MAAMG,mBAAmB,GAAGvB,iBAAiB,CAACe,IAAI,EAAEG,MAAM,CAACJ,UAAU,CAAC;EAEtE,IAAIQ,OAAO,KAAK,KAAK,EAAE;IACrBJ,MAAM,CAAC,iBAAiB,CAAC,GAAGK,mBAAmB;EACjD,CAAC,MAAM;IACLF,UAAU,CAAC,iBAAiB,CAAC,GAAGE,mBAAmB;EACrD;EAEAC,MAAM,CAACC,IAAI,CAACP,MAAM,CAAC,CAACQ,OAAO,CAAEC,GAAG,IAAK;IACnC,IAAIjB,gBAAgB,CAACkB,QAAQ,CAACD,GAAG,CAAC,EAAE;MAClC,OAAOT,MAAM,CAACS,GAAG,CAAC;IACpB;EACF,CAAC,CAAC;EAEFxB,qBAAqB,CAACe,MAAM,EAAEP,QAAQ,CAAC;EAEvCV,qBAAqB,CAACO,OAAO,EAAEU,MAAM,CAAC;EAEtC,OACErB,KAAA,CAAAgC,aAAA,CAACP,OAAO,EAAKJ,MAAM,EAChBL,UAAU,GAAG,CAAC,IACbhB,KAAA,CAAAgC,aAAA,OAAQR,UAAU,EACfT,IAAI,CAACkB,GAAG,CAAC,CAACC,QAAQ,EAAEC,CAAC,KAAK;IACzB,MAAMC,IAAI,GACR,OAAOF,QAAQ,KAAK,QAAQ,GAAG;MAAEG,KAAK,EAAEH;IAAS,CAAC,GAAGA,QAAQ;IAE/D,OACElC,KAAA,CAAAgC,aAAA,CAACxB,iBAAiB,EAAA8B,QAAA;MAACR,GAAG,EAAEK,CAAE;MAACI,cAAc,EAAEJ;IAAE,GAAKC,IAAI,CAAG,CAAC;EAE9D,CAAC,CACC,CAEC,CAAC;AAEd;AAEA,eAAe1B,iBAAiB"}
+{"version":3,"file":"StepIndicatorList.js","names":["React","useContext","classnames","combineLabelledBy","validateDOMAttributes","createSpacingClasses","skeletonDOMAttributes","createSkeletonClass","StepIndicatorItem","StepIndicatorContext","StepIndicatorList","context","mode","filterAttributes","skeleton","data","countSteps","sidebar_id","rest","_objectWithoutProperties","_excluded","params","className","hasSidebar","listParams","Element","ariaLabelledbyValue","Object","keys","forEach","key","includes","createElement","map","itemData","i","item","title","_extends","currentItemNum"],"sources":["../../../../src/components/step-indicator/StepIndicatorList.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext } from 'react'\nimport classnames from 'classnames'\nimport {\n  combineLabelledBy,\n  validateDOMAttributes,\n} from '../../shared/component-helper'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\nimport StepIndicatorItem from './StepIndicatorItem'\nimport StepIndicatorContext from './StepIndicatorContext'\n\nfunction StepIndicatorList() {\n  const context = useContext(StepIndicatorContext)\n\n  const {\n    mode,\n    filterAttributes,\n    skeleton,\n    data,\n    countSteps,\n    sidebar_id,\n    ...rest\n  } = context\n\n  const params = {\n    sidebar_id,\n    className: classnames(\n      'dnb-step-indicator',\n      createSkeletonClass('font', skeleton),\n      context.hasSidebar && createSpacingClasses(context),\n      context.className\n    ),\n  }\n\n  const listParams = {\n    className: 'dnb-step-indicator__list',\n  }\n\n  const Element = mode === 'static' || !context.hasSidebar ? 'div' : 'nav'\n\n  const ariaLabelledbyValue = combineLabelledBy(rest, params.sidebar_id)\n\n  if (Element === 'nav') {\n    params['aria-labelledby'] = ariaLabelledbyValue\n  } else {\n    listParams['aria-labelledby'] = ariaLabelledbyValue\n  }\n\n  Object.keys(params).forEach((key) => {\n    if (filterAttributes.includes(key)) {\n      delete params[key]\n    }\n  })\n\n  skeletonDOMAttributes(params, skeleton)\n\n  validateDOMAttributes(context, params)\n\n  return (\n    <Element {...params}>\n      {countSteps > 0 && (\n        <ol {...listParams}>\n          {data.map((itemData, i) => {\n            const item =\n              typeof itemData === 'string' ? { title: itemData } : itemData\n\n            return (\n              <StepIndicatorItem key={i} currentItemNum={i} {...item} />\n            )\n          })}\n        </ol>\n      )}\n    </Element>\n  )\n}\n\nexport default StepIndicatorList\n"],"mappings":";;;;;AAKA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,OAAOC,UAAU,MAAM,YAAY;AACnC,SACEC,iBAAiB,EACjBC,qBAAqB,QAChB,+BAA+B;AACtC,SAASC,oBAAoB,QAAQ,wBAAwB;AAC7D,SACEC,qBAAqB,EACrBC,mBAAmB,QACd,4BAA4B;AACnC,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,OAAOC,oBAAoB,MAAM,wBAAwB;AAEzD,SAASC,iBAAiBA,CAAA,EAAG;EAC3B,MAAMC,OAAO,GAAGV,UAAU,CAACQ,oBAAoB,CAAC;EAEhD,MAAM;MACJG,IAAI;MACJC,gBAAgB;MAChBC,QAAQ;MACRC,IAAI;MACJC,UAAU;MACVC;IAEF,CAAC,GAAGN,OAAO;IADNO,IAAI,GAAAC,wBAAA,CACLR,OAAO,EAAAS,SAAA;EAEX,MAAMC,MAAM,GAAG;IACbJ,UAAU;IACVK,SAAS,EAAEpB,UAAU,CACnB,oBAAoB,EACpBK,mBAAmB,CAAC,MAAM,EAAEO,QAAQ,CAAC,EAErCH,OAAO,CAACW,SAAS,EADjBX,OAAO,CAACY,UAAU,IAAIlB,oBAAoB,CAACM,OAAO,CAEpD;EACF,CAAC;EAED,MAAMa,UAAU,GAAG;IACjBF,SAAS,EAAE;EACb,CAAC;EAED,MAAMG,OAAO,GAAGb,IAAI,KAAK,QAAQ,IAAI,CAACD,OAAO,CAACY,UAAU,GAAG,KAAK,GAAG,KAAK;EAExE,MAAMG,mBAAmB,GAAGvB,iBAAiB,CAACe,IAAI,EAAEG,MAAM,CAACJ,UAAU,CAAC;EAEtE,IAAIQ,OAAO,KAAK,KAAK,EAAE;IACrBJ,MAAM,CAAC,iBAAiB,CAAC,GAAGK,mBAAmB;EACjD,CAAC,MAAM;IACLF,UAAU,CAAC,iBAAiB,CAAC,GAAGE,mBAAmB;EACrD;EAEAC,MAAM,CAACC,IAAI,CAACP,MAAM,CAAC,CAACQ,OAAO,CAAEC,GAAG,IAAK;IACnC,IAAIjB,gBAAgB,CAACkB,QAAQ,CAACD,GAAG,CAAC,EAAE;MAClC,OAAOT,MAAM,CAACS,GAAG,CAAC;IACpB;EACF,CAAC,CAAC;EAEFxB,qBAAqB,CAACe,MAAM,EAAEP,QAAQ,CAAC;EAEvCV,qBAAqB,CAACO,OAAO,EAAEU,MAAM,CAAC;EAEtC,OACErB,KAAA,CAAAgC,aAAA,CAACP,OAAO,EAAKJ,MAAM,EAChBL,UAAU,GAAG,CAAC,IACbhB,KAAA,CAAAgC,aAAA,OAAQR,UAAU,EACfT,IAAI,CAACkB,GAAG,CAAC,CAACC,QAAQ,EAAEC,CAAC,KAAK;IACzB,MAAMC,IAAI,GACR,OAAOF,QAAQ,KAAK,QAAQ,GAAG;MAAEG,KAAK,EAAEH;IAAS,CAAC,GAAGA,QAAQ;IAE/D,OACElC,KAAA,CAAAgC,aAAA,CAACxB,iBAAiB,EAAA8B,QAAA;MAACR,GAAG,EAAEK,CAAE;MAACI,cAAc,EAAEJ;IAAE,GAAKC,IAAI,CAAG,CAAC;EAE9D,CAAC,CACC,CAEC,CAAC;AAEd;AAEA,eAAe1B,iBAAiB"}

package/components/step-indicator/StepIndicatorModal.js

@@ -1,3 +1,5 @@
+"use client";
+
 var _StepIndicatorList, _StepIndicatorList2;
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';

package/components/step-indicator/StepIndicatorModal.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorModal.js","names":["React","useContext","useEffect","useRef","useState","ReactDOM","Drawer","StepIndicatorTriggerButton","StepIndicatorList","StepIndicatorContext","StepIndicatorModal","context","container","setContainer","triggerRef","document","getElementById","sidebar_id","closeHandler","hasSidebar","_triggerRef$current","current","focus","renderPortal","createPortal","_StepIndicatorList","createElement","sidebarIsVisible","Fragment","on_click","openHandler","inner_ref","id","title","overview_title","omitTriggerButton","openState","onOpen","onClose","Body","styleType","className","stepsLabelExtended","_StepIndicatorList2"],"sources":["../../../../src/components/step-indicator/StepIndicatorModal.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport Drawer from '../drawer/Drawer'\nimport StepIndicatorTriggerButton from './StepIndicatorTriggerButton'\nimport StepIndicatorList from './StepIndicatorList'\nimport StepIndicatorContext from './StepIndicatorContext'\n\nfunction StepIndicatorModal() {\n  const context = useContext(StepIndicatorContext)\n\n  const [container, setContainer] = useState(null)\n\n  const triggerRef = useRef(null)\n\n  useEffect(() => {\n    const container = document.getElementById(\n      'sidebar__' + context.sidebar_id\n    )\n\n    setContainer(container)\n  }, [])\n\n  function closeHandler() {\n    if (context.hasSidebar) {\n      triggerRef.current?.focus()\n    }\n    context.closeHandler()\n  }\n\n  function renderPortal() {\n    if (!container) {\n      return null\n    }\n\n    return ReactDOM.createPortal(<StepIndicatorList />, container)\n  }\n\n  if (context.sidebarIsVisible) {\n    return renderPortal()\n  }\n\n  return (\n    <>\n      <StepIndicatorTriggerButton\n        on_click={context.openHandler}\n        inner_ref={triggerRef}\n      />\n      <Drawer\n        id={context.sidebar_id}\n        title={context.overview_title}\n        omitTriggerButton\n        openState={context.openState}\n        onOpen={context.openHandler}\n        onClose={closeHandler}\n      >\n        <Drawer.Body styleType=\"white\">\n          <div className=\"dnb-step-indicator-wrapper\">\n            <p className=\"dnb-p dnb-step-indicator__label\">\n              {context.stepsLabelExtended}\n            </p>\n            <StepIndicatorList />\n          </div>\n        </Drawer.Body>\n      </Drawer>\n    </>\n  )\n}\n\nexport default StepIndicatorModal\n"],"mappings":";AAKA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACtE,OAAOC,QAAQ,MAAM,WAAW;AAChC,OAAOC,MAAM,MAAM,kBAAkB;AACrC,OAAOC,0BAA0B,MAAM,8BAA8B;AACrE,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,OAAOC,oBAAoB,MAAM,wBAAwB;AAEzD,SAASC,kBAAkBA,CAAA,EAAG;EAC5B,MAAMC,OAAO,GAAGV,UAAU,CAACQ,oBAAoB,CAAC;EAEhD,MAAM,CAACG,SAAS,EAAEC,YAAY,CAAC,GAAGT,QAAQ,CAAC,IAAI,CAAC;EAEhD,MAAMU,UAAU,GAAGX,MAAM,CAAC,IAAI,CAAC;EAE/BD,SAAS,CAAC,MAAM;IACd,MAAMU,SAAS,GAAGG,QAAQ,CAACC,cAAc,CACvC,WAAW,GAAGL,OAAO,CAACM,UACxB,CAAC;IAEDJ,YAAY,CAACD,SAAS,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;EAEN,SAASM,YAAYA,CAAA,EAAG;IACtB,IAAIP,OAAO,CAACQ,UAAU,EAAE;MAAA,IAAAC,mBAAA;MACtB,CAAAA,mBAAA,GAAAN,UAAU,CAACO,OAAO,cAAAD,mBAAA,uBAAlBA,mBAAA,CAAoBE,KAAK,CAAC,CAAC;IAC7B;IACAX,OAAO,CAACO,YAAY,CAAC,CAAC;EACxB;EAEA,SAASK,YAAYA,CAAA,EAAG;IACtB,IAAI,CAACX,SAAS,EAAE;MACd,OAAO,IAAI;IACb;IAEA,OAAOP,QAAQ,CAACmB,YAAY,CAAAC,kBAAA,KAAAA,kBAAA,GAACzB,KAAA,CAAA0B,aAAA,CAAClB,iBAAiB,MAAE,CAAC,GAAEI,SAAS,CAAC;EAChE;EAEA,IAAID,OAAO,CAACgB,gBAAgB,EAAE;IAC5B,OAAOJ,YAAY,CAAC,CAAC;EACvB;EAEA,OACEvB,KAAA,CAAA0B,aAAA,CAAA1B,KAAA,CAAA4B,QAAA,QACE5B,KAAA,CAAA0B,aAAA,CAACnB,0BAA0B;IACzBsB,QAAQ,EAAElB,OAAO,CAACmB,WAAY;IAC9BC,SAAS,EAAEjB;EAAW,CACvB,CAAC,EACFd,KAAA,CAAA0B,aAAA,CAACpB,MAAM;IACL0B,EAAE,EAAErB,OAAO,CAACM,UAAW;IACvBgB,KAAK,EAAEtB,OAAO,CAACuB,cAAe;IAC9BC,iBAAiB;IACjBC,SAAS,EAAEzB,OAAO,CAACyB,SAAU;IAC7BC,MAAM,EAAE1B,OAAO,CAACmB,WAAY;IAC5BQ,OAAO,EAAEpB;EAAa,GAEtBlB,KAAA,CAAA0B,aAAA,CAACpB,MAAM,CAACiC,IAAI;IAACC,SAAS,EAAC;EAAO,GAC5BxC,KAAA,CAAA0B,aAAA;IAAKe,SAAS,EAAC;EAA4B,GACzCzC,KAAA,CAAA0B,aAAA;IAAGe,SAAS,EAAC;EAAiC,GAC3C9B,OAAO,CAAC+B,kBACR,CAAC,EAAAC,mBAAA,KAAAA,mBAAA,GACJ3C,KAAA,CAAA0B,aAAA,CAAClB,iBAAiB,MAAE,CAAC,CAClB,CACM,CACP,CACR,CAAC;AAEP;AAEA,eAAeE,kBAAkB"}
+{"version":3,"file":"StepIndicatorModal.js","names":["React","useContext","useEffect","useRef","useState","ReactDOM","Drawer","StepIndicatorTriggerButton","StepIndicatorList","StepIndicatorContext","StepIndicatorModal","context","container","setContainer","triggerRef","document","getElementById","sidebar_id","closeHandler","hasSidebar","_triggerRef$current","current","focus","renderPortal","createPortal","_StepIndicatorList","createElement","sidebarIsVisible","Fragment","on_click","openHandler","inner_ref","id","title","overview_title","omitTriggerButton","openState","onOpen","onClose","Body","styleType","className","stepsLabelExtended","_StepIndicatorList2"],"sources":["../../../../src/components/step-indicator/StepIndicatorModal.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\nimport ReactDOM from 'react-dom'\nimport Drawer from '../drawer/Drawer'\nimport StepIndicatorTriggerButton from './StepIndicatorTriggerButton'\nimport StepIndicatorList from './StepIndicatorList'\nimport StepIndicatorContext from './StepIndicatorContext'\n\nfunction StepIndicatorModal() {\n  const context = useContext(StepIndicatorContext)\n\n  const [container, setContainer] = useState(null)\n\n  const triggerRef = useRef(null)\n\n  useEffect(() => {\n    const container = document.getElementById(\n      'sidebar__' + context.sidebar_id\n    )\n\n    setContainer(container)\n  }, [])\n\n  function closeHandler() {\n    if (context.hasSidebar) {\n      triggerRef.current?.focus()\n    }\n    context.closeHandler()\n  }\n\n  function renderPortal() {\n    if (!container) {\n      return null\n    }\n\n    return ReactDOM.createPortal(<StepIndicatorList />, container)\n  }\n\n  if (context.sidebarIsVisible) {\n    return renderPortal()\n  }\n\n  return (\n    <>\n      <StepIndicatorTriggerButton\n        on_click={context.openHandler}\n        inner_ref={triggerRef}\n      />\n      <Drawer\n        id={context.sidebar_id}\n        title={context.overview_title}\n        omitTriggerButton\n        openState={context.openState}\n        onOpen={context.openHandler}\n        onClose={closeHandler}\n      >\n        <Drawer.Body styleType=\"white\">\n          <div className=\"dnb-step-indicator-wrapper\">\n            <p className=\"dnb-p dnb-step-indicator__label\">\n              {context.stepsLabelExtended}\n            </p>\n            <StepIndicatorList />\n          </div>\n        </Drawer.Body>\n      </Drawer>\n    </>\n  )\n}\n\nexport default StepIndicatorModal\n"],"mappings":";;;AAKA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACtE,OAAOC,QAAQ,MAAM,WAAW;AAChC,OAAOC,MAAM,MAAM,kBAAkB;AACrC,OAAOC,0BAA0B,MAAM,8BAA8B;AACrE,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,OAAOC,oBAAoB,MAAM,wBAAwB;AAEzD,SAASC,kBAAkBA,CAAA,EAAG;EAC5B,MAAMC,OAAO,GAAGV,UAAU,CAACQ,oBAAoB,CAAC;EAEhD,MAAM,CAACG,SAAS,EAAEC,YAAY,CAAC,GAAGT,QAAQ,CAAC,IAAI,CAAC;EAEhD,MAAMU,UAAU,GAAGX,MAAM,CAAC,IAAI,CAAC;EAE/BD,SAAS,CAAC,MAAM;IACd,MAAMU,SAAS,GAAGG,QAAQ,CAACC,cAAc,CACvC,WAAW,GAAGL,OAAO,CAACM,UACxB,CAAC;IAEDJ,YAAY,CAACD,SAAS,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;EAEN,SAASM,YAAYA,CAAA,EAAG;IACtB,IAAIP,OAAO,CAACQ,UAAU,EAAE;MAAA,IAAAC,mBAAA;MACtB,CAAAA,mBAAA,GAAAN,UAAU,CAACO,OAAO,cAAAD,mBAAA,uBAAlBA,mBAAA,CAAoBE,KAAK,CAAC,CAAC;IAC7B;IACAX,OAAO,CAACO,YAAY,CAAC,CAAC;EACxB;EAEA,SAASK,YAAYA,CAAA,EAAG;IACtB,IAAI,CAACX,SAAS,EAAE;MACd,OAAO,IAAI;IACb;IAEA,OAAOP,QAAQ,CAACmB,YAAY,CAAAC,kBAAA,KAAAA,kBAAA,GAACzB,KAAA,CAAA0B,aAAA,CAAClB,iBAAiB,MAAE,CAAC,GAAEI,SAAS,CAAC;EAChE;EAEA,IAAID,OAAO,CAACgB,gBAAgB,EAAE;IAC5B,OAAOJ,YAAY,CAAC,CAAC;EACvB;EAEA,OACEvB,KAAA,CAAA0B,aAAA,CAAA1B,KAAA,CAAA4B,QAAA,QACE5B,KAAA,CAAA0B,aAAA,CAACnB,0BAA0B;IACzBsB,QAAQ,EAAElB,OAAO,CAACmB,WAAY;IAC9BC,SAAS,EAAEjB;EAAW,CACvB,CAAC,EACFd,KAAA,CAAA0B,aAAA,CAACpB,MAAM;IACL0B,EAAE,EAAErB,OAAO,CAACM,UAAW;IACvBgB,KAAK,EAAEtB,OAAO,CAACuB,cAAe;IAC9BC,iBAAiB;IACjBC,SAAS,EAAEzB,OAAO,CAACyB,SAAU;IAC7BC,MAAM,EAAE1B,OAAO,CAACmB,WAAY;IAC5BQ,OAAO,EAAEpB;EAAa,GAEtBlB,KAAA,CAAA0B,aAAA,CAACpB,MAAM,CAACiC,IAAI;IAACC,SAAS,EAAC;EAAO,GAC5BxC,KAAA,CAAA0B,aAAA;IAAKe,SAAS,EAAC;EAA4B,GACzCzC,KAAA,CAAA0B,aAAA;IAAGe,SAAS,EAAC;EAAiC,GAC3C9B,OAAO,CAAC+B,kBACR,CAAC,EAAAC,mBAAA,KAAAA,mBAAA,GACJ3C,KAAA,CAAA0B,aAAA,CAAClB,iBAAiB,MAAE,CAAC,CAClB,CACM,CACP,CACR,CAAC;AAEP;AAEA,eAAeE,kBAAkB"}

package/components/step-indicator/StepIndicatorSidebar.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

package/components/step-indicator/StepIndicatorSidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorSidebar.js","names":["React","useContext","useEffect","useRef","useState","classnames","extendPropsWithContext","Context","StepIndicatorList","stepIndicatorDefaultProps","StepIndicatorProvider","createSpacingClasses","StepIndicatorSidebar","_ref","current_step","data","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","showInitialData","setShowInitialData","hasSkeletonData","getContextAndProps","_providerProps$data","providerProps","skeleton","getTranslation","StepIndicator","length","text","slice","current","createElement","id","sidebar_id","className","_extends","isSidebar","_StepIndicatorList","_supportsSpacingProps"],"sources":["../../../../src/components/step-indicator/StepIndicatorSidebar.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\n\nimport classnames from 'classnames'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport Context from '../../shared/Context'\nimport StepIndicatorList from './StepIndicatorList'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport { StepIndicatorProvider } from './StepIndicatorContext'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport { SpacingProps } from '../../shared/types'\nimport {\n  StepIndicatorData,\n  StepIndicatorMode,\n  StepIndicatorProps,\n} from '../StepIndicator'\n\nexport type StepIndicatorSidebarProps = SpacingProps &\n  Pick<StepIndicatorProps, 'current_step' | 'skeleton'> &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref' | 'data'> & {\n    /**\n     * Defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n     */\n    data?: StepIndicatorData\n    /**\n     * Defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n     */\n    mode?: StepIndicatorMode\n    /**\n     * Stuff\n     */\n    showInitialData?: boolean\n    /**\n     * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n     */\n    sidebar_id: string\n  }\n\nfunction StepIndicatorSidebar({\n  current_step = stepIndicatorDefaultProps.current_step,\n  data = stepIndicatorDefaultProps.data,\n  ...restOfProps\n}: StepIndicatorSidebarProps) {\n  const props = { current_step, data, ...restOfProps }\n\n  const context = useContext(Context)\n\n  const [showInitialData, setShowInitialData] = useState<boolean>(true)\n\n  const hasSkeletonData = useRef<boolean>(null)\n\n  useEffect(() => {\n    if (!props.showInitialData) {\n      setShowInitialData(false)\n    }\n  }, [])\n\n  function getContextAndProps() {\n    const providerProps = extendPropsWithContext(\n      props,\n      stepIndicatorDefaultProps,\n      { skeleton: context?.skeleton },\n      context.getTranslation(context).StepIndicator,\n      context?.StepIndicator\n    )\n\n    if (!(providerProps.data?.length > 0)) {\n      const text = 'Skeleton text'\n      providerProps.data = [text.slice(10), text, text, text.slice(4)]\n      providerProps.skeleton = true\n      hasSkeletonData.current = true\n    }\n\n    return providerProps\n  }\n\n  const providerProps = showInitialData ? getContextAndProps() : null\n\n  return (\n    <div\n      id={'sidebar__' + props.sidebar_id}\n      className={classnames(\n        'dnb-step-indicator-wrapper',\n        'dnb-step-indicator__sidebar',\n        hasSkeletonData.current &&\n          providerProps?.skeleton &&\n          'dnb-step-indicator__sidebar--ssr-skeleton',\n        createSpacingClasses(props)\n      )}\n    >\n      {providerProps && (\n        <StepIndicatorProvider\n          isSidebar\n          sidebar_id={props.sidebar_id}\n          {...providerProps}\n        >\n          <StepIndicatorList />\n        </StepIndicatorProvider>\n      )}\n    </div>\n  )\n}\n\nStepIndicatorSidebar._supportsSpacingProps = true\n\nexport default StepIndicatorSidebar\n"],"mappings":";;;;;;;AAKA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAEtE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,sBAAsB,QAAQ,+BAA+B;AACtE,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,SAASC,yBAAyB,QAAQ,sBAAsB;AAChE,SAASC,qBAAqB,QAAQ,wBAAwB;AAC9D,SAASC,oBAAoB,QAAQ,wBAAwB;AA6B7D,SAASC,oBAAoBA,CAAAC,IAAA,EAIC;EAAA,IAJA;MAC5BC,YAAY,GAAGL,yBAAyB,CAACK,YAAY;MACrDC,IAAI,GAAGN,yBAAyB,CAACM;IAER,CAAC,GAAAF,IAAA;IADvBG,WAAW,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEd,MAAMC,KAAK,GAAAC,aAAA;IAAKN,YAAY;IAAEC;EAAI,GAAKC,WAAW,CAAE;EAEpD,MAAMK,OAAO,GAAGpB,UAAU,CAACM,OAAO,CAAC;EAEnC,MAAM,CAACe,eAAe,EAAEC,kBAAkB,CAAC,GAAGnB,QAAQ,CAAU,IAAI,CAAC;EAErE,MAAMoB,eAAe,GAAGrB,MAAM,CAAU,IAAI,CAAC;EAE7CD,SAAS,CAAC,MAAM;IACd,IAAI,CAACiB,KAAK,CAACG,eAAe,EAAE;MAC1BC,kBAAkB,CAAC,KAAK,CAAC;IAC3B;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,SAASE,kBAAkBA,CAAA,EAAG;IAAA,IAAAC,mBAAA;IAC5B,MAAMC,aAAa,GAAGrB,sBAAsB,CAC1Ca,KAAK,EACLV,yBAAyB,EACzB;MAAEmB,QAAQ,EAAEP,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEO;IAAS,CAAC,EAC/BP,OAAO,CAACQ,cAAc,CAACR,OAAO,CAAC,CAACS,aAAa,EAC7CT,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAES,aACX,CAAC;IAED,IAAI,EAAE,EAAAJ,mBAAA,GAAAC,aAAa,CAACZ,IAAI,cAAAW,mBAAA,uBAAlBA,mBAAA,CAAoBK,MAAM,IAAG,CAAC,CAAC,EAAE;MACrC,MAAMC,IAAI,GAAG,eAAe;MAC5BL,aAAa,CAACZ,IAAI,GAAG,CAACiB,IAAI,CAACC,KAAK,CAAC,EAAE,CAAC,EAAED,IAAI,EAAEA,IAAI,EAAEA,IAAI,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC;MAChEN,aAAa,CAACC,QAAQ,GAAG,IAAI;MAC7BJ,eAAe,CAACU,OAAO,GAAG,IAAI;IAChC;IAEA,OAAOP,aAAa;EACtB;EAEA,MAAMA,aAAa,GAAGL,eAAe,GAAGG,kBAAkB,CAAC,CAAC,GAAG,IAAI;EAEnE,OACEzB,KAAA,CAAAmC,aAAA;IACEC,EAAE,EAAE,WAAW,GAAGjB,KAAK,CAACkB,UAAW;IACnCC,SAAS,EAAEjC,UAAU,2DAMnBM,oBAAoB,CAACQ,KAAK,CAAC,EAH3BK,eAAe,CAACU,OAAO,KACrBP,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEC,QAAQ,KACvB,2CAEJ;EAAE,GAEDD,aAAa,IACZ3B,KAAA,CAAAmC,aAAA,CAACzB,qBAAqB,EAAA6B,QAAA;IACpBC,SAAS;IACTH,UAAU,EAAElB,KAAK,CAACkB;EAAW,GACzBV,aAAa,GAAAc,kBAAA,KAAAA,kBAAA,GAEjBzC,KAAA,CAAAmC,aAAA,CAAC3B,iBAAiB,MAAE,CAAC,CACA,CAEtB,CAAC;AAEV;AAEAI,oBAAoB,CAAC8B,qBAAqB,GAAG,IAAI;AAEjD,eAAe9B,oBAAoB"}
+{"version":3,"file":"StepIndicatorSidebar.js","names":["React","useContext","useEffect","useRef","useState","classnames","extendPropsWithContext","Context","StepIndicatorList","stepIndicatorDefaultProps","StepIndicatorProvider","createSpacingClasses","StepIndicatorSidebar","_ref","current_step","data","restOfProps","_objectWithoutProperties","_excluded","props","_objectSpread","context","showInitialData","setShowInitialData","hasSkeletonData","getContextAndProps","_providerProps$data","providerProps","skeleton","getTranslation","StepIndicator","length","text","slice","current","createElement","id","sidebar_id","className","_extends","isSidebar","_StepIndicatorList","_supportsSpacingProps"],"sources":["../../../../src/components/step-indicator/StepIndicatorSidebar.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport React, { useContext, useEffect, useRef, useState } from 'react'\n\nimport classnames from 'classnames'\nimport { extendPropsWithContext } from '../../shared/component-helper'\nimport Context from '../../shared/Context'\nimport StepIndicatorList from './StepIndicatorList'\nimport { stepIndicatorDefaultProps } from './StepIndicatorProps'\nimport { StepIndicatorProvider } from './StepIndicatorContext'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport { SpacingProps } from '../../shared/types'\nimport {\n  StepIndicatorData,\n  StepIndicatorMode,\n  StepIndicatorProps,\n} from '../StepIndicator'\n\nexport type StepIndicatorSidebarProps = SpacingProps &\n  Pick<StepIndicatorProps, 'current_step' | 'skeleton'> &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref' | 'data'> & {\n    /**\n     * Defines the data/steps showing up in a JavaScript Array or JSON format like `[{title,is_current}]`. See parameters and the example above.\n     */\n    data?: StepIndicatorData\n    /**\n     * Defines how the StepIndicator should work. Use `static` for non-interactive steps. Use `strict` for a chronological step order, also, the user can navigate between visited steps. Use `loose` if the user should be able to navigate freely.\n     */\n    mode?: StepIndicatorMode\n    /**\n     * Stuff\n     */\n    showInitialData?: boolean\n    /**\n     * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n     */\n    sidebar_id: string\n  }\n\nfunction StepIndicatorSidebar({\n  current_step = stepIndicatorDefaultProps.current_step,\n  data = stepIndicatorDefaultProps.data,\n  ...restOfProps\n}: StepIndicatorSidebarProps) {\n  const props = { current_step, data, ...restOfProps }\n\n  const context = useContext(Context)\n\n  const [showInitialData, setShowInitialData] = useState<boolean>(true)\n\n  const hasSkeletonData = useRef<boolean>(null)\n\n  useEffect(() => {\n    if (!props.showInitialData) {\n      setShowInitialData(false)\n    }\n  }, [])\n\n  function getContextAndProps() {\n    const providerProps = extendPropsWithContext(\n      props,\n      stepIndicatorDefaultProps,\n      { skeleton: context?.skeleton },\n      context.getTranslation(context).StepIndicator,\n      context?.StepIndicator\n    )\n\n    if (!(providerProps.data?.length > 0)) {\n      const text = 'Skeleton text'\n      providerProps.data = [text.slice(10), text, text, text.slice(4)]\n      providerProps.skeleton = true\n      hasSkeletonData.current = true\n    }\n\n    return providerProps\n  }\n\n  const providerProps = showInitialData ? getContextAndProps() : null\n\n  return (\n    <div\n      id={'sidebar__' + props.sidebar_id}\n      className={classnames(\n        'dnb-step-indicator-wrapper',\n        'dnb-step-indicator__sidebar',\n        hasSkeletonData.current &&\n          providerProps?.skeleton &&\n          'dnb-step-indicator__sidebar--ssr-skeleton',\n        createSpacingClasses(props)\n      )}\n    >\n      {providerProps && (\n        <StepIndicatorProvider\n          isSidebar\n          sidebar_id={props.sidebar_id}\n          {...providerProps}\n        >\n          <StepIndicatorList />\n        </StepIndicatorProvider>\n      )}\n    </div>\n  )\n}\n\nStepIndicatorSidebar._supportsSpacingProps = true\n\nexport default StepIndicatorSidebar\n"],"mappings":";;;;;;;;;AAKA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAEtE,OAAOC,UAAU,MAAM,YAAY;AACnC,SAASC,sBAAsB,QAAQ,+BAA+B;AACtE,OAAOC,OAAO,MAAM,sBAAsB;AAC1C,OAAOC,iBAAiB,MAAM,qBAAqB;AACnD,SAASC,yBAAyB,QAAQ,sBAAsB;AAChE,SAASC,qBAAqB,QAAQ,wBAAwB;AAC9D,SAASC,oBAAoB,QAAQ,wBAAwB;AA6B7D,SAASC,oBAAoBA,CAAAC,IAAA,EAIC;EAAA,IAJA;MAC5BC,YAAY,GAAGL,yBAAyB,CAACK,YAAY;MACrDC,IAAI,GAAGN,yBAAyB,CAACM;IAER,CAAC,GAAAF,IAAA;IADvBG,WAAW,GAAAC,wBAAA,CAAAJ,IAAA,EAAAK,SAAA;EAEd,MAAMC,KAAK,GAAAC,aAAA;IAAKN,YAAY;IAAEC;EAAI,GAAKC,WAAW,CAAE;EAEpD,MAAMK,OAAO,GAAGpB,UAAU,CAACM,OAAO,CAAC;EAEnC,MAAM,CAACe,eAAe,EAAEC,kBAAkB,CAAC,GAAGnB,QAAQ,CAAU,IAAI,CAAC;EAErE,MAAMoB,eAAe,GAAGrB,MAAM,CAAU,IAAI,CAAC;EAE7CD,SAAS,CAAC,MAAM;IACd,IAAI,CAACiB,KAAK,CAACG,eAAe,EAAE;MAC1BC,kBAAkB,CAAC,KAAK,CAAC;IAC3B;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,SAASE,kBAAkBA,CAAA,EAAG;IAAA,IAAAC,mBAAA;IAC5B,MAAMC,aAAa,GAAGrB,sBAAsB,CAC1Ca,KAAK,EACLV,yBAAyB,EACzB;MAAEmB,QAAQ,EAAEP,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEO;IAAS,CAAC,EAC/BP,OAAO,CAACQ,cAAc,CAACR,OAAO,CAAC,CAACS,aAAa,EAC7CT,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAES,aACX,CAAC;IAED,IAAI,EAAE,EAAAJ,mBAAA,GAAAC,aAAa,CAACZ,IAAI,cAAAW,mBAAA,uBAAlBA,mBAAA,CAAoBK,MAAM,IAAG,CAAC,CAAC,EAAE;MACrC,MAAMC,IAAI,GAAG,eAAe;MAC5BL,aAAa,CAACZ,IAAI,GAAG,CAACiB,IAAI,CAACC,KAAK,CAAC,EAAE,CAAC,EAAED,IAAI,EAAEA,IAAI,EAAEA,IAAI,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC;MAChEN,aAAa,CAACC,QAAQ,GAAG,IAAI;MAC7BJ,eAAe,CAACU,OAAO,GAAG,IAAI;IAChC;IAEA,OAAOP,aAAa;EACtB;EAEA,MAAMA,aAAa,GAAGL,eAAe,GAAGG,kBAAkB,CAAC,CAAC,GAAG,IAAI;EAEnE,OACEzB,KAAA,CAAAmC,aAAA;IACEC,EAAE,EAAE,WAAW,GAAGjB,KAAK,CAACkB,UAAW;IACnCC,SAAS,EAAEjC,UAAU,2DAMnBM,oBAAoB,CAACQ,KAAK,CAAC,EAH3BK,eAAe,CAACU,OAAO,KACrBP,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEC,QAAQ,KACvB,2CAEJ;EAAE,GAEDD,aAAa,IACZ3B,KAAA,CAAAmC,aAAA,CAACzB,qBAAqB,EAAA6B,QAAA;IACpBC,SAAS;IACTH,UAAU,EAAElB,KAAK,CAACkB;EAAW,GACzBV,aAAa,GAAAc,kBAAA,KAAAA,kBAAA,GAEjBzC,KAAA,CAAAmC,aAAA,CAAC3B,iBAAiB,MAAE,CAAC,CACA,CAEtB,CAAC;AAEV;AAEAI,oBAAoB,CAAC8B,qBAAqB,GAAG,IAAI;AAEjD,eAAe9B,oBAAoB"}

package/components/step-indicator/StepIndicatorTriggerButton.js

@@ -1,3 +1,5 @@
+"use client";
+
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";

package/components/step-indicator/StepIndicatorTriggerButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"StepIndicatorTriggerButton.js","names":["classnames","React","useContext","useEffect","useLayoutEffect","useRef","Button","chevron_icon","validateDOMAttributes","combineDescribedBy","HeightAnimationInstance","createSpacingClasses","FormLabel","StepIndicatorContext","StepItemWrapper","skeletonDOMAttributes","createSkeletonClass","StepIndicatorTriggerButton","props","context","buttonRef","inner_ref","heightAnim","animate","no_animation","current","setElement","remove","height","getHeight","toHeight","getUnknownHeight","adjustTo","activeStep","item","data","label","stepsLabel","contextWithoutData","_objectWithoutProperties","_excluded","triggerParams","_objectSpread","className","skeleton","buttonParams","sidebar_id","Object","keys","forEach","key","filterAttributes","includes","createElement","id","overview_title","for_id","_extends","wrap","stretch","variant","icon","icon_size","icon_position","number","hide_numbers","title"],"sources":["../../../../src/components/step-indicator/StepIndicatorTriggerButton.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport classnames from 'classnames'\nimport React, {\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\nimport Button, { ButtonProps } from '../button/Button'\nimport chevron_icon from '../../icons/chevron_right_medium'\nimport {\n  validateDOMAttributes,\n  combineDescribedBy,\n} from '../../shared/component-helper'\nimport HeightAnimationInstance from '../height-animation/HeightAnimationInstance'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport FormLabel from '../form-label/FormLabel'\nimport StepIndicatorContext from './StepIndicatorContext'\nimport { StepItemWrapper } from './StepIndicatorItem'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\n\nexport type StepIndicatorTriggerButtonProps = ButtonProps & {\n  /**\n   * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n   */\n  sidebar_id?: string\n  className?: string\n  inner_ref?: React.RefObject<HTMLElement>\n}\nfunction StepIndicatorTriggerButton(\n  props: StepIndicatorTriggerButtonProps\n) {\n  const context = useContext(StepIndicatorContext)\n\n  const buttonRef = useRef(props?.inner_ref || null)\n\n  const heightAnim = useRef(\n    new HeightAnimationInstance({\n      animate: !context?.no_animation,\n    })\n  ).current\n\n  useEffect(() => {\n    heightAnim.setElement(buttonRef.current)\n\n    return () => {\n      heightAnim.remove()\n    }\n  }, [])\n\n  // Adjust height\n  useLayoutEffect(() => {\n    const height = heightAnim.getHeight()\n    const toHeight = heightAnim.getUnknownHeight()\n\n    heightAnim.adjustTo(height, toHeight)\n  }, [context.activeStep, heightAnim])\n\n  const item = context.data[context.activeStep || 0]\n  const label = context.stepsLabel\n\n  const { data, ...contextWithoutData } = context\n\n  const triggerParams = {\n    ...contextWithoutData,\n    className: classnames(\n      'dnb-step-indicator__trigger',\n      createSkeletonClass('font', context.skeleton),\n      createSpacingClasses(context)\n    ),\n    'aria-live': 'polite',\n  } as React.HTMLProps<HTMLElement>\n\n  const buttonParams = {\n    ...props,\n    className: classnames(\n      'dnb-step-indicator__trigger__button',\n      props.className\n    ),\n  }\n\n  buttonParams['aria-describedby'] = combineDescribedBy(\n    buttonParams,\n    context.sidebar_id + '-overview'\n  )\n\n  Object.keys(triggerParams).forEach((key) => {\n    if (context.filterAttributes.includes(key)) {\n      delete triggerParams[key]\n    }\n  })\n\n  skeletonDOMAttributes(triggerParams, context.skeleton)\n\n  // also used for code markup simulation\n  validateDOMAttributes(context, triggerParams)\n\n  return (\n    <div {...(triggerParams as React.HTMLProps<HTMLDivElement>)}>\n      <span className=\"dnb-sr-only\" id={context.sidebar_id + '-overview'}>\n        {context.overview_title}\n      </span>\n      <FormLabel\n        aria-describedby={context.sidebar_id}\n        for_id={context.sidebar_id}\n        className=\"dnb-step-indicator__label\"\n      >\n        {label}\n      </FormLabel>\n      <Button\n        {...buttonParams}\n        id={context.sidebar_id}\n        wrap\n        stretch\n        variant=\"secondary\"\n        icon={chevron_icon}\n        icon_size=\"medium\"\n        icon_position=\"right\"\n        inner_ref={buttonRef}\n      >\n        <StepItemWrapper\n          number={(context.activeStep || 0) + 1}\n          hide_numbers={context.hide_numbers}\n        >\n          {(typeof item === 'string' ? item : item && item.title) || ''}\n        </StepItemWrapper>\n      </Button>\n    </div>\n  )\n}\n\nexport default StepIndicatorTriggerButton\n"],"mappings":"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"}
+{"version":3,"file":"StepIndicatorTriggerButton.js","names":["classnames","React","useContext","useEffect","useLayoutEffect","useRef","Button","chevron_icon","validateDOMAttributes","combineDescribedBy","HeightAnimationInstance","createSpacingClasses","FormLabel","StepIndicatorContext","StepItemWrapper","skeletonDOMAttributes","createSkeletonClass","StepIndicatorTriggerButton","props","context","buttonRef","inner_ref","heightAnim","animate","no_animation","current","setElement","remove","height","getHeight","toHeight","getUnknownHeight","adjustTo","activeStep","item","data","label","stepsLabel","contextWithoutData","_objectWithoutProperties","_excluded","triggerParams","_objectSpread","className","skeleton","buttonParams","sidebar_id","Object","keys","forEach","key","filterAttributes","includes","createElement","id","overview_title","for_id","_extends","wrap","stretch","variant","icon","icon_size","icon_position","number","hide_numbers","title"],"sources":["../../../../src/components/step-indicator/StepIndicatorTriggerButton.tsx"],"sourcesContent":["/**\n * Web StepIndicator Component\n *\n */\n\nimport classnames from 'classnames'\nimport React, {\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useRef,\n} from 'react'\nimport Button, { ButtonProps } from '../button/Button'\nimport chevron_icon from '../../icons/chevron_right_medium'\nimport {\n  validateDOMAttributes,\n  combineDescribedBy,\n} from '../../shared/component-helper'\nimport HeightAnimationInstance from '../height-animation/HeightAnimationInstance'\nimport { createSpacingClasses } from '../space/SpacingHelper'\nimport FormLabel from '../form-label/FormLabel'\nimport StepIndicatorContext from './StepIndicatorContext'\nimport { StepItemWrapper } from './StepIndicatorItem'\nimport {\n  skeletonDOMAttributes,\n  createSkeletonClass,\n} from '../skeleton/SkeletonHelper'\n\nexport type StepIndicatorTriggerButtonProps = ButtonProps & {\n  /**\n   * <em>(required)</em> a unique string-based ID in order to bind together the main component and the sidebar (`<StepIndicator.Sidebar />`). Both have to get the same ID.\n   */\n  sidebar_id?: string\n  className?: string\n  inner_ref?: React.RefObject<HTMLElement>\n}\nfunction StepIndicatorTriggerButton(\n  props: StepIndicatorTriggerButtonProps\n) {\n  const context = useContext(StepIndicatorContext)\n\n  const buttonRef = useRef(props?.inner_ref || null)\n\n  const heightAnim = useRef(\n    new HeightAnimationInstance({\n      animate: !context?.no_animation,\n    })\n  ).current\n\n  useEffect(() => {\n    heightAnim.setElement(buttonRef.current)\n\n    return () => {\n      heightAnim.remove()\n    }\n  }, [])\n\n  // Adjust height\n  useLayoutEffect(() => {\n    const height = heightAnim.getHeight()\n    const toHeight = heightAnim.getUnknownHeight()\n\n    heightAnim.adjustTo(height, toHeight)\n  }, [context.activeStep, heightAnim])\n\n  const item = context.data[context.activeStep || 0]\n  const label = context.stepsLabel\n\n  const { data, ...contextWithoutData } = context\n\n  const triggerParams = {\n    ...contextWithoutData,\n    className: classnames(\n      'dnb-step-indicator__trigger',\n      createSkeletonClass('font', context.skeleton),\n      createSpacingClasses(context)\n    ),\n    'aria-live': 'polite',\n  } as React.HTMLProps<HTMLElement>\n\n  const buttonParams = {\n    ...props,\n    className: classnames(\n      'dnb-step-indicator__trigger__button',\n      props.className\n    ),\n  }\n\n  buttonParams['aria-describedby'] = combineDescribedBy(\n    buttonParams,\n    context.sidebar_id + '-overview'\n  )\n\n  Object.keys(triggerParams).forEach((key) => {\n    if (context.filterAttributes.includes(key)) {\n      delete triggerParams[key]\n    }\n  })\n\n  skeletonDOMAttributes(triggerParams, context.skeleton)\n\n  // also used for code markup simulation\n  validateDOMAttributes(context, triggerParams)\n\n  return (\n    <div {...(triggerParams as React.HTMLProps<HTMLDivElement>)}>\n      <span className=\"dnb-sr-only\" id={context.sidebar_id + '-overview'}>\n        {context.overview_title}\n      </span>\n      <FormLabel\n        aria-describedby={context.sidebar_id}\n        for_id={context.sidebar_id}\n        className=\"dnb-step-indicator__label\"\n      >\n        {label}\n      </FormLabel>\n      <Button\n        {...buttonParams}\n        id={context.sidebar_id}\n        wrap\n        stretch\n        variant=\"secondary\"\n        icon={chevron_icon}\n        icon_size=\"medium\"\n        icon_position=\"right\"\n        inner_ref={buttonRef}\n      >\n        <StepItemWrapper\n          number={(context.activeStep || 0) + 1}\n          hide_numbers={context.hide_numbers}\n        >\n          {(typeof item === 'string' ? item : item && item.title) || ''}\n        </StepItemWrapper>\n      </Button>\n    </div>\n  )\n}\n\nexport default StepIndicatorTriggerButton\n"],"mappings":"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"}

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

@@ -21,6 +21,7 @@
 }
 .dnb-table__th, .dnb-table thead th {
   padding: 0.5rem 1.5rem 0.25rem;
+  font-weight: var(--font-weight-medium);
   background-color: var(--sb-color-white);
 }
 .dnb-table .dnb-table__tr--even {

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

@@ -1 +1 @@
-.dnb-table{text-align:left}.dnb-table thead{border-bottom:var(--border)}.dnb-table thead th,.dnb-table__th{background-color:var(--sb-color-white);padding:.5rem 1.5rem .25rem}.dnb-table .dnb-table__tr--even{background-color:var(--sb-color-gray-light-3)}.dnb-table tbody .dnb-table__th,.dnb-table tbody td,.dnb-table tbody th,.dnb-table__td{padding:1rem 1.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{color:var(--sb-color-violet)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{bottom:-.0625rem;color:var(--sb-color-violet);left:0;opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:var(--sb-color-violet)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:var(--sb-color-violet)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:var(--sb-color-violet)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;content:"";height:inherit;left:-.5rem;outline:none;position:absolute;right:-.5rem;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.25rem;left:-.6875rem;right:-.4375rem;top:-.375rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.25rem;left:-.6875rem;right:-.4375rem;top:-.375rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible{color:var(--sb-color-blue-dark)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible{color:var(--sb-color-blue-dark)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after{visibility:hidden}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:var(--sb-color-violet)}.dnb-table,.dnb-table__container{--border-width:0.0625rem;--outline-width:0.0625rem;--border:var(--border-width) solid var(--sb-color-gray-light-2);--outline:var(--outline-width) solid var(--sb-color-gray-light-2);background-color:var(--sb-color-white)}
+.dnb-table{text-align:left}.dnb-table thead{border-bottom:var(--border)}.dnb-table thead th,.dnb-table__th{background-color:var(--sb-color-white);font-weight:var(--font-weight-medium);padding:.5rem 1.5rem .25rem}.dnb-table .dnb-table__tr--even{background-color:var(--sb-color-gray-light-3)}.dnb-table tbody .dnb-table__th,.dnb-table tbody td,.dnb-table tbody th,.dnb-table__td{padding:1rem 1.5rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button{color:var(--sb-color-violet)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button .dnb-button__text:after{bottom:-.0625rem;color:var(--sb-color-violet);left:0;opacity:0}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:not(:focus) .dnb-button__text:after{color:var(--sb-color-violet)}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:hover:not([disabled]){color:var(--sb-color-violet)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]),html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]){color:var(--sb-color-violet)}html[data-whatinput=mouse] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=mouse] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{border-radius:inherit;bottom:0;content:"";height:inherit;left:-.5rem;outline:none;position:absolute;right:-.5rem;top:0;z-index:1}html[data-whatinput=touch] .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html[data-whatinput=touch] html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{--border-color:var(--focus-ring-color);--border-width:var(--focus-ring-width);border-color:transparent;box-shadow:inset 0 0 0 var(--border-width) var(--border-color)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:active:not([disabled]):before{bottom:-.25rem;left:-.6875rem;right:-.4375rem;top:-.375rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus[disabled]{cursor:not-allowed}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):before{bottom:-.25rem;left:-.6875rem;right:-.4375rem;top:-.375rem}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]).focus-visible{color:var(--sb-color-blue-dark)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):focus-visible{color:var(--sb-color-blue-dark)}.dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,.dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--sortable .dnb-table__sort-button.dnb-button:focus:not([disabled]):not(:active) .dnb-button__text:after{visibility:hidden}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled],html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover[disabled]{cursor:not-allowed}html:not([data-whatintent=touch]) .dnb-table .dnb-table__th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after,html:not([data-whatintent=touch]) .dnb-table>thead>tr>th.dnb-table--active .dnb-table__sort-button.dnb-button:hover:not([disabled]) .dnb-button__text:after{color:var(--sb-color-violet)}.dnb-table,.dnb-table__container{--border-width:0.0625rem;--outline-width:0.0625rem;--border:var(--border-width) solid var(--sb-color-gray-light-2);--outline:var(--outline-width) solid var(--sb-color-gray-light-2);background-color:var(--sb-color-white)}

package/components/table/style/themes/dnb-table-theme-sbanken.scss

@@ -26,6 +26,7 @@
   &__th,
   & thead th {
     padding: 0.5rem 1.5rem 0.25rem;
+    font-weight: var(--font-weight-medium);
     background-color: var(--sb-color-white);
   }
 

package/components/toggle-button/style/themes/dnb-toggle-button-theme-ui.scss

@@ -215,7 +215,7 @@
 
   /* stylelint-enable */
 
-  // ajust the form-status to the inner border for 3px
+  // adjust the form-status to the inner border for 3px
   > .dnb-form-status {
     transform: translateY(0.1875rem);
   }