@helsenorge/designsystem-react 1.0.0-beta103 → 1.0.0-beta107

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

@@ -1,10 +1,10 @@
-export type Styles = {
-  anchorlink: string;
-  anchorlink__icon: string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;
+export type Styles = {
+  anchorlink: string;
+  anchorlink__icon: string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Avatar/Avatar.d.ts

@@ -1,16 +1,16 @@
-import React from 'react';
-interface AvatarProps {
-    /** Name to display in the avatar. Will be truncated to the first two characters. */
-    children: string;
-    /** Displays a check icon to indicated the selected state. */
-    selected?: boolean;
-    /** background and color will be determined on variant. */
-    variant?: 'normal' | 'black';
-    /** Adds custom classes to the element. */
-    className?: string;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;
-export default Avatar;
+import React from 'react';
+interface AvatarProps {
+    /** Name to display in the avatar. Will be truncated to the first two characters. */
+    children: string;
+    /** Displays a check icon to indicated the selected state. */
+    selected?: boolean;
+    /** background and color will be determined on variant. */
+    variant?: 'normal' | 'black';
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare const Avatar: React.ForwardRefExoticComponent<AvatarProps & React.RefAttributes<HTMLElement>>;
+export default Avatar;
 //# sourceMappingURL=Avatar.d.ts.map

package/components/Avatar/index.d.ts

@@ -1,4 +1,4 @@
-import Avatar from './Avatar';
-export * from './Avatar';
-export default Avatar;
+import Avatar from './Avatar';
+export * from './Avatar';
+export default Avatar;
 //# sourceMappingURL=index.d.ts.map

package/components/Avatar/index.js

@@ -1,2 +1,2 @@
-import a from"react";import{I as t}from"../../Icon-89da8de4.js";import{A as r,I as e}from"../../constants-ad6c82db.js";import{C as s}from"../../Check-6291ad09.js";import{c as o}from"../../index-9b84fabc.js";import c from"./styles.module.scss";import{p as l}from"../../palette-f206f488.js";import"../../_tslib-51c8a283.js";var m=a.forwardRef((function(m,i){var d=m.children,n=m.className,f=void 0===n?"":n,p=m.selected,v=void 0!==p&&p,b=m.variant,u=void 0===b?"normal":b,j=m.testId,I=d.charAt(0).toLocaleUpperCase()+d.substring(1,2);return a.createElement("span",{className:o(c.avatar,v&&c["avatar--selected"],"black"===u&&c["avatar--black"],f),ref:i,"data-testid":j,"data-analyticsid":r.Avatar},v?a.createElement(t,{svgIcon:s,size:e.Small,color:"black"===u?l.neutral900:l.blueberry600}):I)}));export default m;
+import a from"react";import{Icon as t}from"../Icons/Icon.js";import{A as e,I as r}from"../../constants-eb74321e.js";import s from"../Icons/Check.js";import{c as o}from"../../index-9b84fabc.js";import c from"./styles.module.scss";import{p as l}from"../../palette-f206f488.js";import"../../_tslib-51c8a283.js";var m=a.forwardRef((function(m,i){var n=m.children,d=m.className,f=void 0===d?"":d,p=m.selected,v=void 0!==p&&p,b=m.variant,u=void 0===b?"normal":b,j=m.testId,I=n.charAt(0).toLocaleUpperCase()+n.substring(1,2);return a.createElement("span",{className:o(c.avatar,v&&c["avatar--selected"],"black"===u&&c["avatar--black"],f),ref:i,"data-testid":j,"data-analyticsid":e.Avatar},v?a.createElement(t,{svgIcon:s,size:r.Small,color:"black"===u?l.neutral900:l.blueberry600}):I)}));export default m;
 //# sourceMappingURL=index.js.map

package/components/Avatar/styles.module.scss

@@ -1,22 +1,22 @@
-@import '../../scss/_palette.scss';
-
-.avatar {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 3rem;
-  height: 3rem;
-  font-size: 1.5rem;
-  font-weight: 600;
-  background-color: $blueberry500;
-  color: $white;
-  &--selected {
-    background-color: transparent;
-  }
-  &--black {
-    background-color: $neutral900;
-  }
-  &--selected#{&}--black {
-    background-color: transparent;
-  }
-}
+@import '../../scss/_palette.scss';
+
+.avatar {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 3rem;
+  height: 3rem;
+  font-size: 1.5rem;
+  font-weight: 600;
+  background-color: $blueberry500;
+  color: $white;
+  &--selected {
+    background-color: transparent;
+  }
+  &--black {
+    background-color: $neutral900;
+  }
+  &--selected#{&}--black {
+    background-color: transparent;
+  }
+}

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

@@ -1,11 +1,11 @@
-export type Styles = {
-  avatar: string;
-  'avatar--black': string;
-  'avatar--selected': string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;
+export type Styles = {
+  avatar: string;
+  'avatar--black': string;
+  'avatar--selected': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Badge/Badge.d.ts

@@ -1,17 +1,17 @@
-import React from 'react';
-import { PaletteNames } from '../../theme/palette';
-export declare type BadgeColors = PaletteNames;
-export declare type BadgeChildren = string | number;
-interface BadgeProps {
-    /** Sets the content of the badge. */
-    children: BadgeChildren;
-    /** Adds custom classes to the element. */
-    className?: string;
-    /** Changes the badge background color. */
-    color?: BadgeColors;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
-export default Badge;
+import React from 'react';
+import { PaletteNames } from '../../theme/palette';
+export declare type BadgeColors = PaletteNames;
+export declare type BadgeChildren = string | number;
+interface BadgeProps {
+    /** Sets the content of the badge. */
+    children: BadgeChildren;
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Changes the badge background color. */
+    color?: BadgeColors;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare const Badge: React.ForwardRefExoticComponent<BadgeProps & React.RefAttributes<HTMLElement>>;
+export default Badge;
 //# sourceMappingURL=Badge.d.ts.map

package/components/Badge/index.d.ts

@@ -1,4 +1,4 @@
-import Badge from './Badge';
-export * from './Badge';
-export default Badge;
+import Badge from './Badge';
+export * from './Badge';
+export default Badge;
 //# sourceMappingURL=index.d.ts.map

package/components/Badge/index.js

@@ -1,2 +1,2 @@
-import{b as a}from"../../_rollupPluginBabelHelpers-b8ef6dd9.js";import e from"react";import{c as r}from"../../index-9b84fabc.js";import t from"./styles.module.scss";import{A as d}from"../../constants-ad6c82db.js";var b=e.forwardRef((function(b,l){var s,i=b.children,o=b.className,n=void 0===o?"":o,c=b.color,m=void 0===c?"black":c,g=b.testId,f=i.toString().length>2,u=r(t.badge,(a(s={},t["badge--oversized"],f),a(s,t["badge--black"],"black"===m),a(s,t["badge--white"],"white"===m),a(s,t["badge--blueberry"],"blueberry"===m),a(s,t["badge--banana"],"banana"===m),a(s,t["badge--cherry"],"cherry"===m),a(s,t["badge--kiwi"],"kiwi"===m),a(s,t["badge--neutral"],"neutral"===m),a(s,t["badge--plum"],"plum"===m),s),n);return e.createElement("span",{className:u,ref:l,"data-testid":g,"data-analyticsid":d.Badge},i)}));export default b;
+import{b as e}from"../../_rollupPluginBabelHelpers-b8ef6dd9.js";import a from"react";import{c as r}from"../../index-9b84fabc.js";import t from"./styles.module.scss";import{A as d}from"../../constants-eb74321e.js";var b=a.forwardRef((function(b,l){var s,i=b.children,o=b.className,n=void 0===o?"":o,c=b.color,m=void 0===c?"black":c,g=b.testId,f=i.toString().length>2,u=r(t.badge,(e(s={},t["badge--oversized"],f),e(s,t["badge--black"],"black"===m),e(s,t["badge--white"],"white"===m),e(s,t["badge--blueberry"],"blueberry"===m),e(s,t["badge--banana"],"banana"===m),e(s,t["badge--cherry"],"cherry"===m),e(s,t["badge--kiwi"],"kiwi"===m),e(s,t["badge--neutral"],"neutral"===m),e(s,t["badge--plum"],"plum"===m),s),n);return a.createElement("span",{className:u,ref:l,"data-testid":g,"data-analyticsid":d.Badge},i)}));export default b;
 //# sourceMappingURL=index.js.map

package/components/Badge/styles.module.scss

@@ -1,41 +1,41 @@
-@import '../../scss/_palette.scss';
-
-.badge {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  font-size: 0.875rem;
-  font-weight: 600;
-  min-width: 1.375rem;
-  height: 1.375rem;
-  border-radius: 1rem;
-  padding: 0;
-  color: $white;
-  background-color: $black;
-
-  &--oversized {
-    padding: 0 0.25rem;
-  }
-  &--white {
-    color: $black;
-    background-color: $white;
-  }
-  &--blueberry {
-    background-color: $blueberry500;
-  }
-  &--banana {
-    background-color: $banana500;
-  }
-  &--cherry {
-    background-color: $cherry500;
-  }
-  &--kiwi {
-    background-color: $kiwi500;
-  }
-  &--neutral {
-    background-color: $neutral500;
-  }
-  &--plum {
-    background-color: $plum500;
-  }
-}
+@import '../../scss/_palette.scss';
+
+.badge {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 0.875rem;
+  font-weight: 600;
+  min-width: 1.375rem;
+  height: 1.375rem;
+  border-radius: 1rem;
+  padding: 0;
+  color: $white;
+  background-color: $black;
+
+  &--oversized {
+    padding: 0 0.25rem;
+  }
+  &--white {
+    color: $black;
+    background-color: $white;
+  }
+  &--blueberry {
+    background-color: $blueberry500;
+  }
+  &--banana {
+    background-color: $banana500;
+  }
+  &--cherry {
+    background-color: $cherry500;
+  }
+  &--kiwi {
+    background-color: $kiwi500;
+  }
+  &--neutral {
+    background-color: $neutral500;
+  }
+  &--plum {
+    background-color: $plum500;
+  }
+}

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

@@ -1,17 +1,17 @@
-export type Styles = {
-  badge: string;
-  'badge--banana': string;
-  'badge--blueberry': string;
-  'badge--cherry': string;
-  'badge--kiwi': string;
-  'badge--neutral': string;
-  'badge--oversized': string;
-  'badge--plum': string;
-  'badge--white': string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;
+export type Styles = {
+  badge: string;
+  'badge--banana': string;
+  'badge--blueberry': string;
+  'badge--cherry': string;
+  'badge--kiwi': string;
+  'badge--neutral': string;
+  'badge--oversized': string;
+  'badge--plum': string;
+  'badge--white': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/Button/Button.d.ts

@@ -1,40 +1,42 @@
-import React from 'react';
-import { HTMLButtonProps, HTMLAnchorProps } from '../../constants';
-export declare type ButtonIntents = 'primary' | 'warning' | 'danger';
-export declare type ButtonIntentsColors = 'blueberry' | 'banana' | 'cherry' | 'neutral' | 'white';
-export declare type ButtonTags = 'button' | 'a';
-export declare type ButtonVariants = 'fill' | 'outline' | 'borderless';
-interface IntentToColor {
-    primary: ButtonIntentsColors;
-    warning: ButtonIntentsColors;
-    danger: ButtonIntentsColors;
-}
-export declare const intentToColor: IntentToColor;
-export interface ButtonProps extends HTMLButtonProps, HTMLAnchorProps {
-    /** Sets the content of the button. */
-    children: React.ReactNode;
-    /** Adds custom classes to the element. */
-    className?: string;
-    /** Makes the button scale to full width of its parent element. */
-    fluid?: boolean;
-    /** Changes the intent of the button. Mostly changes the color profile. */
-    intent?: ButtonIntents;
-    /** Changes the color presentation for different backgrounds. */
-    inverted?: boolean;
-    /** Changes the underlying element of the button. */
-    htmlMarkup?: ButtonTags;
-    /** Changes the size of the button to large. */
-    large?: boolean;
-    /** Sets the button into a loading state displaying <Loader /> as content. */
-    loading?: boolean;
-    onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => void;
-    /** Changes the visual representation of the button. */
-    variant?: ButtonVariants;
-    /** Disables text wrapping and enables ellipsis. */
-    ellipsis?: boolean;
-    /** Sets the data-testid attribute. */
-    testId?: string;
-}
-declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
-export default Button;
+import React from 'react';
+import { HTMLButtonProps, HTMLAnchorProps } from '../../constants';
+export declare type ButtonIntents = 'primary' | 'warning' | 'danger';
+export declare type ButtonIntentsColors = 'blueberry' | 'banana' | 'cherry' | 'neutral' | 'white';
+export declare type ButtonTags = 'button' | 'a';
+export declare type ButtonVariants = 'fill' | 'outline' | 'borderless';
+interface IntentToColor {
+    primary: ButtonIntentsColors;
+    warning: ButtonIntentsColors;
+    danger: ButtonIntentsColors;
+}
+export declare const intentToColor: IntentToColor;
+export interface ButtonProps extends HTMLButtonProps, HTMLAnchorProps {
+    /** Gives a unique id to the button */
+    id?: string;
+    /** Sets the content of the button. */
+    children: React.ReactNode;
+    /** Adds custom classes to the element. */
+    className?: string;
+    /** Makes the button scale to full width of its parent element. */
+    fluid?: boolean;
+    /** Changes the intent of the button. Mostly changes the color profile. */
+    intent?: ButtonIntents;
+    /** Changes the color presentation for different backgrounds. */
+    inverted?: boolean;
+    /** Changes the underlying element of the button. */
+    htmlMarkup?: ButtonTags;
+    /** Changes the size of the button to large. */
+    large?: boolean;
+    /** Sets the button into a loading state displaying <Loader /> as content. */
+    loading?: boolean;
+    onClick?: (e?: React.MouseEvent<HTMLElement, MouseEvent>) => void;
+    /** Changes the visual representation of the button. */
+    variant?: ButtonVariants;
+    /** Disables text wrapping and enables ellipsis. */
+    ellipsis?: boolean;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement>>;
+export default Button;
 //# sourceMappingURL=Button.d.ts.map

package/components/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAe,MAAM,iBAAiB,CAAC;AAahF,oBAAY,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAC7D,oBAAY,mBAAmB,GAAG,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAC1F,oBAAY,UAAU,GAAG,QAAQ,GAAG,GAAG,CAAC;AACxC,oBAAY,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,YAAY,CAAC;AAE/D,UAAU,aAAa;IACrB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,OAAO,EAAE,mBAAmB,CAAC;IAC7B,MAAM,EAAE,mBAAmB,CAAC;CAC7B;AAED,eAAO,MAAM,aAAa,EAAE,aAI3B,CAAC;AAEF,MAAM,WAAW,WAAY,SAAQ,eAAe,EAAE,eAAe;IACnE,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oDAAoD;IACpD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,uDAAuD;IACvD,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAeD,QAAA,MAAM,MAAM,2GA0JV,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,eAAe,EAAe,MAAM,iBAAiB,CAAC;AAahF,oBAAY,aAAa,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,CAAC;AAC7D,oBAAY,mBAAmB,GAAG,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,CAAC;AAC1F,oBAAY,UAAU,GAAG,QAAQ,GAAG,GAAG,CAAC;AACxC,oBAAY,cAAc,GAAG,MAAM,GAAG,SAAS,GAAG,YAAY,CAAC;AAE/D,UAAU,aAAa;IACrB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,OAAO,EAAE,mBAAmB,CAAC;IAC7B,MAAM,EAAE,mBAAmB,CAAC;CAC7B;AAED,eAAO,MAAM,aAAa,EAAE,aAI3B,CAAC;AAEF,MAAM,WAAW,WAAY,SAAQ,eAAe,EAAE,eAAe;IACnE,sCAAsC;IACtC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,sCAAsC;IACtC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,kEAAkE;IAClE,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,0EAA0E;IAC1E,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,gEAAgE;IAChE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,oDAAoD;IACpD,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6EAA6E;IAC7E,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,EAAE,UAAU,CAAC,KAAK,IAAI,CAAC;IAClE,uDAAuD;IACvD,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAeD,QAAA,MAAM,MAAM,2GA6JV,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/components/Button/componentdata.json

@@ -1,5 +1,24 @@
 {
   "props": {
+    "id": {
+      "defaultValue": null,
+      "description": "Gives a unique id to the button",
+      "name": "id",
+      "parent": {
+        "fileName": "src/components/Button/Button.tsx",
+        "name": "ButtonProps"
+      },
+      "declarations": [
+        {
+          "fileName": "src/components/Button/Button.tsx",
+          "name": "ButtonProps"
+        }
+      ],
+      "required": false,
+      "type": {
+        "name": "string"
+      }
+    },
     "children": {
       "defaultValue": null,
       "description": "Sets the content of the button.",

package/components/Button/index.d.ts

@@ -1,4 +1,4 @@
-import Button from './Button';
-export * from './Button';
-export default Button;
+import Button from './Button';
+export * from './Button';
+export default Button;
 //# sourceMappingURL=index.d.ts.map

package/components/Button/index.js

@@ -1,2 +1,2 @@
-import{B as o}from"../../Button-d5147e38.js";export{B as default,i as intentToColor}from"../../Button-d5147e38.js";import"../../_rollupPluginBabelHelpers-b8ef6dd9.js";import"../../_tslib-51c8a283.js";import"react";import"../../constants-ad6c82db.js";import"../../color-a10c7892.js";import"../../index-0e78dfa0.js";import"../../palette-f206f488.js";import"../../grid-11a70eb7.js";import"../../Icon-89da8de4.js";import"../../Loader-fa16a352.js";import"../../index-9b84fabc.js";import"../../uuid-fe7442b7.js";import"../Loader/styles.module.scss";import"../../useHover-9710204a.js";import"../../useWindowSize-750f9b68.js";import"./styles.module.scss";
+import{B as o}from"../../Button-7e82091f.js";export{B as default,i as intentToColor}from"../../Button-7e82091f.js";import"../../_rollupPluginBabelHelpers-b8ef6dd9.js";import"../../_tslib-51c8a283.js";import"react";import"../../constants-eb74321e.js";import"../../color-a10c7892.js";import"../../index-0e78dfa0.js";import"../../palette-f206f488.js";import"../../grid-11a70eb7.js";import"../../Loader-bc13d060.js";import"../../index-9b84fabc.js";import"../../uuid-fe7442b7.js";import"../Loader/styles.module.scss";import"../../useHover-9710204a.js";import"../../useWindowSize-750f9b68.js";import"./styles.module.scss";
 //# sourceMappingURL=index.js.map