@helsenorge/designsystem-react 12.12.2 → 12.12.3

package/lib/components/ErrorWrapper/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ErrorWrapper } from './ErrorWrapper';
+export * from './ErrorWrapper';
+export default ErrorWrapper;

package/lib/components/ErrorWrapper/index.js

@@ -0,0 +1,6 @@
+import { E as ErrorWrapper } from "../../ErrorWrapper.js";
+export {
+  ErrorWrapper,
+  ErrorWrapper as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/lib/components/Expander/Expander.d.ts

@@ -0,0 +1,40 @@
+import { default as React } from 'react';
+import { PaletteNames } from '../../theme/palette';
+import { SvgIcon } from '../Icon';
+import { IconName } from '../Icons/IconNames';
+export declare enum ExpanderSize {
+    small = "small",
+    large = "large"
+}
+export type ExpanderColors = Extract<PaletteNames, 'banana' | 'blueberry' | 'cherry' | 'kiwi' | 'neutral' | 'plum' | 'white'>;
+export interface ExpanderProps {
+    buttonId?: string;
+    /** Sets the trigger title */
+    title: string;
+    /** Sets the expanded content */
+    children?: React.ReactNode;
+    /** Sets classnames on the content area */
+    contentClassNames?: string;
+    /** Sets the size of the expander. Default: ExpanderSize.small */
+    size?: ExpanderSize;
+    /** Sets the background of the expander. Requires size=ExpanderSize.large. */
+    color?: ExpanderColors;
+    /** Adds an icon to the expander trigger. Requires size=ExpanderSize.large. */
+    svgIcon?: SvgIcon | IconName;
+    /** Opens or closes the expander */
+    expanded?: boolean;
+    /** Removes border to the left of the content. Requires size=ExpanderSize.small. */
+    noNestedLine?: boolean;
+    /** Stick expander trigger to top of screen while scrolling down */
+    sticky?: boolean;
+    /** Called when expander is open/closed. */
+    onExpand?: (isExpanded: boolean) => void;
+    /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */
+    renderChildrenWhenClosed?: boolean;
+    /** Sets the data-testid attribute on the expander button. */
+    testId?: string;
+    /** Overrides the default z-index of the expander header */
+    zIndex?: number;
+}
+declare const Expander: React.FC<ExpanderProps>;
+export default Expander;

package/lib/components/Expander/Expander.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/Expander/index.d.ts

@@ -0,0 +1,3 @@
+import { default as Expander } from './Expander';
+export * from './Expander';
+export default Expander;

package/lib/components/Expander/index.js

@@ -0,0 +1,7 @@
+import { E as Expander } from "../../Expander.js";
+import { a } from "../../Expander.js";
+export {
+  a as ExpanderSize,
+  Expander as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/lib/components/ExpanderHierarchy/Expander.d.ts

@@ -0,0 +1,19 @@
+import { default as React } from 'react';
+import { ExpanderHierarchyCommonProps } from './ExpanderHierarchy';
+export interface ExpanderProps extends ExpanderHierarchyCommonProps {
+    /** Sets the trigger title */
+    title: string;
+    /** Opens or closes the expander */
+    expanded?: boolean;
+    /** Called when expander is open/closed. */
+    onExpand?: (isExpanded: boolean) => void;
+    /** Sets the expanded content */
+    children?: React.ReactNode;
+    /** Sets the data-testid attribute on the expander button. */
+    testId?: string;
+    /** Adds custom classes to the element. */
+    className?: string;
+}
+export type ExpanderType = React.FC<ExpanderProps>;
+declare const Expander: ExpanderType;
+export default Expander;

package/lib/components/ExpanderHierarchy/ExpanderButton.d.ts

@@ -0,0 +1,10 @@
+import { default as React } from 'react';
+import { ExpanderHierarchyCommonProps } from '../ExpanderHierarchy';
+interface ExpanderButtonProps extends ExpanderHierarchyCommonProps {
+    expanded: boolean;
+    onExpand?: (isExpanded: boolean) => void;
+    children: string;
+    testId?: string;
+}
+declare const ExpanderButton: React.FC<ExpanderButtonProps>;
+export default ExpanderButton;

package/lib/components/ExpanderHierarchy/ExpanderHierarchy.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+import { ExpanderType } from './Expander';
+import { HeadingTags } from './utils';
+export interface ExpanderHierarchyCommonProps {
+    /** Changes the underlying element of the expander title. Default: h2. */
+    htmlMarkup?: HeadingTags;
+    /** Expand all children when printing. */
+    print?: boolean;
+    /** Expander nesting level. Should not be set manually. */
+    level?: number;
+}
+export interface ExpanderHierarchyProps extends ExpanderHierarchyCommonProps {
+    children: React.ReactNode;
+    /** Sets the data-testid attribute on the expander list. */
+    testId?: string;
+}
+export interface ExpanderHierarchyCompound extends React.FC<ExpanderHierarchyProps> {
+    Expander: ExpanderType;
+}
+declare const ExpanderHierarchy: ExpanderHierarchyCompound;
+export default ExpanderHierarchy;

package/lib/components/ExpanderHierarchy/ExpanderHierarchy.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/ExpanderHierarchy/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ExpanderHierarchy } from './ExpanderHierarchy';
+export * from './ExpanderHierarchy';
+export default ExpanderHierarchy;

package/lib/components/ExpanderHierarchy/index.js

@@ -0,0 +1,115 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React__default from "react";
+import classNames from "classnames";
+import { AnalyticsId, IconSize } from "../../constants.js";
+import { useExpand } from "../../hooks/useExpand.js";
+import { useHover } from "../../hooks/useHover.js";
+import { I as Icon } from "../../Icon.js";
+import ChevronDown from "../Icons/ChevronDown.js";
+import ChevronUp from "../Icons/ChevronUp.js";
+import styles from "./expander.module.scss";
+import { isComponent } from "../../utils/component.js";
+import styles$1 from "./styles.module.scss";
+const ExpanderButton = ({ htmlMarkup = "h2", level = 1, print, expanded, onExpand, children, testId }) => {
+  const { hoverRef, isHovered } = useHover();
+  const [isExpanded, setIsExpanded] = useExpand(expanded, onExpand);
+  const handleClick = () => {
+    setIsExpanded(!isExpanded);
+  };
+  const CustomTag = htmlMarkup;
+  const buttonClasses = classNames(
+    styles.expander__button,
+    level > 1 && styles[`expander__button--2-and-lower`],
+    print && styles["expander__button--print"]
+  );
+  const titleClasses = classNames(
+    styles.expander__title,
+    (level === 1 || level === 2 || level === 3) && styles[`expander__title--${level}`],
+    level > 3 && styles[`expander__title--4-and-lower`],
+    isExpanded && styles["expander__title--expanded"],
+    print && styles["expander__title--print"]
+  );
+  const iconClasses = classNames(
+    styles.expander__icon,
+    level > 1 && styles[`expander__icon--2-and-lower`],
+    level > 2 && styles[`expander__icon--3-and-lower`]
+  );
+  return /* @__PURE__ */ jsx(CustomTag, { className: titleClasses, children: /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      className: buttonClasses,
+      "aria-expanded": isExpanded,
+      ref: hoverRef,
+      "data-testid": testId,
+      "data-analyticsid": AnalyticsId.ExpanderHierarchyExpander,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(Icon, { svgIcon: isExpanded ? ChevronUp : ChevronDown, isHovered, className: iconClasses, size: IconSize.XSmall })
+      ]
+    }
+  ) });
+};
+const getHeadingTag = (htmlMarkup) => {
+  switch (htmlMarkup) {
+    case "h2":
+      return "h3";
+    case "h3":
+      return "h4";
+    case "h4":
+      return "h5";
+    case "h5":
+      return "h6";
+    case "h6":
+      return "h6";
+    default:
+      return "h2";
+  }
+};
+const Expander = ({
+  title,
+  htmlMarkup = "h2",
+  level = 1,
+  print,
+  expanded = false,
+  onExpand,
+  children,
+  testId,
+  className
+}) => {
+  const contentClasses = classNames(
+    styles.expander__content,
+    (level === 1 || level === 2) && styles[`expander__content--${level}`],
+    level > 2 && styles[`expander__content--3-and-lower`]
+  );
+  return /* @__PURE__ */ jsxs("li", { className: classNames(styles.expander, className), children: [
+    /* @__PURE__ */ jsx(ExpanderButton, { htmlMarkup, level, print, expanded, onExpand, testId, children: title }),
+    /* @__PURE__ */ jsx("div", { className: contentClasses, children: React__default.Children.map(
+      children,
+      (child) => isComponent(child, ExpanderHierarchy) ? React__default.cloneElement(child, { htmlMarkup: getHeadingTag(htmlMarkup), level: level + 1, print }) : child
+    ) })
+  ] });
+};
+const ExpanderHierarchy = ({
+  htmlMarkup = "h2",
+  level = 1,
+  print,
+  children,
+  testId
+}) => {
+  const listClasses = classNames(
+    styles$1.expanderhierarchy,
+    level === 2 && styles$1[`expanderhierarchy--${level}`],
+    level > 2 && styles$1[`expanderhierarchy--3-and-lower`]
+  );
+  return /* @__PURE__ */ jsx("ul", { className: listClasses, "data-testid": testId, "data-analyticsid": AnalyticsId.ExpanderHierarchy, children: React__default.Children.map(
+    children,
+    (child) => isComponent(child, Expander) ? React__default.cloneElement(child, { htmlMarkup, level, print }) : child
+  ) });
+};
+ExpanderHierarchy.Expander = Expander;
+export {
+  ExpanderHierarchy as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/ExpanderHierarchy/ExpanderButton.tsx","../../../src/components/ExpanderHierarchy/utils.ts","../../../src/components/ExpanderHierarchy/Expander.tsx","../../../src/components/ExpanderHierarchy/ExpanderHierarchy.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { useExpand } from '../../hooks/useExpand';\nimport { useHover } from '../../hooks/useHover';\nimport { ExpanderHierarchyCommonProps } from '../ExpanderHierarchy';\nimport Icon, { IconSize } from '../Icon';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\n\nimport styles from './expander.module.scss';\n\ninterface ExpanderButtonProps extends ExpanderHierarchyCommonProps {\n  expanded: boolean;\n  onExpand?: (isExpanded: boolean) => void;\n  children: string;\n  testId?: string;\n}\n\nconst ExpanderButton: React.FC<ExpanderButtonProps> = ({ htmlMarkup = 'h2', level = 1, print, expanded, onExpand, children, testId }) => {\n  const { hoverRef, isHovered } = useHover<HTMLButtonElement>();\n  const [isExpanded, setIsExpanded] = useExpand(expanded, onExpand);\n\n  const handleClick = (): void => {\n    setIsExpanded(!isExpanded);\n  };\n\n  const CustomTag = htmlMarkup;\n\n  const buttonClasses = classNames(\n    styles.expander__button,\n    level > 1 && styles[`expander__button--2-and-lower`],\n    print && styles['expander__button--print']\n  );\n\n  const titleClasses = classNames(\n    styles.expander__title,\n    (level === 1 || level === 2 || level === 3) && styles[`expander__title--${level}`],\n    level > 3 && styles[`expander__title--4-and-lower`],\n    isExpanded && styles['expander__title--expanded'],\n    print && styles['expander__title--print']\n  );\n\n  const iconClasses = classNames(\n    styles.expander__icon,\n    level > 1 && styles[`expander__icon--2-and-lower`],\n    level > 2 && styles[`expander__icon--3-and-lower`]\n  );\n\n  return (\n    <CustomTag className={titleClasses}>\n      <button\n        type=\"button\"\n        onClick={handleClick}\n        className={buttonClasses}\n        aria-expanded={isExpanded}\n        ref={hoverRef}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.ExpanderHierarchyExpander}\n      >\n        {children}\n        <Icon svgIcon={isExpanded ? ChevronUp : ChevronDown} isHovered={isHovered} className={iconClasses} size={IconSize.XSmall} />\n      </button>\n    </CustomTag>\n  );\n};\n\nexport default ExpanderButton;\n","export type HeadingTags = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n\nexport const getHeadingTag = (htmlMarkup?: HeadingTags): HeadingTags => {\n  switch (htmlMarkup) {\n    case 'h2':\n      return 'h3';\n    case 'h3':\n      return 'h4';\n    case 'h4':\n      return 'h5';\n    case 'h5':\n      return 'h6';\n    case 'h6':\n      return 'h6';\n    default:\n      return 'h2';\n  }\n};\n","import React from 'react';\n\nimport classNames from 'classnames';\n\nimport ExpanderButton from './ExpanderButton';\nimport ExpanderHierarchy, { ExpanderHierarchyCommonProps, ExpanderHierarchyProps } from './ExpanderHierarchy';\nimport { getHeadingTag } from './utils';\nimport { isComponent } from '../../utils/component';\n\nimport styles from './expander.module.scss';\n\nexport interface ExpanderProps extends ExpanderHierarchyCommonProps {\n  /** Sets the trigger title */\n  title: string;\n  /** Opens or closes the expander */\n  expanded?: boolean;\n  /** Called when expander is open/closed. */\n  onExpand?: (isExpanded: boolean) => void;\n  /** Sets the expanded content */\n  children?: React.ReactNode;\n  /** Sets the data-testid attribute on the expander button. */\n  testId?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n}\n\nexport type ExpanderType = React.FC<ExpanderProps>;\n\nconst Expander: ExpanderType = ({\n  title,\n  htmlMarkup = 'h2',\n  level = 1,\n  print,\n  expanded = false,\n  onExpand,\n  children,\n  testId,\n  className,\n}: ExpanderProps) => {\n  const contentClasses = classNames(\n    styles.expander__content,\n    (level === 1 || level === 2) && styles[`expander__content--${level}`],\n    level > 2 && styles[`expander__content--3-and-lower`]\n  );\n\n  return (\n    <li className={classNames(styles.expander, className)}>\n      <ExpanderButton htmlMarkup={htmlMarkup} level={level} print={print} expanded={expanded} onExpand={onExpand} testId={testId}>\n        {title}\n      </ExpanderButton>\n      <div className={contentClasses}>\n        {React.Children.map(children, child =>\n          isComponent<ExpanderHierarchyProps>(child, ExpanderHierarchy)\n            ? React.cloneElement(child, { htmlMarkup: getHeadingTag(htmlMarkup), level: level + 1, print })\n            : child\n        )}\n      </div>\n    </li>\n  );\n};\n\nexport default Expander;\n","import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Expander, { ExpanderProps, ExpanderType } from './Expander';\nimport { HeadingTags } from './utils';\nimport { AnalyticsId } from '../../constants';\nimport { isComponent } from '../../utils/component';\n\nimport styles from './styles.module.scss';\n\nexport interface ExpanderHierarchyCommonProps {\n  /** Changes the underlying element of the expander title. Default: h2. */\n  htmlMarkup?: HeadingTags;\n  /** Expand all children when printing. */\n  print?: boolean;\n  /** Expander nesting level. Should not be set manually. */\n  level?: number;\n}\n\nexport interface ExpanderHierarchyProps extends ExpanderHierarchyCommonProps {\n  children: React.ReactNode;\n  /** Sets the data-testid attribute on the expander list. */\n  testId?: string;\n}\n\nexport interface ExpanderHierarchyCompound extends React.FC<ExpanderHierarchyProps> {\n  Expander: ExpanderType;\n}\n\nconst ExpanderHierarchy: ExpanderHierarchyCompound = ({\n  htmlMarkup = 'h2',\n  level = 1,\n  print,\n  children,\n  testId,\n}: ExpanderHierarchyProps) => {\n  const listClasses = classNames(\n    styles.expanderhierarchy,\n    level === 2 && styles[`expanderhierarchy--${level}`],\n    level > 2 && styles[`expanderhierarchy--3-and-lower`]\n  );\n\n  return (\n    <ul className={listClasses} data-testid={testId} data-analyticsid={AnalyticsId.ExpanderHierarchy}>\n      {React.Children.map(children, child =>\n        isComponent<ExpanderProps>(child, Expander) ? React.cloneElement(child, { htmlMarkup, level, print }) : child\n      )}\n    </ul>\n  );\n};\n\nExpanderHierarchy.Expander = Expander;\n\nexport default ExpanderHierarchy;\n"],"names":["React","styles"],"mappings":"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"}

package/lib/components/ExpanderHierarchy/utils.d.ts

@@ -0,0 +1,2 @@
+export type HeadingTags = 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
+export declare const getHeadingTag: (htmlMarkup?: HeadingTags) => HeadingTags;

package/lib/components/ExpanderList/ExpanderList.d.ts

@@ -0,0 +1,70 @@
+import { default as React } from 'react';
+import { PaletteNames } from '../../theme/palette';
+import { ElementHeaderType } from '../ElementHeader/ElementHeader';
+import { ListEditModeItemProps } from '../ListEditMode';
+import { TitleTags } from '../Title';
+export type ExpanderListColors = Extract<PaletteNames, 'white' | 'blueberry' | 'cherry' | 'neutral'>;
+export interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {
+    ElementHeader?: ElementHeaderType;
+}
+export interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {
+    Expander: ExpanderType;
+}
+export type ExpanderListVariant = 'line' | 'outline' | 'fill' | 'fill-negative';
+export type ExpanderListStatus = 'none' | 'new';
+interface ExpanderListProps {
+    /** Toggles accordion functionality for the expanders. */
+    accordion?: boolean;
+    /** Items in the ExpanderList */
+    children: React.ReactNode;
+    /** Toggles padding of child elements */
+    childPadding?: boolean;
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Changes the colors of the list. */
+    color?: ExpanderListColors;
+    /** Changes the font size. */
+    large?: boolean;
+    /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */
+    renderChildrenWhenClosed?: boolean;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+    /** Sets visual priority */
+    variant?: ExpanderListVariant;
+    /** Overrides the default z-index of the expander header */
+    zIndex?: number;
+    /** Highlights text in title and content. Used for search results */
+    highlightText?: string;
+    /**
+     * @experimental This prop is experimental and may change in the future.
+     * Enables ListEditMode
+     */
+    editMode?: boolean;
+}
+type Modify<T, R> = Omit<T, keyof R> & R;
+type ExpanderProps = Modify<React.HTMLAttributes<HTMLButtonElement>, {
+    id?: string;
+    title: JSX.Element | string;
+    /** Changes the underlying element of the title. Default: span*/
+    titleHtmlMarkup?: TitleTags;
+    children: React.ReactNode;
+    className?: string;
+    color?: ExpanderListColors;
+    icon?: React.ReactElement;
+    padding?: boolean;
+    expanded?: boolean;
+    large?: boolean;
+    testId?: string;
+    handleExpanderClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    /** Called when expander is open/closed. */
+    onExpand?: (isExpanded: boolean) => void;
+    /** Overrides the default z-index of the expander header */
+    zIndex?: number;
+    /** Highlights text in title and content. Override if different from list. */
+    highlightText?: string;
+    /** Displays a status on the left side: default none */
+    status?: ExpanderListStatus;
+}> & Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'variant'> & ListEditModeItemProps;
+export declare const Expander: ExpanderType;
+export declare const ExpanderList: ExpanderListCompound;
+export default ExpanderList;

package/lib/components/ExpanderList/index.d.ts

@@ -0,0 +1,3 @@
+import { default as ExpanderList } from './ExpanderList';
+export * from './ExpanderList';
+export default ExpanderList;

package/lib/components/ExpanderList/index.js

@@ -0,0 +1,219 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React__default, { useState, useEffect, useRef } from "react";
+import classNames from "classnames";
+import { AnalyticsId } from "../../constants.js";
+import { useExpand } from "../../hooks/useExpand.js";
+import { usePseudoClasses } from "../../hooks/usePseudoClasses.js";
+import { useUuid } from "../../hooks/useUuid.js";
+import { mergeRefs } from "../../utils/refs.js";
+import { isElementInViewport } from "../../utils/viewport.js";
+import { r as renderElementHeader } from "../../ElementHeader.js";
+import { H as Highlighter } from "../../Highlighter.js";
+import ChevronDown from "../Icons/ChevronDown.js";
+import ChevronUp from "../Icons/ChevronUp.js";
+import { l as listEditModeWrapperClassnames, L as ListEditModeItem } from "../../ListEditMode.js";
+import expanderListStyles from "./styles.module.scss";
+const Expander = React__default.forwardRef((props, ref) => {
+  const {
+    id,
+    children,
+    padding = true,
+    color = "neutral",
+    className = "",
+    icon,
+    large = false,
+    title,
+    titleHtmlMarkup = "span",
+    expanded = false,
+    testId,
+    handleExpanderClick,
+    onExpand,
+    renderChildrenWhenClosed,
+    variant = "line",
+    zIndex = 0,
+    highlightText,
+    status = "none",
+    editMode = false
+  } = props;
+  const [isExpanded] = useExpand(expanded, onExpand);
+  const expanderRef = useRef(null);
+  const triggerRef = useRef(null);
+  const { isHovered, isFocused } = usePseudoClasses(triggerRef);
+  const isFill = variant === "fill";
+  const isFillNegative = variant === "fill-negative";
+  const isOutline = variant === "outline";
+  const isLine = variant === "line";
+  const itemClasses = classNames(className, expanderListStyles["expander-list__item"], {
+    [expanderListStyles[`expander-list__item--fill`]]: isFill,
+    [expanderListStyles[`expander-list__item--fill--${color}`]]: isFill,
+    [expanderListStyles[`expander-list__item--fill-negative`]]: isFillNegative,
+    [expanderListStyles[`expander-list__item--fill-negative--${color}`]]: isFillNegative,
+    [expanderListStyles["expander-list__item--outline"]]: isOutline,
+    [expanderListStyles[`expander-list__item--outline--${color}`]]: isOutline,
+    [expanderListStyles["expander-list__item--line"]]: isLine,
+    [expanderListStyles[`expander-list__item--line--${color}`]]: isLine,
+    [expanderListStyles[`expander-list__item--new`]]: status === "new"
+  });
+  const expanderClasses = classNames(expanderListStyles["expander-list-link"], expanderListStyles[`expander-list-link--${color}`], {
+    [expanderListStyles[`expander-list-link--fill--${color}`]]: isFill,
+    [expanderListStyles[`expander-list-link--fill-negative`]]: isFillNegative,
+    [expanderListStyles[`expander-list-link--fill-negative--${color}`]]: isFillNegative,
+    [expanderListStyles["expander-list-link--outline"]]: isOutline,
+    [expanderListStyles[`expander-list-link--outline--${color}`]]: isOutline,
+    [expanderListStyles[`expander-list-link--line--${color}`]]: isLine,
+    [expanderListStyles["expander-list-link--open"]]: isExpanded,
+    [expanderListStyles["expander-list-link--large"]]: large,
+    [expanderListStyles[`expander-list-link--new`]]: status === "new"
+  });
+  const renderContent = () => {
+    if (!renderChildrenWhenClosed && !isExpanded) {
+      return null;
+    }
+    const mainContentClasses = classNames(expanderListStyles["expander-list-link__main-content"], {
+      [expanderListStyles["expander-list-link__main-content--expanded"]]: isExpanded,
+      [expanderListStyles["expander-list-link__main-content--padding"]]: padding,
+      [expanderListStyles[`expander-list-link__main-content--outline--${color}`]]: isOutline,
+      [expanderListStyles[`expander-list-link__main-content--new`]]: status === "new"
+    });
+    return /* @__PURE__ */ jsx("div", { className: mainContentClasses, "data-state": isExpanded ? "open" : "closed", children: /* @__PURE__ */ jsx(Highlighter, { searchText: highlightText, children }) });
+  };
+  const statusMarkerClasses = classNames(expanderListStyles["expander-list__item__status-marker"], {
+    [expanderListStyles["expander-list__item__status-marker--new"]]: status === "new"
+  });
+  return /* @__PURE__ */ jsxs("li", { className: itemClasses, ref: mergeRefs([ref, expanderRef]), children: [
+    status !== "none" && /* @__PURE__ */ jsx("div", { className: statusMarkerClasses }),
+    editMode ? /* @__PURE__ */ jsx("div", { id, "data-testid": testId, "data-analyticsid": AnalyticsId.ExpanderListExpander, className: expanderClasses, children: renderElementHeader(title, {
+      titleHtmlMarkup,
+      isHovered: false,
+      size: large ? "large" : "medium",
+      parentType: "expanderlist",
+      chevronIcon: void 0,
+      icon,
+      highlightText
+    }) }) : /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        id,
+        onClick: handleExpanderClick,
+        "data-testid": testId,
+        "data-analyticsid": AnalyticsId.ExpanderListExpander,
+        className: expanderClasses,
+        ref: triggerRef,
+        "aria-expanded": isExpanded,
+        style: {
+          zIndex: isFocused ? zIndex + 1 : zIndex
+        },
+        children: renderElementHeader(title, {
+          titleHtmlMarkup,
+          isHovered: isHovered || isFocused,
+          size: large ? "large" : "medium",
+          parentType: "expanderlist",
+          chevronIcon: isExpanded ? ChevronUp : ChevronDown,
+          icon,
+          highlightText
+        })
+      }
+    ),
+    !editMode && renderContent()
+  ] });
+});
+const isExpanderComponent = (element) => React__default.isValidElement(element) && element.type === Expander;
+const ExpanderList = React__default.forwardRef((props, ref) => {
+  const {
+    children,
+    childPadding = true,
+    large,
+    renderChildrenWhenClosed = false,
+    color = "white",
+    className = "",
+    accordion = false,
+    testId,
+    variant,
+    zIndex,
+    highlightText,
+    editMode = false
+  } = props;
+  const [activeExpander, setActiveExpander] = useState();
+  const [latestExpander, setLatestExpander] = useState();
+  const uuid = useUuid();
+  const expanderListClasses = classNames(expanderListStyles["expander-list"], className, {
+    [expanderListStyles[`expander-list--outline--${color}`]]: variant === "outline",
+    [expanderListStyles[`expander-list--fill`]]: variant === "fill" || variant === "fill-negative",
+    [listEditModeWrapperClassnames]: editMode
+  });
+  function handleExpanderClick(event, id) {
+    setActiveExpander((prevState) => accordion ? { [id]: !(prevState == null ? void 0 : prevState[id]) } : { ...prevState, [id]: !(prevState == null ? void 0 : prevState[id]) });
+    setLatestExpander(event.currentTarget);
+  }
+  const getExpanderId = (index) => `${uuid}-${index}`;
+  useEffect(() => {
+    if (accordion && latestExpander && !isElementInViewport(latestExpander)) {
+      latestExpander.scrollIntoView();
+    }
+  }, [accordion, latestExpander]);
+  useEffect(() => {
+    var _a;
+    const newActiveExpander = (_a = React__default.Children.map(children, (child) => {
+      if (isExpanderComponent(child)) {
+        return child;
+      }
+    })) == null ? void 0 : _a.reduce((acc, child, index) => {
+      if (typeof child.props.expanded !== "undefined") {
+        acc[getExpanderId(index)] = child.props.expanded;
+      }
+      return acc;
+    }, {});
+    setActiveExpander({ ...activeExpander, ...newActiveExpander });
+  }, [children]);
+  return /* @__PURE__ */ jsx("ul", { className: expanderListClasses, ref, "data-testid": testId, "data-analyticsid": AnalyticsId.ExpanderList, children: React__default.Children.map(children, (child, index) => {
+    if (isExpanderComponent(child)) {
+      const id = getExpanderId(index);
+      const expanded = activeExpander == null ? void 0 : activeExpander[id];
+      const highlightTextChild = child.props.highlightText || highlightText;
+      if (editMode) {
+        return /* @__PURE__ */ jsx(ListEditModeItem, { color, variant, onDelete: child.props.onDelete, children: React__default.cloneElement(child, {
+          id,
+          key: index,
+          expanded,
+          padding: childPadding,
+          color,
+          large,
+          "aria-expanded": false,
+          className: expanderListStyles["expander-list__item"],
+          renderChildrenWhenClosed: false,
+          variant,
+          zIndex,
+          highlightText: highlightTextChild,
+          editMode: true
+        }) });
+      } else {
+        return React__default.cloneElement(child, {
+          id,
+          key: index,
+          expanded,
+          padding: childPadding,
+          color,
+          large,
+          "aria-expanded": expanded,
+          className: expanderListStyles["expander-list__item"],
+          handleExpanderClick: (event) => handleExpanderClick(event, `${uuid}-${index}`),
+          renderChildrenWhenClosed,
+          variant,
+          zIndex,
+          highlightText: highlightTextChild
+        });
+      }
+    }
+    return child;
+  }) });
+});
+ExpanderList.displayName = "ExpanderList";
+ExpanderList.Expander = Expander;
+Expander.displayName = "ExpanderList.Expander";
+export {
+  Expander,
+  ExpanderList,
+  ExpanderList as default
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/ExpanderList/ExpanderList.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { useExpand } from '../../hooks/useExpand';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { useUuid } from '../../hooks/useUuid';\nimport { PaletteNames } from '../../theme/palette';\nimport { mergeRefs } from '../../utils/refs';\nimport { isElementInViewport } from '../../utils/viewport';\nimport { ElementHeaderType, renderElementHeader } from '../ElementHeader/ElementHeader';\nimport Highlighter from '../Highlighter';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ListEditModeItem, { ListEditModeItemProps, listEditModeWrapperClassnames } from '../ListEditMode';\nimport { TitleTags } from '../Title';\n\nimport expanderListStyles from './styles.module.scss';\n\nexport type ExpanderListColors = Extract<PaletteNames, 'white' | 'blueberry' | 'cherry' | 'neutral'>;\nexport interface ExpanderType extends React.ForwardRefExoticComponent<ExpanderProps & React.RefAttributes<HTMLLIElement>> {\n  ElementHeader?: ElementHeaderType;\n}\n\nexport interface ExpanderListCompound extends React.ForwardRefExoticComponent<ExpanderListProps & React.RefAttributes<HTMLUListElement>> {\n  Expander: ExpanderType;\n}\n\nexport type ExpanderListVariant = 'line' | 'outline' | 'fill' | 'fill-negative';\n\nexport type ExpanderListStatus = 'none' | 'new';\n\ninterface ExpanderListProps {\n  /** Toggles accordion functionality for the expanders. */\n  accordion?: boolean;\n  /** Items in the ExpanderList */\n  children: React.ReactNode;\n  /** Toggles padding of child elements */\n  childPadding?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the colors of the list. */\n  color?: ExpanderListColors;\n  /** Changes the font size. */\n  large?: boolean;\n  /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */\n  renderChildrenWhenClosed?: boolean;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Sets visual priority */\n  variant?: ExpanderListVariant;\n  /** Overrides the default z-index of the expander header */\n  zIndex?: number;\n  /** Highlights text in title and content. Used for search results */\n  highlightText?: string;\n  /**\n   * @experimental This prop is experimental and may change in the future.\n   * Enables ListEditMode\n   */\n  editMode?: boolean;\n}\n\ntype Modify<T, R> = Omit<T, keyof R> & R;\n\ntype ExpanderProps = Modify<\n  React.HTMLAttributes<HTMLButtonElement>,\n  {\n    id?: string;\n    title: JSX.Element | string;\n    /** Changes the underlying element of the title. Default: span*/\n    titleHtmlMarkup?: TitleTags;\n    children: React.ReactNode;\n    className?: string;\n    color?: ExpanderListColors;\n    icon?: React.ReactElement;\n    padding?: boolean;\n    expanded?: boolean;\n    large?: boolean;\n    testId?: string;\n    handleExpanderClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;\n    /** Called when expander is open/closed. */\n    onExpand?: (isExpanded: boolean) => void;\n    /** Overrides the default z-index of the expander header */\n    zIndex?: number;\n    /** Highlights text in title and content. Override if different from list. */\n    highlightText?: string;\n    /** Displays a status on the left side: default none */\n    status?: ExpanderListStatus;\n  }\n> &\n  Pick<ExpanderListProps, 'renderChildrenWhenClosed' | 'variant'> &\n  ListEditModeItemProps;\n\nexport const Expander: ExpanderType = React.forwardRef<HTMLLIElement, ExpanderProps>((props, ref) => {\n  const {\n    id,\n    children,\n    padding = true,\n    color = 'neutral',\n    className = '',\n    icon,\n    large = false,\n    title,\n    titleHtmlMarkup = 'span',\n    expanded = false,\n    testId,\n    handleExpanderClick,\n    onExpand,\n    renderChildrenWhenClosed,\n    variant = 'line',\n    zIndex = 0,\n    highlightText,\n    status = 'none',\n    editMode = false,\n  } = props;\n  const [isExpanded] = useExpand(expanded, onExpand);\n  const expanderRef = useRef<HTMLLIElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const { isHovered, isFocused } = usePseudoClasses(triggerRef);\n\n  const isFill = variant === 'fill';\n  const isFillNegative = variant === 'fill-negative';\n  const isOutline = variant === 'outline';\n  const isLine = variant === 'line';\n\n  const itemClasses = classNames(className, expanderListStyles['expander-list__item'], {\n    [expanderListStyles[`expander-list__item--fill`]]: isFill,\n    [expanderListStyles[`expander-list__item--fill--${color}`]]: isFill,\n    [expanderListStyles[`expander-list__item--fill-negative`]]: isFillNegative,\n    [expanderListStyles[`expander-list__item--fill-negative--${color}`]]: isFillNegative,\n    [expanderListStyles['expander-list__item--outline']]: isOutline,\n    [expanderListStyles[`expander-list__item--outline--${color}`]]: isOutline,\n    [expanderListStyles['expander-list__item--line']]: isLine,\n    [expanderListStyles[`expander-list__item--line--${color}`]]: isLine,\n    [expanderListStyles[`expander-list__item--new`]]: status === 'new',\n  });\n\n  const expanderClasses = classNames(expanderListStyles['expander-list-link'], expanderListStyles[`expander-list-link--${color}`], {\n    [expanderListStyles[`expander-list-link--fill--${color}`]]: isFill,\n    [expanderListStyles[`expander-list-link--fill-negative`]]: isFillNegative,\n    [expanderListStyles[`expander-list-link--fill-negative--${color}`]]: isFillNegative,\n    [expanderListStyles['expander-list-link--outline']]: isOutline,\n    [expanderListStyles[`expander-list-link--outline--${color}`]]: isOutline,\n    [expanderListStyles[`expander-list-link--line--${color}`]]: isLine,\n    [expanderListStyles['expander-list-link--open']]: isExpanded,\n    [expanderListStyles['expander-list-link--large']]: large,\n    [expanderListStyles[`expander-list-link--new`]]: status === 'new',\n  });\n\n  const renderContent = (): React.ReactNode => {\n    if (!renderChildrenWhenClosed && !isExpanded) {\n      return null;\n    }\n\n    const mainContentClasses = classNames(expanderListStyles['expander-list-link__main-content'], {\n      [expanderListStyles['expander-list-link__main-content--expanded']]: isExpanded,\n      [expanderListStyles['expander-list-link__main-content--padding']]: padding,\n      [expanderListStyles[`expander-list-link__main-content--outline--${color}`]]: isOutline,\n      [expanderListStyles[`expander-list-link__main-content--new`]]: status === 'new',\n    });\n\n    return (\n      <div className={mainContentClasses} data-state={isExpanded ? 'open' : 'closed'}>\n        <Highlighter searchText={highlightText}>{children}</Highlighter>\n      </div>\n    );\n  };\n\n  const statusMarkerClasses = classNames(expanderListStyles['expander-list__item__status-marker'], {\n    [expanderListStyles['expander-list__item__status-marker--new']]: status === 'new',\n  });\n\n  return (\n    <li className={itemClasses} ref={mergeRefs([ref, expanderRef])}>\n      {status !== 'none' && <div className={statusMarkerClasses}></div>}\n      {editMode ? (\n        <div id={id} data-testid={testId} data-analyticsid={AnalyticsId.ExpanderListExpander} className={expanderClasses}>\n          {renderElementHeader(title, {\n            titleHtmlMarkup,\n            isHovered: false,\n            size: large ? 'large' : 'medium',\n            parentType: 'expanderlist',\n            chevronIcon: undefined,\n            icon,\n            highlightText,\n          })}\n        </div>\n      ) : (\n        <button\n          type=\"button\"\n          id={id}\n          onClick={handleExpanderClick}\n          data-testid={testId}\n          data-analyticsid={AnalyticsId.ExpanderListExpander}\n          className={expanderClasses}\n          ref={triggerRef}\n          aria-expanded={isExpanded}\n          style={{\n            zIndex: isFocused ? zIndex + 1 : zIndex,\n          }}\n        >\n          {renderElementHeader(title, {\n            titleHtmlMarkup,\n            isHovered: isHovered || isFocused,\n            size: large ? 'large' : 'medium',\n            parentType: 'expanderlist',\n            chevronIcon: isExpanded ? ChevronUp : ChevronDown,\n            icon,\n            highlightText,\n          })}\n        </button>\n      )}\n      {!editMode && renderContent()}\n    </li>\n  );\n});\n\ntype ActiveExpander = Record<string, boolean>;\n\nconst isExpanderComponent = (element: unknown | null | undefined): element is React.ReactElement<ExpanderProps> =>\n  React.isValidElement<ExpanderProps>(element) && (element as React.ReactElement).type === Expander;\n\nexport const ExpanderList = React.forwardRef((props: ExpanderListProps, ref: React.Ref<HTMLUListElement>) => {\n  const {\n    children,\n    childPadding = true,\n    large,\n    renderChildrenWhenClosed = false,\n    color = 'white',\n    className = '',\n    accordion = false,\n    testId,\n    variant,\n    zIndex,\n    highlightText,\n    editMode = false,\n  } = props;\n  const [activeExpander, setActiveExpander] = useState<ActiveExpander>();\n  const [latestExpander, setLatestExpander] = useState<HTMLElement>();\n  const uuid = useUuid();\n  const expanderListClasses = classNames(expanderListStyles['expander-list'], className, {\n    [expanderListStyles[`expander-list--outline--${color}`]]: variant === 'outline',\n    [expanderListStyles[`expander-list--fill`]]: variant === 'fill' || variant === 'fill-negative',\n    [listEditModeWrapperClassnames]: editMode,\n  });\n\n  function handleExpanderClick(event: React.MouseEvent<HTMLElement, MouseEvent>, id: string): void {\n    setActiveExpander(prevState => (accordion ? { [id]: !prevState?.[id] } : { ...prevState, [id]: !prevState?.[id] }));\n    setLatestExpander(event.currentTarget);\n  }\n\n  const getExpanderId = (index: number): string => `${uuid}-${index}`;\n\n  useEffect(() => {\n    if (accordion && latestExpander && !isElementInViewport(latestExpander)) {\n      latestExpander.scrollIntoView();\n    }\n  }, [accordion, latestExpander]);\n\n  useEffect(() => {\n    const newActiveExpander = React.Children.map(children, child => {\n      if (isExpanderComponent(child)) {\n        return child;\n      }\n    })?.reduce((acc, child, index) => {\n      // Expanded-status skal bare settes dersom prop er satt av den som bruker komponenten\n      if (typeof child.props.expanded !== 'undefined') {\n        acc[getExpanderId(index)] = child.props.expanded;\n      }\n      return acc;\n    }, {} as ActiveExpander);\n\n    setActiveExpander({ ...activeExpander, ...newActiveExpander });\n  }, [children]);\n\n  return (\n    <ul className={expanderListClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.ExpanderList}>\n      {React.Children.map(children, (child, index) => {\n        if (isExpanderComponent(child)) {\n          const id = getExpanderId(index);\n          const expanded = activeExpander?.[id];\n          const highlightTextChild: string | undefined = child.props.highlightText || highlightText;\n\n          if (editMode) {\n            return (\n              <ListEditModeItem color={color} variant={variant} onDelete={child.props.onDelete}>\n                {React.cloneElement(child, {\n                  id,\n                  key: index,\n                  expanded,\n                  padding: childPadding,\n                  color,\n                  large,\n                  'aria-expanded': false,\n                  className: expanderListStyles['expander-list__item'],\n                  renderChildrenWhenClosed: false,\n                  variant,\n                  zIndex: zIndex,\n                  highlightText: highlightTextChild,\n                  editMode: true,\n                })}\n              </ListEditModeItem>\n            );\n          } else {\n            return React.cloneElement(child as React.ReactElement<ExpanderProps>, {\n              id,\n              key: index,\n              expanded,\n              padding: childPadding,\n              color,\n              large,\n              'aria-expanded': expanded,\n              className: expanderListStyles['expander-list__item'],\n              handleExpanderClick: (event: React.MouseEvent<HTMLElement>) => handleExpanderClick(event, `${uuid}-${index}`),\n              renderChildrenWhenClosed,\n              variant,\n              zIndex: zIndex,\n              highlightText: highlightTextChild,\n            });\n          }\n        }\n        return child;\n      })}\n    </ul>\n  );\n}) as ExpanderListCompound;\n\nExpanderList.displayName = 'ExpanderList';\nExpanderList.Expander = Expander;\nExpander.displayName = 'ExpanderList.Expander';\n\nexport default ExpanderList;\n"],"names":["React"],"mappings":"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"}

package/lib/components/EyebrowHeader/EyebrowHeader.d.ts

@@ -0,0 +1,17 @@
+import { default as React } from 'react';
+import { default as Title } from '../Title';
+export interface SubtitleProps {
+    children?: React.ReactNode;
+}
+declare const Subtitle: React.FC<SubtitleProps>;
+export interface EyebrowHeaderProps {
+    children?: React.ReactNode;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export interface EyebrowHeaderType extends React.FC<EyebrowHeaderProps> {
+    Subtitle: typeof Subtitle;
+    Title: typeof Title;
+}
+declare const EyebrowHeader: EyebrowHeaderType;
+export default EyebrowHeader;

package/lib/components/EyebrowHeader/EyebrowHeader.test.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/components/EyebrowHeader/index.d.ts

@@ -0,0 +1,3 @@
+import { default as EyebrowHeader } from './EyebrowHeader';
+export * from './EyebrowHeader';
+export default EyebrowHeader;