@helsenorge/designsystem-react 7.2.0 → 7.2.1

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+## [7.2.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv7.1.0&targetVersion=GTv7.2.0) (2024-04-19)
+
+### Features
+
+- knappen i dropdown skal ikke være fluid
+  ([a3abe2b](https://github.com/helsenorge/designsystem/commit/a3abe2bf5a57e62302b5e4f1a1f1b609452effd0)), closes
+  [#323389](https://github.com/helsenorge/designsystem/issues/323389)
+
+### Bug Fixes
+
+- bruk supernova-sjekk som funker i ff
+  ([afae2a9](https://github.com/helsenorge/designsystem/commit/afae2a90d9e453be054016b5922aa378500f91cc))
+- oppdater sjekk for om vi er i superNova
+  ([b20a776](https://github.com/helsenorge/designsystem/commit/b20a776f293953d78ccab6e40d687bab67676a28))
+- oppdater sjekk for om vi er i superNova
+  ([167d572](https://github.com/helsenorge/designsystem/commit/167d572261a91fd60a8c432d4d990356a610115f))
+
 ## [7.1.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv7.0.0&targetVersion=GTv7.1.0) (2024-04-17)
 
 ### Features

package/components/AnchorLink/AnchorLink.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./AnchorLink").AnchorLinkProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Avatar/Avatar.stories.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 import { AvatarSize } from './Avatar';
 declare const meta: {
@@ -5,6 +6,7 @@ declare const meta: {
     component: import("./Avatar").AvatarType;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Badge/Badge.stories.d.ts

@@ -1,9 +1,11 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: import("./Badge").BadgeType;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Button/Button.js

@@ -1,5 +1,5 @@
 import o, { useRef as lt, useEffect as ct } from "react";
-import p from "classnames";
+import d from "classnames";
 import { Icon as it } from "../Icon/Icon.js";
 import { AnalyticsId as $, IconSize as v } from "../../constants.js";
 import { useBreakpoint as ut } from "../../hooks/useBreakpoint.js";
@@ -7,16 +7,16 @@ import { useHover as D } from "../../hooks/useHover.js";
 import { useIcons as mt } from "../../hooks/useIcons.js";
 import { getColor as i } from "../../theme/currys/color.js";
 import { breakpoints as bt } from "../../theme/grid.js";
-import { isTest as pt, isProd as dt } from "../../utils/environment.js";
+import { isTest as dt, isProd as pt } from "../../utils/environment.js";
 import ft from "../Icons/ArrowRight.js";
 import t from "../Button/styles.module.scss";
-const ht = (e, r, n, d, s, g) => g && n ? !s || e ? i("neutral", r ? 500 : 700) : i("white") : n ? !s || e ? i("neutral", 500) : `${i("white")}b3` : e && !s || !e && s ? "white" : d === "normal" ? i("blueberry", 600) : i("cherry", 500), N = (e, r) => r && e ? v.Small : e ? v.Medium : v.XSmall, gt = (e, r, n) => {
+const ht = (e, r, n, p, a, g) => g && n ? !a || e ? i("neutral", r ? 500 : 700) : i("white") : n ? !a || e ? i("neutral", 500) : `${i("white")}b3` : e && !a || !e && a ? "white" : p === "normal" ? i("blueberry", 600) : i("cherry", 500), N = (e, r) => r && e ? v.Small : e ? v.Medium : v.XSmall, gt = (e, r, n) => {
   if (n && e && (r === void 0 || r === ""))
     throw new Error("Fyll inn ariaLabel prop på Button uten tekst for å opprettholde UU krav");
 }, _t = o.forwardRef(function(r, n) {
   const {
-    ariaLabel: d,
-    id: s,
+    ariaLabel: p,
+    id: a,
     children: g,
     wrapperClassName: O,
     className: X,
@@ -37,11 +37,11 @@ const ht = (e, r, n, d, s, g) => g && n ? !s || e ? i("neutral", r ? 500 : 700)
     target: U,
     type: J = "button",
     ...F
-  } = r, [u, m, H] = mt(o.Children.toArray(g)), { hoverRef: L, isHovered: K } = w === "button" ? D(n) : D(n), Q = lt(null), a = !!(u || m) && !H, M = u && (m || _) && !a, y = j === "ondark", h = ut() < bt.md, P = B === "destructive" && !f, Y = I === "outline", l = I === "borderless", T = ht(I === "fill", l, f, B, y, h), C = _ === "icon" && !l, b = q === "large" && !P && !l, Z = _ === "accessibility-character" && !A && !u && !m && !C && l, tt = { ...F }, V = p(
+  } = r, [u, m, H] = mt(o.Children.toArray(g)), { hoverRef: L, isHovered: K } = w === "button" ? D(n) : D(n), Q = lt(null), s = !!(u || m) && !H, M = u && (m || _) && !s, y = j === "ondark", h = ut() < bt.md, P = B === "destructive" && !f, Y = I === "outline", l = I === "borderless", T = ht(I === "fill", l, f, B, y, h), C = _ === "icon" && !l, b = q === "large" && !P && !l, Z = _ === "accessibility-character" && !A && !u && !m && !C && l, tt = { ...F }, V = d(
     t["button-wrapper"],
     { [t["button-wrapper--fluid"]]: A || R },
     O
-  ), ot = p(
+  ), ot = d(
     t.button,
     {
       [t["button--destructive"]]: P,
@@ -49,36 +49,36 @@ const ht = (e, r, n, d, s, g) => g && n ? !s || e ? i("neutral", r ? 500 : 700)
       [t["button--large"]]: b,
       [t["button--outline"]]: Y,
       [t["button--borderless"]]: l,
-      [t["button--left-icon"]]: u && !a,
-      [t["button--right-icon"]]: m && !a,
+      [t["button--left-icon"]]: u && !s,
+      [t["button--right-icon"]]: m && !s,
       [t["button--both-icons"]]: M,
-      [t["button--only-icon"]]: a,
+      [t["button--only-icon"]]: s,
       [t["button--arrow"]]: C,
       [t["button--on-dark"]]: y
     },
     X
-  ), et = p(t.button__text, {
+  ), et = d(t.button__text, {
     [t["button__text--ellipsis"]]: R
-  }), rt = p(t.diagonal, {
+  }), rt = d(t.diagonal, {
     [t["diagonal--on-dark"]]: y
   });
   ct(() => {
-    gt(a, d, !pt() && !dt());
+    gt(s, p, !dt() && !pt());
   }, []);
-  const k = (c, st, at) => c ? o.cloneElement(c, {
-    size: st,
+  const k = (c, at, st) => c ? o.cloneElement(c, {
+    size: at,
     color: c != null && c.props.color ? c.props.color : T,
     isHovered: K,
-    className: at
-  }) : null, nt = () => /* @__PURE__ */ o.createElement("span", { className: et, ref: Q }, f && l && /* @__PURE__ */ o.createElement("span", { className: rt }, /* @__PURE__ */ o.createElement("span", { className: t.diagonal__line })), /* @__PURE__ */ o.createElement("span", null, a ? d : H)), W = () => /* @__PURE__ */ o.createElement("span", { className: ot }, k(u, N(b, h), a ? void 0 : t["button__left-icon"]), nt(), C ? k(
+    className: st
+  }) : null, nt = () => /* @__PURE__ */ o.createElement("span", { className: et, ref: Q }, f && l && /* @__PURE__ */ o.createElement("span", { className: rt }, /* @__PURE__ */ o.createElement("span", { className: t.diagonal__line })), /* @__PURE__ */ o.createElement("span", null, s ? p : H)), W = () => /* @__PURE__ */ o.createElement("span", { className: ot }, k(u, N(b, h), s ? void 0 : t["button__left-icon"]), nt(), C ? k(
     /* @__PURE__ */ o.createElement(it, { svgIcon: ft }),
     N(b, h),
-    p(t.button__arrow, { [t["button__arrow--both-icons"]]: M })
-  ) : k(m, N(b, h), t["button__right-icon"]), Z && /* @__PURE__ */ o.createElement("span", { style: { color: T }, className: t["button__right-unicode-arrow"] }, "  →"));
+    d(t.button__arrow, { [t["button__arrow--both-icons"]]: M })
+  ) : k(m, N(b, h), t["button__right-icon"]), Z && /* @__PURE__ */ o.createElement("span", { style: { color: T }, className: t["button__right-unicode-arrow"], "aria-hidden": !0 }, "  →"));
   return /* @__PURE__ */ o.createElement(o.Fragment, null, w === "button" && /* @__PURE__ */ o.createElement(
     "button",
     {
-      id: s,
+      id: a,
       onBlur: E,
       onClick: x,
       disabled: f,
@@ -94,7 +94,7 @@ const ht = (e, r, n, d, s, g) => g && n ? !s || e ? i("neutral", r ? 500 : 700)
   ), w === "a" && /* @__PURE__ */ o.createElement(
     "a",
     {
-      id: s,
+      id: a,
       onBlur: E,
       onClick: x,
       "data-testid": z,

package/components/Button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { AriaAttributes, useEffect, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport Icon, { IconSize } from './../Icon';\nimport { HTMLButtonProps, HTMLAnchorProps, AnalyticsId } from '../../constants';\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { BaseIconElement, useIcons } from '../../hooks/useIcons';\nimport { getColor } from '../../theme/currys/color';\nimport { breakpoints } from '../../theme/grid';\nimport { isTest, isProd } from '../../utils/environment';\nimport ArrowRight from '../Icons/ArrowRight';\n\nimport buttonStyles from './styles.module.scss';\n\nexport type ButtonConcept = 'normal' | 'destructive';\nexport type ButtonVariant = 'fill' | 'outline' | 'borderless';\nexport type ButtonSize = 'medium' | 'large';\nexport type ButtonMode = 'onlight' | 'ondark';\nexport type ButtonTags = 'button' | 'a';\nexport type ButtonArrows = 'icon' | 'accessibility-character';\n\nexport interface ButtonProps extends HTMLButtonProps, HTMLAnchorProps, AriaAttributes {\n  /** Sets the aria-label of the button, use when the button only includes an icon */\n  ariaLabel?: string;\n  /** Gives a unique id to the button */\n  id?: string;\n  /** Sets the content of the button. */\n  children: React.ReactNode;\n  /** Adds custom classes to the wrapper element. */\n  wrapperClassName?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Enables an arrow icon to the right inside the button (Not available in borderless variant) */\n  arrow?: ButtonArrows;\n  /** Changes the intent of the button. Mostly changes the color profile. */\n  concept?: ButtonConcept;\n  /** Disables text wrapping and enables ellipsis. */\n  ellipsis?: boolean;\n  /** Makes the button scale to full width of its parent element. */\n  fluid?: boolean;\n  /** Changes the underlying element of the button. */\n  htmlMarkup?: ButtonTags;\n  /** Changes the button colors for different backgrounds. */\n  mode?: ButtonMode;\n  /** Function that is called when the Button loses focus */\n  onBlur?: () => void;\n  /** Function that is called when clicked */\n  onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent> | React.FormEvent<{}> | React.KeyboardEvent<HTMLUListElement> | null) => void;\n  /** Changes the button colors for different backgrounds. (Large not available in borderless variant) */\n  size?: ButtonSize;\n  /** Changes the visual representation of the button. */\n  variant?: ButtonVariant;\n  /** Specifies the focus order relative to the other buttons or controls on the page  */\n  tabIndex?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Button type. Default: button */\n  type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];\n}\n\nconst getIconColor = (\n  fill: boolean,\n  borderless: boolean,\n  disabled: boolean,\n  concept: ButtonConcept,\n  ondark: boolean,\n  mobile: boolean\n): string => {\n  if (mobile && disabled) {\n    return !ondark || fill ? getColor('neutral', !borderless ? 700 : 500) : getColor('white');\n  }\n  if (disabled) {\n    return !ondark || fill ? getColor('neutral', 500) : `${getColor('white')}b3`;\n  }\n  if ((fill && !ondark) || (!fill && ondark)) {\n    return 'white';\n  }\n\n  return concept === 'normal' ? getColor('blueberry', 600) : getColor('cherry', 500);\n};\nconst getLargeIconSize = (large: boolean, mobile: boolean): IconSize => {\n  if (mobile && large) return IconSize.Small;\n  if (large) return IconSize.Medium;\n  return IconSize.XSmall;\n};\n\nconst checkOnlyIconAria = (onlyIcon: boolean, ariaLabel: string | undefined, devEnv: boolean): void => {\n  if (devEnv && onlyIcon && (ariaLabel === undefined || ariaLabel === '')) {\n    throw new Error('Fyll inn ariaLabel prop på Button uten tekst for å opprettholde UU krav');\n  }\n};\n\nconst Button = React.forwardRef(function ButtonForwardedRef(\n  props: ButtonProps,\n  ref: React.ForwardedRef<HTMLButtonElement | HTMLAnchorElement>\n) {\n  const {\n    ariaLabel,\n    id,\n    children,\n    wrapperClassName,\n    className,\n    arrow,\n    concept = 'normal',\n    disabled = false,\n    ellipsis = false,\n    fluid = false,\n    htmlMarkup = 'button',\n    mode = 'onlight',\n    onBlur,\n    onClick,\n    size = 'medium',\n    variant = 'fill',\n    href,\n    tabIndex,\n    testId,\n    target,\n    type = 'button',\n    ...restProps\n  } = props;\n\n  const [leftIcon, rightIcon, restChildren] = useIcons(React.Children.toArray(children));\n  const { hoverRef, isHovered } =\n    htmlMarkup === 'button'\n      ? useHover<HTMLButtonElement>(ref as React.RefObject<HTMLButtonElement>)\n      : useHover<HTMLAnchorElement>(ref as React.RefObject<HTMLAnchorElement>);\n  const buttonContentRef = useRef<HTMLDivElement>(null);\n  const onlyIcon = !!(leftIcon || rightIcon) && !restChildren;\n  const bothIcons = leftIcon && (rightIcon || arrow) && !onlyIcon;\n  const onDark = mode === 'ondark';\n  const breakpoint = useBreakpoint();\n  const mobile = breakpoint < breakpoints.md;\n  const destructive = concept === 'destructive' && !disabled;\n  const outlineVariant = variant === 'outline';\n  const borderlessVariant = variant === 'borderless';\n  const iconColor = getIconColor(variant === 'fill', borderlessVariant, disabled, concept, onDark, mobile);\n  const hasArrow = arrow === 'icon' && !borderlessVariant;\n  const large = size === 'large' && !destructive && !borderlessVariant;\n  const hasUURightArrow = arrow === 'accessibility-character' && !fluid && !leftIcon && !rightIcon && !hasArrow && borderlessVariant;\n  const rest = { ...restProps };\n\n  const buttonWrapperClasses = classNames(\n    buttonStyles['button-wrapper'],\n    { [buttonStyles['button-wrapper--fluid']]: fluid || ellipsis },\n    wrapperClassName\n  );\n  const buttonClasses = classNames(\n    buttonStyles.button,\n    {\n      [buttonStyles['button--destructive']]: destructive,\n      [buttonStyles['button--normal']]: !large,\n      [buttonStyles['button--large']]: large,\n      [buttonStyles['button--outline']]: outlineVariant,\n      [buttonStyles['button--borderless']]: borderlessVariant,\n      [buttonStyles['button--left-icon']]: leftIcon && !onlyIcon,\n      [buttonStyles['button--right-icon']]: rightIcon && !onlyIcon,\n      [buttonStyles['button--both-icons']]: bothIcons,\n      [buttonStyles['button--only-icon']]: onlyIcon,\n      [buttonStyles['button--arrow']]: hasArrow,\n      [buttonStyles['button--on-dark']]: onDark,\n    },\n    className\n  );\n  const buttonTextClasses = classNames(buttonStyles['button__text'], {\n    [buttonStyles['button__text--ellipsis']]: ellipsis,\n  });\n  const diagonalClasses = classNames(buttonStyles['diagonal'], {\n    [buttonStyles['diagonal--on-dark']]: onDark,\n  });\n\n  useEffect(() => {\n    checkOnlyIconAria(onlyIcon, ariaLabel, !isTest() && !isProd());\n  }, []);\n\n  const renderIcon = (iconElement: BaseIconElement | null, iconSize: number, iconClassName?: string): BaseIconElement | null => {\n    return iconElement\n      ? React.cloneElement(iconElement, {\n          size: iconSize,\n          color: iconElement?.props.color ? iconElement.props.color : iconColor,\n          isHovered,\n          className: iconClassName,\n        })\n      : null;\n  };\n\n  const renderButtonContent = (): JSX.Element => {\n    return (\n      <span className={buttonTextClasses} ref={buttonContentRef}>\n        {disabled && borderlessVariant && (\n          <span className={diagonalClasses}>\n            <span className={buttonStyles['diagonal__line']} />\n          </span>\n        )}\n        <span>{onlyIcon ? ariaLabel : restChildren}</span>\n      </span>\n    );\n  };\n\n  const renderbuttonContentWrapper = (): JSX.Element => (\n    <span className={buttonClasses}>\n      {renderIcon(leftIcon, getLargeIconSize(large, mobile), !onlyIcon ? buttonStyles['button__left-icon'] : undefined)}\n      {renderButtonContent()}\n      {hasArrow\n        ? renderIcon(\n            <Icon svgIcon={ArrowRight} />,\n            getLargeIconSize(large, mobile),\n            classNames(buttonStyles['button__arrow'], { [buttonStyles['button__arrow--both-icons']]: bothIcons })\n          )\n        : renderIcon(rightIcon, getLargeIconSize(large, mobile), buttonStyles['button__right-icon'])}\n      {hasUURightArrow && (\n        <span style={{ color: iconColor }} className={buttonStyles['button__right-unicode-arrow']}>\n          {'  →'}\n        </span>\n      )}\n    </span>\n  );\n\n  return (\n    <>\n      {htmlMarkup === 'button' && (\n        <button\n          id={id}\n          onBlur={onBlur}\n          onClick={onClick}\n          disabled={disabled}\n          data-testid={testId}\n          data-analyticsid={AnalyticsId.Button}\n          className={buttonWrapperClasses}\n          ref={hoverRef as React.ForwardedRef<HTMLButtonElement>}\n          tabIndex={tabIndex}\n          type={type}\n          {...rest}\n        >\n          {renderbuttonContentWrapper()}\n        </button>\n      )}\n      {htmlMarkup === 'a' && (\n        <a\n          id={id}\n          onBlur={onBlur}\n          onClick={onClick}\n          data-testid={testId}\n          data-analyticsid={AnalyticsId.Button}\n          className={buttonWrapperClasses}\n          href={href}\n          target={target}\n          rel={target === '_blank' ? 'noopener noreferrer' : props.rel}\n          ref={hoverRef as React.ForwardedRef<HTMLAnchorElement>}\n          tabIndex={tabIndex}\n          {...restProps}\n        >\n          {renderbuttonContentWrapper()}\n        </a>\n      )}\n    </>\n  );\n});\n\nexport default Button;\n"],"names":["getIconColor","fill","borderless","disabled","concept","ondark","mobile","getColor","getLargeIconSize","large","IconSize","checkOnlyIconAria","onlyIcon","ariaLabel","devEnv","Button","React","props","ref","id","children","wrapperClassName","className","arrow","ellipsis","fluid","htmlMarkup","mode","onBlur","onClick","size","variant","href","tabIndex","testId","target","type","restProps","leftIcon","rightIcon","restChildren","useIcons","hoverRef","isHovered","useHover","buttonContentRef","useRef","bothIcons","onDark","useBreakpoint","breakpoints","destructive","outlineVariant","borderlessVariant","iconColor","hasArrow","hasUURightArrow","rest","buttonWrapperClasses","classNames","buttonStyles","buttonClasses","buttonTextClasses","diagonalClasses","useEffect","isTest","isProd","renderIcon","iconElement","iconSize","iconClassName","renderButtonContent","renderbuttonContentWrapper","Icon","ArrowRight","AnalyticsId","Button$1"],"mappings":";;;;;;;;;;;;AA8DA,MAAMA,KAAe,CACnBC,GACAC,GACAC,GACAC,GACAC,GACAC,MAEIA,KAAUH,IACL,CAACE,KAAUJ,IAAOM,EAAS,WAAYL,IAAmB,MAAN,GAAS,IAAIK,EAAS,OAAO,IAEtFJ,IACK,CAACE,KAAUJ,IAAOM,EAAS,WAAW,GAAG,IAAI,GAAGA,EAAS,OAAO,CAAC,OAErEN,KAAQ,CAACI,KAAY,CAACJ,KAAQI,IAC1B,UAGFD,MAAY,WAAWG,EAAS,aAAa,GAAG,IAAIA,EAAS,UAAU,GAAG,GAE7EC,IAAmB,CAACC,GAAgBH,MACpCA,KAAUG,IAAcC,EAAS,QACjCD,IAAcC,EAAS,SACpBA,EAAS,QAGZC,KAAoB,CAACC,GAAmBC,GAA+BC,MAA0B;AACrG,MAAIA,KAAUF,MAAaC,MAAc,UAAaA,MAAc;AAC5D,UAAA,IAAI,MAAM,yEAAyE;AAE7F,GAEME,KAASC,EAAM,WAAW,SAC9BC,GACAC,GACA;AACM,QAAA;AAAA,IACJ,WAAAL;AAAA,IACA,IAAAM;AAAA,IACA,UAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAnB,IAAU;AAAA,IACV,UAAAD,IAAW;AAAA,IACX,UAAAqB,IAAW;AAAA,IACX,OAAAC,IAAQ;AAAA,IACR,YAAAC,IAAa;AAAA,IACb,MAAAC,IAAO;AAAA,IACP,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,SAAAC,IAAU;AAAA,IACV,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,GAAGC;AAAA,EACD,IAAApB,GAEE,CAACqB,GAAUC,GAAWC,CAAY,IAAIC,GAASzB,EAAM,SAAS,QAAQI,CAAQ,CAAC,GAC/E,EAAE,UAAAsB,GAAU,WAAAC,EAChB,IAAAjB,MAAe,WACXkB,EAA4B1B,CAAyC,IACrE0B,EAA4B1B,CAAyC,GACrE2B,IAAmBC,GAAuB,IAAI,GAC9ClC,IAAW,CAAC,EAAE0B,KAAYC,MAAc,CAACC,GACzCO,IAAYT,MAAaC,KAAahB,MAAU,CAACX,GACjDoC,IAASrB,MAAS,UAElBrB,IADa2C,OACSC,GAAY,IAClCC,IAAc/C,MAAY,iBAAiB,CAACD,GAC5CiD,IAAiBrB,MAAY,WAC7BsB,IAAoBtB,MAAY,cAChCuB,IAAYtD,GAAa+B,MAAY,QAAQsB,GAAmBlD,GAAUC,GAAS4C,GAAQ1C,CAAM,GACjGiD,IAAWhC,MAAU,UAAU,CAAC8B,GAChC5C,IAAQqB,MAAS,WAAW,CAACqB,KAAe,CAACE,GAC7CG,IAAkBjC,MAAU,6BAA6B,CAACE,KAAS,CAACa,KAAY,CAACC,KAAa,CAACgB,KAAYF,GAC3GI,KAAO,EAAE,GAAGpB,KAEZqB,IAAuBC;AAAA,IAC3BC,EAAa,gBAAgB;AAAA,IAC7B,EAAE,CAACA,EAAa,uBAAuB,CAAC,GAAGnC,KAASD,EAAS;AAAA,IAC7DH;AAAA,EAAA,GAEIwC,KAAgBF;AAAA,IACpBC,EAAa;AAAA,IACb;AAAA,MACE,CAACA,EAAa,qBAAqB,CAAC,GAAGT;AAAA,MACvC,CAACS,EAAa,gBAAgB,CAAC,GAAG,CAACnD;AAAA,MACnC,CAACmD,EAAa,eAAe,CAAC,GAAGnD;AAAA,MACjC,CAACmD,EAAa,iBAAiB,CAAC,GAAGR;AAAA,MACnC,CAACQ,EAAa,oBAAoB,CAAC,GAAGP;AAAA,MACtC,CAACO,EAAa,mBAAmB,CAAC,GAAGtB,KAAY,CAAC1B;AAAA,MAClD,CAACgD,EAAa,oBAAoB,CAAC,GAAGrB,KAAa,CAAC3B;AAAA,MACpD,CAACgD,EAAa,oBAAoB,CAAC,GAAGb;AAAA,MACtC,CAACa,EAAa,mBAAmB,CAAC,GAAGhD;AAAA,MACrC,CAACgD,EAAa,eAAe,CAAC,GAAGL;AAAA,MACjC,CAACK,EAAa,iBAAiB,CAAC,GAAGZ;AAAA,IACrC;AAAA,IACA1B;AAAA,EAAA,GAEIwC,KAAoBH,EAAWC,EAAa,cAAiB;AAAA,IACjE,CAACA,EAAa,wBAAwB,CAAC,GAAGpC;AAAA,EAAA,CAC3C,GACKuC,KAAkBJ,EAAWC,EAAa,UAAa;AAAA,IAC3D,CAACA,EAAa,mBAAmB,CAAC,GAAGZ;AAAA,EAAA,CACtC;AAED,EAAAgB,GAAU,MAAM;AACd,IAAArD,GAAkBC,GAAUC,GAAW,CAACoD,QAAY,CAACC,IAAQ;AAAA,EAC/D,GAAG,CAAE,CAAA;AAEL,QAAMC,IAAa,CAACC,GAAqCC,IAAkBC,OAClEF,IACHpD,EAAM,aAAaoD,GAAa;AAAA,IAC9B,MAAMC;AAAA,IACN,OAAOD,KAAA,QAAAA,EAAa,MAAM,QAAQA,EAAY,MAAM,QAAQd;AAAA,IAC5D,WAAAX;AAAA,IACA,WAAW2B;AAAA,EACZ,CAAA,IACD,MAGAC,KAAsB,MAExBvD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAW8C,IAAmB,KAAKjB,KACtC1C,KAAYkD,KACVrC,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAW+C,GAAA,mCACd,QAAK,EAAA,WAAWH,EAAa,gBAAmB,CACnD,GAEF5C,gBAAAA,EAAA,cAAC,QAAM,MAAAJ,IAAWC,IAAY2B,CAAa,CAC7C,GAIEgC,IAA6B,MAChCxD,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAW6C,GACd,GAAAM,EAAW7B,GAAU9B,EAAiBC,GAAOH,CAAM,GAAIM,IAA+C,SAApCgD,EAAa,mBAAmB,CAAa,GAC/GW,MACAhB,IACGY;AAAA,IACEnD,gBAAAA,EAAA,cAACyD,IAAK,EAAA,SAASC,GAAY,CAAA;AAAA,IAC3BlE,EAAiBC,GAAOH,CAAM;AAAA,IAC9BqD,EAAWC,EAAa,eAAkB,EAAE,CAACA,EAAa,2BAA2B,CAAC,GAAGb,GAAW;AAAA,EACtG,IACAoB,EAAW5B,GAAW/B,EAAiBC,GAAOH,CAAM,GAAGsD,EAAa,oBAAoB,CAAC,GAC5FJ,qCACE,QAAK,EAAA,OAAO,EAAE,OAAOF,EAAU,GAAG,WAAWM,EAAa,6BAA6B,KACrF,KACH,CAEJ;AAIA,SAAA5C,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACGU,MAAe,YACdV,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAG;AAAA,MACA,QAAAS;AAAA,MACA,SAAAC;AAAA,MACA,UAAA1B;AAAA,MACA,eAAa+B;AAAA,MACb,oBAAkByC,EAAY;AAAA,MAC9B,WAAWjB;AAAA,MACX,KAAKhB;AAAA,MACL,UAAAT;AAAA,MACA,MAAAG;AAAA,MACC,GAAGqB;AAAA,IAAA;AAAA,IAEHe,EAA2B;AAAA,EAAA,GAG/B9C,MAAe,OACdV,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAG;AAAA,MACA,QAAAS;AAAA,MACA,SAAAC;AAAA,MACA,eAAaK;AAAA,MACb,oBAAkByC,EAAY;AAAA,MAC9B,WAAWjB;AAAA,MACX,MAAA1B;AAAA,MACA,QAAAG;AAAA,MACA,KAAKA,MAAW,WAAW,wBAAwBlB,EAAM;AAAA,MACzD,KAAKyB;AAAA,MACL,UAAAT;AAAA,MACC,GAAGI;AAAA,IAAA;AAAA,IAEHmC,EAA2B;AAAA,EAAA,CAGlC;AAEJ,CAAC,GAEDI,KAAe7D;"}
+{"version":3,"file":"Button.js","sources":["../../../src/components/Button/Button.tsx"],"sourcesContent":["import React, { AriaAttributes, useEffect, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport Icon, { IconSize } from './../Icon';\nimport { HTMLButtonProps, HTMLAnchorProps, AnalyticsId } from '../../constants';\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { BaseIconElement, useIcons } from '../../hooks/useIcons';\nimport { getColor } from '../../theme/currys/color';\nimport { breakpoints } from '../../theme/grid';\nimport { isTest, isProd } from '../../utils/environment';\nimport ArrowRight from '../Icons/ArrowRight';\n\nimport buttonStyles from './styles.module.scss';\n\nexport type ButtonConcept = 'normal' | 'destructive';\nexport type ButtonVariant = 'fill' | 'outline' | 'borderless';\nexport type ButtonSize = 'medium' | 'large';\nexport type ButtonMode = 'onlight' | 'ondark';\nexport type ButtonTags = 'button' | 'a';\nexport type ButtonArrows = 'icon' | 'accessibility-character';\n\nexport interface ButtonProps extends HTMLButtonProps, HTMLAnchorProps, AriaAttributes {\n  /** Sets the aria-label of the button, use when the button only includes an icon */\n  ariaLabel?: string;\n  /** Gives a unique id to the button */\n  id?: string;\n  /** Sets the content of the button. */\n  children: React.ReactNode;\n  /** Adds custom classes to the wrapper element. */\n  wrapperClassName?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Enables an arrow icon to the right inside the button (Not available in borderless variant) */\n  arrow?: ButtonArrows;\n  /** Changes the intent of the button. Mostly changes the color profile. */\n  concept?: ButtonConcept;\n  /** Disables text wrapping and enables ellipsis. */\n  ellipsis?: boolean;\n  /** Makes the button scale to full width of its parent element. */\n  fluid?: boolean;\n  /** Changes the underlying element of the button. */\n  htmlMarkup?: ButtonTags;\n  /** Changes the button colors for different backgrounds. */\n  mode?: ButtonMode;\n  /** Function that is called when the Button loses focus */\n  onBlur?: () => void;\n  /** Function that is called when clicked */\n  onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent> | React.FormEvent<{}> | React.KeyboardEvent<HTMLUListElement> | null) => void;\n  /** Changes the button colors for different backgrounds. (Large not available in borderless variant) */\n  size?: ButtonSize;\n  /** Changes the visual representation of the button. */\n  variant?: ButtonVariant;\n  /** Specifies the focus order relative to the other buttons or controls on the page  */\n  tabIndex?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Button type. Default: button */\n  type?: React.ButtonHTMLAttributes<HTMLButtonElement>['type'];\n}\n\nconst getIconColor = (\n  fill: boolean,\n  borderless: boolean,\n  disabled: boolean,\n  concept: ButtonConcept,\n  ondark: boolean,\n  mobile: boolean\n): string => {\n  if (mobile && disabled) {\n    return !ondark || fill ? getColor('neutral', !borderless ? 700 : 500) : getColor('white');\n  }\n  if (disabled) {\n    return !ondark || fill ? getColor('neutral', 500) : `${getColor('white')}b3`;\n  }\n  if ((fill && !ondark) || (!fill && ondark)) {\n    return 'white';\n  }\n\n  return concept === 'normal' ? getColor('blueberry', 600) : getColor('cherry', 500);\n};\nconst getLargeIconSize = (large: boolean, mobile: boolean): IconSize => {\n  if (mobile && large) return IconSize.Small;\n  if (large) return IconSize.Medium;\n  return IconSize.XSmall;\n};\n\nconst checkOnlyIconAria = (onlyIcon: boolean, ariaLabel: string | undefined, devEnv: boolean): void => {\n  if (devEnv && onlyIcon && (ariaLabel === undefined || ariaLabel === '')) {\n    throw new Error('Fyll inn ariaLabel prop på Button uten tekst for å opprettholde UU krav');\n  }\n};\n\nconst Button = React.forwardRef(function ButtonForwardedRef(\n  props: ButtonProps,\n  ref: React.ForwardedRef<HTMLButtonElement | HTMLAnchorElement>\n) {\n  const {\n    ariaLabel,\n    id,\n    children,\n    wrapperClassName,\n    className,\n    arrow,\n    concept = 'normal',\n    disabled = false,\n    ellipsis = false,\n    fluid = false,\n    htmlMarkup = 'button',\n    mode = 'onlight',\n    onBlur,\n    onClick,\n    size = 'medium',\n    variant = 'fill',\n    href,\n    tabIndex,\n    testId,\n    target,\n    type = 'button',\n    ...restProps\n  } = props;\n\n  const [leftIcon, rightIcon, restChildren] = useIcons(React.Children.toArray(children));\n  const { hoverRef, isHovered } =\n    htmlMarkup === 'button'\n      ? useHover<HTMLButtonElement>(ref as React.RefObject<HTMLButtonElement>)\n      : useHover<HTMLAnchorElement>(ref as React.RefObject<HTMLAnchorElement>);\n  const buttonContentRef = useRef<HTMLDivElement>(null);\n  const onlyIcon = !!(leftIcon || rightIcon) && !restChildren;\n  const bothIcons = leftIcon && (rightIcon || arrow) && !onlyIcon;\n  const onDark = mode === 'ondark';\n  const breakpoint = useBreakpoint();\n  const mobile = breakpoint < breakpoints.md;\n  const destructive = concept === 'destructive' && !disabled;\n  const outlineVariant = variant === 'outline';\n  const borderlessVariant = variant === 'borderless';\n  const iconColor = getIconColor(variant === 'fill', borderlessVariant, disabled, concept, onDark, mobile);\n  const hasArrow = arrow === 'icon' && !borderlessVariant;\n  const large = size === 'large' && !destructive && !borderlessVariant;\n  const hasUURightArrow = arrow === 'accessibility-character' && !fluid && !leftIcon && !rightIcon && !hasArrow && borderlessVariant;\n  const rest = { ...restProps };\n\n  const buttonWrapperClasses = classNames(\n    buttonStyles['button-wrapper'],\n    { [buttonStyles['button-wrapper--fluid']]: fluid || ellipsis },\n    wrapperClassName\n  );\n  const buttonClasses = classNames(\n    buttonStyles.button,\n    {\n      [buttonStyles['button--destructive']]: destructive,\n      [buttonStyles['button--normal']]: !large,\n      [buttonStyles['button--large']]: large,\n      [buttonStyles['button--outline']]: outlineVariant,\n      [buttonStyles['button--borderless']]: borderlessVariant,\n      [buttonStyles['button--left-icon']]: leftIcon && !onlyIcon,\n      [buttonStyles['button--right-icon']]: rightIcon && !onlyIcon,\n      [buttonStyles['button--both-icons']]: bothIcons,\n      [buttonStyles['button--only-icon']]: onlyIcon,\n      [buttonStyles['button--arrow']]: hasArrow,\n      [buttonStyles['button--on-dark']]: onDark,\n    },\n    className\n  );\n  const buttonTextClasses = classNames(buttonStyles['button__text'], {\n    [buttonStyles['button__text--ellipsis']]: ellipsis,\n  });\n  const diagonalClasses = classNames(buttonStyles['diagonal'], {\n    [buttonStyles['diagonal--on-dark']]: onDark,\n  });\n\n  useEffect(() => {\n    checkOnlyIconAria(onlyIcon, ariaLabel, !isTest() && !isProd());\n  }, []);\n\n  const renderIcon = (iconElement: BaseIconElement | null, iconSize: number, iconClassName?: string): BaseIconElement | null => {\n    return iconElement\n      ? React.cloneElement(iconElement, {\n          size: iconSize,\n          color: iconElement?.props.color ? iconElement.props.color : iconColor,\n          isHovered,\n          className: iconClassName,\n        })\n      : null;\n  };\n\n  const renderButtonContent = (): JSX.Element => {\n    return (\n      <span className={buttonTextClasses} ref={buttonContentRef}>\n        {disabled && borderlessVariant && (\n          <span className={diagonalClasses}>\n            <span className={buttonStyles['diagonal__line']} />\n          </span>\n        )}\n        <span>{onlyIcon ? ariaLabel : restChildren}</span>\n      </span>\n    );\n  };\n\n  const renderbuttonContentWrapper = (): JSX.Element => (\n    <span className={buttonClasses}>\n      {renderIcon(leftIcon, getLargeIconSize(large, mobile), !onlyIcon ? buttonStyles['button__left-icon'] : undefined)}\n      {renderButtonContent()}\n      {hasArrow\n        ? renderIcon(\n            <Icon svgIcon={ArrowRight} />,\n            getLargeIconSize(large, mobile),\n            classNames(buttonStyles['button__arrow'], { [buttonStyles['button__arrow--both-icons']]: bothIcons })\n          )\n        : renderIcon(rightIcon, getLargeIconSize(large, mobile), buttonStyles['button__right-icon'])}\n      {hasUURightArrow && (\n        <span style={{ color: iconColor }} className={buttonStyles['button__right-unicode-arrow']} aria-hidden>\n          {'  →'}\n        </span>\n      )}\n    </span>\n  );\n\n  return (\n    <>\n      {htmlMarkup === 'button' && (\n        <button\n          id={id}\n          onBlur={onBlur}\n          onClick={onClick}\n          disabled={disabled}\n          data-testid={testId}\n          data-analyticsid={AnalyticsId.Button}\n          className={buttonWrapperClasses}\n          ref={hoverRef as React.ForwardedRef<HTMLButtonElement>}\n          tabIndex={tabIndex}\n          type={type}\n          {...rest}\n        >\n          {renderbuttonContentWrapper()}\n        </button>\n      )}\n      {htmlMarkup === 'a' && (\n        <a\n          id={id}\n          onBlur={onBlur}\n          onClick={onClick}\n          data-testid={testId}\n          data-analyticsid={AnalyticsId.Button}\n          className={buttonWrapperClasses}\n          href={href}\n          target={target}\n          rel={target === '_blank' ? 'noopener noreferrer' : props.rel}\n          ref={hoverRef as React.ForwardedRef<HTMLAnchorElement>}\n          tabIndex={tabIndex}\n          {...restProps}\n        >\n          {renderbuttonContentWrapper()}\n        </a>\n      )}\n    </>\n  );\n});\n\nexport default Button;\n"],"names":["getIconColor","fill","borderless","disabled","concept","ondark","mobile","getColor","getLargeIconSize","large","IconSize","checkOnlyIconAria","onlyIcon","ariaLabel","devEnv","Button","React","props","ref","id","children","wrapperClassName","className","arrow","ellipsis","fluid","htmlMarkup","mode","onBlur","onClick","size","variant","href","tabIndex","testId","target","type","restProps","leftIcon","rightIcon","restChildren","useIcons","hoverRef","isHovered","useHover","buttonContentRef","useRef","bothIcons","onDark","useBreakpoint","breakpoints","destructive","outlineVariant","borderlessVariant","iconColor","hasArrow","hasUURightArrow","rest","buttonWrapperClasses","classNames","buttonStyles","buttonClasses","buttonTextClasses","diagonalClasses","useEffect","isTest","isProd","renderIcon","iconElement","iconSize","iconClassName","renderButtonContent","renderbuttonContentWrapper","Icon","ArrowRight","AnalyticsId","Button$1"],"mappings":";;;;;;;;;;;;AA8DA,MAAMA,KAAe,CACnBC,GACAC,GACAC,GACAC,GACAC,GACAC,MAEIA,KAAUH,IACL,CAACE,KAAUJ,IAAOM,EAAS,WAAYL,IAAmB,MAAN,GAAS,IAAIK,EAAS,OAAO,IAEtFJ,IACK,CAACE,KAAUJ,IAAOM,EAAS,WAAW,GAAG,IAAI,GAAGA,EAAS,OAAO,CAAC,OAErEN,KAAQ,CAACI,KAAY,CAACJ,KAAQI,IAC1B,UAGFD,MAAY,WAAWG,EAAS,aAAa,GAAG,IAAIA,EAAS,UAAU,GAAG,GAE7EC,IAAmB,CAACC,GAAgBH,MACpCA,KAAUG,IAAcC,EAAS,QACjCD,IAAcC,EAAS,SACpBA,EAAS,QAGZC,KAAoB,CAACC,GAAmBC,GAA+BC,MAA0B;AACrG,MAAIA,KAAUF,MAAaC,MAAc,UAAaA,MAAc;AAC5D,UAAA,IAAI,MAAM,yEAAyE;AAE7F,GAEME,KAASC,EAAM,WAAW,SAC9BC,GACAC,GACA;AACM,QAAA;AAAA,IACJ,WAAAL;AAAA,IACA,IAAAM;AAAA,IACA,UAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAnB,IAAU;AAAA,IACV,UAAAD,IAAW;AAAA,IACX,UAAAqB,IAAW;AAAA,IACX,OAAAC,IAAQ;AAAA,IACR,YAAAC,IAAa;AAAA,IACb,MAAAC,IAAO;AAAA,IACP,QAAAC;AAAA,IACA,SAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,SAAAC,IAAU;AAAA,IACV,MAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,QAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,GAAGC;AAAA,EACD,IAAApB,GAEE,CAACqB,GAAUC,GAAWC,CAAY,IAAIC,GAASzB,EAAM,SAAS,QAAQI,CAAQ,CAAC,GAC/E,EAAE,UAAAsB,GAAU,WAAAC,EAChB,IAAAjB,MAAe,WACXkB,EAA4B1B,CAAyC,IACrE0B,EAA4B1B,CAAyC,GACrE2B,IAAmBC,GAAuB,IAAI,GAC9ClC,IAAW,CAAC,EAAE0B,KAAYC,MAAc,CAACC,GACzCO,IAAYT,MAAaC,KAAahB,MAAU,CAACX,GACjDoC,IAASrB,MAAS,UAElBrB,IADa2C,OACSC,GAAY,IAClCC,IAAc/C,MAAY,iBAAiB,CAACD,GAC5CiD,IAAiBrB,MAAY,WAC7BsB,IAAoBtB,MAAY,cAChCuB,IAAYtD,GAAa+B,MAAY,QAAQsB,GAAmBlD,GAAUC,GAAS4C,GAAQ1C,CAAM,GACjGiD,IAAWhC,MAAU,UAAU,CAAC8B,GAChC5C,IAAQqB,MAAS,WAAW,CAACqB,KAAe,CAACE,GAC7CG,IAAkBjC,MAAU,6BAA6B,CAACE,KAAS,CAACa,KAAY,CAACC,KAAa,CAACgB,KAAYF,GAC3GI,KAAO,EAAE,GAAGpB,KAEZqB,IAAuBC;AAAA,IAC3BC,EAAa,gBAAgB;AAAA,IAC7B,EAAE,CAACA,EAAa,uBAAuB,CAAC,GAAGnC,KAASD,EAAS;AAAA,IAC7DH;AAAA,EAAA,GAEIwC,KAAgBF;AAAA,IACpBC,EAAa;AAAA,IACb;AAAA,MACE,CAACA,EAAa,qBAAqB,CAAC,GAAGT;AAAA,MACvC,CAACS,EAAa,gBAAgB,CAAC,GAAG,CAACnD;AAAA,MACnC,CAACmD,EAAa,eAAe,CAAC,GAAGnD;AAAA,MACjC,CAACmD,EAAa,iBAAiB,CAAC,GAAGR;AAAA,MACnC,CAACQ,EAAa,oBAAoB,CAAC,GAAGP;AAAA,MACtC,CAACO,EAAa,mBAAmB,CAAC,GAAGtB,KAAY,CAAC1B;AAAA,MAClD,CAACgD,EAAa,oBAAoB,CAAC,GAAGrB,KAAa,CAAC3B;AAAA,MACpD,CAACgD,EAAa,oBAAoB,CAAC,GAAGb;AAAA,MACtC,CAACa,EAAa,mBAAmB,CAAC,GAAGhD;AAAA,MACrC,CAACgD,EAAa,eAAe,CAAC,GAAGL;AAAA,MACjC,CAACK,EAAa,iBAAiB,CAAC,GAAGZ;AAAA,IACrC;AAAA,IACA1B;AAAA,EAAA,GAEIwC,KAAoBH,EAAWC,EAAa,cAAiB;AAAA,IACjE,CAACA,EAAa,wBAAwB,CAAC,GAAGpC;AAAA,EAAA,CAC3C,GACKuC,KAAkBJ,EAAWC,EAAa,UAAa;AAAA,IAC3D,CAACA,EAAa,mBAAmB,CAAC,GAAGZ;AAAA,EAAA,CACtC;AAED,EAAAgB,GAAU,MAAM;AACd,IAAArD,GAAkBC,GAAUC,GAAW,CAACoD,QAAY,CAACC,IAAQ;AAAA,EAC/D,GAAG,CAAE,CAAA;AAEL,QAAMC,IAAa,CAACC,GAAqCC,IAAkBC,OAClEF,IACHpD,EAAM,aAAaoD,GAAa;AAAA,IAC9B,MAAMC;AAAA,IACN,OAAOD,KAAA,QAAAA,EAAa,MAAM,QAAQA,EAAY,MAAM,QAAQd;AAAA,IAC5D,WAAAX;AAAA,IACA,WAAW2B;AAAA,EACZ,CAAA,IACD,MAGAC,KAAsB,MAExBvD,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAW8C,IAAmB,KAAKjB,KACtC1C,KAAYkD,KACVrC,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAW+C,GAAA,mCACd,QAAK,EAAA,WAAWH,EAAa,gBAAmB,CACnD,GAEF5C,gBAAAA,EAAA,cAAC,QAAM,MAAAJ,IAAWC,IAAY2B,CAAa,CAC7C,GAIEgC,IAA6B,MAChCxD,gBAAAA,EAAA,cAAA,QAAA,EAAK,WAAW6C,GACd,GAAAM,EAAW7B,GAAU9B,EAAiBC,GAAOH,CAAM,GAAIM,IAA+C,SAApCgD,EAAa,mBAAmB,CAAa,GAC/GW,MACAhB,IACGY;AAAA,IACEnD,gBAAAA,EAAA,cAACyD,IAAK,EAAA,SAASC,GAAY,CAAA;AAAA,IAC3BlE,EAAiBC,GAAOH,CAAM;AAAA,IAC9BqD,EAAWC,EAAa,eAAkB,EAAE,CAACA,EAAa,2BAA2B,CAAC,GAAGb,GAAW;AAAA,EACtG,IACAoB,EAAW5B,GAAW/B,EAAiBC,GAAOH,CAAM,GAAGsD,EAAa,oBAAoB,CAAC,GAC5FJ,KACCxC,gBAAAA,EAAA,cAAC,UAAK,OAAO,EAAE,OAAOsC,EAAA,GAAa,WAAWM,EAAa,6BAA6B,GAAG,eAAW,MACnG,KACH,CAEJ;AAIA,SAAA5C,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MACGU,MAAe,YACdV,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAG;AAAA,MACA,QAAAS;AAAA,MACA,SAAAC;AAAA,MACA,UAAA1B;AAAA,MACA,eAAa+B;AAAA,MACb,oBAAkByC,EAAY;AAAA,MAC9B,WAAWjB;AAAA,MACX,KAAKhB;AAAA,MACL,UAAAT;AAAA,MACA,MAAAG;AAAA,MACC,GAAGqB;AAAA,IAAA;AAAA,IAEHe,EAA2B;AAAA,EAAA,GAG/B9C,MAAe,OACdV,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAG;AAAA,MACA,QAAAS;AAAA,MACA,SAAAC;AAAA,MACA,eAAaK;AAAA,MACb,oBAAkByC,EAAY;AAAA,MAC9B,WAAWjB;AAAA,MACX,MAAA1B;AAAA,MACA,QAAAG;AAAA,MACA,KAAKA,MAAW,WAAW,wBAAwBlB,EAAM;AAAA,MACzD,KAAKyB;AAAA,MACL,UAAAT;AAAA,MACC,GAAGI;AAAA,IAAA;AAAA,IAEHmC,EAA2B;AAAA,EAAA,CAGlC;AAEJ,CAAC,GAEDI,KAAe7D;"}

package/components/Checkbox/Checkbox.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Checkbox").CheckboxProps & React.RefAttributes<HTMLInputElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Close/Close.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Close").CloseProps & React.RefAttributes<HTMLButtonElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/DictionaryTrigger/DictionaryTrigger.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./DictionaryTrigger").DictionaryTriggerProps & React.RefAttributes<HTMLButtonElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Dropdown/Dropdown.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./Dropdown").DropdownProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Duolist/Duolist.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Duolist").DuolistProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Duolist/styles.module.scss

@@ -25,25 +25,6 @@
     font-size: $font-size-md;
   }
 
-  &__dt,
-  &__dd {
-    line-height: $lineheight-size-md;
-    padding-bottom: getSpacer(2xs);
-
-    &:last-of-type {
-      padding-bottom: 0;
-    }
-
-    &--bold {
-      font-weight: 600;
-      line-height: $lineheight-size-sm;
-    }
-
-    &--non-formatted {
-      display: inline;
-    }
-  }
-
   &__dt {
     padding-right: getSpacer(l);
 
@@ -64,6 +45,25 @@
     margin-inline-start: 0;
   }
 
+  &__dt,
+  &__dd {
+    line-height: $lineheight-size-md;
+    padding-bottom: getSpacer(2xs);
+
+    &:last-of-type {
+      padding-bottom: 0;
+    }
+
+    &--bold {
+      font-weight: 600;
+      line-height: $lineheight-size-sm;
+    }
+
+    &--non-formatted {
+      display: inline;
+    }
+  }
+
   &--line &__dt,
   &--line &__dd {
     padding-top: getSpacer(2xs);

package/components/EmptyState/EmptyState.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./EmptyState").EmptyStateProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Expander/Expander.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./Expander").ExpanderProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Expander/styles.module.scss

@@ -34,6 +34,19 @@
     }
   }
 
+  &__button,
+  &__trigger {
+    &--sticky {
+      position: fixed;
+      top: 0;
+    }
+
+    &--absolute {
+      position: absolute;
+      bottom: 0;
+    }
+  }
+
   &__button {
     position: relative;
     padding-right: getSpacer(s);
@@ -134,19 +147,6 @@
     }
   }
 
-  &__button,
-  &__trigger {
-    &--sticky {
-      position: fixed;
-      top: 0;
-    }
-
-    &--absolute {
-      position: absolute;
-      bottom: 0;
-    }
-  }
-
   &__content {
     $content: &;
 

package/components/ExpanderHierarchy/ExpanderHierarchy.stories.d.ts

@@ -10,6 +10,7 @@ declare const meta: {
     component: import("./ExpanderHierarchy").ExpanderHierarchyCompound;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/ExpanderList/ExpanderList.stories.d.ts

@@ -1,9 +1,11 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: import("./ExpanderList").ExpanderListCompound;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/FormGroup/FormGroup.stories.d.ts

@@ -7,6 +7,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./FormGroup").FormGroupProps & React.RefAttributes<HTMLDivElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/FormLayout/FormLayout.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./FormLayout").FormLayoutProps & React.RefAttributes<HTMLDivElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/HelpBubble/HelpBubble.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./HelpBubble").HelpBubbleProps & React.RefAttributes<HTMLDivElement | SVGSVGElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/HelpPanel/HelpPanel.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./HelpPanel").HelpPanelProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/HelpQuestion/HelpQuestion.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./HelpQuestion").HelpQuestionProps & React.RefAttributes<HTMLButtonElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/HighlightBox/HighlightBox.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./HighlightBox").HighlightBoxProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/HorizontalScroll/styles.module.scss

@@ -1,6 +1,8 @@
 @import '../../scss/breakpoints';
 @import '../../scss/palette';
 
+// Disables fordi stylelint og prettier er uenige
+/* stylelint-disable-next-line scss/dollar-variable-colon-space-after */
 $gradient:
   rgb(0 0 0 / 27%),
   rgb(0 0 0 / 27%) 18%,

package/components/Icon/Icon.stories.d.ts

@@ -7,6 +7,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Icon").IconProps & React.RefAttributes<SVGSVGElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Illustration/Illustration.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Illustration").IllustrationProps & React.RefAttributes<SVGSVGElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Illustration/Illustrations.stories.d.ts

@@ -9,6 +9,7 @@ declare const meta: {
     component: React.FC<import("../LazyIllustration").LazyIllustrationProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Input/Input.stories.d.ts

@@ -10,6 +10,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Label/Label.stories.d.ts

@@ -9,6 +9,7 @@ declare const meta: {
     component: React.FunctionComponent<import("./Label").LabelProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/LazyIcon/LazyIcon.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./LazyIcon").LazyIconProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/LazyIllustration/LazyIllustration.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./LazyIllustration").LazyIllustrationProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/LinkList/LinkList.stories.d.ts

@@ -1,9 +1,11 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: import("./LinkList").CompoundComponent;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/List/styles.module.scss

@@ -20,6 +20,8 @@
 
         > #{$list}__item {
           > #{$list}--bullet {
+            // for å beholde utseende disables warning på whitespace her
+            /* stylelint-disable-next-line no-irregular-whitespace */
             list-style-type: '⬥ ';
 
             > #{$list}__item {
@@ -28,6 +30,8 @@
               }
 
               > #{$list}--bullet {
+                // for å beholde utseende disables warning på whitespace her
+                /* stylelint-disable-next-line no-irregular-whitespace */
                 list-style-type: '– ';
               }
             }
@@ -38,6 +42,8 @@
   }
 
   &--dashed {
+    // for å beholde utseende disables warning på whitespace her
+    /* stylelint-disable-next-line no-irregular-whitespace */
     list-style-type: '– ';
   }
 

package/components/Loader/Loader.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Loader").LoaderProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Logo/Logo.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Logo").LogoProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/NotificationPanel/NotificationPanel.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./NotificationPanel").NotificationPanelProps & React.RefAttributes<HTMLDivElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Panel/Panel.stories.d.ts

@@ -9,6 +9,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Panel").PanelProps & React.RefAttributes<HTMLHeadingElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/PanelList/PanelList.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./PanelList").PanelListProps & React.RefAttributes<HTMLDivElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/PopMenu/PopMenu.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./PopMenu").PopMenuProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/PopMenu/styles.module.scss

@@ -18,20 +18,20 @@
     box-shadow: none;
     outline: none;
   }
+}
 
-  :focus > .pop-menu-button {
-    box-shadow: none;
-  }
+html :focus > .pop-menu-button {
+  box-shadow: none;
+  border: solid;
 }
 
-// overrides
-:focus > .pop-menu-button:hover {
+.pop-menu-button :focus > .pop-menu-button {
   box-shadow: none;
 }
 
-html :focus > .pop-menu-button {
+// overrides
+:focus > .pop-menu-button:hover {
   box-shadow: none;
-  border: solid;
 }
 
 .pop-menu-button--on-white {
@@ -108,7 +108,6 @@ html :focus > .pop-menu-button {
 
 .pop-menu__pop-over {
   width: 20.875rem;
-  width: 26.125rem;
   border: 0.125rem solid rgb(24 128 151);
   box-shadow: 0 0 0.3125rem 0 rgb(0 0 0 / 50%);
 

package/components/PopOver/styles.module.scss

@@ -20,10 +20,6 @@
   z-index: 3;
   visibility: hidden;
 
-  & + &__arrow {
-    visibility: hidden;
-  }
-
   &--visible {
     visibility: visible;
 
@@ -65,4 +61,8 @@
       filter: drop-shadow(0 0.2rem 0 var(--drop-shadow-color));
     }
   }
+
+  & + &__arrow {
+    visibility: hidden;
+  }
 }

package/components/PromoPanel/PromoPanel.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./PromoPanel").PromoPanelProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/RadioButton/RadioButton.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./RadioButton").RadioButtonProps & React.RefAttributes<HTMLInputElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Select/Select.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Select").SelectProps & React.RefAttributes<HTMLSelectElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/ServiceMessage/ServiceMessage.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./ServiceMessage").ServiceMessageProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/SharingStatus/SharingStatus.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./SharingStatus").SharingStatusProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Slider/Slider.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Slider").SliderProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Spacer/Spacer.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Spacer").SpacerProps & React.RefAttributes<HTMLElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/StatusDot/StatusDot.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./StatusDot").StatusDotProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Step/Step.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Step").StepProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/StepButtons/StepButtons.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./StepButtons").StepButtonsProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Stepper/Stepper.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Stepper").StepperProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Table/Table.stories.d.ts

@@ -12,6 +12,7 @@ declare const meta: {
     component: React.FC<import("./Table").Props>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Tag/Tag.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.FC<import("./Tag").TagProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/TagList/TagList.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./TagList").TagListPropsProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Textarea/Textarea.stories.d.ts

@@ -6,6 +6,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Textarea").TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Tile/Tile.stories.d.ts

@@ -1,9 +1,11 @@
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 declare const meta: {
     title: string;
     component: import("./Tile").TileCompound;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Title/Title.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Title").TitleProps & React.RefAttributes<HTMLHeadingElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Tooltip/Tooltip.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.FC<import("./Tooltip").TooltipProps>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Trigger/Trigger.stories.d.ts

@@ -5,6 +5,7 @@ declare const meta: {
     component: React.ForwardRefExoticComponent<import("./Trigger").TriggerProps & React.RefAttributes<HTMLButtonElement>>;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
             };

package/components/Validation/Validation.stories.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { StoryObj } from '@storybook/react';
 import { FormSize } from '../../constants';
 declare const meta: {
@@ -6,6 +6,7 @@ declare const meta: {
     component: (props: import("../FormExample/FormExample").FormExampleProps) => JSX.Element;
     parameters: {
         docs: {
+            page: () => React.JSX.Element;
             description: {
                 component: string;
                 markdown: string;

package/docs/index.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 interface DocsProps<T> {
     component: T;
+    hideStories?: boolean;
 }
 export declare const isSupernova: () => boolean;
 declare const Docs: <T>(props: DocsProps<T>) => React.JSX.Element;

package/docs/index.js

@@ -1,9 +1,14 @@
 import * as e from "react";
 import "../node_modules/@storybook/addon-docs/dist/chunk-HLWAVYOI.js";
-import { ArgTypes as n, Title as r, Subtitle as o, Description as l, Primary as a, Stories as i } from "../node_modules/@storybook/blocks/dist/index.js";
-const c = () => (window.location != window.parent.location ? document.referrer : document.location.href).startsWith("https://frankenstein.helsenorge.design") || window.location.search.includes("isSupernova"), u = (t) => c() ? /* @__PURE__ */ e.createElement(n, { of: t.component }) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(r, null), /* @__PURE__ */ e.createElement(o, null), /* @__PURE__ */ e.createElement(l, null), /* @__PURE__ */ e.createElement(a, null), /* @__PURE__ */ e.createElement(n, { of: t.component }), /* @__PURE__ */ e.createElement(i, null));
+import { ArgTypes as n, Title as o, Subtitle as l, Description as i, Primary as c, Stories as s } from "../node_modules/@storybook/blocks/dist/index.js";
+const m = () => (window.location != window.parent.location ? document.referrer : document.location.href).startsWith("https://frankenstein.helsenorge.design") || window.location.search.includes("isSupernova"), w = (t) => {
+  if (m())
+    return /* @__PURE__ */ e.createElement(n, { of: t.component });
+  const r = new URLSearchParams(window.location.search), a = `${window.location.pathname}?id=${r.get("id")}&viewMode=docs`;
+  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { style: { display: "flex", justifyContent: "space-between" } }, /* @__PURE__ */ e.createElement(o, null), /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("a", { target: "_blank", href: a, rel: "noreferrer" }, "Åpne i ny fane"))), /* @__PURE__ */ e.createElement(l, null), /* @__PURE__ */ e.createElement(i, null), /* @__PURE__ */ e.createElement(c, null), /* @__PURE__ */ e.createElement(n, { of: t.component }), !t.hideStories && /* @__PURE__ */ e.createElement(s, null));
+};
 export {
-  u as default,
-  c as isSupernova
+  w as default,
+  m as isSupernova
 };
 //# sourceMappingURL=index.js.map

package/docs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/docs/index.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Title, Subtitle, Description, Primary, ArgTypes, Stories } from '@storybook/addon-docs';\n\ninterface DocsProps<T> {\n  component: T;\n}\n\nexport const isSupernova = (): boolean => {\n  const url = window.location != window.parent.location ? document.referrer : document.location.href;\n  return url.startsWith('https://frankenstein.helsenorge.design') || window.location.search.includes('isSupernova');\n};\n\nconst Docs = <T,>(props: DocsProps<T>): React.JSX.Element => {\n  if (isSupernova()) {\n    return <ArgTypes of={props.component} />;\n  }\n\n  return (\n    <>\n      <Title />\n      <Subtitle />\n      <Description />\n      <Primary />\n      <ArgTypes of={props.component} />\n      <Stories />\n    </>\n  );\n};\n\nexport default Docs;\n"],"names":["isSupernova","Docs","props","React","ArgTypes","Title","Subtitle","Description","Primary","Stories"],"mappings":";;;AAQO,MAAMA,IAAc,OACb,OAAO,YAAY,OAAO,OAAO,WAAW,SAAS,WAAW,SAAS,SAAS,MACnF,WAAW,wCAAwC,KAAK,OAAO,SAAS,OAAO,SAAS,aAAa,GAG5GC,IAAO,CAAKC,MACZF,MACM,gBAAAG,EAAA,cAAAC,GAAA,EAAS,IAAIF,EAAM,UAAW,CAAA,IAItC,gBAAAC,EAAA,cAAAA,EAAA,UAAA,sCACGE,GAAM,IAAA,mCACNC,GAAS,IAAA,mCACTC,GAAY,IAAA,mCACZC,GAAQ,IAAA,mCACRJ,GAAS,EAAA,IAAIF,EAAM,UAAW,CAAA,GAC9B,gBAAAC,EAAA,cAAAM,GAAA,IAAQ,CACX;"}
+{"version":3,"file":"index.js","sources":["../../src/docs/index.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Title, Subtitle, Description, Primary, ArgTypes, Stories } from '@storybook/addon-docs';\n\ninterface DocsProps<T> {\n  component: T;\n  hideStories?: boolean;\n}\n\nexport const isSupernova = (): boolean => {\n  const url = window.location != window.parent.location ? document.referrer : document.location.href;\n  return url.startsWith('https://frankenstein.helsenorge.design') || window.location.search.includes('isSupernova');\n};\n\nconst Docs = <T,>(props: DocsProps<T>): React.JSX.Element => {\n  if (isSupernova()) {\n    return <ArgTypes of={props.component} />;\n  }\n\n  const searchParams = new URLSearchParams(window.location.search);\n  const newWindowUrl = `${window.location.pathname}?id=${searchParams.get('id')}&viewMode=docs`;\n\n  return (\n    <>\n      <div style={{ display: 'flex', justifyContent: 'space-between' }}>\n        <Title />\n        <div>\n          <a target=\"_blank\" href={newWindowUrl} rel=\"noreferrer\">\n            {'Åpne i ny fane'}\n          </a>\n        </div>\n      </div>\n      <Subtitle />\n      <Description />\n      <Primary />\n      <ArgTypes of={props.component} />\n      {!props.hideStories && <Stories />}\n    </>\n  );\n};\n\nexport default Docs;\n"],"names":["isSupernova","Docs","props","React","ArgTypes","searchParams","newWindowUrl","Title","Subtitle","Description","Primary","Stories"],"mappings":";;;AASO,MAAMA,IAAc,OACb,OAAO,YAAY,OAAO,OAAO,WAAW,SAAS,WAAW,SAAS,SAAS,MACnF,WAAW,wCAAwC,KAAK,OAAO,SAAS,OAAO,SAAS,aAAa,GAG5GC,IAAO,CAAKC,MAA2C;AAC3D,MAAIF;AACF,WAAQ,gBAAAG,EAAA,cAAAC,GAAA,EAAS,IAAIF,EAAM,UAAW,CAAA;AAGxC,QAAMG,IAAe,IAAI,gBAAgB,OAAO,SAAS,MAAM,GACzDC,IAAe,GAAG,OAAO,SAAS,QAAQ,OAAOD,EAAa,IAAI,IAAI,CAAC;AAG3E,SAAA,gBAAAF,EAAA,cAAAA,EAAA,UAAA,sCACG,OAAI,EAAA,OAAO,EAAE,SAAS,QAAQ,gBAAgB,kBAAgB,mCAC5DI,GAAM,IAAA,mCACN,OACC,MAAA,gBAAAJ,EAAA,cAAC,OAAE,QAAO,UAAS,MAAMG,GAAc,KAAI,aAAA,GACxC,gBACH,CACF,CACF,GACC,gBAAAH,EAAA,cAAAK,GAAA,IAAS,GACT,gBAAAL,EAAA,cAAAM,GAAA,IAAY,GACb,gBAAAN,EAAA,cAACO,GAAQ,IAAA,mCACRN,GAAS,EAAA,IAAIF,EAAM,UAAW,CAAA,GAC9B,CAACA,EAAM,eAAgB,gBAAAC,EAAA,cAAAQ,GAAA,IAAQ,CAClC;AAEJ;"}

package/package.json

@@ -7,7 +7,7 @@
     "url": "git+https://github.com/helsenorge/designsystem.git"
   },
   "homepage": "https://helsenorge.design",
-  "version": "7.2.0",
+  "version": "7.2.1",
   "author": "Helsenorge",
   "license": "MIT",
   "peerDependencies": {