@helsenorge/designsystem-react 2.9.3 → 2.10.1

package/Avatar.js

@@ -0,0 +1,2 @@
+import a from"react";import{Icon as d}from"./components/Icons/Icon.js";import{AnalyticsId as f,IconSize as p}from"./constants.js";import v from"./components/Icons/Check.js";import b from"classnames";import t from"./components/Avatar/styles.module.scss";import{palette as c}from"./theme/palette.js";const g=a.forwardRef(function(s,l){const{children:e,className:m="",selected:r=!1,variant:o="normal",testId:n}=s,i=e.charAt(0).toLocaleUpperCase()+e.substring(1,2);return a.createElement("span",{className:b(t.avatar,r&&t["avatar--selected"],o==="black"&&t["avatar--black"],m),ref:l,"data-testid":n,"data-analyticsid":f.Avatar},r?a.createElement(d,{svgIcon:v,size:p.Small,color:o==="black"?c.neutral900:c.blueberry600}):i)});export{g as A};
+//# sourceMappingURL=Avatar.js.map

package/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Avatar.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React from 'react';\nimport Icon, { IconSize } from '../Icons';\nimport Check from '../Icons/Check';\nimport cn from 'classnames';\n\nimport styles from './styles.module.scss';\n\nimport { palette } from '../../theme/palette';\nimport { AnalyticsId } from '../../constants';\n\nexport interface AvatarProps {\n  /** Name to display in the avatar. Will be truncated to the first two characters. */\n  children: string;\n  /** Displays a check icon to indicated the selected state. */\n  selected?: boolean;\n  /** background and color will be determined on variant. */\n  variant?: 'normal' | 'black';\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type AvatarType = React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;\nconst Avatar: AvatarType = React.forwardRef(function AvatarForwardedRef(props: AvatarProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', selected = false, variant = 'normal', testId } = props;\n  const truncatedName = children.charAt(0).toLocaleUpperCase() + children.substring(1, 2);\n  return (\n    <span\n      className={cn(styles.avatar, selected && styles['avatar--selected'], variant === 'black' && styles['avatar--black'], className)}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Avatar}\n    >\n      {selected ? (\n        <Icon svgIcon={Check} size={IconSize.Small} color={variant === 'black' ? palette.neutral900 : palette.blueberry600} />\n      ) : (\n        truncatedName\n      )}\n    </span>\n  );\n});\n\nexport default Avatar;\n"],"names":["Avatar","React","props","ref","children","className","selected","variant","testId","truncatedName","cn","styles","AnalyticsId","Icon","Check","IconSize","palette"],"mappings":"0SAuBA,MAAMA,EAAqBC,EAAM,WAAW,SAA4BC,EAAoBC,EAAsC,CAC1H,KAAA,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,SAAAC,EAAW,GAAO,QAAAC,EAAU,SAAU,OAAAC,CAAW,EAAAN,EAC7EO,EAAgBL,EAAS,OAAO,CAAC,EAAE,kBAAsB,EAAAA,EAAS,UAAU,EAAG,CAAC,EACtF,OACGH,EAAA,cAAA,OAAA,CACC,UAAWS,EAAGC,EAAO,OAAQL,GAAYK,EAAO,oBAAqBJ,IAAY,SAAWI,EAAO,iBAAkBN,CAAS,EAC9H,IAAAF,EACA,cAAaK,EACb,mBAAkBI,EAAY,MAAA,EAE7BN,EACEL,EAAA,cAAAY,EAAA,CAAK,QAASC,EAAO,KAAMC,EAAS,MAAO,MAAOR,IAAY,QAAUS,EAAQ,WAAaA,EAAQ,YAAA,CAAc,EAEpHP,CAEJ,CAEJ,CAAC"}

package/Badge.js

@@ -1,2 +1,2 @@
-import t from"react";import c from"classnames";import e from"./components/Badge/styles.module.scss";import{AnalyticsId as i}from"./constants.js";const y=t.forwardRef(function(d,s){const{children:r,className:b="",color:a="black",testId:o}=d,l=r.toString().length>2,n=c(e.badge,{[e["badge--oversized"]]:l,[e["badge--black"]]:a==="black",[e["badge--white"]]:a==="white",[e["badge--blueberry"]]:a==="blueberry",[e["badge--banana"]]:a==="banana",[e["badge--cherry"]]:a==="cherry",[e["badge--kiwi"]]:a==="kiwi",[e["badge--neutral"]]:a==="neutral",[e["badge--plum"]]:a==="plum"},b);return t.createElement("span",{className:n,ref:s,"data-testid":o,"data-analyticsid":i.Badge},r)});export{y as B};
+import r from"react";import n from"classnames";import a from"./components/Badge/styles.module.scss";import{AnalyticsId as o}from"./constants.js";const u=r.forwardRef(function(t,d){const{children:b,className:s="",color:e="black",testId:l}=t,c=n(a.badge,{[a["badge--black"]]:e==="black",[a["badge--white"]]:e==="white",[a["badge--blueberry"]]:e==="blueberry",[a["badge--banana"]]:e==="banana",[a["badge--cherry"]]:e==="cherry",[a["badge--kiwi"]]:e==="kiwi",[a["badge--neutral"]]:e==="neutral",[a["badge--plum"]]:e==="plum"},s);return r.createElement("span",{className:c,ref:d,"data-testid":l,"data-analyticsid":o.Badge},b)});export{u as B};
 //# sourceMappingURL=Badge.js.map

package/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\nimport { PaletteNames } from '../../theme/palette';\n\nimport badgeStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\n\nexport type BadgeColors = PaletteNames;\nexport type BadgeChildren = string | number;\n\ninterface BadgeProps {\n  /** Sets the content of the badge. */\n  children: BadgeChildren;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the badge background color. */\n  color?: BadgeColors;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst Badge = React.forwardRef(function BadgeForwardedRef(props: BadgeProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', color = 'black', testId } = props;\n  const oversized = children.toString().length > 2;\n  const badgeClasses = classNames(\n    badgeStyles.badge,\n    {\n      [badgeStyles['badge--oversized']]: oversized,\n      [badgeStyles['badge--black']]: color === 'black',\n      [badgeStyles['badge--white']]: color === 'white',\n      [badgeStyles['badge--blueberry']]: color === 'blueberry',\n      [badgeStyles['badge--banana']]: color === 'banana',\n      [badgeStyles['badge--cherry']]: color === 'cherry',\n      [badgeStyles['badge--kiwi']]: color === 'kiwi',\n      [badgeStyles['badge--neutral']]: color === 'neutral',\n      [badgeStyles['badge--plum']]: color === 'plum',\n    },\n    className\n  );\n\n  return (\n    <span className={badgeClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Badge}>\n      {children}\n    </span>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","props","ref","children","className","color","testId","oversized","badgeClasses","classNames","badgeStyles","AnalyticsId"],"mappings":"iJAsBA,MAAMA,EAAQC,EAAM,WAAW,SAA2BC,EAAmBC,EAAsC,CACjH,KAAM,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,MAAAC,EAAQ,QAAS,OAAAC,CAAW,EAAAL,EACxDM,EAAYJ,EAAS,SAAS,EAAE,OAAS,EACzCK,EAAeC,EACnBC,EAAY,MACZ,CACE,CAACA,EAAY,qBAAsBH,EACnC,CAACG,EAAY,iBAAkBL,IAAU,QACzC,CAACK,EAAY,iBAAkBL,IAAU,QACzC,CAACK,EAAY,qBAAsBL,IAAU,YAC7C,CAACK,EAAY,kBAAmBL,IAAU,SAC1C,CAACK,EAAY,kBAAmBL,IAAU,SAC1C,CAACK,EAAY,gBAAiBL,IAAU,OACxC,CAACK,EAAY,mBAAoBL,IAAU,UAC3C,CAACK,EAAY,gBAAiBL,IAAU,MAC1C,EACAD,CAAA,EAGF,OACGJ,EAAA,cAAA,OAAA,CAAK,UAAWQ,EAAc,IAAAN,EAAU,cAAaI,EAAQ,mBAAkBK,EAAY,KAAA,EACzFR,CACH,CAEJ,CAAC"}
+{"version":3,"file":"Badge.js","sources":["../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\n\nimport { PaletteNames } from '../../theme/palette';\n\nimport badgeStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\n\nexport type BadgeColors = PaletteNames;\nexport type BadgeChildren = string | number;\n\nexport interface BadgeProps {\n  /** Sets the content of the badge. */\n  children: BadgeChildren;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the badge background color. */\n  color?: BadgeColors;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type BadgeType = React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;\nconst Badge: BadgeType = React.forwardRef(function BadgeForwardedRef(props: BadgeProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', color = 'black', testId } = props;\n  const badgeClasses = classNames(\n    badgeStyles.badge,\n    {\n      [badgeStyles['badge--black']]: color === 'black',\n      [badgeStyles['badge--white']]: color === 'white',\n      [badgeStyles['badge--blueberry']]: color === 'blueberry',\n      [badgeStyles['badge--banana']]: color === 'banana',\n      [badgeStyles['badge--cherry']]: color === 'cherry',\n      [badgeStyles['badge--kiwi']]: color === 'kiwi',\n      [badgeStyles['badge--neutral']]: color === 'neutral',\n      [badgeStyles['badge--plum']]: color === 'plum',\n    },\n    className\n  );\n\n  return (\n    <span className={badgeClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Badge}>\n      {children}\n    </span>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","props","ref","children","className","color","testId","badgeClasses","classNames","badgeStyles","AnalyticsId"],"mappings":"iJAsBA,MAAMA,EAAmBC,EAAM,WAAW,SAA2BC,EAAmBC,EAAsC,CAC5H,KAAM,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,MAAAC,EAAQ,QAAS,OAAAC,CAAW,EAAAL,EACxDM,EAAeC,EACnBC,EAAY,MACZ,CACE,CAACA,EAAY,iBAAkBJ,IAAU,QACzC,CAACI,EAAY,iBAAkBJ,IAAU,QACzC,CAACI,EAAY,qBAAsBJ,IAAU,YAC7C,CAACI,EAAY,kBAAmBJ,IAAU,SAC1C,CAACI,EAAY,kBAAmBJ,IAAU,SAC1C,CAACI,EAAY,gBAAiBJ,IAAU,OACxC,CAACI,EAAY,mBAAoBJ,IAAU,UAC3C,CAACI,EAAY,gBAAiBJ,IAAU,MAC1C,EACAD,CAAA,EAGF,OACGJ,EAAA,cAAA,OAAA,CAAK,UAAWO,EAAc,IAAAL,EAAU,cAAaI,EAAQ,mBAAkBI,EAAY,KAAA,EACzFP,CACH,CAEJ,CAAC"}

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+## [2.10.0](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.9.3&targetVersion=GTv2.10.0) (2023-01-03)
+
+
+### Features
+
+*  nytt komponent linkheader og linkheadertext som brukes i expanderlist og linklist ([5842ffe](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/5842ffe5d547d9f34b61c2409c9aeb957fcb947f)), closes [#289118](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/289118)
+
+
+### Bug Fixes
+
+*  oneliner får ikke unødvendig spacing ([4f1ac33](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/4f1ac33b8405c89f625939454e2600cf9eb2e0a3))
+
+## [2.9.3](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.9.2&targetVersion=GTv2.9.3) (2022-12-13)
+
+
+### Features
+
+*  eksporterer NotificationPanel props ([f052b76](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/commit/f052b765807809a98a88e2d536b87cf388d15e56)), closes [#288630](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/issues/288630)
+
 ## [2.9.2](https://dev.azure.com/nhnfelles/Helsenorge/_git/HN-Designsystem/branchCompare?baseVersion=GTv2.9.1&targetVersion=GTv2.9.2) (2022-12-09)
 
 

package/FormGroup.js

@@ -1,2 +1,2 @@
-import r from"react";import i from"classnames";import a from"./components/FormGroup/styles.module.scss";import{C as I}from"./Checkbox.js";import{FormMode as C,FormVariant as _,AnalyticsId as x}from"./constants.js";import{R}from"./RadioButton.js";import{I as T}from"./Input.js";import{T as M}from"./Title.js";import{F as S}from"./FormLayout.js";import{E as B}from"./ErrorWrapper.js";import{S as V}from"./Select.js";const W=r.forwardRef((t,N)=>{const{className:k,fieldsetClassName:w,mode:n=C.onwhite,variant:s=_.normal,error:m,name:o,htmlMarkup:d="fieldset",renderError:F=!0}=t,f=n===C.ondark,u=s===_.bigform,b=i(a["form-group-wrapper"],{[a["form-group-wrapper--on-dark"]]:f,[a["form-group-wrapper--invalid"]]:m},k),v=i(a["form-group-wrapper__title"],{[a["form-group-wrapper__title--on-dark"]]:f&&!m,[a["form-group-wrapper__title--bigform"]]:u}),G=i(a["form-group"]),c=i(a["field-set__legend"],{[a["field-set__legend--on-dark"]]:f&&!m,[a["field-set__legend--bigform"]]:u}),g=i(a["field-set"],w),l=(e,y)=>r.isValidElement(e)&&e.type===y,p=e=>l(e,S)?r.cloneElement(e,{variant:s,mapHelper:p}):l(e,W)?r.cloneElement(e,{mode:n,variant:s,error:m,renderError:!1}):l(e,I)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,R)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,T)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,V)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,error:!!m}):e,E=()=>r.createElement("div",{className:G},d==="div"&&r.createElement("div",{id:t.title,className:g},t.legend&&r.createElement("h5",{className:c},t.legend),r.Children.map(t.children,p)),d==="fieldset"&&r.createElement("fieldset",{name:t.title,className:g},t.legend&&r.createElement("legend",{className:c},t.legend),r.Children.map(t.children,p)));return r.createElement("div",{"data-testid":t.testId,"data-analyticsid":x.FormGroup,className:b,ref:N,tabIndex:-1},t.title&&r.createElement(M,{className:v,htmlMarkup:"h4",appearance:"title4",margin:{marginTop:0,marginBottom:m?1:2}},t.title),F?r.createElement(B,{errorText:m},E()):E())});export{W as F};
+import r from"react";import i from"classnames";import a from"./components/FormGroup/styles.module.scss";import{C as I}from"./Checkbox.js";import{FormMode as C,FormVariant as _,AnalyticsId as x}from"./constants.js";import{R as y}from"./RadioButton.js";import{I as R}from"./Input.js";import{T}from"./Title.js";import{F as M}from"./FormLayout.js";import{E as S}from"./ErrorWrapper.js";import{S as B}from"./Select.js";import{isComponent as l}from"./utils/component.js";const W=r.forwardRef((t,N)=>{const{className:k,fieldsetClassName:w,mode:n=C.onwhite,variant:s=_.normal,error:m,name:o,htmlMarkup:d="fieldset",renderError:F=!0}=t,f=n===C.ondark,u=s===_.bigform,b=i(a["form-group-wrapper"],{[a["form-group-wrapper--on-dark"]]:f,[a["form-group-wrapper--invalid"]]:m},k),v=i(a["form-group-wrapper__title"],{[a["form-group-wrapper__title--on-dark"]]:f&&!m,[a["form-group-wrapper__title--bigform"]]:u}),G=i(a["form-group"]),c=i(a["field-set__legend"],{[a["field-set__legend--on-dark"]]:f&&!m,[a["field-set__legend--bigform"]]:u}),g=i(a["field-set"],w),p=e=>l(e,M)?r.cloneElement(e,{variant:s,mapHelper:p}):l(e,W)?r.cloneElement(e,{mode:n,variant:s,error:m,renderError:!1}):l(e,I)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,y)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,R)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,variant:s,error:!!m}):l(e,B)?r.cloneElement(e,{name:o!=null?o:e.props.name,mode:n,error:!!m}):e,E=()=>r.createElement("div",{className:G},d==="div"&&r.createElement("div",{id:t.title,className:g},t.legend&&r.createElement("h5",{className:c},t.legend),r.Children.map(t.children,p)),d==="fieldset"&&r.createElement("fieldset",{name:t.title,className:g},t.legend&&r.createElement("legend",{className:c},t.legend),r.Children.map(t.children,p)));return r.createElement("div",{"data-testid":t.testId,"data-analyticsid":x.FormGroup,className:b,ref:N,tabIndex:-1},t.title&&r.createElement(T,{className:v,htmlMarkup:"h4",appearance:"title4",margin:{marginTop:0,marginBottom:m?1:2}},t.title),F?r.createElement(S,{errorText:m},E()):E())});export{W as F};
 //# sourceMappingURL=FormGroup.js.map

package/FormGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"FormGroup.js","sources":["../src/components/FormGroup/FormGroup.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport formGroupStyles from './styles.module.scss';\nimport Checkbox, { CheckboxProps } from '../Checkbox/Checkbox';\nimport { AnalyticsId, FormMode, FormVariant } from '../../constants';\nimport RadioButton, { RadioButtonProps } from '../RadioButton/RadioButton';\nimport Input, { InputProps } from '../Input/Input';\nimport Title from '../Title';\nimport FormLayout, { FormLayoutProps } from '../FormLayout';\nimport ErrorWrapper from '../ErrorWrapper';\nimport Select, { SelectProps } from '../Select';\n\nexport type FormGroupTags = 'fieldset' | 'div';\n\nexport interface FormGroupProps {\n  /** title for the the fieldset */\n  title?: string;\n  /** text placed in the legend tag of the fieldset */\n  legend?: string;\n  /** Items in the FormGroup component */\n  children?: React.ReactNode;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds custom classes to the fieldset element. */\n  fieldsetClassName?: string;\n  /** Changes the visuals of the formgroup */\n  mode?: keyof typeof FormMode;\n  /** Changes the visuals of the formgroup */\n  variant?: keyof typeof FormVariant;\n  /** Error message */\n  error?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Unique identifyer for the child input tags */\n  name?: string;\n  /** Sets div instead of fieldset tag */\n  htmlMarkup?: FormGroupTags;\n  /** Renders the error component (Default: true) */\n  renderError?: boolean;\n}\n\nexport const FormGroup = React.forwardRef((props: FormGroupProps, ref: React.ForwardedRef<HTMLDivElement>) => {\n  const {\n    className,\n    fieldsetClassName,\n    mode = FormMode.onwhite,\n    variant = FormVariant.normal,\n    error,\n    name,\n    htmlMarkup = 'fieldset',\n    renderError = true,\n  } = props;\n  const onDark = mode === FormMode.ondark;\n  const bigform = variant === FormVariant.bigform;\n  const formGroupWrapperClasses = classNames(\n    formGroupStyles['form-group-wrapper'],\n    {\n      [formGroupStyles['form-group-wrapper--on-dark']]: onDark,\n      [formGroupStyles['form-group-wrapper--invalid']]: error,\n    },\n    className\n  );\n  const titleClasses = classNames(formGroupStyles['form-group-wrapper__title'], {\n    [formGroupStyles['form-group-wrapper__title--on-dark']]: onDark && !error,\n    [formGroupStyles['form-group-wrapper__title--bigform']]: bigform,\n  });\n  const formGroupClasses = classNames(formGroupStyles['form-group']);\n\n  const legendClasses = classNames(formGroupStyles['field-set__legend'], {\n    [formGroupStyles['field-set__legend--on-dark']]: onDark && !error,\n    [formGroupStyles['field-set__legend--bigform']]: bigform,\n  });\n\n  const fieldsetClasses = classNames(formGroupStyles['field-set'], fieldsetClassName);\n\n  const isComponent = <T,>(element: {} | null | undefined, type: React.ForwardRefExoticComponent<T>): element is React.ReactElement<T> =>\n    React.isValidElement<T>(element) && (element as React.ReactElement).type === type;\n\n  const mapFormComponent = (child: React.ReactNode): React.ReactNode => {\n    if (isComponent<FormGroupProps>(child, FormLayout)) {\n      return React.cloneElement(child as React.ReactElement<FormLayoutProps>, {\n        variant,\n        mapHelper: mapFormComponent,\n      });\n    } else if (isComponent<FormGroupProps>(child, FormGroup)) {\n      return React.cloneElement(child, {\n        mode,\n        variant,\n        error,\n        renderError: false,\n      });\n    } else if (isComponent<CheckboxProps>(child, Checkbox)) {\n      return React.cloneElement(child as React.ReactElement<CheckboxProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<RadioButtonProps>(child, RadioButton)) {\n      return React.cloneElement(child as React.ReactElement<RadioButtonProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<InputProps>(child, Input)) {\n      return React.cloneElement(child as React.ReactElement<InputProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<SelectProps>(child, Select)) {\n      return React.cloneElement(child as React.ReactElement<SelectProps>, {\n        name: name ?? child.props.name,\n        mode,\n        error: !!error,\n      });\n    }\n    return child;\n  };\n\n  const formGroupContent = () => {\n    return (\n      <div className={formGroupClasses}>\n        {htmlMarkup === 'div' && (\n          <div id={props.title} className={fieldsetClasses}>\n            {props.legend && <h5 className={legendClasses}>{props.legend}</h5>}\n            {React.Children.map(props.children, mapFormComponent)}\n          </div>\n        )}\n        {htmlMarkup === 'fieldset' && (\n          <fieldset name={props.title} className={fieldsetClasses}>\n            {props.legend && <legend className={legendClasses}>{props.legend}</legend>}\n            {React.Children.map(props.children, mapFormComponent)}\n          </fieldset>\n        )}\n      </div>\n    );\n  };\n\n  return (\n    <div data-testid={props.testId} data-analyticsid={AnalyticsId.FormGroup} className={formGroupWrapperClasses} ref={ref} tabIndex={-1}>\n      {props.title && (\n        <Title className={titleClasses} htmlMarkup={'h4'} appearance={'title4'} margin={{ marginTop: 0, marginBottom: error ? 1 : 2 }}>\n          {props.title}\n        </Title>\n      )}\n      {renderError ? <ErrorWrapper errorText={error}>{formGroupContent()}</ErrorWrapper> : formGroupContent()}\n    </div>\n  );\n});\n\nexport default FormGroup;\n"],"names":["FormGroup","React","props","ref","className","fieldsetClassName","mode","FormMode","variant","FormVariant","error","name","htmlMarkup","renderError","onDark","bigform","formGroupWrapperClasses","classNames","formGroupStyles","titleClasses","formGroupClasses","legendClasses","fieldsetClasses","isComponent","element","type","mapFormComponent","child","FormLayout","Checkbox","RadioButton","Input","Select","formGroupContent","AnalyticsId","Title","ErrorWrapper"],"mappings":"8ZA2CO,MAAMA,EAAYC,EAAM,WAAW,CAACC,EAAuBC,IAA4C,CACtG,KAAA,CACJ,UAAAC,EACA,kBAAAC,EACA,KAAAC,EAAOC,EAAS,QAChB,QAAAC,EAAUC,EAAY,OACtB,MAAAC,EACA,KAAAC,EACA,WAAAC,EAAa,WACb,YAAAC,EAAc,EACZ,EAAAX,EACEY,EAASR,IAASC,EAAS,OAC3BQ,EAAUP,IAAYC,EAAY,QAClCO,EAA0BC,EAC9BC,EAAgB,sBAChB,CACE,CAACA,EAAgB,gCAAiCJ,EAClD,CAACI,EAAgB,gCAAiCR,CACpD,EACAN,CAAA,EAEIe,EAAeF,EAAWC,EAAgB,6BAA8B,CAC5E,CAACA,EAAgB,uCAAwCJ,GAAU,CAACJ,EACpE,CAACQ,EAAgB,uCAAwCH,CAAA,CAC1D,EACKK,EAAmBH,EAAWC,EAAgB,aAAa,EAE3DG,EAAgBJ,EAAWC,EAAgB,qBAAsB,CACrE,CAACA,EAAgB,+BAAgCJ,GAAU,CAACJ,EAC5D,CAACQ,EAAgB,+BAAgCH,CAAA,CAClD,EAEKO,EAAkBL,EAAWC,EAAgB,aAAcb,CAAiB,EAE5EkB,EAAc,CAAKC,EAAgCC,IACvDxB,EAAM,eAAkBuB,CAAO,GAAMA,EAA+B,OAASC,EAEzEC,EAAoBC,GACpBJ,EAA4BI,EAAOC,CAAU,EACxC3B,EAAM,aAAa0B,EAA8C,CACtE,QAAAnB,EACA,UAAWkB,CAAA,CACZ,EACQH,EAA4BI,EAAO3B,CAAS,EAC9CC,EAAM,aAAa0B,EAAO,CAC/B,KAAArB,EACA,QAAAE,EACA,MAAAE,EACA,YAAa,EAAA,CACd,EACQa,EAA2BI,EAAOE,CAAQ,EAC5C5B,EAAM,aAAa0B,EAA4C,CACpE,KAAMhB,GAAA,KAAAA,EAAQgB,EAAM,MAAM,KAC1B,KAAArB,EACA,QAAAE,EACA,MAAO,CAAC,CAACE,CAAA,CACV,EACQa,EAA8BI,EAAOG,CAAW,EAClD7B,EAAM,aAAa0B,EAA+C,CACvE,KAAMhB,GAAA,KAAAA,EAAQgB,EAAM,MAAM,KAC1B,KAAArB,EACA,QAAAE,EACA,MAAO,CAAC,CAACE,CAAA,CACV,EACQa,EAAwBI,EAAOI,CAAK,EACtC9B,EAAM,aAAa0B,EAAyC,CACjE,KAAMhB,GAAA,KAAAA,EAAQgB,EAAM,MAAM,KAC1B,KAAArB,EACA,QAAAE,EACA,MAAO,CAAC,CAACE,CAAA,CACV,EACQa,EAAyBI,EAAOK,CAAM,EACxC/B,EAAM,aAAa0B,EAA0C,CAClE,KAAMhB,GAAA,KAAAA,EAAQgB,EAAM,MAAM,KAC1B,KAAArB,EACA,MAAO,CAAC,CAACI,CAAA,CACV,EAEIiB,EAGHM,EAAmB,IAEpBhC,EAAA,cAAA,MAAA,CAAI,UAAWmB,CACb,EAAAR,IAAe,OACbX,EAAA,cAAA,MAAA,CAAI,GAAIC,EAAM,MAAO,UAAWoB,CAC9B,EAAApB,EAAM,QAAWD,EAAA,cAAA,KAAA,CAAG,UAAWoB,CAAA,EAAgBnB,EAAM,MAAO,EAC5DD,EAAM,SAAS,IAAIC,EAAM,SAAUwB,CAAgB,CACtD,EAEDd,IAAe,YACbX,EAAA,cAAA,WAAA,CAAS,KAAMC,EAAM,MAAO,UAAWoB,CACrC,EAAApB,EAAM,QAAWD,EAAA,cAAA,SAAA,CAAO,UAAWoB,CAAgB,EAAAnB,EAAM,MAAO,EAChED,EAAM,SAAS,IAAIC,EAAM,SAAUwB,CAAgB,CACtD,CAEJ,EAIJ,OACGzB,EAAA,cAAA,MAAA,CAAI,cAAaC,EAAM,OAAQ,mBAAkBgC,EAAY,UAAW,UAAWlB,EAAyB,IAAAb,EAAU,SAAU,EAC9H,EAAAD,EAAM,OACJD,EAAA,cAAAkC,EAAA,CAAM,UAAWhB,EAAc,WAAY,KAAM,WAAY,SAAU,OAAQ,CAAE,UAAW,EAAG,aAAcT,EAAQ,EAAI,CAAE,CAAA,EACzHR,EAAM,KACT,EAEDW,EAAeZ,EAAA,cAAAmC,EAAA,CAAa,UAAW1B,CAAA,EAAQuB,EAAmB,CAAA,EAAkBA,EAAA,CACvF,CAEJ,CAAC"}
+{"version":3,"file":"FormGroup.js","sources":["../src/components/FormGroup/FormGroup.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport formGroupStyles from './styles.module.scss';\nimport Checkbox, { CheckboxProps } from '../Checkbox/Checkbox';\nimport { AnalyticsId, FormMode, FormVariant } from '../../constants';\nimport RadioButton, { RadioButtonProps } from '../RadioButton/RadioButton';\nimport Input, { InputProps } from '../Input/Input';\nimport Title from '../Title';\nimport FormLayout, { FormLayoutProps } from '../FormLayout';\nimport ErrorWrapper from '../ErrorWrapper';\nimport Select, { SelectProps } from '../Select';\nimport { isComponent } from '../../utils/component';\n\nexport type FormGroupTags = 'fieldset' | 'div';\n\nexport interface FormGroupProps {\n  /** title for the the fieldset */\n  title?: string;\n  /** text placed in the legend tag of the fieldset */\n  legend?: string;\n  /** Items in the FormGroup component */\n  children?: React.ReactNode;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds custom classes to the fieldset element. */\n  fieldsetClassName?: string;\n  /** Changes the visuals of the formgroup */\n  mode?: keyof typeof FormMode;\n  /** Changes the visuals of the formgroup */\n  variant?: keyof typeof FormVariant;\n  /** Error message */\n  error?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Unique identifyer for the child input tags */\n  name?: string;\n  /** Sets div instead of fieldset tag */\n  htmlMarkup?: FormGroupTags;\n  /** Renders the error component (Default: true) */\n  renderError?: boolean;\n}\n\nexport const FormGroup = React.forwardRef((props: FormGroupProps, ref: React.ForwardedRef<HTMLDivElement>) => {\n  const {\n    className,\n    fieldsetClassName,\n    mode = FormMode.onwhite,\n    variant = FormVariant.normal,\n    error,\n    name,\n    htmlMarkup = 'fieldset',\n    renderError = true,\n  } = props;\n  const onDark = mode === FormMode.ondark;\n  const bigform = variant === FormVariant.bigform;\n  const formGroupWrapperClasses = classNames(\n    formGroupStyles['form-group-wrapper'],\n    {\n      [formGroupStyles['form-group-wrapper--on-dark']]: onDark,\n      [formGroupStyles['form-group-wrapper--invalid']]: error,\n    },\n    className\n  );\n  const titleClasses = classNames(formGroupStyles['form-group-wrapper__title'], {\n    [formGroupStyles['form-group-wrapper__title--on-dark']]: onDark && !error,\n    [formGroupStyles['form-group-wrapper__title--bigform']]: bigform,\n  });\n  const formGroupClasses = classNames(formGroupStyles['form-group']);\n\n  const legendClasses = classNames(formGroupStyles['field-set__legend'], {\n    [formGroupStyles['field-set__legend--on-dark']]: onDark && !error,\n    [formGroupStyles['field-set__legend--bigform']]: bigform,\n  });\n\n  const fieldsetClasses = classNames(formGroupStyles['field-set'], fieldsetClassName);\n\n  const mapFormComponent = (child: React.ReactNode): React.ReactNode => {\n    if (isComponent<FormGroupProps>(child, FormLayout)) {\n      return React.cloneElement(child as React.ReactElement<FormLayoutProps>, {\n        variant,\n        mapHelper: mapFormComponent,\n      });\n    } else if (isComponent<FormGroupProps>(child, FormGroup)) {\n      return React.cloneElement(child, {\n        mode,\n        variant,\n        error,\n        renderError: false,\n      });\n    } else if (isComponent<CheckboxProps>(child, Checkbox)) {\n      return React.cloneElement(child as React.ReactElement<CheckboxProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<RadioButtonProps>(child, RadioButton)) {\n      return React.cloneElement(child as React.ReactElement<RadioButtonProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<InputProps>(child, Input)) {\n      return React.cloneElement(child as React.ReactElement<InputProps>, {\n        name: name ?? child.props.name,\n        mode,\n        variant,\n        error: !!error,\n      });\n    } else if (isComponent<SelectProps>(child, Select)) {\n      return React.cloneElement(child as React.ReactElement<SelectProps>, {\n        name: name ?? child.props.name,\n        mode,\n        error: !!error,\n      });\n    }\n    return child;\n  };\n\n  const formGroupContent = () => {\n    return (\n      <div className={formGroupClasses}>\n        {htmlMarkup === 'div' && (\n          <div id={props.title} className={fieldsetClasses}>\n            {props.legend && <h5 className={legendClasses}>{props.legend}</h5>}\n            {React.Children.map(props.children, mapFormComponent)}\n          </div>\n        )}\n        {htmlMarkup === 'fieldset' && (\n          <fieldset name={props.title} className={fieldsetClasses}>\n            {props.legend && <legend className={legendClasses}>{props.legend}</legend>}\n            {React.Children.map(props.children, mapFormComponent)}\n          </fieldset>\n        )}\n      </div>\n    );\n  };\n\n  return (\n    <div data-testid={props.testId} data-analyticsid={AnalyticsId.FormGroup} className={formGroupWrapperClasses} ref={ref} tabIndex={-1}>\n      {props.title && (\n        <Title className={titleClasses} htmlMarkup={'h4'} appearance={'title4'} margin={{ marginTop: 0, marginBottom: error ? 1 : 2 }}>\n          {props.title}\n        </Title>\n      )}\n      {renderError ? <ErrorWrapper errorText={error}>{formGroupContent()}</ErrorWrapper> : formGroupContent()}\n    </div>\n  );\n});\n\nexport default FormGroup;\n"],"names":["FormGroup","React","props","ref","className","fieldsetClassName","mode","FormMode","variant","FormVariant","error","name","htmlMarkup","renderError","onDark","bigform","formGroupWrapperClasses","classNames","formGroupStyles","titleClasses","formGroupClasses","legendClasses","fieldsetClasses","mapFormComponent","child","isComponent","FormLayout","Checkbox","RadioButton","Input","Select","formGroupContent","AnalyticsId","Title","ErrorWrapper"],"mappings":"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"}

package/ListHeader.js

@@ -0,0 +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};
+//# sourceMappingURL=ListHeader.js.map

package/ListHeader.js.map

@@ -0,0 +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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"}

package/ListHeaderText.js

@@ -0,0 +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};
+//# sourceMappingURL=ListHeaderText.js.map

package/ListHeaderText.js.map

@@ -0,0 +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"}

package/StatusDot.js

@@ -0,0 +1,2 @@
+import o from"react";import t from"classnames";import r from"./components/StatusDot/styles.module.scss";import{IconSize as a,AnalyticsId as _}from"./constants.js";import{Icon as n}from"./components/Icons/Icon.js";import v from"./components/Icons/Undo.js";import{getColor as I}from"./theme/currys/color.js";import E from"./components/Icons/Group.js";import N from"./components/Icons/NoAccess.js";import"./theme/grid.js";import"./hooks/useBreakpoint.js";var X=(e=>(e.info="info",e.warning="warning",e.alert="alert",e.cancelled="cancelled",e.active="active",e.transparent="transparent",e.recurring="recurring",e.group="group",e.noaccess="noaccess",e))(X||{});const U=o.forwardRef(function(m,C){const{variant:s="info",text:i,className:d}=m,l=s==="recurring"||s==="group"||s==="noaccess",p=s==="cancelled",f=t(r.statusdot,{[r["statusdot--cancelled"]]:p},d),g=t(r.statusdot__dot,[l?r["statusdot__dot--icon"]:r[`statusdot__dot--${s}`]]),u=t(r.statusdot__label,{[r["statusdot__label--icon"]]:l});let c=null;return s==="recurring"?c=o.createElement(n,{size:a.XXSmall,svgIcon:v}):s==="group"?c=o.createElement(n,{size:a.XXSmall,svgIcon:E}):s==="noaccess"&&(c=o.createElement(n,{size:a.XXSmall,svgIcon:N,color:I("cherry",600)})),o.createElement("div",{className:f,"data-analyticsid":_.StatusDot},o.createElement("span",{className:g},c),o.createElement("span",{className:u},i))});export{U as S,X as a};
+//# sourceMappingURL=StatusDot.js.map

package/StatusDot.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusDot.js","sources":["../src/components/StatusDot/StatusDot.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport statusDotStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\nimport { Icon } from '../Icons/Icon';\nimport Undo from '../Icons/Undo';\nimport { getColor } from '../../theme/currys';\nimport Group from '../Icons/Group';\nimport NoAccess from '../Icons/NoAccess';\nimport { IconSize } from '../..';\n\nexport enum StatusDotVariant {\n  info = 'info',\n  warning = 'warning',\n  alert = 'alert',\n  cancelled = 'cancelled',\n  active = 'active',\n  transparent = 'transparent',\n  recurring = 'recurring',\n  group = 'group',\n  noaccess = 'noaccess',\n}\n\nexport interface StatusDotProps {\n  /** Visual variants for the statusdot */\n  variant?: keyof typeof StatusDotVariant;\n  /** Text placed to the right of the statusdot */\n  text: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n}\n\nconst Spacer = React.forwardRef(function SpacerForwardedRef(props: StatusDotProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { variant = StatusDotVariant.info, text, className } = props;\n  const hasIcon = variant === StatusDotVariant.recurring || variant === StatusDotVariant.group || variant === StatusDotVariant.noaccess;\n  const isCancelled = variant === StatusDotVariant.cancelled;\n  const statusDotClasses = classNames(statusDotStyles['statusdot'], { [statusDotStyles['statusdot--cancelled']]: isCancelled }, className);\n  const dotClasses = classNames(statusDotStyles['statusdot__dot'], [\n    hasIcon ? statusDotStyles[`statusdot__dot--icon`] : statusDotStyles[`statusdot__dot--${variant}`],\n  ]);\n  const labelClasses = classNames(statusDotStyles['statusdot__label'], {\n    [statusDotStyles[`statusdot__label--icon`]]: hasIcon,\n  });\n  let svgIcon: JSX.Element | null = null;\n\n  if (variant === StatusDotVariant.recurring) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={Undo} />;\n  } else if (variant === StatusDotVariant.group) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={Group} />;\n  } else if (variant === StatusDotVariant.noaccess) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={NoAccess} color={getColor('cherry', 600)} />;\n  }\n\n  return (\n    <div className={statusDotClasses} data-analyticsid={AnalyticsId.StatusDot}>\n      <span className={dotClasses}>{svgIcon}</span>\n      <span className={labelClasses}>{text}</span>\n    </div>\n  );\n});\n\nexport default Spacer;\n"],"names":["StatusDotVariant","Spacer","React","props","ref","variant","text","className","hasIcon","isCancelled","statusDotClasses","classNames","statusDotStyles","dotClasses","labelClasses","svgIcon","Icon","IconSize","Undo","Group","NoAccess","getColor","AnalyticsId"],"mappings":"ocAaY,IAAAA,GAAAA,IACVA,EAAA,KAAO,OACPA,EAAA,QAAU,UACVA,EAAA,MAAQ,QACRA,EAAA,UAAY,YACZA,EAAA,OAAS,SACTA,EAAA,YAAc,cACdA,EAAA,UAAY,YACZA,EAAA,MAAQ,QACRA,EAAA,SAAW,WATDA,IAAAA,GAAA,CAAA,CAAA,EAqBZ,MAAMC,EAASC,EAAM,WAAW,SAA4BC,EAAuBC,EAAsC,CACvH,KAAM,CAAE,QAAAC,EAAU,OAAuB,KAAAC,EAAM,UAAAC,GAAcJ,EACvDK,EAAUH,IAAY,aAA8BA,IAAY,SAA0BA,IAAY,WACtGI,EAAcJ,IAAY,YAC1BK,EAAmBC,EAAWC,EAAgB,UAAc,CAAE,CAACA,EAAgB,yBAA0BH,CAAY,EAAGF,CAAS,EACjIM,EAAaF,EAAWC,EAAgB,eAAmB,CAC/DJ,EAAUI,EAAgB,wBAA0BA,EAAgB,mBAAmBP,IAAA,CACxF,EACKS,EAAeH,EAAWC,EAAgB,iBAAqB,CACnE,CAACA,EAAgB,2BAA4BJ,CAAA,CAC9C,EACD,IAAIO,EAA8B,KAElC,OAAIV,IAAY,YACdU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASC,CAAA,CAAM,EAC9Cb,IAAY,QACrBU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASE,CAAA,CAAO,EAC/Cd,IAAY,aACrBU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASG,EAAU,MAAOC,EAAS,SAAU,GAAG,CAAA,CAAG,GAI1FnB,EAAA,cAAA,MAAA,CAAI,UAAWQ,EAAkB,mBAAkBY,EAAY,SAAA,EAC7DpB,EAAA,cAAA,OAAA,CAAK,UAAWW,CAAa,EAAAE,CAAQ,EACrCb,EAAA,cAAA,OAAA,CAAK,UAAWY,CAAA,EAAeR,CAAK,CACvC,CAEJ,CAAC"}

package/components/Avatar/Avatar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-interface AvatarProps {
+export interface AvatarProps {
     /** Name to display in the avatar. Will be truncated to the first two characters. */
     children: string;
     /** Displays a check icon to indicated the selected state. */
@@ -11,6 +11,7 @@ interface AvatarProps {
     /** Sets the data-testid attribute. */
     testId?: string;
 }
-declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;
+export declare type AvatarType = React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;
+declare const Avatar: AvatarType;
 export default Avatar;
 //# sourceMappingURL=Avatar.d.ts.map

package/components/Avatar/Avatar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,UAAU,WAAW;IACnB,oFAAoF;IACpF,QAAQ,EAAE,MAAM,CAAC;IACjB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,MAAM,iFAiBV,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,WAAW,WAAW;IAC1B,oFAAoF;IACpF,QAAQ,EAAE,MAAM,CAAC;IACjB,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAC;IAC7B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AACD,oBAAY,UAAU,GAAG,KAAK,CAAC,yBAAyB,CAAC,WAAW,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC;AACzG,QAAA,MAAM,MAAM,EAAE,UAiBZ,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/components/Avatar/index.js

@@ -1,2 +1,2 @@
-import a from"react";import{Icon as p}from"../Icons/Icon.js";import{AnalyticsId as d,IconSize as f}from"../../constants.js";import v from"../Icons/Check.js";import u from"classnames";import t from"./styles.module.scss";import{palette as c}from"../../theme/palette.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";const C=a.forwardRef(function(s,m){const{children:r,className:l="",selected:e=!1,variant:o="normal",testId:i}=s,n=r.charAt(0).toLocaleUpperCase()+r.substring(1,2);return a.createElement("span",{className:u(t.avatar,e&&t["avatar--selected"],o==="black"&&t["avatar--black"],l),ref:m,"data-testid":i,"data-analyticsid":d.Avatar},e?a.createElement(p,{svgIcon:v,size:f.Small,color:o==="black"?c.neutral900:c.blueberry600}):n)});export{C as default};
+import"../../Avatar.js";import{A as v}from"../../Avatar.js";import"react";import"../Icons/Icon.js";import"classnames";import"../../constants.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"./styles.module.scss";import"../../theme/palette.js";export{v as default};
 //# sourceMappingURL=index.js.map

package/components/Avatar/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React from 'react';\nimport Icon, { IconSize } from '../Icons';\nimport Check from '../Icons/Check';\nimport cn from 'classnames';\n\nimport styles from './styles.module.scss';\n\nimport { palette } from '../../theme/palette';\nimport { AnalyticsId } from '../../constants';\n\ninterface AvatarProps {\n  /** Name to display in the avatar. Will be truncated to the first two characters. */\n  children: string;\n  /** Displays a check icon to indicated the selected state. */\n  selected?: boolean;\n  /** background and color will be determined on variant. */\n  variant?: 'normal' | 'black';\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst Avatar = React.forwardRef(function AvatarForwardedRef(props: AvatarProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', selected = false, variant = 'normal', testId } = props;\n  const truncatedName = children.charAt(0).toLocaleUpperCase() + children.substring(1, 2);\n  return (\n    <span\n      className={cn(styles.avatar, selected && styles['avatar--selected'], variant === 'black' && styles['avatar--black'], className)}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Avatar}\n    >\n      {selected ? (\n        <Icon svgIcon={Check} size={IconSize.Small} color={variant === 'black' ? palette.neutral900 : palette.blueberry600} />\n      ) : (\n        truncatedName\n      )}\n    </span>\n  );\n});\n\nexport default Avatar;\n"],"names":["Avatar","React","props","ref","children","className","selected","variant","testId","truncatedName","cn","styles","AnalyticsId","Icon","Check","IconSize","palette"],"mappings":"oWAuBA,MAAMA,EAASC,EAAM,WAAW,SAA4BC,EAAoBC,EAAsC,CAC9G,KAAA,CAAE,SAAAC,EAAU,UAAAC,EAAY,GAAI,SAAAC,EAAW,GAAO,QAAAC,EAAU,SAAU,OAAAC,CAAW,EAAAN,EAC7EO,EAAgBL,EAAS,OAAO,CAAC,EAAE,kBAAsB,EAAAA,EAAS,UAAU,EAAG,CAAC,EACtF,OACGH,EAAA,cAAA,OAAA,CACC,UAAWS,EAAGC,EAAO,OAAQL,GAAYK,EAAO,oBAAqBJ,IAAY,SAAWI,EAAO,iBAAkBN,CAAS,EAC9H,IAAAF,EACA,cAAaK,EACb,mBAAkBI,EAAY,MAAA,EAE7BN,EACEL,EAAA,cAAAY,EAAA,CAAK,QAASC,EAAO,KAAMC,EAAS,MAAO,MAAOR,IAAY,QAAUS,EAAQ,WAAaA,EAAQ,YAAA,CAAc,EAEpHP,CAEJ,CAEJ,CAAC"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/Badge/Badge.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { PaletteNames } from '../../theme/palette';
 export declare type BadgeColors = PaletteNames;
 export declare type BadgeChildren = string | number;
-interface BadgeProps {
+export interface BadgeProps {
     /** Sets the content of the badge. */
     children: BadgeChildren;
     /** Adds custom classes to the element. */
@@ -12,6 +12,7 @@ interface BadgeProps {
     /** Sets the data-testid attribute. */
     testId?: string;
 }
-declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
+export declare type BadgeType = React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
+declare const Badge: BadgeType;
 export default Badge;
 //# sourceMappingURL=Badge.d.ts.map

package/components/Badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAKnD,oBAAY,WAAW,GAAG,YAAY,CAAC;AACvC,oBAAY,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAE5C,UAAU,UAAU;IAClB,qCAAqC;IACrC,QAAQ,EAAE,aAAa,CAAC;IACxB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,QAAA,MAAM,KAAK,gFAwBT,CAAC;AAEH,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/Badge/Badge.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AAKnD,oBAAY,WAAW,GAAG,YAAY,CAAC;AACvC,oBAAY,aAAa,GAAG,MAAM,GAAG,MAAM,CAAC;AAE5C,MAAM,WAAW,UAAU;IACzB,qCAAqC;IACrC,QAAQ,EAAE,aAAa,CAAC;IACxB,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AACD,oBAAY,SAAS,GAAG,KAAK,CAAC,yBAAyB,CAAC,UAAU,GAAG,KAAK,CAAC,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC;AACvG,QAAA,MAAM,KAAK,EAAE,SAsBX,CAAC;AAEH,eAAe,KAAK,CAAC"}

package/components/Badge/styles.module.scss

@@ -9,13 +9,10 @@
   min-width: 1.375rem;
   height: 1.375rem;
   border-radius: 1rem;
-  padding: 0;
+  padding: 0 0.375rem;
   color: $white;
   background-color: $black;
 
-  &--oversized {
-    padding: 0 0.25rem;
-  }
   &--white {
     color: $black;
     background-color: $white;

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

@@ -5,7 +5,6 @@ export type Styles = {
   'badge--cherry': string;
   'badge--kiwi': string;
   'badge--neutral': string;
-  'badge--oversized': string;
   'badge--plum': string;
   'badge--white': string;
 };

package/components/ExpanderList/ExpanderList.d.ts

@@ -1,14 +1,18 @@
 import React from 'react';
 import { PaletteNames } from '../../theme/palette';
+import { ListHeaderType } from '../ListHeader/ListHeader';
 export declare type ExpanderListColors = PaletteNames;
-export declare type ExpanderType = React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>>;
+export interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {
+    ListHeader?: ListHeaderType;
+}
 export interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {
     Expander: ExpanderType;
 }
+export declare type ExpanderListVariant = 'line' | 'outline' | 'fill';
 interface ExpanderListProps {
     /** Toggles accordion functionality for the expanders. */
     accordion?: boolean;
-    /** Toggles the bottom border of the last child element. */
+    /** @deprecated Skal fases ut - Brukes ikke lenger. */
     bottomBorder?: boolean;
     /** Items in the ExpanderList */
     children: React.ReactNode;
@@ -25,12 +29,14 @@ interface ExpanderListProps {
     isOpen?: boolean;
     /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */
     renderChildrenWhenClosed?: boolean;
-    /** Toggles the top border of the first child element. */
+    /** @deprecated Skal fases ut - Brukes ikke lenger. */
     topBorder?: boolean;
     /** Stick expander trigger to top of screen while scrolling down */
     sticky?: boolean;
     /** Sets the data-testid attribute. */
     testId?: string;
+    /** Sets visual priority */
+    variant?: ExpanderListVariant;
 }
 declare type Modify<T, R> = Omit<T, keyof R> & R;
 declare type ExpanderProps = Modify<React.HTMLAttributes<HTMLButtonElement>, {
@@ -47,7 +53,7 @@ declare type ExpanderProps = Modify<React.HTMLAttributes<HTMLButtonElement>, {
     handleExpanderClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
     /** Called when expander is open/closed. */
     onExpand?: (isExpanded: boolean) => void;
-}> & Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'sticky'>;
+}> & Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'sticky' | 'variant'>;
 export declare const ExpanderList: ExpanderListCompound;
 export default ExpanderList;
 //# sourceMappingURL=ExpanderList.d.ts.map

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;AAkBnD,oBAAY,kBAAkB,GAAG,YAAY,CAAC;AAC9C,oBAAY,YAAY,GAAG,KAAK,CAAC,yBAAyB,CAAC,aAAa,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAE/G,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,yBAAyB,CAAC,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,CAAC;IACtI,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,UAAU,iBAAiB;IACzB,yDAAyD;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,2DAA2D;IAC3D,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,yDAAyD;IACzD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;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,CAAC,CAAC;AAoHjE,eAAO,MAAM,YAAY,sBA6FC,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;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"}

package/components/ExpanderList/componentdata.json

@@ -1 +1 @@
-{"props":{"accordion":{"defaultValue":null,"description":"Toggles accordion functionality for the expanders.","name":"accordion","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"bottomBorder":{"defaultValue":null,"description":"Toggles the bottom border of the last child element.","name":"bottomBorder","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"children":{"defaultValue":null,"description":"Items in the ExpanderList","name":"children","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":true,"type":{"name":"ReactNode"}},"childPadding":{"defaultValue":null,"description":"Toggles padding of child elements","name":"childPadding","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"string"}},"color":{"defaultValue":null,"description":"Changes the link list background color on hover.","name":"color","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"enum","raw":"PaletteNames","value":[{"value":"\"banana\""},{"value":"\"blueberry\""},{"value":"\"cherry\""},{"value":"\"kiwi\""},{"value":"\"neutral\""},{"value":"\"plum\""},{"value":"\"black\""},{"value":"\"white\""}]}},"large":{"defaultValue":null,"description":"Changes the font size.","name":"large","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"isOpen":{"defaultValue":null,"description":"@deprecated Skal fases ut til fordel for å bruke expanded-prop på første ExpanderList.Expander","name":"isOpen","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"renderChildrenWhenClosed":{"defaultValue":null,"description":"Whether to render children when closed (in which case they are hidden with CSS). Default: false","name":"renderChildrenWhenClosed","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"topBorder":{"defaultValue":null,"description":"Toggles the top border of the first child element.","name":"topBorder","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"sticky":{"defaultValue":null,"description":"Stick expander trigger to top of screen while scrolling down","name":"sticky","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"string"}}}}
+{"props":{"accordion":{"defaultValue":null,"description":"Toggles accordion functionality for the expanders.","name":"accordion","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"bottomBorder":{"defaultValue":null,"description":"@deprecated Skal fases ut - Brukes ikke lenger.","name":"bottomBorder","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"children":{"defaultValue":null,"description":"Items in the ExpanderList","name":"children","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":true,"type":{"name":"ReactNode"}},"childPadding":{"defaultValue":null,"description":"Toggles padding of child elements","name":"childPadding","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"string"}},"color":{"defaultValue":null,"description":"Changes the link list background color on hover.","name":"color","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"enum","raw":"PaletteNames","value":[{"value":"\"banana\""},{"value":"\"blueberry\""},{"value":"\"cherry\""},{"value":"\"kiwi\""},{"value":"\"neutral\""},{"value":"\"plum\""},{"value":"\"black\""},{"value":"\"white\""}]}},"large":{"defaultValue":null,"description":"Changes the font size.","name":"large","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"isOpen":{"defaultValue":null,"description":"@deprecated Skal fases ut til fordel for å bruke expanded-prop på første ExpanderList.Expander","name":"isOpen","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"renderChildrenWhenClosed":{"defaultValue":null,"description":"Whether to render children when closed (in which case they are hidden with CSS). Default: false","name":"renderChildrenWhenClosed","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"topBorder":{"defaultValue":null,"description":"@deprecated Skal fases ut - Brukes ikke lenger.","name":"topBorder","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"sticky":{"defaultValue":null,"description":"Stick expander trigger to top of screen while scrolling down","name":"sticky","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"boolean"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"string"}},"variant":{"defaultValue":null,"description":"Sets visual priority","name":"variant","parent":{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"},"declarations":[{"fileName":"src/components/ExpanderList/ExpanderList.tsx","name":"ExpanderListProps"}],"required":false,"type":{"name":"enum","raw":"ExpanderListVariant","value":[{"value":"\"line\""},{"value":"\"outline\""},{"value":"\"fill\""}]}}}}

package/components/ExpanderList/index.js

@@ -1,2 +1,2 @@
-import r,{useState as A,useRef as V,useEffect as _}from"react";import{Icon as Z}from"../Icons/Icon.js";import{AnalyticsId as P,ZIndex as q,IconSize as T}from"../../constants.js";import F from"../Icons/ChevronUp.js";import G from"../Icons/ChevronDown.js";import{useHover as K}from"../../hooks/useHover.js";import{usePrevious as M}from"../../hooks/usePrevious.js";import{useBreakpoint as Q,Breakpoint as Y}from"../../hooks/useBreakpoint.js";import{isElementInViewport as v}from"../../utils/viewport.js";import x from"classnames";import t from"./styles.module.scss";import{useUuid as S}from"../../hooks/useUuid.js";import{useSticky as ee}from"../../hooks/useSticky.js";import{mergeRefs as ne}from"../../utils/refs.js";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/grid.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";const H=r.forwardRef((c,I)=>{const{id:p,children:N,padding:w=!0,color:f="neutral",className:L="",icon:g,large:b=!1,title:d,expanded:m=!1,sticky:R,testId:$,handleExpanderClick:W,onExpand:o,renderChildrenWhenClosed:u}=c,[i,j]=A(m),y=M(i),h=V(null),E=V(null),{isHovered:k}=K(E),z=Q(),{isOutsideWindow:C,isLeavingWindow:n,offsetHeight:e,contentWidth:s}=ee(h,E),a=R&&i&&C,l=typeof d=="object",B=x(L,{[t["expander-list__item--jsx"]]:l}),U=x(t["expander-list-link"],t[`expander-list-link--${f}`],{[t["expander-list-link--closed"]]:!i,[t["expander-list-link--large"]]:b,[t["expander-list-link--jsx"]]:l,[t["expander-list-link--sticky"]]:a&&!n,[t["expander-list-link--absolute"]]:a&&n}),X=x(t["expander-list-link__title"],{[t["expander-list-link__title--string"]]:!l,[t["expander-list-link__title--jsx"]]:l});_(()=>{m!==i&&j(m)},[m]),_(()=>{o&&i!==!!y&&o(i)},[i,o]);const D=()=>{if(!u&&!i)return null;const J=x(t["expander-list-link__main-content"],i&&t["expander-list-link__main-content--expanded"],w?t["expander-list-link__main-content--padding"]:"");return r.createElement("div",{className:J},N)};return r.createElement("li",{className:B,ref:ne([I,h]),style:{paddingTop:a&&e?`${e}px`:void 0}},r.createElement("button",{type:"button",id:p,onClick:W,"data-testid":$,"data-analyticsid":P.ExpanderListExpander,className:U,ref:E,"aria-expanded":i,style:{zIndex:k||a?q.ExpanderTrigger:void 0,width:a&&s?`${s}px`:void 0}},g&&r.createElement("span",{className:t["expander-list-link__icon"]},r.cloneElement(g,{size:z===Y.xs?T.XSmall:T.Small,isHovered:k})),r.createElement("span",{className:X},d),r.createElement("span",{className:t["expander-list-link__chevron"]},r.createElement(Z,{size:T.XSmall,svgIcon:i?F:G,isHovered:k}))),D())}),O=c=>r.isValidElement(c)&&c.type===H,te=r.forwardRef((c,I)=>{const{children:p,childPadding:N=!0,large:w,isOpen:f=!1,renderChildrenWhenClosed:L=!1,color:g,className:b="",accordion:d=!1,topBorder:m=!0,bottomBorder:R=!0,sticky:$=!1,testId:W}=c,[o,u]=A(),[i,j]=A(),y=S(),h=r.Children.count(p),E=x(t["expander-list"],b);function k(n,e){u(s=>d?{[e]:!(s!=null&&s[e])}:{...s,[e]:!(s!=null&&s[e])}),j(n.currentTarget)}const z=n=>x(t["expander-list__item"],{[t["expander-list__item--top"]]:n===0&&m,[t["expander-list__item--no-bottom"]]:n===h-1&&!R}),C=n=>`${y}-${n}`;return _(()=>{d&&i&&!v(i)&&i.scrollIntoView()},[d,i]),_(()=>{if(f){const n=C(0);u(e=>d?{[n]:!(e!=null&&e[n])}:{...e,[n]:!(e!=null&&e[n])})}},[f]),_(()=>{var n;if(!f){const e=(n=r.Children.map(p,s=>{if(O(s))return s}))==null?void 0:n.reduce((s,a,l)=>(typeof a.props.expanded<"u"&&(s[C(l)]=a.props.expanded),s),{});u({...o,...e})}},[p]),r.createElement("ul",{className:E,ref:I,"data-testid":W,"data-analyticsid":P.ExpanderList},r.Children.map(p,(n,e)=>{if(O(n)){const s=C(e),a=o==null?void 0:o[s],l=z(e);return r.cloneElement(n,{id:s,key:e,expanded:a,padding:N,color:g,large:w,sticky:$,"aria-expanded":a,className:l,handleExpanderClick:B=>k(B,`${y}-${e}`),renderChildrenWhenClosed:L})}return n}))});te.Expander=H;H.displayName="ExpanderList.Expander";export{te as ExpanderList,te as default};
+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};
 //# 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 Icon, { IconSize } from '../Icons';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ChevronDown from '../Icons/ChevronDown';\nimport { useHover } from '../../hooks/useHover';\nimport { usePrevious } from '../../hooks/usePrevious';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\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';\n\nexport type ExpanderListColors = PaletteNames;\nexport type ExpanderType = React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>>;\n\nexport interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {\n  Expander: ExpanderType;\n}\n\ninterface ExpanderListProps {\n  /** Toggles accordion functionality for the expanders. */\n  accordion?: boolean;\n  /** Toggles the bottom border of the last child element. */\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  /** Toggles the top border of the first child element. */\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}\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'>;\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  } = 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  const breakpoint = useBreakpoint();\n\n  const { isOutsideWindow, isLeavingWindow, offsetHeight, contentWidth } = useSticky(expanderRef, triggerRef);\n\n  const isSticky = sticky && isExpanded && isOutsideWindow;\n\n  const isJsxTitle = typeof title === 'object';\n\n  const itemClasses = classNames(className, { [expanderListStyles['expander-list__item--jsx']]: isJsxTitle });\n\n  const expanderClasses = classNames(expanderListStyles['expander-list-link'], expanderListStyles[`expander-list-link--${color}`], {\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  const titleClasses = classNames(expanderListStyles['expander-list-link__title'], {\n    [expanderListStyles['expander-list-link__title--string']]: !isJsxTitle,\n    [expanderListStyles['expander-list-link__title--jsx']]: isJsxTitle,\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        {icon && (\n          <span className={expanderListStyles['expander-list-link__icon']}>\n            {React.cloneElement(icon, {\n              size: breakpoint === Breakpoint.xs ? IconSize.XSmall : IconSize.Small,\n              isHovered,\n            })}\n          </span>\n        )}\n        <span className={titleClasses}>{title}</span>\n        <span className={expanderListStyles['expander-list-link__chevron']}>\n          <Icon size={IconSize.XSmall} svgIcon={isExpanded ? ChevronUp : ChevronDown} isHovered={isHovered} />\n        </span>\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  } = 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          });\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","isExpanded","setIsExpanded","useState","previousIsExpanded","usePrevious","expanderRef","useRef","triggerRef","isHovered","useHover","breakpoint","useBreakpoint","isOutsideWindow","isLeavingWindow","offsetHeight","contentWidth","useSticky","isSticky","isJsxTitle","itemClasses","classNames","expanderListStyles","expanderClasses","titleClasses","useEffect","renderContent","mainContentClasses","mergeRefs","AnalyticsId","ZIndex","Breakpoint","IconSize","Icon","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';\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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"}