@norges-domstoler/dds-components 17.4.0 → 17.5.0

package/dist/index.js

@@ -275,6 +275,7 @@ __export(src_exports, {
   PersonAddIcon: () => PersonAddIcon,
   PersonIcon: () => PersonIcon,
   PersonShieldedIcon: () => PersonShieldedIcon,
+  PhoneInput: () => PhoneInput,
   PinIcon: () => PinIcon,
   PlusCircledIcon: () => PlusCircledIcon,
   PlusIcon: () => PlusIcon,
@@ -363,6 +364,7 @@ __export(src_exports, {
   ZoomOutIcon: () => ZoomOutIcon,
   calendarDateToNativeDate: () => calendarDateToNativeDate,
   cn: () => cn,
+  countryOptions: () => countryOptions,
   createSelectOptions: () => createSelectOptions,
   dangerInputfield: () => dangerInputfield,
   dateValueToNativeDate: () => dateValueToNativeDate,
@@ -865,7 +867,7 @@ var Input_default = {
   "input--with-affix": "Input_input--with-affix",
   label: "Input_label",
   "char-counter": "Input_char-counter",
-  icon: "Input_icon"
+  "input-group__absolute-element": "Input_input-group__absolute-element"
 };
 
 // src/components/Typography/Caption/Caption.tsx
@@ -2504,7 +2506,7 @@ var import_react15 = require("react");
 var import_react6 = require("react");
 function useCombinedRef(...refs) {
   return (0, import_react6.useCallback)((element) => {
-    refs.forEach((ref) => {
+    refs.filter(Boolean).forEach((ref) => {
       if (typeof ref === "function") ref(element);
       else if (ref && typeof ref === "object")
         ref.current = element;
@@ -10022,7 +10024,10 @@ var DDSControl = (props, componentSize, readOnly, icon, dataTestId) => {
               {
                 icon,
                 iconSize: getFormInputIconSize(componentSize),
-                className: cn(Input_default.icon, Select_default[`icon--${componentSize}`])
+                className: cn(
+                  Input_default["input-group__absolute-element"],
+                  Select_default[`icon--${componentSize}`]
+                )
               }
             ),
             props.children
@@ -10531,10 +10536,936 @@ var Pagination = (0, import_react107.forwardRef)(
 );
 Pagination.displayName = "Pagination";
 
-// src/components/Popover/Popover.tsx
+// src/components/PhoneInput/PhoneInput.tsx
 var import_dds_design_tokens15 = require("@norges-domstoler/dds-design-tokens");
 var import_react108 = require("react");
 
+// src/components/PhoneInput/constants.ts
+var COUNTRIES = {
+  AF: {
+    name: "Afghanistan (\u202B\u0627\u0641\u063A\u0627\u0646\u0633\u062A\u0627\u0646\u202C\u200E)",
+    id: "AF",
+    dialCode: "+93"
+  },
+  AL: {
+    name: "Albania (Shqip\xEBri)",
+    id: "AL",
+    dialCode: "+355"
+  },
+  DZ: {
+    name: "Algeria (\u202B\u0627\u0644\u062C\u0632\u0627\u0626\u0631\u202C\u200E)",
+    id: "DZ",
+    dialCode: "+213"
+  },
+  AS: {
+    name: "American Samoa",
+    id: "AS",
+    dialCode: "+1684"
+  },
+  AD: { name: "Andorra", id: "AD", dialCode: "+376" },
+  AO: { name: "Angola", id: "AO", dialCode: "+244" },
+  AI: { name: "Anguilla", id: "AI", dialCode: "+1264" },
+  AG: {
+    name: "Antigua and Barbuda",
+    id: "AG",
+    dialCode: "+1268"
+  },
+  AR: { name: "Argentina", id: "AR", dialCode: "+54" },
+  AM: {
+    name: "Armenia (\u0540\u0561\u0575\u0561\u057D\u057F\u0561\u0576)",
+    id: "AM",
+    dialCode: "+374"
+  },
+  AW: { name: "Aruba", id: "AW", dialCode: "+297" },
+  AU: { name: "Australia", id: "AU", dialCode: "+61" },
+  AT: {
+    name: "Austria (\xD6sterreich)",
+    id: "AT",
+    dialCode: "+43"
+  },
+  AZ: {
+    name: "Azerbaijan (Az\u0259rbaycan)",
+    id: "AZ",
+    dialCode: "+994"
+  },
+  BS: { name: "Bahamas", id: "BS", dialCode: "+1242" },
+  BH: {
+    name: "Bahrain (\u202B\u0627\u0644\u0628\u062D\u0631\u064A\u0646\u202C\u200E)",
+    id: "BH",
+    dialCode: "+973"
+  },
+  BD: {
+    name: "Bangladesh (\u09AC\u09BE\u0982\u09B2\u09BE\u09A6\u09C7\u09B6)",
+    id: "BD",
+    dialCode: "+880"
+  },
+  BB: { name: "Barbados", id: "BB", dialCode: "+1246" },
+  BY: {
+    name: "Belarus (\u0411\u0435\u043B\u0430\u0440\u0443\u0441\u044C)",
+    id: "BY",
+    dialCode: "+375"
+  },
+  BE: { name: "Belgium (Belgi\xEB)", id: "BE", dialCode: "+32" },
+  BZ: { name: "Belize", id: "BZ", dialCode: "+501" },
+  BJ: { name: "Benin (B\xE9nin)", id: "BJ", dialCode: "+229" },
+  BM: { name: "Bermuda", id: "BM", dialCode: "+1441" },
+  BT: { name: "Bhutan (\u0F60\u0F56\u0FB2\u0F74\u0F42)", id: "BT", dialCode: "+975" },
+  BO: { name: "Bolivia", id: "BO", dialCode: "+591" },
+  BA: {
+    name: "Bosnia and Herzegovina (\u0411\u043E\u0441\u043D\u0430 \u0438 \u0425\u0435\u0440\u0446\u0435\u0433\u043E\u0432\u0438\u043D\u0430)",
+    id: "BA",
+    dialCode: "+387"
+  },
+  BW: { name: "Botswana", id: "BW", dialCode: "+267" },
+  BR: { name: "Brazil (Brasil)", id: "BR", dialCode: "+55" },
+  IO: {
+    name: "British Indian Ocean Territory",
+    id: "IO",
+    dialCode: "+246"
+  },
+  VG: {
+    name: "British Virgin Islands",
+    id: "VG",
+    dialCode: "+1284"
+  },
+  BN: { name: "Brunei", id: "BN", dialCode: "+673" },
+  BG: {
+    name: "Bulgaria (\u0411\u044A\u043B\u0433\u0430\u0440\u0438\u044F)",
+    id: "BG",
+    dialCode: "+359"
+  },
+  BF: { name: "Burkina Faso", id: "BF", dialCode: "+226" },
+  BI: {
+    name: "Burundi (Uburundi)",
+    id: "BI",
+    dialCode: "+257"
+  },
+  KH: {
+    name: "Cambodia (\u1780\u1798\u17D2\u1796\u17BB\u1787\u17B6)",
+    id: "KH",
+    dialCode: "+855"
+  },
+  CM: {
+    name: "Cameroon (Cameroun)",
+    id: "CM",
+    dialCode: "+237"
+  },
+  CA: { name: "Canada", id: "CA", dialCode: "+1" },
+  CV: {
+    name: "Cape Verde (Kabu Verdi)",
+    id: "CV",
+    dialCode: "+238"
+  },
+  KY: {
+    name: "Cayman Islands",
+    id: "KY",
+    dialCode: "+1345"
+  },
+  CF: {
+    name: "Central African Republic (R\xE9publique centrafricaine)",
+    id: "CF",
+    dialCode: "+236"
+  },
+  TD: { name: "Chad (Tchad)", id: "TD", dialCode: "+235" },
+  CL: { name: "Chile", id: "CL", dialCode: "+56" },
+  CN: { name: "China (\u4E2D\u56FD)", id: "CN", dialCode: "+86" },
+  CX: { name: "Christmas Island", id: "CX", dialCode: "+61" },
+  CC: {
+    name: "Cocos (Keeling) Islands",
+    id: "CC",
+    dialCode: "+61"
+  },
+  CO: { name: "Colombia", id: "CO", dialCode: "+57" },
+  KM: {
+    name: "Comoros (\u202B\u062C\u0632\u0631 \u0627\u0644\u0642\u0645\u0631\u202C\u200E)",
+    id: "KM",
+    dialCode: "+269"
+  },
+  CD: {
+    name: "Congo (DRC) (Jamhuri ya Kisoemokrasia ya Kongo)",
+    id: "CD",
+    dialCode: "+243"
+  },
+  CG: {
+    name: "Congo (Republic) (Congo-Brazzaville)",
+    id: "CG",
+    dialCode: "+242"
+  },
+  CK: { name: "Cook Islands", id: "CK", dialCode: "+682" },
+  CR: { name: "Costa Rica", id: "CR", dialCode: "+506" },
+  CI: { name: "C\xF4te d\u2019Ivoire", id: "CI", dialCode: "+225" },
+  HR: {
+    name: "Croatia (Hrvatska)",
+    id: "HR",
+    dialCode: "+385"
+  },
+  CU: { name: "Cuba", id: "CU", dialCode: "+53" },
+  CW: { name: "Cura\xE7ao", id: "CW", dialCode: "+599" },
+  CY: {
+    name: "Cyprus (\u039A\u03CD\u03C0\u03C1\u03BF\u03C2)",
+    id: "CY",
+    dialCode: "+357"
+  },
+  CZ: {
+    name: "Czech Republic (\u010Cesk\xE1 republika)",
+    id: "CZ",
+    dialCode: "+420"
+  },
+  DK: {
+    name: "Denmark (Danmark)",
+    id: "DK",
+    dialCode: "+45"
+  },
+  DJ: { name: "Djibouti", id: "DJ", dialCode: "+253" },
+  DM: { name: "Dominica", id: "DM", dialCode: "+1767" },
+  DO: {
+    name: "Dominican Republic (Rep\xFAblica Dominicana)",
+    id: "DO",
+    dialCode: "+1"
+  },
+  EC: { name: "Ecuador", id: "EC", dialCode: "+593" },
+  EG: { name: "Egypt (\u202B\u0645\u0635\u0631\u202C\u200E)", id: "EG", dialCode: "+20" },
+  SV: { name: "El Salvador", id: "SV", dialCode: "+503" },
+  GQ: {
+    name: "Equatorial Guinea (Guinea Ecuatorial)",
+    id: "GQ",
+    dialCode: "+240"
+  },
+  ER: { name: "Eritrea", id: "ER", dialCode: "+291" },
+  EE: {
+    name: "Estonia (Eesti)",
+    id: "EE",
+    dialCode: "+372"
+  },
+  ET: { name: "Ethiopia", id: "ET", dialCode: "+251" },
+  FK: {
+    name: "Falkland Islands (Islas Malvinas)",
+    id: "FK",
+    dialCode: "+500"
+  },
+  FO: {
+    name: "Faroe Islands (F\xF8royar)",
+    id: "FO",
+    dialCode: "+298"
+  },
+  FJ: { name: "Fiji", id: "FJ", dialCode: "+679" },
+  FI: {
+    name: "Finland (Suomi)",
+    id: "FI",
+    dialCode: "+358"
+  },
+  FR: { name: "France", id: "FR", dialCode: "+33" },
+  GF: {
+    name: "French Guiana (Guyane fran\xE7aise)",
+    id: "GF",
+    dialCode: "+594"
+  },
+  PF: {
+    name: "French Polynesia (Polyn\xE9sie fran\xE7aise)",
+    id: "PF",
+    dialCode: "+689"
+  },
+  GA: { name: "Gabon", id: "GA", dialCode: "+241" },
+  GM: { name: "Gambia", id: "GM", dialCode: "+220" },
+  GE: {
+    name: "Georgia (\u10E1\u10D0\u10E5\u10D0\u10E0\u10D7\u10D5\u10D4\u10DA\u10DD)",
+    id: "GE",
+    dialCode: "+995"
+  },
+  DE: {
+    name: "Germany (Deutschland)",
+    id: "DE",
+    dialCode: "+49"
+  },
+  GH: { name: "Ghana (Gaana)", id: "GH", dialCode: "+233" },
+  GI: { name: "Gibraltar", id: "GI", dialCode: "+350" },
+  GR: { name: "Greece (\u0395\u03BB\u03BB\u03AC\u03B4\u03B1)", id: "GR", dialCode: "+30" },
+  GL: {
+    name: "Greenland (Kalaallit Nunaat)",
+    id: "GL",
+    dialCode: "+299"
+  },
+  GD: { name: "Grenada", id: "GD", dialCode: "+1473" },
+  GP: { name: "Guadeloupe", id: "GP", dialCode: "+590" },
+  GU: { name: "Guam", id: "GU", dialCode: "+1671" },
+  GT: { name: "Guatemala", id: "GT", dialCode: "+502" },
+  GG: { name: "Guernsey", id: "GG", dialCode: "+44" },
+  GN: {
+    name: "Guinea (Guin\xE9e)",
+    id: "GN",
+    dialCode: "+224"
+  },
+  GW: {
+    name: "Guinea-Bissau (Guin\xE9 Bissau)",
+    id: "GW",
+    dialCode: "+245"
+  },
+  GY: { name: "Guyana", id: "GY", dialCode: "+592" },
+  HT: { name: "Haiti", id: "HT", dialCode: "+509" },
+  HN: { name: "Honduras", id: "HN", dialCode: "+504" },
+  HK: {
+    name: "Hong Kong (\u9999\u6E2F)",
+    id: "HK",
+    dialCode: "+852"
+  },
+  HU: {
+    name: "Hungary (Magyarorsz\xE1g)",
+    id: "HU",
+    dialCode: "+36"
+  },
+  IS: {
+    name: "Iceland (\xCDsland)",
+    id: "IS",
+    dialCode: "+354"
+  },
+  IN: { name: "India (\u092D\u093E\u0930\u0924)", id: "IN", dialCode: "+91" },
+  ID: { name: "Indonesia", id: "ID", dialCode: "+62" },
+  IR: { name: "Iran (\u202B\u0627\u06CC\u0631\u0627\u0646\u202C\u200E)", id: "IR", dialCode: "+98" },
+  IQ: {
+    name: "Iraq (\u202B\u0627\u0644\u0639\u0631\u0627\u0642\u202C\u200E)",
+    id: "IQ",
+    dialCode: "+964"
+  },
+  IE: { name: "Ireland", id: "IE", dialCode: "+353" },
+  IM: { name: "Isle of Man", id: "IM", dialCode: "+44" },
+  IL: {
+    name: "Israel (\u202B\u05D9\u05E9\u05E8\u05D0\u05DC\u202C\u200E)",
+    id: "IL",
+    dialCode: "+972"
+  },
+  IT: { name: "Italy (Italia)", id: "IT", dialCode: "+39" },
+  JM: { name: "Jamaica", id: "JM", dialCode: "+1" },
+  JP: { name: "Japan (\u65E5\u672C)", id: "JP", dialCode: "+81" },
+  JE: { name: "Jersey", id: "JE", dialCode: "+44" },
+  JO: {
+    name: "Jordan (\u202B\u0627\u0644\u0623\u0631\u062F\u0646\u202C\u200E)",
+    id: "JO",
+    dialCode: "+962"
+  },
+  KZ: {
+    name: "Kazakhstan (\u041A\u0430\u0437\u0430\u0445\u0441\u0442\u0430\u043D)",
+    id: "KZ",
+    dialCode: "+7"
+  },
+  KE: { name: "Kenya", id: "KE", dialCode: "+254" },
+  KI: { name: "Kiribati", id: "KI", dialCode: "+686" },
+  XK: { name: "Kosovo", id: "XK", dialCode: "+383" },
+  KW: {
+    name: "Kuwait (\u202B\u0627\u0644\u0643\u0648\u064A\u062A\u202C\u200E)",
+    id: "KW",
+    dialCode: "+965"
+  },
+  KG: {
+    name: "Kyrgyzstan (\u041A\u044B\u0440\u0433\u044B\u0437\u0441\u0442\u0430\u043D)",
+    id: "KG",
+    dialCode: "+996"
+  },
+  LA: { name: "Laos (\u0EA5\u0EB2\u0EA7)", id: "LA", dialCode: "+856" },
+  LV: {
+    name: "Latvia (Latvija)",
+    id: "LV",
+    dialCode: "+371"
+  },
+  LB: {
+    name: "Lebanon (\u202B\u0644\u0628\u0646\u0627\u0646\u202C\u200E)",
+    id: "LB",
+    dialCode: "+961"
+  },
+  LS: { name: "Lesotho", id: "LS", dialCode: "+266" },
+  LR: { name: "Liberia", id: "LR", dialCode: "+231" },
+  LY: {
+    name: "Libya (\u202B\u0644\u064A\u0628\u064A\u0627\u202C\u200E)",
+    id: "LY",
+    dialCode: "+218"
+  },
+  LI: { name: "Liechtenstein", id: "LI", dialCode: "+423" },
+  LT: {
+    name: "Lithuania (Lietuva)",
+    id: "LT",
+    dialCode: "+370"
+  },
+  LU: { name: "Luxembourg", id: "LU", dialCode: "+352" },
+  MO: { name: "Macau (\u6FB3\u9580)", id: "MO", dialCode: "+853" },
+  MK: {
+    name: "North Macedonia (FYROM) (\u041C\u0430\u043A\u0435\u0434\u043E\u043D\u0438\u0458\u0430)",
+    id: "MK",
+    dialCode: "+389"
+  },
+  MG: {
+    name: "Madagascar (Madagasikara)",
+    id: "MG",
+    dialCode: "+261"
+  },
+  MW: { name: "Malawi", id: "MW", dialCode: "+265" },
+  MY: { name: "Malaysia", id: "MY", dialCode: "+60" },
+  MV: { name: "Maldives", id: "MV", dialCode: "+960" },
+  ML: { name: "Mali", id: "ML", dialCode: "+223" },
+  MT: { name: "Malta", id: "MT", dialCode: "+356" },
+  MH: {
+    name: "Marshall Islands",
+    id: "MH",
+    dialCode: "+692"
+  },
+  MQ: { name: "Martinique", id: "MQ", dialCode: "+596" },
+  MR: {
+    name: "Mauritania (\u202B\u0645\u0648\u0631\u064A\u062A\u0627\u0646\u064A\u0627\u202C\u200E)",
+    id: "MR",
+    dialCode: "+222"
+  },
+  MU: {
+    name: "Mauritius (Moris)",
+    id: "MU",
+    dialCode: "+230"
+  },
+  YT: { name: "Mayotte", id: "YT", dialCode: "+262" },
+  MX: { name: "Mexico (M\xE9xico)", id: "MX", dialCode: "+52" },
+  FM: { name: "Micronesia", id: "FM", dialCode: "+691" },
+  MD: {
+    name: "Moldova (Republica Moldova)",
+    id: "MD",
+    dialCode: "+373"
+  },
+  MC: { name: "Monaco", id: "MC", dialCode: "+377" },
+  MN: {
+    name: "Mongolia (\u041C\u043E\u043D\u0433\u043E\u043B)",
+    id: "MN",
+    dialCode: "+976"
+  },
+  ME: {
+    name: "Montenegro (Crna Gora)",
+    id: "ME",
+    dialCode: "+382"
+  },
+  MS: { name: "Montserrat", id: "MS", dialCode: "+1664" },
+  MA: {
+    name: "Morocco (\u202B\u0627\u0644\u0645\u063A\u0631\u0628\u202C\u200E)",
+    id: "MA",
+    dialCode: "+212"
+  },
+  MZ: {
+    name: "Mozambique (Mo\xE7ambique)",
+    id: "MZ",
+    dialCode: "+258"
+  },
+  MM: {
+    name: "Myanmar (Burma) (\u1019\u103C\u1014\u103A\u1019\u102C)",
+    id: "MM",
+    dialCode: "+95"
+  },
+  NA: {
+    name: "Namibia (Namibi\xEB)",
+    id: "NA",
+    dialCode: "+264"
+  },
+  NR: { name: "Nauru", id: "NR", dialCode: "+674" },
+  NP: { name: "Nepal (\u0928\u0947\u092A\u093E\u0932)", id: "NP", dialCode: "+977" },
+  NL: {
+    name: "Netherlands (Nederland)",
+    id: "NL",
+    dialCode: "+31"
+  },
+  NC: {
+    name: "New Caledonia (Nouvelle-Cal\xE9donie)",
+    id: "NC",
+    dialCode: "+687"
+  },
+  NZ: { name: "New Zealand", id: "NZ", dialCode: "+64" },
+  NI: { name: "Nicaragua", id: "NI", dialCode: "+505" },
+  NE: { name: "Niger (Nijar)", id: "NE", dialCode: "+227" },
+  NG: { name: "Nigeria", id: "NG", dialCode: "+234" },
+  NU: { name: "Niue", id: "NU", dialCode: "+683" },
+  NF: { name: "Norfolk Island", id: "NF", dialCode: "+672" },
+  KP: {
+    name: "North Korea (\uC870\uC120 \uBBFC\uC8FC\uC8FC\uC758 \uC778\uBBFC \uACF5\uD654\uAD6D)",
+    id: "KP",
+    dialCode: "+850"
+  },
+  MP: {
+    name: "Northern Mariana Islands",
+    id: "MP",
+    dialCode: "+1670"
+  },
+  NO: { name: "Norway (Norge)", id: "NO", dialCode: "+47" },
+  OM: {
+    name: "Oman (\u202B\u0639\u064F\u0645\u0627\u0646\u202C\u200E)",
+    id: "OM",
+    dialCode: "+968"
+  },
+  PK: {
+    name: "Pakistan (\u202B\u067E\u0627\u06A9\u0633\u062A\u0627\u0646\u202C\u200E)",
+    id: "PK",
+    dialCode: "+92"
+  },
+  PW: { name: "Palau", id: "PW", dialCode: "+680" },
+  PS: {
+    name: "Palestine (\u202B\u0641\u0644\u0633\u0637\u064A\u0646\u202C\u200E)",
+    id: "PS",
+    dialCode: "+970"
+  },
+  PA: {
+    name: "Panama (Panam\xE1)",
+    id: "PA",
+    dialCode: "+507"
+  },
+  PG: {
+    name: "Papua New Guinea",
+    id: "PG",
+    dialCode: "+675"
+  },
+  PY: { name: "Paraguay", id: "PY", dialCode: "+595" },
+  PE: { name: "Peru (Per\xFA)", id: "PE", dialCode: "+51" },
+  PH: { name: "Philippines", id: "PH", dialCode: "+63" },
+  PL: { name: "Poland (Polska)", id: "PL", dialCode: "+48" },
+  PT: { name: "Portugal", id: "PT", dialCode: "+351" },
+  PR: { name: "Puerto Rico", id: "PR", dialCode: "+1" },
+  QA: { name: "Qatar (\u202B\u0642\u0637\u0631\u202C\u200E)", id: "QA", dialCode: "+974" },
+  RE: {
+    name: "R\xE9union (La R\xE9union)",
+    id: "RE",
+    dialCode: "+262"
+  },
+  RO: {
+    name: "Romania (Rom\xE2nia)",
+    id: "RO",
+    dialCode: "+40"
+  },
+  RU: { name: "Russia (\u0420\u043E\u0441\u0441\u0438\u044F)", id: "RU", dialCode: "+7" },
+  RW: { name: "Rwanda", id: "RW", dialCode: "+250" },
+  BL: {
+    name: "Saint Barth\xE9lemy",
+    id: "BL",
+    dialCode: "+590"
+  },
+  SH: { name: "Saint Helena", id: "SH", dialCode: "+290" },
+  KN: {
+    name: "Saint Kitts and Nevis",
+    id: "KN",
+    dialCode: "+1869"
+  },
+  LC: { name: "Saint Lucia", id: "LC", dialCode: "+1758" },
+  MF: {
+    name: "Saint Martin (Saint-Martin (partie fran\xE7aise))",
+    id: "MF",
+    dialCode: "+590"
+  },
+  PM: {
+    name: "Saint Pierre and Miquelon (Saint-Pierre-et-Miquelon)",
+    id: "PM",
+    dialCode: "+508"
+  },
+  VC: {
+    name: "Saint Vincent and the Grenadines",
+    id: "VC",
+    dialCode: "+1784"
+  },
+  WS: { name: "Samoa", id: "WS", dialCode: "+685" },
+  SM: { name: "San Marino", id: "SM", dialCode: "+378" },
+  ST: {
+    name: "S\xE3o Tom\xE9 and Pr\xEDncipe (S\xE3o Tom\xE9 e Pr\xEDncipe)",
+    id: "ST",
+    dialCode: "+239"
+  },
+  SA: {
+    name: "Saudi Arabia (\u202B\u0627\u0644\u0645\u0645\u0644\u0643\u0629 \u0627\u0644\u0639\u0631\u0628\u064A\u0629 \u0627\u0644\u0633\u0639\u0648\u062F\u064A\u0629\u202C\u200E)",
+    id: "SA",
+    dialCode: "+966"
+  },
+  SN: {
+    name: "Senegal (S\xE9n\xE9gal)",
+    id: "SN",
+    dialCode: "+221"
+  },
+  RS: {
+    name: "Serbia (\u0421\u0440\u0431\u0438\u0458\u0430)",
+    id: "RS",
+    dialCode: "+381"
+  },
+  SC: { name: "Seychelles", id: "SC", dialCode: "+248" },
+  SL: { name: "Sierra Leone", id: "SL", dialCode: "+232" },
+  SG: { name: "Singapore", id: "SG", dialCode: "+65" },
+  SX: { name: "Sint Maarten", id: "SX", dialCode: "+1721" },
+  SK: {
+    name: "Slovakia (Slovensko)",
+    id: "SK",
+    dialCode: "+421"
+  },
+  SI: {
+    name: "Slovenia (Slovenija)",
+    id: "SI",
+    dialCode: "+386"
+  },
+  SB: {
+    name: "Solomon Islands",
+    id: "SB",
+    dialCode: "+677"
+  },
+  SO: {
+    name: "Somalia (Soomaaliya)",
+    id: "SO",
+    dialCode: "+252"
+  },
+  ZA: { name: "South Africa", id: "ZA", dialCode: "+27" },
+  KR: {
+    name: "South Korea (\uB300\uD55C\uBBFC\uAD6D)",
+    id: "KR",
+    dialCode: "+82"
+  },
+  SS: {
+    name: "South Sudan (\u202B\u062C\u0646\u0648\u0628 \u0627\u0644\u0633\u0648\u062F\u0627\u0646\u202C\u200E)",
+    id: "SS",
+    dialCode: "+211"
+  },
+  ES: { name: "Spain (Espa\xF1a)", id: "ES", dialCode: "+34" },
+  LK: {
+    name: "Sri Lanka (\u0DC1\u0DCA\u200D\u0DBB\u0DD3 \u0DBD\u0D82\u0D9A\u0DCF\u0DC0)",
+    id: "LK",
+    dialCode: "+94"
+  },
+  SD: {
+    name: "Sudan (\u202B\u0627\u0644\u0633\u0648\u062F\u0627\u0646\u202C\u200E)",
+    id: "SD",
+    dialCode: "+249"
+  },
+  SR: { name: "Suriname", id: "SR", dialCode: "+597" },
+  SJ: {
+    name: "Svalbard and Jan Mayen",
+    id: "SJ",
+    dialCode: "+47"
+  },
+  SZ: { name: "Swaziland", id: "SZ", dialCode: "+268" },
+  SE: { name: "Sweden (Sverige)", id: "SE", dialCode: "+46" },
+  CH: {
+    name: "Switzerland (Schweiz)",
+    id: "CH",
+    dialCode: "+41"
+  },
+  SY: {
+    name: "Syria (\u202B\u0633\u0648\u0631\u064A\u0627\u202C\u200E)",
+    id: "SY",
+    dialCode: "+963"
+  },
+  TW: { name: "Taiwan (\u53F0\u7063)", id: "TW", dialCode: "+886" },
+  TJ: { name: "Tajikistan", id: "TJ", dialCode: "+992" },
+  TZ: { name: "Tanzania", id: "TZ", dialCode: "+255" },
+  TH: { name: "Thailand (\u0E44\u0E17\u0E22)", id: "TH", dialCode: "+66" },
+  TL: { name: "Timor-Leste", id: "TL", dialCode: "+670" },
+  TG: { name: "Togo", id: "TG", dialCode: "+228" },
+  TK: { name: "Tokelau", id: "TK", dialCode: "+690" },
+  TO: { name: "Tonga", id: "TO", dialCode: "+676" },
+  TT: {
+    name: "Trinisoad and Tobago",
+    id: "TT",
+    dialCode: "+1868"
+  },
+  TN: {
+    name: "Tunisia (\u202B\u062A\u0648\u0646\u0633\u202C\u200E)",
+    id: "TN",
+    dialCode: "+216"
+  },
+  TR: { name: "Turkey (T\xFCrkiye)", id: "TR", dialCode: "+90" },
+  TM: { name: "Turkmenistan", id: "TM", dialCode: "+993" },
+  TC: {
+    name: "Turks and Caicos Islands",
+    id: "TC",
+    dialCode: "+1649"
+  },
+  TV: { name: "Tuvalu", id: "TV", dialCode: "+688" },
+  VI: {
+    name: "U.S. Virgin Islands",
+    id: "VI",
+    dialCode: "+1340"
+  },
+  UG: { name: "Uganda", id: "UG", dialCode: "+256" },
+  UA: {
+    name: "Ukraine (\u0423\u043A\u0440\u0430\u0457\u043D\u0430)",
+    id: "UA",
+    dialCode: "+380"
+  },
+  AE: {
+    name: "United Arab Emirates (\u202B\u0627\u0644\u0625\u0645\u0627\u0631\u0627\u062A \u0627\u0644\u0639\u0631\u0628\u064A\u0629 \u0627\u0644\u0645\u062A\u062D\u062F\u0629\u202C\u200E)",
+    id: "AE",
+    dialCode: "+971"
+  },
+  GB: { name: "United Kingdom", id: "GB", dialCode: "+44" },
+  US: { name: "United States", id: "US", dialCode: "+1" },
+  UY: { name: "Uruguay", id: "UY", dialCode: "+598" },
+  UZ: {
+    name: "Uzbekistan (O\u02BBzbekiston)",
+    id: "UZ",
+    dialCode: "+998"
+  },
+  VU: { name: "Vanuatu", id: "VU", dialCode: "+678" },
+  VA: {
+    name: "Vatican City (Citt\xE0 del Vaticano)",
+    id: "VA",
+    dialCode: "+39"
+  },
+  VE: { name: "Venezuela", id: "VE", dialCode: "+58" },
+  VN: {
+    name: "Vietnam (Vi\u1EC7t Nam)",
+    id: "VN",
+    dialCode: "+84"
+  },
+  WF: {
+    name: "Wallis and Futuna (Wallis-et-Futuna)",
+    id: "WF",
+    dialCode: "+681"
+  },
+  YE: {
+    name: "Yemen (\u202B\u0627\u0644\u064A\u0645\u0646\u202C\u200E)",
+    id: "YE",
+    dialCode: "+967"
+  },
+  ZM: { name: "Zambia", id: "ZM", dialCode: "+260" },
+  ZW: { name: "Zimbabwe", id: "ZW", dialCode: "+263" },
+  AX: { name: "\xC5land Islands", id: "AX", dialCode: "+358" }
+};
+
+// src/components/PhoneInput/PhoneInput.module.css
+var PhoneInput_default = {
+  "inputs-container": "PhoneInput_inputs-container",
+  input: "PhoneInput_input",
+  select: "PhoneInput_select",
+  "select--tiny": "PhoneInput_select--tiny",
+  "inputs-container--small-screen-xs": "PhoneInput_inputs-container--small-screen-xs",
+  "inputs-container--small-screen-sm": "PhoneInput_inputs-container--small-screen-sm",
+  "inputs-container--small-screen-md": "PhoneInput_inputs-container--small-screen-md",
+  "inputs-container--small-screen-lg": "PhoneInput_inputs-container--small-screen-lg",
+  "inputs-container--small-screen-xl": "PhoneInput_inputs-container--small-screen-xl",
+  "calling-code": "PhoneInput_calling-code"
+};
+
+// src/components/PhoneInput/PhoneInput.tsx
+var import_jsx_runtime268 = require("react/jsx-runtime");
+var prioritizedCountries = [
+  COUNTRIES.NO,
+  COUNTRIES.SE,
+  COUNTRIES.DK,
+  COUNTRIES.FI
+];
+var prioritizedCountryOptions = prioritizedCountries.map((country) => {
+  return {
+    label: `${country.name} ${country.dialCode}`,
+    countryCode: country.id
+  };
+});
+var sortedCountryOptions = Object.values(
+  COUNTRIES
+).sort((a2, b) => +a2.name - +b.name).map((country) => ({
+  countryCode: country.id,
+  label: `${country.name} ${country.dialCode}`
+})).filter(
+  (country) => !prioritizedCountryOptions.some(
+    (pCountry) => pCountry.countryCode === country.countryCode
+  )
+);
+var countryOptions = [
+  ...prioritizedCountryOptions,
+  ...sortedCountryOptions
+];
+var PhoneInput = (0, import_react108.forwardRef)(
+  ({
+    label,
+    readOnly,
+    errorMessage,
+    tip,
+    required,
+    width,
+    componentSize = "medium",
+    name,
+    className,
+    style,
+    value,
+    selectLabel = "Landskode",
+    selectRef,
+    onChange,
+    defaultValue,
+    "aria-required": ariaRequired,
+    "aria-describedby": ariaDescribedby,
+    groupLabel = "Landskode og telefonnummer",
+    ...props
+  }, ref) => {
+    var _a;
+    const generatedId = (0, import_react108.useId)();
+    const uniqueId = (_a = props.id) != null ? _a : generatedId;
+    const phoneInputId = `${uniqueId}-phone-input`;
+    const phoneNumberId = `${uniqueId}-phone-number`;
+    const selectId = `${uniqueId}-country-code`;
+    const hasErrorMessage = !!errorMessage;
+    const hasTip = !!tip;
+    const hasLabel = !!label;
+    const hasMessage = hasErrorMessage || hasTip;
+    const tipId = derivativeIdGenerator(phoneInputId, "tip");
+    const errorMessageId = derivativeIdGenerator(phoneInputId, "errorMessage");
+    const [callingCode, setCallingCode] = (0, import_react108.useState)("");
+    const [selectedCountryCodeText, setSelectedCountryCodeText] = (0, import_react108.useState)("");
+    const [internalValue, setInternalValue] = (0, import_react108.useState)(
+      defaultValue != null ? defaultValue : {
+        countryCode: "",
+        phoneNumber: ""
+      }
+    );
+    const isControlled = value !== void 0;
+    const [callingCodeWidth, setCallingCodeWidth] = (0, import_react108.useState)(0);
+    const callingCodeRef = (0, import_react108.useRef)(null);
+    (0, import_react108.useLayoutEffect)(() => {
+      if (callingCodeRef.current) {
+        setCallingCodeWidth(callingCodeRef.current.offsetWidth);
+      }
+    }, [callingCode]);
+    const callingCodeInlineStart = callingCodeWidth ? import_dds_design_tokens15.ddsTokens.ddsSpacingX1NumberPx + callingCodeWidth + "px" : void 0;
+    const styleVariables = {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+      ["--dds-phone-input-width"]: width ? width : componentSize === "tiny" ? "131px" : "194px"
+    };
+    const internalSelectRef = (0, import_react108.useRef)(null);
+    const combinedSelectRef = useCombinedRef(selectRef, internalSelectRef);
+    const displayedValue = isControlled ? value : internalValue;
+    (0, import_react108.useEffect)(() => {
+      const selectEl = internalSelectRef.current;
+      if (selectEl && selectEl.value) {
+        const { options, selectedIndex } = selectEl;
+        const content = options[selectedIndex].innerHTML;
+        setSelectedCountryCodeText(content);
+        setCallingCode(getCallingCode(content));
+      }
+    }, [displayedValue == null ? void 0 : displayedValue.countryCode]);
+    const handleCountryCodeChange = (e) => {
+      var _a2;
+      const newValue = {
+        countryCode: e.target.value,
+        phoneNumber: (_a2 = displayedValue == null ? void 0 : displayedValue.phoneNumber) != null ? _a2 : ""
+      };
+      const { options, selectedIndex } = e.target;
+      const content = options[selectedIndex].innerHTML;
+      setCallingCode(getCallingCode(content));
+      if (isControlled && onChange) {
+        onChange(newValue);
+      } else {
+        setInternalValue(newValue);
+      }
+    };
+    const handlePhoneNumberChange = (e) => {
+      var _a2;
+      const newValue = {
+        countryCode: (_a2 = displayedValue == null ? void 0 : displayedValue.countryCode) != null ? _a2 : "",
+        phoneNumber: e.target.value
+      };
+      if (isControlled && onChange) {
+        onChange(newValue);
+      } else {
+        setInternalValue(newValue);
+      }
+    };
+    const commonProps = {
+      required,
+      "aria-required": ariaRequired,
+      disabled: props.disabled,
+      readOnly,
+      componentSize
+    };
+    const showRequiredStyling = !!(required || ariaRequired);
+    return /* @__PURE__ */ (0, import_jsx_runtime268.jsxs)("div", { className: cn(className, Input_default.container), style, children: [
+      hasLabel && /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+        Label,
+        {
+          htmlFor: phoneNumberId,
+          showRequiredStyling,
+          className: Input_default.label,
+          readOnly,
+          children: label
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime268.jsxs)(
+        "div",
+        {
+          className: cn(
+            PhoneInput_default["inputs-container"],
+            !!props.smallScreenBreakpoint && PhoneInput_default[`inputs-container--small-screen-${props.smallScreenBreakpoint}`]
+          ),
+          style: styleVariables,
+          role: "group",
+          "aria-label": groupLabel,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("label", { className: utilStyles_default["visually-hidden"], htmlFor: selectId, children: selectLabel }),
+            /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+              NativeSelect,
+              {
+                ...commonProps,
+                ref: combinedSelectRef,
+                id: selectId,
+                className: cn(
+                  PhoneInput_default.select,
+                  componentSize === "tiny" && PhoneInput_default["select--tiny"]
+                ),
+                onChange: handleCountryCodeChange,
+                defaultValue: defaultValue == null ? void 0 : defaultValue.countryCode,
+                value: (displayedValue == null ? void 0 : displayedValue.countryCode) || "",
+                title: selectedCountryCodeText,
+                name: `${name}-country-code`,
+                "aria-describedby": spaceSeparatedIdListGenerator([
+                  hasTip ? tipId : void 0,
+                  ariaDescribedby
+                ]),
+                children: countryOptions.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("option", { value: item.countryCode, children: item.label }, index))
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime268.jsxs)("div", { className: Input_default["input-group"], children: [
+              /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+                "span",
+                {
+                  className: cn(
+                    typographyStyles_default[getTypographyCn(inputTypographyTypes[componentSize])],
+                    Input_default["input-group__absolute-element"],
+                    PhoneInput_default["calling-code"]
+                  ),
+                  ref: callingCodeRef,
+                  children: callingCode
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+                StatefulInput,
+                {
+                  ref,
+                  type: "tel",
+                  ...commonProps,
+                  id: phoneNumberId,
+                  value: (displayedValue == null ? void 0 : displayedValue.phoneNumber) || "",
+                  defaultValue: defaultValue == null ? void 0 : defaultValue.phoneNumber,
+                  name: `${name}-phone-number`,
+                  onChange: handlePhoneNumberChange,
+                  style: {
+                    ...styleVariables,
+                    paddingInlineStart: callingCodeInlineStart
+                  },
+                  className: PhoneInput_default.input,
+                  hasErrorMessage,
+                  "aria-invalid": hasErrorMessage ? true : void 0,
+                  "aria-describedby": spaceSeparatedIdListGenerator([
+                    hasTip ? tipId : void 0,
+                    hasErrorMessage ? errorMessageId : void 0,
+                    ariaDescribedby
+                  ])
+                }
+              )
+            ] })
+          ]
+        }
+      ),
+      hasMessage && renderInputMessage(tip, tipId, errorMessage, errorMessageId)
+    ] });
+  }
+);
+PhoneInput.displayName = "PhoneInput";
+var getCallingCode = (s2) => {
+  var _a;
+  return (_a = s2.substring(s2.indexOf("+"), s2.length)) != null ? _a : "";
+};
+
+// src/components/Popover/Popover.tsx
+var import_dds_design_tokens16 = require("@norges-domstoler/dds-design-tokens");
+var import_react109 = require("react");
+
 // src/components/Popover/Popover.module.css
 var Popover_default = {
   container: "Popover_container",
@@ -10544,8 +11475,8 @@ var Popover_default = {
 };
 
 // src/components/Popover/Popover.tsx
-var import_jsx_runtime268 = require("react/jsx-runtime");
-var Popover = (0, import_react108.forwardRef)(
+var import_jsx_runtime269 = require("react/jsx-runtime");
+var Popover = (0, import_react109.forwardRef)(
   (props, ref) => {
     const {
       title,
@@ -10557,7 +11488,7 @@ var Popover = (0, import_react108.forwardRef)(
       anchorElement,
       children,
       placement = "bottom",
-      offset = import_dds_design_tokens15.ddsTokens.ddsSpacingX05NumberPx,
+      offset = import_dds_design_tokens16.ddsTokens.ddsSpacingX05NumberPx,
       sizeProps,
       id,
       className,
@@ -10585,7 +11516,7 @@ var Popover = (0, import_react108.forwardRef)(
     useOnClickOutside(elements, () => {
       if (isOpen) onClose && onClose();
     });
-    return isOpen || hasTransitionedIn ? /* @__PURE__ */ (0, import_jsx_runtime268.jsxs)(
+    return isOpen || hasTransitionedIn ? /* @__PURE__ */ (0, import_jsx_runtime269.jsxs)(
       Paper,
       {
         ...getBaseHTMLProps(
@@ -10607,15 +11538,15 @@ var Popover = (0, import_react108.forwardRef)(
         elevation: 3,
         border: "subtle",
         children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime268.jsx)("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(Heading, { level: 2, typographyType: "headingSans02", children: title }) : title }),
-          /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+          title && /* @__PURE__ */ (0, import_jsx_runtime269.jsx)("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ (0, import_jsx_runtime269.jsx)(Heading, { level: 2, typographyType: "headingSans02", children: title }) : title }),
+          /* @__PURE__ */ (0, import_jsx_runtime269.jsx)(
             "div",
             {
               className: !hasTitle && withCloseButton ? Popover_default["content--closable--no-title"] : "",
               children
             }
           ),
-          withCloseButton && /* @__PURE__ */ (0, import_jsx_runtime268.jsx)(
+          withCloseButton && /* @__PURE__ */ (0, import_jsx_runtime269.jsx)(
             Button,
             {
               icon: CloseIcon,
@@ -10634,8 +11565,8 @@ var Popover = (0, import_react108.forwardRef)(
 Popover.displayName = "Popover";
 
 // src/components/Popover/PopoverGroup.tsx
-var import_react109 = require("react");
-var import_jsx_runtime269 = require("react/jsx-runtime");
+var import_react110 = require("react");
+var import_jsx_runtime270 = require("react/jsx-runtime");
 var PopoverGroup = ({
   isOpen = false,
   onCloseButtonClick,
@@ -10643,8 +11574,8 @@ var PopoverGroup = ({
   children,
   popoverId
 }) => {
-  const [open, setOpen] = (0, import_react109.useState)(isOpen);
-  const generatedId = (0, import_react109.useId)();
+  const [open, setOpen] = (0, import_react110.useState)(isOpen);
+  const generatedId = (0, import_react110.useId)();
   const uniquePopoverId = popoverId != null ? popoverId : `${generatedId}-popover`;
   const handleOnCloseButtonClick = () => {
     setOpen(false);
@@ -10654,8 +11585,8 @@ var PopoverGroup = ({
     setOpen(!open);
     onTriggerClick && onTriggerClick();
   };
-  const buttonRef = (0, import_react109.useRef)(null);
-  const popoverRef = (0, import_react109.useRef)(null);
+  const buttonRef = (0, import_react110.useRef)(null);
+  const popoverRef = (0, import_react110.useRef)(null);
   useOnKeyDown(["Esc", "Escape"], () => {
     var _a;
     if (open) {
@@ -10664,14 +11595,14 @@ var PopoverGroup = ({
     }
   });
   const handleClose = () => setOpen(false);
-  const Children8 = import_react109.Children.map(children, (child, childIndex) => {
-    return (0, import_react109.isValidElement)(child) && (childIndex === 0 ? (0, import_react109.cloneElement)(child, {
+  const Children8 = import_react110.Children.map(children, (child, childIndex) => {
+    return (0, import_react110.isValidElement)(child) && (childIndex === 0 ? (0, import_react110.cloneElement)(child, {
       "aria-haspopup": "dialog",
       "aria-controls": uniquePopoverId,
       "aria-expanded": open,
       onClick: handleOnTriggerClick,
       ref: buttonRef
-    }) : (0, import_react109.cloneElement)(child, {
+    }) : (0, import_react110.cloneElement)(child, {
       isOpen: open,
       "aria-hidden": !open,
       id: uniquePopoverId,
@@ -10681,21 +11612,21 @@ var PopoverGroup = ({
       onClose: handleClose
     }));
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime269.jsx)(import_jsx_runtime269.Fragment, { children: Children8 });
+  return /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(import_jsx_runtime270.Fragment, { children: Children8 });
 };
 PopoverGroup.displayName = "PopoverGroup";
 
 // src/components/ProgressTracker/ProgressTracker.tsx
-var import_react112 = require("react");
+var import_react113 = require("react");
 
 // src/components/ProgressTracker/ProgressTracker.context.tsx
-var import_react110 = require("react");
-var ProgressTrackerContext = (0, import_react110.createContext)(
+var import_react111 = require("react");
+var ProgressTrackerContext = (0, import_react111.createContext)(
   {
     activeStep: 0
   }
 );
-var useProgressTrackerContext = () => (0, import_react110.useContext)(ProgressTrackerContext);
+var useProgressTrackerContext = () => (0, import_react111.useContext)(ProgressTrackerContext);
 
 // src/components/ProgressTracker/ProgressTracker.module.css
 var ProgressTracker_default = {
@@ -10719,8 +11650,8 @@ var ProgressTracker_default = {
 };
 
 // src/components/ProgressTracker/ProgressTrackerItem.tsx
-var import_react111 = require("react");
-var import_jsx_runtime270 = require("react/jsx-runtime");
+var import_react112 = require("react");
+var import_jsx_runtime271 = require("react/jsx-runtime");
 var toItemState = (active, completed, disabled) => {
   if (disabled) {
     return "disabled";
@@ -10761,17 +11692,17 @@ var ProgressTrackerItem = (props) => {
       handleStepChange && handleStepChange(index);
     }
   };
-  const stepNumberContent = (0, import_react111.useMemo)(() => {
+  const stepNumberContent = (0, import_react112.useMemo)(() => {
     if (completed) {
-      return /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(Icon, { icon: CheckIcon, iconSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(Icon, { icon: CheckIcon, iconSize: "small" });
     }
     if (icon !== void 0) {
-      return /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(Icon, { icon, iconSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(Icon, { icon, iconSize: "small" });
     }
     return index + 1;
   }, [completed, icon, index]);
-  const stepContent = /* @__PURE__ */ (0, import_jsx_runtime270.jsxs)(import_jsx_runtime270.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
+  const stepContent = /* @__PURE__ */ (0, import_jsx_runtime271.jsxs)(import_jsx_runtime271.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(
       "div",
       {
         "aria-hidden": true,
@@ -10783,7 +11714,7 @@ var ProgressTrackerItem = (props) => {
         children: stepNumberContent
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime270.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime271.jsxs)(
       "div",
       {
         className: cn(
@@ -10792,13 +11723,13 @@ var ProgressTrackerItem = (props) => {
           typographyStyles_default["body-sans-03"]
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
+          /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
           children
         ]
       }
     )
   ] });
-  return /* @__PURE__ */ (0, import_jsx_runtime270.jsx)("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime271.jsx)("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(
     "button",
     {
       ...getBaseHTMLProps(
@@ -10811,7 +11742,7 @@ var ProgressTrackerItem = (props) => {
       disabled,
       children: stepContent
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime270.jsx)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(
     "div",
     {
       ...getBaseHTMLProps(
@@ -10827,9 +11758,9 @@ var ProgressTrackerItem = (props) => {
 ProgressTrackerItem.displayName = "ProgressTracker.Item";
 
 // src/components/ProgressTracker/ProgressTracker.tsx
-var import_jsx_runtime271 = require("react/jsx-runtime");
+var import_jsx_runtime272 = require("react/jsx-runtime");
 var ProgressTracker = (() => {
-  const Res = (0, import_react112.forwardRef)((props, ref) => {
+  const Res = (0, import_react113.forwardRef)((props, ref) => {
     const {
       id,
       activeStep = 0,
@@ -10839,12 +11770,12 @@ var ProgressTracker = (() => {
       htmlProps,
       ...rest
     } = props;
-    const [thisActiveStep, setActiveStep] = (0, import_react112.useState)(activeStep);
+    const [thisActiveStep, setActiveStep] = (0, import_react113.useState)(activeStep);
     const handleChange = (step) => {
       setActiveStep(step);
       onStepChange && onStepChange(step);
     };
-    (0, import_react112.useEffect)(() => {
+    (0, import_react113.useEffect)(() => {
       if (activeStep !== void 0 && activeStep != thisActiveStep) {
         setActiveStep(activeStep);
       }
@@ -10853,20 +11784,20 @@ var ProgressTracker = (() => {
       ...getBaseHTMLProps(id, className, htmlProps, rest),
       ref
     };
-    const steps = (0, import_react112.useMemo)(() => {
+    const steps = (0, import_react113.useMemo)(() => {
       const validChildren = removeInvalidChildren(children);
       const itemsWithIndex = passIndexPropToProgressTrackerItem(validChildren);
       const itemsWithConnectorsBetween = intersperseItemsWithConnector(itemsWithIndex);
       return itemsWithConnectorsBetween;
     }, [children]);
-    return /* @__PURE__ */ (0, import_jsx_runtime271.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime272.jsx)(
       ProgressTrackerContext.Provider,
       {
         value: {
           activeStep: thisActiveStep,
           handleStepChange: handleChange
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime271.jsx)("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ (0, import_jsx_runtime271.jsx)("ol", { className: ProgressTracker_default.list, children: steps }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime272.jsx)("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ (0, import_jsx_runtime272.jsx)("ol", { className: ProgressTracker_default.list, children: steps }) })
       }
     );
   });
@@ -10875,29 +11806,29 @@ var ProgressTracker = (() => {
   return Res;
 })();
 function removeInvalidChildren(children) {
-  return import_react112.Children.toArray(children).filter(import_react112.isValidElement);
+  return import_react113.Children.toArray(children).filter(import_react113.isValidElement);
 }
 function passIndexPropToProgressTrackerItem(children) {
-  return import_react112.Children.map(
+  return import_react113.Children.map(
     children,
-    (item, index) => (0, import_react112.cloneElement)(item, {
+    (item, index) => (0, import_react113.cloneElement)(item, {
       ...item.props,
       index
     })
   );
 }
-var intersperseItemsWithConnector = (children) => import_react112.Children.map(children, (child, index) => {
+var intersperseItemsWithConnector = (children) => import_react113.Children.map(children, (child, index) => {
   if (index === 0) {
     return child;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime271.jsxs)(import_react112.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime271.jsx)("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
+  return /* @__PURE__ */ (0, import_jsx_runtime272.jsxs)(import_react113.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime272.jsx)("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
     child
   ] }, index);
 });
 
 // src/components/ProgressBar/ProgressBar.tsx
-var import_react113 = require("react");
+var import_react114 = require("react");
 
 // src/components/ProgressBar/ProgressBar.module.css
 var ProgressBar_default = {
@@ -10913,8 +11844,8 @@ var ProgressBar_default = {
 };
 
 // src/components/ProgressBar/ProgressBar.tsx
-var import_jsx_runtime272 = require("react/jsx-runtime");
-var ProgressBar = (0, import_react113.forwardRef)(
+var import_jsx_runtime273 = require("react/jsx-runtime");
+var ProgressBar = (0, import_react114.forwardRef)(
   (props, ref) => {
     const {
       label,
@@ -10930,7 +11861,7 @@ var ProgressBar = (0, import_react113.forwardRef)(
       style,
       ...rest
     } = props;
-    const generatedId = (0, import_react113.useId)();
+    const generatedId = (0, import_react114.useId)();
     const uniqueId = id != null ? id : `${generatedId}-searchInput`;
     const hasErrorMessage = !!errorMessage;
     const hasTip = !!tip;
@@ -10948,9 +11879,9 @@ var ProgressBar = (0, import_react113.forwardRef)(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       ["--dds-progressbar-fill-width"]: fillPrecentage != null ? fillPrecentage : 0
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime272.jsxs)("div", { className: cn(className, ProgressBar_default.container), style, children: [
-      hasLabel ? /* @__PURE__ */ (0, import_jsx_runtime272.jsx)(Label, { htmlFor: uniqueId, children: label }) : void 0,
-      /* @__PURE__ */ (0, import_jsx_runtime272.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime273.jsxs)("div", { className: cn(className, ProgressBar_default.container), style, children: [
+      hasLabel ? /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(Label, { htmlFor: uniqueId, children: label }) : void 0,
+      /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(
         "progress",
         {
           ref,
@@ -10967,12 +11898,12 @@ var ProgressBar = (0, import_react113.forwardRef)(
           children: fillPrecentage
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime272.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(
         "div",
         {
           style: progressStyleVariables,
           className: cn(ProgressBar_default.progress, ProgressBar_default[`progress--${size2}`]),
-          children: /* @__PURE__ */ (0, import_jsx_runtime272.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(
             "div",
             {
               style: fillStyleVariables,
@@ -10993,13 +11924,13 @@ var ProgressBar = (0, import_react113.forwardRef)(
 ProgressBar.displayName = "ProgressBar";
 
 // src/components/Search/Search.tsx
-var import_react117 = require("react");
+var import_react118 = require("react");
 
 // src/components/Search/AutocompleteSearch.context.tsx
-var import_react114 = require("react");
-var AutocompleteSearchContext = (0, import_react114.createContext)({});
+var import_react115 = require("react");
+var AutocompleteSearchContext = (0, import_react115.createContext)({});
 var useAutocompleteSearch = () => {
-  return (0, import_react114.useContext)(AutocompleteSearchContext);
+  return (0, import_react115.useContext)(AutocompleteSearchContext);
 };
 
 // src/components/Search/Search.module.css
@@ -11049,22 +11980,22 @@ function createEmptyChangeEvent(inputElementId) {
 }
 
 // src/components/Search/SearchSuggestions.tsx
-var import_react116 = require("react");
+var import_react117 = require("react");
 
 // src/components/Search/SearchSuggestionItem.tsx
-var import_react115 = require("react");
-var import_jsx_runtime273 = require("react/jsx-runtime");
-var SearchSuggestionItem = (0, import_react115.forwardRef)((props, ref) => {
+var import_react116 = require("react");
+var import_jsx_runtime274 = require("react/jsx-runtime");
+var SearchSuggestionItem = (0, import_react116.forwardRef)((props, ref) => {
   const { focus, className, ...rest } = props;
-  const itemRef = (0, import_react115.useRef)(null);
+  const itemRef = (0, import_react116.useRef)(null);
   const combinedRef = useCombinedRef(ref, itemRef);
-  (0, import_react115.useEffect)(() => {
+  (0, import_react116.useEffect)(() => {
     var _a;
     if (focus) {
       (_a = itemRef.current) == null ? void 0 : _a.focus();
     }
   }, [focus]);
-  return /* @__PURE__ */ (0, import_jsx_runtime273.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime274.jsx)(
     "button",
     {
       ref: combinedRef,
@@ -11083,8 +12014,8 @@ var SearchSuggestionItem = (0, import_react115.forwardRef)((props, ref) => {
 SearchSuggestionItem.displayName = "SearchSuggestionItem";
 
 // src/components/Search/SearchSuggestions.tsx
-var import_jsx_runtime274 = require("react/jsx-runtime");
-var SearchSuggestions = (0, import_react116.forwardRef)((props, ref) => {
+var import_jsx_runtime275 = require("react/jsx-runtime");
+var SearchSuggestions = (0, import_react117.forwardRef)((props, ref) => {
   const {
     id,
     searchId,
@@ -11103,7 +12034,7 @@ var SearchSuggestions = (0, import_react116.forwardRef)((props, ref) => {
   );
   const [focus] = useRoveFocus(suggestions == null ? void 0 : suggestions.length, showSuggestions);
   const suggestionsToRender = maxSuggestions ? suggestions == null ? void 0 : suggestions.slice(maxSuggestions) : suggestions;
-  return /* @__PURE__ */ (0, import_jsx_runtime274.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)(
     Paper,
     {
       ...getBaseHTMLProps(
@@ -11122,7 +12053,7 @@ var SearchSuggestions = (0, import_react116.forwardRef)((props, ref) => {
       "aria-hidden": !showSuggestions,
       border: "default",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime274.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
           "span",
           {
             id: suggestionsHeaderId,
@@ -11133,14 +12064,14 @@ var SearchSuggestions = (0, import_react116.forwardRef)((props, ref) => {
             children: "S\xF8keforslag"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime274.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
           "ul",
           {
             role: "listbox",
             "aria-labelledby": suggestionsHeaderId,
             className: utilStyles_default["remove-list-styling"],
             children: suggestionsToRender.map((suggestion, index) => {
-              return /* @__PURE__ */ (0, import_jsx_runtime274.jsx)("li", { role: "option", children: /* @__PURE__ */ (0, import_jsx_runtime274.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime275.jsx)("li", { role: "option", children: /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
                 SearchSuggestionItem,
                 {
                   index,
@@ -11163,7 +12094,7 @@ var SearchSuggestions = (0, import_react116.forwardRef)((props, ref) => {
 SearchSuggestions.displayName = "SearchSuggestions";
 
 // src/components/Search/Search.tsx
-var import_jsx_runtime275 = require("react/jsx-runtime");
+var import_jsx_runtime276 = require("react/jsx-runtime");
 var getIconSize = (size2) => {
   switch (size2) {
     case "large":
@@ -11174,7 +12105,7 @@ var getIconSize = (size2) => {
       return "small";
   }
 };
-var Search = (0, import_react117.forwardRef)(
+var Search = (0, import_react118.forwardRef)(
   ({
     componentSize = "medium",
     buttonProps,
@@ -11190,7 +12121,7 @@ var Search = (0, import_react117.forwardRef)(
     ...rest
   }, ref) => {
     var _a;
-    const generatedId = (0, import_react117.useId)();
+    const generatedId = (0, import_react118.useId)();
     const uniqueId = id != null ? id : `${generatedId}-searchInput`;
     const hasLabel = !!label;
     const tipId = derivativeIdGenerator(uniqueId, "tip");
@@ -11199,7 +12130,7 @@ var Search = (0, import_react117.forwardRef)(
       uniqueId,
       "suggestions-description"
     );
-    const [hasValue, setHasValue] = (0, import_react117.useState)(!!value);
+    const [hasValue, setHasValue] = (0, import_react118.useState)(!!value);
     const context = useAutocompleteSearch();
     const combinedRef = context.inputRef ? useCombinedRef(context.inputRef, ref) : ref;
     const handleChange = (e) => {
@@ -11218,10 +12149,10 @@ var Search = (0, import_react117.forwardRef)(
     } = buttonProps != null ? buttonProps : {};
     const hasSuggestions = !!context.suggestions;
     const showSearchButton = !!buttonProps && !!onClick;
-    return /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)("div", { className: Search_default.container, children: [
-      hasLabel && /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(Label, { htmlFor: uniqueId, children: label }),
-      /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime276.jsxs)("div", { className: Search_default.container, children: [
+      hasLabel && /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(Label, { htmlFor: uniqueId, children: label }),
+      /* @__PURE__ */ (0, import_jsx_runtime276.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime276.jsxs)(
           "div",
           {
             className: cn(
@@ -11230,16 +12161,19 @@ var Search = (0, import_react117.forwardRef)(
             ),
             style,
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)("div", { className: Search_default["input-group"], children: [
-                /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime276.jsxs)("div", { className: Search_default["input-group"], children: [
+                /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(
                   Icon,
                   {
                     icon: SearchIcon,
                     iconSize: getIconSize(componentSize),
-                    className: cn(Input_default.icon, Search_default["search-icon"])
+                    className: cn(
+                      Input_default["input-group__absolute-element"],
+                      Search_default["search-icon"]
+                    )
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(
                   Input,
                   {
                     ...rest,
@@ -11266,8 +12200,8 @@ var Search = (0, import_react117.forwardRef)(
                     )
                   }
                 ),
-                hasSuggestions && /* @__PURE__ */ (0, import_jsx_runtime275.jsxs)(import_jsx_runtime275.Fragment, { children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
+                hasSuggestions && /* @__PURE__ */ (0, import_jsx_runtime276.jsxs)(import_jsx_runtime276.Fragment, { children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(
                     SearchSuggestions,
                     {
                       id: suggestionsId,
@@ -11279,9 +12213,9 @@ var Search = (0, import_react117.forwardRef)(
                       componentSize
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
+                  /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
                 ] }),
-                hasValue && /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
+                hasValue && /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(
                   Button,
                   {
                     icon: CloseSmallIcon,
@@ -11293,7 +12227,7 @@ var Search = (0, import_react117.forwardRef)(
                   }
                 )
               ] }),
-              showSearchButton && /* @__PURE__ */ (0, import_jsx_runtime275.jsx)(
+              showSearchButton && /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(
                 Button,
                 {
                   size: componentSize,
@@ -11313,8 +12247,8 @@ var Search = (0, import_react117.forwardRef)(
 Search.displayName = "Search";
 
 // src/components/Search/SearchAutocompleteWrapper.tsx
-var import_react118 = require("react");
-var import_jsx_runtime276 = require("react/jsx-runtime");
+var import_react119 = require("react");
+var import_jsx_runtime277 = require("react/jsx-runtime");
 var SearchAutocompleteWrapper = (props) => {
   const {
     value,
@@ -11325,12 +12259,12 @@ var SearchAutocompleteWrapper = (props) => {
     onSuggestionSelection,
     children
   } = props;
-  const [inputValue, setInputValue] = (0, import_react118.useState)(value != null ? value : "");
-  const [suggestions, setSuggestions] = (0, import_react118.useState)([]);
-  const [showSuggestions, setShowSuggestions] = (0, import_react118.useState)(false);
+  const [inputValue, setInputValue] = (0, import_react119.useState)(value != null ? value : "");
+  const [suggestions, setSuggestions] = (0, import_react119.useState)([]);
+  const [showSuggestions, setShowSuggestions] = (0, import_react119.useState)(false);
   const closeSuggestions = () => showSuggestions === true && setShowSuggestions(false);
   const openSuggestions = () => showSuggestions === false && setShowSuggestions(true);
-  (0, import_react118.useEffect)(() => {
+  (0, import_react119.useEffect)(() => {
     if (suggestions.length > 0) {
       openSuggestions();
     } else {
@@ -11375,8 +12309,8 @@ var SearchAutocompleteWrapper = (props) => {
   const handleSetInputValue = (value2) => {
     setInputValue(value2 != null ? value2 : "");
   };
-  const inputRef = (0, import_react118.useRef)(null);
-  const suggestionsRef = (0, import_react118.useRef)(null);
+  const inputRef = (0, import_react119.useRef)(null);
+  const suggestionsRef = (0, import_react119.useRef)(null);
   useOnClickOutside([inputRef.current, suggestionsRef.current], () => {
     closeSuggestions();
   });
@@ -11390,7 +12324,7 @@ var SearchAutocompleteWrapper = (props) => {
     inputValue,
     onSugggestionClick: handleSuggestionClick
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime276.jsx)(AutocompleteSearchContext.Provider, { value: contextProps, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime277.jsx)(AutocompleteSearchContext.Provider, { value: contextProps, children });
 };
 SearchAutocompleteWrapper.displayName = "SearchAutocompleteWrapper";
 
@@ -11400,17 +12334,17 @@ Search2.AutocompleteWrapper = SearchAutocompleteWrapper;
 Search2.Suggestions = SearchSuggestions;
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-var import_react121 = require("react");
+var import_react122 = require("react");
 
 // src/components/SelectionControl/Checkbox/CheckboxGroupContext.tsx
-var import_react119 = require("react");
-var CheckboxGroupContext = (0, import_react119.createContext)(null);
+var import_react120 = require("react");
+var CheckboxGroupContext = (0, import_react120.createContext)(null);
 var useCheckboxGroup = () => {
-  return (0, import_react119.useContext)(CheckboxGroupContext);
+  return (0, import_react120.useContext)(CheckboxGroupContext);
 };
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
-var import_react120 = require("react");
+var import_react121 = require("react");
 
 // src/components/SelectionControl/SelectionControl.module.css
 var SelectionControl_default = {
@@ -11430,10 +12364,10 @@ var SelectionControl_default = {
 };
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
-var import_jsx_runtime277 = require("react/jsx-runtime");
-var SelectionControl = (0, import_react120.forwardRef)((props, ref) => {
+var import_jsx_runtime278 = require("react/jsx-runtime");
+var SelectionControl = (0, import_react121.forwardRef)((props, ref) => {
   const { controlType, className, ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime277.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime278.jsx)(
     "span",
     {
       ref,
@@ -11446,7 +12380,7 @@ var SelectionControl = (0, import_react120.forwardRef)((props, ref) => {
     }
   );
 });
-var Label2 = (0, import_react120.forwardRef)(
+var Label2 = (0, import_react121.forwardRef)(
   (props, ref) => {
     const {
       disabled,
@@ -11457,7 +12391,7 @@ var Label2 = (0, import_react120.forwardRef)(
       className,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime277.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime278.jsx)(
       "label",
       {
         ref,
@@ -11488,8 +12422,8 @@ var selectionControlTypographyProps = {
 };
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-var import_jsx_runtime278 = require("react/jsx-runtime");
-var Checkbox = (0, import_react121.forwardRef)(
+var import_jsx_runtime279 = require("react/jsx-runtime");
+var Checkbox = (0, import_react122.forwardRef)(
   (props, ref) => {
     const {
       id,
@@ -11504,7 +12438,7 @@ var Checkbox = (0, import_react121.forwardRef)(
       htmlProps = {},
       ...rest
     } = props;
-    const generatedId = (0, import_react121.useId)();
+    const generatedId = (0, import_react122.useId)();
     const uniqueId = id != null ? id : `${generatedId}-checkbox`;
     const checkboxGroup = useCheckboxGroup();
     const hasLabel = !!label;
@@ -11516,7 +12450,7 @@ var Checkbox = (0, import_react121.forwardRef)(
     const isReadOnly = readOnly || (checkboxGroup == null ? void 0 : checkboxGroup.readOnly);
     const hasError = error || (checkboxGroup == null ? void 0 : checkboxGroup.error);
     const isDisabled = disabled || (checkboxGroup == null ? void 0 : checkboxGroup.disabled);
-    return /* @__PURE__ */ (0, import_jsx_runtime278.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime279.jsxs)(
       Label2,
       {
         hasError,
@@ -11528,7 +12462,7 @@ var Checkbox = (0, import_react121.forwardRef)(
         className: cn(className, htmlPropsClassName),
         style,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime278.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -11558,14 +12492,14 @@ var Checkbox = (0, import_react121.forwardRef)(
               onClick: readOnlyClickHandler(isReadOnly, htmlProps.onClick)
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime278.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(
             SelectionControl,
             {
               controlType: "checkbox",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          hasLabel && /* @__PURE__ */ (0, import_jsx_runtime278.jsx)(Typography, { ...selectionControlTypographyProps, children: label })
+          hasLabel && /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(Typography, { ...selectionControlTypographyProps, children: label })
         ]
       }
     );
@@ -11574,8 +12508,8 @@ var Checkbox = (0, import_react121.forwardRef)(
 Checkbox.displayName = "Checkbox";
 
 // src/components/SelectionControl/Checkbox/CheckboxGroup.tsx
-var import_react122 = require("react");
-var import_jsx_runtime279 = require("react/jsx-runtime");
+var import_react123 = require("react");
+var import_jsx_runtime280 = require("react/jsx-runtime");
 var CheckboxGroup = (props) => {
   const {
     label,
@@ -11593,7 +12527,7 @@ var CheckboxGroup = (props) => {
     ...rest
   } = props;
   const { "aria-required": ariaRequired } = htmlProps;
-  const generatedId = (0, import_react122.useId)();
+  const generatedId = (0, import_react123.useId)();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-checkboxGroup`;
   const hasErrorMessage = !!errorMessage;
   const showRequiredMarker = required || ariaRequired;
@@ -11607,7 +12541,7 @@ var CheckboxGroup = (props) => {
     disabled,
     readOnly
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime279.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime280.jsxs)(
     "div",
     {
       ...getBaseHTMLProps(
@@ -11617,7 +12551,7 @@ var CheckboxGroup = (props) => {
         rest
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime279.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime280.jsxs)(
           Typography,
           {
             as: "span",
@@ -11625,15 +12559,15 @@ var CheckboxGroup = (props) => {
             id: uniqueGroupId,
             className: readOnly ? Label_default["read-only"] : void 0,
             children: [
-              readOnly && /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
+              readOnly && /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ (0, import_jsx_runtime279.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(
           "div",
           {
             role: "group",
@@ -11651,17 +12585,17 @@ var CheckboxGroup = (props) => {
 CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-var import_react124 = require("react");
+var import_react125 = require("react");
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroupContext.tsx
-var import_react123 = require("react");
-var RadioButtonGroupContext = (0, import_react123.createContext)(null);
+var import_react124 = require("react");
+var RadioButtonGroupContext = (0, import_react124.createContext)(null);
 var useRadioButtonGroup = () => {
-  return (0, import_react123.useContext)(RadioButtonGroupContext);
+  return (0, import_react124.useContext)(RadioButtonGroupContext);
 };
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-var import_jsx_runtime280 = require("react/jsx-runtime");
+var import_jsx_runtime281 = require("react/jsx-runtime");
 var isValueEqualToGroupValueOrFalsy = (value, group) => {
   if (typeof value !== "undefined" && value !== null && group) {
     if (typeof value === "number") {
@@ -11671,7 +12605,7 @@ var isValueEqualToGroupValueOrFalsy = (value, group) => {
   }
   return !!value;
 };
-var RadioButton = (0, import_react124.forwardRef)(
+var RadioButton = (0, import_react125.forwardRef)(
   (props, ref) => {
     const {
       id,
@@ -11695,7 +12629,7 @@ var RadioButton = (0, import_react124.forwardRef)(
       style,
       ...restHtmlProps
     } = htmlProps;
-    const generatedId = (0, import_react124.useId)();
+    const generatedId = (0, import_react125.useId)();
     const uniqueId = id != null ? id : `${generatedId}-radioButton`;
     const hasLabel = !!label;
     const radioButtonGroup = useRadioButtonGroup();
@@ -11710,7 +12644,7 @@ var RadioButton = (0, import_react124.forwardRef)(
     const isReadOnly = readOnly || (radioButtonGroup == null ? void 0 : radioButtonGroup.readOnly);
     const isDisabled = disabled || (radioButtonGroup == null ? void 0 : radioButtonGroup.disabled);
     const hasError = error || (radioButtonGroup == null ? void 0 : radioButtonGroup.error);
-    return /* @__PURE__ */ (0, import_jsx_runtime280.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime281.jsxs)(
       Label2,
       {
         hasError,
@@ -11722,7 +12656,7 @@ var RadioButton = (0, import_react124.forwardRef)(
         htmlFor: uniqueId,
         controlType: "radio",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -11748,14 +12682,14 @@ var RadioButton = (0, import_react124.forwardRef)(
               onClick: readOnlyClickHandler(isReadOnly, htmlProps.onClick)
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(
             SelectionControl,
             {
               controlType: "radio",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime280.jsx)(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
+          /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
         ]
       }
     );
@@ -11764,8 +12698,8 @@ var RadioButton = (0, import_react124.forwardRef)(
 RadioButton.displayName = "RadioButton";
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroup.tsx
-var import_react125 = require("react");
-var import_jsx_runtime281 = require("react/jsx-runtime");
+var import_react126 = require("react");
+var import_jsx_runtime282 = require("react/jsx-runtime");
 var RadioButtonGroupInner = (props, ref) => {
   const {
     name,
@@ -11786,8 +12720,8 @@ var RadioButtonGroupInner = (props, ref) => {
     ...rest
   } = props;
   const { "aria-required": ariaRequired = false } = htmlProps;
-  const [groupValue, setGroupValue] = (0, import_react125.useState)(value);
-  const generatedId = (0, import_react125.useId)();
+  const [groupValue, setGroupValue] = (0, import_react126.useState)(value);
+  const generatedId = (0, import_react126.useId)();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-radioButtonGroup`;
   const handleChange = combineHandlers(
     (e) => setGroupValue(e.target.value),
@@ -11807,7 +12741,7 @@ var RadioButtonGroupInner = (props, ref) => {
     value: groupValue,
     onChange: handleChange
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime281.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime282.jsxs)(
     "div",
     {
       ...getBaseHTMLProps(
@@ -11818,7 +12752,7 @@ var RadioButtonGroupInner = (props, ref) => {
       ),
       ref,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime281.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime282.jsxs)(
           Typography,
           {
             as: "span",
@@ -11826,15 +12760,15 @@ var RadioButtonGroupInner = (props, ref) => {
             id: uniqueGroupId,
             className: readOnly ? Label_default["read-only"] : void 0,
             children: [
-              readOnly && /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
+              readOnly && /* @__PURE__ */ (0, import_jsx_runtime282.jsx)(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ (0, import_jsx_runtime282.jsx)(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ (0, import_jsx_runtime281.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime282.jsx)(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ (0, import_jsx_runtime282.jsx)(
           "div",
           {
             role: "radiogroup",
@@ -11850,11 +12784,11 @@ var RadioButtonGroupInner = (props, ref) => {
     }
   );
 };
-var RadioButtonGroup = (0, import_react125.forwardRef)(RadioButtonGroupInner);
+var RadioButtonGroup = (0, import_react126.forwardRef)(RadioButtonGroupInner);
 RadioButtonGroup.displayName = "RadioButtonGroup";
 
 // src/components/Skeleton/Skeleton.tsx
-var import_react126 = require("react");
+var import_react127 = require("react");
 
 // src/components/Skeleton/Skeleton.module.css
 var Skeleton_default = {
@@ -11863,8 +12797,8 @@ var Skeleton_default = {
 };
 
 // src/components/Skeleton/Skeleton.tsx
-var import_jsx_runtime282 = require("react/jsx-runtime");
-var Skeleton = (0, import_react126.forwardRef)(
+var import_jsx_runtime283 = require("react/jsx-runtime");
+var Skeleton = (0, import_react127.forwardRef)(
   (props, ref) => {
     const {
       width,
@@ -11874,7 +12808,7 @@ var Skeleton = (0, import_react126.forwardRef)(
       style,
       ...rest
     } = props;
-    return /* @__PURE__ */ (0, import_jsx_runtime282.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime283.jsx)(
       "div",
       {
         ref,
@@ -11888,7 +12822,7 @@ var Skeleton = (0, import_react126.forwardRef)(
 Skeleton.displayName = "Skeleton";
 
 // src/components/SkipToContent/SkipToContent.tsx
-var import_react127 = require("react");
+var import_react128 = require("react");
 
 // src/components/SkipToContent/SkipToContent.module.css
 var SkipToContent_default = {
@@ -11896,8 +12830,8 @@ var SkipToContent_default = {
 };
 
 // src/components/SkipToContent/SkipToContent.tsx
-var import_jsx_runtime283 = require("react/jsx-runtime");
-var SkipToContent = (0, import_react127.forwardRef)(
+var import_jsx_runtime284 = require("react/jsx-runtime");
+var SkipToContent = (0, import_react128.forwardRef)(
   (props, ref) => {
     const {
       text = "Til hovedinnhold",
@@ -11912,12 +12846,12 @@ var SkipToContent = (0, import_react127.forwardRef)(
       style,
       ...restHtmlProps
     } = htmlProps;
-    return /* @__PURE__ */ (0, import_jsx_runtime283.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(
       Contrast,
       {
         className: cn(className, htmlPropsClassName, SkipToContent_default.wrapper),
         style: { ...style, top },
-        children: /* @__PURE__ */ (0, import_jsx_runtime283.jsx)(Link, { ...getBaseHTMLProps(id, restHtmlProps, rest), ref, children: text })
+        children: /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(Link, { ...getBaseHTMLProps(id, restHtmlProps, rest), ref, children: text })
       }
     );
   }
@@ -11925,7 +12859,7 @@ var SkipToContent = (0, import_react127.forwardRef)(
 SkipToContent.displayName = "SkipToContent";
 
 // src/components/SplitButton/SplitButton.tsx
-var import_react128 = require("react");
+var import_react129 = require("react");
 
 // src/components/SplitButton/SplitButton.module.css
 var SplitButton_default = {
@@ -11936,8 +12870,8 @@ var SplitButton_default = {
 };
 
 // src/components/SplitButton/SplitButton.tsx
-var import_jsx_runtime284 = require("react/jsx-runtime");
-var SplitButton = (0, import_react128.forwardRef)(
+var import_jsx_runtime285 = require("react/jsx-runtime");
+var SplitButton = (0, import_react129.forwardRef)(
   (props, ref) => {
     const {
       size: size2,
@@ -11947,13 +12881,13 @@ var SplitButton = (0, import_react128.forwardRef)(
       className,
       ...rest
     } = props;
-    const [isOpen, setIsOpen] = (0, import_react128.useState)(false);
+    const [isOpen, setIsOpen] = (0, import_react129.useState)(false);
     const buttonStyleProps = {
       purpose,
       size: size2
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime284.jsxs)("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime285.jsxs)("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime285.jsx)(
         Button,
         {
           ...buttonStyleProps,
@@ -11962,8 +12896,8 @@ var SplitButton = (0, import_react128.forwardRef)(
           className: SplitButton_default.main
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime284.jsxs)(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime285.jsxs)(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime285.jsx)(
           Button,
           {
             ...buttonStyleProps,
@@ -11976,7 +12910,7 @@ var SplitButton = (0, import_react128.forwardRef)(
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(OverflowMenu, { placement: "bottom-end", children: /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(OverflowMenuList, { children: secondaryActions.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime284.jsx)(OverflowMenuButton, { ...item, children: item.children }, index)) }) })
+        /* @__PURE__ */ (0, import_jsx_runtime285.jsx)(OverflowMenu, { placement: "bottom-end", children: /* @__PURE__ */ (0, import_jsx_runtime285.jsx)(OverflowMenuList, { children: secondaryActions.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime285.jsx)(OverflowMenuButton, { ...item, children: item.children }, index)) }) })
       ] })
     ] });
   }
@@ -11984,41 +12918,41 @@ var SplitButton = (0, import_react128.forwardRef)(
 SplitButton.displayName = "SplitButton";
 
 // src/components/Table/collapsible/CollapsibleRow.tsx
-var import_react138 = require("react");
+var import_react139 = require("react");
 
 // src/components/Table/collapsible/Table.context.tsx
-var import_react129 = require("react");
-var CollapsibleTableContext = (0, import_react129.createContext)({
+var import_react130 = require("react");
+var CollapsibleTableContext = (0, import_react130.createContext)({
   headerValues: [],
   definingColumnIndex: [0]
 });
-var useCollapsibleTableContext = () => (0, import_react129.useContext)(CollapsibleTableContext);
+var useCollapsibleTableContext = () => (0, import_react130.useContext)(CollapsibleTableContext);
 
 // src/components/Table/normal/Body.tsx
-var import_react130 = require("react");
-var import_jsx_runtime285 = require("react/jsx-runtime");
-var Body = (0, import_react130.forwardRef)(
+var import_react131 = require("react");
+var import_jsx_runtime286 = require("react/jsx-runtime");
+var Body = (0, import_react131.forwardRef)(
   (props, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime285.jsx)("tbody", { ref, ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime286.jsx)("tbody", { ref, ...props });
   }
 );
 Body.displayName = "Table.Body";
 
 // src/components/Table/normal/Cell.tsx
-var import_react132 = require("react");
+var import_react133 = require("react");
 
 // src/components/Table/normal/Head.tsx
-var import_react131 = require("react");
-var import_jsx_runtime286 = require("react/jsx-runtime");
-var Head = (0, import_react131.forwardRef)(
+var import_react132 = require("react");
+var import_jsx_runtime287 = require("react/jsx-runtime");
+var Head = (0, import_react132.forwardRef)(
   ({ children, ...rest }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime286.jsx)("thead", { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime286.jsx)(HeadContext.Provider, { value: true, children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime287.jsx)("thead", { ref, ...rest, children: /* @__PURE__ */ (0, import_jsx_runtime287.jsx)(HeadContext.Provider, { value: true, children }) });
   }
 );
 Head.displayName = "Table.Head";
-var HeadContext = (0, import_react131.createContext)(false);
+var HeadContext = (0, import_react132.createContext)(false);
 function useIsInTableHead() {
-  const isInTableHead = (0, import_react131.useContext)(HeadContext);
+  const isInTableHead = (0, import_react132.useContext)(HeadContext);
   return isInTableHead;
 }
 
@@ -12048,8 +12982,8 @@ var Table_default = {
 };
 
 // src/components/Table/normal/Cell.tsx
-var import_jsx_runtime287 = require("react/jsx-runtime");
-var Cell = (0, import_react132.forwardRef)(
+var import_jsx_runtime288 = require("react/jsx-runtime");
+var Cell = (0, import_react133.forwardRef)(
   ({
     children,
     type: _type,
@@ -12062,7 +12996,7 @@ var Cell = (0, import_react132.forwardRef)(
     const type = _type != null ? _type : isInHead ? "head" : "data";
     const { isCollapsibleChild } = collapsibleProps != null ? collapsibleProps : {};
     const isComplexLayout = layout === "text and icon";
-    return isCollapsibleChild ? /* @__PURE__ */ (0, import_jsx_runtime287.jsx)(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ (0, import_jsx_runtime287.jsx)(
+    return isCollapsibleChild ? /* @__PURE__ */ (0, import_jsx_runtime288.jsx)(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ (0, import_jsx_runtime288.jsx)(
       "th",
       {
         ref,
@@ -12072,15 +13006,15 @@ var Cell = (0, import_react132.forwardRef)(
           !isComplexLayout && Table_default[`cell--${layout}`],
           Table_default["cell--head"]
         ),
-        children: isComplexLayout ? /* @__PURE__ */ (0, import_jsx_runtime287.jsx)("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ (0, import_jsx_runtime288.jsx)("div", { className: Table_default.cell__inner, children }) : children
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime287.jsx)(
+    ) : /* @__PURE__ */ (0, import_jsx_runtime288.jsx)(
       "td",
       {
         ref,
         ...rest,
         className: cn(className, !isComplexLayout && Table_default[`cell--${layout}`]),
-        children: isComplexLayout ? /* @__PURE__ */ (0, import_jsx_runtime287.jsx)("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ (0, import_jsx_runtime288.jsx)("div", { className: Table_default.cell__inner, children }) : children
       }
     );
   }
@@ -12088,23 +13022,23 @@ var Cell = (0, import_react132.forwardRef)(
 Cell.displayName = "Table.Cell";
 
 // src/components/Table/normal/Foot.tsx
-var import_react133 = require("react");
-var import_jsx_runtime288 = require("react/jsx-runtime");
-var Foot = (0, import_react133.forwardRef)(
+var import_react134 = require("react");
+var import_jsx_runtime289 = require("react/jsx-runtime");
+var Foot = (0, import_react134.forwardRef)(
   (props, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime288.jsx)("tfoot", { ref, ...props });
+    return /* @__PURE__ */ (0, import_jsx_runtime289.jsx)("tfoot", { ref, ...props });
   }
 );
 Foot.displayName = "Table.Foot";
 
 // src/components/Table/normal/Row.tsx
-var import_react134 = require("react");
-var import_jsx_runtime289 = require("react/jsx-runtime");
-var Row = (0, import_react134.forwardRef)(
+var import_react135 = require("react");
+var import_jsx_runtime290 = require("react/jsx-runtime");
+var Row = (0, import_react135.forwardRef)(
   ({ type: _type, mode = "normal", hoverable, selected, className, ...rest }, ref) => {
     const isInHeader = useIsInTableHead();
     const type = _type != null ? _type : isInHeader ? "head" : "body";
-    return /* @__PURE__ */ (0, import_jsx_runtime289.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime290.jsx)(
       "tr",
       {
         ref,
@@ -12127,23 +13061,23 @@ var Row = (0, import_react134.forwardRef)(
 Row.displayName = "Table.Row";
 
 // src/components/Table/normal/SortCell.tsx
-var import_react135 = require("react");
-var import_jsx_runtime290 = require("react/jsx-runtime");
+var import_react136 = require("react");
+var import_jsx_runtime291 = require("react/jsx-runtime");
 var makeSortIcon = (isSorted, sortOrder) => {
   if (!isSorted || !sortOrder) {
-    return /* @__PURE__ */ (0, import_jsx_runtime290.jsx)(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
+    return /* @__PURE__ */ (0, import_jsx_runtime291.jsx)(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
   }
-  return sortOrder === "ascending" ? /* @__PURE__ */ (0, import_jsx_runtime290.jsx)(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ (0, import_jsx_runtime290.jsx)(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
+  return sortOrder === "ascending" ? /* @__PURE__ */ (0, import_jsx_runtime291.jsx)(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ (0, import_jsx_runtime291.jsx)(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
 };
-var SortCell = (0, import_react135.forwardRef)(
-  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ (0, import_jsx_runtime290.jsx)(
+var SortCell = (0, import_react136.forwardRef)(
+  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ (0, import_jsx_runtime291.jsx)(
     Cell,
     {
       ref,
       type: "head",
       "aria-sort": isSorted && sortOrder ? sortOrder : void 0,
       ...rest,
-      children: /* @__PURE__ */ (0, import_jsx_runtime290.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime291.jsxs)(
         "button",
         {
           onClick,
@@ -12167,8 +13101,8 @@ var SortCell = (0, import_react135.forwardRef)(
 SortCell.displayName = "Table.SortCell";
 
 // src/components/Table/normal/Table.tsx
-var import_react136 = require("react");
-var import_jsx_runtime291 = require("react/jsx-runtime");
+var import_react137 = require("react");
+var import_jsx_runtime292 = require("react/jsx-runtime");
 function getDensityCn2(value) {
   switch (value) {
     case "normal":
@@ -12178,7 +13112,7 @@ function getDensityCn2(value) {
       return "extra-compact";
   }
 }
-var Table = (0, import_react136.forwardRef)(
+var Table = (0, import_react137.forwardRef)(
   ({
     density = "normal",
     stickyHeader,
@@ -12187,7 +13121,7 @@ var Table = (0, import_react136.forwardRef)(
     children,
     ...rest
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime291.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime292.jsx)(
       "table",
       {
         ref,
@@ -12208,30 +13142,30 @@ var Table = (0, import_react136.forwardRef)(
 Table.displayName = "Table";
 
 // src/components/Table/normal/TableWrapper.tsx
-var import_react137 = require("react");
-var import_jsx_runtime292 = require("react/jsx-runtime");
+var import_react138 = require("react");
+var import_jsx_runtime293 = require("react/jsx-runtime");
 var TableWrapper = ({ className, ...rest }) => {
-  const [overflowX, setOverflowX] = (0, import_react137.useState)(false);
-  const [windowWidth, setWindowWidth] = (0, import_react137.useState)(window.innerWidth);
+  const [overflowX, setOverflowX] = (0, import_react138.useState)(false);
+  const [windowWidth, setWindowWidth] = (0, import_react138.useState)(window.innerWidth);
   function isOverflowingX(event) {
     return event.offsetWidth < event.scrollWidth;
   }
-  const wrapperRef = (0, import_react137.useRef)(null);
-  (0, import_react137.useEffect)(() => {
+  const wrapperRef = (0, import_react138.useRef)(null);
+  (0, import_react138.useEffect)(() => {
     if ((wrapperRef == null ? void 0 : wrapperRef.current) && isOverflowingX(wrapperRef.current)) {
       setOverflowX(true);
       return;
     }
     setOverflowX(false);
   }, [windowWidth]);
-  (0, import_react137.useEffect)(() => {
+  (0, import_react138.useEffect)(() => {
     function handleResize() {
       setWindowWidth(window.innerWidth);
     }
     window.addEventListener("resize", handleResize);
     return () => window.removeEventListener("resize", handleResize);
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime292.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(
     "div",
     {
       ref: wrapperRef,
@@ -12258,8 +13192,8 @@ Table2.Row = Row;
 Table2.Foot = Foot;
 
 // src/components/Table/collapsible/CollapsibleRow.tsx
-var import_jsx_runtime293 = require("react/jsx-runtime");
-var CollapsibleRow = (0, import_react138.forwardRef)(
+var import_jsx_runtime294 = require("react/jsx-runtime");
+var CollapsibleRow = (0, import_react139.forwardRef)(
   ({
     type: _type,
     className,
@@ -12272,8 +13206,8 @@ var CollapsibleRow = (0, import_react138.forwardRef)(
     const isInHead = useIsInTableHead();
     const type = _type != null ? _type : isInHead ? "head" : "body";
     const { isCollapsed, headerValues, definingColumnIndex } = useCollapsibleTableContext();
-    const [childrenCollapsed, setChildrenCollapsed] = (0, import_react138.useState)(true);
-    (0, import_react138.useEffect)(() => {
+    const [childrenCollapsed, setChildrenCollapsed] = (0, import_react139.useState)(true);
+    (0, import_react139.useEffect)(() => {
       !isCollapsed && setChildrenCollapsed(true);
     }, [isCollapsed]);
     const rowProps = (isOpenCollapsibleHeader) => {
@@ -12291,7 +13225,7 @@ var CollapsibleRow = (0, import_react138.forwardRef)(
     const collapsedHeaderValues = headerValues.filter(
       (column2, index) => definingColumnIndex.indexOf(index) === -1
     );
-    const childrenArray = import_react138.Children.toArray(children);
+    const childrenArray = import_react139.Children.toArray(children);
     const collapsedChildren = childrenArray.filter(
       (column2, index) => definingColumnIndex.indexOf(index) === -1
     );
@@ -12300,33 +13234,33 @@ var CollapsibleRow = (0, import_react138.forwardRef)(
     const collapsedRenderedChildren = isCollapsed && collapsedHeaderValues.length > 0 ? collapsedChildren.map(function(child, index) {
       const id = derivativeIdGenerator(prefix3, index.toString());
       collapsibleIds.push(id);
-      return /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(import_react138.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
-        (0, import_react138.isValidElement)(child) && (0, import_react138.cloneElement)(child, {
+      return /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(import_react139.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
+        (0, import_react139.isValidElement)(child) && (0, import_react139.cloneElement)(child, {
           collapsibleProps: { isCollapsibleChild: true }
         })
       ] }, `DL-${index}`);
     }) : null;
-    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(Row, { ...rowProps(), children: /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(DescriptionList, { children: collapsedRenderedChildren }) }) }) : null;
+    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Row, { ...rowProps(), children: /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(DescriptionList, { children: collapsedRenderedChildren }) }) }) : null;
     const definingColumnCells = childrenArray.slice().filter((column2, index) => definingColumnIndex.indexOf(index) > -1).sort((a2, b) => {
       return definingColumnIndex.indexOf(childrenArray.indexOf(a2)) - definingColumnIndex.indexOf(childrenArray.indexOf(b));
     });
     const headerRow = () => {
       if (type !== "head" || !isCollapsed) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(Row, { ref, ...rowProps(), children: /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(import_jsx_runtime293.Fragment, { children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Row, { ref, ...rowProps(), children: /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(import_jsx_runtime294.Fragment, { children: [
         definingColumnCells,
-        /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(Table2.Cell, { type: "head", layout: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(Table2.Cell, { type: "head", layout: "center", children: [
           "Utvid",
-          /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(VisuallyHidden, { as: "span", children: "raden" })
+          /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(VisuallyHidden, { as: "span", children: "raden" })
         ] })
       ] }) });
     };
     const idList = spaceSeparatedIdListGenerator(collapsibleIds);
     const rowWithChevron = () => {
       if (type !== "body" || !isCollapsed) return null;
-      return /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
+      return /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
         definingColumnCells,
-        /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(Table2.Cell, { children: /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Table2.Cell, { children: /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(
           "button",
           {
             onClick: () => setChildrenCollapsed(!childrenCollapsed),
@@ -12338,7 +13272,7 @@ var CollapsibleRow = (0, import_react138.forwardRef)(
               utilStyles_default["remove-button-styling"],
               focusable
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(
               AnimatedChevronUpDown,
               {
                 isUp: childrenCollapsed ? false : true,
@@ -12350,28 +13284,28 @@ var CollapsibleRow = (0, import_react138.forwardRef)(
         ) })
       ] });
     };
-    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(import_jsx_runtime293.Fragment, { children: [
+    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(import_jsx_runtime294.Fragment, { children: [
       headerRow(),
-      type === "body" && /* @__PURE__ */ (0, import_jsx_runtime293.jsxs)(import_jsx_runtime293.Fragment, { children: [
+      type === "body" && /* @__PURE__ */ (0, import_jsx_runtime294.jsxs)(import_jsx_runtime294.Fragment, { children: [
         rowWithChevron(),
         childrenCollapsed ? null : collapsedRows
       ] })
-    ] }) : /* @__PURE__ */ (0, import_jsx_runtime293.jsx)(Row, { ref, ...rowProps(), children });
+    ] }) : /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Row, { ref, ...rowProps(), children });
   }
 );
 CollapsibleRow.displayName = "CollapsibleTable.Row";
 
 // src/components/Table/collapsible/CollapsibleTable.tsx
-var import_react139 = require("react");
-var import_jsx_runtime294 = require("react/jsx-runtime");
-var CollapsibleTable = (0, import_react139.forwardRef)((props, ref) => {
+var import_react140 = require("react");
+var import_jsx_runtime295 = require("react/jsx-runtime");
+var CollapsibleTable = (0, import_react140.forwardRef)((props, ref) => {
   const {
     isCollapsed,
     headerValues,
     definingColumnIndex = [0],
     ...rest
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
     CollapsibleTableContext.Provider,
     {
       value: {
@@ -12379,7 +13313,7 @@ var CollapsibleTable = (0, import_react139.forwardRef)((props, ref) => {
         headerValues,
         definingColumnIndex
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(Table2, { ref, ...rest })
+      children: /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(Table2, { ref, ...rest })
     }
   );
 });
@@ -12390,11 +13324,11 @@ var CollapsibleTable2 = CollapsibleTable;
 CollapsibleTable2.Row = CollapsibleRow;
 
 // src/components/Tabs/Tabs.tsx
-var import_react141 = require("react");
+var import_react142 = require("react");
 
 // src/components/Tabs/Tabs.context.tsx
-var import_react140 = require("react");
-var TabsContext = (0, import_react140.createContext)({
+var import_react141 = require("react");
+var TabsContext = (0, import_react141.createContext)({
   activeTab: 0,
   tabsId: "",
   handleTabChange: () => null,
@@ -12404,7 +13338,7 @@ var TabsContext = (0, import_react140.createContext)({
   setHasTabFocus: () => null,
   tabContentDirection: "row"
 });
-var useTabsContext = () => (0, import_react140.useContext)(TabsContext);
+var useTabsContext = () => (0, import_react141.useContext)(TabsContext);
 
 // src/components/Tabs/Tabs.module.css
 var Tabs_default = {
@@ -12420,8 +13354,8 @@ var Tabs_default = {
 };
 
 // src/components/Tabs/Tabs.tsx
-var import_jsx_runtime295 = require("react/jsx-runtime");
-var Tabs = (0, import_react141.forwardRef)((props, ref) => {
+var import_jsx_runtime296 = require("react/jsx-runtime");
+var Tabs = (0, import_react142.forwardRef)((props, ref) => {
   const {
     id,
     activeTab,
@@ -12433,17 +13367,17 @@ var Tabs = (0, import_react141.forwardRef)((props, ref) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = (0, import_react141.useId)();
+  const generatedId = (0, import_react142.useId)();
   const uniqueId = id != null ? id : `${generatedId}-tabs`;
-  const [thisActiveTab, setActiveTab] = (0, import_react141.useState)(activeTab != null ? activeTab : 0);
-  const [hasTabFocus, setHasTabFocus] = (0, import_react141.useState)(false);
-  const tabListRef = (0, import_react141.useRef)(null);
-  const tabPanelsRef = (0, import_react141.useRef)(null);
+  const [thisActiveTab, setActiveTab] = (0, import_react142.useState)(activeTab != null ? activeTab : 0);
+  const [hasTabFocus, setHasTabFocus] = (0, import_react142.useState)(false);
+  const tabListRef = (0, import_react142.useRef)(null);
+  const tabPanelsRef = (0, import_react142.useRef)(null);
   const handleTabChange = (index) => {
     setActiveTab(index);
     onChange && onChange(index);
   };
-  (0, import_react141.useEffect)(() => {
+  (0, import_react142.useEffect)(() => {
     if (activeTab !== void 0 && activeTab !== thisActiveTab) {
       setActiveTab(activeTab);
     }
@@ -12452,7 +13386,7 @@ var Tabs = (0, import_react141.forwardRef)((props, ref) => {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     ["--dds-tabs-width"]: width
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime296.jsx)(
     TabsContext.Provider,
     {
       value: {
@@ -12465,7 +13399,7 @@ var Tabs = (0, import_react141.forwardRef)((props, ref) => {
         setHasTabFocus,
         tabContentDirection
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime296.jsx)(
         "div",
         {
           ref,
@@ -12485,17 +13419,17 @@ var Tabs = (0, import_react141.forwardRef)((props, ref) => {
 Tabs.displayName = "Tabs";
 
 // src/components/Tabs/Tab.tsx
-var import_react143 = require("react");
+var import_react144 = require("react");
 
 // src/components/Tabs/TabWidthContext.tsx
-var import_react142 = require("react");
-var import_jsx_runtime296 = require("react/jsx-runtime");
-var TabContext = (0, import_react142.createContext)(null);
+var import_react143 = require("react");
+var import_jsx_runtime297 = require("react/jsx-runtime");
+var TabContext = (0, import_react143.createContext)(null);
 function TabWidthContextProvider({
   children,
   onChangeWidths
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime296.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime297.jsx)(
     TabContext.Provider,
     {
       value: {
@@ -12519,16 +13453,16 @@ function TabWidthContextProvider({
   );
 }
 function useSetTabWidth(index, width) {
-  const context = (0, import_react142.useContext)(TabContext);
-  (0, import_react142.useLayoutEffect)(() => {
+  const context = (0, import_react143.useContext)(TabContext);
+  (0, import_react143.useLayoutEffect)(() => {
     context == null ? void 0 : context.updateWidth(index, width);
     return () => context == null ? void 0 : context.removeTab(index);
   }, [index, width]);
 }
 
 // src/components/Tabs/Tab.tsx
-var import_jsx_runtime297 = require("react/jsx-runtime");
-var Tab = (0, import_react143.forwardRef)((props, ref) => {
+var import_jsx_runtime298 = require("react/jsx-runtime");
+var Tab = (0, import_react144.forwardRef)((props, ref) => {
   const {
     active = false,
     icon,
@@ -12545,16 +13479,16 @@ var Tab = (0, import_react143.forwardRef)((props, ref) => {
     ...rest
   } = props;
   useSetTabWidth(index, width);
-  const itemRef = (0, import_react143.useRef)(null);
+  const itemRef = (0, import_react144.useRef)(null);
   const combinedRef = useCombinedRef(ref, itemRef);
   const { tabContentDirection } = useTabsContext();
-  (0, import_react143.useEffect)(() => {
+  (0, import_react144.useEffect)(() => {
     var _a;
     if (focus) {
       (_a = itemRef.current) == null ? void 0 : _a.focus();
     }
   }, [focus]);
-  const handleSelect = (0, import_react143.useCallback)(() => {
+  const handleSelect = (0, import_react144.useCallback)(() => {
     if (setFocus && index) {
       setFocus(index);
     }
@@ -12567,7 +13501,7 @@ var Tab = (0, import_react143.forwardRef)((props, ref) => {
     handleSelect();
     onKeyDown && onKeyDown(e);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime297.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(
     "button",
     {
       ...getBaseHTMLProps(
@@ -12590,8 +13524,8 @@ var Tab = (0, import_react143.forwardRef)((props, ref) => {
       onKeyDown: handleOnKeyDown,
       tabIndex: focus ? 0 : -1,
       children: [
-        icon && /* @__PURE__ */ (0, import_jsx_runtime297.jsx)(Icon, { icon, iconSize: "inherit" }),
-        /* @__PURE__ */ (0, import_jsx_runtime297.jsx)("span", { children })
+        icon && /* @__PURE__ */ (0, import_jsx_runtime298.jsx)(Icon, { icon, iconSize: "inherit" }),
+        /* @__PURE__ */ (0, import_jsx_runtime298.jsx)("span", { children })
       ]
     }
   );
@@ -12599,9 +13533,9 @@ var Tab = (0, import_react143.forwardRef)((props, ref) => {
 Tab.displayName = "Tab";
 
 // src/components/Tabs/TabList.tsx
-var import_react144 = require("react");
-var import_jsx_runtime298 = require("react/jsx-runtime");
-var TabList = (0, import_react144.forwardRef)(
+var import_react145 = require("react");
+var import_jsx_runtime299 = require("react/jsx-runtime");
+var TabList = (0, import_react145.forwardRef)(
   ({ children, id, style, onFocus, ...rest }, ref) => {
     const {
       activeTab,
@@ -12612,11 +13546,11 @@ var TabList = (0, import_react144.forwardRef)(
       setHasTabFocus
     } = useTabsContext();
     const uniqueId = id != null ? id : `${tabsId}-tablist`;
-    const childrenArray = import_react144.Children.toArray(children).length;
+    const childrenArray = import_react145.Children.toArray(children).length;
     const [focus, setFocus] = useRoveFocus(childrenArray, hasTabFocus, "row");
     const combinedRef = useCombinedRef(ref, tabListRef);
-    const tabListChildren = import_react144.Children.map(children, (child, index) => {
-      return (0, import_react144.isValidElement)(child) && (0, import_react144.cloneElement)(child, {
+    const tabListChildren = import_react145.Children.map(children, (child, index) => {
+      return (0, import_react145.isValidElement)(child) && (0, import_react145.cloneElement)(child, {
         id: `${tabsId}-tab-${index}`,
         "aria-controls": `${tabsId}-panel-${index}`,
         active: activeTab === index,
@@ -12626,7 +13560,7 @@ var TabList = (0, import_react144.forwardRef)(
         onClick: () => handleTabChange(index)
       });
     });
-    const [widths, setWidths] = (0, import_react144.useState)([]);
+    const [widths, setWidths] = (0, import_react145.useState)([]);
     const handleOnFocus = (event) => {
       setHasTabFocus(true);
       onFocus && onFocus(event);
@@ -12644,7 +13578,7 @@ var TabList = (0, import_react144.forwardRef)(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       ["--dds-tab-widths"]: widths.join(" ")
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime298.jsx)(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ (0, import_jsx_runtime298.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime299.jsx)(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ (0, import_jsx_runtime299.jsx)(
       "div",
       {
         ...rest,
@@ -12670,11 +13604,11 @@ var TabList = (0, import_react144.forwardRef)(
 TabList.displayName = "TabList";
 
 // src/components/Tabs/TabPanel.tsx
-var import_react145 = require("react");
-var import_jsx_runtime299 = require("react/jsx-runtime");
-var TabPanel = (0, import_react145.forwardRef)(
+var import_react146 = require("react");
+var import_jsx_runtime300 = require("react/jsx-runtime");
+var TabPanel = (0, import_react146.forwardRef)(
   ({ active = false, children, id, className, htmlProps, ...rest }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime299.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime300.jsx)(
       "div",
       {
         ...getBaseHTMLProps(
@@ -12695,28 +13629,28 @@ var TabPanel = (0, import_react145.forwardRef)(
 TabPanel.displayName = "TabPanel";
 
 // src/components/Tabs/TabPanels.tsx
-var import_react146 = require("react");
-var import_jsx_runtime300 = require("react/jsx-runtime");
-var TabPanels = (0, import_react146.forwardRef)(
+var import_react147 = require("react");
+var import_jsx_runtime301 = require("react/jsx-runtime");
+var TabPanels = (0, import_react147.forwardRef)(
   ({ children, ...rest }, ref) => {
     const { activeTab, tabsId, tabPanelsRef } = useTabsContext();
     const combinedRef = useCombinedRef(ref, tabPanelsRef);
-    const panelChildren = import_react146.Children.map(children, (child, index) => {
+    const panelChildren = import_react147.Children.map(children, (child, index) => {
       const active = index === activeTab;
-      return (0, import_react146.isValidElement)(child) && (0, import_react146.cloneElement)(child, {
+      return (0, import_react147.isValidElement)(child) && (0, import_react147.cloneElement)(child, {
         id: `${tabsId}-panel-${index}`,
         "aria-labelledby": `${tabsId}-tab-${index}`,
         active,
         "aria-expanded": active
       });
     });
-    return /* @__PURE__ */ (0, import_jsx_runtime300.jsx)("div", { ref: combinedRef, ...rest, children: panelChildren });
+    return /* @__PURE__ */ (0, import_jsx_runtime301.jsx)("div", { ref: combinedRef, ...rest, children: panelChildren });
   }
 );
 TabPanels.displayName = "TabPanels";
 
 // src/components/Tag/Tag.tsx
-var import_react147 = require("react");
+var import_react148 = require("react");
 
 // src/components/Tag/Tag.module.css
 var Tag_default = {
@@ -12735,7 +13669,7 @@ var Tag_default = {
 };
 
 // src/components/Tag/Tag.tsx
-var import_jsx_runtime301 = require("react/jsx-runtime");
+var import_jsx_runtime302 = require("react/jsx-runtime");
 var icons3 = {
   info: InfoIcon,
   danger: ErrorIcon,
@@ -12743,7 +13677,7 @@ var icons3 = {
   success: CheckCircledIcon,
   default: void 0
 };
-var Tag = (0, import_react147.forwardRef)((props, ref) => {
+var Tag = (0, import_react148.forwardRef)((props, ref) => {
   const {
     text,
     purpose = "default",
@@ -12756,7 +13690,7 @@ var Tag = (0, import_react147.forwardRef)((props, ref) => {
     ...rest
   } = props;
   const icon = icons3[purpose];
-  return /* @__PURE__ */ (0, import_jsx_runtime301.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime302.jsxs)(
     TextOverflowEllipsisWrapper,
     {
       ...getBaseHTMLProps(
@@ -12773,8 +13707,8 @@ var Tag = (0, import_react147.forwardRef)((props, ref) => {
       ),
       ref,
       children: [
-        withIcon && icon && /* @__PURE__ */ (0, import_jsx_runtime301.jsx)(Icon, { icon, iconSize: "small" }),
-        /* @__PURE__ */ (0, import_jsx_runtime301.jsx)(TextOverflowEllipsisInner, { children: children != null ? children : text })
+        withIcon && icon && /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(Icon, { icon, iconSize: "small" }),
+        /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(TextOverflowEllipsisInner, { children: children != null ? children : text })
       ]
     }
   );
@@ -12782,8 +13716,8 @@ var Tag = (0, import_react147.forwardRef)((props, ref) => {
 Tag.displayName = "Tag";
 
 // src/components/TextInput/TextInput.tsx
-var import_dds_design_tokens16 = require("@norges-domstoler/dds-design-tokens");
-var import_react148 = require("react");
+var import_dds_design_tokens17 = require("@norges-domstoler/dds-design-tokens");
+var import_react149 = require("react");
 
 // src/components/TextInput/TextInput.module.css
 var TextInput_default = {
@@ -12810,8 +13744,8 @@ var TextInput_default = {
 };
 
 // src/components/TextInput/TextInput.tsx
-var import_jsx_runtime302 = require("react/jsx-runtime");
-var TextInput = (0, import_react148.forwardRef)(
+var import_jsx_runtime303 = require("react/jsx-runtime");
+var TextInput = (0, import_react149.forwardRef)(
   ({
     label,
     disabled,
@@ -12837,14 +13771,14 @@ var TextInput = (0, import_react148.forwardRef)(
     suffix,
     ...rest
   }, ref) => {
-    const [text, setText] = (0, import_react148.useState)(
+    const [text, setText] = (0, import_react149.useState)(
       getDefaultText(value, defaultValue)
     );
-    const prefixRef = (0, import_react148.useRef)(null);
-    const suffixRef = (0, import_react148.useRef)(null);
-    const [prefixLength, setPrefixLength] = (0, import_react148.useState)(0);
-    const [suffixLength, setSuffixLength] = (0, import_react148.useState)(0);
-    (0, import_react148.useLayoutEffect)(() => {
+    const prefixRef = (0, import_react149.useRef)(null);
+    const suffixRef = (0, import_react149.useRef)(null);
+    const [prefixLength, setPrefixLength] = (0, import_react149.useState)(0);
+    const [suffixLength, setSuffixLength] = (0, import_react149.useState)(0);
+    (0, import_react149.useLayoutEffect)(() => {
       if (prefixRef.current) {
         setPrefixLength(prefixRef.current.offsetWidth);
       }
@@ -12858,7 +13792,7 @@ var TextInput = (0, import_react148.forwardRef)(
         onChange(event);
       }
     };
-    const generatedId = (0, import_react148.useId)();
+    const generatedId = (0, import_react149.useId)();
     const uniqueId = id != null ? id : `${generatedId}-textInput`;
     const hasErrorMessage = !!errorMessage;
     const hasTip = !!tip;
@@ -12896,25 +13830,28 @@ var TextInput = (0, import_react148.forwardRef)(
       ...rest
     };
     const showRequiredStyling = !!(required || ariaRequired);
-    const preffixPaddingInlineStart = readOnly && prefixLength ? prefixLength + "px" : prefixLength ? import_dds_design_tokens16.ddsTokens.ddsSpacingX1NumberPx + prefixLength + "px" : void 0;
-    const suffixPaddingInlineEnd = readOnly && suffixLength ? suffixLength + "px" : suffixLength ? import_dds_design_tokens16.ddsTokens.ddsSpacingX1NumberPx + suffixLength + "px" : void 0;
+    const preffixPaddingInlineStart = readOnly && prefixLength ? prefixLength + "px" : prefixLength ? import_dds_design_tokens17.ddsTokens.ddsSpacingX1NumberPx + prefixLength + "px" : void 0;
+    const suffixPaddingInlineEnd = readOnly && suffixLength ? suffixLength + "px" : suffixLength ? import_dds_design_tokens17.ddsTokens.ddsSpacingX1NumberPx + suffixLength + "px" : void 0;
     let extendedInput = null;
     if (hasIcon) {
-      extendedInput = /* @__PURE__ */ (0, import_jsx_runtime302.jsxs)(
+      extendedInput = /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(
         "div",
         {
           className: cn(TextInput_default["input-width"], Input_default["input-group"]),
           style: styleVariables,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
               Icon,
               {
                 icon,
                 iconSize: getFormInputIconSize(componentSize),
-                className: cn(Input_default.icon, TextInput_default[`icon--${componentSize}`])
+                className: cn(
+                  Input_default["input-group__absolute-element"],
+                  TextInput_default[`icon--${componentSize}`]
+                )
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
               StatefulInput,
               {
                 ref,
@@ -12933,13 +13870,13 @@ var TextInput = (0, import_react148.forwardRef)(
         }
       );
     } else if (hasAffix) {
-      extendedInput = /* @__PURE__ */ (0, import_jsx_runtime302.jsxs)(
+      extendedInput = /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(
         "div",
         {
           className: cn(TextInput_default["affix-container"], TextInput_default["input-width"]),
           style: styleVariables,
           children: [
-            prefix3 && /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+            prefix3 && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
               "span",
               {
                 ref: prefixRef,
@@ -12952,7 +13889,7 @@ var TextInput = (0, import_react148.forwardRef)(
                 children: prefix3
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
               StatefulInput,
               {
                 ref,
@@ -12967,7 +13904,7 @@ var TextInput = (0, import_react148.forwardRef)(
                 className: TextInput_default["input--extended"]
               }
             ),
-            suffix && /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+            suffix && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
               "span",
               {
                 ref: suffixRef,
@@ -12984,7 +13921,7 @@ var TextInput = (0, import_react148.forwardRef)(
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime302.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(
       "div",
       {
         className: cn(
@@ -12996,7 +13933,7 @@ var TextInput = (0, import_react148.forwardRef)(
         ),
         style,
         children: [
-          hasLabel && /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+          hasLabel && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
             Label,
             {
               htmlFor: uniqueId,
@@ -13006,7 +13943,7 @@ var TextInput = (0, import_react148.forwardRef)(
               children: label
             }
           ),
-          extendedInput ? extendedInput : /* @__PURE__ */ (0, import_jsx_runtime302.jsx)(
+          extendedInput ? extendedInput : /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
             StatefulInput,
             {
               ref,
@@ -13018,7 +13955,7 @@ var TextInput = (0, import_react148.forwardRef)(
               className: TextInput_default["input-width"]
             }
           ),
-          hasMessage && /* @__PURE__ */ (0, import_jsx_runtime302.jsxs)("div", { className: TextInput_default["message-container"], children: [
+          hasMessage && /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)("div", { className: TextInput_default["message-container"], children: [
             renderInputMessage(tip, tipId, errorMessage, errorMessageId),
             renderCharCounter(
               characterCounterId,
@@ -13035,14 +13972,14 @@ var TextInput = (0, import_react148.forwardRef)(
 TextInput.displayName = "TextInput";
 
 // src/components/ToggleBar/ToggleBar.tsx
-var import_react150 = require("react");
+var import_react151 = require("react");
 
 // src/components/ToggleBar/ToggleBar.context.tsx
-var import_react149 = require("react");
-var ToggleBarContext = (0, import_react149.createContext)({
+var import_react150 = require("react");
+var ToggleBarContext = (0, import_react150.createContext)({
   size: "medium"
 });
-var useToggleBarContext = () => (0, import_react149.useContext)(ToggleBarContext);
+var useToggleBarContext = () => (0, import_react150.useContext)(ToggleBarContext);
 
 // src/components/ToggleBar/ToggleBar.module.css
 var ToggleBar_default = {
@@ -13061,7 +13998,7 @@ var ToggleBar_default = {
 };
 
 // src/components/ToggleBar/ToggleBar.tsx
-var import_jsx_runtime303 = require("react/jsx-runtime");
+var import_jsx_runtime304 = require("react/jsx-runtime");
 var ToggleBar = (props) => {
   const {
     children,
@@ -13076,15 +14013,15 @@ var ToggleBar = (props) => {
     id,
     ...rest
   } = props;
-  const generatedId = (0, import_react150.useId)();
+  const generatedId = (0, import_react151.useId)();
   const uniqueId = id != null ? id : `${generatedId}-ToggleBar`;
-  const [groupValue, setGroupValue] = (0, import_react150.useState)(value);
+  const [groupValue, setGroupValue] = (0, import_react151.useState)(value);
   const handleChange = combineHandlers(
     (e) => setGroupValue(e.target.value),
     (e) => onChange && onChange(e, e.target.value)
   );
   const labelId = label && `${uniqueId}-label`;
-  return /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime304.jsx)(
     ToggleBarContext.Provider,
     {
       value: {
@@ -13093,7 +14030,7 @@ var ToggleBar = (props) => {
         name,
         value: groupValue
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime304.jsxs)(
         "div",
         {
           ...getBaseHTMLProps(
@@ -13106,8 +14043,8 @@ var ToggleBar = (props) => {
           role: "radiogroup",
           "aria-labelledby": labelId != null ? labelId : htmlProps == null ? void 0 : htmlProps["aria-labelledby"],
           children: [
-            label && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Label, { id: labelId, children: label }),
-            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)("div", { className: ToggleBar_default.bar, children })
+            label && /* @__PURE__ */ (0, import_jsx_runtime304.jsx)(Label, { id: labelId, children: label }),
+            /* @__PURE__ */ (0, import_jsx_runtime304.jsx)("div", { className: ToggleBar_default.bar, children })
           ]
         }
       )
@@ -13117,8 +14054,8 @@ var ToggleBar = (props) => {
 ToggleBar.displayName = "ToggleBar";
 
 // src/components/ToggleBar/ToggleRadio.tsx
-var import_react151 = require("react");
-var import_jsx_runtime304 = require("react/jsx-runtime");
+var import_react152 = require("react");
+var import_jsx_runtime305 = require("react/jsx-runtime");
 var typographyTypes4 = {
   large: "bodySans04",
   medium: "bodySans02",
@@ -13135,7 +14072,7 @@ var calculateChecked = (value, group, checked) => {
   }
   return !!value;
 };
-var ToggleRadio = (0, import_react151.forwardRef)(
+var ToggleRadio = (0, import_react152.forwardRef)(
   (props, ref) => {
     const {
       value,
@@ -13151,7 +14088,7 @@ var ToggleRadio = (0, import_react151.forwardRef)(
       id,
       ...rest
     } = props;
-    const generatedId = (0, import_react151.useId)();
+    const generatedId = (0, import_react152.useId)();
     const uniqueId = id != null ? id : `${generatedId}-ToggleRadio`;
     const group = useToggleBarContext();
     const handleChange = (event) => {
@@ -13159,8 +14096,8 @@ var ToggleRadio = (0, import_react151.forwardRef)(
       (group == null ? void 0 : group.onChange) && group.onChange(event);
     };
     const contentTypeCn = label ? "with-text" : "just-icon";
-    return /* @__PURE__ */ (0, import_jsx_runtime304.jsxs)("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime304.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime305.jsxs)("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime305.jsx)(
         "input",
         {
           ...getBaseHTMLProps(
@@ -13183,7 +14120,7 @@ var ToggleRadio = (0, import_react151.forwardRef)(
           "aria-labelledby": ariaLabelledBy
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime304.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime305.jsxs)(
         Typography,
         {
           as: "span",
@@ -13194,8 +14131,8 @@ var ToggleRadio = (0, import_react151.forwardRef)(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            icon && /* @__PURE__ */ (0, import_jsx_runtime304.jsx)(Icon, { icon, iconSize: "inherit" }),
-            label && /* @__PURE__ */ (0, import_jsx_runtime304.jsx)("span", { children: label })
+            icon && /* @__PURE__ */ (0, import_jsx_runtime305.jsx)(Icon, { icon, iconSize: "inherit" }),
+            label && /* @__PURE__ */ (0, import_jsx_runtime305.jsx)("span", { children: label })
           ]
         }
       )
@@ -13205,7 +14142,7 @@ var ToggleRadio = (0, import_react151.forwardRef)(
 ToggleRadio.displayName = "ToggleRadio";
 
 // src/components/ToggleButton/ToggleButton.tsx
-var import_react152 = require("react");
+var import_react153 = require("react");
 
 // src/components/ToggleButton/ToggleButton.module.css
 var ToggleButton_default = {
@@ -13219,14 +14156,14 @@ var ToggleButton_default = {
 };
 
 // src/components/ToggleButton/ToggleButton.tsx
-var import_jsx_runtime305 = require("react/jsx-runtime");
-var ToggleButton = (0, import_react152.forwardRef)(
+var import_jsx_runtime306 = require("react/jsx-runtime");
+var ToggleButton = (0, import_react153.forwardRef)(
   ({ id, label, icon, className, htmlProps, ...rest }, ref) => {
-    const generatedId = (0, import_react152.useId)();
+    const generatedId = (0, import_react153.useId)();
     const uniqueId = id != null ? id : `${generatedId}-toggleButton`;
     const hasIcon = !!icon;
-    return /* @__PURE__ */ (0, import_jsx_runtime305.jsxs)("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime305.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime306.jsxs)("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime306.jsx)(
         "input",
         {
           ...getBaseHTMLProps(
@@ -13243,7 +14180,7 @@ var ToggleButton = (0, import_react152.forwardRef)(
           type: "checkbox"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime305.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime306.jsxs)(
         "span",
         {
           className: cn(
@@ -13253,7 +14190,7 @@ var ToggleButton = (0, import_react152.forwardRef)(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            hasIcon && /* @__PURE__ */ (0, import_jsx_runtime305.jsx)(Icon, { icon, iconSize: "inherit" }),
+            hasIcon && /* @__PURE__ */ (0, import_jsx_runtime306.jsx)(Icon, { icon, iconSize: "inherit" }),
             " ",
             label
           ]
@@ -13265,8 +14202,8 @@ var ToggleButton = (0, import_react152.forwardRef)(
 ToggleButton.displayName = "ToggleButton";
 
 // src/components/ToggleButton/ToggleButtonGroup.tsx
-var import_react153 = require("react");
-var import_jsx_runtime306 = require("react/jsx-runtime");
+var import_react154 = require("react");
+var import_jsx_runtime307 = require("react/jsx-runtime");
 var ToggleButtonGroup = (props) => {
   const {
     children,
@@ -13278,9 +14215,9 @@ var ToggleButtonGroup = (props) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = (0, import_react153.useId)();
+  const generatedId = (0, import_react154.useId)();
   const uniqueLabelId = labelId != null ? labelId : `${generatedId}-ToggleButtonGroupLabel`;
-  return /* @__PURE__ */ (0, import_jsx_runtime306.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime307.jsxs)(
     "div",
     {
       ...getBaseHTMLProps(
@@ -13292,7 +14229,7 @@ var ToggleButtonGroup = (props) => {
       role: "group",
       "aria-labelledby": label ? uniqueLabelId : void 0,
       children: [
-        !!label && /* @__PURE__ */ (0, import_jsx_runtime306.jsx)(
+        !!label && /* @__PURE__ */ (0, import_jsx_runtime307.jsx)(
           Typography,
           {
             as: "span",
@@ -13301,7 +14238,7 @@ var ToggleButtonGroup = (props) => {
             children: label
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime306.jsx)("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
+        /* @__PURE__ */ (0, import_jsx_runtime307.jsx)("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
       ]
     }
   );
@@ -13512,6 +14449,7 @@ ToggleButtonGroup.displayName = "ToggleButtonGroup";
   PersonAddIcon,
   PersonIcon,
   PersonShieldedIcon,
+  PhoneInput,
   PinIcon,
   PlusCircledIcon,
   PlusIcon,
@@ -13600,6 +14538,7 @@ ToggleButtonGroup.displayName = "ToggleButtonGroup";
   ZoomOutIcon,
   calendarDateToNativeDate,
   cn,
+  countryOptions,
   createSelectOptions,
   dangerInputfield,
   dateValueToNativeDate,