@helsenorge/designsystem-react 15.0.0 → 15.2.0

package/lib/components/InfoTeaser/styles.module.scss

@@ -9,22 +9,13 @@
 
 .infoteaser {
   display: grid;
-  grid-template:
-    'icon title' auto
-    '. title' auto
-    'text text' min-content / auto 1fr;
+  grid-template-columns: [icon] auto [content] 1fr;
   width: 100%;
   overflow: hidden;
   background-color: var(--color-base-background-blueberry);
   border: 1px solid var(--color-base-border-blueberry);
   padding: var(--core-space-m) var(--core-space-s) var(--core-space-l) var(--core-space-s);
-
-  @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
-    grid-template:
-      'icon title' auto
-      '. title' auto
-      '. text' min-content / auto 1fr;
-  }
+  row-gap: var(--core-space-2xs);
 
   &--collapsed {
     &::after {
@@ -41,20 +32,26 @@
   }
 
   &__title {
-    grid-area: title;
+    grid-column: content;
+    grid-row: 1;
     align-self: center;
   }
 
   &__icon {
-    grid-area: icon;
+    grid-column: icon;
+    grid-row: 1;
+    align-self: center;
     margin-right: var(--core-space-xs);
   }
 
   &__text {
-    grid-area: text;
+    grid-column: 1 / -1;
     overflow: hidden;
     height: inherit;
-    margin-top: var(--core-space-2xs);
+
+    @media (min-width: map.get(breakpoints.$grid-breakpoints, md)) {
+      grid-column: content;
+    }
   }
 
   &__button {
@@ -76,7 +73,7 @@
     font-size: 1rem;
     font-style: normal;
     font-weight: 600;
-    line-height: 120%; /* 1.2rem */
+    line-height: 120%; // 1.2rem
 
     &:hover {
       background-color: var(--color-action-graphics-onlight-hover);

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

@@ -15,9 +15,10 @@ export type Styles = {
   'button--borderless': string;
   'button--both-icons': string;
   'button--destructive': string;
-  'button--large': string;
+  'button--large-borderless': string;
+  'button--large-non-borderless': string;
   'button--left-icon': string;
-  'button--normal': string;
+  'button--medium': string;
   'button--on-dark': string;
   'button--only-icon': string;
   'button--outline': string;

package/lib/components/Tabs/index.js

@@ -15,11 +15,16 @@ var HN_Designsystem_Tabs_nb_NO_default = {
 	ariaLabelRightButton: "Scroll til høyre",
 	ariaLabelLeftButton: "Scroll til venstre"
 };
+var HN_Designsystem_Tabs_se_NO_default = {
+	ariaLabelRightButton: "Sirdde olgeš guvlui",
+	ariaLabelLeftButton: "Sirdde gurut guvlui"
+};
 //#endregion
 //#region src/components/Tabs/resourceHelper.ts
 var getResources = (language) => {
 	switch (language) {
 		case LanguageLocales.ENGLISH: return HN_Designsystem_Tabs_en_GB_default;
+		case LanguageLocales.SAMI_NORTHERN: return HN_Designsystem_Tabs_se_NO_default;
 		case LanguageLocales.NORWEGIAN:
 		default: return HN_Designsystem_Tabs_nb_NO_default;
 	}

package/lib/components/Tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/resources/HN.Designsystem.Tabs.en-GB.json","../../../src/resources/HN.Designsystem.Tabs.nb-NO.json","../../../src/components/Tabs/resourceHelper.ts","../../../src/components/Tabs/Tabs.tsx","../../../src/components/Tabs/index.ts"],"sourcesContent":["{\n  \"ariaLabelRightButton\": \"Scroll right\",\n  \"ariaLabelLeftButton\": \"Scroll left\"\n}\n","{\n  \"ariaLabelRightButton\": \"Scroll til høyre\",\n  \"ariaLabelLeftButton\": \"Scroll til venstre\"\n}\n","import type { HNDesignsystemTabs } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.Tabs.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.Tabs.nb-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemTabs => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import React, { useState, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport type { HNDesignsystemTabs } from '../../resources/Resources';\nimport type { PaletteNames } from '../../theme/palette';\n\nimport { getResources } from './resourceHelper';\nimport Tab from './Tab';\nimport TabList from './TabList';\nimport TabPanel from './TabPanel';\nimport { LanguageLocales } from '../../constants';\nimport { useLanguage } from '../../hooks/useLanguage';\nimport designsystemlayout from '../../scss/layout.module.scss';\n\nimport styles from './styles.module.scss';\n\nexport type { TabProps } from './Tab';\nexport type TabsColors = Extract<PaletteNames, 'blueberry' | 'neutral' | 'white'>;\nexport type TabsOnColor = 'onblueberry' | 'onneutral' | 'onwhite';\n\nexport interface TabsProps {\n  children?: React.ReactNode;\n  /** Controlled state for Tabs component */\n  activeTab?: number;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the color of the tabs. Default: white */\n  color?: TabsColors;\n  /** Sets wether the component should use the container-breakout class. Default: true */\n  containerBreakout?: boolean;\n  /** Sets the background color of the tabs. Can only be used when the color is set to white. Default: onwhite */\n  onColor?: TabsOnColor;\n  /** Whether the tab list should be sticky */\n  sticky?: boolean;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemTabs>;\n  /** Overrides the default z-index of the tabs header */\n  zIndex?: number;\n}\n\nexport const TabsRoot: React.FC<TabsProps> = ({\n  activeTab,\n  children,\n  className,\n  color = 'white',\n  containerBreakout = true,\n  onColor = 'onwhite',\n  sticky = true,\n  testId,\n  resources,\n  zIndex,\n}) => {\n  const isControlled = activeTab !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(0);\n  const tabsRef = useRef<HTMLDivElement>(null);\n  const tabPanelRef = useRef<HTMLDivElement>(null);\n  const tabListRef = useRef<HTMLDivElement>(null);\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemTabs = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  let onColorUsed: TabsOnColor = 'onwhite';\n  if (color === 'white') {\n    onColorUsed = onColor;\n  }\n\n  const onValueChange = (newValue: number): void => {\n    if (!isControlled) {\n      setUncontrolledValue(newValue);\n    }\n  };\n\n  const activeTabIndex = isControlled ? activeTab : uncontrolledValue;\n\n  return (\n    <div className={classNames(className, containerBreakout && designsystemlayout['container-breakout'])} data-testid={testId}>\n      <div\n        ref={tabListRef}\n        className={classNames(styles['tab-list-wrapper'], {\n          [styles['tab-list-wrapper--sticky']]: sticky,\n        })}\n        style={{\n          zIndex: zIndex,\n        }}\n      >\n        <TabList\n          onTabListClick={(index: number) => onValueChange(index)}\n          selectedTab={activeTabIndex}\n          color={color}\n          onColor={onColorUsed}\n          ariaLabelLeftButton={mergedResources.ariaLabelLeftButton}\n          ariaLabelRightButton={mergedResources.ariaLabelRightButton}\n        >\n          {children}\n        </TabList>\n        <div className={classNames(styles['panel-wrapper'], styles[`panel-wrapper--${color}`])}></div>\n      </div>\n      <div ref={tabsRef} style={{ marginTop: '-50px' }}>\n        <TabPanel ref={tabPanelRef} color={color} isFirst={activeTabIndex == 0}>\n          {React.Children.toArray(children)[activeTabIndex]}\n        </TabPanel>\n      </div>\n    </div>\n  );\n};\n\ntype TabsComponent = typeof TabsRoot & {\n  Tab: typeof Tab;\n};\nconst Tabs = TabsRoot as TabsComponent;\nTabsRoot.displayName = 'Tabs';\nTabs.displayName = 'Tabs';\nTabs.Tab = Tab;\nTabs.Tab.displayName = 'Tabs.Tab';\n\nexport default Tabs;\n","import Tabs from './Tabs';\nexport * from './Tabs';\nexport default Tabs;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AEMA,IAAa,gBAAgB,aAAkD;CAC7E,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;CACX;AACF;;;AC6BA,IAAa,YAAiC,EAC5C,WACA,UACA,WACA,QAAQ,SACR,oBAAoB,MACpB,UAAU,WACV,SAAS,MACT,QACA,WACA,aACI;CACJ,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,CAAC;CAC5D,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,cAAc,OAAuB,IAAI;CAC/C,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,EAAE,aAAa,YAA6B,gBAAgB,SAAS;CAG3E,MAAM,kBAAsC;EAC1C,GAHuB,aAAa,QAGjC;EACH,GAAG;CACL;CAEA,IAAI,cAA2B;CAC/B,IAAI,UAAU,SACZ,cAAc;CAGhB,MAAM,iBAAiB,aAA2B;EAChD,IAAI,CAAC,cACH,qBAAqB,QAAQ;CAEjC;CAEA,MAAM,iBAAiB,eAAe,YAAY;CAElD,OACE,qBAAC,OAAD;EAAK,WAAW,WAAW,WAAW,qBAAqB,mBAAmB,qBAAqB;EAAG,eAAa;YAAnH,CACE,qBAAC,OAAD;GACE,KAAK;GACL,WAAW,WAAW,OAAO,qBAAqB,GAC/C,OAAO,8BAA8B,OACxC,CAAC;GACD,OAAO,EACG,OACV;aAPF,CASE,oBAAC,iBAAD;IACE,iBAAiB,UAAkB,cAAc,KAAK;IACtD,aAAa;IACN;IACP,SAAS;IACT,qBAAqB,gBAAgB;IACrC,sBAAsB,gBAAgB;IAErC;GACM,CAAA,GACT,oBAAC,OAAD,EAAK,WAAW,WAAW,OAAO,kBAAkB,OAAO,kBAAkB,QAAQ,EAAQ,CAAA,CAC1F;MACL,oBAAC,OAAD;GAAK,KAAK;GAAS,OAAO,EAAE,WAAW,QAAQ;aAC7C,oBAAC,kBAAD;IAAU,KAAK;IAAoB;IAAO,SAAS,kBAAkB;cAClE,MAAM,SAAS,QAAQ,QAAQ,EAAE;GAC1B,CAAA;EACP,CAAA,CACF;;AAET;AAKA,IAAM,OAAO;AACb,SAAS,cAAc;AACvB,KAAK,cAAc;AACnB,KAAK,MAAM;AACX,KAAK,IAAI,cAAc;;;ACtHvB,IAAA,eAAe"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/resources/HN.Designsystem.Tabs.en-GB.json","../../../src/resources/HN.Designsystem.Tabs.nb-NO.json","../../../src/resources/HN.Designsystem.Tabs.se-NO.json","../../../src/components/Tabs/resourceHelper.ts","../../../src/components/Tabs/Tabs.tsx","../../../src/components/Tabs/index.ts"],"sourcesContent":["{\n  \"ariaLabelRightButton\": \"Scroll right\",\n  \"ariaLabelLeftButton\": \"Scroll left\"\n}\n","{\n  \"ariaLabelRightButton\": \"Scroll til høyre\",\n  \"ariaLabelLeftButton\": \"Scroll til venstre\"\n}\n","{\n  \"ariaLabelRightButton\": \"Sirdde olgeš guvlui\",\n  \"ariaLabelLeftButton\": \"Sirdde gurut guvlui\"\n}\n","import type { HNDesignsystemTabs } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.Tabs.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.Tabs.nb-NO.json';\nimport seNO from '../../resources/HN.Designsystem.Tabs.se-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemTabs => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.SAMI_NORTHERN:\n      return seNO;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n","import React, { useState, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport type { HNDesignsystemTabs } from '../../resources/Resources';\nimport type { PaletteNames } from '../../theme/palette';\n\nimport { getResources } from './resourceHelper';\nimport Tab from './Tab';\nimport TabList from './TabList';\nimport TabPanel from './TabPanel';\nimport { LanguageLocales } from '../../constants';\nimport { useLanguage } from '../../hooks/useLanguage';\nimport designsystemlayout from '../../scss/layout.module.scss';\n\nimport styles from './styles.module.scss';\n\nexport type { TabProps } from './Tab';\nexport type TabsColors = Extract<PaletteNames, 'blueberry' | 'neutral' | 'white'>;\nexport type TabsOnColor = 'onblueberry' | 'onneutral' | 'onwhite';\n\nexport interface TabsProps {\n  children?: React.ReactNode;\n  /** Controlled state for Tabs component */\n  activeTab?: number;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Sets the color of the tabs. Default: white */\n  color?: TabsColors;\n  /** Sets wether the component should use the container-breakout class. Default: true */\n  containerBreakout?: boolean;\n  /** Sets the background color of the tabs. Can only be used when the color is set to white. Default: onwhite */\n  onColor?: TabsOnColor;\n  /** Whether the tab list should be sticky */\n  sticky?: boolean;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Resources for component */\n  resources?: Partial<HNDesignsystemTabs>;\n  /** Overrides the default z-index of the tabs header */\n  zIndex?: number;\n}\n\nexport const TabsRoot: React.FC<TabsProps> = ({\n  activeTab,\n  children,\n  className,\n  color = 'white',\n  containerBreakout = true,\n  onColor = 'onwhite',\n  sticky = true,\n  testId,\n  resources,\n  zIndex,\n}) => {\n  const isControlled = activeTab !== undefined;\n  const [uncontrolledValue, setUncontrolledValue] = useState(0);\n  const tabsRef = useRef<HTMLDivElement>(null);\n  const tabPanelRef = useRef<HTMLDivElement>(null);\n  const tabListRef = useRef<HTMLDivElement>(null);\n  const { language } = useLanguage<LanguageLocales>(LanguageLocales.NORWEGIAN);\n  const defaultResources = getResources(language);\n\n  const mergedResources: HNDesignsystemTabs = {\n    ...defaultResources,\n    ...resources,\n  };\n\n  let onColorUsed: TabsOnColor = 'onwhite';\n  if (color === 'white') {\n    onColorUsed = onColor;\n  }\n\n  const onValueChange = (newValue: number): void => {\n    if (!isControlled) {\n      setUncontrolledValue(newValue);\n    }\n  };\n\n  const activeTabIndex = isControlled ? activeTab : uncontrolledValue;\n\n  return (\n    <div className={classNames(className, containerBreakout && designsystemlayout['container-breakout'])} data-testid={testId}>\n      <div\n        ref={tabListRef}\n        className={classNames(styles['tab-list-wrapper'], {\n          [styles['tab-list-wrapper--sticky']]: sticky,\n        })}\n        style={{\n          zIndex: zIndex,\n        }}\n      >\n        <TabList\n          onTabListClick={(index: number) => onValueChange(index)}\n          selectedTab={activeTabIndex}\n          color={color}\n          onColor={onColorUsed}\n          ariaLabelLeftButton={mergedResources.ariaLabelLeftButton}\n          ariaLabelRightButton={mergedResources.ariaLabelRightButton}\n        >\n          {children}\n        </TabList>\n        <div className={classNames(styles['panel-wrapper'], styles[`panel-wrapper--${color}`])}></div>\n      </div>\n      <div ref={tabsRef} style={{ marginTop: '-50px' }}>\n        <TabPanel ref={tabPanelRef} color={color} isFirst={activeTabIndex == 0}>\n          {React.Children.toArray(children)[activeTabIndex]}\n        </TabPanel>\n      </div>\n    </div>\n  );\n};\n\ntype TabsComponent = typeof TabsRoot & {\n  Tab: typeof Tab;\n};\nconst Tabs = TabsRoot as TabsComponent;\nTabsRoot.displayName = 'Tabs';\nTabs.displayName = 'Tabs';\nTabs.Tab = Tab;\nTabs.Tab.displayName = 'Tabs.Tab';\n\nexport default Tabs;\n","import Tabs from './Tabs';\nexport * from './Tabs';\nexport default Tabs;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AGOA,IAAa,gBAAgB,aAAkD;CAC7E,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB,eACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;CACX;AACF;;;AC0BA,IAAa,YAAiC,EAC5C,WACA,UACA,WACA,QAAQ,SACR,oBAAoB,MACpB,UAAU,WACV,SAAS,MACT,QACA,WACA,aACI;CACJ,MAAM,eAAe,cAAc,KAAA;CACnC,MAAM,CAAC,mBAAmB,wBAAwB,SAAS,CAAC;CAC5D,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,cAAc,OAAuB,IAAI;CAC/C,MAAM,aAAa,OAAuB,IAAI;CAC9C,MAAM,EAAE,aAAa,YAA6B,gBAAgB,SAAS;CAG3E,MAAM,kBAAsC;EAC1C,GAHuB,aAAa,QAGjC;EACH,GAAG;CACL;CAEA,IAAI,cAA2B;CAC/B,IAAI,UAAU,SACZ,cAAc;CAGhB,MAAM,iBAAiB,aAA2B;EAChD,IAAI,CAAC,cACH,qBAAqB,QAAQ;CAEjC;CAEA,MAAM,iBAAiB,eAAe,YAAY;CAElD,OACE,qBAAC,OAAD;EAAK,WAAW,WAAW,WAAW,qBAAqB,mBAAmB,qBAAqB;EAAG,eAAa;YAAnH,CACE,qBAAC,OAAD;GACE,KAAK;GACL,WAAW,WAAW,OAAO,qBAAqB,GAC/C,OAAO,8BAA8B,OACxC,CAAC;GACD,OAAO,EACG,OACV;aAPF,CASE,oBAAC,iBAAD;IACE,iBAAiB,UAAkB,cAAc,KAAK;IACtD,aAAa;IACN;IACP,SAAS;IACT,qBAAqB,gBAAgB;IACrC,sBAAsB,gBAAgB;IAErC;GACM,CAAA,GACT,oBAAC,OAAD,EAAK,WAAW,WAAW,OAAO,kBAAkB,OAAO,kBAAkB,QAAQ,EAAQ,CAAA,CAC1F;MACL,oBAAC,OAAD;GAAK,KAAK;GAAS,OAAO,EAAE,WAAW,QAAQ;aAC7C,oBAAC,kBAAD;IAAU,KAAK;IAAoB;IAAO,SAAS,kBAAkB;cAClE,MAAM,SAAS,QAAQ,QAAQ,EAAE;GAC1B,CAAA;EACP,CAAA,CACF;;AAET;AAKA,IAAM,OAAO;AACb,SAAS,cAAc;AACvB,KAAK,cAAc;AACnB,KAAK,MAAM;AACX,KAAK,IAAI,cAAc;;;ACtHvB,IAAA,eAAe"}

package/lib/components/VisualContentgroupWithImage/VisualContentgroupWithImage.d.ts

@@ -0,0 +1,13 @@
+export type ImageRatios = 'square' | 'landscape';
+export interface VisualContentgroupWithImageProps {
+    /** Set the ratio of the image. */
+    imageRatio?: ImageRatios;
+    /** Content rendered inside the visualcontent area. */
+    visualContent: React.ReactNode;
+    /** Content rendered inside the component */
+    children: React.ReactNode;
+    /** Sets the data-testid attribute. */
+    testId?: string;
+}
+declare const VisualContentgroupWithImage: React.FC<VisualContentgroupWithImageProps>;
+export default VisualContentgroupWithImage;

package/lib/components/VisualContentgroupWithImage/index.d.ts

@@ -0,0 +1,3 @@
+import { default as VisualContentgroupWithImage } from './VisualContentgroupWithImage';
+export * from './VisualContentgroupWithImage';
+export default VisualContentgroupWithImage;

package/lib/components/VisualContentgroupWithImage/index.js

@@ -0,0 +1,22 @@
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import styles from "./styles.module.scss";
+//#region src/components/VisualContentgroupWithImage/VisualContentgroupWithImage.tsx
+var VisualContentgroupWithImage = (props) => {
+	const { imageRatio = "square", visualContent, children, testId } = props;
+	return /* @__PURE__ */ jsxs("div", {
+		"data-testid": testId,
+		className: styles["visual-contentgroup-with-image"],
+		children: [/* @__PURE__ */ jsx("div", {
+			className: classNames(styles["visual-contentgroup-with-image__frame"], { [styles[`visual-contentgroup-with-image__frame--${imageRatio}`]]: imageRatio }),
+			children: visualContent
+		}), children]
+	});
+};
+//#endregion
+//#region src/components/VisualContentgroupWithImage/index.ts
+var VisualContentgroupWithImage_default = VisualContentgroupWithImage;
+//#endregion
+export { VisualContentgroupWithImage_default as default };
+
+//# sourceMappingURL=index.js.map

package/lib/components/VisualContentgroupWithImage/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/VisualContentgroupWithImage/VisualContentgroupWithImage.tsx","../../../src/components/VisualContentgroupWithImage/index.ts"],"sourcesContent":["import classNames from 'classnames';\n\nimport styles from './styles.module.scss';\n\nexport type ImageRatios = 'square' | 'landscape';\n\nexport interface VisualContentgroupWithImageProps {\n  /** Set the ratio of the image. */\n  imageRatio?: ImageRatios;\n  /** Content rendered inside the visualcontent area. */\n  visualContent: React.ReactNode;\n  /** Content rendered inside the component */\n  children: React.ReactNode;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n}\n\nconst VisualContentgroupWithImage: React.FC<VisualContentgroupWithImageProps> = props => {\n  const { imageRatio = 'square', visualContent, children, testId } = props;\n\n  return (\n    <div data-testid={testId} className={styles['visual-contentgroup-with-image']}>\n      <div\n        className={classNames(styles['visual-contentgroup-with-image__frame'], {\n          [styles[`visual-contentgroup-with-image__frame--${imageRatio}`]]: imageRatio,\n        })}\n      >\n        {visualContent}\n      </div>\n      {children}\n    </div>\n  );\n};\n\nexport default VisualContentgroupWithImage;\n","import VisualContentgroupWithImage from './VisualContentgroupWithImage';\nexport * from './VisualContentgroupWithImage';\nexport default VisualContentgroupWithImage;\n"],"mappings":";;;;AAiBA,IAAM,+BAA0E,UAAS;CACvF,MAAM,EAAE,aAAa,UAAU,eAAe,UAAU,WAAW;CAEnE,OACE,qBAAC,OAAD;EAAK,eAAa;EAAQ,WAAW,OAAO;YAA5C,CACE,oBAAC,OAAD;GACE,WAAW,WAAW,OAAO,0CAA0C,GACpE,OAAO,0CAA0C,gBAAgB,WACpE,CAAC;aAEA;EACE,CAAA,GACJ,QACE;;AAET;;;AC9BA,IAAA,sCAAe"}

package/lib/components/VisualContentgroupWithImage/styles.module.scss

@@ -0,0 +1,50 @@
+@use 'sass:map';
+@use '../../scss/breakpoints' as breakpoints;
+@import '../../scss/supernova/styles/spacers.css';
+
+.visual-contentgroup-with-image {
+  display: flex;
+  flex-direction: column;
+  justify-content: start;
+  align-items: start;
+  gap: var(--core-space-l);
+
+  @media (min-width: map.get(breakpoints.$grid-breakpoints, sm)) {
+    flex-direction: row-reverse;
+  }
+
+  &__frame {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+    width: 100%;
+
+    > * {
+      width: 100%;
+      height: 100%;
+      object-fit: cover;
+    }
+
+    &--square {
+      aspect-ratio: 1/1;
+
+      @media (min-width: map.get(breakpoints.$grid-breakpoints, sm)) {
+        flex: 0 0 50%;
+      }
+
+      @media (min-width: map.get(breakpoints.$grid-breakpoints, lg)) {
+        max-width: 30rem;
+        max-height: 30rem;
+      }
+    }
+
+    &--landscape {
+      aspect-ratio: 3/2;
+
+      @media (min-width: map.get(breakpoints.$grid-breakpoints, sm)) {
+        flex: 0 0 50%;
+      }
+    }
+  }
+}

package/lib/components/VisualContentgroupWithImage/styles.module.scss.d.ts

@@ -0,0 +1,12 @@
+export type Styles = {
+  'visual-contentgroup-with-image': string;
+  'visual-contentgroup-with-image__frame': string;
+  'visual-contentgroup-with-image__frame--landscape': string;
+  'visual-contentgroup-with-image__frame--square': string;
+};
+
+export type ClassNames = keyof Styles;
+
+declare const styles: Styles;
+
+export default styles;

package/lib/getFilterChips.js

@@ -11,7 +11,7 @@ function getFilterChips({ filter, getLabel, onChipClick, onChipRemove, onOverflo
 	});
 	const visibleChips = allChips.slice(0, maxVisible);
 	const overflowCount = allChips.length - maxVisible;
-	return [visibleChips.map(({ key, value: v }) => /* @__PURE__ */ jsx(Chip_default, {
+	return [...visibleChips.map(({ key, value: v }) => /* @__PURE__ */ jsx(Chip_default, {
 		onChipClick: () => onChipClick(key, v),
 		onCloseClick: () => {
 			if (onChipRemove) onChipRemove(key, v);
@@ -19,11 +19,11 @@ function getFilterChips({ filter, getLabel, onChipClick, onChipRemove, onOverflo
 		},
 		withCloseButton: willShowCloseButton?.(key, v),
 		children: getLabel(key, v)
-	}, `${key}-${v}`)), overflowCount > 0 && /* @__PURE__ */ jsx(Chip_default, {
+	}, `${key}-${v}`)), ...overflowCount > 0 ? [/* @__PURE__ */ jsx(Chip_default, {
 		onChipClick: onOverflowChipClick,
 		withCloseButton: false,
 		children: `+${overflowCount}`
-	}, "overflow")];
+	}, "overflow")] : []];
 }
 //#endregion
 //#region src/components/Filter/getFilterChips/index.ts

package/lib/getFilterChips.js.map

@@ -1 +1 @@
-{"version":3,"file":"getFilterChips.js","names":[],"sources":["../src/components/Filter/getFilterChips/getFilterChips.tsx","../src/components/Filter/getFilterChips/index.ts"],"sourcesContent":["import type { FilterValues, UseFilterReturn } from '../useFilter';\n\nimport Chip from '../../Chip';\n\nexport interface GetFilterChipsArgs<T extends FilterValues> {\n  /** The filter instance from useFilter */\n  filter: UseFilterReturn<T>;\n  /** Look up the display label for a filter key + value */\n  getLabel: (key: keyof T, value: unknown) => string;\n  /** Called when a chip is clicked (f.ex. to open the drawer at that filter category) */\n  onChipClick: (key: keyof T, value: unknown) => void;\n  /** Called when a chip's close button is clicked. If not provided, defaults to filter.removeFilter */\n  onChipRemove?: (key: keyof T, value: unknown) => void;\n  /** Called when the overflow chip is clicked */\n  onOverflowChipClick: () => void;\n  /** Function for mapping if close button is shown on chip or not */\n  willShowCloseButton?: (key: keyof T, value?: unknown) => boolean;\n}\n\nfunction getFilterChips<T extends FilterValues>({\n  filter,\n  getLabel,\n  onChipClick,\n  onChipRemove,\n  onOverflowChipClick,\n  willShowCloseButton,\n}: GetFilterChipsArgs<T>): React.ReactNode[] {\n  const maxVisible = 5;\n\n  const allChips = Object.entries(filter.filters).flatMap(([key, raw]) => {\n    const values = [raw ?? []].flat();\n    return values.map(v => ({ key, value: v }));\n  });\n\n  const visibleChips = allChips.slice(0, maxVisible);\n  const overflowCount = allChips.length - maxVisible;\n\n  return [\n    visibleChips.map(({ key, value: v }) => (\n      <Chip\n        key={`${key}-${v}`}\n        onChipClick={() => onChipClick(key as keyof T, v)}\n        onCloseClick={() => {\n          if (onChipRemove) {\n            onChipRemove(key as keyof T, v);\n          } else {\n            filter.removeFilter(key, v);\n          }\n        }}\n        withCloseButton={willShowCloseButton?.(key, v)}\n      >\n        {getLabel(key as keyof T, v)}\n      </Chip>\n    )),\n    overflowCount > 0 && <Chip key=\"overflow\" onChipClick={onOverflowChipClick} withCloseButton={false}>{`+${overflowCount}`}</Chip>,\n  ];\n}\n\nexport default getFilterChips;\n","import getFilterChips from './getFilterChips';\nexport * from './getFilterChips';\nexport default getFilterChips;\n"],"mappings":";;;AAmBA,SAAS,eAAuC,EAC9C,QACA,UACA,aACA,cACA,qBACA,uBAC2C;CAC3C,MAAM,aAAa;CAEnB,MAAM,WAAW,OAAO,QAAQ,OAAO,OAAO,EAAE,SAAS,CAAC,KAAK,SAAS;EAEtE,OADe,CAAC,OAAO,CAAC,CAAC,EAAE,KACpB,EAAO,KAAI,OAAM;GAAE;GAAK,OAAO;EAAE,EAAE;CAC5C,CAAC;CAED,MAAM,eAAe,SAAS,MAAM,GAAG,UAAU;CACjD,MAAM,gBAAgB,SAAS,SAAS;CAExC,OAAO,CACL,aAAa,KAAK,EAAE,KAAK,OAAO,QAC9B,oBAAC,cAAD;EAEE,mBAAmB,YAAY,KAAgB,CAAC;EAChD,oBAAoB;GAClB,IAAI,cACF,aAAa,KAAgB,CAAC;QAE9B,OAAO,aAAa,KAAK,CAAC;EAE9B;EACA,iBAAiB,sBAAsB,KAAK,CAAC;YAE5C,SAAS,KAAgB,CAAC;CACvB,GAZC,GAAG,IAAI,GAAG,GAYX,CACP,GACD,gBAAgB,KAAK,oBAAC,cAAD;EAAqB,aAAa;EAAqB,iBAAiB;YAAQ,IAAI;CAAsB,GAAhG,UAAgG,CACjI;AACF;;;ACtDA,IAAA,yBAAe"}
+{"version":3,"file":"getFilterChips.js","names":[],"sources":["../src/components/Filter/getFilterChips/getFilterChips.tsx","../src/components/Filter/getFilterChips/index.ts"],"sourcesContent":["import type { FilterValues, UseFilterReturn } from '../useFilter';\n\nimport Chip from '../../Chip';\n\nexport interface GetFilterChipsArgs<T extends FilterValues> {\n  /** The filter instance from useFilter */\n  filter: UseFilterReturn<T>;\n  /** Look up the display label for a filter key + value */\n  getLabel: (key: keyof T, value: unknown) => string;\n  /** Called when a chip is clicked (f.ex. to open the drawer at that filter category) */\n  onChipClick: (key: keyof T, value: unknown) => void;\n  /** Called when a chip's close button is clicked. If not provided, defaults to filter.removeFilter */\n  onChipRemove?: (key: keyof T, value: unknown) => void;\n  /** Called when the overflow chip is clicked */\n  onOverflowChipClick: () => void;\n  /** Function for mapping if close button is shown on chip or not */\n  willShowCloseButton?: (key: keyof T, value?: unknown) => boolean;\n}\n\nfunction getFilterChips<T extends FilterValues>({\n  filter,\n  getLabel,\n  onChipClick,\n  onChipRemove,\n  onOverflowChipClick,\n  willShowCloseButton,\n}: GetFilterChipsArgs<T>): React.ReactNode[] {\n  const maxVisible = 5;\n\n  const allChips = Object.entries(filter.filters).flatMap(([key, raw]) => {\n    const values = [raw ?? []].flat();\n    return values.map(v => ({ key, value: v }));\n  });\n\n  const visibleChips = allChips.slice(0, maxVisible);\n  const overflowCount = allChips.length - maxVisible;\n\n  return [\n    ...visibleChips.map(({ key, value: v }) => (\n      <Chip\n        key={`${key}-${v}`}\n        onChipClick={() => onChipClick(key as keyof T, v)}\n        onCloseClick={() => {\n          if (onChipRemove) {\n            onChipRemove(key as keyof T, v);\n          } else {\n            filter.removeFilter(key, v);\n          }\n        }}\n        withCloseButton={willShowCloseButton?.(key, v)}\n      >\n        {getLabel(key as keyof T, v)}\n      </Chip>\n    )),\n    ...(overflowCount > 0\n      ? [<Chip key=\"overflow\" onChipClick={onOverflowChipClick} withCloseButton={false}>{`+${overflowCount}`}</Chip>]\n      : []),\n  ];\n}\n\nexport default getFilterChips;\n","import getFilterChips from './getFilterChips';\nexport * from './getFilterChips';\nexport default getFilterChips;\n"],"mappings":";;;AAmBA,SAAS,eAAuC,EAC9C,QACA,UACA,aACA,cACA,qBACA,uBAC2C;CAC3C,MAAM,aAAa;CAEnB,MAAM,WAAW,OAAO,QAAQ,OAAO,OAAO,EAAE,SAAS,CAAC,KAAK,SAAS;EAEtE,OADe,CAAC,OAAO,CAAC,CAAC,EAAE,KACpB,EAAO,KAAI,OAAM;GAAE;GAAK,OAAO;EAAE,EAAE;CAC5C,CAAC;CAED,MAAM,eAAe,SAAS,MAAM,GAAG,UAAU;CACjD,MAAM,gBAAgB,SAAS,SAAS;CAExC,OAAO,CACL,GAAG,aAAa,KAAK,EAAE,KAAK,OAAO,QACjC,oBAAC,cAAD;EAEE,mBAAmB,YAAY,KAAgB,CAAC;EAChD,oBAAoB;GAClB,IAAI,cACF,aAAa,KAAgB,CAAC;QAE9B,OAAO,aAAa,KAAK,CAAC;EAE9B;EACA,iBAAiB,sBAAsB,KAAK,CAAC;YAE5C,SAAS,KAAgB,CAAC;CACvB,GAZC,GAAG,IAAI,GAAG,GAYX,CACP,GACD,GAAI,gBAAgB,IAChB,CAAC,oBAAC,cAAD;EAAqB,aAAa;EAAqB,iBAAiB;YAAQ,IAAI;CAAsB,GAAhG,UAAgG,CAAC,IAC5G,CAAC,CACP;AACF;;;ACxDA,IAAA,yBAAe"}

package/lib/resourceHelper.js

@@ -9,7 +9,8 @@ var HN_Designsystem_Filter_en_GB_default = {
 	searchClearButtonAriaLabel: "Reset",
 	searchButtonAriaLabel: "Search",
 	loadingText: "Loading results",
-	resultsText: "{0} results"
+	resultsText: "{0} results",
+	activeFiltersListLabel: "Aktive filter"
 };
 var HN_Designsystem_Filter_nb_NO_default = {
 	filterButtonText: "Finn ...",
@@ -21,13 +22,42 @@ var HN_Designsystem_Filter_nb_NO_default = {
 	searchClearButtonAriaLabel: "Nullstill",
 	searchButtonAriaLabel: "Søk",
 	loadingText: "Henter treff",
-	resultsText: "{0} treff"
+	resultsText: "{0} treff",
+	activeFiltersListLabel: "Aktive filter"
+};
+var HN_Designsystem_Filter_nn_NO_default = {
+	filterButtonText: "Finn ...",
+	sortLabel: "Sortering",
+	resetButtonText: "Nullstill",
+	showButtonText: "Vis treff",
+	filterOverviewTitle: "Finn ...",
+	searchPlaceholder: "Søk i lista",
+	searchClearButtonAriaLabel: "Nullstill",
+	searchButtonAriaLabel: "Søk",
+	loadingText: "Hentar treff",
+	resultsText: "{0} treff",
+	activeFiltersListLabel: "Aktive filter"
+};
+var HN_Designsystem_Filter_se_NO_default = {
+	filterButtonText: "Oza ...",
+	sortLabel: "Sirren",
+	resetButtonText: "Bija ruovttuluotta",
+	showButtonText: "Čájet deaivan",
+	filterOverviewTitle: "Oza ...",
+	searchPlaceholder: "Oza listtus",
+	searchClearButtonAriaLabel: "Bija ruovttuluotta",
+	searchButtonAriaLabel: "Oza",
+	loadingText: "Viežžá",
+	resultsText: "{0} deaivan",
+	activeFiltersListLabel: "Aktive filter"
 };
 //#endregion
 //#region src/components/Filter/resourceHelper.ts
 var getResources = (language) => {
 	switch (language) {
 		case LanguageLocales.ENGLISH: return HN_Designsystem_Filter_en_GB_default;
+		case LanguageLocales.NORWEGIAN_NYNORSK: return HN_Designsystem_Filter_nn_NO_default;
+		case LanguageLocales.SAMI_NORTHERN: return HN_Designsystem_Filter_se_NO_default;
 		case LanguageLocales.NORWEGIAN:
 		default: return HN_Designsystem_Filter_nb_NO_default;
 	}

package/lib/resourceHelper.js.map

@@ -1 +1 @@
-{"version":3,"file":"resourceHelper.js","names":[],"sources":["../src/resources/HN.Designsystem.Filter.en-GB.json","../src/resources/HN.Designsystem.Filter.nb-NO.json","../src/components/Filter/resourceHelper.ts"],"sourcesContent":["{\n  \"filterButtonText\": \"Find ...\",\n  \"sortLabel\": \"Sorting\",\n  \"resetButtonText\": \"Reset\",\n  \"showButtonText\": \"Show results\",\n  \"filterOverviewTitle\": \"Find ...\",\n  \"searchPlaceholder\": \"Search the list\",\n  \"searchClearButtonAriaLabel\": \"Reset\",\n  \"searchButtonAriaLabel\": \"Search\",\n  \"loadingText\": \"Loading results\",\n  \"resultsText\": \"{0} results\"\n}\n","{\n  \"filterButtonText\": \"Finn ...\",\n  \"sortLabel\": \"Sortering\",\n  \"resetButtonText\": \"Nullstill\",\n  \"showButtonText\": \"Vis treff\",\n  \"filterOverviewTitle\": \"Finn ...\",\n  \"searchPlaceholder\": \"Søk i listen\",\n  \"searchClearButtonAriaLabel\": \"Nullstill\",\n  \"searchButtonAriaLabel\": \"Søk\",\n  \"loadingText\": \"Henter treff\",\n  \"resultsText\": \"{0} treff\"\n}\n","import type { HNDesignsystemFilter } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.Filter.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.Filter.nb-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemFilter => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AEMA,IAAa,gBAAgB,aAAoD;CAC/E,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;CACX;AACF"}
+{"version":3,"file":"resourceHelper.js","names":[],"sources":["../src/resources/HN.Designsystem.Filter.en-GB.json","../src/resources/HN.Designsystem.Filter.nb-NO.json","../src/resources/HN.Designsystem.Filter.nn-NO.json","../src/resources/HN.Designsystem.Filter.se-NO.json","../src/components/Filter/resourceHelper.ts"],"sourcesContent":["{\n  \"filterButtonText\": \"Find ...\",\n  \"sortLabel\": \"Sorting\",\n  \"resetButtonText\": \"Reset\",\n  \"showButtonText\": \"Show results\",\n  \"filterOverviewTitle\": \"Find ...\",\n  \"searchPlaceholder\": \"Search the list\",\n  \"searchClearButtonAriaLabel\": \"Reset\",\n  \"searchButtonAriaLabel\": \"Search\",\n  \"loadingText\": \"Loading results\",\n  \"resultsText\": \"{0} results\",\n  \"activeFiltersListLabel\": \"Aktive filter\"\n}\n","{\n  \"filterButtonText\": \"Finn ...\",\n  \"sortLabel\": \"Sortering\",\n  \"resetButtonText\": \"Nullstill\",\n  \"showButtonText\": \"Vis treff\",\n  \"filterOverviewTitle\": \"Finn ...\",\n  \"searchPlaceholder\": \"Søk i listen\",\n  \"searchClearButtonAriaLabel\": \"Nullstill\",\n  \"searchButtonAriaLabel\": \"Søk\",\n  \"loadingText\": \"Henter treff\",\n  \"resultsText\": \"{0} treff\",\n  \"activeFiltersListLabel\": \"Aktive filter\"\n}\n","{\n  \"filterButtonText\": \"Finn ...\",\n  \"sortLabel\": \"Sortering\",\n  \"resetButtonText\": \"Nullstill\",\n  \"showButtonText\": \"Vis treff\",\n  \"filterOverviewTitle\": \"Finn ...\",\n  \"searchPlaceholder\": \"Søk i lista\",\n  \"searchClearButtonAriaLabel\": \"Nullstill\",\n  \"searchButtonAriaLabel\": \"Søk\",\n  \"loadingText\": \"Hentar treff\",\n  \"resultsText\": \"{0} treff\",\n  \"activeFiltersListLabel\": \"Aktive filter\"\n}\n","{\n  \"filterButtonText\": \"Oza ...\",\n  \"sortLabel\": \"Sirren\",\n  \"resetButtonText\": \"Bija ruovttuluotta\",\n  \"showButtonText\": \"Čájet deaivan\",\n  \"filterOverviewTitle\": \"Oza ...\",\n  \"searchPlaceholder\": \"Oza listtus\",\n  \"searchClearButtonAriaLabel\": \"Bija ruovttuluotta\",\n  \"searchButtonAriaLabel\": \"Oza\",\n  \"loadingText\": \"Viežžá\",\n  \"resultsText\": \"{0} deaivan\",\n  \"activeFiltersListLabel\": \"Aktive filter\"\n}\n","import type { HNDesignsystemFilter } from '../../resources/Resources';\n\nimport { LanguageLocales } from '../../constants';\nimport enGB from '../../resources/HN.Designsystem.Filter.en-GB.json';\nimport nbNO from '../../resources/HN.Designsystem.Filter.nb-NO.json';\nimport nnNO from '../../resources/HN.Designsystem.Filter.nn-NO.json';\nimport seNO from '../../resources/HN.Designsystem.Filter.se-NO.json';\n\nexport const getResources = (language: LanguageLocales): HNDesignsystemFilter => {\n  switch (language) {\n    case LanguageLocales.ENGLISH:\n      return enGB;\n    case LanguageLocales.NORWEGIAN_NYNORSK:\n      return nnNO;\n    case LanguageLocales.SAMI_NORTHERN:\n      return seNO;\n    case LanguageLocales.NORWEGIAN:\n    default:\n      return nbNO;\n  }\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AIQA,IAAa,gBAAgB,aAAoD;CAC/E,QAAQ,UAAR;EACE,KAAK,gBAAgB,SACnB,OAAO;EACT,KAAK,gBAAgB,mBACnB,OAAO;EACT,KAAK,gBAAgB,eACnB,OAAO;EACT,KAAK,gBAAgB;EACrB,SACE,OAAO;CACX;AACF"}

package/lib/resources/HN.Designsystem.Drawer.se-NO.json.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+  "ariaLabelCloseBtn": "Gidde",
+  "ariaLabelBackButton": "Mana ruovttoluotta"
+}
+;
+
+export default _default;

package/lib/resources/HN.Designsystem.Filter.en-GB.json.d.ts

@@ -8,7 +8,8 @@ declare const _default: {
   "searchClearButtonAriaLabel": "Reset",
   "searchButtonAriaLabel": "Search",
   "loadingText": "Loading results",
-  "resultsText": "{0} results"
+  "resultsText": "{0} results",
+  "activeFiltersListLabel": "Aktive filter"
 }
 ;
 

package/lib/resources/HN.Designsystem.Filter.nb-NO.json.d.ts

@@ -8,7 +8,8 @@ declare const _default: {
   "searchClearButtonAriaLabel": "Nullstill",
   "searchButtonAriaLabel": "Søk",
   "loadingText": "Henter treff",
-  "resultsText": "{0} treff"
+  "resultsText": "{0} treff",
+  "activeFiltersListLabel": "Aktive filter"
 }
 ;
 

package/lib/resources/HN.Designsystem.Filter.nn-NO.json.d.ts

@@ -0,0 +1,16 @@
+declare const _default: {
+  "filterButtonText": "Finn ...",
+  "sortLabel": "Sortering",
+  "resetButtonText": "Nullstill",
+  "showButtonText": "Vis treff",
+  "filterOverviewTitle": "Finn ...",
+  "searchPlaceholder": "Søk i lista",
+  "searchClearButtonAriaLabel": "Nullstill",
+  "searchButtonAriaLabel": "Søk",
+  "loadingText": "Hentar treff",
+  "resultsText": "{0} treff",
+  "activeFiltersListLabel": "Aktive filter"
+}
+;
+
+export default _default;

package/lib/resources/HN.Designsystem.Filter.se-NO.json.d.ts

@@ -0,0 +1,16 @@
+declare const _default: {
+  "filterButtonText": "Oza ...",
+  "sortLabel": "Sirren",
+  "resetButtonText": "Bija ruovttuluotta",
+  "showButtonText": "Čájet deaivan",
+  "filterOverviewTitle": "Oza ...",
+  "searchPlaceholder": "Oza listtus",
+  "searchClearButtonAriaLabel": "Bija ruovttuluotta",
+  "searchButtonAriaLabel": "Oza",
+  "loadingText": "Viežžá",
+  "resultsText": "{0} deaivan",
+  "activeFiltersListLabel": "Aktive filter"
+}
+;
+
+export default _default;

package/lib/resources/HN.Designsystem.Tabs.se-NO.json.d.ts

@@ -0,0 +1,7 @@
+declare const _default: {
+  "ariaLabelRightButton": "Sirdde olgeš guvlui",
+  "ariaLabelLeftButton": "Sirdde gurut guvlui"
+}
+;
+
+export default _default;

package/lib/resources/Resources.d.ts

@@ -187,6 +187,10 @@ export type HNDesignsystemFilter = {
    * {0} treff
    */
   resultsText: string;
+  /**
+   * Aktive filter
+   */
+  activeFiltersListLabel: string;
 };
 
 export type HNDesignsystemChip = {

package/package.json

@@ -2,7 +2,7 @@
   "name": "@helsenorge/designsystem-react",
   "sideEffects": false,
   "private": false,
-  "version": "15.0.0",
+  "version": "15.2.0",
   "description": "The official design system for Helsenorge built with React.",
   "repository": {
     "type": "git",
@@ -834,11 +834,26 @@
       "import": "./lib/components/VisualRadioGroup/index.js",
       "require": "./lib/components/VisualRadioGroup/index.js",
       "default": "./lib/components/VisualRadioGroup/index.js"
-    }
+    },
+    "./scss/body": "./scss/_body.scss",
+    "./scss/breakpoints": "./scss/_breakpoints.scss",
+    "./scss/font-mixins": "./scss/_font-mixins.scss",
+    "./scss/font-settings": "./scss/_font-settings.scss",
+    "./scss/fonts": "./scss/_fonts.scss",
+    "./scss/grid": "./scss/_grid.scss",
+    "./scss/icon": "./scss/_icon.scss",
+    "./scss/input": "./scss/_input.scss",
+    "./scss/palette": "./scss/_palette.scss",
+    "./scss/print": "./scss/_print.scss",
+    "./scss/radio-reset": "./scss/_radio-reset.scss",
+    "./scss/reset": "./scss/_reset.scss",
+    "./scss/screen-reader": "./scss/_screen-reader.scss",
+    "./scss/spacers": "./scss/_spacers.scss",
+    "./scss/visual-form": "./scss/_visual-form.scss"
   },
   "scripts": {
     "start": "storybook dev -p 3000",
-    "prebuild": "npm-run-all link-scss clean generate:iconnames generate:illustrationnames generate:cssdefinitions",
+    "prebuild": "npm-run-all link-scss clean generate:iconnames generate:illustrationnames generate:cssdefinitions generate:scssexports",
     "build": "vite build",
     "postbuild": "node ../build-tools/lib/copy.js --root ../../CHANGELOG.md --include \"src/scss/**/*\" \"src/fonts/**/*\" \"src/components/**/*.module.scss*\" && npm run link-scss",
     "link-scss": "node __scripts__/link-root-scss.mjs",
@@ -851,6 +866,7 @@
     "generate:iconnames": "node __scripts__/generateIconNames.mjs",
     "generate:illustrationnames": "node __scripts__/generateIllustrationNames.mjs",
     "generate:cssdefinitions": "typed-scss-modules \"src/**/*.module.scss\" --nameFormat none --exportType default --includePaths node_modules ../../node_modules",
+    "generate:scssexports": "node __scripts__/gen-scss-exports.mjs",
     "eslint": "eslint \"src/**/*.{ts,tsx}\"",
     "eslint:fix": "npm run eslint -- --fix",
     "stylelint": "stylelint \"src/**/*.{css,scss}\"",