@helsenorge/designsystem-react 7.13.4 → 8.0.1

package/components/Validation/ValidationSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"ValidationSummary.js","sources":["../../../src/components/Validation/ValidationSummary.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport ErrorList from './ErrorList';\nimport { ValidationErrors } from './types';\nimport { useUuid } from '../../hooks/useUuid';\nimport Title, { TitleTags } from '../Title';\n\nimport styles from './styles.module.scss';\n\ninterface ValidationSummaryProps {\n  /** Error summary title */\n  errorTitle?: string;\n  /** Error list */\n  errors?: ValidationErrors;\n  /** Markup props for error summary title. Default: h2 */\n  errorTitleHtmlMarkup?: TitleTags;\n  /** Will be shown last */\n  children?: React.ReactNode;\n}\n\nconst ValidationSummary: React.FC<ValidationSummaryProps> = props => {\n  const { errorTitleHtmlMarkup = 'h2' } = props;\n  const titleId = useUuid();\n\n  const summaryClasses = classNames(\n    styles['validation-summary'],\n    !!props.errors && Object.entries(props.errors).length > 0 && styles['validation-summary--visible']\n  );\n\n  return (\n    <div role={'alert'} aria-live={'polite'} aria-relevant={'all'} aria-labelledby={titleId} className={summaryClasses}>\n      {!!props.errors && Object.entries(props.errors).length > 0 && (\n        <>\n          <Title appearance=\"title4\" id={titleId} htmlMarkup={errorTitleHtmlMarkup} margin={{ marginTop: 0, marginBottom: 1 }}>\n            {props.errorTitle}\n          </Title>\n          <ErrorList errors={props.errors} />\n        </>\n      )}\n      {props.children}\n    </div>\n  );\n};\n\nexport default ValidationSummary;\n"],"names":["ValidationSummary","props","errorTitleHtmlMarkup","titleId","useUuid","summaryClasses","classNames","styles","React","Title","ErrorList"],"mappings":";;;;;;AAsBA,MAAMA,IAAsD,CAASC,MAAA;AAC7D,QAAA,EAAE,sBAAAC,IAAuB,KAAS,IAAAD,GAClCE,IAAUC,KAEVC,IAAiBC;AAAA,IACrBC,EAAO,oBAAoB;AAAA,IAC3B,CAAC,CAACN,EAAM,UAAU,OAAO,QAAQA,EAAM,MAAM,EAAE,SAAS,KAAKM,EAAO,6BAA6B;AAAA,EAAA;AAIjG,SAAAC,gBAAAA,EAAA,cAAC,SAAI,MAAM,SAAS,aAAW,UAAU,iBAAe,OAAO,mBAAiBL,GAAS,WAAWE,KACjG,CAAC,CAACJ,EAAM,UAAU,OAAO,QAAQA,EAAM,MAAM,EAAE,SAAS,KAErDO,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MAAAA,gBAAAA,EAAA,cAACC,KAAM,YAAW,UAAS,IAAIN,GAAS,YAAYD,GAAsB,QAAQ,EAAE,WAAW,GAAG,cAAc,OAC7GD,EAAM,UACT,GACAO,gBAAAA,EAAA,cAACE,GAAU,EAAA,QAAQT,EAAM,OAAQ,CAAA,CACnC,GAEDA,EAAM,QACT;AAEJ;"}
+{"version":3,"file":"ValidationSummary.js","sources":["../../../src/components/Validation/ValidationSummary.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport ErrorList from './ErrorList';\nimport { ValidationErrors } from './types';\nimport { useUuid } from '../../hooks/useUuid';\nimport Title, { TitleTags } from '../Title';\n\nimport styles from './styles.module.scss';\n\ninterface ValidationSummaryProps {\n  /** Error summary title */\n  errorTitle?: string;\n  /** Error list */\n  errors?: ValidationErrors;\n  /** Markup props for error summary title. Default: h2 */\n  errorTitleHtmlMarkup?: TitleTags;\n  /** Will be shown last */\n  children?: React.ReactNode;\n}\n\nconst ValidationSummary: React.FC<ValidationSummaryProps> = props => {\n  const { errorTitleHtmlMarkup = 'h2' } = props;\n  const titleId = useUuid();\n\n  const summaryClasses = classNames(\n    styles['validation__summary'],\n    !!props.errors && Object.entries(props.errors).length > 0 && styles['validation__summary--visible']\n  );\n\n  return (\n    <div role={'alert'} aria-live={'polite'} aria-relevant={'all'} aria-labelledby={titleId} className={summaryClasses}>\n      {!!props.errors && Object.entries(props.errors).length > 0 && (\n        <>\n          <Title appearance=\"title4\" id={titleId} htmlMarkup={errorTitleHtmlMarkup} margin={{ marginTop: 0, marginBottom: 1 }}>\n            {props.errorTitle}\n          </Title>\n          <ErrorList errors={props.errors} />\n        </>\n      )}\n      {props.children}\n    </div>\n  );\n};\n\nexport default ValidationSummary;\n"],"names":["ValidationSummary","props","errorTitleHtmlMarkup","titleId","useUuid","summaryClasses","classNames","styles","React","Title","ErrorList"],"mappings":";;;;;;AAsBA,MAAMA,IAAsD,CAASC,MAAA;AAC7D,QAAA,EAAE,sBAAAC,IAAuB,KAAS,IAAAD,GAClCE,IAAUC,KAEVC,IAAiBC;AAAA,IACrBC,EAAO;AAAA,IACP,CAAC,CAACN,EAAM,UAAU,OAAO,QAAQA,EAAM,MAAM,EAAE,SAAS,KAAKM,EAAO,8BAA8B;AAAA,EAAA;AAIlG,SAAAC,gBAAAA,EAAA,cAAC,SAAI,MAAM,SAAS,aAAW,UAAU,iBAAe,OAAO,mBAAiBL,GAAS,WAAWE,KACjG,CAAC,CAACJ,EAAM,UAAU,OAAO,QAAQA,EAAM,MAAM,EAAE,SAAS,KAErDO,gBAAAA,EAAA,cAAAA,EAAA,UAAA,MAAAA,gBAAAA,EAAA,cAACC,KAAM,YAAW,UAAS,IAAIN,GAAS,YAAYD,GAAsB,QAAQ,EAAE,WAAW,GAAG,cAAc,OAC7GD,EAAM,UACT,GACAO,gBAAAA,EAAA,cAACE,GAAU,EAAA,QAAQT,EAAM,OAAQ,CAAA,CACnC,GAEDA,EAAM,QACT;AAEJ;"}

package/components/Validation/styles.module.scss

@@ -1,26 +1,32 @@
+@use 'sass:map';
+@import '../../scss/breakpoints';
 @import '../../scss/spacers';
 @import '../../scss/palette';
 @import '../../scss/font-settings';
 
-.validation-summary {
-  color: $cherry600;
+.validation {
+  &__error-wrapper {
+    padding-bottom: getSpacer(m);
 
-  &--visible {
-    margin: getSpacer(l) 0 getSpacer(s);
+    @media (min-width: map.get($grid-breakpoints, md)) {
+      padding-bottom: getSpacer(l);
+    }
   }
-}
 
-.validation-errors {
-  font-size: $font-size-sm;
-  font-weight: 600;
+  &__summary {
+    color: $cherry600;
 
-  &--visible {
-    margin: getSpacer(l) 0 getSpacer(s);
+    &--visible {
+      margin: getSpacer(l) 0 getSpacer(s);
+    }
   }
-}
 
-.form-group-wrapper {
-  &--error-sibling {
-    padding-bottom: 0 !important;
+  &__errors {
+    font-size: $font-size-sm;
+    font-weight: 600;
+
+    &--visible {
+      margin: getSpacer(l) 0 getSpacer(s);
+    }
   }
 }

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

@@ -1,9 +1,9 @@
 export type Styles = {
-  'form-group-wrapper--error-sibling': string;
-  'validation-errors': string;
-  'validation-errors--visible': string;
-  'validation-summary': string;
-  'validation-summary--visible': string;
+  'validation__error-wrapper': string;
+  validation__errors: string;
+  'validation__errors--visible': string;
+  validation__summary: string;
+  'validation__summary--visible': string;
 };
 
 export type ClassNames = keyof Styles;

package/constants.d.ts

@@ -10,7 +10,8 @@ export declare enum ZIndex {
     Modal = 1300000,
     PopOver = 11000,
     ExpanderTrigger = 10000,
-    OverlayScreen = 9999
+    OverlayScreen = 9999,
+    LightBoxButtons = 1000
 }
 export declare const AVERAGE_CHARACTER_WIDTH_PX = 12;
 export interface HTMLButtonProps {
@@ -56,6 +57,7 @@ export declare enum AnalyticsId {
     Badge = "badge",
     Button = "button",
     Checkbox = "checkbox",
+    Chip = "chip",
     Close = "close",
     DictionaryTrigger = "dictionary-trigger",
     Dropdown = "dropdown",
@@ -66,11 +68,12 @@ export declare enum AnalyticsId {
     ExpanderHierarchyExpander = "expander-hierarchy-expander",
     ExpanderList = "expander-list",
     ExpanderListExpander = "expander-list-expander",
+    EyebrowHeader = "eyebrow-header",
     FormGroup = "form-group",
     FormLayout = "form-layout",
     HelpBubble = "help-bubble",
     HelpQuestion = "help-question",
-    HighlightBox = "highlight-box",
+    HighlightPanel = "highlight-panel",
     Icon = "icon",
     Illustration = "Illustration",
     Input = "input",

package/constants.js

@@ -1,6 +1,6 @@
-var e = /* @__PURE__ */ ((r) => (r[r.XXSmall = 24] = "XXSmall", r[r.XSmall = 38] = "XSmall", r[r.Small = 48] = "Small", r[r.Medium = 64] = "Medium", r[r.Large = 80] = "Large", r[r.XLarge = 130] = "XLarge", r))(e || {}), o = /* @__PURE__ */ ((r) => (r[r.Modal = 13e5] = "Modal", r[r.PopOver = 11e3] = "PopOver", r[r.ExpanderTrigger = 1e4] = "ExpanderTrigger", r[r.OverlayScreen = 9999] = "OverlayScreen", r))(o || {});
+var e = /* @__PURE__ */ ((r) => (r[r.XXSmall = 24] = "XXSmall", r[r.XSmall = 38] = "XSmall", r[r.Small = 48] = "Small", r[r.Medium = 64] = "Medium", r[r.Large = 80] = "Large", r[r.XLarge = 130] = "XLarge", r))(e || {}), o = /* @__PURE__ */ ((r) => (r[r.Modal = 13e5] = "Modal", r[r.PopOver = 11e3] = "PopOver", r[r.ExpanderTrigger = 1e4] = "ExpanderTrigger", r[r.OverlayScreen = 9999] = "OverlayScreen", r[r.LightBoxButtons = 1e3] = "LightBoxButtons", r))(o || {});
 const g = 12;
-var p = /* @__PURE__ */ ((r) => (r.onwhite = "onwhite", r.ongrey = "ongrey", r.onblueberry = "onblueberry", r.ondark = "ondark", r.oninvalid = "oninvalid", r))(p || {}), a = /* @__PURE__ */ ((r) => (r.medium = "medium", r.large = "large", r))(a || {}), t = /* @__PURE__ */ ((r) => (r.AnchorLink = "anchor-link", r.Avatar = "avatar", r.Badge = "badge", r.Button = "button", r.Checkbox = "checkbox", r.Close = "close", r.DictionaryTrigger = "dictionary-trigger", r.Dropdown = "dropdown", r.Duolist = "duolist", r.EmptyState = "empty-state", r.Expander = "expander", r.ExpanderHierarchy = "expander-hierarchy", r.ExpanderHierarchyExpander = "expander-hierarchy-expander", r.ExpanderList = "expander-list", r.ExpanderListExpander = "expander-list-expander", r.FormGroup = "form-group", r.FormLayout = "form-layout", r.HelpBubble = "help-bubble", r.HelpQuestion = "help-question", r.HighlightBox = "highlight-box", r.Icon = "icon", r.Illustration = "Illustration", r.Input = "input", r.Label = "label", r.Link = "link", r.LinkList = "link-list", r.List = "list", r.Loader = "loader", r.Logo = "logo", r.Modal = "modal", r.NotificationPanel = "notification-panel", r.Panel = "panel", r.PanelList = "panel-list", r.PopMenu = "pop-menu", r.PopOver = "pop-over", r.Portal = "portal", r.PromoPanel = "promo-panel", r.RadioButton = "radio-button", r.Select = "select", r.SharingStatus = "sharing-status", r.Slider = "slider", r.Spacer = "spacer", r.StatusDot = "status-dot", r.Step = "step", r.StepButtons = "step-buttons", r.Stepper = "stepper", r.Sublabel = "sublabel", r.Table = "table", r.Tag = "tag", r.TagList = "tag-list", r.Textarea = "textarea", r.Tile = "tile", r.Title = "title", r.Tooltip = "tooltip", r.Trigger = "trigger", r.Validation = "validation", r))(t || {}), u = /* @__PURE__ */ ((r) => (r.Enter = "Enter", r.Escape = "Escape", r.ArrowDown = "ArrowDown", r.ArrowUp = "ArrowUp", r.ArrowRight = "ArrowRight", r.ArrowLeft = "ArrowLeft", r.Home = "Home", r.End = "End", r.Space = " ", r.Tab = "Tab", r))(u || {});
+var p = /* @__PURE__ */ ((r) => (r.onwhite = "onwhite", r.ongrey = "ongrey", r.onblueberry = "onblueberry", r.ondark = "ondark", r.oninvalid = "oninvalid", r))(p || {}), a = /* @__PURE__ */ ((r) => (r.medium = "medium", r.large = "large", r))(a || {}), t = /* @__PURE__ */ ((r) => (r.AnchorLink = "anchor-link", r.Avatar = "avatar", r.Badge = "badge", r.Button = "button", r.Checkbox = "checkbox", r.Chip = "chip", r.Close = "close", r.DictionaryTrigger = "dictionary-trigger", r.Dropdown = "dropdown", r.Duolist = "duolist", r.EmptyState = "empty-state", r.Expander = "expander", r.ExpanderHierarchy = "expander-hierarchy", r.ExpanderHierarchyExpander = "expander-hierarchy-expander", r.ExpanderList = "expander-list", r.ExpanderListExpander = "expander-list-expander", r.EyebrowHeader = "eyebrow-header", r.FormGroup = "form-group", r.FormLayout = "form-layout", r.HelpBubble = "help-bubble", r.HelpQuestion = "help-question", r.HighlightPanel = "highlight-panel", r.Icon = "icon", r.Illustration = "Illustration", r.Input = "input", r.Label = "label", r.Link = "link", r.LinkList = "link-list", r.List = "list", r.Loader = "loader", r.Logo = "logo", r.Modal = "modal", r.NotificationPanel = "notification-panel", r.Panel = "panel", r.PanelList = "panel-list", r.PopMenu = "pop-menu", r.PopOver = "pop-over", r.Portal = "portal", r.PromoPanel = "promo-panel", r.RadioButton = "radio-button", r.Select = "select", r.SharingStatus = "sharing-status", r.Slider = "slider", r.Spacer = "spacer", r.StatusDot = "status-dot", r.Step = "step", r.StepButtons = "step-buttons", r.Stepper = "stepper", r.Sublabel = "sublabel", r.Table = "table", r.Tag = "tag", r.TagList = "tag-list", r.Textarea = "textarea", r.Tile = "tile", r.Title = "title", r.Tooltip = "tooltip", r.Trigger = "trigger", r.Validation = "validation", r))(t || {}), u = /* @__PURE__ */ ((r) => (r.Enter = "Enter", r.Escape = "Escape", r.ArrowDown = "ArrowDown", r.ArrowUp = "ArrowUp", r.ArrowRight = "ArrowRight", r.ArrowLeft = "ArrowLeft", r.Home = "Home", r.End = "End", r.Space = " ", r.Tab = "Tab", r))(u || {});
 export {
   g as AVERAGE_CHARACTER_WIDTH_PX,
   t as AnalyticsId,

package/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n  XXSmall = 24,\n  XSmall = 38,\n  Small = 48,\n  Medium = 64,\n  Large = 80,\n  XLarge = 130,\n}\n\nexport enum ZIndex {\n  Modal = 1300000,\n  PopOver = 11000,\n  // TODO: Skille mellom ExpanderTrigger isSticky og isHovered? Skulle tro isHovered trenger vesentlig mindre z-index\n  ExpanderTrigger = 10000,\n  OverlayScreen = 9999,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n  autoFocus?: boolean;\n  disabled?: boolean;\n  form?: string;\n  formAction?: string;\n  formEncType?: string;\n  formMethod?: string;\n  formNoValidate?: boolean;\n  formTarget?: string;\n  name?: string;\n  type?: 'submit' | 'reset' | 'button' | string;\n  value?: string | string[] | number;\n  id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n  download?: string;\n  href?: string;\n  hrefLang?: string;\n  media?: string;\n  ping?: string;\n  rel?: AnchorTarget;\n  target?: string;\n  referrerPolicy?:\n    | ''\n    | 'same-origin'\n    | 'no-referrer'\n    | 'no-referrer-when-downgrade'\n    | 'origin'\n    | 'origin-when-cross-origin'\n    | 'strict-origin'\n    | 'strict-origin-when-cross-origin'\n    | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormMode {\n  onwhite = 'onwhite',\n  ongrey = 'ongrey',\n  onblueberry = 'onblueberry',\n  ondark = 'ondark',\n  oninvalid = 'oninvalid',\n}\n\nexport enum FormSize {\n  medium = 'medium',\n  large = 'large',\n}\n\nexport enum AnalyticsId {\n  AnchorLink = 'anchor-link',\n  Avatar = 'avatar',\n  Badge = 'badge',\n  Button = 'button',\n  Checkbox = 'checkbox',\n  Close = 'close',\n  DictionaryTrigger = 'dictionary-trigger',\n  Dropdown = 'dropdown',\n  Duolist = 'duolist',\n  EmptyState = 'empty-state',\n  Expander = 'expander',\n  ExpanderHierarchy = 'expander-hierarchy',\n  ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n  ExpanderList = 'expander-list',\n  ExpanderListExpander = 'expander-list-expander',\n  FormGroup = 'form-group',\n  FormLayout = 'form-layout',\n  HelpBubble = 'help-bubble',\n  HelpQuestion = 'help-question',\n  HighlightBox = 'highlight-box',\n  Icon = 'icon',\n  Illustration = 'Illustration',\n  Input = 'input',\n  Label = 'label',\n  Link = 'link',\n  LinkList = 'link-list',\n  List = 'list',\n  Loader = 'loader',\n  Logo = 'logo',\n  Modal = 'modal',\n  NotificationPanel = 'notification-panel',\n  Panel = 'panel',\n  PanelList = 'panel-list',\n  PopMenu = 'pop-menu',\n  PopOver = 'pop-over',\n  Portal = 'portal',\n  PromoPanel = 'promo-panel',\n  RadioButton = 'radio-button',\n  Select = 'select',\n  SharingStatus = 'sharing-status',\n  Slider = 'slider',\n  Spacer = 'spacer',\n  StatusDot = 'status-dot',\n  Step = 'step',\n  StepButtons = 'step-buttons',\n  Stepper = 'stepper',\n  Sublabel = 'sublabel',\n  Table = 'table',\n  Tag = 'tag',\n  TagList = 'tag-list',\n  Textarea = 'textarea',\n  Tile = 'tile',\n  Title = 'title',\n  Tooltip = 'tooltip',\n  Trigger = 'trigger',\n  Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n  Enter = 'Enter',\n  Escape = 'Escape',\n  ArrowDown = 'ArrowDown',\n  ArrowUp = 'ArrowUp',\n  ArrowRight = 'ArrowRight',\n  ArrowLeft = 'ArrowLeft',\n  Home = 'Home',\n  End = 'End',\n  Space = ' ',\n  Tab = 'Tab',\n}\n"],"names":["IconSize","ZIndex","AVERAGE_CHARACTER_WIDTH_PX","FormMode","FormSize","AnalyticsId","KeyboardEventKey"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAAA,EAAA,UAAU,EAAV,IAAA,WACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,GAAT,IAAA,UANUA,IAAAA,KAAA,CAAA,CAAA,GASAC,sBAAAA,OACVA,EAAAA,EAAA,QAAQ,IAAR,IAAA,SACAA,EAAAA,EAAA,UAAU,IAAV,IAAA,WAEAA,EAAAA,EAAA,kBAAkB,GAAlB,IAAA,mBACAA,EAAAA,EAAA,gBAAgB,IAAhB,IAAA,iBALUA,IAAAA,KAAA,CAAA,CAAA;AAQL,MAAMC,IAA6B;AAyC9B,IAAAC,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,SAAS,UACTA,EAAA,cAAc,eACdA,EAAA,SAAS,UACTA,EAAA,YAAY,aALFA,IAAAA,KAAA,CAAA,CAAA,GAQAC,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA,GAKAC,sBAAAA,OACVA,EAAA,aAAa,eACbA,EAAA,SAAS,UACTA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,WAAW,YACXA,EAAA,UAAU,WACVA,EAAA,aAAa,eACbA,EAAA,WAAW,YACXA,EAAA,oBAAoB,sBACpBA,EAAA,4BAA4B,+BAC5BA,EAAA,eAAe,iBACfA,EAAA,uBAAuB,0BACvBA,EAAA,YAAY,cACZA,EAAA,aAAa,eACbA,EAAA,aAAa,eACbA,EAAA,eAAe,iBACfA,EAAA,eAAe,iBACfA,EAAA,OAAO,QACPA,EAAA,eAAe,gBACfA,EAAA,QAAQ,SACRA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,WAAW,aACXA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,QAAQ,SACRA,EAAA,YAAY,cACZA,EAAA,UAAU,YACVA,EAAA,UAAU,YACVA,EAAA,SAAS,UACTA,EAAA,aAAa,eACbA,EAAA,cAAc,gBACdA,EAAA,SAAS,UACTA,EAAA,gBAAgB,kBAChBA,EAAA,SAAS,UACTA,EAAA,SAAS,UACTA,EAAA,YAAY,cACZA,EAAA,OAAO,QACPA,EAAA,cAAc,gBACdA,EAAA,UAAU,WACVA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,MAAM,OACNA,EAAA,UAAU,YACVA,EAAA,WAAW,YACXA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,aAAa,cAxDHA,IAAAA,KAAA,CAAA,CAAA,GA2DAC,sBAAAA,OACVA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,YAAY,aACZA,EAAA,UAAU,WACVA,EAAA,aAAa,cACbA,EAAA,YAAY,aACZA,EAAA,OAAO,QACPA,EAAA,MAAM,OACNA,EAAA,QAAQ,KACRA,EAAA,MAAM,OAVIA,IAAAA,KAAA,CAAA,CAAA;"}
+{"version":3,"file":"constants.js","sources":["../src/constants.ts"],"sourcesContent":["export enum IconSize {\n  XXSmall = 24,\n  XSmall = 38,\n  Small = 48,\n  Medium = 64,\n  Large = 80,\n  XLarge = 130,\n}\n\nexport enum ZIndex {\n  Modal = 1300000,\n  PopOver = 11000,\n  // TODO: Skille mellom ExpanderTrigger isSticky og isHovered? Skulle tro isHovered trenger vesentlig mindre z-index\n  ExpanderTrigger = 10000,\n  OverlayScreen = 9999,\n  LightBoxButtons = 1000,\n}\n\nexport const AVERAGE_CHARACTER_WIDTH_PX = 12;\n\nexport interface HTMLButtonProps {\n  autoFocus?: boolean;\n  disabled?: boolean;\n  form?: string;\n  formAction?: string;\n  formEncType?: string;\n  formMethod?: string;\n  formNoValidate?: boolean;\n  formTarget?: string;\n  name?: string;\n  type?: 'submit' | 'reset' | 'button' | string;\n  value?: string | string[] | number;\n  id?: string;\n}\n\nexport type AnchorTarget = '_self' | '_blank' | '_parent' | '_top';\n\nexport interface HTMLAnchorProps {\n  download?: string;\n  href?: string;\n  hrefLang?: string;\n  media?: string;\n  ping?: string;\n  rel?: AnchorTarget;\n  target?: string;\n  referrerPolicy?:\n    | ''\n    | 'same-origin'\n    | 'no-referrer'\n    | 'no-referrer-when-downgrade'\n    | 'origin'\n    | 'origin-when-cross-origin'\n    | 'strict-origin'\n    | 'strict-origin-when-cross-origin'\n    | 'unsafe-url';\n}\n\nexport type ButtonVariant = 'secondary' | 'tertiary' | string | undefined | null;\n\nexport enum FormMode {\n  onwhite = 'onwhite',\n  ongrey = 'ongrey',\n  onblueberry = 'onblueberry',\n  ondark = 'ondark',\n  oninvalid = 'oninvalid',\n}\n\nexport enum FormSize {\n  medium = 'medium',\n  large = 'large',\n}\n\nexport enum AnalyticsId {\n  AnchorLink = 'anchor-link',\n  Avatar = 'avatar',\n  Badge = 'badge',\n  Button = 'button',\n  Checkbox = 'checkbox',\n  Chip = 'chip',\n  Close = 'close',\n  DictionaryTrigger = 'dictionary-trigger',\n  Dropdown = 'dropdown',\n  Duolist = 'duolist',\n  EmptyState = 'empty-state',\n  Expander = 'expander',\n  ExpanderHierarchy = 'expander-hierarchy',\n  ExpanderHierarchyExpander = 'expander-hierarchy-expander',\n  ExpanderList = 'expander-list',\n  ExpanderListExpander = 'expander-list-expander',\n  EyebrowHeader = 'eyebrow-header',\n  FormGroup = 'form-group',\n  FormLayout = 'form-layout',\n  HelpBubble = 'help-bubble',\n  HelpQuestion = 'help-question',\n  HighlightPanel = 'highlight-panel',\n  Icon = 'icon',\n  Illustration = 'Illustration',\n  Input = 'input',\n  Label = 'label',\n  Link = 'link',\n  LinkList = 'link-list',\n  List = 'list',\n  Loader = 'loader',\n  Logo = 'logo',\n  Modal = 'modal',\n  NotificationPanel = 'notification-panel',\n  Panel = 'panel',\n  PanelList = 'panel-list',\n  PopMenu = 'pop-menu',\n  PopOver = 'pop-over',\n  Portal = 'portal',\n  PromoPanel = 'promo-panel',\n  RadioButton = 'radio-button',\n  Select = 'select',\n  SharingStatus = 'sharing-status',\n  Slider = 'slider',\n  Spacer = 'spacer',\n  StatusDot = 'status-dot',\n  Step = 'step',\n  StepButtons = 'step-buttons',\n  Stepper = 'stepper',\n  Sublabel = 'sublabel',\n  Table = 'table',\n  Tag = 'tag',\n  TagList = 'tag-list',\n  Textarea = 'textarea',\n  Tile = 'tile',\n  Title = 'title',\n  Tooltip = 'tooltip',\n  Trigger = 'trigger',\n  Validation = 'validation',\n}\n\nexport enum KeyboardEventKey {\n  Enter = 'Enter',\n  Escape = 'Escape',\n  ArrowDown = 'ArrowDown',\n  ArrowUp = 'ArrowUp',\n  ArrowRight = 'ArrowRight',\n  ArrowLeft = 'ArrowLeft',\n  Home = 'Home',\n  End = 'End',\n  Space = ' ',\n  Tab = 'Tab',\n}\n"],"names":["IconSize","ZIndex","AVERAGE_CHARACTER_WIDTH_PX","FormMode","FormSize","AnalyticsId","KeyboardEventKey"],"mappings":"AAAY,IAAAA,sBAAAA,OACVA,EAAAA,EAAA,UAAU,EAAV,IAAA,WACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,EAAT,IAAA,UACAA,EAAAA,EAAA,QAAQ,EAAR,IAAA,SACAA,EAAAA,EAAA,SAAS,GAAT,IAAA,UANUA,IAAAA,KAAA,CAAA,CAAA,GASAC,sBAAAA,OACVA,EAAAA,EAAA,QAAQ,IAAR,IAAA,SACAA,EAAAA,EAAA,UAAU,IAAV,IAAA,WAEAA,EAAAA,EAAA,kBAAkB,GAAlB,IAAA,mBACAA,EAAAA,EAAA,gBAAgB,IAAhB,IAAA,iBACAA,EAAAA,EAAA,kBAAkB,GAAlB,IAAA,mBANUA,IAAAA,KAAA,CAAA,CAAA;AASL,MAAMC,IAA6B;AAyC9B,IAAAC,sBAAAA,OACVA,EAAA,UAAU,WACVA,EAAA,SAAS,UACTA,EAAA,cAAc,eACdA,EAAA,SAAS,UACTA,EAAA,YAAY,aALFA,IAAAA,KAAA,CAAA,CAAA,GAQAC,sBAAAA,OACVA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAFEA,IAAAA,KAAA,CAAA,CAAA,GAKAC,sBAAAA,OACVA,EAAA,aAAa,eACbA,EAAA,SAAS,UACTA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,WAAW,YACXA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,WAAW,YACXA,EAAA,UAAU,WACVA,EAAA,aAAa,eACbA,EAAA,WAAW,YACXA,EAAA,oBAAoB,sBACpBA,EAAA,4BAA4B,+BAC5BA,EAAA,eAAe,iBACfA,EAAA,uBAAuB,0BACvBA,EAAA,gBAAgB,kBAChBA,EAAA,YAAY,cACZA,EAAA,aAAa,eACbA,EAAA,aAAa,eACbA,EAAA,eAAe,iBACfA,EAAA,iBAAiB,mBACjBA,EAAA,OAAO,QACPA,EAAA,eAAe,gBACfA,EAAA,QAAQ,SACRA,EAAA,QAAQ,SACRA,EAAA,OAAO,QACPA,EAAA,WAAW,aACXA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,oBAAoB,sBACpBA,EAAA,QAAQ,SACRA,EAAA,YAAY,cACZA,EAAA,UAAU,YACVA,EAAA,UAAU,YACVA,EAAA,SAAS,UACTA,EAAA,aAAa,eACbA,EAAA,cAAc,gBACdA,EAAA,SAAS,UACTA,EAAA,gBAAgB,kBAChBA,EAAA,SAAS,UACTA,EAAA,SAAS,UACTA,EAAA,YAAY,cACZA,EAAA,OAAO,QACPA,EAAA,cAAc,gBACdA,EAAA,UAAU,WACVA,EAAA,WAAW,YACXA,EAAA,QAAQ,SACRA,EAAA,MAAM,OACNA,EAAA,UAAU,YACVA,EAAA,WAAW,YACXA,EAAA,OAAO,QACPA,EAAA,QAAQ,SACRA,EAAA,UAAU,WACVA,EAAA,UAAU,WACVA,EAAA,aAAa,cA1DHA,IAAAA,KAAA,CAAA,CAAA,GA6DAC,sBAAAA,OACVA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,YAAY,aACZA,EAAA,UAAU,WACVA,EAAA,aAAa,cACbA,EAAA,YAAY,aACZA,EAAA,OAAO,QACPA,EAAA,MAAM,OACNA,EAAA,QAAQ,KACRA,EAAA,MAAM,OAVIA,IAAAA,KAAA,CAAA,CAAA;"}

package/package.json

@@ -7,15 +7,15 @@
     "url": "git+https://github.com/helsenorge/designsystem.git"
   },
   "homepage": "https://helsenorge.design",
-  "version": "7.13.4",
+  "version": "8.0.1",
   "author": "Helsenorge",
   "license": "MIT",
   "peerDependencies": {
     "bootstrap": "^4.6.2",
     "classnames": "^2.3.2",
     "normalize.css": "^8.0.1",
-    "react": "^17.0.0",
-    "react-dom": "^17.0.0"
+    "react": "^17.0.0 || ^18.0.0",
+    "react-dom": "^17.0.0 || ^18.0.0"
   },
   "sideEffects": false
 }

package/scss/supernova/index.css

@@ -1,3 +1,3 @@
 /* This file was generated by Supernova and should not be changed manually */
-@import "./colors.css";
-@import "./typography.css";
+@import './colors.css';
+@import './typography.css';

package/scss/supernova/styles/colors.css

@@ -170,4 +170,4 @@
   /* Subtle border for Blueberry 50 background */
   --color-base-border-blueberry: #afdae3;
   --color-base-border-cherry: #eec0a5;
-}
+}

package/utils/tests/setup-test.d.ts

@@ -1,4 +1,4 @@
-import '@testing-library/jest-dom/extend-expect';
+import '@testing-library/jest-dom';
 import '../../__mocks__/matchMedia';
 import '../../__mocks__/IntersectionObserver';
 import '../../__mocks__/ResizeObserver';

package/_virtual/assert.js

@@ -1,5 +0,0 @@
-var e = { exports: {} };
-export {
-  e as __module
-};
-//# sourceMappingURL=assert.js.map

package/_virtual/assert.js.map

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

package/_virtual/ast.js

@@ -1,5 +0,0 @@
-var a = { exports: {} };
-export {
-  a as __module
-};
-//# sourceMappingURL=ast.js.map

package/_virtual/ast.js.map

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

package/_virtual/code.js

@@ -1,5 +0,0 @@
-var e = { exports: {} };
-export {
-  e as __module
-};
-//# sourceMappingURL=code.js.map

package/_virtual/code.js.map

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

package/_virtual/doctrine.js

@@ -1,5 +0,0 @@
-var r = {};
-export {
-  r as __exports
-};
-//# sourceMappingURL=doctrine.js.map

package/_virtual/doctrine.js.map

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

package/_virtual/errors.js

@@ -1,5 +0,0 @@
-var r = {};
-export {
-  r as __exports
-};
-//# sourceMappingURL=errors.js.map

package/_virtual/errors.js.map

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

package/_virtual/index.js

@@ -1,5 +0,0 @@
-var a = { exports: {} };
-export {
-  a as __module
-};
-//# sourceMappingURL=index.js.map

package/_virtual/inherits_browser.js

@@ -1,5 +0,0 @@
-var r = { exports: {} };
-export {
-  r as __module
-};
-//# sourceMappingURL=inherits_browser.js.map

package/_virtual/inherits_browser.js.map

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

package/_virtual/keyword.js

@@ -1,5 +0,0 @@
-var e = { exports: {} };
-export {
-  e as __module
-};
-//# sourceMappingURL=keyword.js.map

package/_virtual/keyword.js.map

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

package/_virtual/typed.js

@@ -1,5 +0,0 @@
-var e = {};
-export {
-  e as __exports
-};
-//# sourceMappingURL=typed.js.map

package/_virtual/typed.js.map

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

package/_virtual/types.js

@@ -1,5 +0,0 @@
-var e = {};
-export {
-  e as __exports
-};
-//# sourceMappingURL=types.js.map

package/_virtual/types.js.map

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

package/_virtual/util.js

@@ -1,5 +0,0 @@
-var r = {};
-export {
-  r as __exports
-};
-//# sourceMappingURL=util.js.map

package/_virtual/util.js.map

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

package/_virtual/utility.js

@@ -1,5 +0,0 @@
-var t = {};
-export {
-  t as __exports
-};
-//# sourceMappingURL=utility.js.map

package/_virtual/utility.js.map

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

package/_virtual/utils.js

@@ -1,5 +0,0 @@
-var r = {};
-export {
-  r as __exports
-};
-//# sourceMappingURL=utils.js.map

package/_virtual/utils.js.map

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

package/components/HighlightBox/HighlightBox.js

@@ -1,61 +0,0 @@
-import e from "react";
-import l from "classnames";
-import "../../theme/grid.js";
-import { useBreakpoint as w, Breakpoint as y } from "../../hooks/useBreakpoint.js";
-import { AnalyticsId as p, IconSize as N } from "../../constants.js";
-import { Icon as C } from "../Icon/Icon.js";
-import { LazyIcon as W } from "../LazyIcon/LazyIcon.js";
-import { Title as z } from "../Title/Title.js";
-import t from "../HighlightBox/styles.module.scss";
-var B = /* @__PURE__ */ ((i) => (i.medium = "medium", i.large = "large", i.fluid = "fluid", i))(B || {});
-const u = ({ className: i, size: r, children: s }) => /* @__PURE__ */ e.createElement("div", { className: i, "data-testid": "highlightbox-wrapper" }, /* @__PURE__ */ e.createElement("div", { className: t.highlightbox__row }, /* @__PURE__ */ e.createElement("div", { className: l(t.highlightbox__col, r === "medium" && t["highlightbox__col--offset"]) }, s))), x = (i) => {
-  const { children: r, className: s } = i, a = l(t["highlightbox__content-wrapper"], s);
-  return /* @__PURE__ */ e.createElement("div", { className: a }, /* @__PURE__ */ e.createElement("div", { className: l(t.highlightbox__row) }, r));
-}, j = (i) => {
-  const {
-    children: r,
-    color: s = "white",
-    size: a = "medium",
-    testId: c,
-    svgIcon: n,
-    htmlMarkup: b = "div",
-    className: v,
-    contentWrapperClassName: I,
-    title: d,
-    titleHtmlMarkup: k = "h2"
-  } = i, _ = w(), o = l(
-    t[`highlightbox--${s}`],
-    t[`highlightbox--${a}`],
-    n && t["highlightbox--has-icon"],
-    { container: a === "medium" || a === "large" },
-    v
-  ), m = () => {
-    if (n) {
-      const f = a === "large" && _ && _ >= y.md ? N.Medium : N.Small, E = /* @__PURE__ */ e.createElement(z, { testId: "titleId", htmlMarkup: k, appearance: "title4" }, d);
-      return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: t.highlightbox__icon }, typeof n == "string" ? /* @__PURE__ */ e.createElement(W, { iconName: n, size: f }) : /* @__PURE__ */ e.createElement(C, { svgIcon: n, size: f }), d && /* @__PURE__ */ e.createElement("div", { className: t.mobile }, E)), /* @__PURE__ */ e.createElement("div", { className: t.highlightbox__content }, d && /* @__PURE__ */ e.createElement("div", { className: t.desktop, "aria-hidden": "true" }, E), r));
-    }
-    return r;
-  }, h = b, g = l(t["highlightbox__content-wrapper"], I);
-  return a === "medium" ? /* @__PURE__ */ e.createElement(u, { className: o, size: a }, /* @__PURE__ */ e.createElement(h, { className: g, "data-testid": c, "data-analyticsid": p.HighlightBox }, m())) : a === "large" && n ? /* @__PURE__ */ e.createElement(u, { className: o, size: a }, /* @__PURE__ */ e.createElement(x, { className: g }, /* @__PURE__ */ e.createElement(
-    h,
-    {
-      className: l(t.highlightbox__col, t["highlightbox__col--large-with-icon"]),
-      "data-testid": c,
-      "data-analyticsid": p.HighlightBox
-    },
-    m()
-  ))) : a === "large" ? /* @__PURE__ */ e.createElement(u, { className: o, size: a }, /* @__PURE__ */ e.createElement(x, { className: g }, /* @__PURE__ */ e.createElement(
-    h,
-    {
-      className: l(t.highlightbox__col, t["highlightbox__col--offset"]),
-      "data-testid": c,
-      "data-analyticsid": p.HighlightBox
-    },
-    m()
-  ))) : a === "fluid" ? /* @__PURE__ */ e.createElement(h, { className: o, "data-testid": c }, m()) : null;
-};
-export {
-  B as HighlightBoxSize,
-  j as default
-};
-//# sourceMappingURL=HighlightBox.js.map

package/components/HighlightBox/HighlightBox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HighlightBox.js","sources":["../../../src/components/HighlightBox/HighlightBox.tsx"],"sourcesContent":["import React from 'react';\n\nimport classNames from 'classnames';\n\nimport { useBreakpoint, Breakpoint } from '../..';\nimport { AnalyticsId } from '../../constants';\nimport { PaletteNames } from '../../theme/palette';\nimport Icon, { SvgIcon, IconSize } from '../Icon';\nimport { IconName } from '../Icons/IconNames';\nimport LazyIcon from '../LazyIcon';\nimport Title, { TitleTags } from '../Title';\n\nimport styles from './styles.module.scss';\n\nexport type HighlightBoxColors = Extract<PaletteNames, 'white' | 'neutral' | 'blueberry' | 'cherry'>;\n\nexport enum HighlightBoxSize {\n  medium = 'medium',\n  large = 'large',\n  fluid = 'fluid',\n}\n\nexport type HighlightBoxTags = Exclude<\n  keyof HTMLElementTagNameMap,\n  'dir' | 'font' | 'frame' | 'frameset' | 'marquee' | 'applet' | 'basefont' | 'search'\n>;\n\nexport interface HighlightBoxProps {\n  /** What's in the box? */\n  children: React.ReactNode;\n  /** Changes the background color. Default: white */\n  color?: HighlightBoxColors;\n  /** Changes the size. Default: medium */\n  size?: keyof typeof HighlightBoxSize;\n  /** Adds an icon to the highlightbox. */\n  svgIcon?: SvgIcon | IconName;\n  /** Changes the underlying element. Default: div */\n  htmlMarkup?: HighlightBoxTags;\n  /** Adds custom classes to the element. */\n  className?: string;\n  /** Adds custom classes to the content-wrapper */\n  contentWrapperClassName?: string;\n  /** Sets the data-testid attribute. */\n  testId?: string;\n  /** Element that is set after the icon-element in the DOM, often a title-element */\n  title?: string;\n  /** Markup props for title */\n  titleHtmlMarkup?: TitleTags;\n}\n\ninterface WrapperProps {\n  className: string;\n  size?: keyof typeof HighlightBoxSize;\n}\n\nconst Wrapper: React.FC<WrapperProps> = ({ className, size, children }) => (\n  <div className={className} data-testid={'highlightbox-wrapper'}>\n    <div className={styles.highlightbox__row}>\n      <div className={classNames(styles.highlightbox__col, size === HighlightBoxSize.medium && styles['highlightbox__col--offset'])}>\n        {children}\n      </div>\n    </div>\n  </div>\n);\n\ninterface ContentWrapperProps {\n  children: React.ReactNode;\n  className?: string;\n}\n\nconst ContentWrapper: React.FC<ContentWrapperProps> = props => {\n  const { children, className } = props;\n  const contentWrapperClasses = classNames(styles['highlightbox__content-wrapper'], className);\n\n  return (\n    <div className={contentWrapperClasses}>\n      <div className={classNames(styles.highlightbox__row)}>{children}</div>\n    </div>\n  );\n};\n\nconst HighlightBox: React.FC<HighlightBoxProps> = props => {\n  const {\n    children,\n    color = 'white',\n    size = HighlightBoxSize.medium,\n    testId,\n    svgIcon,\n    htmlMarkup = 'div',\n    className,\n    contentWrapperClassName,\n    title,\n    titleHtmlMarkup = 'h2',\n  } = props;\n  const breakpoint = useBreakpoint();\n\n  const containerClassName = classNames(\n    styles[`highlightbox--${color}`],\n    styles[`highlightbox--${size}`],\n    svgIcon && styles['highlightbox--has-icon'],\n    { container: size === 'medium' || size === 'large' },\n    className\n  );\n\n  const renderContent = () => {\n    if (svgIcon) {\n      const iconSize = size === HighlightBoxSize.large && breakpoint && breakpoint >= Breakpoint.md ? IconSize.Medium : IconSize.Small;\n\n      const titleElement = (\n        <Title testId=\"titleId\" htmlMarkup={titleHtmlMarkup} appearance=\"title4\">\n          {title}\n        </Title>\n      );\n\n      return (\n        <>\n          <div className={styles.highlightbox__icon}>\n            {typeof svgIcon === 'string' ? <LazyIcon iconName={svgIcon} size={iconSize} /> : <Icon svgIcon={svgIcon} size={iconSize} />}\n            {title && <div className={styles['mobile']}>{titleElement}</div>}\n          </div>\n          <div className={styles.highlightbox__content}>\n            {title && (\n              <div className={styles['desktop']} aria-hidden=\"true\">\n                {titleElement}\n              </div>\n            )}\n            {children}\n          </div>\n        </>\n      );\n    }\n\n    return children;\n  };\n\n  const CustomTag = htmlMarkup;\n\n  const contentWrapperClasses = classNames(styles['highlightbox__content-wrapper'], contentWrapperClassName);\n\n  if (size === HighlightBoxSize.medium) {\n    return (\n      <Wrapper className={containerClassName} size={size}>\n        <CustomTag className={contentWrapperClasses} data-testid={testId} data-analyticsid={AnalyticsId.HighlightBox}>\n          {renderContent()}\n        </CustomTag>\n      </Wrapper>\n    );\n  }\n\n  if (size === HighlightBoxSize.large && svgIcon) {\n    return (\n      <Wrapper className={containerClassName} size={size}>\n        <ContentWrapper className={contentWrapperClasses}>\n          <CustomTag\n            className={classNames(styles.highlightbox__col, styles['highlightbox__col--large-with-icon'])}\n            data-testid={testId}\n            data-analyticsid={AnalyticsId.HighlightBox}\n          >\n            {renderContent()}\n          </CustomTag>\n        </ContentWrapper>\n      </Wrapper>\n    );\n  }\n\n  if (size === HighlightBoxSize.large) {\n    return (\n      <Wrapper className={containerClassName} size={size}>\n        <ContentWrapper className={contentWrapperClasses}>\n          <CustomTag\n            className={classNames(styles.highlightbox__col, styles['highlightbox__col--offset'])}\n            data-testid={testId}\n            data-analyticsid={AnalyticsId.HighlightBox}\n          >\n            {renderContent()}\n          </CustomTag>\n        </ContentWrapper>\n      </Wrapper>\n    );\n  }\n\n  if (size === HighlightBoxSize.fluid) {\n    return (\n      <CustomTag className={containerClassName} data-testid={testId}>\n        {renderContent()}\n      </CustomTag>\n    );\n  }\n\n  return null;\n};\n\nexport default HighlightBox;\n"],"names":["HighlightBoxSize","Wrapper","className","size","children","React","styles","classNames","ContentWrapper","props","contentWrapperClasses","HighlightBox","color","testId","svgIcon","htmlMarkup","contentWrapperClassName","title","titleHtmlMarkup","breakpoint","useBreakpoint","containerClassName","renderContent","iconSize","Breakpoint","IconSize","titleElement","Title","LazyIcon","Icon","CustomTag","AnalyticsId"],"mappings":"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"}

package/components/HighlightBox/index.d.ts

@@ -1,3 +0,0 @@
-import HighlightBox from './HighlightBox';
-export * from './HighlightBox';
-export default HighlightBox;

package/components/HighlightBox/index.js

@@ -1,7 +0,0 @@
-import i from "./HighlightBox.js";
-import { HighlightBoxSize as e } from "./HighlightBox.js";
-export {
-  e as HighlightBoxSize,
-  i as default
-};
-//# sourceMappingURL=index.js.map

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

@@ -1,25 +0,0 @@
-export type Styles = {
-  desktop: string;
-  highlightbox__col: string;
-  'highlightbox__col--large-with-icon': string;
-  'highlightbox__col--offset': string;
-  highlightbox__content: string;
-  'highlightbox__content-wrapper': string;
-  highlightbox__icon: string;
-  highlightbox__row: string;
-  'highlightbox--blueberry': string;
-  'highlightbox--cherry': string;
-  'highlightbox--fluid': string;
-  'highlightbox--has-icon': string;
-  'highlightbox--large': string;
-  'highlightbox--medium': string;
-  'highlightbox--neutral': string;
-  'highlightbox--white': string;
-  mobile: string;
-};
-
-export type ClassNames = keyof Styles;
-
-declare const styles: Styles;
-
-export default styles;