@dnb/eufemia 10.71.1 → 10.72.0

package/CHANGELOG.md

@@ -3,6 +3,20 @@
 All notable changes to @dnb/eufemia will be documented in this file. See
 [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [10.72.0](https://github.com/dnbexperience/eufemia/compare/v10.71.2...v10.72.0) (2025-04-15)
+
+
+### :sparkles: Features
+
+* **StepIndicator:** redesign ([#4462](https://github.com/dnbexperience/eufemia/issues/4462)) ([b541600](https://github.com/dnbexperience/eufemia/commit/b541600f5c77472dfae6679800edc8f52d33d8cf))
+
+## [10.71.2](https://github.com/dnbexperience/eufemia/compare/v10.71.1...v10.71.2) (2025-04-15)
+
+
+### :bug: Bug Fixes
+
+* **Tooltip:** improve alignment of tooltip with long texts ([#4970](https://github.com/dnbexperience/eufemia/issues/4970)) ([b728c6a](https://github.com/dnbexperience/eufemia/commit/b728c6aefe64d8f476bd80da167b43911676c2be))
+
 ## [10.71.1](https://github.com/dnbexperience/eufemia/compare/v10.71.0...v10.71.1) (2025-04-15)
 
 

package/cjs/components/anchor/Anchor.js

@@ -76,6 +76,7 @@ function AnchorInstance(localProps) {
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_Element.default, _extends({
     as: as,
     id: id,
+    internalClass: as !== 'button',
     className: (0, _classnames.default)(className, omitClass !== true && (0, _classnames.default)('dnb-anchor', prefix && 'dnb-anchor--icon-left', suffix && 'dnb-anchor--icon-right', typeof children !== 'string' && 'dnb-anchor--was-node', noAnimation && 'dnb-anchor--no-animation', noHover && 'dnb-anchor--no-hover', noStyle && 'dnb-anchor--no-style', noUnderline && 'dnb-anchor--no-underline'))
   }, attributes, {
     innerRef: innerRef

package/cjs/components/anchor/Anchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.js","names":["_react","_interopRequireDefault","require","_classnames","_Element","_Context","_componentHelper","_helpers","_IconPrimary2","_Tooltip","_icons","_IconPrimary","_excluded","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","_objectWithoutProperties","o","i","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","defaultProps","noAnimation","noStyle","noHover","noUnderline","AnchorInstance","localProps","context","React","useContext","Context","allProps","extendPropsWithContext","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","attributes","internalId","makeUniqueId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","createElement","launchIcon","prefix","Fragment","classnames","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","_default","exports","scrollToHashHandler","event","_element$pathname","warn","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","scrollToHash","hash","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","getOffsetTop","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n  makeUniqueId,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop, warn } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\n// Local type for react-router-dom link with only the necessary props. Done this way to prevent react-router-dom dependency.\ntype ReactRouterLink = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  'href'\n> & {\n  to: string | { pathname?: string; search?: string; has?: string }\n}\n\nexport type AnchorProps = {\n  element?:\n    | DynamicElement<HTMLAnchorElement | AnchorAllProps>\n    | React.ForwardRefExoticComponent<\n        ReactRouterLink & React.RefAttributes<HTMLAnchorElement>\n      >\n  href?: string\n  to?: string\n  targetBlankTitle?: string\n  target?: string\n  tooltip?: React.ReactNode\n  icon?: IconIcon\n  iconPosition?: 'left' | 'right'\n  skeleton?: SkeletonShow\n  omitClass?: boolean\n  innerRef?: React.RefObject<HTMLAnchorElement>\n\n  /** @deprecated use innerRef instead */\n  inner_ref?: React.RefObject<HTMLAnchorElement>\n  /**\n   * Removes default animation.\n   * Default: `false`\n   */\n  noAnimation?: boolean\n  /**\n   * Removes default styling.\n   * Default: `false`\n   */\n  noStyle?: boolean\n  /**\n   * Removes default hover style.\n   * Default: `false`\n   */\n  noHover?: boolean\n  /**\n   * Removes underline.\n   * Default: `false`\n   */\n  noUnderline?: boolean\n}\n\nexport type AnchorAllProps = AnchorProps &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n  SpacingProps\n\nconst defaultProps = {\n  noAnimation: false,\n  noStyle: false,\n  noHover: false,\n  noUnderline: false,\n}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n  const context = React.useContext(Context)\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    context?.getTranslation(localProps as AnchorAllProps).Anchor,\n    context?.Anchor\n  )\n\n  // deprecated: inner_ref is still needed to support Button's usage of Anchor\n  if (typeof allProps.inner_ref !== 'undefined') {\n    allProps.innerRef = allProps.inner_ref\n    delete allProps.inner_ref\n  }\n\n  if (!allProps.innerRef) {\n    allProps.innerRef = React.createRef()\n  }\n\n  const {\n    id,\n    element,\n    className,\n    children,\n    tooltip,\n    icon,\n    iconPosition = 'left',\n    omitClass,\n    innerRef,\n    targetBlankTitle,\n    noAnimation,\n    noHover,\n    noStyle,\n    noUnderline,\n    ...rest\n  } = allProps\n\n  const attributes = rest as ElementProps\n  const internalId = id || 'id' + makeUniqueId()\n  const as = element || 'a'\n\n  const href = allProps.href || allProps.to\n  const _opensNewTab = opensNewTab(allProps.target, href)\n  const showLaunchIcon =\n    _opensNewTab &&\n    !className?.includes('dnb-anchor--no-icon') &&\n    !className?.includes('dnb-anchor--no-launch-icon') &&\n    !omitClass\n  const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n  const iconNode = icon && getIcon(icon)\n\n  const suffix =\n    (iconPosition === 'right' && iconNode) ||\n    (showLaunchIcon && (\n      <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n    ))\n\n  const prefix = iconPosition === 'left' && iconNode\n\n  return (\n    <>\n      <E\n        as={as}\n        id={id}\n        className={classnames(\n          omitClass !== true &&\n            classnames(\n              'dnb-anchor',\n              prefix && 'dnb-anchor--icon-left',\n              suffix && 'dnb-anchor--icon-right',\n              typeof children !== 'string' && 'dnb-anchor--was-node',\n              noAnimation && 'dnb-anchor--no-animation',\n              noHover && 'dnb-anchor--no-hover',\n              noStyle && 'dnb-anchor--no-style',\n              noUnderline && 'dnb-anchor--no-underline'\n            ),\n          className\n        )}\n        {...attributes}\n        innerRef={innerRef}\n      >\n        {prefix}\n        {children}\n        {suffix}\n      </E>\n\n      {showTooltip && (\n        <Tooltip\n          showDelay={100}\n          id={internalId + '-tooltip'}\n          targetElement={innerRef}\n          tooltip={tooltip}\n        >\n          {allProps.title || targetBlankTitle}\n        </Tooltip>\n      )}\n    </>\n  )\n}\n\nconst Anchor = React.forwardRef(\n  (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n    return <AnchorInstance innerRef={ref} {...props} />\n  }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\n/**\n * @deprecated – can be removed in v11\n */\nexport function scrollToHashHandler(\n  event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n  warn('\"scrollToHashHandler\" is deprecated.')\n\n  const element = event.currentTarget as HTMLAnchorElement\n  const href = element.getAttribute('href')\n\n  if (typeof document === 'undefined' || !href.includes('#')) {\n    return // stop here\n  }\n\n  /**\n   * What happens here?\n   * When `scroll-behavior: smooth;` in CSS is set,\n   * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n   * The first click, sets the hash, the second one, scrolls to it.\n   * We want Chromium browsers to scroll to the element on the first click.\n   */\n  const isSamePath =\n    href.startsWith('#') ||\n    window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  if (isSamePath) {\n    return scrollToHash(href)\n  }\n}\n\nexport function scrollToHash(hash: string) {\n  if (typeof document === 'undefined' || !hash || !hash.includes('#')) {\n    return // stop here\n  }\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  const id = hash.split(/#/g).reverse()[0]\n  const anchorElem = document.getElementById(id)\n\n  if (anchorElem instanceof HTMLElement) {\n    try {\n      const scrollPadding = parseFloat(\n        window.getComputedStyle(document.documentElement).scrollPaddingTop\n      )\n      const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n      window.scroll({ top })\n\n      return { element: anchorElem }\n    } catch (error) {\n      console.error(error)\n    }\n  }\n}\n\nfunction getIcon(icon) {\n  return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n  return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n    ? React.cloneElement(icon, {\n        key: 'button-icon-clone',\n        className: classnames(icon.props?.className, className),\n      })\n    : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n  target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Anchor.js","names":["_react","_interopRequireDefault","require","_classnames","_Element","_Context","_componentHelper","_helpers","_IconPrimary2","_Tooltip","_icons","_IconPrimary","_excluded","e","__esModule","default","_extends","Object","assign","bind","n","arguments","length","t","r","hasOwnProperty","call","apply","_objectWithoutProperties","o","i","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","defaultProps","noAnimation","noStyle","noHover","noUnderline","AnchorInstance","localProps","context","React","useContext","Context","allProps","extendPropsWithContext","skeleton","getTranslation","Anchor","inner_ref","innerRef","createRef","id","element","className","children","tooltip","icon","iconPosition","omitClass","targetBlankTitle","rest","attributes","internalId","makeUniqueId","as","href","to","_opensNewTab","opensNewTab","target","showLaunchIcon","includes","showTooltip","title","iconNode","getIcon","suffix","createElement","launchIcon","prefix","Fragment","internalClass","classnames","showDelay","targetElement","forwardRef","props","ref","_supportsSpacingProps","_default","exports","scrollToHashHandler","event","_element$pathname","warn","currentTarget","getAttribute","document","isSamePath","startsWith","window","location","pathname","replace","scrollToHash","hash","split","reverse","anchorElem","getElementById","HTMLElement","scrollPadding","parseFloat","getComputedStyle","documentElement","scrollPaddingTop","top","getOffsetTop","scroll","error","console","pickIcon","_icon$props","_icon$props2","_icon$props2$classNam","_icon$props3","cloneElement","key","test"],"sources":["../../../../src/components/anchor/Anchor.tsx"],"sourcesContent":["/**\n * HTML Element\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport E, { ElementProps } from '../../elements/Element'\nimport Context from '../../shared/Context'\nimport {\n  makeUniqueId,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport { getOffsetTop, warn } from '../../shared/helpers'\nimport IconPrimary from '../icon-primary/IconPrimary'\nimport Tooltip from '../tooltip/Tooltip'\nimport { launch as launchIcon } from '../../icons'\nimport type { IconIcon } from '../icon/Icon'\nimport type { SkeletonShow } from '../skeleton/Skeleton'\nimport type { DynamicElement, SpacingProps } from '../../shared/types'\n\n// Local type for react-router-dom link with only the necessary props. Done this way to prevent react-router-dom dependency.\ntype ReactRouterLink = Omit<\n  React.AnchorHTMLAttributes<HTMLAnchorElement>,\n  'href'\n> & {\n  to: string | { pathname?: string; search?: string; has?: string }\n}\n\nexport type AnchorProps = {\n  element?:\n    | DynamicElement<HTMLAnchorElement | AnchorAllProps>\n    | React.ForwardRefExoticComponent<\n        ReactRouterLink & React.RefAttributes<HTMLAnchorElement>\n      >\n  href?: string\n  to?: string\n  targetBlankTitle?: string\n  target?: string\n  tooltip?: React.ReactNode\n  icon?: IconIcon\n  iconPosition?: 'left' | 'right'\n  skeleton?: SkeletonShow\n  omitClass?: boolean\n  innerRef?: React.RefObject<HTMLAnchorElement>\n\n  /** @deprecated use innerRef instead */\n  inner_ref?: React.RefObject<HTMLAnchorElement>\n  /**\n   * Removes default animation.\n   * Default: `false`\n   */\n  noAnimation?: boolean\n  /**\n   * Removes default styling.\n   * Default: `false`\n   */\n  noStyle?: boolean\n  /**\n   * Removes default hover style.\n   * Default: `false`\n   */\n  noHover?: boolean\n  /**\n   * Removes underline.\n   * Default: `false`\n   */\n  noUnderline?: boolean\n}\n\nexport type AnchorAllProps = AnchorProps &\n  Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'> &\n  SpacingProps\n\nconst defaultProps = {\n  noAnimation: false,\n  noStyle: false,\n  noHover: false,\n  noUnderline: false,\n}\n\nexport function AnchorInstance(localProps: AnchorAllProps) {\n  const context = React.useContext(Context)\n  const allProps = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    { skeleton: context?.skeleton },\n    context?.getTranslation(localProps as AnchorAllProps).Anchor,\n    context?.Anchor\n  )\n\n  // deprecated: inner_ref is still needed to support Button's usage of Anchor\n  if (typeof allProps.inner_ref !== 'undefined') {\n    allProps.innerRef = allProps.inner_ref\n    delete allProps.inner_ref\n  }\n\n  if (!allProps.innerRef) {\n    allProps.innerRef = React.createRef()\n  }\n\n  const {\n    id,\n    element,\n    className,\n    children,\n    tooltip,\n    icon,\n    iconPosition = 'left',\n    omitClass,\n    innerRef,\n    targetBlankTitle,\n    noAnimation,\n    noHover,\n    noStyle,\n    noUnderline,\n    ...rest\n  } = allProps\n\n  const attributes = rest as ElementProps\n  const internalId = id || 'id' + makeUniqueId()\n  const as = element || 'a'\n\n  const href = allProps.href || allProps.to\n  const _opensNewTab = opensNewTab(allProps.target, href)\n  const showLaunchIcon =\n    _opensNewTab &&\n    !className?.includes('dnb-anchor--no-icon') &&\n    !className?.includes('dnb-anchor--no-launch-icon') &&\n    !omitClass\n  const showTooltip = (tooltip || _opensNewTab) && !allProps.title\n\n  const iconNode = icon && getIcon(icon)\n\n  const suffix =\n    (iconPosition === 'right' && iconNode) ||\n    (showLaunchIcon && (\n      <IconPrimary className=\"dnb-anchor__launch-icon\" icon={launchIcon} />\n    ))\n\n  const prefix = iconPosition === 'left' && iconNode\n\n  return (\n    <>\n      <E\n        as={as}\n        id={id}\n        internalClass={as !== 'button'}\n        className={classnames(\n          omitClass !== true &&\n            classnames(\n              'dnb-anchor',\n              prefix && 'dnb-anchor--icon-left',\n              suffix && 'dnb-anchor--icon-right',\n              typeof children !== 'string' && 'dnb-anchor--was-node',\n              noAnimation && 'dnb-anchor--no-animation',\n              noHover && 'dnb-anchor--no-hover',\n              noStyle && 'dnb-anchor--no-style',\n              noUnderline && 'dnb-anchor--no-underline'\n            ),\n          className\n        )}\n        {...attributes}\n        innerRef={innerRef}\n      >\n        {prefix}\n        {children}\n        {suffix}\n      </E>\n\n      {showTooltip && (\n        <Tooltip\n          showDelay={100}\n          id={internalId + '-tooltip'}\n          targetElement={innerRef}\n          tooltip={tooltip}\n        >\n          {allProps.title || targetBlankTitle}\n        </Tooltip>\n      )}\n    </>\n  )\n}\n\nconst Anchor = React.forwardRef(\n  (props: AnchorAllProps, ref: React.RefObject<HTMLAnchorElement>) => {\n    return <AnchorInstance innerRef={ref} {...props} />\n  }\n)\n\n// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-ignore\nAnchor._supportsSpacingProps = true\n\nexport default Anchor\n\n/**\n * @deprecated – can be removed in v11\n */\nexport function scrollToHashHandler(\n  event: React.MouseEvent<HTMLAnchorElement, MouseEvent>\n) {\n  warn('\"scrollToHashHandler\" is deprecated.')\n\n  const element = event.currentTarget as HTMLAnchorElement\n  const href = element.getAttribute('href')\n\n  if (typeof document === 'undefined' || !href.includes('#')) {\n    return // stop here\n  }\n\n  /**\n   * What happens here?\n   * When `scroll-behavior: smooth;` in CSS is set,\n   * Blink/Chromium wants the user to click two times in order to actually scroll to the anchor hash.\n   * The first click, sets the hash, the second one, scrolls to it.\n   * We want Chromium browsers to scroll to the element on the first click.\n   */\n  const isSamePath =\n    href.startsWith('#') ||\n    window.location.href.includes(element.pathname?.replace(/\\/$/, ''))\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  if (isSamePath) {\n    return scrollToHash(href)\n  }\n}\n\nexport function scrollToHash(hash: string) {\n  if (typeof document === 'undefined' || !hash || !hash.includes('#')) {\n    return // stop here\n  }\n\n  // Only continue, when we are sure we are on the same page,\n  // because, the same ID may exists occasionally on the current page.\n  const id = hash.split(/#/g).reverse()[0]\n  const anchorElem = document.getElementById(id)\n\n  if (anchorElem instanceof HTMLElement) {\n    try {\n      const scrollPadding = parseFloat(\n        window.getComputedStyle(document.documentElement).scrollPaddingTop\n      )\n      const top = getOffsetTop(anchorElem) - scrollPadding || 0\n\n      window.scroll({ top })\n\n      return { element: anchorElem }\n    } catch (error) {\n      console.error(error)\n    }\n  }\n}\n\nfunction getIcon(icon) {\n  return pickIcon(icon) || <IconPrimary icon={icon} />\n}\n\nexport function pickIcon(icon, className?: string) {\n  return icon?.props?.icon || icon?.props?.className?.includes('dnb-icon')\n    ? React.cloneElement(icon, {\n        key: 'button-icon-clone',\n        className: classnames(icon.props?.className, className),\n      })\n    : null\n}\n\nexport const opensNewTab = (target: string, href: string): boolean =>\n  target === '_blank' && !/^(mailto|tel|sms)/.test(href)\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/card/CardDocs.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.CardProperties = void 0;
 const CardProperties = exports.CardProperties = {
   outset: {
-    doc: 'True to break out negatively on larger screens. Defaults to `false`.',
+    doc: 'Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.',
     type: 'boolean',
     status: 'optional'
   },

package/cjs/components/card/CardDocs.js.map

@@ -1 +1 @@
-{"version":3,"file":"CardDocs.js","names":["CardProperties","exports","outset","doc","type","status","stack","direction","alignSelf","title","responsive","filled","element","children"],"sources":["../../../../src/components/card/CardDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const CardProperties: PropertiesTableProps = {\n  outset: {\n    doc: 'True to break out negatively on larger screens. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  stack: {\n    doc: 'True to stack the sub components with lines between. The `spacing` will default to `medium`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  direction: {\n    doc: 'Defaults to `vertical`.',\n    type: 'string',\n    status: 'optional',\n  },\n  alignSelf: {\n    doc: 'Defaults to `stretch`.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'Define a title that appears on top of the Card.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  responsive: {\n    doc: 'Define if the card should behave responsive. Defaults to `true`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  filled: {\n    doc: 'Define if the Card should get the same background color as the outline border.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `section`.',\n    type: 'React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n  '[Flex.Container](/uilib/layout/flex/container/properties)': {\n    doc: 'Flex.Container properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n  '[Flex.Item](/uilib/layout/flex/item/properties)': {\n    doc: 'Flex.Item properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,cAAoC,GAAAC,OAAA,CAAAD,cAAA,GAAG;EAClDE,MAAM,EAAE;IACNC,GAAG,EAAE,sEAAsE;IAC3EC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,yBAAyB;IAC9BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,KAAK,EAAE;IACLN,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDK,UAAU,EAAE;IACVP,GAAG,EAAE,kEAAkE;IACvEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,MAAM,EAAE;IACNR,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,oDAAoD;IACzDC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,2DAA2D,EAAE;IAC3DF,GAAG,EAAE,4BAA4B;IACjCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,iDAAiD,EAAE;IACjDF,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}
+{"version":3,"file":"CardDocs.js","names":["CardProperties","exports","outset","doc","type","status","stack","direction","alignSelf","title","responsive","filled","element","children"],"sources":["../../../../src/components/card/CardDocs.ts"],"sourcesContent":["import { PropertiesTableProps } from '../../shared/types'\n\nexport const CardProperties: PropertiesTableProps = {\n  outset: {\n    doc: 'Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  stack: {\n    doc: 'True to stack the sub components with lines between. The `spacing` will default to `medium`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  direction: {\n    doc: 'Defaults to `vertical`.',\n    type: 'string',\n    status: 'optional',\n  },\n  alignSelf: {\n    doc: 'Defaults to `stretch`.',\n    type: 'string',\n    status: 'optional',\n  },\n  title: {\n    doc: 'Define a title that appears on top of the Card.',\n    type: 'React.Node',\n    status: 'optional',\n  },\n  responsive: {\n    doc: 'Define if the card should behave responsive. Defaults to `true`.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  filled: {\n    doc: 'Define if the Card should get the same background color as the outline border.',\n    type: 'boolean',\n    status: 'optional',\n  },\n  element: {\n    doc: 'Define the type of element. Defaults to `section`.',\n    type: 'React.Element',\n    status: 'optional',\n  },\n  children: {\n    doc: 'Contents.',\n    type: 'React.Node',\n    status: 'required',\n  },\n  '[Flex.Container](/uilib/layout/flex/container/properties)': {\n    doc: 'Flex.Container properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n  '[Flex.Item](/uilib/layout/flex/item/properties)': {\n    doc: 'Flex.Item properties.',\n    type: 'Various',\n    status: 'optional',\n  },\n  '[Space](/uilib/layout/space/properties)': {\n    doc: 'Spacing properties like `top` or `bottom` are supported.',\n    type: ['string', 'object'],\n    status: 'optional',\n  },\n}\n"],"mappings":";;;;;;AAEO,MAAMA,cAAoC,GAAAC,OAAA,CAAAD,cAAA,GAAG;EAClDE,MAAM,EAAE;IACNC,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDC,KAAK,EAAE;IACLH,GAAG,EAAE,8FAA8F;IACnGC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDE,SAAS,EAAE;IACTJ,GAAG,EAAE,yBAAyB;IAC9BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDG,SAAS,EAAE;IACTL,GAAG,EAAE,wBAAwB;IAC7BC,IAAI,EAAE,QAAQ;IACdC,MAAM,EAAE;EACV,CAAC;EACDI,KAAK,EAAE;IACLN,GAAG,EAAE,iDAAiD;IACtDC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACDK,UAAU,EAAE;IACVP,GAAG,EAAE,kEAAkE;IACvEC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDM,MAAM,EAAE;IACNR,GAAG,EAAE,gFAAgF;IACrFC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACDO,OAAO,EAAE;IACPT,GAAG,EAAE,oDAAoD;IACzDC,IAAI,EAAE,eAAe;IACrBC,MAAM,EAAE;EACV,CAAC;EACDQ,QAAQ,EAAE;IACRV,GAAG,EAAE,WAAW;IAChBC,IAAI,EAAE,YAAY;IAClBC,MAAM,EAAE;EACV,CAAC;EACD,2DAA2D,EAAE;IAC3DF,GAAG,EAAE,4BAA4B;IACjCC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,iDAAiD,EAAE;IACjDF,GAAG,EAAE,uBAAuB;IAC5BC,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE;EACV,CAAC;EACD,yCAAyC,EAAE;IACzCF,GAAG,EAAE,0DAA0D;IAC/DC,IAAI,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;IAC1BC,MAAM,EAAE;EACV;AACF,CAAC","ignoreList":[]}

package/cjs/components/help-button/HelpButtonInline.js

@@ -114,7 +114,7 @@ function HelpButtonInlineContent(props) {
       help: helpProp,
       breakout = true,
       outset = true,
-      roundedCorner = true,
+      roundedCorner,
       focusWhenOpen: focusWhenOpenProp
     } = props,
     rest = _objectWithoutProperties(props, _excluded2);

package/cjs/components/help-button/HelpButtonInline.js.map

@@ -1 +1 @@
-{"version":3,"file":"HelpButtonInline.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_HelpButtonInstance","_HeightAnimation","_useSharedState","_componentHelper","_useId","_Section","_elements","_Flex","_CardContext","_Dialog","_icons","_Fragment","_excluded","_excluded2","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","_objectWithoutProperties","o","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","HelpButtonInline","props","_help$open","contentId","size","help","focusWhenOpen","className","children","rest","controlId","useId","data","update","useSharedState","isOpen","open","isUserIntent","wasOpenRef","useRef","undefined","buttonRef","toggleOpen","useCallback","current","onClickHandler","_ref","event","preventDefault","onKeyDownHandler","currentTarget","target","key","trim","code","window","requestAnimationFrame","title","convertJsxToString","createElement","Fragment","bounding","icon","HelpButtonIcon","id","classnames","on_click","onKeyDown","innerRef","HelpButtonInlineContent","_ref2","element","helpProp","breakout","outset","roundedCorner","focusWhenOpenProp","content","renderAs","breakoutProp","outsetProp","cardContext","useContext","CardContext","breakoutFromLayout","Boolean","outsetFromLayout","useEffect","_innerRef$current","focus","preventScroll","onClose","_buttonRef$current","omitTriggerButton","openState","focusParams","tabIndex","innerSpace","top","bottom","left","right","backgroundColor","Vertical","gap","P","weight","question","close","_supportsSpacingProps"],"sources":["../../../../src/components/help-button/HelpButtonInline.tsx"],"sourcesContent":["import React, {\n  AriaAttributes,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { HelpButtonProps } from './HelpButton'\nimport HelpButtonInstance from './HelpButtonInstance'\nimport HeightAnimation from '../HeightAnimation'\nimport { useSharedState } from '../../shared/helpers/useSharedState'\nimport { convertJsxToString } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport Section from '../Section'\nimport { P } from '../../elements'\nimport Flex from '../Flex'\nimport CardContext from '../card/CardContext'\nimport { SpacingProps } from '../space/types'\nimport Dialog from '../Dialog'\nimport { question as QuestionIcon, close as CloseIcon } from '../../icons'\n\nexport type HelpProps = {\n  title?: React.ReactNode\n  content?: React.ReactNode\n  renderAs?: 'inline' | 'dialog'\n  /** Only for the \"inline\" variant */\n  open?: boolean\n  /** Only for the \"inline\" variant */\n  breakout?: boolean\n  /** Only for the \"inline\" variant */\n  outset?: boolean\n}\n\nexport type HelpButtonInlineProps = HelpButtonProps & {\n  contentId?: string\n  help?: HelpProps\n\n  /**\n   * If set to `true`, the content will get focus when the help content is opened.\n   */\n  focusWhenOpen?: boolean\n}\n\nexport type HelpButtonInlineSharedStateDataProps = {\n  isOpen: boolean\n  isUserIntent?: boolean\n  buttonRef?: React.RefObject<HTMLButtonElement>\n  focusWhenOpen?: boolean\n}\n\nexport default function HelpButtonInline(props: HelpButtonInlineProps) {\n  const {\n    contentId,\n    size,\n    help,\n    focusWhenOpen,\n    className,\n    children,\n    ...rest\n  } = props\n  const controlId = useId(contentId)\n\n  const { data, update } =\n    useSharedState<HelpButtonInlineSharedStateDataProps>(controlId, {\n      isOpen: help?.open ?? false,\n    })\n  const { isOpen, isUserIntent } = data || {}\n  const wasOpenRef = useRef(undefined)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n\n  const toggleOpen = useCallback(() => {\n    update({\n      isOpen: !isOpen,\n      isUserIntent: !isOpen,\n      buttonRef,\n      focusWhenOpen,\n    })\n    wasOpenRef.current = !isOpen\n  }, [focusWhenOpen, isOpen, update])\n\n  const onClickHandler = useCallback(\n    ({ event }: { event: React.MouseEvent<HTMLButtonElement> }) => {\n      event.preventDefault() // Because when used inside a FormLabel\n      toggleOpen()\n    },\n    [toggleOpen]\n  )\n\n  const onKeyDownHandler = useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (event.currentTarget === event.target) {\n        switch (event.key.trim() || event.code) {\n          case 'Escape':\n            if (isOpen) {\n              event.preventDefault()\n              window.requestAnimationFrame(() => {\n                toggleOpen()\n              })\n            }\n            break\n        }\n      }\n    },\n    [isOpen, toggleOpen]\n  )\n\n  const title = convertJsxToString(help?.title)\n\n  return (\n    <>\n      <HelpButtonInstance\n        bounding\n        size={size ?? 'small'}\n        icon={HelpButtonIcon}\n        title={!isOpen && !wasOpenRef.current ? title : undefined}\n        {...rest}\n        id={controlId}\n        className={classnames(\n          'dnb-help-button__inline',\n          isOpen && 'dnb-help-button__inline--open',\n          isUserIntent && 'dnb-help-button__inline--user-intent',\n          typeof wasOpenRef.current === 'boolean' &&\n            'dnb-help-button__inline--was-open',\n          className\n        )}\n        aria-controls={`${controlId}-content`}\n        aria-expanded={isOpen}\n        aria-label={title}\n        on_click={onClickHandler}\n        onKeyDown={onKeyDownHandler}\n        innerRef={buttonRef}\n      />\n\n      {!contentId && (\n        <HelpButtonInlineContent\n          contentId={controlId}\n          help={help}\n          focusWhenOpen={focusWhenOpen}\n        >\n          {children}\n        </HelpButtonInlineContent>\n      )}\n    </>\n  )\n}\n\nexport type HelpButtonInlineContentProps = SpacingProps & {\n  contentId: string\n  className?: string\n  element?: React.ElementType\n  children?: React.ReactNode\n  help?: HelpProps\n  breakout?: boolean\n  outset?: boolean\n  roundedCorner?: boolean\n  focusWhenOpen?: boolean\n}\n\nexport function HelpButtonInlineContent(\n  props: HelpButtonInlineContentProps\n) {\n  const {\n    contentId,\n    className,\n    element,\n    children,\n    help: helpProp,\n    breakout = true,\n    outset = true,\n    roundedCorner = true,\n    focusWhenOpen: focusWhenOpenProp,\n    ...rest\n  } = props\n  const { data, update } =\n    useSharedState<HelpButtonInlineSharedStateDataProps>(contentId)\n  const {\n    isOpen,\n    focusWhenOpen = focusWhenOpenProp,\n    isUserIntent,\n    buttonRef,\n  } = data || {}\n  const {\n    open,\n    title,\n    content,\n    renderAs,\n    breakout: breakoutProp = true,\n    outset: outsetProp = true,\n  } = helpProp || {}\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  const cardContext = useContext(CardContext)\n  const breakoutFromLayout =\n    Boolean(cardContext) && breakout && breakoutProp\n  const outsetFromLayout = outset && outsetProp\n\n  useEffect(() => {\n    if (isOpen && isUserIntent && focusWhenOpen) {\n      window.requestAnimationFrame(() => {\n        innerRef.current?.focus({ preventScroll: true })\n      })\n    }\n  }, [focusWhenOpen, isOpen, isUserIntent])\n\n  const onClose = useCallback(() => {\n    update({ isOpen: false, isUserIntent: false })\n  }, [update])\n\n  const onKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (event.currentTarget === event.target) {\n        // Firefox returns a whitespace (\" \") on event.key when pressing space,\n        // therefore using .trim() can help normalize this.\n        // While userEvent.keyboard('{Space}') might return 'Unknown' on event.code,\n        // making a direct comparison less reliable across all platforms.\n        switch (event.key.trim() || event.code) {\n          case 'Enter':\n          case 'Space':\n          case 'Escape':\n            event.preventDefault()\n            window.requestAnimationFrame(() => {\n              onClose()\n              buttonRef.current?.focus()\n            })\n            break\n        }\n      }\n    },\n    [buttonRef, onClose]\n  )\n\n  if (renderAs === 'dialog') {\n    return (\n      <Dialog\n        title={title}\n        omitTriggerButton\n        openState={isOpen ?? open}\n        onClose={onClose}\n      >\n        {content}\n        {children}\n      </Dialog>\n    )\n  }\n\n  const focusParams = focusWhenOpen\n    ? {\n        'aria-label': convertJsxToString(title),\n        className: 'dnb-no-focus',\n        tabIndex: -1,\n        onKeyDown,\n      }\n    : ({\n        'aria-live': 'polite',\n        'aria-atomic': 'true',\n      } as AriaAttributes)\n\n  return (\n    <HeightAnimation\n      element={element}\n      className={classnames('dnb-help-button__content', className)}\n      open={isOpen ?? open ?? false}\n    >\n      <Section\n        id={`${contentId}-content`}\n        {...focusParams}\n        innerRef={innerRef}\n        outset={outsetFromLayout}\n        breakout={breakoutFromLayout}\n        roundedCorner={roundedCorner ?? !breakoutFromLayout}\n        innerSpace={\n          breakoutFromLayout\n            ? { top: 'small', bottom: 'medium' }\n            : {\n                top: 'small',\n                bottom: 'medium',\n                left: 'medium',\n                right: 'x-small',\n              }\n        }\n        backgroundColor=\"lavender\"\n        {...rest}\n      >\n        <Flex.Vertical gap=\"x-small\">\n          {title && <P weight=\"medium\">{title}</P>}\n          {content && <P>{content}</P>}\n        </Flex.Vertical>\n        {children}\n      </Section>\n    </HeightAnimation>\n  )\n}\n\nfunction HelpButtonIcon() {\n  return (\n    <>\n      <QuestionIcon />\n      <CloseIcon />\n    </>\n  )\n}\n\nHelpButtonInline._supportsSpacingProps = true\nHelpButtonInlineContent._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HelpButtonInline.js","names":["_react","_interopRequireWildcard","require","_classnames","_interopRequireDefault","_HelpButtonInstance","_HeightAnimation","_useSharedState","_componentHelper","_useId","_Section","_elements","_Flex","_CardContext","_Dialog","_icons","_Fragment","_excluded","_excluded2","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","_extends","assign","bind","arguments","length","apply","_objectWithoutProperties","o","_objectWithoutPropertiesLoose","getOwnPropertySymbols","indexOf","propertyIsEnumerable","HelpButtonInline","props","_help$open","contentId","size","help","focusWhenOpen","className","children","rest","controlId","useId","data","update","useSharedState","isOpen","open","isUserIntent","wasOpenRef","useRef","undefined","buttonRef","toggleOpen","useCallback","current","onClickHandler","_ref","event","preventDefault","onKeyDownHandler","currentTarget","target","key","trim","code","window","requestAnimationFrame","title","convertJsxToString","createElement","Fragment","bounding","icon","HelpButtonIcon","id","classnames","on_click","onKeyDown","innerRef","HelpButtonInlineContent","_ref2","element","helpProp","breakout","outset","roundedCorner","focusWhenOpenProp","content","renderAs","breakoutProp","outsetProp","cardContext","useContext","CardContext","breakoutFromLayout","Boolean","outsetFromLayout","useEffect","_innerRef$current","focus","preventScroll","onClose","_buttonRef$current","omitTriggerButton","openState","focusParams","tabIndex","innerSpace","top","bottom","left","right","backgroundColor","Vertical","gap","P","weight","question","close","_supportsSpacingProps"],"sources":["../../../../src/components/help-button/HelpButtonInline.tsx"],"sourcesContent":["import React, {\n  AriaAttributes,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n} from 'react'\nimport classnames from 'classnames'\nimport { HelpButtonProps } from './HelpButton'\nimport HelpButtonInstance from './HelpButtonInstance'\nimport HeightAnimation from '../HeightAnimation'\nimport { useSharedState } from '../../shared/helpers/useSharedState'\nimport { convertJsxToString } from '../../shared/component-helper'\nimport useId from '../../shared/helpers/useId'\nimport Section from '../Section'\nimport { P } from '../../elements'\nimport Flex from '../Flex'\nimport CardContext from '../card/CardContext'\nimport { SpacingProps } from '../space/types'\nimport Dialog from '../Dialog'\nimport { question as QuestionIcon, close as CloseIcon } from '../../icons'\n\nexport type HelpProps = {\n  title?: React.ReactNode\n  content?: React.ReactNode\n  renderAs?: 'inline' | 'dialog'\n  /** Only for the \"inline\" variant */\n  open?: boolean\n  /** Only for the \"inline\" variant */\n  breakout?: boolean\n  /** Only for the \"inline\" variant */\n  outset?: boolean\n}\n\nexport type HelpButtonInlineProps = HelpButtonProps & {\n  contentId?: string\n  help?: HelpProps\n\n  /**\n   * If set to `true`, the content will get focus when the help content is opened.\n   */\n  focusWhenOpen?: boolean\n}\n\nexport type HelpButtonInlineSharedStateDataProps = {\n  isOpen: boolean\n  isUserIntent?: boolean\n  buttonRef?: React.RefObject<HTMLButtonElement>\n  focusWhenOpen?: boolean\n}\n\nexport default function HelpButtonInline(props: HelpButtonInlineProps) {\n  const {\n    contentId,\n    size,\n    help,\n    focusWhenOpen,\n    className,\n    children,\n    ...rest\n  } = props\n  const controlId = useId(contentId)\n\n  const { data, update } =\n    useSharedState<HelpButtonInlineSharedStateDataProps>(controlId, {\n      isOpen: help?.open ?? false,\n    })\n  const { isOpen, isUserIntent } = data || {}\n  const wasOpenRef = useRef(undefined)\n  const buttonRef = useRef<HTMLButtonElement>(null)\n\n  const toggleOpen = useCallback(() => {\n    update({\n      isOpen: !isOpen,\n      isUserIntent: !isOpen,\n      buttonRef,\n      focusWhenOpen,\n    })\n    wasOpenRef.current = !isOpen\n  }, [focusWhenOpen, isOpen, update])\n\n  const onClickHandler = useCallback(\n    ({ event }: { event: React.MouseEvent<HTMLButtonElement> }) => {\n      event.preventDefault() // Because when used inside a FormLabel\n      toggleOpen()\n    },\n    [toggleOpen]\n  )\n\n  const onKeyDownHandler = useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (event.currentTarget === event.target) {\n        switch (event.key.trim() || event.code) {\n          case 'Escape':\n            if (isOpen) {\n              event.preventDefault()\n              window.requestAnimationFrame(() => {\n                toggleOpen()\n              })\n            }\n            break\n        }\n      }\n    },\n    [isOpen, toggleOpen]\n  )\n\n  const title = convertJsxToString(help?.title)\n\n  return (\n    <>\n      <HelpButtonInstance\n        bounding\n        size={size ?? 'small'}\n        icon={HelpButtonIcon}\n        title={!isOpen && !wasOpenRef.current ? title : undefined}\n        {...rest}\n        id={controlId}\n        className={classnames(\n          'dnb-help-button__inline',\n          isOpen && 'dnb-help-button__inline--open',\n          isUserIntent && 'dnb-help-button__inline--user-intent',\n          typeof wasOpenRef.current === 'boolean' &&\n            'dnb-help-button__inline--was-open',\n          className\n        )}\n        aria-controls={`${controlId}-content`}\n        aria-expanded={isOpen}\n        aria-label={title}\n        on_click={onClickHandler}\n        onKeyDown={onKeyDownHandler}\n        innerRef={buttonRef}\n      />\n\n      {!contentId && (\n        <HelpButtonInlineContent\n          contentId={controlId}\n          help={help}\n          focusWhenOpen={focusWhenOpen}\n        >\n          {children}\n        </HelpButtonInlineContent>\n      )}\n    </>\n  )\n}\n\nexport type HelpButtonInlineContentProps = SpacingProps & {\n  contentId: string\n  className?: string\n  element?: React.ElementType\n  children?: React.ReactNode\n  help?: HelpProps\n  breakout?: boolean\n  outset?: boolean\n  roundedCorner?: boolean\n  focusWhenOpen?: boolean\n}\n\nexport function HelpButtonInlineContent(\n  props: HelpButtonInlineContentProps\n) {\n  const {\n    contentId,\n    className,\n    element,\n    children,\n    help: helpProp,\n    breakout = true,\n    outset = true,\n    roundedCorner,\n    focusWhenOpen: focusWhenOpenProp,\n    ...rest\n  } = props\n  const { data, update } =\n    useSharedState<HelpButtonInlineSharedStateDataProps>(contentId)\n  const {\n    isOpen,\n    focusWhenOpen = focusWhenOpenProp,\n    isUserIntent,\n    buttonRef,\n  } = data || {}\n  const {\n    open,\n    title,\n    content,\n    renderAs,\n    breakout: breakoutProp = true,\n    outset: outsetProp = true,\n  } = helpProp || {}\n\n  const innerRef = useRef<HTMLDivElement>(null)\n  const cardContext = useContext(CardContext)\n  const breakoutFromLayout =\n    Boolean(cardContext) && breakout && breakoutProp\n  const outsetFromLayout = outset && outsetProp\n\n  useEffect(() => {\n    if (isOpen && isUserIntent && focusWhenOpen) {\n      window.requestAnimationFrame(() => {\n        innerRef.current?.focus({ preventScroll: true })\n      })\n    }\n  }, [focusWhenOpen, isOpen, isUserIntent])\n\n  const onClose = useCallback(() => {\n    update({ isOpen: false, isUserIntent: false })\n  }, [update])\n\n  const onKeyDown = useCallback(\n    (event: React.KeyboardEvent<HTMLButtonElement>) => {\n      if (event.currentTarget === event.target) {\n        // Firefox returns a whitespace (\" \") on event.key when pressing space,\n        // therefore using .trim() can help normalize this.\n        // While userEvent.keyboard('{Space}') might return 'Unknown' on event.code,\n        // making a direct comparison less reliable across all platforms.\n        switch (event.key.trim() || event.code) {\n          case 'Enter':\n          case 'Space':\n          case 'Escape':\n            event.preventDefault()\n            window.requestAnimationFrame(() => {\n              onClose()\n              buttonRef.current?.focus()\n            })\n            break\n        }\n      }\n    },\n    [buttonRef, onClose]\n  )\n\n  if (renderAs === 'dialog') {\n    return (\n      <Dialog\n        title={title}\n        omitTriggerButton\n        openState={isOpen ?? open}\n        onClose={onClose}\n      >\n        {content}\n        {children}\n      </Dialog>\n    )\n  }\n\n  const focusParams = focusWhenOpen\n    ? {\n        'aria-label': convertJsxToString(title),\n        className: 'dnb-no-focus',\n        tabIndex: -1,\n        onKeyDown,\n      }\n    : ({\n        'aria-live': 'polite',\n        'aria-atomic': 'true',\n      } as AriaAttributes)\n\n  return (\n    <HeightAnimation\n      element={element}\n      className={classnames('dnb-help-button__content', className)}\n      open={isOpen ?? open ?? false}\n    >\n      <Section\n        id={`${contentId}-content`}\n        {...focusParams}\n        innerRef={innerRef}\n        outset={outsetFromLayout}\n        breakout={breakoutFromLayout}\n        roundedCorner={roundedCorner ?? !breakoutFromLayout}\n        innerSpace={\n          breakoutFromLayout\n            ? { top: 'small', bottom: 'medium' }\n            : {\n                top: 'small',\n                bottom: 'medium',\n                left: 'medium',\n                right: 'x-small',\n              }\n        }\n        backgroundColor=\"lavender\"\n        {...rest}\n      >\n        <Flex.Vertical gap=\"x-small\">\n          {title && <P weight=\"medium\">{title}</P>}\n          {content && <P>{content}</P>}\n        </Flex.Vertical>\n        {children}\n      </Section>\n    </HeightAnimation>\n  )\n}\n\nfunction HelpButtonIcon() {\n  return (\n    <>\n      <QuestionIcon />\n      <CloseIcon />\n    </>\n  )\n}\n\nHelpButtonInline._supportsSpacingProps = true\nHelpButtonInlineContent._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/section/Section.d.ts

@@ -31,6 +31,7 @@ export type TextColor = string;
 export type OutlineColor = string | boolean;
 export type BackgroundColor = string;
 export type DropShadow = boolean;
+export type RoundedCorner = boolean | [boolean, boolean, boolean, boolean];
 export type SectionProps = {
     /**
      * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop
@@ -48,7 +49,7 @@ export type SectionProps = {
     /**
      * Define if the section should have rounded corners. Defaults to `false`.
      */
-    roundedCorner?: boolean | ResponsiveProp<boolean>;
+    roundedCorner?: RoundedCorner | ResponsiveProp<RoundedCorner>;
     /**
      * Define a custom border color. Use a Eufemia color.
      */

package/cjs/components/section/Section.js

@@ -51,14 +51,14 @@ function SectionParams(localProps) {
   const elementRef = innerRef || inner_ref || internalRef;
   return Object.freeze(_objectSpread(_objectSpread({}, attributes), {}, {
     className: (0, _classnames.default)(`dnb-section dnb-section--${variant ? variant : style_type || 'default'}`, className, spacing && `dnb-section--spacing-${(0, _componentHelper.isTrue)(spacing) ? 'large' : spacing}`),
-    style: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(outset, 'outset', value => value ? '1' : '0')), computeStyle(roundedCorner, 'rounded-corner', value => value && 'var(--rounded-corner--value)')), computeStyle(textColor, 'text-color', value => (0, _helpers.getColor)(value))), computeStyle(backgroundColor, 'background-color', value => (0, _helpers.getColor)(value))), computeStyle(dropShadow, 'drop-shadow', value => value && 'var(--shadow-default)')), computeStyle(outline, 'outline-color', value => String(value) === 'true' ? 'var(--outline-color--value)' : (0, _helpers.getColor)(value))), attributes === null || attributes === void 0 ? void 0 : attributes.style),
+    style: _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, computeStyle(breakout, 'breakout', value => `var(--breakout--${value ? 'on' : 'off'})`)), computeStyle(outset, 'outset', value => value ? '1' : '0')), computeStyle(roundedCorner, 'rounded-corner', value => typeof value === 'boolean' ? value && 'var(--rounded-corner--value)' : value.map(v => v ? 'var(--rounded-corner--value)' : '0').join(' '))), computeStyle(textColor, 'text-color', value => (0, _helpers.getColor)(value))), computeStyle(backgroundColor, 'background-color', value => (0, _helpers.getColor)(value))), computeStyle(dropShadow, 'drop-shadow', value => value && 'var(--shadow-default)')), computeStyle(outline, 'outline-color', value => typeof value === 'boolean' ? value && 'var(--outline-color--value)' : (0, _helpers.getColor)(value))), attributes === null || attributes === void 0 ? void 0 : attributes.style),
     innerRef: elementRef,
     children
   }));
 }
 function computeStyle(property, name, valueCallback) {
   let media = property;
-  if (media !== null && typeof media !== 'object') {
+  if (media !== null && (Array.isArray(media) || typeof media !== 'object')) {
     media = {
       small: property,
       medium: property,

package/cjs/components/section/Section.js.map

@@ -1 +1 @@
-{"version":3,"file":"Section.js","names":["_react","_interopRequireDefault","require","_classnames","_Context","_componentHelper","_Space","_helpers","_excluded","e","__esModule","default","ownKeys","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","_toPropertyKey","value","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","_objectWithoutProperties","_objectWithoutPropertiesLoose","n","indexOf","propertyIsEnumerable","hasOwnProperty","defaultProps","element","Section","localProps","createElement","SectionParams","context","React","useContext","Context","props","extendPropsWithContext","variant","breakout","outset","roundedCorner","textColor","backgroundColor","dropShadow","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","internalRef","useRef","elementRef","freeze","classnames","isTrue","style","computeStyle","getColor","property","name","valueCallback","media","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\nimport { getColor } from '../../shared/helpers'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\nexport type DropShadow = boolean\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the Card should break out negatively on larger screens. You cannot use `breakout` and `outset` together.\n   * Defaults to `false`\n   */\n  outset?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define a custom drop-shadow.\n   */\n  dropShadow?: DropShadow | ResponsiveProp<DropShadow>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead\n   */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead\n   */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead\n   */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype SectionReturnParams = Record<string, unknown> & {\n  className: string\n  innerRef: React.RefObject<HTMLElement>\n  children: React.ReactNode\n  style: React.CSSProperties\n}\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  return <Space {...SectionParams(localProps)} />\n}\n\nexport function SectionParams(\n  localProps: SectionAllProps\n): SectionReturnParams {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    variant,\n    breakout = !props.outset,\n    outset,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    dropShadow,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n\n  return Object.freeze({\n    ...attributes,\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    style: {\n      ...computeStyle(\n        breakout,\n        'breakout',\n        (value) => `var(--breakout--${value ? 'on' : 'off'})`\n      ),\n      ...computeStyle(outset, 'outset', (value) => (value ? '1' : '0')),\n      ...computeStyle(\n        roundedCorner,\n        'rounded-corner',\n        (value) => value && 'var(--rounded-corner--value)'\n      ),\n      ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n      ...computeStyle(backgroundColor, 'background-color', (value) =>\n        getColor(value)\n      ),\n      ...computeStyle(\n        dropShadow,\n        'drop-shadow',\n        (value) => value && 'var(--shadow-default)'\n      ),\n      ...computeStyle(outline, 'outline-color', (value) =>\n        String(value) === 'true'\n          ? 'var(--outline-color--value)'\n          : getColor(value)\n      ),\n      ...attributes?.style,\n    } as React.CSSProperties,\n    innerRef: elementRef,\n    children,\n  })\n}\n\nfunction computeStyle(\n  property: ResponsiveProp<unknown> | boolean | string,\n  name: string,\n  valueCallback: (value: string) => string | undefined\n) {\n  let media = property as ResponsiveProp<unknown>\n\n  if (media !== null && typeof media !== 'object') {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<unknown>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<unknown>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Section.js","names":["_react","_interopRequireDefault","require","_classnames","_Context","_componentHelper","_Space","_helpers","_excluded","e","__esModule","default","ownKeys","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","_toPropertyKey","value","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","_objectWithoutProperties","_objectWithoutPropertiesLoose","n","indexOf","propertyIsEnumerable","hasOwnProperty","defaultProps","element","Section","localProps","createElement","SectionParams","context","React","useContext","Context","props","extendPropsWithContext","variant","breakout","outset","roundedCorner","textColor","backgroundColor","dropShadow","outline","innerRef","className","children","spacing","style_type","inner_ref","attributes","internalRef","useRef","elementRef","freeze","classnames","isTrue","style","computeStyle","map","v","join","getColor","property","name","valueCallback","media","Array","isArray","small","medium","large","result","size","_media","_media2","_name","_supportsSpacingProps"],"sources":["../../../../src/components/section/Section.tsx"],"sourcesContent":["/**\n * Web Section Component\n *\n */\n\nimport React from 'react'\nimport classnames from 'classnames'\nimport Context from '../../shared/Context'\nimport {\n  isTrue,\n  extendPropsWithContext,\n} from '../../shared/component-helper'\nimport type {\n  DynamicElement,\n  ResponsiveProp,\n  SpacingProps,\n} from '../../shared/types'\nimport Space from '../space/Space'\nimport { getColor } from '../../shared/helpers'\n\nexport type SectionVariants = 'error' | 'info' | 'warning' | 'success'\n\nexport type SectionStyleTypes =\n  | 'divider'\n  | 'white'\n  | 'transparent'\n\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'lavender'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'pistachio'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'emerald-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sea-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'fire-red-8'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'sand-yellow'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'black-3'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green'\n  /** @deprecated in v11 use \"variant\" or \"backgroundColor\" prop instead */\n  | 'mint-green-12'\n\nexport type SectionSpacing =\n  | boolean\n  | 'x-small'\n  | 'small'\n  | 'medium'\n  | 'large'\n  | 'x-large'\n  | 'xx-large'\n\nexport type TextColor = string\nexport type OutlineColor = string | boolean\nexport type BackgroundColor = string\nexport type DropShadow = boolean\nexport type RoundedCorner = boolean | [boolean, boolean, boolean, boolean]\n\nexport type SectionProps = {\n  /**\n   * Defines the semantic purpose and subsequently the style of the visual helper. Will take precedence over the style_type prop\n   */\n  variant?: SectionVariants | string\n\n  /**\n   * Define if the background color should break-out to a fullscreen view. Defaults to `true`.\n   */\n  breakout?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the Card should break out negatively on larger screens. You cannot use `breakout` and `outset` together.\n   * Defaults to `false`\n   */\n  outset?: boolean | ResponsiveProp<boolean>\n\n  /**\n   * Define if the section should have rounded corners. Defaults to `false`.\n   */\n  roundedCorner?: RoundedCorner | ResponsiveProp<RoundedCorner>\n\n  /**\n   * Define a custom border color. Use a Eufemia color.\n   */\n  outline?: OutlineColor | ResponsiveProp<OutlineColor>\n\n  /**\n   * Define a custom text color to compliment the backgroundColor. Use a Eufemia color.\n   */\n  textColor?: TextColor | ResponsiveProp<TextColor>\n\n  /**\n   * Define a custom background color, instead of a variant. Use a Eufemia color.\n   */\n  backgroundColor?: BackgroundColor | ResponsiveProp<BackgroundColor>\n\n  /**\n   * Define a custom drop-shadow.\n   */\n  dropShadow?: DropShadow | ResponsiveProp<DropShadow>\n\n  /**\n   * Define what HTML element should be used. Defaults to `<section>`.\n   */\n  element?: DynamicElement\n\n  /**\n   * Define a React.Ref.\n   */\n  innerRef?: React.RefObject<HTMLElement>\n\n  /**\n   * @deprecated in v11 use \"innerSpace\" prop instead\n   */\n  spacing?: SectionSpacing | ResponsiveProp<SectionSpacing>\n  /**\n   * @deprecated in v11 use \"background\" prop instead\n   */\n  style_type?: SectionStyleTypes | string\n  /**\n   * @deprecated in v11 use \"innerRef\" prop instead\n   */\n  inner_ref?: React.RefObject<HTMLElement>\n}\n\nexport type SectionAllProps = SectionProps &\n  SpacingProps &\n  Omit<React.HTMLProps<HTMLElement>, 'ref'>\n\ntype SectionReturnParams = Record<string, unknown> & {\n  className: string\n  innerRef: React.RefObject<HTMLElement>\n  children: React.ReactNode\n  style: React.CSSProperties\n}\n\nconst defaultProps = {\n  element: 'section',\n}\n\nexport default function Section(localProps: SectionAllProps) {\n  return <Space {...SectionParams(localProps)} />\n}\n\nexport function SectionParams(\n  localProps: SectionAllProps\n): SectionReturnParams {\n  const context = React.useContext(Context)\n\n  // use only the props from context, who are available here anyway\n  const props = extendPropsWithContext(\n    localProps,\n    defaultProps,\n    context.Section\n  )\n\n  const {\n    variant,\n    breakout = !props.outset,\n    outset,\n    roundedCorner,\n    textColor,\n    backgroundColor,\n    dropShadow,\n    outline,\n    innerRef,\n\n    className,\n    children,\n\n    spacing,\n    style_type,\n    inner_ref,\n\n    ...attributes\n  } = props\n\n  const internalRef = React.useRef<HTMLElement>()\n  const elementRef = innerRef || inner_ref || internalRef\n\n  return Object.freeze({\n    ...attributes,\n    className: classnames(\n      'dnb-section',\n      `dnb-section--${variant ? variant : style_type || 'default'}`,\n      spacing &&\n        `dnb-section--spacing-${isTrue(spacing) ? 'large' : spacing}`,\n      className\n    ),\n    style: {\n      ...computeStyle(\n        breakout,\n        'breakout',\n        (value) => `var(--breakout--${value ? 'on' : 'off'})`\n      ),\n      ...computeStyle(outset, 'outset', (value) => (value ? '1' : '0')),\n      ...computeStyle(roundedCorner, 'rounded-corner', (value) =>\n        typeof value === 'boolean'\n          ? value && 'var(--rounded-corner--value)'\n          : value\n              .map((v) => (v ? 'var(--rounded-corner--value)' : '0'))\n              .join(' ')\n      ),\n      ...computeStyle(textColor, 'text-color', (value) => getColor(value)),\n      ...computeStyle(backgroundColor, 'background-color', (value) =>\n        getColor(value)\n      ),\n      ...computeStyle(\n        dropShadow,\n        'drop-shadow',\n        (value) => value && 'var(--shadow-default)'\n      ),\n      ...computeStyle(outline, 'outline-color', (value) =>\n        typeof value === 'boolean'\n          ? value && 'var(--outline-color--value)'\n          : getColor(value)\n      ),\n      ...attributes?.style,\n    } as React.CSSProperties,\n    innerRef: elementRef,\n    children,\n  })\n}\n\nfunction computeStyle<T extends boolean | string | boolean[]>(\n  property: T | ResponsiveProp<T>,\n  name: string,\n  valueCallback: (value: T) => string | undefined\n) {\n  let media = property as ResponsiveProp<T>\n\n  if (\n    media !== null &&\n    (Array.isArray(media) || typeof media !== 'object')\n  ) {\n    media = {\n      small: property,\n      medium: property,\n      large: property,\n    } as ResponsiveProp<T>\n  }\n\n  const result = {}\n\n  for (const size in media as ResponsiveProp<T>) {\n    if (typeof media?.[size] !== 'undefined') {\n      const value = valueCallback(media?.[size])\n      if (typeof value === 'string') {\n        result[`--${name}--${size}`] = value\n      }\n    }\n  }\n\n  return result\n}\n\nSection._name = 'Section'\nSection._supportsSpacingProps = true\n"],"mappings":";;;;;;;;AAKA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,QAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,gBAAA,GAAAH,OAAA;AASA,IAAAI,MAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,QAAA,GAAAL,OAAA;AAA+C,MAAAM,SAAA;AAAA,SAAAP,uBAAAQ,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,QAAAH,CAAA,EAAAI,CAAA,QAAAC,CAAA,GAAAC,MAAA,CAAAC,IAAA,CAAAP,CAAA,OAAAM,MAAA,CAAAE,qBAAA,QAAAC,CAAA,GAAAH,MAAA,CAAAE,qBAAA,CAAAR,CAAA,GAAAI,CAAA,KAAAK,CAAA,GAAAA,CAAA,CAAAC,MAAA,WAAAN,CAAA,WAAAE,MAAA,CAAAK,wBAAA,CAAAX,CAAA,EAAAI,CAAA,EAAAQ,UAAA,OAAAP,CAAA,CAAAQ,IAAA,CAAAC,KAAA,CAAAT,CAAA,EAAAI,CAAA,YAAAJ,CAAA;AAAA,SAAAU,cAAAf,CAAA,aAAAI,CAAA,MAAAA,CAAA,GAAAY,SAAA,CAAAC,MAAA,EAAAb,CAAA,UAAAC,CAAA,WAAAW,SAAA,CAAAZ,CAAA,IAAAY,SAAA,CAAAZ,CAAA,QAAAA,CAAA,OAAAD,OAAA,CAAAG,MAAA,CAAAD,CAAA,OAAAa,OAAA,WAAAd,CAAA,IAAAe,eAAA,CAAAnB,CAAA,EAAAI,CAAA,EAAAC,CAAA,CAAAD,CAAA,SAAAE,MAAA,CAAAc,yBAAA,GAAAd,MAAA,CAAAe,gBAAA,CAAArB,CAAA,EAAAM,MAAA,CAAAc,yBAAA,CAAAf,CAAA,KAAAF,OAAA,CAAAG,MAAA,CAAAD,CAAA,GAAAa,OAAA,WAAAd,CAAA,IAAAE,MAAA,CAAAgB,cAAA,CAAAtB,CAAA,EAAAI,CAAA,EAAAE,MAAA,CAAAK,wBAAA,CAAAN,CAAA,EAAAD,CAAA,iBAAAJ,CAAA;AAAA,SAAAmB,gBAAAnB,CAAA,EAAAI,CAAA,EAAAC,CAAA,YAAAD,CAAA,GAAAmB,cAAA,CAAAnB,CAAA,MAAAJ,CAAA,GAAAM,MAAA,CAAAgB,cAAA,CAAAtB,CAAA,EAAAI,CAAA,IAAAoB,KAAA,EAAAnB,CAAA,EAAAO,UAAA,MAAAa,YAAA,MAAAC,QAAA,UAAA1B,CAAA,CAAAI,CAAA,IAAAC,CAAA,EAAAL,CAAA;AAAA,SAAAuB,eAAAlB,CAAA,QAAAsB,CAAA,GAAAC,YAAA,CAAAvB,CAAA,uCAAAsB,CAAA,GAAAA,CAAA,GAAAA,CAAA;AAAA,SAAAC,aAAAvB,CAAA,EAAAD,CAAA,2BAAAC,CAAA,KAAAA,CAAA,SAAAA,CAAA,MAAAL,CAAA,GAAAK,CAAA,CAAAwB,MAAA,CAAAC,WAAA,kBAAA9B,CAAA,QAAA2B,CAAA,GAAA3B,CAAA,CAAA+B,IAAA,CAAA1B,CAAA,EAAAD,CAAA,uCAAAuB,CAAA,SAAAA,CAAA,YAAAK,SAAA,yEAAA5B,CAAA,GAAA6B,MAAA,GAAAC,MAAA,EAAA7B,CAAA;AAAA,SAAA8B,yBAAAnC,CAAA,EAAAK,CAAA,gBAAAL,CAAA,iBAAAS,CAAA,EAAAL,CAAA,EAAAuB,CAAA,GAAAS,6BAAA,CAAApC,CAAA,EAAAK,CAAA,OAAAC,MAAA,CAAAE,qBAAA,QAAA6B,CAAA,GAAA/B,MAAA,CAAAE,qBAAA,CAAAR,CAAA,QAAAI,CAAA,MAAAA,CAAA,GAAAiC,CAAA,CAAApB,MAAA,EAAAb,CAAA,IAAAK,CAAA,GAAA4B,CAAA,CAAAjC,CAAA,UAAAC,CAAA,CAAAiC,OAAA,CAAA7B,CAAA,QAAA8B,oBAAA,CAAAR,IAAA,CAAA/B,CAAA,EAAAS,CAAA,MAAAkB,CAAA,CAAAlB,CAAA,IAAAT,CAAA,CAAAS,CAAA,aAAAkB,CAAA;AAAA,SAAAS,8BAAAhC,CAAA,EAAAJ,CAAA,gBAAAI,CAAA,iBAAAC,CAAA,gBAAAgC,CAAA,IAAAjC,CAAA,SAAAoC,cAAA,CAAAT,IAAA,CAAA3B,CAAA,EAAAiC,CAAA,gBAAArC,CAAA,CAAAsC,OAAA,CAAAD,CAAA,aAAAhC,CAAA,CAAAgC,CAAA,IAAAjC,CAAA,CAAAiC,CAAA,YAAAhC,CAAA;AA0H/C,MAAMoC,YAAY,GAAG;EACnBC,OAAO,EAAE;AACX,CAAC;AAEc,SAASC,OAAOA,CAACC,UAA2B,EAAE;EAC3D,OAAOrD,MAAA,CAAAW,OAAA,CAAA2C,aAAA,CAAChD,MAAA,CAAAK,OAAK,EAAK4C,aAAa,CAACF,UAAU,CAAI,CAAC;AACjD;AAEO,SAASE,aAAaA,CAC3BF,UAA2B,EACN;EACrB,MAAMG,OAAO,GAAGC,cAAK,CAACC,UAAU,CAACC,gBAAO,CAAC;EAGzC,MAAMC,KAAK,GAAG,IAAAC,uCAAsB,EAClCR,UAAU,EACVH,YAAY,EACZM,OAAO,CAACJ,OACV,CAAC;EAED,MAAM;MACJU,OAAO;MACPC,QAAQ,GAAG,CAACH,KAAK,CAACI,MAAM;MACxBA,MAAM;MACNC,aAAa;MACbC,SAAS;MACTC,eAAe;MACfC,UAAU;MACVC,OAAO;MACPC,QAAQ;MAERC,SAAS;MACTC,QAAQ;MAERC,OAAO;MACPC,UAAU;MACVC;IAGF,CAAC,GAAGf,KAAK;IADJgB,UAAU,GAAAhC,wBAAA,CACXgB,KAAK,EAAApD,SAAA;EAET,MAAMqE,WAAW,GAAGpB,cAAK,CAACqB,MAAM,CAAc,CAAC;EAC/C,MAAMC,UAAU,GAAGT,QAAQ,IAAIK,SAAS,IAAIE,WAAW;EAEvD,OAAO9D,MAAM,CAACiE,MAAM,CAAAxD,aAAA,CAAAA,aAAA,KACfoD,UAAU;IACbL,SAAS,EAAE,IAAAU,mBAAU,8BAEHnB,OAAO,GAAGA,OAAO,GAAGY,UAAU,IAAI,SAAS,IAG3DH,SAAS,EAFTE,OAAO,IACL,wBAAwB,IAAAS,uBAAM,EAACT,OAAO,CAAC,GAAG,OAAO,GAAGA,OAAO,EAE/D,CAAC;IACDU,KAAK,EAAA3D,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,CAAAA,aAAA,KACA4D,YAAY,CACbrB,QAAQ,EACR,UAAU,EACT9B,KAAK,IAAK,mBAAmBA,KAAK,GAAG,IAAI,GAAG,KAAK,GACpD,CAAC,GACEmD,YAAY,CAACpB,MAAM,EAAE,QAAQ,EAAG/B,KAAK,IAAMA,KAAK,GAAG,GAAG,GAAG,GAAI,CAAC,GAC9DmD,YAAY,CAACnB,aAAa,EAAE,gBAAgB,EAAGhC,KAAK,IACrD,OAAOA,KAAK,KAAK,SAAS,GACtBA,KAAK,IAAI,8BAA8B,GACvCA,KAAK,CACFoD,GAAG,CAAEC,CAAC,IAAMA,CAAC,GAAG,8BAA8B,GAAG,GAAI,CAAC,CACtDC,IAAI,CAAC,GAAG,CACjB,CAAC,GACEH,YAAY,CAAClB,SAAS,EAAE,YAAY,EAAGjC,KAAK,IAAK,IAAAuD,iBAAQ,EAACvD,KAAK,CAAC,CAAC,GACjEmD,YAAY,CAACjB,eAAe,EAAE,kBAAkB,EAAGlC,KAAK,IACzD,IAAAuD,iBAAQ,EAACvD,KAAK,CAChB,CAAC,GACEmD,YAAY,CACbhB,UAAU,EACV,aAAa,EACZnC,KAAK,IAAKA,KAAK,IAAI,uBACtB,CAAC,GACEmD,YAAY,CAACf,OAAO,EAAE,eAAe,EAAGpC,KAAK,IAC9C,OAAOA,KAAK,KAAK,SAAS,GACtBA,KAAK,IAAI,6BAA6B,GACtC,IAAAuD,iBAAQ,EAACvD,KAAK,CACpB,CAAC,GACE2C,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEO,KAAK,CACE;IACxBb,QAAQ,EAAES,UAAU;IACpBP;EAAQ,EACT,CAAC;AACJ;AAEA,SAASY,YAAYA,CACnBK,QAA+B,EAC/BC,IAAY,EACZC,aAA+C,EAC/C;EACA,IAAIC,KAAK,GAAGH,QAA6B;EAEzC,IACEG,KAAK,KAAK,IAAI,KACbC,KAAK,CAACC,OAAO,CAACF,KAAK,CAAC,IAAI,OAAOA,KAAK,KAAK,QAAQ,CAAC,EACnD;IACAA,KAAK,GAAG;MACNG,KAAK,EAAEN,QAAQ;MACfO,MAAM,EAAEP,QAAQ;MAChBQ,KAAK,EAAER;IACT,CAAsB;EACxB;EAEA,MAAMS,MAAM,GAAG,CAAC,CAAC;EAEjB,KAAK,MAAMC,IAAI,IAAIP,KAAK,EAAuB;IAAA,IAAAQ,MAAA;IAC7C,IAAI,SAAAA,MAAA,GAAOR,KAAK,cAAAQ,MAAA,uBAALA,MAAA,CAAQD,IAAI,CAAC,MAAK,WAAW,EAAE;MAAA,IAAAE,OAAA;MACxC,MAAMpE,KAAK,GAAG0D,aAAa,EAAAU,OAAA,GAACT,KAAK,cAAAS,OAAA,uBAALA,OAAA,CAAQF,IAAI,CAAC,CAAC;MAC1C,IAAI,OAAOlE,KAAK,KAAK,QAAQ,EAAE;QAC7BiE,MAAM,CAAC,KAAKR,IAAI,KAAKS,IAAI,EAAE,CAAC,GAAGlE,KAAK;MACtC;IACF;EACF;EAEA,OAAOiE,MAAM;AACf;AAEA9C,OAAO,CAACkD,KAAK,GAAG,SAAS;AACzBlD,OAAO,CAACmD,qBAAqB,GAAG,IAAI","ignoreList":[]}

package/cjs/components/section/style/dnb-section.css

@@ -19,6 +19,9 @@
   --width: 100vw;
   --height: 100%;
   --color-transparent: transparent;
+  --rounded-corner--small: 0;
+  --rounded-corner--medium: 0;
+  --rounded-corner--large: 0;
   color: var(--text-color, black);
   border-radius: var(--rounded-corner, 0);
 }
@@ -50,6 +53,7 @@
   --box-shadow: 99vw 0 0 0 currentcolor, 198vw 0 0 0 currentcolor,
     297vw 0 0 0 currentcolor, 396vw 0 0 0 currentcolor;
   box-shadow: var(--box-shadow);
+  border-radius: var(--rounded-corner, 0);
 }
 .dnb-section:not([style*="--breakout"]) {
   --breakout: var(--breakout--on);

package/cjs/components/section/style/dnb-section.min.css

@@ -1,4 +1,4 @@
-.dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.5rem;--outline:0 0 0 var(--outline-width,1px) var(--outline-color,transparent);--outline-none:0 0 0 0 transparent;--top:0;--left:-100vw;--width:100vw;--height:100%;--color-transparent:transparent;border-radius:var(--rounded-corner,0);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:before{border-radius:var(--rounded-corner,0);bottom:0;box-shadow:var(--drop-shadow,var(--outline-none)),var(--outline,var(--outline-none));content:"";left:0;position:absolute;right:0;top:0;z-index:-1}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);content:"";height:var(--height);left:var(--left);position:absolute;top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}.dnb-section[style*="--outset"].dnb-space[style]:not(.dnb-card){padding-left:calc(var(--padding-left)*(1 - var(--outset)));padding-right:calc(var(--padding-right)*(1 - var(--outset)))}.dnb-section[style*="--outset"]:before{background-color:inherit;margin-left:calc(var(--outset-left, var(--padding-left))*-1*var(--outset));margin-right:calc(var(--outset-right, var(--padding-right))*-1*var(--outset))}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--outset:var(--outset--small,var(--outset--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--drop-shadow:var(--drop-shadow--small);--rounded-corner:var(
+.dnb-section{--breakout--on:visible;--breakout--off:hidden;--rounded-corner--value:0.5rem;--outline:0 0 0 var(--outline-width,1px) var(--outline-color,transparent);--outline-none:0 0 0 0 transparent;--top:0;--left:-100vw;--width:100vw;--height:100%;--color-transparent:transparent;--rounded-corner--small:0;--rounded-corner--medium:0;--rounded-corner--large:0;border-radius:var(--rounded-corner,0);color:var(--text-color,#000);display:flow-root;position:relative}.dnb-section[style*="--background-color"]{background-color:var(--background-color,#fff)}.dnb-section:before{bottom:0;box-shadow:var(--drop-shadow,var(--outline-none)),var(--outline,var(--outline-none));left:0;right:0;top:0;z-index:-1}.dnb-section:after,.dnb-section:before{border-radius:var(--rounded-corner,0);content:"";position:absolute}.dnb-section:after{--box-shadow:99vw 0 0 0 currentcolor,198vw 0 0 0 currentcolor,297vw 0 0 0 currentcolor,396vw 0 0 0 currentcolor;background-color:currentcolor;box-shadow:var(--box-shadow);color:var(--background-color,currentcolor);height:var(--height);left:var(--left);top:var(--top);visibility:var(--breakout,hidden);width:var(--width);z-index:-15}.dnb-section:not([style*="--breakout"]){--breakout:var(--breakout--on)}.dnb-section[style*="--outset"].dnb-space[style]:not(.dnb-card){padding-left:calc(var(--padding-left)*(1 - var(--outset)));padding-right:calc(var(--padding-right)*(1 - var(--outset)))}.dnb-section[style*="--outset"]:before{background-color:inherit;margin-left:calc(var(--outset-left, var(--padding-left))*-1*var(--outset));margin-right:calc(var(--outset-right, var(--padding-right))*-1*var(--outset))}@media screen and (max-width:60em){.dnb-section{--breakout:var(--breakout--small,var(--breakout--fallback));--outset:var(--outset--small,var(--outset--fallback));--background-color--value:var(--background-color--small);--text-color--value:var(--text-color--small);--outline-color:var(--outline-color--small);--drop-shadow:var(--drop-shadow--small);--rounded-corner:var(
       --rounded-corner--small,var(--rounded-corner--fallback)
     )}}@media screen and (max-width:60em) and (min-width:40.00625em){.dnb-section{--breakout:var(--breakout--medium,var(--breakout--fallback));--outset:var(--outset--medium,var(--outset--fallback));--background-color--value:var(--background-color--medium);--text-color--value:var(--text-color--medium);--outline-color:var(--outline-color--medium);--drop-shadow:var(--drop-shadow--medium);--rounded-corner:var(
       --rounded-corner--medium,var(--rounded-corner--fallback)

package/cjs/components/section/style/dnb-section.scss

@@ -23,6 +23,10 @@
   --width: 100vw;
   --height: 100%;
   --color-transparent: transparent;
+  // reset to prevent inheriting from parent
+  --rounded-corner--small: 0;
+  --rounded-corner--medium: 0;
+  --rounded-corner--large: 0;
 
   color: var(--text-color, black);
   border-radius: var(--rounded-corner, 0);
@@ -61,6 +65,7 @@
     // we use box-shadow to avoid a horizontal scrollbar
     // We lower the left position, so we get an overlap
     box-shadow: var(--box-shadow);
+    border-radius: var(--rounded-corner, 0);
   }
 
   &:not([style*='--breakout']) {

package/cjs/components/step-indicator/StepIndicator.d.ts

@@ -8,7 +8,7 @@ import { StepIndicatorContextValues } from './StepIndicatorContext';
 import type { SpacingProps } from '../../shared/types';
 import type { SkeletonShow } from '../Skeleton';
 import type { StepIndicatorItemProps, StepItemWrapper } from './StepIndicatorItem';
-import { StepIndicatorTriggerButtonProps } from './StepIndicatorTriggerButton';
+import { FormStatusState, FormStatusText } from '../form-status/FormStatus';
 export type StepIndicatorMode = 'static' | 'strict' | 'loose';
 export type StepIndicatorDataItem = Pick<StepIndicatorItemProps, 'title' | 'is_current' | 'inactive' | 'disabled' | 'status' | 'status_state' | 'on_click' | 'on_render'>;
 export type StepIndicatorData = string | string[] | StepIndicatorDataItem[];
@@ -19,8 +19,11 @@ export type StepIndicatorMouseEvent = {
     current_step: number;
 };
 export type StepIndicatorRenderCallback = {
+    /** A component that will render the item with the correct props. */
     StepItem: typeof StepItemWrapper;
+    /** Element that was originally going to be rendered */
     element: React.ReactNode;
+    /** @deprecated never has values */
     attributes: React.HTMLProps<HTMLElement>;
     props: StepIndicatorItemProps;
     context: StepIndicatorContextValues;
@@ -28,6 +31,7 @@ export type StepIndicatorRenderCallback = {
 export type StepIndicatorProps = Omit<React.HTMLProps<HTMLAnchorElement>, 'ref' | 'data'> & SpacingProps & {
     /**
      * <em>(required with `<StepIndicator.Sidebar />`)</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.
+     * @deprecated StepIndicator.Sidebar variant is no longer supported
      */
     sidebar_id?: string;
     /**
@@ -57,6 +61,7 @@ export type StepIndicatorProps = Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'
      * `%step` is used to place the current step into the text
      * `%count` is used to place the step total into the text
      *  Defaults to `You are on step %step of %count`
+     * @deprecated only `step_title`is used
      */
     step_title_extended?: string;
     /**
@@ -73,6 +78,7 @@ export type StepIndicatorProps = Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'
     on_click?: ({ event, item, current_step, currentStep, }: StepIndicatorMouseEvent) => void;
     /**
      * Callback function to manipulate or wrap every item. Has to return a React Node. You receive an object you can use in your custom HOC `{ StepItem, element, attributes, props, context }`.
+     * @deprecated no longer does anything other than the step item `title` prop
      */
     on_item_render?: ({ StepItem, element, attributes, props, context, }: StepIndicatorRenderCallback) => React.ReactNode;
     /**
@@ -80,19 +86,31 @@ export type StepIndicatorProps = Omit<React.HTMLProps<HTMLAnchorElement>, 'ref'
      */
     on_change?: ({ event, item, current_step, currentStep, }: StepIndicatorMouseEvent) => void;
     /**
-     * The props for the trigger button.
-     * Used internally to pass the props such as a status to the trigger button.
+     * Status text. Status is only shown if this prop has text. Defaults to `undefined`
      */
-    triggerButtonProps?: StepIndicatorTriggerButtonProps;
+    status?: FormStatusText;
+    /**
+     * The type of status for the `status` prop. Is either `info`, `error` or `warn`.
+     * Defaults to `warn`.
+     */
+    status_state?: FormStatusState;
     /**
      * If set to `true`, the height animation on the step items and the drawer button will be omitted. Defaults to `false`.
      */
     no_animation?: boolean;
+    /**
+     * Set to `true` to have the list be expanded initially. Defaults to `false`.
+     */
+    expandedInitially?: boolean;
+    /**
+     * Whether or not to break out (using negative margins) on larger screens. Defaults to `false`.
+     */
+    outset?: boolean;
     skeleton?: SkeletonShow;
     className?: string;
     children?: React.ReactNode;
 };
-declare function StepIndicator({ data, skeleton, current_step, hide_numbers, no_animation, ...restOfProps }: StepIndicatorProps): import("react/jsx-runtime").JSX.Element;
+declare function StepIndicator({ status, status_state, data, skeleton, current_step, hide_numbers, no_animation, expandedInitially, ...restOfProps }: StepIndicatorProps): import("react/jsx-runtime").JSX.Element;
 declare namespace StepIndicator {
     var Sidebar: typeof StepIndicatorSidebar;
     var _supportsSpacingProps: boolean;