@norges-domstoler/dds-components 17.4.0 → 17.5.0

package/dist/index.mjs

@@ -516,7 +516,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
@@ -2157,7 +2157,7 @@ import { forwardRef as forwardRef5 } from "react";
 import { useCallback } from "react";
 function useCombinedRef(...refs) {
   return 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;
@@ -9783,7 +9783,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
@@ -10292,9 +10295,942 @@ var Pagination = forwardRef76(
 );
 Pagination.displayName = "Pagination";
 
-// src/components/Popover/Popover.tsx
+// src/components/PhoneInput/PhoneInput.tsx
 import { ddsTokens as ddsTokens15 } from "@norges-domstoler/dds-design-tokens";
-import { forwardRef as forwardRef77 } from "react";
+import {
+  forwardRef as forwardRef77,
+  useEffect as useEffect23,
+  useId as useId17,
+  useLayoutEffect as useLayoutEffect2,
+  useRef as useRef27,
+  useState as useState19
+} from "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
+import { jsx as jsx266, jsxs as jsxs62 } from "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 = forwardRef77(
+  ({
+    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 = useId17();
+    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] = useState19("");
+    const [selectedCountryCodeText, setSelectedCountryCodeText] = useState19("");
+    const [internalValue, setInternalValue] = useState19(
+      defaultValue != null ? defaultValue : {
+        countryCode: "",
+        phoneNumber: ""
+      }
+    );
+    const isControlled = value !== void 0;
+    const [callingCodeWidth, setCallingCodeWidth] = useState19(0);
+    const callingCodeRef = useRef27(null);
+    useLayoutEffect2(() => {
+      if (callingCodeRef.current) {
+        setCallingCodeWidth(callingCodeRef.current.offsetWidth);
+      }
+    }, [callingCode]);
+    const callingCodeInlineStart = callingCodeWidth ? ddsTokens15.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 = useRef27(null);
+    const combinedSelectRef = useCombinedRef(selectRef, internalSelectRef);
+    const displayedValue = isControlled ? value : internalValue;
+    useEffect23(() => {
+      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__ */ jsxs62("div", { className: cn(className, Input_default.container), style, children: [
+      hasLabel && /* @__PURE__ */ jsx266(
+        Label,
+        {
+          htmlFor: phoneNumberId,
+          showRequiredStyling,
+          className: Input_default.label,
+          readOnly,
+          children: label
+        }
+      ),
+      /* @__PURE__ */ jsxs62(
+        "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__ */ jsx266("label", { className: utilStyles_default["visually-hidden"], htmlFor: selectId, children: selectLabel }),
+            /* @__PURE__ */ jsx266(
+              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__ */ jsx266("option", { value: item.countryCode, children: item.label }, index))
+              }
+            ),
+            /* @__PURE__ */ jsxs62("div", { className: Input_default["input-group"], children: [
+              /* @__PURE__ */ jsx266(
+                "span",
+                {
+                  className: cn(
+                    typographyStyles_default[getTypographyCn(inputTypographyTypes[componentSize])],
+                    Input_default["input-group__absolute-element"],
+                    PhoneInput_default["calling-code"]
+                  ),
+                  ref: callingCodeRef,
+                  children: callingCode
+                }
+              ),
+              /* @__PURE__ */ jsx266(
+                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
+import { ddsTokens as ddsTokens16 } from "@norges-domstoler/dds-design-tokens";
+import { forwardRef as forwardRef78 } from "react";
 
 // src/components/Popover/Popover.module.css
 var Popover_default = {
@@ -10305,8 +11241,8 @@ var Popover_default = {
 };
 
 // src/components/Popover/Popover.tsx
-import { jsx as jsx266, jsxs as jsxs62 } from "react/jsx-runtime";
-var Popover = forwardRef77(
+import { jsx as jsx267, jsxs as jsxs63 } from "react/jsx-runtime";
+var Popover = forwardRef78(
   (props, ref) => {
     const {
       title,
@@ -10318,7 +11254,7 @@ var Popover = forwardRef77(
       anchorElement,
       children,
       placement = "bottom",
-      offset = ddsTokens15.ddsSpacingX05NumberPx,
+      offset = ddsTokens16.ddsSpacingX05NumberPx,
       sizeProps,
       id,
       className,
@@ -10346,7 +11282,7 @@ var Popover = forwardRef77(
     useOnClickOutside(elements, () => {
       if (isOpen) onClose && onClose();
     });
-    return isOpen || hasTransitionedIn ? /* @__PURE__ */ jsxs62(
+    return isOpen || hasTransitionedIn ? /* @__PURE__ */ jsxs63(
       Paper,
       {
         ...getBaseHTMLProps(
@@ -10368,15 +11304,15 @@ var Popover = forwardRef77(
         elevation: 3,
         border: "subtle",
         children: [
-          title && /* @__PURE__ */ jsx266("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ jsx266(Heading, { level: 2, typographyType: "headingSans02", children: title }) : title }),
-          /* @__PURE__ */ jsx266(
+          title && /* @__PURE__ */ jsx267("div", { className: Popover_default.title, children: typeof title === "string" ? /* @__PURE__ */ jsx267(Heading, { level: 2, typographyType: "headingSans02", children: title }) : title }),
+          /* @__PURE__ */ jsx267(
             "div",
             {
               className: !hasTitle && withCloseButton ? Popover_default["content--closable--no-title"] : "",
               children
             }
           ),
-          withCloseButton && /* @__PURE__ */ jsx266(
+          withCloseButton && /* @__PURE__ */ jsx267(
             Button,
             {
               icon: CloseIcon,
@@ -10399,11 +11335,11 @@ import {
   Children as ReactChildren5,
   cloneElement as cloneElement6,
   isValidElement as isValidElement7,
-  useId as useId17,
-  useRef as useRef27,
-  useState as useState19
+  useId as useId18,
+  useRef as useRef28,
+  useState as useState20
 } from "react";
-import { Fragment as Fragment9, jsx as jsx267 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx268 } from "react/jsx-runtime";
 var PopoverGroup = ({
   isOpen = false,
   onCloseButtonClick,
@@ -10411,8 +11347,8 @@ var PopoverGroup = ({
   children,
   popoverId
 }) => {
-  const [open, setOpen] = useState19(isOpen);
-  const generatedId = useId17();
+  const [open, setOpen] = useState20(isOpen);
+  const generatedId = useId18();
   const uniquePopoverId = popoverId != null ? popoverId : `${generatedId}-popover`;
   const handleOnCloseButtonClick = () => {
     setOpen(false);
@@ -10422,8 +11358,8 @@ var PopoverGroup = ({
     setOpen(!open);
     onTriggerClick && onTriggerClick();
   };
-  const buttonRef = useRef27(null);
-  const popoverRef = useRef27(null);
+  const buttonRef = useRef28(null);
+  const popoverRef = useRef28(null);
   useOnKeyDown(["Esc", "Escape"], () => {
     var _a;
     if (open) {
@@ -10449,7 +11385,7 @@ var PopoverGroup = ({
       onClose: handleClose
     }));
   });
-  return /* @__PURE__ */ jsx267(Fragment9, { children: Children8 });
+  return /* @__PURE__ */ jsx268(Fragment9, { children: Children8 });
 };
 PopoverGroup.displayName = "PopoverGroup";
 
@@ -10458,11 +11394,11 @@ import {
   Children as Children4,
   Fragment as Fragment11,
   cloneElement as cloneElement7,
-  forwardRef as forwardRef78,
+  forwardRef as forwardRef79,
   isValidElement as isValidElement8,
-  useEffect as useEffect23,
+  useEffect as useEffect24,
   useMemo as useMemo3,
-  useState as useState20
+  useState as useState21
 } from "react";
 
 // src/components/ProgressTracker/ProgressTracker.context.tsx
@@ -10497,7 +11433,7 @@ var ProgressTracker_default = {
 
 // src/components/ProgressTracker/ProgressTrackerItem.tsx
 import { useMemo as useMemo2 } from "react";
-import { Fragment as Fragment10, jsx as jsx268, jsxs as jsxs63 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx269, jsxs as jsxs64 } from "react/jsx-runtime";
 var toItemState = (active, completed, disabled) => {
   if (disabled) {
     return "disabled";
@@ -10540,15 +11476,15 @@ var ProgressTrackerItem = (props) => {
   };
   const stepNumberContent = useMemo2(() => {
     if (completed) {
-      return /* @__PURE__ */ jsx268(Icon, { icon: CheckIcon, iconSize: "small" });
+      return /* @__PURE__ */ jsx269(Icon, { icon: CheckIcon, iconSize: "small" });
     }
     if (icon !== void 0) {
-      return /* @__PURE__ */ jsx268(Icon, { icon, iconSize: "small" });
+      return /* @__PURE__ */ jsx269(Icon, { icon, iconSize: "small" });
     }
     return index + 1;
   }, [completed, icon, index]);
-  const stepContent = /* @__PURE__ */ jsxs63(Fragment10, { children: [
-    /* @__PURE__ */ jsx268(
+  const stepContent = /* @__PURE__ */ jsxs64(Fragment10, { children: [
+    /* @__PURE__ */ jsx269(
       "div",
       {
         "aria-hidden": true,
@@ -10560,7 +11496,7 @@ var ProgressTrackerItem = (props) => {
         children: stepNumberContent
       }
     ),
-    /* @__PURE__ */ jsxs63(
+    /* @__PURE__ */ jsxs64(
       "div",
       {
         className: cn(
@@ -10569,13 +11505,13 @@ var ProgressTrackerItem = (props) => {
           typographyStyles_default["body-sans-03"]
         ),
         children: [
-          /* @__PURE__ */ jsx268(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
+          /* @__PURE__ */ jsx269(VisuallyHidden, { as: "span", children: getVisuallyHiddenText(active, completed, index) }),
           children
         ]
       }
     )
   ] });
-  return /* @__PURE__ */ jsx268("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ jsx268(
+  return /* @__PURE__ */ jsx269("li", { "aria-current": active ? "step" : void 0, className: ProgressTracker_default.item, children: handleStepChange ? /* @__PURE__ */ jsx269(
     "button",
     {
       ...getBaseHTMLProps(
@@ -10588,7 +11524,7 @@ var ProgressTrackerItem = (props) => {
       disabled,
       children: stepContent
     }
-  ) : /* @__PURE__ */ jsx268(
+  ) : /* @__PURE__ */ jsx269(
     "div",
     {
       ...getBaseHTMLProps(
@@ -10604,9 +11540,9 @@ var ProgressTrackerItem = (props) => {
 ProgressTrackerItem.displayName = "ProgressTracker.Item";
 
 // src/components/ProgressTracker/ProgressTracker.tsx
-import { jsx as jsx269, jsxs as jsxs64 } from "react/jsx-runtime";
+import { jsx as jsx270, jsxs as jsxs65 } from "react/jsx-runtime";
 var ProgressTracker = (() => {
-  const Res = forwardRef78((props, ref) => {
+  const Res = forwardRef79((props, ref) => {
     const {
       id,
       activeStep = 0,
@@ -10616,12 +11552,12 @@ var ProgressTracker = (() => {
       htmlProps,
       ...rest
     } = props;
-    const [thisActiveStep, setActiveStep] = useState20(activeStep);
+    const [thisActiveStep, setActiveStep] = useState21(activeStep);
     const handleChange = (step) => {
       setActiveStep(step);
       onStepChange && onStepChange(step);
     };
-    useEffect23(() => {
+    useEffect24(() => {
       if (activeStep !== void 0 && activeStep != thisActiveStep) {
         setActiveStep(activeStep);
       }
@@ -10636,14 +11572,14 @@ var ProgressTracker = (() => {
       const itemsWithConnectorsBetween = intersperseItemsWithConnector(itemsWithIndex);
       return itemsWithConnectorsBetween;
     }, [children]);
-    return /* @__PURE__ */ jsx269(
+    return /* @__PURE__ */ jsx270(
       ProgressTrackerContext.Provider,
       {
         value: {
           activeStep: thisActiveStep,
           handleStepChange: handleChange
         },
-        children: /* @__PURE__ */ jsx269("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ jsx269("ol", { className: ProgressTracker_default.list, children: steps }) })
+        children: /* @__PURE__ */ jsx270("div", { role: "group", "aria-label": "progress", ...containerProps, children: /* @__PURE__ */ jsx270("ol", { className: ProgressTracker_default.list, children: steps }) })
       }
     );
   });
@@ -10667,14 +11603,14 @@ var intersperseItemsWithConnector = (children) => Children4.map(children, (child
   if (index === 0) {
     return child;
   }
-  return /* @__PURE__ */ jsxs64(Fragment11, { children: [
-    /* @__PURE__ */ jsx269("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
+  return /* @__PURE__ */ jsxs65(Fragment11, { children: [
+    /* @__PURE__ */ jsx270("div", { "aria-hidden": true, className: ProgressTracker_default.connector }),
     child
   ] }, index);
 });
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { forwardRef as forwardRef79, useId as useId18 } from "react";
+import { forwardRef as forwardRef80, useId as useId19 } from "react";
 
 // src/components/ProgressBar/ProgressBar.module.css
 var ProgressBar_default = {
@@ -10690,8 +11626,8 @@ var ProgressBar_default = {
 };
 
 // src/components/ProgressBar/ProgressBar.tsx
-import { jsx as jsx270, jsxs as jsxs65 } from "react/jsx-runtime";
-var ProgressBar = forwardRef79(
+import { jsx as jsx271, jsxs as jsxs66 } from "react/jsx-runtime";
+var ProgressBar = forwardRef80(
   (props, ref) => {
     const {
       label,
@@ -10707,7 +11643,7 @@ var ProgressBar = forwardRef79(
       style,
       ...rest
     } = props;
-    const generatedId = useId18();
+    const generatedId = useId19();
     const uniqueId = id != null ? id : `${generatedId}-searchInput`;
     const hasErrorMessage = !!errorMessage;
     const hasTip = !!tip;
@@ -10725,9 +11661,9 @@ var ProgressBar = forwardRef79(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       ["--dds-progressbar-fill-width"]: fillPrecentage != null ? fillPrecentage : 0
     };
-    return /* @__PURE__ */ jsxs65("div", { className: cn(className, ProgressBar_default.container), style, children: [
-      hasLabel ? /* @__PURE__ */ jsx270(Label, { htmlFor: uniqueId, children: label }) : void 0,
-      /* @__PURE__ */ jsx270(
+    return /* @__PURE__ */ jsxs66("div", { className: cn(className, ProgressBar_default.container), style, children: [
+      hasLabel ? /* @__PURE__ */ jsx271(Label, { htmlFor: uniqueId, children: label }) : void 0,
+      /* @__PURE__ */ jsx271(
         "progress",
         {
           ref,
@@ -10744,12 +11680,12 @@ var ProgressBar = forwardRef79(
           children: fillPrecentage
         }
       ),
-      /* @__PURE__ */ jsx270(
+      /* @__PURE__ */ jsx271(
         "div",
         {
           style: progressStyleVariables,
           className: cn(ProgressBar_default.progress, ProgressBar_default[`progress--${size2}`]),
-          children: /* @__PURE__ */ jsx270(
+          children: /* @__PURE__ */ jsx271(
             "div",
             {
               style: fillStyleVariables,
@@ -10771,9 +11707,9 @@ ProgressBar.displayName = "ProgressBar";
 
 // src/components/Search/Search.tsx
 import {
-  forwardRef as forwardRef82,
-  useId as useId19,
-  useState as useState21
+  forwardRef as forwardRef83,
+  useId as useId20,
+  useState as useState22
 } from "react";
 
 // src/components/Search/AutocompleteSearch.context.tsx
@@ -10833,26 +11769,26 @@ function createEmptyChangeEvent(inputElementId) {
 }
 
 // src/components/Search/SearchSuggestions.tsx
-import { forwardRef as forwardRef81 } from "react";
+import { forwardRef as forwardRef82 } from "react";
 
 // src/components/Search/SearchSuggestionItem.tsx
 import {
-  forwardRef as forwardRef80,
-  useEffect as useEffect24,
-  useRef as useRef28
+  forwardRef as forwardRef81,
+  useEffect as useEffect25,
+  useRef as useRef29
 } from "react";
-import { jsx as jsx271 } from "react/jsx-runtime";
-var SearchSuggestionItem = forwardRef80((props, ref) => {
+import { jsx as jsx272 } from "react/jsx-runtime";
+var SearchSuggestionItem = forwardRef81((props, ref) => {
   const { focus, className, ...rest } = props;
-  const itemRef = useRef28(null);
+  const itemRef = useRef29(null);
   const combinedRef = useCombinedRef(ref, itemRef);
-  useEffect24(() => {
+  useEffect25(() => {
     var _a;
     if (focus) {
       (_a = itemRef.current) == null ? void 0 : _a.focus();
     }
   }, [focus]);
-  return /* @__PURE__ */ jsx271(
+  return /* @__PURE__ */ jsx272(
     "button",
     {
       ref: combinedRef,
@@ -10871,8 +11807,8 @@ var SearchSuggestionItem = forwardRef80((props, ref) => {
 SearchSuggestionItem.displayName = "SearchSuggestionItem";
 
 // src/components/Search/SearchSuggestions.tsx
-import { jsx as jsx272, jsxs as jsxs66 } from "react/jsx-runtime";
-var SearchSuggestions = forwardRef81((props, ref) => {
+import { jsx as jsx273, jsxs as jsxs67 } from "react/jsx-runtime";
+var SearchSuggestions = forwardRef82((props, ref) => {
   const {
     id,
     searchId,
@@ -10891,7 +11827,7 @@ var SearchSuggestions = forwardRef81((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__ */ jsxs66(
+  return /* @__PURE__ */ jsxs67(
     Paper,
     {
       ...getBaseHTMLProps(
@@ -10910,7 +11846,7 @@ var SearchSuggestions = forwardRef81((props, ref) => {
       "aria-hidden": !showSuggestions,
       border: "default",
       children: [
-        /* @__PURE__ */ jsx272(
+        /* @__PURE__ */ jsx273(
           "span",
           {
             id: suggestionsHeaderId,
@@ -10921,14 +11857,14 @@ var SearchSuggestions = forwardRef81((props, ref) => {
             children: "S\xF8keforslag"
           }
         ),
-        /* @__PURE__ */ jsx272(
+        /* @__PURE__ */ jsx273(
           "ul",
           {
             role: "listbox",
             "aria-labelledby": suggestionsHeaderId,
             className: utilStyles_default["remove-list-styling"],
             children: suggestionsToRender.map((suggestion, index) => {
-              return /* @__PURE__ */ jsx272("li", { role: "option", children: /* @__PURE__ */ jsx272(
+              return /* @__PURE__ */ jsx273("li", { role: "option", children: /* @__PURE__ */ jsx273(
                 SearchSuggestionItem,
                 {
                   index,
@@ -10951,7 +11887,7 @@ var SearchSuggestions = forwardRef81((props, ref) => {
 SearchSuggestions.displayName = "SearchSuggestions";
 
 // src/components/Search/Search.tsx
-import { Fragment as Fragment12, jsx as jsx273, jsxs as jsxs67 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx274, jsxs as jsxs68 } from "react/jsx-runtime";
 var getIconSize = (size2) => {
   switch (size2) {
     case "large":
@@ -10962,7 +11898,7 @@ var getIconSize = (size2) => {
       return "small";
   }
 };
-var Search = forwardRef82(
+var Search = forwardRef83(
   ({
     componentSize = "medium",
     buttonProps,
@@ -10978,7 +11914,7 @@ var Search = forwardRef82(
     ...rest
   }, ref) => {
     var _a;
-    const generatedId = useId19();
+    const generatedId = useId20();
     const uniqueId = id != null ? id : `${generatedId}-searchInput`;
     const hasLabel = !!label;
     const tipId = derivativeIdGenerator(uniqueId, "tip");
@@ -10987,7 +11923,7 @@ var Search = forwardRef82(
       uniqueId,
       "suggestions-description"
     );
-    const [hasValue, setHasValue] = useState21(!!value);
+    const [hasValue, setHasValue] = useState22(!!value);
     const context = useAutocompleteSearch();
     const combinedRef = context.inputRef ? useCombinedRef(context.inputRef, ref) : ref;
     const handleChange = (e) => {
@@ -11006,10 +11942,10 @@ var Search = forwardRef82(
     } = buttonProps != null ? buttonProps : {};
     const hasSuggestions = !!context.suggestions;
     const showSearchButton = !!buttonProps && !!onClick;
-    return /* @__PURE__ */ jsxs67("div", { className: Search_default.container, children: [
-      hasLabel && /* @__PURE__ */ jsx273(Label, { htmlFor: uniqueId, children: label }),
-      /* @__PURE__ */ jsxs67("div", { children: [
-        /* @__PURE__ */ jsxs67(
+    return /* @__PURE__ */ jsxs68("div", { className: Search_default.container, children: [
+      hasLabel && /* @__PURE__ */ jsx274(Label, { htmlFor: uniqueId, children: label }),
+      /* @__PURE__ */ jsxs68("div", { children: [
+        /* @__PURE__ */ jsxs68(
           "div",
           {
             className: cn(
@@ -11018,16 +11954,19 @@ var Search = forwardRef82(
             ),
             style,
             children: [
-              /* @__PURE__ */ jsxs67("div", { className: Search_default["input-group"], children: [
-                /* @__PURE__ */ jsx273(
+              /* @__PURE__ */ jsxs68("div", { className: Search_default["input-group"], children: [
+                /* @__PURE__ */ jsx274(
                   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__ */ jsx273(
+                /* @__PURE__ */ jsx274(
                   Input,
                   {
                     ...rest,
@@ -11054,8 +11993,8 @@ var Search = forwardRef82(
                     )
                   }
                 ),
-                hasSuggestions && /* @__PURE__ */ jsxs67(Fragment12, { children: [
-                  /* @__PURE__ */ jsx273(
+                hasSuggestions && /* @__PURE__ */ jsxs68(Fragment12, { children: [
+                  /* @__PURE__ */ jsx274(
                     SearchSuggestions,
                     {
                       id: suggestionsId,
@@ -11067,9 +12006,9 @@ var Search = forwardRef82(
                       componentSize
                     }
                   ),
-                  /* @__PURE__ */ jsx273(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
+                  /* @__PURE__ */ jsx274(VisuallyHidden, { id: suggestionsDescriptionId, as: "span", children: "Bla i s\xF8keforslag med piltaster n\xE5r listen er utvidet." })
                 ] }),
-                hasValue && /* @__PURE__ */ jsx273(
+                hasValue && /* @__PURE__ */ jsx274(
                   Button,
                   {
                     icon: CloseSmallIcon,
@@ -11081,7 +12020,7 @@ var Search = forwardRef82(
                   }
                 )
               ] }),
-              showSearchButton && /* @__PURE__ */ jsx273(
+              showSearchButton && /* @__PURE__ */ jsx274(
                 Button,
                 {
                   size: componentSize,
@@ -11102,11 +12041,11 @@ Search.displayName = "Search";
 
 // src/components/Search/SearchAutocompleteWrapper.tsx
 import {
-  useEffect as useEffect25,
-  useRef as useRef29,
-  useState as useState22
+  useEffect as useEffect26,
+  useRef as useRef30,
+  useState as useState23
 } from "react";
-import { jsx as jsx274 } from "react/jsx-runtime";
+import { jsx as jsx275 } from "react/jsx-runtime";
 var SearchAutocompleteWrapper = (props) => {
   const {
     value,
@@ -11117,12 +12056,12 @@ var SearchAutocompleteWrapper = (props) => {
     onSuggestionSelection,
     children
   } = props;
-  const [inputValue, setInputValue] = useState22(value != null ? value : "");
-  const [suggestions, setSuggestions] = useState22([]);
-  const [showSuggestions, setShowSuggestions] = useState22(false);
+  const [inputValue, setInputValue] = useState23(value != null ? value : "");
+  const [suggestions, setSuggestions] = useState23([]);
+  const [showSuggestions, setShowSuggestions] = useState23(false);
   const closeSuggestions = () => showSuggestions === true && setShowSuggestions(false);
   const openSuggestions = () => showSuggestions === false && setShowSuggestions(true);
-  useEffect25(() => {
+  useEffect26(() => {
     if (suggestions.length > 0) {
       openSuggestions();
     } else {
@@ -11167,8 +12106,8 @@ var SearchAutocompleteWrapper = (props) => {
   const handleSetInputValue = (value2) => {
     setInputValue(value2 != null ? value2 : "");
   };
-  const inputRef = useRef29(null);
-  const suggestionsRef = useRef29(null);
+  const inputRef = useRef30(null);
+  const suggestionsRef = useRef30(null);
   useOnClickOutside([inputRef.current, suggestionsRef.current], () => {
     closeSuggestions();
   });
@@ -11182,7 +12121,7 @@ var SearchAutocompleteWrapper = (props) => {
     inputValue,
     onSugggestionClick: handleSuggestionClick
   };
-  return /* @__PURE__ */ jsx274(AutocompleteSearchContext.Provider, { value: contextProps, children });
+  return /* @__PURE__ */ jsx275(AutocompleteSearchContext.Provider, { value: contextProps, children });
 };
 SearchAutocompleteWrapper.displayName = "SearchAutocompleteWrapper";
 
@@ -11192,7 +12131,7 @@ Search2.AutocompleteWrapper = SearchAutocompleteWrapper;
 Search2.Suggestions = SearchSuggestions;
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-import { forwardRef as forwardRef84, useId as useId20 } from "react";
+import { forwardRef as forwardRef85, useId as useId21 } from "react";
 
 // src/components/SelectionControl/Checkbox/CheckboxGroupContext.tsx
 import { createContext as createContext6, useContext as useContext9 } from "react";
@@ -11203,7 +12142,7 @@ var useCheckboxGroup = () => {
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
 import {
-  forwardRef as forwardRef83
+  forwardRef as forwardRef84
 } from "react";
 
 // src/components/SelectionControl/SelectionControl.module.css
@@ -11224,10 +12163,10 @@ var SelectionControl_default = {
 };
 
 // src/components/SelectionControl/SelectionControl.styles.tsx
-import { jsx as jsx275 } from "react/jsx-runtime";
-var SelectionControl = forwardRef83((props, ref) => {
+import { jsx as jsx276 } from "react/jsx-runtime";
+var SelectionControl = forwardRef84((props, ref) => {
   const { controlType, className, ...rest } = props;
-  return /* @__PURE__ */ jsx275(
+  return /* @__PURE__ */ jsx276(
     "span",
     {
       ref,
@@ -11240,7 +12179,7 @@ var SelectionControl = forwardRef83((props, ref) => {
     }
   );
 });
-var Label2 = forwardRef83(
+var Label2 = forwardRef84(
   (props, ref) => {
     const {
       disabled,
@@ -11251,7 +12190,7 @@ var Label2 = forwardRef83(
       className,
       ...rest
     } = props;
-    return /* @__PURE__ */ jsx275(
+    return /* @__PURE__ */ jsx276(
       "label",
       {
         ref,
@@ -11282,8 +12221,8 @@ var selectionControlTypographyProps = {
 };
 
 // src/components/SelectionControl/Checkbox/Checkbox.tsx
-import { jsx as jsx276, jsxs as jsxs68 } from "react/jsx-runtime";
-var Checkbox = forwardRef84(
+import { jsx as jsx277, jsxs as jsxs69 } from "react/jsx-runtime";
+var Checkbox = forwardRef85(
   (props, ref) => {
     const {
       id,
@@ -11298,7 +12237,7 @@ var Checkbox = forwardRef84(
       htmlProps = {},
       ...rest
     } = props;
-    const generatedId = useId20();
+    const generatedId = useId21();
     const uniqueId = id != null ? id : `${generatedId}-checkbox`;
     const checkboxGroup = useCheckboxGroup();
     const hasLabel = !!label;
@@ -11310,7 +12249,7 @@ var Checkbox = forwardRef84(
     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__ */ jsxs68(
+    return /* @__PURE__ */ jsxs69(
       Label2,
       {
         hasError,
@@ -11322,7 +12261,7 @@ var Checkbox = forwardRef84(
         className: cn(className, htmlPropsClassName),
         style,
         children: [
-          /* @__PURE__ */ jsx276(
+          /* @__PURE__ */ jsx277(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -11352,14 +12291,14 @@ var Checkbox = forwardRef84(
               onClick: readOnlyClickHandler(isReadOnly, htmlProps.onClick)
             }
           ),
-          /* @__PURE__ */ jsx276(
+          /* @__PURE__ */ jsx277(
             SelectionControl,
             {
               controlType: "checkbox",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          hasLabel && /* @__PURE__ */ jsx276(Typography, { ...selectionControlTypographyProps, children: label })
+          hasLabel && /* @__PURE__ */ jsx277(Typography, { ...selectionControlTypographyProps, children: label })
         ]
       }
     );
@@ -11368,8 +12307,8 @@ var Checkbox = forwardRef84(
 Checkbox.displayName = "Checkbox";
 
 // src/components/SelectionControl/Checkbox/CheckboxGroup.tsx
-import { useId as useId21 } from "react";
-import { jsx as jsx277, jsxs as jsxs69 } from "react/jsx-runtime";
+import { useId as useId22 } from "react";
+import { jsx as jsx278, jsxs as jsxs70 } from "react/jsx-runtime";
 var CheckboxGroup = (props) => {
   const {
     label,
@@ -11387,7 +12326,7 @@ var CheckboxGroup = (props) => {
     ...rest
   } = props;
   const { "aria-required": ariaRequired } = htmlProps;
-  const generatedId = useId21();
+  const generatedId = useId22();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-checkboxGroup`;
   const hasErrorMessage = !!errorMessage;
   const showRequiredMarker = required || ariaRequired;
@@ -11401,7 +12340,7 @@ var CheckboxGroup = (props) => {
     disabled,
     readOnly
   };
-  return /* @__PURE__ */ jsxs69(
+  return /* @__PURE__ */ jsxs70(
     "div",
     {
       ...getBaseHTMLProps(
@@ -11411,7 +12350,7 @@ var CheckboxGroup = (props) => {
         rest
       ),
       children: [
-        /* @__PURE__ */ jsxs69(
+        /* @__PURE__ */ jsxs70(
           Typography,
           {
             as: "span",
@@ -11419,15 +12358,15 @@ var CheckboxGroup = (props) => {
             id: uniqueGroupId,
             className: readOnly ? Label_default["read-only"] : void 0,
             children: [
-              readOnly && /* @__PURE__ */ jsx277(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
+              readOnly && /* @__PURE__ */ jsx278(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ jsx277(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ jsx278(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ jsx277(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx277(
+        /* @__PURE__ */ jsx278(CheckboxGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx278(
           "div",
           {
             role: "group",
@@ -11445,7 +12384,7 @@ var CheckboxGroup = (props) => {
 CheckboxGroup.displayName = "CheckboxGroup";
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-import { forwardRef as forwardRef85, useId as useId22 } from "react";
+import { forwardRef as forwardRef86, useId as useId23 } from "react";
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroupContext.tsx
 import { createContext as createContext7, useContext as useContext10 } from "react";
@@ -11455,7 +12394,7 @@ var useRadioButtonGroup = () => {
 };
 
 // src/components/SelectionControl/RadioButton/RadioButton.tsx
-import { jsx as jsx278, jsxs as jsxs70 } from "react/jsx-runtime";
+import { jsx as jsx279, jsxs as jsxs71 } from "react/jsx-runtime";
 var isValueEqualToGroupValueOrFalsy = (value, group) => {
   if (typeof value !== "undefined" && value !== null && group) {
     if (typeof value === "number") {
@@ -11465,7 +12404,7 @@ var isValueEqualToGroupValueOrFalsy = (value, group) => {
   }
   return !!value;
 };
-var RadioButton = forwardRef85(
+var RadioButton = forwardRef86(
   (props, ref) => {
     const {
       id,
@@ -11489,7 +12428,7 @@ var RadioButton = forwardRef85(
       style,
       ...restHtmlProps
     } = htmlProps;
-    const generatedId = useId22();
+    const generatedId = useId23();
     const uniqueId = id != null ? id : `${generatedId}-radioButton`;
     const hasLabel = !!label;
     const radioButtonGroup = useRadioButtonGroup();
@@ -11504,7 +12443,7 @@ var RadioButton = forwardRef85(
     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__ */ jsxs70(
+    return /* @__PURE__ */ jsxs71(
       Label2,
       {
         hasError,
@@ -11516,7 +12455,7 @@ var RadioButton = forwardRef85(
         htmlFor: uniqueId,
         controlType: "radio",
         children: [
-          /* @__PURE__ */ jsx278(
+          /* @__PURE__ */ jsx279(
             "input",
             {
               ...getBaseHTMLProps(uniqueId, restHtmlProps, rest),
@@ -11542,14 +12481,14 @@ var RadioButton = forwardRef85(
               onClick: readOnlyClickHandler(isReadOnly, htmlProps.onClick)
             }
           ),
-          /* @__PURE__ */ jsx278(
+          /* @__PURE__ */ jsx279(
             SelectionControl,
             {
               controlType: "radio",
               className: focus_default["focus-styled-sibling"]
             }
           ),
-          /* @__PURE__ */ jsx278(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
+          /* @__PURE__ */ jsx279(Typography, { ...selectionControlTypographyProps, children: children != null ? children : label })
         ]
       }
     );
@@ -11559,11 +12498,11 @@ RadioButton.displayName = "RadioButton";
 
 // src/components/SelectionControl/RadioButton/RadioButtonGroup.tsx
 import {
-  forwardRef as forwardRef86,
-  useId as useId23,
-  useState as useState23
+  forwardRef as forwardRef87,
+  useId as useId24,
+  useState as useState24
 } from "react";
-import { jsx as jsx279, jsxs as jsxs71 } from "react/jsx-runtime";
+import { jsx as jsx280, jsxs as jsxs72 } from "react/jsx-runtime";
 var RadioButtonGroupInner = (props, ref) => {
   const {
     name,
@@ -11584,8 +12523,8 @@ var RadioButtonGroupInner = (props, ref) => {
     ...rest
   } = props;
   const { "aria-required": ariaRequired = false } = htmlProps;
-  const [groupValue, setGroupValue] = useState23(value);
-  const generatedId = useId23();
+  const [groupValue, setGroupValue] = useState24(value);
+  const generatedId = useId24();
   const uniqueGroupId = groupId != null ? groupId : `${generatedId}-radioButtonGroup`;
   const handleChange = combineHandlers(
     (e) => setGroupValue(e.target.value),
@@ -11605,7 +12544,7 @@ var RadioButtonGroupInner = (props, ref) => {
     value: groupValue,
     onChange: handleChange
   };
-  return /* @__PURE__ */ jsxs71(
+  return /* @__PURE__ */ jsxs72(
     "div",
     {
       ...getBaseHTMLProps(
@@ -11616,7 +12555,7 @@ var RadioButtonGroupInner = (props, ref) => {
       ),
       ref,
       children: [
-        /* @__PURE__ */ jsxs71(
+        /* @__PURE__ */ jsxs72(
           Typography,
           {
             as: "span",
@@ -11624,15 +12563,15 @@ var RadioButtonGroupInner = (props, ref) => {
             id: uniqueGroupId,
             className: readOnly ? Label_default["read-only"] : void 0,
             children: [
-              readOnly && /* @__PURE__ */ jsx279(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
+              readOnly && /* @__PURE__ */ jsx280(Icon, { icon: LockIcon, className: Label_default["read-only__icon"] }),
               label,
               " ",
-              showRequiredMarker && /* @__PURE__ */ jsx279(RequiredMarker, {})
+              showRequiredMarker && /* @__PURE__ */ jsx280(RequiredMarker, {})
             ]
           }
         ),
         renderInputMessage(tip, tipId),
-        /* @__PURE__ */ jsx279(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx279(
+        /* @__PURE__ */ jsx280(RadioButtonGroupContext.Provider, { value: { ...contextProps }, children: /* @__PURE__ */ jsx280(
           "div",
           {
             role: "radiogroup",
@@ -11648,11 +12587,11 @@ var RadioButtonGroupInner = (props, ref) => {
     }
   );
 };
-var RadioButtonGroup = forwardRef86(RadioButtonGroupInner);
+var RadioButtonGroup = forwardRef87(RadioButtonGroupInner);
 RadioButtonGroup.displayName = "RadioButtonGroup";
 
 // src/components/Skeleton/Skeleton.tsx
-import { forwardRef as forwardRef87 } from "react";
+import { forwardRef as forwardRef88 } from "react";
 
 // src/components/Skeleton/Skeleton.module.css
 var Skeleton_default = {
@@ -11661,8 +12600,8 @@ var Skeleton_default = {
 };
 
 // src/components/Skeleton/Skeleton.tsx
-import { jsx as jsx280 } from "react/jsx-runtime";
-var Skeleton = forwardRef87(
+import { jsx as jsx281 } from "react/jsx-runtime";
+var Skeleton = forwardRef88(
   (props, ref) => {
     const {
       width,
@@ -11672,7 +12611,7 @@ var Skeleton = forwardRef87(
       style,
       ...rest
     } = props;
-    return /* @__PURE__ */ jsx280(
+    return /* @__PURE__ */ jsx281(
       "div",
       {
         ref,
@@ -11686,7 +12625,7 @@ var Skeleton = forwardRef87(
 Skeleton.displayName = "Skeleton";
 
 // src/components/SkipToContent/SkipToContent.tsx
-import { forwardRef as forwardRef88 } from "react";
+import { forwardRef as forwardRef89 } from "react";
 
 // src/components/SkipToContent/SkipToContent.module.css
 var SkipToContent_default = {
@@ -11694,8 +12633,8 @@ var SkipToContent_default = {
 };
 
 // src/components/SkipToContent/SkipToContent.tsx
-import { jsx as jsx281 } from "react/jsx-runtime";
-var SkipToContent = forwardRef88(
+import { jsx as jsx282 } from "react/jsx-runtime";
+var SkipToContent = forwardRef89(
   (props, ref) => {
     const {
       text = "Til hovedinnhold",
@@ -11710,12 +12649,12 @@ var SkipToContent = forwardRef88(
       style,
       ...restHtmlProps
     } = htmlProps;
-    return /* @__PURE__ */ jsx281(
+    return /* @__PURE__ */ jsx282(
       Contrast,
       {
         className: cn(className, htmlPropsClassName, SkipToContent_default.wrapper),
         style: { ...style, top },
-        children: /* @__PURE__ */ jsx281(Link, { ...getBaseHTMLProps(id, restHtmlProps, rest), ref, children: text })
+        children: /* @__PURE__ */ jsx282(Link, { ...getBaseHTMLProps(id, restHtmlProps, rest), ref, children: text })
       }
     );
   }
@@ -11723,7 +12662,7 @@ var SkipToContent = forwardRef88(
 SkipToContent.displayName = "SkipToContent";
 
 // src/components/SplitButton/SplitButton.tsx
-import { forwardRef as forwardRef89, useState as useState24 } from "react";
+import { forwardRef as forwardRef90, useState as useState25 } from "react";
 
 // src/components/SplitButton/SplitButton.module.css
 var SplitButton_default = {
@@ -11734,8 +12673,8 @@ var SplitButton_default = {
 };
 
 // src/components/SplitButton/SplitButton.tsx
-import { jsx as jsx282, jsxs as jsxs72 } from "react/jsx-runtime";
-var SplitButton = forwardRef89(
+import { jsx as jsx283, jsxs as jsxs73 } from "react/jsx-runtime";
+var SplitButton = forwardRef90(
   (props, ref) => {
     const {
       size: size2,
@@ -11745,13 +12684,13 @@ var SplitButton = forwardRef89(
       className,
       ...rest
     } = props;
-    const [isOpen, setIsOpen] = useState24(false);
+    const [isOpen, setIsOpen] = useState25(false);
     const buttonStyleProps = {
       purpose,
       size: size2
     };
-    return /* @__PURE__ */ jsxs72("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
-      /* @__PURE__ */ jsx282(
+    return /* @__PURE__ */ jsxs73("div", { ref, className: cn(className, SplitButton_default.container), ...rest, children: [
+      /* @__PURE__ */ jsx283(
         Button,
         {
           ...buttonStyleProps,
@@ -11760,8 +12699,8 @@ var SplitButton = forwardRef89(
           className: SplitButton_default.main
         }
       ),
-      /* @__PURE__ */ jsxs72(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
-        /* @__PURE__ */ jsx282(
+      /* @__PURE__ */ jsxs73(OverflowMenuGroup, { onToggle: () => setIsOpen(!isOpen), children: [
+        /* @__PURE__ */ jsx283(
           Button,
           {
             ...buttonStyleProps,
@@ -11774,7 +12713,7 @@ var SplitButton = forwardRef89(
             )
           }
         ),
-        /* @__PURE__ */ jsx282(OverflowMenu, { placement: "bottom-end", children: /* @__PURE__ */ jsx282(OverflowMenuList, { children: secondaryActions.map((item, index) => /* @__PURE__ */ jsx282(OverflowMenuButton, { ...item, children: item.children }, index)) }) })
+        /* @__PURE__ */ jsx283(OverflowMenu, { placement: "bottom-end", children: /* @__PURE__ */ jsx283(OverflowMenuList, { children: secondaryActions.map((item, index) => /* @__PURE__ */ jsx283(OverflowMenuButton, { ...item, children: item.children }, index)) }) })
       ] })
     ] });
   }
@@ -11786,10 +12725,10 @@ import {
   Children as Children5,
   Fragment as Fragment13,
   cloneElement as cloneElement8,
-  forwardRef as forwardRef97,
+  forwardRef as forwardRef98,
   isValidElement as isValidElement9,
-  useEffect as useEffect27,
-  useState as useState26
+  useEffect as useEffect28,
+  useState as useState27
 } from "react";
 
 // src/components/Table/collapsible/Table.context.tsx
@@ -11801,30 +12740,30 @@ var CollapsibleTableContext = createContext8({
 var useCollapsibleTableContext = () => useContext11(CollapsibleTableContext);
 
 // src/components/Table/normal/Body.tsx
-import { forwardRef as forwardRef90 } from "react";
-import { jsx as jsx283 } from "react/jsx-runtime";
-var Body = forwardRef90(
+import { forwardRef as forwardRef91 } from "react";
+import { jsx as jsx284 } from "react/jsx-runtime";
+var Body = forwardRef91(
   (props, ref) => {
-    return /* @__PURE__ */ jsx283("tbody", { ref, ...props });
+    return /* @__PURE__ */ jsx284("tbody", { ref, ...props });
   }
 );
 Body.displayName = "Table.Body";
 
 // src/components/Table/normal/Cell.tsx
 import {
-  forwardRef as forwardRef92
+  forwardRef as forwardRef93
 } from "react";
 
 // src/components/Table/normal/Head.tsx
 import {
   createContext as createContext9,
-  forwardRef as forwardRef91,
+  forwardRef as forwardRef92,
   useContext as useContext12
 } from "react";
-import { jsx as jsx284 } from "react/jsx-runtime";
-var Head = forwardRef91(
+import { jsx as jsx285 } from "react/jsx-runtime";
+var Head = forwardRef92(
   ({ children, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx284("thead", { ref, ...rest, children: /* @__PURE__ */ jsx284(HeadContext.Provider, { value: true, children }) });
+    return /* @__PURE__ */ jsx285("thead", { ref, ...rest, children: /* @__PURE__ */ jsx285(HeadContext.Provider, { value: true, children }) });
   }
 );
 Head.displayName = "Table.Head";
@@ -11860,8 +12799,8 @@ var Table_default = {
 };
 
 // src/components/Table/normal/Cell.tsx
-import { jsx as jsx285 } from "react/jsx-runtime";
-var Cell = forwardRef92(
+import { jsx as jsx286 } from "react/jsx-runtime";
+var Cell = forwardRef93(
   ({
     children,
     type: _type,
@@ -11874,7 +12813,7 @@ var Cell = forwardRef92(
     const type = _type != null ? _type : isInHead ? "head" : "data";
     const { isCollapsibleChild } = collapsibleProps != null ? collapsibleProps : {};
     const isComplexLayout = layout === "text and icon";
-    return isCollapsibleChild ? /* @__PURE__ */ jsx285(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ jsx285(
+    return isCollapsibleChild ? /* @__PURE__ */ jsx286(DescriptionListDesc, { children }) : type === "head" ? /* @__PURE__ */ jsx286(
       "th",
       {
         ref,
@@ -11884,15 +12823,15 @@ var Cell = forwardRef92(
           !isComplexLayout && Table_default[`cell--${layout}`],
           Table_default["cell--head"]
         ),
-        children: isComplexLayout ? /* @__PURE__ */ jsx285("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ jsx286("div", { className: Table_default.cell__inner, children }) : children
       }
-    ) : /* @__PURE__ */ jsx285(
+    ) : /* @__PURE__ */ jsx286(
       "td",
       {
         ref,
         ...rest,
         className: cn(className, !isComplexLayout && Table_default[`cell--${layout}`]),
-        children: isComplexLayout ? /* @__PURE__ */ jsx285("div", { className: Table_default.cell__inner, children }) : children
+        children: isComplexLayout ? /* @__PURE__ */ jsx286("div", { className: Table_default.cell__inner, children }) : children
       }
     );
   }
@@ -11900,23 +12839,23 @@ var Cell = forwardRef92(
 Cell.displayName = "Table.Cell";
 
 // src/components/Table/normal/Foot.tsx
-import { forwardRef as forwardRef93 } from "react";
-import { jsx as jsx286 } from "react/jsx-runtime";
-var Foot = forwardRef93(
+import { forwardRef as forwardRef94 } from "react";
+import { jsx as jsx287 } from "react/jsx-runtime";
+var Foot = forwardRef94(
   (props, ref) => {
-    return /* @__PURE__ */ jsx286("tfoot", { ref, ...props });
+    return /* @__PURE__ */ jsx287("tfoot", { ref, ...props });
   }
 );
 Foot.displayName = "Table.Foot";
 
 // src/components/Table/normal/Row.tsx
-import { forwardRef as forwardRef94 } from "react";
-import { jsx as jsx287 } from "react/jsx-runtime";
-var Row = forwardRef94(
+import { forwardRef as forwardRef95 } from "react";
+import { jsx as jsx288 } from "react/jsx-runtime";
+var Row = forwardRef95(
   ({ type: _type, mode = "normal", hoverable, selected, className, ...rest }, ref) => {
     const isInHeader = useIsInTableHead();
     const type = _type != null ? _type : isInHeader ? "head" : "body";
-    return /* @__PURE__ */ jsx287(
+    return /* @__PURE__ */ jsx288(
       "tr",
       {
         ref,
@@ -11939,23 +12878,23 @@ var Row = forwardRef94(
 Row.displayName = "Table.Row";
 
 // src/components/Table/normal/SortCell.tsx
-import { forwardRef as forwardRef95 } from "react";
-import { jsx as jsx288, jsxs as jsxs73 } from "react/jsx-runtime";
+import { forwardRef as forwardRef96 } from "react";
+import { jsx as jsx289, jsxs as jsxs74 } from "react/jsx-runtime";
 var makeSortIcon = (isSorted, sortOrder) => {
   if (!isSorted || !sortOrder) {
-    return /* @__PURE__ */ jsx288(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
+    return /* @__PURE__ */ jsx289(Icon, { icon: UnfoldMoreIcon, iconSize: "inherit" });
   }
-  return sortOrder === "ascending" ? /* @__PURE__ */ jsx288(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ jsx288(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
+  return sortOrder === "ascending" ? /* @__PURE__ */ jsx289(Icon, { icon: ChevronDownIcon, iconSize: "inherit" }) : /* @__PURE__ */ jsx289(Icon, { icon: ChevronUpIcon, iconSize: "inherit" });
 };
-var SortCell = forwardRef95(
-  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ jsx288(
+var SortCell = forwardRef96(
+  ({ isSorted, sortOrder, onClick, children, ...rest }, ref) => /* @__PURE__ */ jsx289(
     Cell,
     {
       ref,
       type: "head",
       "aria-sort": isSorted && sortOrder ? sortOrder : void 0,
       ...rest,
-      children: /* @__PURE__ */ jsxs73(
+      children: /* @__PURE__ */ jsxs74(
         "button",
         {
           onClick,
@@ -11979,8 +12918,8 @@ var SortCell = forwardRef95(
 SortCell.displayName = "Table.SortCell";
 
 // src/components/Table/normal/Table.tsx
-import { forwardRef as forwardRef96 } from "react";
-import { jsx as jsx289 } from "react/jsx-runtime";
+import { forwardRef as forwardRef97 } from "react";
+import { jsx as jsx290 } from "react/jsx-runtime";
 function getDensityCn2(value) {
   switch (value) {
     case "normal":
@@ -11990,7 +12929,7 @@ function getDensityCn2(value) {
       return "extra-compact";
   }
 }
-var Table = forwardRef96(
+var Table = forwardRef97(
   ({
     density = "normal",
     stickyHeader,
@@ -11999,7 +12938,7 @@ var Table = forwardRef96(
     children,
     ...rest
   }, ref) => {
-    return /* @__PURE__ */ jsx289(
+    return /* @__PURE__ */ jsx290(
       "table",
       {
         ref,
@@ -12020,30 +12959,30 @@ var Table = forwardRef96(
 Table.displayName = "Table";
 
 // src/components/Table/normal/TableWrapper.tsx
-import { useEffect as useEffect26, useRef as useRef30, useState as useState25 } from "react";
-import { jsx as jsx290 } from "react/jsx-runtime";
+import { useEffect as useEffect27, useRef as useRef31, useState as useState26 } from "react";
+import { jsx as jsx291 } from "react/jsx-runtime";
 var TableWrapper = ({ className, ...rest }) => {
-  const [overflowX, setOverflowX] = useState25(false);
-  const [windowWidth, setWindowWidth] = useState25(window.innerWidth);
+  const [overflowX, setOverflowX] = useState26(false);
+  const [windowWidth, setWindowWidth] = useState26(window.innerWidth);
   function isOverflowingX(event) {
     return event.offsetWidth < event.scrollWidth;
   }
-  const wrapperRef = useRef30(null);
-  useEffect26(() => {
+  const wrapperRef = useRef31(null);
+  useEffect27(() => {
     if ((wrapperRef == null ? void 0 : wrapperRef.current) && isOverflowingX(wrapperRef.current)) {
       setOverflowX(true);
       return;
     }
     setOverflowX(false);
   }, [windowWidth]);
-  useEffect26(() => {
+  useEffect27(() => {
     function handleResize() {
       setWindowWidth(window.innerWidth);
     }
     window.addEventListener("resize", handleResize);
     return () => window.removeEventListener("resize", handleResize);
   });
-  return /* @__PURE__ */ jsx290(
+  return /* @__PURE__ */ jsx291(
     "div",
     {
       ref: wrapperRef,
@@ -12070,8 +13009,8 @@ Table2.Row = Row;
 Table2.Foot = Foot;
 
 // src/components/Table/collapsible/CollapsibleRow.tsx
-import { Fragment as Fragment14, jsx as jsx291, jsxs as jsxs74 } from "react/jsx-runtime";
-var CollapsibleRow = forwardRef97(
+import { Fragment as Fragment14, jsx as jsx292, jsxs as jsxs75 } from "react/jsx-runtime";
+var CollapsibleRow = forwardRef98(
   ({
     type: _type,
     className,
@@ -12084,8 +13023,8 @@ var CollapsibleRow = forwardRef97(
     const isInHead = useIsInTableHead();
     const type = _type != null ? _type : isInHead ? "head" : "body";
     const { isCollapsed, headerValues, definingColumnIndex } = useCollapsibleTableContext();
-    const [childrenCollapsed, setChildrenCollapsed] = useState26(true);
-    useEffect27(() => {
+    const [childrenCollapsed, setChildrenCollapsed] = useState27(true);
+    useEffect28(() => {
       !isCollapsed && setChildrenCollapsed(true);
     }, [isCollapsed]);
     const rowProps = (isOpenCollapsibleHeader) => {
@@ -12112,33 +13051,33 @@ var CollapsibleRow = forwardRef97(
     const collapsedRenderedChildren = isCollapsed && collapsedHeaderValues.length > 0 ? collapsedChildren.map(function(child, index) {
       const id = derivativeIdGenerator(prefix3, index.toString());
       collapsibleIds.push(id);
-      return /* @__PURE__ */ jsxs74(Fragment13, { children: [
-        /* @__PURE__ */ jsx291(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
+      return /* @__PURE__ */ jsxs75(Fragment13, { children: [
+        /* @__PURE__ */ jsx292(DescriptionListTerm, { children: collapsedHeaderValues[index].content }),
         isValidElement9(child) && cloneElement8(child, {
           collapsibleProps: { isCollapsibleChild: true }
         })
       ] }, `DL-${index}`);
     }) : null;
-    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsx291(Row, { ...rowProps(), children: /* @__PURE__ */ jsx291(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ jsx291(DescriptionList, { children: collapsedRenderedChildren }) }) }) : null;
+    const collapsedRows = collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsx292(Row, { ...rowProps(), children: /* @__PURE__ */ jsx292(Cell, { colSpan: definingColumnIndex.length + 1, children: /* @__PURE__ */ jsx292(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__ */ jsx291(Row, { ref, ...rowProps(), children: /* @__PURE__ */ jsxs74(Fragment14, { children: [
+      return /* @__PURE__ */ jsx292(Row, { ref, ...rowProps(), children: /* @__PURE__ */ jsxs75(Fragment14, { children: [
         definingColumnCells,
-        /* @__PURE__ */ jsxs74(Table2.Cell, { type: "head", layout: "center", children: [
+        /* @__PURE__ */ jsxs75(Table2.Cell, { type: "head", layout: "center", children: [
           "Utvid",
-          /* @__PURE__ */ jsx291(VisuallyHidden, { as: "span", children: "raden" })
+          /* @__PURE__ */ jsx292(VisuallyHidden, { as: "span", children: "raden" })
         ] })
       ] }) });
     };
     const idList = spaceSeparatedIdListGenerator(collapsibleIds);
     const rowWithChevron = () => {
       if (type !== "body" || !isCollapsed) return null;
-      return /* @__PURE__ */ jsxs74(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
+      return /* @__PURE__ */ jsxs75(Row, { ref, ...rowProps(!childrenCollapsed && true), children: [
         definingColumnCells,
-        /* @__PURE__ */ jsx291(Table2.Cell, { children: /* @__PURE__ */ jsx291(
+        /* @__PURE__ */ jsx292(Table2.Cell, { children: /* @__PURE__ */ jsx292(
           "button",
           {
             onClick: () => setChildrenCollapsed(!childrenCollapsed),
@@ -12150,7 +13089,7 @@ var CollapsibleRow = forwardRef97(
               utilStyles_default["remove-button-styling"],
               focusable
             ),
-            children: /* @__PURE__ */ jsx291(
+            children: /* @__PURE__ */ jsx292(
               AnimatedChevronUpDown,
               {
                 isUp: childrenCollapsed ? false : true,
@@ -12162,28 +13101,28 @@ var CollapsibleRow = forwardRef97(
         ) })
       ] });
     };
-    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsxs74(Fragment14, { children: [
+    return isCollapsed && collapsedRenderedChildren && collapsedRenderedChildren.length > 0 ? /* @__PURE__ */ jsxs75(Fragment14, { children: [
       headerRow(),
-      type === "body" && /* @__PURE__ */ jsxs74(Fragment14, { children: [
+      type === "body" && /* @__PURE__ */ jsxs75(Fragment14, { children: [
         rowWithChevron(),
         childrenCollapsed ? null : collapsedRows
       ] })
-    ] }) : /* @__PURE__ */ jsx291(Row, { ref, ...rowProps(), children });
+    ] }) : /* @__PURE__ */ jsx292(Row, { ref, ...rowProps(), children });
   }
 );
 CollapsibleRow.displayName = "CollapsibleTable.Row";
 
 // src/components/Table/collapsible/CollapsibleTable.tsx
-import { forwardRef as forwardRef98 } from "react";
-import { jsx as jsx292 } from "react/jsx-runtime";
-var CollapsibleTable = forwardRef98((props, ref) => {
+import { forwardRef as forwardRef99 } from "react";
+import { jsx as jsx293 } from "react/jsx-runtime";
+var CollapsibleTable = forwardRef99((props, ref) => {
   const {
     isCollapsed,
     headerValues,
     definingColumnIndex = [0],
     ...rest
   } = props;
-  return /* @__PURE__ */ jsx292(
+  return /* @__PURE__ */ jsx293(
     CollapsibleTableContext.Provider,
     {
       value: {
@@ -12191,7 +13130,7 @@ var CollapsibleTable = forwardRef98((props, ref) => {
         headerValues,
         definingColumnIndex
       },
-      children: /* @__PURE__ */ jsx292(Table2, { ref, ...rest })
+      children: /* @__PURE__ */ jsx293(Table2, { ref, ...rest })
     }
   );
 });
@@ -12203,11 +13142,11 @@ CollapsibleTable2.Row = CollapsibleRow;
 
 // src/components/Tabs/Tabs.tsx
 import {
-  forwardRef as forwardRef99,
-  useEffect as useEffect28,
-  useId as useId24,
-  useRef as useRef31,
-  useState as useState27
+  forwardRef as forwardRef100,
+  useEffect as useEffect29,
+  useId as useId25,
+  useRef as useRef32,
+  useState as useState28
 } from "react";
 
 // src/components/Tabs/Tabs.context.tsx
@@ -12238,8 +13177,8 @@ var Tabs_default = {
 };
 
 // src/components/Tabs/Tabs.tsx
-import { jsx as jsx293 } from "react/jsx-runtime";
-var Tabs = forwardRef99((props, ref) => {
+import { jsx as jsx294 } from "react/jsx-runtime";
+var Tabs = forwardRef100((props, ref) => {
   const {
     id,
     activeTab,
@@ -12251,17 +13190,17 @@ var Tabs = forwardRef99((props, ref) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = useId24();
+  const generatedId = useId25();
   const uniqueId = id != null ? id : `${generatedId}-tabs`;
-  const [thisActiveTab, setActiveTab] = useState27(activeTab != null ? activeTab : 0);
-  const [hasTabFocus, setHasTabFocus] = useState27(false);
-  const tabListRef = useRef31(null);
-  const tabPanelsRef = useRef31(null);
+  const [thisActiveTab, setActiveTab] = useState28(activeTab != null ? activeTab : 0);
+  const [hasTabFocus, setHasTabFocus] = useState28(false);
+  const tabListRef = useRef32(null);
+  const tabPanelsRef = useRef32(null);
   const handleTabChange = (index) => {
     setActiveTab(index);
     onChange && onChange(index);
   };
-  useEffect28(() => {
+  useEffect29(() => {
     if (activeTab !== void 0 && activeTab !== thisActiveTab) {
       setActiveTab(activeTab);
     }
@@ -12270,7 +13209,7 @@ var Tabs = forwardRef99((props, ref) => {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     ["--dds-tabs-width"]: width
   };
-  return /* @__PURE__ */ jsx293(
+  return /* @__PURE__ */ jsx294(
     TabsContext.Provider,
     {
       value: {
@@ -12283,7 +13222,7 @@ var Tabs = forwardRef99((props, ref) => {
         setHasTabFocus,
         tabContentDirection
       },
-      children: /* @__PURE__ */ jsx293(
+      children: /* @__PURE__ */ jsx294(
         "div",
         {
           ref,
@@ -12304,25 +13243,25 @@ Tabs.displayName = "Tabs";
 
 // src/components/Tabs/Tab.tsx
 import {
-  forwardRef as forwardRef100,
+  forwardRef as forwardRef101,
   useCallback as useCallback7,
-  useEffect as useEffect29,
-  useRef as useRef32
+  useEffect as useEffect30,
+  useRef as useRef33
 } from "react";
 
 // src/components/Tabs/TabWidthContext.tsx
 import {
   createContext as createContext11,
   useContext as useContext14,
-  useLayoutEffect as useLayoutEffect2
+  useLayoutEffect as useLayoutEffect3
 } from "react";
-import { jsx as jsx294 } from "react/jsx-runtime";
+import { jsx as jsx295 } from "react/jsx-runtime";
 var TabContext = createContext11(null);
 function TabWidthContextProvider({
   children,
   onChangeWidths
 }) {
-  return /* @__PURE__ */ jsx294(
+  return /* @__PURE__ */ jsx295(
     TabContext.Provider,
     {
       value: {
@@ -12347,15 +13286,15 @@ function TabWidthContextProvider({
 }
 function useSetTabWidth(index, width) {
   const context = useContext14(TabContext);
-  useLayoutEffect2(() => {
+  useLayoutEffect3(() => {
     context == null ? void 0 : context.updateWidth(index, width);
     return () => context == null ? void 0 : context.removeTab(index);
   }, [index, width]);
 }
 
 // src/components/Tabs/Tab.tsx
-import { jsx as jsx295, jsxs as jsxs75 } from "react/jsx-runtime";
-var Tab = forwardRef100((props, ref) => {
+import { jsx as jsx296, jsxs as jsxs76 } from "react/jsx-runtime";
+var Tab = forwardRef101((props, ref) => {
   const {
     active = false,
     icon,
@@ -12372,10 +13311,10 @@ var Tab = forwardRef100((props, ref) => {
     ...rest
   } = props;
   useSetTabWidth(index, width);
-  const itemRef = useRef32(null);
+  const itemRef = useRef33(null);
   const combinedRef = useCombinedRef(ref, itemRef);
   const { tabContentDirection } = useTabsContext();
-  useEffect29(() => {
+  useEffect30(() => {
     var _a;
     if (focus) {
       (_a = itemRef.current) == null ? void 0 : _a.focus();
@@ -12394,7 +13333,7 @@ var Tab = forwardRef100((props, ref) => {
     handleSelect();
     onKeyDown && onKeyDown(e);
   };
-  return /* @__PURE__ */ jsxs75(
+  return /* @__PURE__ */ jsxs76(
     "button",
     {
       ...getBaseHTMLProps(
@@ -12417,8 +13356,8 @@ var Tab = forwardRef100((props, ref) => {
       onKeyDown: handleOnKeyDown,
       tabIndex: focus ? 0 : -1,
       children: [
-        icon && /* @__PURE__ */ jsx295(Icon, { icon, iconSize: "inherit" }),
-        /* @__PURE__ */ jsx295("span", { children })
+        icon && /* @__PURE__ */ jsx296(Icon, { icon, iconSize: "inherit" }),
+        /* @__PURE__ */ jsx296("span", { children })
       ]
     }
   );
@@ -12429,12 +13368,12 @@ Tab.displayName = "Tab";
 import {
   Children as Children6,
   cloneElement as cloneElement9,
-  forwardRef as forwardRef101,
+  forwardRef as forwardRef102,
   isValidElement as isValidElement10,
-  useState as useState28
+  useState as useState29
 } from "react";
-import { jsx as jsx296 } from "react/jsx-runtime";
-var TabList = forwardRef101(
+import { jsx as jsx297 } from "react/jsx-runtime";
+var TabList = forwardRef102(
   ({ children, id, style, onFocus, ...rest }, ref) => {
     const {
       activeTab,
@@ -12459,7 +13398,7 @@ var TabList = forwardRef101(
         onClick: () => handleTabChange(index)
       });
     });
-    const [widths, setWidths] = useState28([]);
+    const [widths, setWidths] = useState29([]);
     const handleOnFocus = (event) => {
       setHasTabFocus(true);
       onFocus && onFocus(event);
@@ -12477,7 +13416,7 @@ var TabList = forwardRef101(
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
       ["--dds-tab-widths"]: widths.join(" ")
     };
-    return /* @__PURE__ */ jsx296(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ jsx296(
+    return /* @__PURE__ */ jsx297(TabWidthContextProvider, { onChangeWidths: setWidths, children: /* @__PURE__ */ jsx297(
       "div",
       {
         ...rest,
@@ -12503,11 +13442,11 @@ var TabList = forwardRef101(
 TabList.displayName = "TabList";
 
 // src/components/Tabs/TabPanel.tsx
-import { forwardRef as forwardRef102 } from "react";
-import { jsx as jsx297 } from "react/jsx-runtime";
-var TabPanel = forwardRef102(
+import { forwardRef as forwardRef103 } from "react";
+import { jsx as jsx298 } from "react/jsx-runtime";
+var TabPanel = forwardRef103(
   ({ active = false, children, id, className, htmlProps, ...rest }, ref) => {
-    return /* @__PURE__ */ jsx297(
+    return /* @__PURE__ */ jsx298(
       "div",
       {
         ...getBaseHTMLProps(
@@ -12531,11 +13470,11 @@ TabPanel.displayName = "TabPanel";
 import {
   Children as Children7,
   cloneElement as cloneElement10,
-  forwardRef as forwardRef103,
+  forwardRef as forwardRef104,
   isValidElement as isValidElement11
 } from "react";
-import { jsx as jsx298 } from "react/jsx-runtime";
-var TabPanels = forwardRef103(
+import { jsx as jsx299 } from "react/jsx-runtime";
+var TabPanels = forwardRef104(
   ({ children, ...rest }, ref) => {
     const { activeTab, tabsId, tabPanelsRef } = useTabsContext();
     const combinedRef = useCombinedRef(ref, tabPanelsRef);
@@ -12548,13 +13487,13 @@ var TabPanels = forwardRef103(
         "aria-expanded": active
       });
     });
-    return /* @__PURE__ */ jsx298("div", { ref: combinedRef, ...rest, children: panelChildren });
+    return /* @__PURE__ */ jsx299("div", { ref: combinedRef, ...rest, children: panelChildren });
   }
 );
 TabPanels.displayName = "TabPanels";
 
 // src/components/Tag/Tag.tsx
-import { forwardRef as forwardRef104 } from "react";
+import { forwardRef as forwardRef105 } from "react";
 
 // src/components/Tag/Tag.module.css
 var Tag_default = {
@@ -12573,7 +13512,7 @@ var Tag_default = {
 };
 
 // src/components/Tag/Tag.tsx
-import { jsx as jsx299, jsxs as jsxs76 } from "react/jsx-runtime";
+import { jsx as jsx300, jsxs as jsxs77 } from "react/jsx-runtime";
 var icons3 = {
   info: InfoIcon,
   danger: ErrorIcon,
@@ -12581,7 +13520,7 @@ var icons3 = {
   success: CheckCircledIcon,
   default: void 0
 };
-var Tag = forwardRef104((props, ref) => {
+var Tag = forwardRef105((props, ref) => {
   const {
     text,
     purpose = "default",
@@ -12594,7 +13533,7 @@ var Tag = forwardRef104((props, ref) => {
     ...rest
   } = props;
   const icon = icons3[purpose];
-  return /* @__PURE__ */ jsxs76(
+  return /* @__PURE__ */ jsxs77(
     TextOverflowEllipsisWrapper,
     {
       ...getBaseHTMLProps(
@@ -12611,8 +13550,8 @@ var Tag = forwardRef104((props, ref) => {
       ),
       ref,
       children: [
-        withIcon && icon && /* @__PURE__ */ jsx299(Icon, { icon, iconSize: "small" }),
-        /* @__PURE__ */ jsx299(TextOverflowEllipsisInner, { children: children != null ? children : text })
+        withIcon && icon && /* @__PURE__ */ jsx300(Icon, { icon, iconSize: "small" }),
+        /* @__PURE__ */ jsx300(TextOverflowEllipsisInner, { children: children != null ? children : text })
       ]
     }
   );
@@ -12620,13 +13559,13 @@ var Tag = forwardRef104((props, ref) => {
 Tag.displayName = "Tag";
 
 // src/components/TextInput/TextInput.tsx
-import { ddsTokens as ddsTokens16 } from "@norges-domstoler/dds-design-tokens";
+import { ddsTokens as ddsTokens17 } from "@norges-domstoler/dds-design-tokens";
 import {
-  forwardRef as forwardRef105,
-  useId as useId25,
-  useLayoutEffect as useLayoutEffect3,
-  useRef as useRef33,
-  useState as useState29
+  forwardRef as forwardRef106,
+  useId as useId26,
+  useLayoutEffect as useLayoutEffect4,
+  useRef as useRef34,
+  useState as useState30
 } from "react";
 
 // src/components/TextInput/TextInput.module.css
@@ -12654,8 +13593,8 @@ var TextInput_default = {
 };
 
 // src/components/TextInput/TextInput.tsx
-import { jsx as jsx300, jsxs as jsxs77 } from "react/jsx-runtime";
-var TextInput = forwardRef105(
+import { jsx as jsx301, jsxs as jsxs78 } from "react/jsx-runtime";
+var TextInput = forwardRef106(
   ({
     label,
     disabled,
@@ -12681,14 +13620,14 @@ var TextInput = forwardRef105(
     suffix,
     ...rest
   }, ref) => {
-    const [text, setText] = useState29(
+    const [text, setText] = useState30(
       getDefaultText(value, defaultValue)
     );
-    const prefixRef = useRef33(null);
-    const suffixRef = useRef33(null);
-    const [prefixLength, setPrefixLength] = useState29(0);
-    const [suffixLength, setSuffixLength] = useState29(0);
-    useLayoutEffect3(() => {
+    const prefixRef = useRef34(null);
+    const suffixRef = useRef34(null);
+    const [prefixLength, setPrefixLength] = useState30(0);
+    const [suffixLength, setSuffixLength] = useState30(0);
+    useLayoutEffect4(() => {
       if (prefixRef.current) {
         setPrefixLength(prefixRef.current.offsetWidth);
       }
@@ -12702,7 +13641,7 @@ var TextInput = forwardRef105(
         onChange(event);
       }
     };
-    const generatedId = useId25();
+    const generatedId = useId26();
     const uniqueId = id != null ? id : `${generatedId}-textInput`;
     const hasErrorMessage = !!errorMessage;
     const hasTip = !!tip;
@@ -12740,25 +13679,28 @@ var TextInput = forwardRef105(
       ...rest
     };
     const showRequiredStyling = !!(required || ariaRequired);
-    const preffixPaddingInlineStart = readOnly && prefixLength ? prefixLength + "px" : prefixLength ? ddsTokens16.ddsSpacingX1NumberPx + prefixLength + "px" : void 0;
-    const suffixPaddingInlineEnd = readOnly && suffixLength ? suffixLength + "px" : suffixLength ? ddsTokens16.ddsSpacingX1NumberPx + suffixLength + "px" : void 0;
+    const preffixPaddingInlineStart = readOnly && prefixLength ? prefixLength + "px" : prefixLength ? ddsTokens17.ddsSpacingX1NumberPx + prefixLength + "px" : void 0;
+    const suffixPaddingInlineEnd = readOnly && suffixLength ? suffixLength + "px" : suffixLength ? ddsTokens17.ddsSpacingX1NumberPx + suffixLength + "px" : void 0;
     let extendedInput = null;
     if (hasIcon) {
-      extendedInput = /* @__PURE__ */ jsxs77(
+      extendedInput = /* @__PURE__ */ jsxs78(
         "div",
         {
           className: cn(TextInput_default["input-width"], Input_default["input-group"]),
           style: styleVariables,
           children: [
-            /* @__PURE__ */ jsx300(
+            /* @__PURE__ */ jsx301(
               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__ */ jsx300(
+            /* @__PURE__ */ jsx301(
               StatefulInput,
               {
                 ref,
@@ -12777,13 +13719,13 @@ var TextInput = forwardRef105(
         }
       );
     } else if (hasAffix) {
-      extendedInput = /* @__PURE__ */ jsxs77(
+      extendedInput = /* @__PURE__ */ jsxs78(
         "div",
         {
           className: cn(TextInput_default["affix-container"], TextInput_default["input-width"]),
           style: styleVariables,
           children: [
-            prefix3 && /* @__PURE__ */ jsx300(
+            prefix3 && /* @__PURE__ */ jsx301(
               "span",
               {
                 ref: prefixRef,
@@ -12796,7 +13738,7 @@ var TextInput = forwardRef105(
                 children: prefix3
               }
             ),
-            /* @__PURE__ */ jsx300(
+            /* @__PURE__ */ jsx301(
               StatefulInput,
               {
                 ref,
@@ -12811,7 +13753,7 @@ var TextInput = forwardRef105(
                 className: TextInput_default["input--extended"]
               }
             ),
-            suffix && /* @__PURE__ */ jsx300(
+            suffix && /* @__PURE__ */ jsx301(
               "span",
               {
                 ref: suffixRef,
@@ -12828,7 +13770,7 @@ var TextInput = forwardRef105(
         }
       );
     }
-    return /* @__PURE__ */ jsxs77(
+    return /* @__PURE__ */ jsxs78(
       "div",
       {
         className: cn(
@@ -12840,7 +13782,7 @@ var TextInput = forwardRef105(
         ),
         style,
         children: [
-          hasLabel && /* @__PURE__ */ jsx300(
+          hasLabel && /* @__PURE__ */ jsx301(
             Label,
             {
               htmlFor: uniqueId,
@@ -12850,7 +13792,7 @@ var TextInput = forwardRef105(
               children: label
             }
           ),
-          extendedInput ? extendedInput : /* @__PURE__ */ jsx300(
+          extendedInput ? extendedInput : /* @__PURE__ */ jsx301(
             StatefulInput,
             {
               ref,
@@ -12862,7 +13804,7 @@ var TextInput = forwardRef105(
               className: TextInput_default["input-width"]
             }
           ),
-          hasMessage && /* @__PURE__ */ jsxs77("div", { className: TextInput_default["message-container"], children: [
+          hasMessage && /* @__PURE__ */ jsxs78("div", { className: TextInput_default["message-container"], children: [
             renderInputMessage(tip, tipId, errorMessage, errorMessageId),
             renderCharCounter(
               characterCounterId,
@@ -12879,7 +13821,7 @@ var TextInput = forwardRef105(
 TextInput.displayName = "TextInput";
 
 // src/components/ToggleBar/ToggleBar.tsx
-import { useId as useId26, useState as useState30 } from "react";
+import { useId as useId27, useState as useState31 } from "react";
 
 // src/components/ToggleBar/ToggleBar.context.tsx
 import { createContext as createContext12, useContext as useContext15 } from "react";
@@ -12905,7 +13847,7 @@ var ToggleBar_default = {
 };
 
 // src/components/ToggleBar/ToggleBar.tsx
-import { jsx as jsx301, jsxs as jsxs78 } from "react/jsx-runtime";
+import { jsx as jsx302, jsxs as jsxs79 } from "react/jsx-runtime";
 var ToggleBar = (props) => {
   const {
     children,
@@ -12920,15 +13862,15 @@ var ToggleBar = (props) => {
     id,
     ...rest
   } = props;
-  const generatedId = useId26();
+  const generatedId = useId27();
   const uniqueId = id != null ? id : `${generatedId}-ToggleBar`;
-  const [groupValue, setGroupValue] = useState30(value);
+  const [groupValue, setGroupValue] = useState31(value);
   const handleChange = combineHandlers(
     (e) => setGroupValue(e.target.value),
     (e) => onChange && onChange(e, e.target.value)
   );
   const labelId = label && `${uniqueId}-label`;
-  return /* @__PURE__ */ jsx301(
+  return /* @__PURE__ */ jsx302(
     ToggleBarContext.Provider,
     {
       value: {
@@ -12937,7 +13879,7 @@ var ToggleBar = (props) => {
         name,
         value: groupValue
       },
-      children: /* @__PURE__ */ jsxs78(
+      children: /* @__PURE__ */ jsxs79(
         "div",
         {
           ...getBaseHTMLProps(
@@ -12950,8 +13892,8 @@ var ToggleBar = (props) => {
           role: "radiogroup",
           "aria-labelledby": labelId != null ? labelId : htmlProps == null ? void 0 : htmlProps["aria-labelledby"],
           children: [
-            label && /* @__PURE__ */ jsx301(Label, { id: labelId, children: label }),
-            /* @__PURE__ */ jsx301("div", { className: ToggleBar_default.bar, children })
+            label && /* @__PURE__ */ jsx302(Label, { id: labelId, children: label }),
+            /* @__PURE__ */ jsx302("div", { className: ToggleBar_default.bar, children })
           ]
         }
       )
@@ -12962,10 +13904,10 @@ ToggleBar.displayName = "ToggleBar";
 
 // src/components/ToggleBar/ToggleRadio.tsx
 import {
-  forwardRef as forwardRef106,
-  useId as useId27
+  forwardRef as forwardRef107,
+  useId as useId28
 } from "react";
-import { jsx as jsx302, jsxs as jsxs79 } from "react/jsx-runtime";
+import { jsx as jsx303, jsxs as jsxs80 } from "react/jsx-runtime";
 var typographyTypes4 = {
   large: "bodySans04",
   medium: "bodySans02",
@@ -12982,7 +13924,7 @@ var calculateChecked = (value, group, checked) => {
   }
   return !!value;
 };
-var ToggleRadio = forwardRef106(
+var ToggleRadio = forwardRef107(
   (props, ref) => {
     const {
       value,
@@ -12998,7 +13940,7 @@ var ToggleRadio = forwardRef106(
       id,
       ...rest
     } = props;
-    const generatedId = useId27();
+    const generatedId = useId28();
     const uniqueId = id != null ? id : `${generatedId}-ToggleRadio`;
     const group = useToggleBarContext();
     const handleChange = (event) => {
@@ -13006,8 +13948,8 @@ var ToggleRadio = forwardRef106(
       (group == null ? void 0 : group.onChange) && group.onChange(event);
     };
     const contentTypeCn = label ? "with-text" : "just-icon";
-    return /* @__PURE__ */ jsxs79("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
-      /* @__PURE__ */ jsx302(
+    return /* @__PURE__ */ jsxs80("label", { htmlFor: uniqueId, className: ToggleBar_default.label, children: [
+      /* @__PURE__ */ jsx303(
         "input",
         {
           ...getBaseHTMLProps(
@@ -13030,7 +13972,7 @@ var ToggleRadio = forwardRef106(
           "aria-labelledby": ariaLabelledBy
         }
       ),
-      /* @__PURE__ */ jsxs79(
+      /* @__PURE__ */ jsxs80(
         Typography,
         {
           as: "span",
@@ -13041,8 +13983,8 @@ var ToggleRadio = forwardRef106(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            icon && /* @__PURE__ */ jsx302(Icon, { icon, iconSize: "inherit" }),
-            label && /* @__PURE__ */ jsx302("span", { children: label })
+            icon && /* @__PURE__ */ jsx303(Icon, { icon, iconSize: "inherit" }),
+            label && /* @__PURE__ */ jsx303("span", { children: label })
           ]
         }
       )
@@ -13052,7 +13994,7 @@ var ToggleRadio = forwardRef106(
 ToggleRadio.displayName = "ToggleRadio";
 
 // src/components/ToggleButton/ToggleButton.tsx
-import { forwardRef as forwardRef107, useId as useId28 } from "react";
+import { forwardRef as forwardRef108, useId as useId29 } from "react";
 
 // src/components/ToggleButton/ToggleButton.module.css
 var ToggleButton_default = {
@@ -13066,14 +14008,14 @@ var ToggleButton_default = {
 };
 
 // src/components/ToggleButton/ToggleButton.tsx
-import { jsx as jsx303, jsxs as jsxs80 } from "react/jsx-runtime";
-var ToggleButton = forwardRef107(
+import { jsx as jsx304, jsxs as jsxs81 } from "react/jsx-runtime";
+var ToggleButton = forwardRef108(
   ({ id, label, icon, className, htmlProps, ...rest }, ref) => {
-    const generatedId = useId28();
+    const generatedId = useId29();
     const uniqueId = id != null ? id : `${generatedId}-toggleButton`;
     const hasIcon = !!icon;
-    return /* @__PURE__ */ jsxs80("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
-      /* @__PURE__ */ jsx303(
+    return /* @__PURE__ */ jsxs81("label", { htmlFor: uniqueId, className: ToggleButton_default.container, children: [
+      /* @__PURE__ */ jsx304(
         "input",
         {
           ...getBaseHTMLProps(
@@ -13090,7 +14032,7 @@ var ToggleButton = forwardRef107(
           type: "checkbox"
         }
       ),
-      /* @__PURE__ */ jsxs80(
+      /* @__PURE__ */ jsxs81(
         "span",
         {
           className: cn(
@@ -13100,7 +14042,7 @@ var ToggleButton = forwardRef107(
             focus_default["focus-styled-sibling"]
           ),
           children: [
-            hasIcon && /* @__PURE__ */ jsx303(Icon, { icon, iconSize: "inherit" }),
+            hasIcon && /* @__PURE__ */ jsx304(Icon, { icon, iconSize: "inherit" }),
             " ",
             label
           ]
@@ -13112,8 +14054,8 @@ var ToggleButton = forwardRef107(
 ToggleButton.displayName = "ToggleButton";
 
 // src/components/ToggleButton/ToggleButtonGroup.tsx
-import { useId as useId29 } from "react";
-import { jsx as jsx304, jsxs as jsxs81 } from "react/jsx-runtime";
+import { useId as useId30 } from "react";
+import { jsx as jsx305, jsxs as jsxs82 } from "react/jsx-runtime";
 var ToggleButtonGroup = (props) => {
   const {
     children,
@@ -13125,9 +14067,9 @@ var ToggleButtonGroup = (props) => {
     htmlProps,
     ...rest
   } = props;
-  const generatedId = useId29();
+  const generatedId = useId30();
   const uniqueLabelId = labelId != null ? labelId : `${generatedId}-ToggleButtonGroupLabel`;
-  return /* @__PURE__ */ jsxs81(
+  return /* @__PURE__ */ jsxs82(
     "div",
     {
       ...getBaseHTMLProps(
@@ -13139,7 +14081,7 @@ var ToggleButtonGroup = (props) => {
       role: "group",
       "aria-labelledby": label ? uniqueLabelId : void 0,
       children: [
-        !!label && /* @__PURE__ */ jsx304(
+        !!label && /* @__PURE__ */ jsx305(
           Typography,
           {
             as: "span",
@@ -13148,7 +14090,7 @@ var ToggleButtonGroup = (props) => {
             children: label
           }
         ),
-        /* @__PURE__ */ jsx304("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
+        /* @__PURE__ */ jsx305("div", { className: cn(ToggleButton_default.group, ToggleButton_default[`group--${direction}`]), children })
       ]
     }
   );
@@ -13358,6 +14300,7 @@ export {
   PersonAddIcon,
   PersonIcon,
   PersonShieldedIcon,
+  PhoneInput,
   PinIcon,
   PlusCircledIcon,
   PlusIcon,
@@ -13446,6 +14389,7 @@ export {
   ZoomOutIcon,
   calendarDateToNativeDate,
   cn,
+  countryOptions,
   createSelectOptions,
   dangerInputfield,
   dateValueToNativeDate,