@dbcdk/react-components 0.0.95 → 0.0.97

package/dist/tanstack.js

@@ -1,3 +1,2650 @@
-export * from './components/table/TanstackTable';
-export * from './components/table/components/table-settings/TableSettings';
-export * from './hooks/useTableSettings';
+import { useReactTable, getSortedRowModel, getCoreRowModel } from '@tanstack/react-table';
+import * as React9 from 'react';
+import { createContext, forwardRef, useId, useState, useRef, useEffect, useCallback, useImperativeHandle, useLayoutEffect, useContext, useMemo } from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
+import { LoaderCircle, ChevronUp, ChevronDown, Check, ListChevronsDownUp, Settings, ChevronsLeft, ArrowLeft, ArrowRight, ChevronsRight, ArrowUp, ArrowDown } from 'lucide-react';
+import { createPortal } from 'react-dom';
+
+// src/components/table/components/column-resizer/ColumnResizer.module.css
+var ColumnResizer_default = {
+  resizer: "ColumnResizer_resizer"
+};
+var ColumnResizer = ({ id, handler }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: ColumnResizer_default.resizer,
+    "data-resizer": "true",
+    onMouseDown: handler,
+    onTouchStart: handler,
+    role: "separator",
+    "aria-orientation": "vertical",
+    "aria-label": `Resize ${id}`
+  }
+);
+var ColumnResizer_default2 = ColumnResizer;
+
+// src/components/pagination/Pagination.module.css
+var Pagination_default = {
+  container: "Pagination_container2",
+  range: "Pagination_range2"
+};
+var TooltipContext = createContext(null);
+
+// src/components/overlay/tooltip/useTooltipTrigger.tsx
+function useTooltipTrigger(options) {
+  const ctx = useContext(TooltipContext);
+  if (!ctx) throw new Error("useTooltipTrigger must be used within <TooltipProvider>.");
+  const {
+    content,
+    placement = "top",
+    offset = 8,
+    open,
+    defaultOpen = false,
+    delayOpenMs = 150,
+    delayCloseMs = 50,
+    focusOpenMode = "focus-visible",
+    closeOnPointerDown = true
+  } = options;
+  const id = useId();
+  const triggerElRef = useRef(null);
+  const isControlled = open !== void 0;
+  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
+  const isOpen = isControlled ? !!open : uncontrolledOpen;
+  const openTimer = useRef(null);
+  const closeTimer = 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 = useRef(null);
+  const show = useCallback(() => {
+    if (!content) return;
+    ctx.show({
+      id,
+      content,
+      placement,
+      offset,
+      triggerEl: triggerElRef.current
+    });
+    lastSentRef.current = { content, placement, offset };
+  }, [ctx, id, content, placement, offset]);
+  const hide = useCallback(() => {
+    ctx.hide(id);
+  }, [ctx, id]);
+  useEffect(() => {
+    if (!isOpen) {
+      hide();
+      return;
+    }
+    show();
+  }, [isOpen, show, hide]);
+  useEffect(() => {
+    var _a;
+    if (!isOpen) return;
+    if (((_a = ctx.active) == null ? void 0 : _a.id) !== id) return;
+    const last = lastSentRef.current;
+    const changed = !last || last.content !== content || last.placement !== placement || last.offset !== offset;
+    if (!changed) return;
+    ctx.update(id, {
+      content,
+      placement,
+      offset,
+      triggerEl: triggerElRef.current
+    });
+    lastSentRef.current = { content, placement, offset };
+  }, [ctx, id, isOpen, content, placement, offset]);
+  const setOpen = (next) => {
+    if (isControlled) return;
+    setUncontrolledOpen(next);
+  };
+  const onPointerEnter = () => {
+    clearTimers();
+    if (isControlled) return;
+    openTimer.current = window.setTimeout(() => setOpen(true), delayOpenMs);
+  };
+  const onPointerLeave = () => {
+    clearTimers();
+    if (isControlled) return;
+    closeTimer.current = window.setTimeout(() => setOpen(false), delayCloseMs);
+  };
+  const onPointerDown = () => {
+    clearTimers();
+    if (!isControlled && closeOnPointerDown) setOpen(false);
+  };
+  const onFocus = (e) => {
+    clearTimers();
+    if (focusOpenMode === "off") return;
+    const shouldOpen = focusOpenMode === "any" || e.currentTarget.matches(":focus-visible");
+    if (!isControlled && shouldOpen) {
+      openTimer.current = window.setTimeout(() => setOpen(true), delayOpenMs);
+    }
+  };
+  const onBlur = () => {
+    clearTimers();
+    if (!isControlled) setOpen(false);
+  };
+  return {
+    id,
+    isOpen,
+    triggerProps: {
+      ref: (node) => {
+        triggerElRef.current = node;
+      },
+      onPointerEnter,
+      onPointerLeave,
+      onPointerDown,
+      onFocus,
+      onBlur,
+      "aria-describedby": content ? id : void 0
+    }
+  };
+}
+
+// src/components/button/Button.module.css
+var Button_default = {
+  button: "Button_button2",
+  buttonLink: "Button_buttonLink2",
+  round: "Button_round2",
+  rounded: "Button_rounded2",
+  link: "Button_link2",
+  icon: "Button_icon2",
+  xs: "Button_xs2",
+  sm: "Button_sm2",
+  lg: "Button_lg2",
+  fullWidth: "Button_fullWidth2",
+  primary: "Button_primary2",
+  secondary: "Button_secondary2",
+  default: "Button_default2",
+  outlined: "Button_outlined2",
+  active: "Button_active2",
+  success: "Button_success2",
+  danger: "Button_danger2",
+  inline: "Button_inline2"
+};
+function cx(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+function mergeRefs(...refs) {
+  return (node) => {
+    for (const ref of refs) {
+      if (!ref) continue;
+      if (typeof ref === "function") ref(node);
+      else ref.current = node;
+    }
+  };
+}
+var Button = React9.forwardRef(function Button2({
+  variant = "outlined",
+  shape = "default",
+  size = "md",
+  fullWidth,
+  icon,
+  children,
+  loading,
+  active,
+  spinIcon,
+  tooltip,
+  tooltipPlacement = "top",
+  isLink,
+  type = "button",
+  ...rest
+}, ref) {
+  var _a;
+  const { className: userClassName, ...buttonProps } = rest;
+  const computedClassName = cx(
+    Button_default.button,
+    Button_default[variant],
+    Button_default[size],
+    fullWidth ? Button_default.fullWidth : "",
+    active ? Button_default.active : "",
+    loading ? Button_default.loading : "",
+    shape !== "default" ? Button_default[shape] : "",
+    userClassName
+  );
+  const tooltipEnabled = Boolean(tooltip);
+  const childRef = isLink && React9.isValidElement(children) ? (_a = children.ref) != null ? _a : null : null;
+  const mergedRef = React9.useMemo(() => mergeRefs(childRef, ref), [childRef, ref]);
+  const { triggerProps, id: tooltipId } = useTooltipTrigger({
+    content: tooltipEnabled ? tooltip : null,
+    placement: tooltipPlacement,
+    offset: 8
+  });
+  const describedBy = (() => {
+    const existing = typeof buttonProps["aria-describedby"] === "string" ? buttonProps["aria-describedby"] : "";
+    const ids = [existing, tooltipEnabled ? tooltipId : ""].filter(Boolean);
+    return ids.length ? ids.join(" ") : void 0;
+  })();
+  const content = /* @__PURE__ */ jsxs(Fragment, { children: [
+    icon && /* @__PURE__ */ jsx("span", { className: cx(Button_default.icon, spinIcon ? "spin" : ""), children: icon }),
+    children,
+    loading && /* @__PURE__ */ jsx("span", { style: { display: "flex", opacity: 0.5 }, className: "spin", children: /* @__PURE__ */ jsx(LoaderCircle, {}) })
+  ] });
+  let buttonEl;
+  if (isLink && React9.isValidElement(children)) {
+    const childClassName = typeof children.props.className === "string" ? children.props.className : "";
+    const { disabled, onClick, ...linkButtonProps } = buttonProps;
+    const handleClick = (e) => {
+      if (disabled) {
+        e.preventDefault();
+        return;
+      }
+      onClick == null ? void 0 : onClick(e);
+    };
+    buttonEl = React9.cloneElement(children, {
+      ...linkButtonProps,
+      ref: mergedRef,
+      className: cx(childClassName, computedClassName, Button_default.buttonLink),
+      ...tooltipEnabled ? triggerProps : {},
+      "aria-describedby": describedBy,
+      "aria-disabled": disabled ? "true" : void 0,
+      onClick: handleClick,
+      children: /* @__PURE__ */ jsxs(Fragment, { children: [
+        icon && /* @__PURE__ */ jsx("span", { className: cx(Button_default.icon, spinIcon ? "spin" : ""), children: icon }),
+        children.props.children,
+        loading && /* @__PURE__ */ jsx("span", { style: { display: "flex", opacity: 0.5 }, className: "spin", children: /* @__PURE__ */ jsx(LoaderCircle, {}) })
+      ] })
+    });
+  } else {
+    const isDisabled = Boolean(buttonProps.disabled);
+    buttonEl = /* @__PURE__ */ jsx(
+      "button",
+      {
+        className: computedClassName,
+        type,
+        ...buttonProps,
+        ...tooltipEnabled && !isDisabled ? triggerProps : {},
+        "aria-describedby": describedBy,
+        children: content
+      }
+    );
+    if (tooltipEnabled && isDisabled) {
+      buttonEl = /* @__PURE__ */ jsx(
+        "span",
+        {
+          ref: triggerProps.ref,
+          onPointerEnter: triggerProps.onPointerEnter,
+          onPointerLeave: triggerProps.onPointerLeave,
+          style: {
+            display: fullWidth ? "flex" : "inline-flex",
+            cursor: "not-allowed"
+          },
+          children: buttonEl
+        }
+      );
+    }
+  }
+  return buttonEl;
+});
+Button.displayName = "Button";
+
+// src/components/menu/Menu.module.css
+var Menu_default = {
+  container: "Menu_container2",
+  row: "Menu_row2",
+  interactive: "Menu_interactive2",
+  interactiveChild: "Menu_interactiveChild2",
+  selected: "Menu_selected2",
+  active: "Menu_active2",
+  itemDanger: "Menu_itemDanger2",
+  separator: "Menu_separator2",
+  header: "Menu_header2",
+  gap: "Menu_gap2",
+  rowBordered: "Menu_rowBordered2"
+};
+
+// src/components/forms/checkbox/Checkbox.module.css
+var Checkbox_default = {
+  container: "Checkbox_container2",
+  containerSm: "Checkbox_containerSm2",
+  checkbox: "Checkbox_checkbox2",
+  sm: "Checkbox_sm2",
+  label: "Checkbox_label2",
+  checked: "Checkbox_checked2",
+  icon: "Checkbox_icon2",
+  default: "Checkbox_default2",
+  outlined: "Checkbox_outlined2",
+  success: "Checkbox_success2",
+  info: "Checkbox_info2"
+};
+
+// src/components/forms/input-container/InputContainer.module.css
+var InputContainer_default = {
+  horizontal: "InputContainer_horizontal2",
+  labelContainer: "InputContainer_labelContainer2",
+  label: "InputContainer_label2",
+  errorText: "InputContainer_errorText2",
+  helpText: "InputContainer_helpText2",
+  helpTextAddition: "InputContainer_helpTextAddition2",
+  required: "InputContainer_required2",
+  messageRow: "InputContainer_messageRow2",
+  inputContainer: "InputContainer_inputContainer2"
+};
+function InputContainer({
+  label,
+  labelAction,
+  htmlFor,
+  error,
+  helpText,
+  helpTextAddition,
+  fullWidth = false,
+  required = false,
+  children,
+  orientation = "horizontal",
+  size = "md",
+  labelWidth = "160px",
+  modified = false
+}) {
+  const message = error != null ? error : helpText;
+  const messageClass = error ? InputContainer_default.errorText : InputContainer_default.helpText;
+  const renderLabelRow = (label || labelAction) && /* @__PURE__ */ jsxs("div", { className: `${InputContainer_default.labelRow} dbc-flex dbc-items-center dbc-gap-md`, children: [
+    label && /* @__PURE__ */ jsxs("label", { className: InputContainer_default.label, htmlFor, children: [
+      label,
+      required && /* @__PURE__ */ jsx("span", { className: InputContainer_default.required, children: " *" })
+    ] }),
+    labelAction && /* @__PURE__ */ jsx("div", { className: InputContainer_default.labelAction, children: labelAction })
+  ] });
+  const renderMessageRow = (message || helpTextAddition) && /* @__PURE__ */ jsxs("div", { className: `${messageClass} ${InputContainer_default.messageRow}`, children: [
+    /* @__PURE__ */ jsx("span", { children: message }),
+    helpTextAddition && /* @__PURE__ */ jsx("span", { className: InputContainer_default.helpTextAddition, children: helpTextAddition })
+  ] });
+  if (orientation === "vertical") {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        "data-modified": modified ? "true" : void 0,
+        className: `dbc-flex dbc-flex-column dbc-gap-xs ${InputContainer_default.inputContainer}`,
+        style: { width: fullWidth ? "100%" : void 0 },
+        children: [
+          renderLabelRow,
+          children,
+          renderMessageRow
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-modified": modified ? "true" : void 0,
+      className: InputContainer_default.inputContainer,
+      style: {
+        "--label-width": labelWidth,
+        width: fullWidth ? "100%" : void 0
+      },
+      children: /* @__PURE__ */ jsxs("div", { className: `${InputContainer_default.horizontal} dbc-flex dbc-flex-column dbc-gap-xs`, "data-size": size, children: [
+        /* @__PURE__ */ jsxs("div", { className: `${InputContainer_default.labelContainer} dbc-flex dbc-items-center dbc-gap-xs`, children: [
+          renderLabelRow,
+          children
+        ] }),
+        renderMessageRow
+      ] })
+    }
+  );
+}
+function Checkbox({
+  checked: controlled,
+  onChange,
+  variant = "default",
+  disabled,
+  label,
+  labelAs = "label",
+  size = "md",
+  modified,
+  containerLabel,
+  error,
+  helpText,
+  orientation = "horizontal",
+  labelWidth = "160px",
+  fullWidth = false,
+  required = false,
+  noContainer = false,
+  id,
+  "data-cy": dataCy
+}) {
+  const [internal, setInternal] = useState(false);
+  const isChecked = controlled != null ? controlled : internal;
+  const generatedId = useId();
+  const controlId = id != null ? id : `checkbox-${generatedId}`;
+  const toggle = (e) => {
+    if (disabled) return;
+    const value = !isChecked;
+    setInternal(value);
+    onChange == null ? void 0 : onChange(value, e);
+  };
+  const content = /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: [Checkbox_default.container, size === "sm" ? Checkbox_default.containerSm : ""].filter(Boolean).join(" "),
+      "data-cy": dataCy,
+      children: [
+        /* @__PURE__ */ jsx(
+          "button",
+          {
+            id: controlId,
+            disabled,
+            type: "button",
+            role: "checkbox",
+            "aria-checked": isChecked,
+            "aria-disabled": disabled || void 0,
+            "aria-invalid": Boolean(error) || void 0,
+            onClick: toggle,
+            className: [Checkbox_default.checkbox, isChecked ? Checkbox_default.checked : "", Checkbox_default[variant], Checkbox_default[size]].filter(Boolean).join(" "),
+            children: isChecked && /* @__PURE__ */ jsx(Check, { className: Checkbox_default.icon })
+          }
+        ),
+        label && (labelAs === "label" ? /* @__PURE__ */ jsx("label", { className: Checkbox_default.label, htmlFor: controlId, children: label }) : /* @__PURE__ */ jsx("span", { className: Checkbox_default.label, children: label }))
+      ]
+    }
+  );
+  if (noContainer) return content;
+  return /* @__PURE__ */ jsx(
+    InputContainer,
+    {
+      modified,
+      label: containerLabel,
+      htmlFor: controlId,
+      error,
+      helpText,
+      orientation,
+      size,
+      labelWidth,
+      fullWidth,
+      required,
+      children: content
+    }
+  );
+}
+
+// src/components/forms/radio-buttons/RadioButtons.module.css
+var RadioButtons_default = {
+  container: "RadioButtons_container2",
+  controlWrap: "RadioButtons_controlWrap2",
+  input: "RadioButtons_input2",
+  radio: "RadioButtons_radio2",
+  dot: "RadioButtons_dot2",
+  checked: "RadioButtons_checked2",
+  disabled: "RadioButtons_disabled2",
+  label: "RadioButtons_label2",
+  primary: "RadioButtons_primary2",
+  default: "RadioButtons_default2",
+  sm: "RadioButtons_sm2",
+  md: "RadioButtons_md2",
+  lg: "RadioButtons_lg2"
+};
+function RadioButton({
+  name,
+  value,
+  selectedValue,
+  checked,
+  onChange,
+  disabled,
+  label,
+  variant = "outlined",
+  size = "md",
+  containerLabel,
+  error,
+  helpText,
+  orientation = "horizontal",
+  labelWidth = "160px",
+  fullWidth = false,
+  required = false,
+  noContainer = false,
+  id,
+  "data-cy": dataCy
+}) {
+  const generatedId = useId();
+  const controlId = id != null ? id : `radio-${generatedId}`;
+  const isChecked = selectedValue !== void 0 ? selectedValue === value : Boolean(checked);
+  const content = /* @__PURE__ */ jsxs("span", { className: RadioButtons_default.container, "data-cy": dataCy, children: [
+    /* @__PURE__ */ jsxs("span", { className: RadioButtons_default.controlWrap, children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          id: controlId,
+          className: RadioButtons_default.input,
+          type: "radio",
+          name,
+          value,
+          checked: isChecked,
+          disabled,
+          required,
+          "aria-invalid": Boolean(error) || void 0,
+          onChange: (e) => {
+            if (disabled) return;
+            onChange == null ? void 0 : onChange(e.target.value, e);
+          }
+        }
+      ),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: [
+            RadioButtons_default.radio,
+            isChecked ? RadioButtons_default.checked : "",
+            disabled ? RadioButtons_default.disabled : "",
+            RadioButtons_default[variant],
+            RadioButtons_default[size]
+          ].filter(Boolean).join(" "),
+          "aria-hidden": "true",
+          children: /* @__PURE__ */ jsx("span", { className: RadioButtons_default.dot })
+        }
+      )
+    ] }),
+    label && /* @__PURE__ */ jsx("label", { className: RadioButtons_default.label, htmlFor: controlId, children: label })
+  ] });
+  if (noContainer || !containerLabel && !error) return content;
+  return /* @__PURE__ */ jsx(
+    InputContainer,
+    {
+      label: containerLabel,
+      htmlFor: controlId,
+      error,
+      helpText,
+      orientation,
+      labelWidth,
+      fullWidth,
+      required,
+      children: content
+    }
+  );
+}
+var INTERACTIVE_SELECTOR = 'a:not([disabled]), button:not([disabled]), [tabindex]:not([tabindex="-1"]):not([aria-disabled="true"]), [role="menuitem"]:not([aria-disabled="true"]), [role="option"]:not([aria-disabled="true"])';
+function getMenuItems(el) {
+  return Array.from(el.querySelectorAll(INTERACTIVE_SELECTOR));
+}
+var MenuBase = React9.forwardRef(
+  ({ children, className, itemRole = "menuitem", gap, onKeyDown, ...props }, ref) => {
+    const internalRef = React9.useRef(null);
+    const handleKeyDown = (e) => {
+      const ul = internalRef.current;
+      if (!ul) return;
+      const items = getMenuItems(ul);
+      if (items.length === 0) return;
+      const focused = document.activeElement;
+      const currentIndex = items.indexOf(focused);
+      let nextIndex = null;
+      if (e.key === "ArrowDown") {
+        nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : 0;
+      } else if (e.key === "ArrowUp") {
+        nextIndex = currentIndex > 0 ? currentIndex - 1 : items.length - 1;
+      } else if (e.key === "Home") {
+        nextIndex = 0;
+      } else if (e.key === "End") {
+        nextIndex = items.length - 1;
+      }
+      if (nextIndex !== null) {
+        e.preventDefault();
+        items[nextIndex].focus();
+      }
+      onKeyDown == null ? void 0 : onKeyDown(e);
+    };
+    return /* @__PURE__ */ jsx(
+      "ul",
+      {
+        ref: (node) => {
+          internalRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        role: "menu",
+        "data-itemrole": itemRole,
+        className: [Menu_default.container, gap ? Menu_default.gap : "", className].filter(Boolean).join(" "),
+        onKeyDown: handleKeyDown,
+        ...props,
+        children
+      }
+    );
+  }
+);
+MenuBase.displayName = "Menu";
+var isInteractiveEl = (el) => React9.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 = React9.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 React9.cloneElement(child, {
+      role: (_a = child.props.role) != null ? _a : role,
+      tabIndex: (_b = child.props.tabIndex) != null ? _b : tabIndex,
+      "aria-selected": selected || void 0,
+      "aria-disabled": disabled || void 0,
+      className: [child.props.className, Menu_default.interactive, childClass, className].filter(Boolean).join(" "),
+      ...child.type === "button" ? { disabled } : {}
+    });
+  }
+  return React9.cloneElement(nextImmediate, {
+    role: (_c = nextImmediate.props.role) != null ? _c : role,
+    tabIndex: (_d = nextImmediate.props.tabIndex) != null ? _d : tabIndex,
+    "aria-selected": selected || void 0,
+    "aria-disabled": disabled || void 0,
+    className: [nextImmediate.props.className, Menu_default.interactive, childClass].filter(Boolean).join(" "),
+    disabled
+  });
+}
+var MenuItem = React9.forwardRef(
+  ({ children, active, selected, disabled, className, itemRole, variant, ...liProps }, ref) => {
+    const resolvedRole = itemRole != null ? itemRole : "menuitem";
+    const isBordered = variant === "bordered";
+    const itemClassName = variant === "danger" ? Menu_default.itemDanger : void 0;
+    const rowClass = [Menu_default.row, isBordered ? Menu_default.rowBordered : "", className].filter(Boolean).join(" ");
+    if (isInteractiveEl(children)) {
+      const child = children;
+      return /* @__PURE__ */ jsx("li", { ref, role: "none", className: rowClass, ...liProps, children: applyMenuItemPropsToElement(child, {
+        active,
+        selected,
+        disabled,
+        role: resolvedRole,
+        className: itemClassName
+      }) });
+    }
+    return /* @__PURE__ */ jsx("li", { ref, role: "none", className: rowClass, ...liProps, children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        role: resolvedRole,
+        tabIndex: 0,
+        "aria-selected": selected || void 0,
+        "aria-disabled": disabled || void 0,
+        className: [
+          Menu_default.interactive,
+          Menu_default.item,
+          itemClassName,
+          active ? Menu_default.active : "",
+          selected ? Menu_default.selected : ""
+        ].filter(Boolean).join(" "),
+        type: "button",
+        disabled,
+        children
+      }
+    ) });
+  }
+);
+MenuItem.displayName = "Menu.Item";
+var MenuCheckItem = React9.forwardRef(
+  ({
+    label,
+    checked,
+    active,
+    disabled,
+    interactiveRef,
+    interactiveProps,
+    onCheckedChange,
+    className,
+    ...liProps
+  }, ref) => {
+    const isSelected = checked;
+    const interactiveClass = [
+      Menu_default.interactiveChild,
+      Menu_default.item,
+      active ? Menu_default.active : "",
+      isSelected ? Menu_default.selected : ""
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsx(
+      "li",
+      {
+        ref,
+        role: "none",
+        className: [Menu_default.row, className].filter(Boolean).join(" "),
+        ...liProps,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: interactiveRef,
+            role: interactiveProps == null ? void 0 : interactiveProps.role,
+            tabIndex: -1,
+            "aria-selected": isSelected || void 0,
+            "aria-disabled": disabled || void 0,
+            className: interactiveClass,
+            ...interactiveProps,
+            onClick: (event) => {
+              var _a;
+              (_a = interactiveProps == null ? void 0 : interactiveProps.onClick) == null ? void 0 : _a.call(interactiveProps, event);
+              if (event.defaultPrevented || disabled) return;
+              const target = event.target;
+              if (target instanceof Element && target.closest("button") !== null) {
+                return;
+              }
+              onCheckedChange == null ? void 0 : onCheckedChange(!checked);
+            },
+            children: /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                variant: "primary",
+                size: "sm",
+                noContainer: true,
+                checked,
+                disabled,
+                labelAs: "span",
+                label,
+                onChange: (next, _e) => onCheckedChange == null ? void 0 : onCheckedChange(next)
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+);
+MenuCheckItem.displayName = "Menu.CheckItem";
+var MenuRadioItem = React9.forwardRef(
+  ({ name, value, checked, disabled, label, onValueChange, className, ...liProps }, ref) => {
+    return /* @__PURE__ */ jsx(
+      "li",
+      {
+        ref,
+        role: "none",
+        className: [Menu_default.row, className].filter(Boolean).join(" "),
+        ...liProps,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: Menu_default.interactiveChild,
+            onClick: (event) => {
+              var _a;
+              if (disabled) return;
+              const target = event.target;
+              if ((_a = target.closest("label")) != null ? _a : target.closest("input")) return;
+              onValueChange == null ? void 0 : onValueChange(value);
+            },
+            children: /* @__PURE__ */ jsx(
+              RadioButton,
+              {
+                noContainer: true,
+                name,
+                size: "sm",
+                value,
+                checked,
+                disabled,
+                label,
+                onChange: (v, _e) => onValueChange == null ? void 0 : onValueChange(v)
+              }
+            )
+          }
+        )
+      }
+    );
+  }
+);
+MenuRadioItem.displayName = "Menu.RadioItem";
+var MenuSeparator = React9.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "li",
+    {
+      ref,
+      role: "separator",
+      className: [Menu_default.separator, className].filter(Boolean).join(" "),
+      ...props
+    }
+  )
+);
+MenuSeparator.displayName = "Menu.Separator";
+var MenuHeader = React9.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+    "li",
+    {
+      ref,
+      role: "presentation",
+      "aria-hidden": "true",
+      className: [Menu_default.header, className].filter(Boolean).join(" "),
+      ...props,
+      children
+    }
+  )
+);
+MenuHeader.displayName = "Menu.Header";
+var Menu = Object.assign(MenuBase, {
+  Item: MenuItem,
+  CheckItem: MenuCheckItem,
+  RadioItem: MenuRadioItem,
+  Separator: MenuSeparator,
+  Header: MenuHeader
+});
+
+// src/components/popover/Popover.module.css
+var Popover_default = {
+  container: "Popover_container2",
+  triggerSlot: "Popover_triggerSlot2",
+  fullWidth: "Popover_fullWidth2",
+  fillTrigger: "Popover_fillTrigger2",
+  content: "Popover_content2"
+};
+function assignRef(ref, value) {
+  if (!ref) return;
+  if (typeof ref === "function") {
+    ref(value);
+    return;
+  }
+  ref.current = value;
+}
+function getFocusable(container) {
+  const els = container.querySelectorAll(
+    [
+      "a[href]",
+      "button:not([disabled])",
+      "input:not([disabled])",
+      "select:not([disabled])",
+      "textarea:not([disabled])",
+      '[tabindex]:not([tabindex="-1"])'
+    ].join(",")
+  );
+  return Array.from(els).filter(
+    (el) => !el.hasAttribute("disabled") && !el.getAttribute("aria-hidden")
+  );
+}
+function parseMinWidthPx(minWidth, elForEm) {
+  const v = minWidth.trim();
+  if (v.endsWith("px")) {
+    const n = Number.parseFloat(v);
+    return Number.isFinite(n) ? n : 0;
+  }
+  if (typeof window !== "undefined" && v.endsWith("rem")) {
+    const n = Number.parseFloat(v);
+    if (!Number.isFinite(n)) return 0;
+    const rootFont = Number.parseFloat(getComputedStyle(document.documentElement).fontSize || "16");
+    return n * (Number.isFinite(rootFont) ? rootFont : 16);
+  }
+  if (typeof window !== "undefined" && v.endsWith("em")) {
+    const n = Number.parseFloat(v);
+    if (!Number.isFinite(n)) return 0;
+    const font = elForEm ? Number.parseFloat(getComputedStyle(elForEm).fontSize || "16") : 16;
+    return n * (Number.isFinite(font) ? font : 16);
+  }
+  return 0;
+}
+var Popover = forwardRef(function Popover2({
+  trigger: Trigger,
+  children,
+  open,
+  defaultOpen = false,
+  onOpenChange,
+  contentId,
+  minWidth = "200px",
+  matchTriggerWidth = true,
+  viewportPadding = 8,
+  contentMaxHeightPx = 400,
+  edgeBuffer = 100,
+  dataCy,
+  fullWidth = false,
+  fillTrigger = false,
+  autoFocusContent = false,
+  returnFocus = true,
+  anchorRef,
+  overlayRef
+}, ref) {
+  const internalId = useId();
+  const resolvedContentId = contentId != null ? contentId : `popover-${internalId}`;
+  const isControlled = open !== void 0;
+  const [uncontrolledOpen, setUncontrolledOpen] = useState(defaultOpen);
+  const isOpen = isControlled ? !!open : uncontrolledOpen;
+  const [pos, setPos] = useState({ top: 0, left: 0 });
+  const [positioned, setPositioned] = useState(false);
+  const [triggerWidth, setTriggerWidth] = useState(null);
+  const containerRef = useRef(null);
+  const contentRef = useRef(null);
+  const triggerElRef = useRef(null);
+  const lastCloseReasonRef = useRef("unknown");
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => setMounted(true), []);
+  const setOpen = useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolledOpen(next);
+      onOpenChange == null ? void 0 : onOpenChange(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  const openPopover = useCallback(() => {
+    setPositioned(false);
+    setOpen(true);
+  }, [setOpen]);
+  const closePopover = useCallback(
+    (reason = "api") => {
+      lastCloseReasonRef.current = reason;
+      setOpen(false);
+    },
+    [setOpen]
+  );
+  const togglePopover = useCallback(
+    (e) => {
+      var _a, _b;
+      triggerElRef.current = (_b = (_a = anchorRef == null ? void 0 : anchorRef.current) != null ? _a : e.currentTarget) != null ? _b : containerRef.current;
+      if (isOpen) closePopover("trigger");
+      else openPopover();
+    },
+    [isOpen, closePopover, openPopover, anchorRef]
+  );
+  useImperativeHandle(
+    ref,
+    () => ({
+      close: () => closePopover("api"),
+      open: openPopover,
+      isOpen: () => isOpen
+    }),
+    [closePopover, openPopover, isOpen]
+  );
+  const computeAndSetPosition = useCallback(() => {
+    var _a, _b;
+    const content = contentRef.current;
+    if (!content) return;
+    const triggerEl = (_b = (_a = anchorRef == null ? void 0 : anchorRef.current) != null ? _a : triggerElRef.current) != null ? _b : containerRef.current;
+    if (!triggerEl) return;
+    const triggerRect = triggerEl.getBoundingClientRect();
+    const overlayWidthBuffer = 8;
+    let forcedWidthPx = null;
+    if (matchTriggerWidth) {
+      const minWidthPx = parseMinWidthPx(minWidth, triggerEl);
+      forcedWidthPx = Math.max(triggerRect.width + overlayWidthBuffer, minWidthPx || 0);
+      setTriggerWidth(forcedWidthPx);
+    } else {
+      setTriggerWidth(null);
+    }
+    const prevHidden = content.hidden;
+    const prevVis = content.style.visibility;
+    const prevDisp = content.style.display;
+    const prevMinWidth = content.style.minWidth;
+    const prevWidth = content.style.width;
+    const prevTop = content.style.top;
+    const prevLeft = content.style.left;
+    content.hidden = false;
+    content.style.visibility = "hidden";
+    content.style.display = "block";
+    content.style.top = "0px";
+    content.style.left = "0px";
+    content.style.minWidth = minWidth;
+    content.style.width = forcedWidthPx != null ? `${forcedWidthPx}px` : "auto";
+    const contentWidth = content.offsetWidth;
+    const contentHeight = content.offsetHeight;
+    content.hidden = prevHidden;
+    content.style.visibility = prevVis;
+    content.style.display = prevDisp;
+    content.style.minWidth = prevMinWidth;
+    content.style.width = prevWidth;
+    content.style.top = prevTop;
+    content.style.left = prevLeft;
+    const vw = window.innerWidth;
+    const vh = window.innerHeight;
+    const spaceAbove = Math.max(0, triggerRect.top);
+    const spaceBelow = Math.max(0, vh - triggerRect.bottom);
+    const spaceLeft = Math.max(0, triggerRect.left);
+    const spaceRight = Math.max(0, vw - triggerRect.right);
+    const preferBelow = spaceBelow >= contentHeight + edgeBuffer || spaceBelow >= spaceAbove;
+    const spacing = viewportPadding;
+    const rawTop = preferBelow ? triggerRect.bottom + spacing : triggerRect.top - contentHeight - spacing;
+    const placeRightOfLeftEdge = spaceRight >= contentWidth + edgeBuffer;
+    const placeLeftOfRightEdge = spaceLeft >= contentWidth + edgeBuffer;
+    let rawLeft;
+    if (placeRightOfLeftEdge) rawLeft = triggerRect.left;
+    else if (placeLeftOfRightEdge) rawLeft = triggerRect.right - contentWidth;
+    else rawLeft = triggerRect.left + (triggerRect.width - contentWidth) / 2;
+    const clampedLeft = Math.max(
+      viewportPadding,
+      Math.min(rawLeft, vw - contentWidth - viewportPadding)
+    );
+    const clampedTop = Math.max(
+      viewportPadding,
+      Math.min(rawTop, vh - contentHeight - viewportPadding)
+    );
+    setPos({ top: clampedTop, left: clampedLeft });
+    setPositioned(true);
+  }, [anchorRef, edgeBuffer, viewportPadding, minWidth, matchTriggerWidth]);
+  useLayoutEffect(() => {
+    if (!isOpen) return;
+    computeAndSetPosition();
+  }, [isOpen, computeAndSetPosition]);
+  useEffect(() => {
+    var _a, _b, _c;
+    if (!isOpen) return;
+    const content = contentRef.current;
+    if (!content) return;
+    const triggerEl = (_b = (_a = anchorRef == null ? void 0 : anchorRef.current) != null ? _a : triggerElRef.current) != null ? _b : containerRef.current;
+    if (autoFocusContent) {
+      const focusables = getFocusable(content);
+      (_c = focusables[0]) == null ? void 0 : _c.focus();
+    }
+    const handlePointerDownCapture = (e) => {
+      const container = containerRef.current;
+      const contentEl = contentRef.current;
+      if (!container || !contentEl) return;
+      const target = e.target;
+      if (!container.contains(target) && !contentEl.contains(target)) {
+        closePopover("outside");
+      }
+    };
+    const handleEscape = (e) => {
+      if (e.key === "Escape") closePopover("escape");
+    };
+    const handleReposition = () => computeAndSetPosition();
+    const resizeObserver = typeof ResizeObserver !== "undefined" ? new ResizeObserver(() => {
+      handleReposition();
+    }) : null;
+    document.addEventListener("pointerdown", handlePointerDownCapture, true);
+    document.addEventListener("keydown", handleEscape, true);
+    window.addEventListener("resize", handleReposition);
+    window.addEventListener("scroll", handleReposition, true);
+    resizeObserver == null ? void 0 : resizeObserver.observe(content);
+    if (triggerEl) resizeObserver == null ? void 0 : resizeObserver.observe(triggerEl);
+    return () => {
+      document.removeEventListener("pointerdown", handlePointerDownCapture, true);
+      document.removeEventListener("keydown", handleEscape, true);
+      window.removeEventListener("resize", handleReposition);
+      window.removeEventListener("scroll", handleReposition, true);
+      resizeObserver == null ? void 0 : resizeObserver.disconnect();
+    };
+  }, [isOpen, closePopover, computeAndSetPosition, autoFocusContent, anchorRef]);
+  useEffect(() => {
+    var _a, _b;
+    if (isOpen) return;
+    if (!returnFocus) return;
+    if (lastCloseReasonRef.current === "outside") return;
+    (_b = (_a = triggerElRef.current) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+  }, [isOpen, returnFocus]);
+  const icon = isOpen ? /* @__PURE__ */ jsx(ChevronUp, { className: "dbc-muted-text", size: 20 }) : /* @__PURE__ */ jsx(ChevronDown, { className: "dbc-muted-text", size: 20 });
+  const setOverlayRef = React9.useCallback(
+    (node) => {
+      assignRef(overlayRef, node);
+    },
+    [overlayRef]
+  );
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: [
+        Popover_default.container,
+        fullWidth ? Popover_default.fullWidth : "",
+        fillTrigger ? Popover_default.fillTrigger : ""
+      ].filter(Boolean).join(" "),
+      ref: containerRef,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: [
+              Popover_default.triggerSlot,
+              fullWidth ? Popover_default.fullWidth : "",
+              fillTrigger ? Popover_default.fillTrigger : ""
+            ].filter(Boolean).join(" "),
+            children: Trigger(togglePopover, icon, isOpen)
+          }
+        ),
+        mounted && isOpen && createPortal(
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              id: resolvedContentId,
+              ref: (node) => {
+                contentRef.current = node;
+                setOverlayRef(node);
+              },
+              className: Popover_default.content,
+              style: {
+                top: pos.top,
+                left: pos.left,
+                minWidth,
+                width: triggerWidth != null ? `${triggerWidth}px` : void 0,
+                maxWidth: `calc(100vw - ${viewportPadding * 2}px)`,
+                maxHeight: `clamp(100px, calc(100vh - ${viewportPadding * 2}px), ${contentMaxHeightPx}px)`,
+                visibility: positioned ? void 0 : "hidden"
+              },
+              "data-cy": dataCy != null ? dataCy : "popover-content",
+              children: typeof children === "function" ? (
+                // eslint-disable-next-line react-hooks/refs
+                children(() => closePopover("api"))
+              ) : children
+            }
+          ),
+          document.body
+        )
+      ]
+    }
+  );
+});
+Popover.displayName = "Popover";
+var DEFAULT_PAGE_SIZE_OPTIONS = [20, 50, 100];
+var NUMBER_LOCALE = "da-DK";
+function Pagination({
+  itemsCount = 0,
+  skip = 0,
+  take = DEFAULT_PAGE_SIZE_OPTIONS[1],
+  onPageChange,
+  pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,
+  showFirstLast = true,
+  showGoToPage = true
+}) {
+  const popoverRef = useRef(null);
+  const pageSizeRef = useRef(null);
+  const formatNumber = useCallback((value) => value.toLocaleString(NUMBER_LOCALE), []);
+  const totalPages = useMemo(
+    () => Math.max(1, Math.ceil(itemsCount / Math.max(1, take))),
+    [itemsCount, take]
+  );
+  const currentPage = useMemo(() => {
+    const p = Math.floor(skip / Math.max(1, take)) + 1;
+    return Math.min(Math.max(1, p), totalPages);
+  }, [skip, take, totalPages]);
+  const emit = 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);
+      const nextSkip = (clampedPage - 1) * nextTake;
+      onPageChange == null ? void 0 : onPageChange({
+        page: clampedPage,
+        take: nextTake,
+        skip: nextSkip,
+        totalPages: nextTotalPages
+      });
+    },
+    [onPageChange, take, itemsCount]
+  );
+  const firstPage = useCallback(() => emit(1), [emit]);
+  const lastPage = useCallback(() => emit(totalPages), [emit, totalPages]);
+  const prevPage = useCallback(() => emit(currentPage - 1), [emit, currentPage]);
+  const nextPage = useCallback(() => emit(currentPage + 1), [emit, currentPage]);
+  const goToPage = useCallback((page) => emit(page), [emit]);
+  const canPrev = currentPage > 1;
+  const canNext = currentPage < totalPages;
+  const rangeLabel = 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 = useMemo(() => Array.from({ length: totalPages }, (_, i) => i + 1), [totalPages]);
+  const handlePageSizeChange = useCallback((size) => emit(1, size), [emit]);
+  return /* @__PURE__ */ jsxs("div", { className: Pagination_default.container, children: [
+    showFirstLast && /* @__PURE__ */ jsx(
+      Button,
+      {
+        size: "sm",
+        icon: /* @__PURE__ */ jsx(ChevronsLeft, {}),
+        disabled: !canPrev,
+        onClick: firstPage,
+        "aria-label": "First page"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        size: "sm",
+        icon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+        disabled: !canPrev,
+        onClick: prevPage,
+        "aria-label": "Previous page"
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: Pagination_default.range, "aria-live": "polite", children: rangeLabel }),
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        size: "sm",
+        icon: /* @__PURE__ */ jsx(ArrowRight, {}),
+        disabled: !canNext,
+        onClick: nextPage,
+        "aria-label": "Next page"
+      }
+    ),
+    showFirstLast && /* @__PURE__ */ jsx(
+      Button,
+      {
+        size: "sm",
+        icon: /* @__PURE__ */ jsx(ChevronsRight, {}),
+        disabled: !canNext,
+        onClick: lastPage,
+        "aria-label": "Last page"
+      }
+    ),
+    showGoToPage && /* @__PURE__ */ jsx(
+      Popover,
+      {
+        ref: popoverRef,
+        trigger: (open) => /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "outlined", onClick: open, children: [
+          "Side ",
+          formatNumber(currentPage),
+          "/",
+          formatNumber(totalPages),
+          " ",
+          /* @__PURE__ */ jsx(ChevronDown, { size: 16 })
+        ] }),
+        children: /* @__PURE__ */ jsx(Menu, { children: pages == null ? void 0 : pages.map((page) => /* @__PURE__ */ jsx(Menu.Item, { active: page === currentPage, children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => {
+              var _a;
+              goToPage(page);
+              (_a = popoverRef.current) == null ? void 0 : _a.close();
+            },
+            children: formatNumber(page)
+          }
+        ) }, page)) })
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Popover,
+      {
+        ref: pageSizeRef,
+        trigger: (open) => /* @__PURE__ */ jsxs(Button, { size: "sm", variant: "outlined", onClick: open, children: [
+          "Vis ",
+          formatNumber(take),
+          " ",
+          /* @__PURE__ */ jsx(ChevronDown, { size: 16 })
+        ] }),
+        children: /* @__PURE__ */ jsx(Menu, { children: pageSizeOptions == null ? void 0 : pageSizeOptions.map((size) => /* @__PURE__ */ jsx(Menu.Item, { active: size === take, children: /* @__PURE__ */ jsx(
+          "button",
+          {
+            onClick: () => {
+              var _a;
+              handlePageSizeChange(size);
+              (_a = pageSizeRef.current) == null ? void 0 : _a.close();
+            },
+            children: formatNumber(size)
+          }
+        ) }, size)) })
+      }
+    )
+  ] });
+}
+var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect;
+function useViewportFill(ref, { bottomOffset = 0, min = 120, includeMarginTop = false, watchRef } = {}) {
+  const [maxHeight, setMaxHeight] = useState(min);
+  const raf = useRef(null);
+  const measure = useCallback(() => {
+    if (typeof window === "undefined" || !ref.current) return;
+    const el = ref.current;
+    const rect = el.getBoundingClientRect();
+    let top = rect.top;
+    if (includeMarginTop) {
+      const marginTop = parseFloat(window.getComputedStyle(el).marginTop || "0") || 0;
+      top -= marginTop;
+    }
+    const next = Math.max(min, Math.floor(window.innerHeight - bottomOffset - top));
+    setMaxHeight((prev) => prev === next ? prev : next);
+  }, [ref, bottomOffset, min, includeMarginTop]);
+  const scheduleMeasure = useCallback(() => {
+    if (typeof window === "undefined") return;
+    if (raf.current != null) {
+      cancelAnimationFrame(raf.current);
+    }
+    raf.current = window.requestAnimationFrame(() => {
+      raf.current = null;
+      measure();
+    });
+  }, [measure]);
+  useIsomorphicLayoutEffect(() => {
+    measure();
+  }, [measure]);
+  useEffect(() => {
+    var _a;
+    if (typeof window === "undefined" || !ref.current) return;
+    const target = ref.current;
+    const extra = (_a = watchRef == null ? void 0 : watchRef.current) != null ? _a : null;
+    const parent = target.parentElement;
+    const onResize = () => scheduleMeasure();
+    const onTransitionOrAnimationEnd = () => scheduleMeasure();
+    window.addEventListener("resize", onResize);
+    document.addEventListener("transitionend", onTransitionOrAnimationEnd, true);
+    document.addEventListener("animationend", onTransitionOrAnimationEnd, true);
+    let resizeObserver = null;
+    if ("ResizeObserver" in window) {
+      resizeObserver = new ResizeObserver(() => scheduleMeasure());
+      resizeObserver.observe(target);
+      if (parent && parent !== target) {
+        resizeObserver.observe(parent);
+      }
+      if (extra && extra !== target && extra !== parent) {
+        resizeObserver.observe(extra);
+      }
+    }
+    return () => {
+      window.removeEventListener("resize", onResize);
+      document.removeEventListener("transitionend", onTransitionOrAnimationEnd, true);
+      document.removeEventListener("animationend", onTransitionOrAnimationEnd, true);
+      resizeObserver == null ? void 0 : resizeObserver.disconnect();
+      if (raf.current != null) {
+        cancelAnimationFrame(raf.current);
+        raf.current = null;
+      }
+    };
+  }, [ref, watchRef, scheduleMeasure]);
+  const style = useMemo(
+    () => ({
+      maxHeight,
+      overflow: "auto"
+    }),
+    [maxHeight]
+  );
+  return {
+    maxHeight,
+    style,
+    recompute: measure
+  };
+}
+var defaultEmptyConfig = {
+  enabled: true,
+  title: "Ingen resultater",
+  description: /* @__PURE__ */ jsx("span", { children: "Ingen data at vise." }),
+  showBack: false,
+  showRefresh: false,
+  showClearFilters: true,
+  backLabel: /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(ArrowLeft, { size: 16 }),
+    "Tilbage"
+  ] }),
+  refreshLabel: /* @__PURE__ */ jsx(Fragment, { children: "Indl\xE6s igen" }),
+  clearFiltersLabel: /* @__PURE__ */ jsx(Fragment, { children: "Nulstil alle filtre" }),
+  className: "dbc-flex dbc-flex-column dbc-items-start dbc-justify-start dbc-text-left dbc-gap-sm dbc-py-lg"
+};
+function TableEmptyState({ config }) {
+  const merged = {
+    ...defaultEmptyConfig,
+    ...config != null ? config : {}
+  };
+  if (!merged.enabled) return null;
+  return /* @__PURE__ */ jsxs("div", { className: "dbc-flex dbc-flex-column dbc-gap-md dbc-pt-sm dbc-pb-sm", children: [
+    /* @__PURE__ */ jsx("span", { className: "dbc-text-sm  dbc-muted-text", children: merged.description }),
+    merged.actions ? /* @__PURE__ */ jsx("span", { className: "dbc-flex dbc-gap-sm", children: merged.actions }) : null
+  ] });
+}
+
+// src/components/table/Table.module.css
+var Table_default = {
+  fillViewportRoot: "Table_fillViewportRoot2",
+  inlineRoot: "Table_inlineRoot2",
+  toolbarSlot: "Table_toolbarSlot2",
+  tableViewport: "Table_tableViewport2",
+  paginationSlot: "Table_paginationSlot2",
+  paginationSlotTop: "Table_paginationSlotTop2",
+  tableRoot: "Table_tableRoot2",
+  measuringLayout: "Table_measuringLayout2",
+  tableScroll: "Table_tableScroll2",
+  tableElement: "Table_tableElement2",
+  header: "Table_header2",
+  headerRow: "Table_headerRow2",
+  row: "Table_row2",
+  emptyStateSlot: "Table_emptyStateSlot2",
+  body: "Table_body2",
+  cell: "Table_cell2",
+  headerCell: "Table_headerCell2",
+  md: "Table_md2",
+  sm: "Table_sm2",
+  selectionCell: "Table_selectionCell2",
+  selectionHitArea: "Table_selectionHitArea2",
+  selectionControlWrap: "Table_selectionControlWrap2",
+  clickableRow: "Table_clickableRow2",
+  selectedRow: "Table_selectedRow2",
+  striped: "Table_striped2",
+  nowrap: "Table_nowrap2",
+  allowWrap: "Table_allowWrap2",
+  thInner: "Table_thInner2",
+  thInnerRight: "Table_thInnerRight2",
+  thInnerCenter: "Table_thInnerCenter2",
+  thMain: "Table_thMain2",
+  thMainRight: "Table_thMainRight2",
+  thMainCenter: "Table_thMainCenter2",
+  thButton: "Table_thButton2",
+  thButtonRight: "Table_thButtonRight2",
+  thButtonCenter: "Table_thButtonCenter2",
+  thLabel: "Table_thLabel2",
+  thLabelRight: "Table_thLabelRight2",
+  thLabelCenter: "Table_thLabelCenter2",
+  thOverlayExtras: "Table_thOverlayExtras2",
+  sortIndicator: "Table_sortIndicator2",
+  descending: "Table_descending2",
+  inActiveSort: "Table_inActiveSort2",
+  cellContent: "Table_cellContent2",
+  cellValueEllipsis: "Table_cellValueEllipsis2",
+  severityTable: "Table_severityTable2",
+  severity: "Table_severity2",
+  severityFailed: "Table_severityFailed2",
+  dividerLeft: "Table_dividerLeft2",
+  dividerRight: "Table_dividerRight2"
+};
+
+// src/components/table/table.classes.ts
+function cx2(...values) {
+  return values.filter(Boolean).join(" ");
+}
+function getDividerClass(column) {
+  if (column.divider === "left") return Table_default.dividerLeft;
+  if (column.divider === "right") return Table_default.dividerRight;
+  return "";
+}
+function getAlignValue(column) {
+  var _a;
+  return (_a = column.align) != null ? _a : "left";
+}
+function getHeaderAlignClasses(align) {
+  return {
+    inner: cx2(
+      Table_default.thInner,
+      align === "right" && Table_default.thInnerRight,
+      align === "center" && Table_default.thInnerCenter
+    ),
+    main: cx2(
+      Table_default.thMain,
+      align === "right" && Table_default.thMainRight,
+      align === "center" && Table_default.thMainCenter
+    ),
+    button: cx2(
+      Table_default.thButton,
+      align === "right" && Table_default.thButtonRight,
+      align === "center" && Table_default.thButtonCenter
+    ),
+    label: cx2(
+      Table_default.thLabel,
+      align === "right" && Table_default.thLabelRight,
+      align === "center" && Table_default.thLabelCenter
+    )
+  };
+}
+
+// src/constants/severity.ts
+var SeverityBorderColor = {
+  neutral: "var(--color-neutral-strong)",
+  brand: "var(--color-brand)",
+  success: "var(--color-status-success-border)",
+  error: "var(--color-status-error-border)",
+  info: "var(--color-status-info-border)",
+  warning: "var(--color-status-warning-border)"
+};
+
+// src/components/table/table.utils.ts
+var SELECTION_COLUMN_PX = 40;
+var DEFAULT_COLUMN_PX = 150;
+function getVisibleColumns(columns) {
+  return columns.filter((column) => !column.hidden);
+}
+function getHeaderLabel(header) {
+  return typeof header === "function" ? header() : header;
+}
+function isActiveSort(sortById, columnId) {
+  return sortById === columnId;
+}
+function getAriaSort(sortable, active, direction) {
+  if (!sortable || !active || !direction) return "none";
+  return direction === "asc" ? "ascending" : "descending";
+}
+function getNextSortDirection(sortable, active, currentDirection) {
+  if (!sortable) return null;
+  if (!active) return "asc";
+  if (currentDirection === "asc") return "desc";
+  return null;
+}
+function shouldToggleOnKey(key) {
+  return key === "Enter" || key === " ";
+}
+function isModifierClick(e) {
+  return Boolean(e.metaKey || e.ctrlKey);
+}
+function shouldAllowWrap(columnAllowWrap, isRowSelected, viewMode) {
+  return Boolean(columnAllowWrap || isRowSelected || viewMode === "wrapped");
+}
+function getCellDisplayValue(row, column) {
+  var _a;
+  const empty = (_a = column.emptyPlaceholder) != null ? _a : "";
+  if (column.render) {
+    const rendered = column.render(row);
+    return rendered != null ? rendered : empty;
+  }
+  if (column.accessor) {
+    const value = row[column.accessor];
+    return value != null ? value : empty;
+  }
+  return empty;
+}
+
+// src/components/table/hooks/useTableRowInteractions.ts
+function useTableRowInteractions({
+  row,
+  rowId,
+  isSelected,
+  canSelect,
+  onRowClick,
+  onRowSelect
+}) {
+  const handleRowClick = useCallback(
+    (e) => {
+      var _a;
+      const target = e.target;
+      if ((_a = target == null ? void 0 : target.closest) == null ? void 0 : _a.call(target, '[data-selection-control="true"]')) {
+        return;
+      }
+      if (isModifierClick(e) && canSelect) {
+        e.preventDefault();
+        e.stopPropagation();
+        onRowSelect == null ? void 0 : onRowSelect(rowId, !isSelected);
+        return;
+      }
+      onRowClick == null ? void 0 : onRowClick(row);
+    },
+    [canSelect, isSelected, onRowClick, onRowSelect, row, rowId]
+  );
+  const handleRowKeyDown = useCallback(
+    (e) => {
+      if (!onRowClick) return;
+      if (!shouldToggleOnKey(e.key)) return;
+      e.preventDefault();
+      onRowClick(row);
+    },
+    [onRowClick, row]
+  );
+  return {
+    handleRowClick,
+    handleRowKeyDown
+  };
+}
+function TableRow({
+  row,
+  rowId,
+  columns,
+  selectedRows,
+  hasSelection,
+  selectionMode,
+  selectionInputName,
+  viewMode,
+  getRowSeverity,
+  onRowClick,
+  onRowMouseEnter,
+  onRowSelect
+}) {
+  var _a;
+  const isSelected = (_a = selectedRows == null ? void 0 : selectedRows.has(rowId)) != null ? _a : false;
+  const rowSeverity = getRowSeverity == null ? void 0 : getRowSeverity(row);
+  const canSelect = Boolean(selectedRows && onRowSelect);
+  const { handleRowClick, handleRowKeyDown } = useTableRowInteractions({
+    row,
+    rowId,
+    isSelected,
+    canSelect,
+    onRowClick,
+    onRowSelect
+  });
+  return /* @__PURE__ */ jsxs(
+    "tr",
+    {
+      className: cx2(
+        Table_default.row,
+        onRowClick && Table_default.clickableRow,
+        isSelected && Table_default.selectedRow,
+        rowSeverity && Table_default.severity
+      ),
+      style: {
+        ["--row-severity-color"]: rowSeverity ? SeverityBorderColor[rowSeverity] : void 0
+      },
+      tabIndex: onRowClick ? 0 : -1,
+      onKeyDown: handleRowKeyDown,
+      onMouseEnter: () => onRowMouseEnter == null ? void 0 : onRowMouseEnter(row),
+      onClick: handleRowClick,
+      children: [
+        hasSelection ? /* @__PURE__ */ jsx("td", { className: cx2(Table_default.cell, Table_default.selectionCell), "data-selection-control": "true", children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: Table_default.selectionHitArea,
+            "data-selection-control": "true",
+            onClick: (e) => {
+              if (e.target !== e.currentTarget) return;
+              e.stopPropagation();
+              onRowSelect == null ? void 0 : onRowSelect(rowId, !isSelected);
+            },
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                className: Table_default.selectionControlWrap,
+                "data-selection-control": "true",
+                onMouseDown: (e) => {
+                  if (selectionMode !== "single" || !isSelected) return;
+                  e.preventDefault();
+                },
+                onClick: (e) => {
+                  e.stopPropagation();
+                  if (selectionMode === "single" && isSelected) {
+                    e.preventDefault();
+                    onRowSelect == null ? void 0 : onRowSelect(rowId, false);
+                  }
+                },
+                children: selectionMode === "single" ? /* @__PURE__ */ jsx(
+                  RadioButton,
+                  {
+                    noContainer: true,
+                    name: selectionInputName,
+                    value: String(rowId),
+                    checked: isSelected,
+                    size: "sm",
+                    variant: "primary",
+                    onChange: (_value, e) => {
+                      e.stopPropagation();
+                      onRowSelect == null ? void 0 : onRowSelect(rowId, true);
+                    }
+                  }
+                ) : /* @__PURE__ */ jsx(
+                  Checkbox,
+                  {
+                    noContainer: true,
+                    variant: "primary",
+                    checked: isSelected,
+                    size: "sm",
+                    onChange: (checked, e) => {
+                      e.stopPropagation();
+                      onRowSelect == null ? void 0 : onRowSelect(rowId, checked);
+                    }
+                  }
+                )
+              }
+            )
+          }
+        ) }) : null,
+        columns.map((column) => {
+          var _a2, _b, _c, _d;
+          const allowWrap = shouldAllowWrap(column.allowWrap, isSelected, viewMode);
+          const allowOverflow = column.allowOverflow;
+          const cellValue = getCellDisplayValue(row, column);
+          return /* @__PURE__ */ jsx(
+            "td",
+            {
+              className: cx2(
+                Table_default.cell,
+                allowWrap ? Table_default.allowWrap : Table_default.nowrap,
+                column.divider === "left" && Table_default.dividerLeft,
+                column.divider === "right" && Table_default.dividerRight
+              ),
+              "data-align": (_a2 = column.align) != null ? _a2 : "left",
+              "data-vertical-align": (_b = column.verticalAlign) != null ? _b : "top",
+              "data-divider": column.divider,
+              children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  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__ */ jsx("div", { className: Table_default.cellValueEllipsis, children: cellValue })
+                }
+              )
+            },
+            column.id
+          );
+        })
+      ]
+    }
+  );
+}
+function TableBody({
+  data,
+  dataKey,
+  columns,
+  striped,
+  selectedRows,
+  hasSelection,
+  selectionMode,
+  selectionInputName,
+  viewMode,
+  getRowSeverity,
+  onRowClick,
+  onRowMouseEnter,
+  onRowSelect
+}) {
+  return /* @__PURE__ */ jsx("tbody", { className: cx2(Table_default.body, striped && Table_default.striped), children: data.map((row) => {
+    const rowId = row[dataKey];
+    return /* @__PURE__ */ jsx(
+      TableRow,
+      {
+        row,
+        rowId,
+        columns,
+        selectedRows,
+        hasSelection,
+        selectionMode,
+        selectionInputName,
+        viewMode,
+        getRowSeverity,
+        onRowClick,
+        onRowMouseEnter,
+        onRowSelect
+      },
+      `gridRow-${rowId}`
+    );
+  }) });
+}
+function TableHeaderCell({
+  column,
+  index,
+  sortById,
+  sortDirection,
+  onSortChange,
+  extraContent
+}) {
+  const active = isActiveSort(sortById, column.id);
+  const ariaSort = getAriaSort(column.sortable, active, sortDirection != null ? sortDirection : null);
+  const align = getAlignValue(column);
+  const dividerClass = getDividerClass(column);
+  const alignClasses = getHeaderAlignClasses(align);
+  const handleToggleSort = () => {
+    if (!column.sortable || !onSortChange) return;
+    const nextDirection = getNextSortDirection(column.sortable, active, sortDirection != null ? sortDirection : null);
+    onSortChange(column, nextDirection);
+  };
+  return /* @__PURE__ */ jsxs(
+    "th",
+    {
+      className: cx2(Table_default.headerCell, dividerClass),
+      scope: "col",
+      "aria-sort": ariaSort,
+      "data-align": align,
+      "data-divider": column.divider,
+      "data-column-index": index,
+      children: [
+        /* @__PURE__ */ jsx("div", { className: alignClasses.inner, children: /* @__PURE__ */ jsx("div", { className: alignClasses.main, children: column.sortable ? /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "button",
+            className: alignClasses.button,
+            onClick: handleToggleSort,
+            onKeyDown: (e) => {
+              if (!shouldToggleOnKey(e.key)) return;
+              e.preventDefault();
+              handleToggleSort();
+            },
+            children: [
+              /* @__PURE__ */ jsx("span", { className: alignClasses.label, children: getHeaderLabel(column.header) }),
+              /* @__PURE__ */ jsxs("span", { className: Table_default.sortIndicator, "aria-hidden": "true", children: [
+                active && sortDirection === "asc" && /* @__PURE__ */ jsx(ArrowUp, {}),
+                active && sortDirection === "desc" && /* @__PURE__ */ jsx(ArrowDown, {}),
+                !active && /* @__PURE__ */ jsx(ArrowDown, { className: Table_default.inActiveSort })
+              ] })
+            ]
+          }
+        ) : /* @__PURE__ */ jsx("span", { className: alignClasses.label, children: getHeaderLabel(column.header) }) }) }),
+        extraContent != null ? /* @__PURE__ */ jsx("div", { className: Table_default.thOverlayExtras, children: extraContent }) : null
+      ]
+    },
+    column.id
+  );
+}
+function TableSelectionCell({ checked, isHeader, multiple, onToggle }) {
+  const Tag = isHeader ? "th" : "td";
+  return /* @__PURE__ */ jsx(
+    Tag,
+    {
+      className: cx2(Table_default.headerCell, Table_default.selectionCell),
+      scope: isHeader ? "col" : void 0,
+      onClick: (e) => {
+        if (isHeader && !multiple) return;
+        e.stopPropagation();
+        onToggle(!checked, e);
+      },
+      children: isHeader && !multiple ? null : /* @__PURE__ */ jsx("div", { className: Table_default.selectionHitArea, children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          noContainer: true,
+          size: "sm",
+          variant: "primary",
+          checked,
+          onChange: (nextChecked, e) => {
+            e.stopPropagation();
+            onToggle(nextChecked, e);
+          }
+        }
+      ) })
+    }
+  );
+}
+function TableHeader({
+  columns,
+  hasSelection,
+  selectionMode,
+  allRowsSelected,
+  onSelectAllRows,
+  sortById,
+  sortDirection,
+  onSortChange,
+  headerExtras,
+  stickyTop
+}) {
+  return /* @__PURE__ */ jsx(
+    "thead",
+    {
+      className: Table_default.header,
+      style: stickyTop ? { top: stickyTop, position: "sticky", zIndex: 2 } : void 0,
+      children: /* @__PURE__ */ jsxs("tr", { className: Table_default.headerRow, children: [
+        hasSelection ? /* @__PURE__ */ jsx(
+          TableSelectionCell,
+          {
+            isHeader: true,
+            multiple: selectionMode === "multiple",
+            checked: allRowsSelected,
+            onToggle: (checked) => onSelectAllRows == null ? void 0 : onSelectAllRows(checked)
+          }
+        ) : null,
+        columns.map((column, index) => /* @__PURE__ */ jsx(
+          TableHeaderCell,
+          {
+            column,
+            index,
+            sortById,
+            sortDirection,
+            onSortChange,
+            extraContent: headerExtras == null ? void 0 : headerExtras({ column, index })
+          },
+          column.id
+        ))
+      ] })
+    }
+  );
+}
+
+// src/components/skeleton-loader/skeleton-loader-item/SkeletonLoaderItem.module.css
+var SkeletonLoaderItem_default = {
+  skeletonLoader: "SkeletonLoaderItem_skeletonLoader2",
+  shimmer: "SkeletonLoaderItem_shimmer2",
+  invert: "SkeletonLoaderItem_invert2",
+  bar: "SkeletonLoaderItem_bar2"
+};
+function SkeletonLoaderItem({
+  height = 14,
+  width = "100%",
+  radius = 6,
+  speedSec = 3,
+  ariaLabel = "Loading",
+  variant = "default"
+}) {
+  const h = typeof height === "number" ? `${height}px` : height;
+  const w = typeof width === "number" ? `${width}px` : width;
+  const r = typeof radius === "number" ? `${radius}px` : radius;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `${SkeletonLoaderItem_default.skeletonLoader} ${SkeletonLoaderItem_default[variant]}`,
+      role: "status",
+      "aria-label": ariaLabel,
+      "aria-live": "polite",
+      style: {
+        ["--h"]: h,
+        ["--r"]: r,
+        ["--speed"]: `${speedSec}s`,
+        ["--width"]: w
+      },
+      children: [
+        /* @__PURE__ */ jsx("span", { className: SkeletonLoaderItem_default.bar, "aria-hidden": "true" }),
+        /* @__PURE__ */ jsx("span", { className: "srOnly", children: "Loading\u2026" })
+      ]
+    }
+  );
+}
+function getColumnWidth(column) {
+  if (typeof column.width === "number" && column.width < 150) {
+    return "100%";
+  }
+  if (typeof column.width === "string" && column.width.endsWith("px")) {
+    const px = parseInt(column.width, 10);
+    if (!isNaN(px) && px < 150) {
+      return "100%";
+    }
+  }
+  const percent = Math.floor(Math.random() * (90 - 50 + 1)) + 50;
+  return `${percent}%`;
+}
+function TableLoadingBody({ rows, columns, hasSelection }) {
+  const widths = Array.from({ length: rows }, () => columns.map(getColumnWidth));
+  return /* @__PURE__ */ jsx("tbody", { className: Table_default.body, children: Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxs("tr", { className: Table_default.row, children: [
+    hasSelection ? /* @__PURE__ */ jsx("td", { className: cx2(Table_default.cell, Table_default.selectionCell), children: /* @__PURE__ */ jsx("div", { className: Table_default.cellContent, children: /* @__PURE__ */ jsx(SkeletonLoaderItem, { height: 20, width: 20 }) }) }) : null,
+    columns.map((column, columnIndex) => {
+      var _a;
+      return /* @__PURE__ */ jsx(
+        "td",
+        {
+          className: cx2(
+            Table_default.cell,
+            column.divider === "left" && Table_default.dividerLeft,
+            column.divider === "right" && Table_default.dividerRight
+          ),
+          "data-align": (_a = column.align) != null ? _a : "left",
+          "data-divider": column.divider,
+          children: /* @__PURE__ */ jsx("div", { className: Table_default.cellContent, children: /* @__PURE__ */ jsx("div", { className: Table_default.cellValueEllipsis, children: /* @__PURE__ */ jsx(SkeletonLoaderItem, { height: 16, width: widths[rowIndex][columnIndex] }) }) })
+        },
+        column.id
+      );
+    })
+  ] }, `loading-row-${rowIndex}`)) });
+}
+function Table({
+  data,
+  dataKey,
+  columns,
+  selectedRows,
+  selectionMode = "single",
+  allRowsSelected,
+  sortById,
+  sortDirection,
+  loading,
+  emptyConfig,
+  variant = "primary",
+  size = "md",
+  viewMode,
+  striped,
+  fillViewport = false,
+  fillViewportBottomOffset = 16,
+  containScrolling = true,
+  stickyHeader,
+  tableWidth,
+  tableRootRef,
+  measuringLayout = false,
+  toolbar,
+  headerExtras,
+  take,
+  skip,
+  totalItemsCount,
+  paginationPlacement = "bottom",
+  showFirstLast = false,
+  pageSizeOptions,
+  getRowSeverity,
+  onRowClick,
+  onRowMouseEnter,
+  onRowSelect,
+  onSelectAllRows,
+  onSortChange,
+  onPageChange,
+  ...rest
+}) {
+  const visibleColumns = useMemo(() => getVisibleColumns(columns), [columns]);
+  const selectionInputName = useId();
+  const internalTableRootRef = useRef(null);
+  const tableRootRefWrapper = useRef(tableRootRef);
+  const hasSelection = Boolean(selectedRows && onRowSelect);
+  const hasPagination = Boolean(onPageChange && (loading || data.length > 0));
+  const paginationOffset = hasPagination ? 72 : 0;
+  const { style: viewportFillStyle, maxHeight } = useViewportFill(internalTableRootRef, {
+    bottomOffset: fillViewportBottomOffset + paginationOffset,
+    min: 0
+  });
+  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 = useCallback((node) => {
+    internalTableRootRef.current = node;
+    if (typeof tableRootRefWrapper.current === "function") {
+      tableRootRefWrapper.current(node);
+    } else if (tableRootRefWrapper.current) {
+      tableRootRefWrapper.current.current = node;
+    }
+  }, []);
+  const handlePageChange = useCallback(
+    (e) => {
+      onPageChange == null ? void 0 : onPageChange(e);
+    },
+    [onPageChange]
+  );
+  const bodyContent = loading && !data.length ? /* @__PURE__ */ jsx(TableLoadingBody, { rows: take != null ? take : 5, columns: visibleColumns, hasSelection }) : /* @__PURE__ */ jsx(
+    TableBody,
+    {
+      data,
+      dataKey,
+      columns: visibleColumns,
+      striped,
+      selectedRows,
+      hasSelection,
+      selectionMode,
+      selectionInputName,
+      viewMode,
+      getRowSeverity,
+      onRowClick,
+      onRowMouseEnter,
+      onRowSelect
+    }
+  );
+  const paginationEl = hasPagination ? /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cx2(
+        Table_default.paginationSlot,
+        paginationPlacement === "top" && Table_default.paginationSlotTop
+      ),
+      children: /* @__PURE__ */ jsx(
+        Pagination,
+        {
+          itemsCount: totalItemsCount,
+          take,
+          skip,
+          onPageChange: handlePageChange,
+          showFirstLast,
+          pageSizeOptions
+        }
+      )
+    }
+  ) : null;
+  const tableClassName = cx2(
+    Table_default.tableRoot,
+    Table_default[variant],
+    Table_default[size],
+    measuringLayout && Table_default.measuringLayout,
+    getRowSeverity && Table_default.severityTable
+  );
+  const tableShell = /* @__PURE__ */ jsx("div", { ...rest, className: tableClassName, children: /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: setTableRootRef,
+      className: Table_default.tableScroll,
+      style: fillViewportActive ? viewportFillStyle : !containScrolling ? { overflow: "visible" } : void 0,
+      children: !data.length && !loading ? /* @__PURE__ */ jsx("div", { className: Table_default.emptyStateSlot, children: /* @__PURE__ */ jsx(TableEmptyState, { config: emptyConfig }) }) : /* @__PURE__ */ jsxs(
+        "table",
+        {
+          className: Table_default.tableElement,
+          "aria-rowcount": data.length,
+          style: tableWidth != null ? { width: tableWidth } : void 0,
+          children: [
+            /* @__PURE__ */ jsxs("colgroup", { children: [
+              hasSelection ? /* @__PURE__ */ jsx("col", { style: { width: SELECTION_COLUMN_PX } }) : null,
+              visibleColumns.map((column) => /* @__PURE__ */ jsx(
+                "col",
+                {
+                  style: column.width != null ? { width: column.width } : void 0
+                },
+                column.id
+              ))
+            ] }),
+            /* @__PURE__ */ jsx(
+              TableHeader,
+              {
+                columns: visibleColumns,
+                hasSelection,
+                selectionMode,
+                allRowsSelected,
+                onSelectAllRows,
+                sortById,
+                sortDirection,
+                onSortChange,
+                headerExtras,
+                stickyTop
+              }
+            ),
+            bodyContent
+          ]
+        }
+      )
+    }
+  ) });
+  if (fillViewport) {
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: Table_default.fillViewportRoot,
+        style: {
+          flexDirection: paginationPlacement === "top" ? "column-reverse" : "column",
+          ...!fillViewportActive && { blockSize: "auto", overflow: "visible" }
+        },
+        children: [
+          toolbar ? /* @__PURE__ */ jsx("div", { className: Table_default.toolbarSlot, children: toolbar }) : null,
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: Table_default.tableViewport,
+              style: !fillViewportActive ? { overflow: "visible" } : void 0,
+              children: tableShell
+            }
+          ),
+          paginationEl
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "dbc-flex dbc-flex-column dbc-gap-md",
+      style: {
+        flexFlow: paginationPlacement === "top" ? "column-reverse" : "column",
+        position: "relative"
+      },
+      children: [
+        toolbar ? /* @__PURE__ */ jsx("div", { className: Table_default.toolbarSlot, children: toolbar }) : null,
+        tableShell,
+        paginationEl
+      ]
+    }
+  );
+}
+
+// src/components/table/tanstackTable.utils.ts
+function getColumnId(def, index) {
+  const d = def;
+  if (d.id != null && String(d.id).length > 0) return String(d.id);
+  if (d.accessorKey != null && String(d.accessorKey).length > 0) return String(d.accessorKey);
+  return `col_${index}`;
+}
+function buildColumnVisibilityFromVisibleIds(defs, visibleColumnIds) {
+  if (!(visibleColumnIds == null ? void 0 : visibleColumnIds.length)) return {};
+  const visible = new Set(visibleColumnIds);
+  const next = {};
+  defs.forEach((def, index) => {
+    const id = getColumnId(def, index);
+    next[id] = visible.has(id);
+  });
+  return next;
+}
+function mapDefsToColumnItems(defs, columnVisibility, resolvedLayout = {}) {
+  return defs.map((def, index) => {
+    var _a, _b, _c, _d, _e, _f, _g;
+    const id = getColumnId(def, index);
+    const accessorKey = def.accessorKey;
+    const accessorFn = def.accessorFn;
+    const cell = def.cell;
+    const meta = (_a = def.meta) != null ? _a : {};
+    let render;
+    if (typeof cell === "function") {
+      render = (row) => cell({
+        row: { original: row },
+        getValue: () => accessorKey != null ? row[accessorKey] : accessorFn ? accessorFn(row) : void 0
+      });
+    } else if (accessorFn) {
+      render = (row) => accessorFn(row);
+    } else if (accessorKey != null) {
+      render = (row) => row[accessorKey];
+    } else {
+      render = () => null;
+    }
+    const isVisible = (_b = columnVisibility[id]) != null ? _b : true;
+    return {
+      id,
+      header: def.header,
+      accessor: accessorKey,
+      sortable: (_c = def.enableSorting) != null ? _c : !!accessorKey,
+      render,
+      hidden: !isVisible,
+      width: (_d = resolvedLayout[id]) == null ? void 0 : _d.width,
+      align: meta.align,
+      verticalAlign: meta.verticalAlign,
+      emptyPlaceholder: (_e = meta.emptyPlaceholder) != null ? _e : "-",
+      allowWrap: (_f = meta.allowWrap) != null ? _f : false,
+      severity: meta.severity,
+      divider: meta.divider,
+      allowOverflow: (_g = meta.allowOverflow) != null ? _g : false
+    };
+  });
+}
+function sortingEqual(a, b) {
+  const A = a == null ? void 0 : a[0];
+  const B = b == null ? void 0 : b[0];
+  if (!A && !B) return true;
+  if (!A || !B) return false;
+  return A.id === B.id && A.desc === B.desc;
+}
+function getSortPropsFromSorting(sorting) {
+  const s = sorting == null ? void 0 : sorting[0];
+  return {
+    sortById: s == null ? void 0 : s.id,
+    sortDirection: s ? s.desc ? "desc" : "asc" : null
+  };
+}
+function clamp(value, min, max) {
+  const lowerBounded = Math.max(min, value);
+  if (max == null || !Number.isFinite(max)) return lowerBounded;
+  return Math.min(lowerBounded, max);
+}
+function toIntegerTrackWidths(tracks, targetWidth) {
+  const floored = tracks.map((track) => ({
+    id: track.id,
+    width: Math.floor(track.width),
+    fraction: track.width - Math.floor(track.width)
+  }));
+  const baseTotal = floored.reduce((sum, track) => sum + track.width, 0);
+  let remainder = Math.max(0, targetWidth - baseTotal);
+  floored.slice().sort((a, b) => b.fraction - a.fraction).forEach((track) => {
+    if (remainder <= 0) return;
+    track.width += 1;
+    remainder -= 1;
+  });
+  return Object.fromEntries(floored.map((track) => [track.id, track.width]));
+}
+function buildDistributedColumnWidths(args) {
+  const { table, hasSelection, defaultMinPx, columnSizing, availableWidth } = args;
+  const leaf = table.getVisibleLeafColumns();
+  const selectionWidth = hasSelection ? SELECTION_COLUMN_PX : 0;
+  const tracks = leaf.map((c) => {
+    var _a, _b, _c, _d;
+    const def = c.columnDef;
+    const meta = (_a = def.meta) != null ? _a : {};
+    const min = Math.max(1, Number((_b = def.minSize) != null ? _b : defaultMinPx));
+    const max = def.maxSize != null ? Math.max(min, Number(def.maxSize)) : void 0;
+    const resizedPxRaw = columnSizing[c.id];
+    const resizedPx = resizedPxRaw != null ? Math.round(clamp(Number(resizedPxRaw), min, max)) : void 0;
+    if (resizedPx != null) {
+      return {
+        id: c.id,
+        width: resizedPx,
+        weight: 0,
+        max: resizedPx,
+        fixed: true
+      };
+    }
+    const rawWeight = Number((_d = (_c = meta.weight) != null ? _c : def.size) != null ? _d : DEFAULT_COLUMN_PX);
+    const weight = Number.isFinite(rawWeight) && rawWeight > 0 ? rawWeight : DEFAULT_COLUMN_PX;
+    return {
+      id: c.id,
+      width: min,
+      weight,
+      max,
+      fixed: false
+    };
+  });
+  const fixedWidth = selectionWidth + tracks.reduce((sum, track) => sum + track.width, 0);
+  let remaining = Math.max(0, availableWidth - fixedWidth);
+  let active = tracks.filter(
+    (track) => !track.fixed && (track.max == null || track.width < track.max)
+  );
+  while (remaining > 0.5 && active.length > 0) {
+    const totalWeight = active.reduce((sum, track) => sum + track.weight, 0);
+    if (totalWeight <= 0) break;
+    let consumed = 0;
+    const nextActive = [];
+    for (const track of active) {
+      const share = remaining * track.weight / totalWeight;
+      const maxGrow = track.max == null ? share : Math.max(0, track.max - track.width);
+      const growth = Math.min(share, maxGrow);
+      track.width += growth;
+      consumed += growth;
+      if (track.max == null || track.width < track.max - 0.5) {
+        nextActive.push(track);
+      }
+    }
+    if (consumed <= 0.5) break;
+    remaining -= consumed;
+    active = nextActive;
+  }
+  const floatTrackTotal = tracks.reduce((sum, track) => sum + track.width, 0);
+  const targetTrackWidth = floatTrackTotal <= availableWidth - selectionWidth ? Math.floor(floatTrackTotal) : Math.ceil(floatTrackTotal);
+  const widths = toIntegerTrackWidths(tracks, targetTrackWidth);
+  const totalWidth = selectionWidth + Object.values(widths).reduce((sum, width) => sum + width, 0);
+  return {
+    selectionWidth: hasSelection ? SELECTION_COLUMN_PX : void 0,
+    widths,
+    totalWidth
+  };
+}
+function TanstackTable(props) {
+  const {
+    data,
+    dataKey,
+    columns,
+    sorting: controlledSorting,
+    onSortingChange,
+    optimisticSortingUi = true,
+    visibleColumnIds,
+    manualSorting,
+    selectedRows,
+    onRowSelect,
+    ...tableProps
+  } = props;
+  const isControlledSorting = controlledSorting != null;
+  const [uiSorting, setUiSorting] = React9.useState(controlledSorting != null ? controlledSorting : []);
+  React9.useEffect(() => {
+    if (!isControlledSorting) return;
+    if (sortingEqual(uiSorting, controlledSorting)) return;
+    setUiSorting(controlledSorting);
+  }, [isControlledSorting, controlledSorting, uiSorting]);
+  const columnVisibility = React9.useMemo(
+    () => buildColumnVisibilityFromVisibleIds(columns, visibleColumnIds),
+    [columns, visibleColumnIds]
+  );
+  const [columnSizing, setColumnSizing] = React9.useState({});
+  const containerRef = React9.useRef(null);
+  const [availableWidth, setAvailableWidth] = React9.useState(void 0);
+  const table = useReactTable({
+    data,
+    columns,
+    state: {
+      sorting: uiSorting,
+      columnSizing,
+      columnVisibility
+    },
+    onSortingChange: (updater) => {
+      const next = typeof updater === "function" ? updater(uiSorting) : updater;
+      if (optimisticSortingUi) setUiSorting(next);
+      onSortingChange == null ? void 0 : onSortingChange(next);
+    },
+    onColumnSizingChange: setColumnSizing,
+    getCoreRowModel: getCoreRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    manualSorting: manualSorting != null ? manualSorting : false,
+    enableColumnResizing: true,
+    columnResizeMode: "onChange",
+    defaultColumn: {
+      enableResizing: true,
+      minSize: 80,
+      size: DEFAULT_COLUMN_PX
+    }
+  });
+  React9.useLayoutEffect(() => {
+    const el = containerRef.current;
+    if (!el) return;
+    const updateWidth = () => {
+      const next = el.clientWidth;
+      setAvailableWidth(next > 0 ? next : void 0);
+    };
+    updateWidth();
+    if (typeof ResizeObserver === "undefined") {
+      window.addEventListener("resize", updateWidth);
+      return () => window.removeEventListener("resize", updateWidth);
+    }
+    const observer = new ResizeObserver(() => updateWidth());
+    observer.observe(el);
+    return () => observer.disconnect();
+  }, []);
+  const distributedLayout = React9.useMemo(() => {
+    if (availableWidth == null) return null;
+    return buildDistributedColumnWidths({
+      table,
+      hasSelection: Boolean(selectedRows && onRowSelect && dataKey),
+      defaultMinPx: 80,
+      columnSizing,
+      availableWidth
+    });
+  }, [table, selectedRows, onRowSelect, dataKey, columnSizing, availableWidth]);
+  const initialLayoutReady = availableWidth != null;
+  const resolvedLayout = React9.useMemo(() => {
+    const next = {};
+    table.getVisibleLeafColumns().forEach((column) => {
+      next[column.id] = {
+        width: distributedLayout == null ? void 0 : distributedLayout.widths[column.id]
+      };
+    });
+    return next;
+  }, [table, distributedLayout]);
+  const columnItems = React9.useMemo(
+    () => mapDefsToColumnItems(columns, columnVisibility, resolvedLayout),
+    [columns, columnVisibility, resolvedLayout]
+  );
+  const visibleData = table.getRowModel().rows.map((r) => r.original);
+  const { sortById, sortDirection } = getSortPropsFromSorting(uiSorting);
+  const handleSortChange = React9.useCallback(
+    (column, direction) => {
+      const next = direction == null ? [] : [{ id: column.id, desc: direction === "desc" }];
+      if (optimisticSortingUi) setUiSorting(next);
+      onSortingChange == null ? void 0 : onSortingChange(next);
+    },
+    [optimisticSortingUi, onSortingChange]
+  );
+  const headerExtras = React9.useCallback(
+    ({ index }) => {
+      var _a, _b, _c, _d;
+      const headerGroups = table.getHeaderGroups();
+      const leafHeaders = headerGroups.length > 0 ? headerGroups[headerGroups.length - 1].headers : [];
+      const header = leafHeaders[index];
+      if (!header) return null;
+      const canResize = (_c = (_b = (_a = header.column).getCanResize) == null ? void 0 : _b.call(_a)) != null ? _c : false;
+      const handler = (_d = header.getResizeHandler) == null ? void 0 : _d.call(header);
+      if (!canResize || !handler) return null;
+      return /* @__PURE__ */ jsx(ColumnResizer_default2, { id: header.column.id, handler });
+    },
+    [table]
+  );
+  return /* @__PURE__ */ jsx(
+    Table,
+    {
+      ...tableProps,
+      tableRootRef: containerRef,
+      onSortChange: handleSortChange,
+      dataKey,
+      data: visibleData,
+      columns: columnItems,
+      tableWidth: distributedLayout == null ? void 0 : distributedLayout.totalWidth,
+      measuringLayout: !initialLayoutReady,
+      sortById,
+      sortDirection,
+      headerExtras,
+      selectedRows,
+      onRowSelect
+    }
+  );
+}
+function TableSettings({
+  viewMode,
+  handleChangeViewMode,
+  columns = [],
+  visibleColumnIds = [],
+  onVisibleColumnIdsChange,
+  columnsLabel = "Kolonner",
+  allPresetLabel = "Alle",
+  standardPresetLabel = "Standard",
+  buttonSize = "sm",
+  additionalSettings
+}) {
+  const handleViewModeChange = (mode, close) => {
+    handleChangeViewMode(mode === "wrapped" ? "compact" : "wrapped");
+    close == null ? void 0 : close();
+  };
+  const hideableColumns = useMemo(() => columns.filter((c) => c.enableHiding !== false), [columns]);
+  const allPresetIds = useMemo(() => hideableColumns.map((c) => c.id), [hideableColumns]);
+  const standardPresetIds = useMemo(
+    () => hideableColumns.filter((c) => {
+      var _a;
+      return ((_a = c.meta) == null ? void 0 : _a.hidden) !== true;
+    }).map((c) => c.id),
+    [hideableColumns]
+  );
+  const visibleSet = useMemo(() => new Set(visibleColumnIds), [visibleColumnIds]);
+  const visibleCount = useMemo(() => {
+    return hideableColumns.reduce((acc, c) => {
+      var _a;
+      return acc + (visibleSet.has((_a = c.id) != null ? _a : "") ? 1 : 0);
+    }, 0);
+  }, [hideableColumns, visibleSet]);
+  const setVisibleIds = (nextIds) => {
+    if (!onVisibleColumnIdsChange) return;
+    const safe = nextIds.length > 0 ? nextIds : standardPresetIds.length > 0 ? standardPresetIds : allPresetIds;
+    onVisibleColumnIdsChange(
+      safe.filter((id) => typeof id === "string" && Boolean(id))
+    );
+  };
+  const toggleColumn = (id, nextVisible) => {
+    const next = new Set(visibleColumnIds);
+    if (nextVisible) next.add(id);
+    else next.delete(id);
+    setVisibleIds(Array.from(next));
+  };
+  const isAllActive = useMemo(() => {
+    if (!hideableColumns.length) return false;
+    return hideableColumns.every((c) => c.id && visibleSet.has(c.id));
+  }, [hideableColumns, visibleSet]);
+  const isStandardActive = useMemo(() => {
+    if (!hideableColumns.length) return false;
+    const std = new Set(standardPresetIds);
+    return hideableColumns.every((c) => c.id && visibleSet.has(c.id) === std.has(c.id));
+  }, [hideableColumns, visibleSet, standardPresetIds]);
+  const presetRadioName = "table-columns-preset";
+  return /* @__PURE__ */ jsx(
+    Popover,
+    {
+      trigger: (onClick, icon) => /* @__PURE__ */ jsxs(Button, { size: buttonSize, onClick, type: "button", children: [
+        /* @__PURE__ */ jsx(Settings, {}),
+        icon
+      ] }),
+      children: (close) => /* @__PURE__ */ jsxs(Menu, { children: [
+        additionalSettings == null ? void 0 : additionalSettings(close),
+        /* @__PURE__ */ jsx(Menu.Item, { active: viewMode === "wrapped", children: /* @__PURE__ */ jsxs("button", { type: "button", onClick: () => handleViewModeChange(viewMode, close), children: [
+          /* @__PURE__ */ jsx(ListChevronsDownUp, {}),
+          "Ombryd tekst"
+        ] }) }),
+        hideableColumns.length > 0 && onVisibleColumnIdsChange ? /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(Menu.Separator, {}),
+          /* @__PURE__ */ jsx("div", { style: { padding: "6px 10px", fontSize: 12, opacity: 0.7 }, children: columnsLabel }),
+          /* @__PURE__ */ jsx(
+            Menu.RadioItem,
+            {
+              name: presetRadioName,
+              value: "all",
+              checked: isAllActive,
+              label: allPresetLabel,
+              onValueChange: () => {
+                setVisibleIds(
+                  allPresetIds.filter((id) => typeof id === "string" && Boolean(id))
+                );
+                close == null ? void 0 : close();
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            Menu.RadioItem,
+            {
+              name: presetRadioName,
+              value: "standard",
+              checked: isStandardActive,
+              label: standardPresetLabel,
+              onValueChange: () => {
+                setVisibleIds(
+                  standardPresetIds.filter(
+                    (id) => typeof id === "string" && Boolean(id)
+                  )
+                );
+                close == null ? void 0 : close();
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx(Menu.Separator, {}),
+          hideableColumns.map((col) => {
+            const isVisible = col.id ? visibleSet.has(col.id) : false;
+            const disableUncheckingLast = isVisible && visibleCount <= 1;
+            const label = col.header;
+            return /* @__PURE__ */ jsx(
+              Menu.CheckItem,
+              {
+                checked: isVisible,
+                disabled: disableUncheckingLast,
+                label,
+                onCheckedChange: (nextChecked) => {
+                  if (disableUncheckingLast) return;
+                  toggleColumn(col.id, nextChecked);
+                }
+              },
+              col.id
+            );
+          })
+        ] }) : null
+      ] })
+    }
+  );
+}
+
+// src/utils/localStorage.utils.ts
+function isBrowser() {
+  return typeof window !== "undefined" && typeof window.localStorage !== "undefined";
+}
+function readLocalStorage(key) {
+  if (!isBrowser()) return void 0;
+  try {
+    const raw = window.localStorage.getItem(key);
+    if (raw == null) return void 0;
+    try {
+      const parsed = JSON.parse(raw);
+      if (typeof parsed === "string") {
+        try {
+          return JSON.parse(parsed);
+        } catch {
+          return parsed;
+        }
+      }
+      return parsed;
+    } catch {
+      return raw;
+    }
+  } catch {
+    return void 0;
+  }
+}
+function writeLocalStorage(key, value) {
+  if (!isBrowser()) return;
+  try {
+    if (value === void 0) {
+      window.localStorage.removeItem(key);
+      return;
+    }
+    if (typeof value === "string") {
+      window.localStorage.setItem(key, value);
+    } else {
+      window.localStorage.setItem(key, JSON.stringify(value));
+    }
+  } catch {
+  }
+}
+
+// src/hooks/useTableSettings.tsx
+function getDefaultVisibleIds(tableColumns) {
+  var _a;
+  return (_a = tableColumns == null ? void 0 : tableColumns.filter((c) => {
+    var _a2;
+    return !((_a2 = c.meta) == null ? void 0 : _a2.hidden);
+  }).map((c) => c.id).filter(Boolean)) != null ? _a : [];
+}
+function mergeDefaults(stored, defaults) {
+  const viewMode = (stored == null ? void 0 : stored.viewMode) === "compact" || (stored == null ? void 0 : stored.viewMode) === "wrapped" ? stored.viewMode : defaults.viewMode;
+  const visibleColumnIds = Array.isArray(stored == null ? void 0 : stored.visibleColumnIds) && stored.visibleColumnIds.length > 0 ? stored.visibleColumnIds : defaults.visibleColumnIds;
+  return { viewMode, visibleColumnIds };
+}
+var localStorageTableSettingsStorage = {
+  get: (key) => {
+    const v = readLocalStorage(key);
+    return v && typeof v === "object" ? v : void 0;
+  },
+  set: (key, next) => {
+    writeLocalStorage(key, next);
+  }
+};
+function useTableSettings({
+  storageKey,
+  tableColumns,
+  defaultViewMode = "compact",
+  defaultVisibleColumnIds,
+  storage = localStorageTableSettingsStorage
+}) {
+  const defaults = useMemo(() => {
+    return {
+      viewMode: defaultViewMode,
+      visibleColumnIds: defaultVisibleColumnIds != null ? defaultVisibleColumnIds : getDefaultVisibleIds(tableColumns)
+    };
+  }, [defaultViewMode, defaultVisibleColumnIds, tableColumns]);
+  const [state, setState] = useState(defaults);
+  useEffect(() => {
+    const stored = storage.get(storageKey);
+    const next = mergeDefaults(stored, defaults);
+    setState(next);
+  }, [storageKey, storage, defaults]);
+  const persist = useCallback(
+    (next) => storage.set(storageKey, next),
+    [storage, storageKey]
+  );
+  const setViewMode = useCallback(
+    (mode) => {
+      setState((prev) => {
+        if (prev.viewMode === mode) return prev;
+        const next = { ...prev, viewMode: mode };
+        persist(next);
+        return next;
+      });
+    },
+    [persist]
+  );
+  const toggleViewMode = useCallback(() => {
+    setState((prev) => {
+      const nextMode = prev.viewMode === "wrapped" ? "compact" : "wrapped";
+      const next = { ...prev, viewMode: nextMode };
+      persist(next);
+      return next;
+    });
+  }, [persist]);
+  const setVisibleColumnIds = useCallback(
+    (ids) => {
+      setState((prev) => {
+        const next = { ...prev, visibleColumnIds: ids };
+        persist(next);
+        return next;
+      });
+    },
+    [persist]
+  );
+  return {
+    viewMode: state.viewMode,
+    toggleViewMode,
+    setViewMode,
+    visibleColumnIds: state.visibleColumnIds,
+    setVisibleColumnIds
+  };
+}
+
+export { TableSettings, TanstackTable, localStorageTableSettingsStorage, useTableSettings };