@helpwave/hightide 0.5.0 → 0.5.2

package/dist/index.mjs

@@ -11378,24 +11378,22 @@ var VerticalDivider = ({
 };
 
 // src/components/layout/Visibility.tsx
+import { Fragment as Fragment4, jsx as jsx35 } from "react/jsx-runtime";
 function Visibility({ children, isVisible }) {
-  if (isVisible) {
-    return children;
-  }
-  return void 0;
+  return /* @__PURE__ */ jsx35(Fragment4, { children: isVisible && children });
 }
 
 // src/components/loading-states/ErrorComponent.tsx
 import { AlertOctagon } from "lucide-react";
 import clsx26 from "clsx";
-import { jsx as jsx35, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs22 } from "react/jsx-runtime";
 var ErrorComponent = ({
   errorText,
   classname
 }) => {
   const translation = useHightideTranslation();
   return /* @__PURE__ */ jsxs22("div", { className: clsx26("flex-col-4 items-center justify-center w-full h-24", classname), children: [
-    /* @__PURE__ */ jsx35(AlertOctagon, { size: 64, className: "text-warning" }),
+    /* @__PURE__ */ jsx36(AlertOctagon, { size: 64, className: "text-warning" }),
     errorText ?? `${translation("errorOccurred")} :(`
   ] });
 };
@@ -11405,14 +11403,14 @@ import { useState as useState20 } from "react";
 
 // src/components/loading-states/LoadingContainer.tsx
 import { clsx as clsx27 } from "clsx";
-import { jsx as jsx36 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 var LoadingContainer = ({ className }) => {
-  return /* @__PURE__ */ jsx36("div", { className: clsx27("relative overflow-hidden shimmer bg-disabled/30 rounded-md", className) });
+  return /* @__PURE__ */ jsx37("div", { className: clsx27("relative overflow-hidden shimmer bg-disabled/30 rounded-md", className) });
 };
 
 // src/components/loading-states/LoadingAndErrorComponent.tsx
 import { clsx as clsx28 } from "clsx";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx38 } from "react/jsx-runtime";
 var LoadingAndErrorComponent = ({
   children,
   isLoading = false,
@@ -11432,40 +11430,40 @@ var LoadingAndErrorComponent = ({
     }, minimumLoadingDuration);
   }
   if (isLoading || minimumLoadingDuration && isInMinimumLoading) {
-    return loadingComponent ?? /* @__PURE__ */ jsx37(LoadingContainer, { className: clsx28(className) });
+    return /* @__PURE__ */ jsx38(Fragment5, { children: loadingComponent ?? /* @__PURE__ */ jsx38(LoadingContainer, { className: clsx28(className) }) });
   }
   if (hasError) {
-    return errorComponent ?? /* @__PURE__ */ jsx37(LoadingContainer, { className: clsx28("bg-negative", className) });
+    return /* @__PURE__ */ jsx38(Fragment5, { children: errorComponent ?? /* @__PURE__ */ jsx38(LoadingContainer, { className: clsx28("bg-negative", className) }) });
   }
-  return children;
+  return /* @__PURE__ */ jsx38(Fragment5, { children });
 };
 
 // src/components/loading-states/LoadingAnimation.tsx
 import clsx29 from "clsx";
-import { jsx as jsx38, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs23 } from "react/jsx-runtime";
 var LoadingAnimation = ({
   loadingText,
   classname
 }) => {
   const translation = useHightideTranslation();
   return /* @__PURE__ */ jsxs23("div", { className: clsx29("flex-col-2 items-center justify-center w-full h-24", classname), children: [
-    /* @__PURE__ */ jsx38(HelpwaveLogo, { animate: "loading" }),
+    /* @__PURE__ */ jsx39(HelpwaveLogo, { animate: "loading" }),
     loadingText ?? `${translation("loading")}...`
   ] });
 };
 
 // src/components/loading-states/LoadingButton.tsx
 import clsx30 from "clsx";
-import { jsx as jsx39, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs24 } from "react/jsx-runtime";
 var LoadingButton = ({ isLoading = false, size = "medium", onClick, ...rest }) => {
   return /* @__PURE__ */ jsxs24("div", { className: "inline-block relative", children: [
-    isLoading && /* @__PURE__ */ jsx39("div", { className: clsx30("flex-row-2 absolute inset-0 items-center justify-center bg-white/40"), children: /* @__PURE__ */ jsx39(HelpwaveLogo, { animate: "loading", className: "text-white" }) }),
-    /* @__PURE__ */ jsx39(Button, { ...rest, size, disabled: rest.disabled, onClick })
+    isLoading && /* @__PURE__ */ jsx40("div", { className: clsx30("flex-row-2 absolute inset-0 items-center justify-center bg-white/40"), children: /* @__PURE__ */ jsx40(HelpwaveLogo, { animate: "loading", className: "text-white" }) }),
+    /* @__PURE__ */ jsx40(Button, { ...rest, size, disabled: rest.disabled, onClick })
   ] });
 };
 
 // src/components/loading-states/ProgressIndicator.tsx
-import { jsx as jsx40, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs25 } from "react/jsx-runtime";
 var sizeMapping = { small: 16, medium: 24, big: 48 };
 var ProgressIndicator = ({
   progress,
@@ -11491,7 +11489,7 @@ var ProgressIndicator = ({
         transform: `rotate(${rotation}deg)`
       },
       children: [
-        /* @__PURE__ */ jsx40(
+        /* @__PURE__ */ jsx41(
           "circle",
           {
             cx: center,
@@ -11502,7 +11500,7 @@ var ProgressIndicator = ({
             className: "stroke-progress-indicator-fill"
           }
         ),
-        /* @__PURE__ */ jsx40(
+        /* @__PURE__ */ jsx41(
           "circle",
           {
             cx: center,
@@ -11523,13 +11521,13 @@ var ProgressIndicator = ({
 // src/components/navigation/BreadCrumb.tsx
 var import_link = __toESM(require_link2());
 import clsx31 from "clsx";
-import { Fragment as Fragment4 } from "react";
-import { jsx as jsx41, jsxs as jsxs26 } from "react/jsx-runtime";
+import { Fragment as Fragment6 } from "react";
+import { jsx as jsx42, jsxs as jsxs26 } from "react/jsx-runtime";
 var BreadCrumb = ({ crumbs, linkClassName, containerClassName }) => {
-  return /* @__PURE__ */ jsx41("div", { className: clsx31("flex-row-0.5 items-center", containerClassName), children: crumbs.map((crumb, index) => {
+  return /* @__PURE__ */ jsx42("div", { className: clsx31("flex-row-0.5 items-center", containerClassName), children: crumbs.map((crumb, index) => {
     const isLast = index === crumbs.length - 1;
-    return /* @__PURE__ */ jsxs26(Fragment4, { children: [
-      /* @__PURE__ */ jsx41(
+    return /* @__PURE__ */ jsxs26(Fragment6, { children: [
+      /* @__PURE__ */ jsx42(
         import_link.default,
         {
           href: crumb.link,
@@ -11544,7 +11542,7 @@ var BreadCrumb = ({ crumbs, linkClassName, containerClassName }) => {
           children: crumb.display
         }
       ),
-      !isLast && /* @__PURE__ */ jsx41("span", { className: clsx31(`px-1`, "text-description"), children: "/" })
+      !isLast && /* @__PURE__ */ jsx42("span", { className: clsx31(`px-1`, "text-description"), children: "/" })
     ] }, index);
   }) });
 };
@@ -11555,7 +11553,7 @@ import { Menu as MenuIcon, XIcon as XIcon2 } from "lucide-react";
 import { useEffect as useEffect20 } from "react";
 import { useCallback as useCallback11, useId as useId8, useRef as useRef11, useState as useState21 } from "react";
 import clsx32 from "clsx";
-import { Fragment as Fragment5, jsx as jsx42, jsxs as jsxs27 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx43, jsxs as jsxs27 } from "react/jsx-runtime";
 function isSubItem(item) {
   return "items" in item && Array.isArray(item.items);
 }
@@ -11583,7 +11581,7 @@ var NavigationItemWithSubItem = ({
     }
   }, []);
   const zIndex = useZIndexRegister(isOpen);
-  return /* @__PURE__ */ jsxs27(Fragment5, { children: [
+  return /* @__PURE__ */ jsxs27(Fragment7, { children: [
     /* @__PURE__ */ jsxs27(
       "button",
       {
@@ -11599,11 +11597,11 @@ var NavigationItemWithSubItem = ({
         "aria-controls": "navigation-items-" + id,
         children: [
           label,
-          /* @__PURE__ */ jsx42(ExpansionIcon, { isExpanded: isOpen })
+          /* @__PURE__ */ jsx43(ExpansionIcon, { isExpanded: isOpen })
         ]
       }
     ),
-    /* @__PURE__ */ jsx42(
+    /* @__PURE__ */ jsx43(
       "ul",
       {
         id: "navigation-items-" + id,
@@ -11622,7 +11620,7 @@ var NavigationItemWithSubItem = ({
           { "opacity-0": !style }
         ),
         style: { ...style, zIndex },
-        children: items.map(({ link, label: label2, external }, index) => /* @__PURE__ */ jsx42("li", { children: /* @__PURE__ */ jsx42(
+        children: items.map(({ link, label: label2, external }, index) => /* @__PURE__ */ jsx43("li", { children: /* @__PURE__ */ jsx43(
           import_link2.default,
           {
             href: link,
@@ -11636,7 +11634,7 @@ var NavigationItemWithSubItem = ({
   ] });
 };
 var NavigationItemList = ({ items, ...restProps }) => {
-  return /* @__PURE__ */ jsx42("ul", { ...restProps, className: clsx32("flex-row-6 items-center", restProps.className), children: items.map((item, index) => /* @__PURE__ */ jsx42("li", { children: isSubItem(item) ? /* @__PURE__ */ jsx42(NavigationItemWithSubItem, { ...item }) : /* @__PURE__ */ jsx42(import_link2.default, { href: item.link, target: item.external ? "_blank" : void 0, className: "link", children: item.label }) }, index)) });
+  return /* @__PURE__ */ jsx43("ul", { ...restProps, className: clsx32("flex-row-6 items-center", restProps.className), children: items.map((item, index) => /* @__PURE__ */ jsx43("li", { children: isSubItem(item) ? /* @__PURE__ */ jsx43(NavigationItemWithSubItem, { ...item }) : /* @__PURE__ */ jsx43(import_link2.default, { href: item.link, target: item.external ? "_blank" : void 0, className: "link", children: item.label }) }, index)) });
 };
 var Navigation = ({ ...props }) => {
   const [isMobileOpen, setIsMobileOpen] = useState21(false);
@@ -11647,14 +11645,14 @@ var Navigation = ({ ...props }) => {
   }, [isMobileOpen]);
   const zIndex = useZIndexRegister(isMobileOpen);
   return /* @__PURE__ */ jsxs27("nav", { children: [
-    /* @__PURE__ */ jsx42(
+    /* @__PURE__ */ jsx43(
       NavigationItemList,
       {
         ...props,
         className: clsx32("hidden", { "desktop:flex": !isMobileOpen }, props.className)
       }
     ),
-    /* @__PURE__ */ jsx42(
+    /* @__PURE__ */ jsx43(
       Button,
       {
         layout: "icon",
@@ -11665,7 +11663,7 @@ var Navigation = ({ ...props }) => {
         "aria-haspopup": "true",
         "aria-expanded": isMobileOpen,
         "aria-controls": "navigation-menu-" + id,
-        children: /* @__PURE__ */ jsx42(MenuIcon, { className: "w-6 h-6" })
+        children: /* @__PURE__ */ jsx43(MenuIcon, { className: "w-6 h-6" })
       }
     ),
     /* @__PURE__ */ jsxs27(
@@ -11690,17 +11688,17 @@ var Navigation = ({ ...props }) => {
         ),
         style: { zIndex },
         children: [
-          /* @__PURE__ */ jsx42(
+          /* @__PURE__ */ jsx43(
             Button,
             {
               layout: "icon",
               coloringStyle: "text",
               color: "neutral",
               onClick: () => setIsMobileOpen(false),
-              children: /* @__PURE__ */ jsx42(XIcon2, {})
+              children: /* @__PURE__ */ jsx43(XIcon2, {})
             }
           ),
-          /* @__PURE__ */ jsx42(NavigationItemList, { ...props, className: clsx32("flex-col-8", props.className) })
+          /* @__PURE__ */ jsx43(NavigationItemList, { ...props, className: clsx32("flex-col-8", props.className) })
         ]
       }
     )
@@ -11711,7 +11709,7 @@ var Navigation = ({ ...props }) => {
 import { ChevronFirst, ChevronLast, ChevronLeft as ChevronLeft2, ChevronRight as ChevronRight2 } from "lucide-react";
 import clsx33 from "clsx";
 import { useEffect as useEffect21, useState as useState22 } from "react";
-import { jsx as jsx43, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs28 } from "react/jsx-runtime";
 var Pagination = ({
   pageIndex,
   pageCount,
@@ -11735,7 +11733,7 @@ var Pagination = ({
     onPageChanged(page);
   };
   return /* @__PURE__ */ jsxs28("div", { className: clsx33("flex-row-1", className), style, children: [
-    /* @__PURE__ */ jsx43(
+    /* @__PURE__ */ jsx44(
       Button,
       {
         layout: "icon",
@@ -11743,10 +11741,10 @@ var Pagination = ({
         color: "neutral",
         onClick: () => changePage(0),
         disabled: onFirstPage || noPages,
-        children: /* @__PURE__ */ jsx43(ChevronFirst, {})
+        children: /* @__PURE__ */ jsx44(ChevronFirst, {})
       }
     ),
-    /* @__PURE__ */ jsx43(
+    /* @__PURE__ */ jsx44(
       Button,
       {
         layout: "icon",
@@ -11754,11 +11752,11 @@ var Pagination = ({
         color: "neutral",
         onClick: () => changePage(pageIndex - 1),
         disabled: onFirstPage || noPages,
-        children: /* @__PURE__ */ jsx43(ChevronLeft2, {})
+        children: /* @__PURE__ */ jsx44(ChevronLeft2, {})
       }
     ),
     /* @__PURE__ */ jsxs28("div", { className: "flex-row-2 min-w-56 items-center justify-center mx-2 text-center", children: [
-      /* @__PURE__ */ jsx43(
+      /* @__PURE__ */ jsx44(
         Input,
         {
           value,
@@ -11782,8 +11780,8 @@ var Pagination = ({
           editCompleteOptions: { delay: 800 }
         }
       ),
-      /* @__PURE__ */ jsx43("span", { className: "select-none w-10", children: translation("of") }),
-      /* @__PURE__ */ jsx43(
+      /* @__PURE__ */ jsx44("span", { className: "select-none w-10", children: translation("of") }),
+      /* @__PURE__ */ jsx44(
         "span",
         {
           className: "flex-row-2 w-24 items-center justify-center select-none h-10 bg-input-background text-input-text rounded-md font-bold",
@@ -11791,7 +11789,7 @@ var Pagination = ({
         }
       )
     ] }),
-    /* @__PURE__ */ jsx43(
+    /* @__PURE__ */ jsx44(
       Button,
       {
         layout: "icon",
@@ -11799,10 +11797,10 @@ var Pagination = ({
         color: "neutral",
         onClick: () => changePage(pageIndex + 1),
         disabled: onLastPage || noPages,
-        children: /* @__PURE__ */ jsx43(ChevronRight2, {})
+        children: /* @__PURE__ */ jsx44(ChevronRight2, {})
       }
     ),
-    /* @__PURE__ */ jsx43(
+    /* @__PURE__ */ jsx44(
       Button,
       {
         layout: "icon",
@@ -11810,7 +11808,7 @@ var Pagination = ({
         color: "neutral",
         onClick: () => changePage(pageCount - 1),
         disabled: onLastPage || noPages,
-        children: /* @__PURE__ */ jsx43(ChevronLast, {})
+        children: /* @__PURE__ */ jsx44(ChevronLast, {})
       }
     )
   ] });
@@ -11819,7 +11817,7 @@ var Pagination = ({
 // src/components/navigation/StepperBar.tsx
 import { Check, ChevronLeft as ChevronLeft3, ChevronRight as ChevronRight3 } from "lucide-react";
 import clsx34 from "clsx";
-import { jsx as jsx44, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx45, jsxs as jsxs29 } from "react/jsx-runtime";
 var defaultState = {
   currentStep: 0,
   seenSteps: /* @__PURE__ */ new Set([0])
@@ -11846,7 +11844,7 @@ var StepperBar = ({
     {
       className: clsx34("flex-row-2 justify-between", className),
       children: [
-        /* @__PURE__ */ jsx44("div", { className: "flex-row-2 flex-[2] justify-start", children: /* @__PURE__ */ jsxs29(
+        /* @__PURE__ */ jsx45("div", { className: "flex-row-2 flex-[2] justify-start", children: /* @__PURE__ */ jsxs29(
           Button,
           {
             disabled: currentStep === 0 || disabledSteps.has(currentStep),
@@ -11855,14 +11853,14 @@ var StepperBar = ({
             },
             className: "flex-row-1 items-center justify-center",
             children: [
-              /* @__PURE__ */ jsx44(ChevronLeft3, { size: 14 }),
+              /* @__PURE__ */ jsx45(ChevronLeft3, { size: 14 }),
               translation("back")
             ]
           }
         ) }),
-        /* @__PURE__ */ jsx44("div", { className: "flex-row-2 flex-[5] justify-center items-center", children: showDots && dots.map((value, index) => {
+        /* @__PURE__ */ jsx45("div", { className: "flex-row-2 flex-[5] justify-center items-center", children: showDots && dots.map((value, index) => {
           const seen = seenSteps.has(index);
-          return /* @__PURE__ */ jsx44(
+          return /* @__PURE__ */ jsx45(
             "div",
             {
               onClick: () => seen && update(index),
@@ -11882,7 +11880,7 @@ var StepperBar = ({
             index
           );
         }) }),
-        currentStep !== numberOfSteps && /* @__PURE__ */ jsx44("div", { className: "flex-row-2 flex-[2] justify-end", children: /* @__PURE__ */ jsxs29(
+        currentStep !== numberOfSteps && /* @__PURE__ */ jsx45("div", { className: "flex-row-2 flex-[2] justify-end", children: /* @__PURE__ */ jsxs29(
           Button,
           {
             onClick: () => update(currentStep + 1),
@@ -11890,18 +11888,18 @@ var StepperBar = ({
             disabled: disabledSteps.has(currentStep),
             children: [
               translation("next"),
-              /* @__PURE__ */ jsx44(ChevronRight3, { size: 14 })
+              /* @__PURE__ */ jsx45(ChevronRight3, { size: 14 })
             ]
           }
         ) }),
-        currentStep === numberOfSteps && /* @__PURE__ */ jsx44("div", { className: "flex-row-2 flex-[2] justify-end", children: /* @__PURE__ */ jsxs29(
+        currentStep === numberOfSteps && /* @__PURE__ */ jsx45("div", { className: "flex-row-2 flex-[2] justify-end", children: /* @__PURE__ */ jsxs29(
           Button,
           {
             disabled: disabledSteps.has(currentStep),
             onClick: onFinish,
             className: "flex-row-1 items-center justify-center",
             children: [
-              /* @__PURE__ */ jsx44(Check, { size: 14 }),
+              /* @__PURE__ */ jsx45(Check, { size: 14 }),
               finishText ?? translation("confirm")
             ]
           }
@@ -11912,7 +11910,7 @@ var StepperBar = ({
 };
 var StepperBarUncontrolled = ({ state, onChange, ...props }) => {
   const [usedState, setUsedState] = useOverwritableState(state, onChange);
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx45(
     StepperBar,
     {
       ...props,
@@ -11928,7 +11926,7 @@ import { Check as Check3 } from "lucide-react";
 // src/components/user-action/Checkbox.tsx
 import { Check as Check2, Minus } from "lucide-react";
 import clsx35 from "clsx";
-import { jsx as jsx45, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs30 } from "react/jsx-runtime";
 var checkboxSizeMapping = {
   small: "size-5 border-2",
   medium: "size-6 border-2",
@@ -11982,8 +11980,8 @@ var Checkbox = ({
       "aria-disabled": disabled,
       tabIndex: disabled ? -1 : 0,
       children: [
-        !indeterminate && /* @__PURE__ */ jsx45(Check2, { className: innerIconSize, "aria-hidden": true }),
-        indeterminate && /* @__PURE__ */ jsx45(Minus, { className: innerIconSize, "aria-hidden": true })
+        !indeterminate && /* @__PURE__ */ jsx46(Check2, { className: innerIconSize, "aria-hidden": true }),
+        indeterminate && /* @__PURE__ */ jsx46(Minus, { className: innerIconSize, "aria-hidden": true })
       ]
     }
   );
@@ -11994,7 +11992,7 @@ var CheckboxUncontrolled = ({
   ...props
 }) => {
   const [checked, setChecked] = useOverwritableState(initialChecked, onCheckedChange);
-  return /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx46(
     Checkbox,
     {
       ...props,
@@ -12007,7 +12005,7 @@ var CheckboxUncontrolled = ({
 // src/components/properties/PropertyBase.tsx
 import { AlertTriangle } from "lucide-react";
 import clsx36 from "clsx";
-import { jsx as jsx46, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs31 } from "react/jsx-runtime";
 var PropertyBase = ({
   name,
   input,
@@ -12033,8 +12031,8 @@ var PropertyBase = ({
           className
         ),
         children: [
-          /* @__PURE__ */ jsx46("div", { className: "max-w-6 min-w-6 text-text-primary", children: icon }),
-          /* @__PURE__ */ jsx46("span", { className: "font-semibold", children: name })
+          /* @__PURE__ */ jsx47("div", { className: "max-w-6 min-w-6 text-text-primary", children: icon }),
+          /* @__PURE__ */ jsx47("span", { className: "font-semibold", children: name })
         ]
       }
     ),
@@ -12051,8 +12049,8 @@ var PropertyBase = ({
         ),
         children: [
           input({ softRequired, hasValue }),
-          requiredAndNoValue && /* @__PURE__ */ jsx46("div", { className: "text-warning", children: /* @__PURE__ */ jsx46(AlertTriangle, { size: 24 }) }),
-          onRemove && !readOnly && /* @__PURE__ */ jsx46(
+          requiredAndNoValue && /* @__PURE__ */ jsx47("div", { className: "text-warning", children: /* @__PURE__ */ jsx47(AlertTriangle, { size: 24 }) }),
+          onRemove && !readOnly && /* @__PURE__ */ jsx47(
             Button,
             {
               onClick: onRemove,
@@ -12071,7 +12069,7 @@ var PropertyBase = ({
 
 // src/components/properties/CheckboxProperty.tsx
 import { useId as useId9 } from "react";
-import { jsx as jsx47, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs32 } from "react/jsx-runtime";
 var CheckboxProperty = ({
   value,
   onChange,
@@ -12080,15 +12078,15 @@ var CheckboxProperty = ({
 }) => {
   const translation = useHightideTranslation();
   const id = useId9();
-  return /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsx48(
     PropertyBase,
     {
       ...baseProps,
       hasValue: true,
       readOnly,
-      icon: /* @__PURE__ */ jsx47(Check3, { size: 24 }),
+      icon: /* @__PURE__ */ jsx48(Check3, { size: 24 }),
       input: () => /* @__PURE__ */ jsxs32("div", { className: "flex-row-2 items-center", children: [
-        /* @__PURE__ */ jsx47(
+        /* @__PURE__ */ jsx48(
           Checkbox,
           {
             id,
@@ -12098,7 +12096,7 @@ var CheckboxProperty = ({
             "aria-labelledby": id + "label"
           }
         ),
-        /* @__PURE__ */ jsx47(Label, { id: id + "label", children: `${translation("yes")}/${translation("no")}` })
+        /* @__PURE__ */ jsx48(Label, { id: id + "label", children: `${translation("yes")}/${translation("no")}` })
       ] })
     }
   );
@@ -12107,7 +12105,7 @@ var CheckboxProperty = ({
 // src/components/properties/DateProperty.tsx
 import { CalendarDays } from "lucide-react";
 import clsx37 from "clsx";
-import { jsx as jsx48 } from "react/jsx-runtime";
+import { jsx as jsx49 } from "react/jsx-runtime";
 var DateProperty = ({
   value,
   onChange,
@@ -12118,13 +12116,13 @@ var DateProperty = ({
 }) => {
   const hasValue = !!value;
   const dateText = value ? type === "dateTime" ? formatDateTime(value) : formatDate(value) : "";
-  return /* @__PURE__ */ jsx48(
+  return /* @__PURE__ */ jsx49(
     PropertyBase,
     {
       ...baseProps,
       hasValue,
-      icon: /* @__PURE__ */ jsx48(CalendarDays, { size: 24 }),
-      input: ({ softRequired }) => /* @__PURE__ */ jsx48(
+      icon: /* @__PURE__ */ jsx49(CalendarDays, { size: 24 }),
+      input: ({ softRequired }) => /* @__PURE__ */ jsx49(
         Input,
         {
           className: clsx37("default-style-none focus-style-none", { "bg-surface-warning": softRequired && !hasValue }),
@@ -12150,7 +12148,7 @@ var DateProperty = ({
 // src/components/properties/MultiSelectProperty.tsx
 import { List } from "lucide-react";
 import clsx38 from "clsx";
-import { jsx as jsx49 } from "react/jsx-runtime";
+import { jsx as jsx50 } from "react/jsx-runtime";
 var MultiSelectProperty = ({
   children,
   values,
@@ -12158,13 +12156,13 @@ var MultiSelectProperty = ({
   ...props
 }) => {
   const hasValue = values.length > 0;
-  return /* @__PURE__ */ jsx49(
+  return /* @__PURE__ */ jsx50(
     PropertyBase,
     {
       ...props,
       hasValue,
-      icon: /* @__PURE__ */ jsx49(List, { size: 24 }),
-      input: ({ softRequired }) => /* @__PURE__ */ jsx49(
+      icon: /* @__PURE__ */ jsx50(List, { size: 24 }),
+      input: ({ softRequired }) => /* @__PURE__ */ jsx50(
         MultiSelectChipDisplay,
         {
           values,
@@ -12191,7 +12189,7 @@ var MultiSelectProperty = ({
 // src/components/properties/NumberProperty.tsx
 import { Binary } from "lucide-react";
 import clsx39 from "clsx";
-import { jsx as jsx50, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs33 } from "react/jsx-runtime";
 var NumberProperty = ({
   value,
   onChange,
@@ -12203,13 +12201,13 @@ var NumberProperty = ({
 }) => {
   const translation = useHightideTranslation();
   const hasValue = value !== void 0;
-  return /* @__PURE__ */ jsx50(
+  return /* @__PURE__ */ jsx51(
     PropertyBase,
     {
       ...baseProps,
       onRemove,
       hasValue,
-      icon: /* @__PURE__ */ jsx50(Binary, { size: 24 }),
+      icon: /* @__PURE__ */ jsx51(Binary, { size: 24 }),
       input: ({ softRequired }) => (
         // TODO this max width might be to low for some numbers
         /* @__PURE__ */ jsxs33(
@@ -12217,7 +12215,7 @@ var NumberProperty = ({
           {
             className: clsx39("relative flex-row-2 max-w-56", { "text-warning": softRequired && !hasValue }),
             children: [
-              /* @__PURE__ */ jsx50(
+              /* @__PURE__ */ jsx51(
                 Input,
                 {
                   className: clsx39("default-style-none focus-style-none w-full pr-8", { "bg-surface-warning placeholder-warning": softRequired && !hasValue }),
@@ -12243,7 +12241,7 @@ var NumberProperty = ({
                   }
                 }
               ),
-              suffix && /* @__PURE__ */ jsx50(
+              suffix && /* @__PURE__ */ jsx51(
                 "span",
                 {
                   className: clsx39(
@@ -12264,7 +12262,7 @@ var NumberProperty = ({
 // src/components/properties/SelectProperty.tsx
 import { List as List2 } from "lucide-react";
 import clsx40 from "clsx";
-import { jsx as jsx51 } from "react/jsx-runtime";
+import { jsx as jsx52 } from "react/jsx-runtime";
 var SingleSelectProperty = ({
   children,
   value,
@@ -12273,13 +12271,13 @@ var SingleSelectProperty = ({
   ...props
 }) => {
   const hasValue = value !== void 0;
-  return /* @__PURE__ */ jsx51(
+  return /* @__PURE__ */ jsx52(
     PropertyBase,
     {
       ...props,
       hasValue,
-      icon: /* @__PURE__ */ jsx51(List2, { size: 24 }),
-      input: ({ softRequired }) => /* @__PURE__ */ jsx51(
+      icon: /* @__PURE__ */ jsx52(List2, { size: 24 }),
+      input: ({ softRequired }) => /* @__PURE__ */ jsx52(
         Select,
         {
           value,
@@ -12308,7 +12306,7 @@ import clsx42 from "clsx";
 // src/components/user-action/Textarea.tsx
 import { forwardRef as forwardRef8, useId as useId10 } from "react";
 import clsx41 from "clsx";
-import { jsx as jsx52, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx53, jsxs as jsxs34 } from "react/jsx-runtime";
 var Textarea = forwardRef8(function Textarea2({
   id,
   onChange,
@@ -12325,7 +12323,7 @@ var Textarea = forwardRef8(function Textarea2({
     onEditCompleted?.(text);
     clearTimer();
   };
-  return /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsx53(
     "textarea",
     {
       ...props,
@@ -12357,7 +12355,7 @@ var TextareaUncontrolled = ({
   ...props
 }) => {
   const [text, setText] = useOverwritableState(value, onChangeText);
-  return /* @__PURE__ */ jsx52(
+  return /* @__PURE__ */ jsx53(
     Textarea,
     {
       ...props,
@@ -12389,8 +12387,8 @@ var TextareaWithHeadline = ({
         containerClassName
       ),
       children: [
-        headline && /* @__PURE__ */ jsx52(Label, { size: "md", ...headlineProps, htmlFor: usedId, children: headline }),
-        /* @__PURE__ */ jsx52(
+        headline && /* @__PURE__ */ jsx53(Label, { size: "md", ...headlineProps, htmlFor: usedId, children: headline }),
+        /* @__PURE__ */ jsx53(
           Textarea,
           {
             ...props,
@@ -12407,7 +12405,7 @@ var TextareaWithHeadline = ({
 };
 
 // src/components/properties/TextProperty.tsx
-import { jsx as jsx53 } from "react/jsx-runtime";
+import { jsx as jsx54 } from "react/jsx-runtime";
 var TextProperty = ({
   value,
   readOnly,
@@ -12418,14 +12416,14 @@ var TextProperty = ({
 }) => {
   const translation = useHightideTranslation();
   const hasValue = value !== void 0;
-  return /* @__PURE__ */ jsx53(
+  return /* @__PURE__ */ jsx54(
     PropertyBase,
     {
       ...baseProps,
       onRemove,
       hasValue,
-      icon: /* @__PURE__ */ jsx53(Text, { size: 24 }),
-      input: ({ softRequired }) => /* @__PURE__ */ jsx53(
+      icon: /* @__PURE__ */ jsx54(Text, { size: 24 }),
+      input: ({ softRequired }) => /* @__PURE__ */ jsx54(
         Textarea,
         {
           className: clsx42(
@@ -12458,11 +12456,11 @@ var TextProperty = ({
 
 // src/components/table/FillerRowElement.tsx
 import { clsx as clsx43 } from "clsx";
-import { jsx as jsx54 } from "react/jsx-runtime";
+import { jsx as jsx55 } from "react/jsx-runtime";
 var FillerRowElement = ({
   className
 }) => {
-  return /* @__PURE__ */ jsx54("div", { className: clsx43("flex flex-row items-center w-1/2 h-4 text-disabled font-bold", className), children: "-" });
+  return /* @__PURE__ */ jsx55("div", { className: clsx43("flex flex-row items-center w-1/2 h-4 text-disabled font-bold", className), children: "-" });
 };
 
 // src/components/table/Filter.ts
@@ -12493,12 +12491,12 @@ import {
 
 // src/components/table/TableCell.tsx
 import { clsx as clsx44 } from "clsx";
-import { jsx as jsx55 } from "react/jsx-runtime";
+import { jsx as jsx56 } from "react/jsx-runtime";
 var TableCell = ({
   children,
   className
 }) => {
-  return /* @__PURE__ */ jsx55("span", { className: clsx44("block max-w-full overflow-ellipsis truncate", className), children });
+  return /* @__PURE__ */ jsx56("span", { className: clsx44("block max-w-full overflow-ellipsis truncate", className), children });
 };
 
 // src/hooks/useResizeCallbackWrapper.ts
@@ -12520,7 +12518,7 @@ import clsx46 from "clsx";
 import { useRef as useRef12, useState as useState23 } from "react";
 import { clsx as clsx45 } from "clsx";
 import { createPortal as createPortal4 } from "react-dom";
-import { jsx as jsx56, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs35 } from "react/jsx-runtime";
 var Tooltip = ({
   tooltip,
   children,
@@ -12547,10 +12545,22 @@ var Tooltip = ({
     right: `border-r-tooltip-background border-t-transparent border-b-transparent`
   };
   const triangleStyle = {
-    top: { borderWidth: `${triangleSize}rem ${triangleSize}rem 0 ${triangleSize}rem`, transform: `translate(0,${triangleSize}rem)` },
-    bottom: { borderWidth: `0 ${triangleSize}rem ${triangleSize}rem ${triangleSize}rem`, transform: `translate(0,-${triangleSize}rem)` },
-    left: { borderWidth: `${triangleSize}rem 0 ${triangleSize}rem ${triangleSize}rem`, transform: `translate(${triangleSize}rem,0)` },
-    right: { borderWidth: `${triangleSize}rem ${triangleSize}rem ${triangleSize}rem 0`, transform: `translate(-${triangleSize}rem,0)` }
+    top: {
+      borderWidth: `${triangleSize}rem ${triangleSize}rem 0 ${triangleSize}rem`,
+      transform: `translate(0,${triangleSize}rem)`
+    },
+    bottom: {
+      borderWidth: `0 ${triangleSize}rem ${triangleSize}rem ${triangleSize}rem`,
+      transform: `translate(0,-${triangleSize}rem)`
+    },
+    left: {
+      borderWidth: `${triangleSize}rem 0 ${triangleSize}rem ${triangleSize}rem`,
+      transform: `translate(${triangleSize}rem,0)`
+    },
+    right: {
+      borderWidth: `${triangleSize}rem ${triangleSize}rem ${triangleSize}rem 0`,
+      transform: `translate(-${triangleSize}rem,0)`
+    }
   };
   const isActive = !disabled && isShown;
   const css = useFloatingElement({
@@ -12574,8 +12584,10 @@ var Tooltip = ({
     {
       ref: anchorRef,
       className: clsx45("relative inline-block", containerClassName),
-      onMouseEnter: () => setState((prevState) => {
-        clearTimeout(prevState.timer);
+      onPointerEnter: () => setState((prevState) => {
+        if (prevState.isShown) {
+          return prevState;
+        }
         return {
           ...prevState,
           timer: setTimeout(() => {
@@ -12586,7 +12598,7 @@ var Tooltip = ({
           }, appearDelay)
         };
       }),
-      onMouseLeave: () => setState((prevState) => {
+      onPointerLeave: () => setState((prevState) => {
         clearTimeout(prevState.timer);
         return {
           ...prevState,
@@ -12602,7 +12614,7 @@ var Tooltip = ({
         children,
         /* @__PURE__ */ jsxs35(Visibility, { isVisible: isActive, children: [
           createPortal4(
-            /* @__PURE__ */ jsx56(
+            /* @__PURE__ */ jsx57(
               "div",
               {
                 ref: containerRef,
@@ -12618,7 +12630,7 @@ var Tooltip = ({
             document.body
           ),
           createPortal4(
-            /* @__PURE__ */ jsx56(
+            /* @__PURE__ */ jsx57(
               "div",
               {
                 ref: triangleRef,
@@ -12640,7 +12652,7 @@ var Tooltip = ({
 };
 
 // src/components/table/TableSortButton.tsx
-import { jsx as jsx57, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs36 } from "react/jsx-runtime";
 var TableSortButton = ({
   sortDirection,
   invert = false,
@@ -12652,16 +12664,16 @@ var TableSortButton = ({
 }) => {
   const translation = useHightideTranslation();
   const { sortingsCount, index } = sortingIndexDisplay;
-  let icon = /* @__PURE__ */ jsx57(ChevronsUpDown, { className: "size-4" });
+  let icon = /* @__PURE__ */ jsx58(ChevronsUpDown, { className: "size-4" });
   if (sortDirection) {
     let usedSortDirection = sortDirection;
     if (invert) {
       usedSortDirection = usedSortDirection === "desc" ? "asc" : "desc";
     }
-    icon = usedSortDirection === "asc" ? /* @__PURE__ */ jsx57(ChevronUp, { className: "size-4" }) : /* @__PURE__ */ jsx57(ChevronDown3, { className: "size-4" });
+    icon = usedSortDirection === "asc" ? /* @__PURE__ */ jsx58(ChevronUp, { className: "size-4" }) : /* @__PURE__ */ jsx58(ChevronDown3, { className: "size-4" });
   }
   const hasSortingIndex = !!sortingIndexDisplay && sortingsCount > 1 && index > 0;
-  return /* @__PURE__ */ jsx57(Tooltip, { tooltip: translation("rSortingOrderAfter", { otherSortings: index - 1 }), disabled: !hasSortingIndex, children: /* @__PURE__ */ jsxs36(
+  return /* @__PURE__ */ jsx58(Tooltip, { tooltip: translation("rSortingOrderAfter", { otherSortings: index - 1 }), disabled: !hasSortingIndex, children: /* @__PURE__ */ jsxs36(
     Button,
     {
       layout: hasSortingIndex ? "default" : "icon",
@@ -12670,7 +12682,7 @@ var TableSortButton = ({
       className: clsx46("relative", className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx57(Visibility, { isVisible: hasSortingIndex, children: /* @__PURE__ */ jsx57(
+        /* @__PURE__ */ jsx58(Visibility, { isVisible: hasSortingIndex, children: /* @__PURE__ */ jsx58(
           "div",
           {
             className: clsx46("absolute bottom-0 right-1/2 translate-x-1/2 translate-y-2/3 z-1 primary coloring-solid rounded-full h-4 w-5 text-sm"),
@@ -12823,14 +12835,14 @@ var useOutsideClick = (refs, handler) => {
 };
 
 // src/components/user-action/Menu.tsx
-import { Fragment as Fragment6, jsx as jsx58, jsxs as jsxs37 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx59, jsxs as jsxs37 } from "react/jsx-runtime";
 var MenuItem = ({
   children,
   onClick,
   alignment = "left",
   isDisabled = false,
   className
-}) => /* @__PURE__ */ jsx58(
+}) => /* @__PURE__ */ jsx59(
   "div",
   {
     className: clsx47("block px-3 py-1.5 first:rounded-t-md last:rounded-b-md text-sm font-semibold text-nowrap", {
@@ -12900,9 +12912,9 @@ var Menu = ({
     }
   }, [isOpen]);
   const zIndex = useZIndexRegister(isOpen);
-  return /* @__PURE__ */ jsxs37(Fragment6, { children: [
+  return /* @__PURE__ */ jsxs37(Fragment8, { children: [
     trigger(bag, triggerRef),
-    createPortal5(/* @__PURE__ */ jsx58(
+    createPortal5(/* @__PURE__ */ jsx59(
       "div",
       {
         ref: menuRef,
@@ -12933,7 +12945,7 @@ var Menu = ({
 
 // src/components/table/TableFilterButton.tsx
 import { useEffect as useEffect26, useState as useState26 } from "react";
-import { Fragment as Fragment7, jsx as jsx59, jsxs as jsxs38 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx60, jsxs as jsxs38 } from "react/jsx-runtime";
 var TableFilterButton = ({
   filterType,
   column
@@ -12945,21 +12957,21 @@ var TableFilterButton = ({
   useEffect26(() => {
     setFilterValue(columnFilterValue);
   }, [columnFilterValue]);
-  return /* @__PURE__ */ jsx59(
+  return /* @__PURE__ */ jsx60(
     Menu,
     {
       trigger: ({ toggleOpen }, ref) => /* @__PURE__ */ jsxs38("div", { ref, className: "relative", children: [
-        /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx60(
           Button,
           {
             layout: "icon",
             color: "neutral",
             size: "tiny",
             onClick: toggleOpen,
-            children: /* @__PURE__ */ jsx59(FilterIcon, { className: "size-4" })
+            children: /* @__PURE__ */ jsx60(FilterIcon, { className: "size-4" })
           }
         ),
-        hasFilter && /* @__PURE__ */ jsx59(
+        hasFilter && /* @__PURE__ */ jsx60(
           "div",
           {
             className: "absolute top-0.5 right-0.5 w-2 h-2 rounded-full bg-primary pointer-events-none",
@@ -12968,8 +12980,8 @@ var TableFilterButton = ({
         )
       ] }),
       children: ({ close }) => /* @__PURE__ */ jsxs38("div", { className: "flex-col-1 p-2 items-start font-normal text-menu-text", children: [
-        /* @__PURE__ */ jsx59("h4", { className: "typography-label-md-semibold", children: translation("filter") }),
-        filterType === "text" && /* @__PURE__ */ jsx59(
+        /* @__PURE__ */ jsx60("h4", { className: "typography-label-md-semibold", children: translation("filter") }),
+        filterType === "text" && /* @__PURE__ */ jsx60(
           Input,
           {
             value: filterValue ?? "",
@@ -12980,7 +12992,7 @@ var TableFilterButton = ({
           }
         ),
         filterType === "range" && /* @__PURE__ */ jsxs38("div", { className: "flex-row-2 items-center", children: [
-          /* @__PURE__ */ jsx59(
+          /* @__PURE__ */ jsx60(
             Input,
             {
               value: filterValue?.[0] ?? "",
@@ -12993,8 +13005,8 @@ var TableFilterButton = ({
               className: "h-10 input-indicator-hidden w-40"
             }
           ),
-          /* @__PURE__ */ jsx59("span", { className: "font-bold", children: "-" }),
-          /* @__PURE__ */ jsx59(
+          /* @__PURE__ */ jsx60("span", { className: "font-bold", children: "-" }),
+          /* @__PURE__ */ jsx60(
             Input,
             {
               value: filterValue?.[1] ?? "",
@@ -13008,8 +13020,8 @@ var TableFilterButton = ({
             }
           )
         ] }),
-        filterType === "dateRange" && /* @__PURE__ */ jsxs38(Fragment7, { children: [
-          /* @__PURE__ */ jsx59(
+        filterType === "dateRange" && /* @__PURE__ */ jsxs38(Fragment9, { children: [
+          /* @__PURE__ */ jsx60(
             Input,
             {
               value: filterValue?.[0] ? filterValue?.[0].toISOString().slice(0, 16) : "",
@@ -13022,7 +13034,7 @@ var TableFilterButton = ({
               className: "h-10 w-50"
             }
           ),
-          /* @__PURE__ */ jsx59(
+          /* @__PURE__ */ jsx60(
             Input,
             {
               value: filterValue?.[1] ? filterValue?.[1].toISOString().slice(0, 16) : "",
@@ -13037,11 +13049,11 @@ var TableFilterButton = ({
           )
         ] }),
         /* @__PURE__ */ jsxs38("div", { className: "flex-row-2 justify-end w-full", children: [
-          hasFilter && /* @__PURE__ */ jsx59(Button, { color: "negative", size: "small", onClick: () => {
+          hasFilter && /* @__PURE__ */ jsx60(Button, { color: "negative", size: "small", onClick: () => {
             column.setFilterValue(void 0);
             close();
           }, children: translation("remove") }),
-          /* @__PURE__ */ jsx59(Button, { size: "small", onClick: () => {
+          /* @__PURE__ */ jsx60(Button, { size: "small", onClick: () => {
             column.setFilterValue(filterValue);
             close();
           }, children: translation("apply") })
@@ -13052,7 +13064,7 @@ var TableFilterButton = ({
 };
 
 // src/components/table/Table.tsx
-import { jsx as jsx60, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx61, jsxs as jsxs39 } from "react/jsx-runtime";
 var Table = ({
   data,
   fillerRow,
@@ -13172,7 +13184,7 @@ var Table = ({
       minSize: 60,
       maxSize: 700,
       cell: ({ cell }) => {
-        return /* @__PURE__ */ jsx60(TableCell, { children: cell.getValue() });
+        return /* @__PURE__ */ jsx61(TableCell, { children: cell.getValue() });
       },
       ...defaultColumn
     },
@@ -13258,7 +13270,7 @@ var Table = ({
     return colSizes;
   }, [table.getState().columnSizingInfo, table.getState().columnSizing]);
   return /* @__PURE__ */ jsxs39("div", { ref, className: clsx48("flex-col-4", className), children: [
-    /* @__PURE__ */ jsx60("div", { className: clsx48("flex-col-0 w-full overflow-auto", tableContainerClassName), children: /* @__PURE__ */ jsxs39(
+    /* @__PURE__ */ jsx61("div", { className: clsx48("flex-col-0 w-full overflow-auto", tableContainerClassName), children: /* @__PURE__ */ jsxs39(
       "table",
       {
         ref: tableRef,
@@ -13268,7 +13280,7 @@ var Table = ({
           width: Math.floor(Math.max(table.getTotalSize() - columns.length, ref.current?.offsetWidth ?? table.getTotalSize()))
         },
         children: [
-          table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx60("colgroup", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx60(
+          table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx61("colgroup", { children: headerGroup.headers.map((header) => /* @__PURE__ */ jsx61(
             "col",
             {
               style: {
@@ -13279,15 +13291,15 @@ var Table = ({
             },
             header.id
           )) }, headerGroup.id)),
-          /* @__PURE__ */ jsx60("thead", { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx60("tr", { className: table.options.meta?.headerRowClassName, children: headerGroup.headers.map((header) => {
+          /* @__PURE__ */ jsx61("thead", { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx61("tr", { className: table.options.meta?.headerRowClassName, children: headerGroup.headers.map((header) => {
             return /* @__PURE__ */ jsxs39(
               "th",
               {
                 colSpan: header.colSpan,
                 className: clsx48("relative group", header.column.columnDef.meta?.className),
                 children: [
-                  /* @__PURE__ */ jsx60("div", { className: "flex-row-2 w-full", children: header.isPlaceholder ? null : /* @__PURE__ */ jsxs39("div", { className: "flex-row-1 items-center", children: [
-                    header.column.getCanSort() && /* @__PURE__ */ jsx60(
+                  /* @__PURE__ */ jsx61("div", { className: "flex-row-2 w-full", children: header.isPlaceholder ? null : /* @__PURE__ */ jsxs39("div", { className: "flex-row-1 items-center", children: [
+                    header.column.getCanSort() && /* @__PURE__ */ jsx61(
                       TableSortButton,
                       {
                         sortDirection: header.column.getIsSorted(),
@@ -13313,7 +13325,7 @@ var Table = ({
                         }
                       }
                     ),
-                    header.column.getCanFilter() && header.column.columnDef.meta?.filterType ? /* @__PURE__ */ jsx60(
+                    header.column.getCanFilter() && header.column.columnDef.meta?.filterType ? /* @__PURE__ */ jsx61(
                       TableFilterButton,
                       {
                         column: header.column,
@@ -13325,7 +13337,7 @@ var Table = ({
                       header.getContext()
                     )
                   ] }) }),
-                  header.column.getCanResize() && /* @__PURE__ */ jsx60(
+                  header.column.getCanResize() && /* @__PURE__ */ jsx61(
                     "div",
                     {
                       onMouseDown: header.getResizeHandler(),
@@ -13346,13 +13358,13 @@ var Table = ({
           }) }, headerGroup.id)) }),
           /* @__PURE__ */ jsxs39("tbody", { children: [
             table.getRowModel().rows.map((row) => {
-              return /* @__PURE__ */ jsx60(
+              return /* @__PURE__ */ jsx61(
                 "tr",
                 {
                   onClick: () => onRowClick?.(row, table),
                   className: table.options.meta?.bodyRowClassName,
                   children: row.getVisibleCells().map((cell) => {
-                    return /* @__PURE__ */ jsx60("td", { children: flexRender(
+                    return /* @__PURE__ */ jsx61("td", { children: flexRender(
                       cell.column.columnDef.cell,
                       cell.getContext()
                     ) }, cell.id);
@@ -13362,15 +13374,15 @@ var Table = ({
               );
             }),
             range(table.getState().pagination.pageSize - table.getRowModel().rows.length, { allowEmptyRange: true }).map((row, index) => {
-              return /* @__PURE__ */ jsx60("tr", { children: columns.map((column) => {
-                return /* @__PURE__ */ jsx60("td", { children: fillerRow ? fillerRow(column.id, table) : /* @__PURE__ */ jsx60(FillerRowElement, {}) }, column.id);
+              return /* @__PURE__ */ jsx61("tr", { children: columns.map((column) => {
+                return /* @__PURE__ */ jsx61("td", { children: fillerRow ? fillerRow(column.id, table) : /* @__PURE__ */ jsx61(FillerRowElement, {}) }, column.id);
               }) }, "filler-row-" + index);
             })
           ] })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx60("div", { className: "flex-row-2 justify-center", children: /* @__PURE__ */ jsx60(
+    /* @__PURE__ */ jsx61("div", { className: "flex-row-2 justify-center", children: /* @__PURE__ */ jsx61(
       Pagination,
       {
         pageIndex: table.getState().pagination.pageIndex,
@@ -13382,7 +13394,7 @@ var Table = ({
 };
 var TableUncontrolled = ({ data, ...props }) => {
   const [usedDate] = useOverwritableState(data);
-  return /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsx61(
     Table,
     {
       ...props,
@@ -13406,7 +13418,7 @@ var TableWithSelection = ({
       {
         id: selectionRowId,
         header: ({ table }) => {
-          return /* @__PURE__ */ jsx60(
+          return /* @__PURE__ */ jsx61(
             Checkbox,
             {
               checked: table.getIsAllRowsSelected(),
@@ -13419,7 +13431,7 @@ var TableWithSelection = ({
           );
         },
         cell: ({ row }) => {
-          return /* @__PURE__ */ jsx60(
+          return /* @__PURE__ */ jsx61(
             Checkbox,
             {
               disabled: !row.getCanSelect(),
@@ -13437,15 +13449,15 @@ var TableWithSelection = ({
       ...columns
     ];
   }, [columns, selectionRowId]);
-  return /* @__PURE__ */ jsx60(
+  return /* @__PURE__ */ jsx61(
     Table,
     {
       columns: columnsWithSelection,
       fillerRow: (columnId, table) => {
         if (columnId === selectionRowId) {
-          return /* @__PURE__ */ jsx60(Checkbox, { checked: false, disabled: true, className: "max-w-6" });
+          return /* @__PURE__ */ jsx61(Checkbox, { checked: false, disabled: true, className: "max-w-6" });
         }
-        return fillerRow ? fillerRow(columnId, table) : /* @__PURE__ */ jsx60(FillerRowElement, {});
+        return fillerRow ? fillerRow(columnId, table) : /* @__PURE__ */ jsx61(FillerRowElement, {});
       },
       state: {
         rowSelection,
@@ -13480,7 +13492,7 @@ var writeToClipboard = (text) => {
 
 // src/components/user-action/CopyToClipboardWrapper.tsx
 import { CheckIcon as CheckIcon2, Copy } from "lucide-react";
-import { jsx as jsx61, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs40 } from "react/jsx-runtime";
 var CopyToClipboardWrapper = ({
   children,
   textToCopy,
@@ -13545,14 +13557,14 @@ var CopyToClipboardWrapper = ({
             },
             children: [
               isShowingConfirmation && /* @__PURE__ */ jsxs40("div", { className: "flex-row-1", children: [
-                /* @__PURE__ */ jsx61(CheckIcon2, { size: 16, className: "text-positive" }),
+                /* @__PURE__ */ jsx62(CheckIcon2, { size: 16, className: "text-positive" }),
                 translation("copied")
               ] }),
               isShowingIndication && /* @__PURE__ */ jsxs40("div", { className: "flex-row-1 text-description", children: [
-                /* @__PURE__ */ jsx61(Copy, { size: 16 }),
+                /* @__PURE__ */ jsx62(Copy, { size: 16 }),
                 translation("clickToCopy")
               ] }),
-              /* @__PURE__ */ jsx61(
+              /* @__PURE__ */ jsx62(
                 "div",
                 {
                   className: clsx49(`absolute w-0 h-0`, triangleClasses[position]),
@@ -13569,7 +13581,7 @@ var CopyToClipboardWrapper = ({
 
 // src/components/user-action/DateAndTimePicker.tsx
 import clsx50 from "clsx";
-import { jsx as jsx62, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs41 } from "react/jsx-runtime";
 var DateTimePicker = ({
   value = /* @__PURE__ */ new Date(),
   start = subtractDuration(/* @__PURE__ */ new Date(), { years: 50 }),
@@ -13584,7 +13596,7 @@ var DateTimePicker = ({
   let dateDisplay;
   let timeDisplay;
   if (useDate) {
-    dateDisplay = /* @__PURE__ */ jsx62(
+    dateDisplay = /* @__PURE__ */ jsx63(
       DatePicker,
       {
         ...datePickerProps,
@@ -13598,7 +13610,7 @@ var DateTimePicker = ({
     );
   }
   if (useTime) {
-    timeDisplay = /* @__PURE__ */ jsx62(
+    timeDisplay = /* @__PURE__ */ jsx63(
       TimePicker,
       {
         ...timePickerProps,
@@ -13617,7 +13629,7 @@ var DateTimePicker = ({
 // src/components/user-action/ScrollPicker.tsx
 import { useCallback as useCallback13, useEffect as useEffect28, useState as useState29 } from "react";
 import clsx51 from "clsx";
-import { jsx as jsx63, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs42 } from "react/jsx-runtime";
 var up = 1;
 var down = -1;
 var ScrollPicker = ({
@@ -13756,7 +13768,7 @@ var ScrollPicker = ({
     }
     return clamp(1 - opacityValue / max);
   };
-  return /* @__PURE__ */ jsx63(
+  return /* @__PURE__ */ jsx64(
     "div",
     {
       className: "relative overflow-hidden",
@@ -13768,14 +13780,14 @@ var ScrollPicker = ({
         }
       },
       children: /* @__PURE__ */ jsxs42("div", { className: "absolute top-1/2 -translate-y-1/2 -translate-x-1/2 left-1/2", children: [
-        /* @__PURE__ */ jsx63(
+        /* @__PURE__ */ jsx64(
           "div",
           {
             className: "absolute z-[1] top-1/2 -translate-y-1/2 -translate-x-1/2 left-1/2 w-full min-w-[40px] border border-divider/50 border-y-2 border-x-0 ",
             style: { height: `${itemHeight}px` }
           }
         ),
-        /* @__PURE__ */ jsx63(
+        /* @__PURE__ */ jsx64(
           "div",
           {
             className: "flex-col-2 select-none",
@@ -13783,7 +13795,7 @@ var ScrollPicker = ({
               transform: `translateY(${-transition * (distance + itemHeight)}px)`,
               columnGap: `${distance}px`
             },
-            children: shownItems.map(({ name, index }, arrayIndex) => /* @__PURE__ */ jsx63(
+            children: shownItems.map(({ name, index }, arrayIndex) => /* @__PURE__ */ jsx64(
               "div",
               {
                 className: clsx51(
@@ -13816,7 +13828,7 @@ var ScrollPicker = ({
 import { useEffect as useEffect29, useMemo as useMemo8, useRef as useRef15, useState as useState30 } from "react";
 import { CalendarIcon } from "lucide-react";
 import clsx52 from "clsx";
-import { Fragment as Fragment8, jsx as jsx64, jsxs as jsxs43 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx65, jsxs as jsxs43 } from "react/jsx-runtime";
 var DateTimeInput = ({
   date,
   onValueChange,
@@ -13844,9 +13856,9 @@ var DateTimeInput = ({
   const cleanInputProps = { ...props };
   delete cleanInputProps["isShowingError"];
   delete cleanInputProps["setIsShowingError"];
-  return /* @__PURE__ */ jsxs43(Fragment8, { children: [
+  return /* @__PURE__ */ jsxs43(Fragment10, { children: [
     /* @__PURE__ */ jsxs43("div", { ...containerProps, className: clsx52("relative w-full", containerProps?.className), children: [
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx65(
         Input,
         {
           ...cleanInputProps,
@@ -13864,7 +13876,7 @@ var DateTimeInput = ({
           )
         }
       ),
-      /* @__PURE__ */ jsx64(
+      /* @__PURE__ */ jsx65(
         Button,
         {
           coloringStyle: "text",
@@ -13874,18 +13886,18 @@ var DateTimeInput = ({
           className: "absolute right-1 top-1/2 -translate-y-1/2",
           disabled: isReadOnly,
           onClick: () => setIsOpen((prevState) => !prevState),
-          children: /* @__PURE__ */ jsx64(CalendarIcon, { className: "size-5" })
+          children: /* @__PURE__ */ jsx65(CalendarIcon, { className: "size-5" })
         }
       )
     ] }),
-    /* @__PURE__ */ jsx64(Visibility, { isVisible: isOpen, children: /* @__PURE__ */ jsxs43(
+    /* @__PURE__ */ jsx65(Visibility, { isVisible: isOpen, children: /* @__PURE__ */ jsxs43(
       "div",
       {
         ref: containerRef,
         className: "absolute left-0 flex-col-3 rounded-lg shadow-xl border bg-surface-variant text-on-surface border-divider p-2",
         style: { zIndex },
         children: [
-          /* @__PURE__ */ jsx64(
+          /* @__PURE__ */ jsx65(
             DateTimePicker,
             {
               ...pickerProps,
@@ -13897,7 +13909,7 @@ var DateTimeInput = ({
             }
           ),
           /* @__PURE__ */ jsxs43("div", { className: "flex-row-2 justify-end", children: [
-            /* @__PURE__ */ jsx64(Visibility, { isVisible: !!onRemove, children: /* @__PURE__ */ jsx64(
+            /* @__PURE__ */ jsx65(Visibility, { isVisible: !!onRemove, children: /* @__PURE__ */ jsx65(
               Button,
               {
                 size: "medium",
@@ -13909,7 +13921,7 @@ var DateTimeInput = ({
                 children: translation("clear")
               }
             ) }),
-            /* @__PURE__ */ jsx64(
+            /* @__PURE__ */ jsx65(
               Button,
               {
                 size: "medium",
@@ -13931,7 +13943,7 @@ var DateTimeInputUncontrolled = ({
   ...props
 }) => {
   const [date, setDate] = useOverwritableState(useMemo8(() => initialDate ?? /* @__PURE__ */ new Date(), [initialDate]));
-  return /* @__PURE__ */ jsx64(
+  return /* @__PURE__ */ jsx65(
     DateTimeInput,
     {
       ...props,
@@ -13952,7 +13964,7 @@ var DateTimeInputUncontrolled = ({
 import { useId as useId11 } from "react";
 import { forwardRef as forwardRef9, useState as useState31 } from "react";
 import clsx53 from "clsx";
-import { jsx as jsx65, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs44 } from "react/jsx-runtime";
 var InsideLabelInput = forwardRef9(function InsideLabelInput2({
   id: customId,
   label,
@@ -13963,7 +13975,7 @@ var InsideLabelInput = forwardRef9(function InsideLabelInput2({
   const generatedId = useId11();
   const id = customId ?? generatedId;
   return /* @__PURE__ */ jsxs44("div", { className: clsx53("relative"), children: [
-    /* @__PURE__ */ jsx65(
+    /* @__PURE__ */ jsx66(
       Input,
       {
         ...props,
@@ -13981,7 +13993,7 @@ var InsideLabelInput = forwardRef9(function InsideLabelInput2({
         }
       }
     ),
-    /* @__PURE__ */ jsx65(
+    /* @__PURE__ */ jsx66(
       "label",
       {
         id: id + "-label",
@@ -14003,7 +14015,7 @@ var InsideLabelInputUncontrolled = ({
   ...props
 }) => {
   const [value, setValue] = useOverwritableState(initialValue, props.onChangeText);
-  return /* @__PURE__ */ jsx65(
+  return /* @__PURE__ */ jsx66(
     InsideLabelInput,
     {
       ...props,
@@ -14016,7 +14028,7 @@ var InsideLabelInputUncontrolled = ({
 // src/components/user-action/input/SearchBar.tsx
 import { Search } from "lucide-react";
 import { clsx as clsx54 } from "clsx";
-import { jsx as jsx66, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs45 } from "react/jsx-runtime";
 var SearchBar = ({
   onSearch,
   searchButtonProps,
@@ -14025,7 +14037,7 @@ var SearchBar = ({
 }) => {
   const translation = useHightideTranslation();
   return /* @__PURE__ */ jsxs45("div", { ...containerProps, className: clsx54("relative", containerProps?.className), children: [
-    /* @__PURE__ */ jsx66(
+    /* @__PURE__ */ jsx67(
       InputUncontrolled,
       {
         ...inputProps,
@@ -14033,7 +14045,7 @@ var SearchBar = ({
         className: clsx54("pr-10 w-full", inputProps.className)
       }
     ),
-    onSearch && /* @__PURE__ */ jsx66(
+    onSearch && /* @__PURE__ */ jsx67(
       Button,
       {
         ...searchButtonProps,
@@ -14043,7 +14055,7 @@ var SearchBar = ({
         coloringStyle: "text",
         onClick: (event) => onSearch(event),
         className: clsx54("absolute right-1 top-1/2 -translate-y-1/2", searchButtonProps?.className),
-        children: /* @__PURE__ */ jsx66(Search, { className: "w-full h-full" })
+        children: /* @__PURE__ */ jsx67(Search, { className: "w-full h-full" })
       }
     )
   ] });
@@ -14053,7 +14065,7 @@ var SearchBar = ({
 import { forwardRef as forwardRef10, useEffect as useEffect30, useImperativeHandle as useImperativeHandle4, useRef as useRef16, useState as useState32 } from "react";
 import { Pencil } from "lucide-react";
 import clsx55 from "clsx";
-import { jsx as jsx67, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs46 } from "react/jsx-runtime";
 var ToggleableInput = forwardRef10(function ToggleableInput2({
   value,
   initialState = "display",
@@ -14069,7 +14081,7 @@ var ToggleableInput = forwardRef10(function ToggleableInput2({
     }
   }, [isEditing]);
   return /* @__PURE__ */ jsxs46("div", { className: clsx55("relative flex-row-2", { "flex-1": isEditing }), children: [
-    /* @__PURE__ */ jsx67(
+    /* @__PURE__ */ jsx68(
       Input,
       {
         ...props,
@@ -14096,8 +14108,8 @@ var ToggleableInput = forwardRef10(function ToggleableInput2({
       }
     ),
     !isEditing && /* @__PURE__ */ jsxs46("div", { className: "absolute left-0 flex-row-2 items-center pointer-events-none touch-none w-full overflow-hidden", children: [
-      /* @__PURE__ */ jsx67("span", { className: clsx55(" truncate"), children: value }),
-      /* @__PURE__ */ jsx67(Pencil, { className: clsx55(`size-force-4`, { "text-transparent": isEditing }) })
+      /* @__PURE__ */ jsx68("span", { className: clsx55(" truncate"), children: value }),
+      /* @__PURE__ */ jsx68(Pencil, { className: clsx55(`size-force-4`, { "text-transparent": isEditing }) })
     ] })
   ] });
 });
@@ -14107,7 +14119,7 @@ var ToggleableInputUncontrolled = ({
   ...restProps
 }) => {
   const [value, setValue] = useOverwritableState(initialValue, onChangeText);
-  return /* @__PURE__ */ jsx67(
+  return /* @__PURE__ */ jsx68(
     ToggleableInput,
     {
       value,
@@ -14121,7 +14133,7 @@ var ToggleableInputUncontrolled = ({
 import { useRef as useRef17 } from "react";
 import { useImperativeHandle as useImperativeHandle5 } from "react";
 import { forwardRef as forwardRef11 } from "react";
-import { jsx as jsx68 } from "react/jsx-runtime";
+import { jsx as jsx69 } from "react/jsx-runtime";
 var FocusTrap = forwardRef11(function FocusTrap2({
   active = true,
   initialFocus,
@@ -14131,7 +14143,7 @@ var FocusTrap = forwardRef11(function FocusTrap2({
   const innerRef = useRef17(null);
   useImperativeHandle5(forwardedRef, () => innerRef.current);
   useFocusTrap({ container: innerRef, active, initialFocus, focusFirst });
-  return /* @__PURE__ */ jsx68("div", { ref: innerRef, ...props });
+  return /* @__PURE__ */ jsx69("div", { ref: innerRef, ...props });
 });
 
 // src/components/utils/Transition.tsx