@helsenorge/designsystem-react 13.0.0-beta.4 → 13.0.0-workspaces-beta.1

package/lib/TableHeadCell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableHeadCell.js","names":["TableHeadCell: React.FC<Props>"],"sources":["../src/components/Table/TableHeadCell/TableHeadCell.tsx","../src/components/Table/TableHeadCell/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Icon, { IconSize } from '../../Icon';\nimport ArrowDown from '../../Icons/ArrowDown';\nimport ArrowUp from '../../Icons/ArrowUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport enum SortDirection {\n  asc = 'asc',\n  desc = 'desc',\n}\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":";;;;;;;;;AAUA,IAAY,gBAAA,yBAAA,iBAAL;AACL,iBAAA,SAAA;AACA,iBAAA,UAAA;;;AAkBF,MAAaA,iBAAkC,EAC7C,UACA,SACA,WACA,UACA,SACA,OAAO,SAAS,QAChB,QAAQ,MACR,GAAG,WACC;CACJ,MAAM,4BAA4B,WAAW,OAAY,qBAAqB,WAAW,GACtF,OAAY,+BAA+B,SAAS,SAAS,SAC/D,CAAC;AAEF,KAAI,CAAC,YAAY,CAAC,SAChB,QAAO,oBAAC,MAAA,EAAG,WAAW,2BAAA,CAAgC;AAGxD,KAAI,CAAC,SACH,QACE,oBAAC,MAAA;EAAU;EAAO,WAAW;EAA2B,GAAI;EACzD;GACE;CAIT,MAAM,kBAAkB,WAAW,2BAA2B,OAAY,+BAA+B,UAAU;CAEnH,MAAM,uBACJ,WACE,oBAAC,OAAA;EAAI,WAAW,OAAY;YAC1B,oBAAC,cAAA;GAAK,SAAS,WAAW,cAAc,MAAM,oBAAY;GAAS,MAAM,SAAS;IAAW;GACzF;CAGV,MAAM,yBAA4D;AAChE,UAAQ,SAAR;GACE,KAAK,cAAc,IACjB,QAAO;GACT,KAAK,cAAc,KACjB,QAAO;;;AAIb,QACE,oBAAC,MAAA;EAAU;EAAO,WAAW;EAAiB,aAAW,kBAAkB;EAAE,GAAI;YAC/E,qBAAC,UAAA;GAAO,MAAK;GAAkB;GAAS,WAAW,OAAY;GAAuB,gBAAc,UAAU,CAAC,CAAC,UAAU,KAAA;cACvH,gBAAgB,EAChB,SAAA;IACM;GACN;;AC9ET,IAAA,0BDkFe"}

package/lib/TableRow.js

@@ -0,0 +1,46 @@
+import { t as Icon_default } from "./Icon.js";
+import { t as Button_default } from "./Button.js";
+import { t as ChevronDown_default } from "./ChevronDown.js";
+import { t as ChevronUp_default } from "./ChevronUp.js";
+import { t as ModeType } from "./Table.js";
+import React from "react";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./components/Table/styles.module.scss";
+var TableExpanderCellMobile = ({ expanded, onClick, hideDetailsText, showDetailsText, mode = ModeType.normal }) => {
+	return /* @__PURE__ */ jsx("td", {
+		className: classNames(styles.table__cell, styles["table__expander-cell-mobile"], {
+			[styles["table__expander-cell-mobile--expanded"]]: expanded,
+			[styles["table__cell--compact"]]: mode === ModeType.compact
+		}),
+		children: /* @__PURE__ */ jsxs(Button_default, {
+			"aria-expanded": expanded,
+			variant: "borderless",
+			onClick,
+			children: [
+				/* @__PURE__ */ jsx(Icon_default, { svgIcon: expanded ? ChevronUp_default : ChevronDown_default }),
+				" ",
+				expanded ? hideDetailsText : showDetailsText
+			]
+		})
+	});
+};
+var TableExpanderCellMobile_default = TableExpanderCellMobile;
+const TableRow = ({ rowKey, hideDetailsText, showDetailsText, expandable, expanded, onClick, className, children, mode = ModeType.normal,...rest }) => {
+	return /* @__PURE__ */ jsxs("tr", {
+		className: classNames(styles["table-row"], { [styles["table__row--expandable"]]: expandable }, className),
+		onClick,
+		...rest,
+		children: [React.Children.map(children, (child) => React.isValidElement(child) && React.cloneElement(child, { mode })), expandable && /* @__PURE__ */ jsx(TableExpanderCellMobile_default, {
+			expanded,
+			onClick,
+			hideDetailsText,
+			showDetailsText,
+			mode
+		})]
+	}, rowKey);
+};
+var TableRow_default$1 = TableRow;
+export { TableRow as n, TableRow_default$1 as t };
+
+//# sourceMappingURL=TableRow.js.map

package/lib/TableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRow.js","names":["TableExpanderCellMobile: React.FC<TableExpanderCellMobileProps>","TableRow: React.FC<Props>"],"sources":["../src/components/Table/TableExpanderCell/TableExpanderCellMobile.tsx","../src/components/Table/TableRow/TableRow.tsx","../src/components/Table/TableRow/index.ts"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\nimport { Props } from '../TableRow/TableRow';\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 React from 'react';\n\nimport classNames from 'classnames';\n\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\nimport TableExpanderCellMobile from '../TableExpanderCell/TableExpanderCellMobile';\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      {React.Children.map(children, child => React.isValidElement<{ mode?: ModeType }>(child) && React.cloneElement(child, { 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":";;;;;;;;;AAcA,IAAMA,2BAAmE,EACvE,UACA,SACA,iBACA,iBACA,OAAO,SAAS,aACZ;AAMJ,QACE,oBAAC,MAAA;EAAG,WANY,WAAW,OAAY,aAAa,OAAY,gCAAgC;IAC/F,OAAY,2CAA2C;IACvD,OAAY,0BAA0B,SAAS,SAAS;GAC1D,CAAC;YAIE,qBAAC,gBAAA;GAAO,iBAAe;GAAU,SAAQ;GAAsB;;IAC7D,oBAAC,cAAA,EAAK,SAAS,WAAW,oBAAY,qBAAA,CAAe;;IAAE,WAAW,kBAAkB;;IAC7E;GACN;;AAIT,IAAA,kCAAe;ACNf,MAAaC,YAA6B,EACxC,QACA,iBACA,iBACA,YACA,UACA,SACA,WACA,UACA,OAAO,SAAS,OAChB,GAAG,WACC;AASJ,QACE,qBAAC,MAAA;EAAG,WATgB,WACpB,OAAY,cACZ,GACG,OAAY,4BAA4B,YAC1C,EACD,UACD;EAGwC;EAAsB,GAAI;aAC9D,MAAM,SAAS,IAAI,WAAU,UAAS,MAAM,eAAoC,MAAM,IAAI,MAAM,aAAa,OAAO,EAAE,MAAM,CAAC,CAAC,EAC9H,cACC,oBAAC,iCAAA;GACW;GACD;GACQ;GACA;GACX;IACN,CAAA;IAT+C,OAWhD;;AC3DT,IAAA,qBD+De"}

package/lib/Textarea.js

@@ -0,0 +1,112 @@
+import { t as uuid } from "./uuid.js";
+import { n as AnalyticsId, r as FormOnColor, t as AVERAGE_CHARACTER_WIDTH_PX } from "./constants2.js";
+import { t as useIdWithFallback } from "./useIdWithFallback.js";
+import { t as getAriaDescribedBy } from "./accessibility.js";
+import { t as ErrorWrapper_default } from "./ErrorWrapper.js";
+import { r as renderLabel } from "./Label.js";
+import { t as MaxCharacters_default } from "./MaxCharacters.js";
+import React, { useEffect, useRef, useState } from "react";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./components/Textarea/styles.module.scss";
+var getTextareaMaxWidth = (characters) => {
+	return `calc(${characters * 12}px + 2rem + 16px + 4px)`;
+};
+var Textarea = React.forwardRef((props, ref) => {
+	const { maxCharacters, maxText, width, testId, defaultValue, marginBottom: gutterBottom, transparent, onColor = FormOnColor.onwhite, label, textareaId = uuid(), minRows = 3, maxRows = 10, grow, error, errorText, errorTextId: errorTextIdProp, errorWrapperClassName, autoFocus, disabled, name, autoComplete = "off", placeholder, readOnly, required, onChange, value,...rest } = props;
+	const [rows, setRows] = useState(minRows);
+	const [textareaInput, setTextareaInput] = useState(value || defaultValue || "");
+	const referanse = useRef(null);
+	const errorTextUuid = useIdWithFallback(errorTextIdProp);
+	useEffect(() => {
+		setTextareaInput(defaultValue || "");
+	}, [defaultValue]);
+	const resizeHeight = (target) => {
+		const textareaLineHeight = 28;
+		const previousRows = target.rows;
+		target.rows = minRows;
+		const currentRows = Math.floor((target.scrollHeight - 16) / textareaLineHeight);
+		if (currentRows === previousRows) target.rows = currentRows;
+		if (currentRows >= maxRows) {
+			target.rows = maxRows;
+			target.scrollTop = target.scrollHeight;
+		}
+		if (currentRows < maxRows) setRows(currentRows);
+		else setRows(maxRows);
+	};
+	const onDark = onColor === FormOnColor.ondark;
+	const onBlueberry = onColor === FormOnColor.onblueberry;
+	const maxCharactersExceeded = !!maxCharacters && textareaInput.toString().length > maxCharacters;
+	const onError = onColor === FormOnColor.oninvalid || !!errorText || !!error || maxCharactersExceeded;
+	const textareaWrapperClass = classNames(styles.textarea, { [styles["textarea--gutterBottom"]]: gutterBottom });
+	const contentWrapperClass = classNames(styles["input-container"], {
+		[styles["input-container--transparent"]]: transparent,
+		[styles["input-container--on-blueberry"]]: onBlueberry,
+		[styles["input-container--on-dark"]]: onDark,
+		[styles["input-container--invalid"]]: onError,
+		[styles["input-container--disabled"]]: props.disabled
+	});
+	const textareaClass = classNames(styles["input-container__input"], { [styles[`input-container__input--disabled`]]: props.disabled });
+	useEffect(() => {
+		if (value) setTextareaInput(value);
+		if (grow && referanse.current?.children && referanse.current?.children[0]) {
+			const textarea = referanse.current?.children[0];
+			resizeHeight(textarea);
+		}
+	}, [value]);
+	const onChangeHandler = (e) => {
+		setTextareaInput(e.target.value);
+		if (onChange) onChange(e);
+		if (grow) resizeHeight(e.target);
+	};
+	const maxWidth = width ? getTextareaMaxWidth(width) : void 0;
+	return /* @__PURE__ */ jsx(ErrorWrapper_default, {
+		className: errorWrapperClassName,
+		errorText,
+		errorTextId: errorTextUuid,
+		children: /* @__PURE__ */ jsxs("div", {
+			"data-testid": testId,
+			"data-analyticsid": AnalyticsId.Textarea,
+			className: textareaWrapperClass,
+			children: [
+				renderLabel(label, textareaId, onColor),
+				/* @__PURE__ */ jsx("div", {
+					className: contentWrapperClass,
+					ref: referanse,
+					style: { maxWidth },
+					children: /* @__PURE__ */ jsx("textarea", {
+						...rest,
+						rows,
+						defaultValue,
+						id: textareaId,
+						className: textareaClass,
+						ref,
+						"aria-describedby": getAriaDescribedBy(props, errorTextUuid),
+						"aria-invalid": !!onError,
+						autoFocus,
+						disabled,
+						name,
+						autoComplete: autoComplete ? autoComplete : void 0,
+						placeholder,
+						readOnly,
+						required,
+						onChange: onChangeHandler,
+						value
+					})
+				}),
+				maxCharacters && /* @__PURE__ */ jsx(MaxCharacters_default, {
+					maxCharacters,
+					length: textareaInput.toString().length,
+					maxText,
+					onColor,
+					maxWidth
+				})
+			]
+		})
+	});
+});
+Textarea.displayName = "Textarea";
+var Textarea_default$1 = Textarea;
+export { Textarea_default$1 as t };
+
+//# sourceMappingURL=Textarea.js.map

package/lib/Textarea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Textarea.js","names":[],"sources":["../src/components/Textarea/Textarea.tsx","../src/components/Textarea/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\n\nimport cn from 'classnames';\n\nimport { AnalyticsId, AVERAGE_CHARACTER_WIDTH_PX, FormOnColor } from '../../constants';\nimport { useIdWithFallback } from '../../hooks/useIdWithFallback';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper, { ErrorWrapperClassNameProps } from '../ErrorWrapper';\nimport { renderLabel } from '../Label';\nimport MaxCharacters from '../MaxCharacters/MaxCharacters';\n\nimport styles from './styles.module.scss';\n\nexport interface TextareaProps\n  extends 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  /** The text is displayed in the end of the text-counter */\n  maxText?: string;\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}\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.forwardRef((props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) => {\n  const {\n    maxCharacters,\n    maxText,\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    ...rest\n  } = props;\n\n  const [rows, setRows] = useState(minRows);\n  const [textareaInput, setTextareaInput] = useState(value || defaultValue || '');\n  const referanse = useRef<HTMLDivElement>(null);\n  const errorTextUuid = useIdWithFallback(errorTextIdProp);\n\n  useEffect(() => {\n    setTextareaInput(defaultValue || '');\n  }, [defaultValue]);\n\n  const resizeHeight = (target: HTMLTextAreaElement): void => {\n    const textareaLineHeight = 28;\n\n    const previousRows = target.rows;\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 === previousRows) {\n      target.rows = currentRows;\n    }\n\n    if (currentRows >= maxRows) {\n      target.rows = maxRows;\n      target.scrollTop = target.scrollHeight;\n    }\n\n    if (currentRows < maxRows) {\n      setRows(currentRows);\n    } else {\n      setRows(maxRows);\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  useEffect(() => {\n    if (value) setTextareaInput(value);\n\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, textareaId, onColor as FormOnColor)}\n        <div className={contentWrapperClass} ref={referanse} style={{ maxWidth }}>\n          <textarea\n            {...rest}\n            rows={rows}\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={maxText}\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

@@ -0,0 +1,38 @@
+import { n as AnalyticsId } from "./constants2.js";
+import React from "react";
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+import titleStyles from "./components/Title/styles.module.scss";
+const Title = React.forwardRef(function TitleForwardedRef(props, ref) {
+	const { id, children, className, htmlMarkup = "h1", appearance = "title1", margin = 0, testId } = props;
+	return /* @__PURE__ */ jsx(htmlMarkup, {
+		id,
+		className: classNames(titleStyles.title, {
+			[titleStyles["title--feature"]]: appearance === "titleFeature",
+			[titleStyles["title--title1"]]: appearance === "title1",
+			[titleStyles["title--title2"]]: appearance === "title2",
+			[titleStyles["title--title3"]]: appearance === "title3",
+			[titleStyles["title--title4"]]: appearance === "title4",
+			[titleStyles["title--title5"]]: appearance === "title5",
+			[titleStyles["title--title6"]]: appearance === "title6"
+		}, className),
+		style: instanceOfTitleMargin(margin) ? {
+			marginTop: `${margin.marginTop}rem`,
+			marginBottom: `${margin.marginBottom}rem`
+		} : {
+			marginTop: `${margin}rem`,
+			marginBottom: `${margin}rem`
+		},
+		ref,
+		"data-testid": testId,
+		"data-analyticsid": AnalyticsId.Title,
+		children
+	});
+});
+const instanceOfTitleMargin = (margin) => {
+	return Object.prototype.hasOwnProperty.call(margin, "marginTop") && Object.prototype.hasOwnProperty.call(margin, "marginBottom");
+};
+var Title_default = Title;
+export { Title_default as n, instanceOfTitleMargin as r, Title as t };
+
+//# sourceMappingURL=Title.js.map

package/lib/Title.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Title.js","names":[],"sources":["../src/components/Title/Title.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\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 data-testid attribute. */\n  testId?: string;\n}\n\nexport const Title = React.forwardRef(function TitleForwardedRef(props: TitleProps, ref: React.ForwardedRef<HTMLHeadingElement>) {\n  const { id, children, className, htmlMarkup = 'h1', appearance = 'title1', margin = 0, testId } = 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 id={id} className={titleClasses} style={inlineStyle} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Title}>\n      {children}\n    </CustomTag>\n  );\n});\n\nexport interface TitleMargin {\n  marginTop: number;\n  marginBottom: number;\n}\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\nexport default Title;\n"],"mappings":";;;;;AA2BA,MAAa,QAAQ,MAAM,WAAW,SAAS,kBAAkB,OAAmB,KAA6C;CAC/H,MAAM,EAAE,IAAI,UAAU,WAAW,aAAa,MAAM,aAAa,UAAU,SAAS,GAAG,WAAW;AAoBlG,QACE,oBAPgB,YAOf;EAAc;EAAI,WApBA,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,UACD;EAQ6C,OAL1B,sBAAsB,OAAO,GAC7C;GAAE,WAAW,GAAG,OAAO,UAAU;GAAM,cAAc,GAAG,OAAO,aAAa;GAAM,GAClF;GAAE,WAAW,GAAG,OAAO;GAAM,cAAc,GAAG,OAAO;GAAM;EAGQ;EAAK,eAAa;EAAQ,oBAAkB,YAAY;EAC1H;GACS;EAEd;AAOF,MAAa,yBAAyB,WAA2C;AAC/E,QAAO,OAAO,UAAU,eAAe,KAAK,QAAQ,YAAY,IAAI,OAAO,UAAU,eAAe,KAAK,QAAQ,eAAe;;AAGlI,IAAA,gBAAe"}

package/lib/Toast.js

@@ -0,0 +1,46 @@
+import { a as IconSize } from "./constants2.js";
+import { t as Icon_default } from "./Icon.js";
+import { t as CheckFill_default } from "./CheckFill.js";
+import { t as useIsMobileBreakpoint } from "./useIsMobileBreakpoint.js";
+import { t as Close_default } from "./Close.js";
+import React from "react";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./components/Toast/styles.module.scss";
+var Toast = ({ testId, title, message, onClose }) => {
+	const isMobile = useIsMobileBreakpoint();
+	const handleClose = () => {
+		if (onClose) onClose();
+	};
+	return /* @__PURE__ */ jsxs("output", {
+		className: styles["toast"],
+		"data-testid": testId,
+		children: [
+			/* @__PURE__ */ jsx(Icon_default, {
+				size: isMobile ? IconSize.XSmall : IconSize.Small,
+				svgIcon: CheckFill_default,
+				className: classNames(styles["toast__icon"], styles["toast__icon--check"])
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: styles["toast__text-container"],
+				children: [/* @__PURE__ */ jsx("span", {
+					className: styles["toast__title"],
+					children: title
+				}), message && /* @__PURE__ */ jsx("span", {
+					className: styles["toast__description"],
+					children: message
+				})]
+			}),
+			/* @__PURE__ */ jsx(Close_default, {
+				onClick: handleClose,
+				color: "black",
+				className: classNames(styles["toast__icon"], styles["toast__icon--close"]),
+				testId: `${testId}-close`
+			})
+		]
+	});
+};
+var Toast_default = Toast;
+export { Toast_default as t };
+
+//# sourceMappingURL=Toast.js.map

package/lib/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.js","names":["Toast: React.FC<ToastProps>"],"sources":["../src/components/Toast/Toast.tsx"],"sourcesContent":["import React from 'react';\n\nimport 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":";;;;;;;;;AAsBA,IAAMA,SAA+B,EAAE,QAAQ,OAAO,SAAS,cAAc;CAC3E,MAAM,WAAW,uBAAuB;CAExC,MAAM,oBAA0B;AAC9B,MAAI,QACF,UAAS;;AAIb,QACE,qBAAC,UAAA;EAAO,WAAW,OAAO;EAAU,eAAa;;GAC/C,oBAAC,cAAA;IACC,MAAM,WAAW,SAAS,SAAS,SAAS;IAC5C,SAAS;IACT,WAAW,WAAW,OAAO,gBAAgB,OAAO,sBAAsB;KAC1E;GACF,qBAAC,OAAA;IAAI,WAAW,OAAO;eACrB,oBAAC,QAAA;KAAK,WAAW,OAAO;eAAkB;MAAa,EACtD,WAAW,oBAAC,QAAA;KAAK,WAAW,OAAO;eAAwB;MAAe,CAAA;KACvE;GACN,oBAAC,eAAA;IACC,SAAS;IACT,OAAM;IACN,WAAW,WAAW,OAAO,gBAAgB,OAAO,sBAAsB;IAC1E,QAAQ,GAAG,OAAO;KAClB;;GACK;;AAIb,IAAA,gBAAe"}

package/lib/components/ArticleTeaser/index.js

@@ -0,0 +1,51 @@
+import { n as AnalyticsId, s as LanguageLocales } from "../../constants2.js";
+import { r as useLanguage } from "../../language.js";
+import React from "react";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./styles.module.scss";
+var HN_Designsystem_ArticleTeaser_en_GB_default = {
+	expandButtonClose: "Show more",
+	expandButtonOpen: "Show less"
+};
+var HN_Designsystem_ArticleTeaser_nb_NO_default = {
+	expandButtonClose: "Vis mer",
+	expandButtonOpen: "Vis mindre"
+};
+const getResources = (language) => {
+	switch (language) {
+		case LanguageLocales.ENGLISH: return HN_Designsystem_ArticleTeaser_en_GB_default;
+		case LanguageLocales.NORWEGIAN:
+		default: return HN_Designsystem_ArticleTeaser_nb_NO_default;
+	}
+};
+var ArticleTeaser = (props) => {
+	const { onExpand, children, contentId, expanded, htmlMarkup = "div", resources, testId } = props;
+	const WrapperTag = htmlMarkup;
+	const { language } = useLanguage(LanguageLocales.NORWEGIAN);
+	const mergedResources = {
+		...getResources(language),
+		...resources
+	};
+	return /* @__PURE__ */ jsxs(WrapperTag, {
+		className: classNames(styles.articleteaser),
+		"data-testid": testId,
+		"data-analyticsid": AnalyticsId.ArticleTeaser,
+		children: [/* @__PURE__ */ jsx("div", {
+			className: classNames(styles["articleteaser__content"], { [styles["articleteaser__content--collapsed"]]: !expanded }),
+			style: { maxHeight: expanded ? "none" : props.heightCollapsed },
+			children
+		}), /* @__PURE__ */ jsx("button", {
+			type: "button",
+			className: classNames(styles["articleteaser__button"], { [styles["articleteaser__button--expanded"]]: expanded }),
+			onClick: onExpand,
+			"aria-expanded": expanded,
+			"aria-controls": contentId,
+			children: expanded ? mergedResources.expandButtonOpen : mergedResources.expandButtonClose
+		})]
+	});
+};
+var ArticleTeaser_default = ArticleTeaser;
+export { ArticleTeaser_default as default };
+
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["ArticleTeaser: React.FC<ArticleTeaserProps>","mergedResources: HNDesignsystemArticleTeaser"],"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 { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.ArticleTeaser.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.ArticleTeaser.nb-NO.json';\nimport { HNDesignsystemArticleTeaser } from '../../resources/Resources';\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 React from 'react';\n\nimport classNames from 'classnames';\n\nimport { getResources } from './resourceHelper';\nimport { AnalyticsId, LanguageLocales } from '../../constants';\nimport { HNDesignsystemArticleTeaser } from '../../resources/Resources';\nimport { useLanguage } from '../../utils/language';\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":";;;;;;;;;;;;;;AEKA,MAAa,gBAAgB,aAA2D;AACtF,SAAQ,UAAR;EACE,KAAK,gBAAgB,QACnB,QAAO;EACT,KAAK,gBAAgB;EACrB,QACE,QAAO;;;ACqBb,IAAMA,iBAA8C,UAAS;CAC3D,MAAM,EAAE,UAAU,UAAU,WAAW,UAAU,aAAa,OAAO,WAAW,WAAW;CAC3F,MAAM,aAAa;CAEnB,MAAM,EAAE,aAAa,YAA6B,gBAAgB,UAAU;CAG5E,MAAMC,kBAA+C;EACnD,GAHuB,aAAa,SAAS;EAI7C,GAAG;EACJ;AAED,QACE,qBAAC,YAAA;EAAW,WAAW,WAAW,OAAO,cAAc;EAAE,eAAa;EAAQ,oBAAkB,YAAY;aAC1G,oBAAC,OAAA;GACC,WAAW,WAAW,OAAO,2BAA2B,GACrD,OAAO,uCAAuC,CAAC,UACjD,CAAC;GACF,OAAO,EACL,WAAW,WAAW,SAAS,MAAM,iBACtC;GAEA;IACG,EACN,oBAAC,UAAA;GACC,MAAK;GACL,WAAW,WAAW,OAAO,0BAA0B,GACpD,OAAO,qCAAqC,UAC9C,CAAC;GACF,SAAS;GACT,iBAAe;GACf,iBAAe;aAEd,WAAW,gBAAgB,mBAAmB,gBAAgB;IACxD,CAAA;GACE;;ACjEjB,IAAA,wBDqEe"}