@helsenorge/designsystem-react 2.9.3 → 2.10.1

package/components/ListHeader/ListHeader.d.ts

@@ -0,0 +1,38 @@
+import React from 'react';
+import { AvatarProps, AvatarType } from '../Avatar';
+import { BadgeProps, BadgeType } from '../Badge';
+import { ListHeaderTextProps, ListHeaderTextType } from './ListHeaderText/ListHeaderText';
+import { SvgIcon } from '../Icons';
+export declare type ListHeaderSize = 'small' | 'medium' | 'large';
+export interface ListHeaderType extends React.ForwardRefExoticComponent<ListHeaderProps & React.RefAttributes<HTMLLIElement>> {
+    Avatar?: AvatarType;
+    Badge?: BadgeType;
+    ListHeaderText?: ListHeaderTextType;
+}
+export declare const renderListHeader: (element: React.ReactNode, chevronIcon: SvgIcon, isHovered: boolean, size: ListHeaderSize, icon?: React.ReactElement) => false | "" | 0 | JSX.Element | null | undefined;
+export interface ListHeaderProps {
+    /** Adds custom classes to the ListHeader element. */
+    className?: string;
+    /** Chevron to render inside of the ListHeader */
+    chevronIcon?: SvgIcon;
+    /** Children to be rendered inside of ListHeader */
+    children: React.ReactNode;
+    /** icon to be rendered inside of ListHeader */
+    icon?: React.ReactElement;
+    /** whether or not the parent is hovered */
+    isHovered?: boolean;
+    /** Changes size of the ListHeader. */
+    size?: ListHeaderSize;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const mapChildren: (children: React.ReactNode, isJsxChild?: boolean) => {
+    avatarChild?: AvatarProps | undefined;
+    listHeaderTextChildren: Array<ListHeaderTextProps>;
+    badgeChild?: BadgeProps | undefined;
+    stringChildren: Array<string>;
+    remainingChildren: Array<any>;
+};
+export declare const ListHeader: ListHeaderType;
+export default ListHeader;
+//# sourceMappingURL=ListHeader.d.ts.map

package/components/ListHeader/ListHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ListHeader/ListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAe,EAAE,WAAW,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAC5D,OAAc,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AACxD,OAAuB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAI1G,OAAa,EAAY,OAAO,EAAE,MAAM,UAAU,CAAC;AAGnD,oBAAY,cAAc,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAE1D,MAAM,WAAW,cAAe,SAAQ,KAAK,CAAC,yBAAyB,CAAC,eAAe,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;IAC3H,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,cAAc,CAAC,EAAE,kBAAkB,CAAC;CACrC;AAED,eAAO,MAAM,gBAAgB,YAClB,MAAM,SAAS,eACX,OAAO,aACT,OAAO,QACZ,cAAc,SACb,MAAM,YAAY,oDAc1B,CAAC;AAEF,MAAM,WAAW,eAAe;IAC9B,qDAAqD;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iDAAiD;IACjD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,mDAAmD;IACnD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,+CAA+C;IAC/C,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC;IAC1B,2CAA2C;IAC3C,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,sCAAsC;IACtC,IAAI,CAAC,EAAE,cAAc,CAAC;IACtB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,WAAW,aACZ,MAAM,SAAS;;4BAID,MAAM,mBAAmB,CAAC;;oBAElC,MAAM,MAAM,CAAC;uBACV,MAAM,GAAG,CAAC;CA+B9B,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,cAqEvB,CAAC;AAEH,eAAe,UAAU,CAAC"}

package/components/ListHeader/ListHeaderText/ListHeaderText.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { StatusDotVariant } from '../../StatusDot';
+export declare type ListHeaderTextType = React.ForwardRefExoticComponent<ListHeaderTextProps & React.RefAttributes<HTMLLIElement>>;
+export interface ListHeaderTextProps {
+    /** The first text in the ListHeaderText Component */
+    firstText: string;
+    /** Will style the first text as bold */
+    firstTextEmphasised?: boolean;
+    /** The second text in the ListHeaderText Component */
+    secondText?: string;
+    /** Will style the second text as bold */
+    secondTextEmphasised?: boolean;
+    /** Whether or not this ListHeaderText is a sub text */
+    subText?: boolean;
+    /** Decides the variant for the StatusDot */
+    statusDotVariant?: StatusDotVariant;
+    /** Adds custom classes to the ListHeaderText component. */
+    className?: string;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+export declare const ListHeaderText: ListHeaderTextType;
+export default ListHeaderText;
+//# sourceMappingURL=ListHeaderText.d.ts.map

package/components/ListHeader/ListHeaderText/ListHeaderText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListHeaderText.d.ts","sourceRoot":"","sources":["../../../../src/components/ListHeader/ListHeaderText/ListHeaderText.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAkB,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAI9D,oBAAY,kBAAkB,GAAG,KAAK,CAAC,yBAAyB,CAAC,mBAAmB,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC;AAE3H,MAAM,WAAW,mBAAmB;IAClC,qDAAqD;IACrD,SAAS,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,sDAAsD;IACtD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,yCAAyC;IACzC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,uDAAuD;IACvD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,4CAA4C;IAC5C,gBAAgB,CAAC,EAAE,gBAAgB,CAAC;IACpC,2DAA2D;IAC3D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,cAAc,EAAE,kBAmC3B,CAAC;AAEH,eAAe,cAAc,CAAC"}

package/components/ListHeader/ListHeaderText/componentdata.json

@@ -0,0 +1 @@
+{"props":{"firstText":{"defaultValue":null,"description":"The first text in the ListHeaderText Component","name":"firstText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":true,"type":{"name":"string"}},"firstTextEmphasised":{"defaultValue":null,"description":"Will style the first text as bold","name":"firstTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"secondText":{"defaultValue":null,"description":"The second text in the ListHeaderText Component","name":"secondText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"secondTextEmphasised":{"defaultValue":null,"description":"Will style the second text as bold","name":"secondTextEmphasised","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"subText":{"defaultValue":null,"description":"Whether or not this ListHeaderText is a sub text","name":"subText","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"boolean"}},"statusDotVariant":{"defaultValue":null,"description":"Decides the variant for the StatusDot","name":"statusDotVariant","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"enum","raw":"StatusDotVariant","value":[{"value":"\"info\"","description":"","fullComment":"","tags":{}},{"value":"\"warning\"","description":"","fullComment":"","tags":{}},{"value":"\"alert\"","description":"","fullComment":"","tags":{}},{"value":"\"cancelled\"","description":"","fullComment":"","tags":{}},{"value":"\"active\"","description":"","fullComment":"","tags":{}},{"value":"\"transparent\"","description":"","fullComment":"","tags":{}},{"value":"\"recurring\"","description":"","fullComment":"","tags":{}},{"value":"\"group\"","description":"","fullComment":"","tags":{}},{"value":"\"noaccess\"","description":"","fullComment":"","tags":{}}]}},"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeaderText component.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeaderText/ListHeaderText.tsx","name":"ListHeaderTextProps"}],"required":false,"type":{"name":"string"}}}}

package/components/ListHeader/ListHeaderText/index.d.ts

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

package/components/ListHeader/ListHeaderText/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/ListHeader/ListHeaderText/index.ts"],"names":[],"mappings":"AAAA,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,cAAc,kBAAkB,CAAC;AACjC,eAAe,cAAc,CAAC"}

package/components/ListHeader/ListHeaderText/index.js

@@ -0,0 +1,2 @@
+import"../../../ListHeaderText.js";import{L as n,L as q}from"../../../ListHeaderText.js";import"react";import"classnames";import"../../../StatusDot.js";import"../../StatusDot/styles.module.scss";import"../../../constants.js";import"../../Icons/Icon.js";import"../../../hooks/useUuid.js";import"../../../uuid.js";import"../../../utils/environment.js";import"../../Icons/Undo.js";import"../../../theme/currys/color.js";import"../../../theme/index.js";import"../../../theme/palette.js";import"../../../theme/spacers.js";import"../../../theme/grid.js";import"../../Icons/Group.js";import"../../Icons/NoAccess.js";import"../../../hooks/useBreakpoint.js";import"../styles.module.scss";export{n as ListHeaderText,q as default};
+//# sourceMappingURL=index.js.map

package/components/ListHeader/ListHeaderText/index.js.map

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

package/components/ListHeader/componentdata.json

@@ -0,0 +1 @@
+{"props":{"className":{"defaultValue":null,"description":"Adds custom classes to the ListHeader element.","name":"className","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}},"chevronIcon":{"defaultValue":null,"description":"Chevron to render inside of the ListHeader","name":"chevronIcon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"SvgIcon"}},"children":{"defaultValue":null,"description":"Children to be rendered inside of ListHeader","name":"children","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":true,"type":{"name":"ReactNode"}},"icon":{"defaultValue":null,"description":"icon to be rendered inside of ListHeader","name":"icon","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"ReactElement<any, string | JSXElementConstructor<any>>"}},"isHovered":{"defaultValue":null,"description":"whether or not the parent is hovered","name":"isHovered","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"boolean"}},"size":{"defaultValue":null,"description":"Changes size of the ListHeader.","name":"size","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"enum","raw":"ListHeaderSize","value":[{"value":"\"small\""},{"value":"\"medium\""},{"value":"\"large\""}]}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"},"declarations":[{"fileName":"src/components/ListHeader/ListHeader.tsx","name":"ListHeaderProps"}],"required":false,"type":{"name":"string"}}}}

package/components/ListHeader/index.d.ts

@@ -0,0 +1,5 @@
+import { ListHeader } from './ListHeader';
+export { ListHeaderText } from './ListHeaderText';
+export * from './ListHeader';
+export default ListHeader;
+//# sourceMappingURL=index.d.ts.map

package/components/ListHeader/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ListHeader/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,cAAc,cAAc,CAAC;AAC7B,eAAe,UAAU,CAAC"}

package/components/ListHeader/index.js

@@ -0,0 +1,2 @@
+import"../../ListHeader.js";import{L as z,L as A,m as B,r as D}from"../../ListHeader.js";import{L as F}from"../../ListHeaderText.js";import"react";import"classnames";import"../../Avatar.js";import"../Icons/Icon.js";import"../../constants.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../theme/palette.js";import"../../Badge.js";import"../Badge/styles.module.scss";import"./styles.module.scss";import"../../hooks/useBreakpoint.js";import"../../theme/grid.js";import"../../utils/component.js";import"../../StatusDot.js";import"../StatusDot/styles.module.scss";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/spacers.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";export{z as ListHeader,F as ListHeaderText,A as default,B as mapChildren,D as renderListHeader};
+//# sourceMappingURL=index.js.map

package/components/ListHeader/index.js.map

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

package/components/ListHeader/styles.module.scss

@@ -0,0 +1,150 @@
+@import '../../scss/_spacers.scss';
+@import '../../scss/_breakpoints.scss';
+@import '../../scss/_font-settings.scss';
+@import '../../scss/_palette.scss';
+
+.list-header {
+  display: flex;
+  width: 100%;
+  padding-right: getSpacer(2xs);
+  padding-left: getSpacer(2xs);
+  text-align: left;
+  align-items: center;
+
+  &--for-element-content {
+    align-content: flex-start;
+    padding-top: getSpacer(s);
+    padding-bottom: getSpacer(s);
+  }
+  &--top-align-content {
+    align-items: flex-start;
+  }
+
+  &__content {
+    border-bottom: 1px solid transparent;
+    display: flex;
+    align-items: center;
+    width: 100%;
+
+    &--string {
+      margin: getSpacer(xs) 0;
+      @media (min-width: map-get($grid-breakpoints, md)) {
+        margin: getSpacer(s) 0;
+      }
+    }
+    &--element {
+      display: flex;
+      align-items: flex-start;
+      flex-direction: column;
+    }
+    &--spacing {
+      margin-left: getSpacer(s);
+    }
+    :focus > &,
+    :focus-visible > & {
+      border-color: $black;
+    }
+  }
+
+  &__icon,
+  &__avatar {
+    display: flex;
+    align-items: center;
+
+    &--for-element-content {
+      &--medium {
+        height: $lineheight-size-sm;
+      }
+      &--large {
+        height: $lineheight-size-md;
+      }
+      @media (min-width: map-get($grid-breakpoints, md)) {
+        &--medium {
+          height: $lineheight-size-md;
+        }
+        &--large {
+          height: $lineheight-size-lg;
+        }
+      }
+    }
+  }
+
+  &__icon {
+    &--for-string-content {
+      margin: getSpacer(3xs) getSpacer(2xs) getSpacer(3xs) 0;
+      @media (min-width: map-get($grid-breakpoints, md)) {
+        margin: getSpacer(2xs) getSpacer(2xs) getSpacer(2xs) 0;
+      }
+    }
+    &--for-element-content {
+      margin: 0 getSpacer(2xs) 0 0;
+    }
+  }
+
+  &__avatar {
+    &--for-string-content {
+      margin: getSpacer(3xs) getSpacer(s) getSpacer(3xs) 0;
+      @media (min-width: map-get($grid-breakpoints, md)) {
+        margin: getSpacer(2xs) getSpacer(s) getSpacer(2xs) 0;
+      }
+    }
+    &--for-element-content {
+      margin: 0 getSpacer(s) 0 0;
+    }
+  }
+
+  &__chevron,
+  &__badge {
+    display: flex;
+    align-items: center;
+    padding-left: getSpacer(2xs);
+    &--for-string-content {
+      margin: getSpacer(3xs) 0 getSpacer(3xs) auto;
+      @media (min-width: map-get($grid-breakpoints, md)) {
+        margin: getSpacer(2xs) 0 getSpacer(2xs) auto;
+      }
+    }
+    &--right {
+      margin-left: auto;
+      margin-right: getSpacer(2xs);
+    }
+    //Height needs to be same as line-height
+    &--small {
+      height: $lineheight-size-xs;
+    }
+    &--medium {
+      height: $lineheight-size-sm;
+    }
+    &--large {
+      height: $lineheight-size-md;
+    }
+    @media (min-width: map-get($grid-breakpoints, md)) {
+      &--small {
+        height: $lineheight-size-sm;
+      }
+      &--medium {
+        height: $lineheight-size-md;
+      }
+      &--large {
+        height: $lineheight-size-lg;
+      }
+    }
+  }
+}
+
+.statusDot {
+  padding: 1rem;
+}
+.text-wrapper {
+  display: flex;
+  align-items: flex-start;
+  font-size: 20px;
+  font-weight: 400;
+
+  &--sub-level {
+    font-size: 18px;
+  }
+  &__text--emphasised {
+    font-weight: 600;
+  }
+}

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

@@ -0,0 +1,41 @@
+export type Styles = {
+  'list-header': string;
+  'list-header__avatar': string;
+  'list-header__avatar--for-element-content': string;
+  'list-header__avatar--for-element-content--large': string;
+  'list-header__avatar--for-element-content--medium': string;
+  'list-header__avatar--for-string-content': string;
+  'list-header__badge': string;
+  'list-header__badge--for-string-content': string;
+  'list-header__badge--large': string;
+  'list-header__badge--medium': string;
+  'list-header__badge--right': string;
+  'list-header__badge--small': string;
+  'list-header__chevron': string;
+  'list-header__chevron--for-string-content': string;
+  'list-header__chevron--large': string;
+  'list-header__chevron--medium': string;
+  'list-header__chevron--right': string;
+  'list-header__chevron--small': string;
+  'list-header__content': string;
+  'list-header__content--element': string;
+  'list-header__content--spacing': string;
+  'list-header__content--string': string;
+  'list-header__icon': string;
+  'list-header__icon--for-element-content': string;
+  'list-header__icon--for-element-content--large': string;
+  'list-header__icon--for-element-content--medium': string;
+  'list-header__icon--for-string-content': string;
+  'list-header--for-element-content': string;
+  'list-header--top-align-content': string;
+  statusDot: string;
+  'text-wrapper': string;
+  'text-wrapper__text--emphasised': string;
+  'text-wrapper--sub-level': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/components/NotificationPanel/styles.module.scss

@@ -10,13 +10,14 @@
   width: inherit;
 
   &--has-children {
-    padding: getSpacer(2xs) getSpacer(s) getSpacer(m) getSpacer(2xs);
+    padding: getSpacer(2xs) getSpacer(s) getSpacer(2xs) getSpacer(2xs);
     #{$panel}__icon {
       margin-top: getSpacer(2xs);
       margin-right: getSpacer(2xs);
     }
     #{$panel}__content {
       margin-top: getSpacer(s);
+      margin-bottom: getSpacer(s);
     }
     @media (min-width: map-get($grid-breakpoints, md)) {
       padding-left: getSpacer(s);

package/components/StatusDot/StatusDot.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StatusDot.d.ts","sourceRoot":"","sources":["../../../src/components/StatusDot/StatusDot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,oBAAY,gBAAgB;IAC1B,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,SAAS,cAAc;IACvB,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,SAAS,cAAc;IACvB,KAAK,UAAU;IACf,QAAQ,aAAa;CACtB;AAED,MAAM,WAAW,cAAc;IAC7B,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,OAAO,gBAAgB,CAAC;IACxC,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,MAAM,oFAyBV,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"StatusDot.d.ts","sourceRoot":"","sources":["../../../src/components/StatusDot/StatusDot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,oBAAY,gBAAgB;IAC1B,IAAI,SAAS;IACb,OAAO,YAAY;IACnB,KAAK,UAAU;IACf,SAAS,cAAc;IACvB,MAAM,WAAW;IACjB,WAAW,gBAAgB;IAC3B,SAAS,cAAc;IACvB,KAAK,UAAU;IACf,QAAQ,aAAa;CACtB;AAED,MAAM,WAAW,cAAc;IAC7B,wCAAwC;IACxC,OAAO,CAAC,EAAE,MAAM,OAAO,gBAAgB,CAAC;IACxC,gDAAgD;IAChD,IAAI,EAAE,MAAM,CAAC;IACb,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,QAAA,MAAM,MAAM,oFA2BV,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/components/StatusDot/index.js

@@ -1,2 +1,2 @@
-import r from"react";import c from"classnames";import s from"./styles.module.scss";import{IconSize as l,AnalyticsId as _}from"../../constants.js";import{Icon as n}from"../Icons/Icon.js";import v from"../Icons/Undo.js";import{getColor as I}from"../../theme/currys/color.js";import E from"../Icons/Group.js";import N from"../Icons/NoAccess.js";import"../../theme/grid.js";import"../../hooks/useBreakpoint.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";var X=(e=>(e.info="info",e.warning="warning",e.alert="alert",e.cancelled="cancelled",e.active="active",e.transparent="transparent",e.recurring="recurring",e.group="group",e.noaccess="noaccess",e))(X||{});const J=r.forwardRef(function(m,C){const{variant:o="info",text:i,className:p}=m,a=o==="recurring"||o==="group"||o==="noaccess",d=o==="cancelled",f=c(s.statusdot,{[s["statusdot--cancelled"]]:d},p),u=c(s.statusdot__dot,[a?s["statusdot__dot--icon"]:s[`statusdot__dot--${o}`]]),g=c(s.statusdot__label,{[s["statusdot__label--icon"]]:a});let t=null;return o==="recurring"?t=r.createElement(n,{size:l.XXSmall,svgIcon:v}):o==="group"?t=r.createElement(n,{size:l.XXSmall,svgIcon:E}):o==="noaccess"&&(t=r.createElement(n,{size:l.XXSmall,svgIcon:N,color:I("cherry",600)})),r.createElement("div",{className:f,"data-analyticsid":_.StatusDot},r.createElement("span",{className:u},t),r.createElement("span",{className:g},i))});export{X as StatusDotVariant,J as default};
+import"../../StatusDot.js";import{a as h,S as j}from"../../StatusDot.js";import"react";import"classnames";import"./styles.module.scss";import"../../constants.js";import"../Icons/Icon.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Undo.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../../hooks/useBreakpoint.js";export{h as StatusDotVariant,j as default};
 //# sourceMappingURL=index.js.map

package/components/StatusDot/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/StatusDot/StatusDot.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport statusDotStyles from './styles.module.scss';\nimport { AnalyticsId } from '../../constants';\nimport { Icon } from '../Icons/Icon';\nimport Undo from '../Icons/Undo';\nimport { getColor } from '../../theme/currys';\nimport Group from '../Icons/Group';\nimport NoAccess from '../Icons/NoAccess';\nimport { IconSize } from '../..';\n\nexport enum StatusDotVariant {\n  info = 'info',\n  warning = 'warning',\n  alert = 'alert',\n  cancelled = 'cancelled',\n  active = 'active',\n  transparent = 'transparent',\n  recurring = 'recurring',\n  group = 'group',\n  noaccess = 'noaccess',\n}\n\nexport interface StatusDotProps {\n  /** Visual variants for the statusdot */\n  variant?: keyof typeof StatusDotVariant;\n  /** Text placed to the right of the statusdot */\n  text: string;\n  /** Adds custom classes to the element. */\n  className?: string;\n}\n\nconst Spacer = React.forwardRef(function SpacerForwardedRef(props: StatusDotProps, ref: React.ForwardedRef<HTMLElement>) {\n  const { variant = StatusDotVariant.info, text, className } = props;\n  const hasIcon = variant === StatusDotVariant.recurring || variant === StatusDotVariant.group || variant === StatusDotVariant.noaccess;\n  const isCancelled = variant === StatusDotVariant.cancelled;\n  const statusDotClasses = classNames(statusDotStyles['statusdot'], { [statusDotStyles['statusdot--cancelled']]: isCancelled }, className);\n  const dotClasses = classNames(statusDotStyles['statusdot__dot'], [\n    hasIcon ? statusDotStyles[`statusdot__dot--icon`] : statusDotStyles[`statusdot__dot--${variant}`],\n  ]);\n  const labelClasses = classNames(statusDotStyles['statusdot__label'], { [statusDotStyles[`statusdot__label--icon`]]: hasIcon });\n  let svgIcon: JSX.Element | null = null;\n\n  if (variant === StatusDotVariant.recurring) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={Undo} />;\n  } else if (variant === StatusDotVariant.group) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={Group} />;\n  } else if (variant === StatusDotVariant.noaccess) {\n    svgIcon = <Icon size={IconSize.XXSmall} svgIcon={NoAccess} color={getColor('cherry', 600)} />;\n  }\n\n  return (\n    <div className={statusDotClasses} data-analyticsid={AnalyticsId.StatusDot}>\n      <span className={dotClasses}>{svgIcon}</span>\n      <span className={labelClasses}>{text}</span>\n    </div>\n  );\n});\n\nexport default Spacer;\n"],"names":["StatusDotVariant","Spacer","React","props","ref","variant","text","className","hasIcon","isCancelled","statusDotClasses","classNames","statusDotStyles","dotClasses","labelClasses","svgIcon","Icon","IconSize","Undo","Group","NoAccess","getColor","AnalyticsId"],"mappings":"0kBAaY,IAAAA,GAAAA,IACVA,EAAA,KAAO,OACPA,EAAA,QAAU,UACVA,EAAA,MAAQ,QACRA,EAAA,UAAY,YACZA,EAAA,OAAS,SACTA,EAAA,YAAc,cACdA,EAAA,UAAY,YACZA,EAAA,MAAQ,QACRA,EAAA,SAAW,WATDA,IAAAA,GAAA,CAAA,CAAA,EAqBZ,MAAMC,EAASC,EAAM,WAAW,SAA4BC,EAAuBC,EAAsC,CACvH,KAAM,CAAE,QAAAC,EAAU,OAAuB,KAAAC,EAAM,UAAAC,GAAcJ,EACvDK,EAAUH,IAAY,aAA8BA,IAAY,SAA0BA,IAAY,WACtGI,EAAcJ,IAAY,YAC1BK,EAAmBC,EAAWC,EAAgB,UAAc,CAAE,CAACA,EAAgB,yBAA0BH,CAAY,EAAGF,CAAS,EACjIM,EAAaF,EAAWC,EAAgB,eAAmB,CAC/DJ,EAAUI,EAAgB,wBAA0BA,EAAgB,mBAAmBP,IAAA,CACxF,EACKS,EAAeH,EAAWC,EAAgB,iBAAqB,CAAE,CAACA,EAAgB,2BAA4BJ,CAAS,CAAA,EAC7H,IAAIO,EAA8B,KAElC,OAAIV,IAAY,YACdU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASC,CAAA,CAAM,EAC9Cb,IAAY,QACrBU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASE,CAAA,CAAO,EAC/Cd,IAAY,aACrBU,EAAWb,EAAA,cAAAc,EAAA,CAAK,KAAMC,EAAS,QAAS,QAASG,EAAU,MAAOC,EAAS,SAAU,GAAG,CAAA,CAAG,GAI1FnB,EAAA,cAAA,MAAA,CAAI,UAAWQ,EAAkB,mBAAkBY,EAAY,SAAA,EAC7DpB,EAAA,cAAA,OAAA,CAAK,UAAWW,CAAa,EAAAE,CAAQ,EACrCb,EAAA,cAAA,OAAA,CAAK,UAAWY,CAAA,EAAeR,CAAK,CACvC,CAEJ,CAAC"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/StatusDot/styles.module.scss

@@ -1,6 +1,7 @@
 @import '../../scss/palette';
 @import '../../scss/spacers.scss';
 @import '../../scss/font-settings';
+@import '../../scss/screen-reader.scss';
 
 .statusdot {
   position: relative;

package/components/Validation/index.js

@@ -1,2 +1,2 @@
-import"../../Validation.js";import{V as J,V as K}from"../../Validation.js";import"react";import"classnames";import"../../FormGroup.js";import"../FormGroup/styles.module.scss";import"../../Checkbox.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"../Icons/Icon.js";import"../../constants.js";import"../../hooks/useUuid.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Checkbox/styles.module.scss";import"../../RadioButton.js";import"../RadioButton/styles.module.scss";import"../../Input.js";import"../../hooks/useBreakpoint.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../Input/styles.module.scss";import"../../Title.js";import"../Title/styles.module.scss";import"../../FormLayout.js";import"../FormLayout/styles.module.scss";import"../../Select.js";import"../Select/styles.module.scss";import"../Icons/ChevronDown.js";import"./styles.module.scss";export{J as Validation,K as default};
+import"../../Validation.js";import{V as K,V as L}from"../../Validation.js";import"react";import"classnames";import"../../FormGroup.js";import"../FormGroup/styles.module.scss";import"../../Checkbox.js";import"../../uuid.js";import"../../utils/environment.js";import"../Icons/Check.js";import"../Icons/Icon.js";import"../../constants.js";import"../../hooks/useUuid.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../theme/grid.js";import"../Checkbox/styles.module.scss";import"../../RadioButton.js";import"../RadioButton/styles.module.scss";import"../../Input.js";import"../../hooks/useBreakpoint.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../Input/styles.module.scss";import"../../Title.js";import"../Title/styles.module.scss";import"../../FormLayout.js";import"../FormLayout/styles.module.scss";import"../../Select.js";import"../Select/styles.module.scss";import"../Icons/ChevronDown.js";import"../../utils/component.js";import"./styles.module.scss";export{K as Validation,L as default};
 //# sourceMappingURL=index.js.map

package/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "description": "The official design system for Helsenorge built with React.",
   "homepage": "https://helsenorge.design",
-  "version": "2.9.3",
+  "version": "2.10.1",
   "author": "Helsenorge",
   "license": "MIT",
   "peerDependencies": {

package/utils/component.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const isComponent: <T>(element: {} | null | undefined, type: React.ForwardRefExoticComponent<T>) => element is React.ReactElement<T, string | React.JSXElementConstructor<any>>;
+//# sourceMappingURL=component.d.ts.map

package/utils/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/utils/component.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,eAAO,MAAM,WAAW,eACb,EAAE,GAAG,IAAI,GAAG,SAAS,0HAEwF,CAAC"}

package/utils/component.js

@@ -0,0 +1,2 @@
+import i from"react";const e=(o,t)=>i.isValidElement(o)&&o.type===t;export{e as isComponent};
+//# sourceMappingURL=component.js.map

package/utils/component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.js","sources":["../../src/utils/component.ts"],"sourcesContent":["import React from 'react';\n\nexport const isComponent = <T>(\n  element: {} | null | undefined,\n  type: React.ForwardRefExoticComponent<T>\n): element is React.ReactElement<T> => React.isValidElement<T>(element) && (element as React.ReactElement).type === type;\n"],"names":["isComponent","element","type","React"],"mappings":"qBAEa,MAAAA,EAAc,CACzBC,EACAC,IACqCC,EAAM,eAAkBF,CAAO,GAAMA,EAA+B,OAASC"}