@dbcdk/react-components 0.0.98 → 0.0.102

package/dist/index.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var React20 = require('react');
+var React19 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var lucideReact = require('lucide-react');
 var reactDom = require('react-dom');
@@ -23,7 +23,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React20__namespace = /*#__PURE__*/_interopNamespace(React20);
+var React19__namespace = /*#__PURE__*/_interopNamespace(React19);
 
 // src/components/stack/Stack.module.css
 var Stack_default = {
@@ -43,7 +43,7 @@ var Stack_default = {
   mobileJustifyBetween: "Stack_mobileJustifyBetween",
   mobileWrap: "Stack_mobileWrap"
 };
-var Stack = React20.forwardRef(function Stack2({
+var Stack = React19.forwardRef(function Stack2({
   as,
   direction,
   gap,
@@ -82,7 +82,7 @@ var Stack = React20.forwardRef(function Stack2({
 var Tooltip_default = {
   bubble: "Tooltip_bubble"
 };
-var TooltipContext = React20.createContext(null);
+var TooltipContext = React19.createContext(null);
 var VIEWPORT_PADDING = 8;
 var SHOW_DELAY_MS = 500;
 function clamp(n, min, max) {
@@ -134,9 +134,9 @@ function shallowEqualActive(a, b) {
   return a.id === b.id && a.open === b.open && a.content === b.content && a.placement === b.placement && a.offset === b.offset && a.triggerEl === b.triggerEl;
 }
 function TooltipProvider({ children }) {
-  const [active, setActive] = React20.useState(null);
-  const showTimerRef = React20.useRef(null);
-  const show = React20.useCallback((next) => {
+  const [active, setActive] = React19.useState(null);
+  const showTimerRef = React19.useRef(null);
+  const show = React19.useCallback((next) => {
     if (showTimerRef.current) clearTimeout(showTimerRef.current);
     showTimerRef.current = setTimeout(() => {
       showTimerRef.current = null;
@@ -146,7 +146,7 @@ function TooltipProvider({ children }) {
       });
     }, SHOW_DELAY_MS);
   }, []);
-  const hide = React20.useCallback((id) => {
+  const hide = React19.useCallback((id) => {
     if (showTimerRef.current) {
       clearTimeout(showTimerRef.current);
       showTimerRef.current = null;
@@ -156,34 +156,34 @@ function TooltipProvider({ children }) {
       return null;
     });
   }, []);
-  const update = React20.useCallback((id, patch) => {
+  const update = React19.useCallback((id, patch) => {
     setActive((curr) => {
       if (!curr || curr.id !== id) return curr;
       const proposed = { ...curr, ...patch };
       return shallowEqualActive(curr, proposed) ? curr : proposed;
     });
   }, []);
-  const value = React20.useMemo(() => ({ show, hide, update, active }), [show, hide, update, active]);
+  const value = React19.useMemo(() => ({ show, hide, update, active }), [show, hide, update, active]);
   return /* @__PURE__ */ jsxRuntime.jsxs(TooltipContext.Provider, { value, children: [
     children,
     /* @__PURE__ */ jsxRuntime.jsx(TooltipLayer, {})
   ] });
 }
 function TooltipLayer() {
-  const ctx = React20.useContext(TooltipContext);
+  const ctx = React19.useContext(TooltipContext);
   const active = ctx == null ? void 0 : ctx.active;
-  const bubbleRef = React20.useRef(null);
-  const [mounted, setMounted] = React20.useState(false);
-  const [open, setOpen] = React20.useState(false);
-  const [visible, setVisible] = React20.useState(false);
-  const [placement, setPlacement] = React20.useState("top");
-  const [pos, setPos] = React20.useState({ top: 0, left: 0 });
-  const lastPlacementRef = React20.useRef("top");
-  const lastPosRef = React20.useRef({ top: 0, left: 0 });
-  const lastActiveIdRef = React20.useRef(null);
-  const rafRef = React20.useRef(null);
-  React20.useEffect(() => setMounted(true), []);
-  const recompute = React20.useCallback(() => {
+  const bubbleRef = React19.useRef(null);
+  const [mounted, setMounted] = React19.useState(false);
+  const [open, setOpen] = React19.useState(false);
+  const [visible, setVisible] = React19.useState(false);
+  const [placement, setPlacement] = React19.useState("top");
+  const [pos, setPos] = React19.useState({ top: 0, left: 0 });
+  const lastPlacementRef = React19.useRef("top");
+  const lastPosRef = React19.useRef({ top: 0, left: 0 });
+  const lastActiveIdRef = React19.useRef(null);
+  const rafRef = React19.useRef(null);
+  React19.useEffect(() => setMounted(true), []);
+  const recompute = React19.useCallback(() => {
     if (!(active == null ? void 0 : active.open)) return;
     const trigger = active.triggerEl;
     const bubble = bubbleRef.current;
@@ -232,13 +232,13 @@ function TooltipLayer() {
     }
     if (!visible) setVisible(true);
   }, [active == null ? void 0 : active.open, active == null ? void 0 : active.triggerEl, active == null ? void 0 : active.placement, active == null ? void 0 : active.offset, visible]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     const nextOpen = !!(active == null ? void 0 : active.open);
     setOpen((prev) => prev === nextOpen ? prev : nextOpen);
     if (nextOpen) setVisible(false);
     if (!nextOpen) lastActiveIdRef.current = null;
   }, [active == null ? void 0 : active.open]);
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     var _a;
     const id = (_a = active == null ? void 0 : active.id) != null ? _a : null;
     if (!id) return;
@@ -255,7 +255,7 @@ function TooltipLayer() {
       }
     };
   }, [active == null ? void 0 : active.id, recompute]);
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     if (!open) return;
     if (rafRef.current) cancelAnimationFrame(rafRef.current);
     rafRef.current = requestAnimationFrame(recompute);
@@ -276,7 +276,7 @@ function TooltipLayer() {
       ro.disconnect();
     };
   }, [open, recompute, active == null ? void 0 : active.triggerEl]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!open || !active) return;
     const onKeyDown = (e) => {
       if (e.key === "Escape") ctx.hide(active.id);
@@ -308,7 +308,7 @@ function TooltipLayer() {
 
 // src/components/overlay/tooltip/useTooltipTrigger.tsx
 function useTooltipTrigger(options) {
-  const ctx = React20.useContext(TooltipContext);
+  const ctx = React19.useContext(TooltipContext);
   if (!ctx) throw new Error("useTooltipTrigger must be used within <TooltipProvider>.");
   const {
     content,
@@ -321,21 +321,21 @@ function useTooltipTrigger(options) {
     focusOpenMode = "focus-visible",
     closeOnPointerDown = true
   } = options;
-  const id = React20.useId();
-  const triggerElRef = React20.useRef(null);
+  const id = React19.useId();
+  const triggerElRef = React19.useRef(null);
   const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = React19.useState(defaultOpen);
   const isOpen = isControlled ? !!open : uncontrolledOpen;
-  const openTimer = React20.useRef(null);
-  const closeTimer = React20.useRef(null);
+  const openTimer = React19.useRef(null);
+  const closeTimer = React19.useRef(null);
   const clearTimers = () => {
     if (openTimer.current) window.clearTimeout(openTimer.current);
     if (closeTimer.current) window.clearTimeout(closeTimer.current);
     openTimer.current = null;
     closeTimer.current = null;
   };
-  const lastSentRef = React20.useRef(null);
-  const show = React20.useCallback(() => {
+  const lastSentRef = React19.useRef(null);
+  const show = React19.useCallback(() => {
     if (!content) return;
     ctx.show({
       id,
@@ -346,17 +346,17 @@ function useTooltipTrigger(options) {
     });
     lastSentRef.current = { content, placement, offset };
   }, [ctx, id, content, placement, offset]);
-  const hide = React20.useCallback(() => {
+  const hide = React19.useCallback(() => {
     ctx.hide(id);
   }, [ctx, id]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!isOpen) {
       hide();
       return;
     }
     show();
   }, [isOpen, show, hide]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a;
     if (!isOpen) return;
     if (((_a = ctx.active) == null ? void 0 : _a.id) !== id) return;
@@ -426,7 +426,6 @@ var Button_default = {
   rounded: "Button_rounded",
   link: "Button_link",
   icon: "Button_icon",
-  xs: "Button_xs",
   sm: "Button_sm",
   lg: "Button_lg",
   fullWidth: "Button_fullWidth",
@@ -437,7 +436,8 @@ var Button_default = {
   active: "Button_active",
   success: "Button_success",
   danger: "Button_danger",
-  inline: "Button_inline"
+  inline: "Button_inline",
+  xs: "Button_xs"
 };
 function cx(...parts) {
   return parts.filter(Boolean).join(" ");
@@ -451,7 +451,7 @@ function mergeRefs(...refs) {
     }
   };
 }
-var Button = React20__namespace.forwardRef(function Button2({
+var Button = React19__namespace.forwardRef(function Button2({
   variant = "outlined",
   shape = "default",
   size = "md",
@@ -480,8 +480,8 @@ var Button = React20__namespace.forwardRef(function Button2({
     userClassName
   );
   const tooltipEnabled = Boolean(tooltip);
-  const childRef = isLink && React20__namespace.isValidElement(children) ? (_a = children.ref) != null ? _a : null : null;
-  const mergedRef = React20__namespace.useMemo(() => mergeRefs(childRef, ref), [childRef, ref]);
+  const childRef = isLink && React19__namespace.isValidElement(children) ? (_a = children.ref) != null ? _a : null : null;
+  const mergedRef = React19__namespace.useMemo(() => mergeRefs(childRef, ref), [childRef, ref]);
   const { triggerProps, id: tooltipId } = useTooltipTrigger({
     content: tooltipEnabled ? tooltip : null,
     placement: tooltipPlacement,
@@ -498,7 +498,7 @@ var Button = React20__namespace.forwardRef(function Button2({
     loading && /* @__PURE__ */ jsxRuntime.jsx("span", { style: { display: "flex", opacity: 0.5 }, className: "spin", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LoaderCircle, {}) })
   ] });
   let buttonEl;
-  if (isLink && React20__namespace.isValidElement(children)) {
+  if (isLink && React19__namespace.isValidElement(children)) {
     const childClassName = typeof children.props.className === "string" ? children.props.className : "";
     const { disabled, onClick, ...linkButtonProps } = buttonProps;
     const handleClick = (e) => {
@@ -508,7 +508,7 @@ var Button = React20__namespace.forwardRef(function Button2({
       }
       onClick == null ? void 0 : onClick(e);
     };
-    buttonEl = React20__namespace.cloneElement(children, {
+    buttonEl = React19__namespace.cloneElement(children, {
       ...linkButtonProps,
       ref: mergedRef,
       className: cx(childClassName, computedClassName, Button_default.buttonLink),
@@ -691,11 +691,11 @@ function getDeviceSize(width) {
   return "desktop";
 }
 function useDeviceSize() {
-  const [deviceSize, setDeviceSize] = React20.useState(() => {
+  const [deviceSize, setDeviceSize] = React19.useState(() => {
     if (typeof window === "undefined") return "desktop";
     return getDeviceSize(window.innerWidth);
   });
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     const mediaQueries = [
       window.matchMedia(`(max-width: ${BREAKPOINTS.tablet - 1}px)`),
       window.matchMedia(
@@ -804,7 +804,8 @@ function Headline({
   icon,
   tone,
   variant,
-  allowWrap = true
+  allowWrap = true,
+  id
 }) {
   const Tag = `h${size}`;
   const containerClassName = [Headline_default.headlineContainer, tone ? Headline_default[`tone-${tone}`] : ""].filter(Boolean).join(" ");
@@ -820,6 +821,7 @@ function Headline({
       /* @__PURE__ */ jsxRuntime.jsxs(
         Tag,
         {
+          id,
           style: {
             "--font-weight": weight,
             "--marker-color": severity ? SeverityBgColor[severity] : void 0
@@ -888,7 +890,7 @@ function parseMinWidthPx(minWidth, elForEm) {
   }
   return 0;
 }
-var Popover = React20.forwardRef(function Popover2({
+var Popover = React19.forwardRef(function Popover2({
   trigger: Trigger,
   children,
   open,
@@ -908,39 +910,39 @@ var Popover = React20.forwardRef(function Popover2({
   anchorRef,
   overlayRef
 }, ref) {
-  const internalId = React20.useId();
+  const internalId = React19.useId();
   const resolvedContentId = contentId != null ? contentId : `popover-${internalId}`;
   const isControlled = open !== void 0;
-  const [uncontrolledOpen, setUncontrolledOpen] = React20.useState(defaultOpen);
+  const [uncontrolledOpen, setUncontrolledOpen] = React19.useState(defaultOpen);
   const isOpen = isControlled ? !!open : uncontrolledOpen;
-  const [pos, setPos] = React20.useState({ top: 0, left: 0 });
-  const [positioned, setPositioned] = React20.useState(false);
-  const [triggerWidth, setTriggerWidth] = React20.useState(null);
-  const containerRef = React20.useRef(null);
-  const contentRef = React20.useRef(null);
-  const triggerElRef = React20.useRef(null);
-  const lastCloseReasonRef = React20.useRef("unknown");
-  const [mounted, setMounted] = React20.useState(false);
-  React20.useEffect(() => setMounted(true), []);
-  const setOpen = React20.useCallback(
+  const [pos, setPos] = React19.useState({ top: 0, left: 0 });
+  const [positioned, setPositioned] = React19.useState(false);
+  const [triggerWidth, setTriggerWidth] = React19.useState(null);
+  const containerRef = React19.useRef(null);
+  const contentRef = React19.useRef(null);
+  const triggerElRef = React19.useRef(null);
+  const lastCloseReasonRef = React19.useRef("unknown");
+  const [mounted, setMounted] = React19.useState(false);
+  React19.useEffect(() => setMounted(true), []);
+  const setOpen = React19.useCallback(
     (next) => {
       if (!isControlled) setUncontrolledOpen(next);
       onOpenChange == null ? void 0 : onOpenChange(next);
     },
     [isControlled, onOpenChange]
   );
-  const openPopover = React20.useCallback(() => {
+  const openPopover = React19.useCallback(() => {
     setPositioned(false);
     setOpen(true);
   }, [setOpen]);
-  const closePopover = React20.useCallback(
+  const closePopover = React19.useCallback(
     (reason = "api") => {
       lastCloseReasonRef.current = reason;
       setOpen(false);
     },
     [setOpen]
   );
-  const togglePopover = React20.useCallback(
+  const togglePopover = React19.useCallback(
     (e) => {
       var _a, _b;
       triggerElRef.current = (_b = (_a = anchorRef == null ? void 0 : anchorRef.current) != null ? _a : e.currentTarget) != null ? _b : containerRef.current;
@@ -949,7 +951,7 @@ var Popover = React20.forwardRef(function Popover2({
     },
     [isOpen, closePopover, openPopover, anchorRef]
   );
-  React20.useImperativeHandle(
+  React19.useImperativeHandle(
     ref,
     () => ({
       close: () => closePopover("api"),
@@ -958,7 +960,7 @@ var Popover = React20.forwardRef(function Popover2({
     }),
     [closePopover, openPopover, isOpen]
   );
-  const computeAndSetPosition = React20.useCallback(() => {
+  const computeAndSetPosition = React19.useCallback(() => {
     var _a, _b;
     const content = contentRef.current;
     if (!content) return;
@@ -1023,11 +1025,11 @@ var Popover = React20.forwardRef(function Popover2({
     setPos({ top: clampedTop, left: clampedLeft });
     setPositioned(true);
   }, [anchorRef, edgeBuffer, viewportPadding, minWidth, matchTriggerWidth]);
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     if (!isOpen) return;
     computeAndSetPosition();
   }, [isOpen, computeAndSetPosition]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a, _b, _c;
     if (!isOpen) return;
     const content = contentRef.current;
@@ -1067,7 +1069,7 @@ var Popover = React20.forwardRef(function Popover2({
       resizeObserver == null ? void 0 : resizeObserver.disconnect();
     };
   }, [isOpen, closePopover, computeAndSetPosition, autoFocusContent, anchorRef]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a, _b;
     if (isOpen) return;
     if (!returnFocus) return;
@@ -1075,7 +1077,7 @@ var Popover = React20.forwardRef(function Popover2({
     (_b = (_a = triggerElRef.current) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
   }, [isOpen, returnFocus]);
   const icon = isOpen ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { className: "dbc-muted-text", size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "dbc-muted-text", size: 20 });
-  const setOverlayRef = React20__namespace.useCallback(
+  const setOverlayRef = React19__namespace.useCallback(
     (node) => {
       assignRef(overlayRef, node);
     },
@@ -1143,10 +1145,10 @@ function NavBar({
   activeLink,
   size
 }) {
-  const [mobileOpen, setMobileOpen] = React20.useState(false);
+  const [mobileOpen, setMobileOpen] = React19.useState(false);
   const deviceSize = useDeviceSize();
   const isMobile = deviceSize === "mobile";
-  const navRef = React20.useRef(null);
+  const navRef = React19.useRef(null);
   const navLinks = items == null ? void 0 : items.filter((i) => i.enabled !== false).map((item, id) => {
     const { component: Component, label, icon, href, active, external } = item;
     const isActive = activeLink ? href === activeLink : Boolean(active);
@@ -1259,12 +1261,12 @@ function Avatar({
     "--text": SeverityTextColor[color],
     "--size": fullWidth ? "100%" : sizes[size]
   };
-  const pathId = React20__namespace.useId();
+  const pathId = React19__namespace.useId();
   const renderImage = () => {
     if (image) {
-      if (React20__namespace.isValidElement(image)) {
+      if (React19__namespace.isValidElement(image)) {
         const mergedClass = [image.props.className, Avatar_default.image].filter(Boolean).join(" ");
-        return React20__namespace.cloneElement(image, { className: mergedClass });
+        return React19__namespace.cloneElement(image, { className: mergedClass });
       }
       return /* @__PURE__ */ jsxRuntime.jsx("span", { className: Avatar_default.imageSlot, children: image });
     }
@@ -1436,9 +1438,9 @@ function Checkbox({
   id,
   "data-cy": dataCy
 }) {
-  const [internal, setInternal] = React20.useState(false);
+  const [internal, setInternal] = React19.useState(false);
   const isChecked = controlled != null ? controlled : internal;
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const controlId = id != null ? id : `checkbox-${generatedId}`;
   const toggle = (e) => {
     if (disabled) return;
@@ -1527,7 +1529,7 @@ function RadioButton({
   id,
   "data-cy": dataCy
 }) {
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const controlId = id != null ? id : `radio-${generatedId}`;
   const isChecked = selectedValue !== void 0 ? selectedValue === value : Boolean(checked);
   const content = /* @__PURE__ */ jsxRuntime.jsxs("span", { className: RadioButtons_default.container, "data-cy": dataCy, children: [
@@ -1587,9 +1589,9 @@ var INTERACTIVE_SELECTOR = 'a:not([disabled]), button:not([disabled]), [tabindex
 function getMenuItems(el) {
   return Array.from(el.querySelectorAll(INTERACTIVE_SELECTOR));
 }
-var MenuBase = React20__namespace.forwardRef(
+var MenuBase = React19__namespace.forwardRef(
   ({ children, className, itemRole = "menuitem", gap, onKeyDown, ...props }, ref) => {
-    const internalRef = React20__namespace.useRef(null);
+    const internalRef = React19__namespace.useRef(null);
     const handleKeyDown = (e) => {
       const ul = internalRef.current;
       if (!ul) return;
@@ -1632,16 +1634,16 @@ var MenuBase = React20__namespace.forwardRef(
   }
 );
 MenuBase.displayName = "Menu";
-var isInteractiveEl = (el) => React20__namespace.isValidElement(el) && (typeof el.type === "string" ? el.type === "a" || el.type === "button" : true);
+var isInteractiveEl = (el) => React19__namespace.isValidElement(el) && (typeof el.type === "string" ? el.type === "a" || el.type === "button" : true);
 function applyMenuItemPropsToElement(child, opts) {
   var _a, _b, _c, _d;
   const { active, selected, disabled, role, tabIndex = 0, className } = opts;
   const childClass = [Menu_default.item, active ? Menu_default.active : "", selected ? Menu_default.selected : ""].filter(Boolean).join(" ");
-  const nextImmediate = React20__namespace.cloneElement(child, {
+  const nextImmediate = React19__namespace.cloneElement(child, {
     className: [child.props.className, Menu_default.interactiveChild, className].filter(Boolean).join(" ")
   });
   if (typeof child.type === "string" && (child.type === "a" || child.type === "button")) {
-    return React20__namespace.cloneElement(child, {
+    return React19__namespace.cloneElement(child, {
       role: (_a = child.props.role) != null ? _a : role,
       tabIndex: (_b = child.props.tabIndex) != null ? _b : tabIndex,
       "aria-selected": selected || void 0,
@@ -1650,7 +1652,7 @@ function applyMenuItemPropsToElement(child, opts) {
       ...child.type === "button" ? { disabled } : {}
     });
   }
-  return React20__namespace.cloneElement(nextImmediate, {
+  return React19__namespace.cloneElement(nextImmediate, {
     role: (_c = nextImmediate.props.role) != null ? _c : role,
     tabIndex: (_d = nextImmediate.props.tabIndex) != null ? _d : tabIndex,
     "aria-selected": selected || void 0,
@@ -1659,7 +1661,7 @@ function applyMenuItemPropsToElement(child, opts) {
     disabled
   });
 }
-var MenuItem = React20__namespace.forwardRef(
+var MenuItem = React19__namespace.forwardRef(
   ({ children, active, selected, disabled, className, itemRole, variant, ...liProps }, ref) => {
     const resolvedRole = itemRole != null ? itemRole : "menuitem";
     const isBordered = variant === "bordered";
@@ -1697,7 +1699,7 @@ var MenuItem = React20__namespace.forwardRef(
   }
 );
 MenuItem.displayName = "Menu.Item";
-var MenuCheckItem = React20__namespace.forwardRef(
+var MenuCheckItem = React19__namespace.forwardRef(
   ({
     label,
     checked,
@@ -1763,7 +1765,7 @@ var MenuCheckItem = React20__namespace.forwardRef(
   }
 );
 MenuCheckItem.displayName = "Menu.CheckItem";
-var MenuRadioItem = React20__namespace.forwardRef(
+var MenuRadioItem = React19__namespace.forwardRef(
   ({ name, value, checked, disabled, label, onValueChange, className, ...liProps }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "li",
@@ -1803,7 +1805,7 @@ var MenuRadioItem = React20__namespace.forwardRef(
   }
 );
 MenuRadioItem.displayName = "Menu.RadioItem";
-var MenuSeparator = React20__namespace.forwardRef(
+var MenuSeparator = React19__namespace.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
@@ -1815,7 +1817,7 @@ var MenuSeparator = React20__namespace.forwardRef(
   )
 );
 MenuSeparator.displayName = "Menu.Separator";
-var MenuHeader = React20__namespace.forwardRef(
+var MenuHeader = React19__namespace.forwardRef(
   ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "li",
     {
@@ -1945,9 +1947,9 @@ function Chip({
   selected = false,
   onClose
 }) {
-  const [chipWidth, setChipWidth] = React20.useState(void 0);
-  const chipRef = React20.useRef(null);
-  React20.useEffect(() => {
+  const [chipWidth, setChipWidth] = React19.useState(void 0);
+  const chipRef = React19.useRef(null);
+  React19.useEffect(() => {
     if (chipRef.current) {
       setChipWidth(`${chipRef.current.offsetWidth}px`);
     }
@@ -2427,8 +2429,8 @@ function getFirstEnabledId(items) {
 }
 function normalizeFromChildren(children) {
   const items = [];
-  React20.Children.forEach(children, (child) => {
-    if (!React20.isValidElement(child)) return;
+  React19.Children.forEach(children, (child) => {
+    if (!React19.isValidElement(child)) return;
     const t = child.type;
     if ((t == null ? void 0 : t.__TABS_SLOT__) !== "Item") return;
     const props = child.props;
@@ -2458,24 +2460,24 @@ function Tabs({
   loading = false,
   children
 }) {
-  const uid = React20.useId();
-  const sourceTabs = React20.useMemo(() => {
+  const uid = React19.useId();
+  const sourceTabs = React19.useMemo(() => {
     if (tabs && tabs.length) return tabs;
     return normalizeFromChildren(children);
   }, [tabs, children]);
-  const visibleTabs = React20.useMemo(() => sourceTabs.filter((t) => !t.hidden), [sourceTabs]);
+  const visibleTabs = React19.useMemo(() => sourceTabs.filter((t) => !t.hidden), [sourceTabs]);
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = React20.useState(() => {
+  const [internalValue, setInternalValue] = React19.useState(() => {
     return defaultValue != null ? defaultValue : getFirstEnabledId(visibleTabs);
   });
   const currentValue = isControlled ? value : internalValue;
-  const activeIndex = React20.useMemo(() => {
+  const activeIndex = React19.useMemo(() => {
     if (!visibleTabs.length) return -1;
     const idx = visibleTabs.findIndex((t) => t.id === currentValue);
     return idx >= 0 ? idx : 0;
   }, [visibleTabs, currentValue]);
   const activeTab = activeIndex >= 0 ? visibleTabs[activeIndex] : void 0;
-  const setValue = React20.useCallback(
+  const setValue = React19.useCallback(
     (nextId) => {
       const idx = visibleTabs.findIndex((t) => t.id === nextId);
       const tab = idx >= 0 ? visibleTabs[idx] : void 0;
@@ -2485,7 +2487,7 @@ function Tabs({
     },
     [visibleTabs, isControlled, onValueChange]
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!visibleTabs.length) return;
     const current = currentValue;
     const stillValid = visibleTabs.some((t) => t.id === current && !t.disabled);
@@ -2494,7 +2496,7 @@ function Tabs({
     if (next === void 0) return;
     setValue(next);
   }, [visibleTabs, currentValue, setValue]);
-  const onKeyDownTab = React20.useCallback(
+  const onKeyDownTab = React19.useCallback(
     (e, index) => {
       var _a;
       const enabled = visibleTabs.filter((t) => !t.disabled);
@@ -2531,7 +2533,7 @@ function Tabs({
       "div",
       {
         className: [Tabs_default.headerContainer, disableTopPadding ? Tabs_default.disableTopPadding : ""].filter(Boolean).join(" "),
-        children: /* @__PURE__ */ jsxRuntime.jsx(Headline, { disableMargin: true, size: 2, subheader, addition, children: header })
+        children: /* @__PURE__ */ jsxRuntime.jsx(Headline, { disableMargin: true, size: 1, subheader, addition, children: header })
       }
     ) : null,
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: `${Tabs_default.tabs} ${Tabs_default[variant]} ${panelStyle ? Tabs_default.panelStyle : ""}`, children: [
@@ -2587,9 +2589,9 @@ function CollapsibleHeadline({
   weight = 400,
   ...headlineProps
 }) {
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const panelId = controls != null ? controls : generatedId;
-  const [internalExpanded, setInternalExpanded] = React20.useState(() => {
+  const [internalExpanded, setInternalExpanded] = React19.useState(() => {
     if (!storageKey || typeof window === "undefined") return expanded != null ? expanded : true;
     const stored = localStorage.getItem(storageKey);
     return stored !== null ? stored === "true" : expanded != null ? expanded : true;
@@ -2673,8 +2675,8 @@ function getSlotName(el) {
 function splitSlots(children) {
   const slots = {};
   const rest = [];
-  React20.Children.forEach(children, (child) => {
-    if (!React20.isValidElement(child)) {
+  React19.Children.forEach(children, (child) => {
+    if (!React19.isValidElement(child)) {
       if (child != null) rest.push(child);
       return;
     }
@@ -2783,12 +2785,12 @@ function Hyperlink(props) {
     inline ? "" : Hyperlink_default.block
   );
   if (asChild) {
-    const child = React20__namespace.Children.only(children);
-    if (!React20__namespace.isValidElement(child)) {
+    const child = React19__namespace.Children.only(children);
+    if (!React19__namespace.isValidElement(child)) {
       throw new Error("Hyperlink with asChild expects a single valid React element as its child.");
     }
     const childProps = (_a = child.props) != null ? _a : {};
-    return React20__namespace.cloneElement(child, {
+    return React19__namespace.cloneElement(child, {
       ...childProps,
       ...rest,
       className: cx2(childProps.className, linkClassName),
@@ -2823,15 +2825,15 @@ function Hyperlink(props) {
   );
 }
 
-// src/components/page-layout/components/layout-footer/LayoutFooter.module.css
-var LayoutFooter_default = {
-  footer: "LayoutFooter_footer",
-  inner: "LayoutFooter_inner",
-  brand: "LayoutFooter_brand",
-  logoRow: "LayoutFooter_logoRow",
-  meta: "LayoutFooter_meta",
-  part: "LayoutFooter_part",
-  links: "LayoutFooter_links"};
+// src/components/page-layout/components/footer/Footer.module.css
+var Footer_default = {
+  footer: "Footer_footer",
+  inner: "Footer_inner",
+  brand: "Footer_brand",
+  logoRow: "Footer_logoRow",
+  meta: "Footer_meta",
+  part: "Footer_part",
+  links: "Footer_links"};
 var DEFAULT_META_PARTS = [
   "Tempovej 7-11",
   "DK-2750 Ballerup",
@@ -2843,23 +2845,23 @@ var DEFAULT_LINKS = [
     label: "Kundeservice",
     href: "https://kundeservice.dbc.dk",
     external: true
-  },
-  {
-    label: "Cookies",
-    href: "/cookies"
   }
 ];
-function LayoutFooter({
+function Footer({
   links = DEFAULT_LINKS,
   metaParts = DEFAULT_META_PARTS,
+  version,
   extraLinks
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: LayoutFooter_default.footer, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: LayoutFooter_default.inner, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: LayoutFooter_default.brand, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: LayoutFooter_default.logoRow, children: /* @__PURE__ */ jsxRuntime.jsx(Logo, {}) }),
-      /* @__PURE__ */ jsxRuntime.jsx("address", { className: LayoutFooter_default.meta, children: metaParts.map((part) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: LayoutFooter_default.part, children: part }, part)) })
+  const displayMetaParts = version && metaParts.length > 0 ? metaParts.map(
+    (part, index) => index === metaParts.length - 1 ? `${part} \xB7 ${version}` : part
+  ) : metaParts;
+  return /* @__PURE__ */ jsxRuntime.jsx("footer", { className: Footer_default.footer, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_default.inner, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Footer_default.brand, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: Footer_default.logoRow, children: /* @__PURE__ */ jsxRuntime.jsx(Logo, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx("address", { className: Footer_default.meta, children: displayMetaParts.map((part) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: Footer_default.part, children: part }, part)) })
     ] }),
-    /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: LayoutFooter_default.links, "aria-label": "Footer navigation", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: Footer_default.links, "aria-label": "Footer navigation", children: [
       extraLinks && extraLinks.length > 0 && (extraLinks == null ? void 0 : extraLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: link }, index))),
       links.map((link) => /* @__PURE__ */ jsxRuntime.jsx("span", { children: /* @__PURE__ */ jsxRuntime.jsx(
         Hyperlink,
@@ -2937,7 +2939,7 @@ function mergeRefs2(...refs) {
     }
   };
 }
-var Input = React20.forwardRef(function Input2({
+var Input = React19.forwardRef(function Input2({
   label,
   error,
   helpText,
@@ -2971,10 +2973,10 @@ var Input = React20.forwardRef(function Input2({
   endAdornment,
   ...inputProps
 }, ref) {
-  const inputRef = React20.useRef(null);
-  const reactId = React20.useId();
+  const inputRef = React19.useRef(null);
+  const reactId = React19.useId();
   const inputId = id != null ? id : `input-${reactId}`;
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a;
     if (autoFocus) (_a = inputRef.current) == null ? void 0 : _a.focus();
   }, [autoFocus]);
@@ -3107,7 +3109,7 @@ var SearchBox_default = {
   suggestionCell: "SearchBox_suggestionCell",
   suggestionRowActive: "SearchBox_suggestionRowActive"
 };
-var SearchBox = React20.forwardRef(function SearchBoxInner({
+var SearchBox = React19.forwardRef(function SearchBoxInner({
   inputWidth,
   maxWidth,
   inputSize,
@@ -3134,24 +3136,24 @@ var SearchBox = React20.forwardRef(function SearchBoxInner({
   ...rest
 }, ref) {
   const isControlled = value !== void 0;
-  const [draft, setDraft] = React20.useState(() => isControlled ? String(value != null ? value : "") : "");
-  const [searchQuery, setSearchQuery] = React20.useState("");
-  const [activeIndex, setActiveIndex] = React20.useState(null);
-  const popoverRef = React20.useRef(null);
-  const internalInputRef = React20.useRef(null);
-  React20.useEffect(() => {
+  const [draft, setDraft] = React19.useState(() => isControlled ? String(value != null ? value : "") : "");
+  const [searchQuery, setSearchQuery] = React19.useState("");
+  const [activeIndex, setActiveIndex] = React19.useState(null);
+  const popoverRef = React19.useRef(null);
+  const internalInputRef = React19.useRef(null);
+  React19.useEffect(() => {
     if (typeof ref === "function") {
       ref(internalInputRef.current);
     } else if (ref) {
       ref.current = internalInputRef.current;
     }
   }, [ref]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!isControlled) return;
     const next = String(value != null ? value : "");
     if (next !== draft) setDraft(next);
   }, [value]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!onSearch) return;
     if (!debounce) {
       setSearchQuery(draft);
@@ -3164,7 +3166,7 @@ var SearchBox = React20.forwardRef(function SearchBoxInner({
     }, debounceMs);
     return () => clearTimeout(handler);
   }, [draft, onSearch, debounce, debounceMs]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     function handleKeyDown(event) {
       var _a;
       if (event.key === "k" && (event.metaKey || event.ctrlKey)) {
@@ -3177,14 +3179,14 @@ var SearchBox = React20.forwardRef(function SearchBoxInner({
       return () => window.removeEventListener("keydown", handleKeyDown);
     }
   }, [enableHotkey]);
-  const handleChange = React20__namespace.default.useCallback(
+  const handleChange = React19__namespace.default.useCallback(
     (e) => {
       setDraft(e.target.value);
       onChange == null ? void 0 : onChange(e);
     },
     [onChange]
   );
-  const handleSelect = React20__namespace.default.useCallback(
+  const handleSelect = React19__namespace.default.useCallback(
     (item) => {
       onSelect == null ? void 0 : onSelect(item);
       reset();
@@ -3198,16 +3200,16 @@ var SearchBox = React20.forwardRef(function SearchBoxInner({
     setActiveIndex(null);
     (_a = popoverRef.current) == null ? void 0 : _a.close();
   }
-  const handleClear = React20__namespace.default.useCallback(() => {
+  const handleClear = React19__namespace.default.useCallback(() => {
     var _a;
     reset();
     onSearch == null ? void 0 : onSearch("");
     (_a = internalInputRef.current) == null ? void 0 : _a.focus();
   }, [onSearch]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setActiveIndex(null);
   }, [result]);
-  const inputField = React20.useMemo(() => {
+  const inputField = React19.useMemo(() => {
     var _a;
     const inputProps = {
       ...rest,
@@ -3384,8 +3386,8 @@ function applyTheme(id) {
   document.documentElement.dataset.theme = id;
 }
 function useTheme(initialTheme = "system") {
-  const [theme, setTheme] = React20.useState(null);
-  React20.useEffect(() => {
+  const [theme, setTheme] = React19.useState(null);
+  React19.useEffect(() => {
     const themeFromDataAttributes = getTheme();
     let resolved = isThemeVariant(themeFromDataAttributes) ? themeFromDataAttributes : initialTheme;
     const fromCookie = getCookie(STORAGE_KEY);
@@ -3403,7 +3405,7 @@ function useTheme(initialTheme = "system") {
     setTheme(resolved);
     persistTheme(resolved);
   }, [initialTheme]);
-  const switchTheme = React20.useCallback((id) => {
+  const switchTheme = React19.useCallback((id) => {
     applyTheme(id);
     setTheme(id);
     persistTheme(id);
@@ -3449,6 +3451,10 @@ function Panel({
 var Card_default = {
   outerContainer: "Card_outerContainer",
   container: "Card_container",
+  elevationNone: "Card_elevationNone",
+  elevationXs: "Card_elevationXs",
+  elevationSm: "Card_elevationSm",
+  elevationMd: "Card_elevationMd",
   variantDefault: "Card_variantDefault",
   variantSubtle: "Card_variantSubtle",
   sm: "Card_sm",
@@ -3576,6 +3582,7 @@ function CardImpl({
   loading = false,
   variant = "default",
   size = "md",
+  elevation = "sm",
   headerMarker = true,
   headerIcon,
   headerAddition,
@@ -3592,6 +3599,7 @@ function CardImpl({
   width,
   headlineSize = 4
 }) {
+  var _a;
   const outerStyle = width ? {
     ["--width"]: `${width}%`,
     ["--gap-share"]: getGapShare(width)
@@ -3599,6 +3607,7 @@ function CardImpl({
   const mediaStyle = mediaWidth ? { ["--card-media-width"]: `${mediaWidth}px` } : void 0;
   const innerPlacementClass = getInnerPlacementClass(imgPlacement, Card_default);
   const variantClass = getVariantClass(variant, Card_default);
+  const elevationClass = (_a = Card_default[`elevation${elevation.charAt(0).toUpperCase()}${elevation.slice(1)}`]) != null ? _a : Card_default.elevationSm;
   const hasHeader = !!title || !!headerMeta;
   const showSection = !loading && (showSectionDivider || !!sectionTitle);
   const showBody = !loading && !!children;
@@ -3636,7 +3645,7 @@ function CardImpl({
     ] })
   ] });
   const cardContent = link ? /* @__PURE__ */ jsxRuntime.jsx(Hyperlink, { children: link }) : inner;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Card_default.outerContainer} ${Card_default[size]}`, style: outerStyle, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Card_default.container} ${variantClass}`, children: cardContent }) });
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Card_default.outerContainer} ${Card_default[size]}`, style: outerStyle, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Card_default.container} ${variantClass} ${elevationClass}`, children: cardContent }) });
 }
 var Card = Object.assign(CardImpl, {
   Meta: CardMeta,
@@ -3682,7 +3691,8 @@ var Page_default = {
   disableTopPadding: "Page_disableTopPadding",
   headerMain: "Page_headerMain",
   content: "Page_content",
-  disableContentBox: "Page_disableContentBox"
+  contentLoading: "Page_contentLoading",
+  contentBox: "Page_contentBox"
 };
 
 // src/components/breadcrumbs/Breadcrumbs.module.css
@@ -3693,7 +3703,7 @@ function Breadcrumbs({
   items,
   ...navProps
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Breadcrumbs_default.breadcrumbs, "aria-label": "breadcrumb", ...navProps, children: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(React20.Fragment, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("nav", { className: Breadcrumbs_default.breadcrumbs, "aria-label": "breadcrumb", ...navProps, children: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: items.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(React19.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
       item.icon && item.icon,
       item.onClick ? /* @__PURE__ */ jsxRuntime.jsx("button", { onClick: item.onClick, children: item.label }) : /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label })
@@ -3709,12 +3719,14 @@ function Page({
   headerAddition,
   breadcrumbs,
   disableContentBox,
+  contentBox = false,
   disableTopPadding = true,
   maxWidth,
   containScrolling = false,
   children,
   loading = false
 }) {
+  const showContentBox = contentBox && !disableContentBox;
   const maxWidthClass = maxWidth ? Page_default[`maxWidth${maxWidth.charAt(0).toUpperCase()}${maxWidth.slice(1)}`] : "";
   const hasHeadline = Boolean(header || subheader || headerAddition);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -3728,7 +3740,7 @@ function Page({
             Headline,
             {
               disableMargin: true,
-              size: 2,
+              size: 1,
               severity,
               icon: headerIcon,
               subheader,
@@ -3737,7 +3749,13 @@ function Page({
             }
           ) : null
         ] }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Page_default.content} ${disableContentBox ? Page_default.disableContentBox : ""}`, children: loading ? /* @__PURE__ */ jsxRuntime.jsx(SkeletonLoader, { type: "squares", rows: 1, columns: 1 }) : children })
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: `${Page_default.content} ${loading ? Page_default.contentLoading : ""} ${showContentBox ? Page_default.contentBox : ""}`,
+            children: loading ? /* @__PURE__ */ jsxRuntime.jsx(SkeletonLoader, { type: "squares", rows: 1, columns: 1 }) : children
+          }
+        )
       ]
     }
   );
@@ -3793,18 +3811,18 @@ function Pagination({
   showFirstLast = true,
   showGoToPage = true
 }) {
-  const popoverRef = React20.useRef(null);
-  const pageSizeRef = React20.useRef(null);
-  const formatNumber = React20.useCallback((value) => value.toLocaleString(NUMBER_LOCALE), []);
-  const totalPages = React20.useMemo(
+  const popoverRef = React19.useRef(null);
+  const pageSizeRef = React19.useRef(null);
+  const formatNumber = React19.useCallback((value) => value.toLocaleString(NUMBER_LOCALE), []);
+  const totalPages = React19.useMemo(
     () => Math.max(1, Math.ceil(itemsCount / Math.max(1, take))),
     [itemsCount, take]
   );
-  const currentPage = React20.useMemo(() => {
+  const currentPage = React19.useMemo(() => {
     const p = Math.floor(skip / Math.max(1, take)) + 1;
     return Math.min(Math.max(1, p), totalPages);
   }, [skip, take, totalPages]);
-  const emit = React20.useCallback(
+  const emit = React19.useCallback(
     (page, nextTake = take) => {
       const nextTotalPages = Math.max(1, Math.ceil(itemsCount / Math.max(1, nextTake)));
       const clampedPage = Math.min(Math.max(1, page), nextTotalPages);
@@ -3818,21 +3836,21 @@ function Pagination({
     },
     [onPageChange, take, itemsCount]
   );
-  const firstPage = React20.useCallback(() => emit(1), [emit]);
-  const lastPage = React20.useCallback(() => emit(totalPages), [emit, totalPages]);
-  const prevPage = React20.useCallback(() => emit(currentPage - 1), [emit, currentPage]);
-  const nextPage = React20.useCallback(() => emit(currentPage + 1), [emit, currentPage]);
-  const goToPage = React20.useCallback((page) => emit(page), [emit]);
+  const firstPage = React19.useCallback(() => emit(1), [emit]);
+  const lastPage = React19.useCallback(() => emit(totalPages), [emit, totalPages]);
+  const prevPage = React19.useCallback(() => emit(currentPage - 1), [emit, currentPage]);
+  const nextPage = React19.useCallback(() => emit(currentPage + 1), [emit, currentPage]);
+  const goToPage = React19.useCallback((page) => emit(page), [emit]);
   const canPrev = currentPage > 1;
   const canNext = currentPage < totalPages;
-  const rangeLabel = React20.useMemo(() => {
+  const rangeLabel = React19.useMemo(() => {
     if (itemsCount <= 0) return "0 af 0";
     const first = skip + 1;
     const last = Math.min(skip + take, itemsCount);
     return `${formatNumber(first)}\u2013${formatNumber(last)} af ${formatNumber(itemsCount)}`;
   }, [formatNumber, itemsCount, skip, take]);
-  const pages = React20.useMemo(() => Array.from({ length: totalPages }, (_, i) => i + 1), [totalPages]);
-  const handlePageSizeChange = React20.useCallback((size) => emit(1, size), [emit]);
+  const pages = React19.useMemo(() => Array.from({ length: totalPages }, (_, i) => i + 1), [totalPages]);
+  const handlePageSizeChange = React19.useCallback((size) => emit(1, size), [emit]);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Pagination_default.container, children: [
     showFirstLast && /* @__PURE__ */ jsxRuntime.jsx(
       Button,
@@ -3925,11 +3943,11 @@ function Pagination({
     )
   ] });
 }
-var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React20.useLayoutEffect : React20.useEffect;
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? React19.useLayoutEffect : React19.useEffect;
 function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop = false, watchRef } = {}) {
-  const [maxHeight, setMaxHeight] = React20.useState(min);
-  const raf = React20.useRef(null);
-  const measure = React20.useCallback(() => {
+  const [maxHeight, setMaxHeight] = React19.useState(min);
+  const raf = React19.useRef(null);
+  const measure = React19.useCallback(() => {
     if (typeof window === "undefined" || !ref.current) return;
     const el = ref.current;
     const rect = el.getBoundingClientRect();
@@ -3941,7 +3959,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
     const next = Math.max(min, Math.floor(window.innerHeight - bottomOffset - top));
     setMaxHeight((prev) => prev === next ? prev : next);
   }, [ref, bottomOffset, min, includeMarginTop]);
-  const scheduleMeasure = React20.useCallback(() => {
+  const scheduleMeasure = React19.useCallback(() => {
     if (typeof window === "undefined") return;
     if (raf.current != null) {
       cancelAnimationFrame(raf.current);
@@ -3954,7 +3972,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
   useIsomorphicLayoutEffect(() => {
     measure();
   }, [measure]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a;
     if (typeof window === "undefined" || !ref.current) return;
     const target = ref.current;
@@ -3987,7 +4005,7 @@ function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop =
       }
     };
   }, [ref, watchRef, scheduleMeasure]);
-  const style = React20.useMemo(
+  const style = React19.useMemo(
     () => ({
       maxHeight,
       overflow: "auto"
@@ -4172,7 +4190,7 @@ function useTableRowInteractions({
   onRowClick,
   onRowSelect
 }) {
-  const handleRowClick = React20.useCallback(
+  const handleRowClick = React19.useCallback(
     (e) => {
       var _a;
       const target = e.target;
@@ -4189,7 +4207,7 @@ function useTableRowInteractions({
     },
     [canSelect, isSelected, onRowClick, onRowSelect, row, rowId]
   );
-  const handleRowKeyDown = React20.useCallback(
+  const handleRowKeyDown = React19.useCallback(
     (e) => {
       if (!onRowClick) return;
       if (!shouldToggleOnKey(e.key)) return;
@@ -4306,7 +4324,7 @@ function TableRow({
         columns.map((column) => {
           var _a2, _b, _c, _d;
           const allowWrap = shouldAllowWrap(column.allowWrap, isSelected, viewMode);
-          const allowOverflow = column.allowOverflow;
+          column.allowOverflow;
           const cellValue = getCellDisplayValue(row, column);
           return /* @__PURE__ */ jsxRuntime.jsx(
             "td",
@@ -4326,7 +4344,7 @@ function TableRow({
                   className: Table_default.cellContent,
                   "data-align": (_c = column.align) != null ? _c : "left",
                   "data-vertical-align": (_d = column.verticalAlign) != null ? _d : "top",
-                  children: allowWrap || allowOverflow ? cellValue : /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellValueEllipsis, children: cellValue })
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: Table_default.cellValueEllipsis, children: cellValue })
                 }
               )
             },
@@ -4561,10 +4579,10 @@ function Table({
   onPageChange,
   ...rest
 }) {
-  const visibleColumns = React20.useMemo(() => getVisibleColumns(columns), [columns]);
-  const selectionInputName = React20.useId();
-  const internalTableRootRef = React20.useRef(null);
-  const tableRootRefWrapper = React20.useRef(tableRootRef);
+  const visibleColumns = React19.useMemo(() => getVisibleColumns(columns), [columns]);
+  const selectionInputName = React19.useId();
+  const internalTableRootRef = React19.useRef(null);
+  const tableRootRefWrapper = React19.useRef(tableRootRef);
   const hasSelection = Boolean(selectedRows && onRowSelect);
   const hasPagination = Boolean(onPageChange && (loading || data.length > 0));
   const paginationOffset = hasPagination ? 72 : 0;
@@ -4574,7 +4592,7 @@ function Table({
   });
   const fillViewportActive = fillViewport && containScrolling && maxHeight >= 500;
   const stickyTop = stickyHeader === "app-header" ? "var(--app-header-height, 60px)" : typeof stickyHeader === "number" ? `${stickyHeader}px` : void 0;
-  const setTableRootRef = React20.useCallback((node) => {
+  const setTableRootRef = React19.useCallback((node) => {
     internalTableRootRef.current = node;
     if (typeof tableRootRefWrapper.current === "function") {
       tableRootRefWrapper.current(node);
@@ -4582,7 +4600,7 @@ function Table({
       tableRootRefWrapper.current.current = node;
     }
   }, []);
-  const handlePageChange = React20.useCallback(
+  const handlePageChange = React19.useCallback(
     (e) => {
       onPageChange == null ? void 0 : onPageChange(e);
     },
@@ -4756,10 +4774,10 @@ var Textarea = function Textarea2({
   ...rest
 }) {
   const HEIGHT_BUFFER_PX = 2;
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const textareaId = id != null ? id : `textarea-${generatedId}`;
-  const textareaRef = React20.useRef(null);
-  const syncHeight = React20.useCallback(
+  const textareaRef = React19.useRef(null);
+  const syncHeight = React19.useCallback(
     (textarea) => {
       if (!adjustHeight) return;
       textarea.style.height = "auto";
@@ -4767,12 +4785,12 @@ var Textarea = function Textarea2({
     },
     [adjustHeight]
   );
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     const textarea = textareaRef.current;
     if (!textarea) return;
     syncHeight(textarea);
   }, [syncHeight, value, rows]);
-  const onInput = React20.useCallback(
+  const onInput = React19.useCallback(
     (e) => {
       const textarea = e.currentTarget;
       syncHeight(textarea);
@@ -4780,7 +4798,7 @@ var Textarea = function Textarea2({
     },
     [inputChanged, syncHeight]
   );
-  const inputField = React20.useMemo(
+  const inputField = React19.useMemo(
     () => /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
       {
@@ -4901,7 +4919,7 @@ var findExpandableParentChain = (targetHref, items) => {
   };
   return (_a = dfs(items, [])) != null ? _a : [];
 };
-var SidebarContext = React20.createContext({
+var SidebarContext = React19.createContext({
   defaultExpanded: null,
   expandedItems: /* @__PURE__ */ new Set(),
   activeQuery: "",
@@ -4939,20 +4957,20 @@ function SidebarProvider({
   initialCollapsed = false,
   initialSidebarCollapsed
 }) {
-  const [defaultExpanded, setDefaultExpanded] = React20.useState(null);
-  const [activeQuery, setActiveQuery] = React20.useState(initialQuery != null ? initialQuery : "");
-  const [wrapItemText, setWrapItemText] = React20.useState(false);
-  const [areItemsCollapsed, setItemsCollapsed] = React20.useState(initialCollapsed);
-  const [activeHref, setActiveHref] = React20.useState("");
-  const [expandedItems, setExpandedItems] = React20.useState(/* @__PURE__ */ new Set());
-  const itemsRef = React20.useRef(items);
-  React20.useEffect(() => {
+  const [defaultExpanded, setDefaultExpanded] = React19.useState(null);
+  const [activeQuery, setActiveQuery] = React19.useState(initialQuery != null ? initialQuery : "");
+  const [wrapItemText, setWrapItemText] = React19.useState(false);
+  const [areItemsCollapsed, setItemsCollapsed] = React19.useState(initialCollapsed);
+  const [activeHref, setActiveHref] = React19.useState("");
+  const [expandedItems, setExpandedItems] = React19.useState(/* @__PURE__ */ new Set());
+  const itemsRef = React19.useRef(items);
+  React19.useEffect(() => {
     itemsRef.current = items;
   }, [items]);
-  const [isSidebarCollapsed, setSidebarCollapsed] = React20.useState(
+  const [isSidebarCollapsed, setSidebarCollapsed] = React19.useState(
     initialSidebarCollapsed != null ? initialSidebarCollapsed : false
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (initialSidebarCollapsed !== void 0) return;
     try {
       const stored = window.localStorage.getItem(SIDEBAR_COLLAPSED_STORAGE_KEY);
@@ -4964,10 +4982,10 @@ function SidebarProvider({
     }
     setSidebarCollapsed(getBreakpoint(window.innerWidth) === "small");
   }, []);
-  const triggerExpandAll = React20.useCallback(() => setDefaultExpanded(true), []);
-  const resetExpandAll = React20.useCallback(() => setDefaultExpanded(null), []);
-  const setActiveLink = React20.useCallback((href) => setActiveHref(href), []);
-  const expandItem = React20.useCallback((href) => {
+  const triggerExpandAll = React19.useCallback(() => setDefaultExpanded(true), []);
+  const resetExpandAll = React19.useCallback(() => setDefaultExpanded(null), []);
+  const setActiveLink = React19.useCallback((href) => setActiveHref(href), []);
+  const expandItem = React19.useCallback((href) => {
     const h = normalizeHref(href);
     setExpandedItems((prev) => {
       if (prev.has(h)) return prev;
@@ -4976,7 +4994,7 @@ function SidebarProvider({
       return next;
     });
   }, []);
-  const collapseItem = React20.useCallback((href) => {
+  const collapseItem = React19.useCallback((href) => {
     const h = normalizeHref(href);
     setExpandedItems((prev) => {
       if (!prev.has(h)) return prev;
@@ -4985,11 +5003,11 @@ function SidebarProvider({
       return next;
     });
   }, []);
-  const isExpanded = React20.useCallback(
+  const isExpanded = React19.useCallback(
     (href) => expandedItems.has(normalizeHref(href)),
     [expandedItems]
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!activeHref) return;
     const currentItems = itemsRef.current;
     const parents = findExpandableParentChain(activeHref, currentItems);
@@ -5007,7 +5025,7 @@ function SidebarProvider({
       return changed ? next : prev;
     });
   }, [activeHref]);
-  const filteredItems = React20.useMemo(() => {
+  const filteredItems = React19.useMemo(() => {
     return activeQuery ? nestedFiltering(items, {
       keys: ["label", "tags"],
       includeParents: true,
@@ -5015,21 +5033,21 @@ function SidebarProvider({
       query: activeQuery
     }) : items;
   }, [items, activeQuery]);
-  const persistCollapsed = React20.useCallback((collapsed) => {
+  const persistCollapsed = React19.useCallback((collapsed) => {
     if (typeof window === "undefined") return;
     try {
       window.localStorage.setItem(SIDEBAR_COLLAPSED_STORAGE_KEY, JSON.stringify(collapsed));
     } catch {
     }
   }, []);
-  const handleSidebarCollapseChange = React20.useCallback(
+  const handleSidebarCollapseChange = React19.useCallback(
     (collapsed) => {
       setSidebarCollapsed(collapsed);
       persistCollapsed(collapsed);
     },
     [persistCollapsed]
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (typeof window === "undefined") return;
     let lastBreakpoint = getBreakpoint(window.innerWidth);
     const onResize = () => {
@@ -5041,7 +5059,7 @@ function SidebarProvider({
     window.addEventListener("resize", onResize);
     return () => window.removeEventListener("resize", onResize);
   }, []);
-  const value = React20.useMemo(
+  const value = React19.useMemo(
     () => ({
       defaultExpanded: activeQuery ? true : defaultExpanded,
       expandedItems,
@@ -5086,7 +5104,7 @@ function SidebarProvider({
   return /* @__PURE__ */ jsxRuntime.jsx(SidebarContext.Provider, { value, children });
 }
 function useSidebar() {
-  return React20.useContext(SidebarContext);
+  return React19.useContext(SidebarContext);
 }
 
 // src/components/sidebar/components/expandable-sidebar-item/ExpandableSidebarItem.module.css
@@ -5171,7 +5189,7 @@ function SidebarItemContent({
   const shouldTruncate = truncateLabel && !wrapItemText && !activeQuery;
   const highlightTerms = activeQuery.trim().split(/\s+/).filter(Boolean);
   const renderedLabel = typeof label === "string" && highlightTerms.length > 0 ? getHighlightedSegments(label, highlightTerms).map(
-    (segment, index) => segment.matched ? /* @__PURE__ */ jsxRuntime.jsx("mark", { className: "dbc-highlight", children: segment.text }, `${segment.text}-${index}`) : /* @__PURE__ */ jsxRuntime.jsx(React20__namespace.default.Fragment, { children: segment.text }, `${segment.text}-${index}`)
+    (segment, index) => segment.matched ? /* @__PURE__ */ jsxRuntime.jsx("mark", { className: "dbc-highlight", children: segment.text }, `${segment.text}-${index}`) : /* @__PURE__ */ jsxRuntime.jsx(React19__namespace.default.Fragment, { children: segment.text }, `${segment.text}-${index}`)
   ) : label;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "span",
@@ -5236,21 +5254,21 @@ function ExpandableSidebarItem({
     collapseItem,
     isExpanded
   } = useSidebar();
-  const [closing, setClosing] = React20.useState(false);
+  const [closing, setClosing] = React19.useState(false);
   const ready = true;
-  const expanded = React20.useMemo(() => isExpanded(href), [href, isExpanded]);
-  React20.useEffect(() => {
+  const expanded = React19.useMemo(() => isExpanded(href), [href, isExpanded]);
+  React19.useEffect(() => {
     if (defaultExpanded === null) return;
     if (defaultExpanded) expandItem(href);
     else collapseItem(href);
   }, [defaultExpanded, expandItem, collapseItem, href]);
-  const handleAnimationEnd = React20.useCallback(() => {
+  const handleAnimationEnd = React19.useCallback(() => {
     if (closing) {
       collapseItem(href);
       setClosing(false);
     }
   }, [closing, ready, collapseItem, href]);
-  const toggleAccordion = React20.useCallback(
+  const toggleAccordion = React19.useCallback(
     (e, onlyExpand = false) => {
       e == null ? void 0 : e.preventDefault();
       e == null ? void 0 : e.stopPropagation();
@@ -5332,7 +5350,7 @@ function ExpandableSidebarItem({
 }
 function SidebarItems({ activeLink }) {
   const { filteredItems, setActiveLink, isSidebarCollapsed } = useSidebar();
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setActiveLink(activeLink != null ? activeLink : "");
   }, [activeLink, setActiveLink]);
   const renderItem = (item, key) => {
@@ -5387,7 +5405,7 @@ var SidenavFiltering = ({
     wrapItemText,
     setWrapItemText
   } = useSidebar();
-  const searchBoxRef = React20__namespace.default.useRef(null);
+  const searchBoxRef = React19__namespace.default.useRef(null);
   const handleSearch = (value) => {
     setActiveQuery == null ? void 0 : setActiveQuery(value);
   };
@@ -5512,28 +5530,28 @@ function SidebarContainer({
   storageKey
 }) {
   const { isSidebarCollapsed, handleSidebarCollapseChange } = useSidebar();
-  const [sidebarWidth, setSidebarWidth] = React20.useState(defaultWidth);
-  const [manualWidth, setManualWidth] = React20.useState(null);
-  const [isResizing, setIsResizing] = React20.useState(false);
-  const [ariaMaxWidth, setAriaMaxWidth] = React20.useState(void 0);
-  const containerRef = React20.useRef(null);
-  const draggingRef = React20.useRef(false);
-  const pointerIdRef = React20.useRef(null);
-  const startXRef = React20.useRef(0);
-  const startWidthRef = React20.useRef(0);
-  const maxWidthRef = React20.useRef(Infinity);
-  const getMaxWidth = React20.useCallback(() => {
+  const [sidebarWidth, setSidebarWidth] = React19.useState(defaultWidth);
+  const [manualWidth, setManualWidth] = React19.useState(null);
+  const [isResizing, setIsResizing] = React19.useState(false);
+  const [ariaMaxWidth, setAriaMaxWidth] = React19.useState(void 0);
+  const containerRef = React19.useRef(null);
+  const draggingRef = React19.useRef(false);
+  const pointerIdRef = React19.useRef(null);
+  const startXRef = React19.useRef(0);
+  const startWidthRef = React19.useRef(0);
+  const maxWidthRef = React19.useRef(Infinity);
+  const getMaxWidth = React19.useCallback(() => {
     const viewportWidth = typeof window !== "undefined" ? window.innerWidth || document.documentElement.clientWidth : Infinity;
     return Math.max(minWidth, viewportWidth - minWidth);
   }, [minWidth]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!storageKey) return;
     const stored = readStoredWidth(storageKey);
     if (stored === null) return;
     setManualWidth(stored);
     setSidebarWidth(stored);
   }, [storageKey]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!storageKey) return;
     if (manualWidth === null) {
       removeStoredWidth(storageKey);
@@ -5541,20 +5559,20 @@ function SidebarContainer({
     }
     writeStoredWidth(storageKey, manualWidth);
   }, [manualWidth, storageKey]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setAriaMaxWidth(getMaxWidth());
   }, [getMaxWidth]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     return () => {
       document.body.style.cursor = "";
       document.body.style.userSelect = "";
     };
   }, []);
-  const updateWidth = React20.useCallback((nextWidth) => {
+  const updateWidth = React19.useCallback((nextWidth) => {
     setManualWidth(nextWidth);
     setSidebarWidth(nextWidth);
   }, []);
-  const onResizePointerDown = React20.useCallback(
+  const onResizePointerDown = React19.useCallback(
     (e) => {
       const maxWidth = getMaxWidth();
       if (maxWidth === null) return;
@@ -5570,7 +5588,7 @@ function SidebarContainer({
     },
     [getMaxWidth, sidebarWidth]
   );
-  const onResizePointerMove = React20.useCallback(
+  const onResizePointerMove = React19.useCallback(
     (e) => {
       if (!draggingRef.current) return;
       if (pointerIdRef.current !== null && e.pointerId !== pointerIdRef.current) return;
@@ -5579,7 +5597,7 @@ function SidebarContainer({
     },
     [minWidth, updateWidth]
   );
-  const endResizeDrag = React20.useCallback(() => {
+  const endResizeDrag = React19.useCallback(() => {
     if (!draggingRef.current) return;
     draggingRef.current = false;
     pointerIdRef.current = null;
@@ -5587,11 +5605,11 @@ function SidebarContainer({
     document.body.style.cursor = "";
     document.body.style.userSelect = "";
   }, []);
-  const resetWidth = React20.useCallback(() => {
+  const resetWidth = React19.useCallback(() => {
     setManualWidth(null);
     setSidebarWidth(clamp2(defaultWidth, minWidth, getMaxWidth()));
   }, [defaultWidth, getMaxWidth, minWidth]);
-  const onKeyDown = React20.useCallback(
+  const onKeyDown = React19.useCallback(
     (e) => {
       const maxWidth = getMaxWidth();
       const step = e.shiftKey ? 32 : 8;
@@ -5606,7 +5624,7 @@ function SidebarContainer({
     },
     [getMaxWidth, minWidth, sidebarWidth, updateWidth]
   );
-  const containerStyle = React20.useMemo(
+  const containerStyle = React19.useMemo(
     () => ({
       "--sidebar-width": `${sidebarWidth}px`
     }),
@@ -5708,14 +5726,14 @@ function useListNavigation({
   typeaheadTimeoutMs = 500,
   getInitialActiveIndex
 }) {
-  const optionRefs = React20.useRef([]);
-  const typeaheadRef = React20.useRef("");
-  const typeaheadTimeoutRef = React20.useRef(null);
-  const normalizedLabels = React20.useMemo(
+  const optionRefs = React19.useRef([]);
+  const typeaheadRef = React19.useRef("");
+  const typeaheadTimeoutRef = React19.useRef(null);
+  const normalizedLabels = React19.useMemo(
     () => options.map((option) => getLabel(option).trim().toLocaleLowerCase()),
     [options, getLabel]
   );
-  const getDefaultInitialIndex = React20.useCallback(
+  const getDefaultInitialIndex = React19.useCallback(
     (items) => {
       if (items.length === 0) return -1;
       if (getInitialActiveIndex) {
@@ -5727,65 +5745,65 @@ function useListNavigation({
     },
     [getInitialActiveIndex, searchable]
   );
-  const [activeIndex, setActiveIndex] = React20.useState(() => getDefaultInitialIndex(options));
-  const clearTypeahead = React20.useCallback(() => {
+  const [activeIndex, setActiveIndex] = React19.useState(() => getDefaultInitialIndex(options));
+  const clearTypeahead = React19.useCallback(() => {
     typeaheadRef.current = "";
     if (typeaheadTimeoutRef.current) {
       clearTimeout(typeaheadTimeoutRef.current);
       typeaheadTimeoutRef.current = null;
     }
   }, []);
-  const focusActiveOption = React20.useCallback(() => {
+  const focusActiveOption = React19.useCallback(() => {
     var _a;
     if (activeIndex < 0 || options.length === 0) return;
     (_a = optionRefs.current[activeIndex]) == null ? void 0 : _a.focus();
   }, [activeIndex, options.length]);
-  const resetActiveIndex = React20.useCallback(() => {
+  const resetActiveIndex = React19.useCallback(() => {
     setActiveIndex(getDefaultInitialIndex(options));
   }, [getDefaultInitialIndex, options]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     return () => {
       if (typeaheadTimeoutRef.current) clearTimeout(typeaheadTimeoutRef.current);
     };
   }, []);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setActiveIndex((current) => {
       if (options.length === 0) return -1;
       if (current < 0) return current;
       return Math.min(current, options.length - 1);
     });
   }, [options]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     optionRefs.current = optionRefs.current.slice(0, options.length);
   }, [options.length]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!isOpen || !focusActiveOptionOnOpen) return;
     if (searchable && document.activeElement === (searchInputRef == null ? void 0 : searchInputRef.current)) return;
     focusActiveOption();
   }, [activeIndex, focusActiveOption, focusActiveOptionOnOpen, isOpen, searchable, searchInputRef]);
-  const moveNext = React20.useCallback(() => {
+  const moveNext = React19.useCallback(() => {
     if (options.length === 0) return;
     setActiveIndex((index) => {
       if (index < 0) return 0;
       return Math.min(index + 1, options.length - 1);
     });
   }, [options.length]);
-  const movePrev = React20.useCallback(() => {
+  const movePrev = React19.useCallback(() => {
     if (options.length === 0) return;
     setActiveIndex((index) => {
       if (index < 0) return options.length - 1;
       return Math.max(index - 1, 0);
     });
   }, [options.length]);
-  const moveFirst = React20.useCallback(() => {
+  const moveFirst = React19.useCallback(() => {
     if (options.length === 0) return;
     setActiveIndex(0);
   }, [options.length]);
-  const moveLast = React20.useCallback(() => {
+  const moveLast = React19.useCallback(() => {
     if (options.length === 0) return;
     setActiveIndex(options.length - 1);
   }, [options.length]);
-  const findTypeaheadMatch = React20.useCallback(
+  const findTypeaheadMatch = React19.useCallback(
     (query, startIndex) => {
       if (!query || options.length === 0) return -1;
       const normalizedQuery = query.trim().toLocaleLowerCase();
@@ -5800,7 +5818,7 @@ function useListNavigation({
     },
     [normalizedLabels, options.length]
   );
-  const handleTypeahead = React20.useCallback(
+  const handleTypeahead = React19.useCallback(
     (key) => {
       const nextBuffer = `${typeaheadRef.current}${key.toLocaleLowerCase()}`;
       const repeatedChar = new Set(nextBuffer).size === 1;
@@ -5822,7 +5840,7 @@ function useListNavigation({
     },
     [activeIndex, findTypeaheadMatch, isOpen, onOpenChange, typeaheadTimeoutMs]
   );
-  const handleKeyDown = React20.useCallback(
+  const handleKeyDown = React19.useCallback(
     (e) => {
       var _a;
       const isSearchInputTarget = searchable && e.target === (searchInputRef == null ? void 0 : searchInputRef.current);
@@ -5944,12 +5962,12 @@ function MultiSelect({
   searchPlaceholder = "S\xF8g",
   emptyMessage = "Ingen resultater"
 }) {
-  const selectedSet = React20.useMemo(() => new Set(selectedValues), [selectedValues]);
-  const popoverRef = React20.useRef(null);
-  const searchInputRef = React20.useRef(null);
-  const [open, setOpen] = React20.useState(false);
-  const [searchQuery, setSearchQuery] = React20.useState("");
-  const filteredOptions = React20.useMemo(() => {
+  const selectedSet = React19.useMemo(() => new Set(selectedValues), [selectedValues]);
+  const popoverRef = React19.useRef(null);
+  const searchInputRef = React19.useRef(null);
+  const [open, setOpen] = React19.useState(false);
+  const [searchQuery, setSearchQuery] = React19.useState("");
+  const filteredOptions = React19.useMemo(() => {
     const normalizedQuery = searchQuery.trim().toLocaleLowerCase();
     if (!normalizedQuery) return options;
     return options.filter((option) => option.label.toLocaleLowerCase().includes(normalizedQuery));
@@ -5973,7 +5991,7 @@ function MultiSelect({
       return selectedIndex >= 0 ? selectedIndex : 0;
     }
   });
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a;
     if (!open || !searchable) return;
     (_a = searchInputRef.current) == null ? void 0 : _a.focus();
@@ -6280,14 +6298,14 @@ function Typeahead({
   enableHotkey = false
 }) {
   var _a, _b;
-  const rootRef = React20.useRef(null);
-  const triggerWrapperRef = React20.useRef(null);
-  const inputRef = React20.useRef(null);
-  const popoverContentRef = React20.useRef(null);
-  const interactingWithOptionsRef = React20.useRef(false);
-  const justClearedRef = React20.useRef(false);
-  const locallyClearedRef = React20.useRef(false);
-  const listboxId = React20.useId();
+  const rootRef = React19.useRef(null);
+  const triggerWrapperRef = React19.useRef(null);
+  const inputRef = React19.useRef(null);
+  const popoverContentRef = React19.useRef(null);
+  const interactingWithOptionsRef = React19.useRef(false);
+  const justClearedRef = React19.useRef(false);
+  const locallyClearedRef = React19.useRef(false);
+  const listboxId = React19.useId();
   const {
     onFocus: inputPropsOnFocus,
     onBlur: inputPropsOnBlur,
@@ -6298,28 +6316,28 @@ function Typeahead({
     endAdornment: inputPropsEndAdornment,
     ...passthroughInputProps
   } = inputProps != null ? inputProps : {};
-  const selectedOption = React20.useMemo(() => {
+  const selectedOption = React19.useMemo(() => {
     var _a2;
     if (mode === "multi") return null;
     return (_a2 = options.find((option) => option.value === selectedValue)) != null ? _a2 : null;
   }, [options, selectedValue, mode]);
-  const selectedOptions = React20.useMemo(() => {
+  const selectedOptions = React19.useMemo(() => {
     if (mode !== "multi" || !Array.isArray(selectedValue)) return [];
     return options.filter((option) => selectedValue.includes(option.value));
   }, [options, selectedValue, mode]);
-  const [open, setOpen] = React20.useState(false);
-  const [inputValue, setInputValue] = React20.useState(
+  const [open, setOpen] = React19.useState(false);
+  const [inputValue, setInputValue] = React19.useState(
     mode === "multi" ? "" : (_a = selectedOption == null ? void 0 : selectedOption.label) != null ? _a : ""
   );
-  const [query, setQuery] = React20.useState("");
-  const [activeIndex, setActiveIndex] = React20.useState(-1);
-  const [hideSelectedHighlight, setHideSelectedHighlight] = React20.useState(false);
-  const clearJustClearedAfterEventCycle = React20__namespace.useCallback(() => {
+  const [query, setQuery] = React19.useState("");
+  const [activeIndex, setActiveIndex] = React19.useState(-1);
+  const [hideSelectedHighlight, setHideSelectedHighlight] = React19.useState(false);
+  const clearJustClearedAfterEventCycle = React19__namespace.useCallback(() => {
     requestAnimationFrame(() => {
       justClearedRef.current = false;
     });
   }, []);
-  const getSelectedValueChipLabel = React20__namespace.useCallback(
+  const getSelectedValueChipLabel = React19__namespace.useCallback(
     (option) => {
       switch (multiSelectedValueChipContent) {
         case "value":
@@ -6346,7 +6364,7 @@ function Typeahead({
       );
     }
   }
-  const commitSelection = React20__namespace.useCallback(
+  const commitSelection = React19__namespace.useCallback(
     (option) => {
       var _a2, _b2;
       locallyClearedRef.current = false;
@@ -6404,12 +6422,12 @@ function Typeahead({
   const usesCountAdornment = mode === "multi" && multiValueDisplayMode === "count" && selectedOptions.length > 0;
   const resolvedInputSize = (_b = inputSize != null ? inputSize : inputProps == null ? void 0 : inputProps.inputSize) != null ? _b : "md";
   const shouldFitContent = fitContent && mode === "single";
-  const [fittedWidthPx, setFittedWidthPx] = React20.useState(null);
-  const visibleSingleValueText = React20.useMemo(() => {
+  const [fittedWidthPx, setFittedWidthPx] = React19.useState(null);
+  const visibleSingleValueText = React19.useMemo(() => {
     if (!shouldFitContent) return "";
     return inputValue || (selectedOption == null ? void 0 : selectedOption.label) || placeholder || "";
   }, [shouldFitContent, inputValue, selectedOption, placeholder]);
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     if (!shouldFitContent) return;
     const input = inputRef.current;
     if (!input) return;
@@ -6443,13 +6461,13 @@ function Typeahead({
     inputPropsStartAdornment,
     inputPropsEndAdornment
   ]);
-  const measuredRootWidth = React20.useMemo(() => {
+  const measuredRootWidth = React19.useMemo(() => {
     if (!shouldFitContent) return void 0;
     if (fittedWidthPx == null) return minWidth != null ? minWidth : "120px";
     return `${fittedWidthPx}px`;
   }, [shouldFitContent, fittedWidthPx, minWidth]);
   const shouldStretchInput = fullWidth || shouldFitContent;
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!enableHotkey) return;
     function handleKeyDown2(event) {
       var _a2;
@@ -6461,7 +6479,7 @@ function Typeahead({
     window.addEventListener("keydown", handleKeyDown2);
     return () => window.removeEventListener("keydown", handleKeyDown2);
   }, [enableHotkey]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a2;
     if (justClearedRef.current || locallyClearedRef.current) return;
     if (mode === "multi") {
@@ -6471,7 +6489,7 @@ function Typeahead({
       setInputValue((_a2 = selectedOption == null ? void 0 : selectedOption.label) != null ? _a2 : "");
     }
   }, [selectedOption, mode]);
-  const getSelectedIndex = React20__namespace.useCallback(
+  const getSelectedIndex = React19__namespace.useCallback(
     (items) => {
       if (items.length === 0) return -1;
       if (locallyClearedRef.current) return 0;
@@ -6485,7 +6503,7 @@ function Typeahead({
     },
     [mode, selectedValue]
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setActiveIndex((current) => {
       if (filteredOptions.length === 0) return -1;
       if (locallyClearedRef.current) return 0;
@@ -6493,13 +6511,13 @@ function Typeahead({
       return Math.min(current, filteredOptions.length - 1);
     });
   }, [filteredOptions, getSelectedIndex]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a2, _b2;
     if (!open || activeIndex < 0) return;
     const activeEl = (_a2 = document.getElementById(listboxId)) == null ? void 0 : _a2.querySelector(`#${CSS.escape(`${listboxId}-option-${activeIndex}`)}`);
     (_b2 = activeEl == null ? void 0 : activeEl.scrollIntoView) == null ? void 0 : _b2.call(activeEl, { block: "nearest" });
   }, [open, activeIndex, filteredOptions, listboxId]);
-  const getFocusableElements = React20__namespace.useCallback(() => {
+  const getFocusableElements = React19__namespace.useCallback(() => {
     const selector = [
       "a[href]",
       "button:not([disabled])",
@@ -6523,12 +6541,12 @@ function Typeahead({
     }
     return focusables;
   }, []);
-  const isFocusWithinTypeahead = React20__namespace.useCallback((target) => {
+  const isFocusWithinTypeahead = React19__namespace.useCallback((target) => {
     var _a2, _b2;
     if (!(target instanceof Node)) return false;
     return Boolean(((_a2 = rootRef.current) == null ? void 0 : _a2.contains(target)) || ((_b2 = popoverContentRef.current) == null ? void 0 : _b2.contains(target)));
   }, []);
-  const handleTabKeyDown = React20__namespace.useCallback(
+  const handleTabKeyDown = React19__namespace.useCallback(
     (event) => {
       var _a2, _b2, _c;
       if (event.key !== "Tab" || !open) return;
@@ -6602,23 +6620,23 @@ function Typeahead({
     setOpen(false);
     setActiveIndex(-1);
   };
-  const openWithAllOptions = React20__namespace.useCallback(() => {
+  const openWithAllOptions = React19__namespace.useCallback(() => {
     if (justClearedRef.current) return;
     setQuery("");
     setOpen(true);
     setActiveIndex(getSelectedIndex(options));
   }, [getSelectedIndex, options]);
-  const openWithCurrentFilter = React20__namespace.useCallback(() => {
+  const openWithCurrentFilter = React19__namespace.useCallback(() => {
     if (justClearedRef.current) return;
     setOpen(true);
     setActiveIndex(getSelectedIndex(filteredOptions));
   }, [getSelectedIndex, filteredOptions]);
-  const prepareSingleSearchInput = React20__namespace.useCallback(() => {
+  const prepareSingleSearchInput = React19__namespace.useCallback(() => {
     if (mode !== "single" || !selectedOption || justClearedRef.current) return;
     setInputValue("");
     setQuery("");
   }, [mode, selectedOption]);
-  const handleOpen = React20__namespace.useCallback(() => {
+  const handleOpen = React19__namespace.useCallback(() => {
     if (justClearedRef.current) return;
     if (mode === "single" && selectedOption && !locallyClearedRef.current) {
       prepareSingleSearchInput();
@@ -6627,7 +6645,7 @@ function Typeahead({
     }
     openWithCurrentFilter();
   }, [mode, selectedOption, prepareSingleSearchInput, openWithAllOptions, openWithCurrentFilter]);
-  const handleTriggerMouseDown = React20__namespace.useCallback(
+  const handleTriggerMouseDown = React19__namespace.useCallback(
     (e) => {
       var _a2;
       inputPropsOnMouseDown == null ? void 0 : inputPropsOnMouseDown(e);
@@ -6668,7 +6686,7 @@ function Typeahead({
       filteredOptions
     ]
   );
-  const handleChevronMouseDown = React20__namespace.useCallback(
+  const handleChevronMouseDown = React19__namespace.useCallback(
     (e) => {
       var _a2, _b2;
       e.preventDefault();
@@ -7006,9 +7024,9 @@ function OperatorDropdown({
   size = "sm",
   disabled
 }) {
-  const popRef = React20.useRef(null);
-  const [activeIndex, setActiveIndex] = React20.useState(() => Math.max(0, operators.indexOf(value)));
-  React20.useEffect(() => {
+  const popRef = React19.useRef(null);
+  const [activeIndex, setActiveIndex] = React19.useState(() => Math.max(0, operators.indexOf(value)));
+  React19.useEffect(() => {
     setActiveIndex(Math.max(0, operators.indexOf(value)));
   }, [operators, value]);
   const handleSelect = (op) => {
@@ -7074,19 +7092,19 @@ function FilterField({
   ...inputProps
 }) {
   var _a, _b, _c, _d;
-  const filterFieldRef = React20.useRef(null);
-  const ops = React20.useMemo(() => operators != null ? operators : DEFAULT_TEXT_OPERATORS, [operators]);
+  const filterFieldRef = React19.useRef(null);
+  const ops = React19.useMemo(() => operators != null ? operators : DEFAULT_TEXT_OPERATORS, [operators]);
   const shouldAutoFitTypeahead = control === "select" && single && !width;
-  const [selectedOperator, setSelectedOperator] = React20.useState(operator);
+  const [selectedOperator, setSelectedOperator] = React19.useState(operator);
   const active = isFilterActive(value);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (ops.includes(operator)) {
       setSelectedOperator(operator);
     }
   }, [operator, ops]);
-  const [localValue, setLocalValue] = React20.useState(value != null ? value : "");
-  const debounceRef = React20.useRef(null);
-  const pendingValueRef = React20.useRef(null);
+  const [localValue, setLocalValue] = React19.useState(value != null ? value : "");
+  const debounceRef = React19.useRef(null);
+  const pendingValueRef = React19.useRef(null);
   const emit = (next) => {
     var _a2, _b2;
     const nextOperator = (_a2 = next.operator) != null ? _a2 : selectedOperator;
@@ -7132,7 +7150,7 @@ function FilterField({
     pendingValueRef.current = control === "input" ? localValue : typeof value === "string" ? value : null;
     emit({ operator: op });
   };
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (control !== "input") return;
     const incoming = value != null ? value : "";
     const pending = pendingValueRef.current;
@@ -7146,7 +7164,7 @@ function FilterField({
       setLocalValue(incoming);
     }
   }, [value, control, localValue]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     return () => {
       clearDebounce();
     };
@@ -7267,26 +7285,26 @@ function Select({
   disabled,
   minWidth
 }) {
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const controlId = id != null ? id : `select-${generatedId}`;
   const describedById = `${controlId}-desc`;
   const listboxId = `${controlId}-listbox`;
-  const popoverRef = React20.useRef(null);
-  const optionRefs = React20.useRef([]);
-  const typeaheadRef = React20.useRef("");
-  const typeaheadTimeoutRef = React20.useRef(null);
-  const selectedIndex = React20.useMemo(
+  const popoverRef = React19.useRef(null);
+  const optionRefs = React19.useRef([]);
+  const typeaheadRef = React19.useRef("");
+  const typeaheadTimeoutRef = React19.useRef(null);
+  const selectedIndex = React19.useMemo(
     () => options.findIndex((o) => o.value === selectedValue),
     [options, selectedValue]
   );
-  const [activeIndex, setActiveIndex] = React20.useState(selectedIndex >= 0 ? selectedIndex : 0);
-  const [open, setOpen] = React20.useState(false);
-  React20.useEffect(() => {
+  const [activeIndex, setActiveIndex] = React19.useState(selectedIndex >= 0 ? selectedIndex : 0);
+  const [open, setOpen] = React19.useState(false);
+  React19.useEffect(() => {
     return () => {
       if (typeaheadTimeoutRef.current) clearTimeout(typeaheadTimeoutRef.current);
     };
   }, []);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     var _a;
     if (!open) return;
     (_a = optionRefs.current[activeIndex]) == null ? void 0 : _a.focus();
@@ -7559,6 +7577,14 @@ var SegmentedProgressBar_default = {
   progressCenterLabel: "SegmentedProgressBar_progressCenterLabel",
   emptySegments: "SegmentedProgressBar_emptySegments"
 };
+var sizeTokenMap = {
+  "2xs": "var(--component-size-2xs)",
+  xxs: "var(--component-size-xxs)",
+  xs: "var(--component-size-xs)",
+  sm: "var(--component-size-sm)",
+  md: "var(--component-size-md)",
+  lg: "var(--component-size-lg)"
+};
 function SegmentWithTooltip({
   seg,
   index,
@@ -7598,9 +7624,9 @@ var SegmentedProgressBar = ({
   segments,
   total,
   showRemainder = true,
-  remainderSeverity = "neutral",
+  remainderSeverity = "missing",
   centerLabel,
-  height,
+  size = "sm",
   rounded = true,
   trackColor,
   tooltipPlacement = "top",
@@ -7638,7 +7664,8 @@ var SegmentedProgressBar = ({
           className: SegmentedProgressBar_default.progressBar,
           "data-rounded": rounded ? "true" : "false",
           style: {
-            height: height ? `${height}px` : "24px",
+            ["--progress-height"]: sizeTokenMap[size],
+            height: sizeTokenMap[size],
             background: trackColor != null ? trackColor : "var(--color-bg-surface-subtle)"
           },
           children: [
@@ -7880,7 +7907,7 @@ function defaultFormatRange(s, e, opts) {
   return "";
 }
 var cx4 = (...classes) => classes.filter(Boolean).join(" ");
-var DateTimePicker = React20.forwardRef(function DateTimePicker2({
+var DateTimePicker = React19.forwardRef(function DateTimePicker2({
   mode = "single",
   value,
   onChange,
@@ -7897,12 +7924,12 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
   formatRange = defaultFormatRange,
   onOpenChange
 }, _ref) {
-  const popRef = React20.useRef(null);
+  const popRef = React19.useRef(null);
   const onChangeRange = onChange;
   const onChangeIso = onChange;
   const onChangeDateOnly = onChange;
-  const todayLocal = React20.useMemo(() => /* @__PURE__ */ new Date(), []);
-  const initialAnchor = React20.useMemo(() => {
+  const todayLocal = React19.useMemo(() => /* @__PURE__ */ new Date(), []);
+  const initialAnchor = React19.useMemo(() => {
     if (mode === "single") {
       if (typeof value === "string") {
         const d = enableTime ? localDateFromIso(value) : localDateFromDateOnly(value);
@@ -7917,13 +7944,13 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     }
     return todayLocal;
   }, [mode, value, enableTime, todayLocal]);
-  const [monthAnchor, setMonthAnchor] = React20.useState(initialAnchor);
-  React20.useEffect(() => setMonthAnchor(initialAnchor), [initialAnchor]);
-  const [timeHH, setTimeHH] = React20.useState(todayLocal.getHours());
-  const [timeMM, setTimeMM] = React20.useState(
+  const [monthAnchor, setMonthAnchor] = React19.useState(initialAnchor);
+  React19.useEffect(() => setMonthAnchor(initialAnchor), [initialAnchor]);
+  const [timeHH, setTimeHH] = React19.useState(todayLocal.getHours());
+  const [timeMM, setTimeMM] = React19.useState(
     Math.floor(todayLocal.getMinutes() / timeStep) * timeStep
   );
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (mode === "single" && enableTime && typeof value === "string") {
       const d = localDateFromIso(value);
       if (!d) return;
@@ -7931,46 +7958,46 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
       setTimeMM(Math.floor(d.getMinutes() / timeStep) * timeStep);
     }
   }, [mode, enableTime, value, timeStep]);
-  const [hoverUTC, setHoverUTC] = React20.useState(null);
-  const cellsUTC = React20.useMemo(
+  const [hoverUTC, setHoverUTC] = React19.useState(null);
+  const cellsUTC = React19.useMemo(
     () => buildMonthGrid(monthAnchor, weekStartsOn),
     [monthAnchor, weekStartsOn]
   );
-  const monthStartUTC = React20.useMemo(
+  const monthStartUTC = React19.useMemo(
     () => startOfMonthUTC(toUTCDateOnlyFromLocal(monthAnchor)),
     [monthAnchor]
   );
-  const monthEndUTC = React20.useMemo(
+  const monthEndUTC = React19.useMemo(
     () => endOfMonthUTC(toUTCDateOnlyFromLocal(monthAnchor)),
     [monthAnchor]
   );
-  const weekdayFmt = React20.useMemo(() => new Intl.DateTimeFormat(locale, { weekday: "short" }), [locale]);
-  const monthFmt = React20.useMemo(
+  const weekdayFmt = React19.useMemo(() => new Intl.DateTimeFormat(locale, { weekday: "short" }), [locale]);
+  const monthFmt = React19.useMemo(
     () => new Intl.DateTimeFormat(locale, { month: "long", year: "numeric" }),
     [locale]
   );
-  const selectedUTC_single = React20.useMemo(() => {
+  const selectedUTC_single = React19.useMemo(() => {
     if (mode !== "single") return null;
     if (typeof value !== "string") return null;
     const d = enableTime ? localDateFromIso(value) : localDateFromDateOnly(value);
     if (!d) return null;
     return toUTCDateOnlyFromLocal(d);
   }, [mode, value, enableTime]);
-  const selectedUTC_start = React20.useMemo(() => {
+  const selectedUTC_start = React19.useMemo(() => {
     if (mode !== "range") return null;
     const v = value;
     if (!(v == null ? void 0 : v.start)) return null;
     const d = localDateFromDateOnly(v.start);
     return d ? toUTCDateOnlyFromLocal(d) : null;
   }, [mode, value]);
-  const selectedUTC_end = React20.useMemo(() => {
+  const selectedUTC_end = React19.useMemo(() => {
     if (mode !== "range") return null;
     const v = value;
     if (!(v == null ? void 0 : v.end)) return null;
     const d = localDateFromDateOnly(v.end);
     return d ? toUTCDateOnlyFromLocal(d) : null;
   }, [mode, value]);
-  const isDisabledUTC = React20.useCallback(
+  const isDisabledUTC = React19.useCallback(
     (utcDay) => {
       if (min && utcDay < toUTCDateOnlyFromLocal(min)) return true;
       if (max && utcDay > toUTCDateOnlyFromLocal(max)) return true;
@@ -7978,7 +8005,7 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     },
     [min, max]
   );
-  const selectDay = React20.useCallback(
+  const selectDay = React19.useCallback(
     (utcDay) => {
       var _a, _b;
       if (isDisabledUTC(utcDay)) return;
@@ -8030,8 +8057,8 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     d.setDate(d.getDate() + n);
     return d;
   }
-  const gridRef = React20.useRef(null);
-  React20.useEffect(() => {
+  const gridRef = React19.useRef(null);
+  React19.useEffect(() => {
     const el = gridRef.current;
     if (!el) return;
     const onKey = (e) => {
@@ -8083,12 +8110,12 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     el.addEventListener("keydown", onKey);
     return () => el.removeEventListener("keydown", onKey);
   }, [monthAnchor]);
-  const hours = React20.useMemo(() => Array.from({ length: 24 }, (_, i) => i), []);
-  const minutes = React20.useMemo(
+  const hours = React19.useMemo(() => Array.from({ length: 24 }, (_, i) => i), []);
+  const minutes = React19.useMemo(
     () => Array.from({ length: Math.floor(60 / (timeStep || 1)) }, (_, i) => i * (timeStep || 1)),
     [timeStep]
   );
-  const formatted = React20.useMemo(() => {
+  const formatted = React19.useMemo(() => {
     if (mode === "single") {
       if (typeof value !== "string") return "";
       const d = enableTime ? localDateFromIso(value) : localDateFromDateOnly(value);
@@ -8104,12 +8131,12 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     if (ee) return `\u2013 ${ee}`;
     return "";
   }, [mode, value, enableTime]);
-  const [text, setText] = React20.useState(formatted);
-  const [dirty, setDirty] = React20.useState(false);
-  React20.useEffect(() => {
+  const [text, setText] = React19.useState(formatted);
+  const [dirty, setDirty] = React19.useState(false);
+  React19.useEffect(() => {
     if (!dirty) setText(formatted);
   }, [formatted, dirty]);
-  const commitTypedValue = React20.useCallback(() => {
+  const commitTypedValue = React19.useCallback(() => {
     if (!text.trim()) {
       if (mode === "single") {
         if (enableTime) onChangeIso(null);
@@ -8147,7 +8174,7 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
       setDirty(false);
     }
   }, [text, mode, enableTime, onChangeDateOnly, onChangeIso, onChangeRange]);
-  const emitTimeChange = React20.useCallback(
+  const emitTimeChange = React19.useCallback(
     (nextHH, nextMM) => {
       if (mode !== "single" || !enableTime) return;
       if (typeof value !== "string") return;
@@ -8165,7 +8192,7 @@ var DateTimePicker = React20.forwardRef(function DateTimePicker2({
     },
     [mode, enableTime, value, onChangeIso]
   );
-  const clear = React20.useCallback(() => {
+  const clear = React19.useCallback(() => {
     if (mode === "single") {
       if (enableTime) onChangeIso(null);
       else onChangeDateOnly(null);
@@ -8415,19 +8442,19 @@ function Modal({
   dataCy,
   width
 }) {
-  const titleId = React20.useId();
-  const dialogRef = React20.useRef(null);
-  const lastActiveElementRef = React20.useRef(null);
-  const [mounted, setMounted] = React20.useState(false);
-  const onRequestCloseRef = React20.useRef(onRequestClose);
-  React20.useEffect(() => {
+  const titleId = React19.useId();
+  const dialogRef = React19.useRef(null);
+  const lastActiveElementRef = React19.useRef(null);
+  const [mounted, setMounted] = React19.useState(false);
+  const onRequestCloseRef = React19.useRef(onRequestClose);
+  React19.useEffect(() => {
     onRequestCloseRef.current = onRequestClose;
   }, [onRequestClose]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     setMounted(true);
   }, []);
-  const wasOpenRef = React20.useRef(false);
-  React20.useEffect(() => {
+  const wasOpenRef = React19.useRef(false);
+  React19.useEffect(() => {
     var _a;
     const wasOpen = wasOpenRef.current;
     wasOpenRef.current = isOpen;
@@ -8519,7 +8546,7 @@ function Modal({
         tabIndex: -1,
         children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Modal_default.header, children: [
-            header && /* @__PURE__ */ jsxRuntime.jsx(Headline, { severity, size: 3, disableMargin: true, subheader, children: header }),
+            header && /* @__PURE__ */ jsxRuntime.jsx(Headline, { severity, size: 2, disableMargin: true, subheader, children: header }),
             /* @__PURE__ */ jsxRuntime.jsx(
               Button,
               {
@@ -8559,28 +8586,28 @@ function Modal({
     document.body
   );
 }
-var ModalContext = React20.createContext(void 0);
+var ModalContext = React19.createContext(void 0);
 function ModalProvider({ children }) {
-  const [isOpen, setIsOpen] = React20.useState(false);
-  const [config, setConfig] = React20.useState(null);
-  const [mounted, setMounted] = React20.useState(false);
-  React20.useEffect(() => {
+  const [isOpen, setIsOpen] = React19.useState(false);
+  const [config, setConfig] = React19.useState(null);
+  const [mounted, setMounted] = React19.useState(false);
+  React19.useEffect(() => {
     setMounted(true);
   }, []);
-  const [isLoading, setIsLoading] = React20.useState(false);
-  const markAsLoading = React20.useCallback((loading = true) => setIsLoading(loading), []);
-  const pendingResolverRef = React20.useRef(null);
-  const resolvePending = React20.useCallback((value) => {
+  const [isLoading, setIsLoading] = React19.useState(false);
+  const markAsLoading = React19.useCallback((loading = true) => setIsLoading(loading), []);
+  const pendingResolverRef = React19.useRef(null);
+  const resolvePending = React19.useCallback((value) => {
     if (pendingResolverRef.current) {
       pendingResolverRef.current(value);
       pendingResolverRef.current = null;
     }
   }, []);
-  const closeModal = React20.useCallback(() => {
+  const closeModal = React19.useCallback(() => {
     setIsOpen(false);
     setIsLoading(false);
   }, []);
-  const openModal = React20.useCallback(
+  const openModal = React19.useCallback(
     (newConfig) => {
       resolvePending(false);
       setConfig(newConfig);
@@ -8588,13 +8615,13 @@ function ModalProvider({ children }) {
     },
     [resolvePending]
   );
-  const handleRequestClose = React20.useCallback(() => {
+  const handleRequestClose = React19.useCallback(() => {
     var _a;
     (_a = config == null ? void 0 : config.onRequestClose) == null ? void 0 : _a.call(config);
     resolvePending(false);
     closeModal();
   }, [config, closeModal, resolvePending]);
-  const confirm = React20.useCallback(
+  const confirm = React19.useCallback(
     (confirmConfig) => {
       return new Promise((resolve) => {
         resolvePending(false);
@@ -8642,7 +8669,7 @@ function ModalProvider({ children }) {
   return modalNode;
 }
 function useModal() {
-  const ctx = React20.useContext(ModalContext);
+  const ctx = React19.useContext(ModalContext);
   if (!ctx) throw new Error("useModal must be used within a ModalProvider");
   return ctx;
 }
@@ -8721,13 +8748,13 @@ function Toast({
     }
   );
 }
-var ToastContext = React20.createContext(void 0);
+var ToastContext = React19.createContext(void 0);
 function ToastProvider({
   children,
   defaultDuration: defaultDuration2 = 4e3
 }) {
-  const [toasts, setToasts] = React20.useState([]);
-  const timeouts = React20.useRef(/* @__PURE__ */ new Map());
+  const [toasts, setToasts] = React19.useState([]);
+  const timeouts = React19.useRef(/* @__PURE__ */ new Map());
   const clearTimeoutForId = (id) => {
     const timeoutId = timeouts.current.get(id);
     if (timeoutId) {
@@ -8735,11 +8762,11 @@ function ToastProvider({
       timeouts.current.delete(id);
     }
   };
-  const hideToast = React20.useCallback((id) => {
+  const hideToast = React19.useCallback((id) => {
     clearTimeoutForId(id);
     setToasts((prev) => prev.filter((t) => t.id !== id));
   }, []);
-  const scheduleAutoDismiss = React20.useCallback(
+  const scheduleAutoDismiss = React19.useCallback(
     (toast) => {
       var _a;
       const duration = (_a = toast.duration) != null ? _a : defaultDuration2;
@@ -8752,7 +8779,7 @@ function ToastProvider({
     },
     [defaultDuration2, hideToast]
   );
-  const showToast = React20.useCallback(
+  const showToast = React19.useCallback(
     (config) => {
       var _a, _b, _c;
       const id = (_c = (_b = config.id) != null ? _b : (_a = crypto.randomUUID) == null ? void 0 : _a.call(crypto)) != null ? _c : `${Date.now()}-${Math.random()}`;
@@ -8763,12 +8790,12 @@ function ToastProvider({
     },
     [scheduleAutoDismiss]
   );
-  const clearToasts = React20.useCallback(() => {
+  const clearToasts = React19.useCallback(() => {
     timeouts.current.forEach((timeoutId) => window.clearTimeout(timeoutId));
     timeouts.current.clear();
     setToasts([]);
   }, []);
-  React20.useEffect(
+  React19.useEffect(
     () => () => {
       timeouts.current.forEach((timeoutId) => window.clearTimeout(timeoutId));
       timeouts.current.clear();
@@ -8801,14 +8828,14 @@ function ToastProvider({
   ] });
 }
 function useToast() {
-  const ctx = React20.useContext(ToastContext);
+  const ctx = React19.useContext(ToastContext);
   if (!ctx) {
     throw new Error("useToast must be used within a ToastProvider");
   }
   return ctx;
 }
 function useOptionalToast() {
-  return React20.useContext(ToastContext);
+  return React19.useContext(ToastContext);
 }
 
 // src/components/attribute-chip/AttributeChip.module.css
@@ -8831,7 +8858,7 @@ function AttributeChip({
     /* @__PURE__ */ jsxRuntime.jsx("span", { className: AttributeChip_default.value, children: loading ? "\u2014" : value == null ? void 0 : value.toString() })
   ] });
 }
-var SplitPaneContext = React20__namespace.default.createContext(null);
+var SplitPaneContext = React19__namespace.default.createContext(null);
 function clamp3(n, min, max) {
   return Math.max(min, Math.min(max, n));
 }
@@ -8858,7 +8885,7 @@ function removeStoredSize(key) {
   }
 }
 function useSplitPaneContext() {
-  const ctx = React20__namespace.default.useContext(SplitPaneContext);
+  const ctx = React19__namespace.default.useContext(SplitPaneContext);
   if (!ctx) throw new Error("SplitPane components must be used within <SplitPane />");
   return ctx;
 }
@@ -8870,10 +8897,10 @@ function SplitPaneProvider({
   minSecondarySize,
   storageKey
 }) {
-  const containerRef = React20.useRef(null);
-  const [primarySize, setPrimarySize] = React20.useState(initialPrimarySize);
-  const [manualPrimarySize, setManualPrimarySize] = React20.useState(null);
-  const getMaxPrimary = React20.useCallback(() => {
+  const containerRef = React19.useRef(null);
+  const [primarySize, setPrimarySize] = React19.useState(initialPrimarySize);
+  const [manualPrimarySize, setManualPrimarySize] = React19.useState(null);
+  const getMaxPrimary = React19.useCallback(() => {
     const el = containerRef.current;
     if (!el) return null;
     const rect = el.getBoundingClientRect();
@@ -8881,14 +8908,14 @@ function SplitPaneProvider({
     if (!Number.isFinite(total) || total <= 0) return null;
     return Math.max(minPrimarySize, total - minSecondarySize);
   }, [direction, minPrimarySize, minSecondarySize]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!storageKey) return;
     const stored = readStoredSize(storageKey);
     if (stored === null) return;
     setManualPrimarySize(stored);
     setPrimarySize(stored);
   }, [storageKey]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     const el = containerRef.current;
     if (!el) return;
     if (typeof ResizeObserver === "undefined") return;
@@ -8903,7 +8930,7 @@ function SplitPaneProvider({
     ro.observe(el);
     return () => ro.disconnect();
   }, [getMaxPrimary, initialPrimarySize, manualPrimarySize]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!storageKey) return;
     if (manualPrimarySize === null) {
       removeStoredSize(storageKey);
@@ -8911,11 +8938,11 @@ function SplitPaneProvider({
     }
     writeStoredSize(storageKey, manualPrimarySize);
   }, [manualPrimarySize, storageKey]);
-  const handleSizeChange = React20.useCallback((newSize) => {
+  const handleSizeChange = React19.useCallback((newSize) => {
     setManualPrimarySize(newSize);
     setPrimarySize(newSize);
   }, []);
-  const resetDefault = React20.useCallback(() => {
+  const resetDefault = React19.useCallback(() => {
     setManualPrimarySize(null);
     const maxPrimary = getMaxPrimary();
     if (maxPrimary === null) {
@@ -8924,7 +8951,7 @@ function SplitPaneProvider({
     }
     setPrimarySize(clamp3(initialPrimarySize, minPrimarySize, maxPrimary));
   }, [getMaxPrimary, initialPrimarySize, minPrimarySize]);
-  const value = React20.useMemo(
+  const value = React19.useMemo(
     () => ({
       direction,
       primarySize,
@@ -8987,7 +9014,7 @@ function SplitPaneContainer({
   gutterSize
 }) {
   const { direction, primarySize, containerRef } = useSplitPaneContext();
-  const style = React20.useMemo(
+  const style = React19.useMemo(
     () => ({
       "--split-pane-primary-size": `${primarySize}px`,
       "--split-pane-gutter": `${gutterSize}px`
@@ -9022,16 +9049,16 @@ function SplitPaneGutter() {
     containerRef,
     resetDefault
   } = useSplitPaneContext();
-  const draggingRef = React20.useRef(false);
-  const pointerIdRef = React20.useRef(null);
-  const startPosRef = React20.useRef(0);
-  const startSizeRef = React20.useRef(primarySize);
-  const maxPrimaryRef = React20.useRef(Infinity);
-  const getClientPos = React20.useCallback(
+  const draggingRef = React19.useRef(false);
+  const pointerIdRef = React19.useRef(null);
+  const startPosRef = React19.useRef(0);
+  const startSizeRef = React19.useRef(primarySize);
+  const maxPrimaryRef = React19.useRef(Infinity);
+  const getClientPos = React19.useCallback(
     (e) => direction === "horizontal" ? e.clientX : e.clientY,
     [direction]
   );
-  const computeClamp = React20.useCallback(() => {
+  const computeClamp = React19.useCallback(() => {
     const el = containerRef.current;
     if (!el) return { maxPrimary: Infinity, total: 0 };
     const rect = el.getBoundingClientRect();
@@ -9039,7 +9066,7 @@ function SplitPaneGutter() {
     const maxPrimary2 = Math.max(minPrimarySize, total - minSecondarySize);
     return { maxPrimary: maxPrimary2, total };
   }, [containerRef, direction, minPrimarySize, minSecondarySize]);
-  const onPointerDown = React20.useCallback(
+  const onPointerDown = React19.useCallback(
     (e) => {
       const el = containerRef.current;
       if (!el) return;
@@ -9055,7 +9082,7 @@ function SplitPaneGutter() {
     },
     [computeClamp, containerRef, direction, getClientPos, primarySize]
   );
-  const onPointerMove = React20.useCallback(
+  const onPointerMove = React19.useCallback(
     (e) => {
       if (!draggingRef.current) return;
       if (pointerIdRef.current !== null && e.pointerId !== pointerIdRef.current) return;
@@ -9066,16 +9093,16 @@ function SplitPaneGutter() {
     },
     [getClientPos, minPrimarySize, setPrimarySize]
   );
-  const endDrag = React20.useCallback(() => {
+  const endDrag = React19.useCallback(() => {
     if (!draggingRef.current) return;
     draggingRef.current = false;
     pointerIdRef.current = null;
     document.body.style.cursor = "";
     document.body.style.userSelect = "";
   }, []);
-  const onPointerUp = React20.useCallback(() => endDrag(), [endDrag]);
-  const onPointerCancel = React20.useCallback(() => endDrag(), [endDrag]);
-  const onKeyDown = React20.useCallback(
+  const onPointerUp = React19.useCallback(() => endDrag(), [endDrag]);
+  const onPointerCancel = React19.useCallback(() => endDrag(), [endDrag]);
+  const onKeyDown = React19.useCallback(
     (e) => {
       const { maxPrimary: maxPrimary2 } = computeClamp();
       const step = e.shiftKey ? 32 : 8;
@@ -9129,7 +9156,7 @@ function MetaBar({ items, separator = "\u2022" }) {
     (item) => item.value !== null && item.value !== void 0 && item.value !== ""
   );
   if (visibleItems.length === 0) return null;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: MetaBar_default.meta, children: visibleItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(React20.Fragment, { children: [
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: MetaBar_default.meta, children: visibleItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(React19.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsxs("span", { className: item.muted === false ? MetaBar_default.itemDefault : MetaBar_default.itemMuted, children: [
       item.label && /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
         item.label,
@@ -9180,7 +9207,7 @@ function CopyButton(props) {
     disabled,
     ...rest
   } = props;
-  const [copied, setCopied] = React20.useState(false);
+  const [copied, setCopied] = React19.useState(false);
   const toast = useOptionalToast();
   const buttonLabel = children;
   const icon = disableIcon ? null : copied ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Copy, {});
@@ -9297,7 +9324,7 @@ function getTextContent(node) {
   if (node == null || typeof node === "boolean") return "";
   if (typeof node === "string" || typeof node === "number") return String(node);
   if (Array.isArray(node)) return node.map(getTextContent).join("");
-  if (React20.isValidElement(node)) return getTextContent(node.props.children);
+  if (React19.isValidElement(node)) return getTextContent(node.props.children);
   return "";
 }
 function CodeBlock({
@@ -9311,15 +9338,15 @@ function CodeBlock({
 }) {
   const text = typeof code === "string" ? code : void 0;
   const hasChildren2 = children !== void 0 && children !== null;
-  const [isWrapped, setIsWrapped] = React20.useState(wrap);
-  const copy = React20.useMemo(
+  const [isWrapped, setIsWrapped] = React19.useState(wrap);
+  const copy = React19.useMemo(
     () => {
       var _a;
       return (_a = copyText != null ? copyText : text) != null ? _a : getTextContent(children);
     },
     [copyText, text, children]
   );
-  const lines = React20.useMemo(
+  const lines = React19.useMemo(
     () => smart && !hasChildren2 && typeof text === "string" ? text.split("\n") : null,
     [smart, hasChildren2, text]
   );
@@ -9480,7 +9507,7 @@ function collectInitiallyExpandedNodeIds(value, defaultExpandedDepth, expandAll,
 }
 function HighlightedText({ text, query }) {
   return getHighlightedSegments(text, query).map(
-    (segment, index) => segment.matched ? /* @__PURE__ */ jsxRuntime.jsx("mark", { className: "dbc-highlight", children: segment.text }, `${segment.text}-${index}`) : /* @__PURE__ */ jsxRuntime.jsx(React20.Fragment, { children: segment.text }, `${segment.text}-${index}`)
+    (segment, index) => segment.matched ? /* @__PURE__ */ jsxRuntime.jsx("mark", { className: "dbc-highlight", children: segment.text }, `${segment.text}-${index}`) : /* @__PURE__ */ jsxRuntime.jsx(React19.Fragment, { children: segment.text }, `${segment.text}-${index}`)
   );
 }
 
@@ -9630,8 +9657,8 @@ function JsonNode({
   );
 }
 function useClipboardStatus() {
-  const [copiedId, setCopiedId] = React20.useState(null);
-  React20.useEffect(() => {
+  const [copiedId, setCopiedId] = React19.useState(null);
+  React19.useEffect(() => {
     if (!copiedId) return;
     const timer = window.setTimeout(() => setCopiedId(null), 1400);
     return () => window.clearTimeout(timer);
@@ -9649,18 +9676,18 @@ function JsonViewer({
   className,
   maxHeight
 }) {
-  const [queryInput, setQueryInput] = React20.useState("");
-  const [query, setQuery] = React20.useState("");
+  const [queryInput, setQueryInput] = React19.useState("");
+  const [query, setQuery] = React19.useState("");
   const normalizedQuery = normalizeSearch(query);
-  const inputId = React20.useId();
+  const inputId = React19.useId();
   const { copiedId, setCopiedId } = useClipboardStatus();
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     const timeoutId = window.setTimeout(() => {
       setQuery(queryInput);
     }, searchDebounceMs);
     return () => window.clearTimeout(timeoutId);
   }, [queryInput, searchDebounceMs]);
-  const safeValue = React20.useMemo(() => {
+  const safeValue = React19.useMemo(() => {
     if (isJsonValue(value)) return value;
     return {
       unsupported: {
@@ -9669,12 +9696,12 @@ function JsonViewer({
       }
     };
   }, [value]);
-  const matches = React20.useMemo(
+  const matches = React19.useMemo(
     () => normalizedQuery ? collectSearchMatches(safeValue, normalizedQuery) : /* @__PURE__ */ new Map(),
     [normalizedQuery, safeValue]
   );
-  const allExpandableNodeIds = React20.useMemo(() => collectExpandableNodeIds(safeValue), [safeValue]);
-  const [expandedNodeIds, setExpandedNodeIds] = React20.useState(
+  const allExpandableNodeIds = React19.useMemo(() => collectExpandableNodeIds(safeValue), [safeValue]);
+  const [expandedNodeIds, setExpandedNodeIds] = React19.useState(
     () => new Set(collectInitiallyExpandedNodeIds(safeValue, defaultExpandedDepth, expandAll))
   );
   const hasResults = normalizedQuery ? matches.size > 0 : true;
@@ -9813,10 +9840,10 @@ function useTimeDuration({
   liveUpdate = false,
   formatDuration = defaultDuration
 }) {
-  const [hydrated, setHydrated] = React20.useState(false);
-  const [tick, setTick] = React20.useState(0);
-  React20.useEffect(() => setHydrated(true), []);
-  React20.useEffect(() => {
+  const [hydrated, setHydrated] = React19.useState(false);
+  const [tick, setTick] = React19.useState(0);
+  React19.useEffect(() => setHydrated(true), []);
+  React19.useEffect(() => {
     if (!liveUpdate) return;
     if (end && end.getTime() <= Date.now()) return;
     const timer = setInterval(() => {
@@ -9827,17 +9854,17 @@ function useTimeDuration({
     }, 1e3);
     return () => clearInterval(timer);
   }, [liveUpdate, end]);
-  const started = React20.useMemo(() => {
+  const started = React19.useMemo(() => {
     if (!start) return fallback;
     if (!hydrated) return fallback;
     return new Intl.DateTimeFormat("da-DK", dateFormat).format(start);
   }, [start, hydrated, fallback, dateFormat]);
-  const ended = React20.useMemo(() => {
+  const ended = React19.useMemo(() => {
     if (!end) return fallback;
     if (!hydrated) return fallback;
     return new Intl.DateTimeFormat("da-DK", dateFormat).format(end);
   }, [end, hydrated, fallback, dateFormat]);
-  const duration = React20.useMemo(() => {
+  const duration = React19.useMemo(() => {
     if (!start || !hydrated) return fallback;
     const now = Date.now();
     if (!end) {
@@ -9893,12 +9920,12 @@ function useSorting({
   resetOnDataChange = false
 }) {
   const isControlled = state != null;
-  const [uncontrolled, setUncontrolled] = React20.useState(() => ({
+  const [uncontrolled, setUncontrolled] = React19.useState(() => ({
     sortBy,
     sortDirection
   }));
   const sortState = isControlled ? state : uncontrolled;
-  const setSort = React20.useCallback(
+  const setSort = React19.useCallback(
     (next) => {
       var _a, _b;
       const normalized = {
@@ -9910,8 +9937,8 @@ function useSorting({
     },
     [isControlled, onStateChange]
   );
-  const clearSort = React20.useCallback(() => setSort({ sortBy: null, sortDirection: null }), [setSort]);
-  const onSortChange = React20.useCallback(
+  const clearSort = React19.useCallback(() => setSort({ sortBy: null, sortDirection: null }), [setSort]);
+  const onSortChange = React19.useCallback(
     (e) => {
       var _a, _b;
       const nextSortBy = (_a = e.sortBy) != null ? _a : null;
@@ -9931,8 +9958,8 @@ function useSorting({
     },
     [allowUnsort, clearSort, setSort, sortState]
   );
-  const didInitRef = React20.useRef(false);
-  React20.useEffect(() => {
+  const didInitRef = React19.useRef(false);
+  React19.useEffect(() => {
     if (!resetOnDataChange) return;
     if (!didInitRef.current) {
       didInitRef.current = true;
@@ -9940,7 +9967,7 @@ function useSorting({
     }
     clearSort();
   }, [resetOnDataChange, data]);
-  const sortedData = React20.useMemo(() => {
+  const sortedData = React19.useMemo(() => {
     const { sortBy: sb, sortDirection: dir } = sortState;
     if (!sb || !dir) return data;
     const custom = columnComparators[sb];
@@ -9952,7 +9979,7 @@ function useSorting({
     };
     return stableSort(data, cmp);
   }, [data, sortState, columnComparators, nulls]);
-  const setSortRef = React20.useRef(setSort);
+  const setSortRef = React19.useRef(setSort);
   setSortRef.current = setSort;
   return {
     sortedData,
@@ -9996,8 +10023,8 @@ function usePagination({
   storageKey
 }) {
   const isControlled = state != null;
-  const [hydrated, setHydrated] = React20.useState(() => !storageKey || isControlled);
-  const [uncontrolled, setUncontrolled] = React20.useState(() => {
+  const [hydrated, setHydrated] = React19.useState(() => !storageKey || isControlled);
+  const [uncontrolled, setUncontrolled] = React19.useState(() => {
     var _a;
     const initial = normalizePaginationState({
       skip,
@@ -10008,7 +10035,7 @@ function usePagination({
     }
     return (_a = safeParsePaginationState(window.localStorage.getItem(storageKey))) != null ? _a : initial;
   });
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (typeof window === "undefined") return;
     if (isControlled || !storageKey) {
       setHydrated(true);
@@ -10019,8 +10046,8 @@ function usePagination({
     setUncontrolled(stored != null ? stored : fallback);
     setHydrated(true);
   }, [isControlled, storageKey, skip, take]);
-  const didInitRef = React20.useRef(false);
-  React20.useEffect(() => {
+  const didInitRef = React19.useRef(false);
+  React19.useEffect(() => {
     if (isControlled) return;
     if (storageKey) return;
     if (!didInitRef.current) {
@@ -10040,7 +10067,7 @@ function usePagination({
     totalCount === 0 ? 0 : Math.floor((totalCount - 1) / safeTake) * safeTake
   );
   const safeSkip = clamp5(Math.max(0, paginationState.skip), 0, maxSkip);
-  const setPagination = React20.useCallback(
+  const setPagination = React19.useCallback(
     (next) => {
       const normalized = normalizePaginationState(next);
       if (isControlled) {
@@ -10051,7 +10078,7 @@ function usePagination({
     },
     [isControlled, onStateChange]
   );
-  const onPageChange = React20.useCallback(
+  const onPageChange = React19.useCallback(
     (pageEvent) => {
       const nextTake = Math.max(1, pageEvent.take);
       const nextSkip = Math.max(0, (pageEvent.page - 1) * nextTake);
@@ -10059,25 +10086,25 @@ function usePagination({
     },
     [setPagination]
   );
-  const resetPage = React20.useCallback(() => {
+  const resetPage = React19.useCallback(() => {
     setPagination({ skip: 0, take: safeTake });
   }, [setPagination, safeTake]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!resetOnDataChange) return;
     if (!hydrated) return;
     resetPage();
   }, [resetOnDataChange, data, hydrated]);
-  const paginatedData = React20.useMemo(() => {
+  const paginatedData = React19.useMemo(() => {
     return data.slice(safeSkip, safeSkip + safeTake);
   }, [data, safeSkip, safeTake]);
-  const page = React20.useMemo(() => Math.floor(safeSkip / safeTake) + 1, [safeSkip, safeTake]);
-  React20.useEffect(() => {
+  const page = React19.useMemo(() => Math.floor(safeSkip / safeTake) + 1, [safeSkip, safeTake]);
+  React19.useEffect(() => {
     if (isControlled) return;
     if (safeSkip !== paginationState.skip) {
       setUncontrolled((prev) => ({ ...prev, skip: safeSkip }));
     }
   }, [isControlled, safeSkip, paginationState.skip]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (typeof window === "undefined") return;
     if (isControlled || !storageKey) return;
     if (!hydrated) return;
@@ -10123,11 +10150,11 @@ function useTableData({
     state: pagination == null ? void 0 : pagination.state,
     onStateChange: pagination == null ? void 0 : pagination.onStateChange
   });
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!resetPageOnSortChange) return;
     p.resetPage();
   }, [resetPageOnSortChange, s.sortState.sortBy, s.sortState.sortDirection]);
-  const rows = React20.useMemo(() => p.paginatedData, [p.paginatedData]);
+  const rows = React19.useMemo(() => p.paginatedData, [p.paginatedData]);
   return {
     rows,
     totalCount: s.sortedData.length,
@@ -10175,17 +10202,17 @@ function useTableSelection({
   storage = "session"
 }) {
   const resolvedInitialSelectedIds = initialSelectedIds != null ? initialSelectedIds : EMPTY_IDS;
-  const [selectedIds, setSelectedIds] = React20.useState(resolvedInitialSelectedIds);
-  const [hydrated, setHydrated] = React20.useState(false);
-  const lastWrittenRef = React20.useRef(null);
-  const itemsById = React20.useMemo(() => {
+  const [selectedIds, setSelectedIds] = React19.useState(resolvedInitialSelectedIds);
+  const [hydrated, setHydrated] = React19.useState(false);
+  const lastWrittenRef = React19.useRef(null);
+  const itemsById = React19.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const item of items) {
       map.set(getId(item), item);
     }
     return map;
   }, [items, getId]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (typeof window === "undefined") return;
     const storageApi = storage === "local" ? window.localStorage : window.sessionStorage;
     if (!storageKey) {
@@ -10202,7 +10229,7 @@ function useTableSelection({
     lastWrittenRef.current = serializeIds(next);
     setHydrated(true);
   }, [storage, storageKey, resolvedInitialSelectedIds]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!pruneToItems) return;
     const visibleIds = new Set(Array.from(itemsById.keys()));
     setSelectedIds((prev) => {
@@ -10215,7 +10242,7 @@ function useTableSelection({
       return areSetsEqual(prev, next) ? prev : next;
     });
   }, [pruneToItems, itemsById]);
-  const selectedItemMap = React20.useMemo(() => {
+  const selectedItemMap = React19.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     for (const id of selectedIds) {
       const item = itemsById.get(id);
@@ -10223,13 +10250,13 @@ function useTableSelection({
     }
     return map;
   }, [selectedIds, itemsById]);
-  const selectedItems = React20.useMemo(() => Array.from(selectedItemMap.values()), [selectedItemMap]);
-  const allSelected = React20.useMemo(() => {
+  const selectedItems = React19.useMemo(() => Array.from(selectedItemMap.values()), [selectedItemMap]);
+  const allSelected = React19.useMemo(() => {
     if (items.length === 0) return false;
     return items.every((item) => selectedIds.has(getId(item)));
   }, [items, selectedIds, getId]);
-  const anySelected = React20.useMemo(() => selectedIds.size > 0, [selectedIds]);
-  React20.useEffect(() => {
+  const anySelected = React19.useMemo(() => selectedIds.size > 0, [selectedIds]);
+  React19.useEffect(() => {
     if (!hydrated) return;
     if (typeof window === "undefined") return;
     if (storageKey) {
@@ -10242,7 +10269,7 @@ function useTableSelection({
     }
     onSelectionChange == null ? void 0 : onSelectionChange({ selectedIds, selectedItems });
   }, [hydrated, onSelectionChange, selectedIds, selectedItems, storage, storageKey]);
-  const toggleId = React20.useCallback(
+  const toggleId = React19.useCallback(
     (id, selected) => {
       setSelectedIds((prev) => {
         const next = new Set(prev);
@@ -10260,22 +10287,22 @@ function useTableSelection({
     },
     [selectionMode]
   );
-  const toggleItem = React20.useCallback(
+  const toggleItem = React19.useCallback(
     (item) => {
       toggleId(getId(item));
     },
     [toggleId, getId]
   );
-  const selectOnly = React20.useCallback((id) => {
+  const selectOnly = React19.useCallback((id) => {
     setSelectedIds((prev) => {
       const next = /* @__PURE__ */ new Set([id]);
       return areSetsEqual(prev, next) ? prev : next;
     });
   }, []);
-  const clearSelection = React20.useCallback(() => {
+  const clearSelection = React19.useCallback(() => {
     setSelectedIds((prev) => prev.size === 0 ? prev : /* @__PURE__ */ new Set());
   }, []);
-  const toggleAll = React20.useCallback(
+  const toggleAll = React19.useCallback(
     (selected) => {
       if (!selected) {
         clearSelection();
@@ -10333,7 +10360,7 @@ function ChipMultiToggle({
   type = "rounded",
   dataCy
 }) {
-  const selectedSet = React20__namespace.default.useMemo(() => new Set(selectedValues), [selectedValues]);
+  const selectedSet = React19__namespace.default.useMemo(() => new Set(selectedValues), [selectedValues]);
   const isNoneSelected = allTogglesNone && selectedSet.has(noneValue);
   const isAllSelected = showAllOption && !isNoneSelected && selectedSet.size === 0;
   const toggleValue = (value) => {
@@ -10451,8 +10478,8 @@ function CheckboxGroup({
   "data-cy": dataCy
 }) {
   var _a, _b;
-  const selectedSet = React20.useMemo(() => new Set(selectedValues), [selectedValues]);
-  const enabledValues = React20.useMemo(
+  const selectedSet = React19.useMemo(() => new Set(selectedValues), [selectedValues]);
+  const enabledValues = React19.useMemo(
     () => options.filter((o) => !(disabled || o.disabled)).map((o) => o.value),
     [options, disabled]
   );
@@ -10583,15 +10610,15 @@ function SidePanel({
   detailsHeaderAddition,
   ...props
 }) {
-  const [mounted, setMounted] = React20.useState(false);
-  const [shouldRender, setShouldRender] = React20.useState(isOpen);
-  const [isActive, setIsActive] = React20.useState(false);
-  const panelRef = React20.useRef(null);
-  React20.useEffect(() => setMounted(true), []);
-  React20.useEffect(() => {
+  const [mounted, setMounted] = React19.useState(false);
+  const [shouldRender, setShouldRender] = React19.useState(isOpen);
+  const [isActive, setIsActive] = React19.useState(false);
+  const panelRef = React19.useRef(null);
+  React19.useEffect(() => setMounted(true), []);
+  React19.useEffect(() => {
     if (isOpen) setShouldRender(true);
   }, [isOpen]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!isOpen) return;
     const handleKeyDown = (e) => {
       if (e.key === "Escape") {
@@ -10604,7 +10631,7 @@ function SidePanel({
       document.removeEventListener("keydown", handleKeyDown);
     };
   }, [isOpen, onClose]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!shouldRender) return;
     if (!isOpen) {
       setIsActive(false);
@@ -10613,7 +10640,7 @@ function SidePanel({
     const raf = requestAnimationFrame(() => setIsActive(true));
     return () => cancelAnimationFrame(raf);
   }, [isOpen, shouldRender]);
-  React20.useEffect(() => {
+  React19.useEffect(() => {
     if (!shouldRender) return;
     const el = panelRef.current;
     if (!el) return;
@@ -10682,7 +10709,7 @@ function SidePanel({
                 /* @__PURE__ */ jsxRuntime.jsx(
                   Headline,
                   {
-                    size: 3,
+                    size: 2,
                     disableMargin: true,
                     severity,
                     marker: showHeaderMarker,
@@ -10721,7 +10748,7 @@ function SidePanel({
   );
 }
 function useSidePanel(initialOpen = false) {
-  const [isOpen, setIsOpen] = React20.useState(initialOpen);
+  const [isOpen, setIsOpen] = React19.useState(initialOpen);
   const openSidePanel = () => setIsOpen(true);
   const closeSidePanel = () => setIsOpen(false);
   return {
@@ -10780,7 +10807,7 @@ function Tooltip({
     delayOpenMs,
     delayCloseMs
   });
-  const rootClass = React20.useMemo(
+  const rootClass = React19.useMemo(
     () => ["TooltipContainer", className].filter(Boolean).join(" "),
     [className]
   );
@@ -10804,7 +10831,7 @@ function RadioButtonGroup({
   direction = "column",
   "data-cy": dataCy
 }) {
-  const generated = React20.useId();
+  const generated = React19.useId();
   const groupName = name != null ? name : `radio-group-${generated}`;
   const content = /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -10876,22 +10903,22 @@ function IntervalSelect({
   dataCy,
   disabled
 }) {
-  const generatedId = React20.useId();
+  const generatedId = React19.useId();
   const controlId = id != null ? id : `interval-select-${generatedId}`;
   const describedById = `${controlId}-desc`;
   const listboxId = `${controlId}-listbox`;
-  const popoverRef = React20.useRef(null);
-  const optionRefs = React20.useRef([]);
-  const selectedIndex = React20.useMemo(
+  const popoverRef = React19.useRef(null);
+  const optionRefs = React19.useRef([]);
+  const selectedIndex = React19.useMemo(
     () => options.findIndex((o) => o.minutesAgo === selectedValue),
     [options, selectedValue]
   );
-  const [activeIndex, setActiveIndex] = React20.useState(selectedIndex >= 0 ? selectedIndex : 0);
-  React20.useEffect(() => {
+  const [activeIndex, setActiveIndex] = React19.useState(selectedIndex >= 0 ? selectedIndex : 0);
+  React19.useEffect(() => {
     var _a;
     (_a = optionRefs.current[activeIndex]) == null ? void 0 : _a.focus();
   }, [activeIndex]);
-  const selected = React20.useMemo(
+  const selected = React19.useMemo(
     () => {
       var _a;
       return (_a = options.find((o) => o.minutesAgo === selectedValue)) != null ? _a : null;
@@ -11042,6 +11069,7 @@ function IntervalSelect({
 // src/components/accordion/Accordion.module.css
 var Accordion_default = {
   container: "Accordion_container",
+  outlined: "Accordion_outlined",
   sm: "Accordion_sm",
   md: "Accordion_md",
   lg: "Accordion_lg"
@@ -11058,13 +11086,14 @@ var AccordionRow_default = {
   panel: "AccordionRow_panel",
   animate: "AccordionRow_animate",
   noAnimate: "AccordionRow_noAnimate",
-  content: "AccordionRow_content"
+  content: "AccordionRow_content",
+  item: "AccordionRow_item"
 };
 function useCollapsibleHeight(isOpen, shouldAnimate) {
-  const innerRef = React20.useRef(null);
-  const [height, setHeight] = React20.useState("0px");
-  const prevIsOpenRef = React20.useRef(isOpen);
-  React20.useLayoutEffect(() => {
+  const innerRef = React19.useRef(null);
+  const [height, setHeight] = React19.useState("0px");
+  const prevIsOpenRef = React19.useRef(isOpen);
+  React19.useLayoutEffect(() => {
     var _a, _b;
     const el = innerRef.current;
     if (!el) return;
@@ -11101,7 +11130,9 @@ function AccordionRow({
   item,
   isOpen,
   onToggle,
-  shouldAnimate = true
+  shouldAnimate = true,
+  headlineSize = 4,
+  variant = "default"
 }) {
   const isDisabled = !!item.disabled;
   const buttonId = `${uid}-acc-btn-${index}`;
@@ -11129,8 +11160,8 @@ function AccordionRow({
                   Headline,
                   {
                     disableMargin: true,
-                    size: 4,
-                    weight: 500,
+                    size: headlineSize,
+                    weight: variant === "outlined" ? 400 : 500,
                     severity: item.severity,
                     subheader: item.subheader,
                     allowWrap: isOpen,
@@ -11169,6 +11200,7 @@ function Accordion({
   items,
   mode = "single",
   size = "md",
+  variant = "default",
   defaultOpenIndex = null,
   defaultOpenIndexes = [],
   openIndex,
@@ -11176,28 +11208,28 @@ function Accordion({
   onOpenIndexChange,
   onOpenIndexesChange
 }) {
-  const uid = React20.useId();
+  const uid = React19.useId();
   const isControlled = mode === "single" ? openIndex !== void 0 : openIndexes !== void 0;
-  const hasMountedRef = React20.useRef(false);
-  React20.useEffect(() => {
-    hasMountedRef.current = true;
+  const [hasMounted, setHasMounted] = React19.useState(false);
+  React19.useEffect(() => {
+    setHasMounted(true);
   }, []);
-  const [internalSingle, setInternalSingle] = React20.useState(
+  const [internalSingle, setInternalSingle] = React19.useState(
     mode === "single" ? defaultOpenIndex : null
   );
-  const [internalMultiple, setInternalMultiple] = React20.useState(() => {
+  const [internalMultiple, setInternalMultiple] = React19.useState(() => {
     if (mode !== "multiple") return [];
     if (defaultOpenIndexes === "all") return items.map((_, i) => i);
     return normalizeMultiple(defaultOpenIndexes);
   });
-  const currentOpenIndexes = React20.useMemo(() => {
+  const currentOpenIndexes = React19.useMemo(() => {
     if (mode === "single") {
       const current = isControlled ? openIndex != null ? openIndex : null : internalSingle;
       return current === null ? [] : [current];
     }
     return isControlled ? normalizeMultiple(openIndexes) : internalMultiple;
   }, [mode, isControlled, openIndex, openIndexes, internalSingle, internalMultiple]);
-  const openSet = React20.useMemo(() => new Set(currentOpenIndexes), [currentOpenIndexes]);
+  const openSet = React19.useMemo(() => new Set(currentOpenIndexes), [currentOpenIndexes]);
   function commit(nextIndexes) {
     if (mode === "single") {
       const next = nextIndexes.length ? nextIndexes[0] : null;
@@ -11226,18 +11258,26 @@ function Accordion({
     if (isOpen) commit(currentOpenIndexes.filter((i) => i !== index));
     else commit([...currentOpenIndexes, index]);
   }
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${Accordion_default.container} ${Accordion_default[size]}`, children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(
-    AccordionRow,
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      uid,
-      index: i,
-      item,
-      isOpen: openSet.has(i),
-      onToggle: toggle,
-      shouldAnimate: hasMountedRef.current
-    },
-    i
-  )) });
+      className: [Accordion_default.container, Accordion_default[size], variant !== "default" ? Accordion_default[variant] : ""].filter(Boolean).join(" "),
+      children: items.map((item, i) => /* @__PURE__ */ jsxRuntime.jsx(
+        AccordionRow,
+        {
+          uid,
+          index: i,
+          item,
+          isOpen: openSet.has(i),
+          onToggle: toggle,
+          shouldAnimate: hasMounted,
+          headlineSize: size === "sm" ? 4 : 3,
+          variant
+        },
+        i
+      ))
+    }
+  );
 }
 var EmptyIllustration = () => /* @__PURE__ */ jsxRuntime.jsxs(
   "svg",
@@ -12451,7 +12491,7 @@ function StatePage({
   children,
   actions
 }) {
-  const illustration = React20.useMemo(() => {
+  const illustration = React19.useMemo(() => {
     switch (type) {
       case "error":
         return /* @__PURE__ */ jsxRuntime.jsx(ErrorIllustration, {});
@@ -12487,14 +12527,14 @@ function StickyFooterLayout({
   className
 }) {
   const pad = `var(${chromePaddingVar})`;
-  const contentColRef = React20.useRef(null);
-  const footerOverlayRef = React20.useRef(null);
-  const [dock, setDock] = React20.useState({
+  const contentColRef = React19.useRef(null);
+  const footerOverlayRef = React19.useRef(null);
+  const [dock, setDock] = React19.useState({
     left: 0,
     width: typeof maxWidth === "number" ? maxWidth : 550
   });
-  const [overlayHeight, setOverlayHeight] = React20.useState(0);
-  React20.useLayoutEffect(() => {
+  const [overlayHeight, setOverlayHeight] = React19.useState(0);
+  React19.useLayoutEffect(() => {
     const el = contentColRef.current;
     if (!el) return;
     const measure = () => {
@@ -12510,7 +12550,7 @@ function StickyFooterLayout({
       window.removeEventListener("resize", measure);
     };
   }, []);
-  React20.useLayoutEffect(() => {
+  React19.useLayoutEffect(() => {
     const el = footerOverlayRef.current;
     if (!el) return;
     const measure = () => setOverlayHeight(el.getBoundingClientRect().height);
@@ -12738,6 +12778,48 @@ function Alert({
   );
 }
 
+// src/components/inline-status/InlineStatus.module.css
+var InlineStatus_default = {
+  container: "InlineStatus_container",
+  fullWidth: "InlineStatus_fullWidth",
+  leading: "InlineStatus_leading",
+  body: "InlineStatus_body",
+  sm: "InlineStatus_sm",
+  md: "InlineStatus_md",
+  neutral: "InlineStatus_neutral",
+  success: "InlineStatus_success",
+  warning: "InlineStatus_warning",
+  error: "InlineStatus_error",
+  info: "InlineStatus_info",
+  brand: "InlineStatus_brand"
+};
+function InlineStatus({
+  children,
+  severity = "neutral",
+  customIcon,
+  disableIcon = false,
+  fullWidth = false,
+  size = "sm"
+}) {
+  const hasLeading = Boolean(customIcon) || !disableIcon;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: [
+        InlineStatus_default.container,
+        InlineStatus_default[severity],
+        InlineStatus_default[size],
+        fullWidth ? InlineStatus_default.fullWidth : "",
+        hasLeading ? InlineStatus_default.hasLeading : ""
+      ].filter(Boolean).join(" "),
+      children: [
+        hasLeading ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: InlineStatus_default.leading, children: customIcon != null ? customIcon : /* @__PURE__ */ jsxRuntime.jsx(Icon, { severity }) }) : null,
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: InlineStatus_default.body, children })
+      ]
+    }
+  );
+}
+
 exports.Accordion = Accordion;
 exports.Alert = Alert;
 exports.AppHeader = AppHeader;
@@ -12761,16 +12843,17 @@ exports.DateTimePicker = DateTimePicker;
 exports.Divider = Divider;
 exports.FadeOverlay = FadeOverlay;
 exports.FilterField = FilterField;
+exports.Footer = Footer;
 exports.Grid = Grid;
 exports.GridItem = GridItem;
 exports.Headline = Headline;
 exports.Hyperlink = Hyperlink;
 exports.Icon = Icon;
+exports.InlineStatus = InlineStatus;
 exports.Input = Input;
 exports.InputContainer = InputContainer;
 exports.IntervalSelect = IntervalSelect;
 exports.JsonViewer = JsonViewer;
-exports.LayoutFooter = LayoutFooter;
 exports.Menu = Menu;
 exports.MetaBar = MetaBar;
 exports.Modal = Modal;