@helsenorge/designsystem-react 2.11.1 → 2.11.3

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+## [2.11.2](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.11.1&targetVersion=GTv2.11.2) (2023-01-12)
+
+
+### Bug Fixes
+
+*  endrer kontrastfarge ([7aae4c3](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/7aae4c3239afe9187d7515ca2d8bd9e5f9808425)), closes [#290655](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/290655)
+*  listheader mapping tar hensyn til undefined recursive children ([429e51b](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/429e51bf7eebbafeef19ca5d76c72957ab9ab402)), closes [#293178](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/293178)
+
+## [2.11.1](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.10.1&targetVersion=GTv2.11.1) (2023-01-06)
+
+
+### Features
+
+*  legger til props til Input ([7951a84](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/7951a84f5af1dc7c432456e3ebf26d4227774cf8)), closes [#222638](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/222638)
+* **designsystem:**  aria-required for select ([4415849](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/4415849b74a53565a7af459091a915e0f6d01d90)), closes [#291043](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/291043)
+
+
+### Bug Fixes
+
+*  endrer farge på tekst. Gir bedre kontrast ([e29be2b](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/e29be2b7dc784ea57daabb20d7ce08c8a017708e)), closes [#290655](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/290655)
+
 ## [2.10.1](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.10.0&targetVersion=GTv2.10.1) (2023-01-03)
 
 

package/ListHeader.js

@@ -1,2 +1,2 @@
-import s from"react";import m from"classnames";import{A as I}from"./Avatar.js";import{B as L}from"./Badge.js";import{L as S}from"./ListHeaderText.js";import e from"./components/ListHeader/styles.module.scss";import{useBreakpoint as T,Breakpoint as A}from"./hooks/useBreakpoint.js";import{Icon as B}from"./components/Icons/Icon.js";import{IconSize as C}from"./constants.js";import{isComponent as k}from"./utils/component.js";const K=(o,_,d,l,i)=>k(o,f)?s.cloneElement(o,{chevronIcon:_,icon:i,isHovered:d,size:l}):o&&s.createElement(f,{chevronIcon:_,icon:i,isHovered:d,size:l},o),v=(o,_=!1)=>{var p,g;let d,l=[],i,c=[],h=[];s.Children.map(o,a=>{a!==null&&(a.type===I?d=a:a.type===S?l.push(a):a.type===L?i=a:typeof a=="string"?c.push(a):h.push(a))});const r=d!==void 0||l.length>0||i!==void 0&&c.length>0;return _||r||h.length===0?{avatarChild:d,listHeaderTextChildren:l,badgeChild:i,stringChildren:c,remainingChildren:h}:v((g=(p=h[0])==null?void 0:p.props)==null?void 0:g.children,!0)},f=s.forwardRef((o,_)=>{const{className:d="",chevronIcon:l,children:i,icon:c,isHovered:h,size:r,testId:p}=o,g=T(),a=r!=="small"&&!!(l||c),t=typeof i=="string",n=v(i),b=n.avatarChild||n.listHeaderTextChildren&&n.listHeaderTextChildren.length>0||n.remainingChildren&&n.remainingChildren.length>0,u=m(e["list-header"],{[e["list-header--for-element-content"]]:!t,[e["list-header--top-align-content"]]:b},d),E=m(e["list-header__badge"],{[e["list-header__badge--for-string-content"]]:t,[e["list-header__badge--right"]]:!t,[e["list-header__badge--"+r]]:!t&&r}),N=m(e["list-header__chevron"],{[e["list-header__chevron--for-string-content"]]:t,[e["list-header__chevron--right"]]:!n.badgeChild,[e["list-header__chevron--"+r]]:!t&&r}),x=m(e["list-header__content"],{[e["list-header__content--string"]]:t,[e["list-header__content--element"]]:!t,[e["list-header__content--spacing"]]:!n.avatarChild&&!c}),H=m(e["list-header__icon"],{[e["list-header__icon--for-string-content"]]:t,[e["list-header__icon--for-element-content"]]:!t,[e["list-header__icon--for-element-content--"+r]]:!t&&r}),y=m(e["list-header__avatar"],{[e["list-header__avatar--for-string-content"]]:t,[e["list-header__avatar--for-element-content"]]:!t,[e["list-header__avatar--for-element-content--"+r]]:!t&&r});return s.createElement("div",{"data-testid":p,className:u},a&&c&&s.createElement("span",{className:H},s.cloneElement(c,{size:g===A.xs?C.XSmall:C.Small,isHovered:h})),r!=="small"&&n.avatarChild&&s.createElement("span",{className:y},n.avatarChild),s.createElement("span",{className:x},n.listHeaderTextChildren,n.stringChildren,n.remainingChildren),n.badgeChild&&s.createElement("span",{className:E},n.badgeChild),a&&l&&s.createElement("span",{className:N},s.createElement(B,{svgIcon:l,isHovered:h,size:C.XSmall})))});export{f as L,v as m,K as r};
+import r from"react";import h from"classnames";import{A as S}from"./Avatar.js";import{B as T}from"./Badge.js";import{L as k}from"./ListHeaderText.js";import t from"./components/ListHeader/styles.module.scss";import{useBreakpoint as A,Breakpoint as B}from"./hooks/useBreakpoint.js";import{Icon as R}from"./components/Icons/Icon.js";import{IconSize as f}from"./constants.js";import{isComponent as z}from"./utils/component.js";const O=(o,p,d,c,s,l)=>z(o,v)?r.cloneElement(o,{chevronIcon:d,icon:l,isHovered:c,size:s}):o&&r.createElement(v,{titleHtmlMarkup:p,chevronIcon:d,icon:l,isHovered:c,size:s},o),u=(o,p=!1)=>{var g,C,m,n;let d,c=[],s,l=[],i=[];r.Children.map(o,e=>{e===null||typeof e>"u"||(e.type===S?d=e:e.type===k?c.push(e):e.type===T?s=e:typeof e=="string"?l.push(e):i.push(e))});const _=d!==void 0||c.length>0||s!==void 0&&l.length>0,a=i.length===0||typeof((C=(g=i[0])==null?void 0:g.props)==null?void 0:C.children)>"u";return p||_||a?{avatarChild:d,listHeaderTextChildren:c,badgeChild:s,stringChildren:l,remainingChildren:i}:u((n=(m=i[0])==null?void 0:m.props)==null?void 0:n.children,!0)},v=r.forwardRef((o,p)=>{const{className:d="",titleHtmlMarkup:c="h2",chevronIcon:s,children:l,icon:i,isHovered:_,size:a,testId:g}=o,C=A(),m=a!=="small"&&!!(s||i),n=typeof l=="string",e=u(l),b=e.avatarChild||e.listHeaderTextChildren&&e.listHeaderTextChildren.length>0||e.remainingChildren&&e.remainingChildren.length>0,E=h(t["list-header"],{[t["list-header--for-element-content"]]:!n,[t["list-header--top-align-content"]]:b},d),N=h(t["list-header__badge"],{[t["list-header__badge--for-string-content"]]:n,[t["list-header__badge--right"]]:!n,[t["list-header__badge--"+a]]:!n&&a}),y=h(t["list-header__chevron"],{[t["list-header__chevron--for-string-content"]]:n,[t["list-header__chevron--right"]]:!e.badgeChild,[t["list-header__chevron--"+a]]:!n&&a}),H=h(t["list-header__content"],{[t["list-header__content--string"]]:n,[t["list-header__content--element"]]:!n,[t["list-header__content--spacing"]]:!e.avatarChild&&!i}),x=h(t["list-header__icon"],{[t["list-header__icon--for-string-content"]]:n,[t["list-header__icon--for-element-content"]]:!n,[t["list-header__icon--for-element-content--"+a]]:!n&&a}),I=h(t["list-header__avatar"],{[t["list-header__avatar--for-string-content"]]:n,[t["list-header__avatar--for-element-content"]]:!n,[t["list-header__avatar--for-element-content--"+a]]:!n&&a}),L=c;return r.createElement("div",{"data-testid":g,className:E},m&&i&&r.createElement("span",{className:x},r.cloneElement(i,{size:C===B.xs?f.XSmall:f.Small,isHovered:_})),a!=="small"&&e.avatarChild&&r.createElement("span",{className:I},e.avatarChild),r.createElement("div",{className:H},e.listHeaderTextChildren,!!e.stringChildren.length&&r.createElement(L,{className:t["list-header__title"]},e.stringChildren),e.remainingChildren),e.badgeChild&&r.createElement("span",{className:N},e.badgeChild),m&&s&&r.createElement("span",{className:y},r.createElement(R,{svgIcon:s,isHovered:_,size:f.XSmall})))});export{v as L,u as m,O as r};
 //# sourceMappingURL=ListHeader.js.map

package/ListHeader.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeader.js","sources":["../src/components/ListHeader/ListHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport Avatar, { AvatarProps, AvatarType } from '../Avatar';\nimport Badge, { BadgeProps, BadgeType } from '../Badge';\nimport ListHeaderText, { ListHeaderTextProps, ListHeaderTextType } from './ListHeaderText/ListHeaderText';\n\nimport styles from './styles.module.scss';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\nimport Icon, { IconSize, SvgIcon } from '../Icons';\nimport { isComponent } from '../../utils/component';\n\nexport type ListHeaderSize = 'small' | 'medium' | 'large';\n\nexport interface ListHeaderType extends React.ForwardRefExoticComponent<ListHeaderProps & React.RefAttributes<HTMLLIElement>> {\n  Avatar?: AvatarType;\n  Badge?: BadgeType;\n  ListHeaderText?: ListHeaderTextType;\n}\n\nexport const renderListHeader = (\n  element: React.ReactNode,\n  chevronIcon: SvgIcon,\n  isHovered: boolean,\n  size: ListHeaderSize,\n  icon?: React.ReactElement\n) => {\n  return isComponent<ListHeaderProps>(element, ListHeader)\n    ? React.cloneElement(element as React.ReactElement<ListHeaderProps>, {\n        chevronIcon: chevronIcon,\n        icon: icon,\n        isHovered: isHovered,\n        size: size,\n      })\n    : element && (\n        <ListHeader chevronIcon={chevronIcon} icon={icon} isHovered={isHovered} size={size}>\n          {element}\n        </ListHeader>\n      );\n};\n\nexport interface ListHeaderProps {\n  /** Adds custom classes to the ListHeader element. */\n  className?: string;\n  /** Chevron to render inside of the ListHeader */\n  chevronIcon?: SvgIcon;\n  /** Children to be rendered inside of ListHeader */\n  children: React.ReactNode;\n  /** icon to be rendered inside of ListHeader */\n  icon?: React.ReactElement;\n  /** whether or not the parent is hovered */\n  isHovered?: boolean;\n  /** Changes size of the ListHeader. */\n  size?: ListHeaderSize;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const mapChildren = (\n  children: React.ReactNode,\n  isJsxChild = false\n): {\n  avatarChild?: AvatarProps;\n  listHeaderTextChildren: Array<ListHeaderTextProps>;\n  badgeChild?: BadgeProps;\n  stringChildren: Array<string>;\n  remainingChildren: Array<any>;\n} => {\n  let avatarChild: AvatarProps | undefined = undefined;\n  let listHeaderTextChildren: Array<ListHeaderTextProps> = [];\n  let badgeChild: BadgeProps | undefined = undefined;\n  let stringChildren: Array<string> = [];\n  let remainingChildren: Array<any> = [];\n\n  React.Children.map(children, (child: React.ReactNode | React.ReactElement<string>) => {\n    if (child === null) return;\n    if ((child as React.ReactElement<AvatarType>).type === Avatar) {\n      avatarChild = child as AvatarProps;\n    } else if ((child as React.ReactElement<ListHeaderTextType>).type === ListHeaderText) {\n      listHeaderTextChildren.push(child as ListHeaderTextProps);\n    } else if ((child as React.ReactElement<BadgeType>).type === Badge) {\n      badgeChild = child as BadgeProps;\n    } else if (typeof child === 'string') {\n      stringChildren.push(child);\n    } else {\n      remainingChildren.push(child);\n    }\n  });\n\n  // Dette og recursive mapChildren under(gjøres en gang) er for å passe på at jsx children også sjekkes for Avatar og liknende innhold.\n  // Slik opprettholder vi stylingen i tilfeller hvor vertikaler har wrappet elementer i en parent span eller div.\n  const hasSpecialChildren =\n    avatarChild !== undefined || listHeaderTextChildren.length > 0 || (badgeChild !== undefined && stringChildren.length > 0);\n\n  return isJsxChild || hasSpecialChildren || remainingChildren.length === 0\n    ? { avatarChild, listHeaderTextChildren, badgeChild, stringChildren, remainingChildren }\n    : mapChildren(remainingChildren[0]?.props?.children, true);\n};\n\nexport const ListHeader: ListHeaderType = React.forwardRef((props: ListHeaderProps, ref: React.Ref<HTMLLIElement>) => {\n  const { className = '', chevronIcon, children, icon, isHovered, size, testId } = props;\n  const breakpoint = useBreakpoint();\n  const showChevronAndIcon = size !== 'small' && !!(chevronIcon || icon);\n  const contentIsString = typeof children === 'string';\n  const mappedChildren = mapChildren(children);\n  const topAlignContent =\n    mappedChildren.avatarChild ||\n    (mappedChildren.listHeaderTextChildren && mappedChildren.listHeaderTextChildren.length > 0) ||\n    (mappedChildren.remainingChildren && mappedChildren.remainingChildren.length > 0);\n\n  const listLabelClasses = cn(\n    styles['list-header'],\n    {\n      [styles['list-header--for-element-content']]: !contentIsString,\n      [styles['list-header--top-align-content']]: topAlignContent,\n    },\n    className\n  );\n  const badgeClasses = cn(styles['list-header__badge'], {\n    [styles['list-header__badge--for-string-content']]: contentIsString,\n    [styles['list-header__badge--right']]: !contentIsString,\n    [styles['list-header__badge--' + size]]: !contentIsString && size,\n  });\n  const chevronClasses = cn(styles['list-header__chevron'], {\n    [styles['list-header__chevron--for-string-content']]: contentIsString,\n    [styles['list-header__chevron--right']]: !mappedChildren.badgeChild,\n    [styles['list-header__chevron--' + size]]: !contentIsString && size,\n  });\n  const contentClasses = cn(styles['list-header__content'], {\n    [styles['list-header__content--string']]: contentIsString,\n    [styles['list-header__content--element']]: !contentIsString,\n    [styles['list-header__content--spacing']]: !mappedChildren.avatarChild && !icon,\n  });\n  const iconClasses = cn(styles['list-header__icon'], {\n    [styles['list-header__icon--for-string-content']]: contentIsString,\n    [styles['list-header__icon--for-element-content']]: !contentIsString,\n    [styles['list-header__icon--for-element-content--' + size]]: !contentIsString && size,\n  });\n  const avatarClasses = cn(styles['list-header__avatar'], {\n    [styles['list-header__avatar--for-string-content']]: contentIsString,\n    [styles['list-header__avatar--for-element-content']]: !contentIsString,\n    [styles['list-header__avatar--for-element-content--' + size]]: !contentIsString && size,\n  });\n\n  return (\n    <div data-testid={testId} className={listLabelClasses}>\n      {showChevronAndIcon && icon && (\n        <span className={iconClasses}>\n          {React.cloneElement(icon, {\n            size: breakpoint === Breakpoint.xs ? IconSize.XSmall : IconSize.Small,\n            isHovered,\n          })}\n        </span>\n      )}\n      {size !== 'small' && mappedChildren.avatarChild && <span className={avatarClasses}>{mappedChildren.avatarChild}</span>}\n      <span className={contentClasses}>\n        {mappedChildren.listHeaderTextChildren}\n        {mappedChildren.stringChildren}\n        {mappedChildren.remainingChildren}\n      </span>\n      {mappedChildren.badgeChild && <span className={badgeClasses}>{mappedChildren.badgeChild}</span>}\n      {showChevronAndIcon && chevronIcon && (\n        <span className={chevronClasses}>\n          <Icon svgIcon={chevronIcon} isHovered={isHovered} size={IconSize.XSmall} />\n        </span>\n      )}\n    </div>\n  );\n});\n\nexport default ListHeader;\n"],"names":["renderListHeader","element","chevronIcon","isHovered","size","icon","isComponent","ListHeader","React","mapChildren","children","isJsxChild","avatarChild","listHeaderTextChildren","badgeChild","stringChildren","remainingChildren","child","Avatar","ListHeaderText","Badge","hasSpecialChildren","_b","_a","props","ref","className","testId","breakpoint","useBreakpoint","showChevronAndIcon","contentIsString","mappedChildren","topAlignContent","listLabelClasses","cn","styles","badgeClasses","chevronClasses","contentClasses","iconClasses","avatarClasses","Breakpoint","IconSize","Icon"],"mappings":"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"}
+{"version":3,"file":"ListHeader.js","sources":["../src/components/ListHeader/ListHeader.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport Avatar, { AvatarProps, AvatarType } from '../Avatar';\nimport Badge, { BadgeProps, BadgeType } from '../Badge';\nimport ListHeaderText, { ListHeaderTextProps, ListHeaderTextType } from './ListHeaderText/ListHeaderText';\n\nimport styles from './styles.module.scss';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\nimport Icon, { IconSize, SvgIcon } from '../Icons';\nimport { isComponent } from '../../utils/component';\nimport { TitleTags } from '../Title';\n\nexport type ListHeaderSize = 'small' | 'medium' | 'large';\n\nexport interface ListHeaderType extends React.ForwardRefExoticComponent<ListHeaderProps & React.RefAttributes<HTMLLIElement>> {\n  Avatar?: AvatarType;\n  Badge?: BadgeType;\n  ListHeaderText?: ListHeaderTextType;\n}\n\nexport const renderListHeader = (\n  element: React.ReactNode,\n  titleHtmlMarkup: TitleTags,\n  chevronIcon: SvgIcon,\n  isHovered: boolean,\n  size: ListHeaderSize,\n  icon?: React.ReactElement\n) => {\n  return isComponent<ListHeaderProps>(element, ListHeader)\n    ? React.cloneElement(element as React.ReactElement<ListHeaderProps>, {\n        chevronIcon: chevronIcon,\n        icon: icon,\n        isHovered: isHovered,\n        size: size,\n      })\n    : element && (\n        <ListHeader titleHtmlMarkup={titleHtmlMarkup} chevronIcon={chevronIcon} icon={icon} isHovered={isHovered} size={size}>\n          {element}\n        </ListHeader>\n      );\n};\n\nexport interface ListHeaderProps {\n  /** Adds custom classes to the ListHeader element. */\n  className?: string;\n  /** Chevron to render inside of the ListHeader */\n  chevronIcon?: SvgIcon;\n  /** Children to be rendered inside of ListHeader */\n  children: React.ReactNode;\n  /** Changes the underlying element of the title. Default: h2*/\n  titleHtmlMarkup?: TitleTags;\n  /** icon to be rendered inside of ListHeader */\n  icon?: React.ReactElement;\n  /** whether or not the parent is hovered */\n  isHovered?: boolean;\n  /** Changes size of the ListHeader. */\n  size?: ListHeaderSize;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const mapChildren = (\n  children: React.ReactNode,\n  isJsxChild = false\n): {\n  avatarChild?: AvatarProps;\n  listHeaderTextChildren: Array<ListHeaderTextProps>;\n  badgeChild?: BadgeProps;\n  stringChildren: Array<string>;\n  remainingChildren: Array<any>;\n} => {\n  let avatarChild: AvatarProps | undefined = undefined;\n  let listHeaderTextChildren: Array<ListHeaderTextProps> = [];\n  let badgeChild: BadgeProps | undefined = undefined;\n  let stringChildren: Array<string> = [];\n  let remainingChildren: Array<any> = [];\n\n  React.Children.map(children, (child: React.ReactNode | React.ReactElement<string>) => {\n    if (child === null || typeof child === 'undefined') return;\n    if ((child as React.ReactElement<AvatarType>).type === Avatar) {\n      avatarChild = child as AvatarProps;\n    } else if ((child as React.ReactElement<ListHeaderTextType>).type === ListHeaderText) {\n      listHeaderTextChildren.push(child as ListHeaderTextProps);\n    } else if ((child as React.ReactElement<BadgeType>).type === Badge) {\n      badgeChild = child as BadgeProps;\n    } else if (typeof child === 'string') {\n      stringChildren.push(child);\n    } else {\n      remainingChildren.push(child);\n    }\n  });\n\n  // Dette og recursive mapChildren under(gjøres en gang) er for å passe på at jsx children også sjekkes for Avatar og liknende innhold.\n  // Slik opprettholder vi stylingen i tilfeller hvor vertikaler har wrappet elementer i en parent span eller div.\n  const hasSpecialChildren =\n    avatarChild !== undefined || listHeaderTextChildren.length > 0 || (badgeChild !== undefined && stringChildren.length > 0);\n  const noRemainingRecursiveChildren = remainingChildren.length === 0 || typeof remainingChildren[0]?.props?.children === 'undefined';\n\n  return isJsxChild || hasSpecialChildren || noRemainingRecursiveChildren\n    ? { avatarChild, listHeaderTextChildren, badgeChild, stringChildren, remainingChildren }\n    : mapChildren(remainingChildren[0]?.props?.children, true);\n};\n\nexport const ListHeader: ListHeaderType = React.forwardRef((props: ListHeaderProps, ref: React.Ref<HTMLLIElement>) => {\n  const { className = '', titleHtmlMarkup = 'h2', chevronIcon, children, icon, isHovered, size, testId } = props;\n  const breakpoint = useBreakpoint();\n  const showChevronAndIcon = size !== 'small' && !!(chevronIcon || icon);\n  const contentIsString = typeof children === 'string';\n  const mappedChildren = mapChildren(children);\n  const topAlignContent =\n    mappedChildren.avatarChild ||\n    (mappedChildren.listHeaderTextChildren && mappedChildren.listHeaderTextChildren.length > 0) ||\n    (mappedChildren.remainingChildren && mappedChildren.remainingChildren.length > 0);\n\n  const listLabelClasses = cn(\n    styles['list-header'],\n    {\n      [styles['list-header--for-element-content']]: !contentIsString,\n      [styles['list-header--top-align-content']]: topAlignContent,\n    },\n    className\n  );\n  const badgeClasses = cn(styles['list-header__badge'], {\n    [styles['list-header__badge--for-string-content']]: contentIsString,\n    [styles['list-header__badge--right']]: !contentIsString,\n    [styles['list-header__badge--' + size]]: !contentIsString && size,\n  });\n  const chevronClasses = cn(styles['list-header__chevron'], {\n    [styles['list-header__chevron--for-string-content']]: contentIsString,\n    [styles['list-header__chevron--right']]: !mappedChildren.badgeChild,\n    [styles['list-header__chevron--' + size]]: !contentIsString && size,\n  });\n  const contentClasses = cn(styles['list-header__content'], {\n    [styles['list-header__content--string']]: contentIsString,\n    [styles['list-header__content--element']]: !contentIsString,\n    [styles['list-header__content--spacing']]: !mappedChildren.avatarChild && !icon,\n  });\n  const iconClasses = cn(styles['list-header__icon'], {\n    [styles['list-header__icon--for-string-content']]: contentIsString,\n    [styles['list-header__icon--for-element-content']]: !contentIsString,\n    [styles['list-header__icon--for-element-content--' + size]]: !contentIsString && size,\n  });\n  const avatarClasses = cn(styles['list-header__avatar'], {\n    [styles['list-header__avatar--for-string-content']]: contentIsString,\n    [styles['list-header__avatar--for-element-content']]: !contentIsString,\n    [styles['list-header__avatar--for-element-content--' + size]]: !contentIsString && size,\n  });\n  const CustomTag = titleHtmlMarkup;\n  return (\n    <div data-testid={testId} className={listLabelClasses}>\n      {showChevronAndIcon && icon && (\n        <span className={iconClasses}>\n          {React.cloneElement(icon, {\n            size: breakpoint === Breakpoint.xs ? IconSize.XSmall : IconSize.Small,\n            isHovered,\n          })}\n        </span>\n      )}\n      {size !== 'small' && mappedChildren.avatarChild && <span className={avatarClasses}>{mappedChildren.avatarChild}</span>}\n      <div className={contentClasses}>\n        {mappedChildren.listHeaderTextChildren}\n        {!!mappedChildren.stringChildren.length && (\n          <CustomTag className={styles['list-header__title']}>{mappedChildren.stringChildren}</CustomTag>\n        )}\n        {mappedChildren.remainingChildren}\n      </div>\n\n      {mappedChildren.badgeChild && <span className={badgeClasses}>{mappedChildren.badgeChild}</span>}\n      {showChevronAndIcon && chevronIcon && (\n        <span className={chevronClasses}>\n          <Icon svgIcon={chevronIcon} isHovered={isHovered} size={IconSize.XSmall} />\n        </span>\n      )}\n    </div>\n  );\n});\n\nexport default ListHeader;\n"],"names":["renderListHeader","element","titleHtmlMarkup","chevronIcon","isHovered","size","icon","isComponent","ListHeader","React","mapChildren","children","isJsxChild","avatarChild","listHeaderTextChildren","badgeChild","stringChildren","remainingChildren","child","Avatar","ListHeaderText","Badge","hasSpecialChildren","noRemainingRecursiveChildren","_b","_a","_d","_c","props","ref","className","testId","breakpoint","useBreakpoint","showChevronAndIcon","contentIsString","mappedChildren","topAlignContent","listLabelClasses","cn","styles","badgeClasses","chevronClasses","contentClasses","iconClasses","avatarClasses","CustomTag","Breakpoint","IconSize","Icon"],"mappings":"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"}

package/ListHeaderText.js

@@ -1,2 +1,2 @@
-import e from"react";import s from"classnames";import{S as T}from"./StatusDot.js";import t from"./components/ListHeader/styles.module.scss";const v=e.forwardRef((n,E)=>{const{firstText:m,firstTextEmphasised:p=!1,secondText:a=void 0,secondTextEmphasised:l=!1,subText:c=!1,statusDotVariant:r,className:o="",testId:d}=n,i=s(o,t["text-wrapper"],{[t["text-wrapper--sub-level"]]:c}),x=s({[t["text-wrapper__text--emphasised"]]:p}),f=s({[t["text-wrapper__text--emphasised"]]:l});return e.createElement("span",{"data-testid":d,className:i},r!==void 0&&e.createElement("span",null,e.createElement(T,{text:"",variant:r})),e.createElement("span",null,e.createElement("span",{className:x},m),a&&e.createElement("span",{className:f}," ",a)))});export{v as L};
+import e from"react";import s from"classnames";import{S as u}from"./StatusDot.js";import t from"./components/ListHeader/styles.module.scss";const C=e.forwardRef((m,h)=>{const{firstText:l,firstTextEmphasised:n=!1,secondText:a=void 0,secondTextEmphasised:p=!1,subText:c=!1,statusDotVariant:r,className:o="",testId:i,titleHtmlMarkup:d="span"}=m,x=s(o,t["text-wrapper"],{[t["text-wrapper--sub-level"]]:c}),f=s({[t["text-wrapper__text--emphasised"]]:n}),T=s({[t["text-wrapper__text--emphasised"]]:p}),E=d;return e.createElement("div",{"data-testid":i,className:x},r!==void 0&&e.createElement("span",null,e.createElement(u,{text:"",variant:r})),e.createElement(E,{className:t["list-header__title"]},e.createElement("span",{className:f},l),a&&e.createElement("span",{className:T},a)))});export{C as L};
 //# sourceMappingURL=ListHeaderText.js.map

package/ListHeaderText.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeaderText.js","sources":["../src/components/ListHeader/ListHeaderText/ListHeaderText.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport StatusDot, { StatusDotVariant } from '../../StatusDot';\n\nimport styles from '../styles.module.scss';\n\nexport type ListHeaderTextType = React.ForwardRefExoticComponent<ListHeaderTextProps & React.RefAttributes<HTMLLIElement>>;\n\nexport interface ListHeaderTextProps {\n  /** The first text in the ListHeaderText Component */\n  firstText: string;\n  /** Will style the first text as bold */\n  firstTextEmphasised?: boolean;\n  /** The second text in the ListHeaderText Component */\n  secondText?: string;\n  /** Will style the second text as bold */\n  secondTextEmphasised?: boolean;\n  /** Whether or not this ListHeaderText is a sub text */\n  subText?: boolean;\n  /** Decides the variant for the StatusDot */\n  statusDotVariant?: StatusDotVariant;\n  /** Adds custom classes to the ListHeaderText component. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const ListHeaderText: ListHeaderTextType = React.forwardRef((props: ListHeaderTextProps, ref: React.Ref<HTMLLIElement>) => {\n  const {\n    firstText,\n    firstTextEmphasised = false,\n    secondText = undefined,\n    secondTextEmphasised = false,\n    subText = false,\n    statusDotVariant,\n    className = '',\n    testId,\n  } = props;\n\n  const headerTextWrapperClasses = cn(className, styles['text-wrapper'], {\n    [styles['text-wrapper--sub-level']]: subText,\n  });\n  const firstHeaderTextSegmentClasses = cn({\n    [styles['text-wrapper__text--emphasised']]: firstTextEmphasised,\n  });\n  const secondHeaderTextSegmentClasses = cn({\n    [styles['text-wrapper__text--emphasised']]: secondTextEmphasised,\n  });\n\n  return (\n    <span data-testid={testId} className={headerTextWrapperClasses}>\n      {statusDotVariant !== undefined && (\n        <span>\n          <StatusDot text={''} variant={statusDotVariant} />\n        </span>\n      )}\n      <span>\n        <span className={firstHeaderTextSegmentClasses}>{firstText}</span>\n        {secondText && <span className={secondHeaderTextSegmentClasses}> {secondText}</span>}\n      </span>\n    </span>\n  );\n});\n\nexport default ListHeaderText;\n"],"names":["ListHeaderText","React","props","ref","firstText","firstTextEmphasised","secondText","secondTextEmphasised","subText","statusDotVariant","className","testId","headerTextWrapperClasses","cn","styles","firstHeaderTextSegmentClasses","secondHeaderTextSegmentClasses","StatusDot"],"mappings":"4IA4BO,MAAMA,EAAqCC,EAAM,WAAW,CAACC,EAA4BC,IAAkC,CAC1H,KAAA,CACJ,UAAAC,EACA,oBAAAC,EAAsB,GACtB,WAAAC,EAAa,OACb,qBAAAC,EAAuB,GACvB,QAAAC,EAAU,GACV,iBAAAC,EACA,UAAAC,EAAY,GACZ,OAAAC,CACE,EAAAT,EAEEU,EAA2BC,EAAGH,EAAWI,EAAO,gBAAiB,CACrE,CAACA,EAAO,4BAA6BN,CAAA,CACtC,EACKO,EAAgCF,EAAG,CACvC,CAACC,EAAO,mCAAoCT,CAAA,CAC7C,EACKW,EAAiCH,EAAG,CACxC,CAACC,EAAO,mCAAoCP,CAAA,CAC7C,EAED,OACGN,EAAA,cAAA,OAAA,CAAK,cAAaU,EAAQ,UAAWC,CAAA,EACnCH,IAAqB,QACnBR,EAAA,cAAA,OAAA,KACEA,EAAA,cAAAgB,EAAA,CAAU,KAAM,GAAI,QAASR,CAAA,CAAkB,CAClD,EAEDR,EAAA,cAAA,OAAA,KACEA,EAAA,cAAA,OAAA,CAAK,UAAWc,CAAgC,EAAAX,CAAU,EAC1DE,GAAeL,EAAA,cAAA,OAAA,CAAK,UAAWe,CAAA,EAAgC,IAAEV,CAAW,CAC/E,CACF,CAEJ,CAAC"}
+{"version":3,"file":"ListHeaderText.js","sources":["../src/components/ListHeader/ListHeaderText/ListHeaderText.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport StatusDot, { StatusDotVariant } from '../../StatusDot';\n\nimport styles from '../styles.module.scss';\nimport { TitleTags } from '../../Title';\n\nexport type ListHeaderTextType = React.ForwardRefExoticComponent<ListHeaderTextProps & React.RefAttributes<HTMLLIElement>>;\n\nexport interface ListHeaderTextProps {\n  /** The first text in the ListHeaderText Component */\n  firstText: string;\n  /** Will style the first text as bold */\n  firstTextEmphasised?: boolean;\n  /** The second text in the ListHeaderText Component */\n  secondText?: string;\n  /** Will style the second text as bold */\n  secondTextEmphasised?: boolean;\n  /** Whether or not this ListHeaderText is a sub text */\n  subText?: boolean;\n  /** Decides the variant for the StatusDot */\n  statusDotVariant?: StatusDotVariant;\n  /** Adds custom classes to the ListHeaderText component. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Changes the underlying element of the title. Default: span*/\n  titleHtmlMarkup?: TitleTags;\n}\n\nexport const ListHeaderText: ListHeaderTextType = React.forwardRef((props: ListHeaderTextProps, ref: React.Ref<HTMLLIElement>) => {\n  const {\n    firstText,\n    firstTextEmphasised = false,\n    secondText = undefined,\n    secondTextEmphasised = false,\n    subText = false,\n    statusDotVariant,\n    className = '',\n    testId,\n    titleHtmlMarkup = 'span',\n  } = props;\n\n  const headerTextWrapperClasses = cn(className, styles['text-wrapper'], {\n    [styles['text-wrapper--sub-level']]: subText,\n  });\n  const firstHeaderTextSegmentClasses = cn({\n    [styles['text-wrapper__text--emphasised']]: firstTextEmphasised,\n  });\n  const secondHeaderTextSegmentClasses = cn({\n    [styles['text-wrapper__text--emphasised']]: secondTextEmphasised,\n  });\n  const CustomTag = titleHtmlMarkup;\n\n  return (\n    <div data-testid={testId} className={headerTextWrapperClasses}>\n      {statusDotVariant !== undefined && (\n        <span>\n          <StatusDot text={''} variant={statusDotVariant} />\n        </span>\n      )}\n      <CustomTag className={styles['list-header__title']}>\n        <span className={firstHeaderTextSegmentClasses}>{firstText}</span>\n        {secondText && <span className={secondHeaderTextSegmentClasses}>{secondText}</span>}\n      </CustomTag>\n    </div>\n  );\n});\n\nexport default ListHeaderText;\n"],"names":["ListHeaderText","React","props","ref","firstText","firstTextEmphasised","secondText","secondTextEmphasised","subText","statusDotVariant","className","testId","titleHtmlMarkup","headerTextWrapperClasses","cn","styles","firstHeaderTextSegmentClasses","secondHeaderTextSegmentClasses","CustomTag","StatusDot"],"mappings":"4IA+BO,MAAMA,EAAqCC,EAAM,WAAW,CAACC,EAA4BC,IAAkC,CAC1H,KAAA,CACJ,UAAAC,EACA,oBAAAC,EAAsB,GACtB,WAAAC,EAAa,OACb,qBAAAC,EAAuB,GACvB,QAAAC,EAAU,GACV,iBAAAC,EACA,UAAAC,EAAY,GACZ,OAAAC,EACA,gBAAAC,EAAkB,MAChB,EAAAV,EAEEW,EAA2BC,EAAGJ,EAAWK,EAAO,gBAAiB,CACrE,CAACA,EAAO,4BAA6BP,CAAA,CACtC,EACKQ,EAAgCF,EAAG,CACvC,CAACC,EAAO,mCAAoCV,CAAA,CAC7C,EACKY,EAAiCH,EAAG,CACxC,CAACC,EAAO,mCAAoCR,CAAA,CAC7C,EACKW,EAAYN,EAElB,OACGX,EAAA,cAAA,MAAA,CAAI,cAAaU,EAAQ,UAAWE,CAAA,EAClCJ,IAAqB,QACnBR,EAAA,cAAA,OAAA,KACEA,EAAA,cAAAkB,EAAA,CAAU,KAAM,GAAI,QAASV,CAAkB,CAAA,CAClD,EAEDR,EAAA,cAAAiB,EAAA,CAAU,UAAWH,EAAO,qBAAA,EAC1Bd,EAAA,cAAA,OAAA,CAAK,UAAWe,CAAgC,EAAAZ,CAAU,EAC1DE,GAAeL,EAAA,cAAA,OAAA,CAAK,UAAWgB,CAAA,EAAiCX,CAAW,CAC9E,CACF,CAEJ,CAAC"}

package/components/Checkbox/styles.module.scss

@@ -6,7 +6,7 @@
 .checkbox-errors {
   font-size: $font-size-sm;
   font-weight: 600;
-  color: $cherry500;
+  color: $cherry600;
   margin-top: 0;
 }
 
@@ -16,7 +16,7 @@
   &--with-error {
     padding: getSpacer(s) getSpacer(2xs) getSpacer(m);
     background-color: $cherry100;
-    border-left: 0.25rem solid $cherry500;
+    border-left: 0.25rem solid $cherry600;
 
     @media (min-width: map-get($grid-breakpoints, md)) {
       padding: getSpacer(s) getSpacer(m) getSpacer(l);
@@ -155,14 +155,14 @@
     }
 
     &--invalid {
-      color: $cherry500;
+      color: $cherry600;
 
       :hover > & {
         background-color: $cherry100;
       }
 
       &.checkbox__icon-wrapper--checked {
-        color: $cherry500;
+        color: $cherry600;
       }
 
       :active > & {

package/components/ExpanderList/ExpanderList.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { PaletteNames } from '../../theme/palette';
 import { ListHeaderType } from '../ListHeader/ListHeader';
+import { TitleTags } from '../Title';
 export declare type ExpanderListColors = PaletteNames;
 export interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {
     ListHeader?: ListHeaderType;
@@ -42,6 +43,8 @@ declare type Modify<T, R> = Omit<T, keyof R> & R;
 declare type ExpanderProps = Modify<React.HTMLAttributes<HTMLButtonElement>, {
     id?: string;
     title: JSX.Element | string;
+    /** Changes the underlying element of the title. Default: span*/
+    titleHtmlMarkup?: TitleTags;
     children: React.ReactNode;
     className?: string;
     color?: ExpanderListColors;

package/components/ExpanderList/ExpanderList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExpanderList.d.ts","sourceRoot":"","sources":["../../../src/components/ExpanderList/ExpanderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAanD,OAAO,EAAE,cAAc,EAAoB,MAAM,0BAA0B,CAAC;AAI5E,oBAAY,kBAAkB,GAAG,YAAY,CAAC;AAC9C,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,yBAAyB,CAAC,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IACvH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,yBAAyB,CAAC,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACtI,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,oBAAY,mBAAmB,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;AAE9D,UAAU,iBAAiB;IACzB,yDAAyD;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gCAAgC;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,wCAAwC;IACxC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,6BAA6B;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,wCAAwC;IACxC,qGAAqG;IACrG,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sGAAsG;IACtG,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,sDAAsD;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,mBAAmB,CAAC;CAC/B;AAED,aAAK,MAAM,CAAC,CAAC,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;AAEzC,aAAK,aAAa,GAAG,MAAM,CACzB,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EACvC;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjF,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CACF,GACC,IAAI,CAAC,iBAAiB,EAAE,0BAA0B,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAC;AAsG7E,eAAO,MAAM,YAAY,sBA+FC,CAAC;AAK3B,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ExpanderList.d.ts","sourceRoot":"","sources":["../../../src/components/ExpanderList/ExpanderList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAE3D,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAanD,OAAO,EAAE,cAAc,EAAoB,MAAM,0BAA0B,CAAC;AAG5E,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,oBAAY,kBAAkB,GAAG,YAAY,CAAC;AAC9C,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,yBAAyB,CAAC,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IACvH,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B;AAED,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,yBAAyB,CAAC,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACtI,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,oBAAY,mBAAmB,GAAG,MAAM,GAAG,SAAS,GAAG,MAAM,CAAC;AAE9D,UAAU,iBAAiB;IACzB,yDAAyD;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gCAAgC;IAChC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,wCAAwC;IACxC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uDAAuD;IACvD,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,6BAA6B;IAC7B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,wCAAwC;IACxC,qGAAqG;IACrG,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sGAAsG;IACtG,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC,sDAAsD;IACtD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2BAA2B;IAC3B,OAAO,CAAC,EAAE,mBAAmB,CAAC;CAC/B;AAED,aAAK,MAAM,CAAC,CAAC,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC;AAEzC,aAAK,aAAa,GAAG,MAAM,CACzB,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,EACvC;IACE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;IAC5B,gEAAgE;IAChE,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IACjF,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAC1C,CACF,GACC,IAAI,CAAC,iBAAiB,EAAE,0BAA0B,GAAG,QAAQ,GAAG,SAAS,CAAC,CAAC;AAuG7E,eAAO,MAAM,YAAY,sBA+FC,CAAC;AAK3B,eAAe,YAAY,CAAC"}

package/components/ExpanderList/index.js

@@ -1,2 +1,2 @@
-import s,{useState as V,useRef as O,useEffect as k}from"react";import{useHover as J}from"../../hooks/useHover.js";import{usePrevious as Z}from"../../hooks/usePrevious.js";import{isElementInViewport as q}from"../../utils/viewport.js";import g from"classnames";import i from"./styles.module.scss";import{AnalyticsId as U,ZIndex as F}from"../../constants.js";import{useUuid as G}from"../../hooks/useUuid.js";import{useSticky as K}from"../../hooks/useSticky.js";import{mergeRefs as M}from"../../utils/refs.js";import{r as Q}from"../../ListHeader.js";import X from"../Icons/ChevronUp.js";import Y from"../Icons/ChevronDown.js";import"../../uuid.js";import"../../utils/environment.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";import"../../Avatar.js";import"../Icons/Icon.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../theme/palette.js";import"../../Badge.js";import"../Badge/styles.module.scss";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../StatusDot/styles.module.scss";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../../hooks/useBreakpoint.js";import"../ListHeader/styles.module.scss";import"../../utils/component.js";const B=s.forwardRef((l,w)=>{const{id:p,children:L,padding:N=!0,color:f="neutral",className:R="",icon:$,large:y=!1,title:d,expanded:m=!1,sticky:b,testId:W,handleExpanderClick:H,onExpand:u,renderChildrenWhenClosed:c,variant:a="line"}=l,[r,T]=V(m),_=Z(r),h=O(null),E=O(null),{isHovered:I}=J(E),{isOutsideWindow:j,isLeavingWindow:x,offsetHeight:t,contentWidth:e}=K(h,E),n=b&&r&&j,o=typeof d=="object",C=g(R,{[i["expander-list__item--"+a]]:a,[i["expander-list__item--jsx"]]:o}),A=g(i["expander-list-link"],i[`expander-list-link--${f}`],{[i["expander-list-link--fill"]]:a==="fill",[i["expander-list-link--closed"]]:!r,[i["expander-list-link--large"]]:y,[i["expander-list-link--jsx"]]:o,[i["expander-list-link--sticky"]]:n&&!x,[i["expander-list-link--absolute"]]:n&&x});k(()=>{m!==r&&T(m)},[m]),k(()=>{u&&r!==!!_&&u(r)},[r,u]);const z=()=>{if(!c&&!r)return null;const D=g(i["expander-list-link__main-content"],r&&i["expander-list-link__main-content--expanded"],N?i["expander-list-link__main-content--padding"]:"");return s.createElement("div",{className:D},L)};return s.createElement("li",{className:C,ref:M([w,h]),style:{paddingTop:n&&t?`${t}px`:void 0}},s.createElement("button",{type:"button",id:p,onClick:H,"data-testid":W,"data-analyticsid":U.ExpanderListExpander,className:A,ref:E,"aria-expanded":r,style:{zIndex:I||n?F.ExpanderTrigger:void 0,width:n&&e?`${e}px`:void 0}},Q(d,r?X:Y,I,y?"large":"medium",$)),z())}),P=l=>s.isValidElement(l)&&l.type===B,v=s.forwardRef((l,w)=>{const{children:p,childPadding:L=!0,large:N,isOpen:f=!1,renderChildrenWhenClosed:R=!1,color:$,className:y="",accordion:d=!1,topBorder:m=!0,bottomBorder:b=!0,sticky:W=!1,testId:H,variant:u}=l,[c,a]=V(),[r,T]=V(),_=G(),h=s.Children.count(p),E=g(i["expander-list"],y);function I(t,e){a(n=>d?{[e]:!(n!=null&&n[e])}:{...n,[e]:!(n!=null&&n[e])}),T(t.currentTarget)}const j=t=>g(i["expander-list__item"],{[i["expander-list__item--top"]]:t===0&&m,[i["expander-list__item--no-bottom"]]:t===h-1&&!b}),x=t=>`${_}-${t}`;return k(()=>{d&&r&&!q(r)&&r.scrollIntoView()},[d,r]),k(()=>{if(f){const t=x(0);a(e=>d?{[t]:!(e!=null&&e[t])}:{...e,[t]:!(e!=null&&e[t])})}},[f]),k(()=>{var t;if(!f){const e=(t=s.Children.map(p,n=>{if(P(n))return n}))==null?void 0:t.reduce((n,o,C)=>(typeof o.props.expanded<"u"&&(n[x(C)]=o.props.expanded),n),{});a({...c,...e})}},[p]),s.createElement("ul",{className:E,ref:w,"data-testid":H,"data-analyticsid":U.ExpanderList},s.Children.map(p,(t,e)=>{if(P(t)){const n=x(e),o=c==null?void 0:c[n],C=j(e);return s.cloneElement(t,{id:n,key:e,expanded:o,padding:L,color:$,large:N,sticky:W,"aria-expanded":o,className:C,handleExpanderClick:A=>I(A,`${_}-${e}`),renderChildrenWhenClosed:R,variant:u})}return t}))});v.Expander=B;B.displayName="ExpanderList.Expander";export{v as ExpanderList,v as default};
+import o,{useState as V,useRef as O,useEffect as k}from"react";import{useHover as M}from"../../hooks/useHover.js";import{usePrevious as Z}from"../../hooks/usePrevious.js";import{isElementInViewport as q}from"../../utils/viewport.js";import g from"classnames";import i from"./styles.module.scss";import{AnalyticsId as U,ZIndex as F}from"../../constants.js";import{useUuid as G}from"../../hooks/useUuid.js";import{useSticky as K}from"../../hooks/useSticky.js";import{mergeRefs as Q}from"../../utils/refs.js";import{r as X}from"../../ListHeader.js";import Y from"../Icons/ChevronUp.js";import v from"../Icons/ChevronDown.js";import"../../uuid.js";import"../../utils/environment.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";import"../../Avatar.js";import"../Icons/Icon.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../theme/palette.js";import"../../Badge.js";import"../Badge/styles.module.scss";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../StatusDot/styles.module.scss";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../../hooks/useBreakpoint.js";import"../ListHeader/styles.module.scss";import"../../utils/component.js";const B=o.forwardRef((p,w)=>{const{id:m,children:L,padding:N=!0,color:f="neutral",className:R="",icon:$,large:y=!1,title:l,titleHtmlMarkup:b="span",expanded:c=!1,sticky:H,testId:W,handleExpanderClick:T,onExpand:d,renderChildrenWhenClosed:u,variant:a="line"}=p,[r,_]=V(c),j=Z(r),h=O(null),E=O(null),{isHovered:I}=M(E),{isOutsideWindow:C,isLeavingWindow:n,offsetHeight:e,contentWidth:t}=K(h,E),s=H&&r&&C,x=typeof l=="object",A=g(R,{[i["expander-list__item--"+a]]:a,[i["expander-list__item--jsx"]]:x}),z=g(i["expander-list-link"],i[`expander-list-link--${f}`],{[i["expander-list-link--fill"]]:a==="fill",[i["expander-list-link--closed"]]:!r,[i["expander-list-link--large"]]:y,[i["expander-list-link--jsx"]]:x,[i["expander-list-link--sticky"]]:s&&!n,[i["expander-list-link--absolute"]]:s&&n});k(()=>{c!==r&&_(c)},[c]),k(()=>{d&&r!==!!j&&d(r)},[r,d]);const D=()=>{if(!u&&!r)return null;const J=g(i["expander-list-link__main-content"],r&&i["expander-list-link__main-content--expanded"],N?i["expander-list-link__main-content--padding"]:"");return o.createElement("div",{className:J},L)};return o.createElement("li",{className:A,ref:Q([w,h]),style:{paddingTop:s&&e?`${e}px`:void 0}},o.createElement("button",{type:"button",id:m,onClick:T,"data-testid":W,"data-analyticsid":U.ExpanderListExpander,className:z,ref:E,"aria-expanded":r,style:{zIndex:I||s?F.ExpanderTrigger:void 0,width:s&&t?`${t}px`:void 0}},X(l,b,r?Y:v,I,y?"large":"medium",$)),D())}),P=p=>o.isValidElement(p)&&p.type===B,S=o.forwardRef((p,w)=>{const{children:m,childPadding:L=!0,large:N,isOpen:f=!1,renderChildrenWhenClosed:R=!1,color:$,className:y="",accordion:l=!1,topBorder:b=!0,bottomBorder:c=!0,sticky:H=!1,testId:W,variant:T}=p,[d,u]=V(),[a,r]=V(),_=G(),j=o.Children.count(m),h=g(i["expander-list"],y);function E(n,e){u(t=>l?{[e]:!(t!=null&&t[e])}:{...t,[e]:!(t!=null&&t[e])}),r(n.currentTarget)}const I=n=>g(i["expander-list__item"],{[i["expander-list__item--top"]]:n===0&&b,[i["expander-list__item--no-bottom"]]:n===j-1&&!c}),C=n=>`${_}-${n}`;return k(()=>{l&&a&&!q(a)&&a.scrollIntoView()},[l,a]),k(()=>{if(f){const n=C(0);u(e=>l?{[n]:!(e!=null&&e[n])}:{...e,[n]:!(e!=null&&e[n])})}},[f]),k(()=>{var n;if(!f){const e=(n=o.Children.map(m,t=>{if(P(t))return t}))==null?void 0:n.reduce((t,s,x)=>(typeof s.props.expanded<"u"&&(t[C(x)]=s.props.expanded),t),{});u({...d,...e})}},[m]),o.createElement("ul",{className:h,ref:w,"data-testid":W,"data-analyticsid":U.ExpanderList},o.Children.map(m,(n,e)=>{if(P(n)){const t=C(e),s=d==null?void 0:d[t],x=I(e);return o.cloneElement(n,{id:t,key:e,expanded:s,padding:L,color:$,large:N,sticky:H,"aria-expanded":s,className:x,handleExpanderClick:A=>E(A,`${_}-${e}`),renderChildrenWhenClosed:R,variant:T})}return n}))});S.Expander=B;B.displayName="ExpanderList.Expander";export{S as ExpanderList,S as default};
 //# sourceMappingURL=index.js.map

package/components/ExpanderList/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/ExpanderList/ExpanderList.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { PaletteNames } from '../../theme/palette';\nimport { useHover } from '../../hooks/useHover';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { isElementInViewport } from '../../utils/viewport';\n\nimport classNames from 'classnames';\n\nimport expanderListStyles from './styles.module.scss';\nimport { AnalyticsId, ZIndex } from '../../constants';\nimport { useUuid } from '../../hooks/useUuid';\nimport { useSticky } from '../../hooks/useSticky';\n\nimport { mergeRefs } from '../../utils/refs';\nimport { ListHeaderType, renderListHeader } from '../ListHeader/ListHeader';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ChevronDown from '../Icons/ChevronDown';\n\nexport type ExpanderListColors = PaletteNames;\nexport interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {\n  ListHeader?: ListHeaderType;\n}\n\nexport interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {\n  Expander: ExpanderType;\n}\n\nexport type ExpanderListVariant = 'line' | 'outline' | 'fill';\n\ninterface ExpanderListProps {\n  /** Toggles accordion functionality for the expanders. */\n  accordion?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  bottomBorder?: boolean;\n  /** Items in the ExpanderList */\n  children: React.ReactNode;\n  /** Toggles padding of child elements */\n  childPadding?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the link list background color on hover. */\n  color?: ExpanderListColors;\n  /** Changes the font size. */\n  large?: boolean;\n  /** Opens the first item in the list. */\n  /** @deprecated Skal fases ut til fordel for å bruke expanded-prop på første ExpanderList.Expander */\n  isOpen?: boolean;\n  /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */\n  renderChildrenWhenClosed?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  topBorder?: boolean;\n  /** Stick expander trigger to top of screen while scrolling down */\n  sticky?: boolean;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets visual priority */\n  variant?: ExpanderListVariant;\n}\n\ntype Modify<T, R> = Omit<T, keyof R> & R;\n\ntype ExpanderProps = Modify<\n  React.HTMLAttributes<HTMLButtonElement>,\n  {\n    id?: string;\n    title: JSX.Element | string;\n    children: React.ReactNode;\n    className?: string;\n    color?: ExpanderListColors;\n    icon?: React.ReactElement;\n    padding?: boolean;\n    expanded?: boolean;\n    large?: boolean;\n    testId?: string;\n    handleExpanderClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n    /** Called when expander is open/closed. */\n    onExpand?: (isExpanded: boolean) => void;\n  }\n> &\n  Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'sticky' | 'variant'>;\n\nconst Expander: ExpanderType = React.forwardRef<HTMLLIElement, ExpanderProps>((props, ref) => {\n  const {\n    id,\n    children,\n    padding = true,\n    color = 'neutral',\n    className = '',\n    icon,\n    large = false,\n    title,\n    expanded = false,\n    sticky,\n    testId,\n    handleExpanderClick,\n    onExpand,\n    renderChildrenWhenClosed,\n    variant = 'line',\n  } = props;\n  const [isExpanded, setIsExpanded] = useState<boolean>(expanded);\n  const previousIsExpanded = usePrevious(isExpanded);\n  const expanderRef = useRef<HTMLLIElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const { isHovered } = useHover(triggerRef);\n\n  const { isOutsideWindow, isLeavingWindow, offsetHeight, contentWidth } = useSticky(expanderRef, triggerRef);\n  const isSticky = sticky && isExpanded && isOutsideWindow;\n  const isJsxTitle = typeof title === 'object';\n\n  const itemClasses = classNames(className, {\n    [expanderListStyles['expander-list__item--' + variant]]: variant,\n    [expanderListStyles['expander-list__item--jsx']]: isJsxTitle,\n  });\n\n  const expanderClasses = classNames(expanderListStyles['expander-list-link'], expanderListStyles[`expander-list-link--${color}`], {\n    [expanderListStyles['expander-list-link--fill']]: variant === 'fill',\n    [expanderListStyles['expander-list-link--closed']]: !isExpanded,\n    [expanderListStyles['expander-list-link--large']]: large,\n    [expanderListStyles['expander-list-link--jsx']]: isJsxTitle,\n    [expanderListStyles['expander-list-link--sticky']]: isSticky && !isLeavingWindow,\n    [expanderListStyles['expander-list-link--absolute']]: isSticky && isLeavingWindow,\n  });\n\n  useEffect(() => {\n    if (expanded !== isExpanded) {\n      setIsExpanded(expanded);\n    }\n  }, [expanded]);\n\n  useEffect(() => {\n    if (onExpand && isExpanded !== !!previousIsExpanded) {\n      onExpand(isExpanded);\n    }\n  }, [isExpanded, onExpand]);\n\n  const renderContent = () => {\n    if (!renderChildrenWhenClosed && !isExpanded) {\n      return null;\n    }\n\n    const mainContentClasses = classNames(\n      expanderListStyles['expander-list-link__main-content'],\n      isExpanded && expanderListStyles['expander-list-link__main-content--expanded'],\n      padding ? expanderListStyles['expander-list-link__main-content--padding'] : ''\n    );\n\n    return <div className={mainContentClasses}>{children}</div>;\n  };\n\n  return (\n    <li\n      className={itemClasses}\n      ref={mergeRefs([ref, expanderRef])}\n      style={{ paddingTop: isSticky && offsetHeight ? `${offsetHeight}px` : undefined }}\n    >\n      <button\n        type=\"button\"\n        id={id}\n        onClick={handleExpanderClick}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.ExpanderListExpander}\n        className={expanderClasses}\n        ref={triggerRef}\n        aria-expanded={isExpanded}\n        style={{\n          zIndex: isHovered || isSticky ? ZIndex.ExpanderTrigger : undefined,\n          width: isSticky && contentWidth ? `${contentWidth}px` : undefined,\n        }}\n      >\n        {renderListHeader(title, isExpanded ? ChevronUp : ChevronDown, isHovered, large ? 'large' : 'medium', icon)}\n      </button>\n      {renderContent()}\n    </li>\n  );\n});\n\ntype ActiveExpander = Record<string, boolean>;\n\nconst isExpanderComponent = (element: {} | null | undefined): element is React.ReactElement<ExpanderProps> =>\n  React.isValidElement<ExpanderProps>(element) && (element as React.ReactElement).type === Expander;\n\nexport const ExpanderList = React.forwardRef((props: ExpanderListProps, ref: React.Ref<HTMLUListElement>) => {\n  const {\n    children,\n    childPadding = true,\n    large,\n    isOpen = false,\n    renderChildrenWhenClosed = false,\n    color,\n    className = '',\n    accordion = false,\n    topBorder = true,\n    bottomBorder = true,\n    sticky = false,\n    testId,\n    variant,\n  } = props;\n  const [activeExpander, setActiveExpander] = useState<ActiveExpander>();\n  const [latestExpander, setLatestExpander] = useState<HTMLElement>();\n  const uuid = useUuid();\n  const childCount = React.Children.count(children);\n  const expanderListClasses = classNames(expanderListStyles['expander-list'], className);\n\n  function handleExpanderClick(event: React.MouseEvent<HTMLElement, MouseEvent>, id: string): void {\n    setActiveExpander(prevState => (accordion ? { [id]: !prevState?.[id] } : { ...prevState, [id]: !prevState?.[id] }));\n    setLatestExpander(event.currentTarget);\n  }\n\n  /** Returns the class modifier top when we want to show the top border and no-bottom when we don't want to show the bottom border */\n  const getExpanderItemClass = (index: number) => {\n    return classNames(expanderListStyles['expander-list__item'], {\n      [expanderListStyles['expander-list__item--top']]: index === 0 && topBorder,\n      [expanderListStyles['expander-list__item--no-bottom']]: index === childCount - 1 && !bottomBorder,\n    });\n  };\n\n  const getExpanderId = (index: number) => `${uuid}-${index}`;\n\n  useEffect(() => {\n    if (accordion && latestExpander && !isElementInViewport(latestExpander)) {\n      latestExpander.scrollIntoView();\n    }\n  }, [accordion, latestExpander]);\n\n  useEffect(() => {\n    if (isOpen) {\n      const id = getExpanderId(0);\n      setActiveExpander(prevState => (accordion ? { [id]: !prevState?.[id] } : { ...prevState, [id]: !prevState?.[id] }));\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      const newActiveExpander = React.Children.map(children, child => {\n        if (isExpanderComponent(child)) {\n          return child;\n        }\n      })?.reduce((acc, child, index) => {\n        // Expanded-status skal bare settes dersom prop er satt av den som bruker komponenten\n        if (typeof child.props.expanded !== 'undefined') {\n          acc[getExpanderId(index)] = child.props.expanded;\n        }\n        return acc;\n      }, {} as ActiveExpander);\n\n      setActiveExpander({ ...activeExpander, ...newActiveExpander });\n    }\n  }, [children]);\n\n  return (\n    <ul className={expanderListClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.ExpanderList}>\n      {React.Children.map(children, (child, index) => {\n        if (isExpanderComponent(child)) {\n          const id = getExpanderId(index);\n          const expanded = activeExpander?.[id];\n          const expanderItemClass = getExpanderItemClass(index);\n\n          return React.cloneElement(child as React.ReactElement<ExpanderProps>, {\n            id,\n            key: index,\n            expanded,\n            padding: childPadding,\n            color,\n            large,\n            sticky,\n            'aria-expanded': expanded,\n            className: expanderItemClass,\n            handleExpanderClick: (event: React.MouseEvent<HTMLElement>) => handleExpanderClick(event, `${uuid}-${index}`),\n            renderChildrenWhenClosed,\n            variant,\n          });\n        }\n        return child;\n      })}\n    </ul>\n  );\n}) as ExpanderListCompound;\n\nExpanderList.Expander = Expander;\nExpander.displayName = 'ExpanderList.Expander';\n\nexport default ExpanderList;\n"],"names":["Expander","React","props","ref","id","children","padding","color","className","icon","large","title","expanded","sticky","testId","handleExpanderClick","onExpand","renderChildrenWhenClosed","variant","isExpanded","setIsExpanded","useState","previousIsExpanded","usePrevious","expanderRef","useRef","triggerRef","isHovered","useHover","isOutsideWindow","isLeavingWindow","offsetHeight","contentWidth","useSticky","isSticky","isJsxTitle","itemClasses","classNames","expanderListStyles","expanderClasses","useEffect","renderContent","mainContentClasses","mergeRefs","AnalyticsId","ZIndex","renderListHeader","ChevronUp","ChevronDown","isExpanderComponent","element","ExpanderList","childPadding","isOpen","accordion","topBorder","bottomBorder","activeExpander","setActiveExpander","latestExpander","setLatestExpander","uuid","useUuid","childCount","expanderListClasses","event","prevState","getExpanderItemClass","index","getExpanderId","isElementInViewport","newActiveExpander","_a","child","acc","expanderItemClass"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/ExpanderList/ExpanderList.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport { PaletteNames } from '../../theme/palette';\nimport { useHover } from '../../hooks/useHover';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { isElementInViewport } from '../../utils/viewport';\n\nimport classNames from 'classnames';\n\nimport expanderListStyles from './styles.module.scss';\nimport { AnalyticsId, ZIndex } from '../../constants';\nimport { useUuid } from '../../hooks/useUuid';\nimport { useSticky } from '../../hooks/useSticky';\n\nimport { mergeRefs } from '../../utils/refs';\nimport { ListHeaderType, renderListHeader } from '../ListHeader/ListHeader';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ChevronDown from '../Icons/ChevronDown';\nimport { TitleTags } from '../Title';\n\nexport type ExpanderListColors = PaletteNames;\nexport interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {\n  ListHeader?: ListHeaderType;\n}\n\nexport interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {\n  Expander: ExpanderType;\n}\n\nexport type ExpanderListVariant = 'line' | 'outline' | 'fill';\n\ninterface ExpanderListProps {\n  /** Toggles accordion functionality for the expanders. */\n  accordion?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  bottomBorder?: boolean;\n  /** Items in the ExpanderList */\n  children: React.ReactNode;\n  /** Toggles padding of child elements */\n  childPadding?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the link list background color on hover. */\n  color?: ExpanderListColors;\n  /** Changes the font size. */\n  large?: boolean;\n  /** Opens the first item in the list. */\n  /** @deprecated Skal fases ut til fordel for å bruke expanded-prop på første ExpanderList.Expander */\n  isOpen?: boolean;\n  /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */\n  renderChildrenWhenClosed?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  topBorder?: boolean;\n  /** Stick expander trigger to top of screen while scrolling down */\n  sticky?: boolean;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets visual priority */\n  variant?: ExpanderListVariant;\n}\n\ntype Modify<T, R> = Omit<T, keyof R> & R;\n\ntype ExpanderProps = Modify<\n  React.HTMLAttributes<HTMLButtonElement>,\n  {\n    id?: string;\n    title: JSX.Element | string;\n    /** Changes the underlying element of the title. Default: span*/\n    titleHtmlMarkup?: TitleTags;\n    children: React.ReactNode;\n    className?: string;\n    color?: ExpanderListColors;\n    icon?: React.ReactElement;\n    padding?: boolean;\n    expanded?: boolean;\n    large?: boolean;\n    testId?: string;\n    handleExpanderClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n    /** Called when expander is open/closed. */\n    onExpand?: (isExpanded: boolean) => void;\n  }\n> &\n  Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'sticky' | 'variant'>;\n\nconst Expander: ExpanderType = React.forwardRef<HTMLLIElement, ExpanderProps>((props, ref) => {\n  const {\n    id,\n    children,\n    padding = true,\n    color = 'neutral',\n    className = '',\n    icon,\n    large = false,\n    title,\n    titleHtmlMarkup = 'span',\n    expanded = false,\n    sticky,\n    testId,\n    handleExpanderClick,\n    onExpand,\n    renderChildrenWhenClosed,\n    variant = 'line',\n  } = props;\n  const [isExpanded, setIsExpanded] = useState<boolean>(expanded);\n  const previousIsExpanded = usePrevious(isExpanded);\n  const expanderRef = useRef<HTMLLIElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const { isHovered } = useHover(triggerRef);\n\n  const { isOutsideWindow, isLeavingWindow, offsetHeight, contentWidth } = useSticky(expanderRef, triggerRef);\n  const isSticky = sticky && isExpanded && isOutsideWindow;\n  const isJsxTitle = typeof title === 'object';\n\n  const itemClasses = classNames(className, {\n    [expanderListStyles['expander-list__item--' + variant]]: variant,\n    [expanderListStyles['expander-list__item--jsx']]: isJsxTitle,\n  });\n\n  const expanderClasses = classNames(expanderListStyles['expander-list-link'], expanderListStyles[`expander-list-link--${color}`], {\n    [expanderListStyles['expander-list-link--fill']]: variant === 'fill',\n    [expanderListStyles['expander-list-link--closed']]: !isExpanded,\n    [expanderListStyles['expander-list-link--large']]: large,\n    [expanderListStyles['expander-list-link--jsx']]: isJsxTitle,\n    [expanderListStyles['expander-list-link--sticky']]: isSticky && !isLeavingWindow,\n    [expanderListStyles['expander-list-link--absolute']]: isSticky && isLeavingWindow,\n  });\n\n  useEffect(() => {\n    if (expanded !== isExpanded) {\n      setIsExpanded(expanded);\n    }\n  }, [expanded]);\n\n  useEffect(() => {\n    if (onExpand && isExpanded !== !!previousIsExpanded) {\n      onExpand(isExpanded);\n    }\n  }, [isExpanded, onExpand]);\n\n  const renderContent = () => {\n    if (!renderChildrenWhenClosed && !isExpanded) {\n      return null;\n    }\n\n    const mainContentClasses = classNames(\n      expanderListStyles['expander-list-link__main-content'],\n      isExpanded && expanderListStyles['expander-list-link__main-content--expanded'],\n      padding ? expanderListStyles['expander-list-link__main-content--padding'] : ''\n    );\n\n    return <div className={mainContentClasses}>{children}</div>;\n  };\n\n  return (\n    <li\n      className={itemClasses}\n      ref={mergeRefs([ref, expanderRef])}\n      style={{ paddingTop: isSticky && offsetHeight ? `${offsetHeight}px` : undefined }}\n    >\n      <button\n        type=\"button\"\n        id={id}\n        onClick={handleExpanderClick}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.ExpanderListExpander}\n        className={expanderClasses}\n        ref={triggerRef}\n        aria-expanded={isExpanded}\n        style={{\n          zIndex: isHovered || isSticky ? ZIndex.ExpanderTrigger : undefined,\n          width: isSticky && contentWidth ? `${contentWidth}px` : undefined,\n        }}\n      >\n        {renderListHeader(title, titleHtmlMarkup, isExpanded ? ChevronUp : ChevronDown, isHovered, large ? 'large' : 'medium', icon)}\n      </button>\n      {renderContent()}\n    </li>\n  );\n});\n\ntype ActiveExpander = Record<string, boolean>;\n\nconst isExpanderComponent = (element: {} | null | undefined): element is React.ReactElement<ExpanderProps> =>\n  React.isValidElement<ExpanderProps>(element) && (element as React.ReactElement).type === Expander;\n\nexport const ExpanderList = React.forwardRef((props: ExpanderListProps, ref: React.Ref<HTMLUListElement>) => {\n  const {\n    children,\n    childPadding = true,\n    large,\n    isOpen = false,\n    renderChildrenWhenClosed = false,\n    color,\n    className = '',\n    accordion = false,\n    topBorder = true,\n    bottomBorder = true,\n    sticky = false,\n    testId,\n    variant,\n  } = props;\n  const [activeExpander, setActiveExpander] = useState<ActiveExpander>();\n  const [latestExpander, setLatestExpander] = useState<HTMLElement>();\n  const uuid = useUuid();\n  const childCount = React.Children.count(children);\n  const expanderListClasses = classNames(expanderListStyles['expander-list'], className);\n\n  function handleExpanderClick(event: React.MouseEvent<HTMLElement, MouseEvent>, id: string): void {\n    setActiveExpander(prevState => (accordion ? { [id]: !prevState?.[id] } : { ...prevState, [id]: !prevState?.[id] }));\n    setLatestExpander(event.currentTarget);\n  }\n\n  /** Returns the class modifier top when we want to show the top border and no-bottom when we don't want to show the bottom border */\n  const getExpanderItemClass = (index: number) => {\n    return classNames(expanderListStyles['expander-list__item'], {\n      [expanderListStyles['expander-list__item--top']]: index === 0 && topBorder,\n      [expanderListStyles['expander-list__item--no-bottom']]: index === childCount - 1 && !bottomBorder,\n    });\n  };\n\n  const getExpanderId = (index: number) => `${uuid}-${index}`;\n\n  useEffect(() => {\n    if (accordion && latestExpander && !isElementInViewport(latestExpander)) {\n      latestExpander.scrollIntoView();\n    }\n  }, [accordion, latestExpander]);\n\n  useEffect(() => {\n    if (isOpen) {\n      const id = getExpanderId(0);\n      setActiveExpander(prevState => (accordion ? { [id]: !prevState?.[id] } : { ...prevState, [id]: !prevState?.[id] }));\n    }\n  }, [isOpen]);\n\n  useEffect(() => {\n    if (!isOpen) {\n      const newActiveExpander = React.Children.map(children, child => {\n        if (isExpanderComponent(child)) {\n          return child;\n        }\n      })?.reduce((acc, child, index) => {\n        // Expanded-status skal bare settes dersom prop er satt av den som bruker komponenten\n        if (typeof child.props.expanded !== 'undefined') {\n          acc[getExpanderId(index)] = child.props.expanded;\n        }\n        return acc;\n      }, {} as ActiveExpander);\n\n      setActiveExpander({ ...activeExpander, ...newActiveExpander });\n    }\n  }, [children]);\n\n  return (\n    <ul className={expanderListClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.ExpanderList}>\n      {React.Children.map(children, (child, index) => {\n        if (isExpanderComponent(child)) {\n          const id = getExpanderId(index);\n          const expanded = activeExpander?.[id];\n          const expanderItemClass = getExpanderItemClass(index);\n\n          return React.cloneElement(child as React.ReactElement<ExpanderProps>, {\n            id,\n            key: index,\n            expanded,\n            padding: childPadding,\n            color,\n            large,\n            sticky,\n            'aria-expanded': expanded,\n            className: expanderItemClass,\n            handleExpanderClick: (event: React.MouseEvent<HTMLElement>) => handleExpanderClick(event, `${uuid}-${index}`),\n            renderChildrenWhenClosed,\n            variant,\n          });\n        }\n        return child;\n      })}\n    </ul>\n  );\n}) as ExpanderListCompound;\n\nExpanderList.Expander = Expander;\nExpander.displayName = 'ExpanderList.Expander';\n\nexport default ExpanderList;\n"],"names":["Expander","React","props","ref","id","children","padding","color","className","icon","large","title","titleHtmlMarkup","expanded","sticky","testId","handleExpanderClick","onExpand","renderChildrenWhenClosed","variant","isExpanded","setIsExpanded","useState","previousIsExpanded","usePrevious","expanderRef","useRef","triggerRef","isHovered","useHover","isOutsideWindow","isLeavingWindow","offsetHeight","contentWidth","useSticky","isSticky","isJsxTitle","itemClasses","classNames","expanderListStyles","expanderClasses","useEffect","renderContent","mainContentClasses","mergeRefs","AnalyticsId","ZIndex","renderListHeader","ChevronUp","ChevronDown","isExpanderComponent","element","ExpanderList","childPadding","isOpen","accordion","topBorder","bottomBorder","activeExpander","setActiveExpander","latestExpander","setLatestExpander","uuid","useUuid","childCount","expanderListClasses","event","prevState","getExpanderItemClass","index","getExpanderId","isElementInViewport","newActiveExpander","_a","child","acc","expanderItemClass"],"mappings":"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"}

package/components/LinkList/index.js

@@ -1,2 +1,2 @@
-import i from"react";import f from"classnames";import{useHover as C}from"../../hooks/useHover.js";import t from"./styles.module.scss";import{AnalyticsId as b}from"../../constants.js";import{r as y}from"../../ListHeader.js";import R from"../Icons/ChevronRight.js";import"../../Avatar.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../theme/palette.js";import"../../Badge.js";import"../Badge/styles.module.scss";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../StatusDot/styles.module.scss";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../../hooks/useBreakpoint.js";import"../ListHeader/styles.module.scss";import"../../utils/component.js";const k=i.forwardRef((u,s)=>{const{children:o,className:a="",color:l="neutral",icon:n,size:r="medium",chevron:L=!1,linkRef:m,testId:p,target:e,variant:c,htmlMarkup:d="a",..._}=u,{hoverRef:h,isHovered:v}=C(m),E=f(t["link-list__list-item"],{[t["link-list__list-item--"+c]]:c}),N=f(t["link-list__anchor"],t["link-list__anchor--"+l],{[t["link-list__anchor--fill"]]:c==="fill",[t["link-list__anchor--"+r]]:r,[t["link-list__anchor--button"]]:d==="button"},a);return i.createElement("li",{className:E,ref:s,"data-testid":p,"data-analyticsid":b.Link},d==="a"&&i.createElement("a",{className:N,ref:h,rel:e==="_blank"?"noopener noreferrer":void 0,target:e,..._},y(o,R,v,r,n)),d==="button"&&i.createElement("button",{className:N,ref:h,type:"button",..._},y(o,R,v,r,n)))}),w=i.forwardRef(function(s,o){const{children:a,className:l="",chevron:n=!1,size:r="medium",color:L,testId:m,variant:p="line"}=s;return i.createElement("ul",{ref:o,className:f(t["link-list"],l),"data-testid":m,"data-analyticsid":b.LinkList},i.Children.map(a,e=>{if(e.type===k)return i.cloneElement(e,{color:L,size:r,chevron:n,variant:p})}))});w.Link=k;k.displayName="LinkList.Link";export{w as LinkList,w as default};
+import i from"react";import f from"classnames";import{useHover as C}from"../../hooks/useHover.js";import t from"./styles.module.scss";import{AnalyticsId as b}from"../../constants.js";import{r as y}from"../../ListHeader.js";import R from"../Icons/ChevronRight.js";import"../../Avatar.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../theme/palette.js";import"../../Badge.js";import"../Badge/styles.module.scss";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../StatusDot/styles.module.scss";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../../hooks/useBreakpoint.js";import"../ListHeader/styles.module.scss";import"../../utils/component.js";const k=i.forwardRef((u,s)=>{const{children:o,className:a="",color:l="neutral",icon:n,size:r="medium",chevron:L=!1,linkRef:m,testId:p,target:e,variant:c,htmlMarkup:d="a",..._}=u,{hoverRef:h,isHovered:v}=C(m),E=f(t["link-list__list-item"],{[t["link-list__list-item--"+c]]:c}),N=f(t["link-list__anchor"],t["link-list__anchor--"+l],{[t["link-list__anchor--fill"]]:c==="fill",[t["link-list__anchor--"+r]]:r,[t["link-list__anchor--button"]]:d==="button"},a);return i.createElement("li",{className:E,ref:s,"data-testid":p,"data-analyticsid":b.Link},d==="a"&&i.createElement("a",{className:N,ref:h,rel:e==="_blank"?"noopener noreferrer":void 0,target:e,..._},y(o,"span",R,v,r,n)),d==="button"&&i.createElement("button",{className:N,ref:h,type:"button",..._},y(o,"span",R,v,r,n)))}),w=i.forwardRef(function(s,o){const{children:a,className:l="",chevron:n=!1,size:r="medium",color:L,testId:m,variant:p="line"}=s;return i.createElement("ul",{ref:o,className:f(t["link-list"],l),"data-testid":m,"data-analyticsid":b.LinkList},i.Children.map(a,e=>{if(e.type===k)return i.cloneElement(e,{color:L,size:r,chevron:n,variant:p})}))});w.Link=k;k.displayName="LinkList.Link";export{w as LinkList,w as default};
 //# sourceMappingURL=index.js.map

package/components/LinkList/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/LinkList/LinkList.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { PaletteNames } from '../../theme/palette';\nimport { useHover } from '../../hooks/useHover';\n\nimport LinkListStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\nimport { ListHeaderType, renderListHeader } from '../ListHeader/ListHeader';\nimport ChevronRight from '../Icons/ChevronRight';\n\nexport type LinkListSize = 'small' | 'medium' | 'large';\n\nexport type LinkAnchorTargets = '_self' | '_blank' | '_parent';\n\nexport type LinkListColors = PaletteNames;\nexport type LinkListVariant = 'line' | 'outline' | 'fill';\n\nexport interface LinkType extends React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLLIElement>> {\n  ListHeader?: ListHeaderType;\n}\n\nexport type LinkTags = 'button' | 'a';\nexport interface CompoundComponent extends React.ForwardRefExoticComponent<LinkListProps & React.RefAttributes<HTMLUListElement>> {\n  Link: LinkType;\n}\n\ninterface LinkListProps {\n  /** Items in the LinkList */\n  children: React.ReactNode;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the link list background color on hover. */\n  color?: LinkListColors;\n  /** Toggles chevron icon on or off. */\n  chevron?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  bottomBorder?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  topBorder?: boolean;\n  /** Changes size of the LinkList. */\n  size?: LinkListSize;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets visual priority */\n  variant?: LinkListVariant;\n}\n\ntype Modify<T, R> = Omit<T, keyof R> & R;\n\nexport type LinkProps = Modify<\n  React.HTMLAttributes<HTMLAnchorElement | HTMLButtonElement>,\n  {\n    children: React.ReactNode;\n    chevron?: boolean;\n    className?: string;\n    icon?: React.ReactElement;\n    href?: string;\n    target?: LinkAnchorTargets;\n    /** HTML markup for link. Default: a */\n    htmlMarkup?: LinkTags;\n    /**\n     * Ref for lenke/knapp\n     */\n    linkRef?: React.RefObject<HTMLButtonElement | HTMLAnchorElement>;\n    /** Sets the data-testid attribute. */\n    testId?: string;\n  }\n> &\n  Pick<LinkListProps, 'color' | 'size' | 'variant'>;\n\nconst Link: LinkType = React.forwardRef((props: LinkProps, ref: React.Ref<HTMLLIElement>) => {\n  const {\n    children,\n    className = '',\n    color = 'neutral',\n    icon,\n    size = 'medium',\n    chevron = false,\n    linkRef,\n    testId,\n    target,\n    variant,\n    htmlMarkup = 'a',\n    ...restProps\n  } = props;\n  const { hoverRef, isHovered } = useHover<HTMLButtonElement | HTMLAnchorElement>(linkRef);\n\n  const liClasses = cn(LinkListStyles['link-list__list-item'], {\n    [LinkListStyles['link-list__list-item--' + variant]]: variant,\n  });\n  const linkClasses = cn(\n    LinkListStyles['link-list__anchor'],\n    LinkListStyles['link-list__anchor--' + color],\n\n    {\n      [LinkListStyles['link-list__anchor--fill']]: variant === 'fill',\n      [LinkListStyles['link-list__anchor--' + size]]: size,\n      [LinkListStyles['link-list__anchor--button']]: htmlMarkup === 'button',\n    },\n    className\n  );\n\n  return (\n    <li className={liClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Link}>\n      {htmlMarkup === 'a' && (\n        <a\n          className={linkClasses}\n          ref={hoverRef as React.RefObject<HTMLAnchorElement>}\n          rel={target === '_blank' ? 'noopener noreferrer' : undefined}\n          target={target}\n          {...restProps}\n        >\n          {renderListHeader(children, ChevronRight, isHovered, size, icon)}\n        </a>\n      )}\n      {htmlMarkup === 'button' && (\n        <button className={linkClasses} ref={hoverRef as React.RefObject<HTMLButtonElement>} type=\"button\" {...restProps}>\n          {renderListHeader(children, ChevronRight, isHovered, size, icon)}\n        </button>\n      )}\n    </li>\n  );\n});\n\nexport const LinkList = React.forwardRef(function LinkListForwardedRef(props: LinkListProps, ref: React.Ref<HTMLUListElement>) {\n  const { children, className = '', chevron = false, size = 'medium', color, testId, variant = 'line' } = props;\n  return (\n    <ul ref={ref} className={cn(LinkListStyles['link-list'], className)} data-testid={testId} data-analyticsid={AnalyticsId.LinkList}>\n      {React.Children.map(children, (child: React.ReactNode | React.ReactElement<LinkProps>) => {\n        if ((child as React.ReactElement<LinkProps>).type === Link) {\n          return React.cloneElement(child as React.ReactElement<LinkProps>, { color, size, chevron, variant });\n        }\n      })}\n    </ul>\n  );\n}) as CompoundComponent;\n\nLinkList.Link = Link;\nLink.displayName = 'LinkList.Link';\n\nexport default LinkList;\n"],"names":["Link","React","props","ref","children","className","color","icon","size","chevron","linkRef","testId","target","variant","htmlMarkup","restProps","hoverRef","isHovered","useHover","liClasses","cn","LinkListStyles","linkClasses","AnalyticsId","renderListHeader","ChevronRight","LinkList","child"],"mappings":"u8BAuEA,MAAMA,EAAiBC,EAAM,WAAW,CAACC,EAAkBC,IAAkC,CACrF,KAAA,CACJ,SAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EAAQ,UACR,KAAAC,EACA,KAAAC,EAAO,SACP,QAAAC,EAAU,GACV,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,QAAAC,EACA,WAAAC,EAAa,OACVC,CACD,EAAAb,EACE,CAAE,SAAAc,EAAU,UAAAC,CAAU,EAAIC,EAAgDR,CAAO,EAEjFS,EAAYC,EAAGC,EAAe,wBAAyB,CAC3D,CAACA,EAAe,yBAA2BR,IAAWA,CAAA,CACvD,EACKS,EAAcF,EAClBC,EAAe,qBACfA,EAAe,sBAAwBf,GAEvC,CACE,CAACe,EAAe,4BAA6BR,IAAY,OACzD,CAACQ,EAAe,sBAAwBb,IAAQA,EAChD,CAACa,EAAe,8BAA+BP,IAAe,QAChE,EACAT,CAAA,EAGF,OACGJ,EAAA,cAAA,KAAA,CAAG,UAAWkB,EAAW,IAAAhB,EAAU,cAAaQ,EAAQ,mBAAkBY,EAAY,IACpF,EAAAT,IAAe,KACbb,EAAA,cAAA,IAAA,CACC,UAAWqB,EACX,IAAKN,EACL,IAAKJ,IAAW,SAAW,sBAAwB,OACnD,OAAAA,EACC,GAAGG,CAEH,EAAAS,EAAiBpB,EAAUqB,EAAcR,EAAWT,EAAMD,CAAI,CACjE,EAEDO,IAAe,UACbb,EAAA,cAAA,SAAA,CAAO,UAAWqB,EAAa,IAAKN,EAAgD,KAAK,SAAU,GAAGD,CAAA,EACpGS,EAAiBpB,EAAUqB,EAAcR,EAAWT,EAAMD,CAAI,CACjE,CAEJ,CAEJ,CAAC,EAEYmB,EAAWzB,EAAM,WAAW,SAA8BC,EAAsBC,EAAkC,CAC7H,KAAM,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,QAAAI,EAAU,GAAO,KAAAD,EAAO,SAAU,MAAAF,EAAO,OAAAK,EAAQ,QAAAE,EAAU,MAAA,EAAWX,EACxG,OACGD,EAAA,cAAA,KAAA,CAAG,IAAAE,EAAU,UAAWiB,EAAGC,EAAe,aAAchB,CAAS,EAAG,cAAaM,EAAQ,mBAAkBY,EAAY,QAAA,EACrHtB,EAAM,SAAS,IAAIG,EAAWuB,GAA2D,CACnF,GAAAA,EAAwC,OAAS3B,EAC7C,OAAAC,EAAM,aAAa0B,EAAwC,CAAE,MAAArB,EAAO,KAAAE,EAAM,QAAAC,EAAS,QAAAI,EAAS,CAEtG,CAAA,CACH,CAEJ,CAAC,EAEDa,EAAS,KAAO1B,EAChBA,EAAK,YAAc"}
+{"version":3,"file":"index.js","sources":["../../../src/components/LinkList/LinkList.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\n\nimport { PaletteNames } from '../../theme/palette';\nimport { useHover } from '../../hooks/useHover';\n\nimport LinkListStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\nimport { ListHeaderType, renderListHeader } from '../ListHeader/ListHeader';\nimport ChevronRight from '../Icons/ChevronRight';\n\nexport type LinkListSize = 'small' | 'medium' | 'large';\n\nexport type LinkAnchorTargets = '_self' | '_blank' | '_parent';\n\nexport type LinkListColors = PaletteNames;\nexport type LinkListVariant = 'line' | 'outline' | 'fill';\n\nexport interface LinkType extends React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLLIElement>> {\n  ListHeader?: ListHeaderType;\n}\n\nexport type LinkTags = 'button' | 'a';\nexport interface CompoundComponent extends React.ForwardRefExoticComponent<LinkListProps & React.RefAttributes<HTMLUListElement>> {\n  Link: LinkType;\n}\n\ninterface LinkListProps {\n  /** Items in the LinkList */\n  children: React.ReactNode;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the link list background color on hover. */\n  color?: LinkListColors;\n  /** Toggles chevron icon on or off. */\n  chevron?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  bottomBorder?: boolean;\n  /** @deprecated Skal fases ut - Brukes ikke lenger. */\n  topBorder?: boolean;\n  /** Changes size of the LinkList. */\n  size?: LinkListSize;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets visual priority */\n  variant?: LinkListVariant;\n}\n\ntype Modify<T, R> = Omit<T, keyof R> & R;\n\nexport type LinkProps = Modify<\n  React.HTMLAttributes<HTMLAnchorElement | HTMLButtonElement>,\n  {\n    children: React.ReactNode;\n    chevron?: boolean;\n    className?: string;\n    icon?: React.ReactElement;\n    href?: string;\n    target?: LinkAnchorTargets;\n    /** HTML markup for link. Default: a */\n    htmlMarkup?: LinkTags;\n    /**\n     * Ref for lenke/knapp\n     */\n    linkRef?: React.RefObject<HTMLButtonElement | HTMLAnchorElement>;\n    /** Sets the data-testid attribute. */\n    testId?: string;\n  }\n> &\n  Pick<LinkListProps, 'color' | 'size' | 'variant'>;\n\nconst Link: LinkType = React.forwardRef((props: LinkProps, ref: React.Ref<HTMLLIElement>) => {\n  const {\n    children,\n    className = '',\n    color = 'neutral',\n    icon,\n    size = 'medium',\n    chevron = false,\n    linkRef,\n    testId,\n    target,\n    variant,\n    htmlMarkup = 'a',\n    ...restProps\n  } = props;\n  const { hoverRef, isHovered } = useHover<HTMLButtonElement | HTMLAnchorElement>(linkRef);\n\n  const liClasses = cn(LinkListStyles['link-list__list-item'], {\n    [LinkListStyles['link-list__list-item--' + variant]]: variant,\n  });\n  const linkClasses = cn(\n    LinkListStyles['link-list__anchor'],\n    LinkListStyles['link-list__anchor--' + color],\n\n    {\n      [LinkListStyles['link-list__anchor--fill']]: variant === 'fill',\n      [LinkListStyles['link-list__anchor--' + size]]: size,\n      [LinkListStyles['link-list__anchor--button']]: htmlMarkup === 'button',\n    },\n    className\n  );\n\n  return (\n    <li className={liClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Link}>\n      {htmlMarkup === 'a' && (\n        <a\n          className={linkClasses}\n          ref={hoverRef as React.RefObject<HTMLAnchorElement>}\n          rel={target === '_blank' ? 'noopener noreferrer' : undefined}\n          target={target}\n          {...restProps}\n        >\n          {renderListHeader(children, 'span', ChevronRight, isHovered, size, icon)}\n        </a>\n      )}\n      {htmlMarkup === 'button' && (\n        <button className={linkClasses} ref={hoverRef as React.RefObject<HTMLButtonElement>} type=\"button\" {...restProps}>\n          {renderListHeader(children, 'span', ChevronRight, isHovered, size, icon)}\n        </button>\n      )}\n    </li>\n  );\n});\n\nexport const LinkList = React.forwardRef(function LinkListForwardedRef(props: LinkListProps, ref: React.Ref<HTMLUListElement>) {\n  const { children, className = '', chevron = false, size = 'medium', color, testId, variant = 'line' } = props;\n  return (\n    <ul ref={ref} className={cn(LinkListStyles['link-list'], className)} data-testid={testId} data-analyticsid={AnalyticsId.LinkList}>\n      {React.Children.map(children, (child: React.ReactNode | React.ReactElement<LinkProps>) => {\n        if ((child as React.ReactElement<LinkProps>).type === Link) {\n          return React.cloneElement(child as React.ReactElement<LinkProps>, { color, size, chevron, variant });\n        }\n      })}\n    </ul>\n  );\n}) as CompoundComponent;\n\nLinkList.Link = Link;\nLink.displayName = 'LinkList.Link';\n\nexport default LinkList;\n"],"names":["Link","React","props","ref","children","className","color","icon","size","chevron","linkRef","testId","target","variant","htmlMarkup","restProps","hoverRef","isHovered","useHover","liClasses","cn","LinkListStyles","linkClasses","AnalyticsId","renderListHeader","ChevronRight","LinkList","child"],"mappings":"u8BAuEA,MAAMA,EAAiBC,EAAM,WAAW,CAACC,EAAkBC,IAAkC,CACrF,KAAA,CACJ,SAAAC,EACA,UAAAC,EAAY,GACZ,MAAAC,EAAQ,UACR,KAAAC,EACA,KAAAC,EAAO,SACP,QAAAC,EAAU,GACV,QAAAC,EACA,OAAAC,EACA,OAAAC,EACA,QAAAC,EACA,WAAAC,EAAa,OACVC,CACD,EAAAb,EACE,CAAE,SAAAc,EAAU,UAAAC,CAAU,EAAIC,EAAgDR,CAAO,EAEjFS,EAAYC,EAAGC,EAAe,wBAAyB,CAC3D,CAACA,EAAe,yBAA2BR,IAAWA,CAAA,CACvD,EACKS,EAAcF,EAClBC,EAAe,qBACfA,EAAe,sBAAwBf,GAEvC,CACE,CAACe,EAAe,4BAA6BR,IAAY,OACzD,CAACQ,EAAe,sBAAwBb,IAAQA,EAChD,CAACa,EAAe,8BAA+BP,IAAe,QAChE,EACAT,CAAA,EAGF,OACGJ,EAAA,cAAA,KAAA,CAAG,UAAWkB,EAAW,IAAAhB,EAAU,cAAaQ,EAAQ,mBAAkBY,EAAY,IACpF,EAAAT,IAAe,KACbb,EAAA,cAAA,IAAA,CACC,UAAWqB,EACX,IAAKN,EACL,IAAKJ,IAAW,SAAW,sBAAwB,OACnD,OAAAA,EACC,GAAGG,CAEH,EAAAS,EAAiBpB,EAAU,OAAQqB,EAAcR,EAAWT,EAAMD,CAAI,CACzE,EAEDO,IAAe,UACbb,EAAA,cAAA,SAAA,CAAO,UAAWqB,EAAa,IAAKN,EAAgD,KAAK,SAAU,GAAGD,CAAA,EACpGS,EAAiBpB,EAAU,OAAQqB,EAAcR,EAAWT,EAAMD,CAAI,CACzE,CAEJ,CAEJ,CAAC,EAEYmB,EAAWzB,EAAM,WAAW,SAA8BC,EAAsBC,EAAkC,CAC7H,KAAM,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,QAAAI,EAAU,GAAO,KAAAD,EAAO,SAAU,MAAAF,EAAO,OAAAK,EAAQ,QAAAE,EAAU,MAAA,EAAWX,EACxG,OACGD,EAAA,cAAA,KAAA,CAAG,IAAAE,EAAU,UAAWiB,EAAGC,EAAe,aAAchB,CAAS,EAAG,cAAaM,EAAQ,mBAAkBY,EAAY,QAAA,EACrHtB,EAAM,SAAS,IAAIG,EAAWuB,GAA2D,CACnF,GAAAA,EAAwC,OAAS3B,EAC7C,OAAAC,EAAM,aAAa0B,EAAwC,CAAE,MAAArB,EAAO,KAAAE,EAAM,QAAAC,EAAS,QAAAI,EAAS,CAEtG,CAAA,CACH,CAEJ,CAAC,EAEDa,EAAS,KAAO1B,EAChBA,EAAK,YAAc"}

package/components/ListHeader/ListHeader.d.ts

@@ -3,13 +3,14 @@ import { AvatarProps, AvatarType } from '../Avatar';
 import { BadgeProps, BadgeType } from '../Badge';
 import { ListHeaderTextProps, ListHeaderTextType } from './ListHeaderText/ListHeaderText';
 import { SvgIcon } from '../Icons';
+import { TitleTags } from '../Title';
 export declare type ListHeaderSize = 'small' | 'medium' | 'large';
 export interface ListHeaderType extends React.ForwardRefExoticComponent<ListHeaderProps & React.RefAttributes<HTMLLIElement>> {
     Avatar?: AvatarType;
     Badge?: BadgeType;
     ListHeaderText?: ListHeaderTextType;
 }
-export declare const renderListHeader: (element: React.ReactNode, chevronIcon: SvgIcon, isHovered: boolean, size: ListHeaderSize, icon?: React.ReactElement) => false | "" | 0 | JSX.Element | null | undefined;
+export declare const renderListHeader: (element: React.ReactNode, titleHtmlMarkup: TitleTags, chevronIcon: SvgIcon, isHovered: boolean, size: ListHeaderSize, icon?: React.ReactElement) => false | "" | 0 | JSX.Element | null | undefined;
 export interface ListHeaderProps {
     /** Adds custom classes to the ListHeader element. */
     className?: string;
@@ -17,6 +18,8 @@ export interface ListHeaderProps {
     chevronIcon?: SvgIcon;
     /** Children to be rendered inside of ListHeader */
     children: React.ReactNode;
+    /** Changes the underlying element of the title. Default: h2*/
+    titleHtmlMarkup?: TitleTags;
     /** icon to be rendered inside of ListHeader */
     icon?: React.ReactElement;
     /** whether or not the parent is hovered */

package/components/ListHeader/ListHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ListHeader/ListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAe,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACxD,OAAuB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAI1G,OAAa,EAAY,OAAO,EAAE,MAAM,UAAU,CAAC;AAGnD,oBAAY,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,yBAAyB,CAAC,eAAe,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3H,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACrC;AAED,eAAO,MAAM,gBAAgB,YAClB,MAAM,SAAS,eACX,OAAO,aACT,OAAO,QACZ,cAAc,SACb,MAAM,YAAY,oDAc1B,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mDAAmD;IACnD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,+CAA+C;IAC/C,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sCAAsC;IACtC,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,WAAW,aACZ,MAAM,SAAS;;4BAID,MAAM,mBAAmB,CAAC;;oBAElC,MAAM,MAAM,CAAC;uBACV,MAAM,GAAG,CAAC;CA+B9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,cAqEvB,CAAC;AAEH,eAAe,UAAU,CAAC"}
+{"version":3,"file":"ListHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ListHeader/ListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAe,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACxD,OAAuB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAI1G,OAAa,EAAY,OAAO,EAAE,MAAM,UAAU,CAAC;AAEnD,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAErC,oBAAY,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,yBAAyB,CAAC,eAAe,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3H,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACrC;AAED,eAAO,MAAM,gBAAgB,YAClB,MAAM,SAAS,mBACP,SAAS,eACb,OAAO,aACT,OAAO,QACZ,cAAc,SACb,MAAM,YAAY,oDAc1B,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mDAAmD;IACnD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,8DAA8D;IAC9D,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,+CAA+C;IAC/C,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sCAAsC;IACtC,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,WAAW,aACZ,MAAM,SAAS;;4BAID,MAAM,mBAAmB,CAAC;;oBAElC,MAAM,MAAM,CAAC;uBACV,MAAM,GAAG,CAAC;CAgC9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,cAwEvB,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/components/ListHeader/ListHeaderText/ListHeaderText.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { StatusDotVariant } from '../../StatusDot';
+import { TitleTags } from '../../Title';
 export declare type ListHeaderTextType = React.ForwardRefExoticComponent<ListHeaderTextProps & React.RefAttributes<HTMLLIElement>>;
 export interface ListHeaderTextProps {
     /** The first text in the ListHeaderText Component */
@@ -18,6 +19,8 @@ export interface ListHeaderTextProps {
     className?: string;
     /** Sets the data-testid attribute. */
     testId?: string;
+    /** Changes the underlying element of the title. Default: span*/
+    titleHtmlMarkup?: TitleTags;
 }
 export declare const ListHeaderText: ListHeaderTextType;
 export default ListHeaderText;

package/components/ListHeader/ListHeaderText/ListHeaderText.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListHeaderText.d.ts","sourceRoot":"","sources":["../../../../src/components/ListHeader/ListHeaderText/ListHeaderText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAkB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAI9D,oBAAY,kBAAkB,GAAG,KAAK,CAAC,yBAAyB,CAAC,mBAAmB,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAE3H,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,SAAS,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,cAAc,EAAE,kBAmC3B,CAAC;AAEH,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ListHeaderText.d.ts","sourceRoot":"","sources":["../../../../src/components/ListHeader/ListHeaderText/ListHeaderText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAkB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAG9D,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAExC,oBAAY,kBAAkB,GAAG,KAAK,CAAC,yBAAyB,CAAC,mBAAmB,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAE3H,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,SAAS,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,gEAAgE;IAChE,eAAe,CAAC,EAAE,SAAS,CAAC;CAC7B;AAED,eAAO,MAAM,cAAc,EAAE,kBAqC3B,CAAC;AAEH,eAAe,cAAc,CAAC"}

package/components/ListHeader/ListHeaderText/componentdata.json

@@ -1 +1 @@
-{"props":{"firstText":{"defaultValue":null,"description":"The first text in the ListHeaderText Component","name":"firstText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":true,"type":{"name":"string"}},"firstTextEmphasised":{"defaultValue":null,"description":"Will style the first text as bold","name":"firstTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"secondText":{"defaultValue":null,"description":"The second text in the ListHeaderText Component","name":"secondText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"secondTextEmphasised":{"defaultValue":null,"description":"Will style the second text as bold","name":"secondTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"subText":{"defaultValue":null,"description":"Whether or not this ListHeaderText is a sub text","name":"subText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"statusDotVariant":{"defaultValue":null,"description":"Decides the variant for the StatusDot","name":"statusDotVariant","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"enum","raw":"StatusDotVariant","value":[{"value":"\"info\"","description":"","fullComment":"","tags":{}},{"value":"\"warning\"","description":"","fullComment":"","tags":{}},{"value":"\"alert\"","description":"","fullComment":"","tags":{}},{"value":"\"cancelled\"","description":"","fullComment":"","tags":{}},{"value":"\"active\"","description":"","fullComment":"","tags":{}},{"value":"\"transparent\"","description":"","fullComment":"","tags":{}},{"value":"\"recurring\"","description":"","fullComment":"","tags":{}},{"value":"\"group\"","description":"","fullComment":"","tags":{}},{"value":"\"noaccess\"","description":"","fullComment":"","tags":{}}]}},"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeaderText component.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}}}}
+{"props":{"firstText":{"defaultValue":null,"description":"The first text in the ListHeaderText Component","name":"firstText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":true,"type":{"name":"string"}},"firstTextEmphasised":{"defaultValue":null,"description":"Will style the first text as bold","name":"firstTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"secondText":{"defaultValue":null,"description":"The second text in the ListHeaderText Component","name":"secondText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"secondTextEmphasised":{"defaultValue":null,"description":"Will style the second text as bold","name":"secondTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"subText":{"defaultValue":null,"description":"Whether or not this ListHeaderText is a sub text","name":"subText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"statusDotVariant":{"defaultValue":null,"description":"Decides the variant for the StatusDot","name":"statusDotVariant","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"enum","raw":"StatusDotVariant","value":[{"value":"\"info\"","description":"","fullComment":"","tags":{}},{"value":"\"warning\"","description":"","fullComment":"","tags":{}},{"value":"\"alert\"","description":"","fullComment":"","tags":{}},{"value":"\"cancelled\"","description":"","fullComment":"","tags":{}},{"value":"\"active\"","description":"","fullComment":"","tags":{}},{"value":"\"transparent\"","description":"","fullComment":"","tags":{}},{"value":"\"recurring\"","description":"","fullComment":"","tags":{}},{"value":"\"group\"","description":"","fullComment":"","tags":{}},{"value":"\"noaccess\"","description":"","fullComment":"","tags":{}}]}},"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeaderText component.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"titleHtmlMarkup":{"defaultValue":null,"description":"Changes the underlying element of the title. Default: span","name":"titleHtmlMarkup","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"enum","raw":"TitleTags","value":[{"value":"\"h1\""},{"value":"\"h2\""},{"value":"\"h3\""},{"value":"\"h4\""},{"value":"\"h5\""},{"value":"\"span\""}]}}}}

package/components/ListHeader/componentdata.json

@@ -1 +1 @@
-{"props":{"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeader element.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}},"chevronIcon":{"defaultValue":null,"description":"Chevron to render inside of the ListHeader","name":"chevronIcon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"SvgIcon"}},"children":{"defaultValue":null,"description":"Children to be rendered inside of ListHeader","name":"children","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":true,"type":{"name":"ReactNode"}},"icon":{"defaultValue":null,"description":"icon to be rendered inside of ListHeader","name":"icon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"ReactElement<any, string | JSXElementConstructor<any>>"}},"isHovered":{"defaultValue":null,"description":"whether or not the parent is hovered","name":"isHovered","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"boolean"}},"size":{"defaultValue":null,"description":"Changes size of the ListHeader.","name":"size","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"enum","raw":"ListHeaderSize","value":[{"value":"\"small\""},{"value":"\"medium\""},{"value":"\"large\""}]}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}}}}
+{"props":{"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeader element.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}},"chevronIcon":{"defaultValue":null,"description":"Chevron to render inside of the ListHeader","name":"chevronIcon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"SvgIcon"}},"children":{"defaultValue":null,"description":"Children to be rendered inside of ListHeader","name":"children","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":true,"type":{"name":"ReactNode"}},"titleHtmlMarkup":{"defaultValue":null,"description":"Changes the underlying element of the title. Default: h2","name":"titleHtmlMarkup","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"enum","raw":"TitleTags","value":[{"value":"\"h1\""},{"value":"\"h2\""},{"value":"\"h3\""},{"value":"\"h4\""},{"value":"\"h5\""},{"value":"\"span\""}]}},"icon":{"defaultValue":null,"description":"icon to be rendered inside of ListHeader","name":"icon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"ReactElement<any, string | JSXElementConstructor<any>>"}},"isHovered":{"defaultValue":null,"description":"whether or not the parent is hovered","name":"isHovered","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"boolean"}},"size":{"defaultValue":null,"description":"Changes size of the ListHeader.","name":"size","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"enum","raw":"ListHeaderSize","value":[{"value":"\"small\""},{"value":"\"medium\""},{"value":"\"large\""}]}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}}}}

package/components/ListHeader/styles.module.scss

@@ -19,7 +19,13 @@
   &--top-align-content {
     align-items: flex-start;
   }
-
+  &__title {
+    font-size: inherit;
+    font-weight: inherit;
+    line-height: inherit;
+    padding: 0;
+    margin: 0;
+  }
   &__content {
     border-bottom: 1px solid transparent;
     display: flex;

package/components/ListHeader/styles.module.scss.d.ts

@@ -26,6 +26,7 @@ export type Styles = {
   'list-header__icon--for-element-content--large': string;
   'list-header__icon--for-element-content--medium': string;
   'list-header__icon--for-string-content': string;
+  'list-header__title': string;
   'list-header--for-element-content': string;
   'list-header--top-align-content': string;
   statusDot: string;

package/components/RadioButton/styles.module.scss

@@ -6,7 +6,7 @@
 .radio-button-errors {
   font-size: $font-size-sm;
   font-weight: 600;
-  color: $cherry500;
+  color: $cherry600;
   margin-top: 0;
 }
 
@@ -18,7 +18,7 @@
     padding: getSpacer(s) getSpacer(2xs) getSpacer(m);
     background-color: $cherry100;
     margin-left: -0.75rem;
-    border-left: 0.25rem solid $cherry500;
+    border-left: 0.25rem solid $cherry600;
 
     @media (min-width: map-get($grid-breakpoints, md)) {
       padding: getSpacer(s) getSpacer(m) getSpacer(l);
@@ -166,14 +166,14 @@
   }
 
   &--invalid {
-    color: $cherry500;
+    color: $cherry600;
 
     &:hover {
       background-color: $cherry100;
     }
 
     &:checked {
-      color: $cherry500;
+      color: $cherry600;
 
       &:hover {
         background-color: $cherry100;
@@ -232,6 +232,6 @@
   }
 
   &--invalid:checked::before {
-    background-color: $cherry500;
+    background-color: $cherry600;
   }
 }

package/components/Select/styles.module.scss

@@ -91,7 +91,7 @@
     outline-color: $blueberry500;
   }
   &--invalid {
-    outline-color: $cherry500;
+    outline-color: $cherry600;
   }
 
   :hover > & {

package/components/Textarea/styles.module.scss

@@ -7,14 +7,6 @@
 .textarea {
   @include input-wrapper;
 
-  &__error-text {
-    font-size: $font-size-sm;
-    line-height: $font-size-sm;
-    font-weight: 600;
-    color: $cherry500;
-    margin-top: 0;
-  }
-
   &--gutterBottom {
     margin-bottom: getSpacer(s);
   }
@@ -40,7 +32,7 @@
       color: $white;
     }
     &--invalid {
-      color: $cherry500;
+      color: $cherry600;
       font-weight: 600;
     }
   }

package/components/Textarea/styles.module.scss.d.ts

@@ -13,7 +13,6 @@ export type Styles = {
   'textarea__counter-wrapper': string;
   'textarea__counter-wrapper--invalid': string;
   'textarea__counter-wrapper--on-dark': string;
-  'textarea__error-text': string;
   'textarea__label-wrapper': string;
   'textarea__label-wrapper--on-dark': string;
   'textarea--gutterBottom': string;

package/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "description": "The official design system for Helsenorge built with React.",
   "homepage": "https://helsenorge.design",
-  "version": "2.11.1",
+  "version": "2.11.3",
   "author": "Helsenorge",
   "license": "MIT",
   "peerDependencies": {

package/scss/_input.scss

@@ -98,12 +98,12 @@
     }
   }
   &--invalid {
-    border-color: $cherry500;
+    border-color: $cherry600;
 
     &:hover {
       background: $cherry100;
-      border-color: $cherry500;
-      box-shadow: 0px 0px 0px 2px $cherry500;
+      border-color: $cherry600;
+      box-shadow: 0px 0px 0px 2px $cherry600;
     }
     &:focus-within {
       background: $white;