@helsenorge/designsystem-react 8.5.0 → 8.5.1

package/components/Stepper/DotList.js

@@ -1,7 +0,0 @@
-import e from "react";
-import l from "./Dot.js";
-const p = ({ allowedValues: m, currentValue: o, distanceBetweenDots: r }) => /* @__PURE__ */ e.createElement(e.Fragment, null, m.map((t, a) => /* @__PURE__ */ e.createElement(l, { index: a, key: t, completed: t < o, distanceBetweenDots: r })));
-export {
-  p as default
-};
-//# sourceMappingURL=DotList.js.map

package/components/Stepper/DotList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DotList.js","sources":["../../../src/components/Stepper/DotList.tsx"],"sourcesContent":["import React from 'react';\n\nimport Dot from './Dot';\n\ninterface DotListProps {\n  allowedValues: number[];\n  currentValue: number;\n  distanceBetweenDots: number;\n}\n\nconst Dots: React.FC<DotListProps> = ({ allowedValues, currentValue, distanceBetweenDots }) => (\n  <>\n    {allowedValues.map((value, index) => (\n      <Dot index={index} key={value} completed={value < currentValue} distanceBetweenDots={distanceBetweenDots} />\n    ))}\n  </>\n);\n\nexport default Dots;\n"],"names":["Dots","allowedValues","currentValue","distanceBetweenDots","React","value","index","Dot"],"mappings":";;AAUM,MAAAA,IAA+B,CAAC,EAAE,eAAAC,GAAe,cAAAC,GAAc,qBAAAC,EAAoB,MAEpFC,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MAAAH,EAAc,IAAI,CAACI,GAAOC,MACzBF,gBAAAA,EAAA,cAACG,GAAI,EAAA,OAAAD,GAAc,KAAKD,GAAO,WAAWA,IAAQH,GAAc,qBAAAC,EAA0C,CAAA,CAC3G,CACH;"}

package/components/Stepper/Stepper.js

@@ -1,35 +0,0 @@
-import e, { useRef as d } from "react";
-import u from "./Dot.js";
-import V from "./DotList.js";
-import { getAllowedValues as k, getMaximumDots as M, getDistanceBetweenDots as N, getValidatedProps as P, getMarkerPosition as $ } from "./utils.js";
-import { AnalyticsId as R } from "../../constants.js";
-import { useSize as f } from "../../hooks/useSize.js";
-import { getAriaLabelAttributes as S } from "../../utils/accessibility.js";
-import s from "../Stepper/styles.module.scss";
-const X = ({ ariaLabelledById: g, ariaLabel: w, value: x, min: b = 0, max: h = 2, testId: D }) => {
-  const n = d(null), i = d(null), { width: E = 0 } = f(n) || {}, { width: m = 0 } = f(i) || {}, { validatedValue: t, validatedMin: o, validatedMax: a } = P(x, b, h), r = k(o, a), v = r.indexOf(t), A = M(E), p = N(m, r.length), c = $(p, v), l = r.length <= A, _ = t === a, y = S({ label: w, id: g });
-  return /* @__PURE__ */ e.createElement("div", { className: s["stepper-wrapper"], ref: n }, /* @__PURE__ */ e.createElement(
-    "span",
-    {
-      role: "progressbar",
-      ...y,
-      "aria-valuenow": t,
-      "aria-valuemin": o,
-      "aria-valuemax": a,
-      className: s.stepper,
-      style: {
-        backgroundPositionX: `${_ ? m : c}px`
-      },
-      ref: i,
-      "data-testid": D,
-      "data-analyticsid": R.Stepper
-    },
-    l && /* @__PURE__ */ e.createElement(V, { allowedValues: r, currentValue: t, distanceBetweenDots: p }),
-    !l && /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(u, { completed: t > o, position: "left" }), /* @__PURE__ */ e.createElement(u, { completed: t === a, position: "right" })),
-    /* @__PURE__ */ e.createElement("span", { className: s.stepper__marker, style: { left: `${c}px` } })
-  ), !l && /* @__PURE__ */ e.createElement("span", { className: s.stepper__number }, `${t}/${a}`));
-};
-export {
-  X as default
-};
-//# sourceMappingURL=Stepper.js.map

package/components/Stepper/Stepper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stepper.js","sources":["../../../src/components/Stepper/Stepper.tsx"],"sourcesContent":["import React, { useRef } from 'react';\n\nimport Dot from './Dot';\nimport DotList from './DotList';\nimport { getMaximumDots, getDistanceBetweenDots, getMarkerPosition, getAllowedValues, getValidatedProps } from './utils';\nimport { AnalyticsId } from '../../constants';\nimport { useSize } from '../../hooks/useSize';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\n\nimport styles from './styles.module.scss';\n\nexport interface StepperProps {\n  /**\n   * Sets aria-label of the stepper. ariaLabel or ariaLabelledById MUST be set!\n   */\n  ariaLabel?: string;\n  /**\n   * Sets aria-labelledby of the stepper. ariaLabel or ariaLabelledById MUST be set!\n   */\n  ariaLabelledById?: string;\n  /**\n   * Current value. Must be between min and max\n   */\n  value?: number;\n  /**\n   * Minimum value\n   */\n  min?: number;\n  /**\n   * Maximum value\n   */\n  max?: number;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst Stepper: React.FC<StepperProps> = ({ ariaLabelledById, ariaLabel, value, min = 0, max = 2, testId }) => {\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const ref = useRef<HTMLSpanElement>(null);\n  const { width: wrapperWidth = 0 } = useSize(wrapperRef) || {};\n  const { width: stepperWidth = 0 } = useSize(ref) || {};\n\n  const { validatedValue, validatedMin, validatedMax } = getValidatedProps(value, min, max);\n  const allowedValues = getAllowedValues(validatedMin, validatedMax);\n  const index = allowedValues.indexOf(validatedValue);\n  const maximumDots = getMaximumDots(wrapperWidth);\n  const distanceBetweenDots = getDistanceBetweenDots(stepperWidth, allowedValues.length);\n  const markerPosition = getMarkerPosition(distanceBetweenDots, index);\n\n  const showAllDots = allowedValues.length <= maximumDots;\n  const isCompleted = validatedValue === validatedMax;\n\n  const ariaLabelAttributes = getAriaLabelAttributes({ label: ariaLabel, id: ariaLabelledById });\n\n  return (\n    <div className={styles['stepper-wrapper']} ref={wrapperRef}>\n      <span\n        role=\"progressbar\"\n        {...ariaLabelAttributes}\n        aria-valuenow={validatedValue}\n        aria-valuemin={validatedMin}\n        aria-valuemax={validatedMax}\n        className={styles.stepper}\n        style={{\n          backgroundPositionX: `${isCompleted ? stepperWidth : markerPosition}px`,\n        }}\n        ref={ref}\n        data-testid={testId}\n        data-analyticsid={AnalyticsId.Stepper}\n      >\n        {showAllDots && <DotList allowedValues={allowedValues} currentValue={validatedValue} distanceBetweenDots={distanceBetweenDots} />}\n        {!showAllDots && (\n          <>\n            <Dot completed={validatedValue > validatedMin} position=\"left\" />\n            <Dot completed={validatedValue === validatedMax} position=\"right\" />\n          </>\n        )}\n        <span className={styles.stepper__marker} style={{ left: `${markerPosition}px` }} />\n      </span>\n      {!showAllDots && <span className={styles.stepper__number}>{`${validatedValue}/${validatedMax}`}</span>}\n    </div>\n  );\n};\n\nexport default Stepper;\n"],"names":["Stepper","ariaLabelledById","ariaLabel","value","min","max","testId","wrapperRef","useRef","ref","wrapperWidth","useSize","stepperWidth","validatedValue","validatedMin","validatedMax","getValidatedProps","allowedValues","getAllowedValues","index","maximumDots","getMaximumDots","distanceBetweenDots","getDistanceBetweenDots","markerPosition","getMarkerPosition","showAllDots","isCompleted","ariaLabelAttributes","getAriaLabelAttributes","styles","React","AnalyticsId","DotList","Dot"],"mappings":";;;;;;;;AAoCM,MAAAA,IAAkC,CAAC,EAAE,kBAAAC,GAAkB,WAAAC,GAAW,OAAAC,GAAO,KAAAC,IAAM,GAAG,KAAAC,IAAM,GAAG,QAAAC,QAAa;AACtG,QAAAC,IAAaC,EAAuB,IAAI,GACxCC,IAAMD,EAAwB,IAAI,GAClC,EAAE,OAAOE,IAAe,MAAMC,EAAQJ,CAAU,KAAK,IACrD,EAAE,OAAOK,IAAe,MAAMD,EAAQF,CAAG,KAAK,IAE9C,EAAE,gBAAAI,GAAgB,cAAAC,GAAc,cAAAC,EAAA,IAAiBC,EAAkBb,GAAOC,GAAKC,CAAG,GAClFY,IAAgBC,EAAiBJ,GAAcC,CAAY,GAC3DI,IAAQF,EAAc,QAAQJ,CAAc,GAC5CO,IAAcC,EAAeX,CAAY,GACzCY,IAAsBC,EAAuBX,GAAcK,EAAc,MAAM,GAC/EO,IAAiBC,EAAkBH,GAAqBH,CAAK,GAE7DO,IAAcT,EAAc,UAAUG,GACtCO,IAAcd,MAAmBE,GAEjCa,IAAsBC,EAAuB,EAAE,OAAO3B,GAAW,IAAID,GAAkB;AAE7F,yCACG,OAAI,EAAA,WAAW6B,EAAO,iBAAiB,GAAG,KAAKvB,EAC9C,GAAAwB,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACJ,GAAGH;AAAA,MACJ,iBAAef;AAAA,MACf,iBAAeC;AAAA,MACf,iBAAeC;AAAA,MACf,WAAWe,EAAO;AAAA,MAClB,OAAO;AAAA,QACL,qBAAqB,GAAGH,IAAcf,IAAeY,CAAc;AAAA,MACrE;AAAA,MACA,KAAAf;AAAA,MACA,eAAaH;AAAA,MACb,oBAAkB0B,EAAY;AAAA,IAAA;AAAA,IAE7BN,KAAgBK,gBAAAA,EAAA,cAAAE,GAAA,EAAQ,eAAAhB,GAA8B,cAAcJ,GAAgB,qBAAAS,GAA0C;AAAA,IAC9H,CAACI,KACAK,gBAAAA,EAAA,cAAAA,EAAA,UAAA,sCACGG,GAAI,EAAA,WAAWrB,IAAiBC,GAAc,UAAS,OAAO,CAAA,mCAC9DoB,GAAI,EAAA,WAAWrB,MAAmBE,GAAc,UAAS,QAAQ,CAAA,CACpE;AAAA,IAEFgB,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAWD,EAAO,iBAAiB,OAAO,EAAE,MAAM,GAAGN,CAAc,KAAQ,EAAA,CAAA;AAAA,EAAA,GAElF,CAACE,KAAeK,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAWD,EAAO,gBAAA,GAAkB,GAAGjB,CAAc,IAAIE,CAAY,EAAG,CACjG;AAEJ;"}

package/components/Stepper/utils.js

@@ -1,16 +0,0 @@
-const c = 8, s = (t, e) => t < e ? t : e - 1, d = (t, e) => e < t ? t : e, _ = (t, e, o) => typeof t > "u" || t < e ? e : t > o ? o : t, M = (t) => Math.floor(t / 28), i = (t, e) => (t - 24) / (e - 1), l = (t, e) => t * e, D = (t, e) => Array.from(Array(e - t + 1), (o, a) => a + t), A = (t, e, o) => {
-  const a = s(e, o), n = d(a, o);
-  return { validatedValue: _(t, a, n), validatedMin: a, validatedMax: n };
-};
-export {
-  c as STEPPER_PADDING_X_PX,
-  D as getAllowedValues,
-  i as getDistanceBetweenDots,
-  l as getMarkerPosition,
-  M as getMaximumDots,
-  d as getValidatedMax,
-  s as getValidatedMin,
-  A as getValidatedProps,
-  _ as getValidatedValue
-};
-//# sourceMappingURL=utils.js.map

package/components/Stepper/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/Stepper/utils.ts"],"sourcesContent":["/**\n * Minimum avstand fra markør til prikk\n */\nconst MARKER_DOT_MIN_DISTANCE_PX = 4;\n\n/**\n * Bredde på markør\n */\nconst MARKER_WIDTH_PX = 24;\n\n/**\n * Horisontal padding på stepper\n */\nexport const STEPPER_PADDING_X_PX = 8;\n\n/**\n * Valider at minimum-verdi er innenfor gyldig område\n * @param min Mimimum-verdi\n * @param max Maksimum-verdi\n * @returns Mimimum-verdi, ikke større enn eller lik maksimum-verdi\n */\nexport const getValidatedMin = (min: number, max: number): number => (min < max ? min : max - 1);\n\n/**\n * Valider at maksimum-verdi er innenfor gyldig område\n * @param min Mimimum-verdi\n * @param max Maksimum-verdi\n * @returns Maksimum-verdi, ikke mindre enn minimum-verdi\n */\nexport const getValidatedMax = (min: number, max: number): number => (max < min ? min : max);\n\n/**\n * Valider at verdi er innenfor gyldig område\n * @param value Nåværende verdi\n * @param min Mimimum-verdi\n * @param max Maksimum-verdi\n * @returns Verdi, ikke mindre enn 0, ikke mer enn max\n */\nexport const getValidatedValue = (value: number | undefined, min: number, max: number): number => {\n  if (typeof value === 'undefined' || value < min) {\n    return min;\n  }\n\n  return value > max ? max : value;\n};\n\n/**\n * Finn antall prikker det er plass til\n * @param stepperWidth Bredde på stepper\n * @returns Antall prikker\n */\nexport const getMaximumDots = (stepperWidth: number): number => Math.floor(stepperWidth / (MARKER_WIDTH_PX + MARKER_DOT_MIN_DISTANCE_PX));\n\n/**\n * Beregn riktig distance mellom prikker\n * @param stepperWidth Bredde på stepper\n * @param dots Antall prikker som skal vises\n * @returns Distanse mellom prikker\n */\nexport const getDistanceBetweenDots = (stepperWidth: number, dots: number): number => (stepperWidth - MARKER_WIDTH_PX) / (dots - 1);\n\n/**\n * Beregn riktig plassering av markør\n * @param distanceBetweenDots Distanse mellom prikker\n * @param index Nåværende verdi i stepper\n * @returns Plassering til markør fra venstre\n */\nexport const getMarkerPosition = (distanceBetweenDots: number, index: number): number => distanceBetweenDots * index;\n\n/**\n * Lag liste med tillate verdier fra min til maks\n * @param min Mimimum-verdi\n * @param max Maksimum-verdi\n * @returns Liste med verdier\n */\nexport const getAllowedValues = (min: number, max: number): number[] => Array.from(Array(max - min + 1), (_, index) => index + min);\n\n/**\n * Valider props som skal brukes til beregning av posisjon m.m.\n * @param value Nåværende verdi\n * @param min Mimimum-verdi\n * @param max Maksimum-verdi\n * @returns Objekt med gyldige verdier\n */\nexport const getValidatedProps = (\n  value: number | undefined,\n  min: number,\n  max: number\n): { validatedValue: number; validatedMin: number; validatedMax: number } => {\n  const validatedMin = getValidatedMin(min, max);\n  const validatedMax = getValidatedMax(validatedMin, max);\n  const validatedValue = getValidatedValue(value, validatedMin, validatedMax);\n\n  return { validatedValue, validatedMin, validatedMax };\n};\n"],"names":["STEPPER_PADDING_X_PX","getValidatedMin","min","max","getValidatedMax","getValidatedValue","value","getMaximumDots","stepperWidth","getDistanceBetweenDots","dots","getMarkerPosition","distanceBetweenDots","index","getAllowedValues","_","getValidatedProps","validatedMin","validatedMax"],"mappings":"AAaO,MAAMA,IAAuB,GAQvBC,IAAkB,CAACC,GAAaC,MAAyBD,IAAMC,IAAMD,IAAMC,IAAM,GAQjFC,IAAkB,CAACF,GAAaC,MAAyBA,IAAMD,IAAMA,IAAMC,GAS3EE,IAAoB,CAACC,GAA2BJ,GAAaC,MACpE,OAAOG,IAAU,OAAeA,IAAQJ,IACnCA,IAGFI,IAAQH,IAAMA,IAAMG,GAQhBC,IAAiB,CAACC,MAAiC,KAAK,MAAMA,IAAgB,EAA6C,GAQ3HC,IAAyB,CAACD,GAAsBE,OAA0BF,IAAe,OAAoBE,IAAO,IAQpHC,IAAoB,CAACC,GAA6BC,MAA0BD,IAAsBC,GAQlGC,IAAmB,CAACZ,GAAaC,MAA0B,MAAM,KAAK,MAAMA,IAAMD,IAAM,CAAC,GAAG,CAACa,GAAGF,MAAUA,IAAQX,CAAG,GASrHc,IAAoB,CAC/BV,GACAJ,GACAC,MAC2E;AACrE,QAAAc,IAAehB,EAAgBC,GAAKC,CAAG,GACvCe,IAAed,EAAgBa,GAAcd,CAAG;AAG/C,SAAA,EAAE,gBAFcE,EAAkBC,GAAOW,GAAcC,CAAY,GAEjD,cAAAD,GAAc,cAAAC;AACzC;"}

package/components/Table/Table.js

@@ -1,76 +0,0 @@
-import a, { useState as n, useRef as L, useEffect as s } from "react";
-import R from "classnames";
-import { getCurrentConfig as V, getCenteredOverflowTableStyle as N, getBreakpointClass as _ } from "./utils.js";
-import { AnalyticsId as H } from "../../constants.js";
-import { useBreakpoint as O } from "../../hooks/useBreakpoint.js";
-import { useIsVisible as P } from "../../hooks/useIsVisible.js";
-import { useLayoutEvent as j } from "../../hooks/useLayoutEvent.js";
-import { getAriaLabelAttributes as q } from "../../utils/accessibility.js";
-import { HorizontalScroll as D } from "../HorizontalScroll/HorizontalScroll.js";
-import F from "../Table/styles.module.scss";
-var G = /* @__PURE__ */ ((e) => (e.none = "none", e.centeredoverflow = "centeredoverflow", e.horizontalscroll = "horizontalscroll", e.block = "block", e))(G || {}), J = /* @__PURE__ */ ((e) => (e.compact = "compact", e.normal = "normal", e))(J || {});
-const K = [
-  {
-    breakpoint: "xl",
-    variant: "centeredoverflow",
-    fallbackVariant: "horizontalscroll"
-    /* horizontalscroll */
-  }
-], ot = [
-  {
-    breakpoint: "xl",
-    variant: "centeredoverflow",
-    fallbackVariant: "horizontalscroll"
-    /* horizontalscroll */
-  },
-  {
-    breakpoint: "sm",
-    variant: "centeredoverflow",
-    fallbackVariant: "block"
-    /* block */
-  }
-], lt = ({
-  id: e,
-  testId: w,
-  className: v,
-  children: u,
-  breakpointConfig: c = K,
-  mode: k = "normal",
-  scrollAriaLabel: W,
-  scrollAriaLabelledById: z,
-  ...E
-}) => {
-  const [t, y] = n(), [l, d] = n(0), [B, S] = n(0), [m, g] = n(window.innerWidth), r = L(null), f = P(r, 0), i = O();
-  s(() => {
-    y(V(c, i, l, m));
-  }, [c, i, l, m]), s(() => {
-    var o, h, p;
-    ((t == null ? void 0 : t.variant) === "centeredoverflow" || (t == null ? void 0 : t.variant) === "horizontalscroll") && d(((o = r.current) == null ? void 0 : o.getBoundingClientRect().width) ?? 0), (t == null ? void 0 : t.variant) === "centeredoverflow" && S(((p = (h = r.current) == null ? void 0 : h.parentElement) == null ? void 0 : p.getBoundingClientRect().width) ?? 0);
-  }, [t, i]), j(() => g(window.innerWidth), ["resize"], 100), s(() => {
-    var o;
-    l === 0 && f && d(((o = r.current) == null ? void 0 : o.getBoundingClientRect().width) ?? 0);
-  }, [l, f]);
-  const A = (t == null ? void 0 : t.variant) === "centeredoverflow" ? N(B, l) : void 0, C = _(t), I = R(F.table, C, v), b = /* @__PURE__ */ a.createElement(
-    "table",
-    {
-      className: I,
-      id: e,
-      "data-testid": w,
-      "data-analyticsid": H.Table,
-      ref: r,
-      style: A,
-      ...E
-    },
-    a.Children.map(u, (o) => a.isValidElement(o) && a.cloneElement(o, { mode: k }))
-  ), x = q({ label: W, id: z });
-  return (t == null ? void 0 : t.variant) === "horizontalscroll" ? /* @__PURE__ */ a.createElement(D, { childWidth: l, testId: "horizontal-scroll", ...x }, b) : b;
-};
-export {
-  J as ModeType,
-  G as ResponsiveTableVariant,
-  lt as Table,
-  lt as default,
-  K as defaultConfig,
-  ot as simpleConfig
-};
-//# sourceMappingURL=Table.js.map

package/components/Table/Table.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Table.js","sources":["../../../src/components/Table/Table.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\n\nimport { getCurrentConfig, getBreakpointClass, getCenteredOverflowTableStyle } from './utils';\nimport { AnalyticsId } from '../../constants';\nimport { Breakpoint, useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useIsVisible } from '../../hooks/useIsVisible';\nimport { useLayoutEvent } from '../../hooks/useLayoutEvent';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\nimport HorizontalScroll from '../HorizontalScroll';\n\nimport styles from './styles.module.scss';\n\nexport enum ResponsiveTableVariant {\n  /** No handling responsive behaviour. Default. */\n  none = 'none',\n  /** Overflow parent container to the left and right while remaining centered horizontally. */\n  centeredoverflow = 'centeredoverflow',\n  /** Show horizontal scrollbar when table is too big for the screen. */\n  horizontalscroll = 'horizontalscroll',\n  /** Collapse to two columns. */\n  block = 'block',\n}\nexport enum ModeType {\n  compact = 'compact',\n  normal = 'normal',\n}\nexport interface BreakpointConfig {\n  /** Breakpoint at which responsive behaviour will be applied. The table component uses a \"desktop first\" approach. */\n  breakpoint: keyof typeof Breakpoint;\n  /** Desired behaviour on this breakpoint and all smaller screens. */\n  variant: keyof typeof ResponsiveTableVariant;\n  /** If variant is horizontallscroll, use a fallback instead of device is not a touch device. */\n  fallbackVariant?: keyof typeof ResponsiveTableVariant;\n}\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'table'>, 'style'> {\n  /** Unique ID */\n  id?: string;\n  /** Id used for testing */\n  testId?: string;\n  /** Customize how the table behaves on various screen widths */\n  breakpointConfig?: BreakpointConfig | BreakpointConfig[];\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table. Use TableHead and TableBody */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** Sets aria-label of the horizontal scroll container. scrollAriaLabel or scrollAriaLabelledById MUST be set if horizontal scrolling is enabled! */\n  scrollAriaLabel?: string;\n  /** Sets aria-labelledby of the horizontal scroll container. scrollAriaLabel or scrollAriaLabelledById MUST be set if horizontal scrolling is enabled! */\n  scrollAriaLabelledById?: string;\n}\n\nexport const defaultConfig: BreakpointConfig[] = [\n  {\n    breakpoint: 'xl',\n    variant: ResponsiveTableVariant.centeredoverflow,\n    fallbackVariant: ResponsiveTableVariant.horizontalscroll,\n  },\n];\n\nexport const simpleConfig: BreakpointConfig[] = [\n  {\n    breakpoint: 'xl',\n    variant: ResponsiveTableVariant.centeredoverflow,\n    fallbackVariant: ResponsiveTableVariant.horizontalscroll,\n  },\n  {\n    breakpoint: 'sm',\n    variant: ResponsiveTableVariant.centeredoverflow,\n    fallbackVariant: ResponsiveTableVariant.block,\n  },\n];\n\nexport const Table: React.FC<Props> = ({\n  id,\n  testId,\n  className,\n  children,\n  breakpointConfig = defaultConfig,\n  mode = ModeType.normal,\n  scrollAriaLabel,\n  scrollAriaLabelledById,\n  ...rest\n}) => {\n  const [currentConfig, setCurrentConfig] = useState<BreakpointConfig>();\n  const [tableWidth, setTableWidth] = useState<number>(0);\n  const [parentWidth, setParentWidth] = useState<number>(0);\n  const [windowWidth, setWindowWidth] = useState(window.innerWidth);\n  const tableRef = useRef<HTMLTableElement>(null);\n  const tableIsVisible = useIsVisible(tableRef, 0);\n  const breakpoint = useBreakpoint();\n\n  useEffect(() => {\n    setCurrentConfig(getCurrentConfig(breakpointConfig, breakpoint, tableWidth, windowWidth));\n  }, [breakpointConfig, breakpoint, tableWidth, windowWidth]);\n\n  useEffect(() => {\n    if (\n      currentConfig?.variant === ResponsiveTableVariant.centeredoverflow ||\n      currentConfig?.variant === ResponsiveTableVariant.horizontalscroll\n    ) {\n      setTableWidth(tableRef.current?.getBoundingClientRect().width ?? 0);\n    }\n    if (currentConfig?.variant === ResponsiveTableVariant.centeredoverflow) {\n      setParentWidth(tableRef.current?.parentElement?.getBoundingClientRect().width ?? 0);\n    }\n  }, [currentConfig, breakpoint]);\n\n  useLayoutEvent(() => setWindowWidth(window.innerWidth), ['resize'], 100);\n\n  useEffect(() => {\n    if (tableWidth === 0 && tableIsVisible) {\n      setTableWidth(tableRef.current?.getBoundingClientRect().width ?? 0);\n    }\n  }, [tableWidth, tableIsVisible]);\n\n  const tableStyle =\n    currentConfig?.variant === ResponsiveTableVariant.centeredoverflow ? getCenteredOverflowTableStyle(parentWidth, tableWidth) : undefined;\n\n  const breakpointClass = getBreakpointClass(currentConfig);\n  const tableClass = classNames(styles.table, breakpointClass, className);\n\n  const table = (\n    <table\n      className={tableClass}\n      id={id}\n      data-testid={testId}\n      data-analyticsid={AnalyticsId.Table}\n      ref={tableRef}\n      style={tableStyle}\n      {...rest}\n    >\n      {React.Children.map(children, child => React.isValidElement<{ mode?: ModeType }>(child) && React.cloneElement(child, { mode }))}\n    </table>\n  );\n\n  const ariaLabelAttributes = getAriaLabelAttributes({ label: scrollAriaLabel, id: scrollAriaLabelledById });\n\n  if (currentConfig?.variant === ResponsiveTableVariant.horizontalscroll) {\n    return (\n      <HorizontalScroll childWidth={tableWidth} testId=\"horizontal-scroll\" {...ariaLabelAttributes}>\n        {table}\n      </HorizontalScroll>\n    );\n  }\n\n  return table;\n};\n\nexport default Table;\n"],"names":["ResponsiveTableVariant","ModeType","defaultConfig","simpleConfig","Table","id","testId","className","children","breakpointConfig","mode","scrollAriaLabel","scrollAriaLabelledById","rest","currentConfig","setCurrentConfig","useState","tableWidth","setTableWidth","parentWidth","setParentWidth","windowWidth","setWindowWidth","tableRef","useRef","tableIsVisible","useIsVisible","breakpoint","useBreakpoint","useEffect","getCurrentConfig","_a","_c","_b","useLayoutEvent","tableStyle","getCenteredOverflowTableStyle","breakpointClass","getBreakpointClass","tableClass","classNames","styles","table","React","AnalyticsId","child","ariaLabelAttributes","getAriaLabelAttributes","HorizontalScroll"],"mappings":";;;;;;;;;;AAcY,IAAAA,sBAAAA,OAEVA,EAAA,OAAO,QAEPA,EAAA,mBAAmB,oBAEnBA,EAAA,mBAAmB,oBAEnBA,EAAA,QAAQ,SAREA,IAAAA,KAAA,CAAA,CAAA,GAUAC,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,SAAS,UAFCA,IAAAA,KAAA,CAAA,CAAA;AAgCL,MAAMC,IAAoC;AAAA,EAC/C;AAAA,IACE,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,iBAAiB;AAAA;AAAA,EACnB;AACF,GAEaC,KAAmC;AAAA,EAC9C;AAAA,IACE,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,iBAAiB;AAAA;AAAA,EACnB;AAAA,EACA;AAAA,IACE,YAAY;AAAA,IACZ,SAAS;AAAA,IACT,iBAAiB;AAAA;AAAA,EACnB;AACF,GAEaC,KAAyB,CAAC;AAAA,EACrC,IAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,kBAAAC,IAAmBP;AAAA,EACnB,MAAAQ,IAAO;AAAA,EACP,iBAAAC;AAAA,EACA,wBAAAC;AAAA,EACA,GAAGC;AACL,MAAM;AACJ,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAA2B,GAC/D,CAACC,GAAYC,CAAa,IAAIF,EAAiB,CAAC,GAChD,CAACG,GAAaC,CAAc,IAAIJ,EAAiB,CAAC,GAClD,CAACK,GAAaC,CAAc,IAAIN,EAAS,OAAO,UAAU,GAC1DO,IAAWC,EAAyB,IAAI,GACxCC,IAAiBC,EAAaH,GAAU,CAAC,GACzCI,IAAaC;AAEnB,EAAAC,EAAU,MAAM;AACd,IAAAd,EAAiBe,EAAiBrB,GAAkBkB,GAAYV,GAAYI,CAAW,CAAC;AAAA,KACvF,CAACZ,GAAkBkB,GAAYV,GAAYI,CAAW,CAAC,GAE1DQ,EAAU,MAAM;;AACd,MACEf,KAAA,gBAAAA,EAAe,aAAY,uBAC3BA,KAAA,gBAAAA,EAAe,aAAY,uBAE3BI,IAAca,IAAAR,EAAS,YAAT,gBAAAQ,EAAkB,wBAAwB,UAAS,CAAC,IAEhEjB,KAAA,gBAAAA,EAAe,aAAY,sBAC7BM,IAAeY,KAAAC,IAAAV,EAAS,YAAT,gBAAAU,EAAkB,kBAAlB,gBAAAD,EAAiC,wBAAwB,UAAS,CAAC;AAAA,EACpF,GACC,CAAClB,GAAea,CAAU,CAAC,GAEfO,EAAA,MAAMZ,EAAe,OAAO,UAAU,GAAG,CAAC,QAAQ,GAAG,GAAG,GAEvEO,EAAU,MAAM;;AACV,IAAAZ,MAAe,KAAKQ,KACtBP,IAAca,IAAAR,EAAS,YAAT,gBAAAQ,EAAkB,wBAAwB,UAAS,CAAC;AAAA,EACpE,GACC,CAACd,GAAYQ,CAAc,CAAC;AAE/B,QAAMU,KACJrB,KAAA,gBAAAA,EAAe,aAAY,qBAA0CsB,EAA8BjB,GAAaF,CAAU,IAAI,QAE1HoB,IAAkBC,EAAmBxB,CAAa,GAClDyB,IAAaC,EAAWC,EAAO,OAAOJ,GAAiB9B,CAAS,GAEhEmC,IACJC,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWJ;AAAA,MACX,IAAAlC;AAAA,MACA,eAAaC;AAAA,MACb,oBAAkBsC,EAAY;AAAA,MAC9B,KAAKrB;AAAA,MACL,OAAOY;AAAA,MACN,GAAGtB;AAAA,IAAA;AAAA,IAEH8B,EAAM,SAAS,IAAInC,GAAU,OAASmC,EAAM,eAAoCE,CAAK,KAAKF,EAAM,aAAaE,GAAO,EAAE,MAAAnC,EAAM,CAAA,CAAC;AAAA,EAAA,GAI5HoC,IAAsBC,EAAuB,EAAE,OAAOpC,GAAiB,IAAIC,GAAwB;AAErG,UAAAE,KAAA,gBAAAA,EAAe,aAAY,qBAE3B6B,gBAAAA,EAAA,cAACK,KAAiB,YAAY/B,GAAY,QAAO,qBAAqB,GAAG6B,KACtEJ,CACH,IAIGA;AACT;"}

package/components/Table/TableBody/TableBody.js

@@ -1,13 +0,0 @@
-import e from "react";
-import s from "classnames";
-import n from "../../Table/styles.module.scss";
-import { ModeType as d } from "../Table.js";
-const i = ({ className: o, children: a, mode: l = d.normal, ...m }) => {
-  const r = s(n["table-body"], o);
-  return /* @__PURE__ */ e.createElement("tbody", { className: r, ...m }, e.Children.map(a, (t) => e.isValidElement(t) && e.cloneElement(t, { mode: l })));
-};
-export {
-  i as TableBody,
-  i as default
-};
-//# sourceMappingURL=TableBody.js.map

package/components/Table/TableBody/TableBody.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableBody.js","sources":["../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tbody'>, 'style'> {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table body. Use TableRows */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableBody: React.FC<Props> = ({ className, children, mode = ModeType.normal, ...rest }) => {\n  const tableBodyClasses = classNames(tableStyles['table-body'], className);\n  return (\n    <tbody className={tableBodyClasses} {...rest}>\n      {React.Children.map(children, child => React.isValidElement<{ mode?: ModeType }>(child) && React.cloneElement(child, { mode }))}\n    </tbody>\n  );\n};\n\nexport default TableBody;\n"],"names":["TableBody","className","children","mode","ModeType","rest","tableBodyClasses","classNames","tableStyles","React","child"],"mappings":";;;;AAgBa,MAAAA,IAA6B,CAAC,EAAE,WAAAC,GAAW,UAAAC,GAAU,MAAAC,IAAOC,EAAS,QAAQ,GAAGC,QAAW;AACtG,QAAMC,IAAmBC,EAAWC,EAAY,YAAY,GAAGP,CAAS;AAEtE,SAAAQ,gBAAAA,EAAA,cAAC,WAAM,WAAWH,GAAmB,GAAGD,EACrC,GAAAI,EAAM,SAAS,IAAIP,GAAU,CAAAQ,MAASD,EAAM,eAAoCC,CAAK,KAAKD,EAAM,aAAaC,GAAO,EAAE,MAAAP,EAAM,CAAA,CAAC,CAChI;AAEJ;"}

package/components/Table/TableCell/TableCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableCell.js","sources":["../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport enum TextAlign {\n  left = 'left',\n  center = 'center',\n  right = 'right',\n}\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'td'>, 'style'> {\n  /** Label used for small viewport block */\n  dataLabel?: string;\n  /**  text align in cell */\n  textAlign?: TextAlign;\n  /**  nowrap for white space */\n  nowrap?: boolean;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the table cell */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** For test purposes */\n  testId?: string;\n}\n\nexport const TableCell: React.FC<Props> = ({\n  nowrap = false,\n  textAlign = TextAlign.left,\n  dataLabel,\n  children,\n  className,\n  testId,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableCellClass = classNames(\n    tableStyles['table__cell'],\n    { [tableStyles['table__cell--compact']]: mode === ModeType.compact },\n    { [tableStyles['table__cell--nowrap']]: nowrap },\n    { [tableStyles['table__cell--center']]: textAlign === 'center' },\n    { [tableStyles['table__cell--right']]: textAlign === 'right' },\n    className\n  );\n\n  return (\n    <td className={tableCellClass} data-label={dataLabel} data-testid={testId} {...rest}>\n      {children}\n    </td>\n  );\n};\n\nexport default TableCell;\n"],"names":["TextAlign","TableCell","nowrap","textAlign","dataLabel","children","className","testId","mode","ModeType","rest","tableCellClass","classNames","tableStyles","React"],"mappings":";;;;AAOY,IAAAA,sBAAAA,OACVA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAHEA,IAAAA,KAAA,CAAA,CAAA;AAuBL,MAAMC,IAA6B,CAAC;AAAA,EACzC,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAAA,EAChB,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAiBC;AAAA,IACrBC,EAAY;AAAA,IACZ,EAAE,CAACA,EAAY,sBAAsB,CAAC,GAAGL,MAASC,EAAS,QAAQ;AAAA,IACnE,EAAE,CAACI,EAAY,qBAAqB,CAAC,GAAGX,EAAO;AAAA,IAC/C,EAAE,CAACW,EAAY,qBAAqB,CAAC,GAAGV,MAAc,SAAS;AAAA,IAC/D,EAAE,CAACU,EAAY,oBAAoB,CAAC,GAAGV,MAAc,QAAQ;AAAA,IAC7DG;AAAA,EAAA;AAIA,SAAAQ,gBAAAA,EAAA,cAAC,MAAG,EAAA,WAAWH,GAAgB,cAAYP,GAAW,eAAaG,GAAS,GAAGG,EAAA,GAC5EL,CACH;AAEJ;"}

package/components/Table/TableExpandedRow/TableExpandedRow.js

@@ -1,31 +0,0 @@
-import e from "react";
-import o from "classnames";
-import E from "../../Button/Button.js";
-import { Icon as C } from "../../Icon/Icon.js";
-import x from "../../Icons/ChevronUp.js";
-import t from "../../Table/styles.module.scss";
-import { ModeType as n } from "../Table.js";
-const S = ({
-  numberOfColumns: m,
-  expanded: a,
-  hideDetailsText: c,
-  toggleClick: s,
-  children: p,
-  className: l,
-  mode: d = n.normal,
-  id: i
-}) => {
-  const _ = o(
-    t["table__expanded-row"],
-    { [t["table__expanded-row--expanded"]]: a },
-    l
-  ), b = o(t.table__cell, l, {
-    [t["table__cell--compact"]]: d === n.compact
-  }), f = o(t["table__expanded-row-container"]);
-  return /* @__PURE__ */ e.createElement("tr", { className: _, id: i }, /* @__PURE__ */ e.createElement("td", { colSpan: m, className: b }, /* @__PURE__ */ e.createElement("div", { className: f }, e.Children.map(p, (r) => e.isValidElement(r) && e.cloneElement(r)), /* @__PURE__ */ e.createElement(E, { variant: "borderless", onClick: s, "aria-expanded": a, tabIndex: a ? 0 : -1 }, c, /* @__PURE__ */ e.createElement(C, { svgIcon: x })))));
-};
-export {
-  S as TableExpandedRow,
-  S as default
-};
-//# sourceMappingURL=TableExpandedRow.js.map

package/components/Table/TableExpandedRow/TableExpandedRow.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableExpandedRow.js","sources":["../../../../src/components/Table/TableExpandedRow/TableExpandedRow.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport interface Props {\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Number of columns in table. */\n  numberOfColumns: number;\n  /** Text for hide button. */\n  hideDetailsText: string;\n  /** When hide button inside expanded row is clicked. */\n  toggleClick: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the expanded row.  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n  /** Row id. For use with aria-controls. */\n  id?: string;\n}\n\nexport const TableExpandedRow = ({\n  numberOfColumns,\n  expanded,\n  hideDetailsText,\n  toggleClick,\n  children,\n  className,\n  mode = ModeType.normal,\n  id,\n}: Props): React.JSX.Element => {\n  const tableRowClass = classNames(\n    tableStyles['table__expanded-row'],\n    { [tableStyles['table__expanded-row--expanded']]: expanded },\n    className\n  );\n  const tableCellClass = classNames(tableStyles['table__cell'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  const containerClass = classNames(tableStyles['table__expanded-row-container']);\n\n  return (\n    <tr className={tableRowClass} id={id}>\n      <td colSpan={numberOfColumns} className={tableCellClass}>\n        <div className={containerClass}>\n          {React.Children.map(children, child => React.isValidElement(child) && React.cloneElement(child))}\n          <Button variant={'borderless'} onClick={toggleClick} aria-expanded={expanded} tabIndex={expanded ? 0 : -1}>\n            {hideDetailsText}\n            <Icon svgIcon={ChevronUp} />\n          </Button>\n        </div>\n      </td>\n    </tr>\n  );\n};\n\nexport default TableExpandedRow;\n"],"names":["TableExpandedRow","numberOfColumns","expanded","hideDetailsText","toggleClick","children","className","mode","ModeType","id","tableRowClass","classNames","tableStyles","tableCellClass","containerClass","React","child","Button","Icon","ChevronUp"],"mappings":";;;;;;;AA6BO,MAAMA,IAAmB,CAAC;AAAA,EAC/B,iBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAAA,EAChB,IAAAC;AACF,MAAgC;AAC9B,QAAMC,IAAgBC;AAAA,IACpBC,EAAY,qBAAqB;AAAA,IACjC,EAAE,CAACA,EAAY,+BAA+B,CAAC,GAAGV,EAAS;AAAA,IAC3DI;AAAA,EAAA,GAEIO,IAAiBF,EAAWC,EAAY,aAAgBN,GAAW;AAAA,IACvE,CAACM,EAAY,sBAAsB,CAAC,GAAGL,MAASC,EAAS;AAAA,EAAA,CAC1D,GAEKM,IAAiBH,EAAWC,EAAY,+BAA+B,CAAC;AAG5E,SAAAG,gBAAAA,EAAA,cAAC,QAAG,WAAWL,GAAe,IAAAD,KAC3BM,gBAAAA,EAAA,cAAA,MAAA,EAAG,SAASd,GAAiB,WAAWY,EAAA,mCACtC,OAAI,EAAA,WAAWC,KACbC,EAAM,SAAS,IAAIV,GAAU,CAAAW,MAASD,EAAM,eAAeC,CAAK,KAAKD,EAAM,aAAaC,CAAK,CAAC,GAC/FD,gBAAAA,EAAA,cAACE,KAAO,SAAS,cAAc,SAASb,GAAa,iBAAeF,GAAU,UAAUA,IAAW,IAAI,GACpG,GAAAC,GACAY,gBAAAA,EAAA,cAAAG,GAAA,EAAK,SAASC,EAAW,CAAA,CAC5B,CACF,CACF,CACF;AAEJ;"}

package/components/Table/TableExpanderCell/TableExpanderCell.js

@@ -1,35 +0,0 @@
-import t from "react";
-import i from "classnames";
-import f from "../../Button/Button.js";
-import { Icon as b } from "../../Icon/Icon.js";
-import _ from "../../Icons/ChevronDown.js";
-import d from "../../Icons/ChevronUp.js";
-import o from "../../Table/styles.module.scss";
-import { ModeType as r } from "../Table.js";
-const N = ({
-  expandableRowId: a,
-  hideDetailsText: l,
-  showDetailsText: m,
-  expanded: e,
-  className: c,
-  mode: n = r.normal
-}) => {
-  const s = i(o.table__cell, o["table__cell-expander"], c, {
-    [o["table__cell--compact"]]: n === r.compact
-  }), p = e ? d : _;
-  return /* @__PURE__ */ t.createElement("td", { className: s }, /* @__PURE__ */ t.createElement(
-    f,
-    {
-      variant: "borderless",
-      "aria-expanded": e,
-      "aria-controls": a,
-      ariaLabel: e ? l : m
-    },
-    /* @__PURE__ */ t.createElement(b, { svgIcon: p })
-  ));
-};
-export {
-  N as TableExpanderCell,
-  N as default
-};
-//# sourceMappingURL=TableExpanderCell.js.map

package/components/Table/TableExpanderCell/TableExpanderCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableExpanderCell.js","sources":["../../../../src/components/Table/TableExpanderCell/TableExpanderCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport interface Props {\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Row is expanded. */\n  expanded: boolean;\n  /** Id for expanded row. */\n  expandableRowId: string;\n  /** Text for hide button used for aria label. */\n  hideDetailsText: string;\n  /** Text for show button used for aria label. */\n  showDetailsText: string;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableExpanderCell = ({\n  expandableRowId,\n  hideDetailsText,\n  showDetailsText,\n  expanded,\n  className,\n  mode = ModeType.normal,\n}: Props): React.JSX.Element => {\n  const tableCellClass = classNames(tableStyles['table__cell'], tableStyles['table__cell-expander'], className, {\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n  const icon = expanded ? ChevronUp : ChevronDown;\n\n  return (\n    <td className={tableCellClass}>\n      <Button\n        variant=\"borderless\"\n        aria-expanded={expanded}\n        aria-controls={expandableRowId}\n        ariaLabel={expanded ? hideDetailsText : showDetailsText}\n      >\n        <Icon svgIcon={icon} />\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCell;\n"],"names":["TableExpanderCell","expandableRowId","hideDetailsText","showDetailsText","expanded","className","mode","ModeType","tableCellClass","classNames","tableStyles","icon","ChevronUp","ChevronDown","React","Button","Icon"],"mappings":";;;;;;;;AA0BO,MAAMA,IAAoB,CAAC;AAAA,EAChC,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAClB,MAAgC;AACxB,QAAAC,IAAiBC,EAAWC,EAAY,aAAgBA,EAAY,sBAAsB,GAAGL,GAAW;AAAA,IAC5G,CAACK,EAAY,sBAAsB,CAAC,GAAGJ,MAASC,EAAS;AAAA,EAAA,CAC1D,GACKI,IAAOP,IAAWQ,IAAYC;AAGlC,SAAAC,gBAAAA,EAAA,cAAC,MAAG,EAAA,WAAWN,EACb,GAAAM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,iBAAeX;AAAA,MACf,iBAAeH;AAAA,MACf,WAAWG,IAAWF,IAAkBC;AAAA,IAAA;AAAA,IAExCW,gBAAAA,EAAA,cAACE,GAAK,EAAA,SAASL,EAAM,CAAA;AAAA,EAAA,CAEzB;AAEJ;"}

package/components/Table/TableExpanderCell/TableExpanderCellMobile.js

@@ -1,25 +0,0 @@
-import t from "react";
-import p from "classnames";
-import s from "../../Button/Button.js";
-import { Icon as i } from "../../Icon/Icon.js";
-import b from "../../Icons/ChevronDown.js";
-import f from "../../Icons/ChevronUp.js";
-import o from "../../Table/styles.module.scss";
-import { ModeType as l } from "../Table.js";
-const y = ({
-  expanded: e,
-  onClick: r,
-  hideDetailsText: a,
-  showDetailsText: m,
-  mode: c = l.normal
-}) => {
-  const n = p(o.table__cell, o["table__expander-cell-mobile"], {
-    [o["table__expander-cell-mobile--expanded"]]: e,
-    [o["table__cell--compact"]]: c === l.compact
-  });
-  return /* @__PURE__ */ t.createElement("td", { className: n }, /* @__PURE__ */ t.createElement(s, { "aria-expanded": e, variant: "borderless", onClick: r }, /* @__PURE__ */ t.createElement(i, { svgIcon: e ? f : b }), " ", e ? a : m));
-};
-export {
-  y as default
-};
-//# sourceMappingURL=TableExpanderCellMobile.js.map

package/components/Table/TableExpanderCell/TableExpanderCellMobile.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableExpanderCellMobile.js","sources":["../../../../src/components/Table/TableExpanderCell/TableExpanderCellMobile.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Button from '../../Button';\nimport Icon from '../../Icon';\nimport ChevronDown from '../../Icons/ChevronDown';\nimport ChevronUp from '../../Icons/ChevronUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\nimport { Props } from '../TableRow/TableRow';\n\ntype TableExpanderCellMobileProps = Pick<Props, 'expanded' | 'onClick' | 'hideDetailsText' | 'showDetailsText' | 'mode'>;\n\nconst TableExpanderCellMobile: React.FC<TableExpanderCellMobileProps> = ({\n  expanded,\n  onClick,\n  hideDetailsText,\n  showDetailsText,\n  mode = ModeType.normal,\n}) => {\n  const cellClass = classNames(tableStyles.table__cell, tableStyles['table__expander-cell-mobile'], {\n    [tableStyles['table__expander-cell-mobile--expanded']]: expanded,\n    [tableStyles['table__cell--compact']]: mode === ModeType.compact,\n  });\n\n  return (\n    <td className={cellClass}>\n      <Button aria-expanded={expanded} variant=\"borderless\" onClick={onClick}>\n        <Icon svgIcon={expanded ? ChevronUp : ChevronDown} /> {expanded ? hideDetailsText : showDetailsText}\n      </Button>\n    </td>\n  );\n};\n\nexport default TableExpanderCellMobile;\n"],"names":["TableExpanderCellMobile","expanded","onClick","hideDetailsText","showDetailsText","mode","ModeType","cellClass","classNames","tableStyles","React","Button","Icon","ChevronUp","ChevronDown"],"mappings":";;;;;;;;AAcA,MAAMA,IAAkE,CAAC;AAAA,EACvE,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAClB,MAAM;AACJ,QAAMC,IAAYC,EAAWC,EAAY,aAAaA,EAAY,6BAA6B,GAAG;AAAA,IAChG,CAACA,EAAY,uCAAuC,CAAC,GAAGR;AAAA,IACxD,CAACQ,EAAY,sBAAsB,CAAC,GAAGJ,MAASC,EAAS;AAAA,EAAA,CAC1D;AAGC,SAAAI,gBAAAA,EAAA,cAAC,QAAG,WAAWH,EAAA,mCACZI,GAAO,EAAA,iBAAeV,GAAU,SAAQ,cAAa,SAAAC,EAAA,mCACnDU,GAAK,EAAA,SAASX,IAAWY,IAAYC,EAAa,CAAA,GAAE,KAAEb,IAAWE,IAAkBC,CACtF,CACF;AAEJ;"}

package/components/Table/TableHead/TableHead.js

@@ -1,24 +0,0 @@
-import t from "react";
-import p from "classnames";
-import e from "../../Table/styles.module.scss";
-import { ModeType as b } from "../Table.js";
-var _ = /* @__PURE__ */ ((a) => (a.normal = "normal", a.transparent = "transparent", a.sortable = "sortable", a))(_ || {});
-const i = ({ category: a = "normal", className: n, children: m, mode: l, ...s }) => {
-  const o = p(
-    e.table__head,
-    {
-      [e["table__head--normal"]]: a === "normal",
-      [e["table__head--transparent"]]: a === "transparent",
-      [e["table__head--sortable"]]: a == "sortable",
-      [e["table__head--compact"]]: l == b.compact
-    },
-    n
-  );
-  return /* @__PURE__ */ t.createElement("thead", { className: o, ...s }, t.Children.map(m, (r) => t.isValidElement(r) && t.cloneElement(r, { mode: l })));
-};
-export {
-  _ as HeaderCategory,
-  i as TableHead,
-  i as default
-};
-//# sourceMappingURL=TableHead.js.map

package/components/Table/TableHead/TableHead.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableHead.js","sources":["../../../../src/components/Table/TableHead/TableHead.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport enum HeaderCategory {\n  normal = 'normal',\n  transparent = 'transparent',\n  sortable = 'sortable',\n}\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'thead'>, 'style'> {\n  /** Header category for styling. Default: normal */\n  category?: HeaderCategory;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the thead. Add table rows  */\n  children: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHead: React.FC<Props> = ({ category = HeaderCategory.normal, className, children, mode, ...rest }) => {\n  const tableHeadClass = classNames(\n    tableStyles['table__head'],\n    {\n      [tableStyles['table__head--normal']]: category === HeaderCategory.normal,\n      [tableStyles['table__head--transparent']]: category === HeaderCategory.transparent,\n      [tableStyles['table__head--sortable']]: category == HeaderCategory.sortable,\n      [tableStyles['table__head--compact']]: mode == ModeType.compact,\n    },\n    className\n  );\n\n  return (\n    <thead className={tableHeadClass} {...rest}>\n      {React.Children.map(children, child => React.isValidElement<{ mode?: ModeType }>(child) && React.cloneElement(child, { mode }))}\n    </thead>\n  );\n};\n\nexport default TableHead;\n"],"names":["HeaderCategory","TableHead","category","className","children","mode","rest","tableHeadClass","classNames","tableStyles","ModeType","React","child"],"mappings":";;;;AAOY,IAAAA,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,cAAc,eACdA,EAAA,WAAW,YAHDA,IAAAA,KAAA,CAAA,CAAA;AAiBC,MAAAC,IAA6B,CAAC,EAAE,UAAAC,IAAW,UAAuB,WAAAC,GAAW,UAAAC,GAAU,MAAAC,GAAM,GAAGC,QAAW;AACtH,QAAMC,IAAiBC;AAAA,IACrBC,EAAY;AAAA,IACZ;AAAA,MACE,CAACA,EAAY,qBAAqB,CAAC,GAAGP,MAAa;AAAA,MACnD,CAACO,EAAY,0BAA0B,CAAC,GAAGP,MAAa;AAAA,MACxD,CAACO,EAAY,uBAAuB,CAAC,GAAGP,KAAY;AAAA,MACpD,CAACO,EAAY,sBAAsB,CAAC,GAAGJ,KAAQK,EAAS;AAAA,IAC1D;AAAA,IACAP;AAAA,EAAA;AAIA,SAAAQ,gBAAAA,EAAA,cAAC,WAAM,WAAWJ,GAAiB,GAAGD,EACnC,GAAAK,EAAM,SAAS,IAAIP,GAAU,CAAAQ,MAASD,EAAM,eAAoCC,CAAK,KAAKD,EAAM,aAAaC,GAAO,EAAE,MAAAP,EAAM,CAAA,CAAC,CAChI;AAEJ;"}

package/components/Table/TableHeadCell/TableHeadCell.js

@@ -1,42 +0,0 @@
-import t from "react";
-import n from "classnames";
-import { Icon as _ } from "../../Icon/Icon.js";
-import { IconSize as E } from "../../../constants.js";
-import h from "../../Icons/ArrowDown.js";
-import w from "../../Icons/ArrowUp.js";
-import r from "../../Table/styles.module.scss";
-import { ModeType as d } from "../Table.js";
-var N = /* @__PURE__ */ ((e) => (e.asc = "asc", e.desc = "desc", e))(N || {});
-const H = ({
-  sortable: e,
-  onClick: p,
-  className: o,
-  children: c,
-  sortDir: a,
-  mode: i = d.normal,
-  scope: s = "col",
-  ...m
-}) => {
-  const l = n(r["table__head-cell"], o, {
-    [r["table__head-cell--compact"]]: i === d.compact
-  });
-  if (!e && !c)
-    return /* @__PURE__ */ t.createElement("td", { className: l });
-  if (!e)
-    return /* @__PURE__ */ t.createElement("th", { scope: s, className: l, ...m }, c);
-  const f = n(l, r["table__head-cell--sortable"], o), b = () => a && /* @__PURE__ */ t.createElement("div", { className: r["table__head-cell-sort-icon-wrapper"] }, /* @__PURE__ */ t.createElement(_, { svgIcon: a == "asc" ? h : w, size: E.XXSmall })), u = () => {
-    switch (a) {
-      case "asc":
-        return "ascending";
-      case "desc":
-        return "descending";
-    }
-  };
-  return /* @__PURE__ */ t.createElement("th", { scope: s, className: f, "aria-sort": u(), ...m }, /* @__PURE__ */ t.createElement("button", { type: "button", onClick: p, className: r["table__sort-button"], "aria-pressed": a ? !!a : void 0 }, b(), c));
-};
-export {
-  N as SortDirection,
-  H as TableHeadCell,
-  H as default
-};
-//# sourceMappingURL=TableHeadCell.js.map

package/components/Table/TableHeadCell/TableHeadCell.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableHeadCell.js","sources":["../../../../src/components/Table/TableHeadCell/TableHeadCell.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport Icon, { IconSize } from '../../Icon';\nimport ArrowDown from '../../Icons/ArrowDown';\nimport ArrowUp from '../../Icons/ArrowUp';\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\n\nexport enum SortDirection {\n  asc = 'asc',\n  desc = 'desc',\n}\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'th'>, 'style'> {\n  /** Sets if column for head cell should be sortable*/\n  sortable?: boolean;\n  /** Sort direction  */\n  sortDir?: SortDirection;\n  /** Function that is called when clicked */\n  onClick?: () => void;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the content of the td element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableHeadCell: React.FC<Props> = ({\n  sortable,\n  onClick,\n  className,\n  children,\n  sortDir,\n  mode = ModeType.normal,\n  scope = 'col',\n  ...rest\n}) => {\n  const tableHeadCellDefaultClass = classNames(tableStyles['table__head-cell'], className, {\n    [tableStyles['table__head-cell--compact']]: mode === ModeType.compact,\n  });\n\n  if (!sortable && !children) {\n    return <td className={tableHeadCellDefaultClass}></td>;\n  }\n\n  if (!sortable) {\n    return (\n      <th scope={scope} className={tableHeadCellDefaultClass} {...rest}>\n        {children}\n      </th>\n    );\n  }\n\n  const sortableClasses = classNames(tableHeadCellDefaultClass, tableStyles['table__head-cell--sortable'], className);\n\n  const renderSortIcon = (): React.JSX.Element | undefined =>\n    sortDir && (\n      <div className={tableStyles['table__head-cell-sort-icon-wrapper']}>\n        <Icon svgIcon={sortDir == SortDirection.asc ? ArrowDown : ArrowUp} size={IconSize.XXSmall} />\n      </div>\n    );\n\n  const getSortDirection = (): React.AriaAttributes['aria-sort'] => {\n    switch (sortDir) {\n      case SortDirection.asc:\n        return 'ascending';\n      case SortDirection.desc:\n        return 'descending';\n    }\n  };\n\n  return (\n    <th scope={scope} className={sortableClasses} aria-sort={getSortDirection()} {...rest}>\n      <button type=\"button\" onClick={onClick} className={tableStyles['table__sort-button']} aria-pressed={sortDir ? !!sortDir : undefined}>\n        {renderSortIcon()}\n        {children}\n      </button>\n    </th>\n  );\n};\n\nexport default TableHeadCell;\n"],"names":["SortDirection","TableHeadCell","sortable","onClick","className","children","sortDir","mode","ModeType","scope","rest","tableHeadCellDefaultClass","classNames","tableStyles","React","sortableClasses","renderSortIcon","Icon","ArrowDown","ArrowUp","IconSize","getSortDirection"],"mappings":";;;;;;;;AAUY,IAAAA,sBAAAA,OACVA,EAAA,MAAM,OACNA,EAAA,OAAO,QAFGA,IAAAA,KAAA,CAAA,CAAA;AAoBL,MAAMC,IAAiC,CAAC;AAAA,EAC7C,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAAA,EAChB,OAAAC,IAAQ;AAAA,EACR,GAAGC;AACL,MAAM;AACJ,QAAMC,IAA4BC,EAAWC,EAAY,kBAAkB,GAAGT,GAAW;AAAA,IACvF,CAACS,EAAY,2BAA2B,CAAC,GAAGN,MAASC,EAAS;AAAA,EAAA,CAC/D;AAEG,MAAA,CAACN,KAAY,CAACG;AACT,WAAAS,gBAAAA,EAAA,cAAC,MAAG,EAAA,WAAWH,EAA2B,CAAA;AAGnD,MAAI,CAACT;AACH,2CACG,MAAG,EAAA,OAAAO,GAAc,WAAWE,GAA4B,GAAGD,KACzDL,CACH;AAIJ,QAAMU,IAAkBH,EAAWD,GAA2BE,EAAY,4BAA4B,GAAGT,CAAS,GAE5GY,IAAiB,MACrBV,qCACG,OAAI,EAAA,WAAWO,EAAY,oCAAoC,EAAA,mCAC7DI,GAAK,EAAA,SAASX,KAAW,QAAoBY,IAAYC,GAAS,MAAMC,EAAS,SAAS,CAC7F,GAGEC,IAAmB,MAAyC;AAChE,YAAQf,GAAS;AAAA,MACf,KAAK;AACI,eAAA;AAAA,MACT,KAAK;AACI,eAAA;AAAA,IACX;AAAA,EAAA;AAGF,SACGQ,gBAAAA,EAAA,cAAA,MAAA,EAAG,OAAAL,GAAc,WAAWM,GAAiB,aAAWM,EAAiB,GAAI,GAAGX,EAAA,GAC9EI,gBAAAA,EAAA,cAAA,UAAA,EAAO,MAAK,UAAS,SAAAX,GAAkB,WAAWU,EAAY,oBAAoB,GAAG,gBAAcP,IAAU,CAAC,CAACA,IAAU,OACvH,GAAAU,EACA,GAAAX,CACH,CACF;AAEJ;"}

package/components/Table/TableRow/TableRow.js

@@ -1,40 +0,0 @@
-import e from "react";
-import E from "classnames";
-import o from "../../Table/styles.module.scss";
-import { ModeType as d } from "../Table.js";
-import w from "../TableExpanderCell/TableExpanderCellMobile.js";
-const x = ({
-  rowKey: m,
-  hideDetailsText: s,
-  showDetailsText: n,
-  expandable: t,
-  expanded: p,
-  onClick: a,
-  className: b,
-  children: f,
-  mode: l = d.normal,
-  ...i
-}) => {
-  const c = E(
-    o["table-row"],
-    {
-      [o["table__row--expandable"]]: t
-    },
-    b
-  );
-  return /* @__PURE__ */ e.createElement("tr", { className: c, onClick: a, key: m, ...i }, e.Children.map(f, (r) => e.isValidElement(r) && e.cloneElement(r, { mode: l })), t && /* @__PURE__ */ e.createElement(
-    w,
-    {
-      expanded: p,
-      onClick: a,
-      hideDetailsText: s,
-      showDetailsText: n,
-      mode: l
-    }
-  ));
-};
-export {
-  x as TableRow,
-  x as default
-};
-//# sourceMappingURL=TableRow.js.map

package/components/Table/TableRow/TableRow.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TableRow.js","sources":["../../../../src/components/Table/TableRow/TableRow.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport tableStyles from '../styles.module.scss';\nimport { ModeType } from '../Table';\nimport TableExpanderCellMobile from '../TableExpanderCell/TableExpanderCellMobile';\n\nexport interface Props extends Omit<React.ComponentPropsWithoutRef<'tr'>, 'style'> {\n  /** Sets if expanded row can be expanded */\n  expandable?: boolean;\n  /** Sets if expanded row is expanded */\n  expanded?: boolean;\n  /** When hide/show button for expanded row is clicked. */\n  onClick?: () => void;\n  /** Text for expanded row hide button. */\n  hideDetailsText?: string;\n  /** Text for expanded row show button. */\n  showDetailsText?: string;\n  /** Key attribute for row */\n  rowKey?: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the cells of the table row element.  */\n  children?: React.ReactNode;\n  /** For display with less space. Discouraged to use together with interactive elements. */\n  mode?: ModeType;\n}\n\nexport const TableRow: React.FC<Props> = ({\n  rowKey,\n  hideDetailsText,\n  showDetailsText,\n  expandable,\n  expanded,\n  onClick,\n  className,\n  children,\n  mode = ModeType.normal,\n  ...rest\n}) => {\n  const tableRowClass = classNames(\n    tableStyles['table-row'],\n    {\n      [tableStyles['table__row--expandable']]: expandable,\n    },\n    className\n  );\n\n  return (\n    <tr className={tableRowClass} onClick={onClick} key={rowKey} {...rest}>\n      {React.Children.map(children, child => React.isValidElement<{ mode?: ModeType }>(child) && React.cloneElement(child, { mode }))}\n      {expandable && (\n        <TableExpanderCellMobile\n          expanded={expanded}\n          onClick={onClick}\n          hideDetailsText={hideDetailsText}\n          showDetailsText={showDetailsText}\n          mode={mode}\n        />\n      )}\n    </tr>\n  );\n};\n\nexport default TableRow;\n"],"names":["TableRow","rowKey","hideDetailsText","showDetailsText","expandable","expanded","onClick","className","children","mode","ModeType","rest","tableRowClass","classNames","tableStyles","React","child","TableExpanderCellMobile"],"mappings":";;;;;AA6BO,MAAMA,IAA4B,CAAC;AAAA,EACxC,QAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC,IAAOC,EAAS;AAAA,EAChB,GAAGC;AACL,MAAM;AACJ,QAAMC,IAAgBC;AAAA,IACpBC,EAAY,WAAW;AAAA,IACvB;AAAA,MACE,CAACA,EAAY,wBAAwB,CAAC,GAAGV;AAAA,IAC3C;AAAA,IACAG;AAAA,EAAA;AAIA,SAAAQ,gBAAAA,EAAA,cAAC,MAAG,EAAA,WAAWH,GAAe,SAAAN,GAAkB,KAAKL,GAAS,GAAGU,EAAA,GAC9DI,EAAM,SAAS,IAAIP,GAAU,OAASO,EAAM,eAAoCC,CAAK,KAAKD,EAAM,aAAaC,GAAO,EAAE,MAAAP,EAAM,CAAA,CAAC,GAC7HL,KACCW,gBAAAA,EAAA;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,UAAAZ;AAAA,MACA,SAAAC;AAAA,MACA,iBAAAJ;AAAA,MACA,iBAAAC;AAAA,MACA,MAAAM;AAAA,IAAA;AAAA,EAAA,CAGN;AAEJ;"}

package/components/Table/utils.js

@@ -1,32 +0,0 @@
-import { ResponsiveTableVariant as t } from "./Table.js";
-import { Breakpoint as l } from "../../hooks/useBreakpoint.js";
-import { isTouchDevice as k } from "../../utils/device.js";
-import v from "../Table/styles.module.scss";
-const p = (r) => r.variant === t.centeredoverflow || r.variant === t.block, b = (r) => r.variant === "centeredoverflow" || r.variant === "block" ? v[`table--${r.variant}-${r.breakpoint}`] : "", f = (r, a) => l[r.breakpoint] - l[a.breakpoint], s = (r, a) => l[r.breakpoint] >= a, u = (r, a) => {
-  if (Array.isArray(r))
-    return r.sort(f), r.find((n) => s(n, a));
-  if (r && s(r, a))
-    return r;
-}, w = (r, a, n, c) => {
-  const e = u(r, a), o = k(), i = n <= c;
-  if (e)
-    return e.variant === t.centeredoverflow && !i && e.fallbackVariant === t.horizontalscroll ? {
-      variant: o ? t.horizontalscroll : t.none,
-      breakpoint: e.breakpoint
-    } : e.variant === t.centeredoverflow && !i && e.fallbackVariant !== t.centeredoverflow ? {
-      variant: e.fallbackVariant ?? t.none,
-      breakpoint: e.breakpoint
-    } : e.variant === t.horizontalscroll && !o && e.fallbackVariant === t.centeredoverflow ? {
-      variant: i ? t.centeredoverflow : t.none,
-      breakpoint: e.breakpoint
-    } : e.variant === t.horizontalscroll && !o && e.fallbackVariant !== t.horizontalscroll ? {
-      variant: e.fallbackVariant ?? t.none,
-      breakpoint: e.breakpoint
-    } : e;
-}, V = (r) => r && p(r) ? b(r) : void 0, U = (r, a) => r >= a ? void 0 : { left: `${(r - a) / 2 - 8}px` };
-export {
-  V as getBreakpointClass,
-  U as getCenteredOverflowTableStyle,
-  w as getCurrentConfig
-};
-//# sourceMappingURL=utils.js.map

package/components/Table/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../src/components/Table/utils.ts"],"sourcesContent":["import React from 'react';\n\nimport { BreakpointConfig, ResponsiveTableVariant } from './Table';\nimport { Breakpoint } from '../../hooks/useBreakpoint';\nimport { isTouchDevice } from '../../utils/device';\n\nimport styles from './styles.module.scss';\n\n/**\n * Sjekk om det skal brukes CSS for å bestemme responsivt utseende på dette breakpoint\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns true om breakpoint bruker CSS\n */\nconst configUsesCss = (config: BreakpointConfig): boolean =>\n  config.variant === ResponsiveTableVariant.centeredoverflow || config.variant === ResponsiveTableVariant.block;\n\n/**\n * Lag klassenavn for CSS-config\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns CSS-klassenavn\n */\nconst mapConfigToClass = (config: BreakpointConfig): string =>\n  config.variant === 'centeredoverflow' || config.variant === 'block' ? styles[`table--${config.variant}-${config.breakpoint}`] : '';\n\n/**\n * Sorter konfigurasjon etter breakpoints, fra største til minste\n * @param a Konfigurasjon for responsiv oppførsel\n * @param b Konfigurasjon for responsiv oppførsel\n * @returns Sortert liste\n */\nconst sortByBreakpointsDescending = (a: BreakpointConfig, b: BreakpointConfig): number =>\n  Breakpoint[a.breakpoint] - Breakpoint[b.breakpoint];\n\n/**\n * Sjekk om en konfigurasjon skal brukes for nåværende breakpoint\n * @param a Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @returns true dersom config skal brukes for breakpointet\n */\nconst isValidForCurrentBreakpoint = (config: BreakpointConfig, breakpoint: Breakpoint): boolean =>\n  Breakpoint[config.breakpoint] >= breakpoint;\n\n/**\n * Finn konfigurasjon for nåværende breakpoint\n * @param config Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @returns Konfigurasjon for responsiv oppførsel\n */\nconst getConfigForBreakpoint = (config: BreakpointConfig | BreakpointConfig[], breakpoint: Breakpoint): BreakpointConfig | undefined => {\n  if (Array.isArray(config)) {\n    config.sort(sortByBreakpointsDescending);\n\n    return config.find(x => isValidForCurrentBreakpoint(x, breakpoint));\n  } else if (config && isValidForCurrentBreakpoint(config, breakpoint)) {\n    return config;\n  }\n};\n\n/**\n * Finn konfigurasjon for nåværende breakpoint og tabellbredde\n * @param config Konfigurasjon for responsiv oppførsel\n * @param breakpoint Nåværende breakpoint\n * @param tableWidth Bredde på tabell i px\n * @returns Konfigurasjon for responsiv oppførsel uten fallbackVariant\n */\nexport const getCurrentConfig = (\n  config: BreakpointConfig | BreakpointConfig[],\n  breakpoint: Breakpoint,\n  tableWidth: number,\n  windowWidth: number\n): Omit<BreakpointConfig, 'fallbackVariant'> | undefined => {\n  const breakpointConfig = getConfigForBreakpoint(config, breakpoint);\n  const canUseHorizontalScroll = isTouchDevice();\n  const canUseCenteredOverflow = tableWidth <= windowWidth;\n\n  if (!breakpointConfig) {\n    return;\n  }\n\n  if (\n    breakpointConfig.variant === ResponsiveTableVariant.centeredoverflow &&\n    !canUseCenteredOverflow &&\n    breakpointConfig.fallbackVariant === ResponsiveTableVariant.horizontalscroll\n  ) {\n    return {\n      variant: canUseHorizontalScroll ? ResponsiveTableVariant.horizontalscroll : ResponsiveTableVariant.none,\n      breakpoint: breakpointConfig.breakpoint,\n    };\n  }\n\n  if (\n    breakpointConfig.variant === ResponsiveTableVariant.centeredoverflow &&\n    !canUseCenteredOverflow &&\n    breakpointConfig.fallbackVariant !== ResponsiveTableVariant.centeredoverflow\n  ) {\n    return {\n      variant: breakpointConfig.fallbackVariant ?? ResponsiveTableVariant.none,\n      breakpoint: breakpointConfig.breakpoint,\n    };\n  }\n\n  if (\n    breakpointConfig.variant === ResponsiveTableVariant.horizontalscroll &&\n    !canUseHorizontalScroll &&\n    breakpointConfig.fallbackVariant === ResponsiveTableVariant.centeredoverflow\n  ) {\n    return {\n      variant: canUseCenteredOverflow ? ResponsiveTableVariant.centeredoverflow : ResponsiveTableVariant.none,\n      breakpoint: breakpointConfig.breakpoint,\n    };\n  }\n\n  if (\n    breakpointConfig.variant === ResponsiveTableVariant.horizontalscroll &&\n    !canUseHorizontalScroll &&\n    breakpointConfig.fallbackVariant !== ResponsiveTableVariant.horizontalscroll\n  ) {\n    return {\n      variant: breakpointConfig.fallbackVariant ?? ResponsiveTableVariant.none,\n      breakpoint: breakpointConfig.breakpoint,\n    };\n  }\n\n  return breakpointConfig;\n};\n\n/**\n * Finn klassenavn for responsiv oppførsel\n * @param config Konfigurasjon for responsiv oppførsel\n * @returns Klassenavn\n */\nexport const getBreakpointClass = (config?: BreakpointConfig): string | undefined =>\n  config && configUsesCss(config) ? mapConfigToClass(config) : undefined;\n\n/**\n * Finn riktig posisjon for horisontal sentrering av tabell som skal vises \"centeredoverflow\"\n * @param parentWidth Bredde på element som tabellen ligger i\n * @param tableWidth Bredde på tabellen\n * @returns Styling som posisjonerer tabellen riktig\n */\nexport const getCenteredOverflowTableStyle = (parentWidth: number, tableWidth: number): React.CSSProperties | undefined => {\n  if (parentWidth >= tableWidth) {\n    return;\n  }\n\n  const COLUMN_GUTTER_WIDTH_PX = 8;\n\n  return { left: `${(parentWidth - tableWidth) / 2 - COLUMN_GUTTER_WIDTH_PX}px` };\n};\n"],"names":["configUsesCss","config","ResponsiveTableVariant","mapConfigToClass","styles","sortByBreakpointsDescending","a","b","Breakpoint","isValidForCurrentBreakpoint","breakpoint","getConfigForBreakpoint","x","getCurrentConfig","tableWidth","windowWidth","breakpointConfig","canUseHorizontalScroll","isTouchDevice","canUseCenteredOverflow","getBreakpointClass","getCenteredOverflowTableStyle","parentWidth"],"mappings":";;;;AAaA,MAAMA,IAAgB,CAACC,MACrBA,EAAO,YAAYC,EAAuB,oBAAoBD,EAAO,YAAYC,EAAuB,OAOpGC,IAAmB,CAACF,MACxBA,EAAO,YAAY,sBAAsBA,EAAO,YAAY,UAAUG,EAAO,UAAUH,EAAO,OAAO,IAAIA,EAAO,UAAU,EAAE,IAAI,IAQ5HI,IAA8B,CAACC,GAAqBC,MACxDC,EAAWF,EAAE,UAAU,IAAIE,EAAWD,EAAE,UAAU,GAQ9CE,IAA8B,CAACR,GAA0BS,MAC7DF,EAAWP,EAAO,UAAU,KAAKS,GAQ7BC,IAAyB,CAACV,GAA+CS,MAAyD;AAClI,MAAA,MAAM,QAAQT,CAAM;AACtB,WAAAA,EAAO,KAAKI,CAA2B,GAEhCJ,EAAO,KAAK,CAAAW,MAAKH,EAA4BG,GAAGF,CAAU,CAAC;AACzD,MAAAT,KAAUQ,EAA4BR,GAAQS,CAAU;AAC1D,WAAAT;AAEX,GASaY,IAAmB,CAC9BZ,GACAS,GACAI,GACAC,MAC0D;AACpD,QAAAC,IAAmBL,EAAuBV,GAAQS,CAAU,GAC5DO,IAAyBC,KACzBC,IAAyBL,KAAcC;AAE7C,MAAKC;AAKH,WAAAA,EAAiB,YAAYd,EAAuB,oBACpD,CAACiB,KACDH,EAAiB,oBAAoBd,EAAuB,mBAErD;AAAA,MACL,SAASe,IAAyBf,EAAuB,mBAAmBA,EAAuB;AAAA,MACnG,YAAYc,EAAiB;AAAA,IAAA,IAK/BA,EAAiB,YAAYd,EAAuB,oBACpD,CAACiB,KACDH,EAAiB,oBAAoBd,EAAuB,mBAErD;AAAA,MACL,SAASc,EAAiB,mBAAmBd,EAAuB;AAAA,MACpE,YAAYc,EAAiB;AAAA,IAAA,IAK/BA,EAAiB,YAAYd,EAAuB,oBACpD,CAACe,KACDD,EAAiB,oBAAoBd,EAAuB,mBAErD;AAAA,MACL,SAASiB,IAAyBjB,EAAuB,mBAAmBA,EAAuB;AAAA,MACnG,YAAYc,EAAiB;AAAA,IAAA,IAK/BA,EAAiB,YAAYd,EAAuB,oBACpD,CAACe,KACDD,EAAiB,oBAAoBd,EAAuB,mBAErD;AAAA,MACL,SAASc,EAAiB,mBAAmBd,EAAuB;AAAA,MACpE,YAAYc,EAAiB;AAAA,IAAA,IAI1BA;AACT,GAOaI,IAAqB,CAACnB,MACjCA,KAAUD,EAAcC,CAAM,IAAIE,EAAiBF,CAAM,IAAI,QAQlDoB,IAAgC,CAACC,GAAqBR,MAC7DQ,KAAeR,IACjB,SAKK,EAAE,MAAM,IAAIQ,IAAcR,KAAc,IAFhB,CAE0C;"}

package/components/Tabs/Tab.js

@@ -1,6 +0,0 @@
-import e from "react";
-const r = (t) => /* @__PURE__ */ e.createElement(e.Fragment, null, t.children ?? null);
-export {
-  r as default
-};
-//# sourceMappingURL=Tab.js.map

package/components/Tabs/Tab.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Tab.js","sources":["../../../src/components/Tabs/Tab.tsx"],"sourcesContent":["import React from 'react';\n\nimport { SvgIcon } from '../Icon';\nimport { IconName } from '../Icons/IconNames';\n\nexport interface TabProps {\n  /** Sets the tab panel content */\n  children?: React.ReactNode;\n  /** Optional icon on the tab */\n  icon?: SvgIcon | IconName;\n  /** Called when tab is selected */\n  onTabClick?: (index: number) => void;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Title on the tab */\n  title?: string;\n}\n\nconst Tab: React.FC<TabProps> = props => {\n  return <>{props.children ?? null}</>;\n};\n\nexport default Tab;\n"],"names":["Tab","props","React"],"mappings":";AAkBA,MAAMA,IAA0B,CAASC,MAChCC,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MAAGD,EAAM,YAAY,IAAK;"}

package/components/Tabs/TabList/TabItem.js

@@ -1,45 +0,0 @@
-import a, { useRef as R, useEffect as E } from "react";
-import T from "classnames";
-import { useIsVisible as y } from "../../../hooks/useIsVisible.js";
-import { palette as i } from "../../../theme/palette.js";
-import { Icon as C } from "../../Icon/Icon.js";
-import { IconSize as f } from "../../../constants.js";
-import { LazyIcon as z } from "../../LazyIcon/LazyIcon.js";
-import l from "../../Tabs/TabList/styles.module.scss";
-const w = (e) => {
-  const t = e.index === e.selectedTab, { title: d, onTabClick: o, icon: n, testId: u } = e.tabProps, _ = () => {
-    o && o(e.index), e.onTabListClick(e.index), s(e.index);
-  }, x = T(l["tab-list__tab"], l[`tab-list__tab--${e.color}`], {
-    [l["tab-list__tab--selected"]]: t,
-    [l["tab-list__tab--first"]]: e.index == 0
-  }), I = e.tabRefs.current && e.tabRefs.current[e.index], s = (k) => {
-    var m;
-    const c = e.tabRefs.current && e.tabRefs.current[k];
-    (m = c == null ? void 0 : c.current) == null || m.scrollIntoView({ behavior: "smooth", inline: "center", block: "nearest" });
-  }, r = R(null), b = y(r);
-  return E(() => {
-    t && b && s(e.index);
-  }, [t && b]), /* @__PURE__ */ a.createElement("li", { role: "presentation", ref: r }, /* @__PURE__ */ a.createElement(
-    "button",
-    {
-      role: "tab",
-      "aria-selected": t,
-      onClick: _,
-      className: x,
-      "data-testid": u,
-      ref: I
-    },
-    /* @__PURE__ */ a.createElement("span", { className: l["tab-list__tab__title-and-icon"] }, n && (typeof n == "string" ? /* @__PURE__ */ a.createElement(
-      z,
-      {
-        iconName: n,
-        size: f.XSmall,
-        color: t ? i.black : i.blueberry500
-      }
-    ) : /* @__PURE__ */ a.createElement(C, { svgIcon: n, size: f.XSmall, color: t ? i.black : i.blueberry500 })), d)
-  ));
-};
-export {
-  w as default
-};
-//# sourceMappingURL=TabItem.js.map

package/components/Tabs/TabList/TabItem.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TabItem.js","sources":["../../../../src/components/Tabs/TabList/TabItem.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { useIsVisible } from '../../../hooks/useIsVisible';\nimport { palette } from '../../../theme/palette';\nimport Icon, { IconSize } from '../../Icon';\nimport { IconName } from '../../Icons/IconNames';\nimport LazyIcon from '../../LazyIcon';\nimport { TabProps } from '../Tab';\nimport { TabsColors } from '../Tabs';\n\nimport styles from './styles.module.scss';\n\ninterface TabItemProps {\n  tabProps: TabProps;\n  index: number;\n  color: TabsColors;\n  selectedTab: number;\n  tabRefs: React.MutableRefObject<React.RefObject<HTMLButtonElement>[] | null | undefined>;\n  onTabListClick: (index: number) => void;\n}\n\nconst TabItem: React.FC<TabItemProps> = props => {\n  const isSelected = props.index === props.selectedTab;\n  const { title, onTabClick, icon, testId } = props.tabProps;\n  const handleClick = (): void => {\n    onTabClick && onTabClick(props.index);\n    props.onTabListClick(props.index);\n    scrollToTab(props.index);\n  };\n  const tabButtonClasses = classNames(styles['tab-list__tab'], styles[`tab-list__tab--${props.color}`], {\n    [styles['tab-list__tab--selected']]: isSelected,\n    [styles['tab-list__tab--first']]: props.index == 0,\n  });\n\n  const currentRef = props.tabRefs.current && props.tabRefs.current[props.index];\n\n  const scrollToTab = (index: number): void => {\n    const currentRef = props.tabRefs.current && props.tabRefs.current[index];\n    currentRef?.current?.scrollIntoView({ behavior: 'smooth', inline: 'center', block: 'nearest' });\n  };\n\n  const itemRef = useRef<HTMLLIElement>(null);\n  const isVisible = useIsVisible(itemRef);\n\n  useEffect(() => {\n    if (isSelected && isVisible) {\n      scrollToTab(props.index);\n    }\n  }, [isSelected && isVisible]);\n\n  return (\n    <li role=\"presentation\" ref={itemRef}>\n      <button\n        role=\"tab\"\n        aria-selected={isSelected}\n        onClick={handleClick}\n        className={tabButtonClasses}\n        data-testid={testId}\n        ref={currentRef as React.RefObject<HTMLButtonElement>}\n      >\n        <span className={styles['tab-list__tab__title-and-icon']}>\n          {icon &&\n            (typeof icon === 'string' ? (\n              <LazyIcon\n                iconName={icon as IconName}\n                size={IconSize.XSmall}\n                color={isSelected ? palette[`black`] : palette['blueberry500']}\n              />\n            ) : (\n              <Icon svgIcon={icon} size={IconSize.XSmall} color={isSelected ? palette[`black`] : palette['blueberry500']} />\n            ))}\n          {title}\n        </span>\n      </button>\n    </li>\n  );\n};\n\nexport default TabItem;\n"],"names":["TabItem","props","isSelected","title","onTabClick","icon","testId","handleClick","scrollToTab","tabButtonClasses","classNames","styles","currentRef","index","itemRef","useRef","isVisible","useIsVisible","useEffect","React","LazyIcon","IconSize","palette","Icon"],"mappings":";;;;;;;;AAuBA,MAAMA,IAAkC,CAASC,MAAA;AACzC,QAAAC,IAAaD,EAAM,UAAUA,EAAM,aACnC,EAAE,OAAAE,GAAO,YAAAC,GAAY,MAAAC,GAAM,QAAAC,MAAWL,EAAM,UAC5CM,IAAc,MAAY;AAChB,IAAAH,KAAAA,EAAWH,EAAM,KAAK,GAC9BA,EAAA,eAAeA,EAAM,KAAK,GAChCO,EAAYP,EAAM,KAAK;AAAA,EAAA,GAEnBQ,IAAmBC,EAAWC,EAAO,eAAe,GAAGA,EAAO,kBAAkBV,EAAM,KAAK,EAAE,GAAG;AAAA,IACpG,CAACU,EAAO,yBAAyB,CAAC,GAAGT;AAAA,IACrC,CAACS,EAAO,sBAAsB,CAAC,GAAGV,EAAM,SAAS;AAAA,EAAA,CAClD,GAEKW,IAAaX,EAAM,QAAQ,WAAWA,EAAM,QAAQ,QAAQA,EAAM,KAAK,GAEvEO,IAAc,CAACK,MAAwB;;AAC3C,UAAMD,IAAaX,EAAM,QAAQ,WAAWA,EAAM,QAAQ,QAAQY,CAAK;AACvED,KAAAA,IAAAA,KAAAA,gBAAAA,EAAY,YAAZA,QAAAA,EAAqB,eAAe,EAAE,UAAU,UAAU,QAAQ,UAAU,OAAO,UAAA;AAAA,EAAW,GAG1FE,IAAUC,EAAsB,IAAI,GACpCC,IAAYC,EAAaH,CAAO;AAEtC,SAAAI,EAAU,MAAM;AACd,IAAIhB,KAAcc,KAChBR,EAAYP,EAAM,KAAK;AAAA,EACzB,GACC,CAACC,KAAcc,CAAS,CAAC,GAGzBG,gBAAAA,EAAA,cAAA,MAAA,EAAG,MAAK,gBAAe,KAAKL,KAC3BK,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,iBAAejB;AAAA,MACf,SAASK;AAAA,MACT,WAAWE;AAAA,MACX,eAAaH;AAAA,MACb,KAAKM;AAAA,IAAA;AAAA,IAELO,gBAAAA,EAAA,cAAC,UAAK,WAAWR,EAAO,+BAA+B,EACpD,GAAAN,MACE,OAAOA,KAAS,WACfc,gBAAAA,EAAA;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,UAAUf;AAAA,QACV,MAAMgB,EAAS;AAAA,QACf,OAAOnB,IAAaoB,EAAQ,QAAWA,EAAQ;AAAA,MAAc;AAAA,IAAA,IAG9DH,gBAAAA,EAAA,cAAAI,GAAA,EAAK,SAASlB,GAAM,MAAMgB,EAAS,QAAQ,OAAOnB,IAAaoB,EAAQ,QAAWA,EAAQ,aAAc,CAAG,IAE/GnB,CACH;AAAA,EAAA,CAEJ;AAEJ;"}