@helsenorge/designsystem-react 15.0.0-beta.0 → 15.0.0

package/lib/TableBody.js

@@ -1,5 +1,5 @@
 import { n as ModeType } from "./constants2.js";
-import { i as mapChildrenWithMode } from "./utils6.js";
+import { i as mapChildrenWithMode } from "./utils5.js";
 import classNames from "classnames";
 import { jsx } from "react/jsx-runtime";
 import tableStyles from "./components/Table/styles.module.scss";

package/lib/TableBody.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableBody.js","names":[],"sources":["../src/components/Table/TableBody/TableBody.tsx","../src/components/Table/TableBody/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tbody'>, 'style'> {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table body. Use TableRows */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableBody: React.FC<Props> = ({ className, children, mode = ModeType.normal, ...rest }) => {\n  const tableBodyClasses = classNames(tableStyles['table-body'], className);\n  return (\n    <tbody className={tableBodyClasses} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n","import TableBody from './TableBody';\nexport * from './TableBody';\nexport default TableBody;\n"],"mappings":";;;;;;AAeA,IAAa,aAA8B,EAAE,WAAW,UAAU,OAAO,SAAS,QAAQ,GAAG,WAAW;CAEtG,OACE,oBAAC,SAAD;EAAO,WAFgB,WAAW,YAAY,eAAe,UAE3C;EAAkB,GAAI;YACrC,oBAAoB,UAAU,KAAK;EAC9B,CAAA;;;;AClBZ,IAAA,oBAAe"}
+{"version":3,"file":"TableBody.js","names":[],"sources":["../src/components/Table/TableBody/TableBody.tsx","../src/components/Table/TableBody/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tbody'>, 'style'> {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table body. Use TableRows */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableBody: React.FC<Props> = ({ className, children, mode = ModeType.normal, ...rest }) => {\n  const tableBodyClasses = classNames(tableStyles['table-body'], className);\n  return (\n    <tbody className={tableBodyClasses} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n","import TableBody from './TableBody';\nexport * from './TableBody';\nexport default TableBody;\n"],"mappings":";;;;;;AAeA,IAAa,aAA8B,EAAE,WAAW,UAAU,OAAO,SAAS,QAAQ,GAAG,WAAW;CAEtG,OACE,oBAAC,SAAD;EAAO,WAFgB,WAAW,YAAY,eAAe,SAE3C;EAAkB,GAAI;YACrC,oBAAoB,UAAU,IAAI;CAC9B,CAAA;AAEX;;;ACpBA,IAAA,oBAAe"}

package/lib/TableCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.js","names":[],"sources":["../src/components/Table/TableCell/TableCell.tsx","../src/components/Table/TableCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ModeType, TextAlign } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'td'>, 'style'> {\n  /** Label used for small viewport block */\n  dataLabel?: string;\n  /**  text align in cell */\n  textAlign?: TextAlign;\n  /**  nowrap for white space */\n  nowrap?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table cell */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** For test purposes */\n  testId?: string;\n}\n\nexport const TableCell: React.FC<Props> = ({\n  nowrap = false,\n  textAlign = TextAlign.left,\n  dataLabel,\n  children,\n  className,\n  testId,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableCellClass = classNames(\n    tableStyles['table__cell'],\n    { [tableStyles['table__cell--compact']]: mode === ModeType.compact },\n    { [tableStyles['table__cell--nowrap']]: nowrap },\n    { [tableStyles['table__cell--center']]: textAlign === 'center' },\n    { [tableStyles['table__cell--right']]: textAlign === 'right' },\n    className\n  );\n\n  return (\n    <td className={tableCellClass} data-label={dataLabel} data-testid={testId} {...rest}>\n      {children}\n    </td>\n  );\n};\n\nexport default TableCell;\n","import TableCell from './TableCell';\nexport * from './TableCell';\nexport default TableCell;\n"],"mappings":";;;;;AAsBA,IAAa,aAA8B,EACzC,SAAS,OACT,YAAY,UAAU,MACtB,WACA,UACA,WACA,QACA,OAAO,SAAS,QAChB,GAAG,WACC;CAUJ,OACE,oBAAC,MAAD;EAAI,WAViB,WACrB,YAAY,gBACZ,GAAG,YAAY,0BAA0B,SAAS,SAAS,SAAS,EACpE,GAAG,YAAY,yBAAyB,QAAQ,EAChD,GAAG,YAAY,yBAAyB,cAAc,UAAU,EAChE,GAAG,YAAY,wBAAwB,cAAc,SAAS,EAC9D,UAIe;EAAgB,cAAY;EAAW,eAAa;EAAQ,GAAI;EAC5E;EACE,CAAA;;;;AC1CT,IAAA,oBAAe"}
+{"version":3,"file":"TableCell.js","names":[],"sources":["../src/components/Table/TableCell/TableCell.tsx","../src/components/Table/TableCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { ModeType, TextAlign } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'td'>, 'style'> {\n  /** Label used for small viewport block */\n  dataLabel?: string;\n  /**  text align in cell */\n  textAlign?: TextAlign;\n  /**  nowrap for white space */\n  nowrap?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table cell */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** For test purposes */\n  testId?: string;\n}\n\nexport const TableCell: React.FC<Props> = ({\n  nowrap = false,\n  textAlign = TextAlign.left,\n  dataLabel,\n  children,\n  className,\n  testId,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableCellClass = classNames(\n    tableStyles['table__cell'],\n    { [tableStyles['table__cell--compact']]: mode === ModeType.compact },\n    { [tableStyles['table__cell--nowrap']]: nowrap },\n    { [tableStyles['table__cell--center']]: textAlign === 'center' },\n    { [tableStyles['table__cell--right']]: textAlign === 'right' },\n    className\n  );\n\n  return (\n    <td className={tableCellClass} data-label={dataLabel} data-testid={testId} {...rest}>\n      {children}\n    </td>\n  );\n};\n\nexport default TableCell;\n","import TableCell from './TableCell';\nexport * from './TableCell';\nexport default TableCell;\n"],"mappings":";;;;;AAsBA,IAAa,aAA8B,EACzC,SAAS,OACT,YAAY,UAAU,MACtB,WACA,UACA,WACA,QACA,OAAO,SAAS,QAChB,GAAG,WACC;CAUJ,OACE,oBAAC,MAAD;EAAI,WAViB,WACrB,YAAY,gBACZ,GAAG,YAAY,0BAA0B,SAAS,SAAS,QAAQ,GACnE,GAAG,YAAY,yBAAyB,OAAO,GAC/C,GAAG,YAAY,yBAAyB,cAAc,SAAS,GAC/D,GAAG,YAAY,wBAAwB,cAAc,QAAQ,GAC7D,SAIe;EAAgB,cAAY;EAAW,eAAa;EAAQ,GAAI;EAC5E;CACC,CAAA;AAER;;;AC5CA,IAAA,oBAAe"}

package/lib/TableExpandedRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpandedRow.js","names":[],"sources":["../src/components/Table/TableExpandedRow/TableExpandedRow.tsx","../src/components/Table/TableExpandedRow/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props {\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Number of columns in table. */\n  numberOfColumns: number;\n  /** Text for hide button. */\n  hideDetailsText: string;\n  /** When hide button inside expanded row is clicked. */\n  toggleClick: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the expanded row.  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** Row id. For use with aria-controls. */\n  id?: string;\n}\n\nexport const TableExpandedRow = ({\n  numberOfColumns,\n  expanded,\n  hideDetailsText,\n  toggleClick,\n  children,\n  className,\n  mode = ModeType.normal,\n  id,\n}: Props): React.JSX.Element => {\n  const tableRowClass = classNames(\n    tableStyles['table__expanded-row'],\n    { [tableStyles['table__expanded-row--expanded']]: expanded },\n    className\n  );\n  const tableCellClass = classNames(tableStyles['table__cell'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  const containerClass = classNames(tableStyles['table__expanded-row-container']);\n\n  return (\n    <tr className={tableRowClass} id={id}>\n      <td colSpan={numberOfColumns} className={tableCellClass}>\n        <div className={containerClass}>\n          {React.Children.map(children, child => React.isValidElement(child) && React.cloneElement(child))}\n          <Button variant={'borderless'} onClick={toggleClick} aria-expanded={expanded} tabIndex={expanded ? 0 : -1}>\n            {hideDetailsText}\n            <Icon svgIcon={ChevronUp} />\n          </Button>\n        </div>\n      </td>\n    </tr>\n  );\n};\n\nexport default TableExpandedRow;\n","import TableExpandedRow from './TableExpandedRow';\nexport * from './TableExpandedRow';\nexport default TableExpandedRow;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,oBAAoB,EAC/B,iBACA,UACA,iBACA,aACA,UACA,WACA,OAAO,SAAS,QAChB,SAC8B;CAY9B,OACE,oBAAC,MAAD;EAAI,WAZgB,WACpB,YAAY,wBACZ,GAAG,YAAY,mCAAmC,UAAU,EAC5D,UASe;EAAmB;YAChC,oBAAC,MAAD;GAAI,SAAS;GAAiB,WARX,WAAW,YAAY,gBAAgB,WAAW,GACtE,YAAY,0BAA0B,SAAS,SAAS,SAC1D,CAM4C;aACvC,qBAAC,OAAD;IAAK,WALY,WAAW,YAAY,iCAKxB;cAAhB,CACG,MAAM,SAAS,IAAI,WAAU,UAAS,MAAM,eAAe,MAAM,IAAI,MAAM,aAAa,MAAM,CAAC,EAChG,qBAAC,gBAAD;KAAQ,SAAS;KAAc,SAAS;KAAa,iBAAe;KAAU,UAAU,WAAW,IAAI;eAAvG,CACG,iBACD,oBAAC,cAAD,EAAM,SAAS,WAAa,CAAA,CACrB;OACL;;GACH,CAAA;EACF,CAAA;;;;AC3DT,IAAA,2BAAe"}
+{"version":3,"file":"TableExpandedRow.js","names":[],"sources":["../src/components/Table/TableExpandedRow/TableExpandedRow.tsx","../src/components/Table/TableExpandedRow/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props {\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Number of columns in table. */\n  numberOfColumns: number;\n  /** Text for hide button. */\n  hideDetailsText: string;\n  /** When hide button inside expanded row is clicked. */\n  toggleClick: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the expanded row.  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** Row id. For use with aria-controls. */\n  id?: string;\n}\n\nexport const TableExpandedRow = ({\n  numberOfColumns,\n  expanded,\n  hideDetailsText,\n  toggleClick,\n  children,\n  className,\n  mode = ModeType.normal,\n  id,\n}: Props): React.JSX.Element => {\n  const tableRowClass = classNames(\n    tableStyles['table__expanded-row'],\n    { [tableStyles['table__expanded-row--expanded']]: expanded },\n    className\n  );\n  const tableCellClass = classNames(tableStyles['table__cell'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  const containerClass = classNames(tableStyles['table__expanded-row-container']);\n\n  return (\n    <tr className={tableRowClass} id={id}>\n      <td colSpan={numberOfColumns} className={tableCellClass}>\n        <div className={containerClass}>\n          {React.Children.map(children, child => React.isValidElement(child) && React.cloneElement(child))}\n          <Button variant={'borderless'} onClick={toggleClick} aria-expanded={expanded} tabIndex={expanded ? 0 : -1}>\n            {hideDetailsText}\n            <Icon svgIcon={ChevronUp} />\n          </Button>\n        </div>\n      </td>\n    </tr>\n  );\n};\n\nexport default TableExpandedRow;\n","import TableExpandedRow from './TableExpandedRow';\nexport * from './TableExpandedRow';\nexport default TableExpandedRow;\n"],"mappings":";;;;;;;;;AA6BA,IAAa,oBAAoB,EAC/B,iBACA,UACA,iBACA,aACA,UACA,WACA,OAAO,SAAS,QAChB,SAC8B;CAY9B,OACE,oBAAC,MAAD;EAAI,WAZgB,WACpB,YAAY,wBACZ,GAAG,YAAY,mCAAmC,SAAS,GAC3D,SASe;EAAmB;YAChC,oBAAC,MAAD;GAAI,SAAS;GAAiB,WARX,WAAW,YAAY,gBAAgB,WAAW,GACtE,YAAY,0BAA0B,SAAS,SAAS,QAC3D,CAM6C;aACvC,qBAAC,OAAD;IAAK,WALY,WAAW,YAAY,gCAKxB;cAAhB,CACG,MAAM,SAAS,IAAI,WAAU,UAAS,MAAM,eAAe,KAAK,KAAK,MAAM,aAAa,KAAK,CAAC,GAC/F,qBAAC,gBAAD;KAAQ,SAAS;KAAc,SAAS;KAAa,iBAAe;KAAU,UAAU,WAAW,IAAI;eAAvG,CACG,iBACD,oBAAC,cAAD,EAAM,SAAS,UAAY,CAAA,CACrB;MACL;;EACH,CAAA;CACF,CAAA;AAER;;;AC7DA,IAAA,2BAAe"}

package/lib/TableExpanderCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableExpanderCell.js","names":[],"sources":["../src/components/Table/TableExpanderCell/TableExpanderCell.tsx","../src/components/Table/TableExpanderCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Id for expanded row. */\n  expandableRowId: string;\n  /** Text for hide button used for aria label. */\n  hideDetailsText: string;\n  /** Text for show button used for aria label. */\n  showDetailsText: string;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableExpanderCell = ({\n  expandableRowId,\n  hideDetailsText,\n  showDetailsText,\n  expanded,\n  className,\n  mode = ModeType.normal,\n}: Props): React.JSX.Element => {\n  const tableCellClass = classNames(tableStyles['table__cell'], tableStyles['table__cell-expander'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n  const icon = expanded ? ChevronUp : ChevronDown;\n\n  return (\n    <td className={tableCellClass}>\n      <Button\n        variant=\"borderless\"\n        aria-expanded={expanded}\n        aria-controls={expandableRowId}\n        ariaLabel={expanded ? hideDetailsText : showDetailsText}\n      >\n        <Icon svgIcon={icon} />\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCell;\n","import TableExpanderCell from './TableExpanderCell';\nexport * from './TableExpanderCell';\nexport default TableExpanderCell;\n"],"mappings":";;;;;;;;;AAwBA,IAAa,qBAAqB,EAChC,iBACA,iBACA,iBACA,UACA,WACA,OAAO,SAAS,aACc;CAM9B,OACE,oBAAC,MAAD;EAAI,WANiB,WAAW,YAAY,gBAAgB,YAAY,yBAAyB,WAAW,GAC3G,YAAY,0BAA0B,SAAS,SAAS,SAC1D,CAIgB;YACb,oBAAC,gBAAD;GACE,SAAQ;GACR,iBAAe;GACf,iBAAe;GACf,WAAW,WAAW,kBAAkB;aAExC,oBAAC,cAAD,EAAM,SAVC,WAAW,YAAY,aAUP,CAAA;GAChB,CAAA;EACN,CAAA;;;;AC7CT,IAAA,4BAAe"}
+{"version":3,"file":"TableExpanderCell.js","names":[],"sources":["../src/components/Table/TableExpanderCell/TableExpanderCell.tsx","../src/components/Table/TableExpanderCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Id for expanded row. */\n  expandableRowId: string;\n  /** Text for hide button used for aria label. */\n  hideDetailsText: string;\n  /** Text for show button used for aria label. */\n  showDetailsText: string;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableExpanderCell = ({\n  expandableRowId,\n  hideDetailsText,\n  showDetailsText,\n  expanded,\n  className,\n  mode = ModeType.normal,\n}: Props): React.JSX.Element => {\n  const tableCellClass = classNames(tableStyles['table__cell'], tableStyles['table__cell-expander'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n  const icon = expanded ? ChevronUp : ChevronDown;\n\n  return (\n    <td className={tableCellClass}>\n      <Button\n        variant=\"borderless\"\n        aria-expanded={expanded}\n        aria-controls={expandableRowId}\n        ariaLabel={expanded ? hideDetailsText : showDetailsText}\n      >\n        <Icon svgIcon={icon} />\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCell;\n","import TableExpanderCell from './TableExpanderCell';\nexport * from './TableExpanderCell';\nexport default TableExpanderCell;\n"],"mappings":";;;;;;;;;AAwBA,IAAa,qBAAqB,EAChC,iBACA,iBACA,iBACA,UACA,WACA,OAAO,SAAS,aACc;CAM9B,OACE,oBAAC,MAAD;EAAI,WANiB,WAAW,YAAY,gBAAgB,YAAY,yBAAyB,WAAW,GAC3G,YAAY,0BAA0B,SAAS,SAAS,QAC3D,CAIiB;YACb,oBAAC,gBAAD;GACE,SAAQ;GACR,iBAAe;GACf,iBAAe;GACf,WAAW,WAAW,kBAAkB;aAExC,oBAAC,cAAD,EAAM,SAVC,WAAW,YAAY,YAUR,CAAA;EAChB,CAAA;CACN,CAAA;AAER;;;AC/CA,IAAA,4BAAe"}

package/lib/TableHead.js

@@ -1,5 +1,5 @@
 import { n as ModeType, t as HeaderCategory } from "./constants2.js";
-import { i as mapChildrenWithMode } from "./utils6.js";
+import { i as mapChildrenWithMode } from "./utils5.js";
 import classNames from "classnames";
 import { jsx } from "react/jsx-runtime";
 import tableStyles from "./components/Table/styles.module.scss";

package/lib/TableHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHead.js","names":[],"sources":["../src/components/Table/TableHead/TableHead.tsx","../src/components/Table/TableHead/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { HeaderCategory, ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'thead'>, 'style'> {\n  /** Header category for styling. Default: normal */\n  category?: HeaderCategory;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the thead. Add table rows  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHead: React.FC<Props> = ({ category = HeaderCategory.normal, className, children, mode, ...rest }) => {\n  const tableHeadClass = classNames(\n    tableStyles['table__head'],\n    {\n      [tableStyles['table__head--normal']]: category === HeaderCategory.normal,\n      [tableStyles['table__head--transparent']]: category === HeaderCategory.transparent,\n      [tableStyles['table__head--sortable']]: category == HeaderCategory.sortable,\n      [tableStyles['table__head--compact']]: mode == ModeType.compact,\n    },\n    className\n  );\n\n  return (\n    <thead className={tableHeadClass} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n    </thead>\n  );\n};\n\nexport default TableHead;\n","import TableHead from './TableHead';\nexport * from './TableHead';\nexport default TableHead;\n"],"mappings":";;;;;;AAiBA,IAAa,aAA8B,EAAE,WAAW,eAAe,QAAQ,WAAW,UAAU,MAAM,GAAG,WAAW;CAYtH,OACE,oBAAC,SAAD;EAAO,WAZc,WACrB,YAAY,gBACZ;IACG,YAAY,yBAAyB,aAAa,eAAe;IACjE,YAAY,8BAA8B,aAAa,eAAe;IACtE,YAAY,2BAA2B,YAAY,eAAe;IAClE,YAAY,0BAA0B,QAAQ,SAAS;GACzD,EACD,UAIkB;EAAgB,GAAI;YACnC,oBAAoB,UAAU,KAAK;EAC9B,CAAA;;;;AC9BZ,IAAA,oBAAe"}
+{"version":3,"file":"TableHead.js","names":[],"sources":["../src/components/Table/TableHead/TableHead.tsx","../src/components/Table/TableHead/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport { HeaderCategory, ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'thead'>, 'style'> {\n  /** Header category for styling. Default: normal */\n  category?: HeaderCategory;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the thead. Add table rows  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHead: React.FC<Props> = ({ category = HeaderCategory.normal, className, children, mode, ...rest }) => {\n  const tableHeadClass = classNames(\n    tableStyles['table__head'],\n    {\n      [tableStyles['table__head--normal']]: category === HeaderCategory.normal,\n      [tableStyles['table__head--transparent']]: category === HeaderCategory.transparent,\n      [tableStyles['table__head--sortable']]: category == HeaderCategory.sortable,\n      [tableStyles['table__head--compact']]: mode == ModeType.compact,\n    },\n    className\n  );\n\n  return (\n    <thead className={tableHeadClass} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n    </thead>\n  );\n};\n\nexport default TableHead;\n","import TableHead from './TableHead';\nexport * from './TableHead';\nexport default TableHead;\n"],"mappings":";;;;;;AAiBA,IAAa,aAA8B,EAAE,WAAW,eAAe,QAAQ,WAAW,UAAU,MAAM,GAAG,WAAW;CAYtH,OACE,oBAAC,SAAD;EAAO,WAZc,WACrB,YAAY,gBACZ;IACG,YAAY,yBAAyB,aAAa,eAAe;IACjE,YAAY,8BAA8B,aAAa,eAAe;IACtE,YAAY,2BAA2B,YAAY,eAAe;IAClE,YAAY,0BAA0B,QAAQ,SAAS;EAC1D,GACA,SAIkB;EAAgB,GAAI;YACnC,oBAAoB,UAAU,IAAI;CAC9B,CAAA;AAEX;;;AChCA,IAAA,oBAAe"}

package/lib/TableHeadCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableHeadCell.js","names":[],"sources":["../src/components/Table/TableHeadCell/TableHeadCell.tsx","../src/components/Table/TableHeadCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport Icon, { IconSize } from '../../Icon';\nimport ArrowDown from '../../Icons/ArrowDown';\nimport ArrowUp from '../../Icons/ArrowUp';\nimport { ModeType, SortDirection } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'th'>, 'style'> {\n  /** Sets if column for head cell should be sortable*/\n  sortable?: boolean;\n  /** Sort direction  */\n  sortDir?: SortDirection;\n  /** Function that is called when clicked */\n  onClick?: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the td element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHeadCell: React.FC<Props> = ({\n  sortable,\n  onClick,\n  className,\n  children,\n  sortDir,\n  mode = ModeType.normal,\n  scope = 'col',\n  ...rest\n}) => {\n  const tableHeadCellDefaultClass = classNames(tableStyles['table__head-cell'], className, {\n    [tableStyles['table__head-cell--compact']]: mode === ModeType.compact,\n  });\n\n  if (!sortable && !children) {\n    return <td className={tableHeadCellDefaultClass}></td>;\n  }\n\n  if (!sortable) {\n    return (\n      <th scope={scope} className={tableHeadCellDefaultClass} {...rest}>\n        {children}\n      </th>\n    );\n  }\n\n  const sortableClasses = classNames(tableHeadCellDefaultClass, tableStyles['table__head-cell--sortable'], className);\n\n  const renderSortIcon = (): React.JSX.Element | undefined =>\n    sortDir && (\n      <div className={tableStyles['table__head-cell-sort-icon-wrapper']}>\n        <Icon svgIcon={sortDir == SortDirection.asc ? ArrowDown : ArrowUp} size={IconSize.XXSmall} />\n      </div>\n    );\n\n  const getSortDirection = (): React.AriaAttributes['aria-sort'] => {\n    switch (sortDir) {\n      case SortDirection.asc:\n        return 'ascending';\n      case SortDirection.desc:\n        return 'descending';\n    }\n  };\n\n  return (\n    <th scope={scope} className={sortableClasses} aria-sort={getSortDirection()} {...rest}>\n      <button type=\"button\" onClick={onClick} className={tableStyles['table__sort-button']} aria-pressed={sortDir ? !!sortDir : undefined}>\n        {renderSortIcon()}\n        {children}\n      </button>\n    </th>\n  );\n};\n\nexport default TableHeadCell;\n","import TableHeadCell from './TableHeadCell';\nexport * from './TableHeadCell';\nexport default TableHeadCell;\n"],"mappings":";;;;;;;;;AAuBA,IAAa,iBAAkC,EAC7C,UACA,SACA,WACA,UACA,SACA,OAAO,SAAS,QAChB,QAAQ,OACR,GAAG,WACC;CACJ,MAAM,4BAA4B,WAAW,YAAY,qBAAqB,WAAW,GACtF,YAAY,+BAA+B,SAAS,SAAS,SAC/D,CAAC;CAEF,IAAI,CAAC,YAAY,CAAC,UAChB,OAAO,oBAAC,MAAD,EAAI,WAAW,2BAAgC,CAAA;CAGxD,IAAI,CAAC,UACH,OACE,oBAAC,MAAD;EAAW;EAAO,WAAW;EAA2B,GAAI;EACzD;EACE,CAAA;CAIT,MAAM,kBAAkB,WAAW,2BAA2B,YAAY,+BAA+B,UAAU;CAEnH,MAAM,uBACJ,WACE,oBAAC,OAAD;EAAK,WAAW,YAAY;YAC1B,oBAAC,cAAD;GAAM,SAAS,WAAW,cAAc,MAAM,YAAY;GAAS,MAAM,SAAS;GAAW,CAAA;EACzF,CAAA;CAGV,MAAM,yBAA4D;EAChE,QAAQ,SAAR;GACE,KAAK,cAAc,KACjB,OAAO;GACT,KAAK,cAAc,MACjB,OAAO;;;CAIb,OACE,oBAAC,MAAD;EAAW;EAAO,WAAW;EAAiB,aAAW,kBAAkB;EAAE,GAAI;YAC/E,qBAAC,UAAD;GAAQ,MAAK;GAAkB;GAAS,WAAW,YAAY;GAAuB,gBAAc,UAAU,CAAC,CAAC,UAAU,KAAA;aAA1H,CACG,gBAAgB,EAChB,SACM;;EACN,CAAA;;;;ACvET,IAAA,wBAAe"}
+{"version":3,"file":"TableHeadCell.js","names":[],"sources":["../src/components/Table/TableHeadCell/TableHeadCell.tsx","../src/components/Table/TableHeadCell/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport Icon, { IconSize } from '../../Icon';\nimport ArrowDown from '../../Icons/ArrowDown';\nimport ArrowUp from '../../Icons/ArrowUp';\nimport { ModeType, SortDirection } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'th'>, 'style'> {\n  /** Sets if column for head cell should be sortable*/\n  sortable?: boolean;\n  /** Sort direction  */\n  sortDir?: SortDirection;\n  /** Function that is called when clicked */\n  onClick?: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the td element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHeadCell: React.FC<Props> = ({\n  sortable,\n  onClick,\n  className,\n  children,\n  sortDir,\n  mode = ModeType.normal,\n  scope = 'col',\n  ...rest\n}) => {\n  const tableHeadCellDefaultClass = classNames(tableStyles['table__head-cell'], className, {\n    [tableStyles['table__head-cell--compact']]: mode === ModeType.compact,\n  });\n\n  if (!sortable && !children) {\n    return <td className={tableHeadCellDefaultClass}></td>;\n  }\n\n  if (!sortable) {\n    return (\n      <th scope={scope} className={tableHeadCellDefaultClass} {...rest}>\n        {children}\n      </th>\n    );\n  }\n\n  const sortableClasses = classNames(tableHeadCellDefaultClass, tableStyles['table__head-cell--sortable'], className);\n\n  const renderSortIcon = (): React.JSX.Element | undefined =>\n    sortDir && (\n      <div className={tableStyles['table__head-cell-sort-icon-wrapper']}>\n        <Icon svgIcon={sortDir == SortDirection.asc ? ArrowDown : ArrowUp} size={IconSize.XXSmall} />\n      </div>\n    );\n\n  const getSortDirection = (): React.AriaAttributes['aria-sort'] => {\n    switch (sortDir) {\n      case SortDirection.asc:\n        return 'ascending';\n      case SortDirection.desc:\n        return 'descending';\n    }\n  };\n\n  return (\n    <th scope={scope} className={sortableClasses} aria-sort={getSortDirection()} {...rest}>\n      <button type=\"button\" onClick={onClick} className={tableStyles['table__sort-button']} aria-pressed={sortDir ? !!sortDir : undefined}>\n        {renderSortIcon()}\n        {children}\n      </button>\n    </th>\n  );\n};\n\nexport default TableHeadCell;\n","import TableHeadCell from './TableHeadCell';\nexport * from './TableHeadCell';\nexport default TableHeadCell;\n"],"mappings":";;;;;;;;;AAuBA,IAAa,iBAAkC,EAC7C,UACA,SACA,WACA,UACA,SACA,OAAO,SAAS,QAChB,QAAQ,OACR,GAAG,WACC;CACJ,MAAM,4BAA4B,WAAW,YAAY,qBAAqB,WAAW,GACtF,YAAY,+BAA+B,SAAS,SAAS,QAChE,CAAC;CAED,IAAI,CAAC,YAAY,CAAC,UAChB,OAAO,oBAAC,MAAD,EAAI,WAAW,0BAA+B,CAAA;CAGvD,IAAI,CAAC,UACH,OACE,oBAAC,MAAD;EAAW;EAAO,WAAW;EAA2B,GAAI;EACzD;CACC,CAAA;CAIR,MAAM,kBAAkB,WAAW,2BAA2B,YAAY,+BAA+B,SAAS;CAElH,MAAM,uBACJ,WACE,oBAAC,OAAD;EAAK,WAAW,YAAY;YAC1B,oBAAC,cAAD;GAAM,SAAS,WAAW,cAAc,MAAM,YAAY;GAAS,MAAM,SAAS;EAAU,CAAA;CACzF,CAAA;CAGT,MAAM,yBAA4D;EAChE,QAAQ,SAAR;GACE,KAAK,cAAc,KACjB,OAAO;GACT,KAAK,cAAc,MACjB,OAAO;EACX;CACF;CAEA,OACE,oBAAC,MAAD;EAAW;EAAO,WAAW;EAAiB,aAAW,iBAAiB;EAAG,GAAI;YAC/E,qBAAC,UAAD;GAAQ,MAAK;GAAkB;GAAS,WAAW,YAAY;GAAuB,gBAAc,UAAU,CAAC,CAAC,UAAU,KAAA;aAA1H,CACG,eAAe,GACf,QACK;;CACN,CAAA;AAER;;;ACzEA,IAAA,wBAAe"}

package/lib/TableRow.js

@@ -3,7 +3,7 @@ import { t as Button_default } from "./Button.js";
 import ChevronDown from "./components/Icons/ChevronDown.js";
 import ChevronUp from "./components/Icons/ChevronUp.js";
 import { n as ModeType } from "./constants2.js";
-import { i as mapChildrenWithMode } from "./utils6.js";
+import { i as mapChildrenWithMode } from "./utils5.js";
 import classNames from "classnames";
 import { jsx, jsxs } from "react/jsx-runtime";
 import tableStyles from "./components/Table/styles.module.scss";

package/lib/TableRow.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableRow.js","names":[],"sources":["../src/components/Table/TableExpanderCell/TableExpanderCellMobile.tsx","../src/components/Table/TableRow/TableRow.tsx","../src/components/Table/TableRow/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport type { Props } from '../TableRow/TableRow';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\ntype TableExpanderCellMobileProps = Pick<Props, 'expanded' | 'onClick' | 'hideDetailsText' | 'showDetailsText' | 'mode'>;\n\nconst TableExpanderCellMobile: React.FC<TableExpanderCellMobileProps> = ({\n  expanded,\n  onClick,\n  hideDetailsText,\n  showDetailsText,\n  mode = ModeType.normal,\n}) => {\n  const cellClass = classNames(tableStyles.table__cell, tableStyles['table__expander-cell-mobile'], {\n    [tableStyles['table__expander-cell-mobile--expanded']]: expanded,\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  return (\n    <td className={cellClass}>\n      <Button aria-expanded={expanded} variant=\"borderless\" onClick={onClick}>\n        <Icon svgIcon={expanded ? ChevronUp : ChevronDown} /> {expanded ? hideDetailsText : showDetailsText}\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCellMobile;\n","import classNames from 'classnames';\n\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport TableExpanderCellMobile from '../TableExpanderCell/TableExpanderCellMobile';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tr'>, 'style'> {\n  /** Sets if expanded row can be expanded */\n  expandable?: boolean;\n  /** Sets if expanded row is expanded */\n  expanded?: boolean;\n  /** When hide/show button for expanded row is clicked. */\n  onClick?: () => void;\n  /** Text for expanded row hide button. */\n  hideDetailsText?: string;\n  /** Text for expanded row show button. */\n  showDetailsText?: string;\n  /** Key attribute for row */\n  rowKey?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the cells of the table row element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableRow: React.FC<Props> = ({\n  rowKey,\n  hideDetailsText,\n  showDetailsText,\n  expandable,\n  expanded,\n  onClick,\n  className,\n  children,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableRowClass = classNames(\n    tableStyles['table-row'],\n    {\n      [tableStyles['table__row--expandable']]: expandable,\n    },\n    className\n  );\n\n  return (\n    <tr className={tableRowClass} onClick={onClick} key={rowKey} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n      {expandable && (\n        <TableExpanderCellMobile\n          expanded={expanded}\n          onClick={onClick}\n          hideDetailsText={hideDetailsText}\n          showDetailsText={showDetailsText}\n          mode={mode}\n        />\n      )}\n    </tr>\n  );\n};\n\nexport default TableRow;\n","import TableRow from './TableRow';\nexport * from './TableRow';\nexport default TableRow;\n"],"mappings":";;;;;;;;;;AAaA,IAAM,2BAAmE,EACvE,UACA,SACA,iBACA,iBACA,OAAO,SAAS,aACZ;CAMJ,OACE,oBAAC,MAAD;EAAI,WANY,WAAW,YAAY,aAAa,YAAY,gCAAgC;IAC/F,YAAY,2CAA2C;IACvD,YAAY,0BAA0B,SAAS,SAAS;GAC1D,CAGgB;YACb,qBAAC,gBAAD;GAAQ,iBAAe;GAAU,SAAQ;GAAsB;aAA/D;IACE,oBAAC,cAAD,EAAM,SAAS,WAAW,YAAY,aAAe,CAAA;;IAAE,WAAW,kBAAkB;IAC7E;;EACN,CAAA;;;;ACFT,IAAa,YAA6B,EACxC,QACA,iBACA,iBACA,YACA,UACA,SACA,WACA,UACA,OAAO,SAAS,QAChB,GAAG,WACC;CASJ,OACE,qBAAC,MAAD;EAAI,WATgB,WACpB,YAAY,cACZ,GACG,YAAY,4BAA4B,YAC1C,EACD,UAIe;EAAwB;EAAsB,GAAI;YAAjE,CACG,oBAAoB,UAAU,KAAK,EACnC,cACC,oBAAC,yBAAD;GACY;GACD;GACQ;GACA;GACX;GACN,CAAA,CAED;IAXgD,OAWhD;;;;AC1DT,IAAA,mBAAe"}
+{"version":3,"file":"TableRow.js","names":[],"sources":["../src/components/Table/TableExpanderCell/TableExpanderCellMobile.tsx","../src/components/Table/TableRow/TableRow.tsx","../src/components/Table/TableRow/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport type { Props } from '../TableRow/TableRow';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\n\ntype TableExpanderCellMobileProps = Pick<Props, 'expanded' | 'onClick' | 'hideDetailsText' | 'showDetailsText' | 'mode'>;\n\nconst TableExpanderCellMobile: React.FC<TableExpanderCellMobileProps> = ({\n  expanded,\n  onClick,\n  hideDetailsText,\n  showDetailsText,\n  mode = ModeType.normal,\n}) => {\n  const cellClass = classNames(tableStyles.table__cell, tableStyles['table__expander-cell-mobile'], {\n    [tableStyles['table__expander-cell-mobile--expanded']]: expanded,\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  return (\n    <td className={cellClass}>\n      <Button aria-expanded={expanded} variant=\"borderless\" onClick={onClick}>\n        <Icon svgIcon={expanded ? ChevronUp : ChevronDown} /> {expanded ? hideDetailsText : showDetailsText}\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCellMobile;\n","import classNames from 'classnames';\n\nimport { ModeType } from '../constants';\nimport tableStyles from '../styles.module.scss';\nimport TableExpanderCellMobile from '../TableExpanderCell/TableExpanderCellMobile';\nimport { mapChildrenWithMode } from '../utils';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tr'>, 'style'> {\n  /** Sets if expanded row can be expanded */\n  expandable?: boolean;\n  /** Sets if expanded row is expanded */\n  expanded?: boolean;\n  /** When hide/show button for expanded row is clicked. */\n  onClick?: () => void;\n  /** Text for expanded row hide button. */\n  hideDetailsText?: string;\n  /** Text for expanded row show button. */\n  showDetailsText?: string;\n  /** Key attribute for row */\n  rowKey?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the cells of the table row element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableRow: React.FC<Props> = ({\n  rowKey,\n  hideDetailsText,\n  showDetailsText,\n  expandable,\n  expanded,\n  onClick,\n  className,\n  children,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableRowClass = classNames(\n    tableStyles['table-row'],\n    {\n      [tableStyles['table__row--expandable']]: expandable,\n    },\n    className\n  );\n\n  return (\n    <tr className={tableRowClass} onClick={onClick} key={rowKey} {...rest}>\n      {mapChildrenWithMode(children, mode)}\n      {expandable && (\n        <TableExpanderCellMobile\n          expanded={expanded}\n          onClick={onClick}\n          hideDetailsText={hideDetailsText}\n          showDetailsText={showDetailsText}\n          mode={mode}\n        />\n      )}\n    </tr>\n  );\n};\n\nexport default TableRow;\n","import TableRow from './TableRow';\nexport * from './TableRow';\nexport default TableRow;\n"],"mappings":";;;;;;;;;;AAaA,IAAM,2BAAmE,EACvE,UACA,SACA,iBACA,iBACA,OAAO,SAAS,aACZ;CAMJ,OACE,oBAAC,MAAD;EAAI,WANY,WAAW,YAAY,aAAa,YAAY,gCAAgC;IAC/F,YAAY,2CAA2C;IACvD,YAAY,0BAA0B,SAAS,SAAS;EAC3D,CAGiB;YACb,qBAAC,gBAAD;GAAQ,iBAAe;GAAU,SAAQ;GAAsB;aAA/D;IACE,oBAAC,cAAD,EAAM,SAAS,WAAW,YAAY,YAAc,CAAA;IAAC;IAAE,WAAW,kBAAkB;GAC9E;;CACN,CAAA;AAER;;;ACJA,IAAa,YAA6B,EACxC,QACA,iBACA,iBACA,YACA,UACA,SACA,WACA,UACA,OAAO,SAAS,QAChB,GAAG,WACC;CASJ,OACE,qBAAC,MAAD;EAAI,WATgB,WACpB,YAAY,cACZ,GACG,YAAY,4BAA4B,WAC3C,GACA,SAIe;EAAwB;EAAsB,GAAI;YAAjE,CACG,oBAAoB,UAAU,IAAI,GAClC,cACC,oBAAC,yBAAD;GACY;GACD;GACQ;GACA;GACX;EACP,CAAA,CAED;IAXiD,MAWjD;AAER;;;AC5DA,IAAA,mBAAe"}

package/lib/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","names":[],"sources":["../src/resources/HN.Designsystem.TextArea.en-GB.json","../src/resources/HN.Designsystem.TextArea.nb-NO.json","../src/resources/HN.Designsystem.TextArea.nn-NO.json","../src/components/Textarea/resourceHelper.ts","../src/components/Textarea/Textarea.tsx","../src/components/Textarea/index.ts"],"sourcesContent":["{\n  \"characters\": \"characters\"\n}\n","{\n  \"characters\": \"tegn\"\n}\n","{\n  \"characters\": \"teikn\"\n}\n","import type { HNDesignsystemTextArea } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.TextArea.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.TextArea.nb-NO.json';\nimport nnNO from '../../resources/HN.Designsystem.TextArea.nn-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemTextArea => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN_NYNORSK:\n      return nnNO;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import { useState, useRef, useLayoutEffect } from 'react';\n\nimport cn from 'classnames';\n\nimport type { HNDesignsystemTextArea } from '../../resources/Resources';\nimport type { ErrorWrapperClassNameProps } from '../ErrorWrapper';\n\nimport { getResources } from './resourceHelper';\nimport { AnalyticsId, AVERAGE_CHARACTER_WIDTH_PX, FormOnColor, LanguageLocales } from '../../constants';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { useLanguage } from '../../hooks/useLanguage';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper from '../ErrorWrapper';\nimport { renderLabel } from '../Label/utils';\nimport MaxCharacters from '../MaxCharacters/MaxCharacters';\n\nimport styles from './styles.module.scss';\n\nexport interface TextareaProps\n  extends\n    ErrorWrapperClassNameProps,\n    Pick<\n      React.InputHTMLAttributes<HTMLTextAreaElement>,\n      | 'aria-describedby'\n      | 'autoFocus'\n      | 'disabled'\n      | 'name'\n      | 'autoComplete'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'defaultValue'\n      | 'onChange'\n      | 'value'\n    > {\n  /** max character limit in textarea  */\n  maxCharacters?: number;\n  /** Width of textarea in characters (approximate) */\n  width?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** If true, the component will have a bottom margin. */\n  marginBottom?: boolean;\n  /** If true, the component will be transparent. */\n  transparent?: boolean;\n  /** Changes the visuals of the textarea */\n  onColor?: keyof typeof FormOnColor;\n  /** Label of the input */\n  label?: React.ReactNode;\n  /** id of the textarea */\n  textareaId?: string;\n  /** max rows */\n  maxRows?: number;\n  /** min rows */\n  minRows?: number;\n  /** auto-grows until maxRows */\n  grow?: boolean;\n  /** Activates Error style for the input */\n  error?: boolean;\n  /** Error text to show above the component */\n  errorText?: string;\n  /** Error text id */\n  errorTextId?: string;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemTextArea>;\n  /** Ref passed to the component */\n  ref?: React.Ref<HTMLTextAreaElement | null>;\n}\n\nconst getTextareaMaxWidth = (characters: number): string => {\n  const paddingWidth = '2rem';\n  const scrollbarWidth = '16px';\n  const borderWidth = '4px';\n\n  return `calc(${characters * AVERAGE_CHARACTER_WIDTH_PX}px + ${paddingWidth} + ${scrollbarWidth} + ${borderWidth})`;\n};\n\nconst Textarea: React.FC<TextareaProps> = props => {\n  const {\n    maxCharacters,\n    width,\n    testId,\n    defaultValue,\n    marginBottom: gutterBottom,\n    transparent,\n    onColor = FormOnColor.onwhite,\n    label,\n    textareaId = uuid(),\n    minRows = 3,\n    maxRows = 10,\n    grow,\n    error,\n    errorText,\n    errorTextId: errorTextIdProp,\n    errorWrapperClassName,\n    autoFocus,\n    disabled,\n    name,\n    autoComplete = 'off',\n    placeholder,\n    readOnly,\n    required,\n    onChange,\n    value,\n    resources,\n    ref,\n    ...rest\n  } = props;\n\n  const [textareaInput, setTextareaInput] = useState(value || defaultValue || '');\n  const [prevDefaultValue, setPrevDefaultValue] = useState(defaultValue);\n  const [prevValue, setPrevValue] = useState(value);\n  const referanse = useRef<HTMLDivElement>(null);\n  const errorTextUuid = useIdWithFallback(errorTextIdProp);\n\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemTextArea = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  if (defaultValue !== prevDefaultValue) {\n    setPrevDefaultValue(defaultValue);\n    setTextareaInput(defaultValue || '');\n  }\n\n  if (value !== prevValue) {\n    setPrevValue(value);\n\n    if (value) {\n      setTextareaInput(value);\n    }\n  }\n\n  const resizeHeight = (target: HTMLTextAreaElement): void => {\n    const textareaLineHeight = 28;\n\n    target.rows = minRows; // reset number of rows in textarea\n\n    const currentRows = Math.floor((target.scrollHeight - 16) / textareaLineHeight); // scrollHeight - 16px of padding to calculate the rows\n\n    if (currentRows >= maxRows) {\n      target.rows = maxRows;\n      target.scrollTop = target.scrollHeight;\n    } else {\n      target.rows = currentRows;\n    }\n  };\n\n  const onDark = onColor === FormOnColor.ondark;\n  const onBlueberry = onColor === FormOnColor.onblueberry;\n  const maxCharactersExceeded = !!maxCharacters && textareaInput.toString().length > maxCharacters;\n  const onError = onColor === FormOnColor.oninvalid || !!errorText || !!error || maxCharactersExceeded;\n\n  const textareaWrapperClass = cn(styles.textarea, {\n    [styles['textarea--gutterBottom']]: gutterBottom,\n  });\n\n  const contentWrapperClass = cn(styles['input-container'], {\n    [styles['input-container--transparent']]: transparent,\n    [styles['input-container--on-blueberry']]: onBlueberry,\n    [styles['input-container--on-dark']]: onDark,\n    [styles['input-container--invalid']]: onError,\n    [styles['input-container--disabled']]: props.disabled,\n  });\n\n  const textareaClass = cn(styles['input-container__input'], {\n    [styles[`input-container__input--disabled`]]: props.disabled,\n  });\n\n  useLayoutEffect(() => {\n    if (grow && referanse.current?.children && referanse.current?.children[0]) {\n      const textarea = referanse.current?.children[0] as HTMLTextAreaElement;\n      resizeHeight(textarea);\n    }\n  }, [value]);\n\n  const onChangeHandler = (e: React.ChangeEvent<HTMLTextAreaElement>): void => {\n    setTextareaInput(e.target.value);\n\n    if (onChange) {\n      onChange(e);\n    }\n\n    if (grow) {\n      resizeHeight(e.target);\n    }\n  };\n\n  const maxWidth = width ? getTextareaMaxWidth(width) : undefined;\n\n  return (\n    <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextUuid}>\n      <div data-testid={testId} data-analyticsid={AnalyticsId.Textarea} className={textareaWrapperClass}>\n        {renderLabel({ label: label, inputId: textareaId, onColor: onColor as FormOnColor })}\n        <div className={contentWrapperClass} ref={referanse} style={{ maxWidth }}>\n          <textarea\n            {...rest}\n            rows={minRows}\n            defaultValue={defaultValue}\n            id={textareaId}\n            className={textareaClass}\n            ref={ref}\n            aria-describedby={getAriaDescribedBy(props, errorTextUuid)}\n            aria-invalid={!!onError}\n            // eslint-disable-next-line jsx-a11y/no-autofocus\n            autoFocus={autoFocus}\n            disabled={disabled}\n            name={name}\n            autoComplete={autoComplete ? autoComplete : undefined}\n            placeholder={placeholder}\n            readOnly={readOnly}\n            required={required}\n            onChange={onChangeHandler}\n            value={value}\n          />\n        </div>\n        {maxCharacters && (\n          <MaxCharacters\n            maxCharacters={maxCharacters}\n            length={textareaInput.toString().length}\n            maxText={mergedResources.characters}\n            onColor={onColor}\n            maxWidth={maxWidth}\n          />\n        )}\n      </div>\n    </ErrorWrapper>\n  );\n};\n\nTextarea.displayName = 'Textarea';\n\nexport default Textarea;\n","import Textarea from './Textarea';\nexport * from './Textarea';\nexport default Textarea;\n"],"mappings":"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"}
+{"version":3,"file":"Textarea.js","names":[],"sources":["../src/resources/HN.Designsystem.TextArea.en-GB.json","../src/resources/HN.Designsystem.TextArea.nb-NO.json","../src/resources/HN.Designsystem.TextArea.nn-NO.json","../src/components/Textarea/resourceHelper.ts","../src/components/Textarea/Textarea.tsx","../src/components/Textarea/index.ts"],"sourcesContent":["{\n  \"characters\": \"characters\"\n}\n","{\n  \"characters\": \"tegn\"\n}\n","{\n  \"characters\": \"teikn\"\n}\n","import type { HNDesignsystemTextArea } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.TextArea.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.TextArea.nb-NO.json';\nimport nnNO from '../../resources/HN.Designsystem.TextArea.nn-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemTextArea => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN_NYNORSK:\n      return nnNO;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import { useState, useRef, useLayoutEffect } from 'react';\n\nimport cn from 'classnames';\n\nimport type { HNDesignsystemTextArea } from '../../resources/Resources';\nimport type { ErrorWrapperClassNameProps } from '../ErrorWrapper';\n\nimport { getResources } from './resourceHelper';\nimport { AnalyticsId, AVERAGE_CHARACTER_WIDTH_PX, FormOnColor, LanguageLocales } from '../../constants';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { useLanguage } from '../../hooks/useLanguage';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper from '../ErrorWrapper';\nimport { renderLabel } from '../Label/utils';\nimport MaxCharacters from '../MaxCharacters/MaxCharacters';\n\nimport styles from './styles.module.scss';\n\nexport interface TextareaProps\n  extends\n    ErrorWrapperClassNameProps,\n    Pick<\n      React.InputHTMLAttributes<HTMLTextAreaElement>,\n      | 'aria-describedby'\n      | 'autoFocus'\n      | 'disabled'\n      | 'name'\n      | 'autoComplete'\n      | 'placeholder'\n      | 'readOnly'\n      | 'required'\n      | 'defaultValue'\n      | 'onChange'\n      | 'value'\n    > {\n  /** max character limit in textarea  */\n  maxCharacters?: number;\n  /** Width of textarea in characters (approximate) */\n  width?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** If true, the component will have a bottom margin. */\n  marginBottom?: boolean;\n  /** If true, the component will be transparent. */\n  transparent?: boolean;\n  /** Changes the visuals of the textarea */\n  onColor?: keyof typeof FormOnColor;\n  /** Label of the input */\n  label?: React.ReactNode;\n  /** id of the textarea */\n  textareaId?: string;\n  /** max rows */\n  maxRows?: number;\n  /** min rows */\n  minRows?: number;\n  /** auto-grows until maxRows */\n  grow?: boolean;\n  /** Activates Error style for the input */\n  error?: boolean;\n  /** Error text to show above the component */\n  errorText?: string;\n  /** Error text id */\n  errorTextId?: string;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemTextArea>;\n  /** Ref passed to the component */\n  ref?: React.Ref<HTMLTextAreaElement | null>;\n}\n\nconst getTextareaMaxWidth = (characters: number): string => {\n  const paddingWidth = '2rem';\n  const scrollbarWidth = '16px';\n  const borderWidth = '4px';\n\n  return `calc(${characters * AVERAGE_CHARACTER_WIDTH_PX}px + ${paddingWidth} + ${scrollbarWidth} + ${borderWidth})`;\n};\n\nconst Textarea: React.FC<TextareaProps> = props => {\n  const {\n    maxCharacters,\n    width,\n    testId,\n    defaultValue,\n    marginBottom: gutterBottom,\n    transparent,\n    onColor = FormOnColor.onwhite,\n    label,\n    textareaId = uuid(),\n    minRows = 3,\n    maxRows = 10,\n    grow,\n    error,\n    errorText,\n    errorTextId: errorTextIdProp,\n    errorWrapperClassName,\n    autoFocus,\n    disabled,\n    name,\n    autoComplete = 'off',\n    placeholder,\n    readOnly,\n    required,\n    onChange,\n    value,\n    resources,\n    ref,\n    ...rest\n  } = props;\n\n  const [textareaInput, setTextareaInput] = useState(value || defaultValue || '');\n  const [prevDefaultValue, setPrevDefaultValue] = useState(defaultValue);\n  const [prevValue, setPrevValue] = useState(value);\n  const referanse = useRef<HTMLDivElement>(null);\n  const errorTextUuid = useIdWithFallback(errorTextIdProp);\n\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemTextArea = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  if (defaultValue !== prevDefaultValue) {\n    setPrevDefaultValue(defaultValue);\n    setTextareaInput(defaultValue || '');\n  }\n\n  if (value !== prevValue) {\n    setPrevValue(value);\n\n    if (value) {\n      setTextareaInput(value);\n    }\n  }\n\n  const resizeHeight = (target: HTMLTextAreaElement): void => {\n    const textareaLineHeight = 28;\n\n    target.rows = minRows; // reset number of rows in textarea\n\n    const currentRows = Math.floor((target.scrollHeight - 16) / textareaLineHeight); // scrollHeight - 16px of padding to calculate the rows\n\n    if (currentRows >= maxRows) {\n      target.rows = maxRows;\n      target.scrollTop = target.scrollHeight;\n    } else {\n      target.rows = currentRows;\n    }\n  };\n\n  const onDark = onColor === FormOnColor.ondark;\n  const onBlueberry = onColor === FormOnColor.onblueberry;\n  const maxCharactersExceeded = !!maxCharacters && textareaInput.toString().length > maxCharacters;\n  const onError = onColor === FormOnColor.oninvalid || !!errorText || !!error || maxCharactersExceeded;\n\n  const textareaWrapperClass = cn(styles.textarea, {\n    [styles['textarea--gutterBottom']]: gutterBottom,\n  });\n\n  const contentWrapperClass = cn(styles['input-container'], {\n    [styles['input-container--transparent']]: transparent,\n    [styles['input-container--on-blueberry']]: onBlueberry,\n    [styles['input-container--on-dark']]: onDark,\n    [styles['input-container--invalid']]: onError,\n    [styles['input-container--disabled']]: props.disabled,\n  });\n\n  const textareaClass = cn(styles['input-container__input'], {\n    [styles[`input-container__input--disabled`]]: props.disabled,\n  });\n\n  useLayoutEffect(() => {\n    if (grow && referanse.current?.children && referanse.current?.children[0]) {\n      const textarea = referanse.current?.children[0] as HTMLTextAreaElement;\n      resizeHeight(textarea);\n    }\n  }, [value]);\n\n  const onChangeHandler = (e: React.ChangeEvent<HTMLTextAreaElement>): void => {\n    setTextareaInput(e.target.value);\n\n    if (onChange) {\n      onChange(e);\n    }\n\n    if (grow) {\n      resizeHeight(e.target);\n    }\n  };\n\n  const maxWidth = width ? getTextareaMaxWidth(width) : undefined;\n\n  return (\n    <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextUuid}>\n      <div data-testid={testId} data-analyticsid={AnalyticsId.Textarea} className={textareaWrapperClass}>\n        {renderLabel({ label: label, inputId: textareaId, onColor: onColor as FormOnColor })}\n        <div className={contentWrapperClass} ref={referanse} style={{ maxWidth }}>\n          <textarea\n            {...rest}\n            rows={minRows}\n            defaultValue={defaultValue}\n            id={textareaId}\n            className={textareaClass}\n            ref={ref}\n            aria-describedby={getAriaDescribedBy(props, errorTextUuid)}\n            aria-invalid={!!onError}\n            // eslint-disable-next-line jsx-a11y/no-autofocus\n            autoFocus={autoFocus}\n            disabled={disabled}\n            name={name}\n            autoComplete={autoComplete ? autoComplete : undefined}\n            placeholder={placeholder}\n            readOnly={readOnly}\n            required={required}\n            onChange={onChangeHandler}\n            value={value}\n          />\n        </div>\n        {maxCharacters && (\n          <MaxCharacters\n            maxCharacters={maxCharacters}\n            length={textareaInput.toString().length}\n            maxText={mergedResources.characters}\n            onColor={onColor}\n            maxWidth={maxWidth}\n          />\n        )}\n      </div>\n    </ErrorWrapper>\n  );\n};\n\nTextarea.displayName = 'Textarea';\n\nexport default Textarea;\n","import Textarea from './Textarea';\nexport * from './Textarea';\nexport default Textarea;\n"],"mappings":"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"}

package/lib/Title.js.map

@@ -1 +1 @@
-{"version":3,"file":"Title.js","names":[],"sources":["../src/components/Title/utils.ts","../src/components/Title/Title.tsx"],"sourcesContent":["import type { TitleMargin } from './Title';\n\nexport const instanceOfTitleMargin = (margin: unknown): margin is TitleMargin => {\n  return Object.prototype.hasOwnProperty.call(margin, 'marginTop') && Object.prototype.hasOwnProperty.call(margin, 'marginBottom');\n};\n","import classNames from 'classnames';\n\nimport { instanceOfTitleMargin } from './utils';\nimport { AnalyticsId } from '../../constants';\n\nimport titleStyles from './styles.module.scss';\n\nexport type TitleTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';\nexport type TitleAppearances = 'titleFeature' | 'title1' | 'title2' | 'title3' | 'title4' | 'title5' | 'title6';\n\nexport interface TitleProps {\n  children: React.ReactNode;\n  /** Gives a unique id to the title */\n  id?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds top and bottom margin in rem. */\n  margin?: number | TitleMargin;\n  /** Changes the underlying element of the title. */\n  htmlMarkup?: TitleTags;\n  /** Changes the appearance of the title. */\n  appearance?: TitleAppearances;\n  /** Sets the tabIndex. Use this with caution. */\n  tabIndex?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Ref passed to the heading element */\n  ref?: React.Ref<HTMLHeadingElement | null>;\n}\n\nexport const Title: React.FC<TitleProps> = (props: TitleProps) => {\n  const { id, children, className, htmlMarkup = 'h1', appearance = 'title1', margin = 0, tabIndex, testId, ref } = props;\n  const titleClasses = classNames(\n    titleStyles.title,\n    {\n      [titleStyles['title--feature']]: appearance === 'titleFeature',\n      [titleStyles['title--title1']]: appearance === 'title1',\n      [titleStyles['title--title2']]: appearance === 'title2',\n      [titleStyles['title--title3']]: appearance === 'title3',\n      [titleStyles['title--title4']]: appearance === 'title4',\n      [titleStyles['title--title5']]: appearance === 'title5',\n      [titleStyles['title--title6']]: appearance === 'title6',\n    },\n    className\n  );\n  const CustomTag = htmlMarkup;\n\n  const inlineStyle = instanceOfTitleMargin(margin)\n    ? { marginTop: `${margin.marginTop}rem`, marginBottom: `${margin.marginBottom}rem` }\n    : { marginTop: `${margin}rem`, marginBottom: `${margin}rem` };\n\n  return (\n    <CustomTag\n      id={id}\n      className={titleClasses}\n      style={inlineStyle}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Title}\n      tabIndex={tabIndex}\n    >\n      {children}\n    </CustomTag>\n  );\n};\n\nexport interface TitleMargin {\n  marginTop: number;\n  marginBottom: number;\n}\n\nexport default Title;\n"],"mappings":";;;;;AAEA,IAAa,yBAAyB,WAA2C;CAC/E,OAAO,OAAO,UAAU,eAAe,KAAK,QAAQ,YAAY,IAAI,OAAO,UAAU,eAAe,KAAK,QAAQ,eAAe;;;;AC2BlI,IAAa,SAA+B,UAAsB;CAChE,MAAM,EAAE,IAAI,UAAU,WAAW,aAAa,MAAM,aAAa,UAAU,SAAS,GAAG,UAAU,QAAQ,QAAQ;CAoBjH,OACE,oBAAC,YAAD;EACM;EACJ,WAtBiB,WACnB,YAAY,OACZ;IACG,YAAY,oBAAoB,eAAe;IAC/C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;GAChD,EACD,UAWa;EACX,OARgB,sBAAsB,OAAO,GAC7C;GAAE,WAAW,GAAG,OAAO,UAAU;GAAM,cAAc,GAAG,OAAO,aAAa;GAAM,GAClF;GAAE,WAAW,GAAG,OAAO;GAAM,cAAc,GAAG,OAAO;GAAM;EAOtD;EACL,eAAa;EACb,oBAAkB,YAAY;EACpB;EAET;EACS,CAAA"}
+{"version":3,"file":"Title.js","names":[],"sources":["../src/components/Title/utils.ts","../src/components/Title/Title.tsx"],"sourcesContent":["import type { TitleMargin } from './Title';\n\nexport const instanceOfTitleMargin = (margin: unknown): margin is TitleMargin => {\n  return Object.prototype.hasOwnProperty.call(margin, 'marginTop') && Object.prototype.hasOwnProperty.call(margin, 'marginBottom');\n};\n","import classNames from 'classnames';\n\nimport { instanceOfTitleMargin } from './utils';\nimport { AnalyticsId } from '../../constants';\n\nimport titleStyles from './styles.module.scss';\n\nexport type TitleTags = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'span';\nexport type TitleAppearances = 'titleFeature' | 'title1' | 'title2' | 'title3' | 'title4' | 'title5' | 'title6';\n\nexport interface TitleProps {\n  children: React.ReactNode;\n  /** Gives a unique id to the title */\n  id?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds top and bottom margin in rem. */\n  margin?: number | TitleMargin;\n  /** Changes the underlying element of the title. */\n  htmlMarkup?: TitleTags;\n  /** Changes the appearance of the title. */\n  appearance?: TitleAppearances;\n  /** Sets the tabIndex. Use this with caution. */\n  tabIndex?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Ref passed to the heading element */\n  ref?: React.Ref<HTMLHeadingElement | null>;\n}\n\nexport const Title: React.FC<TitleProps> = (props: TitleProps) => {\n  const { id, children, className, htmlMarkup = 'h1', appearance = 'title1', margin = 0, tabIndex, testId, ref } = props;\n  const titleClasses = classNames(\n    titleStyles.title,\n    {\n      [titleStyles['title--feature']]: appearance === 'titleFeature',\n      [titleStyles['title--title1']]: appearance === 'title1',\n      [titleStyles['title--title2']]: appearance === 'title2',\n      [titleStyles['title--title3']]: appearance === 'title3',\n      [titleStyles['title--title4']]: appearance === 'title4',\n      [titleStyles['title--title5']]: appearance === 'title5',\n      [titleStyles['title--title6']]: appearance === 'title6',\n    },\n    className\n  );\n  const CustomTag = htmlMarkup;\n\n  const inlineStyle = instanceOfTitleMargin(margin)\n    ? { marginTop: `${margin.marginTop}rem`, marginBottom: `${margin.marginBottom}rem` }\n    : { marginTop: `${margin}rem`, marginBottom: `${margin}rem` };\n\n  return (\n    <CustomTag\n      id={id}\n      className={titleClasses}\n      style={inlineStyle}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Title}\n      tabIndex={tabIndex}\n    >\n      {children}\n    </CustomTag>\n  );\n};\n\nexport interface TitleMargin {\n  marginTop: number;\n  marginBottom: number;\n}\n\nexport default Title;\n"],"mappings":";;;;;AAEA,IAAa,yBAAyB,WAA2C;CAC/E,OAAO,OAAO,UAAU,eAAe,KAAK,QAAQ,WAAW,KAAK,OAAO,UAAU,eAAe,KAAK,QAAQ,cAAc;AACjI;;;AC0BA,IAAa,SAA+B,UAAsB;CAChE,MAAM,EAAE,IAAI,UAAU,WAAW,aAAa,MAAM,aAAa,UAAU,SAAS,GAAG,UAAU,QAAQ,QAAQ;CAoBjH,OACE,oBAAC,YAAD;EACM;EACJ,WAtBiB,WACnB,YAAY,OACZ;IACG,YAAY,oBAAoB,eAAe;IAC/C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;IAC9C,YAAY,mBAAmB,eAAe;EACjD,GACA,SAWa;EACX,OARgB,sBAAsB,MAAM,IAC5C;GAAE,WAAW,GAAG,OAAO,UAAU;GAAM,cAAc,GAAG,OAAO,aAAa;EAAK,IACjF;GAAE,WAAW,GAAG,OAAO;GAAM,cAAc,GAAG,OAAO;EAAK;EAOrD;EACL,eAAa;EACb,oBAAkB,YAAY;EACpB;EAET;CACQ,CAAA;AAEf"}

package/lib/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","names":[],"sources":["../src/components/Toast/Toast.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { useIsMobileBreakpoint } from '../../hooks/useIsMobileBreakpoint';\nimport Close from '../Close';\nimport Icon, { IconSize } from '../Icon';\nimport CheckFill from '../Icons/CheckFill';\n\nimport styles from './styles.module.scss';\n\nexport interface ToastProps {\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** The title to display in the toast */\n  title: string;\n  /** The message to display in the toast */\n  message?: string;\n  /** Callback when toast is closed */\n  onClose?: () => void;\n}\n\nconst Toast: React.FC<ToastProps> = ({ testId, title, message, onClose }) => {\n  const isMobile = useIsMobileBreakpoint();\n\n  const handleClose = (): void => {\n    if (onClose) {\n      onClose();\n    }\n  };\n\n  return (\n    <output className={styles['toast']} data-testid={testId}>\n      <Icon\n        size={isMobile ? IconSize.XSmall : IconSize.Small}\n        svgIcon={CheckFill}\n        className={classNames(styles['toast__icon'], styles['toast__icon--check'])}\n      />\n      <div className={styles['toast__text-container']}>\n        <span className={styles['toast__title']}>{title}</span>\n        {message && <span className={styles['toast__description']}>{message}</span>}\n      </div>\n      <Close\n        onClick={handleClose}\n        color=\"black\"\n        className={classNames(styles['toast__icon'], styles['toast__icon--close'])}\n        testId={`${testId}-close`}\n      />\n    </output>\n  );\n};\n\nexport default Toast;\n"],"mappings":";;;;;;;;;AAoBA,IAAM,SAA+B,EAAE,QAAQ,OAAO,SAAS,cAAc;CAC3E,MAAM,WAAW,uBAAuB;CAExC,MAAM,oBAA0B;EAC9B,IAAI,SACF,SAAS;;CAIb,OACE,qBAAC,UAAD;EAAQ,WAAW,OAAO;EAAU,eAAa;YAAjD;GACE,oBAAC,cAAD;IACE,MAAM,WAAW,SAAS,SAAS,SAAS;IAC5C,SAAS;IACT,WAAW,WAAW,OAAO,gBAAgB,OAAO,sBAAsB;IAC1E,CAAA;GACF,qBAAC,OAAD;IAAK,WAAW,OAAO;cAAvB,CACE,oBAAC,QAAD;KAAM,WAAW,OAAO;eAAkB;KAAa,CAAA,EACtD,WAAW,oBAAC,QAAD;KAAM,WAAW,OAAO;eAAwB;KAAe,CAAA,CACvE;;GACN,oBAAC,eAAD;IACE,SAAS;IACT,OAAM;IACN,WAAW,WAAW,OAAO,gBAAgB,OAAO,sBAAsB;IAC1E,QAAQ,GAAG,OAAO;IAClB,CAAA;GACK"}
+{"version":3,"file":"Toast.js","names":[],"sources":["../src/components/Toast/Toast.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport { useIsMobileBreakpoint } from '../../hooks/useIsMobileBreakpoint';\nimport Close from '../Close';\nimport Icon, { IconSize } from '../Icon';\nimport CheckFill from '../Icons/CheckFill';\n\nimport styles from './styles.module.scss';\n\nexport interface ToastProps {\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** The title to display in the toast */\n  title: string;\n  /** The message to display in the toast */\n  message?: string;\n  /** Callback when toast is closed */\n  onClose?: () => void;\n}\n\nconst Toast: React.FC<ToastProps> = ({ testId, title, message, onClose }) => {\n  const isMobile = useIsMobileBreakpoint();\n\n  const handleClose = (): void => {\n    if (onClose) {\n      onClose();\n    }\n  };\n\n  return (\n    <output className={styles['toast']} data-testid={testId}>\n      <Icon\n        size={isMobile ? IconSize.XSmall : IconSize.Small}\n        svgIcon={CheckFill}\n        className={classNames(styles['toast__icon'], styles['toast__icon--check'])}\n      />\n      <div className={styles['toast__text-container']}>\n        <span className={styles['toast__title']}>{title}</span>\n        {message && <span className={styles['toast__description']}>{message}</span>}\n      </div>\n      <Close\n        onClick={handleClose}\n        color=\"black\"\n        className={classNames(styles['toast__icon'], styles['toast__icon--close'])}\n        testId={`${testId}-close`}\n      />\n    </output>\n  );\n};\n\nexport default Toast;\n"],"mappings":";;;;;;;;;AAoBA,IAAM,SAA+B,EAAE,QAAQ,OAAO,SAAS,cAAc;CAC3E,MAAM,WAAW,sBAAsB;CAEvC,MAAM,oBAA0B;EAC9B,IAAI,SACF,QAAQ;CAEZ;CAEA,OACE,qBAAC,UAAD;EAAQ,WAAW,OAAO;EAAU,eAAa;YAAjD;GACE,oBAAC,cAAD;IACE,MAAM,WAAW,SAAS,SAAS,SAAS;IAC5C,SAAS;IACT,WAAW,WAAW,OAAO,gBAAgB,OAAO,qBAAqB;GAC1E,CAAA;GACD,qBAAC,OAAD;IAAK,WAAW,OAAO;cAAvB,CACE,oBAAC,QAAD;KAAM,WAAW,OAAO;eAAkB;IAAY,CAAA,GACrD,WAAW,oBAAC,QAAD;KAAM,WAAW,OAAO;eAAwB;IAAc,CAAA,CACvE;;GACL,oBAAC,eAAD;IACE,SAAS;IACT,OAAM;IACN,WAAW,WAAW,OAAO,gBAAgB,OAAO,qBAAqB;IACzE,QAAQ,GAAG,OAAO;GACnB,CAAA;EACK;;AAEZ"}

package/lib/VisualCheckbox.js

@@ -0,0 +1,79 @@
+import { AnalyticsId } from "./constants.js";
+import { t as CheckboxMarker } from "./CheckboxMarker.js";
+import { useIdWithFallback } from "./hooks/useIdWithFallback.js";
+import { getAriaDescribedBy } from "./utils/accessibility.js";
+import { t as ErrorWrapper_default } from "./ErrorWrapper.js";
+import classNames from "classnames";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./components/VisualCheckboxGroup/VisualCheckbox/styles.module.scss";
+//#region src/components/VisualCheckboxGroup/VisualCheckbox/VisualContent.tsx
+var VisualContent = (props) => {
+	const { children, className, testId } = props;
+	return /* @__PURE__ */ jsx("span", {
+		className: classNames(styles["visual-checkbox__visual-content"], className),
+		"data-testid": testId,
+		"aria-hidden": "true",
+		children
+	});
+};
+//#endregion
+//#region src/components/VisualCheckboxGroup/VisualCheckbox/VisualCheckbox.tsx
+var VisualCheckbox = (props) => {
+	const { className, checked, defaultChecked, children, visualContent, variant = "line", inputId: inputIdProp, errorText, error = !!errorText, errorTextId: errorTextIdProp, errorWrapperClassName, testId, onChange, ref, ...rest } = props;
+	const inputId = useIdWithFallback(inputIdProp);
+	const errorTextId = useIdWithFallback(errorTextIdProp);
+	const [isChecked, setIsChecked] = useState(!!(checked ?? defaultChecked));
+	const [prevChecked, setPrevChecked] = useState(checked);
+	if (prevChecked !== checked) {
+		setPrevChecked(checked);
+		if (checked !== void 0 && checked !== isChecked) setIsChecked(checked);
+	}
+	const handleChange = (e) => {
+		setIsChecked(e.target.checked);
+		onChange?.(e);
+	};
+	return /* @__PURE__ */ jsx(ErrorWrapper_default, {
+		className: errorWrapperClassName,
+		errorText,
+		errorTextId,
+		children: /* @__PURE__ */ jsxs("label", {
+			className: classNames(styles["visual-checkbox"], styles[`visual-checkbox--variant-${variant}`], {
+				[styles["visual-checkbox--checked"]]: isChecked,
+				[styles["visual-checkbox--invalid"]]: error
+			}, className),
+			htmlFor: inputId,
+			"data-testid": testId,
+			"data-analyticsid": AnalyticsId.Checkbox,
+			children: [
+				/* @__PURE__ */ jsx(VisualContent, { children: visualContent }),
+				/* @__PURE__ */ jsx("input", {
+					...rest,
+					id: inputId,
+					ref,
+					className: styles["visual-checkbox__input"],
+					type: "checkbox",
+					checked: isChecked,
+					"aria-invalid": error,
+					"aria-describedby": getAriaDescribedBy(props, errorTextId),
+					onChange: handleChange
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: styles["visual-checkbox__frame"],
+					children: [/* @__PURE__ */ jsx("span", {
+						className: styles["visual-checkbox__label"],
+						children
+					}), /* @__PURE__ */ jsx(CheckboxMarker, {
+						checked: isChecked,
+						error,
+						size: "large"
+					})]
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { VisualCheckbox as t };
+
+//# sourceMappingURL=VisualCheckbox.js.map

package/lib/VisualCheckbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisualCheckbox.js","names":[],"sources":["../src/components/VisualCheckboxGroup/VisualCheckbox/VisualContent.tsx","../src/components/VisualCheckboxGroup/VisualCheckbox/VisualCheckbox.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './styles.module.scss';\n\nexport interface VisualContentProps {\n  /** Content rendered inside the circular area – typically an <img> or illustration component. */\n  children: React.ReactNode;\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const VisualContent: React.FC<VisualContentProps> = props => {\n  const { children, className, testId } = props;\n\n  return (\n    <span className={classNames(styles['visual-checkbox__visual-content'], className)} data-testid={testId} aria-hidden=\"true\">\n      {children}\n    </span>\n  );\n};\n\nexport default VisualContent;\n","import { useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport type { ErrorWrapperClassNameProps } from '../../ErrorWrapper';\n\nimport VisualContent from './VisualContent';\nimport { AnalyticsId } from '../../../constants';\nimport { useIdWithFallback } from '../../../hooks/useIdWithFallback';\nimport { getAriaDescribedBy } from '../../../utils/accessibility';\nimport CheckboxMarker from '../../Checkbox/CheckboxMarker/CheckboxMarker';\nimport ErrorWrapper from '../../ErrorWrapper';\n\nimport styles from './styles.module.scss';\n\nexport type VisualCheckboxVariant = 'line' | 'rectangle';\n\nexport interface VisualCheckboxProps\n  extends ErrorWrapperClassNameProps, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'id' | 'className' | 'children' | 'size'> {\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Label rendered inside the checkbox frame. */\n  children: string;\n  /** Content rendered inside the circular visual slot. */\n  visualContent: React.ReactNode;\n  /** Layout variant. `line` is a thin horizontal pill, `rectangle` is a vertical card. */\n  variant?: VisualCheckboxVariant;\n  /** input id of the underlying checkbox */\n  inputId?: string;\n  /** Activates error styling. Can be true while errorText is empty (e.g. when used in a FormGroup). */\n  error?: boolean;\n  /** Error text to show above the component. */\n  errorText?: string;\n  /** Error text id */\n  errorTextId?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Ref forwarded to the underlying input element. */\n  ref?: React.Ref<HTMLInputElement | null>;\n}\n\nconst VisualCheckbox: React.FC<VisualCheckboxProps> = props => {\n  const {\n    className,\n    checked,\n    defaultChecked,\n    children,\n    visualContent,\n    variant = 'line',\n    inputId: inputIdProp,\n    errorText,\n    error = !!errorText,\n    errorTextId: errorTextIdProp,\n    errorWrapperClassName,\n    testId,\n    onChange,\n    ref,\n    ...rest\n  } = props;\n\n  const inputId = useIdWithFallback(inputIdProp);\n  const errorTextId = useIdWithFallback(errorTextIdProp);\n  const [isChecked, setIsChecked] = useState<boolean>(!!(checked ?? defaultChecked));\n  const [prevChecked, setPrevChecked] = useState<boolean | undefined>(checked);\n  if (prevChecked !== checked) {\n    setPrevChecked(checked);\n    if (checked !== undefined && checked !== isChecked) {\n      setIsChecked(checked);\n    }\n  }\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>): void => {\n    setIsChecked(e.target.checked);\n    onChange?.(e);\n  };\n\n  return (\n    <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextId}>\n      <label\n        className={classNames(\n          styles['visual-checkbox'],\n          styles[`visual-checkbox--variant-${variant}`],\n          {\n            [styles['visual-checkbox--checked']]: isChecked,\n            [styles['visual-checkbox--invalid']]: error,\n          },\n          className\n        )}\n        htmlFor={inputId}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.Checkbox}\n      >\n        <VisualContent>{visualContent}</VisualContent>\n        <input\n          {...rest}\n          id={inputId}\n          ref={ref}\n          className={styles['visual-checkbox__input']}\n          type=\"checkbox\"\n          checked={isChecked}\n          aria-invalid={error}\n          aria-describedby={getAriaDescribedBy(props, errorTextId)}\n          onChange={handleChange}\n        />\n        <span className={styles['visual-checkbox__frame']}>\n          <span className={styles['visual-checkbox__label']}>{children}</span>\n          <CheckboxMarker checked={isChecked} error={error} size={'large'} />\n        </span>\n      </label>\n    </ErrorWrapper>\n  );\n};\n\nexport default VisualCheckbox;\n"],"mappings":";;;;;;;;;;AAaA,IAAa,iBAA8C,UAAS;CAClE,MAAM,EAAE,UAAU,WAAW,WAAW;CAExC,OACE,oBAAC,QAAD;EAAM,WAAW,WAAW,OAAO,oCAAoC,SAAS;EAAG,eAAa;EAAQ,eAAY;EACjH;CACG,CAAA;AAEV;;;ACoBA,IAAM,kBAAgD,UAAS;CAC7D,MAAM,EACJ,WACA,SACA,gBACA,UACA,eACA,UAAU,QACV,SAAS,aACT,WACA,QAAQ,CAAC,CAAC,WACV,aAAa,iBACb,uBACA,QACA,UACA,KACA,GAAG,SACD;CAEJ,MAAM,UAAU,kBAAkB,WAAW;CAC7C,MAAM,cAAc,kBAAkB,eAAe;CACrD,MAAM,CAAC,WAAW,gBAAgB,SAAkB,CAAC,EAAE,WAAW,eAAe;CACjF,MAAM,CAAC,aAAa,kBAAkB,SAA8B,OAAO;CAC3E,IAAI,gBAAgB,SAAS;EAC3B,eAAe,OAAO;EACtB,IAAI,YAAY,KAAA,KAAa,YAAY,WACvC,aAAa,OAAO;CAExB;CAEA,MAAM,gBAAgB,MAAiD;EACrE,aAAa,EAAE,OAAO,OAAO;EAC7B,WAAW,CAAC;CACd;CAEA,OACE,oBAAC,sBAAD;EAAc,WAAW;EAAkC;EAAwB;YACjF,qBAAC,SAAD;GACE,WAAW,WACT,OAAO,oBACP,OAAO,4BAA4B,YACnC;KACG,OAAO,8BAA8B;KACrC,OAAO,8BAA8B;GACxC,GACA,SACF;GACA,SAAS;GACT,eAAa;GACb,oBAAkB,YAAY;aAZhC;IAcE,oBAAC,eAAD,EAAA,UAAgB,cAA6B,CAAA;IAC7C,oBAAC,SAAD;KACE,GAAI;KACJ,IAAI;KACC;KACL,WAAW,OAAO;KAClB,MAAK;KACL,SAAS;KACT,gBAAc;KACd,oBAAkB,mBAAmB,OAAO,WAAW;KACvD,UAAU;IACX,CAAA;IACD,qBAAC,QAAD;KAAM,WAAW,OAAO;eAAxB,CACE,oBAAC,QAAD;MAAM,WAAW,OAAO;MAA4B;KAAe,CAAA,GACnE,oBAAC,gBAAD;MAAgB,SAAS;MAAkB;MAAO,MAAM;KAAU,CAAA,CAC9D;;GACD;;CACK,CAAA;AAElB"}

package/lib/VisualRadio.js

@@ -0,0 +1,64 @@
+import { AnalyticsId } from "./constants.js";
+import { useIdWithFallback } from "./hooks/useIdWithFallback.js";
+import { getAriaDescribedBy } from "./utils/accessibility.js";
+import { t as ErrorWrapper_default } from "./ErrorWrapper.js";
+import { t as RadioMarker } from "./RadioMarker.js";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./components/VisualRadioGroup/VisualRadio/styles.module.scss";
+//#region src/components/VisualRadioGroup/VisualRadio/VisualContent.tsx
+var VisualContent = (props) => {
+	const { children, className, testId } = props;
+	return /* @__PURE__ */ jsx("span", {
+		className: classNames(styles["visual-radio__visual-content"], className),
+		"data-testid": testId,
+		"aria-hidden": "true",
+		children
+	});
+};
+//#endregion
+//#region src/components/VisualRadioGroup/VisualRadio/VisualRadio.tsx
+var VisualRadio = (props) => {
+	const { className, children, visualContent, variant = "line", inputId: inputIdProp, errorText, error = !!errorText, errorTextId: errorTextIdProp, errorWrapperClassName, testId, ref, ...rest } = props;
+	const inputId = useIdWithFallback(inputIdProp);
+	const errorTextId = useIdWithFallback(errorTextIdProp);
+	return /* @__PURE__ */ jsx(ErrorWrapper_default, {
+		className: errorWrapperClassName,
+		errorText,
+		errorTextId,
+		children: /* @__PURE__ */ jsxs("label", {
+			className: classNames(styles["visual-radio"], styles[`visual-radio--variant-${variant}`], { [styles["visual-radio--invalid"]]: error }, className),
+			htmlFor: inputId,
+			"data-testid": testId,
+			"data-analyticsid": AnalyticsId.RadioButton,
+			children: [
+				visualContent !== void 0 && /* @__PURE__ */ jsx(VisualContent, { children: visualContent }),
+				/* @__PURE__ */ jsx("input", {
+					...rest,
+					id: inputId,
+					ref,
+					className: styles["visual-radio__input"],
+					type: "radio",
+					checked: rest.checked,
+					"aria-invalid": error,
+					"aria-describedby": getAriaDescribedBy(props, errorTextId),
+					onChange: rest.onChange
+				}),
+				/* @__PURE__ */ jsxs("span", {
+					className: styles["visual-radio__frame"],
+					children: [/* @__PURE__ */ jsx("span", {
+						className: styles["visual-radio__label"],
+						children
+					}), /* @__PURE__ */ jsx(RadioMarker, {
+						error,
+						size: "large"
+					})]
+				})
+			]
+		})
+	});
+};
+//#endregion
+export { VisualRadio as t };
+
+//# sourceMappingURL=VisualRadio.js.map

package/lib/VisualRadio.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"VisualRadio.js","names":[],"sources":["../src/components/VisualRadioGroup/VisualRadio/VisualContent.tsx","../src/components/VisualRadioGroup/VisualRadio/VisualRadio.tsx"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './styles.module.scss';\n\nexport interface VisualContentProps {\n  /** Content rendered inside the circular area – typically an <img> or illustration component. */\n  children: React.ReactNode;\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const VisualContent: React.FC<VisualContentProps> = props => {\n  const { children, className, testId } = props;\n\n  return (\n    <span className={classNames(styles['visual-radio__visual-content'], className)} data-testid={testId} aria-hidden=\"true\">\n      {children}\n    </span>\n  );\n};\n\nexport default VisualContent;\n","import classNames from 'classnames';\n\nimport type { ErrorWrapperClassNameProps } from '../../ErrorWrapper';\n\nimport VisualContent from './VisualContent';\nimport { AnalyticsId } from '../../../constants';\nimport { useIdWithFallback } from '../../../hooks/useIdWithFallback';\nimport { getAriaDescribedBy } from '../../../utils/accessibility';\nimport ErrorWrapper from '../../ErrorWrapper';\nimport RadioMarker from '../../RadioButton/RadioMarker/RadioMarker';\n\nimport styles from './styles.module.scss';\n\nexport type VisualRadioVariant = 'line' | 'rectangle';\n\nexport interface VisualRadioProps\n  extends ErrorWrapperClassNameProps, Omit<React.InputHTMLAttributes<HTMLInputElement>, 'type' | 'id' | 'className' | 'children' | 'size'> {\n  /** Adds custom classes to the root element. */\n  className?: string;\n  /** Label rendered inside the radio frame. */\n  children: string;\n  /** Content rendered inside the circular visual slot. */\n  visualContent?: React.ReactNode;\n  /** Layout variant. `line` is a thin horizontal pill, `rectangle` is a vertical card. */\n  variant?: VisualRadioVariant;\n  /** input id of the underlying radio */\n  inputId?: string;\n  /** Activates error styling. Can be true while errorText is empty (e.g. when used in a FormGroup). */\n  error?: boolean;\n  /** Error text to show above the component. */\n  errorText?: string;\n  /** Error text id */\n  errorTextId?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Ref forwarded to the underlying input element. */\n  ref?: React.Ref<HTMLInputElement | null>;\n}\n\nconst VisualRadio: React.FC<VisualRadioProps> = props => {\n  const {\n    className,\n    children,\n    visualContent,\n    variant = 'line',\n    inputId: inputIdProp,\n    errorText,\n    error = !!errorText,\n    errorTextId: errorTextIdProp,\n    errorWrapperClassName,\n    testId,\n    ref,\n    ...rest\n  } = props;\n\n  const inputId = useIdWithFallback(inputIdProp);\n  const errorTextId = useIdWithFallback(errorTextIdProp);\n\n  return (\n    <ErrorWrapper className={errorWrapperClassName} errorText={errorText} errorTextId={errorTextId}>\n      <label\n        className={classNames(\n          styles['visual-radio'],\n          styles[`visual-radio--variant-${variant}`],\n          { [styles['visual-radio--invalid']]: error },\n          className\n        )}\n        htmlFor={inputId}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.RadioButton}\n      >\n        {visualContent !== undefined && <VisualContent>{visualContent}</VisualContent>}\n        {/* eslint-disable-next-line jsx-a11y/role-supports-aria-props -- aria-invalid is a global ARIA state, valid on radio inputs */}\n        <input\n          {...rest}\n          id={inputId}\n          ref={ref}\n          className={styles['visual-radio__input']}\n          type=\"radio\"\n          checked={rest.checked}\n          aria-invalid={error}\n          aria-describedby={getAriaDescribedBy(props, errorTextId)}\n          onChange={rest.onChange}\n        />\n        <span className={styles['visual-radio__frame']}>\n          <span className={styles['visual-radio__label']}>{children}</span>\n          <RadioMarker error={error} size={'large'} />\n        </span>\n      </label>\n    </ErrorWrapper>\n  );\n};\n\nexport default VisualRadio;\n"],"mappings":";;;;;;;;;AAaA,IAAa,iBAA8C,UAAS;CAClE,MAAM,EAAE,UAAU,WAAW,WAAW;CAExC,OACE,oBAAC,QAAD;EAAM,WAAW,WAAW,OAAO,iCAAiC,SAAS;EAAG,eAAa;EAAQ,eAAY;EAC9G;CACG,CAAA;AAEV;;;ACkBA,IAAM,eAA0C,UAAS;CACvD,MAAM,EACJ,WACA,UACA,eACA,UAAU,QACV,SAAS,aACT,WACA,QAAQ,CAAC,CAAC,WACV,aAAa,iBACb,uBACA,QACA,KACA,GAAG,SACD;CAEJ,MAAM,UAAU,kBAAkB,WAAW;CAC7C,MAAM,cAAc,kBAAkB,eAAe;CAErD,OACE,oBAAC,sBAAD;EAAc,WAAW;EAAkC;EAAwB;YACjF,qBAAC,SAAD;GACE,WAAW,WACT,OAAO,iBACP,OAAO,yBAAyB,YAChC,GAAG,OAAO,2BAA2B,MAAM,GAC3C,SACF;GACA,SAAS;GACT,eAAa;GACb,oBAAkB,YAAY;aAThC;IAWG,kBAAkB,KAAA,KAAa,oBAAC,eAAD,EAAA,UAAgB,cAA6B,CAAA;IAE7E,oBAAC,SAAD;KACE,GAAI;KACJ,IAAI;KACC;KACL,WAAW,OAAO;KAClB,MAAK;KACL,SAAS,KAAK;KACd,gBAAc;KACd,oBAAkB,mBAAmB,OAAO,WAAW;KACvD,UAAU,KAAK;IAChB,CAAA;IACD,qBAAC,QAAD;KAAM,WAAW,OAAO;eAAxB,CACE,oBAAC,QAAD;MAAM,WAAW,OAAO;MAAyB;KAAe,CAAA,GAChE,oBAAC,aAAD;MAAoB;MAAO,MAAM;KAAU,CAAA,CACvC;;GACD;;CACK,CAAA;AAElB"}

package/lib/__mocks__/IntersectionObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"IntersectionObserver.js","names":[],"sources":["../../src/__mocks__/IntersectionObserver.ts"],"sourcesContent":["class IntersectionObserver {\n  observe(): void {\n    // do nothing\n  }\n  unobserve(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'IntersectionObserver', {\n  value: IntersectionObserver,\n});\n\nexport default IntersectionObserver;\n"],"mappings":";AAAA,IAAM,uBAAN,MAA2B;CACzB,UAAgB;CAGhB,YAAkB;CAGlB,aAAmB;;AAKrB,OAAO,eAAe,QAAQ,wBAAwB,EACpD,OAAO,sBACR,CAAC"}
+{"version":3,"file":"IntersectionObserver.js","names":[],"sources":["../../src/__mocks__/IntersectionObserver.ts"],"sourcesContent":["class IntersectionObserver {\n  observe(): void {\n    // do nothing\n  }\n  unobserve(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'IntersectionObserver', {\n  value: IntersectionObserver,\n});\n\nexport default IntersectionObserver;\n"],"mappings":";AAAA,IAAM,uBAAN,MAA2B;CACzB,UAAgB,CAEhB;CACA,YAAkB,CAElB;CACA,aAAmB,CAEnB;AACF;AAEA,OAAO,eAAe,QAAQ,wBAAwB,EACpD,OAAO,qBACT,CAAC"}

package/lib/__mocks__/MutationObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"MutationObserver.js","names":[],"sources":["../../src/__mocks__/MutationObserver.ts"],"sourcesContent":["class MutationObserver {\n  observe(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'MutationObserver', {\n  value: MutationObserver,\n});\n\nexport default MutationObserver;\n"],"mappings":";AAAA,IAAM,mBAAN,MAAuB;CACrB,UAAgB;CAGhB,aAAmB;;AAKrB,OAAO,eAAe,QAAQ,oBAAoB,EAChD,OAAO,kBACR,CAAC"}
+{"version":3,"file":"MutationObserver.js","names":[],"sources":["../../src/__mocks__/MutationObserver.ts"],"sourcesContent":["class MutationObserver {\n  observe(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'MutationObserver', {\n  value: MutationObserver,\n});\n\nexport default MutationObserver;\n"],"mappings":";AAAA,IAAM,mBAAN,MAAuB;CACrB,UAAgB,CAEhB;CACA,aAAmB,CAEnB;AACF;AAEA,OAAO,eAAe,QAAQ,oBAAoB,EAChD,OAAO,iBACT,CAAC"}

package/lib/__mocks__/ResizeObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"ResizeObserver.js","names":[],"sources":["../../src/__mocks__/ResizeObserver.ts"],"sourcesContent":["class ResizeObserver {\n  observe(): void {\n    // do nothing\n  }\n  unobserve(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'ResizeObserver', {\n  value: ResizeObserver,\n});\n\nexport default ResizeObserver;\n"],"mappings":";AAAA,IAAM,iBAAN,MAAqB;CACnB,UAAgB;CAGhB,YAAkB;CAGlB,aAAmB;;AAKrB,OAAO,eAAe,QAAQ,kBAAkB,EAC9C,OAAO,gBACR,CAAC"}
+{"version":3,"file":"ResizeObserver.js","names":[],"sources":["../../src/__mocks__/ResizeObserver.ts"],"sourcesContent":["class ResizeObserver {\n  observe(): void {\n    // do nothing\n  }\n  unobserve(): void {\n    // do nothing\n  }\n  disconnect(): void {\n    // do nothing\n  }\n}\n\nObject.defineProperty(window, 'ResizeObserver', {\n  value: ResizeObserver,\n});\n\nexport default ResizeObserver;\n"],"mappings":";AAAA,IAAM,iBAAN,MAAqB;CACnB,UAAgB,CAEhB;CACA,YAAkB,CAElB;CACA,aAAmB,CAEnB;AACF;AAEA,OAAO,eAAe,QAAQ,kBAAkB,EAC9C,OAAO,eACT,CAAC"}

package/lib/__mocks__/matchMedia.js

@@ -1,7 +1,8 @@
 import { vi } from "vitest";
 //#region src/__mocks__/matchMedia.ts
-var mockWindowMatchMedia = vi.fn().mockImplementation(() => ({
-	matches: true,
+var mockWindowMatchMedia = vi.fn().mockImplementation((query) => ({
+	matches: !/prefers-reduced-motion/.test(query),
+	media: query,
 	addEventListener: vi.fn(),
 	removeEventListener: vi.fn()
 }));

package/lib/__mocks__/matchMedia.js.map

@@ -1 +1 @@
-{"version":3,"file":"matchMedia.js","names":[],"sources":["../../src/__mocks__/matchMedia.ts"],"sourcesContent":["import { vi, type Mock } from 'vitest';\n\nexport const mockWindowMatchMedia: Mock = vi.fn().mockImplementation(() => ({\n  matches: true,\n  addEventListener: vi.fn(),\n  removeEventListener: vi.fn(),\n}));\n\nObject.defineProperty(window, 'matchMedia', {\n  writable: true,\n  value: mockWindowMatchMedia,\n});\n"],"mappings":";;AAEA,IAAa,uBAA6B,GAAG,IAAI,CAAC,0BAA0B;CAC1E,SAAS;CACT,kBAAkB,GAAG,IAAI;CACzB,qBAAqB,GAAG,IAAI;CAC7B,EAAE;AAEH,OAAO,eAAe,QAAQ,cAAc;CAC1C,UAAU;CACV,OAAO;CACR,CAAC"}
+{"version":3,"file":"matchMedia.js","names":[],"sources":["../../src/__mocks__/matchMedia.ts"],"sourcesContent":["import { vi, type Mock } from 'vitest';\n\nexport const mockWindowMatchMedia: Mock = vi.fn().mockImplementation((query: string) => ({\n  matches: !/prefers-reduced-motion/.test(query),\n  media: query,\n  addEventListener: vi.fn(),\n  removeEventListener: vi.fn(),\n}));\n\nObject.defineProperty(window, 'matchMedia', {\n  writable: true,\n  value: mockWindowMatchMedia,\n});\n"],"mappings":";;AAEA,IAAa,uBAA6B,GAAG,GAAG,EAAE,oBAAoB,WAAmB;CACvF,SAAS,CAAC,yBAAyB,KAAK,KAAK;CAC7C,OAAO;CACP,kBAAkB,GAAG,GAAG;CACxB,qBAAqB,GAAG,GAAG;AAC7B,EAAE;AAEF,OAAO,eAAe,QAAQ,cAAc;CAC1C,UAAU;CACV,OAAO;AACT,CAAC"}

package/lib/__mocks__/useLayoutEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLayoutEvent.js","names":[],"sources":["../../src/__mocks__/useLayoutEvent.ts"],"sourcesContent":["vi.mock('../hooks/useLayoutEvent', () => ({\n  useLayoutEvent: vi.fn(),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,kCAAkC,EACxC,gBAAgB,GAAG,IAAI,EACxB,EAAE"}
+{"version":3,"file":"useLayoutEvent.js","names":[],"sources":["../../src/__mocks__/useLayoutEvent.ts"],"sourcesContent":["vi.mock('../hooks/useLayoutEvent', () => ({\n  useLayoutEvent: vi.fn(),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,kCAAkC,EACxC,gBAAgB,GAAG,GAAG,EACxB,EAAE"}

package/lib/__mocks__/useOutsideEvent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOutsideEvent.js","names":[],"sources":["../../src/__mocks__/useOutsideEvent.ts"],"sourcesContent":["vi.mock('../hooks/useOutsideEvent', () => ({\n  useOutsideEvent: vi.fn(),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,mCAAmC,EACzC,iBAAiB,GAAG,IAAI,EACzB,EAAE"}
+{"version":3,"file":"useOutsideEvent.js","names":[],"sources":["../../src/__mocks__/useOutsideEvent.ts"],"sourcesContent":["vi.mock('../hooks/useOutsideEvent', () => ({\n  useOutsideEvent: vi.fn(),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,mCAAmC,EACzC,iBAAiB,GAAG,GAAG,EACzB,EAAE"}

package/lib/__mocks__/usePseudoClasses.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePseudoClasses.js","names":[],"sources":["../../src/__mocks__/usePseudoClasses.ts"],"sourcesContent":["vi.mock('../hooks/usePseudoClasses', () => ({\n  usePseudoClasses: vi.fn().mockImplementation(ref => {\n    return { refObject: ref || { current: undefined }, isHovered: false, isFocused: false };\n  }),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,oCAAoC,EAC1C,kBAAkB,GAAG,IAAI,CAAC,oBAAmB,QAAO;CAClD,OAAO;EAAE,WAAW,OAAO,EAAE,SAAS,KAAA,GAAW;EAAE,WAAW;EAAO,WAAW;EAAO;EACvF,EACH,EAAE"}
+{"version":3,"file":"usePseudoClasses.js","names":[],"sources":["../../src/__mocks__/usePseudoClasses.ts"],"sourcesContent":["vi.mock('../hooks/usePseudoClasses', () => ({\n  usePseudoClasses: vi.fn().mockImplementation(ref => {\n    return { refObject: ref || { current: undefined }, isHovered: false, isFocused: false };\n  }),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,oCAAoC,EAC1C,kBAAkB,GAAG,GAAG,EAAE,oBAAmB,QAAO;CAClD,OAAO;EAAE,WAAW,OAAO,EAAE,SAAS,KAAA,EAAU;EAAG,WAAW;EAAO,WAAW;CAAM;AACxF,CAAC,EACH,EAAE"}

package/lib/__mocks__/useSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSize.js","names":[],"sources":["../../src/__mocks__/useSize.ts"],"sourcesContent":["vi.mock('../hooks/useSize', () => ({\n  useSize: vi.fn().mockReturnValue({\n    height: 100,\n    width: 100,\n    top: 0,\n    left: 0,\n    right: 100,\n    bottom: 100,\n  }),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,2BAA2B,EACjC,SAAS,GAAG,IAAI,CAAC,gBAAgB;CAC/B,QAAQ;CACR,OAAO;CACP,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;CACT,CAAC,EACH,EAAE"}
+{"version":3,"file":"useSize.js","names":[],"sources":["../../src/__mocks__/useSize.ts"],"sourcesContent":["vi.mock('../hooks/useSize', () => ({\n  useSize: vi.fn().mockReturnValue({\n    height: 100,\n    width: 100,\n    top: 0,\n    left: 0,\n    right: 100,\n    bottom: 100,\n  }),\n}));\n\nexport {};\n"],"mappings":";AAAA,GAAG,KAAK,2BAA2B,EACjC,SAAS,GAAG,GAAG,EAAE,gBAAgB;CAC/B,QAAQ;CACR,OAAO;CACP,KAAK;CACL,MAAM;CACN,OAAO;CACP,QAAQ;AACV,CAAC,EACH,EAAE"}

package/lib/__mocks__/uuid.js.map

@@ -1 +1 @@
-{"version":3,"file":"uuid.js","names":[],"sources":["../../src/__mocks__/uuid.ts"],"sourcesContent":["import * as uuidUtils from '../utils/uuid';\n\nconst testId = {\n  id: 0,\n};\n\n/**\n * Returnerer en unik, forutsigbar id hver gang uuid() kalles\n */\nvi.spyOn(uuidUtils, 'uuid').mockImplementation(() => {\n  testId.id++;\n  return `testid-${testId.id}`;\n});\n"],"mappings":";;AAEA,IAAM,SAAS,EACb,IAAI,GACL;;;;AAKD,GAAG,MAAM,cAAW,OAAO,CAAC,yBAAyB;CACnD,OAAO;CACP,OAAO,UAAU,OAAO;EACxB"}
+{"version":3,"file":"uuid.js","names":[],"sources":["../../src/__mocks__/uuid.ts"],"sourcesContent":["import * as uuidUtils from '../utils/uuid';\n\nconst testId = {\n  id: 0,\n};\n\n/**\n * Returnerer en unik, forutsigbar id hver gang uuid() kalles\n */\nvi.spyOn(uuidUtils, 'uuid').mockImplementation(() => {\n  testId.id++;\n  return `testid-${testId.id}`;\n});\n"],"mappings":";;AAEA,IAAM,SAAS,EACb,IAAI,EACN;;;;AAKA,GAAG,MAAM,cAAW,MAAM,EAAE,yBAAyB;CACnD,OAAO;CACP,OAAO,UAAU,OAAO;AAC1B,CAAC"}

package/lib/components/ArticleTeaser/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/resources/HN.Designsystem.ArticleTeaser.en-GB.json","../../../src/resources/HN.Designsystem.ArticleTeaser.nb-NO.json","../../../src/components/ArticleTeaser/resourceHelper.ts","../../../src/components/ArticleTeaser/ArticleTeaser.tsx","../../../src/components/ArticleTeaser/index.ts"],"sourcesContent":["{\n  \"expandButtonClose\": \"Show more\",\n  \"expandButtonOpen\": \"Show less\"\n}\n","{\n  \"expandButtonClose\": \"Vis mer\",\n  \"expandButtonOpen\": \"Vis mindre\"\n}\n","import type { HNDesignsystemArticleTeaser } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.ArticleTeaser.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.ArticleTeaser.nb-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemArticleTeaser => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import classNames from 'classnames';\n\nimport type { HNDesignsystemArticleTeaser } from '../../resources/Resources';\n\nimport { getResources } from './resourceHelper';\nimport { AnalyticsId, LanguageLocales } from '../../constants';\nimport { useLanguage } from '../../hooks/useLanguage';\n\nimport styles from './styles.module.scss';\n\nexport type ArticleTeaserTags = 'div' | 'section' | 'aside' | 'article';\n\nexport interface ArticleTeaserProps {\n  /** Callback for the button. Should be used for setting the expanded boolean */\n  onExpand: () => void;\n  /** What's in the box? */\n  children: React.ReactNode;\n  /** Id of the content, used to set aria-controls */\n  contentId: string;\n  /** If the component is expanded or not */\n  expanded: boolean;\n  /** For overriding the height of the collapsed teaser */\n  heightCollapsed?: string;\n  /** Changes the underlying element of the wrapper */\n  htmlMarkup?: ArticleTeaserTags;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemArticleTeaser>;\n  /** Sets the data-testid attribute */\n  testId?: string;\n}\n\nconst ArticleTeaser: React.FC<ArticleTeaserProps> = props => {\n  const { onExpand, children, contentId, expanded, htmlMarkup = 'div', resources, testId } = props;\n  const WrapperTag = htmlMarkup;\n\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemArticleTeaser = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  return (\n    <WrapperTag className={classNames(styles.articleteaser)} data-testid={testId} data-analyticsid={AnalyticsId.ArticleTeaser}>\n      <div\n        className={classNames(styles['articleteaser__content'], {\n          [styles['articleteaser__content--collapsed']]: !expanded,\n        })}\n        style={{\n          maxHeight: expanded ? 'none' : props.heightCollapsed,\n        }}\n      >\n        {children}\n      </div>\n      <button\n        type=\"button\"\n        className={classNames(styles['articleteaser__button'], {\n          [styles['articleteaser__button--expanded']]: expanded,\n        })}\n        onClick={onExpand}\n        aria-expanded={expanded}\n        aria-controls={contentId}\n      >\n        {expanded ? mergedResources.expandButtonOpen : mergedResources.expandButtonClose}\n      </button>\n    </WrapperTag>\n  );\n};\n\nexport default ArticleTeaser;\n","import ArticleTeaser from './ArticleTeaser';\nexport * from './ArticleTeaser';\nexport default ArticleTeaser;\n"],"mappings":";;;;;;;;;;;;;;;AEMA,IAAa,gBAAgB,aAA2D;CACtF,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;;;;;ACmBb,IAAM,iBAA8C,UAAS;CAC3D,MAAM,EAAE,UAAU,UAAU,WAAW,UAAU,aAAa,OAAO,WAAW,WAAW;CAC3F,MAAM,aAAa;CAEnB,MAAM,EAAE,aAAa,YAA6B,gBAAgB,UAAU;CAG5E,MAAM,kBAA+C;EACnD,GAHuB,aAAa,SAGjC;EACH,GAAG;EACJ;CAED,OACE,qBAAC,YAAD;EAAY,WAAW,WAAW,OAAO,cAAc;EAAE,eAAa;EAAQ,oBAAkB,YAAY;YAA5G,CACE,oBAAC,OAAD;GACE,WAAW,WAAW,OAAO,2BAA2B,GACrD,OAAO,uCAAuC,CAAC,UACjD,CAAC;GACF,OAAO,EACL,WAAW,WAAW,SAAS,MAAM,iBACtC;GAEA;GACG,CAAA,EACN,oBAAC,UAAD;GACE,MAAK;GACL,WAAW,WAAW,OAAO,0BAA0B,GACpD,OAAO,qCAAqC,UAC9C,CAAC;GACF,SAAS;GACT,iBAAe;GACf,iBAAe;aAEd,WAAW,gBAAgB,mBAAmB,gBAAgB;GACxD,CAAA,CACE;;;;;AChEjB,IAAA,wBAAe"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/resources/HN.Designsystem.ArticleTeaser.en-GB.json","../../../src/resources/HN.Designsystem.ArticleTeaser.nb-NO.json","../../../src/components/ArticleTeaser/resourceHelper.ts","../../../src/components/ArticleTeaser/ArticleTeaser.tsx","../../../src/components/ArticleTeaser/index.ts"],"sourcesContent":["{\n  \"expandButtonClose\": \"Show more\",\n  \"expandButtonOpen\": \"Show less\"\n}\n","{\n  \"expandButtonClose\": \"Vis mer\",\n  \"expandButtonOpen\": \"Vis mindre\"\n}\n","import type { HNDesignsystemArticleTeaser } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.ArticleTeaser.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.ArticleTeaser.nb-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemArticleTeaser => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import classNames from 'classnames';\n\nimport type { HNDesignsystemArticleTeaser } from '../../resources/Resources';\n\nimport { getResources } from './resourceHelper';\nimport { AnalyticsId, LanguageLocales } from '../../constants';\nimport { useLanguage } from '../../hooks/useLanguage';\n\nimport styles from './styles.module.scss';\n\nexport type ArticleTeaserTags = 'div' | 'section' | 'aside' | 'article';\n\nexport interface ArticleTeaserProps {\n  /** Callback for the button. Should be used for setting the expanded boolean */\n  onExpand: () => void;\n  /** What's in the box? */\n  children: React.ReactNode;\n  /** Id of the content, used to set aria-controls */\n  contentId: string;\n  /** If the component is expanded or not */\n  expanded: boolean;\n  /** For overriding the height of the collapsed teaser */\n  heightCollapsed?: string;\n  /** Changes the underlying element of the wrapper */\n  htmlMarkup?: ArticleTeaserTags;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemArticleTeaser>;\n  /** Sets the data-testid attribute */\n  testId?: string;\n}\n\nconst ArticleTeaser: React.FC<ArticleTeaserProps> = props => {\n  const { onExpand, children, contentId, expanded, htmlMarkup = 'div', resources, testId } = props;\n  const WrapperTag = htmlMarkup;\n\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemArticleTeaser = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  return (\n    <WrapperTag className={classNames(styles.articleteaser)} data-testid={testId} data-analyticsid={AnalyticsId.ArticleTeaser}>\n      <div\n        className={classNames(styles['articleteaser__content'], {\n          [styles['articleteaser__content--collapsed']]: !expanded,\n        })}\n        style={{\n          maxHeight: expanded ? 'none' : props.heightCollapsed,\n        }}\n      >\n        {children}\n      </div>\n      <button\n        type=\"button\"\n        className={classNames(styles['articleteaser__button'], {\n          [styles['articleteaser__button--expanded']]: expanded,\n        })}\n        onClick={onExpand}\n        aria-expanded={expanded}\n        aria-controls={contentId}\n      >\n        {expanded ? mergedResources.expandButtonOpen : mergedResources.expandButtonClose}\n      </button>\n    </WrapperTag>\n  );\n};\n\nexport default ArticleTeaser;\n","import ArticleTeaser from './ArticleTeaser';\nexport * from './ArticleTeaser';\nexport default ArticleTeaser;\n"],"mappings":";;;;;;;;;;;;;;;AEMA,IAAa,gBAAgB,aAA2D;CACtF,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;CACX;AACF;;;ACiBA,IAAM,iBAA8C,UAAS;CAC3D,MAAM,EAAE,UAAU,UAAU,WAAW,UAAU,aAAa,OAAO,WAAW,WAAW;CAC3F,MAAM,aAAa;CAEnB,MAAM,EAAE,aAAa,YAA6B,gBAAgB,SAAS;CAG3E,MAAM,kBAA+C;EACnD,GAHuB,aAAa,QAGjC;EACH,GAAG;CACL;CAEA,OACE,qBAAC,YAAD;EAAY,WAAW,WAAW,OAAO,aAAa;EAAG,eAAa;EAAQ,oBAAkB,YAAY;YAA5G,CACE,oBAAC,OAAD;GACE,WAAW,WAAW,OAAO,2BAA2B,GACrD,OAAO,uCAAuC,CAAC,SAClD,CAAC;GACD,OAAO,EACL,WAAW,WAAW,SAAS,MAAM,gBACvC;GAEC;EACE,CAAA,GACL,oBAAC,UAAD;GACE,MAAK;GACL,WAAW,WAAW,OAAO,0BAA0B,GACpD,OAAO,qCAAqC,SAC/C,CAAC;GACD,SAAS;GACT,iBAAe;GACf,iBAAe;aAEd,WAAW,gBAAgB,mBAAmB,gBAAgB;EACzD,CAAA,CACE;;AAEhB;;;AClEA,IAAA,wBAAe"}

package/lib/components/Checkbox/CheckboxMarker/CheckboxMarker.d.ts

@@ -0,0 +1,20 @@
+import { FormOnColor, FormSize } from '../../../constants';
+export interface CheckboxMarkerProps {
+    /** Whether the checkbox is checked. Controls the checkmark visibility. */
+    checked?: boolean;
+    /** Disables the visual state of the marker. */
+    disabled?: boolean;
+    /** Activates error styling. */
+    error?: boolean;
+    /** Background context the marker is rendered on. */
+    onColor?: keyof typeof FormOnColor;
+    /** Size variant of the marker. */
+    size?: keyof typeof FormSize;
+    /** Adds custom classes to the marker wrapper. */
+    className?: string;
+}
+/**
+ * Does not render an <input>; consumers render this on their end.
+ */
+export declare const CheckboxMarker: React.FC<CheckboxMarkerProps>;
+export default CheckboxMarker;