@helsenorge/designsystem-react 3.1.5 → 4.1.0

package/components/RadioButton/styles.module.scss

@@ -26,12 +26,27 @@
     }
   }
 
-  &--with-error#{&}--bigform {
+  &--with-error#{&}__bigform {
     padding: getSpacer(m) getSpacer(m);
   }
 
-  &--bigform {
+  &__bigform {
     margin: getSpacer(2xs) 0 getSpacer(2xs) 0;
+
+    &--focused {
+      box-shadow: 0 0 0 getSpacer(3xs);
+      color: $neutral500;
+    }
+    &--focused#{&}--on-blueberry {
+      color: $blueberry500;
+    }
+
+    &--focused#{&}--selected {
+      color: $blueberry900;
+    }
+    &--focused#{&}--invalid {
+      color: $cherry400;
+    }
   }
 }
 
@@ -47,12 +62,8 @@
   display: flex;
   align-items: flex-start;
   cursor: pointer;
-  font-size: $font-size-sm;
   line-height: $lineheight-size-sm;
-
-  @media (min-width: map.get($grid-breakpoints, md)) {
-    font-size: $font-size-md;
-  }
+  color: $black;
 
   &--on-dark {
     color: $white;
@@ -64,28 +75,107 @@
 
   &--disabled {
     cursor: default;
-    color: $neutral400;
+    color: $neutral700;
   }
 
-  &--bigform {
+  &__bigform {
     padding: getSpacer(s);
     background-color: $neutral50;
-  }
 
-  &--bigform#{&}--on-blueberry {
-    background-color: $blueberry50;
+    &:hover {
+      background-color: $neutral100;
+    }
+
+    &--on-blueberry {
+      background-color: $white;
+
+      &:focus {
+        background-color: $white;
+      }
+
+      &:hover {
+        background-color: $blueberry100;
+      }
+    }
+
+    &--on-grey {
+      background-color: $white;
+
+      &:hover {
+        background-color: $neutral100;
+      }
+
+      &:focus {
+        background-color: $white;
+      }
+    }
   }
 
-  &--bigform#{&}--on-dark {
+  &__bigform#{&}--on-dark {
     background-color: $blueberry800;
   }
+  &__bigform#{&}--invalid {
+    background-color: $white;
+
+    &:hover {
+      background-color: $cherry100;
+    }
+  }
+  &__bigform#{&}__bigform--selected-invalid {
+    background-color: $cherry100;
+    color: $black;
+
+    &:hover {
+      background-color: $cherry200;
+    }
+  }
+
+  &__bigform#{&}__bigform--disabled {
+    background-color: $neutral50;
 
-  &--bigform#{&}--invalid {
+    &:hover {
+      background-color: $neutral50;
+    }
+
+    &:focus {
+      background-color: $neutral50;
+    }
+  }
+  &__bigform#{&}__bigform--on-grey {
     background-color: $white;
+
+    &:hover {
+      background-color: $neutral100;
+    }
+
+    &:focus {
+      background-color: $white;
+    }
+  }
+
+  &__bigform#{&}__bigform--on-blueberry {
+    background-color: $white;
+
+    &:hover {
+      background-color: $blueberry100;
+    }
+
+    &:focus {
+      background-color: $white;
+    }
+  }
+
+  &__bigform--selected {
+    background-color: $blueberry500;
+    color: $white;
+
+    &:hover {
+      background-color: $blueberry600;
+    }
   }
 
   @media (min-width: map.get($grid-breakpoints, md)) {
-    &--bigform {
+    &__bigform {
       padding: 1.68rem getSpacer(l);
     }
   }
@@ -105,14 +195,7 @@
   min-width: 1.5rem;
   color: $neutral700;
   box-shadow: 0 0 0 getSpacer(4xs);
-
-  &:checked {
-    color: $blueberry500;
-
-    &:hover {
-      background-color: $blueberry50;
-    }
-  }
+  outline: none;
 
   &:focus {
     box-shadow: 0 0 0 getSpacer(3xs);
@@ -129,6 +212,20 @@
     color: $black;
   }
 
+  &:checked {
+    color: $blueberry500;
+
+    &:hover {
+      box-shadow: 0 0 0 getSpacer(4xs);
+      background-color: $blueberry50;
+    }
+
+    &:focus {
+      box-shadow: 0 0 0 getSpacer(3xs);
+      color: $black;
+    }
+  }
+
   &--on-blueberry {
     color: $blueberry500;
 
@@ -145,12 +242,8 @@
       box-shadow: 0 0 0 getSpacer(3xs);
     }
 
-    &:checked {
-      color: $blueberry200;
-
-      &:hover {
-        background-color: $inverted-hover;
-      }
+    &:focus {
+      color: $white;
     }
 
     :active > & {
@@ -158,8 +251,16 @@
       color: $white;
     }
 
-    &:focus {
-      color: $white;
+    &:checked {
+      color: $blueberry200;
+
+      &:hover {
+        background-color: $inverted-hover;
+      }
+
+      &:focus {
+        color: $white;
+      }
     }
   }
 
@@ -170,14 +271,6 @@
       background-color: $cherry100;
     }
 
-    &:checked {
-      color: $cherry600;
-
-      &:hover {
-        background-color: $cherry100;
-      }
-    }
-
     &:active {
       color: $black;
     }
@@ -185,28 +278,41 @@
     &:focus {
       color: $black;
     }
-  }
-
-  &--disabled {
-    cursor: default;
-    color: $neutral400;
 
     &:checked {
-      color: $neutral400;
+      color: $cherry600;
 
       &:hover {
-        box-shadow: 0 0 0 getSpacer(4xs);
-        background-color: transparent;
+        background-color: $cherry100;
       }
     }
+  }
+
+  &--disabled {
+    cursor: default;
+    color: $neutral600;
+    background-color: $neutral50;
 
     &:hover {
       box-shadow: 0 0 0 getSpacer(4xs);
-      background-color: transparent;
+      background-color: $neutral50;
+    }
+
+    :hover > & {
+      background-color: $neutral50;
     }
 
     &:active {
-      color: $neutral400;
+      color: $neutral600;
+    }
+
+    &:checked {
+      color: $neutral600;
+
+      &:hover {
+        box-shadow: 0 0 0 getSpacer(4xs);
+        background-color: $neutral50;
+      }
     }
   }
 
@@ -215,8 +321,8 @@
     content: '';
     display: flex;
     background-color: $blueberry500;
-    width: 0.75rem;
-    height: 0.75rem;
+    width: 0.875rem;
+    height: 0.875rem;
     border-radius: 10rem;
   }
 
@@ -227,12 +333,82 @@
   &--disabled:checked::before {
     box-shadow: 0 0 0 0;
     background-color: $neutral400;
-    color: $neutral400;
+    color: $neutral600;
   }
 
   &--invalid:checked::before {
     background-color: $cherry600;
   }
+
+  &__bigform {
+    &:checked {
+      outline: none;
+      color: $blueberry100;
+    }
+
+    &:hover {
+      box-shadow: 0 0 0 getSpacer(3xs);
+    }
+
+    &:focus {
+      box-shadow: 0 0 0 getSpacer(3xs);
+      color: $black;
+    }
+
+    &:focus:checked {
+      color: $white;
+    }
+
+    &:checked::before {
+      background-color: $blueberry100;
+    }
+
+    &:checked:hover {
+      box-shadow: 0 0 0 getSpacer(4xs);
+      background-color: unset;
+    }
+
+    &:checked:hover:focus {
+      box-shadow: 0 0 0 getSpacer(3xs);
+      color: $white;
+    }
+
+    &--invalid {
+      &:checked {
+        color: $cherry500;
+      }
+
+      &:checked::before {
+        background-color: $cherry500;
+      }
+
+      &:checked:hover {
+        background-color: transparent;
+      }
+
+      &:checked:focus {
+        color: $black;
+      }
+
+      &:checked:focus:hover {
+        color: $black;
+      }
+    }
+
+    &--disabled {
+      &:hover {
+        box-shadow: 0 0 0 getSpacer(4xs);
+      }
+
+      &:focus {
+        box-shadow: 0 0 0 getSpacer(4xs);
+      }
+    }
+  }
+}
+
+.radiobutton-sublabel-wrapper {
+  padding-left: 2.7rem;
 }
 
 /******** RESET *********/

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

@@ -1,19 +1,31 @@
 export type Styles = {
   'radio-button': string;
+  'radio-button__bigform': string;
+  'radio-button__bigform--disabled': string;
+  'radio-button__bigform--invalid': string;
   'radio-button--disabled': string;
   'radio-button--invalid': string;
   'radio-button--on-blueberry': string;
   'radio-button--on-dark': string;
   'radio-button-errors': string;
   'radio-button-label': string;
-  'radio-button-label--bigform': string;
+  'radio-button-label__bigform': string;
+  'radio-button-label__bigform--disabled': string;
+  'radio-button-label__bigform--on-blueberry': string;
+  'radio-button-label__bigform--on-grey': string;
+  'radio-button-label__bigform--selected': string;
+  'radio-button-label__bigform--selected-invalid': string;
   'radio-button-label--disabled': string;
   'radio-button-label--invalid': string;
-  'radio-button-label--on-blueberry': string;
   'radio-button-label--on-dark': string;
   'radio-button-wrapper': string;
-  'radio-button-wrapper--bigform': string;
+  'radio-button-wrapper__bigform': string;
+  'radio-button-wrapper__bigform--focused': string;
+  'radio-button-wrapper__bigform--invalid': string;
+  'radio-button-wrapper__bigform--on-blueberry': string;
+  'radio-button-wrapper__bigform--selected': string;
   'radio-button-wrapper--with-error': string;
+  'radiobutton-sublabel-wrapper': string;
 };
 
 export type ClassNames = keyof Styles;

package/components/Select/Select.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FormMode } from '../../constants';
 type SelectConcept = 'normal' | 'transparent';
-export interface SelectProps extends Pick<React.SelectHTMLAttributes<HTMLSelectElement>, 'name' | 'disabled' | 'required' | 'value'> {
+export interface SelectProps extends Pick<React.SelectHTMLAttributes<HTMLSelectElement>, 'aria-describedby' | 'name' | 'disabled' | 'required' | 'value'> {
     /** Component shown after label */
     afterLabelChildren?: React.ReactNode;
     /** Sets the content of the select element. */
@@ -11,7 +11,7 @@ export interface SelectProps extends Pick<React.SelectHTMLAttributes<HTMLSelectE
     /** Changes the visuals of the component */
     concept?: SelectConcept;
     /** The label text above the select */
-    label?: string;
+    label?: React.ReactNode;
     /** Changes the visuals of the component */
     mode?: keyof typeof FormMode;
     /** Activates Error style for the select component - This is can be true while errorText is empty, when in a FormGroup */

package/components/Select/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAA2C,QAAQ,EAAY,MAAM,iBAAiB,CAAC;AAS9F,KAAK,aAAa,GAAG,QAAQ,GAAG,aAAa,CAAC;AAE9C,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;IAClI,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC,8CAA8C;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2CAA2C;IAC3C,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,sCAAsC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC7B,yHAAyH;IACzH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sFAAsF;IACtF,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC;AAaD,eAAO,MAAM,MAAM,uFA8EjB,CAAC;AAEH,eAAe,MAAM,CAAC"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAA2C,QAAQ,EAAY,MAAM,iBAAiB,CAAC;AAU9F,KAAK,aAAa,GAAG,QAAQ,GAAG,aAAa,CAAC;AAE9C,MAAM,WAAW,WACf,SAAQ,IAAI,CAAC,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,kBAAkB,GAAG,MAAM,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,CAAC;IAC5H,kCAAkC;IAClC,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACrC,8CAA8C;IAC9C,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,0CAA0C;IAC1C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2CAA2C;IAC3C,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,sCAAsC;IACtC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,2CAA2C;IAC3C,IAAI,CAAC,EAAE,MAAM,OAAO,QAAQ,CAAC;IAC7B,yHAAyH;IACzH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,kDAAkD;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sFAAsF;IACtF,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC;AAaD,eAAO,MAAM,MAAM,uFAqEjB,CAAC;AAEH,eAAe,MAAM,CAAC"}

package/components/Select/componentdata.json

@@ -1 +1 @@
-{"props":{"afterLabelChildren":{"defaultValue":null,"description":"Component shown after label","name":"afterLabelChildren","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"ReactNode"}},"children":{"defaultValue":null,"description":"Sets the content of the select element.","name":"children","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":true,"type":{"name":"ReactNode"}},"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"concept":{"defaultValue":null,"description":"Changes the visuals of the component","name":"concept","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"enum","raw":"SelectConcept","value":[{"value":"\"normal\""},{"value":"\"transparent\""}]}},"label":{"defaultValue":null,"description":"The label text above the select","name":"label","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"mode":{"defaultValue":null,"description":"Changes the visuals of the component","name":"mode","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"enum","raw":"\"onwhite\" | \"ongrey\" | \"onblueberry\" | \"ondark\" | \"oninvalid\"","value":[{"value":"\"onwhite\""},{"value":"\"ongrey\""},{"value":"\"onblueberry\""},{"value":"\"ondark\""},{"value":"\"oninvalid\""}]}},"error":{"defaultValue":null,"description":"Activates Error style for the select component - This is can be true while errorText is empty, when in a FormGroup","name":"error","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"boolean"}},"errorText":{"defaultValue":null,"description":"Error text to show above the component","name":"errorText","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"selectId":{"defaultValue":null,"description":"select id of the select element","name":"selectId","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"width":{"defaultValue":null,"description":"Width of select in characters (approximate)","name":"width","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"number"}},"defaultValue":{"defaultValue":null,"description":"Gives defaultvalue to the comp. Preferred over selected prop on option by react","name":"defaultValue","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string | number"}},"name":{"defaultValue":null,"description":"","name":"name","parent":{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"string"}},"disabled":{"defaultValue":null,"description":"","name":"disabled","parent":{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"required":{"defaultValue":null,"description":"","name":"required","parent":{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"value":{"defaultValue":null,"description":"","name":"value","parent":{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"s/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"string | number | readonly string[]"}}}}
+{"props":{"afterLabelChildren":{"defaultValue":null,"description":"Component shown after label","name":"afterLabelChildren","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"ReactNode"}},"children":{"defaultValue":null,"description":"Sets the content of the select element.","name":"children","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":true,"type":{"name":"ReactNode"}},"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"concept":{"defaultValue":null,"description":"Changes the visuals of the component","name":"concept","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"enum","raw":"SelectConcept","value":[{"value":"\"normal\""},{"value":"\"transparent\""}]}},"label":{"defaultValue":null,"description":"The label text above the select","name":"label","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"ReactNode"}},"mode":{"defaultValue":null,"description":"Changes the visuals of the component","name":"mode","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"enum","raw":"\"onwhite\" | \"ongrey\" | \"onblueberry\" | \"ondark\" | \"oninvalid\"","value":[{"value":"\"onwhite\""},{"value":"\"ongrey\""},{"value":"\"onblueberry\""},{"value":"\"ondark\""},{"value":"\"oninvalid\""}]}},"error":{"defaultValue":null,"description":"Activates Error style for the select component - This is can be true while errorText is empty, when in a FormGroup","name":"error","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"boolean"}},"errorText":{"defaultValue":null,"description":"Error text to show above the component","name":"errorText","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"selectId":{"defaultValue":null,"description":"select id of the select element","name":"selectId","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string"}},"width":{"defaultValue":null,"description":"Width of select in characters (approximate)","name":"width","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"number"}},"defaultValue":{"defaultValue":null,"description":"Gives defaultvalue to the comp. Preferred over selected prop on option by react","name":"defaultValue","parent":{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"},"declarations":[{"fileName":"src/components/Select/Select.tsx","name":"SelectProps"}],"required":false,"type":{"name":"string | number"}},"aria-describedby":{"defaultValue":null,"description":"Identifies the element (or elements) that describes the object.\n@see aria-labelledby","name":"aria-describedby","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"AriaAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"AriaAttributes"}],"required":false,"type":{"name":"string"}},"name":{"defaultValue":null,"description":"","name":"name","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"string"}},"disabled":{"defaultValue":null,"description":"","name":"disabled","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"required":{"defaultValue":null,"description":"","name":"required","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"boolean"}},"value":{"defaultValue":null,"description":"","name":"value","parent":{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"},"declarations":[{"fileName":"designsystem/node_modules/@types/react/index.d.ts","name":"SelectHTMLAttributes"}],"required":false,"type":{"name":"string | number | readonly string[]"}}}}

package/components/Select/index.js

@@ -1,2 +1,2 @@
-import{S as o}from"../../Select.js";import{a as k}from"../../Select.js";import"react";import"classnames";import"../../constants.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/grid.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../Icons/Icon.js";import"../Icons/ChevronDown.js";import"./styles.module.scss";export{k as Select,o as default};
+import{S as o}from"../../Select.js";import{a as F}from"../../Select.js";import"react";import"classnames";import"../../constants.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/currys/color.js";import"../../theme/index.js";import"../../theme/grid.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../ErrorWrapper.js";import"../ErrorWrapper/styles.module.scss";import"../Icons/Icon.js";import"../Icons/ChevronDown.js";import"../../Label.js";import"../../Spacer.js";import"../Spacer/styles.module.scss";import"../Label/styles.module.scss";import"../../utils/component.js";import"../../StatusDot.js";import"../../hooks/useBreakpoint.js";import"../Icons/Attachment.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../Icons/Undo.js";import"../StatusDot/styles.module.scss";import"./styles.module.scss";export{F as Select,o as default};
 //# sourceMappingURL=index.js.map

package/components/Select/styles.module.scss

@@ -7,28 +7,6 @@
 .select-wrapper {
   display: flex;
   flex-direction: column;
-
-  &__label-wrapper {
-    display: inline-flex;
-    align-items: center;
-    line-height: getSpacer(m);
-    font-size: $font-size-sm;
-    font-weight: 600;
-    padding-bottom: getSpacer(xs);
-
-    @media (min-width: map.get($grid-breakpoints, md)) {
-      line-height: getSpacer(l);
-      font-size: $font-size-md;
-    }
-
-    &--on-dark {
-      color: $white;
-    }
-  }
-
-  &__after-label-children {
-    padding-left: 0.75rem;
-  }
 }
 
 .select-inner-wrapper {

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

@@ -9,9 +9,6 @@ export type Styles = {
   'select-inner-wrapper--on-blueberry': string;
   'select-inner-wrapper--transparent': string;
   'select-wrapper': string;
-  'select-wrapper__after-label-children': string;
-  'select-wrapper__label-wrapper': string;
-  'select-wrapper__label-wrapper--on-dark': string;
 };
 
 export type ClassNames = keyof Styles;

package/components/ServiceMessage/ServiceMessage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ServiceMessage.d.ts","sourceRoot":"","sources":["../../../src/components/ServiceMessage/ServiceMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAWhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAUlD,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAIjE,MAAM,WAAW,mBAAmB;IAClC,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,6FAA6F;IAC7F,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yCAAyC;IACzC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iCAAiC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yCAAyC;IACzC,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AACD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAkIjD,CAAC;AAEF,eAAe,cAAc,CAAC"}
+{"version":3,"file":"ServiceMessage.d.ts","sourceRoot":"","sources":["../../../src/components/ServiceMessage/ServiceMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAWhD,OAAO,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAUlD,OAAO,EAAE,yBAAyB,EAAE,MAAM,sBAAsB,CAAC;AAIjE,MAAM,WAAW,mBAAmB;IAClC,+CAA+C;IAC/C,KAAK,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4EAA4E;IAC5E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,6FAA6F;IAC7F,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yCAAyC;IACzC,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,iDAAiD;IACjD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iCAAiC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,yCAAyC;IACzC,OAAO,CAAC,EAAE,yBAAyB,CAAC;IACpC,sCAAsC;IACtC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AACD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CAuIjD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/components/ServiceMessage/index.js

@@ -1,2 +1,2 @@
-import e,{useState as Q,useRef as u}from"react";import o from"classnames";import{useBreakpoint as V}from"../../hooks/useBreakpoint.js";import{useHover as _}from"../../hooks/useHover.js";import{useUuid as Y}from"../../hooks/useUuid.js";import{getColor as w}from"../../theme/currys/color.js";import{breakpoints as Z}from"../../theme/grid.js";import{palette as t}from"../../theme/palette.js";import{getAriaLabelAttributes as ee}from"../../utils/accessibility.js";import{Icon as a}from"../Icons/Icon.js";import{IconSize as v}from"../../constants.js";import se from"../Icons/CheckFill.js";import re from"../Icons/ChevronDown.js";import oe from"../Icons/ChevronUp.js";import te from"../Icons/ErrorSignFill.js";import ae from"../Icons/Forward.js";import ne from"../Icons/InfoSignFill.js";import ce from"../Icons/TriangleX.js";import S from"../Icons/X.js";import s from"./styles.module.scss";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/index.js";import"../../theme/spacers.js";const me=({label:E,dismissable:C=!0,onDismiss:h,info:g,extraInfo:b,urlTitle:N,url:k,target:z="_self",closeBtnText:d="fjern melding",first:I=!1,expanderOpenFromStart:y=!1,variant:r="alert",testId:x})=>{const n=!!g||!!b,F=n?"button":"span",c=V()<Z.lg?v.XSmall:v.Small,R=Y(),M=r==="alert"?"alert":"region",X=ee({label:E,id:R}),[m,$]=Q(y),A={info:e.createElement(a,{svgIcon:ne,color:t.blueberry700,hoverColor:t.blueberry700,size:c}),warn:e.createElement(a,{svgIcon:te,color:t.banana700,hoverColor:t.banana700,size:c}),alert:e.createElement(a,{svgIcon:ce,color:t.cherry700,hoverColor:t.cherry700,size:c}),success:e.createElement(a,{svgIcon:se,color:t.kiwi900,hoverColor:t.kiwi900,size:c})},T=o(s["service-message__top-row--container"],s["service-message__wrapper--inner"]),j=o(s["service-message__bottom-row__button"],s["service-message__bottom-row__close-button--top"]),B=()=>{const l=_(),{isHovered:f,hoverRef:i}=l,p=u(null),{isHovered:P}=_(p);return e.createElement("span",{className:T,ref:i},e.createElement("span",{className:s["service-message__icon--signal"]},A[r]),e.createElement("h1",{className:s["service-message__label"],id:R},E),n&&e.createElement("span",{className:s["service-message__icon--expander"]},e.createElement(a,{size:c,svgIcon:m?oe:re,isHovered:f})),!n&&C&&e.createElement("button",{ref:p,className:j,"aria-label":d,onClick:h},e.createElement(a,{size:c,svgIcon:S,color:w("blueberry",700),isHovered:P})))},L=()=>{n&&$(!m)},U=o(s["service-message__bottom-row__button"]),H=!!k&&!!N,O=o(s["service-message__bottom-row__button"]),W=o(s["service-message__bottom-row"],{[s["service-message__bottom-row--only-close-button"]]:!H}),q=()=>{const l=u(null),{isHovered:f}=_(l),i=u(null),{isHovered:p}=_(i);return e.createElement("div",{className:W},H&&e.createElement("a",{className:U,href:k,ref:l,target:z},N,e.createElement(a,{size:v.XSmall,svgIcon:ae,color:w("blueberry",700),isHovered:f})),C&&e.createElement("button",{ref:i,className:O,"aria-label":d,onClick:h},d,e.createElement(a,{size:v.XSmall,svgIcon:S,color:w("blueberry",700),isHovered:p})))},D=()=>e.createElement("span",{className:s["service-message__content"]},!!g&&e.createElement("span",{className:s["service-message__content__info"]},g),!!b&&e.createElement("span",{className:s["service-message__content__info--smaller"]},b),e.createElement(q,null)),G=o({[s[`service-message__wrapper--${r}`]]:r,[s[`service-message__wrapper--${r}--expanded`]]:m&&r}),J=o(s["service-message__wrapper--inner"],s["service-message__content__wrapper"]),K=o(s["service-message__wrapper"],s["service-message__wrapper__btn"],{[s["service-message__wrapper__btn--width"]]:n,[s[`service-message__wrapper__border--${r}`]]:r,[s["service-message__wrapper__btn--expanded"]]:m,[s["service-message__wrapper__btn--first"]]:I,[s["service-message__wrapper__btn--not-first"]]:!I});return e.createElement("div",{className:G,role:M,...X},e.createElement(F,{className:K,onClick:L,"aria-expanded":n&&m,"data-testid":x},e.createElement(B,null)),n&&m&&e.createElement("div",{className:s["service-message__content--spacing"]},e.createElement("div",{className:J},e.createElement(D,null))))},$e=me;export{$e as default};
+import e,{useState as V,useRef as f}from"react";import o from"classnames";import{useBreakpoint as Y}from"../../hooks/useBreakpoint.js";import{useHover as _}from"../../hooks/useHover.js";import{useUuid as Z}from"../../hooks/useUuid.js";import{getColor as w}from"../../theme/currys/color.js";import{breakpoints as ee}from"../../theme/grid.js";import{palette as t}from"../../theme/palette.js";import{getAriaLabelAttributes as se}from"../../utils/accessibility.js";import{Icon as a}from"../Icons/Icon.js";import{IconSize as v}from"../../constants.js";import re from"../Icons/CheckFill.js";import oe from"../Icons/ChevronDown.js";import te from"../Icons/ChevronUp.js";import ae from"../Icons/ErrorSignFill.js";import ne from"../Icons/Forward.js";import ce from"../Icons/InfoSignFill.js";import me from"../Icons/TriangleX.js";import S from"../Icons/X.js";import s from"./styles.module.scss";import"../../uuid.js";import"../../utils/environment.js";import"../../theme/index.js";import"../../theme/spacers.js";const le=({label:E,dismissable:C=!0,onDismiss:N,info:g,extraInfo:d,urlTitle:h,url:k,target:z="_self",closeBtnText:b="fjern melding",first:I=!1,expanderOpenFromStart:y=!1,variant:r="alert",testId:x})=>{const n=!!g||!!d,F=n?"button":"span",c=Y()<ee.lg?v.XSmall:v.Small,R=Z(),M=r==="alert"?"alert":"region",X=se({label:E,id:R}),[m,$]=V(y),A={info:e.createElement(a,{svgIcon:ce,color:t.blueberry700,hoverColor:t.blueberry700,size:c}),warn:e.createElement(a,{svgIcon:ae,color:t.banana700,hoverColor:t.banana700,size:c}),alert:e.createElement(a,{svgIcon:me,color:t.cherry700,hoverColor:t.cherry700,size:c}),success:e.createElement(a,{svgIcon:re,color:t.kiwi900,hoverColor:t.kiwi900,size:c})},B=o(s["service-message__top-row--container"],s["service-message__wrapper--inner"]),T=o(s["service-message__bottom-row__button"],s["service-message__bottom-row__close-button--top"]),j=()=>{const l=_(),{isHovered:u,hoverRef:i}=l,p=f(null),{isHovered:Q}=_(p);return e.createElement("span",{className:B,ref:i},e.createElement("span",{className:s["service-message__icon--signal"]},A[r]),e.createElement("h1",{className:s["service-message__label"],id:R},E),n&&e.createElement("span",{className:s["service-message__icon--expander"]},e.createElement(a,{size:c,svgIcon:m?te:oe,isHovered:u})),!n&&C&&e.createElement("button",{ref:p,className:T,"aria-label":b,onClick:N},e.createElement(a,{size:c,svgIcon:S,color:w("blueberry",700),isHovered:Q})))},L=()=>{n&&$(!m)},U=o(s["service-message__bottom-row__button"]),H=!!k&&!!h,O=o(s["service-message__bottom-row__button"]),W=o(s["service-message__bottom-row"],{[s["service-message__bottom-row--only-close-button"]]:!H}),q=()=>{const l=f(null),{isHovered:u}=_(l),i=f(null),{isHovered:p}=_(i);return e.createElement("div",{className:W},H&&e.createElement("a",{className:U,href:k,ref:l,target:z},h,e.createElement(a,{size:v.XSmall,svgIcon:ne,color:w("blueberry",700),isHovered:u})),C&&e.createElement("button",{ref:i,className:O,"aria-label":b,onClick:N},b,e.createElement(a,{size:v.XSmall,svgIcon:S,color:w("blueberry",700),isHovered:p})))},D=()=>e.createElement("span",{className:s["service-message__content"]},!!g&&e.createElement("span",{className:s["service-message__content__info"]},g),!!d&&e.createElement("span",{className:s["service-message__content__info--smaller"]},d),e.createElement(q,null)),G=o({[s[`service-message__outer-wrapper--${r}`]]:r}),J=o({[s[`service-message__wrapper--${r}`]]:r,[s[`service-message__wrapper--${r}--expanded`]]:m&&r}),K=o(s["service-message__wrapper--inner"],s["service-message__content__wrapper"]),P=o(s["service-message__wrapper"],s["service-message__wrapper__btn"],{[s["service-message__wrapper__btn--width"]]:n,[s[`service-message__wrapper__border--${r}`]]:r,[s["service-message__wrapper__btn--expanded"]]:m,[s["service-message__wrapper__btn--first"]]:I,[s["service-message__wrapper__btn--not-first"]]:!I});return e.createElement("div",{className:G},e.createElement("div",{className:J,role:M,...X},e.createElement(F,{className:P,onClick:L,"aria-expanded":n&&m,"data-testid":x},e.createElement(j,null)),n&&m&&e.createElement("div",{className:s["service-message__content--spacing"]},e.createElement("div",{className:K},e.createElement(D,null)))))},Ae=le;export{Ae as default};
 //# sourceMappingURL=index.js.map

package/components/ServiceMessage/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/ServiceMessage/ServiceMessage.tsx"],"sourcesContent":["import React, { useState, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { useUuid } from '../../hooks/useUuid';\nimport { getColor } from '../../theme/currys';\nimport { breakpoints } from '../../theme/grid';\nimport { palette } from '../../theme/palette';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\nimport { AnchorLinkTargets } from '../AnchorLink';\nimport Icon, { IconSize } from '../Icons';\nimport CheckFill from '../Icons/CheckFill';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ErrorSignFill from '../Icons/ErrorSignFill';\nimport Forward from '../Icons/Forward';\nimport InfoSignFill from '../Icons/InfoSignFill';\nimport TriangleX from '../Icons/TriangleX';\nimport X from '../Icons/X';\nimport { NotificationPanelVariants } from '../NotificationPanel';\n\nimport styles from './styles.module.scss';\n\nexport interface ServiceMessageProps {\n  /** Sets a label for the notification panel. */\n  label: string;\n  /** String displayed in service-message when expended*/\n  info?: string;\n  /** String displayed in service-message when expended, with a smaller font*/\n  extraInfo?: string;\n  /** function that runs on dismiss */\n  onDismiss?: () => void;\n  /** Allows for dismiss to be an option, also for ServiceMessage with only label as content */\n  dismissable?: boolean;\n  /** Makes expander be open from start. */\n  expanderOpenFromStart?: boolean;\n  /** Name that describes a url-link for the user*/\n  urlTitle?: string;\n  /** Url for further information*/\n  url?: string;\n  /** Sets target for the anchorlink to the url*/\n  target?: AnchorLinkTargets;\n  /** Text on close-button in service messages. */\n  closeBtnText?: string;\n  /** Changes the visual representation. */\n  variant?: NotificationPanelVariants;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** First of its type. Used to remove border-top */\n  first?: boolean;\n}\nconst ServiceMessage: React.FC<ServiceMessageProps> = ({\n  label,\n  dismissable = true,\n  onDismiss,\n  info,\n  extraInfo,\n  urlTitle,\n  url,\n  target = '_self',\n  closeBtnText = 'fjern melding',\n  first = false,\n  expanderOpenFromStart = false,\n  variant = 'alert',\n  testId,\n}: ServiceMessageProps) => {\n  const hasExpander = !!info || !!extraInfo;\n\n  const CustomTag = hasExpander ? 'button' : 'span';\n  const breakpoint = useBreakpoint();\n  const desktop = breakpoint < breakpoints.lg;\n  const iconSize = desktop ? IconSize.XSmall : IconSize.Small;\n  const uuid = useUuid();\n  const ariaRole = variant === 'alert' ? 'alert' : 'region';\n  const ariaLabelAttributes = getAriaLabelAttributes({ label, id: uuid });\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(expanderOpenFromStart);\n\n  const variantToIconMap = {\n    info: <Icon svgIcon={InfoSignFill} color={palette.blueberry700} hoverColor={palette.blueberry700} size={iconSize} />,\n    warn: <Icon svgIcon={ErrorSignFill} color={palette.banana700} hoverColor={palette.banana700} size={iconSize} />,\n    alert: <Icon svgIcon={TriangleX} color={palette.cherry700} hoverColor={palette.cherry700} size={iconSize} />,\n    success: <Icon svgIcon={CheckFill} color={palette.kiwi900} hoverColor={palette.kiwi900} size={iconSize} />,\n  };\n  const topTowClasses = classNames(styles['service-message__top-row--container'], styles['service-message__wrapper--inner']);\n  const topTowCloseButtonClasses = classNames(\n    styles['service-message__bottom-row__button'],\n    styles['service-message__bottom-row__close-button--top']\n  );\n  const TopRow = (): JSX.Element => {\n    const hoverRefObject = useHover<HTMLButtonElement>();\n    const { isHovered, hoverRef } = hoverRefObject;\n    const xRef = useRef<HTMLButtonElement>(null);\n    const { isHovered: xRefIsHovered } = useHover(xRef);\n    return (\n      <span className={topTowClasses} ref={hoverRef}>\n        <span className={styles['service-message__icon--signal']}>{variantToIconMap[variant]}</span>\n        <h1 className={styles['service-message__label']} id={uuid}>\n          {label}\n        </h1>\n        {hasExpander && (\n          <span className={styles['service-message__icon--expander']}>\n            <Icon size={iconSize} svgIcon={isExpanded ? ChevronUp : ChevronDown} isHovered={isHovered} />\n          </span>\n        )}\n        {!hasExpander && dismissable && (\n          <button ref={xRef} className={topTowCloseButtonClasses} aria-label={closeBtnText} onClick={onDismiss}>\n            <Icon size={iconSize} svgIcon={X} color={getColor('blueberry', 700)} isHovered={xRefIsHovered} />\n          </button>\n        )}\n      </span>\n    );\n  };\n  const tagClicked = (): void => {\n    hasExpander && setIsExpanded(!isExpanded);\n  };\n\n  const anchorlinkClasses = classNames(styles['service-message__bottom-row__button']);\n  const urlField = !!url && !!urlTitle;\n  const closeButtonClasses = classNames(styles['service-message__bottom-row__button']);\n  const bottomRowClasses = classNames(styles['service-message__bottom-row'], {\n    [styles['service-message__bottom-row--only-close-button']]: !urlField,\n  });\n  const ButtonRow = (): JSX.Element => {\n    const readMoreRef = useRef<HTMLAnchorElement>(null);\n    const { isHovered: readMoreHoverRefIsHovered } = useHover(readMoreRef);\n    const xRef = useRef<HTMLButtonElement>(null);\n    const { isHovered: xRefIsHovered } = useHover(xRef);\n    return (\n      <div className={bottomRowClasses}>\n        {urlField && (\n          <a className={anchorlinkClasses} href={url} ref={readMoreRef} target={target}>\n            {urlTitle}\n            <Icon size={IconSize.XSmall} svgIcon={Forward} color={getColor('blueberry', 700)} isHovered={readMoreHoverRefIsHovered} />\n          </a>\n        )}\n\n        {dismissable && (\n          <button ref={xRef} className={closeButtonClasses} aria-label={closeBtnText} onClick={onDismiss}>\n            {closeBtnText}\n            <Icon size={IconSize.XSmall} svgIcon={X} color={getColor('blueberry', 700)} isHovered={xRefIsHovered} />\n          </button>\n        )}\n      </div>\n    );\n  };\n  const Content = (): JSX.Element => {\n    return (\n      <span className={styles['service-message__content']}>\n        {!!info && <span className={styles['service-message__content__info']}>{info}</span>}\n        {!!extraInfo && <span className={styles['service-message__content__info--smaller']}>{extraInfo}</span>}\n        <ButtonRow />\n      </span>\n    );\n  };\n  const backgroundClass = classNames({\n    [styles[`service-message__wrapper--${variant}`]]: variant,\n    [styles[`service-message__wrapper--${variant}--expanded`]]: isExpanded && variant,\n  });\n  const contentWrapperClasses = classNames(styles['service-message__wrapper--inner'], styles['service-message__content__wrapper']);\n  const wrapperClasses = classNames(styles['service-message__wrapper'], styles['service-message__wrapper__btn'], {\n    [styles['service-message__wrapper__btn--width']]: hasExpander,\n    [styles[`service-message__wrapper__border--${variant}`]]: variant,\n    [styles['service-message__wrapper__btn--expanded']]: isExpanded,\n    [styles['service-message__wrapper__btn--first']]: first,\n    [styles['service-message__wrapper__btn--not-first']]: !first,\n  });\n  return (\n    <div className={backgroundClass} role={ariaRole} {...ariaLabelAttributes}>\n      <CustomTag className={wrapperClasses} onClick={tagClicked} aria-expanded={hasExpander && isExpanded} data-testid={testId}>\n        <TopRow />\n      </CustomTag>\n      {hasExpander && isExpanded && (\n        <div className={styles['service-message__content--spacing']}>\n          <div className={contentWrapperClasses}>\n            <Content />\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default ServiceMessage;\n"],"names":["ServiceMessage","label","dismissable","onDismiss","info","extraInfo","urlTitle","url","target","closeBtnText","first","expanderOpenFromStart","variant","testId","hasExpander","CustomTag","iconSize","useBreakpoint","breakpoints","IconSize","uuid","useUuid","ariaRole","ariaLabelAttributes","getAriaLabelAttributes","isExpanded","setIsExpanded","useState","variantToIconMap","React","Icon","InfoSignFill","palette","ErrorSignFill","TriangleX","CheckFill","topTowClasses","classNames","styles","topTowCloseButtonClasses","TopRow","hoverRefObject","useHover","isHovered","hoverRef","xRef","useRef","xRefIsHovered","ChevronUp","ChevronDown","X","getColor","tagClicked","anchorlinkClasses","urlField","closeButtonClasses","bottomRowClasses","ButtonRow","readMoreRef","readMoreHoverRefIsHovered","Forward","Content","backgroundClass","contentWrapperClasses","wrapperClasses","ServiceMessage$1"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/ServiceMessage/ServiceMessage.tsx"],"sourcesContent":["import React, { useState, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { useBreakpoint } from '../../hooks/useBreakpoint';\nimport { useHover } from '../../hooks/useHover';\nimport { useUuid } from '../../hooks/useUuid';\nimport { getColor } from '../../theme/currys';\nimport { breakpoints } from '../../theme/grid';\nimport { palette } from '../../theme/palette';\nimport { getAriaLabelAttributes } from '../../utils/accessibility';\nimport { AnchorLinkTargets } from '../AnchorLink';\nimport Icon, { IconSize } from '../Icons';\nimport CheckFill from '../Icons/CheckFill';\nimport ChevronDown from '../Icons/ChevronDown';\nimport ChevronUp from '../Icons/ChevronUp';\nimport ErrorSignFill from '../Icons/ErrorSignFill';\nimport Forward from '../Icons/Forward';\nimport InfoSignFill from '../Icons/InfoSignFill';\nimport TriangleX from '../Icons/TriangleX';\nimport X from '../Icons/X';\nimport { NotificationPanelVariants } from '../NotificationPanel';\n\nimport styles from './styles.module.scss';\n\nexport interface ServiceMessageProps {\n  /** Sets a label for the notification panel. */\n  label: string;\n  /** String displayed in service-message when expended*/\n  info?: string;\n  /** String displayed in service-message when expended, with a smaller font*/\n  extraInfo?: string;\n  /** function that runs on dismiss */\n  onDismiss?: () => void;\n  /** Allows for dismiss to be an option, also for ServiceMessage with only label as content */\n  dismissable?: boolean;\n  /** Makes expander be open from start. */\n  expanderOpenFromStart?: boolean;\n  /** Name that describes a url-link for the user*/\n  urlTitle?: string;\n  /** Url for further information*/\n  url?: string;\n  /** Sets target for the anchorlink to the url*/\n  target?: AnchorLinkTargets;\n  /** Text on close-button in service messages. */\n  closeBtnText?: string;\n  /** Changes the visual representation. */\n  variant?: NotificationPanelVariants;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** First of its type. Used to remove border-top */\n  first?: boolean;\n}\nconst ServiceMessage: React.FC<ServiceMessageProps> = ({\n  label,\n  dismissable = true,\n  onDismiss,\n  info,\n  extraInfo,\n  urlTitle,\n  url,\n  target = '_self',\n  closeBtnText = 'fjern melding',\n  first = false,\n  expanderOpenFromStart = false,\n  variant = 'alert',\n  testId,\n}: ServiceMessageProps) => {\n  const hasExpander = !!info || !!extraInfo;\n\n  const CustomTag = hasExpander ? 'button' : 'span';\n  const breakpoint = useBreakpoint();\n  const desktop = breakpoint < breakpoints.lg;\n  const iconSize = desktop ? IconSize.XSmall : IconSize.Small;\n  const uuid = useUuid();\n  const ariaRole = variant === 'alert' ? 'alert' : 'region';\n  const ariaLabelAttributes = getAriaLabelAttributes({ label, id: uuid });\n\n  const [isExpanded, setIsExpanded] = useState<boolean>(expanderOpenFromStart);\n\n  const variantToIconMap = {\n    info: <Icon svgIcon={InfoSignFill} color={palette.blueberry700} hoverColor={palette.blueberry700} size={iconSize} />,\n    warn: <Icon svgIcon={ErrorSignFill} color={palette.banana700} hoverColor={palette.banana700} size={iconSize} />,\n    alert: <Icon svgIcon={TriangleX} color={palette.cherry700} hoverColor={palette.cherry700} size={iconSize} />,\n    success: <Icon svgIcon={CheckFill} color={palette.kiwi900} hoverColor={palette.kiwi900} size={iconSize} />,\n  };\n  const topTowClasses = classNames(styles['service-message__top-row--container'], styles['service-message__wrapper--inner']);\n  const topTowCloseButtonClasses = classNames(\n    styles['service-message__bottom-row__button'],\n    styles['service-message__bottom-row__close-button--top']\n  );\n  const TopRow = (): JSX.Element => {\n    const hoverRefObject = useHover<HTMLButtonElement>();\n    const { isHovered, hoverRef } = hoverRefObject;\n    const xRef = useRef<HTMLButtonElement>(null);\n    const { isHovered: xRefIsHovered } = useHover(xRef);\n    return (\n      <span className={topTowClasses} ref={hoverRef}>\n        <span className={styles['service-message__icon--signal']}>{variantToIconMap[variant]}</span>\n        <h1 className={styles['service-message__label']} id={uuid}>\n          {label}\n        </h1>\n        {hasExpander && (\n          <span className={styles['service-message__icon--expander']}>\n            <Icon size={iconSize} svgIcon={isExpanded ? ChevronUp : ChevronDown} isHovered={isHovered} />\n          </span>\n        )}\n        {!hasExpander && dismissable && (\n          <button ref={xRef} className={topTowCloseButtonClasses} aria-label={closeBtnText} onClick={onDismiss}>\n            <Icon size={iconSize} svgIcon={X} color={getColor('blueberry', 700)} isHovered={xRefIsHovered} />\n          </button>\n        )}\n      </span>\n    );\n  };\n  const tagClicked = (): void => {\n    hasExpander && setIsExpanded(!isExpanded);\n  };\n\n  const anchorlinkClasses = classNames(styles['service-message__bottom-row__button']);\n  const urlField = !!url && !!urlTitle;\n  const closeButtonClasses = classNames(styles['service-message__bottom-row__button']);\n  const bottomRowClasses = classNames(styles['service-message__bottom-row'], {\n    [styles['service-message__bottom-row--only-close-button']]: !urlField,\n  });\n  const ButtonRow = (): JSX.Element => {\n    const readMoreRef = useRef<HTMLAnchorElement>(null);\n    const { isHovered: readMoreHoverRefIsHovered } = useHover(readMoreRef);\n    const xRef = useRef<HTMLButtonElement>(null);\n    const { isHovered: xRefIsHovered } = useHover(xRef);\n    return (\n      <div className={bottomRowClasses}>\n        {urlField && (\n          <a className={anchorlinkClasses} href={url} ref={readMoreRef} target={target}>\n            {urlTitle}\n            <Icon size={IconSize.XSmall} svgIcon={Forward} color={getColor('blueberry', 700)} isHovered={readMoreHoverRefIsHovered} />\n          </a>\n        )}\n\n        {dismissable && (\n          <button ref={xRef} className={closeButtonClasses} aria-label={closeBtnText} onClick={onDismiss}>\n            {closeBtnText}\n            <Icon size={IconSize.XSmall} svgIcon={X} color={getColor('blueberry', 700)} isHovered={xRefIsHovered} />\n          </button>\n        )}\n      </div>\n    );\n  };\n  const Content = (): JSX.Element => {\n    return (\n      <span className={styles['service-message__content']}>\n        {!!info && <span className={styles['service-message__content__info']}>{info}</span>}\n        {!!extraInfo && <span className={styles['service-message__content__info--smaller']}>{extraInfo}</span>}\n        <ButtonRow />\n      </span>\n    );\n  };\n  const outerBackgroundClass = classNames({\n    [styles[`service-message__outer-wrapper--${variant}`]]: variant,\n  });\n  const backgroundClass = classNames({\n    [styles[`service-message__wrapper--${variant}`]]: variant,\n    [styles[`service-message__wrapper--${variant}--expanded`]]: isExpanded && variant,\n  });\n  const contentWrapperClasses = classNames(styles['service-message__wrapper--inner'], styles['service-message__content__wrapper']);\n  const wrapperClasses = classNames(styles['service-message__wrapper'], styles['service-message__wrapper__btn'], {\n    [styles['service-message__wrapper__btn--width']]: hasExpander,\n    [styles[`service-message__wrapper__border--${variant}`]]: variant,\n    [styles['service-message__wrapper__btn--expanded']]: isExpanded,\n    [styles['service-message__wrapper__btn--first']]: first,\n    [styles['service-message__wrapper__btn--not-first']]: !first,\n  });\n  return (\n    <div className={outerBackgroundClass}>\n      <div className={backgroundClass} role={ariaRole} {...ariaLabelAttributes}>\n        <CustomTag className={wrapperClasses} onClick={tagClicked} aria-expanded={hasExpander && isExpanded} data-testid={testId}>\n          <TopRow />\n        </CustomTag>\n        {hasExpander && isExpanded && (\n          <div className={styles['service-message__content--spacing']}>\n            <div className={contentWrapperClasses}>\n              <Content />\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default ServiceMessage;\n"],"names":["ServiceMessage","label","dismissable","onDismiss","info","extraInfo","urlTitle","url","target","closeBtnText","first","expanderOpenFromStart","variant","testId","hasExpander","CustomTag","iconSize","useBreakpoint","breakpoints","IconSize","uuid","useUuid","ariaRole","ariaLabelAttributes","getAriaLabelAttributes","isExpanded","setIsExpanded","useState","variantToIconMap","React","Icon","InfoSignFill","palette","ErrorSignFill","TriangleX","CheckFill","topTowClasses","classNames","styles","topTowCloseButtonClasses","TopRow","hoverRefObject","useHover","isHovered","hoverRef","xRef","useRef","xRefIsHovered","ChevronUp","ChevronDown","X","getColor","tagClicked","anchorlinkClasses","urlField","closeButtonClasses","bottomRowClasses","ButtonRow","readMoreRef","readMoreHoverRefIsHovered","Forward","Content","outerBackgroundClass","backgroundClass","contentWrapperClasses","wrapperClasses","ServiceMessage$1"],"mappings":"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"}