@helsenorge/designsystem-react 5.2.0 → 5.3.0

package/components/Panel/Panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Panel.d.ts","sourceRoot":"","sources":["../../../src/components/Panel/Panel.tsx"],"names":[],"mappings":"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"}

package/components/Panel/componentdata.json

@@ -1 +1 @@
-{"props":{"title":{"defaultValue":null,"description":"Title of the panel","name":"title","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"titleHtmlMarkup":{"defaultValue":null,"description":"Changes the underlying element of the title. Default: h2","name":"titleHtmlMarkup","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"TitleTags","value":[{"value":"\"h1\""},{"value":"\"h2\""},{"value":"\"h3\""},{"value":"\"h4\""},{"value":"\"h5\""},{"value":"\"span\""}]}},"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute.","name":"testId","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"status":{"defaultValue":null,"description":"Displays a status on the left side: defualt normal","name":"status","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"normal\" | \"new\" | \"error\" | \"draft\"","value":[{"value":"\"normal\""},{"value":"\"new\""},{"value":"\"error\""},{"value":"\"draft\""}]}},"statusMessage":{"defaultValue":null,"description":"Displayed on top of the panel with a status icon","name":"statusMessage","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"variant":{"defaultValue":null,"description":"Changes the visual representation of the panel.","name":"variant","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"fill\" | \"white\" | \"stroke\" | \"line\"","value":[{"value":"\"fill\""},{"value":"\"white\""},{"value":"\"stroke\""},{"value":"\"line\""}]}},"url":{"defaultValue":null,"description":"Url to details, renders as a button with anchor tag","name":"url","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"target":{"defaultValue":null,"description":"target used in the button: default is _self","name":"target","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"AnchorTarget","value":[{"value":"\"_self\""},{"value":"\"_blank\""},{"value":"\"_parent\""},{"value":"\"_top\""}]}},"icon":{"defaultValue":null,"description":"Icon displayed in title","name":"icon","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"iconRight":{"defaultValue":null,"description":"Display icon on right","name":"iconRight","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"contentA":{"defaultValue":null,"description":"Panel section A content","name":"contentA","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"contentB":{"defaultValue":null,"description":"Panel section B content","name":"contentB","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"prioritiseMetaDataInContentB":{"defaultValue":null,"description":"A version of panel that prioritises content-B visually and audibly","name":"prioritiseMetaDataInContentB","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"buttonText":{"defaultValue":null,"description":"Panel button text","name":"buttonText","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonTextClose":{"defaultValue":null,"description":"Panel button close text","name":"buttonTextClose","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonHtmlMarkup":{"defaultValue":null,"description":"HTML markup for panel button. Default: a","name":"buttonHtmlMarkup","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"ButtonTags","value":[{"value":"\"button\""},{"value":"\"a\""}]}},"buttonOnClick":{"defaultValue":null,"description":"Callback when panel button is clicked","name":"buttonOnClick","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"((e?: MouseEvent<HTMLElement, MouseEvent> | FormEvent<{}> | KeyboardEvent<HTMLUListElement> | null) => void)"}},"buttonAriaLabelledById":{"defaultValue":null,"description":"Panel button is aria-labelledby the text in the button itself + the element set in buttonAriaLabelledById. Default: auto-generated id for title (if title is set).","name":"buttonAriaLabelledById","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonAriaLabel":{"defaultValue":null,"description":"Panel button aria label","name":"buttonAriaLabel","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"showCloseButtonInExpand":{"defaultValue":null,"description":"@deprecated Has no effect anymore due to accessbility reasons. No close button is shown in expanded content. Will be removed in 2.0.0","name":"showCloseButtonInExpand","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"layout":{"defaultValue":null,"description":"Layout (see description)","name":"layout","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"layout1\" | \"layout2\" | \"layout3a\" | \"layout3b\" | \"layout3c\"","value":[{"value":"\"layout1\""},{"value":"\"layout2\""},{"value":"\"layout3a\""},{"value":"\"layout3b\""},{"value":"\"layout3c\""}]}},"containerAsButton":{"defaultValue":null,"description":"Clicking anywhere on the container will trigger a click on the panel's button","name":"containerAsButton","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"time":{"defaultValue":null,"description":"Displays time with icon","name":"time","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"date":{"defaultValue":null,"description":"Displays date with icon","name":"date","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"noTopBorder":{"defaultValue":null,"description":"Removes top border when variant is \"line\"","name":"noTopBorder","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"expanded":{"defaultValue":null,"description":"Opens or closes the panel","name":"expanded","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"onExpand":{"defaultValue":null,"description":"Called when panel is open/closed.","name":"onExpand","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"((isExpanded: boolean) => void)"}},"renderChildrenWhenClosed":{"defaultValue":null,"description":"Whether to render children when closed (in which case they are hidden with CSS). Default: false","name":"renderChildrenWhenClosed","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"focusable":{"defaultValue":null,"description":"Whether panel is focusable or not","name":"focusable","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}}}}
+{"props":{"className":{"defaultValue":null,"description":"Adds custom classes to the element.","name":"className","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"contentA":{"defaultValue":null,"description":"Panel section A content","name":"contentA","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"contentB":{"defaultValue":null,"description":"Panel section B content","name":"contentB","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"contentHeader":{"defaultValue":null,"description":"Content for a container that renders above A and B regardless of layout","name":"contentHeader","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"containerAsButton":{"defaultValue":null,"description":"Container acts as a button, clicking anywhere triggers a panel button click","name":"containerAsButton","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"children":{"defaultValue":null,"description":"Panel children","name":"children","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"date":{"defaultValue":null,"description":"Displays date with icon","name":"date","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"expanded":{"defaultValue":null,"description":"Expands or collapses the panel","name":"expanded","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"focusable":{"defaultValue":null,"description":"Whether the panel can be focused","name":"focusable","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"icon":{"defaultValue":null,"description":"Icon displayed in title","name":"icon","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"ReactNode"}},"buttonText":{"defaultValue":null,"description":"Panel button text","name":"buttonText","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonTextClose":{"defaultValue":null,"description":"Panel button close text","name":"buttonTextClose","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonHtmlMarkup":{"defaultValue":null,"description":"HTML markup for panel button. Default: a","name":"buttonHtmlMarkup","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"ButtonTags","value":[{"value":"\"button\""},{"value":"\"a\""}]}},"buttonOnClick":{"defaultValue":null,"description":"Callback when the panel button is clicked","name":"buttonOnClick","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"((e?: MouseEvent<HTMLElement, MouseEvent> | FormEvent<{}> | KeyboardEvent<HTMLUListElement> | null) => void)"}},"buttonAriaLabelledById":{"defaultValue":null,"description":"Panel button is aria-labelledby the text in the button itself + the element set in buttonAriaLabelledById. Default: auto-generated id for title (if title is set).","name":"buttonAriaLabelledById","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"buttonAriaLabel":{"defaultValue":null,"description":"Panel button aria label","name":"buttonAriaLabel","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"layout":{"defaultValue":null,"description":"Layout of the panel","name":"layout","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"layout1\" | \"layout2\" | \"layout3a\" | \"layout3b\" | \"layout3c\"","value":[{"value":"\"layout1\""},{"value":"\"layout2\""},{"value":"\"layout3a\""},{"value":"\"layout3b\""},{"value":"\"layout3c\""}]}},"noTopBorder":{"defaultValue":null,"description":"Removes top border when variant is \"line\"","name":"noTopBorder","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"onExpand":{"defaultValue":null,"description":"Called when the panel is opened/closed","name":"onExpand","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"((isExpanded: boolean) => void)"}},"renderChildrenWhenClosed":{"defaultValue":null,"description":"Whether to render children when closed (in which case they are hidden with CSS). Default: false","name":"renderChildrenWhenClosed","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}},"status":{"defaultValue":null,"description":"Displays a status on the left side: default normal","name":"status","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"normal\" | \"new\" | \"error\" | \"draft\"","value":[{"value":"\"normal\""},{"value":"\"new\""},{"value":"\"error\""},{"value":"\"draft\""}]}},"statusMessage":{"defaultValue":null,"description":"Displayed on top of the panel with a status icon","name":"statusMessage","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"testId":{"defaultValue":null,"description":"Sets the data-testid attribute for testing purposes","name":"testId","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"time":{"defaultValue":null,"description":"Displays time with icon","name":"time","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"title":{"defaultValue":null,"description":"Title of the panel","name":"title","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"titleHtmlMarkup":{"defaultValue":null,"description":"Changes the underlying element of the title. Default: h2","name":"titleHtmlMarkup","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"TitleTags","value":[{"value":"\"h1\""},{"value":"\"h2\""},{"value":"\"h3\""},{"value":"\"h4\""},{"value":"\"h5\""},{"value":"\"span\""}]}},"variant":{"defaultValue":null,"description":"Changes the visual representation of the panel","name":"variant","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"\"fill\" | \"white\" | \"stroke\" | \"line\"","value":[{"value":"\"fill\""},{"value":"\"white\""},{"value":"\"stroke\""},{"value":"\"line\""}]}},"url":{"defaultValue":null,"description":"URL to details, renders as a button with anchor tag","name":"url","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"string"}},"target":{"defaultValue":null,"description":"target used in the button: default is _self","name":"target","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"enum","raw":"AnchorTarget","value":[{"value":"\"_self\""},{"value":"\"_blank\""},{"value":"\"_parent\""},{"value":"\"_top\""}]}},"showCloseButtonInExpand":{"defaultValue":null,"description":"@deprecated Has no effect anymore due to accessibility reasons. No close button is shown in expanded content. Will be removed in 2.0.0","name":"showCloseButtonInExpand","parent":{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"},"declarations":[{"fileName":"src/components/Panel/Panel.tsx","name":"PanelProps"}],"required":false,"type":{"name":"boolean"}}}}

package/components/Panel/styles.module.scss

@@ -4,11 +4,6 @@
 @import '../../scss/palette';
 @import '../../scss/font-settings';
 
-.panel-wrapper {
-  width: 100%;
-  outline: none;
-}
-
 @mixin panel-padding {
   padding: getSpacer(s) getSpacer(s) getSpacer(s) getSpacer(s);
 
@@ -35,161 +30,186 @@
   }
 }
 
+$layout-sm-gap: getSpacer(s);
+$layout-md-col-gap: getSpacer(m);
+
+.panel-wrapper {
+  width: 100%;
+  outline: none;
+}
+
 .panel {
   @include panel-padding;
 
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
   outline: none;
   position: relative;
   width: 100%;
   box-sizing: border-box;
 
-  &__container {
+  &__layout-1,
+  &__layout-2,
+  &__layout-3 {
+    display: grid;
+    grid-auto-rows: auto;
+    grid-template-columns: 1fr;
+    gap: $layout-sm-gap $layout-sm-gap;
+    width: 100%;
+
     @media (min-width: map.get($grid-breakpoints, md)) {
-      display: flex;
-      flex-direction: row;
-      flex: 1;
+      column-gap: $layout-md-col-gap;
     }
+  }
 
-    &--prioritiseMetaDataInContentB,
-    &--layout3 {
-      @media (min-width: map.get($grid-breakpoints, lg)) {
-        display: flex;
-        flex-direction: row;
-      }
+  &__layout-1 {
+    &--with-icon {
+      grid-template-columns: auto 1fr;
     }
-    &--layout2#{&}--prioritiseMetaDataInContentB {
-      @media (min-width: map.get($grid-breakpoints, md)) {
-        display: flex;
-        flex-direction: row;
+
+    @media (min-width: map.get($grid-breakpoints, md)) {
+      grid-template-rows: auto auto;
+      grid-template-columns: 1fr auto;
+
+      &--with-icon {
+        grid-template-columns: auto 1fr auto;
       }
-    }
-    &--layout1#{&}--prioritiseMetaDataInContentB {
-      @media (min-width: map.get($grid-breakpoints, lg)) {
-        display: block;
+
+      &__content-a {
+        grid-column: span 2;
       }
     }
+  }
 
-    &--grow {
-      flex: 1;
+  &__layout-2 {
+    &--with-icon {
+      grid-template-columns: auto 1fr;
     }
-  }
 
-  &--with-icon {
-    display: flex;
-    flex-direction: row;
+    @media (min-width: map.get($grid-breakpoints, md)) {
+      grid-template-rows: auto auto;
+      grid-template-columns: 1fr auto;
 
-    @include panel-padding-icon;
-  }
+      &--with-icon {
+        grid-template-columns: auto 1fr auto;
+      }
 
-  &__icon {
-    padding-right: getSpacer(s);
+      &__content-a {
+        grid-row: span 2;
+      }
 
-    @media (min-width: map.get($grid-breakpoints, md)) {
-      padding-right: getSpacer(l);
+      &__last-column {
+        max-width: 200px;
+      }
     }
 
-    &--right {
-      padding-left: getSpacer(s);
+    @media (min-width: map.get($grid-breakpoints, lg)) {
+      grid-template-columns: minmax(auto, 760px) auto;
+
+      &--with-icon {
+        grid-template-columns: auto minmax(auto, 760px) auto;
+      }
     }
   }
 
-  &__badge {
-    display: inline-block;
-    vertical-align: text-bottom;
-  }
+  &__layout-3 {
+    &--with-icon {
+      grid-template-columns: auto 1fr;
+    }
 
-  &__content-left {
-    &--flex {
-      display: flex;
+    &__last-column {
+      display: grid;
+      row-gap: $layout-sm-gap;
     }
-  }
 
-  &__content-right {
-    &--layout1 {
-      display: flex;
-      flex-direction: column;
+    @media (min-width: map.get($grid-breakpoints, lg)) {
+      grid-template-rows: auto;
 
-      @media (min-width: map.get($grid-breakpoints, md)) {
-        flex-direction: row;
+      &--a {
+        grid-template-columns: 3fr 2fr;
+      }
+      &--a#{&}--with-icon {
+        grid-template-columns: auto 3fr 2fr;
       }
-    }
 
-    &--layout2 {
-      display: flex;
-      flex-direction: column;
+      &--b {
+        grid-template-columns: 4.5fr 5.5fr;
+      }
+      &--b#{&}--with-icon {
+        grid-template-columns: auto 4.5fr 5.5fr;
+      }
 
-      @media (min-width: map.get($grid-breakpoints, md)) {
-        max-width: 200px;
+      &--c {
+        grid-template-columns: 3.5fr 6.5fr;
+      }
+      &--c#{&}--with-icon {
+        grid-template-columns: auto 3.5fr 6.5fr;
       }
-    }
 
-    &--layout3 {
-      display: flex;
-      flex-direction: column;
-      padding-left: 0;
+      &__last-column {
+        grid-template-columns: 1fr auto;
+        column-gap: $layout-md-col-gap;
 
-      @media (min-width: map.get($grid-breakpoints, lg)) {
-        flex-direction: row;
-        padding-left: getSpacer(m);
+        &__content-b {
+          flex: 1;
+        }
       }
     }
+  }
 
-    &--layout3a {
-      flex: 0.4;
-    }
+  &--with-icon {
+    @include panel-padding-icon;
+  }
 
-    &--layout3b {
-      flex: 0.55;
-    }
+  &__icon {
+    grid-row: span 3;
 
-    &--layout3c {
-      flex: 0.65;
+    &--no-content {
+      grid-row: span 2;
     }
 
-    &--prioritiseMetaDataInContentB {
-      padding-bottom: getSpacer(s);
-      order: 1;
-
+    &--layout-1,
+    &--layout-2 {
       @media (min-width: map.get($grid-breakpoints, md)) {
-        order: 2;
+        grid-row: span 2;
+        padding-right: getSpacer(2xs);
       }
     }
 
-    &--layout2#{&}--prioritiseMetaDataInContentB {
-      @media (min-width: map.get($grid-breakpoints, md)) {
-        padding-bottom: 0;
-      }
+    @media (min-width: map.get($grid-breakpoints, lg)) {
+      grid-row: span 2;
+      padding-right: getSpacer(2xs);
     }
-    &--layout3#{&}--prioritiseMetaDataInContentB {
+
+    &--layout-3 {
+      grid-row: span 2;
+
       @media (min-width: map.get($grid-breakpoints, lg)) {
-        padding-bottom: 0;
+        grid-row: span 1;
       }
     }
   }
 
+  &__badge {
+    display: inline-block;
+    vertical-align: text-bottom;
+  }
+
   &__btn-container {
     display: flex;
     flex-direction: column;
+    justify-content: flex-end;
 
     &--no-content-b {
       @media (min-width: map.get($grid-breakpoints, lg)) {
-        align-self: flex-end;
         flex-direction: row;
+        grid-column: span 2;
       }
     }
 
-    &--layout3 {
-      display: flex;
-      align-self: initial;
+    &--no-button {
       flex-direction: column;
-
-      @media (min-width: map.get($grid-breakpoints, lg)) {
-        align-self: flex-end;
-      }
-    }
-
-    &--padding-top {
-      padding-top: getSpacer(s);
     }
   }
 
@@ -212,8 +232,6 @@
     }
   }
 
-  // Panel variants
-
   &--fill {
     background-color: $neutral50;
   }
@@ -283,7 +301,6 @@
     cursor: pointer;
   }
 
-  // Panel status
   &--status {
     &::before {
       content: '';
@@ -316,6 +333,23 @@
   }
 }
 
+.title-container {
+  padding-bottom: getSpacer(s);
+
+  &--no-content-a {
+    padding-bottom: 0;
+  }
+
+  &__title {
+    vertical-align: top;
+    display: inline;
+
+    &--badge {
+      padding-right: getSpacer(2xs);
+    }
+  }
+}
+
 .panel-details {
   background-color: $neutral50;
   display: none;
@@ -340,17 +374,14 @@
   &--white {
     background: $white;
   }
-
-  &--with-icon {
-    @include panel-padding-icon;
-  }
 }
 
 .status-message {
   font-size: $font-size-sm;
   color: $cherry500;
   display: flex;
-  margin-bottom: getSpacer(2xs);
+  margin-bottom: getSpacer(2xs) * -1;
+  grid-column: 1 / -1;
 
   span {
     padding-left: 5px;
@@ -363,93 +394,8 @@
   }
 }
 
-.panel-content-a {
-  flex: 1;
-  padding-right: 0;
-
-  @media (min-width: map.get($grid-breakpoints, md)) {
-    padding-right: getSpacer(m);
-  }
-
-  &__title-container {
-    padding-bottom: getSpacer(s);
-  }
-
-  &__title {
-    vertical-align: top;
-    display: inline;
-
-    &--badge {
-      padding-right: getSpacer(2xs);
-    }
-  }
-
-  &--layout3a {
-    flex: 0.6;
-  }
-
-  &--layout3b {
-    flex: 0.45;
-  }
-
-  &--layout3c {
-    flex: 0.35;
-  }
-
-  &--prioritiseMetaDataInContentB {
-    padding-bottom: getSpacer(s);
-
-    @media (min-width: map.get($grid-breakpoints, md)) {
-      padding-bottom: 0;
-    }
-  }
-}
-
-.panel-content-b {
-  flex: 1;
-  padding-top: 0;
-
-  @media (min-width: map.get($grid-breakpoints, lg)) {
-    padding-top: getSpacer(s);
-  }
-
-  &--layout1 {
-    padding-top: getSpacer(s);
-    padding-left: 0;
-
-    @media (min-width: map.get($grid-breakpoints, md)) {
-      padding-right: getSpacer(m);
-    }
-
-    @media (min-width: map.get($grid-breakpoints, lg)) {
-      padding-top: getSpacer(s);
-    }
-  }
-
-  &--layout2 {
-    padding-top: getSpacer(s);
-
-    @media (min-width: map.get($grid-breakpoints, md)) {
-      padding-top: 0;
-    }
-  }
-
-  &--layout3 {
-    padding-top: getSpacer(s);
-
-    @media (min-width: map.get($grid-breakpoints, lg)) {
-      padding-right: getSpacer(m);
-      padding-top: 0;
-    }
-  }
-
-  &--prioritiseMetaDataInContentB {
-    padding-top: 0;
-
-    @media (min-width: map.get($grid-breakpoints, lg)) {
-      padding-top: 0;
-    }
-  }
+.header-container {
+  grid-column: 1 / -1;
 }
 
 .datetime-container {

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

@@ -1,30 +1,33 @@
 export type Styles = {
   'datetime-container': string;
   'datetime-container__icon': string;
+  'header-container': string;
   panel: string;
   panel__badge: string;
   'panel__btn-container': string;
-  'panel__btn-container--layout3': string;
+  'panel__btn-container--no-button': string;
   'panel__btn-container--no-content-b': string;
-  'panel__btn-container--padding-top': string;
-  panel__container: string;
-  'panel__container--grow': string;
-  'panel__container--layout1': string;
-  'panel__container--layout2': string;
-  'panel__container--layout3': string;
-  'panel__container--prioritiseMetaDataInContentB': string;
-  'panel__content-left--flex': string;
-  'panel__content-right--layout1': string;
-  'panel__content-right--layout2': string;
-  'panel__content-right--layout3': string;
-  'panel__content-right--layout3a': string;
-  'panel__content-right--layout3b': string;
-  'panel__content-right--layout3c': string;
-  'panel__content-right--prioritiseMetaDataInContentB': string;
   'panel__details-btn': string;
   panel__expand: string;
   panel__icon: string;
-  'panel__icon--right': string;
+  'panel__icon--layout-1': string;
+  'panel__icon--layout-2': string;
+  'panel__icon--layout-3': string;
+  'panel__icon--no-content': string;
+  'panel__layout-1': string;
+  'panel__layout-1__content-a': string;
+  'panel__layout-1--with-icon': string;
+  'panel__layout-2': string;
+  'panel__layout-2__content-a': string;
+  'panel__layout-2__last-column': string;
+  'panel__layout-2--with-icon': string;
+  'panel__layout-3': string;
+  'panel__layout-3__last-column': string;
+  'panel__layout-3__last-column__content-b': string;
+  'panel__layout-3--a': string;
+  'panel__layout-3--b': string;
+  'panel__layout-3--c': string;
+  'panel__layout-3--with-icon': string;
   'panel--button': string;
   'panel--clickable': string;
   'panel--draft': string;
@@ -38,27 +41,17 @@ export type Styles = {
   'panel--stroke': string;
   'panel--white': string;
   'panel--with-icon': string;
-  'panel-content-a': string;
-  'panel-content-a__title': string;
-  'panel-content-a__title--badge': string;
-  'panel-content-a__title-container': string;
-  'panel-content-a--layout3a': string;
-  'panel-content-a--layout3b': string;
-  'panel-content-a--layout3c': string;
-  'panel-content-a--prioritiseMetaDataInContentB': string;
-  'panel-content-b': string;
-  'panel-content-b--layout1': string;
-  'panel-content-b--layout2': string;
-  'panel-content-b--layout3': string;
-  'panel-content-b--prioritiseMetaDataInContentB': string;
   'panel-details': string;
   'panel-details--line': string;
   'panel-details--open': string;
   'panel-details--white': string;
-  'panel-details--with-icon': string;
   'panel-wrapper': string;
   'status-message': string;
   'status-message--new': string;
+  'title-container': string;
+  'title-container__title': string;
+  'title-container__title--badge': string;
+  'title-container--no-content-a': string;
 };
 
 export type ClassNames = keyof Styles;

package/components/PopMenu/PopMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PopMenu.d.ts","sourceRoot":"","sources":["../../../src/components/PopMenu/PopMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAchD,OAAiB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAKtD,oBAAY,cAAc;IACxB,OAAO,aAAa;IACpB,MAAM,YAAY;IAClB,WAAW,iBAAiB;CAC7B;AAED,MAAM,WAAW,YAAY;IAC3B,2DAA2D;IAC3D,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAC5C,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0CAA0C;IAC1C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yDAAyD;IACzD,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sDAAsD;IACtD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,0DAA0D;IAC1D,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAwE1C,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"PopMenu.d.ts","sourceRoot":"","sources":["../../../src/components/PopMenu/PopMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAchD,OAAiB,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAKtD,oBAAY,cAAc;IACxB,OAAO,aAAa;IACpB,MAAM,YAAY;IAClB,WAAW,iBAAiB;CAC7B;AAED,MAAM,WAAW,YAAY;IAC3B,2DAA2D;IAC3D,QAAQ,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,CAAC;IAC5C,kDAAkD;IAClD,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0CAA0C;IAC1C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yDAAyD;IACzD,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,gEAAgE;IAChE,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iEAAiE;IACjE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sDAAsD;IACtD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,0DAA0D;IAC1D,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CA6E1C,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/components/PopMenu/index.js

@@ -1,2 +1,2 @@
-import t,{useRef as p,useState as S}from"react";import i from"classnames";import{IconSize as b,AnalyticsId as h}from"../../constants.js";import{useBreakpoint as w}from"../../hooks/useBreakpoint.js";import{useHover as H}from"../../hooks/useHover.js";import{useOutsideEvent as _}from"../../hooks/useOutsideEvent.js";import{getColor as g}from"../../theme/currys/color.js";import{breakpoints as z}from"../../theme/grid.js";import{isComponent as A}from"../../utils/component.js";import{C as M}from"../../Close.js";import{Icon as T}from"../Icons/Icon.js";import P from"../Icons/VerticalDots.js";import{L as $}from"../../LinkList.js";import{a as x}from"../../PopOver.js";import e from"./styles.module.scss";import"../../hooks/usePseudoClasses.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../utils/refs.js";import"../Icons/X.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Close/styles.module.scss";import"../Icons/ChevronRight.js";import"../../ListHeader.js";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../Icons/Attachment.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../Icons/Undo.js";import"../StatusDot/styles.module.scss";import"../ListHeader/styles.module.scss";import"../../Avatar.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../Badge.js";import"../Badge/styles.module.scss";import"../LinkList/styles.module.scss";import"../../hooks/useInterval.js";import"../../hooks/useIsVisible.js";import"../../hooks/useIntersectionObserver.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";import"../../hooks/useSize.js";import"../PopOver/styles.module.scss";var D=(o=>(o.onWhite="on-white",o.onGray="on-gray",o.onBlueberry="on-blueberry",o))(D||{});const G=o=>{const n=p(null),s=p(null),a=p(null),[r,m]=S(!1),{children:l,popOverClassName:d,popMenuClassName:v,openButtonTestId:I,closeButtonTestId:C,popOverTestId:k,popMenuVariant:c="on-white",openButtonAriaLabel:B,closeButtonAriaLabel:N}=o,u=i(e["pop-menu-button"],{[e[`pop-menu-button--${c}`]]:c}),f=w()<z.md;_(a,()=>m(!r));const{isHovered:y}=H(s),O=f?b.XSmall:b.Small,E=()=>{if(A(l,$))return t.createElement(x,{testId:k,className:i(e["pop-menu__pop-over"],d),arrowClassName:e["pop-menu__pop-over-arrow"],controllerRef:n,popOverRef:a},l)},L=t.createElement("button",{ref:s,"data-testid":I,className:u,"aria-label":B||"Se mer",onClick:()=>m(!0),type:"button"},t.createElement(T,{svgIcon:P,className:"test",color:g("black"),size:O,isHovered:y})),R=t.createElement(M,{ariaLabel:N,color:"black",className:u,testId:C,ref:n,onClick:()=>m(!1),small:f});return t.createElement("div",{className:i(e["pop-menu-button"],v),"data-analyticsid":h.PopMenu},r?R:L,r&&E())},$o=G;export{G as PopMenu,D as PopMenuVariant,$o as default};
+import e,{useRef as p,useState as w}from"react";import n from"classnames";import{IconSize as C,AnalyticsId as H}from"../../constants.js";import{useBreakpoint as _}from"../../hooks/useBreakpoint.js";import{useHover as z}from"../../hooks/useHover.js";import{useOutsideEvent as A}from"../../hooks/useOutsideEvent.js";import{getColor as M}from"../../theme/currys/color.js";import{breakpoints as P}from"../../theme/grid.js";import{isComponent as T}from"../../utils/component.js";import{C as $}from"../../Close.js";import{Icon as x}from"../Icons/Icon.js";import D from"../Icons/VerticalDots.js";import{L as G}from"../../LinkList.js";import{a as W}from"../../PopOver.js";import r from"./styles.module.scss";import"../../hooks/usePseudoClasses.js";import"../../theme/index.js";import"../../theme/palette.js";import"../../theme/spacers.js";import"../../utils/refs.js";import"../Icons/X.js";import"../../hooks/useUuid.js";import"../../uuid.js";import"../../utils/environment.js";import"../Close/styles.module.scss";import"../Icons/ChevronRight.js";import"../../ListHeader.js";import"../../ListHeaderText.js";import"../../StatusDot.js";import"../Icons/Attachment.js";import"../Icons/Group.js";import"../Icons/NoAccess.js";import"../Icons/Undo.js";import"../StatusDot/styles.module.scss";import"../ListHeader/styles.module.scss";import"../../Avatar.js";import"../Icons/Check.js";import"../Avatar/styles.module.scss";import"../../Badge.js";import"../Badge/styles.module.scss";import"../LinkList/styles.module.scss";import"../../hooks/useInterval.js";import"../../hooks/useIsVisible.js";import"../../hooks/useIntersectionObserver.js";import"../../hooks/useLayoutEvent.js";import"../../utils/debounce.js";import"../../hooks/useSize.js";import"../PopOver/styles.module.scss";var X=(o=>(o.onWhite="on-white",o.onGray="on-gray",o.onBlueberry="on-blueberry",o))(X||{});const j=o=>{const i=p(null),s=p(null),a=p(null),[m,l]=w(!1),{children:c,popOverClassName:I,popMenuClassName:k,openButtonTestId:B,closeButtonTestId:N,popOverTestId:y,popMenuVariant:u="on-white",openButtonAriaLabel:O,closeButtonAriaLabel:h}=o,f=n(r["pop-menu-button"],{[r[`pop-menu-button--${u}`]]:u}),d=_()<P.md;A(a,()=>l(!m));const{isHovered:E}=z(s),L=d?C.XSmall:C.Small,R=()=>{if(T(c,G))return e.createElement(W,{testId:y,className:n(r["pop-menu__pop-over"],I),arrowClassName:r["pop-menu__pop-over-arrow"],controllerRef:i,popOverRef:a},c)},b=(t,v)=>{v&&v.stopPropagation(),l(t)},S=e.createElement("button",{ref:s,"data-testid":B,className:f,"aria-label":O||"Se mer",onClick:t=>b(!0,t),type:"button"},e.createElement(x,{svgIcon:D,className:"test",color:M("black"),size:L,isHovered:E})),g=e.createElement($,{ariaLabel:h,color:"black",className:f,testId:N,ref:i,onClick:t=>b(!1,t),small:d});return e.createElement("div",{className:n(r["pop-menu-button"],k),"data-analyticsid":H.PopMenu},m?g:S,m&&R())},Go=j;export{j as PopMenu,X as PopMenuVariant,Go as default};
 //# sourceMappingURL=index.js.map