@helsenorge/designsystem-react 9.0.0-beta.3 → 9.1.0

package/Avatar.js

@@ -1,34 +1,35 @@
 import { jsx as m } from "react/jsx-runtime";
-import p from "react";
-import v from "classnames";
-import { AnalyticsId as u, IconSize as b } from "./constants.js";
+import v from "react";
+import u from "classnames";
+import { AnalyticsId as b, IconSize as x } from "./constants.js";
 import { palette as o } from "./theme/palette.js";
-import { I as x } from "./Icon.js";
-import I from "./components/Icons/Check.js";
+import { I } from "./Icon.js";
+import y from "./components/Icons/Check.js";
 import a from "./components/Avatar/styles.module.scss";
 var A = /* @__PURE__ */ ((r) => (r.xsmall = "xsmall", r.small = "small", r))(A || {});
-const C = p.forwardRef(function(c, n) {
-  const { children: t, className: i = "", selected: l = !1, variant: s = "normal", size: e = "small", testId: d } = c, f = t.charAt(0).toLocaleUpperCase() + t.substring(1, 2);
+const j = v.forwardRef(function(c, i) {
+  const { children: t, className: n = "", selected: l = !1, variant: s = "normal", type: d = "normal", size: e = "small", testId: p } = c, f = t.charAt(0).toLocaleUpperCase() + t.substring(1, 2);
   return /* @__PURE__ */ m(
     "span",
     {
-      className: v(
+      className: u(
         a.avatar,
         l && a["avatar--selected"],
         s === "black" && a["avatar--black"],
+        d === "circle" && a["avatar--circle"],
         e === "xsmall" && a["avatar--xsmall"],
         e === "small" && a["avatar--small"],
-        i
+        n
       ),
-      ref: n,
-      "data-testid": d,
-      "data-analyticsid": u.Avatar,
-      children: l ? /* @__PURE__ */ m(x, { svgIcon: I, size: b.Small, color: s === "black" ? o.neutral900 : o.blueberry600 }) : f
+      ref: i,
+      "data-testid": p,
+      "data-analyticsid": b.Avatar,
+      children: l ? /* @__PURE__ */ m(I, { svgIcon: y, size: x.Small, color: s === "black" ? o.neutral900 : o.blueberry600 }) : f
     }
   );
 });
 export {
-  C as A,
+  j as A,
   A as a
 };
 //# sourceMappingURL=Avatar.js.map

package/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React from 'react';\n\nimport cn from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { palette } from '../../theme/palette';\nimport Icon, { IconSize } from '../Icon';\nimport Check from '../Icons/Check';\n\nimport styles from './styles.module.scss';\n\nexport enum AvatarSize {\n  xsmall = 'xsmall',\n  small = 'small',\n}\n\nexport interface AvatarProps {\n  /** Name to display in the avatar. Will be truncated to the first two characters. */\n  children: string;\n  /** Displays a check icon to indicated the selected state. */\n  selected?: boolean;\n  /** background and color will be determined on variant. */\n  variant?: 'normal' | 'black';\n  /** Avatar size. Default: small */\n  size?: keyof typeof AvatarSize;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type AvatarType = React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;\nconst Avatar: AvatarType = React.forwardRef(function AvatarForwardedRef(props: AvatarProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', selected = false, variant = 'normal', size = AvatarSize.small, testId } = props;\n  const truncatedName = children.charAt(0).toLocaleUpperCase() + children.substring(1, 2);\n  return (\n    <span\n      className={cn(\n        styles.avatar,\n        selected && styles['avatar--selected'],\n        variant === 'black' && styles['avatar--black'],\n        size === AvatarSize.xsmall && styles['avatar--xsmall'],\n        size === AvatarSize.small && styles['avatar--small'],\n        className\n      )}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Avatar}\n    >\n      {selected ? (\n        <Icon svgIcon={Check} size={IconSize.Small} color={variant === 'black' ? palette.neutral900 : palette.blueberry600} />\n      ) : (\n        truncatedName\n      )}\n    </span>\n  );\n});\n\nexport default Avatar;\n"],"names":["AvatarSize","Avatar","React","props","ref","children","className","selected","variant","size","testId","truncatedName","jsx","cn","styles","AnalyticsId","Icon","Check","IconSize","palette"],"mappings":";;;;;;;;AAWY,IAAAA,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA;AAoBZ,MAAMC,IAAqBC,EAAM,WAAW,SAA4BC,GAAoBC,GAAsC;AAC1H,QAAA,EAAE,UAAAC,GAAU,WAAAC,IAAY,IAAI,UAAAC,IAAW,IAAO,SAAAC,IAAU,UAAU,MAAAC,IAAO,SAAkB,QAAAC,EAAA,IAAWP,GACtGQ,IAAgBN,EAAS,OAAO,CAAC,EAAE,kBAAsB,IAAAA,EAAS,UAAU,GAAG,CAAC;AAEpF,SAAA,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAAA,QACTC,EAAO;AAAA,QACPP,KAAYO,EAAO,kBAAkB;AAAA,QACrCN,MAAY,WAAWM,EAAO,eAAe;AAAA,QAC7CL,MAAS,YAAqBK,EAAO,gBAAgB;AAAA,QACrDL,MAAS,WAAoBK,EAAO,eAAe;AAAA,QACnDR;AAAA,MACF;AAAA,MACA,KAAAF;AAAA,MACA,eAAaM;AAAA,MACb,oBAAkBK,EAAY;AAAA,MAE7B,UACCR,IAAA,gBAAAK,EAACI,GAAK,EAAA,SAASC,GAAO,MAAMC,EAAS,OAAO,OAAOV,MAAY,UAAUW,EAAQ,aAAaA,EAAQ,aAAc,CAAA,IAEpHR;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}
+{"version":3,"file":"Avatar.js","sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import React from 'react';\n\nimport cn from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { palette } from '../../theme/palette';\nimport Icon, { IconSize } from '../Icon';\nimport Check from '../Icons/Check';\n\nimport styles from './styles.module.scss';\n\nexport enum AvatarSize {\n  xsmall = 'xsmall',\n  small = 'small',\n}\n\nexport interface AvatarProps {\n  /** Name to display in the avatar. Will be truncated to the first two characters. */\n  children: string;\n  /** Displays a check icon to indicated the selected state. */\n  selected?: boolean;\n  /** background and color will be determined on variant. */\n  variant?: 'normal' | 'black';\n  /** @deprecated Square or circle variant of avatar. The circle should only be used for representation of someone else. NB: This is temporary and will be renamed in v10 */\n  type?: 'normal' | 'circle';\n  /** Avatar size. Default: small */\n  size?: keyof typeof AvatarSize;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type AvatarType = React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;\nconst Avatar: AvatarType = React.forwardRef(function AvatarForwardedRef(props: AvatarProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', selected = false, variant = 'normal', type = 'normal', size = AvatarSize.small, testId } = props;\n  const truncatedName = children.charAt(0).toLocaleUpperCase() + children.substring(1, 2);\n  return (\n    <span\n      className={cn(\n        styles.avatar,\n        selected && styles['avatar--selected'],\n        variant === 'black' && styles['avatar--black'],\n        type === 'circle' && styles['avatar--circle'],\n        size === AvatarSize.xsmall && styles['avatar--xsmall'],\n        size === AvatarSize.small && styles['avatar--small'],\n        className\n      )}\n      ref={ref}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Avatar}\n    >\n      {selected ? (\n        <Icon svgIcon={Check} size={IconSize.Small} color={variant === 'black' ? palette.neutral900 : palette.blueberry600} />\n      ) : (\n        truncatedName\n      )}\n    </span>\n  );\n});\n\nexport default Avatar;\n"],"names":["AvatarSize","Avatar","React","props","ref","children","className","selected","variant","type","size","testId","truncatedName","jsx","cn","styles","AnalyticsId","Icon","Check","IconSize","palette"],"mappings":";;;;;;;;AAWY,IAAAA,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA;AAsBZ,MAAMC,IAAqBC,EAAM,WAAW,SAA4BC,GAAoBC,GAAsC;AAChI,QAAM,EAAE,UAAAC,GAAU,WAAAC,IAAY,IAAI,UAAAC,IAAW,IAAO,SAAAC,IAAU,UAAU,MAAAC,IAAO,UAAU,MAAAC,IAAO,SAAkB,QAAAC,MAAWR,GACvHS,IAAgBP,EAAS,OAAO,CAAC,EAAE,kBAAsB,IAAAA,EAAS,UAAU,GAAG,CAAC;AAEpF,SAAA,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAAA,QACTC,EAAO;AAAA,QACPR,KAAYQ,EAAO,kBAAkB;AAAA,QACrCP,MAAY,WAAWO,EAAO,eAAe;AAAA,QAC7CN,MAAS,YAAYM,EAAO,gBAAgB;AAAA,QAC5CL,MAAS,YAAqBK,EAAO,gBAAgB;AAAA,QACrDL,MAAS,WAAoBK,EAAO,eAAe;AAAA,QACnDT;AAAA,MACF;AAAA,MACA,KAAAF;AAAA,MACA,eAAaO;AAAA,MACb,oBAAkBK,EAAY;AAAA,MAE7B,UACCT,IAAA,gBAAAM,EAACI,GAAK,EAAA,SAASC,GAAO,MAAMC,EAAS,OAAO,OAAOX,MAAY,UAAUY,EAAQ,aAAaA,EAAQ,aAAc,CAAA,IAEpHR;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}

package/Button.js

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

package/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 ButtonOnColor = 'onlight' | 'ondark';\nexport type ButtonTags = 'button' | 'a';\nexport type ButtonArrows = 'icon' | 'accessibility-character';\nexport type ButtonTextPosition = 'left' | 'centered';\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  onColor?: ButtonOnColor;\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  /** Sets the position of the text in the button - only applies when button is fluid */\n  textPosition?: ButtonTextPosition;\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    onColor = 'onlight',\n    onBlur,\n    onClick,\n    size = 'medium',\n    variant = 'fill',\n    href,\n    tabIndex,\n    testId,\n    target,\n    type = 'button',\n    textPosition = 'left',\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 = onColor === '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    [buttonStyles['button__text--centered']]: fluid && textPosition === 'centered',\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 && !disabled ? iconElement.props.color : iconColor,\n          isHovered: !disabled && 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","onColor","onBlur","onClick","size","variant","href","tabIndex","testId","target","type","textPosition","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","jsxs","jsx","renderbuttonContentWrapper","Icon","ArrowRight","Fragment","AnalyticsId"],"mappings":"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"}
+{"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 ButtonOnColor = 'onlight' | 'ondark';\nexport type ButtonTags = 'button' | 'a';\nexport type ButtonArrows = 'icon' | 'accessibility-character';\nexport type ButtonTextPosition = 'left' | 'centered';\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  onColor?: ButtonOnColor;\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  /** Adds custom classes to the text */\n  textClassName?: string;\n  /** Sets the position of the text in the button - only applies when button is fluid */\n  textPosition?: ButtonTextPosition;\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    onColor = 'onlight',\n    onBlur,\n    onClick,\n    size = 'medium',\n    variant = 'fill',\n    href,\n    tabIndex,\n    testId,\n    target,\n    type = 'button',\n    textClassName,\n    textPosition = 'left',\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 = onColor === '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(\n    buttonStyles['button__text'],\n    {\n      [buttonStyles['button__text--ellipsis']]: ellipsis,\n      [buttonStyles['button__text--centered']]: fluid && textPosition === 'centered',\n    },\n    textClassName\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 && !disabled ? iconElement.props.color : iconColor,\n          isHovered: !disabled && 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","onColor","onBlur","onClick","size","variant","href","tabIndex","testId","target","type","textClassName","textPosition","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","jsxs","jsx","renderbuttonContentWrapper","Icon","ArrowRight","Fragment","AnalyticsId"],"mappings":"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"}

package/CHANGELOG.md

@@ -1,3 +1,60 @@
+## [9.0.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv8.8.0&targetVersion=GTv9.0.0) (2024-11-05)
+
+## 9.0.0-beta.3 (2024-10-29)
+
+## 9.0.0-beta.2 (2024-10-29)
+
+## 9.0.0-beta.1 (2024-10-25)
+
+### Features
+
+- legg til invalidFormatErrorMessage som parameter i valideringsfunksjoner
+  ([2270650](https://github.com/helsenorge/designsystem/commit/22706507750a5968d9998b5430430b8de3b75683)), closes
+  [#333981](https://github.com/helsenorge/designsystem/issues/333981)
+- **slider:** legger til validering, og ref og endre signatur til onchange
+  ([5d5148a](https://github.com/helsenorge/designsystem/commit/5d5148ae5833c463f4bb7069ee704bc44d44d30f)), closes
+  [#329653](https://github.com/helsenorge/designsystem/issues/329653)
+
+## 9.0.0-beta.0 (2024-10-17)
+
+### Features
+
+- endre fra mode til oncolor ([3491c74](https://github.com/helsenorge/designsystem/commit/3491c7438b743e4e05d78ddd130a5f3797b5b55a)), closes
+  [#331833](https://github.com/helsenorge/designsystem/issues/331833)
+- validate gir skjema komponenter spacing
+  ([c984428](https://github.com/helsenorge/designsystem/commit/c98442817d8f4a799e7c1d6a473dd215148ca7cd)), closes
+  [#331167](https://github.com/helsenorge/designsystem/issues/331167)
+- **expanderlist:** fjern sticky mulighet
+  ([c0b7df9](https://github.com/helsenorge/designsystem/commit/c0b7df9eeb186f74de16b9e7d7f11601e0e5794b)), closes
+  [#332677](https://github.com/helsenorge/designsystem/issues/332677)
+- **expanderlist:** nytt design ([eb4d0f3](https://github.com/helsenorge/designsystem/commit/eb4d0f36d53401764033678dd571a10b481227e4)),
+  closes [#332677](https://github.com/helsenorge/designsystem/issues/332677)
+- **sharingstatus:** fjern fargevalg blueberry og banana
+  ([26db632](https://github.com/helsenorge/designsystem/commit/26db6326baeae2f7868d34b5a085c76a022e9345)), closes
+  [#328894](https://github.com/helsenorge/designsystem/issues/328894)
+- **tabs:** designendringer for mobiltilpasning
+  ([8ba1309](https://github.com/helsenorge/designsystem/commit/8ba13094a038b3077c07c870e1cb46ace0597f85)), closes
+  [#331142](https://github.com/helsenorge/designsystem/issues/331142)
+
+### Bug Fixes
+
+- ikke vis fadeout om siste tab er valgt
+  ([f0fe5a9](https://github.com/helsenorge/designsystem/commit/f0fe5a9ee1d928a0ae093bbed0909c3bce951498)), closes
+  [#331142](https://github.com/helsenorge/designsystem/issues/331142)
+- **dropdown:** import av feil oncolor
+  ([f305cae](https://github.com/helsenorge/designsystem/commit/f305caea3c7cdcf4d312bc0f3b6af1d839a0aaca)), closes
+  [#331833](https://github.com/helsenorge/designsystem/issues/331833)
+
+## [8.8.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv8.7.0&targetVersion=GTv8.8.0) (2024-11-04)
+
+### Features
+
+- **input:** eksponer inputmode som prop
+  ([6bc9883](https://github.com/helsenorge/designsystem/commit/6bc98831c582f0356c04be50d9d3be1b4c65ba98)), closes
+  [#333385](https://github.com/helsenorge/designsystem/issues/333385)
+- **textarea:** ny prop value ([fd9a116](https://github.com/helsenorge/designsystem/commit/fd9a11697229b87f88f135b8a5c16f7853cc9ead)),
+  closes [#335948](https://github.com/helsenorge/designsystem/issues/335948)
+
 ## [8.7.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv8.6.0&targetVersion=GTv8.7.0) (2024-10-17)
 
 ### Features
@@ -1805,12 +1862,12 @@ Dette er fordi vi skal kunne dynamisk importere alt som ligger i Icons, så da b
 
 ### Bug Fixes
 
-- økt kontrast på understreking av lenker
-  ([50b7fa4](https://github.com/helsenorge/designsystem/commit/50b7fa47fb44cb7d75fb877bd53e2309b35e1e21)), closes
-  [#229049](https://github.com/helsenorge/designsystem/issues/229049)
 - panel har avstand fra tittel til badge
   ([09034c4](https://github.com/helsenorge/designsystem/commit/09034c4844408c7cfe8f65d7a1a0d82a7828c2ef)), closes
   [#282359](https://github.com/helsenorge/designsystem/issues/282359)
+- økt kontrast på understreking av lenker
+  ([50b7fa4](https://github.com/helsenorge/designsystem/commit/50b7fa47fb44cb7d75fb877bd53e2309b35e1e21)), closes
+  [#229049](https://github.com/helsenorge/designsystem/issues/229049)
 
 ## [1.2.2](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv1.2.1&targetVersion=GTv1.2.2) (2022-08-31)
 

package/Expander.js

@@ -1,23 +1,23 @@
 import { jsxs as m, jsx as t } from "react/jsx-runtime";
 import { useRef as C } from "react";
-import i from "classnames";
-import { ZIndex as O, AnalyticsId as z, IconSize as c } from "./constants.js";
+import d from "classnames";
+import { ZIndex as O, AnalyticsId as b, IconSize as c } from "./constants.js";
 import { useExpand as U } from "./hooks/useExpand.js";
 import { useHover as Z } from "./hooks/useHover.js";
 import { useSticky as q } from "./hooks/useSticky.js";
 import { B as F } from "./Button.js";
 import { I as x } from "./Icon.js";
-import E from "./components/Icons/ChevronDown.js";
-import b from "./components/Icons/ChevronUp.js";
+import z from "./components/Icons/ChevronDown.js";
+import E from "./components/Icons/ChevronUp.js";
 import { L as G } from "./LazyIcon.js";
 import e from "./components/Expander/styles.module.scss";
 var J = /* @__PURE__ */ ((s) => (s.small = "small", s.large = "large", s))(J || {});
-const ie = (s) => {
+const de = (s) => {
   const {
-    title: g,
+    title: _,
     children: k,
     size: n = "small",
-    color: _,
+    color: g,
     contentClassNames: $,
     svgIcon: a,
     expanded: S = !1,
@@ -27,10 +27,10 @@ const ie = (s) => {
     onExpand: W,
     renderChildrenWhenClosed: X = !1,
     zIndex: B = O.ExpanderTrigger
-  } = s, [r, u] = U(S, W), v = C(null), d = C(null), { isHovered: l } = Z(d), { isOutsideWindow: H, isLeavingWindow: h, offsetHeight: y, contentWidth: I } = q(v, d), o = L && r && H, N = (p) => /* @__PURE__ */ t("span", { className: i(e.expander__icon, e[`expander__icon--${p}`]), children: /* @__PURE__ */ t(x, { svgIcon: r ? b : E, size: c.XSmall, isHovered: l }) }), R = i(
+  } = s, [r, u] = U(S, W), v = C(null), i = C(null), { isHovered: l } = Z(i), { isOutsideWindow: H, isLeavingWindow: h, offsetHeight: y, contentWidth: I } = q(v, i), o = L && r && H, N = (p) => /* @__PURE__ */ t("span", { className: d(e.expander__icon, e[`expander__icon--${p}`]), children: /* @__PURE__ */ t(x, { svgIcon: r ? E : z, size: c.XSmall, isHovered: l }) }), R = d(
     e.expander__trigger,
     n === "large" && e[`expander__trigger--${n}`],
-    n === "large" && e[`expander__trigger--${_ || "neutral"}`],
+    n === "large" && e[`expander__trigger--${g || "neutral"}`],
     n === "large" && a && e["expander__trigger--icon"],
     r && e["expander__trigger--expanded"],
     o && !h && e["expander__trigger--sticky"]
@@ -44,18 +44,18 @@ const ie = (s) => {
         width: o && I ? `${I}px` : void 0
       },
       "aria-expanded": r,
-      ref: d,
+      ref: i,
       onClick: () => u(!r),
       "data-testid": f,
-      "data-analyticsid": z.Expander,
+      "data-analyticsid": b.Expander,
       children: [
         n === "small" && N("left"),
-        a && /* @__PURE__ */ t("span", { className: i(e.expander__icon, e["expander__icon--left"]), children: typeof a == "string" ? /* @__PURE__ */ t(G, { iconName: a, size: c.XSmall, isHovered: l }) : /* @__PURE__ */ t(x, { svgIcon: a, size: c.XSmall, isHovered: l }) }),
-        g,
+        a && /* @__PURE__ */ t("span", { className: d(e.expander__icon, e["expander__icon--left"]), children: typeof a == "string" ? /* @__PURE__ */ t(G, { iconName: a, size: c.XSmall, isHovered: l }) : /* @__PURE__ */ t(x, { svgIcon: a, size: c.XSmall, isHovered: l }) }),
+        _,
         n === "large" && N("right")
       ]
     }
-  ), j = i(
+  ), j = d(
     e.expander__button,
     r && e["expander__button--expanded"],
     o && !h && e["expander__button--sticky"]
@@ -63,24 +63,25 @@ const ie = (s) => {
     F,
     {
       variant: "borderless",
+      textClassName: e.expander__button__text,
       className: j,
       "aria-expanded": r,
-      ref: d,
+      ref: i,
       onClick: () => u(!r),
       testId: f,
-      "data-analyticsid": z.Expander,
+      "data-analyticsid": b.Expander,
       children: [
-        /* @__PURE__ */ t(x, { svgIcon: r ? b : E, size: c.XSmall }),
-        g
+        /* @__PURE__ */ t(x, { svgIcon: r ? E : z, size: c.XSmall }),
+        _
       ]
     }
   ), D = () => {
     if (!X && !r)
       return null;
-    const p = i(
+    const p = d(
       e.expander__content,
       e[`expander__content--${n}`],
-      n === "large" && e[`expander__content--${_ || "neutral"}`],
+      n === "large" && e[`expander__content--${g || "neutral"}`],
       n === "large" && a && e["expander__content--icon"],
       r && e["expander__content--expanded"],
       n === "small" && !w && e["expander__content--nested-line"],
@@ -102,7 +103,7 @@ const ie = (s) => {
   );
 };
 export {
-  ie as E,
+  de as E,
   J as a
 };
 //# sourceMappingURL=Expander.js.map

package/Expander.js.map

@@ -1 +1 @@
-{"version":3,"file":"Expander.js","sources":["../src/components/Expander/Expander.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, ZIndex } from '../../constants';\nimport { useExpand } from '../../hooks/useExpand';\nimport { useHover } from '../../hooks/useHover';\nimport { useSticky } from '../../hooks/useSticky';\nimport { PaletteNames } from '../../theme/palette';\nimport Button from '../Button';\nimport Icon, { IconSize, SvgIcon } from '../Icon';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\nimport { IconName } from '../Icons/IconNames';\nimport LazyIcon from '../LazyIcon';\n\nimport styles from './styles.module.scss';\n\nexport enum ExpanderSize {\n  small = 'small',\n  large = 'large',\n}\n\nexport type ExpanderColors = Extract<PaletteNames, 'banana' | 'blueberry' | 'cherry' | 'kiwi' | 'neutral' | 'plum' | 'white'>;\n\nexport interface ExpanderProps {\n  /** Sets the trigger title */\n  title: string;\n  /** Sets the expanded content */\n  children?: React.ReactNode;\n  /** Sets classnames on the content area */\n  contentClassNames?: string;\n  /** Sets the size of the expander. Default: ExpanderSize.small */\n  size?: ExpanderSize;\n  /** Sets the background of the expander. Requires size=ExpanderSize.large. */\n  color?: ExpanderColors;\n  /** Adds an icon to the expander trigger. Requires size=ExpanderSize.large. */\n  svgIcon?: SvgIcon | IconName;\n  /** Opens or closes the expander */\n  expanded?: boolean;\n  /** Removes border to the left of the content. Requires size=ExpanderSize.small. */\n  noNestedLine?: boolean;\n  /** Stick expander trigger to top of screen while scrolling down */\n  sticky?: boolean;\n  /** Called when expander is open/closed. */\n  onExpand?: (isExpanded: boolean) => void;\n  /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */\n  renderChildrenWhenClosed?: boolean;\n  /** Sets the data-testid attribute on the expander button. */\n  testId?: string;\n  /** Overrides the default z-index of the expander header */\n  zIndex?: number;\n}\n\nconst Expander: React.FC<ExpanderProps> = props => {\n  const {\n    title,\n    children,\n    size = ExpanderSize.small,\n    color,\n    contentClassNames,\n    svgIcon: icon,\n    expanded = false,\n    noNestedLine = false,\n    sticky = false,\n    testId,\n    onExpand,\n    renderChildrenWhenClosed = false,\n    zIndex = ZIndex.ExpanderTrigger,\n  } = props;\n  const [isExpanded, setIsExpanded] = useExpand(expanded, onExpand);\n  const expanderRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const { isHovered } = useHover(triggerRef);\n  const { isOutsideWindow, isLeavingWindow, offsetHeight, contentWidth } = useSticky(expanderRef, triggerRef);\n\n  const isSticky = sticky && isExpanded && isOutsideWindow;\n\n  const renderChevron = (align: 'left' | 'right'): React.ReactNode => (\n    <span className={classNames(styles['expander__icon'], styles[`expander__icon--${align}`])}>\n      <Icon svgIcon={isExpanded ? ChevronUp : ChevronDown} size={IconSize.XSmall} isHovered={isHovered} />\n    </span>\n  );\n\n  const triggerClassName = classNames(\n    styles['expander__trigger'],\n    size === ExpanderSize.large && styles[`expander__trigger--${size}`],\n    size === ExpanderSize.large && styles[`expander__trigger--${color || 'neutral'}`],\n    size === ExpanderSize.large && icon && styles['expander__trigger--icon'],\n    isExpanded && styles['expander__trigger--expanded'],\n    isSticky && !isLeavingWindow && styles['expander__trigger--sticky']\n  );\n\n  const renderTrigger = (): React.ReactNode => (\n    <button\n      type=\"button\"\n      className={triggerClassName}\n      style={{\n        zIndex: isHovered || isSticky ? zIndex : undefined,\n        width: isSticky && contentWidth ? `${contentWidth}px` : undefined,\n      }}\n      aria-expanded={isExpanded}\n      ref={triggerRef}\n      onClick={(): void => setIsExpanded(!isExpanded)}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Expander}\n    >\n      {size === ExpanderSize.small && renderChevron('left')}\n      {icon && (\n        <span className={classNames(styles['expander__icon'], styles['expander__icon--left'])}>\n          {typeof icon === 'string' ? (\n            <LazyIcon iconName={icon} size={IconSize.XSmall} isHovered={isHovered} />\n          ) : (\n            <Icon svgIcon={icon} size={IconSize.XSmall} isHovered={isHovered} />\n          )}\n        </span>\n      )}\n      {title}\n      {size === ExpanderSize.large && renderChevron('right')}\n    </button>\n  );\n\n  const buttonClassName = classNames(\n    styles['expander__button'],\n    isExpanded && styles['expander__button--expanded'],\n    isSticky && !isLeavingWindow && styles['expander__button--sticky']\n  );\n\n  const renderButton = (): React.ReactNode => (\n    <Button\n      variant=\"borderless\"\n      className={buttonClassName}\n      aria-expanded={isExpanded}\n      ref={triggerRef}\n      onClick={(): void => setIsExpanded(!isExpanded)}\n      testId={testId}\n      data-analyticsid={AnalyticsId.Expander}\n    >\n      <Icon svgIcon={isExpanded ? ChevronUp : ChevronDown} size={IconSize.XSmall} />\n      {title}\n    </Button>\n  );\n\n  const renderContent = (): React.ReactNode => {\n    if (!renderChildrenWhenClosed && !isExpanded) {\n      return null;\n    }\n\n    const contentClassName = classNames(\n      styles['expander__content'],\n      styles[`expander__content--${size}`],\n      size === ExpanderSize.large && styles[`expander__content--${color || 'neutral'}`],\n      size === ExpanderSize.large && icon && styles['expander__content--icon'],\n      isExpanded && styles['expander__content--expanded'],\n      size === ExpanderSize.small && !noNestedLine && styles['expander__content--nested-line'],\n      contentClassNames\n    );\n\n    return <div className={contentClassName}>{children}</div>;\n  };\n\n  return (\n    <div\n      className={styles['expander']}\n      ref={expanderRef}\n      style={{ paddingTop: isSticky && offsetHeight ? `${offsetHeight}px` : undefined }}\n    >\n      {size === ExpanderSize.large ? renderTrigger() : renderButton()}\n      {renderContent()}\n    </div>\n  );\n};\n\nexport default Expander;\n"],"names":["ExpanderSize","Expander","props","title","children","size","color","contentClassNames","icon","expanded","noNestedLine","sticky","testId","onExpand","renderChildrenWhenClosed","zIndex","ZIndex","isExpanded","setIsExpanded","useExpand","expanderRef","useRef","triggerRef","isHovered","useHover","isOutsideWindow","isLeavingWindow","offsetHeight","contentWidth","useSticky","isSticky","renderChevron","align","jsx","classNames","styles","Icon","ChevronUp","ChevronDown","IconSize","triggerClassName","renderTrigger","jsxs","AnalyticsId","LazyIcon","buttonClassName","renderButton","Button","renderContent","contentClassName"],"mappings":"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"}
+{"version":3,"file":"Expander.js","sources":["../src/components/Expander/Expander.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId, ZIndex } from '../../constants';\nimport { useExpand } from '../../hooks/useExpand';\nimport { useHover } from '../../hooks/useHover';\nimport { useSticky } from '../../hooks/useSticky';\nimport { PaletteNames } from '../../theme/palette';\nimport Button from '../Button';\nimport Icon, { IconSize, SvgIcon } from '../Icon';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\nimport { IconName } from '../Icons/IconNames';\nimport LazyIcon from '../LazyIcon';\n\nimport styles from './styles.module.scss';\n\nexport enum ExpanderSize {\n  small = 'small',\n  large = 'large',\n}\n\nexport type ExpanderColors = Extract<PaletteNames, 'banana' | 'blueberry' | 'cherry' | 'kiwi' | 'neutral' | 'plum' | 'white'>;\n\nexport interface ExpanderProps {\n  /** Sets the trigger title */\n  title: string;\n  /** Sets the expanded content */\n  children?: React.ReactNode;\n  /** Sets classnames on the content area */\n  contentClassNames?: string;\n  /** Sets the size of the expander. Default: ExpanderSize.small */\n  size?: ExpanderSize;\n  /** Sets the background of the expander. Requires size=ExpanderSize.large. */\n  color?: ExpanderColors;\n  /** Adds an icon to the expander trigger. Requires size=ExpanderSize.large. */\n  svgIcon?: SvgIcon | IconName;\n  /** Opens or closes the expander */\n  expanded?: boolean;\n  /** Removes border to the left of the content. Requires size=ExpanderSize.small. */\n  noNestedLine?: boolean;\n  /** Stick expander trigger to top of screen while scrolling down */\n  sticky?: boolean;\n  /** Called when expander is open/closed. */\n  onExpand?: (isExpanded: boolean) => void;\n  /** Whether to render children when closed (in which case they are hidden with CSS). Default: false */\n  renderChildrenWhenClosed?: boolean;\n  /** Sets the data-testid attribute on the expander button. */\n  testId?: string;\n  /** Overrides the default z-index of the expander header */\n  zIndex?: number;\n}\n\nconst Expander: React.FC<ExpanderProps> = props => {\n  const {\n    title,\n    children,\n    size = ExpanderSize.small,\n    color,\n    contentClassNames,\n    svgIcon: icon,\n    expanded = false,\n    noNestedLine = false,\n    sticky = false,\n    testId,\n    onExpand,\n    renderChildrenWhenClosed = false,\n    zIndex = ZIndex.ExpanderTrigger,\n  } = props;\n  const [isExpanded, setIsExpanded] = useExpand(expanded, onExpand);\n  const expanderRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const { isHovered } = useHover(triggerRef);\n  const { isOutsideWindow, isLeavingWindow, offsetHeight, contentWidth } = useSticky(expanderRef, triggerRef);\n\n  const isSticky = sticky && isExpanded && isOutsideWindow;\n\n  const renderChevron = (align: 'left' | 'right'): React.ReactNode => (\n    <span className={classNames(styles['expander__icon'], styles[`expander__icon--${align}`])}>\n      <Icon svgIcon={isExpanded ? ChevronUp : ChevronDown} size={IconSize.XSmall} isHovered={isHovered} />\n    </span>\n  );\n\n  const triggerClassName = classNames(\n    styles['expander__trigger'],\n    size === ExpanderSize.large && styles[`expander__trigger--${size}`],\n    size === ExpanderSize.large && styles[`expander__trigger--${color || 'neutral'}`],\n    size === ExpanderSize.large && icon && styles['expander__trigger--icon'],\n    isExpanded && styles['expander__trigger--expanded'],\n    isSticky && !isLeavingWindow && styles['expander__trigger--sticky']\n  );\n\n  const renderTrigger = (): React.ReactNode => (\n    <button\n      type=\"button\"\n      className={triggerClassName}\n      style={{\n        zIndex: isHovered || isSticky ? zIndex : undefined,\n        width: isSticky && contentWidth ? `${contentWidth}px` : undefined,\n      }}\n      aria-expanded={isExpanded}\n      ref={triggerRef}\n      onClick={(): void => setIsExpanded(!isExpanded)}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Expander}\n    >\n      {size === ExpanderSize.small && renderChevron('left')}\n      {icon && (\n        <span className={classNames(styles['expander__icon'], styles['expander__icon--left'])}>\n          {typeof icon === 'string' ? (\n            <LazyIcon iconName={icon} size={IconSize.XSmall} isHovered={isHovered} />\n          ) : (\n            <Icon svgIcon={icon} size={IconSize.XSmall} isHovered={isHovered} />\n          )}\n        </span>\n      )}\n      {title}\n      {size === ExpanderSize.large && renderChevron('right')}\n    </button>\n  );\n\n  const buttonClassName = classNames(\n    styles['expander__button'],\n    isExpanded && styles['expander__button--expanded'],\n    isSticky && !isLeavingWindow && styles['expander__button--sticky']\n  );\n\n  const renderButton = (): React.ReactNode => (\n    <Button\n      variant=\"borderless\"\n      textClassName={styles['expander__button__text']}\n      className={buttonClassName}\n      aria-expanded={isExpanded}\n      ref={triggerRef}\n      onClick={(): void => setIsExpanded(!isExpanded)}\n      testId={testId}\n      data-analyticsid={AnalyticsId.Expander}\n    >\n      <Icon svgIcon={isExpanded ? ChevronUp : ChevronDown} size={IconSize.XSmall} />\n      {title}\n    </Button>\n  );\n\n  const renderContent = (): React.ReactNode => {\n    if (!renderChildrenWhenClosed && !isExpanded) {\n      return null;\n    }\n\n    const contentClassName = classNames(\n      styles['expander__content'],\n      styles[`expander__content--${size}`],\n      size === ExpanderSize.large && styles[`expander__content--${color || 'neutral'}`],\n      size === ExpanderSize.large && icon && styles['expander__content--icon'],\n      isExpanded && styles['expander__content--expanded'],\n      size === ExpanderSize.small && !noNestedLine && styles['expander__content--nested-line'],\n      contentClassNames\n    );\n\n    return <div className={contentClassName}>{children}</div>;\n  };\n\n  return (\n    <div\n      className={styles['expander']}\n      ref={expanderRef}\n      style={{ paddingTop: isSticky && offsetHeight ? `${offsetHeight}px` : undefined }}\n    >\n      {size === ExpanderSize.large ? renderTrigger() : renderButton()}\n      {renderContent()}\n    </div>\n  );\n};\n\nexport default Expander;\n"],"names":["ExpanderSize","Expander","props","title","children","size","color","contentClassNames","icon","expanded","noNestedLine","sticky","testId","onExpand","renderChildrenWhenClosed","zIndex","ZIndex","isExpanded","setIsExpanded","useExpand","expanderRef","useRef","triggerRef","isHovered","useHover","isOutsideWindow","isLeavingWindow","offsetHeight","contentWidth","useSticky","isSticky","renderChevron","align","jsx","classNames","styles","Icon","ChevronUp","ChevronDown","IconSize","triggerClassName","renderTrigger","jsxs","AnalyticsId","LazyIcon","buttonClassName","renderButton","Button","renderContent","contentClassName"],"mappings":"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"}