@helsenorge/designsystem-react 12.8.0 → 13.0.0-beta.2

package/components/Dropdown/SingleSelect/index.js

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

package/components/Dropdown/SingleSelect/index.js.map

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

package/components/Dropdown/SingleSelect/styles.module.scss

@@ -1,54 +0,0 @@
-@use 'sass:map';
-@use 'sass:meta';
-@use 'sass:string';
-@import '../../../scss/supernova/styles/colors.css';
-@import '../../../scss/supernova/styles/spacers.css';
-
-.single-select-item {
-  cursor: pointer;
-
-  :focus-visible {
-    outline: none;
-  }
-
-  &__content {
-    all: unset;
-    width: 100%;
-    box-sizing: border-box;
-    display: flex;
-    align-items: baseline;
-    cursor: pointer;
-    padding: var(--core-space-2xs) 0 var(--core-space-2xs) var(--core-space-s);
-    line-height: 1.75rem;
-
-    &--disabled {
-      cursor: default;
-    }
-  }
-
-  &__dot {
-    appearance: none;
-    cursor: pointer;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    margin: 0 0.667rem 0 0;
-    background-color: transparent;
-    min-width: 0.67rem;
-    min-height: 0.67rem;
-    border-radius: 10rem;
-    outline: none;
-
-    &:checked {
-      background-color: var(--core-color-black);
-    }
-
-    &--checked {
-      background-color: var(--core-color-black);
-    }
-
-    &--disabled {
-      cursor: default;
-    }
-  }
-}

package/components/Dropdown/SingleSelect/styles.module.scss.d.ts

@@ -1,14 +0,0 @@
-export type Styles = {
-  'single-select-item': string;
-  'single-select-item__content': string;
-  'single-select-item__content--disabled': string;
-  'single-select-item__dot': string;
-  'single-select-item__dot--checked': string;
-  'single-select-item__dot--disabled': string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;

package/components/DropdownOld/DropdownOld.d.ts

@@ -1,42 +0,0 @@
-import { default as React } from 'react';
-import { HNDesignsystemDropdown } from '../../resources/Resources';
-export declare enum DropdownOldOnColor {
-    onwhite = "onwhite",
-    ongrey = "ongrey",
-    onblueberry = "onblueberry",
-    oncherry = "oncherry"
-}
-export interface DropdownOldProps {
-    /** Label for dropdown. Visible for screen readers  */
-    label: string;
-    /** Text on the trigger button that opens the dropdown */
-    placeholder: string;
-    /** Sets the dropdown content */
-    children: React.ReactNode;
-    /** @deprecated Close button text */
-    closeText?: string;
-    /** Minimum width for the dropdown in pixels. Does not affect trigger button */
-    dropdownMinWidth?: number;
-    /** No close button */
-    noCloseButton?: boolean;
-    /** Called when dropdown is open/closed */
-    onToggle?: (isOpen: boolean) => void;
-    /** Whether the dropdown is open or not */
-    open?: boolean;
-    /** Changes the visuals of the dropdown */
-    onColor?: keyof typeof DropdownOldOnColor;
-    /** Makes the background of the trigger transparent */
-    transparent?: boolean;
-    /** Makes the width of the full component adjust to its parent */
-    fluid?: boolean;
-    /** Makes the dropdown disabled */
-    disabled?: boolean;
-    /** Sets the data-testid attribute on the dropdown button */
-    testId?: string;
-    /** Overrides the default z-index of the DropDownContent */
-    zIndex?: number;
-    /** Resources for component */
-    resources?: Partial<HNDesignsystemDropdown>;
-}
-declare const DropdownOld: React.FC<DropdownOldProps>;
-export default DropdownOld;

package/components/DropdownOld/index.d.ts

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

package/components/DropdownOld/index.js

@@ -1,194 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import React__default, { useRef, useId, useEffect } from "react";
-import classNames from "classnames";
-import { theme } from "../../theme/index.js";
-import "../../hooks/useBreakpoint.js";
-import { useHover } from "../../hooks/useHover.js";
-import { useToggle } from "../../hooks/useToggle.js";
-import { useKeyboardEvent } from "../../hooks/useKeyboardEvent.js";
-import { useOutsideEvent } from "../../hooks/useOutsideEvent.js";
-import { LanguageLocales, ZIndex, KeyboardEventKey, AnalyticsId, IconSize } from "../../constants.js";
-import { n as nbNO, e as enGB } from "../../HN.Designsystem.Dropdown.nb-NO.js";
-import { useLanguage } from "../../utils/language.js";
-import { mergeRefs } from "../../utils/refs.js";
-import { B as Button } from "../../Button.js";
-import { I as Icon } from "../../Icon.js";
-import PlusSmall from "../Icons/PlusSmall.js";
-import styles from "./styles.module.scss";
-const getResources = (language) => {
-  switch (language) {
-    case LanguageLocales.ENGLISH:
-      return enGB;
-    case LanguageLocales.NORWEGIAN:
-    default:
-      return nbNO;
-  }
-};
-var DropdownOldOnColor = /* @__PURE__ */ ((DropdownOldOnColor2) => {
-  DropdownOldOnColor2["onwhite"] = "onwhite";
-  DropdownOldOnColor2["ongrey"] = "ongrey";
-  DropdownOldOnColor2["onblueberry"] = "onblueberry";
-  DropdownOldOnColor2["oncherry"] = "oncherry";
-  return DropdownOldOnColor2;
-})(DropdownOldOnColor || {});
-const DropdownOld = (props) => {
-  const {
-    label,
-    placeholder,
-    noCloseButton = false,
-    onToggle,
-    dropdownMinWidth,
-    open = false,
-    children,
-    onColor = "onwhite",
-    transparent = false,
-    fluid = false,
-    testId,
-    disabled,
-    zIndex = ZIndex.PopOver,
-    resources
-  } = props;
-  const dropdownRef = useRef(null);
-  const optionsRef = useRef(null);
-  const { hoverRef: buttonRef, isHovered } = useHover();
-  const openedByKeyboard = useRef(false);
-  const { value: isOpen, toggleValue: toggleIsOpen } = useToggle(!disabled && open, onToggle);
-  const inputRefList = useRef(React__default.Children.map(children, () => React__default.createRef()));
-  const labelId = useId();
-  const toggleLabelId = useId();
-  const optionIdPrefix = useId();
-  const contentId = useId();
-  const { language } = useLanguage(LanguageLocales.NORWEGIAN);
-  const defaultResources = getResources(language);
-  const mergedResources = {
-    ...defaultResources,
-    ...resources,
-    closeText: props.closeText ?? (resources == null ? void 0 : resources.closeText) ?? defaultResources.closeText
-  };
-  const handleOpen = (isKeyboard) => {
-    openedByKeyboard.current = isKeyboard;
-    toggleIsOpen();
-  };
-  const handleClose = () => {
-    var _a;
-    toggleIsOpen();
-    (_a = buttonRef.current) == null ? void 0 : _a.focus();
-  };
-  useEffect(() => {
-    var _a, _b;
-    if (isOpen && openedByKeyboard.current) {
-      const firstEnabled = (_a = inputRefList.current) == null ? void 0 : _a.find((r) => r.current && !r.current.hasAttribute("disabled"));
-      (_b = firstEnabled == null ? void 0 : firstEnabled.current) == null ? void 0 : _b.focus();
-      openedByKeyboard.current = false;
-    }
-  }, [isOpen]);
-  const handleKeyboardNavigation = (event) => {
-    var _a;
-    if (!inputRefList.current) {
-      return;
-    }
-    if (event.key === KeyboardEventKey.Escape) {
-      if (isOpen) handleClose();
-      return;
-    }
-    if (!isOpen) {
-      handleOpen(true);
-      event.preventDefault();
-      return;
-    }
-    const index = inputRefList.current.findIndex((x) => x.current === event.target);
-    let nextIndex = index;
-    if (event.key === KeyboardEventKey.Home) {
-      nextIndex = 0;
-    } else if (event.key === KeyboardEventKey.End) {
-      nextIndex = inputRefList.current.length - 1;
-    } else if (event.key === KeyboardEventKey.ArrowDown && index < inputRefList.current.length - 1) {
-      nextIndex = index + 1;
-    } else if (event.key === KeyboardEventKey.ArrowUp && index > 0) {
-      nextIndex = index - 1;
-    } else if (event.key === KeyboardEventKey.Enter && index !== -1) {
-      nextIndex = index;
-    }
-    if (nextIndex !== -1 && event.key !== KeyboardEventKey.Space) {
-      event.preventDefault();
-      (_a = inputRefList.current[nextIndex].current) == null ? void 0 : _a.focus();
-    }
-  };
-  useKeyboardEvent(dropdownRef, handleKeyboardNavigation, [
-    KeyboardEventKey.ArrowDown,
-    KeyboardEventKey.ArrowUp,
-    KeyboardEventKey.End,
-    KeyboardEventKey.Enter,
-    KeyboardEventKey.Escape,
-    KeyboardEventKey.Home,
-    KeyboardEventKey.Space
-  ]);
-  useOutsideEvent(dropdownRef, () => isOpen && handleClose());
-  const toggleClasses = classNames(
-    styles.dropdown__toggle,
-    !disabled && {
-      [styles["dropdown__toggle--on-white"]]: onColor === "onwhite",
-      [styles["dropdown__toggle--on-grey"]]: onColor === "ongrey",
-      [styles["dropdown__toggle--on-blueberry"]]: onColor === "onblueberry",
-      [styles["dropdown__toggle--on-cherry"]]: onColor === "oncherry",
-      [styles["dropdown__toggle--transparent"]]: transparent,
-      [styles["dropdown__toggle--fluid"]]: fluid,
-      [styles["dropdown__toggle--open"]]: isOpen
-    }
-  );
-  const contentClasses = classNames(styles.dropdown__content, isOpen && styles["dropdown__content--open"]);
-  const renderChildren = React__default.Children.map(children, (child, index) => {
-    return /* @__PURE__ */ jsx("li", { className: styles.dropdown__input, id: `${optionIdPrefix}-${index}`, children: React__default.isValidElement(child) && inputRefList.current && inputRefList.current[index] ? React__default.cloneElement(child, {
-      ref: mergeRefs([child.props.ref, inputRefList.current[index]])
-    }) : child });
-  });
-  return /* @__PURE__ */ jsxs("div", { className: styles.dropdown, ref: dropdownRef, children: [
-    /* @__PURE__ */ jsx("span", { id: labelId, className: styles.dropdown__label, children: label }),
-    /* @__PURE__ */ jsxs(
-      "button",
-      {
-        type: "button",
-        onClick: () => handleOpen(false),
-        className: toggleClasses,
-        ref: buttonRef,
-        "data-testid": testId,
-        "data-analyticsid": AnalyticsId.Dropdown,
-        disabled,
-        "aria-labelledby": toggleLabelId,
-        "aria-haspopup": true,
-        "aria-controls": contentId,
-        "aria-expanded": isOpen,
-        children: [
-          /* @__PURE__ */ jsx("span", { id: toggleLabelId, className: styles.dropdown__toggle__label, children: placeholder }),
-          /* @__PURE__ */ jsx(
-            Icon,
-            {
-              color: disabled ? theme.palette.neutral700 : theme.palette.blueberry600,
-              svgIcon: PlusSmall,
-              className: styles.dropdown__icon,
-              isHovered: !disabled && isHovered,
-              size: IconSize.XSmall
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs(
-      "div",
-      {
-        id: contentId,
-        className: contentClasses,
-        style: { width: fluid ? "100%" : `auto`, minWidth: dropdownMinWidth ?? "auto", zIndex },
-        children: [
-          /* @__PURE__ */ jsx("ul", { className: styles.dropdown__options, role: "group", "aria-labelledby": labelId, tabIndex: -1, ref: optionsRef, children: renderChildren }),
-          !noCloseButton && /* @__PURE__ */ jsx("div", { className: styles.dropdown__close, children: /* @__PURE__ */ jsx(Button, { onClick: handleClose, children: mergedResources.closeText }) })
-        ]
-      }
-    )
-  ] });
-};
-export {
-  DropdownOldOnColor,
-  DropdownOld as default
-};
-//# sourceMappingURL=index.js.map

package/components/DropdownOld/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/DropdownOld/resourceHelper.ts","../../../src/components/DropdownOld/DropdownOld.tsx"],"sourcesContent":["import { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.Dropdown.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.Dropdown.nb-NO.json';\nimport { HNDesignsystemDropdown } from '../../resources/Resources';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemDropdown => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import React, { useEffect, useRef, useId } from 'react';\n\nimport classNames from 'classnames';\n\nimport {\n  AnalyticsId,\n  IconSize,\n  KeyboardEventKey,\n  LanguageLocales,\n  ZIndex,\n  theme,\n  useHover,\n  useKeyboardEvent,\n  useOutsideEvent,\n  useToggle,\n} from '../..';\nimport { getResources } from './resourceHelper';\nimport { HNDesignsystemDropdown } from '../../resources/Resources';\nimport { useLanguage } from '../../utils/language';\nimport { mergeRefs } from '../../utils/refs';\nimport Button from '../Button';\nimport Icon from '../Icon';\nimport PlusSmall from '../Icons/PlusSmall';\n\nimport styles from './styles.module.scss';\n\nexport enum DropdownOldOnColor {\n  onwhite = 'onwhite',\n  ongrey = 'ongrey',\n  onblueberry = 'onblueberry',\n  oncherry = 'oncherry',\n}\n\nexport interface DropdownOldProps {\n  /** Label for dropdown. Visible for screen readers  */\n  label: string;\n  /** Text on the trigger button that opens the dropdown */\n  placeholder: string;\n  /** Sets the dropdown content */\n  children: React.ReactNode;\n  /** @deprecated Close button text */\n  closeText?: string;\n  /** Minimum width for the dropdown in pixels. Does not affect trigger button */\n  dropdownMinWidth?: number;\n  /** No close button */\n  noCloseButton?: boolean;\n  /** Called when dropdown is open/closed */\n  onToggle?: (isOpen: boolean) => void;\n  /** Whether the dropdown is open or not */\n  open?: boolean;\n  /** Changes the visuals of the dropdown */\n  onColor?: keyof typeof DropdownOldOnColor;\n  /** Makes the background of the trigger transparent */\n  transparent?: boolean;\n  /** Makes the width of the full component adjust to its parent */\n  fluid?: boolean;\n  /** Makes the dropdown disabled */\n  disabled?: boolean;\n  /** Sets the data-testid attribute on the dropdown button */\n  testId?: string;\n  /** Overrides the default z-index of the DropDownContent */\n  zIndex?: number;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemDropdown>;\n}\n\nconst DropdownOld: React.FC<DropdownOldProps> = props => {\n  const {\n    label,\n    placeholder,\n    noCloseButton = false,\n    onToggle,\n    dropdownMinWidth,\n    open = false,\n    children,\n    onColor = DropdownOldOnColor.onwhite,\n    transparent = false,\n    fluid = false,\n    testId,\n    disabled,\n    zIndex = ZIndex.PopOver,\n    resources,\n  } = props;\n\n  const dropdownRef = useRef<HTMLDivElement>(null);\n  const optionsRef = useRef<HTMLUListElement>(null);\n  const { hoverRef: buttonRef, isHovered } = useHover<HTMLButtonElement>();\n  const openedByKeyboard = useRef<boolean>(false);\n  const { value: isOpen, toggleValue: toggleIsOpen } = useToggle(!disabled && open, onToggle);\n  const inputRefList = useRef(React.Children.map(children, () => React.createRef<HTMLElement>()));\n  const labelId = useId();\n  const toggleLabelId = useId();\n  const optionIdPrefix = useId();\n  const contentId = useId();\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemDropdown = {\n    ...defaultResources,\n    ...resources,\n    closeText: props.closeText ?? resources?.closeText ?? defaultResources.closeText,\n  };\n\n  const handleOpen = (isKeyboard: boolean): void => {\n    openedByKeyboard.current = isKeyboard;\n    toggleIsOpen();\n  };\n\n  const handleClose = (): void => {\n    toggleIsOpen();\n    buttonRef.current?.focus();\n  };\n\n  useEffect(() => {\n    if (isOpen && openedByKeyboard.current) {\n      const firstEnabled = inputRefList.current?.find(r => r.current && !r.current.hasAttribute('disabled'));\n      firstEnabled?.current?.focus();\n      openedByKeyboard.current = false;\n    }\n  }, [isOpen]);\n\n  const handleKeyboardNavigation = (event: KeyboardEvent): void => {\n    if (!inputRefList.current) {\n      return;\n    }\n\n    if (event.key === KeyboardEventKey.Escape) {\n      if (isOpen) handleClose();\n      return;\n    }\n\n    if (!isOpen) {\n      handleOpen(true);\n      event.preventDefault();\n      return;\n    }\n\n    const index = inputRefList.current.findIndex(x => x.current === event.target);\n    let nextIndex = index;\n\n    if (event.key === KeyboardEventKey.Home) {\n      nextIndex = 0;\n    } else if (event.key === KeyboardEventKey.End) {\n      nextIndex = inputRefList.current.length - 1;\n    } else if (event.key === KeyboardEventKey.ArrowDown && index < inputRefList.current.length - 1) {\n      nextIndex = index + 1;\n    } else if (event.key === KeyboardEventKey.ArrowUp && index > 0) {\n      nextIndex = index - 1;\n    } else if (event.key === KeyboardEventKey.Enter && index !== -1) {\n      nextIndex = index;\n    }\n\n    if (nextIndex !== -1 && event.key !== KeyboardEventKey.Space) {\n      event.preventDefault();\n\n      inputRefList.current[nextIndex].current?.focus();\n    }\n  };\n\n  useKeyboardEvent(dropdownRef, handleKeyboardNavigation, [\n    KeyboardEventKey.ArrowDown,\n    KeyboardEventKey.ArrowUp,\n    KeyboardEventKey.End,\n    KeyboardEventKey.Enter,\n    KeyboardEventKey.Escape,\n    KeyboardEventKey.Home,\n    KeyboardEventKey.Space,\n  ]);\n\n  useOutsideEvent(dropdownRef, () => isOpen && handleClose());\n\n  const toggleClasses = classNames(\n    styles.dropdown__toggle,\n    !disabled && {\n      [styles['dropdown__toggle--on-white']]: onColor === DropdownOldOnColor.onwhite,\n      [styles['dropdown__toggle--on-grey']]: onColor === DropdownOldOnColor.ongrey,\n      [styles['dropdown__toggle--on-blueberry']]: onColor === DropdownOldOnColor.onblueberry,\n      [styles['dropdown__toggle--on-cherry']]: onColor === DropdownOldOnColor.oncherry,\n      [styles['dropdown__toggle--transparent']]: transparent,\n      [styles['dropdown__toggle--fluid']]: fluid,\n      [styles['dropdown__toggle--open']]: isOpen,\n    }\n  );\n\n  const contentClasses = classNames(styles.dropdown__content, isOpen && styles['dropdown__content--open']);\n\n  const renderChildren = React.Children.map(children, (child, index) => {\n    return (\n      <li className={styles.dropdown__input} id={`${optionIdPrefix}-${index}`}>\n        {React.isValidElement(child) && inputRefList.current && inputRefList.current[index]\n          ? React.cloneElement(child as React.ReactElement, {\n              ref: mergeRefs([child.props.ref, inputRefList.current[index]]),\n            })\n          : child}\n      </li>\n    );\n  });\n\n  return (\n    <div className={styles.dropdown} ref={dropdownRef}>\n      <span id={labelId} className={styles.dropdown__label}>\n        {label}\n      </span>\n      <button\n        type=\"button\"\n        onClick={(): false | void => handleOpen(false)}\n        className={toggleClasses}\n        ref={buttonRef}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.Dropdown}\n        disabled={disabled}\n        aria-labelledby={toggleLabelId}\n        aria-haspopup={true}\n        aria-controls={contentId}\n        aria-expanded={isOpen}\n      >\n        <span id={toggleLabelId} className={styles.dropdown__toggle__label}>\n          {placeholder}\n        </span>\n        <Icon\n          color={disabled ? theme.palette.neutral700 : theme.palette.blueberry600}\n          svgIcon={PlusSmall}\n          className={styles.dropdown__icon}\n          isHovered={!disabled && isHovered}\n          size={IconSize.XSmall}\n        />\n      </button>\n      <div\n        id={contentId}\n        className={contentClasses}\n        style={{ width: fluid ? '100%' : `auto`, minWidth: dropdownMinWidth ?? 'auto', zIndex: zIndex }}\n      >\n        <ul className={styles.dropdown__options} role=\"group\" aria-labelledby={labelId} tabIndex={-1} ref={optionsRef}>\n          {renderChildren}\n        </ul>\n        {!noCloseButton && (\n          <div className={styles.dropdown__close}>\n            <Button onClick={handleClose}>{mergedResources.closeText}</Button>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default DropdownOld;\n"],"names":["DropdownOldOnColor","React"],"mappings":";;;;;;;;;;;;;;;;;AAKO,MAAM,eAAe,CAAC,aAAsD;AACjF,UAAQ,UAAA;AAAA,IACN,KAAK,gBAAgB;AACnB,aAAO;AAAA,IACT,KAAK,gBAAgB;AAAA,IACrB;AACE,aAAO;AAAA,EAAA;AAEb;ACaO,IAAK,uCAAAA,wBAAL;AACLA,sBAAA,SAAA,IAAU;AACVA,sBAAA,QAAA,IAAS;AACTA,sBAAA,aAAA,IAAc;AACdA,sBAAA,UAAA,IAAW;AAJD,SAAAA;AAAA,GAAA,sBAAA,CAAA,CAAA;AAwCZ,MAAM,cAA0C,CAAA,UAAS;AACvD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP;AAAA,IACA,UAAU;AAAA,IACV,cAAc;AAAA,IACd,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA,SAAS,OAAO;AAAA,IAChB;AAAA,EAAA,IACE;AAEJ,QAAM,cAAc,OAAuB,IAAI;AAC/C,QAAM,aAAa,OAAyB,IAAI;AAChD,QAAM,EAAE,UAAU,WAAW,UAAA,IAAc,SAAA;AAC3C,QAAM,mBAAmB,OAAgB,KAAK;AAC9C,QAAM,EAAE,OAAO,QAAQ,aAAa,iBAAiB,UAAU,CAAC,YAAY,MAAM,QAAQ;AAC1F,QAAM,eAAe,OAAOC,eAAM,SAAS,IAAI,UAAU,MAAMA,eAAM,UAAA,CAAwB,CAAC;AAC9F,QAAM,UAAU,MAAA;AAChB,QAAM,gBAAgB,MAAA;AACtB,QAAM,iBAAiB,MAAA;AACvB,QAAM,YAAY,MAAA;AAClB,QAAM,EAAE,SAAA,IAAa,YAA6B,gBAAgB,SAAS;AAC3E,QAAM,mBAAmB,aAAa,QAAQ;AAE9C,QAAM,kBAA0C;AAAA,IAC9C,GAAG;AAAA,IACH,GAAG;AAAA,IACH,WAAW,MAAM,cAAa,uCAAW,cAAa,iBAAiB;AAAA,EAAA;AAGzE,QAAM,aAAa,CAAC,eAA8B;AAChD,qBAAiB,UAAU;AAC3B,iBAAA;AAAA,EACF;AAEA,QAAM,cAAc,MAAY;;AAC9B,iBAAA;AACA,oBAAU,YAAV,mBAAmB;AAAA,EACrB;AAEA,YAAU,MAAM;;AACd,QAAI,UAAU,iBAAiB,SAAS;AACtC,YAAM,gBAAe,kBAAa,YAAb,mBAAsB,KAAK,CAAA,MAAK,EAAE,WAAW,CAAC,EAAE,QAAQ,aAAa,UAAU;AACpG,yDAAc,YAAd,mBAAuB;AACvB,uBAAiB,UAAU;AAAA,IAC7B;AAAA,EACF,GAAG,CAAC,MAAM,CAAC;AAEX,QAAM,2BAA2B,CAAC,UAA+B;;AAC/D,QAAI,CAAC,aAAa,SAAS;AACzB;AAAA,IACF;AAEA,QAAI,MAAM,QAAQ,iBAAiB,QAAQ;AACzC,UAAI,OAAQ,aAAA;AACZ;AAAA,IACF;AAEA,QAAI,CAAC,QAAQ;AACX,iBAAW,IAAI;AACf,YAAM,eAAA;AACN;AAAA,IACF;AAEA,UAAM,QAAQ,aAAa,QAAQ,UAAU,OAAK,EAAE,YAAY,MAAM,MAAM;AAC5E,QAAI,YAAY;AAEhB,QAAI,MAAM,QAAQ,iBAAiB,MAAM;AACvC,kBAAY;AAAA,IACd,WAAW,MAAM,QAAQ,iBAAiB,KAAK;AAC7C,kBAAY,aAAa,QAAQ,SAAS;AAAA,IAC5C,WAAW,MAAM,QAAQ,iBAAiB,aAAa,QAAQ,aAAa,QAAQ,SAAS,GAAG;AAC9F,kBAAY,QAAQ;AAAA,IACtB,WAAW,MAAM,QAAQ,iBAAiB,WAAW,QAAQ,GAAG;AAC9D,kBAAY,QAAQ;AAAA,IACtB,WAAW,MAAM,QAAQ,iBAAiB,SAAS,UAAU,IAAI;AAC/D,kBAAY;AAAA,IACd;AAEA,QAAI,cAAc,MAAM,MAAM,QAAQ,iBAAiB,OAAO;AAC5D,YAAM,eAAA;AAEN,yBAAa,QAAQ,SAAS,EAAE,YAAhC,mBAAyC;AAAA,IAC3C;AAAA,EACF;AAEA,mBAAiB,aAAa,0BAA0B;AAAA,IACtD,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,EAAA,CAClB;AAED,kBAAgB,aAAa,MAAM,UAAU,YAAA,CAAa;AAE1D,QAAM,gBAAgB;AAAA,IACpB,OAAO;AAAA,IACP,CAAC,YAAY;AAAA,MACX,CAAC,OAAO,4BAA4B,CAAC,GAAG,YAAY;AAAA,MACpD,CAAC,OAAO,2BAA2B,CAAC,GAAG,YAAY;AAAA,MACnD,CAAC,OAAO,gCAAgC,CAAC,GAAG,YAAY;AAAA,MACxD,CAAC,OAAO,6BAA6B,CAAC,GAAG,YAAY;AAAA,MACrD,CAAC,OAAO,+BAA+B,CAAC,GAAG;AAAA,MAC3C,CAAC,OAAO,yBAAyB,CAAC,GAAG;AAAA,MACrC,CAAC,OAAO,wBAAwB,CAAC,GAAG;AAAA,IAAA;AAAA,EACtC;AAGF,QAAM,iBAAiB,WAAW,OAAO,mBAAmB,UAAU,OAAO,yBAAyB,CAAC;AAEvG,QAAM,iBAAiBA,eAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACpE,WACE,oBAAC,QAAG,WAAW,OAAO,iBAAiB,IAAI,GAAG,cAAc,IAAI,KAAK,IAClE,yBAAM,eAAe,KAAK,KAAK,aAAa,WAAW,aAAa,QAAQ,KAAK,IAC9EA,eAAM,aAAa,OAA6B;AAAA,MAC9C,KAAK,UAAU,CAAC,MAAM,MAAM,KAAK,aAAa,QAAQ,KAAK,CAAC,CAAC;AAAA,IAAA,CAC9D,IACD,MAAA,CACN;AAAA,EAEJ,CAAC;AAED,8BACG,OAAA,EAAI,WAAW,OAAO,UAAU,KAAK,aACpC,UAAA;AAAA,IAAA,oBAAC,UAAK,IAAI,SAAS,WAAW,OAAO,iBAClC,UAAA,OACH;AAAA,IACA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,MAAoB,WAAW,KAAK;AAAA,QAC7C,WAAW;AAAA,QACX,KAAK;AAAA,QACL,eAAa;AAAA,QACb,oBAAkB,YAAY;AAAA,QAC9B;AAAA,QACA,mBAAiB;AAAA,QACjB,iBAAe;AAAA,QACf,iBAAe;AAAA,QACf,iBAAe;AAAA,QAEf,UAAA;AAAA,UAAA,oBAAC,UAAK,IAAI,eAAe,WAAW,OAAO,yBACxC,UAAA,aACH;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAO,WAAW,MAAM,QAAQ,aAAa,MAAM,QAAQ;AAAA,cAC3D,SAAS;AAAA,cACT,WAAW,OAAO;AAAA,cAClB,WAAW,CAAC,YAAY;AAAA,cACxB,MAAM,SAAS;AAAA,YAAA;AAAA,UAAA;AAAA,QACjB;AAAA,MAAA;AAAA,IAAA;AAAA,IAEF;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAI;AAAA,QACJ,WAAW;AAAA,QACX,OAAO,EAAE,OAAO,QAAQ,SAAS,QAAQ,UAAU,oBAAoB,QAAQ,OAAA;AAAA,QAE/E,UAAA;AAAA,UAAA,oBAAC,MAAA,EAAG,WAAW,OAAO,mBAAmB,MAAK,SAAQ,mBAAiB,SAAS,UAAU,IAAI,KAAK,YAChG,UAAA,gBACH;AAAA,UACC,CAAC,iBACA,oBAAC,OAAA,EAAI,WAAW,OAAO,iBACrB,UAAA,oBAAC,QAAA,EAAO,SAAS,aAAc,UAAA,gBAAgB,WAAU,EAAA,CAC3D;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;"}

package/components/DropdownOld/resourceHelper.d.ts

@@ -1,3 +0,0 @@
-import { LanguageLocales } from '../../constants';
-import { HNDesignsystemDropdown } from '../../resources/Resources';
-export declare const getResources: (language: LanguageLocales) => HNDesignsystemDropdown;

package/components/DropdownOld/styles.module.scss

@@ -1,230 +0,0 @@
-@use 'sass:map';
-@use '../../scss/spacers' as spacers;
-@use '../../scss/palette' as palette;
-@use '../../scss/font-settings' as font-settings;
-@use '../../scss/screen-reader' as *;
-@use '../../scss/breakpoints' as breakpoints;
-
-.dropdown {
-  position: relative;
-  width: fit-content;
-
-  &__label {
-    @include sr-only;
-  }
-
-  &__toggle {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    cursor: pointer;
-    border-radius: 0;
-    border-width: 2px;
-    border-style: solid;
-    padding: 0 spacers.getSpacer(3xs) 0 spacers.getSpacer(s);
-    font-family: inherit;
-    font-size: font-settings.$font-size-sm;
-    line-height: 1.3rem; // Custom fordi teksten skal henge bedre sammen om den går over to linjer
-
-    @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-      padding: spacers.getSpacer(3xs) spacers.getSpacer(3xs) spacers.getSpacer(3xs) spacers.getSpacer(s);
-      font-size: font-settings.$font-size-md;
-      line-height: 1.5rem;
-    }
-
-    &:focus {
-      outline: none;
-    }
-
-    &:disabled {
-      cursor: initial;
-      color: palette.$neutral700;
-      background-color: transparent;
-      border-color: palette.$neutral600;
-      border-style: dashed;
-    }
-
-    &--on-white,
-    &--on-grey {
-      border-color: palette.$neutral700;
-      background-color: palette.$white;
-
-      &:hover {
-        background-color: palette.$neutral50;
-        box-shadow: 0 0 0 1px palette.$neutral700;
-      }
-
-      &:focus {
-        border-color: palette.$black;
-        box-shadow: 0 0 0 1px palette.$black;
-      }
-    }
-
-    &--on-blueberry {
-      border-color: palette.$blueberry500;
-      background-color: palette.$white;
-
-      &:hover {
-        background-color: palette.$blueberry50;
-        box-shadow: 0 0 0 1px palette.$blueberry500;
-      }
-
-      &:focus {
-        border-color: palette.$black;
-        box-shadow: 0 0 0 1px palette.$black;
-      }
-    }
-
-    &--on-cherry {
-      border-color: palette.$cherry500;
-      background-color: palette.$white;
-
-      &:hover {
-        background-color: palette.$cherry50;
-        box-shadow: 0 0 0 1px palette.$cherry500;
-      }
-
-      &:focus {
-        border-color: palette.$black;
-        box-shadow: 0 0 0 1px palette.$black;
-      }
-    }
-
-    &--open#{&}--on-white,
-    &--open#{&}--on-grey {
-      background-color: palette.$neutral50;
-
-      &:hover {
-        background-color: palette.$white;
-      }
-    }
-
-    &--open#{&}--on-blueberry {
-      background-color: palette.$blueberry50;
-
-      &:hover {
-        background-color: palette.$white;
-      }
-    }
-
-    &--open#{&}--on-cherry {
-      background-color: palette.$cherry50;
-
-      &:hover {
-        background-color: palette.$white;
-      }
-    }
-
-    &--transparent {
-      background-color: transparent;
-    }
-
-    &--transparent#{&}--on-grey {
-      &:hover {
-        background-color: palette.$neutral100;
-      }
-    }
-
-    &--transparent#{&}--on-blueberry {
-      &:hover {
-        background-color: palette.$blueberry100;
-      }
-    }
-
-    &--transparent#{&}--on-cherry {
-      &:hover {
-        background-color: palette.$cherry100;
-      }
-    }
-
-    &--transparent#{&}--open#{&}--on-grey {
-      background-color: palette.$neutral100;
-
-      &:hover {
-        background-color: transparent;
-      }
-    }
-
-    &--transparent#{&}--open#{&}--on-blueberry {
-      background-color: palette.$blueberry100;
-
-      &:hover {
-        background-color: transparent;
-      }
-    }
-
-    &--transparent#{&}--open#{&}--on-cherry {
-      background-color: palette.$cherry100;
-
-      &:hover {
-        background-color: transparent;
-      }
-    }
-
-    &--fluid {
-      width: 100%;
-    }
-
-    &__label {
-      padding: spacers.getSpacer(3xs) 0;
-
-      @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-        padding: spacers.getSpacer(2xs) 0;
-      }
-    }
-  }
-
-  &__icon {
-    margin-left: spacers.getSpacer(2xs);
-  }
-
-  &__content {
-    display: none;
-    position: absolute;
-    background-color: palette.$white;
-    margin-top: spacers.getSpacer(2xs);
-    box-shadow: 0 0 0 2px palette.$blueberry500;
-    z-index: 1;
-
-    &--open {
-      display: block;
-    }
-  }
-
-  &__options {
-    overflow: hidden auto;
-    max-height: 384px;
-    list-style: none;
-    padding: 0;
-    margin: 0;
-
-    @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-      max-height: 464px;
-    }
-  }
-
-  &__close {
-    padding: spacers.getSpacer(s);
-  }
-
-  &__input {
-    border-bottom: 1px solid palette.$neutral300;
-    padding: 0 spacers.getSpacer(s);
-
-    &[role='menuitemradio'] {
-      padding: 0 spacers.getSpacer(s);
-    }
-
-    &[role='menuitemcheckbox'] {
-      padding: 1px spacers.getSpacer(s) spacers.getSpacer(2xs) spacers.getSpacer(s);
-    }
-
-    @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-      padding: spacers.getSpacer(s);
-    }
-
-    &:last-child {
-      border-bottom: none;
-    }
-  }
-}

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

@@ -1,25 +0,0 @@
-export type Styles = {
-  dropdown: string;
-  dropdown__close: string;
-  dropdown__content: string;
-  'dropdown__content--open': string;
-  dropdown__icon: string;
-  dropdown__input: string;
-  dropdown__label: string;
-  dropdown__options: string;
-  dropdown__toggle: string;
-  dropdown__toggle__label: string;
-  'dropdown__toggle--fluid': string;
-  'dropdown__toggle--on-blueberry': string;
-  'dropdown__toggle--on-cherry': string;
-  'dropdown__toggle--on-grey': string;
-  'dropdown__toggle--on-white': string;
-  'dropdown__toggle--open': string;
-  'dropdown__toggle--transparent': string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;

package/components/PanelListOld/PanelListOld.d.ts

@@ -1,12 +0,0 @@
-import { default as React } from 'react';
-import { PanelOldVariant } from '../PanelOld';
-export interface PanelListOldProps {
-    /** Panels to render inside the PanelList */
-    children?: React.ReactNode;
-    /** Changes the visual representation of the panel. Default: fill */
-    variant?: keyof typeof PanelOldVariant;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-declare const PanelListOld: React.ForwardRefExoticComponent<PanelListOldProps & React.RefAttributes<HTMLDivElement>>;
-export default PanelListOld;

package/components/PanelListOld/PanelListOld.test.d.ts

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

package/components/PanelListOld/index.d.ts

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

package/components/PanelListOld/index.js

@@ -1,20 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import React__default from "react";
-import classNames from "classnames";
-import { AnalyticsId } from "../../constants.js";
-import { b as PanelOldVariant, P as PanelOld } from "../../PanelOld.js";
-import styles from "./styles.module.scss";
-const isPanelComponent = (element) => React__default.isValidElement(element) && element.type === PanelOld;
-const PanelListOld = React__default.forwardRef(function BadgeForwardedRef(props, ref) {
-  const { testId, children, variant = PanelOldVariant.fill } = props;
-  const renderPanel = (panel, firstChild) => React__default.cloneElement(panel, {
-    variant,
-    noTopBorder: variant === PanelOldVariant.line && !firstChild,
-    className: classNames(panel.props.className, variant !== PanelOldVariant.line && styles["panel-list__panel"])
-  });
-  return /* @__PURE__ */ jsx("div", { ref, "data-testid": testId, "data-analyticsid": AnalyticsId.PanelList, children: React__default.Children.map(children, (child, index) => isPanelComponent(child) ? renderPanel(child, index === 0) : child) });
-});
-export {
-  PanelListOld as default
-};
-//# sourceMappingURL=index.js.map

package/components/PanelListOld/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/PanelListOld/PanelListOld.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport PanelOld, { PanelOldProps, PanelOldVariant } from '../PanelOld';\n\nimport styles from './styles.module.scss';\n\nexport interface PanelListOldProps {\n  /** Panels to render inside the PanelList */\n  children?: React.ReactNode;\n  /** Changes the visual representation of the panel. Default: fill */\n  variant?: keyof typeof PanelOldVariant;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst isPanelComponent = (element: unknown | null | undefined): element is React.ReactElement<PanelOldProps> =>\n  React.isValidElement<PanelOldProps>(element) && (element as React.ReactElement).type === PanelOld;\n\nconst PanelListOld = React.forwardRef(function BadgeForwardedRef(props: PanelListOldProps, ref: React.ForwardedRef<HTMLDivElement>) {\n  const { testId, children, variant = PanelOldVariant.fill } = props;\n\n  const renderPanel = (panel: React.ReactElement<PanelOldProps>, firstChild: boolean): React.ReactElement =>\n    React.cloneElement(panel, {\n      variant: variant,\n      noTopBorder: variant === PanelOldVariant.line && !firstChild,\n      className: classNames(panel.props.className, variant !== PanelOldVariant.line && styles['panel-list__panel']),\n    });\n\n  return (\n    <div ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.PanelList}>\n      {React.Children.map(children, (child, index) => (isPanelComponent(child) ? renderPanel(child, index === 0) : child))}\n    </div>\n  );\n});\n\nexport default PanelListOld;\n"],"names":["React"],"mappings":";;;;;;AAkBA,MAAM,mBAAmB,CAAC,YACxBA,eAAM,eAA8B,OAAO,KAAM,QAA+B,SAAS;AAE3F,MAAM,eAAeA,eAAM,WAAW,SAAS,kBAAkB,OAA0B,KAAyC;AAClI,QAAM,EAAE,QAAQ,UAAU,UAAU,gBAAgB,SAAS;AAE7D,QAAM,cAAc,CAAC,OAA0C,eAC7DA,eAAM,aAAa,OAAO;AAAA,IACxB;AAAA,IACA,aAAa,YAAY,gBAAgB,QAAQ,CAAC;AAAA,IAClD,WAAW,WAAW,MAAM,MAAM,WAAW,YAAY,gBAAgB,QAAQ,OAAO,mBAAmB,CAAC;AAAA,EAAA,CAC7G;AAEH,SACE,oBAAC,OAAA,EAAI,KAAU,eAAa,QAAQ,oBAAkB,YAAY,WAC/D,UAAAA,eAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAW,iBAAiB,KAAK,IAAI,YAAY,OAAO,UAAU,CAAC,IAAI,KAAM,EAAA,CACrH;AAEJ,CAAC;"}

package/components/PanelListOld/styles.module.scss

@@ -1,14 +0,0 @@
-@use 'sass:map';
-@use '../../scss/spacers' as spacers;
-@use '../../scss/palette' as palette;
-@use '../../scss/breakpoints' as breakpoints;
-
-.panel-list {
-  &__panel:not(:last-child) {
-    margin-bottom: spacers.getSpacer(2xs);
-
-    @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-      margin-bottom: spacers.getSpacer(s);
-    }
-  }
-}