@helsenorge/designsystem-react 8.5.0 → 8.5.1

package/components/PanelList/PanelList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PanelList.js","sources":["../../../src/components/PanelList/PanelList.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport Panel, { PanelProps, PanelVariant } from '../Panel';\n\nimport styles from './styles.module.scss';\n\nexport interface PanelListProps {\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 PanelVariant;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst isPanelComponent = (element: {} | null | undefined): element is React.ReactElement<PanelProps> =>\n  React.isValidElement<PanelProps>(element) && (element as React.ReactElement).type === Panel;\n\nconst PanelList = React.forwardRef(function BadgeForwardedRef(props: PanelListProps, ref: React.ForwardedRef<HTMLDivElement>) {\n  const { testId, children, variant = PanelVariant.fill } = props;\n\n  const renderPanel = (panel: React.ReactElement<PanelProps>, firstChild: boolean) =>\n    React.cloneElement(panel, {\n      variant: variant,\n      noTopBorder: variant === PanelVariant.line && !firstChild,\n      className: classNames(panel.props.className, variant !== PanelVariant.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 PanelList;\n"],"names":["isPanelComponent","element","React","Panel","PanelList","props","ref","testId","children","variant","PanelVariant","renderPanel","panel","firstChild","classNames","styles","AnalyticsId","child","index"],"mappings":";;;;;AAkBA,MAAMA,IAAmB,CAACC,MACxBC,EAAM,eAA2BD,CAAO,KAAMA,EAA+B,SAASE,GAElFC,IAAYF,EAAM,WAAW,SAA2BG,GAAuBC,GAAyC;AAC5H,QAAM,EAAE,QAAAC,GAAQ,UAAAC,GAAU,SAAAC,IAAUC,EAAa,KAAS,IAAAL,GAEpDM,IAAc,CAACC,GAAuCC,MAC1DX,EAAM,aAAaU,GAAO;AAAA,IACxB,SAAAH;AAAA,IACA,aAAaA,MAAYC,EAAa,QAAQ,CAACG;AAAA,IAC/C,WAAWC,EAAWF,EAAM,MAAM,WAAWH,MAAYC,EAAa,QAAQK,EAAO,mBAAmB,CAAC;AAAA,EAAA,CAC1G;AAGD,SAAAb,gBAAAA,EAAA,cAAC,OAAI,EAAA,KAAAI,GAAU,eAAaC,GAAQ,oBAAkBS,EAAY,UAAA,GAC/Dd,EAAM,SAAS,IAAIM,GAAU,CAACS,GAAOC,MAAWlB,EAAiBiB,CAAK,IAAIN,EAAYM,GAAOC,MAAU,CAAC,IAAID,CAAM,CACrH;AAEJ,CAAC;"}

package/components/PopMenu/PopMenu.js

@@ -1,89 +0,0 @@
-import e, { useRef as m, useState as W } from "react";
-import u from "classnames";
-import { IconSize as p, AnalyticsId as $ } from "../../constants.js";
-import { useBreakpoint as j } from "../../hooks/useBreakpoint.js";
-import { useHover as q } from "../../hooks/useHover.js";
-import { useOutsideEvent as F } from "../../hooks/useOutsideEvent.js";
-import { getColor as E } from "../../theme/currys/color.js";
-import { breakpoints as J } from "../../theme/grid.js";
-import { isComponent as y } from "../../utils/component.js";
-import { Icon as f } from "../Icon/Icon.js";
-import K from "../Icons/VerticalDots.js";
-import Q from "../Icons/X.js";
-import { LazyIcon as U } from "../LazyIcon/LazyIcon.js";
-import { LinkList as h } from "../LinkList/LinkList.js";
-import V from "../PopOver/PopOver.js";
-import l from "../PopMenu/styles.module.scss";
-var Y = /* @__PURE__ */ ((o) => (o.onWhite = "on-white", o.onGray = "on-gray", o.onBlueberry = "on-blueberry", o))(Y || {}), Z = /* @__PURE__ */ ((o) => (o.right = "right", o.left = "left", o))(Z || {});
-const ge = (o) => {
-  const d = m(null), v = m(null), B = m(null), b = m(null), [r, c] = W(!1), {
-    children: g,
-    popOverClassName: O,
-    popMenuClassName: N,
-    openButtonTestId: z,
-    closeButtonTestId: H,
-    popOverTestId: R,
-    popMenuVariant: C = "on-white",
-    openButtonAriaLabel: S,
-    closeButtonAriaLabel: _,
-    svgIcon: n,
-    labelText: a,
-    labelTextPosition: I = "right"
-    /* right */
-  } = o, L = u(l["pop-menu-button"], {
-    [l[`pop-menu-button--${C}`]]: C
-  }), T = j() < J.md;
-  F(b, () => {
-    c(!1);
-  });
-  const { isHovered: i } = q(d), k = T ? p.XSmall : p.Small, w = (t) => {
-    c(!1), t && t();
-  }, x = () => {
-    if (y(g, h))
-      return /* @__PURE__ */ e.createElement(
-        V,
-        {
-          testId: R,
-          className: u(l["pop-menu__pop-over"], O),
-          arrowClassName: l["pop-menu__pop-over-arrow"],
-          controllerRef: v,
-          popOverRef: B
-        },
-        e.Children.map(
-          g,
-          (t) => e.cloneElement(t, {
-            children: e.Children.map(
-              t.props.children,
-              (s) => y(s, h.Link) ? e.cloneElement(s, {
-                onClick: (P) => w(() => s.props.onClick && s.props.onClick(P))
-              }) : s
-            )
-          })
-        )
-      );
-  }, X = (t) => {
-    t && t.stopPropagation(), c(!r);
-  }, A = n && typeof n == "string" ? /* @__PURE__ */ e.createElement(U, { iconName: n, size: p.XSmall, isHovered: i }) : n && /* @__PURE__ */ e.createElement(f, { svgIcon: n, size: p.XSmall, isHovered: i }), D = n ? A : /* @__PURE__ */ e.createElement(f, { svgIcon: n ?? K, color: E("black"), size: k, isHovered: i }), G = /* @__PURE__ */ e.createElement(f, { svgIcon: Q, color: E("black"), size: k, isHovered: i }), M = /* @__PURE__ */ e.createElement(
-    "button",
-    {
-      ref: d,
-      "data-testid": r ? H : z,
-      className: L,
-      "aria-label": r ? _ : S,
-      "aria-expanded": r,
-      onClick: X,
-      type: "button"
-    },
-    a && I == "left" && /* @__PURE__ */ e.createElement("span", null, a),
-    /* @__PURE__ */ e.createElement("div", { ref: v }, r ? G : D),
-    a && I == "right" && /* @__PURE__ */ e.createElement("span", null, a)
-  );
-  return /* @__PURE__ */ e.createElement("div", { ref: b, className: u(l["pop-menu-button"], N), "data-analyticsid": $.PopMenu }, M, r && x());
-};
-export {
-  ge as PopMenu,
-  Z as PopMenuLabelPosition,
-  Y as PopMenuVariant,
-  ge as default
-};
-//# sourceMappingURL=PopMenu.js.map

package/components/PopMenu/PopMenu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PopMenu.js","sources":["../../../src/components/PopMenu/PopMenu.tsx"],"sourcesContent":["import React, { useRef, useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, IconSize } from '../../constants';\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { useOutsideEvent } from '../../hooks/useOutsideEvent';\nimport { getColor } from '../../theme/currys';\nimport { breakpoints } from '../../theme/grid';\nimport { isComponent } from '../../utils/component';\nimport Icon, { SvgIcon } from '../Icon';\nimport { IconName } from '../Icons/IconNames';\nimport VerticalDots from '../Icons/VerticalDots';\nimport X from '../Icons/X';\nimport LazyIcon from '../LazyIcon';\nimport LinkList, { LinkListProps, LinkProps } from '../LinkList';\nimport PopOver from '../PopOver';\n\nimport styles from './styles.module.scss';\n\nexport enum PopMenuVariant {\n  onWhite = 'on-white',\n  onGray = 'on-gray',\n  onBlueberry = 'on-blueberry',\n}\n\nexport enum PopMenuLabelPosition {\n  right = 'right',\n  left = 'left',\n}\n\nexport interface PopMenuProps {\n  /** Content shown inside PopOver. Can only be a LinkList */\n  children: React.ReactElement<LinkListProps>;\n  /** Adds custom classes to the popover element. */\n  popOverClassName?: string;\n  /** Adds custom classes to the element. */\n  popMenuClassName?: string;\n  /** Changes responsive design for the trigger buttons. */\n  popMenuVariant?: PopMenuVariant;\n  /** Sets the data-testid attribute for the button that opens. */\n  openButtonTestId?: string;\n  /** Sets the data-testid attribute for the button that closes. */\n  closeButtonTestId?: string;\n  /** Sets the data-testid attribute for the popover. */\n  popOverTestId?: string;\n  /** Sets the arial-label attribute for the openButton. */\n  openButtonAriaLabel?: string;\n  /** Sets the arial-label attribute for the closeButton. */\n  closeButtonAriaLabel?: string;\n  /** Sets the icon on the trigger button. */\n  svgIcon?: SvgIcon | IconName;\n  /** Optional text next to the trigger button. */\n  labelText?: string;\n  /** Placement of the label text relative to the trigger button. */\n  labelTextPosition?: PopMenuLabelPosition;\n}\n\nexport const PopMenu: React.FC<PopMenuProps> = (props: PopMenuProps) => {\n  const triggerButtonRef = useRef<HTMLButtonElement>(null);\n  const iconRef = useRef<HTMLDivElement>(null);\n  const popOverRef = useRef<HTMLDivElement>(null);\n  const outerRef = useRef<HTMLDivElement>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const {\n    children,\n    popOverClassName,\n    popMenuClassName,\n    openButtonTestId,\n    closeButtonTestId,\n    popOverTestId,\n    popMenuVariant = PopMenuVariant.onWhite,\n    openButtonAriaLabel,\n    closeButtonAriaLabel,\n    svgIcon,\n    labelText,\n    labelTextPosition = PopMenuLabelPosition.right,\n  } = props;\n  const buttonClasses = classNames(styles['pop-menu-button'], {\n    [styles[`pop-menu-button--${popMenuVariant}`]]: popMenuVariant,\n  });\n  const breakpoint = useBreakpoint();\n  const mobile = breakpoint < breakpoints.md;\n\n  useOutsideEvent(outerRef, () => {\n    setIsOpen(false);\n  });\n\n  const { isHovered: triggerButtonIsHovered } = useHover(triggerButtonRef);\n  const mobileIconSize = mobile ? IconSize.XSmall : IconSize.Small;\n\n  const handleClick = (cb?: () => void): void => {\n    setIsOpen(false);\n    cb && cb();\n  };\n\n  const renderChildren = () => {\n    if (isComponent<LinkListProps>(children, LinkList)) {\n      return (\n        <PopOver\n          testId={popOverTestId}\n          className={classNames(styles['pop-menu__pop-over'], popOverClassName)}\n          arrowClassName={styles['pop-menu__pop-over-arrow']}\n          controllerRef={iconRef}\n          popOverRef={popOverRef}\n        >\n          {React.Children.map(children, child =>\n            React.cloneElement(child, {\n              children: React.Children.map(child.props.children, child =>\n                isComponent<LinkProps>(child, LinkList.Link)\n                  ? React.cloneElement(child, {\n                      onClick: (event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) =>\n                        handleClick(() => child.props.onClick && child.props.onClick(event)),\n                    })\n                  : child\n              ),\n            })\n          )}\n        </PopOver>\n      );\n    }\n  };\n\n  const toggleOpenOnClick = (e?: React.MouseEvent<HTMLElement, MouseEvent>): void => {\n    e && e.stopPropagation();\n    setIsOpen(!isOpen);\n  };\n\n  const iconComponent =\n    svgIcon && typeof svgIcon === 'string' ? (\n      <LazyIcon iconName={svgIcon} size={IconSize.XSmall} isHovered={triggerButtonIsHovered} />\n    ) : (\n      svgIcon && <Icon svgIcon={svgIcon} size={IconSize.XSmall} isHovered={triggerButtonIsHovered} />\n    );\n\n  const openIcon = svgIcon ? (\n    iconComponent\n  ) : (\n    <Icon svgIcon={svgIcon ?? VerticalDots} color={getColor('black')} size={mobileIconSize} isHovered={triggerButtonIsHovered} />\n  );\n\n  const closeIcon = <Icon svgIcon={X} color={getColor('black')} size={mobileIconSize} isHovered={triggerButtonIsHovered} />;\n\n  const triggerButton = (\n    <button\n      ref={triggerButtonRef}\n      data-testid={isOpen ? closeButtonTestId : openButtonTestId}\n      className={buttonClasses}\n      aria-label={isOpen ? closeButtonAriaLabel : openButtonAriaLabel}\n      aria-expanded={isOpen}\n      onClick={toggleOpenOnClick}\n      type=\"button\"\n    >\n      {labelText && labelTextPosition == PopMenuLabelPosition.left && <span>{labelText}</span>}\n      {<div ref={iconRef}>{isOpen ? closeIcon : openIcon}</div>}\n      {labelText && labelTextPosition == PopMenuLabelPosition.right && <span>{labelText}</span>}\n    </button>\n  );\n\n  return (\n    <div ref={outerRef} className={classNames(styles['pop-menu-button'], popMenuClassName)} data-analyticsid={AnalyticsId.PopMenu}>\n      {triggerButton}\n      {isOpen && renderChildren()}\n    </div>\n  );\n};\n\nexport default PopMenu;\n"],"names":["PopMenuVariant","PopMenuLabelPosition","PopMenu","props","triggerButtonRef","useRef","iconRef","popOverRef","outerRef","isOpen","setIsOpen","useState","children","popOverClassName","popMenuClassName","openButtonTestId","closeButtonTestId","popOverTestId","popMenuVariant","openButtonAriaLabel","closeButtonAriaLabel","svgIcon","labelText","labelTextPosition","buttonClasses","classNames","styles","mobile","useBreakpoint","breakpoints","useOutsideEvent","triggerButtonIsHovered","useHover","mobileIconSize","IconSize","handleClick","cb","renderChildren","isComponent","LinkList","React","PopOver","child","event","toggleOpenOnClick","e","iconComponent","LazyIcon","Icon","openIcon","VerticalDots","getColor","closeIcon","X","triggerButton","AnalyticsId"],"mappings":"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"}

package/components/PopOver/PopOver.js

@@ -1,56 +0,0 @@
-import r, { useRef as w, useState as h, useEffect as A } from "react";
-import y from "classnames";
-import { getVerticalPosition as B, getBubbleStyle as F, getArrowStyle as L } from "./utils.js";
-import { ZIndex as T, AnalyticsId as V } from "../../constants.js";
-import { useInterval as Z } from "../../hooks/useInterval.js";
-import { useIsVisible as j } from "../../hooks/useIsVisible.js";
-import { useLayoutEvent as k } from "../../hooks/useLayoutEvent.js";
-import { useSize as q } from "../../hooks/useSize.js";
-import { mergeRefs as D } from "../../utils/refs.js";
-import t from "../PopOver/styles.module.scss";
-var G = /* @__PURE__ */ ((e) => (e.positionautomatic = "positionautomatic", e.positionbelow = "positionbelow", e.positionabove = "positionabove", e))(G || {});
-const H = r.forwardRef((e, S) => {
-  const {
-    id: _,
-    children: R,
-    controllerRef: n,
-    popOverRef: g,
-    show: p = !1,
-    className: z = "",
-    variant: c = "positionautomatic",
-    role: m,
-    testId: C,
-    arrowClassName: I,
-    zIndex: u = T.PopOver
-  } = e, f = g || w(null), N = w(null), s = q(f), [o, E] = h(), v = j(n, 0), l = () => {
-    var d;
-    E((d = n.current) == null ? void 0 : d.getBoundingClientRect());
-  };
-  Z(l, 500), k(l, ["scroll", "resize"], 10), A(() => {
-    l();
-  }, []);
-  const b = m === "tooltip", O = y(t.popover, { [t["popover--visible"]]: b ? p : v }, z), i = o && s && B(o, s, c), P = y(t.popover__arrow, I, {
-    [t["popover__arrow--over"]]: i === "positionbelow",
-    [t["popover__arrow--under"]]: i === "positionabove",
-    [t["popover__arrow--visible"]]: b ? p : v
-  }), a = o && s && F(o, s, c), x = a && o && i && L(a, o, i);
-  return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(
-    "div",
-    {
-      id: _,
-      ref: D([S, f]),
-      className: O,
-      style: { ...a, zIndex: u },
-      "data-testid": C,
-      "data-analyticsid": V.PopOver,
-      role: m
-    },
-    R
-  ), /* @__PURE__ */ r.createElement("div", { ref: N, className: P, style: { ...x, zIndex: u } }));
-});
-H.displayName = "PopOver";
-export {
-  G as PopOverVariant,
-  H as default
-};
-//# sourceMappingURL=PopOver.js.map

package/components/PopOver/PopOver.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PopOver.js","sources":["../../../src/components/PopOver/PopOver.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { getArrowStyle, getBubbleStyle, getVerticalPosition } from './utils';\nimport { AnalyticsId, ZIndex } from '../../constants';\nimport { useInterval } from '../../hooks/useInterval';\nimport { useIsVisible } from '../../hooks/useIsVisible';\nimport { useLayoutEvent } from '../../hooks/useLayoutEvent';\nimport { useSize } from '../../hooks/useSize';\nimport { mergeRefs } from '../../utils/refs';\n\nimport styles from './styles.module.scss';\n\nexport enum PopOverVariant {\n  positionautomatic = 'positionautomatic',\n  positionbelow = 'positionbelow',\n  positionabove = 'positionabove',\n}\n\nexport type PopOverRole = 'tooltip';\n\nexport interface PopOverProps {\n  /** Id of the PopOver */\n  id?: string;\n  /** Content shown inside PopOver. Note that if role=\"tooltip\", you must not include interactive/focusable elements. */\n  children: React.ReactNode;\n  /** Ref for the element the PopOver is placed upon */\n  controllerRef: React.RefObject<HTMLElement | SVGSVGElement>;\n  /** Ref for the element the PopOver is placed upon */\n  popOverRef?: React.RefObject<HTMLDivElement>;\n  /** Show the popover. Only applies when role=tooltip. Default: false. */\n  show?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds custom classes to the arrow element. */\n  arrowClassName?: string;\n  /** Determines the placement of the popover. Default: automatic positioning. */\n  variant?: keyof typeof PopOverVariant;\n  /** Sets role of the PopOver element */\n  role?: PopOverRole;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Overrides the default z-index of PopOver */\n  zIndex?: number;\n}\n\nconst PopOver = React.forwardRef<HTMLDivElement | SVGSVGElement, PopOverProps>((props, ref) => {\n  const {\n    id,\n    children,\n    controllerRef,\n    popOverRef,\n    show = false,\n    className = '',\n    variant = PopOverVariant.positionautomatic,\n    role,\n    testId,\n    arrowClassName,\n    zIndex = ZIndex.PopOver,\n  } = props;\n\n  const bubbleRef = popOverRef || useRef<HTMLDivElement>(null);\n  const arrowRef = useRef<HTMLDivElement>(null);\n  const bubbleSize = useSize(bubbleRef);\n  const [controllerSize, setControllerSize] = useState<DOMRect>();\n  const controllerisVisible = useIsVisible(controllerRef, 0);\n\n  const updateControllerSize = (): void => {\n    setControllerSize(controllerRef.current?.getBoundingClientRect());\n  };\n\n  useInterval(updateControllerSize, 500);\n  useLayoutEvent(updateControllerSize, ['scroll', 'resize'], 10);\n\n  useEffect(() => {\n    updateControllerSize();\n  }, []);\n\n  const isTooltip = role === 'tooltip';\n\n  const popOverClasses = classNames(styles.popover, { [styles['popover--visible']]: isTooltip ? show : controllerisVisible }, className);\n  const verticalPosition = controllerSize && bubbleSize && getVerticalPosition(controllerSize, bubbleSize, variant);\n  const arrowClasses = classNames(styles.popover__arrow, arrowClassName, {\n    [styles['popover__arrow--over']]: verticalPosition === PopOverVariant.positionbelow,\n    [styles['popover__arrow--under']]: verticalPosition === PopOverVariant.positionabove,\n    [styles['popover__arrow--visible']]: isTooltip ? show : controllerisVisible,\n  });\n\n  const bubbleStyle = controllerSize && bubbleSize && getBubbleStyle(controllerSize, bubbleSize, variant);\n  const arrowStyle = bubbleStyle && controllerSize && verticalPosition && getArrowStyle(bubbleStyle, controllerSize, verticalPosition);\n\n  return (\n    <>\n      <div\n        id={id}\n        ref={mergeRefs([ref, bubbleRef])}\n        className={popOverClasses}\n        style={{ ...bubbleStyle, zIndex }}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.PopOver}\n        role={role}\n      >\n        {children}\n      </div>\n      <div ref={arrowRef} className={arrowClasses} style={{ ...arrowStyle, zIndex }} />\n    </>\n  );\n});\n\nPopOver.displayName = 'PopOver';\n\nexport default PopOver;\n"],"names":["PopOverVariant","PopOver","React","props","ref","id","children","controllerRef","popOverRef","show","className","variant","role","testId","arrowClassName","zIndex","ZIndex","bubbleRef","useRef","arrowRef","bubbleSize","useSize","controllerSize","setControllerSize","useState","controllerisVisible","useIsVisible","updateControllerSize","_a","useInterval","useLayoutEvent","useEffect","isTooltip","popOverClasses","classNames","styles","verticalPosition","getVerticalPosition","arrowClasses","bubbleStyle","getBubbleStyle","arrowStyle","getArrowStyle","mergeRefs","AnalyticsId"],"mappings":";;;;;;;;;;AAcY,IAAAA,sBAAAA,OACVA,EAAA,oBAAoB,qBACpBA,EAAA,gBAAgB,iBAChBA,EAAA,gBAAgB,iBAHNA,IAAAA,KAAA,CAAA,CAAA;AAiCZ,MAAMC,IAAUC,EAAM,WAAyD,CAACC,GAAOC,MAAQ;AACvF,QAAA;AAAA,IACJ,IAAAC;AAAA,IACA,UAAAC;AAAA,IACA,eAAAC;AAAA,IACA,YAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC,IAAY;AAAA,IACZ,SAAAC,IAAU;AAAA,IACV,MAAAC;AAAA,IACA,QAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,QAAAC,IAASC,EAAO;AAAA,EACd,IAAAb,GAEEc,IAAYT,KAAcU,EAAuB,IAAI,GACrDC,IAAWD,EAAuB,IAAI,GACtCE,IAAaC,EAAQJ,CAAS,GAC9B,CAACK,GAAgBC,CAAiB,IAAIC,EAAkB,GACxDC,IAAsBC,EAAanB,GAAe,CAAC,GAEnDoB,IAAuB,MAAY;;AACrB,IAAAJ,GAAAK,IAAArB,EAAc,YAAd,gBAAAqB,EAAuB,uBAAuB;AAAA,EAAA;AAGlE,EAAAC,EAAYF,GAAsB,GAAG,GACrCG,EAAeH,GAAsB,CAAC,UAAU,QAAQ,GAAG,EAAE,GAE7DI,EAAU,MAAM;AACO,IAAAJ;EACvB,GAAG,CAAE,CAAA;AAEL,QAAMK,IAAYpB,MAAS,WAErBqB,IAAiBC,EAAWC,EAAO,SAAS,EAAE,CAACA,EAAO,kBAAkB,CAAC,GAAGH,IAAYvB,IAAOgB,KAAuBf,CAAS,GAC/H0B,IAAmBd,KAAkBF,KAAciB,EAAoBf,GAAgBF,GAAYT,CAAO,GAC1G2B,IAAeJ,EAAWC,EAAO,gBAAgBrB,GAAgB;AAAA,IACrE,CAACqB,EAAO,sBAAsB,CAAC,GAAGC,MAAqB;AAAA,IACvD,CAACD,EAAO,uBAAuB,CAAC,GAAGC,MAAqB;AAAA,IACxD,CAACD,EAAO,yBAAyB,CAAC,GAAGH,IAAYvB,IAAOgB;AAAA,EAAA,CACzD,GAEKc,IAAcjB,KAAkBF,KAAcoB,EAAelB,GAAgBF,GAAYT,CAAO,GAChG8B,IAAaF,KAAejB,KAAkBc,KAAoBM,EAAcH,GAAajB,GAAgBc,CAAgB;AAEnI,SAEIlC,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MAAAA,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,IAAAG;AAAA,MACA,KAAKsC,EAAU,CAACvC,GAAKa,CAAS,CAAC;AAAA,MAC/B,WAAWgB;AAAA,MACX,OAAO,EAAE,GAAGM,GAAa,QAAAxB,EAAO;AAAA,MAChC,eAAaF;AAAA,MACb,oBAAkB+B,EAAY;AAAA,MAC9B,MAAAhC;AAAA,IAAA;AAAA,IAECN;AAAA,EAEH,GAAAJ,gBAAAA,EAAA,cAAC,OAAI,EAAA,KAAKiB,GAAU,WAAWmB,GAAc,OAAO,EAAE,GAAGG,GAAY,QAAA1B,KAAU,CACjF;AAEJ,CAAC;AAEDd,EAAQ,cAAc;"}

package/components/PopOver/utils.js

@@ -1,33 +0,0 @@
-import { PopOverVariant as s } from "./PopOver.js";
-const w = 373, r = 12, h = 16, l = 20, x = 4, P = 12, a = (t, o, n) => n !== s.positionautomatic ? n : t.top > o.height + h ? s.positionabove : s.positionbelow, p = (t) => t.left + t.width / 2, m = (t) => document.documentElement.clientWidth - t.right + t.width / 2, u = (t, o) => p(t) - o.width / 2, R = (t, o) => u(t, o) + o.width, B = (t, o) => u(t, o) > r, _ = (t, o) => R(t, o) < document.documentElement.clientWidth - r, L = (t, o) => _(t, o) ? B(t, o) ? "floating" : "left" : "right", b = (t, o) => t.top - h - o.height, c = (t) => t.bottom + h, W = () => document.documentElement.clientWidth - r * 2, v = () => document.documentElement.clientWidth > w + r * 2, d = (t) => t.top - h - x, A = (t) => p(t) - l / 2, E = (t) => m(t) - l / 2, I = (t, o, n) => {
-  const i = L(t, o), e = a(t, o, n);
-  return i === "left" ? e === s.positionabove ? "leftabove" : "leftbelow" : i === "right" ? e === s.positionabove ? "rightabove" : "rightbelow" : e === s.positionabove ? "floatingabove" : "floatingbelow";
-}, C = (t, o, n) => {
-  const i = I(t, o, n), e = v() ? void 0 : W();
-  return i === "leftabove" ? {
-    left: r,
-    top: b(t, o),
-    width: e
-  } : i === "leftbelow" ? { left: r, top: c(t), width: e } : i === "rightabove" ? { right: r, top: b(t, o), width: e } : i === "rightbelow" ? { right: r, top: c(t), width: e } : i === "floatingbelow" ? { left: u(t, o), top: c(t), width: e } : { left: u(t, o), top: b(t, o), width: e };
-}, T = (t, o, n) => {
-  const i = A(o), e = E(o), f = t.left + P, g = t.right + P;
-  return t.right ? n === s.positionabove ? {
-    right: e > g ? e : g,
-    top: d(o)
-  } : {
-    right: e > g ? e : g,
-    top: o.bottom
-  } : n === s.positionabove ? {
-    left: i > f ? i : f,
-    top: d(o)
-  } : {
-    left: i > f ? i : f,
-    top: o.bottom
-  };
-};
-export {
-  T as getArrowStyle,
-  C as getBubbleStyle,
-  a as getVerticalPosition
-};
-//# sourceMappingURL=utils.js.map

package/components/PopOver/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/PopOver/utils.ts"],"sourcesContent":["import { CSSProperties } from 'react';\n\nimport { PopOverVariant } from './PopOver';\n\ntype HorizontalPosition = 'left' | 'right' | 'floating';\ntype BubblePosition = 'leftabove' | 'leftbelow' | 'rightabove' | 'rightbelow' | 'floatingabove' | 'floatingbelow';\n\n/** Bredde på hjelpeboble */\nconst BUBBLE_WIDTH_PX = 373;\n/** Hjelpeboblen skal holde avstand til venstre/høyre kant på vinduet */\nconst WINDOW_MARGIN_PX = 12;\n/** Vertikal avstand fra hjelpeboble til kontroller */\nconst BUBBLE_VERTICAL_OFFSET_PX = 16;\n/** Høyde/bredde på pil */\nconst ARROW_WIDTH_PX = 20;\n/** Avstand fra pil til hjelpeboble */\nconst ARROW_VERTICAL_OFFSET_PX = 4;\n/** Pilen skal holde avstand til venstre/høyre kant av hjelpeboblen */\nconst ARROW_HORIZONTAL_MARGIN_PX = 12;\n\n/**\n * Beregn om hjelpeboblen skal vises over eller under kontrolleren\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @param variant Ønsket plassering av hjelpeboblen (over/under/automatisk)\n * @returns Om hjelpeboblen skal vises over eller under\n */\nexport const getVerticalPosition = (\n  controllerSize: DOMRect,\n  bubbleSize: DOMRect,\n  variant: keyof typeof PopOverVariant\n): keyof typeof PopOverVariant => {\n  if (variant !== PopOverVariant.positionautomatic) {\n    return variant;\n  }\n  if (controllerSize.top > bubbleSize.height + BUBBLE_VERTICAL_OFFSET_PX) {\n    return PopOverVariant.positionabove;\n  } else {\n    return PopOverVariant.positionbelow;\n  }\n};\n\n/**\n * Finn horisontalt midtpunkt på kontrolleren i forhold til venstre kant av vinduet\n * @param controllerSize DOMRect for controlleren\n * @returns Horisontalt senter av controlleren i px\n */\nconst getControllerLeftCenterPx = (controllerSize: DOMRect): number => controllerSize.left + controllerSize.width / 2;\n\n/**\n * Finn horisontalt midtpunkt på kontrolleren i forhold til høyre kant av vinduet\n * @param controllerSize DOMRect for controlleren\n * @returns Horisontalt senter av controlleren i px\n */\nconst getControllerRightCenterPx = (controllerSize: DOMRect): number =>\n  document.documentElement.clientWidth - controllerSize.right + controllerSize.width / 2;\n\n/**\n * Finn venstre kant av hjelpeboblen i forhold til kontrolleren\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns Venstre kant av hjelpeboblen i px\n */\nconst getBubbleLeftPx = (controllerSize: DOMRect, bubbleSize: DOMRect): number => {\n  const controllerHorizontalCenterPx = getControllerLeftCenterPx(controllerSize);\n\n  return controllerHorizontalCenterPx - bubbleSize.width / 2;\n};\n\n/**\n * Finn høyre kant av hjelpeboblen i forhold til kontrolleren\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns Høyre kant av hjelpeboblen i px\n */\nconst getBubbleRightPx = (controllerSize: DOMRect, bubbleSize: DOMRect): number => {\n  const bubbleLeftPx = getBubbleLeftPx(controllerSize, bubbleSize);\n\n  return bubbleLeftPx + bubbleSize.width;\n};\n\n/**\n * Sjekk om venstre kant av hjelpeboblen er innenfor vinduet\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns true dersom venstre kant er innenfor vinduet\n */\nconst getBubbleLeftVisible = (controllerSize: DOMRect, bubbleSize: DOMRect): boolean => {\n  const bubbleLeftPx = getBubbleLeftPx(controllerSize, bubbleSize);\n\n  return bubbleLeftPx > WINDOW_MARGIN_PX;\n};\n\n/**\n * Sjekk om høyre kant av hjelpeboblen er innenfor vinduet\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns true dersom høyre kant er innenfor vinduet\n */\nconst getBubbleRightIsVisible = (controllerSize: DOMRect, bubbleSize: DOMRect): boolean => {\n  const bubbleRightPx = getBubbleRightPx(controllerSize, bubbleSize);\n\n  return bubbleRightPx < document.documentElement.clientWidth - WINDOW_MARGIN_PX;\n};\n\n/**\n * Finn riktig horisontal plassering til hjelpeboblen\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns left, right eller floating\n */\nconst getHorizontalPosition = (controllerSize: DOMRect, bubbleSize: DOMRect): HorizontalPosition => {\n  if (!getBubbleRightIsVisible(controllerSize, bubbleSize)) {\n    return 'right';\n  }\n  if (!getBubbleLeftVisible(controllerSize, bubbleSize)) {\n    return 'left';\n  }\n\n  return 'floating';\n};\n\n/**\n * Finn vertikal plassering av hjelpeboblen når den skal vises over\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns \"Top\" for hjelpeboblen i px\n */\nconst getBubbleAbovePx = (controllerSize: DOMRect, bubbleSize: DOMRect): number =>\n  controllerSize.top - BUBBLE_VERTICAL_OFFSET_PX - bubbleSize.height;\n\n/**\n * Finn vertikal plassering av hjelpeboblen når den skal vises under\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @returns \"Top\" for hjelpeboblen i px\n */\nconst getBubbleBelowPx = (controllerSize: DOMRect): number => controllerSize.bottom + BUBBLE_VERTICAL_OFFSET_PX;\n\n/**\n * Finn maks bredde på hjelpeboblen i forhold til vinduet\n * @returns Bredde på hjelpeboblen i px\n */\nconst getBubbleWidth = (): number => document.documentElement.clientWidth - WINDOW_MARGIN_PX * 2;\n\n/**\n * Sjekk om hjelpeboblen har plass i vinduet\n * @returns true dersom det er plass til hjelpeboblen i vinduet\n */\nconst getBubbleFitsInWindow = (): boolean => {\n  return document.documentElement.clientWidth > BUBBLE_WIDTH_PX + WINDOW_MARGIN_PX * 2;\n};\n\n/**\n * Finn vertikal plassering av pilen når den skal vises over\n * @param controllerSize DOMRect for controlleren\n * @returns \"Top\" for pilen i px\n */\nconst getArrowTopxPx = (controllerSize: DOMRect): number => controllerSize.top - BUBBLE_VERTICAL_OFFSET_PX - ARROW_VERTICAL_OFFSET_PX;\n\n/**\n * Finn horisontal plassering av pilen i forhold til venstre kant av vinduet\n * @param controllerSize DOMRect for controlleren\n * @returns Venstre kant av pilen i px\n */\nconst getArrowLeftPx = (controllerSize: DOMRect): number => getControllerLeftCenterPx(controllerSize) - ARROW_WIDTH_PX / 2;\n\n/**\n * Finn horisontal plassering av pilen\n * @param controllerSize DOMRect for controlleren\n * @returns Venstre kant av pilen i px\n */\nconst getArrowRightPx = (controllerSize: DOMRect): number => getControllerRightCenterPx(controllerSize) - ARROW_WIDTH_PX / 2;\n\n/**\n * Finn riktig plassering av hjelpeboblen\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @param variant Ønsket plassering av hjelpeboblen (over/under)\n * @returns Beste mulige plassering av hjelpeboblen\n */\nconst getBubblePosition = (controllerSize: DOMRect, bubbleSize: DOMRect, variant: keyof typeof PopOverVariant): BubblePosition => {\n  const horizontalPosition = getHorizontalPosition(controllerSize, bubbleSize);\n  const verticalPosition = getVerticalPosition(controllerSize, bubbleSize, variant);\n\n  if (horizontalPosition === 'left') {\n    if (verticalPosition === PopOverVariant.positionabove) {\n      return 'leftabove';\n    }\n    return 'leftbelow';\n  }\n\n  if (horizontalPosition === 'right') {\n    if (verticalPosition === PopOverVariant.positionabove) {\n      return 'rightabove';\n    }\n    return 'rightbelow';\n  }\n\n  if (verticalPosition === PopOverVariant.positionabove) {\n    return 'floatingabove';\n  }\n\n  return 'floatingbelow';\n};\n\n/**\n * Finn riktig plassering av hjelpeboblen\n * @param controllerSize DOMRect for controlleren\n * @param bubbleSize DOMRect for hjelpeboblen\n * @param variant Ønsket plassering av hjelpeboblen (over/under)\n * @returns CSSProperties som plasserer hjelpeboblen riktig\n */\nexport const getBubbleStyle = (controllerSize: DOMRect, bubbleSize: DOMRect, variant: keyof typeof PopOverVariant): CSSProperties => {\n  const bubblePosition = getBubblePosition(controllerSize, bubbleSize, variant);\n  const bubbleWidth = !getBubbleFitsInWindow() ? getBubbleWidth() : undefined;\n\n  if (bubblePosition === 'leftabove') {\n    return {\n      left: WINDOW_MARGIN_PX,\n      top: getBubbleAbovePx(controllerSize, bubbleSize),\n      width: bubbleWidth,\n    };\n  }\n  if (bubblePosition === 'leftbelow') {\n    return { left: WINDOW_MARGIN_PX, top: getBubbleBelowPx(controllerSize), width: bubbleWidth };\n  }\n  if (bubblePosition === 'rightabove') {\n    return { right: WINDOW_MARGIN_PX, top: getBubbleAbovePx(controllerSize, bubbleSize), width: bubbleWidth };\n  }\n  if (bubblePosition === 'rightbelow') {\n    return { right: WINDOW_MARGIN_PX, top: getBubbleBelowPx(controllerSize), width: bubbleWidth };\n  }\n\n  if (bubblePosition === 'floatingbelow') {\n    return { left: getBubbleLeftPx(controllerSize, bubbleSize), top: getBubbleBelowPx(controllerSize), width: bubbleWidth };\n  }\n\n  return { left: getBubbleLeftPx(controllerSize, bubbleSize), top: getBubbleAbovePx(controllerSize, bubbleSize), width: bubbleWidth };\n};\n\n/**\n * Finn riktig plassering av pilen\n * @param bubbleStyle CSSProperties for hjelpeboblen\n * @param controllerSize DOMRect for kontrolleren\n * @param verticalPosition Ønsket plassering av hjelpeboblen (over/under)\n * @returns CSSProperties som plasserer pilen riktig\n */\nexport const getArrowStyle = (\n  bubbleStyle: CSSProperties,\n  controllerSize: DOMRect,\n  verticalPosition: keyof typeof PopOverVariant\n): CSSProperties => {\n  const leftPx = getArrowLeftPx(controllerSize);\n  const rightPx = getArrowRightPx(controllerSize);\n  const minLeftPx = (bubbleStyle.left as number) + ARROW_HORIZONTAL_MARGIN_PX;\n  const minRightPx = (bubbleStyle.right as number) + ARROW_HORIZONTAL_MARGIN_PX;\n\n  if (bubbleStyle.right) {\n    if (verticalPosition === PopOverVariant.positionabove) {\n      return {\n        right: rightPx > minRightPx ? rightPx : minRightPx,\n        top: getArrowTopxPx(controllerSize),\n      };\n    }\n\n    return {\n      right: rightPx > minRightPx ? rightPx : minRightPx,\n      top: controllerSize.bottom,\n    };\n  }\n\n  if (verticalPosition === PopOverVariant.positionabove) {\n    return {\n      left: leftPx > minLeftPx ? leftPx : minLeftPx,\n      top: getArrowTopxPx(controllerSize),\n    };\n  }\n\n  return {\n    left: leftPx > minLeftPx ? leftPx : minLeftPx,\n    top: controllerSize.bottom,\n  };\n};\n"],"names":["BUBBLE_WIDTH_PX","WINDOW_MARGIN_PX","BUBBLE_VERTICAL_OFFSET_PX","ARROW_WIDTH_PX","ARROW_VERTICAL_OFFSET_PX","ARROW_HORIZONTAL_MARGIN_PX","getVerticalPosition","controllerSize","bubbleSize","variant","PopOverVariant","getControllerLeftCenterPx","getControllerRightCenterPx","getBubbleLeftPx","getBubbleRightPx","getBubbleLeftVisible","getBubbleRightIsVisible","getHorizontalPosition","getBubbleAbovePx","getBubbleBelowPx","getBubbleWidth","getBubbleFitsInWindow","getArrowTopxPx","getArrowLeftPx","getArrowRightPx","getBubblePosition","horizontalPosition","verticalPosition","getBubbleStyle","bubblePosition","bubbleWidth","getArrowStyle","bubbleStyle","leftPx","rightPx","minLeftPx","minRightPx"],"mappings":"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"}

package/components/Progressbar/Progressbar.js

@@ -1,89 +0,0 @@
-import a, { useRef as _, useEffect as v } from "react";
-import N from "classnames";
-import { ZIndex as $ } from "../../constants.js";
-import { palette as o } from "../../theme/palette.js";
-import s from "../Progressbar/styles.module.scss";
-var B = /* @__PURE__ */ ((e) => (e.small = "small", e.medium = "medium", e.large = "large", e))(B || {}), C = /* @__PURE__ */ ((e) => (e.ondark = "ondark", e.onlight = "onlight", e))(C || {}), R = /* @__PURE__ */ ((e) => (e.screen = "screen", e.parent = "parent", e))(R || {});
-const W = ({
-  value: e,
-  size: i = "large",
-  mode: c = "onlight",
-  overlay: t,
-  testId: b,
-  ariaLabel: w
-}) => {
-  t && (c = "ondark"), e = Math.max(0, Math.min(e, 100));
-  let n;
-  i === "large" ? n = 96 : i === "medium" ? n = 50 : n = 44;
-  const m = n / 2, p = 8, f = m - p / 2, l = m * 2, r = m, k = c === "onlight" ? o.blueberry100 : o.neutral700, h = c === "onlight" ? o.blueberry600 : o.white, g = 2 * Math.PI * f, y = g - e / 100 * g, d = _(null);
-  v(() => {
-    var u, x;
-    t === "parent" && ((x = (u = d.current) == null ? void 0 : u.parentElement) != null && x.style) && (d.current.parentElement.style.position = "relative");
-  }, []);
-  const E = N({
-    [s["progressbar--overlay"]]: t,
-    [s["progressbar--overlay-screen"]]: t === "screen",
-    [s["progressbar--overlay-parent"]]: t === "parent"
-    /* parent */
-  });
-  return /* @__PURE__ */ a.createElement(
-    "div",
-    {
-      ref: d,
-      className: E,
-      "data-testid": b,
-      role: "progressbar",
-      "aria-valuenow": e,
-      "aria-label": w,
-      "aria-live": "polite",
-      style: t === "screen" ? { zIndex: $.OverlayScreen } : {}
-    },
-    /* @__PURE__ */ a.createElement(
-      "svg",
-      {
-        role: "presentation",
-        width: l,
-        height: l,
-        viewBox: `0 0 ${l} ${l}`,
-        className: s.progressbar__svg
-      },
-      /* @__PURE__ */ a.createElement("circle", { cx: r, cy: r, r: f, stroke: k, strokeWidth: p, fill: "none" }),
-      /* @__PURE__ */ a.createElement(
-        "circle",
-        {
-          cx: r,
-          cy: r,
-          r: f,
-          stroke: h,
-          strokeWidth: p,
-          fill: "none",
-          strokeDasharray: g,
-          strokeDashoffset: y,
-          className: s["progressbar__progress-circle"],
-          transform: `rotate(-90 ${r} ${r})`
-        }
-      ),
-      " ",
-      /* @__PURE__ */ a.createElement(
-        "text",
-        {
-          className: "progress-wheel__text--large",
-          fontSize: "1.5rem",
-          fill: h,
-          x: r,
-          y: r,
-          textAnchor: "middle",
-          alignmentBaseline: "middle"
-        },
-        i == "large" && `${e}%`
-      )
-    )
-  );
-};
-export {
-  R as Overlay,
-  C as ProgressBarMode,
-  B as ProgressbarSize,
-  W as default
-};
-//# sourceMappingURL=Progressbar.js.map

package/components/Progressbar/Progressbar.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Progressbar.js","sources":["../../../src/components/Progressbar/Progressbar.tsx"],"sourcesContent":["import React, { useRef, useEffect } from 'react';\n\nimport classNames from 'classnames';\n\nimport { ZIndex } from '../../constants';\nimport { palette } from '../../theme/palette';\n\nimport styles from './styles.module.scss';\n\nexport enum ProgressbarSize {\n  small = 'small',\n  medium = 'medium',\n  large = 'large',\n}\n\nexport enum ProgressBarMode {\n  ondark = 'ondark',\n  onlight = 'onlight',\n}\n\nexport enum Overlay {\n  screen = 'screen',\n  parent = 'parent',\n}\nexport interface ProgressbarProps {\n  /** The value of the progressbar given in percent. Value between 0 and 100 */\n  value: number;\n  /** Size of the progressbar. Default is large */\n  size?: ProgressbarSize;\n  /** Changes the visuals of the ProgressBar. Default is onLight */\n  mode?: ProgressBarMode;\n  /** Loader is displayed with grey background covering the entire screen */\n  overlay?: keyof typeof Overlay;\n  /** Aria label for the progressbar */\n  ariaLabel?: string;\n  /** Sets the data-testid attribute */\n  testId?: string;\n}\n\nconst Progressbar: React.FC<ProgressbarProps> = ({\n  value,\n  size = ProgressbarSize.large,\n  mode = ProgressBarMode.onlight,\n  overlay,\n  testId,\n  ariaLabel,\n}: ProgressbarProps) => {\n  if (overlay) {\n    mode = ProgressBarMode.ondark;\n  }\n  // Restrict value to be between 0 and 100\n  value = Math.max(0, Math.min(value, 100));\n\n  let width;\n  if (size === ProgressbarSize.large) {\n    width = 96;\n  } else if (size === ProgressbarSize.medium) {\n    width = 50;\n  } else {\n    width = 44;\n  }\n\n  const totalRadius = width / 2;\n  const strokeWidth = 8;\n  const radius = totalRadius - strokeWidth / 2;\n  const viewBoxSize = totalRadius * 2;\n  const viewBoxCenter = totalRadius;\n  const circleBackgroundColor = mode === ProgressBarMode.onlight ? palette.blueberry100 : palette.neutral700;\n  const mainColor = mode === ProgressBarMode.onlight ? palette.blueberry600 : palette.white;\n  const circumference = 2 * Math.PI * radius;\n  const strokeDashoffset = circumference - (value / 100) * circumference;\n\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    if (overlay === Overlay.parent && wrapperRef.current?.parentElement?.style) {\n      wrapperRef.current.parentElement.style.position = 'relative';\n    }\n  }, []);\n\n  const wrapperClasses = classNames({\n    [styles['progressbar--overlay']]: overlay,\n    [styles['progressbar--overlay-screen']]: overlay === Overlay.screen,\n    [styles['progressbar--overlay-parent']]: overlay === Overlay.parent,\n  });\n\n  return (\n    <div\n      ref={wrapperRef}\n      className={wrapperClasses}\n      data-testid={testId}\n      role=\"progressbar\"\n      aria-valuenow={value}\n      aria-label={ariaLabel}\n      aria-live=\"polite\"\n      style={overlay === Overlay.screen ? { zIndex: ZIndex.OverlayScreen } : {}}\n    >\n      <svg\n        role=\"presentation\"\n        width={viewBoxSize}\n        height={viewBoxSize}\n        viewBox={`0 0 ${viewBoxSize} ${viewBoxSize}`}\n        className={styles['progressbar__svg']}\n      >\n        <circle cx={viewBoxCenter} cy={viewBoxCenter} r={radius} stroke={circleBackgroundColor} strokeWidth={strokeWidth} fill=\"none\" />\n        <circle\n          cx={viewBoxCenter}\n          cy={viewBoxCenter}\n          r={radius}\n          stroke={mainColor}\n          strokeWidth={strokeWidth}\n          fill=\"none\"\n          strokeDasharray={circumference}\n          strokeDashoffset={strokeDashoffset}\n          className={styles['progressbar__progress-circle']}\n          transform={`rotate(-90 ${viewBoxCenter} ${viewBoxCenter})`}\n        />{' '}\n        <text\n          className=\"progress-wheel__text--large\"\n          fontSize={'1.5rem'}\n          fill={mainColor}\n          x={viewBoxCenter}\n          y={viewBoxCenter}\n          textAnchor=\"middle\"\n          alignmentBaseline=\"middle\"\n        >\n          {size == ProgressbarSize.large && `${value}%`}\n        </text>\n      </svg>\n    </div>\n  );\n};\n\nexport default Progressbar;\n"],"names":["ProgressbarSize","ProgressBarMode","Overlay","Progressbar","value","size","mode","overlay","testId","ariaLabel","width","totalRadius","strokeWidth","radius","viewBoxSize","viewBoxCenter","circleBackgroundColor","palette","mainColor","circumference","strokeDashoffset","wrapperRef","useRef","useEffect","_b","_a","wrapperClasses","classNames","styles","React","ZIndex"],"mappings":"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"}

package/components/PromoPanel/PromoPanel.js

@@ -1,52 +0,0 @@
-import t from "react";
-import h from "classnames";
-import { AnalyticsId as C, IconSize as o } from "../../constants.js";
-import { useBreakpoint as b, Breakpoint as a } from "../../hooks/useBreakpoint.js";
-import { useHover as g } from "../../hooks/useHover.js";
-import { getColor as m } from "../../theme/currys/color.js";
-import { Icon as E } from "../Icon/Icon.js";
-import _ from "../Icons/ArrowRight.js";
-import P from "../Icons/ArrowUpRight.js";
-import { LazyIllustration as v } from "../LazyIllustration/LazyIllustration.js";
-import { Title as y } from "../Title/Title.js";
-import n from "../PromoPanel/styles.module.scss";
-const I = (e) => e.linkComponent ? t.cloneElement(e.linkComponent, { children: e.children }) : e.linkHtmlMarkup === "button" ? /* @__PURE__ */ t.createElement("button", { type: "button", onClick: e.linkOnClick }, e.children) : /* @__PURE__ */ t.createElement("a", { href: e.href, target: e.target, onClick: e.linkOnClick }, e.children), T = (e) => {
-  const { isHovered: c, hoverRef: u } = g(), { color: l = "neutral", titleHtmlMarkup: k = "h2", linkHtmlMarkup: f = "a" } = e, r = b(), s = h(
-    n.promopanel,
-    n[`promopanel--${l}`],
-    !e.illustration && n["promopanel--no-illustration"]
-  ), i = /* @__PURE__ */ t.createElement(
-    I,
-    {
-      href: e.href,
-      target: e.target,
-      linkComponent: e.linkComponent,
-      linkHtmlMarkup: f,
-      linkOnClick: e.linkOnClick
-    },
-    e.title || e.children
-  ), d = r >= a.md ? 156 : 110;
-  return /* @__PURE__ */ t.createElement("div", { className: s, "data-testid": e.testId, "data-analyticsid": C.PromoPanel, ref: u }, e.illustration && /* @__PURE__ */ t.createElement(
-    v,
-    {
-      illustrationName: e.illustration,
-      size: d,
-      color: l,
-      className: n.promopanel__illustration
-    }
-  ), /* @__PURE__ */ t.createElement("div", { className: n.promopanel__content }, e.title && /* @__PURE__ */ t.createElement(y, { htmlMarkup: k, appearance: "title3" }, i), e.title ? e.children : i), /* @__PURE__ */ t.createElement(
-    E,
-    {
-      className: n.promopanel__icon,
-      svgIcon: e.target === "_blank" ? P : _,
-      size: r >= a.md ? o.Small : o.XSmall,
-      isHovered: c,
-      color: m("blueberry", 500),
-      hoverColor: m("blueberry", 600)
-    }
-  ));
-};
-export {
-  T as default
-};
-//# sourceMappingURL=PromoPanel.js.map

package/components/PromoPanel/PromoPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PromoPanel.js","sources":["../../../src/components/PromoPanel/PromoPanel.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, IconSize } from '../../constants';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { getColor } from '../../theme/currys/color';\nimport { PaletteNames } from '../../theme/palette';\nimport { AnchorLinkTags, AnchorLinkTargets } from '../AnchorLink';\nimport Icon from '../Icon';\nimport ArrowRight from '../Icons/ArrowRight';\nimport ArrowUpRight from '../Icons/ArrowUpRight';\nimport LazyIllustration from '../LazyIllustration';\nimport Title, { TitleTags } from '../Title';\n\nimport styles from './styles.module.scss';\n\nexport type PromoPanelColors = Extract<PaletteNames, 'neutral' | 'blueberry' | 'cherry'>;\n\nexport interface PromoPanelProps {\n  /** Used as the link text if set. title or children must be set for the link to have accessible text. */\n  title?: string;\n  /** Used as the link text if title is not set. */\n  children?: string;\n  /** Illustration element */\n  illustration?: 'Doctor' | 'HealthcarePersonnel';\n  /** Changes the underlying element of the title. */\n  titleHtmlMarkup?: TitleTags;\n  /** Changes the background color. Default: white */\n  color?: PromoPanelColors;\n  /** Not used if linkComponent is set */\n  href?: string;\n  /** Anchor link target. If linkComponent is set, this prop is only used to display the right icon for external links. */\n  target?: AnchorLinkTargets;\n  /** HTML markup for anchor link. Not used if linkComponent is set. Default: a */\n  linkHtmlMarkup?: AnchorLinkTags;\n  /** Function that is called when clicked. Not used if linkComponent is set. */\n  linkOnClick?: () => void;\n  /** Custom link component. Must be \"a\" a or \"button\" element with no styling. */\n  linkComponent?: React.ReactElement;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\ninterface PromoPanelLinkProps {\n  children?: string;\n  href?: string;\n  target?: AnchorLinkTargets;\n  linkComponent?: React.ReactElement;\n  linkHtmlMarkup?: AnchorLinkTags;\n  linkOnClick?: () => void;\n}\n\nconst PromoPanelLink: React.FC<PromoPanelLinkProps> = props => {\n  if (props.linkComponent) {\n    return React.cloneElement(props.linkComponent, { children: props.children });\n  }\n\n  if (props.linkHtmlMarkup === 'button') {\n    return (\n      <button type={'button'} onClick={props.linkOnClick}>\n        {props.children}\n      </button>\n    );\n  }\n  return (\n    <a href={props.href} target={props.target} onClick={props.linkOnClick}>\n      {props.children}\n    </a>\n  );\n};\n\nconst PromoPanel: React.FC<PromoPanelProps> = props => {\n  const { isHovered, hoverRef } = useHover<HTMLDivElement>();\n\n  const { color = 'neutral', titleHtmlMarkup = 'h2', linkHtmlMarkup = 'a' } = props;\n\n  const breakpoint = useBreakpoint();\n\n  const promoPanelClasses = classNames(\n    styles.promopanel,\n    styles[`promopanel--${color}`],\n    !props.illustration && styles['promopanel--no-illustration']\n  );\n\n  const promoPanelLink = (\n    <PromoPanelLink\n      href={props.href}\n      target={props.target}\n      linkComponent={props.linkComponent}\n      linkHtmlMarkup={linkHtmlMarkup}\n      linkOnClick={props.linkOnClick}\n    >\n      {props.title || props.children}\n    </PromoPanelLink>\n  );\n\n  const illustrationSize = ((): number => {\n    if (breakpoint >= Breakpoint.md) {\n      return 156;\n    }\n\n    return 110;\n  })();\n\n  return (\n    <div className={promoPanelClasses} data-testid={props.testId} data-analyticsid={AnalyticsId.PromoPanel} ref={hoverRef}>\n      {props.illustration && (\n        <LazyIllustration\n          illustrationName={props.illustration}\n          size={illustrationSize}\n          color={color}\n          className={styles.promopanel__illustration}\n        />\n      )}\n      <div className={styles.promopanel__content}>\n        {props.title && (\n          <Title htmlMarkup={titleHtmlMarkup} appearance={'title3'}>\n            {promoPanelLink}\n          </Title>\n        )}\n        {!props.title ? promoPanelLink : props.children}\n      </div>\n      <Icon\n        className={styles.promopanel__icon}\n        svgIcon={props.target === '_blank' ? ArrowUpRight : ArrowRight}\n        size={breakpoint >= Breakpoint.md ? IconSize.Small : IconSize.XSmall}\n        isHovered={isHovered}\n        color={getColor('blueberry', 500)}\n        hoverColor={getColor('blueberry', 600)}\n      />\n    </div>\n  );\n};\n\nexport default PromoPanel;\n"],"names":["PromoPanelLink","props","React","PromoPanel","isHovered","hoverRef","useHover","color","titleHtmlMarkup","linkHtmlMarkup","breakpoint","useBreakpoint","promoPanelClasses","classNames","styles","promoPanelLink","illustrationSize","Breakpoint","AnalyticsId","LazyIllustration","Title","Icon","ArrowUpRight","ArrowRight","IconSize","getColor"],"mappings":";;;;;;;;;;;;AAsDA,MAAMA,IAAgD,CAASC,MACzDA,EAAM,gBACDC,EAAM,aAAaD,EAAM,eAAe,EAAE,UAAUA,EAAM,UAAU,IAGzEA,EAAM,mBAAmB,WAEzBC,gBAAAA,EAAA,cAAC,YAAO,MAAM,UAAU,SAASD,EAAM,YAAA,GACpCA,EAAM,QACT,IAIDC,gBAAAA,EAAA,cAAA,KAAA,EAAE,MAAMD,EAAM,MAAM,QAAQA,EAAM,QAAQ,SAASA,EAAM,YACvD,GAAAA,EAAM,QACT,GAIEE,IAAwC,CAASF,MAAA;AACrD,QAAM,EAAE,WAAAG,GAAW,UAAAC,EAAS,IAAIC,EAAyB,GAEnD,EAAE,OAAAC,IAAQ,WAAW,iBAAAC,IAAkB,MAAM,gBAAAC,IAAiB,IAAQ,IAAAR,GAEtES,IAAaC,KAEbC,IAAoBC;AAAA,IACxBC,EAAO;AAAA,IACPA,EAAO,eAAeP,CAAK,EAAE;AAAA,IAC7B,CAACN,EAAM,gBAAgBa,EAAO,6BAA6B;AAAA,EAAA,GAGvDC,IACJb,gBAAAA,EAAA;AAAA,IAACF;AAAA,IAAA;AAAA,MACC,MAAMC,EAAM;AAAA,MACZ,QAAQA,EAAM;AAAA,MACd,eAAeA,EAAM;AAAA,MACrB,gBAAAQ;AAAA,MACA,aAAaR,EAAM;AAAA,IAAA;AAAA,IAElBA,EAAM,SAASA,EAAM;AAAA,EAAA,GAIpBe,IACAN,KAAcO,EAAW,KACpB,MAGF;AAGT,SACGf,gBAAAA,EAAA,cAAA,OAAA,EAAI,WAAWU,GAAmB,eAAaX,EAAM,QAAQ,oBAAkBiB,EAAY,YAAY,KAAKb,EAAA,GAC1GJ,EAAM,gBACLC,gBAAAA,EAAA;AAAA,IAACiB;AAAA,IAAA;AAAA,MACC,kBAAkBlB,EAAM;AAAA,MACxB,MAAMe;AAAA,MACN,OAAAT;AAAA,MACA,WAAWO,EAAO;AAAA,IAAA;AAAA,EACpB,mCAED,OAAI,EAAA,WAAWA,EAAO,oBACpB,GAAAb,EAAM,SACLC,gBAAAA,EAAA,cAACkB,GAAM,EAAA,YAAYZ,GAAiB,YAAY,YAC7CO,CACH,GAEAd,EAAM,QAAyBA,EAAM,WAAvBc,CAClB,GACAb,gBAAAA,EAAA;AAAA,IAACmB;AAAA,IAAA;AAAA,MACC,WAAWP,EAAO;AAAA,MAClB,SAASb,EAAM,WAAW,WAAWqB,IAAeC;AAAA,MACpD,MAAMb,KAAcO,EAAW,KAAKO,EAAS,QAAQA,EAAS;AAAA,MAC9D,WAAApB;AAAA,MACA,OAAOqB,EAAS,aAAa,GAAG;AAAA,MAChC,YAAYA,EAAS,aAAa,GAAG;AAAA,IAAA;AAAA,EAAA,CAEzC;AAEJ;"}

package/components/RadioButton/RadioButton.js

@@ -1,104 +0,0 @@
-import u, { useState as P } from "react";
-import c from "classnames";
-import { FormMode as i, FormSize as U, AnalyticsId as W } from "../../constants.js";
-import { usePseudoClasses as q } from "../../hooks/usePseudoClasses.js";
-import { useUuid as G } from "../../hooks/useUuid.js";
-import { getAriaDescribedBy as H } from "../../utils/accessibility.js";
-import { isMutableRefObject as J, mergeRefs as K } from "../../utils/refs.js";
-import { uuid as Q } from "../../utils/uuid.js";
-import { ErrorWrapper as V } from "../ErrorWrapper/ErrorWrapper.js";
-import { getLabelText as X, renderLabelAsParent as Y } from "../Label/Label.js";
-import e from "../RadioButton/styles.module.scss";
-const be = (l, o, a, m) => {
-  const n = o === "oninvalid", t = l === m;
-  return c({
-    [e["radio-button-label__large--on-grey"]]: a && o === "ongrey" && !t,
-    [e["radio-button-label__large--on-blueberry"]]: o === "onblueberry" && !t && a,
-    [e["radio-button-label__large--selected"]]: a && t && !n,
-    [e["radio-button-label__large--selected-invalid"]]: a && t && n
-  });
-}, Z = u.forwardRef((l, o) => {
-  const {
-    className: a,
-    defaultChecked: m,
-    onChange: n,
-    disabled: t,
-    label: f,
-    inputId: p = Q(),
-    mode: d = i.onwhite,
-    name: v = p,
-    size: w,
-    errorText: _,
-    error: k = !!_,
-    errorTextId: B,
-    value: R = X(f),
-    testId: x,
-    required: L,
-    labelClassNames: N,
-    ...I
-  } = l, g = k || d === i.oninvalid, y = d === i.ondark, h = d === i.onblueberry, T = d === i.oninvalid, r = w === U.large, [E, A] = P(), { refObject: F, isFocused: s } = q(J(o) ? o : null), S = K([o, F]), C = G(B), j = c(e["radio-button-wrapper"], {
-    [e["radio-button-wrapper--with-error"]]: _,
-    [e["radio-button-wrapper__large"]]: r,
-    [e["radio-button-wrapper__large--focused"]]: r && s,
-    [e["radio-button-wrapper__large--selected"]]: r && E && s,
-    [e["radio-button-wrapper__large--invalid"]]: r && T && s,
-    [e["radio-button-wrapper__large--on-blueberry"]]: r && h && s
-  }), z = c(
-    e["radio-button-label"],
-    {
-      [e["radio-button-label--disabled"]]: t,
-      [e["radio-button-label--on-dark"]]: y,
-      [e["radio-button-label--invalid"]]: g,
-      [e["radio-button-label__large"]]: r,
-      [e["radio-button-label__large--disabled"]]: r && t
-    },
-    N
-  ), D = c(
-    e["radio-button"],
-    {
-      [e["radio-button--on-dark"]]: y,
-      [e["radio-button--disabled"]]: t,
-      [e["radio-button--on-blueberry"]]: h,
-      [e["radio-button--invalid"]]: g,
-      [e["radio-button__large"]]: r,
-      [e["radio-button__large--disabled"]]: r && t,
-      [e["radio-button__large--invalid"]]: r && g
-    },
-    a
-  ), M = (b) => {
-    A(b.target.checked), n && n(b);
-  }, O = () => /* @__PURE__ */ u.createElement(
-    "input",
-    {
-      id: p,
-      name: v,
-      className: D,
-      type: "radio",
-      disabled: t,
-      value: R,
-      ref: S,
-      defaultChecked: m,
-      "aria-describedby": H(l, C),
-      required: L,
-      ...I,
-      onChange: (b) => M(b)
-    }
-  );
-  return /* @__PURE__ */ u.createElement(V, { errorText: _, errorTextId: C }, /* @__PURE__ */ u.createElement("div", { "data-testid": x, "data-analyticsid": W.RadioButton, className: j }, Y(
-    f,
-    O(),
-    p,
-    d,
-    z,
-    void 0,
-    e["radiobutton-sublabel-wrapper"],
-    r
-  )));
-});
-Z.displayName = "RadioButton";
-export {
-  Z as RadioButton,
-  Z as default,
-  be as getRadioLabelClasses
-};
-//# sourceMappingURL=RadioButton.js.map

package/components/RadioButton/RadioButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RadioButton.js","sources":["../../../src/components/RadioButton/RadioButton.tsx"],"sourcesContent":["import React, { useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, FormMode, FormSize } from '../../constants';\nimport { usePseudoClasses } from '../../hooks/usePseudoClasses';\nimport { useUuid } from '../../hooks/useUuid';\nimport { getAriaDescribedBy } from '../../utils/accessibility';\nimport { isMutableRefObject, mergeRefs } from '../../utils/refs';\nimport { uuid } from '../../utils/uuid';\nimport ErrorWrapper from '../ErrorWrapper';\nimport { getLabelText, renderLabelAsParent } from '../Label';\n\nimport radioButtonStyles from './styles.module.scss';\n\nexport interface RadioButtonProps\n  extends Pick<\n    React.InputHTMLAttributes<HTMLInputElement>,\n    'aria-describedby' | 'name' | 'value' | 'disabled' | 'checked' | 'defaultChecked' | 'required' | 'onChange'\n  > {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** The <Label/> next to the radioButton - sublabels kan ikke kombineres med large variant */\n  label: React.ReactNode;\n  /** Adds custom classes to the label element. */\n  labelClassNames?: string;\n  /** input id of the radioButton */\n  inputId?: string;\n  /** Changes the visuals of the radioButton */\n  mode?: keyof typeof FormMode;\n  /** Changes the visuals of the radioButton. Large version only works when used inside a FormGroup wrapper. */\n  size?: keyof typeof FormSize;\n  /** Activates Error style for the radioButton - This is can be true while errorText is empty, when in a FormGroup */\n  error?: boolean;\n  /** Error text to show above the component */\n  errorText?: string;\n  /** Error text id */\n  errorTextId?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nexport const getRadioLabelClasses = (radioId: string, mode: FormMode, large: boolean, checkedRadioId?: string): string | undefined => {\n  const onCherry = mode === 'oninvalid';\n  const checked = radioId === checkedRadioId;\n\n  return classNames({\n    [radioButtonStyles['radio-button-label__large--on-grey']]: large && mode === 'ongrey' && !checked,\n    [radioButtonStyles['radio-button-label__large--on-blueberry']]: mode === 'onblueberry' && !checked && large,\n    [radioButtonStyles['radio-button-label__large--selected']]: large && checked && !onCherry,\n    [radioButtonStyles['radio-button-label__large--selected-invalid']]: large && checked && onCherry,\n  });\n};\n\nexport const RadioButton = React.forwardRef((props: RadioButtonProps, ref: React.Ref<HTMLInputElement>) => {\n  const {\n    className,\n    defaultChecked,\n    onChange,\n    disabled,\n    label,\n    inputId = uuid(),\n    mode = FormMode.onwhite,\n    name = inputId,\n    size,\n    errorText,\n    error = !!errorText,\n    errorTextId,\n    value = getLabelText(label),\n    testId,\n    required,\n    labelClassNames,\n    ...rest\n  } = props;\n  const invalid = error || mode === FormMode.oninvalid;\n  const onDark = mode === FormMode.ondark;\n  const onBlueberry = mode === FormMode.onblueberry;\n  const onCherry = mode === FormMode.oninvalid;\n  const isLarge = size === FormSize.large;\n  const [checked, changeChecked] = useState<boolean>();\n  const { refObject, isFocused } = usePseudoClasses<HTMLInputElement>(isMutableRefObject(ref) ? ref : null);\n  const mergedRefs = mergeRefs([ref, refObject]);\n  const errorTextUuid = useUuid(errorTextId);\n\n  const radioButtonWrapperClasses = classNames(radioButtonStyles['radio-button-wrapper'], {\n    [radioButtonStyles['radio-button-wrapper--with-error']]: errorText,\n    [radioButtonStyles['radio-button-wrapper__large']]: isLarge,\n    [radioButtonStyles['radio-button-wrapper__large--focused']]: isLarge && isFocused,\n    [radioButtonStyles['radio-button-wrapper__large--selected']]: isLarge && checked && isFocused,\n    [radioButtonStyles['radio-button-wrapper__large--invalid']]: isLarge && onCherry && isFocused,\n    [radioButtonStyles['radio-button-wrapper__large--on-blueberry']]: isLarge && onBlueberry && isFocused,\n  });\n  const radioButtonLabelClasses = classNames(\n    radioButtonStyles['radio-button-label'],\n    {\n      [radioButtonStyles['radio-button-label--disabled']]: disabled,\n      [radioButtonStyles['radio-button-label--on-dark']]: onDark,\n      [radioButtonStyles['radio-button-label--invalid']]: invalid,\n      [radioButtonStyles['radio-button-label__large']]: isLarge,\n      [radioButtonStyles['radio-button-label__large--disabled']]: isLarge && disabled,\n    },\n    labelClassNames\n  );\n  const radioButtonClasses = classNames(\n    radioButtonStyles['radio-button'],\n    {\n      [radioButtonStyles['radio-button--on-dark']]: onDark,\n      [radioButtonStyles['radio-button--disabled']]: disabled,\n      [radioButtonStyles['radio-button--on-blueberry']]: onBlueberry,\n      [radioButtonStyles['radio-button--invalid']]: invalid,\n      [radioButtonStyles['radio-button__large']]: isLarge,\n      [radioButtonStyles['radio-button__large--disabled']]: isLarge && disabled,\n      [radioButtonStyles['radio-button__large--invalid']]: isLarge && invalid,\n    },\n    className\n  );\n\n  const change = (e: React.ChangeEvent<HTMLInputElement>): void => {\n    changeChecked(e.target.checked);\n    onChange && onChange(e);\n  };\n\n  const getLabelContent = (): React.ReactNode => (\n    <input\n      id={inputId}\n      name={name}\n      className={radioButtonClasses}\n      type=\"radio\"\n      disabled={disabled}\n      value={value}\n      ref={mergedRefs}\n      defaultChecked={defaultChecked}\n      aria-describedby={getAriaDescribedBy(props, errorTextUuid)}\n      required={required}\n      {...rest}\n      onChange={(e): void => change(e)}\n    />\n  );\n\n  return (\n    <ErrorWrapper errorText={errorText} errorTextId={errorTextUuid}>\n      <div data-testid={testId} data-analyticsid={AnalyticsId.RadioButton} className={radioButtonWrapperClasses}>\n        {renderLabelAsParent(\n          label,\n          getLabelContent(),\n          inputId,\n          mode as FormMode,\n          radioButtonLabelClasses,\n          undefined,\n          radioButtonStyles['radiobutton-sublabel-wrapper'],\n          isLarge\n        )}\n      </div>\n    </ErrorWrapper>\n  );\n});\n\nRadioButton.displayName = 'RadioButton';\n\nexport default RadioButton;\n"],"names":["getRadioLabelClasses","radioId","mode","large","checkedRadioId","onCherry","checked","classNames","radioButtonStyles","RadioButton","React","props","ref","className","defaultChecked","onChange","disabled","label","inputId","uuid","FormMode","name","size","errorText","error","errorTextId","value","getLabelText","testId","required","labelClassNames","rest","invalid","onDark","onBlueberry","isLarge","FormSize","changeChecked","useState","refObject","isFocused","usePseudoClasses","isMutableRefObject","mergedRefs","mergeRefs","errorTextUuid","useUuid","radioButtonWrapperClasses","radioButtonLabelClasses","radioButtonClasses","change","e","getLabelContent","getAriaDescribedBy","ErrorWrapper","AnalyticsId","renderLabelAsParent"],"mappings":"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"}