@digitalservicebund/ris-ui 3.17.1 → 3.18.0

package/dist/primevue/index.js

@@ -1,20 +1,20 @@
 import { t as e } from "../tags-Dde6Li6m.js";
 const S = {
   root: ({ props: t, instance: l }) => {
-    const r = e`relative inline-flex max-w-full cursor-pointer items-center justify-center gap-8 text-center focus:outline-4 focus:outline-offset-4 focus:outline-blue-800 focus:not-focus-visible:outline-none focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800 active:outline-none disabled:cursor-not-allowed disabled:outline-hidden`, o = e`rounded-full`, s = t.severity ?? "primary", a = e`bg-blue-800 text-white hover:bg-blue-700 active:bg-blue-500 active:text-blue-800 disabled:bg-gray-400 disabled:text-gray-600`, n = e`border-2 border-blue-800 bg-white text-blue-800 hover:bg-gray-200 focus:bg-gray-200 active:border-white active:bg-white disabled:border-blue-500 disabled:text-blue-500 disabled:hover:bg-white`, i = e`border-2 border-red-800 bg-white text-red-800 hover:bg-gray-200 focus:bg-gray-200 focus:outline-red-800 active:border-white active:bg-white disabled:border-red-500 disabled:text-red-500 disabled:hover:bg-white`, u = e`border border-blue-500 bg-white font-normal text-blue-800 hover:bg-gray-200 focus:bg-gray-200 active:border-white active:bg-white disabled:border-blue-500 disabled:text-blue-500 disabled:hover:bg-white`, h = e`border-2 border-transparent bg-transparent text-blue-800 underline hover:border-gray-500 hover:bg-white focus:border-gray-500 active:border-white active:bg-white disabled:bg-transparent disabled:text-gray-500`, b = t.size ?? "normal";
-    let c = e`ris-body2-bold h-40 py-4`, d = e`ris-body2-bold h-48 py-4`, f = e`ris-body1-bold h-64 py-4`;
-    return l.hasIcon && !t.label ? (c = e`${c} w-40 px-4`, d = e`${d} w-48 px-4`, f = e`${f} w-64 px-4`) : (c = e`${c} px-12`, d = e`${d} px-16`, f = e`${f} px-24`), {
+    const r = e`relative inline-flex max-w-full cursor-pointer items-center justify-center gap-8 text-center focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800 focus-visible:not-focus-visible:outline-none active:outline-none disabled:cursor-not-allowed disabled:outline-hidden`, o = e`rounded-full`, s = t.severity ?? "primary", i = e`bg-blue-800 text-white hover:bg-blue-700 active:bg-blue-500 active:text-blue-800 disabled:bg-gray-400 disabled:text-gray-600`, a = e`border-2 border-blue-800 bg-white text-blue-800 hover:bg-gray-200 focus-visible:bg-gray-200 active:border-white active:bg-white disabled:border-blue-500 disabled:text-blue-500 disabled:hover:bg-white`, n = e`border-2 border-red-800 bg-white text-red-800 hover:bg-gray-200 focus-visible:bg-gray-200 focus-visible:outline-red-800 active:border-white active:bg-white disabled:border-red-500 disabled:text-red-500 disabled:hover:bg-white`, b = e`border border-blue-500 bg-white font-normal text-blue-800 hover:bg-gray-200 focus-visible:bg-gray-200 active:border-white active:bg-white disabled:border-blue-500 disabled:text-blue-500 disabled:hover:bg-white`, g = e`border-2 border-transparent bg-transparent text-blue-800 underline hover:border-gray-500 hover:bg-white focus-visible:border-gray-500 active:border-white active:bg-white disabled:bg-transparent disabled:text-gray-500`, c = t.size ?? "normal";
+    let u = e`ris-body2-bold h-40 py-4`, d = e`ris-body2-bold h-48 py-4`, f = e`ris-body1-bold h-64 py-4`;
+    return l.hasIcon && !t.label ? (u = e`${u} w-40 px-4`, d = e`${d} w-48 px-4`, f = e`${f} w-64 px-4`) : (u = e`${u} px-12`, d = e`${d} px-16`, f = e`${f} px-24`), {
       class: {
         [r]: !0,
         [o]: t.rounded,
-        [c]: b === "small",
-        [d]: b === "normal",
-        [f]: b === "large",
-        [a]: !t.text && s === "primary",
-        [n]: !t.text && s === "secondary",
-        [i]: !t.text && s === "danger",
-        [u]: !t.text && s === "info",
-        [h]: t.text && s === "primary"
+        [u]: c === "small",
+        [d]: c === "normal",
+        [f]: c === "large",
+        [i]: !t.text && s === "primary",
+        [a]: !t.text && s === "secondary",
+        [n]: !t.text && s === "danger",
+        [b]: !t.text && s === "info",
+        [g]: t.text && s === "primary"
       }
     };
   },
@@ -38,7 +38,7 @@ const S = {
       }
     };
   }
-}, g = {
+}, h = {
   root: ({ props: t }) => ({
     class: {
       [e`[&+label]:ris-label1-regular relative inline-block h-24 min-h-24 w-24 min-w-24 [&+label]:ml-8`]: !0,
@@ -46,10 +46,10 @@ const S = {
     }
   }),
   input: {
-    class: e`peer h-full w-full cursor-pointer appearance-none border-2 border-blue-800 bg-white hover:outline hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus:outline focus:outline-4 focus:-outline-offset-4 focus:outline-blue-800 active:outline-hidden disabled:cursor-not-allowed disabled:border-gray-600 disabled:outline-hidden aria-[invalid]:border-red-800 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-none aria-[invalid]:disabled:outline-none`
+    class: e`peer h-full w-full cursor-pointer appearance-none border-2 border-blue-800 bg-white checked:bg-blue-800 hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 checked:hover:bg-blue-700 checked:hover:outline-blue-700 focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800 active:outline-hidden disabled:cursor-not-allowed disabled:border-gray-600 disabled:outline-hidden disabled:checked:bg-gray-600 aria-[invalid]:border-red-800 aria-[invalid]:outline-red-800 aria-[invalid]:checked:bg-red-800 aria-[invalid]:checked:outline-red-700 aria-[invalid]:checked:hover:bg-red-700 aria-[invalid]:active:outline-none aria-[invalid]:disabled:outline-none`
   },
   box: {
-    class: e`pointer-events-none absolute inset-0 flex items-center justify-center text-blue-800 peer-disabled:text-gray-600 peer-aria-[invalid]:text-red-800`
+    class: e`pointer-events-none absolute inset-0 flex items-center justify-center text-blue-800 peer-checked:text-white`
   },
   icon: {
     class: e`h-12 w-12`
@@ -78,7 +78,7 @@ const S = {
   },
   pcCloseButton: {
     root: {
-      class: e`flex h-24 w-24 items-center justify-center p-4 text-blue-800 outline-hidden hover:outline hover:outline-2 hover:outline-gray-500 focus:outline focus:outline-2 focus:outline-gray-500 active:outline-hidden`
+      class: e`flex h-24 w-24 items-center justify-center p-4 text-blue-800 outline-hidden hover:outline-2 hover:outline-gray-500 focus-visible:outline-4 focus-visible:outline-blue-800 active:outline-none`
     }
   },
   content: {
@@ -103,20 +103,20 @@ const S = {
   input: {
     class: e`hidden`
   }
-}, A = {
+}, L = {
   root: {
     class: e`flex`
   }
-}, y = e`[&+small]:ris-label3-regular border-2 border-blue-800 bg-white placeholder:text-gray-800 read-only:cursor-not-allowed read-only:border-blue-300 read-only:bg-blue-300 hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus:outline-4 focus:-outline-offset-4 focus:outline-blue-800 disabled:border-blue-500 disabled:bg-white disabled:text-blue-500 disabled:outline-hidden aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden [&+small]:mt-4 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, k = e`ris-body2-regular h-48 px-16 py-4`, L = e`ris-body1-regular h-64 px-24 py-4`, B = {
+}, y = e`[&+small]:ris-label3-regular border-2 border-blue-800 bg-white placeholder:text-gray-800 read-only:cursor-not-allowed read-only:border-blue-300 read-only:bg-blue-300 hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus-visible:outline-4 focus-visible:-outline-offset-4 focus-visible:outline-blue-800 disabled:border-blue-500 disabled:bg-white disabled:text-blue-500 disabled:outline-hidden aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden [&+small]:mt-4 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, k = e`ris-body2-regular h-48 px-16 py-4`, A = e`ris-body1-regular h-64 px-24 py-4`, B = {
   root: ({ props: t }) => {
-    const l = e`[&[type=password]]:w-full [&[type=password]:not(:placeholder-shown)]:text-[28px] [&[type=password]:not(:placeholder-shown)]:tracking-[4px]`, r = e`w-full`;
+    const l = e`[[type=password]]:w-full [&[type=password]:not(:placeholder-shown)]:text-[28px] [&[type=password]:not(:placeholder-shown)]:tracking-[4px]`, r = e`w-full`;
     return {
       class: {
         [y]: !0,
         [r]: !!t.fluid,
         [l]: !0,
         [k]: !t.size || t.size === "small",
-        [L]: t.size === "large"
+        [A]: t.size === "large"
       },
       "data-size": t.size ?? "small"
     };
@@ -143,25 +143,25 @@ const S = {
   itemLink: {
     class: e`flex items-center gap-8`
   }
-}, F = {
+}, I = {
   root: ({ props: t, instance: l }) => {
-    const r = e`ris-body1-regular border-l-4 px-20 py-14`, o = t.severity ?? "info", s = e`border-l-green-800 bg-green-200`, a = e`border-l-blue-800 bg-blue-200`, n = e`border-l-yellow-800 bg-yellow-200`, i = e`border-l-red-800 bg-red-200`, u = !!l.$slots.icon, b = {
+    const r = e`ris-body1-regular border-l-4 px-20 py-14`, o = t.severity ?? "info", s = e`border-l-green-800 bg-green-200`, i = e`border-l-blue-800 bg-blue-200`, a = e`border-l-yellow-800 bg-yellow-200`, n = e`border-l-red-800 bg-red-200`, b = !!l.$slots.icon, c = {
       success: "var(--ris-icon-success)",
       info: "var(--ris-icon-info)",
       warn: "var(--ris-icon-warn)",
       error: "var(--ris-icon-error)"
-    }[o], c = e`bg-[length:20px] bg-[16px_18px] bg-no-repeat pl-44`;
+    }[o], u = e`bg-size-[20px] bg-position-[16px_18px] bg-no-repeat pl-44`;
     return {
       class: {
         [r]: !0,
         [s]: o === "success",
-        [a]: o === "info",
-        [n]: o === "warn",
-        [i]: o === "error",
-        [c]: !u
+        [i]: o === "info",
+        [a]: o === "warn",
+        [n]: o === "error",
+        [u]: !b
       },
       style: {
-        backgroundImage: u ? void 0 : b
+        backgroundImage: b ? void 0 : c
       }
     };
   },
@@ -172,18 +172,18 @@ const S = {
     class: e`flex-1`
   },
   closeButton: ({ props: t }) => {
-    const l = e`mt-4 inline-flex h-20 w-20 flex-none items-center justify-center rounded-sm p-2 leading-none`, r = t.severity ?? "info", o = e`text-green-800 hover:bg-green-400 active:bg-green-500`, s = e`text-blue-800 hover:bg-blue-400 active:bg-blue-500`, a = e`text-black hover:bg-yellow-400 active:bg-yellow-500`, n = e`text-red-800 hover:bg-red-400 active:bg-red-500`;
+    const l = e`mt-4 inline-flex h-20 w-20 flex-none items-center justify-center p-2 leading-none outline-offset-4 outline-blue-800 focus-visible:outline-4`, r = t.severity ?? "info", o = e`text-green-800 hover:bg-green-400 active:bg-green-500`, s = e`text-blue-800 hover:bg-blue-400 active:bg-blue-500`, i = e`text-black hover:bg-yellow-400 active:bg-yellow-500`, a = e`text-red-800 hover:bg-red-400 active:bg-red-500`;
     return {
       class: {
         [l]: !0,
         [o]: r === "success",
         [s]: r === "info",
-        [a]: r === "warn",
-        [n]: r === "error"
+        [i]: r === "warn",
+        [a]: r === "error"
       }
     };
   }
-}, I = {
+}, F = {
   // All styling moved to inputText.ts
 }, T = {
   root: {
@@ -197,7 +197,7 @@ const S = {
     class: e`[&+label]:ris-label1-regular relative inline-block h-32 w-32 [&+label]:ml-8`
   },
   input: {
-    class: e`peer h-full w-full cursor-pointer appearance-none rounded-full border-2 border-blue-800 bg-white hover:outline hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus:outline focus:outline-4 focus:-outline-offset-4 focus:outline-blue-800 active:outline-hidden disabled:cursor-not-allowed disabled:border-gray-600 aria-[invalid]:border-red-800 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`
+    class: e`peer h-full w-full cursor-pointer appearance-none rounded-full border-2 border-blue-800 bg-white hover:outline hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus-visible:outline focus-visible:outline-4 focus-visible:-outline-offset-4 focus-visible:outline-blue-800 active:outline-hidden disabled:cursor-not-allowed disabled:border-gray-600 aria-[invalid]:border-red-800 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`
   },
   box: {
     class: e`pointer-events-none absolute inset-0 flex items-center justify-center text-transparent peer-checked:text-blue-800 peer-disabled:text-gray-600 peer-aria-[invalid]:text-red-800`
@@ -205,18 +205,18 @@ const S = {
   icon: {
     class: e`h-16 w-16 rounded-full bg-current`
   }
-}, v = e`w-full`, j = {
+}, v = e`w-full`, V = {
   root: ({ props: t, state: l }) => {
-    const r = e`ris-body2-regular flex min-h-48 border-2 bg-white py-4 pr-4 pl-16 placeholder:text-gray-800`, o = e`cursor-pointer border-blue-800`, s = e`has-[:focus]:outline-4 has-[:focus]:-outline-offset-4 has-[:focus]:outline-blue-800`, a = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, n = e`aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden`, i = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`;
+    const r = e`ris-body2-regular flex min-h-48 border-2 bg-white py-4 pr-4 pl-16 placeholder:text-gray-800`, o = e`cursor-pointer border-blue-800`, s = e`outline-4 -outline-offset-4 outline-blue-800`, i = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, a = e`aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden`, n = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`;
     return {
       class: {
         [r]: !0,
         [o]: !t.disabled,
         [s]: l.focused && !t.disabled,
-        [a]: !t.disabled,
+        [i]: !t.disabled,
         [v]: !!t.fluid,
-        [n]: t.invalid,
-        [i]: t.disabled
+        [a]: t.invalid,
+        [n]: t.disabled
       },
       "aria-invalid": t.invalid ? "true" : null
     };
@@ -238,9 +238,11 @@ const S = {
   input: {
     class: e`w-full focus-visible:outline-hidden`
   },
-  dropdown: { class: e`absolute inset-y-0 right-16` },
+  dropdown: {
+    class: e`absolute inset-y-0 right-16`
+  },
   option: {
-    class: e`cursor-pointer border-l-4 border-transparent hover:bg-blue-100 data-[p-focused=true]:border-blue-800 data-[p-focused=true]:bg-blue-200`
+    class: e`cursor-pointer border-l-4 border-transparent hover:border-blue-600 hover:bg-blue-200 data-[p-focused=true]:border-blue-600 data-[p-focused=true]:bg-blue-200`
   },
   optionGroup: {
     class: e`hover:bg-blue-100 data-[p-focused=true]:bg-blue-200`
@@ -248,9 +250,9 @@ const S = {
   overlay: {
     class: e`mt-12 w-full overflow-auto bg-white px-8 py-12 shadow-md`
   }
-}, R = {
+}, j = {
   root: ({ props: t }) => {
-    const l = e`ris-body1-regular [&+small]:ris-label3-regular min-h-56 border-2 border-blue-800 bg-white px-14 pt-8 pb-12 placeholder:text-gray-900 read-only:cursor-not-allowed read-only:border-blue-300 read-only:bg-blue-300 hover:outline hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus:outline focus:outline-4 focus:-outline-offset-4 focus:outline-blue-800 disabled:border-blue-500 disabled:bg-white disabled:text-blue-500 disabled:outline-hidden aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, r = e`w-full`;
+    const l = e`ris-body1-regular [&+small]:ris-label3-regular min-h-56 border-2 border-blue-800 bg-white px-14 pt-8 pb-12 placeholder:text-gray-900 read-only:cursor-not-allowed read-only:border-blue-300 read-only:bg-blue-300 hover:outline hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800 focus-visible:outline focus-visible:outline-4 focus-visible:-outline-offset-4 focus-visible:outline-blue-800 disabled:border-blue-500 disabled:bg-white disabled:text-blue-500 disabled:outline-hidden aria-[invalid]:border-red-800 aria-[invalid]:bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:disabled:outline-hidden [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, r = e`w-full`;
     return {
       class: {
         [l]: !0,
@@ -258,19 +260,19 @@ const S = {
       }
     };
   }
-}, V = {
+}, R = {
   root: {
     class: e`max-w-lg`
   },
   message: ({ props: t }) => {
-    const l = e`mb-8 flex w-full flex-row items-center gap-8 border-l-4 p-16`, r = t.message?.severity, o = e`border-l-green-900 bg-green-200`, s = e`border-l-red-900 bg-red-200`, a = e`border-l-yellow-900 bg-yellow-200`, n = e`border-l-blue-900 bg-blue-200`;
+    const l = e`mb-8 flex w-full flex-row items-center gap-8 border-l-4 p-16`, r = t.message?.severity, o = e`border-l-green-900 bg-green-200`, s = e`border-l-red-900 bg-red-200`, i = e`border-l-yellow-900 bg-yellow-200`, a = e`border-l-blue-900 bg-blue-200`;
     return {
       class: {
         [l]: !0,
         [o]: r === "success",
         [s]: r === "error",
-        [a]: r === "warn",
-        [n]: r === "info"
+        [i]: r === "warn",
+        [a]: r === "info"
       }
     };
   },
@@ -278,19 +280,19 @@ const S = {
     class: e`flex w-full flex-row items-start justify-between gap-10`
   },
   messageIcon: ({ props: t }) => {
-    const l = e`mt-2 h-20 w-20 flex-none shrink-0`, r = t.message?.severity ?? "info", o = e`text-green-800`, s = e`text-red-800`, a = e`text-black`, n = e`text-blue-800`;
+    const l = e`mt-2 h-20 w-20 flex-none shrink-0`, r = t.message?.severity ?? "info", o = e`text-green-800`, s = e`text-red-800`, i = e`text-black`, a = e`text-blue-800`;
     return {
       class: {
         [l]: !0,
         [o]: r === "success",
         [s]: r === "error",
-        [a]: r === "warn",
-        [n]: r === "info"
+        [i]: r === "warn",
+        [a]: r === "info"
       }
     };
   },
   messageText: {
-    class: e`flex-grow text-black`
+    class: e`grow text-black`
   },
   summary: {
     class: e`ris-label2-bold`
@@ -299,14 +301,14 @@ const S = {
     class: e`ris-label2-regular`
   },
   closeButton: ({ props: t }) => {
-    const l = e`rounded-sm p-2`, r = t.message?.severity ?? "info", o = e`hover:bg-green-400`, s = e`hover:bg-red-400`, a = e`hover:bg-yellow-400`, n = e`hover:bg-blue-400`;
+    const l = e`p-2 outline-offset-4 outline-blue-800 focus-visible:outline-4`, r = t.message?.severity ?? "info", o = e`hover:bg-green-400`, s = e`hover:bg-red-400`, i = e`hover:bg-yellow-400`, a = e`hover:bg-blue-400`;
     return {
       class: {
         [l]: !0,
         [o]: r === "success",
         [s]: r === "error",
-        [a]: r === "warn",
-        [n]: r === "info"
+        [i]: r === "warn",
+        [a]: r === "info"
       }
     };
   },
@@ -315,53 +317,68 @@ const S = {
   }
 }, _ = {
   root: ({ props: t, state: l }) => {
-    const r = e`ris-body2-regular [&+small]:ris-label3-regular relative inline-flex h-48 items-center justify-between border-2 bg-white py-4 pr-12 pl-16 [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, o = e`cursor-pointer border-blue-800`, s = e`has-[:focus]:outline-4 has-[:focus]:-outline-offset-4 has-[:focus]:outline-blue-800`, a = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, n = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`, i = e`border-red-800 bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`, u = e`w-full`;
+    const r = e`group ris-body2-regular [&+small]:ris-label3-regular relative inline-flex h-48 items-center justify-between border-2 bg-white py-4 pr-6 pl-16 [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, o = e`cursor-pointer border-blue-800`, s = e`outline-4 -outline-offset-4 outline-blue-800`, i = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, a = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`, n = e`border-red-800 bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`, b = e`w-full`;
     return {
       class: {
         [r]: !0,
         [o]: !t.disabled,
-        [s]: l.focused && !t.disabled,
-        [a]: !t.disabled,
-        [u]: !!t.fluid,
-        [n]: t.disabled,
-        [i]: t.invalid
+        [s]: (l.focused || l.overlayVisible) && !t.disabled,
+        [i]: !t.disabled,
+        [b]: !!t.fluid,
+        [a]: t.disabled,
+        [n]: t.invalid
       },
       "aria-invalid": t.invalid ? "true" : null
     };
   },
-  dropdown: {
-    class: e`pl-12`
+  dropdown: ({ state: t, props: l }) => {
+    const r = e`ml-8 p-10`, o = e`text-blue-800 group-hover:bg-blue-200`, s = e`bg-blue-800 text-white`, i = e`text-blue-500`;
+    return {
+      class: {
+        [r]: !0,
+        [o]: !(t.focused || t.overlayVisible || l.disabled),
+        [s]: (t.focused || t.overlayVisible) && !l.disabled,
+        [i]: l.disabled
+      }
+    };
   },
   listContainer: {
     class: e`overflow-auto shadow-md`
   },
   label: {
-    class: e`line-clamp-1 flex-grow outline-none`
+    class: e`line-clamp-1 grow outline-none`
   },
   overlay: {
     class: e`bg-white`
   },
-  option: ({ context: t }) => {
-    const l = e`ris-body2-regular relative h-full min-h-48 w-full cursor-pointer px-24 py-16 after:absolute after:right-8 after:-bottom-1 after:left-8 after:border-b after:border-gray-300 after:content-[''] last:after:border-b-0 hover:bg-gray-100`, r = e`bg-gray-100`;
+  option: ({ context: t, props: l }) => {
+    const r = e`ris-body2-regular relative h-full min-h-48 w-full cursor-pointer px-16 py-12 after:absolute after:right-8 after:-bottom-1 after:left-8 after:border-b after:border-gray-300 after:content-[''] last:after:border-b-0 hover:bg-gray-100`, o = e`bg-gray-100`, s = e`flex items-center gap-16`;
     return {
       class: {
-        [l]: !0,
-        [r]: t.focused
+        [r]: !0,
+        [o]: t.focused,
+        [s]: l.checkmark
       }
     };
+  },
+  optionCheckIcon: {
+    class: e`order-1 text-blue-800`
+  },
+  optionBlankIcon: {
+    class: e`order-1`
   }
 }, P = {
   root: ({ props: t, state: l }) => {
-    const r = e`ris-body2-regular [&+small]:ris-label3-regular relative inline-flex min-h-48 items-center justify-start border-2 bg-white py-2 pr-12 pl-12 [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, o = e`cursor-pointer border-blue-800`, s = e`has-[:focus]:outline-4 has-[:focus]:-outline-offset-4 has-[:focus]:outline-blue-800`, a = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, n = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`, i = e`border-red-800 bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`, u = e`w-full`;
+    const r = e`ris-body2-regular [&+small]:ris-label3-regular relative inline-flex min-h-48 items-center justify-start border-2 bg-white py-2 pr-12 pl-12 [&+small]:mt-2 [&+small]:flex [&+small]:items-center [&+small]:gap-4 [&+small]:text-gray-900 [&[aria-invalid="true"]+small]:text-red-900`, o = e`cursor-pointer border-blue-800`, s = e`has-focus-visible:outline-4 has-focus-visible:-outline-offset-4 has-focus-visible:outline-blue-800`, i = e`hover:outline-4 hover:-outline-offset-4 hover:outline-blue-800`, a = e`cursor-not-allowed border-blue-500 text-blue-500 disabled:outline-hidden`, n = e`border-red-800 bg-red-200 aria-[invalid]:outline-red-800 aria-[invalid]:active:outline-hidden aria-[invalid]:disabled:outline-hidden`, b = e`w-full`;
     return {
       class: {
         [r]: !0,
         [o]: !t.disabled,
         [s]: l.focused && !t.disabled,
-        [a]: !t.disabled,
-        [u]: !!t.fluid,
-        [n]: t.disabled,
-        [i]: t.invalid
+        [i]: !t.disabled,
+        [b]: !!t.fluid,
+        [a]: t.disabled,
+        [n]: t.invalid
       },
       "aria-invalid": t.invalid ? "true" : null
     };
@@ -417,12 +434,12 @@ const S = {
     class: e`flex-no-wrap ris-label1-regular my-2 flex items-center break-all`
   },
   itemLink: {
-    class: e`inline-flex cursor-pointer items-center text-blue-800 hover:underline focus:outline focus:outline-4 focus:outline-offset-4 focus:outline-blue-800`
+    class: e`inline-flex cursor-pointer items-center text-blue-800 underline-offset-[3px] hover:underline focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800`
   },
   separator: {
     class: e`mx-6 flex items-center text-gray-600`
   }
-}, p = e`cursor-pointer`, m = e`ris-label1-bold border-l-blue-800 bg-blue-200 text-black hover:bg-blue-300 focus-visible:bg-blue-300`, w = e`ris-label1-regular hover:bg-blue-200 focus-visible:bg-blue-200`, x = e`focus-visible:outline-none`, H = {
+}, p = e`cursor-pointer`, m = e`ris-label1-bold border-l-blue-800 bg-blue-200 text-blue-900 hover:bg-blue-300`, w = e`ris-label1-regular hover:border-l-blue-600 hover:bg-blue-200`, x = e`-outline-offset-4 outline-blue-800 focus-visible:outline-4`, H = {
   root: {
     class: e`text-blue-800`
   },
@@ -445,13 +462,11 @@ const S = {
     class: e`focus-visible:outline-none`
   },
   itemContent: ({ context: t }) => {
-    const l = e`group flex h-48 items-center border-l-4 border-transparent py-8 pr-20 pl-10`, r = e`bg-blue-300`, o = e`bg-blue-200`;
+    const l = e`group flex h-48 items-center border-l-4 border-transparent py-8 pr-20 pl-10`, r = e`${x} not-[:hover]:outline-4`;
     return {
       class: {
         [l]: !0,
-        [r]: t.active && t.focused,
-        [o]: !t.active && t.focused,
-        [x]: !0,
+        [r]: t.focused,
         [p]: !0,
         [m]: t.active,
         [w]: !t.active
@@ -463,14 +478,14 @@ const S = {
     class: e`mb-24 last:mb-0 focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800 [&>ul:first-of-type]:border-l-0`
   },
   nodeContent: ({ context: t }) => {
-    const l = e`group ris-label2-bold flex w-full border-l-4 border-transparent py-10 pr-20 pl-10 text-blue-800`, r = e`cursor-pointer select-none`, o = e`focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800`, s = e`border-l-blue-800 bg-blue-200 text-black`, a = e`hover:bg-blue-200`, n = e`hover:bg-blue-300`;
+    const l = e`group ris-label2-bold flex w-full border-l-4 border-transparent py-10 pr-20 pl-10 text-blue-800`, r = e`cursor-pointer select-none`, o = e`focus-visible:outline-4 focus-visible:outline-offset-4 focus-visible:outline-blue-800`, s = e`border-l-blue-800 bg-blue-200 text-black`, i = e`hover:bg-blue-200`, a = e`hover:bg-blue-300`;
     return {
       class: {
         [l]: !0,
         [r]: !0,
         [s]: t.selected,
-        [a]: !t.selected,
-        [n]: t.selected,
+        [i]: !t.selected,
+        [a]: t.selected,
         [o]: !0
       }
     };
@@ -503,7 +518,7 @@ const S = {
       }
     };
   }
-}, G = {
+}, $ = {
   root: ({ props: t }) => ({
     class: {
       [e`flex flex-nowrap rounded-none border-0 bg-transparent`]: !0,
@@ -519,12 +534,12 @@ const S = {
   }),
   gutterHandle: ({ props: t }) => ({
     class: {
-      [e`z-20 rounded bg-transparent outline-offset-2 outline-blue-800 focus:outline-2`]: !0,
+      [e`z-20 rounded bg-transparent outline-offset-4 outline-blue-800 focus-visible:outline-4`]: !0,
       [e`h-11/12 w-[3px] cursor-col-resize`]: t.layout === "horizontal",
       [e`h-[3px] w-11/12 cursor-row-resize`]: t.layout === "vertical"
     }
   })
-}, O = {
+}, G = {
   root: {
     class: e`relative`
   },
@@ -542,7 +557,7 @@ const S = {
   },
   bodyRow: ({ context: t }) => ({
     class: [
-      e`focus:outline-4 focus:-outline-offset-5 focus:outline-blue-800 focus:not-focus-visible:outline-none focus-visible:outline-4 focus-visible:-outline-offset-5 focus-visible:outline-blue-800`,
+      e`-outline-offset-4 outline-blue-800 focus-visible:outline-4`,
       {
         "bg-blue-300": t.selected,
         "hover:bg-blue-100": !t.selected
@@ -558,13 +573,13 @@ const S = {
       class: e`ris-body1-regular h-56 px-16 py-12`
     },
     pcHeaderCheckbox: {
-      ...g,
+      ...h,
       root: {
         class: e`relative block h-24 w-24`
       }
     },
     pcRowCheckbox: {
-      ...g,
+      ...h,
       root: {
         class: e`relative block h-24 w-24`
       }
@@ -579,7 +594,7 @@ const S = {
   emptyMessageCell: {
     class: e`py-96 text-center text-gray-900`
   }
-}, W = {
+}, O = {
   root: ({ context: t }) => {
     const l = e`ris-body2-bold h-64 border-b-4 border-b-transparent py-4 pr-24 pl-20 outline-0 -outline-offset-4 outline-blue-800 focus-visible:outline-4`, r = e`z-10 bg-[var(--p-tabs-tab-active-background)] text-black shadow-[-1px_-1px_0_0_var(--p-tabs-tab-border-color),1px_-1px_0_0_var(--p-tabs-tab-border-color)]`, o = e`cursor-pointer text-blue-800 hover:border-b-blue-800`;
     return {
@@ -590,7 +605,7 @@ const S = {
       }
     };
   }
-}, $ = {
+}, W = {
   root: {
     class: e`min-h-96 bg-[var(--p-tabs-tabpanel-background)] py-24 outline-blue-800 focus-visible:outline-solid`
   }
@@ -600,14 +615,14 @@ const S = {
   }
 }, Y = {
   arrow: ({ context: t }) => {
-    const l = e`absolute h-0 w-0 border-[7px] border-solid`, r = e`-mr-[7px] border-b-0 border-t-gray-900 border-r-transparent border-l-transparent`, o = e`-mt-[7px] border-l-0 border-t-transparent border-r-gray-900 border-b-transparent`, s = e`-ml-[7px] border-t-0 border-r-transparent border-b-gray-900 border-l-transparent`, a = e`-mt-[7px] border-r-0 border-t-transparent border-b-transparent border-l-gray-900`, n = !t.top && !t.right && !t.bottom && !t.left;
+    const l = e`absolute h-0 w-0 border-[7px] border-solid`, r = e`-mr-[7px] border-b-0 border-t-gray-900 border-r-transparent border-l-transparent`, o = e`-mt-[7px] border-l-0 border-t-transparent border-r-gray-900 border-b-transparent`, s = e`-ml-[7px] border-t-0 border-r-transparent border-b-gray-900 border-l-transparent`, i = e`-mt-[7px] border-r-0 border-t-transparent border-b-transparent border-l-gray-900`, a = !t.top && !t.right && !t.bottom && !t.left;
     return {
       class: {
         [l]: !0,
         [r]: t.top,
-        [o]: t.right || n,
+        [o]: t.right || a,
         [s]: t.bottom,
-        [a]: t.left
+        [i]: t.left
       }
     };
   },
@@ -773,31 +788,31 @@ const S = {
   }
 }, X = {
   button: S,
-  checkbox: g,
+  checkbox: h,
   chip: M,
   confirmDialog: z,
   dialog: N,
   fileUpload: D,
-  inputGroup: A,
+  inputGroup: L,
   inputText: B,
   menu: C,
-  message: F,
-  password: I,
+  message: I,
+  password: F,
   progressSpinner: T,
   radioButton: E,
-  textarea: R,
-  toast: V,
-  autocomplete: j,
+  textarea: j,
+  toast: R,
+  autocomplete: V,
   select: _,
   multiselect: P,
   inputMask: Z,
   breadcrumb: J,
   tree: K,
   panelmenu: H,
-  splitter: G,
-  dataTable: O,
-  tab: W,
-  tabPanel: $,
+  splitter: $,
+  dataTable: G,
+  tab: O,
+  tabPanel: W,
   tabList: U,
   directives: {
     tooltip: Y