@helsenorge/designsystem-react 7.0.0 → 7.1.0

package/CHANGELOG.md

@@ -1,3 +1,5 @@
+## [7.0.0](https://github.com/helsenorge/designsystem/branchCompare?baseVersion=GTv6.6.2&targetVersion=GTv7.0.0) (2024-04-08)
+
 ## 7.0.0-beta.7 (2024-04-05)
 
 ## 7.0.0-beta.6 (2024-04-05)

package/_virtual/_cloneBuffer.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=_cloneBuffer.js.map

package/_virtual/_cloneBuffer.js.map

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

package/_virtual/_commonjs-dynamic-modules.js

@@ -0,0 +1,7 @@
+function r(o) {
+  throw new Error('Could not dynamically require "' + o + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
+}
+export {
+  r as commonjsRequire
+};
+//# sourceMappingURL=_commonjs-dynamic-modules.js.map

package/_virtual/_commonjs-dynamic-modules.js.map

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

package/_virtual/_commonjsHelpers.js

@@ -0,0 +1,9 @@
+var o = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
+function l(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+export {
+  o as commonjsGlobal,
+  l as getDefaultExportFromCjs
+};
+//# sourceMappingURL=_commonjsHelpers.js.map

package/_virtual/_commonjsHelpers.js.map

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

package/_virtual/_nodeUtil.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=_nodeUtil.js.map

package/_virtual/_nodeUtil.js.map

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

package/_virtual/assert.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=assert.js.map

package/_virtual/assert.js.map

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

package/_virtual/ast.js

@@ -0,0 +1,5 @@
+var a = { exports: {} };
+export {
+  a as __module
+};
+//# sourceMappingURL=ast.js.map

package/_virtual/ast.js.map

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

package/_virtual/code.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=code.js.map

package/_virtual/code.js.map

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

package/_virtual/doctrine.js

@@ -0,0 +1,5 @@
+var r = {};
+export {
+  r as __exports
+};
+//# sourceMappingURL=doctrine.js.map

package/_virtual/doctrine.js.map

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

package/_virtual/errors.js

@@ -0,0 +1,5 @@
+var r = {};
+export {
+  r as __exports
+};
+//# sourceMappingURL=errors.js.map

package/_virtual/errors.js.map

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

package/_virtual/index.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=index.js.map

package/_virtual/index.js.map

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

package/_virtual/index2.js

@@ -0,0 +1,5 @@
+var o = {};
+export {
+  o as __exports
+};
+//# sourceMappingURL=index2.js.map

package/_virtual/index2.js.map

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

package/_virtual/index3.js

@@ -0,0 +1,5 @@
+var a = { exports: {} };
+export {
+  a as __module
+};
+//# sourceMappingURL=index3.js.map

package/_virtual/index3.js.map

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

package/_virtual/inherits_browser.js

@@ -0,0 +1,5 @@
+var r = { exports: {} };
+export {
+  r as __module
+};
+//# sourceMappingURL=inherits_browser.js.map

package/_virtual/inherits_browser.js.map

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

package/_virtual/isBuffer.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=isBuffer.js.map

package/_virtual/isBuffer.js.map

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

package/_virtual/keyword.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=keyword.js.map

package/_virtual/keyword.js.map

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

package/_virtual/memoizerific.js

@@ -0,0 +1,5 @@
+var e = { exports: {} };
+export {
+  e as __module
+};
+//# sourceMappingURL=memoizerific.js.map

package/_virtual/memoizerific.js.map

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

package/_virtual/typed.js

@@ -0,0 +1,5 @@
+var e = {};
+export {
+  e as __exports
+};
+//# sourceMappingURL=typed.js.map

package/_virtual/typed.js.map

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

package/_virtual/types.js

@@ -0,0 +1,5 @@
+var e = {};
+export {
+  e as __exports
+};
+//# sourceMappingURL=types.js.map

package/_virtual/types.js.map

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

package/_virtual/util.js

@@ -0,0 +1,5 @@
+var r = {};
+export {
+  r as __exports
+};
+//# sourceMappingURL=util.js.map

package/_virtual/util.js.map

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

package/_virtual/utility.js

@@ -0,0 +1,5 @@
+var t = {};
+export {
+  t as __exports
+};
+//# sourceMappingURL=utility.js.map

package/_virtual/utility.js.map

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

package/_virtual/utils.js

@@ -0,0 +1,5 @@
+var r = {};
+export {
+  r as __exports
+};
+//# sourceMappingURL=utils.js.map

package/_virtual/utils.js.map

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

package/components/AnchorLink/AnchorLink.js

@@ -5,7 +5,7 @@ import { useHover as E } from "../../hooks/useHover.js";
 import { getColor as m } from "../../theme/currys/color.js";
 import { Icon as N } from "../Icon/Icon.js";
 import _ from "../Icons/ArrowUpRight.js";
-import r from "./styles.module.scss";
+import r from "../AnchorLink/styles.module.scss";
 const C = e.forwardRef((i, f) => {
   const { id: p, href: d, children: h, className: u, target: o = "_self", htmlMarkup: t = "a", onClick: k, testId: b } = i, n = o === "_blank", { hoverRef: a, isHovered: g } = E(
     f

package/components/Avatar/Avatar.js

@@ -4,7 +4,7 @@ import { AnalyticsId as v, IconSize as u } from "../../constants.js";
 import { palette as o } from "../../theme/palette.js";
 import { Icon as b } from "../Icon/Icon.js";
 import x from "../Icons/Check.js";
-import a from "./styles.module.scss";
+import a from "../Avatar/styles.module.scss";
 var A = /* @__PURE__ */ ((t) => (t.xsmall = "xsmall", t.small = "small", t))(A || {});
 const I = r.forwardRef(function(c, n) {
   const { children: e, className: i = "", selected: l = !1, variant: s = "normal", size: m = "small", testId: d } = c, f = e.charAt(0).toLocaleUpperCase() + e.substring(1, 2);

package/components/Badge/Badge.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { PaletteNames } from '../../theme/palette';
-export type BadgeColors = PaletteNames;
+export type BadgeColors = Extract<PaletteNames, 'blueberry' | 'cherry' | 'neutral'>;
 export type BadgeChildren = string | number;
 export interface BadgeProps {
     /** Sets the content of the badge. */

package/components/Badge/Badge.js

@@ -1,24 +1,20 @@
-import t from "react";
-import b from "classnames";
-import { AnalyticsId as c } from "../../constants.js";
-import a from "./styles.module.scss";
-const i = t.forwardRef(function(r, d) {
-  const { children: s, className: l = "", color: e = "black", testId: n } = r, o = b(
-    a.badge,
+import r from "react";
+import n from "classnames";
+import { AnalyticsId as b } from "../../constants.js";
+import e from "../Badge/styles.module.scss";
+const m = r.forwardRef(function(t, d) {
+  const { children: s, className: o = "", color: a = "blueberry", testId: l } = t, c = n(
+    e.badge,
     {
-      [a["badge--white"]]: e === "white",
-      [a["badge--blueberry"]]: e === "blueberry",
-      [a["badge--banana"]]: e === "banana",
-      [a["badge--cherry"]]: e === "cherry",
-      [a["badge--kiwi"]]: e === "kiwi",
-      [a["badge--neutral"]]: e === "neutral",
-      [a["badge--plum"]]: e === "plum"
+      [e["badge--blueberry"]]: a === "blueberry",
+      [e["badge--cherry"]]: a === "cherry",
+      [e["badge--neutral"]]: a === "neutral"
     },
-    l
+    o
   );
-  return /* @__PURE__ */ t.createElement("span", { className: o, ref: d, "data-testid": n, "data-analyticsid": c.Badge }, s);
-}), y = i;
+  return /* @__PURE__ */ r.createElement("span", { className: c, ref: d, "data-testid": l, "data-analyticsid": b.Badge }, s);
+}), p = m;
 export {
-  y as default
+  p as default
 };
 //# sourceMappingURL=Badge.js.map

package/components/Badge/Badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { PaletteNames } from '../../theme/palette';\n\nimport badgeStyles from './styles.module.scss';\n\nexport type BadgeColors = PaletteNames;\nexport type BadgeChildren = string | number;\n\nexport interface BadgeProps {\n  /** Sets the content of the badge. */\n  children: BadgeChildren;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the badge background color. */\n  color?: BadgeColors;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type BadgeType = React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;\nconst Badge: BadgeType = React.forwardRef(function BadgeForwardedRef(props: BadgeProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', color = 'black', testId } = props;\n  const badgeClasses = classNames(\n    badgeStyles.badge,\n    {\n      [badgeStyles['badge--white']]: color === 'white',\n      [badgeStyles['badge--blueberry']]: color === 'blueberry',\n      [badgeStyles['badge--banana']]: color === 'banana',\n      [badgeStyles['badge--cherry']]: color === 'cherry',\n      [badgeStyles['badge--kiwi']]: color === 'kiwi',\n      [badgeStyles['badge--neutral']]: color === 'neutral',\n      [badgeStyles['badge--plum']]: color === 'plum',\n    },\n    className\n  );\n\n  return (\n    <span className={badgeClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Badge}>\n      {children}\n    </span>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","props","ref","children","className","color","testId","badgeClasses","classNames","badgeStyles","AnalyticsId","Badge$1"],"mappings":";;;;AAuBA,MAAMA,IAAmBC,EAAM,WAAW,SAA2BC,GAAmBC,GAAsC;AAC5H,QAAM,EAAE,UAAAC,GAAU,WAAAC,IAAY,IAAI,OAAAC,IAAQ,SAAS,QAAAC,EAAW,IAAAL,GACxDM,IAAeC;AAAA,IACnBC,EAAY;AAAA,IACZ;AAAA,MACE,CAACA,EAAY,cAAc,CAAC,GAAGJ,MAAU;AAAA,MACzC,CAACI,EAAY,kBAAkB,CAAC,GAAGJ,MAAU;AAAA,MAC7C,CAACI,EAAY,eAAe,CAAC,GAAGJ,MAAU;AAAA,MAC1C,CAACI,EAAY,eAAe,CAAC,GAAGJ,MAAU;AAAA,MAC1C,CAACI,EAAY,aAAa,CAAC,GAAGJ,MAAU;AAAA,MACxC,CAACI,EAAY,gBAAgB,CAAC,GAAGJ,MAAU;AAAA,MAC3C,CAACI,EAAY,aAAa,CAAC,GAAGJ,MAAU;AAAA,IAC1C;AAAA,IACAD;AAAA,EAAA;AAIA,SAAAJ,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAWO,GAAc,KAAAL,GAAU,eAAaI,GAAQ,oBAAkBI,EAAY,MAAA,GACzFP,CACH;AAEJ,CAAC,GAEDQ,IAAeZ;"}
+{"version":3,"file":"Badge.js","sources":["../../../src/components/Badge/Badge.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { AnalyticsId } from '../../constants';\nimport { PaletteNames } from '../../theme/palette';\n\nimport badgeStyles from './styles.module.scss';\n\nexport type BadgeColors = Extract<PaletteNames, 'blueberry' | 'cherry' | 'neutral'>;\nexport type BadgeChildren = string | number;\n\nexport interface BadgeProps {\n  /** Sets the content of the badge. */\n  children: BadgeChildren;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Changes the badge background color. */\n  color?: BadgeColors;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\nexport type BadgeType = React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;\nconst Badge: BadgeType = React.forwardRef(function BadgeForwardedRef(props: BadgeProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { children, className = '', color = 'blueberry', testId } = props;\n  const badgeClasses = classNames(\n    badgeStyles.badge,\n    {\n      [badgeStyles['badge--blueberry']]: color === 'blueberry',\n      [badgeStyles['badge--cherry']]: color === 'cherry',\n      [badgeStyles['badge--neutral']]: color === 'neutral',\n    },\n    className\n  );\n\n  return (\n    <span className={badgeClasses} ref={ref} data-testid={testId} data-analyticsid={AnalyticsId.Badge}>\n      {children}\n    </span>\n  );\n});\n\nexport default Badge;\n"],"names":["Badge","React","props","ref","children","className","color","testId","badgeClasses","classNames","badgeStyles","AnalyticsId","Badge$1"],"mappings":";;;;AAuBA,MAAMA,IAAmBC,EAAM,WAAW,SAA2BC,GAAmBC,GAAsC;AAC5H,QAAM,EAAE,UAAAC,GAAU,WAAAC,IAAY,IAAI,OAAAC,IAAQ,aAAa,QAAAC,EAAW,IAAAL,GAC5DM,IAAeC;AAAA,IACnBC,EAAY;AAAA,IACZ;AAAA,MACE,CAACA,EAAY,kBAAkB,CAAC,GAAGJ,MAAU;AAAA,MAC7C,CAACI,EAAY,eAAe,CAAC,GAAGJ,MAAU;AAAA,MAC1C,CAACI,EAAY,gBAAgB,CAAC,GAAGJ,MAAU;AAAA,IAC7C;AAAA,IACAD;AAAA,EAAA;AAIA,SAAAJ,gBAAAA,EAAA,cAAC,QAAK,EAAA,WAAWO,GAAc,KAAAL,GAAU,eAAaI,GAAQ,oBAAkBI,EAAY,MAAA,GACzFP,CACH;AAEJ,CAAC,GAEDQ,IAAeZ;"}

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

@@ -19,10 +19,11 @@ declare const meta: {
         };
         color: {
             control: string;
-            options: import("../../theme/palette").PaletteNames[];
+            options: string[];
         };
     };
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
+export declare const Variants: Story;

package/components/Badge/styles.module.scss

@@ -12,33 +12,21 @@
   padding: 0 0.375rem;
   color: $white;
   background-color: $black;
-
-  &--white {
-    color: $black;
-    background-color: $white;
-  }
+  border: 1px solid;
 
   &--blueberry {
     background-color: $blueberry500;
-  }
-
-  &--banana {
-    background-color: $banana500;
+    border-color: $blueberry600;
   }
 
   &--cherry {
     background-color: $cherry500;
-  }
-
-  &--kiwi {
-    background-color: $kiwi500;
+    border-color: $cherry600;
   }
 
   &--neutral {
-    background-color: $neutral500;
-  }
-
-  &--plum {
-    background-color: $plum500;
+    color: $black;
+    background-color: transparent;
+    border-color: $neutral600;
   }
 }

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

@@ -1,12 +1,8 @@
 export type Styles = {
   badge: string;
-  'badge--banana': string;
   'badge--blueberry': string;
   'badge--cherry': string;
-  'badge--kiwi': string;
   'badge--neutral': string;
-  'badge--plum': string;
-  'badge--white': string;
 };
 
 export type ClassNames = keyof Styles;

package/components/Button/Button.js

@@ -9,7 +9,7 @@ import { getColor as i } from "../../theme/currys/color.js";
 import { breakpoints as bt } from "../../theme/grid.js";
 import { isTest as pt, isProd as dt } from "../../utils/environment.js";
 import ft from "../Icons/ArrowRight.js";
-import t from "./styles.module.scss";
+import t from "../Button/styles.module.scss";
 const ht = (e, r, n, d, s, g) => g && n ? !s || e ? i("neutral", r ? 500 : 700) : i("white") : n ? !s || e ? i("neutral", 500) : `${i("white")}b3` : e && !s || !e && s ? "white" : d === "normal" ? i("blueberry", 600) : i("cherry", 500), N = (e, r) => r && e ? v.Small : e ? v.Medium : v.XSmall, gt = (e, r, n) => {
   if (n && e && (r === void 0 || r === ""))
     throw new Error("Fyll inn ariaLabel prop på Button uten tekst for å opprettholde UU krav");

package/components/Button/Button.stories.d.ts

@@ -8,6 +8,7 @@ declare const meta: {
             description: {
                 component: string;
             };
+            page: () => React.JSX.Element;
         };
     };
     args: {

package/components/Checkbox/Checkbox.js

@@ -9,7 +9,7 @@ import { uuid as ce } from "../../utils/uuid.js";
 import { Icon as re } from "../Icon/Icon.js";
 import oe from "../Icons/Check.js";
 import { getLabelText as ae, renderLabelAsParent as le } from "../Label/Label.js";
-import e from "./styles.module.scss";
+import e from "../Checkbox/styles.module.scss";
 const I = l.forwardRef((x, d) => {
   const {
     className: N,

package/components/Close/Close.js

@@ -7,7 +7,7 @@ import { palette as v } from "../../theme/palette.js";
 import { mergeRefs as I } from "../../utils/refs.js";
 import { Icon as B } from "../Icon/Icon.js";
 import N from "../Icons/X.js";
-import t from "./styles.module.scss";
+import t from "../Close/styles.module.scss";
 const g = e.forwardRef(function(r, s) {
   const { small: o, testId: a, ariaLabel: l = "Lukk", onClick: m, className: i, color: c = v.blueberry600 } = r, n = y(), { hoverRef: f, isHovered: p } = R(), d = n === C.xs || o ? 38 : 48, u = b(t.close, { [t["close--small"]]: o }, i);
   return /* @__PURE__ */ e.createElement(

package/components/DictionaryTrigger/DictionaryTrigger.js

@@ -1,7 +1,7 @@
 import t from "react";
 import d from "classnames";
 import { AnalyticsId as g } from "../../constants.js";
-import m from "./styles.module.scss";
+import m from "../DictionaryTrigger/styles.module.scss";
 const r = t.forwardRef(
   ({ children: a, selected: e = !1, className: i, testId: o, ...s }, n) => {
     const c = d(m.dictionarytrigger, i);

package/components/Dropdown/Dropdown.d.ts

@@ -6,9 +6,9 @@ export declare enum DropdownMode {
     oncherry = "oncherry"
 }
 export interface DropdownProps {
-    /** Label for dropdown. Synlig for skjermlesere.  */
+    /** Label for dropdown. Visible for screen readers  */
     label: string;
-    /** Tekst på knappen som åpner dropdownen */
+    /** Text on the trigger button that opens the dropdown */
     placeholder: string;
     /** Sets the dropdown content */
     children: React.ReactNode;
@@ -16,19 +16,19 @@ export interface DropdownProps {
     closeText?: string;
     /** No close button */
     noCloseButton?: boolean;
-    /** Called when dropdown is open/closed. */
+    /** Called when dropdown is open/closed */
     onToggle?: (isOpen: boolean) => void;
-    /** Om dropdown er åpen */
+    /** Whether the dropdown is open or not */
     open?: boolean;
     /** Changes the visuals of the dropdown */
     mode?: keyof typeof DropdownMode;
-    /** Makes the background transparent */
+    /** Makes the background of the trigger transparent */
     transparent?: boolean;
-    /** Makes the background transparent */
+    /** Makes the width of the full component adjust to its parent */
     fluid?: boolean;
     /** Makes the dropdown disabled */
     disabled?: boolean;
-    /** Sets the data-testid attribute on the dropdown button. */
+    /** Sets the data-testid attribute on the dropdown button */
     testId?: string;
     /** Overrides the default z-index of the DropDownContent */
     zIndex?: number;