@norges-domstoler/dds-components 0.0.0-dev-20240614081021 → 0.0.0-dev-20240618064403

package/dist/index.mjs

@@ -413,7 +413,6 @@ var Input_default = {
   input: "Input_input",
   disabled: "Input_disabled",
   "read-only": "Input_read-only",
-  active: "Input_active",
   "input--stateful": "Input_input--stateful",
   "input--hover": "Input_input--hover",
   "input--stateful-danger": "Input_input--stateful-danger",
@@ -5868,6 +5867,7 @@ function _DateInput({
             className: cn(
               Input_default.input,
               Input_default["input--stateful"],
+              Input_default["input--hover"],
               Input_default[`input--${componentSize}`],
               hasErrorMessage && Input_default["input--stateful-danger"],
               DateInput_default["date-input"],
@@ -8659,7 +8659,7 @@ var ModalActions = forwardRef52(
 ModalActions.displayName = "ModalActions";
 
 // src/components/Pagination/Pagination.tsx
-import { forwardRef as forwardRef54, useState as useState18 } from "react";
+import { forwardRef as forwardRef55, useState as useState18 } from "react";
 
 // src/components/Pagination/Pagination.module.css
 var Pagination_default = {
@@ -9248,7 +9248,15 @@ function SelectInner(props, ref) {
       ),
       style: { ...style, width },
       children: [
-        hasLabel && /* @__PURE__ */ jsx240(Label, { htmlFor: uniqueId, showRequiredStyling, children: label }),
+        hasLabel && /* @__PURE__ */ jsx240(
+          Label,
+          {
+            htmlFor: uniqueId,
+            showRequiredStyling,
+            className: Input_default.label,
+            children: label
+          }
+        ),
         /* @__PURE__ */ jsx240(ReactSelect, { ...reactSelectProps, ref }),
         renderInputMessage(tip, tipId, errorMessage, errorMessageId)
       ]
@@ -9258,12 +9266,122 @@ function SelectInner(props, ref) {
 var Select = forwardRef53(SelectInner);
 Select.displayName = "Select";
 
+// src/components/Select/NativeSelect/NativeSelect.tsx
+import { forwardRef as forwardRef54, useId as useId16 } from "react";
+
+// src/components/Select/NativeSelect/NativeSelect.module.css
+var NativeSelect_default = {
+  container: "NativeSelect_container",
+  select: "NativeSelect_select",
+  "select--readonly": "NativeSelect_select--readonly",
+  "select--medium": "NativeSelect_select--medium",
+  "select--small": "NativeSelect_select--small",
+  "select--tiny": "NativeSelect_select--tiny",
+  icon: "NativeSelect_icon"
+};
+
+// src/components/Select/NativeSelect/NativeSelect.tsx
+import { jsx as jsx241, jsxs as jsxs55 } from "react/jsx-runtime";
+var NativeSelect = forwardRef54(
+  (props, ref) => {
+    const {
+      id,
+      children,
+      componentSize = "medium",
+      label,
+      multiple,
+      readOnly,
+      errorMessage,
+      tip,
+      required,
+      "aria-required": ariaRequired,
+      "aria-describedby": ariaDescribedby,
+      width,
+      className,
+      style,
+      ...rest
+    } = props;
+    const generatedId = useId16();
+    const uniqueId = id != null ? id : `${generatedId}-native-select`;
+    const hasErrorMessage = !!errorMessage;
+    const hasTip = !!tip;
+    const hasLabel = !!label;
+    const tipId = derivativeIdGenerator(uniqueId, "tip");
+    const errorMessageId = derivativeIdGenerator(uniqueId, "errorMessage");
+    const showRequiredStyling = !!(required || ariaRequired);
+    const styleVariables = {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      ["--dds-native-select-width"]: width ? width : componentSize === "tiny" ? "210px" : "var(--dds-input-default-width)"
+    };
+    return /* @__PURE__ */ jsxs55("div", { children: [
+      hasLabel && /* @__PURE__ */ jsx241(
+        Label,
+        {
+          className: Input_default.label,
+          htmlFor: uniqueId,
+          showRequiredStyling,
+          children: label
+        }
+      ),
+      /* @__PURE__ */ jsxs55("div", { className: NativeSelect_default.container, children: [
+        /* @__PURE__ */ jsx241(
+          "select",
+          {
+            ref,
+            id: uniqueId,
+            multiple,
+            className: cn(
+              className,
+              NativeSelect_default.select,
+              readOnly && NativeSelect_default["select--readonly"],
+              Input_default.input,
+              Input_default[`input--${componentSize}`],
+              NativeSelect_default[`select--${componentSize}`],
+              scrollbar,
+              focusable,
+              typographyStyles_default[getTypographyCn(inputTypographyTypes[componentSize])],
+              hasErrorMessage && Input_default["input--stateful-danger"]
+            ),
+            tabIndex: readOnly ? -1 : 0,
+            style: { ...style, ...styleVariables },
+            "aria-readonly": readOnly,
+            "aria-invalid": hasErrorMessage,
+            "aria-describedby": spaceSeparatedIdListGenerator([
+              hasTip ? tipId : void 0,
+              hasErrorMessage ? errorMessageId : void 0,
+              ariaDescribedby
+            ]),
+            required,
+            ...rest,
+            children
+          }
+        ),
+        !multiple && /* @__PURE__ */ jsx241(
+          Icon,
+          {
+            icon: ChevronDownIcon,
+            iconSize: componentSize === "tiny" ? "small" : "medium",
+            className: NativeSelect_default.icon
+          }
+        )
+      ] }),
+      renderInputMessage(tip, tipId, errorMessage, errorMessageId)
+    ] });
+  }
+);
+NativeSelect.displayName = "NativeSelect";
+var NativeSelectPlaceholder = forwardRef54((props, ref) => {
+  const { children = "-- Velg fra listen --", value, ...rest } = props;
+  return /* @__PURE__ */ jsx241("option", { ref, value: value != null ? value : "", selected: true, ...rest, children });
+});
+NativeSelectPlaceholder.displayName = "NativeSelectPlaceholder";
+
 // src/components/Select/utils.ts
 var createSelectOptions = (...args) => args.map((v2) => ({ label: v2, value: v2 }));
 
 // src/components/Pagination/Pagination.tsx
-import { jsx as jsx241, jsxs as jsxs55 } from "react/jsx-runtime";
-var Pagination = forwardRef54(
+import { jsx as jsx242, jsxs as jsxs56 } from "react/jsx-runtime";
+var Pagination = forwardRef55(
   (props, ref) => {
     const {
       itemsAmount,
@@ -9306,7 +9424,7 @@ var Pagination = forwardRef54(
     };
     const listItems = items.length > 0 ? items.map((item, i2) => {
       const isActive = item === activePage;
-      return /* @__PURE__ */ jsx241("li", { className: Pagination_default.list__item, children: item !== "truncator" ? /* @__PURE__ */ jsx241(
+      return /* @__PURE__ */ jsx242("li", { className: Pagination_default.list__item, children: item !== "truncator" ? /* @__PURE__ */ jsx242(
         Button,
         {
           purpose: isActive ? "primary" : "secondary",
@@ -9317,7 +9435,7 @@ var Pagination = forwardRef54(
           "aria-label": isActive ? `N\xE5v\xE6rende side (side ${item})` : `G\xE5 til side ${item}`,
           children: item
         }
-      ) : /* @__PURE__ */ jsx241(
+      ) : /* @__PURE__ */ jsx242(
         Icon,
         {
           icon: MoreHorizontalIcon,
@@ -9325,7 +9443,7 @@ var Pagination = forwardRef54(
         }
       ) }, `pagination-item-${i2}`);
     }) : void 0;
-    const previousPageButton = /* @__PURE__ */ jsx241(
+    const previousPageButton = /* @__PURE__ */ jsx242(
       Button,
       {
         purpose: "secondary",
@@ -9337,7 +9455,7 @@ var Pagination = forwardRef54(
         "aria-label": "G\xE5 til forrige siden"
       }
     );
-    const nextPageButton = /* @__PURE__ */ jsx241(
+    const nextPageButton = /* @__PURE__ */ jsx242(
       Button,
       {
         purpose: "secondary",
@@ -9354,8 +9472,8 @@ var Pagination = forwardRef54(
     } : { className: Pagination_default.nav };
     const isOnFirstPage = activePage === 1;
     const isOnLastPage = activePage === pagesLength;
-    const navigation = withPagination ? /* @__PURE__ */ jsx241("nav", { ref, "aria-label": "paginering", ...navProps, children: /* @__PURE__ */ jsxs55("ol", { className: Pagination_default.list, children: [
-      /* @__PURE__ */ jsx241(
+    const navigation = withPagination ? /* @__PURE__ */ jsx242("nav", { ref, "aria-label": "paginering", ...navProps, children: /* @__PURE__ */ jsxs56("ol", { className: Pagination_default.list, children: [
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9367,7 +9485,7 @@ var Pagination = forwardRef54(
         }
       ),
       listItems,
-      /* @__PURE__ */ jsx241(
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9379,8 +9497,8 @@ var Pagination = forwardRef54(
         }
       )
     ] }) }) : null;
-    const smallScreenNavigation = withPagination ? /* @__PURE__ */ jsx241("nav", { ref, "aria-label": "paginering", ...navProps, children: /* @__PURE__ */ jsxs55("ol", { className: Pagination_default.list, children: [
-      /* @__PURE__ */ jsx241(
+    const smallScreenNavigation = withPagination ? /* @__PURE__ */ jsx242("nav", { ref, "aria-label": "paginering", ...navProps, children: /* @__PURE__ */ jsxs56("ol", { className: Pagination_default.list, children: [
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9388,7 +9506,7 @@ var Pagination = forwardRef54(
             isOnFirstPage && Pagination_default["list__item--hidden"]
           ),
           "aria-hidden": isOnFirstPage,
-          children: /* @__PURE__ */ jsx241(
+          children: /* @__PURE__ */ jsx242(
             Button,
             {
               purpose: "secondary",
@@ -9402,7 +9520,7 @@ var Pagination = forwardRef54(
           )
         }
       ),
-      /* @__PURE__ */ jsx241(
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9413,7 +9531,7 @@ var Pagination = forwardRef54(
           children: previousPageButton
         }
       ),
-      /* @__PURE__ */ jsx241("li", { className: Pagination_default.list__item, children: /* @__PURE__ */ jsx241(
+      /* @__PURE__ */ jsx242("li", { className: Pagination_default.list__item, children: /* @__PURE__ */ jsx242(
         Button,
         {
           size: "small",
@@ -9423,7 +9541,7 @@ var Pagination = forwardRef54(
           children: activePage
         }
       ) }),
-      /* @__PURE__ */ jsx241(
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9434,7 +9552,7 @@ var Pagination = forwardRef54(
           children: nextPageButton
         }
       ),
-      /* @__PURE__ */ jsx241(
+      /* @__PURE__ */ jsx242(
         "li",
         {
           className: cn(
@@ -9442,7 +9560,7 @@ var Pagination = forwardRef54(
             isOnLastPage && Pagination_default["list__item--hidden"]
           ),
           "aria-hidden": isOnLastPage,
-          children: /* @__PURE__ */ jsx241(
+          children: /* @__PURE__ */ jsx242(
             Button,
             {
               purpose: "secondary",
@@ -9460,7 +9578,7 @@ var Pagination = forwardRef54(
     const activePageFirstItem = activePage === 1 ? 1 : activePage * itemsPerPage - itemsPerPage + 1;
     const activePageLastItem = activePage === pagesLength ? itemsAmount : activePage * itemsPerPage;
     const navigationToBeRendered = smallScreen ? smallScreenNavigation : navigation;
-    return !withCounter && !withSelect ? navigationToBeRendered : /* @__PURE__ */ jsxs55(
+    return !withCounter && !withSelect ? navigationToBeRendered : /* @__PURE__ */ jsxs56(
       "div",
       {
         ...getBaseHTMLProps(
@@ -9474,8 +9592,8 @@ var Pagination = forwardRef54(
           rest
         ),
         children: [
-          /* @__PURE__ */ jsxs55("div", { className: Pagination_default.indicators, children: [
-            withSelect && /* @__PURE__ */ jsx241(
+          /* @__PURE__ */ jsxs56("div", { className: Pagination_default.indicators, children: [
+            withSelect && /* @__PURE__ */ jsx242(
               Select,
               {
                 options: selectOptions,
@@ -9491,7 +9609,7 @@ var Pagination = forwardRef54(
                 "aria-label": "Antall elementer per side"
               }
             ),
-            withCounter && /* @__PURE__ */ jsxs55(Typography, { typographyType: "supportingStyleLabel01", as: "p", children: [
+            withCounter && /* @__PURE__ */ jsxs56(Typography, { typographyType: "supportingStyleLabel01", as: "p", children: [
               "Viser ",
               activePageFirstItem,
               "-",
@@ -9510,7 +9628,7 @@ Pagination.displayName = "Pagination";
 
 // src/components/Popover/Popover.tsx
 import { ddsTokens as ddsTokens15 } from "@norges-domstoler/dds-design-tokens";
-import { forwardRef as forwardRef55 } from "react";
+import { forwardRef as forwardRef56 } from "react";
 
 // src/components/Popover/Popover.module.css
 var Popover_default = {
@@ -9521,8 +9639,8 @@ var Popover_default = {
 };
 
 // src/components/Popover/Popover.tsx
-import { jsx as jsx242, jsxs as jsxs56 } from "react/jsx-runtime";
-var Popover = forwardRef55(
+import { jsx as jsx243, jsxs as jsxs57 } from "react/jsx-runtime";
+var Popover = forwardRef56(
   (props, ref) => {
     const {
       title,
@@ -9562,7 +9680,7 @@ var Popover = forwardRef55(
     useOnClickOutside(elements, () => {
       if (isOpen) onClose && onClose();
     });
-    return isOpen || hasTransitionedIn ? /* @__PURE__ */ jsxs56(
+    return isOpen || hasTransitionedIn ? /* @__PURE__ */ jsxs57(
       Paper,
       {
         ...getBaseHTMLProps(id, className, htmlProps, rest),
@@ -9579,15 +9697,15 @@ var Popover = forwardRef55(
           focus_default.focusable
         ),
         children: [
-          title && /* @__PURE__ */ jsx242("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ jsx242(Typography, { typographyType: "headingSans02", children: title }) : title }),
-          /* @__PURE__ */ jsx242(
+          title && /* @__PURE__ */ jsx243("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ jsx243(Typography, { typographyType: "headingSans02", children: title }) : title }),
+          /* @__PURE__ */ jsx243(
             "div",
             {
               className: !hasTitle && withCloseButton ? Popover_default["content--closable--no-title"] : "",
               children
             }
           ),
-          withCloseButton && /* @__PURE__ */ jsx242(
+          withCloseButton && /* @__PURE__ */ jsx243(
             Button,
             {
               icon: CloseIcon,
@@ -9610,11 +9728,11 @@ import {
   Children as ReactChildren5,
   cloneElement as cloneElement6,
   isValidElement as isValidElement7,
-  useId as useId16,
+  useId as useId17,
   useRef as useRef26,
   useState as useState19
 } from "react";
-import { Fragment as Fragment9, jsx as jsx243 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx244 } from "react/jsx-runtime";
 var PopoverGroup = ({
   isOpen = false,
   onCloseButtonClick,
@@ -9623,7 +9741,7 @@ var PopoverGroup = ({
   popoverId
 }) => {
   const [open, setOpen] = useState19(isOpen);
-  const generatedId = useId16();
+  const generatedId = useId17();
   const uniquePopoverId = popoverId != null ? popoverId : `${generatedId}-popover`;
   const handleOnCloseButtonClick = () => {
     setOpen(false);
@@ -9660,7 +9778,7 @@ var PopoverGroup = ({
       onClose: handleClose
     }));
   });
-  return /* @__PURE__ */ jsx243(Fragment9, { children: Children8 });
+  return /* @__PURE__ */ jsx244(Fragment9, { children: Children8 });
 };
 PopoverGroup.displayName = "PopoverGroup";
 
@@ -9669,7 +9787,7 @@ import {
   Children as Children4,
   Fragment as Fragment11,
   cloneElement as cloneElement7,
-  forwardRef as forwardRef56,
+  forwardRef as forwardRef57,
   isValidElement as isValidElement8,
   useEffect as useEffect21,
   useMemo as useMemo3,
@@ -9708,7 +9826,7 @@ var ProgressTracker_default = {
 
 // src/components/ProgressTracker/ProgressTrackerItem.tsx
 import { useMemo as useMemo2 } from "react";
-import { Fragment as Fragment10, jsx as jsx244, jsxs as jsxs57 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx245, jsxs as jsxs58 } from "react/jsx-runtime";
 var toItemState = (active, completed, disabled) => {
   if (disabled) {
     return "disabled";
@@ -9740,15 +9858,15 @@ var ProgressTrackerItem = (props) => {
   const itemState = toItemState(active, completed, disabled);
   const stepNumberContent = useMemo2(() => {
     if (completed) {
-      return /* @__PURE__ */ jsx244(Icon, { icon: CheckIcon, iconSize: "small" });
+      return /* @__PURE__ */ jsx245(Icon, { icon: CheckIcon, iconSize: "small" });
     }
     if (icon2 !== void 0) {
-      return /* @__PURE__ */ jsx244(Icon, { icon: icon2, iconSize: "small" });
+      return /* @__PURE__ */ jsx245(Icon, { icon: icon2, iconSize: "small" });
     }
     return index + 1;
   }, [completed, icon2, index]);
-  const stepContent = /* @__PURE__ */ jsxs57(Fragment10, { children: [
-    /* @__PURE__ */ jsx244(
+  const stepContent = /* @__PURE__ */ jsxs58(Fragment10, { children: [
+    /* @__PURE__ */ jsx245(
       "div",
       {
         "aria-hidden": true,
@@ -9760,7 +9878,7 @@ var ProgressTrackerItem = (props) => {
         children: stepNumberContent
       }
     ),
-    /* @__PURE__ */ jsxs57(
+    /* @__PURE__ */ jsxs58(
       "div",
       {
         className: cn(
@@ -9769,13 +9887,13 @@ var ProgressTrackerItem = (props) => {
           typographyStyles_default["body-sans-03"]
         ),
         children: [
-          /* @__PURE__ */ jsx244(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
+          /* @__PURE__ */ jsx245(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
           children
         ]
       }
     )
   ] });
-  return /* @__PURE__ */ jsx244("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ jsx244(
+  return /* @__PURE__ */ jsx245("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ jsx245(
     "button",
     {
       onClick: !disabled && handleStepChange ? () => handleStepChange(index) : void 0,
@@ -9783,14 +9901,14 @@ var ProgressTrackerItem = (props) => {
       className: cn(ProgressTracker_default["item-button"], focusable),
       children: stepContent
     }
-  ) : /* @__PURE__ */ jsx244("div", { className: cn(ProgressTracker_default["item-button"], ProgressTracker_default["item-div"]), children: stepContent }) });
+  ) : /* @__PURE__ */ jsx245("div", { className: cn(ProgressTracker_default["item-button"], ProgressTracker_default["item-div"]), children: stepContent }) });
 };
 ProgressTrackerItem.displayName = "ProgressTracker.Item";
 
 // src/components/ProgressTracker/ProgressTracker.tsx
-import { jsx as jsx245, jsxs as jsxs58 } from "react/jsx-runtime";
+import { jsx as jsx246, jsxs as jsxs59 } from "react/jsx-runtime";
 var ProgressTracker = (() => {
-  const Res = forwardRef56((props, ref) => {
+  const Res = forwardRef57((props, ref) => {
     const {
       id,
       activeStep = 0,
@@ -9820,14 +9938,14 @@ var ProgressTracker = (() => {
       const itemsWithConnectorsBetween = intersperseItemsWithConnector(itemsWithIndex);
       return itemsWithConnectorsBetween;
     }, [children]);
-    return /* @__PURE__ */ jsx245(
+    return /* @__PURE__ */ jsx246(
       ProgressTrackerContext.Provider,
       {
         value: {
           activeStep: thisActiveStep,
           handleStepChange: handleChange
         },
-        children: /* @__PURE__ */ jsx245("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ jsx245("ol", { className: ProgressTracker_default.list, children: steps }) })
+        children: /* @__PURE__ */ jsx246("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ jsx246("ol", { className: ProgressTracker_default.list, children: steps }) })
       }
     );
   });
@@ -9851,16 +9969,16 @@ var intersperseItemsWithConnector = (children) => Children4.map(children, (child
   if (index === 0) {
     return child;
   }
-  return /* @__PURE__ */ jsxs58(Fragment11, { children: [
-    /* @__PURE__ */ jsx245("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
+  return /* @__PURE__ */ jsxs59(Fragment11, { children: [
+    /* @__PURE__ */ jsx246("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
     child
   ] }, index);
 });
 
 // src/components/Search/Search.tsx
 import {
-  forwardRef as forwardRef58,
-  useId as useId17,
+  forwardRef as forwardRef59,
+  useId as useId18,
   useState as useState21
 } from "react";
 
@@ -9921,9 +10039,9 @@ function createEmptyChangeEvent(inputElementId) {
 }
 
 // src/components/Search/SearchSuggestions.tsx
-import { forwardRef as forwardRef57 } from "react";
-import { jsx as jsx246, jsxs as jsxs59 } from "react/jsx-runtime";
-var SearchSuggestions = forwardRef57((props, ref) => {
+import { forwardRef as forwardRef58 } from "react";
+import { jsx as jsx247, jsxs as jsxs60 } from "react/jsx-runtime";
+var SearchSuggestions = forwardRef58((props, ref) => {
   const {
     id,
     searchId,
@@ -9942,14 +10060,14 @@ var SearchSuggestions = forwardRef57((props, ref) => {
   );
   const [focus] = useRoveFocus(suggestions == null ? void 0 : suggestions.length, showSuggestions);
   const suggestionsToRender = maxSuggestions ? suggestions == null ? void 0 : suggestions.slice(maxSuggestions) : suggestions;
-  const renderedSuggestions = /* @__PURE__ */ jsx246(
+  const renderedSuggestions = /* @__PURE__ */ jsx247(
     "ul",
     {
       role: "listbox",
       "aria-labelledby": suggestionsHeaderId,
       className: utilStyles_default["remove-list-styling"],
       children: suggestionsToRender.map((suggestion, index) => {
-        return /* @__PURE__ */ jsx246("li", { role: "option", children: /* @__PURE__ */ jsx246(
+        return /* @__PURE__ */ jsx247("li", { role: "option", children: /* @__PURE__ */ jsx247(
           OverflowMenuItem,
           {
             index,
@@ -9965,7 +10083,7 @@ var SearchSuggestions = forwardRef57((props, ref) => {
       })
     }
   );
-  return /* @__PURE__ */ jsxs59(
+  return /* @__PURE__ */ jsxs60(
     Paper,
     {
       ...getBaseHTMLProps(
@@ -9984,7 +10102,7 @@ var SearchSuggestions = forwardRef57((props, ref) => {
       "aria-hidden": !showSuggestions,
       border: "default",
       children: [
-        /* @__PURE__ */ jsx246(
+        /* @__PURE__ */ jsx247(
           "span",
           {
             id: suggestionsHeaderId,
@@ -10003,7 +10121,7 @@ var SearchSuggestions = forwardRef57((props, ref) => {
 SearchSuggestions.displayName = "SearchSuggestions";
 
 // src/components/Search/Search.tsx
-import { Fragment as Fragment12, jsx as jsx247, jsxs as jsxs60 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx248, jsxs as jsxs61 } from "react/jsx-runtime";
 var getIconSize = (size2) => {
   switch (size2) {
     case "large":
@@ -10014,7 +10132,7 @@ var getIconSize = (size2) => {
       return "small";
   }
 };
-var Search = forwardRef58(
+var Search = forwardRef59(
   ({
     componentSize = "medium",
     buttonProps,
@@ -10030,7 +10148,7 @@ var Search = forwardRef58(
     ...rest
   }, ref) => {
     var _a;
-    const generatedId = useId17();
+    const generatedId = useId18();
     const uniqueId = id != null ? id : `${generatedId}-searchInput`;
     const hasLabel = !!label;
     const tipId = derivativeIdGenerator(uniqueId, "tip");
@@ -10058,10 +10176,10 @@ var Search = forwardRef58(
     } = buttonProps != null ? buttonProps : {};
     const hasSuggestions = !!context.suggestions;
     const showSearchButton = !!buttonProps && !!onClick;
-    return /* @__PURE__ */ jsxs60("div", { className: Search_default.container, children: [
-      hasLabel && /* @__PURE__ */ jsx247(Label, { htmlFor: uniqueId, children: label }),
-      /* @__PURE__ */ jsxs60("div", { children: [
-        /* @__PURE__ */ jsxs60(
+    return /* @__PURE__ */ jsxs61("div", { className: Search_default.container, children: [
+      hasLabel && /* @__PURE__ */ jsx248(Label, { htmlFor: uniqueId, children: label }),
+      /* @__PURE__ */ jsxs61("div", { children: [
+        /* @__PURE__ */ jsxs61(
           "div",
           {
             className: cn(
@@ -10070,8 +10188,8 @@ var Search = forwardRef58(
             ),
             style,
             children: [
-              /* @__PURE__ */ jsxs60("div", { className: Search_default["input-group"], children: [
-                /* @__PURE__ */ jsx247(
+              /* @__PURE__ */ jsxs61("div", { className: Search_default["input-group"], children: [
+                /* @__PURE__ */ jsx248(
                   Icon,
                   {
                     icon: SearchIcon,
@@ -10079,7 +10197,7 @@ var Search = forwardRef58(
                     className: cn(Search_default["search-icon"])
                   }
                 ),
-                /* @__PURE__ */ jsx247(
+                /* @__PURE__ */ jsx248(
                   Input,
                   {
                     ...rest,
@@ -10107,8 +10225,8 @@ var Search = forwardRef58(
                     )
                   }
                 ),
-                hasSuggestions && /* @__PURE__ */ jsxs60(Fragment12, { children: [
-                  /* @__PURE__ */ jsx247(
+                hasSuggestions && /* @__PURE__ */ jsxs61(Fragment12, { children: [
+                  /* @__PURE__ */ jsx248(
                     SearchSuggestions,
                     {
                       id: suggestionsId,
@@ -10120,9 +10238,9 @@ var Search = forwardRef58(
                       componentSize
                     }
                   ),
-                  /* @__PURE__ */ jsx247(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
+                  /* @__PURE__ */ jsx248(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
                 ] }),
-                hasValue && /* @__PURE__ */ jsx247(
+                hasValue && /* @__PURE__ */ jsx248(
                   Button,
                   {
                     icon: CloseSmallIcon,
@@ -10134,7 +10252,7 @@ var Search = forwardRef58(
                   }
                 )
               ] }),
-              showSearchButton && /* @__PURE__ */ jsx247(
+              showSearchButton && /* @__PURE__ */ jsx248(
                 Button,
                 {
                   size: componentSize,
@@ -10159,7 +10277,7 @@ import {
   useRef as useRef27,
   useState as useState22
 } from "react";
-import { jsx as jsx248 } from "react/jsx-runtime";
+import { jsx as jsx249 } from "react/jsx-runtime";
 var SearchAutocompleteWrapper = (props) => {
   const {
     value,
@@ -10235,7 +10353,7 @@ var SearchAutocompleteWrapper = (props) => {
     inputValue,
     onSugggestionClick: handleSuggestionClick
   };
-  return /* @__PURE__ */ jsx248(AutocompleteSearchContext.Provider, { value: contextProps, children });
+  return /* @__PURE__ */ jsx249(AutocompleteSearchContext.Provider, { value: contextProps, children });
 };
 SearchAutocompleteWrapper.displayName = "SearchAutocompleteWrapper";
 
@@ -10245,7 +10363,7 @@ Search2.AutocompleteWrapper = SearchAutocompleteWrapper;
 Search2.Suggestions = SearchSuggestions;
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-import { forwardRef as forwardRef60, useId as useId18 } from "react";
+import { forwardRef as forwardRef61, useId as useId19 } from "react";
 
 // src/components/SelectionControl/Checkbox/CheckboxGroupContext.tsx
 import { createContext as createContext5, useContext as useContext8 } from "react";
@@ -10256,7 +10374,7 @@ var useCheckboxGroup = () => {
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
 import {
-  forwardRef as forwardRef59
+  forwardRef as forwardRef60
 } from "react";
 
 // src/components/SelectionControl/SelectionControl.module.css
@@ -10277,10 +10395,10 @@ var SelectionControl_default = {
 };
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
-import { jsx as jsx249 } from "react/jsx-runtime";
-var SelectionControl = forwardRef59((props, ref) => {
+import { jsx as jsx250 } from "react/jsx-runtime";
+var SelectionControl = forwardRef60((props, ref) => {
   const { controlType, className, ...rest } = props;
-  return /* @__PURE__ */ jsx249(
+  return /* @__PURE__ */ jsx250(
     "span",
     {
       ref,
@@ -10293,7 +10411,7 @@ var SelectionControl = forwardRef59((props, ref) => {
     }
   );
 });
-var Label2 = forwardRef59(
+var Label2 = forwardRef60(
   (props, ref) => {
     const {
       disabled,
@@ -10304,7 +10422,7 @@ var Label2 = forwardRef59(
       className,
       ...rest
     } = props;
-    return /* @__PURE__ */ jsx249(
+    return /* @__PURE__ */ jsx250(
       "label",
       {
         ref,
@@ -10335,8 +10453,8 @@ var selectionControlTypographyProps = {
 };
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-import { jsx as jsx250, jsxs as jsxs61 } from "react/jsx-runtime";
-var Checkbox = forwardRef60(
+import { jsx as jsx251, jsxs as jsxs62 } from "react/jsx-runtime";
+var Checkbox = forwardRef61(
   (props, ref) => {
     const {
       id,
@@ -10351,7 +10469,7 @@ var Checkbox = forwardRef60(
       htmlProps = {},
       ...rest
     } = props;
-    const generatedId = useId18();
+    const generatedId = useId19();
     const uniqueId = id != null ? id : `${generatedId}-checkbox`;
     const checkboxGroup = useCheckboxGroup();
     const hasLabel = !!label;
@@ -10360,7 +10478,7 @@ var Checkbox = forwardRef60(
       className: htmlPropsClassName,
       ...restHtmlProps
     } = htmlProps;
-    return /* @__PURE__ */ jsxs61(
+    return /* @__PURE__ */ jsxs62(
       Label2,
       {
         hasError: error || (checkboxGroup == null ? void 0 : checkboxGroup.error),
@@ -10372,7 +10490,7 @@ var Checkbox = forwardRef60(
         className: cn(className, htmlPropsClassName),
         style,
         children: [
-          /* @__PURE__ */ jsx250(
+          /* @__PURE__ */ jsx251(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -10396,14 +10514,14 @@ var Checkbox = forwardRef60(
               )
             }
           ),
-          /* @__PURE__ */ jsx250(
+          /* @__PURE__ */ jsx251(
             SelectionControl,
             {
               controlType: "checkbox",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          hasLabel && /* @__PURE__ */ jsx250(Typography, { ...selectionControlTypographyProps, children: label })
+          hasLabel && /* @__PURE__ */ jsx251(Typography, { ...selectionControlTypographyProps, children: label })
         ]
       }
     );
@@ -10412,8 +10530,8 @@ var Checkbox = forwardRef60(
 Checkbox.displayName = "Checkbox";
 
 // src/components/SelectionControl/Checkbox/CheckboxGroup.tsx
-import { useId as useId19 } from "react";
-import { jsx as jsx251, jsxs as jsxs62 } from "react/jsx-runtime";
+import { useId as useId20 } from "react";
+import { jsx as jsx252, jsxs as jsxs63 } from "react/jsx-runtime";
 var CheckboxGroup = (props) => {
   const {
     label,
@@ -10431,7 +10549,7 @@ var CheckboxGroup = (props) => {
     ...rest
   } = props;
   const { "aria-required": ariaRequired } = htmlProps;
-  const generatedId = useId19();
+  const generatedId = useId20();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-checkboxGroup`;
   const hasErrorMessage = !!errorMessage;
   const showRequiredMarker = required || ariaRequired;
@@ -10445,7 +10563,7 @@ var CheckboxGroup = (props) => {
     disabled,
     readOnly
   };
-  return /* @__PURE__ */ jsxs62(
+  return /* @__PURE__ */ jsxs63(
     "div",
     {
       ...getBaseHTMLProps(
@@ -10455,7 +10573,7 @@ var CheckboxGroup = (props) => {
         rest
       ),
       children: [
-        /* @__PURE__ */ jsxs62(
+        /* @__PURE__ */ jsxs63(
           Typography,
           {
             as: "span",
@@ -10464,12 +10582,12 @@ var CheckboxGroup = (props) => {
             children: [
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ jsx251(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ jsx252(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ jsx251(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx251(
+        /* @__PURE__ */ jsx252(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx252(
           "div",
           {
             role: "group",
@@ -10487,7 +10605,7 @@ var CheckboxGroup = (props) => {
 CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-import { forwardRef as forwardRef61, useId as useId20 } from "react";
+import { forwardRef as forwardRef62, useId as useId21 } from "react";
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroupContext.tsx
 import { createContext as createContext6, useContext as useContext9 } from "react";
@@ -10497,7 +10615,7 @@ var useRadioButtonGroup = () => {
 };
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-import { jsx as jsx252, jsxs as jsxs63 } from "react/jsx-runtime";
+import { jsx as jsx253, jsxs as jsxs64 } from "react/jsx-runtime";
 var isValueEqualToGroupValueOrFalsy = (value, group) => {
   if (typeof value !== "undefined" && value !== null && group) {
     if (typeof value === "number") {
@@ -10507,7 +10625,7 @@ var isValueEqualToGroupValueOrFalsy = (value, group) => {
   }
   return !!value;
 };
-var RadioButton = forwardRef61(
+var RadioButton = forwardRef62(
   (props, ref) => {
     const {
       id,
@@ -10531,7 +10649,7 @@ var RadioButton = forwardRef61(
       style,
       ...restHtmlProps
     } = htmlProps;
-    const generatedId = useId20();
+    const generatedId = useId21();
     const uniqueId = id != null ? id : `${generatedId}-radioButton`;
     const hasLabel = !!label;
     const radioButtonGroup = useRadioButtonGroup();
@@ -10543,7 +10661,7 @@ var RadioButton = forwardRef61(
     if (radioButtonGroup == null ? void 0 : radioButtonGroup.errorMessageId)
       describedByIds.push(radioButtonGroup == null ? void 0 : radioButtonGroup.errorMessageId);
     if (ariaDescribedby) describedByIds.push(ariaDescribedby);
-    return /* @__PURE__ */ jsxs63(
+    return /* @__PURE__ */ jsxs64(
       Label2,
       {
         hasError: error || (radioButtonGroup == null ? void 0 : radioButtonGroup.error),
@@ -10555,7 +10673,7 @@ var RadioButton = forwardRef61(
         htmlFor: uniqueId,
         controlType: "radio",
         children: [
-          /* @__PURE__ */ jsx252(
+          /* @__PURE__ */ jsx253(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -10575,14 +10693,14 @@ var RadioButton = forwardRef61(
               ref
             }
           ),
-          /* @__PURE__ */ jsx252(
+          /* @__PURE__ */ jsx253(
             SelectionControl,
             {
               controlType: "radio",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          /* @__PURE__ */ jsx252(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
+          /* @__PURE__ */ jsx253(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
         ]
       }
     );
@@ -10592,11 +10710,11 @@ RadioButton.displayName = "RadioButton";
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroup.tsx
 import {
-  forwardRef as forwardRef62,
-  useId as useId21,
+  forwardRef as forwardRef63,
+  useId as useId22,
   useState as useState23
 } from "react";
-import { jsx as jsx253, jsxs as jsxs64 } from "react/jsx-runtime";
+import { jsx as jsx254, jsxs as jsxs65 } from "react/jsx-runtime";
 var RadioButtonGroupInner = (props, ref) => {
   const {
     name,
@@ -10618,7 +10736,7 @@ var RadioButtonGroupInner = (props, ref) => {
   } = props;
   const { "aria-required": ariaRequired = false } = htmlProps;
   const [groupValue, setGroupValue] = useState23(value);
-  const generatedId = useId21();
+  const generatedId = useId22();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-radioButtonGroup`;
   const handleChange = combineHandlers(
     (e) => setGroupValue(e.target.value),
@@ -10638,7 +10756,7 @@ var RadioButtonGroupInner = (props, ref) => {
     value: groupValue,
     onChange: handleChange
   };
-  return /* @__PURE__ */ jsxs64(
+  return /* @__PURE__ */ jsxs65(
     "div",
     {
       ...getBaseHTMLProps(
@@ -10649,7 +10767,7 @@ var RadioButtonGroupInner = (props, ref) => {
       ),
       ref,
       children: [
-        /* @__PURE__ */ jsxs64(
+        /* @__PURE__ */ jsxs65(
           Typography,
           {
             as: "span",
@@ -10658,12 +10776,12 @@ var RadioButtonGroupInner = (props, ref) => {
             children: [
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ jsx253(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ jsx254(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ jsx253(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx253(
+        /* @__PURE__ */ jsx254(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx254(
           "div",
           {
             role: "radiogroup",
@@ -10679,11 +10797,11 @@ var RadioButtonGroupInner = (props, ref) => {
     }
   );
 };
-var RadioButtonGroup = forwardRef62(RadioButtonGroupInner);
+var RadioButtonGroup = forwardRef63(RadioButtonGroupInner);
 RadioButtonGroup.displayName = "RadioButtonGroup";
 
 // src/components/SkipToContent/SkipToContent.tsx
-import { forwardRef as forwardRef63 } from "react";
+import { forwardRef as forwardRef64 } from "react";
 
 // src/components/SkipToContent/SkipToContent.module.css
 var SkipToContent_default = {
@@ -10692,8 +10810,8 @@ var SkipToContent_default = {
 };
 
 // src/components/SkipToContent/SkipToContent.tsx
-import { jsx as jsx254 } from "react/jsx-runtime";
-var SkipToContent = forwardRef63(
+import { jsx as jsx255 } from "react/jsx-runtime";
+var SkipToContent = forwardRef64(
   (props, ref) => {
     const {
       text = "Til hovedinnhold",
@@ -10708,12 +10826,12 @@ var SkipToContent = forwardRef63(
       style,
       ...restHtmlProps
     } = htmlProps;
-    return /* @__PURE__ */ jsx254(
+    return /* @__PURE__ */ jsx255(
       "div",
       {
         className: cn(className, htmlPropsClassName, SkipToContent_default.wrapper),
         style: { ...style, top },
-        children: /* @__PURE__ */ jsx254(
+        children: /* @__PURE__ */ jsx255(
           Link,
           {
             ...getBaseHTMLProps(id, restHtmlProps, rest),
@@ -10730,7 +10848,7 @@ var SkipToContent = forwardRef63(
 SkipToContent.displayName = "SkipToContent";
 
 // src/components/SplitButton/SplitButton.tsx
-import { forwardRef as forwardRef64, useState as useState24 } from "react";
+import { forwardRef as forwardRef65, useState as useState24 } from "react";
 
 // src/components/SplitButton/SplitButton.module.css
 var SplitButton_default = {
@@ -10741,8 +10859,8 @@ var SplitButton_default = {
 };
 
 // src/components/SplitButton/SplitButton.tsx
-import { jsx as jsx255, jsxs as jsxs65 } from "react/jsx-runtime";
-var SplitButton = forwardRef64(
+import { jsx as jsx256, jsxs as jsxs66 } from "react/jsx-runtime";
+var SplitButton = forwardRef65(
   (props, ref) => {
     const {
       size: size2,
@@ -10757,8 +10875,8 @@ var SplitButton = forwardRef64(
       purpose,
       size: size2
     };
-    return /* @__PURE__ */ jsxs65("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
-      /* @__PURE__ */ jsx255(
+    return /* @__PURE__ */ jsxs66("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
+      /* @__PURE__ */ jsx256(
         Button,
         {
           ...buttonStyleProps,
@@ -10767,8 +10885,8 @@ var SplitButton = forwardRef64(
           className: SplitButton_default.main
         }
       ),
-      /* @__PURE__ */ jsxs65(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
-        /* @__PURE__ */ jsx255(
+      /* @__PURE__ */ jsxs66(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
+        /* @__PURE__ */ jsx256(
           Button,
           {
             ...buttonStyleProps,
@@ -10781,7 +10899,7 @@ var SplitButton = forwardRef64(
             )
           }
         ),
-        /* @__PURE__ */ jsx255(OverflowMenu, { items: secondaryActions, placement: "bottom-end" })
+        /* @__PURE__ */ jsx256(OverflowMenu, { items: secondaryActions, placement: "bottom-end" })
       ] })
     ] });
   }
@@ -10793,7 +10911,7 @@ import {
   Children as Children5,
   Fragment as Fragment13,
   cloneElement as cloneElement8,
-  forwardRef as forwardRef72,
+  forwardRef as forwardRef73,
   isValidElement as isValidElement9,
   useEffect as useEffect24,
   useState as useState26
@@ -10808,30 +10926,30 @@ var CollapsibleTableContext = createContext7({
 var useCollapsibleTableContext = () => useContext10(CollapsibleTableContext);
 
 // src/components/Table/normal/Body.tsx
-import { forwardRef as forwardRef65 } from "react";
-import { jsx as jsx256 } from "react/jsx-runtime";
-var Body = forwardRef65(
+import { forwardRef as forwardRef66 } from "react";
+import { jsx as jsx257 } from "react/jsx-runtime";
+var Body = forwardRef66(
   (props, ref) => {
-    return /* @__PURE__ */ jsx256("tbody", { ref, ...props });
+    return /* @__PURE__ */ jsx257("tbody", { ref, ...props });
   }
 );
 Body.displayName = "Table.Body";
 
 // src/components/Table/normal/Cell.tsx
 import {
-  forwardRef as forwardRef67
+  forwardRef as forwardRef68
 } from "react";
 
 // src/components/Table/normal/Head.tsx
 import {
   createContext as createContext8,
-  forwardRef as forwardRef66,
+  forwardRef as forwardRef67,
   useContext as useContext11
 } from "react";
-import { jsx as jsx257 } from "react/jsx-runtime";
-var Head = forwardRef66(
+import { jsx as jsx258 } from "react/jsx-runtime";
+var Head = forwardRef67(
   ({ children, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx257("thead", { ref, ...rest, children: /* @__PURE__ */ jsx257(HeadContext.Provider, { value: true, children }) });
+    return /* @__PURE__ */ jsx258("thead", { ref, ...rest, children: /* @__PURE__ */ jsx258(HeadContext.Provider, { value: true, children }) });
   }
 );
 Head.displayName = "Table.Head";
@@ -10867,8 +10985,8 @@ var Table_default = {
 };
 
 // src/components/Table/normal/Cell.tsx
-import { jsx as jsx258 } from "react/jsx-runtime";
-var Cell = forwardRef67(
+import { jsx as jsx259 } from "react/jsx-runtime";
+var Cell = forwardRef68(
   ({
     children,
     type: _type,
@@ -10881,7 +10999,7 @@ var Cell = forwardRef67(
     const type = _type != null ? _type : isInHead ? "head" : "data";
     const { isCollapsibleChild } = collapsibleProps != null ? collapsibleProps : {};
     const isComplexLayout = layout === "text and icon";
-    return isCollapsibleChild ? /* @__PURE__ */ jsx258(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ jsx258(
+    return isCollapsibleChild ? /* @__PURE__ */ jsx259(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ jsx259(
       "th",
       {
         ref,
@@ -10891,15 +11009,15 @@ var Cell = forwardRef67(
           !isComplexLayout && Table_default[`cell--${layout}`],
           Table_default["cell--head"]
         ),
-        children: isComplexLayout ? /* @__PURE__ */ jsx258("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ jsx259("div", { className: Table_default.cell__inner, children }) : children
       }
-    ) : /* @__PURE__ */ jsx258(
+    ) : /* @__PURE__ */ jsx259(
       "td",
       {
         ref,
         ...rest,
         className: cn(className, !isComplexLayout && Table_default[`cell--${layout}`]),
-        children: isComplexLayout ? /* @__PURE__ */ jsx258("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ jsx259("div", { className: Table_default.cell__inner, children }) : children
       }
     );
   }
@@ -10907,23 +11025,23 @@ var Cell = forwardRef67(
 Cell.displayName = "Table.Cell";
 
 // src/components/Table/normal/Foot.tsx
-import { forwardRef as forwardRef68 } from "react";
-import { jsx as jsx259 } from "react/jsx-runtime";
-var Foot = forwardRef68(
+import { forwardRef as forwardRef69 } from "react";
+import { jsx as jsx260 } from "react/jsx-runtime";
+var Foot = forwardRef69(
   (props, ref) => {
-    return /* @__PURE__ */ jsx259("tfoot", { ref, ...props });
+    return /* @__PURE__ */ jsx260("tfoot", { ref, ...props });
   }
 );
 Foot.displayName = "Table.Foot";
 
 // src/components/Table/normal/Row.tsx
-import { forwardRef as forwardRef69 } from "react";
-import { jsx as jsx260 } from "react/jsx-runtime";
-var Row = forwardRef69(
+import { forwardRef as forwardRef70 } from "react";
+import { jsx as jsx261 } from "react/jsx-runtime";
+var Row = forwardRef70(
   ({ type: _type, mode = "normal", hoverable, selected, className, ...rest }, ref) => {
     const isInHeader = useIsInTableHead();
     const type = _type != null ? _type : isInHeader ? "head" : "body";
-    return /* @__PURE__ */ jsx260(
+    return /* @__PURE__ */ jsx261(
       "tr",
       {
         ref,
@@ -10946,23 +11064,23 @@ var Row = forwardRef69(
 Row.displayName = "Table.Row";
 
 // src/components/Table/normal/SortCell.tsx
-import { forwardRef as forwardRef70 } from "react";
-import { jsx as jsx261, jsxs as jsxs66 } from "react/jsx-runtime";
+import { forwardRef as forwardRef71 } from "react";
+import { jsx as jsx262, jsxs as jsxs67 } from "react/jsx-runtime";
 var makeSortIcon = (isSorted, sortOrder) => {
   if (!isSorted || !sortOrder) {
-    return /* @__PURE__ */ jsx261(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
+    return /* @__PURE__ */ jsx262(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
   }
-  return sortOrder === "ascending" ? /* @__PURE__ */ jsx261(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ jsx261(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
+  return sortOrder === "ascending" ? /* @__PURE__ */ jsx262(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ jsx262(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
 };
-var SortCell = forwardRef70(
-  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ jsx261(
+var SortCell = forwardRef71(
+  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ jsx262(
     Cell,
     {
       ref,
       type: "head",
       "aria-sort": isSorted && sortOrder ? sortOrder : void 0,
       ...rest,
-      children: /* @__PURE__ */ jsxs66(
+      children: /* @__PURE__ */ jsxs67(
         "button",
         {
           onClick,
@@ -10986,8 +11104,8 @@ var SortCell = forwardRef70(
 SortCell.displayName = "Table.SortCell";
 
 // src/components/Table/normal/Table.tsx
-import { forwardRef as forwardRef71 } from "react";
-import { jsx as jsx262 } from "react/jsx-runtime";
+import { forwardRef as forwardRef72 } from "react";
+import { jsx as jsx263 } from "react/jsx-runtime";
 function getDensityCn(value) {
   switch (value) {
     case "normal":
@@ -10997,7 +11115,7 @@ function getDensityCn(value) {
       return "extra-compact";
   }
 }
-var Table = forwardRef71(
+var Table = forwardRef72(
   ({
     density = "normal",
     stickyHeader,
@@ -11006,7 +11124,7 @@ var Table = forwardRef71(
     children,
     ...rest
   }, ref) => {
-    return /* @__PURE__ */ jsx262(
+    return /* @__PURE__ */ jsx263(
       "table",
       {
         ref,
@@ -11028,7 +11146,7 @@ Table.displayName = "Table";
 
 // src/components/Table/normal/TableWrapper.tsx
 import { useEffect as useEffect23, useRef as useRef28, useState as useState25 } from "react";
-import { jsx as jsx263 } from "react/jsx-runtime";
+import { jsx as jsx264 } from "react/jsx-runtime";
 var TableWrapper = ({ className, ...rest }) => {
   const [overflowX, setOverflowX] = useState25(false);
   const [windowWidth, setWindowWidth] = useState25(window.innerWidth);
@@ -11050,7 +11168,7 @@ var TableWrapper = ({ className, ...rest }) => {
     window.addEventListener("resize", handleResize);
     return () => window.removeEventListener("resize", handleResize);
   });
-  return /* @__PURE__ */ jsx263(
+  return /* @__PURE__ */ jsx264(
     "div",
     {
       ref: wrapperRef,
@@ -11077,8 +11195,8 @@ Table2.Row = Row;
 Table2.Foot = Foot;
 
 // src/components/Table/collapsible/CollapsibleRow.tsx
-import { Fragment as Fragment14, jsx as jsx264, jsxs as jsxs67 } from "react/jsx-runtime";
-var CollapsibleRow = forwardRef72(
+import { Fragment as Fragment14, jsx as jsx265, jsxs as jsxs68 } from "react/jsx-runtime";
+var CollapsibleRow = forwardRef73(
   ({
     type: _type,
     className,
@@ -11119,33 +11237,33 @@ var CollapsibleRow = forwardRef72(
     const collapsedRenderedChildren = isCollapsed && collapsedHeaderValues.length > 0 ? collapsedChildren.map(function(child, index) {
       const id = derivativeIdGenerator(prefix3, index.toString());
       collapsibleIds.push(id);
-      return /* @__PURE__ */ jsxs67(Fragment13, { children: [
-        /* @__PURE__ */ jsx264(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
+      return /* @__PURE__ */ jsxs68(Fragment13, { children: [
+        /* @__PURE__ */ jsx265(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
         isValidElement9(child) && cloneElement8(child, {
           collapsibleProps: { isCollapsibleChild: true }
         })
       ] }, `DL-${index}`);
     }) : null;
-    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsx264(Row, { ...rowProps(), children: /* @__PURE__ */ jsx264(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ jsx264(DescriptionList, { children: collapsedRenderedChildren }) }) }) : null;
+    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsx265(Row, { ...rowProps(), children: /* @__PURE__ */ jsx265(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ jsx265(DescriptionList, { children: collapsedRenderedChildren }) }) }) : null;
     const definingColumnCells = childrenArray.slice().filter((column2, index) => definingColumnIndex.indexOf(index) > -1).sort((a3, b) => {
       return definingColumnIndex.indexOf(childrenArray.indexOf(a3)) - definingColumnIndex.indexOf(childrenArray.indexOf(b));
     });
     const headerRow = () => {
       if (type !== "head" || !isCollapsed) return null;
-      return /* @__PURE__ */ jsx264(Row, { ref, ...rowProps(), children: /* @__PURE__ */ jsxs67(Fragment14, { children: [
+      return /* @__PURE__ */ jsx265(Row, { ref, ...rowProps(), children: /* @__PURE__ */ jsxs68(Fragment14, { children: [
         definingColumnCells,
-        /* @__PURE__ */ jsxs67(Table2.Cell, { type: "head", layout: "center", children: [
+        /* @__PURE__ */ jsxs68(Table2.Cell, { type: "head", layout: "center", children: [
           "Utvid",
-          /* @__PURE__ */ jsx264(VisuallyHidden, { as: "span", children: "raden" })
+          /* @__PURE__ */ jsx265(VisuallyHidden, { as: "span", children: "raden" })
         ] })
       ] }) });
     };
     const idList = spaceSeparatedIdListGenerator(collapsibleIds);
     const rowWithChevron = () => {
       if (type !== "body" || !isCollapsed) return null;
-      return /* @__PURE__ */ jsxs67(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
+      return /* @__PURE__ */ jsxs68(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
         definingColumnCells,
-        /* @__PURE__ */ jsx264(Table2.Cell, { children: /* @__PURE__ */ jsx264(
+        /* @__PURE__ */ jsx265(Table2.Cell, { children: /* @__PURE__ */ jsx265(
           "button",
           {
             onClick: () => setChildrenCollapsed(!childrenCollapsed),
@@ -11157,7 +11275,7 @@ var CollapsibleRow = forwardRef72(
               utilStyles_default["remove-button-styling"],
               focusable
             ),
-            children: /* @__PURE__ */ jsx264(
+            children: /* @__PURE__ */ jsx265(
               AnimatedChevronUpDown,
               {
                 isUp: childrenCollapsed ? false : true,
@@ -11169,28 +11287,28 @@ var CollapsibleRow = forwardRef72(
         ) })
       ] });
     };
-    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsxs67(Fragment14, { children: [
+    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsxs68(Fragment14, { children: [
       headerRow(),
-      type === "body" && /* @__PURE__ */ jsxs67(Fragment14, { children: [
+      type === "body" && /* @__PURE__ */ jsxs68(Fragment14, { children: [
         rowWithChevron(),
         childrenCollapsed ? null : collapsedRows
       ] })
-    ] }) : /* @__PURE__ */ jsx264(Row, { ref, ...rowProps(), children });
+    ] }) : /* @__PURE__ */ jsx265(Row, { ref, ...rowProps(), children });
   }
 );
 CollapsibleRow.displayName = "CollapsibleTable.Row";
 
 // src/components/Table/collapsible/CollapsibleTable.tsx
-import { forwardRef as forwardRef73 } from "react";
-import { jsx as jsx265 } from "react/jsx-runtime";
-var CollapsibleTable = forwardRef73((props, ref) => {
+import { forwardRef as forwardRef74 } from "react";
+import { jsx as jsx266 } from "react/jsx-runtime";
+var CollapsibleTable = forwardRef74((props, ref) => {
   const {
     isCollapsed,
     headerValues,
     definingColumnIndex = [0],
     ...rest
   } = props;
-  return /* @__PURE__ */ jsx265(
+  return /* @__PURE__ */ jsx266(
     CollapsibleTableContext.Provider,
     {
       value: {
@@ -11198,7 +11316,7 @@ var CollapsibleTable = forwardRef73((props, ref) => {
         headerValues,
         definingColumnIndex
       },
-      children: /* @__PURE__ */ jsx265(Table2, { ref, ...rest })
+      children: /* @__PURE__ */ jsx266(Table2, { ref, ...rest })
     }
   );
 });
@@ -11210,9 +11328,9 @@ CollapsibleTable2.Row = CollapsibleRow;
 
 // src/components/Tabs/Tabs.tsx
 import {
-  forwardRef as forwardRef74,
+  forwardRef as forwardRef75,
   useEffect as useEffect25,
-  useId as useId22,
+  useId as useId23,
   useRef as useRef29,
   useState as useState27
 } from "react";
@@ -11246,8 +11364,8 @@ var Tabs_default = {
 };
 
 // src/components/Tabs/Tabs.tsx
-import { jsx as jsx266 } from "react/jsx-runtime";
-var Tabs = forwardRef74((props, ref) => {
+import { jsx as jsx267 } from "react/jsx-runtime";
+var Tabs = forwardRef75((props, ref) => {
   const {
     id,
     activeTab,
@@ -11259,7 +11377,7 @@ var Tabs = forwardRef74((props, ref) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = useId22();
+  const generatedId = useId23();
   const uniqueId = id != null ? id : `${generatedId}-tabs`;
   const [thisActiveTab, setActiveTab] = useState27(activeTab != null ? activeTab : 0);
   const [hasTabFocus, setHasTabFocus] = useState27(false);
@@ -11278,7 +11396,7 @@ var Tabs = forwardRef74((props, ref) => {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     ["--dds-tabs-width"]: width
   };
-  return /* @__PURE__ */ jsx266(
+  return /* @__PURE__ */ jsx267(
     TabsContext.Provider,
     {
       value: {
@@ -11291,7 +11409,7 @@ var Tabs = forwardRef74((props, ref) => {
         setHasTabFocus,
         tabContentDirection
       },
-      children: /* @__PURE__ */ jsx266(
+      children: /* @__PURE__ */ jsx267(
         "div",
         {
           ref,
@@ -11312,7 +11430,7 @@ Tabs.displayName = "Tabs";
 
 // src/components/Tabs/Tab.tsx
 import {
-  forwardRef as forwardRef75,
+  forwardRef as forwardRef76,
   useCallback as useCallback7,
   useEffect as useEffect26,
   useRef as useRef30
@@ -11324,13 +11442,13 @@ import {
   useContext as useContext13,
   useLayoutEffect as useLayoutEffect2
 } from "react";
-import { jsx as jsx267 } from "react/jsx-runtime";
+import { jsx as jsx268 } from "react/jsx-runtime";
 var TabContext = createContext10(null);
 function TabWidthContextProvider({
   children,
   onChangeWidths
 }) {
-  return /* @__PURE__ */ jsx267(
+  return /* @__PURE__ */ jsx268(
     TabContext.Provider,
     {
       value: {
@@ -11362,8 +11480,8 @@ function useSetTabWidth(index, width) {
 }
 
 // src/components/Tabs/Tab.tsx
-import { jsx as jsx268, jsxs as jsxs68 } from "react/jsx-runtime";
-var Tab = forwardRef75((props, ref) => {
+import { jsx as jsx269, jsxs as jsxs69 } from "react/jsx-runtime";
+var Tab = forwardRef76((props, ref) => {
   const {
     active = false,
     icon: icon2,
@@ -11402,7 +11520,7 @@ var Tab = forwardRef75((props, ref) => {
     handleSelect();
     onKeyDown && onKeyDown(e);
   };
-  return /* @__PURE__ */ jsxs68(
+  return /* @__PURE__ */ jsxs69(
     "button",
     {
       ...getBaseHTMLProps(
@@ -11425,8 +11543,8 @@ var Tab = forwardRef75((props, ref) => {
       onKeyDown: handleOnKeyDown,
       tabIndex: focus ? 0 : -1,
       children: [
-        icon2 && /* @__PURE__ */ jsx268(Icon, { icon: icon2, iconSize: "inherit" }),
-        /* @__PURE__ */ jsx268("span", { children })
+        icon2 && /* @__PURE__ */ jsx269(Icon, { icon: icon2, iconSize: "inherit" }),
+        /* @__PURE__ */ jsx269("span", { children })
       ]
     }
   );
@@ -11437,12 +11555,12 @@ Tab.displayName = "Tab";
 import {
   Children as Children6,
   cloneElement as cloneElement9,
-  forwardRef as forwardRef76,
+  forwardRef as forwardRef77,
   isValidElement as isValidElement10,
   useState as useState28
 } from "react";
-import { jsx as jsx269 } from "react/jsx-runtime";
-var TabList = forwardRef76(
+import { jsx as jsx270 } from "react/jsx-runtime";
+var TabList = forwardRef77(
   ({ children, id, style, onFocus, ...rest }, ref) => {
     const {
       activeTab,
@@ -11485,7 +11603,7 @@ var TabList = forwardRef76(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       ["--dds-tab-widths"]: widths.join(" ")
     };
-    return /* @__PURE__ */ jsx269(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ jsx269(
+    return /* @__PURE__ */ jsx270(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ jsx270(
       "div",
       {
         ...rest,
@@ -11511,11 +11629,11 @@ var TabList = forwardRef76(
 TabList.displayName = "TabList";
 
 // src/components/Tabs/TabPanel.tsx
-import { forwardRef as forwardRef77 } from "react";
-import { jsx as jsx270 } from "react/jsx-runtime";
-var TabPanel = forwardRef77(
+import { forwardRef as forwardRef78 } from "react";
+import { jsx as jsx271 } from "react/jsx-runtime";
+var TabPanel = forwardRef78(
   ({ active = false, children, id, className, htmlProps, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx270(
+    return /* @__PURE__ */ jsx271(
       "div",
       {
         ...getBaseHTMLProps(
@@ -11543,11 +11661,11 @@ TabPanel.displayName = "TabPanel";
 import {
   Children as Children7,
   cloneElement as cloneElement10,
-  forwardRef as forwardRef78,
+  forwardRef as forwardRef79,
   isValidElement as isValidElement11
 } from "react";
-import { jsx as jsx271 } from "react/jsx-runtime";
-var TabPanels = forwardRef78(
+import { jsx as jsx272 } from "react/jsx-runtime";
+var TabPanels = forwardRef79(
   ({ children, ...rest }, ref) => {
     const { activeTab, tabsId, tabPanelsRef } = useTabsContext();
     const combinedRef = useCombinedRef(ref, tabPanelsRef);
@@ -11560,13 +11678,13 @@ var TabPanels = forwardRef78(
         "aria-expanded": active
       });
     });
-    return /* @__PURE__ */ jsx271("div", { ref: combinedRef, ...rest, children: panelChildren });
+    return /* @__PURE__ */ jsx272("div", { ref: combinedRef, ...rest, children: panelChildren });
   }
 );
 TabPanels.displayName = "TabPanels";
 
 // src/components/Tag/Tag.tsx
-import { forwardRef as forwardRef79 } from "react";
+import { forwardRef as forwardRef80 } from "react";
 
 // src/components/Tag/Tag.module.css
 var Tag_default = {
@@ -11585,7 +11703,7 @@ var Tag_default = {
 };
 
 // src/components/Tag/Tag.tsx
-import { jsx as jsx272, jsxs as jsxs69 } from "react/jsx-runtime";
+import { jsx as jsx273, jsxs as jsxs70 } from "react/jsx-runtime";
 var purposeVariants3 = {
   info: {
     icon: InfoIcon
@@ -11603,7 +11721,7 @@ var purposeVariants3 = {
     icon: void 0
   }
 };
-var Tag = forwardRef79((props, ref) => {
+var Tag = forwardRef80((props, ref) => {
   const {
     text,
     purpose = "default",
@@ -11616,7 +11734,7 @@ var Tag = forwardRef79((props, ref) => {
     ...rest
   } = props;
   const icon2 = purposeVariants3[purpose].icon;
-  return /* @__PURE__ */ jsxs69(
+  return /* @__PURE__ */ jsxs70(
     TextOverflowEllipsisWrapper,
     {
       ...getBaseHTMLProps(
@@ -11633,8 +11751,8 @@ var Tag = forwardRef79((props, ref) => {
       ),
       ref,
       children: [
-        withIcon && icon2 && /* @__PURE__ */ jsx272(Icon, { icon: icon2, iconSize: "small" }),
-        /* @__PURE__ */ jsx272(TextOverflowEllipsisInner, { children: children != null ? children : text })
+        withIcon && icon2 && /* @__PURE__ */ jsx273(Icon, { icon: icon2, iconSize: "small" }),
+        /* @__PURE__ */ jsx273(TextOverflowEllipsisInner, { children: children != null ? children : text })
       ]
     }
   );
@@ -11644,8 +11762,8 @@ Tag.displayName = "Tag";
 // src/components/TextInput/TextInput.tsx
 import { ddsTokens as ddsTokens16 } from "@norges-domstoler/dds-design-tokens";
 import {
-  forwardRef as forwardRef80,
-  useId as useId23,
+  forwardRef as forwardRef81,
+  useId as useId24,
   useLayoutEffect as useLayoutEffect3,
   useRef as useRef31,
   useState as useState29
@@ -11675,8 +11793,8 @@ var TextInput_default = {
 };
 
 // src/components/TextInput/TextInput.tsx
-import { jsx as jsx273, jsxs as jsxs70 } from "react/jsx-runtime";
-var TextInput = forwardRef80(
+import { jsx as jsx274, jsxs as jsxs71 } from "react/jsx-runtime";
+var TextInput = forwardRef81(
   ({
     label,
     disabled,
@@ -11723,7 +11841,7 @@ var TextInput = forwardRef80(
         onChange(event);
       }
     };
-    const generatedId = useId23();
+    const generatedId = useId24();
     const uniqueId = id != null ? id : `${generatedId}-textInput`;
     const hasErrorMessage = !!errorMessage;
     const hasTip = !!tip;
@@ -11767,13 +11885,13 @@ var TextInput = forwardRef80(
     const suffixPaddingInlineEnd = readOnly && suffixLength ? suffixLength + "px" : suffixLength ? ddsTokens16.DdsSpacingX1NumberPx + suffixLength + "px" : void 0;
     let extendedInput = null;
     if (hasIcon) {
-      extendedInput = /* @__PURE__ */ jsxs70(
+      extendedInput = /* @__PURE__ */ jsxs71(
         "div",
         {
           className: cn(TextInput_default["input-width"], Input_default["input-group"]),
           style: styleVariables,
           children: [
-            /* @__PURE__ */ jsx273(
+            /* @__PURE__ */ jsx274(
               Icon,
               {
                 icon: icon2,
@@ -11781,7 +11899,7 @@ var TextInput = forwardRef80(
                 className: cn(TextInput_default.icon, TextInput_default[`icon--${componentSize}`])
               }
             ),
-            /* @__PURE__ */ jsx273(
+            /* @__PURE__ */ jsx274(
               StatefulInput,
               {
                 ref,
@@ -11796,13 +11914,13 @@ var TextInput = forwardRef80(
         }
       );
     } else if (hasAffix) {
-      extendedInput = /* @__PURE__ */ jsxs70(
+      extendedInput = /* @__PURE__ */ jsxs71(
         "div",
         {
           className: cn(TextInput_default["affix-container"], TextInput_default["input-width"]),
           style: styleVariables,
           children: [
-            prefix3 && /* @__PURE__ */ jsx273(
+            prefix3 && /* @__PURE__ */ jsx274(
               "span",
               {
                 ref: prefixRef,
@@ -11815,7 +11933,7 @@ var TextInput = forwardRef80(
                 children: prefix3
               }
             ),
-            /* @__PURE__ */ jsx273(
+            /* @__PURE__ */ jsx274(
               StatefulInput,
               {
                 ref,
@@ -11829,7 +11947,7 @@ var TextInput = forwardRef80(
                 }
               }
             ),
-            suffix && /* @__PURE__ */ jsx273(
+            suffix && /* @__PURE__ */ jsx274(
               "span",
               {
                 ref: suffixRef,
@@ -11846,7 +11964,7 @@ var TextInput = forwardRef80(
         }
       );
     }
-    return /* @__PURE__ */ jsxs70(
+    return /* @__PURE__ */ jsxs71(
       "div",
       {
         className: cn(
@@ -11856,7 +11974,7 @@ var TextInput = forwardRef80(
         ),
         style,
         children: [
-          hasLabel && /* @__PURE__ */ jsx273(
+          hasLabel && /* @__PURE__ */ jsx274(
             Label,
             {
               htmlFor: uniqueId,
@@ -11865,7 +11983,7 @@ var TextInput = forwardRef80(
               children: label
             }
           ),
-          extendedInput ? extendedInput : /* @__PURE__ */ jsx273(
+          extendedInput ? extendedInput : /* @__PURE__ */ jsx274(
             StatefulInput,
             {
               ref,
@@ -11877,7 +11995,7 @@ var TextInput = forwardRef80(
               className: TextInput_default["input-width"]
             }
           ),
-          hasMessage && /* @__PURE__ */ jsxs70("div", { className: TextInput_default["message-container"], children: [
+          hasMessage && /* @__PURE__ */ jsxs71("div", { className: TextInput_default["message-container"], children: [
             renderInputMessage(tip, tipId, errorMessage, errorMessageId),
             renderCharCounter(
               characterCounterId,
@@ -11894,7 +12012,7 @@ var TextInput = forwardRef80(
 TextInput.displayName = "TextInput";
 
 // src/components/ToggleBar/ToggleBar.tsx
-import { useId as useId24, useState as useState30 } from "react";
+import { useId as useId25, useState as useState30 } from "react";
 
 // src/components/ToggleBar/ToggleBar.context.tsx
 import { createContext as createContext11, useContext as useContext14 } from "react";
@@ -11920,7 +12038,7 @@ var ToggleBar_default = {
 };
 
 // src/components/ToggleBar/ToggleBar.tsx
-import { jsx as jsx274, jsxs as jsxs71 } from "react/jsx-runtime";
+import { jsx as jsx275, jsxs as jsxs72 } from "react/jsx-runtime";
 var ToggleBar = (props) => {
   const {
     children,
@@ -11935,7 +12053,7 @@ var ToggleBar = (props) => {
     id,
     ...rest
   } = props;
-  const generatedId = useId24();
+  const generatedId = useId25();
   const uniqueId = id != null ? id : `${generatedId}-ToggleBar`;
   const [groupValue, setGroupValue] = useState30(value);
   const handleChange = combineHandlers(
@@ -11943,7 +12061,7 @@ var ToggleBar = (props) => {
     (e) => onChange && onChange(e, e.target.value)
   );
   const labelId = label && `${uniqueId}-label`;
-  return /* @__PURE__ */ jsx274(
+  return /* @__PURE__ */ jsx275(
     ToggleBarContext.Provider,
     {
       value: {
@@ -11952,7 +12070,7 @@ var ToggleBar = (props) => {
         name,
         value: groupValue
       },
-      children: /* @__PURE__ */ jsxs71(
+      children: /* @__PURE__ */ jsxs72(
         "div",
         {
           ...getBaseHTMLProps(
@@ -11965,8 +12083,8 @@ var ToggleBar = (props) => {
           role: "radiogroup",
           "aria-labelledby": labelId != null ? labelId : htmlProps == null ? void 0 : htmlProps["aria-labelledby"],
           children: [
-            label && /* @__PURE__ */ jsx274(Label, { id: labelId, children: label }),
-            /* @__PURE__ */ jsx274("div", { className: ToggleBar_default.bar, children })
+            label && /* @__PURE__ */ jsx275(Label, { id: labelId, children: label }),
+            /* @__PURE__ */ jsx275("div", { className: ToggleBar_default.bar, children })
           ]
         }
       )
@@ -11977,10 +12095,10 @@ ToggleBar.displayName = "ToggleBar";
 
 // src/components/ToggleBar/ToggleRadio.tsx
 import {
-  forwardRef as forwardRef81,
-  useId as useId25
+  forwardRef as forwardRef82,
+  useId as useId26
 } from "react";
-import { jsx as jsx275, jsxs as jsxs72 } from "react/jsx-runtime";
+import { jsx as jsx276, jsxs as jsxs73 } from "react/jsx-runtime";
 var typographyTypes5 = {
   large: "bodySans04",
   medium: "bodySans02",
@@ -11997,7 +12115,7 @@ var calculateChecked = (value, group, checked) => {
   }
   return !!value;
 };
-var ToggleRadio = forwardRef81(
+var ToggleRadio = forwardRef82(
   (props, ref) => {
     const {
       value,
@@ -12013,7 +12131,7 @@ var ToggleRadio = forwardRef81(
       id,
       ...rest
     } = props;
-    const generatedId = useId25();
+    const generatedId = useId26();
     const uniqueId = id != null ? id : `${generatedId}-ToggleRadio`;
     const group = useToggleBarContext();
     const handleChange = (event) => {
@@ -12021,8 +12139,8 @@ var ToggleRadio = forwardRef81(
       (group == null ? void 0 : group.onChange) && group.onChange(event);
     };
     const contentTypeCn = label ? "with-text" : "just-icon";
-    return /* @__PURE__ */ jsxs72("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
-      /* @__PURE__ */ jsx275(
+    return /* @__PURE__ */ jsxs73("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
+      /* @__PURE__ */ jsx276(
         "input",
         {
           ...getBaseHTMLProps(
@@ -12045,7 +12163,7 @@ var ToggleRadio = forwardRef81(
           "aria-labelledby": ariaLabelledBy
         }
       ),
-      /* @__PURE__ */ jsxs72(
+      /* @__PURE__ */ jsxs73(
         Typography,
         {
           as: "span",
@@ -12056,8 +12174,8 @@ var ToggleRadio = forwardRef81(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            icon2 && /* @__PURE__ */ jsx275(Icon, { icon: icon2, iconSize: "inherit" }),
-            label && /* @__PURE__ */ jsx275("span", { children: label })
+            icon2 && /* @__PURE__ */ jsx276(Icon, { icon: icon2, iconSize: "inherit" }),
+            label && /* @__PURE__ */ jsx276("span", { children: label })
           ]
         }
       )
@@ -12067,7 +12185,7 @@ var ToggleRadio = forwardRef81(
 ToggleRadio.displayName = "ToggleRadio";
 
 // src/components/ToggleButton/ToggleButton.tsx
-import { forwardRef as forwardRef82, useId as useId26 } from "react";
+import { forwardRef as forwardRef83, useId as useId27 } from "react";
 
 // src/components/ToggleButton/ToggleButton.module.css
 var ToggleButton_default = {
@@ -12080,13 +12198,13 @@ var ToggleButton_default = {
 };
 
 // src/components/ToggleButton/ToggleButton.tsx
-import { jsx as jsx276, jsxs as jsxs73 } from "react/jsx-runtime";
-var ToggleButton = forwardRef82(
+import { jsx as jsx277, jsxs as jsxs74 } from "react/jsx-runtime";
+var ToggleButton = forwardRef83(
   ({ id, label, icon: icon2, className, htmlProps, ...rest }, ref) => {
-    const generatedId = useId26();
+    const generatedId = useId27();
     const uniqueId = id != null ? id : `${generatedId}-toggleButton`;
-    return /* @__PURE__ */ jsxs73("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
-      /* @__PURE__ */ jsx276(
+    return /* @__PURE__ */ jsxs74("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
+      /* @__PURE__ */ jsx277(
         "input",
         {
           ...getBaseHTMLProps(
@@ -12103,7 +12221,7 @@ var ToggleButton = forwardRef82(
           type: "checkbox"
         }
       ),
-      /* @__PURE__ */ jsxs73(
+      /* @__PURE__ */ jsxs74(
         "span",
         {
           className: cn(
@@ -12112,7 +12230,7 @@ var ToggleButton = forwardRef82(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            icon2 && /* @__PURE__ */ jsx276(Icon, { icon: icon2, iconSize: "inherit" }),
+            icon2 && /* @__PURE__ */ jsx277(Icon, { icon: icon2, iconSize: "inherit" }),
             " ",
             label
           ]
@@ -12124,8 +12242,8 @@ var ToggleButton = forwardRef82(
 ToggleButton.displayName = "ToggleButton";
 
 // src/components/ToggleButton/ToggleButtonGroup.tsx
-import { useId as useId27 } from "react";
-import { jsx as jsx277, jsxs as jsxs74 } from "react/jsx-runtime";
+import { useId as useId28 } from "react";
+import { jsx as jsx278, jsxs as jsxs75 } from "react/jsx-runtime";
 var ToggleButtonGroup = (props) => {
   const {
     children,
@@ -12137,9 +12255,9 @@ var ToggleButtonGroup = (props) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = useId27();
+  const generatedId = useId28();
   const uniqueLabelId = labelId != null ? labelId : `${generatedId}-ToggleButtonGroupLabel`;
-  return /* @__PURE__ */ jsxs74(
+  return /* @__PURE__ */ jsxs75(
     "div",
     {
       ...getBaseHTMLProps(
@@ -12151,7 +12269,7 @@ var ToggleButtonGroup = (props) => {
       role: "group",
       "aria-labelledby": label ? uniqueLabelId : void 0,
       children: [
-        !!label && /* @__PURE__ */ jsx277(
+        !!label && /* @__PURE__ */ jsx278(
           Typography,
           {
             as: "span",
@@ -12160,7 +12278,7 @@ var ToggleButtonGroup = (props) => {
             children: label
           }
         ),
-        /* @__PURE__ */ jsx277("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
+        /* @__PURE__ */ jsx278("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
       ]
     }
   );
@@ -12330,6 +12448,8 @@ export {
   ModalBody,
   MoreHorizontalIcon,
   MoreVerticalIcon,
+  NativeSelect,
+  NativeSelectPlaceholder,
   NotarialIcon,
   NotificationsIcon,
   NotificationsOffIcon,