@mario_hahn/jumpy-ui 0.13.1 → 0.14.1

package/dist/index.js

@@ -1,4 +1,83 @@
 "use client";
+import {
+  JumpTokenInput
+} from "./chunk-KYDYZC4E.js";
+import {
+  BrandMark,
+  JumpAppShell,
+  JumpAvatar,
+  JumpBackground,
+  JumpBadge,
+  JumpBanner,
+  JumpBaseInput,
+  JumpButton,
+  JumpCard,
+  JumpCheckbox,
+  JumpChip,
+  JumpChoice,
+  JumpDatePicker,
+  JumpDialog,
+  JumpDivider,
+  JumpDropdown,
+  JumpExpandable,
+  JumpExpandableGroup,
+  JumpField,
+  JumpGrid,
+  JumpGridItem,
+  JumpHyperlink,
+  JumpIconButton,
+  JumpInput,
+  JumpLinkButton,
+  JumpList,
+  JumpListItem,
+  JumpLoader,
+  JumpMenu,
+  JumpMenuItem,
+  JumpModal,
+  JumpNotice,
+  JumpPageControl,
+  JumpPinInput,
+  JumpPopover,
+  JumpRadioGroup,
+  JumpSearchField,
+  JumpSectionFooter,
+  JumpSectionHeader,
+  JumpSheet,
+  JumpSideMenu,
+  JumpSideMenuItem,
+  JumpSkeletonLoader,
+  JumpSnackbarProvider,
+  JumpSpinner,
+  JumpSwitch,
+  JumpTabBar,
+  JumpTabBarItem,
+  JumpTable,
+  JumpTableBody,
+  JumpTableCell,
+  JumpTableFooter,
+  JumpTableHead,
+  JumpTableHeaderCell,
+  JumpTableRow,
+  JumpTabs,
+  JumpTag,
+  JumpTextarea,
+  JumpTimePicker,
+  JumpToggleButton,
+  JumpToggleButtonGroup,
+  JumpTooltip,
+  JumpTopBar,
+  JumpTypography,
+  KeyboardKeys,
+  applySubtreeSelection,
+  getHeaderCheckboxProps,
+  getNextSortOrder,
+  getRowCheckboxProps,
+  getSortActionLabel,
+  getSortMapping,
+  getSortOrder,
+  isRowFullySelected,
+  useJumpSnackbar
+} from "./chunk-KUCMD6DR.js";
 import {
   JumpyAnimation,
   JumpyAnimationDelay,
@@ -11,12 +90,13 @@ import {
   JumpySpacing,
   JumpyTextStyle,
   JumpyThemeProvider,
-  JumpyThemeScopeContext,
   animationDelayValue,
   animationDurationValue,
   animationEasingValue,
   borderWidthValue,
+  createJumpyPresetFromAccent,
   createJumpyTheme,
+  createJumpyThemeFromAccent,
   createJumpyThemeFromPreset,
   defaultJumpyTheme,
   jumpyThemePresets,
@@ -28,4558 +108,11 @@ import {
   textStyleValue,
   themeToCSSVariables,
   useJumpyTheme
-} from "./chunk-XX3RYGLI.js";
-import {
-  cn
-} from "./chunk-3DBKYKP2.js";
+} from "./chunk-KDFNGI6Y.js";
+import "./chunk-3DBKYKP2.js";
 import {
   jumpyThemeInventory
 } from "./chunk-XDTVYUWG.js";
-
-// index.js
-import { autoUpdate, flip, FloatingFocusManager, FloatingOverlay, FloatingPortal, offset, shift, size, useFloating } from "@floating-ui/react";
-import { Children, cloneElement, createContext, forwardRef, isValidElement, useContext, useEffect as useEffect2, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState2 } from "react";
-
-// token-input.js
-import { useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useState } from "react";
-import { $addUpdateTag, $createLineBreakNode, $createParagraphNode, $createTextNode, $getNodeByKey, $getRoot, $getSelection, $isElementNode, $isLineBreakNode, $isNodeSelection, $isRangeSelection, $isTextNode, $setSelection, CLEAR_HISTORY_COMMAND, COMMAND_PRIORITY_HIGH, COPY_COMMAND, CUT_COMMAND, DELETE_CHARACTER_COMMAND, DecoratorNode, HISTORY_PUSH_TAG, KEY_BACKSPACE_COMMAND, KEY_DELETE_COMMAND, KEY_ENTER_COMMAND, PASTE_COMMAND } from "lexical";
-import { $generateJSONFromSelectedNodes } from "@lexical/clipboard";
-import { LexicalComposer } from "@lexical/react/LexicalComposer";
-import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
-import { ContentEditable } from "@lexical/react/LexicalContentEditable";
-import { PlainTextPlugin } from "@lexical/react/LexicalPlainTextPlugin";
-import { HistoryPlugin } from "@lexical/react/LexicalHistoryPlugin";
-import { LexicalErrorBoundary } from "@lexical/react/LexicalErrorBoundary";
-import { jsx, jsxs } from "react/jsx-runtime";
-var clipboardType = "application/x-jumpy-token-input";
-function normalizeTokenInputValue(value, multiline = false) {
-  const result = [];
-  const ids = /* @__PURE__ */ new Set();
-  for (const part of value) {
-    if (part.type === "text") {
-      const text = multiline ? part.text.replace(/\r\n?/g, "\n") : part.text.replace(/[\r\n]+/g, " ");
-      if (!text) continue;
-      const previous = result[result.length - 1];
-      if (previous?.type === "text") previous.text += text;
-      else result.push({ type: "text", text });
-    } else if (part.type === "token") {
-      if (typeof part.id !== "string" || !part.id || ids.has(part.id) || typeof part.value !== "string" || typeof part.label !== "string" || !part.label) throw new Error("JumpTokenInput tokens require unique ids, string values and non-empty labels");
-      ids.add(part.id);
-      result.push({ type: "token", id: part.id, value: part.value, label: part.label });
-    } else throw new Error("Unknown JumpTokenInput value part");
-  }
-  return result;
-}
-function tokenInputText(value) {
-  return value.map((part) => part.type === "text" ? part.text : part.label).join("");
-}
-var JumpyTokenNode = class _JumpyTokenNode extends DecoratorNode {
-  static getType() {
-    return "jumpy-token";
-  }
-  static clone(node) {
-    return new _JumpyTokenNode(node.__token, node.__key);
-  }
-  static importJSON(json) {
-    return new _JumpyTokenNode(json.token);
-  }
-  constructor(token, key) {
-    super(key);
-    this.__token = { ...token };
-  }
-  exportJSON() {
-    return { ...super.exportJSON(), type: "jumpy-token", version: 1, token: { ...this.__token } };
-  }
-  getTextContent() {
-    return this.__token.label;
-  }
-  isInline() {
-    return true;
-  }
-  isKeyboardSelectable() {
-    return false;
-  }
-  createDOM() {
-    const element = document.createElement("span");
-    element.contentEditable = "false";
-    element.dataset.jumpyTokenId = this.__token.id;
-    element.style.display = "inline-block";
-    return element;
-  }
-  updateDOM() {
-    return false;
-  }
-  decorate(editor) {
-    return /* @__PURE__ */ jsx(TokenChip, { editor, nodeKey: this.__key, token: this.__token });
-  }
-};
-function TokenChip({ editor, nodeKey, token }) {
-  const theme = useJumpyTheme();
-  const [editable, setEditable] = useState(editor.isEditable());
-  useEffect(() => editor.registerEditableListener(setEditable), [editor]);
-  return /* @__PURE__ */ jsxs("span", { "data-jumpy-slot": "input-token", style: { display: "inline-flex", maxWidth: "100%", boxSizing: "border-box", alignItems: "center", verticalAlign: "baseline", borderRadius: theme.radius.small, border: `${theme.borderWidth.small}px solid var(--jumpy-color-feedback-info-border)`, paddingInline: theme.spacing.small3XS, gap: theme.spacing.small3XS, background: "var(--jumpy-color-feedback-info-surface)", color: "var(--jumpy-color-text-primary)", fontSize: theme.fontFamily.bodySmall.fontSize, lineHeight: "inherit", whiteSpace: "inherit" }, children: [
-    /* @__PURE__ */ jsx("span", { style: { minWidth: 0 }, children: token.label }),
-    editable && /* @__PURE__ */ jsx("button", { type: "button", tabIndex: -1, "aria-label": `Remove ${token.label}`, onMouseDown: (event) => event.preventDefault(), onClick: (event) => {
-      event.preventDefault();
-      event.stopPropagation();
-      if (!editor.isEditable()) return;
-      editor.update(() => {
-        const node = $getNodeByKey(nodeKey);
-        if (node) {
-          node.selectPrevious();
-          node.remove();
-        }
-      }, { tag: HISTORY_PUSH_TAG });
-      editor.focus();
-    }, style: { display: "inline-flex", alignItems: "center", appearance: "none", border: 0, padding: 0, background: "transparent", color: "inherit", font: "inherit", cursor: "pointer" }, children: /* @__PURE__ */ jsx("svg", { "aria-hidden": "true", focusable: "false", width: theme.fontFamily.bodySmall.fontSize, height: theme.fontFamily.bodySmall.fontSize, viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ jsx("path", { d: "m4 4 8 8M12 4l-8 8", stroke: "currentColor", strokeWidth: "1.5" }) }) })
-  ] });
-}
-function $readValue(multiline = false) {
-  const parts = [];
-  function visit(node) {
-    if (node instanceof JumpyTokenNode) parts.push({ ...node.__token });
-    else if ($isTextNode(node)) parts.push({ type: "text", text: node.getTextContent() });
-    else if ($isLineBreakNode(node)) parts.push({ type: "text", text: "\n" });
-    else if ($isElementNode(node)) node.getChildren().forEach(visit);
-  }
-  $getRoot().getChildren().forEach((node, index) => {
-    if (index > 0) parts.push({ type: "text", text: "\n" });
-    visit(node);
-  });
-  return normalizeTokenInputValue(parts, multiline);
-}
-function $nodes(parts) {
-  return parts.flatMap((part) => part.type === "token" ? [new JumpyTokenNode(part)] : part.text.split("\n").flatMap((text, index) => [
-    ...index > 0 ? [$createLineBreakNode()] : [],
-    ...text ? [$createTextNode(text)] : []
-  ]));
-}
-function $replaceValue(parts) {
-  $getRoot().clear().append($createParagraphNode().append(...$nodes(parts)));
-}
-function $adjacentToken(backward) {
-  const selection = $getSelection();
-  if (!$isRangeSelection(selection) || !selection.isCollapsed()) return null;
-  const { offset: offset2, type } = selection.anchor;
-  const node = selection.anchor.getNode();
-  if (type === "element" && $isElementNode(node)) return node.getChildAtIndex(offset2 - (backward ? 1 : 0));
-  if ($isTextNode(node) && (backward ? offset2 === 0 : offset2 === node.getTextContentSize())) return backward ? node.getPreviousSibling() : node.getNextSibling();
-  return null;
-}
-function EditorBehavior({ model, multiline, editable, editorRef, onValueChange, onChange, onClear }) {
-  const [editor] = useLexicalComposerContext();
-  const savedSelection = useRef(null);
-  const callbacks = useRef({ onValueChange, onChange, onClear });
-  callbacks.current = { onValueChange, onChange, onClear };
-  const previousMode = useRef(multiline);
-  useLayoutEffect(() => {
-    editor.setEditable(editable);
-  }, [editor, editable]);
-  useLayoutEffect(() => {
-    const current = editor.getEditorState().read(() => $readValue(multiline));
-    if (previousMode.current !== multiline || JSON.stringify(current) !== JSON.stringify(model)) {
-      savedSelection.current = null;
-      editor.update(() => {
-        $replaceValue(model);
-        $setSelection(null);
-      }, { tag: "jumpy-external-value" });
-      editor.dispatchCommand(CLEAR_HISTORY_COMMAND, void 0);
-    }
-    previousMode.current = multiline;
-  }, [editor, model, multiline]);
-  function insert(parts) {
-    if (!editor.isEditable()) return;
-    editor.update(() => {
-      const selection = savedSelection.current?.clone() || $getSelection();
-      if (selection) $setSelection(selection);
-      else $getRoot().selectEnd();
-      $getSelection()?.insertNodes($nodes(parts));
-    }, { tag: HISTORY_PUSH_TAG });
-    editor.focus();
-  }
-  useImperativeHandle(editorRef, () => ({
-    focus: () => editor.focus(),
-    insertText: (text) => insert(normalizeTokenInputValue([{ type: "text", text }], multiline)),
-    insertToken: (token) => {
-      const part = { ...token, type: "token", id: token.id || crypto.randomUUID() };
-      const current = editor.getEditorState().read(() => $readValue(multiline));
-      normalizeTokenInputValue([...current, part], multiline);
-      insert([part]);
-    },
-    removeToken: (id) => {
-      if (!editor.isEditable()) return;
-      editor.update(() => {
-        function remove(node) {
-          if (node instanceof JumpyTokenNode && node.__token.id === id) {
-            node.selectPrevious();
-            node.remove();
-          } else if ($isElementNode(node)) node.getChildren().forEach(remove);
-        }
-        remove($getRoot());
-      }, { tag: HISTORY_PUSH_TAG });
-    },
-    clear: () => {
-      if (!editor.isEditable()) return;
-      if (editor.getEditorState().read(() => $readValue(multiline).length) === 0) return;
-      editor.update(() => {
-        if (!$getSelection()) $getRoot().selectEnd();
-      }, { discrete: true });
-      editor.update(() => {
-        $replaceValue([]);
-        $getRoot().selectStart();
-      }, { tag: [HISTORY_PUSH_TAG, "jumpy-clear"] });
-      editor.focus();
-    }
-  }));
-  useEffect(() => {
-    let previous = JSON.stringify(editor.getEditorState().read(() => $readValue(multiline)));
-    const unregisterUpdate = editor.registerUpdateListener(({ editorState, tags }) => {
-      editorState.read(() => {
-        const selection = $getSelection();
-        if (selection) savedSelection.current = selection.clone();
-        const next = $readValue(multiline);
-        const json = JSON.stringify(next);
-        if (json === previous) return;
-        previous = json;
-        if (tags.has("jumpy-external-value")) return;
-        callbacks.current.onChange?.({ target: { value: tokenInputText(next) }, currentTarget: { value: tokenInputText(next) } });
-        callbacks.current.onValueChange(next);
-        if (tags.has("jumpy-clear")) callbacks.current.onClear?.();
-      });
-    });
-    const deleteToken = (event, backward) => {
-      if (!editor.isEditable() || editor.isComposing()) return false;
-      const selection = $getSelection();
-      if ($isNodeSelection(selection)) {
-        $addUpdateTag(HISTORY_PUSH_TAG);
-        event?.preventDefault();
-        for (const node2 of selection.getNodes()) {
-          node2.selectPrevious();
-          node2.remove();
-        }
-        return true;
-      }
-      const node = $adjacentToken(backward);
-      if (!(node instanceof JumpyTokenNode)) return false;
-      $addUpdateTag(HISTORY_PUSH_TAG);
-      event?.preventDefault();
-      node.selectPrevious();
-      node.remove();
-      return true;
-    };
-    const copy = (event, cut) => {
-      if (!event?.clipboardData || cut && !editor.isEditable()) return false;
-      const selection = $getSelection();
-      if (!selection || $isRangeSelection(selection) && selection.isCollapsed()) return false;
-      const { nodes } = $generateJSONFromSelectedNodes(editor, selection);
-      const parts = [];
-      const visit = (node) => {
-        if (node.type === "jumpy-token") parts.push(node.token);
-        else if (node.type === "text") parts.push({ type: "text", text: node.text });
-        else if (node.type === "linebreak") parts.push({ type: "text", text: "\n" });
-        else node.children?.forEach(visit);
-      };
-      nodes.forEach((node, index) => {
-        if (index > 0 && node.type === "paragraph") parts.push({ type: "text", text: "\n" });
-        visit(node);
-      });
-      event.preventDefault();
-      event.clipboardData.setData("text/plain", tokenInputText(parts));
-      event.clipboardData.setData(clipboardType, JSON.stringify(parts));
-      if (cut) {
-        $addUpdateTag(HISTORY_PUSH_TAG);
-        if ($isNodeSelection(selection)) for (const node of selection.getNodes()) node.remove();
-        else if ($isRangeSelection(selection)) selection.removeText();
-      }
-      return true;
-    };
-    const commands = [
-      editor.registerCommand(DELETE_CHARACTER_COMMAND, (backward) => deleteToken(null, backward), COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(KEY_BACKSPACE_COMMAND, (event) => deleteToken(event, true), COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(KEY_DELETE_COMMAND, (event) => deleteToken(event, false), COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(KEY_ENTER_COMMAND, (event) => {
-        if (editor.isComposing()) return false;
-        event?.preventDefault();
-        if (editable && multiline && !event?.metaKey && !event?.ctrlKey) {
-          const selection = $getSelection();
-          if ($isRangeSelection(selection)) {
-            $addUpdateTag(HISTORY_PUSH_TAG);
-            selection.insertLineBreak();
-          }
-        }
-        return true;
-      }, COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(COPY_COMMAND, (event) => copy(event, false), COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(CUT_COMMAND, (event) => copy(event, true), COMMAND_PRIORITY_HIGH),
-      editor.registerCommand(PASTE_COMMAND, (event) => {
-        if (!event?.clipboardData || !editor.isEditable()) return false;
-        event.preventDefault();
-        $addUpdateTag(HISTORY_PUSH_TAG);
-        let parts;
-        try {
-          parts = normalizeTokenInputValue(JSON.parse(event.clipboardData.getData(clipboardType)).map((part) => part.type === "token" ? { ...part, id: crypto.randomUUID() } : part), multiline);
-        } catch {
-          parts = normalizeTokenInputValue([{ type: "text", text: event.clipboardData.getData("text/plain") }], multiline);
-        }
-        $getSelection()?.insertNodes($nodes(parts));
-        return true;
-      }, COMMAND_PRIORITY_HIGH)
-    ];
-    return () => {
-      unregisterUpdate();
-      commands.forEach((unregister) => unregister());
-    };
-  }, [editor, multiline, editable]);
-  return null;
-}
-function TokenEditor({ model, multiline = false, minRows = 3, maxRows, editorRef, onValueChange, onChange, onClear, onFocus, onBlur, fieldContext, value: _value, placeholder, disabled, readOnly, style, ...props }) {
-  const theme = useJumpyTheme();
-  const initialConfig = useMemo(() => ({ namespace: "JumpyTokenInput", nodes: [JumpyTokenNode], editable: !disabled && !readOnly, onError: (error) => {
-    throw error;
-  }, editorState: () => $replaceValue(model) }), []);
-  const offset2 = fieldContext?.hasLabel ? spacingValue(theme, JumpySpacing.large) : 0;
-  const lineHeight = theme.fontFamily.bodyMedium.fontSize * theme.fontFamily.bodyMedium.lineHeight;
-  return /* @__PURE__ */ jsx(LexicalComposer, { initialConfig, children: /* @__PURE__ */ jsxs("div", { style: { position: "relative", width: "100%", minWidth: 0, marginTop: offset2 }, children: [
-    /* @__PURE__ */ jsx(
-      PlainTextPlugin,
-      {
-        contentEditable: /* @__PURE__ */ jsx(ContentEditable, { ...props, onFocusCapture: (event) => {
-          props.onFocusCapture?.(event);
-          onFocus?.(event);
-        }, onBlurCapture: (event) => {
-          props.onBlurCapture?.(event);
-          onBlur?.(event);
-        }, "data-jumpy-component": "token-input", role: "textbox", "aria-multiline": multiline, "aria-readonly": readOnly || void 0, "aria-disabled": disabled || void 0, tabIndex: disabled ? -1 : 0, style: { width: "100%", minHeight: lineHeight * (multiline ? minRows : 1), maxHeight: multiline && maxRows !== void 0 ? lineHeight * maxRows : void 0, padding: 0, outline: 0, overflowX: "auto", overflowY: multiline ? "auto" : void 0, whiteSpace: multiline ? "pre-wrap" : "pre", overflowWrap: multiline ? "anywhere" : void 0, color: "var(--jumpy-cmp-base-input-value-color)", fontFamily: theme.fontFamily.familyBase, fontSize: theme.fontFamily.bodyMedium.fontSize, lineHeight: theme.fontFamily.bodyMedium.lineHeight, ...style } }),
-        placeholder: null,
-        ErrorBoundary: LexicalErrorBoundary
-      }
-    ),
-    model.length === 0 && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", style: { position: "absolute", top: 0, left: 0, pointerEvents: "none", color: "var(--jumpy-cmp-base-input-placeholder-color)", fontSize: theme.fontFamily.bodyMedium.fontSize, lineHeight: theme.fontFamily.bodyMedium.lineHeight }, children: placeholder }),
-    /* @__PURE__ */ jsx(HistoryPlugin, {}),
-    /* @__PURE__ */ jsx(EditorBehavior, { model, multiline, editable: !disabled && !readOnly, editorRef, onValueChange, onChange, onClear })
-  ] }) });
-}
-
-// index.js
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var JumpyFieldContext = createContext(null);
-var JumpyTableContext = createContext(null);
-var JumpyExpandableContext = createContext(null);
-var JumpySideMenuContext = createContext(null);
-var JumpyToggleButtonGroupContext = createContext(null);
-var JumpySnackbarContext = createContext({ addSnackbar: () => "", removeSnackbar: () => {
-}, clearAll: () => {
-} });
-var KeyboardKeys = {
-  ARROW_DOWN: "ArrowDown",
-  ARROW_LEFT: "ArrowLeft",
-  ARROW_RIGHT: "ArrowRight",
-  ARROW_UP: "ArrowUp",
-  END: "End",
-  ENTER: "Enter",
-  ESCAPE: "Escape",
-  HOME: "Home",
-  SPACE: " ",
-  TAB: "Tab"
-};
-function ChevronDownIcon(props) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsx2("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, style: { display: "block", fontSize: sizeValue(theme, JumpySize.small), ...props.style || {} }, children: /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", d: "M7.41 8.295 6 9.705l6 6 6-6-1.41-1.41-4.59 4.58z", clipRule: "evenodd", fill: "currentColor" }) });
-}
-function ChevronUpIcon(props) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsx2("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, style: { display: "block", fontSize: sizeValue(theme, JumpySize.small), ...props.style || {} }, children: /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", d: "m16.59 15.705 1.41-1.41-6-6-6 6 1.41 1.41 4.59-4.58z", clipRule: "evenodd", fill: "currentColor" }) });
-}
-function CircleConfirmIcon(props) {
-  return /* @__PURE__ */ jsx2("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: /* @__PURE__ */ jsx2("path", { fill: "currentColor", d: "M10 1.667a8.333 8.333 0 1 0 0 16.666 8.333 8.333 0 0 0 0-16.666Zm3.775 6.441-4.167 4.167a.833.833 0 0 1-1.178 0l-2.083-2.083a.833.833 0 1 1 1.178-1.179l1.494 1.494 3.577-3.577a.833.833 0 0 1 1.179 1.178Z" }) });
-}
-function CircleErrorIcon(props) {
-  return /* @__PURE__ */ jsx2("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, children: /* @__PURE__ */ jsx2("path", { fill: "currentColor", d: "M10 1.667a8.333 8.333 0 1 0 0 16.666A8.333 8.333 0 0 0 10 1.667Zm0 4.166c.46 0 .833.373.833.834v3.75a.833.833 0 0 1-1.666 0v-3.75c0-.46.373-.834.833-.834Zm0 8.75a1.042 1.042 0 1 1 0-2.083 1.042 1.042 0 0 1 0 2.083Z" }) });
-}
-function CircleClearIcon(props) {
-  return /* @__PURE__ */ jsxs2("svg", { "data-jumpy-stroke-icon": "true", width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", focusable: "false", ...props, style: { display: "block", fill: "none", ...props.style || {} }, children: [
-    /* @__PURE__ */ jsx2("path", { d: "M10 17.5a7.5 7.5 0 1 0 0-15 7.5 7.5 0 0 0 0 15Z", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }),
-    /* @__PURE__ */ jsx2("path", { d: "m7.5 7.5 5 5M12.5 7.5l-5 5", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
-  ] });
-}
-function supportsDisabledAttribute(tag) {
-  return ["button", "input", "select", "textarea", "option", "optgroup", "fieldset"].includes(tag);
-}
-function responsiveValue(value, defaults) {
-  if (value && typeof value === "object" && !Array.isArray(value)) {
-    return {
-      small: value.small ?? defaults.small,
-      medium: value.medium ?? value.small ?? defaults.medium,
-      large: value.large ?? value.medium ?? value.small ?? defaults.large,
-      xLarge: value.xLarge ?? value.large ?? value.medium ?? value.small ?? defaults.xLarge
-    };
-  }
-  return { small: value, medium: value, large: value, xLarge: value };
-}
-function gridSpacingValue(spacing, fallback = "1rem") {
-  const length = (value2) => typeof value2 === "number" ? `${value2}px` : value2;
-  if (Array.isArray(spacing)) return [length(spacing[0] ?? fallback), length(spacing[1] ?? fallback)];
-  const value = length(spacing ?? fallback);
-  return [value, value];
-}
-function responsiveGridSpacing(spacing) {
-  const defaults = { small: ["1rem", "1rem"], medium: ["1rem", "1rem"], large: ["1.5rem", "1.5rem"], xLarge: ["1.5rem", "1.5rem"] };
-  if (spacing == null || typeof spacing !== "object" || Array.isArray(spacing)) {
-    return {
-      small: gridSpacingValue(spacing ?? defaults.small, defaults.small[0]),
-      medium: gridSpacingValue(spacing ?? defaults.medium, defaults.medium[0]),
-      large: gridSpacingValue(spacing ?? defaults.large, defaults.large[0]),
-      xLarge: gridSpacingValue(spacing ?? defaults.xLarge, defaults.xLarge[0])
-    };
-  }
-  return {
-    small: gridSpacingValue(spacing.small ?? defaults.small, defaults.small[0]),
-    medium: gridSpacingValue(spacing.medium ?? spacing.small ?? defaults.medium, defaults.medium[0]),
-    large: gridSpacingValue(spacing.large ?? spacing.medium ?? spacing.small ?? defaults.large, defaults.large[0]),
-    xLarge: gridSpacingValue(spacing.xLarge ?? spacing.large ?? spacing.medium ?? spacing.small ?? defaults.xLarge, defaults.xLarge[0])
-  };
-}
-function isValueSelected(selectedValues, value) {
-  return value !== void 0 && Array.isArray(selectedValues) && selectedValues.includes(value);
-}
-function hasSelectedNestedItem(node, selectedValues) {
-  if (!Array.isArray(selectedValues) || !node) return false;
-  let found = false;
-  Children.forEach(node, (child) => {
-    if (found || !isValidElement(child)) return;
-    if (isValueSelected(selectedValues, child.props.value)) {
-      found = true;
-      return;
-    }
-    const nestedMenu = child.props.slots?.nestedMenu ?? child.props.nestedMenu;
-    if (hasSelectedNestedItem(nestedMenu ?? child.props.children, selectedValues)) found = true;
-  });
-  return found;
-}
-function focusSideMenuItem(itemRefs, direction) {
-  const items = itemRefs.map((ref) => ref?.current).filter((item) => item && item.dataset.disabled !== "true");
-  if (!items.length) return;
-  const currentIndex = Math.max(0, items.findIndex((item) => item === document.activeElement || item.contains(document.activeElement)));
-  const nextIndex = direction === "first" ? 0 : direction === "last" ? items.length - 1 : (currentIndex + direction + items.length) % items.length;
-  items[nextIndex]?.focus();
-}
-function transitionTimeToMs(value) {
-  return value.split(",").map((part) => part.trim()).reduce((max, part) => {
-    if (!part) return max;
-    const ms = part.endsWith("ms") ? Number.parseFloat(part) : Number.parseFloat(part) * 1e3;
-    return Number.isFinite(ms) ? Math.max(max, ms) : max;
-  }, 0);
-}
-function getWidthTransitionMs(element) {
-  const styles = window.getComputedStyle(element);
-  const properties = styles.transitionProperty.split(",").map((part) => part.trim());
-  const widthIndex = properties.findIndex((property) => property === "width" || property === "all");
-  if (widthIndex === -1) return 0;
-  return transitionTimeToMs(styles.transitionDuration) + transitionTimeToMs(styles.transitionDelay);
-}
-function splitNavigationItemProps(props) {
-  const linkKeys = /* @__PURE__ */ new Set(["href", "target", "rel", "download", "hrefLang", "ping", "referrerPolicy", "aria-current", "aria-disabled"]);
-  const wrapperProps = {};
-  const linkProps = {};
-  Object.entries(props).forEach(([key, value]) => {
-    if (linkKeys.has(key)) {
-      linkProps[key] = value;
-      return;
-    }
-    wrapperProps[key] = value;
-  });
-  return { wrapperProps, linkProps };
-}
-function clampNumber(value, min, max) {
-  return Math.min(Math.max(value, min), max);
-}
-function getButtonVariantStyles(theme, variant, status = "regular") {
-  const variantTokens = theme.actions[variant] || theme.actions.primary;
-  const tokens = variantTokens[status] || variantTokens.regular;
-  const elevated = variant === "primary";
-  const token = (state, slot, fallback) => variant === "primary" && status === "regular" ? `var(--jumpy-actions-primary-regular-${state}-${slot}, ${fallback})` : fallback;
-  return {
-    "--jumpy-action-default-surface": token("default", "surface", tokens.default.surface),
-    "--jumpy-action-default-text": token("default", "text", tokens.default.text),
-    "--jumpy-action-default-border": token("default", "border", tokens.default.border),
-    "--jumpy-action-default-icon": token("default", "icon", tokens.default.icon),
-    "--jumpy-action-hover-surface": token("hover", "surface", tokens.hover.surface),
-    "--jumpy-action-hover-text": token("hover", "text", tokens.hover.text),
-    "--jumpy-action-hover-icon": token("hover", "icon", tokens.hover.icon),
-    "--jumpy-action-hover-border": token("hover", "border", tokens.hover.border),
-    "--jumpy-action-pressed-surface": token("pressed", "surface", tokens.pressed.surface),
-    "--jumpy-action-pressed-text": token("pressed", "text", tokens.pressed.text),
-    "--jumpy-action-pressed-icon": token("pressed", "icon", tokens.pressed.icon),
-    "--jumpy-action-pressed-border": token("pressed", "border", tokens.pressed.border),
-    "--jumpy-action-focus-surface": token("focus", "surface", tokens.focus.surface),
-    "--jumpy-action-focus-text": token("focus", "text", tokens.focus.text),
-    "--jumpy-action-focus-icon": token("focus", "icon", tokens.focus.icon),
-    "--jumpy-action-focus-border": token("focus", "border", tokens.focus.border),
-    "--jumpy-action-focus-ring": token("focus", "focus-ring", tokens.focus.focusRing),
-    "--jumpy-action-disabled-surface": token("disabled", "surface", tokens.disabled.surface),
-    "--jumpy-action-disabled-text": token("disabled", "text", tokens.disabled.text),
-    "--jumpy-action-disabled-icon": token("disabled", "icon", tokens.disabled.icon),
-    "--jumpy-action-disabled-border": token("disabled", "border", tokens.disabled.border),
-    "--jumpy-action-hover-shadow": "none",
-    "--jumpy-action-focus-shadow": elevated ? shadowValue(theme, JumpyShadowStyle.positiveSmall) : "none",
-    "--jumpy-action-pressed-shadow": "none",
-    "--jumpy-action-default-shadow": elevated ? shadowValue(theme, JumpyShadowStyle.positiveMedium) : "none"
-  };
-}
-function getNoticeToneStyles(theme, tone) {
-  switch (tone) {
-    case "success":
-      return {
-        backgroundColor: theme.color.successSurface,
-        borderColor: theme.color.successBorder,
-        color: theme.color.successText
-      };
-    case "warning":
-      return {
-        backgroundColor: theme.color.warningSurface,
-        borderColor: theme.color.warningBorder,
-        color: theme.color.warningText
-      };
-    case "danger":
-      return {
-        backgroundColor: theme.color.dangerSurface,
-        borderColor: theme.color.dangerBorder,
-        color: theme.color.dangerText
-      };
-    default:
-      return {
-        backgroundColor: theme.color.infoSurface,
-        borderColor: theme.color.infoBorder,
-        color: theme.color.textPrimary
-      };
-  }
-}
-function getBannerStatusStyles(theme, status) {
-  switch (status) {
-    case "positive":
-      return { indicator: theme.color.positiveBase, indicatorSurface: theme.color.positiveUltralight, inlineSurface: theme.color.positiveExtralight };
-    case "warning":
-      return { indicator: theme.color.warningBase, indicatorSurface: theme.color.warningUltralight, inlineSurface: theme.color.warningExtralight };
-    case "alarm":
-      return { indicator: theme.color.alarmBase, indicatorSurface: theme.color.alarmUltralight, inlineSurface: theme.color.alarmExtralight };
-    case "info":
-      return { indicator: theme.color.neutralBase, indicatorSurface: theme.color.neutralMegalight, inlineSurface: `rgba(244, 247, 245, ${opacityValue(theme, JumpyOpacity.medium)})` };
-    default:
-      return { indicator: theme.color.neutralBase, indicatorSurface: "transparent", inlineSurface: "transparent" };
-  }
-}
-function JumpSeverityIcon({ status = "other", icon, style }) {
-  if (status === "other" && icon) return icon;
-  const common = {
-    viewBox: "0 0 24 24",
-    width: "100%",
-    height: "100%",
-    fill: "currentColor",
-    xmlns: "http://www.w3.org/2000/svg",
-    "aria-hidden": true,
-    focusable: false,
-    style
-  };
-  switch (status) {
-    case "positive":
-      return /* @__PURE__ */ jsx2("svg", { ...common, children: /* @__PURE__ */ jsx2("path", { d: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm4.3 7.8-5 5a1 1 0 0 1-1.4 0l-2.2-2.2a1 1 0 1 1 1.4-1.4l1.5 1.5 4.3-4.3a1 1 0 1 1 1.4 1.4Z" }) });
-    case "warning":
-      return /* @__PURE__ */ jsx2("svg", { ...common, children: /* @__PURE__ */ jsx2("path", { d: "M11.1 3.5a1 1 0 0 1 1.8 0l8.2 15A1 1 0 0 1 20.2 20H3.8a1 1 0 0 1-.9-1.5l8.2-15ZM12 8a1 1 0 0 0-1 1v4a1 1 0 1 0 2 0V9a1 1 0 0 0-1-1Zm0 9.25a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z" }) });
-    case "alarm":
-      return /* @__PURE__ */ jsx2("svg", { ...common, children: /* @__PURE__ */ jsx2("path", { d: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm1 13a1 1 0 1 1-2 0V7a1 1 0 1 1 2 0v8Zm-1 4a1.25 1.25 0 1 1 0-2.5 1.25 1.25 0 0 1 0 2.5Z" }) });
-    case "info":
-      return /* @__PURE__ */ jsx2("svg", { ...common, children: /* @__PURE__ */ jsx2("path", { d: "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm1 15a1 1 0 1 1-2 0v-6a1 1 0 1 1 2 0v6Zm-1-8.5A1.25 1.25 0 1 1 12 6a1.25 1.25 0 0 1 0 2.5Z" }) });
-    default:
-      return /* @__PURE__ */ jsx2("svg", { ...common, children: /* @__PURE__ */ jsx2("circle", { cx: "12", cy: "12", r: "9" }) });
-  }
-}
-function renderBannerSlot(slot, fallbackTag = "span", className, style) {
-  if (!slot) return null;
-  if (typeof slot === "string" || typeof slot === "number") {
-    const Tag = fallbackTag;
-    return /* @__PURE__ */ jsx2(Tag, { className, style, children: slot });
-  }
-  if (isValidElement(slot)) {
-    return cloneElement(slot, {
-      className: cn(className, slot.props.className),
-      style: slot.props.style || style ? { ...style, ...slot.props.style } : void 0
-    });
-  }
-  return slot;
-}
-function getBadgeStatusStyles(theme, status) {
-  const alwaysLight = "var(--jumpy-color-non-color-always-ultralight, #FFFFFF)";
-  switch (status) {
-    case "positive":
-      return { backgroundColor: theme.color.positiveBase, color: alwaysLight };
-    case "warning":
-      return { backgroundColor: theme.color.warningBase, color: theme.color.nonColorAlwaysUltradark };
-    case "alarm":
-      return { backgroundColor: theme.color.alarmBase, color: alwaysLight };
-    case "active":
-      return { backgroundColor: "var(--jumpy-color-primary-base)", color: theme.color.textOnPrimary };
-    default:
-      return { backgroundColor: theme.color.neutralBase, color: alwaysLight };
-  }
-}
-function getBadgeSizeStyles(theme, size2) {
-  const labelSmall = textStyleValue(theme, JumpyTextStyle.labelSmallEmphasized);
-  const labelMedium = textStyleValue(theme, JumpyTextStyle.labelMediumEmphasized);
-  switch (size2) {
-    case "xSmall":
-      return {
-        width: sizeValue(theme, JumpySize.small3XS),
-        height: sizeValue(theme, JumpySize.small3XS),
-        minWidth: sizeValue(theme, JumpySize.small3XS),
-        padding: spacingValue(theme, JumpySpacing.zero),
-        fontSize: 0,
-        lineHeight: 0
-      };
-    case "medium":
-      return {
-        minWidth: sizeValue(theme, JumpySize.small),
-        height: sizeValue(theme, JumpySize.small),
-        padding: `${spacingValue(theme, JumpySpacing.small3XS)}px ${spacingValue(theme, JumpySpacing.smallXS)}px`,
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: labelMedium.fontSize,
-        // A line box filling the whole-pixel content height keeps the baseline from rounding the digits upward.
-        lineHeight: `${sizeValue(theme, JumpySize.small) - spacingValue(theme, JumpySpacing.small3XS) * 2}px`,
-        fontWeight: labelMedium.fontWeight
-      };
-    default:
-      return {
-        minWidth: sizeValue(theme, JumpySize.small2XS),
-        height: sizeValue(theme, JumpySize.small2XS),
-        padding: `${spacingValue(theme, JumpySpacing.zero)}px ${spacingValue(theme, JumpySpacing.small3XS)}px`,
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: labelSmall.fontSize,
-        lineHeight: `${sizeValue(theme, JumpySize.small2XS)}px`,
-        fontWeight: labelSmall.fontWeight
-      };
-  }
-}
-function getTagStatusStyles(theme, status) {
-  switch (status) {
-    case "positive":
-      return { backgroundColor: theme.color.successSurface, color: theme.color.successText, borderColor: theme.color.successBorder };
-    case "warning":
-      return { backgroundColor: theme.color.warningSurface, color: theme.color.warningText, borderColor: theme.color.warningBorder };
-    case "alarm":
-      return { backgroundColor: theme.color.dangerSurface, color: theme.color.dangerText, borderColor: theme.color.dangerBorder };
-    default:
-      return { backgroundColor: theme.color.surfaceField, color: theme.color.textPrimary, borderColor: theme.color.borderSubtle };
-  }
-}
-function getTypographyStyle(theme, variant = "bodyMedium") {
-  const style = textStyleValue(theme, JumpyTextStyle[variant] || JumpyTextStyle.bodyMedium);
-  return {
-    fontFamily: theme.fontFamily.familyBase,
-    fontSize: style.fontSize,
-    lineHeight: style.lineHeight,
-    fontWeight: style.fontWeight,
-    letterSpacing: style.letterSpacing
-  };
-}
-function getCardStateStyles(theme, selected = false) {
-  const inactive = theme.card.inactive;
-  const active = theme.card.active;
-  const tokens = selected ? active : inactive;
-  const state = selected ? "active" : "inactive";
-  const cardToken = (interaction, slot, fallback) => `var(--jumpy-card-${state}-${interaction}-${slot}, ${fallback})`;
-  return {
-    "--jumpy-card-default-surface": cardToken("default", "surface", tokens.default.surface),
-    "--jumpy-card-default-border": cardToken("default", "border", tokens.default.border),
-    "--jumpy-card-default-text": cardToken("default", "text", tokens.default.text),
-    "--jumpy-card-default-icon": cardToken("default", "icon", tokens.default.icon),
-    "--jumpy-card-hover-surface": cardToken("hover", "surface", tokens.hover.surface),
-    "--jumpy-card-hover-border": cardToken("hover", "border", tokens.hover.border),
-    "--jumpy-card-hover-text": cardToken("hover", "text", tokens.hover.text),
-    "--jumpy-card-hover-icon": cardToken("hover", "icon", tokens.hover.icon),
-    "--jumpy-card-pressed-surface": cardToken("pressed", "surface", tokens.pressed.surface),
-    "--jumpy-card-pressed-border": cardToken("pressed", "border", tokens.pressed.border),
-    "--jumpy-card-pressed-text": cardToken("pressed", "text", tokens.pressed.text),
-    "--jumpy-card-pressed-icon": cardToken("pressed", "icon", tokens.pressed.icon),
-    "--jumpy-card-focus-surface": cardToken("focus", "surface", tokens.focus.surface),
-    "--jumpy-card-focus-border": cardToken("focus", "border", tokens.focus.border),
-    "--jumpy-card-focus-ring": cardToken("focus-focus", "ring", tokens.focus.focusRing),
-    "--jumpy-card-focus-text": cardToken("focus", "text", tokens.focus.text),
-    "--jumpy-card-focus-icon": cardToken("focus", "icon", tokens.focus.icon),
-    "--jumpy-card-disabled-surface": cardToken("disabled", "surface", tokens.disabled.surface),
-    "--jumpy-card-disabled-border": cardToken("disabled", "border", tokens.disabled.border),
-    "--jumpy-card-disabled-text": cardToken("disabled", "text", tokens.disabled.text),
-    "--jumpy-card-disabled-icon": cardToken("disabled", "icon", tokens.disabled.icon)
-  };
-}
-function getListItemStateStyles(theme, selected = false) {
-  const tokens = selected ? theme.listItem.active : theme.listItem.inactive;
-  return {
-    "--jumpy-list-item-default-surface": tokens.default.surface,
-    "--jumpy-list-item-default-text": tokens.default.text,
-    "--jumpy-list-item-default-subtext": tokens.default.subtext,
-    "--jumpy-list-item-default-icon": tokens.default.icon,
-    "--jumpy-list-item-hover-surface": tokens.hover.surface,
-    "--jumpy-list-item-hover-text": tokens.hover.text,
-    "--jumpy-list-item-hover-subtext": tokens.hover.subtext,
-    "--jumpy-list-item-hover-icon": tokens.hover.icon,
-    "--jumpy-list-item-pressed-surface": tokens.pressed.surface,
-    "--jumpy-list-item-pressed-text": tokens.pressed.text,
-    "--jumpy-list-item-pressed-subtext": tokens.pressed.subtext,
-    "--jumpy-list-item-pressed-icon": tokens.pressed.icon,
-    "--jumpy-list-item-focus-surface": tokens.focus.surface,
-    "--jumpy-list-item-focus-text": tokens.focus.text,
-    "--jumpy-list-item-focus-subtext": tokens.focus.subtext,
-    "--jumpy-list-item-focus-icon": tokens.focus.icon,
-    "--jumpy-list-item-focus-ring": tokens.focus.focusRing,
-    "--jumpy-list-item-disabled-surface": tokens.disabled.surface,
-    "--jumpy-list-item-disabled-text": tokens.disabled.text,
-    "--jumpy-list-item-disabled-subtext": tokens.disabled.subtext,
-    "--jumpy-list-item-disabled-icon": tokens.disabled.icon
-  };
-}
-function getButtonSpacing(theme, variant, hasLeading, hasTrailing) {
-  const gap = spacingValue(theme, JumpySpacing.smallXS);
-  const verticalPadding = spacingValue(theme, JumpySpacing.small2XS);
-  if (variant === "borderless") {
-    return {
-      gap,
-      paddingLeft: spacingValue(theme, JumpySpacing.zero),
-      paddingRight: spacingValue(theme, JumpySpacing.zero),
-      paddingTop: verticalPadding,
-      paddingBottom: verticalPadding
-    };
-  }
-  return {
-    gap,
-    paddingLeft: hasLeading ? spacingValue(theme, JumpySpacing.medium) : spacingValue(theme, JumpySpacing.medium) + spacingValue(theme, JumpySpacing.small3XS),
-    paddingRight: hasTrailing ? spacingValue(theme, JumpySpacing.medium) : spacingValue(theme, JumpySpacing.medium) + spacingValue(theme, JumpySpacing.small3XS),
-    paddingTop: verticalPadding,
-    paddingBottom: verticalPadding
-  };
-}
-function getFieldInputStyles(theme, disabled) {
-  const bodyMedium = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  return {
-    display: "block",
-    width: "100%",
-    boxSizing: "border-box",
-    color: "var(--jumpy-cmp-base-input-value-color)",
-    padding: 0,
-    margin: 0,
-    border: 0,
-    outline: 0,
-    background: "transparent",
-    opacity: disabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid),
-    fontFamily: theme.fontFamily.familyBase,
-    fontSize: bodyMedium.fontSize,
-    lineHeight: `${bodyMedium.fontSize * bodyMedium.lineHeight}px`,
-    transition: `color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${theme.animation.timeEasingRelease}`
-  };
-}
-function getFieldShellStyles(theme, disabled, status = "regular", focused = false, readOnly = false) {
-  const outlineWidth = borderWidthValue(theme, focused && !readOnly ? JumpyBorderWidth.medium : JumpyBorderWidth.small);
-  const easing = focused && !readOnly ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease;
-  return {
-    display: "flex",
-    alignItems: "center",
-    width: "100%",
-    minHeight: sizeValue(theme, JumpySize.largeXL),
-    height: sizeValue(theme, JumpySize.largeXL),
-    boxSizing: "border-box",
-    borderRadius: radiusValue(theme, JumpyRadius.small),
-    border: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid transparent`,
-    outline: readOnly ? "none" : `${outlineWidth}px solid var(--jumpy-cmp-base-input-border-color)`,
-    outlineOffset: readOnly ? void 0 : -outlineWidth,
-    backgroundColor: "var(--jumpy-cmp-base-input-surface-color)",
-    paddingLeft: spacingValue(theme, JumpySpacing.large),
-    paddingRight: spacingValue(theme, JumpySpacing.small3XS),
-    paddingTop: spacingValue(theme, JumpySpacing.small3XS),
-    paddingBottom: spacingValue(theme, JumpySpacing.small3XS),
-    opacity: disabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid),
-    gap: spacingValue(theme, JumpySpacing.medium),
-    cursor: disabled || readOnly ? "default" : "text",
-    pointerEvents: disabled ? "none" : void 0,
-    transition: `background-color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${easing}, outline-color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${easing}, outline-width ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${easing}`
-  };
-}
-function renderStandaloneField(theme, disabled, className, style, inputElement, status = "regular", readOnly = false) {
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      "data-jumpy-component": "field-control",
-      "data-disabled": disabled ? "true" : "false",
-      "data-readonly": readOnly ? "true" : "false",
-      "data-status": status,
-      className: cn(className),
-      style: {
-        ...getFieldShellStyles(theme, disabled, status, false, readOnly),
-        ...style || {}
-      },
-      children: inputElement
-    }
-  );
-}
-function JumpBackground({ snow = true }) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsxs2("div", { className: "pointer-events-none fixed inset-0 z-0 overflow-hidden", style: { pointerEvents: "none" }, children: [
-    /* @__PURE__ */ jsx2("div", { className: "absolute left-1/2 top-[-18rem] h-[34rem] w-[34rem] -translate-x-1/2 rounded-full blur-[120px]", style: { backgroundColor: theme.color.infoSurface } }),
-    /* @__PURE__ */ jsx2("div", { className: "absolute bottom-24 right-[-10rem] h-[28rem] w-[28rem] rounded-full blur-[110px]", style: { backgroundColor: theme.color.borderSubtle } }),
-    /* @__PURE__ */ jsx2("div", { className: "absolute inset-0 bg-[radial-gradient(rgba(26,28,31,0.16)_1px,transparent_1px)] bg-[size:22px_22px]", style: { opacity: theme.opacity.subtle } }),
-    snow && /* @__PURE__ */ jsx2("div", { className: "snowfall", "aria-hidden": "true" })
-  ] });
-}
-function JumpBadge({ as, size: size2 = "medium", status = "regular", hidden = false, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const visible = !hidden;
-  const Root = as || "div";
-  return /* @__PURE__ */ jsx2(
-    Root,
-    {
-      ...props,
-      "data-jumpy-component": "badge",
-      "data-size": size2,
-      "data-status": status,
-      "data-visible": visible ? "true" : "false",
-      role: props.role || "status",
-      "aria-live": props["aria-live"] || "polite",
-      "aria-hidden": hidden || void 0,
-      className: cn("inline-flex items-center justify-center box-border", className),
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        boxSizing: "border-box",
-        ...getBadgeSizeStyles(theme, size2),
-        ...getBadgeStatusStyles(theme, status),
-        borderRadius: radiusValue(theme, JumpyRadius.full),
-        letterSpacing: "normal",
-        opacity: visible ? opacityValue(theme, JumpyOpacity.solid) : opacityValue(theme, JumpyOpacity.transparent),
-        scale: visible ? 1 : 0.25,
-        width: size2 === "xSmall" ? sizeValue(theme, JumpySize.small3XS) : "fit-content",
-        transition: `width ${animationDurationValue(theme, JumpyAnimationDuration.medium)}s ${theme.animation.timeEasingDrift}, opacity ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${visible ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease}, scale ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${visible ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease}`,
-        ...props.style || {}
-      },
-      children: size2 === "xSmall" ? null : /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "badge-content", style: { display: "inline-block", lineHeight: "inherit", fontVariantNumeric: "tabular-nums" }, children })
-    }
-  );
-}
-function BrandMark({ compact = false, label = "Jumpy UI" }) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsxs2("div", { className: cn("flex items-center gap-3", !compact && "justify-center"), children: [
-    /* @__PURE__ */ jsx2("div", { className: "grid h-10 w-10 place-items-center rounded-xl text-xl font-black", style: { backgroundColor: theme.color.surfaceCard, color: theme.color.surfacePrimary, borderRadius: theme.radius.medium }, children: "J" }),
-    /* @__PURE__ */ jsx2("span", { className: "block text-lg font-extrabold tracking-tight", style: { color: theme.color.textPrimary, fontFamily: theme.typography.fontFamily }, children: label })
-  ] });
-}
-function JumpCard({ as, ref, children, className = "", variant = "filled", interactive = false, selected = false, disabled = false, dragged = false, innerClasses = {}, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  const cardRef = useRef2(null);
-  const [pressScaleLimit, setPressScaleLimit] = useState2(1);
-  const pressDistance = spacingValue(theme, JumpySpacing.small3XS);
-  useLayoutEffect2(() => {
-    const element = cardRef.current;
-    if (!element || !interactive || disabled) return;
-    const measure = () => {
-      const longestSide = Math.max(element.offsetWidth, element.offsetHeight);
-      setPressScaleLimit(longestSide > 0 ? Math.max(0, 1 - pressDistance / longestSide) : 1);
-    };
-    measure();
-    const observer = new ResizeObserver(measure);
-    observer.observe(element);
-    return () => observer.disconnect();
-  }, [Component, interactive, disabled, pressDistance]);
-  const isButton = Component === "button";
-  const activity = selected ? "active" : "inactive";
-  const draggedStyles = dragged && !disabled ? {
-    borderColor: `var(--jumpy-card-${activity}-dragged-border)`,
-    backgroundColor: `var(--jumpy-card-${activity}-dragged-surface)`
-  } : {};
-  const hasPaddingUtility = /(?:^|\s)(?:[a-z]+:)*p(?:[trblxy])?-/.test(className);
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      ref: (node) => {
-        cardRef.current = node;
-        if (typeof ref === "function") return ref(node);
-        if (ref) ref.current = node;
-      },
-      type: isButton ? props.type || "button" : props.type,
-      disabled: isButton ? disabled : void 0,
-      "data-jumpy-component": "card",
-      "data-variant": variant,
-      "data-interactive": interactive ? "true" : "false",
-      "data-selected": selected ? "true" : "false",
-      "data-dragged": dragged ? "true" : "false",
-      "data-disabled": disabled ? "true" : "false",
-      tabIndex: interactive && !disabled ? props.tabIndex ?? 0 : props.tabIndex,
-      "aria-disabled": disabled || void 0,
-      className: cn(className),
-      style: {
-        ...getCardStateStyles(theme, selected),
-        "--jumpy-card-press-scale-limit": pressScaleLimit,
-        display: "block",
-        position: "relative",
-        boxSizing: "border-box",
-        overflow: "hidden",
-        appearance: isButton ? "none" : void 0,
-        WebkitAppearance: isButton ? "none" : void 0,
-        outline: "none",
-        border: 0,
-        borderRadius: theme.sizing.cardRadius,
-        padding: props.style?.padding === void 0 && !hasPaddingUtility ? spacingValue(theme, JumpySpacing.large) : void 0,
-        backgroundColor: "var(--jumpy-card-default-surface)",
-        boxShadow: variant === "filled" ? theme.shadow.card : "none",
-        color: "var(--jumpy-card-default-text, var(--jumpy-color-text-primary))",
-        ...draggedStyles,
-        ...props.style || {}
-      },
-      children: [
-        interactive && selected ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "checkmark", className: innerClasses.checkmark?.className, style: { position: "absolute", right: "var(--jumpy-cmp-card-checkmark-right)", top: "var(--jumpy-cmp-card-checkmark-top)", display: "flex", color: "var(--jumpy-card-default-icon)", ...innerClasses.checkmark?.style || {} }, children: /* @__PURE__ */ jsx2(CircleConfirmIcon, { "data-jumpy-slot": "checkmark-icon", className: innerClasses.checkmarkIcon?.className, style: { width: sizeValue(theme, JumpySize.small), height: sizeValue(theme, JumpySize.small), ...innerClasses.checkmarkIcon?.style || {} } }) }) : null,
-        children
-      ]
-    }
-  );
-}
-function JumpGrid({ as, columns = { small: 8, medium: 12, large: 12, xLarge: 12 }, spacing = { small: ["1rem", "1rem"], medium: ["1rem", "1rem"], large: ["1.5rem", "1.5rem"], xLarge: ["1.5rem", "1.5rem"] }, children, className = "", ...props }) {
-  const Component = as || "div";
-  const resolvedColumns = responsiveValue(columns, { small: 8, medium: 12, large: 12, xLarge: 12 });
-  const resolvedSpacing = responsiveGridSpacing(spacing);
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "grid",
-      className: cn(className),
-      style: {
-        "--jumpy-cmp-grid-columns-small": resolvedColumns.small,
-        "--jumpy-cmp-grid-columns-medium": resolvedColumns.medium,
-        "--jumpy-cmp-grid-columns-large": resolvedColumns.large,
-        "--jumpy-cmp-grid-columns-xLarge": resolvedColumns.xLarge,
-        "--jumpy-cmp-grid-spacing-row-small": resolvedSpacing.small[0],
-        "--jumpy-cmp-grid-spacing-column-small": resolvedSpacing.small[1],
-        "--jumpy-cmp-grid-spacing-row-medium": resolvedSpacing.medium[0],
-        "--jumpy-cmp-grid-spacing-column-medium": resolvedSpacing.medium[1],
-        "--jumpy-cmp-grid-spacing-row-large": resolvedSpacing.large[0],
-        "--jumpy-cmp-grid-spacing-column-large": resolvedSpacing.large[1],
-        "--jumpy-cmp-grid-spacing-row-xLarge": resolvedSpacing.xLarge[0],
-        "--jumpy-cmp-grid-spacing-column-xLarge": resolvedSpacing.xLarge[1],
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpGridItem({ as, span = 1, horizontalPlacement = "stretch", verticalPlacement = "stretch", children, className = "", ...props }) {
-  const Component = as || "div";
-  const resolvedSpan = responsiveValue(span, { small: 1, medium: 1, large: 1, xLarge: 1 });
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "grid-item",
-      "data-horizontal-placement": horizontalPlacement,
-      "data-vertical-placement": verticalPlacement,
-      className: cn(className),
-      style: {
-        "--jumpy-cmp-grid-item-span-small": resolvedSpan.small,
-        "--jumpy-cmp-grid-item-span-medium": resolvedSpan.medium,
-        "--jumpy-cmp-grid-item-span-large": resolvedSpan.large,
-        "--jumpy-cmp-grid-item-span-xLarge": resolvedSpan.xLarge,
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpList({ as, children, className = "", ...props }) {
-  const Component = as || "div";
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "list",
-      role: props.role || "list",
-      className: cn(className),
-      style: {
-        display: "block",
-        width: "100%",
-        height: "fit-content",
-        overflowX: "hidden",
-        overflowY: "auto",
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpListItem({ as, children, className = "", selected = false, disabled = false, readOnly = false, focusedView = false, leading, trailing, metadata, description, slots = {}, nestedCollapsed, defaultNestedCollapsed = true, onNestedCollapsedChange, truncateTexts = false, innerClasses = {}, ref, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "button";
-  const isButton = Component === "button";
-  const componentName = props["data-jumpy-component"] || "list-item";
-  const resolvedLeading = slots.leading ?? leading;
-  const resolvedTrailing = slots.trailing ?? trailing;
-  const resolvedMetadata = slots.metadata ?? metadata;
-  const resolvedDescription = slots.description ?? description;
-  const resolvedSelector = slots.selector;
-  const resolvedNestedList = slots.nestedList;
-  const [internalNestedCollapsed, setInternalNestedCollapsed] = useState2(defaultNestedCollapsed);
-  const isNestedCollapsed = nestedCollapsed ?? internalNestedCollapsed;
-  const hasNestedList = Boolean(resolvedNestedList);
-  const isDisabled = disabled || readOnly;
-  const bodyMedium = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  const bodySmall = textStyleValue(theme, JumpyTextStyle.bodySmall);
-  const iconSize = sizeValue(theme, JumpySize.small2XS);
-  const handleExpandedChange = () => {
-    const nextCollapsed = !isNestedCollapsed;
-    if (nestedCollapsed === void 0) setInternalNestedCollapsed(nextCollapsed);
-    onNestedCollapsedChange?.(nextCollapsed);
-  };
-  const handleClick = (event) => {
-    if (isDisabled) return;
-    if (hasNestedList) handleExpandedChange();
-    props.onClick?.(event);
-  };
-  const handleKeyDown = (event) => {
-    if ((event.key === KeyboardKeys.ENTER || event.key === KeyboardKeys.SPACE) && hasNestedList && !isDisabled) {
-      event.preventDefault();
-      handleExpandedChange();
-    }
-    props.onKeyDown?.(event);
-  };
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      ref,
-      type: isButton ? props.type || "button" : props.type,
-      disabled: isButton ? disabled : void 0,
-      "aria-disabled": !isButton && isDisabled ? true : void 0,
-      "aria-current": selected ? props["aria-current"] || "true" : props["aria-current"],
-      "aria-selected": props.role === "option" || props.role === "treeitem" ? selected : props["aria-selected"],
-      "aria-expanded": hasNestedList ? !isNestedCollapsed : props["aria-expanded"],
-      onClick: handleClick,
-      onKeyDown: handleKeyDown,
-      "data-jumpy-component": componentName,
-      "data-selected": selected ? "true" : "false",
-      "data-disabled": disabled ? "true" : "false",
-      "data-readonly": readOnly ? "true" : "false",
-      "data-focused-view": focusedView ? "true" : void 0,
-      role: props.role || "listitem",
-      className: cn("text-left", className),
-      style: {
-        ...getListItemStateStyles(theme, selected),
-        display: "grid",
-        textAlign: "start",
-        gridTemplateColumns: `${resolvedSelector ? "min-content " : ""}${resolvedLeading ? "min-content " : ""}minmax(0, 1fr) ${resolvedMetadata ? "minmax(0, min-content) " : ""}${resolvedTrailing || hasNestedList ? "min-content" : ""}`,
-        gridTemplateRows: resolvedDescription ? "auto auto" : "auto",
-        alignItems: "center",
-        gap: spacingValue(theme, JumpySpacing.large),
-        width: "100%",
-        minHeight: sizeValue(theme, JumpySize.large) + spacingValue(theme, JumpySpacing.large),
-        boxSizing: "border-box",
-        padding: `${spacingValue(theme, JumpySpacing.medium)}px ${spacingValue(theme, JumpySpacing.large)}px`,
-        border: 0,
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        backgroundColor: componentName === "side-menu-item" ? "var(--jumpy-list-item-surface, var(--jumpy-list-item-default-surface))" : "transparent",
-        color: "var(--jumpy-list-item-color, var(--jumpy-list-item-default-text))",
-        cursor: disabled ? "not-allowed" : readOnly ? "default" : "pointer",
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: bodyMedium.fontSize,
-        lineHeight: bodyMedium.lineHeight,
-        fontWeight: bodyMedium.fontWeight,
-        opacity: disabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid),
-        pointerEvents: readOnly ? "none" : void 0,
-        position: "relative",
-        zIndex: 1,
-        ...props.style || {}
-      },
-      children: [
-        resolvedSelector ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "selector", "aria-hidden": props.role === "option" || props.role === "treeitem" ? "true" : void 0, className: innerClasses.selector?.className, style: { display: "inline-flex", pointerEvents: "none", color: "var(--jumpy-list-item-icon-color, var(--jumpy-list-item-default-icon))", ...innerClasses.selector?.style || {} }, children: resolvedSelector }) : null,
-        resolvedLeading ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "leading", "aria-hidden": "true", className: innerClasses.leading?.className, style: { display: "inline-flex", alignItems: "center", justifyContent: "center", flexShrink: 0, width: iconSize, height: iconSize, color: "var(--jumpy-list-item-icon-color, var(--jumpy-list-item-default-icon))", ...innerClasses.leading?.style || {} }, children: resolvedLeading }) : null,
-        /* @__PURE__ */ jsxs2("span", { style: { display: "grid", minWidth: 0 }, children: [
-          /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "label", "data-truncate": truncateTexts ? "true" : void 0, "data-text": typeof children === "string" ? children : void 0, className: innerClasses.label?.className, style: { minWidth: 0, maxWidth: "100%", overflowWrap: "anywhere", wordBreak: "break-word", fontWeight: bodyMedium.fontWeight, ...innerClasses.label?.style || {} }, children }),
-          resolvedDescription ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "description", className: innerClasses.description?.className, style: { color: selected ? theme.listItem.active.default.subtext : theme.listItem.inactive.default.subtext, fontSize: bodySmall.fontSize, lineHeight: bodySmall.lineHeight, ...innerClasses.description?.style || {} }, children: resolvedDescription }) : null
-        ] }),
-        resolvedMetadata ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "metadata", className: innerClasses.metadata?.className, style: { color: selected ? theme.listItem.active.default.subtext : theme.listItem.inactive.default.subtext, whiteSpace: "nowrap", fontSize: bodySmall.fontSize, lineHeight: bodySmall.lineHeight, ...innerClasses.metadata?.style || {} }, children: resolvedMetadata }) : null,
-        resolvedTrailing || hasNestedList ? /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "trailing", "aria-hidden": "true", className: innerClasses.trailing?.className, style: { display: "inline-flex", color: "var(--jumpy-list-item-icon-color, var(--jumpy-list-item-default-icon))", ...innerClasses.trailing?.style || {} }, children: [
-          resolvedTrailing,
-          hasNestedList ? /* @__PURE__ */ jsx2(JumpIconButton, { as: "span", variant: "secondary", alternateHover: true, tabIndex: -1, "aria-hidden": "true", children: isNestedCollapsed ? /* @__PURE__ */ jsx2(ChevronDownIcon, {}) : /* @__PURE__ */ jsx2(ChevronUpIcon, {}) }) : null
-        ] }) : null,
-        hasNestedList ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "nested-list", "aria-hidden": isNestedCollapsed ? "true" : void 0, style: { gridColumn: "1 / -1", display: isNestedCollapsed ? "none" : "block" }, children: resolvedNestedList }) : null
-      ]
-    }
-  );
-}
-function JumpSideMenu({ as, children, className = "", collapsed = false, selected, disabled = false, disableKeyboardNavigation = false, renderMode, getItemProps, onChange, onKeyDown, onTransitionEnd, ...props }) {
-  const Component = as || "ul";
-  const theme = useJumpyTheme();
-  const elementRef = useRef2(null);
-  const itemRefs = useRef2([]);
-  const previousCollapsed = useRef2(collapsed);
-  const releaseTimer = useRef2(void 0);
-  const [isResizing, setIsResizing] = useState2(false);
-  useLayoutEffect2(() => {
-    if (previousCollapsed.current === collapsed) return void 0;
-    previousCollapsed.current = collapsed;
-    const element = elementRef.current;
-    if (!element) return void 0;
-    const transitionMs = getWidthTransitionMs(element);
-    if (!transitionMs) return void 0;
-    setIsResizing(true);
-    window.clearTimeout(releaseTimer.current);
-    releaseTimer.current = window.setTimeout(() => setIsResizing(false), transitionMs + 100);
-    return void 0;
-  }, [collapsed]);
-  useEffect2(() => () => window.clearTimeout(releaseTimer.current), []);
-  const selectItem = (value) => {
-    if (disabled || value === void 0) return;
-    onChange?.([value]);
-  };
-  const handleKeyDown = (event) => {
-    if (!disableKeyboardNavigation) {
-      if (event.key === KeyboardKeys.ARROW_DOWN || event.key === KeyboardKeys.ARROW_RIGHT) {
-        event.preventDefault();
-        focusSideMenuItem(itemRefs.current, 1);
-      } else if (event.key === KeyboardKeys.ARROW_UP || event.key === KeyboardKeys.ARROW_LEFT) {
-        event.preventDefault();
-        focusSideMenuItem(itemRefs.current, -1);
-      } else if (event.key === KeyboardKeys.HOME) {
-        event.preventDefault();
-        focusSideMenuItem(itemRefs.current, "first");
-      } else if (event.key === KeyboardKeys.END) {
-        event.preventDefault();
-        focusSideMenuItem(itemRefs.current, "last");
-      }
-    }
-    onKeyDown?.(event);
-  };
-  const handleTransitionEnd = (event) => {
-    onTransitionEnd?.(event);
-    if (event.target === event.currentTarget && event.propertyName === "width") {
-      window.clearTimeout(releaseTimer.current);
-      setIsResizing(false);
-    }
-  };
-  return /* @__PURE__ */ jsx2(JumpySideMenuContext.Provider, { value: { collapsed, disabled, selected, onSelect: selectItem, containerExpanded: isResizing || !collapsed, renderMode, getItemProps, disableKeyboardNavigation, itemRefs }, children: /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      ref: elementRef,
-      "data-jumpy-component": "side-menu",
-      "data-menu-collapsed": collapsed ? "true" : void 0,
-      "data-menu-resizing": isResizing || props["data-menu-resizing"] === "true" ? "true" : void 0,
-      "aria-disabled": disabled || void 0,
-      onKeyDown: handleKeyDown,
-      onTransitionEnd: handleTransitionEnd,
-      className: cn(className),
-      style: {
-        display: "block",
-        width: "fit-content",
-        height: "fit-content",
-        overflowX: "hidden",
-        overflowY: "auto",
-        margin: 0,
-        padding: 0,
-        listStyle: "none",
-        transition: `width ${animationDurationValue(theme, collapsed ? JumpyAnimationDuration.small2XS : JumpyAnimationDuration.smallXS)}s ${theme.animation.timeEasingDrift}`,
-        ...collapsed && !isResizing ? { minWidth: "min-content" } : {},
-        ...props.style || {}
-      },
-      children
-    }
-  ) });
-}
-function JumpSideMenuItem({ as, children, value, selected = false, disabled = false, className = "", icon, badge, collapsed, slots, metadata, description, nestedMenu, nestedCollapsed, defaultNestedCollapsed = false, onNestedCollapsedChange, renderMode, focusedView, truncateTexts = false, tooltipProps, innerClasses = {}, wrapperProps = {}, expanderIconProps = {}, onClick, onKeyDown, ...props }) {
-  const theme = useJumpyTheme();
-  const sideMenu = useContext(JumpySideMenuContext);
-  const itemRef = useRef2(null);
-  const wrapperItemRef = useRef2(null);
-  const isCollapsed = sideMenu ? !sideMenu.containerExpanded : collapsed ?? false;
-  const resolvedRenderMode = sideMenu?.renderMode ?? renderMode ?? "navigation";
-  const selectedValues = sideMenu?.selected;
-  const resolvedNestedMenu = slots?.nestedMenu ?? nestedMenu;
-  const resolvedMetadata = slots?.metadata ?? metadata;
-  const isSelected = isValueSelected(selectedValues, value) || selected;
-  const isDisabled = disabled || sideMenu?.disabled;
-  const resolvedTabIndex = focusedView ? 0 : sideMenu && !sideMenu.disableKeyboardNavigation && Array.isArray(selectedValues) ? isSelected ? 0 : -1 : props.tabIndex;
-  const hasNested = Boolean(resolvedNestedMenu);
-  const hasSelectedChildren = hasSelectedNestedItem(resolvedNestedMenu, selectedValues);
-  const [internalNestedCollapsed, setInternalNestedCollapsed] = useState2(defaultNestedCollapsed);
-  const isNestedCollapsed = nestedCollapsed ?? internalNestedCollapsed;
-  const iconNode = typeof icon === "function" ? icon({ selected: isSelected }) : icon;
-  const badgeNode = typeof badge === "function" ? badge({ selected: isSelected, collapsed: isCollapsed }) : badge;
-  const handleItemClick = (event) => {
-    if (isDisabled) return;
-    if (hasNested) {
-      const nextCollapsed = !isNestedCollapsed;
-      onNestedCollapsedChange?.(nextCollapsed);
-      if (nestedCollapsed === void 0) setInternalNestedCollapsed(nextCollapsed);
-    } else {
-      sideMenu?.onSelect?.(value);
-    }
-    onClick?.(event);
-  };
-  const handleItemKeyDown = (event) => {
-    if ((event.key === KeyboardKeys.ENTER || event.key === KeyboardKeys.SPACE) && !isDisabled) {
-      event.preventDefault();
-      handleItemClick(event);
-    }
-    onKeyDown?.(event);
-  };
-  const itemInteractionProps = sideMenu?.getItemProps?.({ onClick: handleItemClick, onKeyDown: handleItemKeyDown }) ?? {};
-  const { onClick: interactionOnClick, onKeyDown: interactionOnKeyDown, ...restItemInteractionProps } = itemInteractionProps;
-  const { wrapperProps: splitWrapperProps, linkProps } = resolvedRenderMode === "navigation" ? splitNavigationItemProps(props) : { wrapperProps: {}, linkProps: props };
-  useEffect2(() => {
-    if (!sideMenu?.itemRefs) return void 0;
-    const registryItem = isCollapsed && resolvedRenderMode === "navigation" ? wrapperItemRef : itemRef;
-    sideMenu.itemRefs.current.push(registryItem);
-    return () => {
-      sideMenu.itemRefs.current = sideMenu.itemRefs.current.filter((item) => item !== registryItem);
-    };
-  }, [isCollapsed, resolvedRenderMode, sideMenu?.itemRefs]);
-  const withTooltip = (node) => {
-    if (!tooltipProps?.content) return node;
-    const { content, ...restTooltipProps } = tooltipProps;
-    return /* @__PURE__ */ jsx2(JumpTooltip, { ...restTooltipProps, content, children: node });
-  };
-  const trailingNode = hasNested ? /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "expander", "aria-hidden": "true", className: innerClasses.expander?.className, style: { display: "inline-flex", alignItems: "center", gap: spacingValue(theme, JumpySpacing.small), ...innerClasses.expander?.style || {} }, children: [
-    badgeNode,
-    /* @__PURE__ */ jsx2("span", { ...expanderIconProps, "data-jumpy-slot": "expander-icon", className: cn(innerClasses.expanderIcon?.className, expanderIconProps.className), style: { display: "inline-flex", transform: isNestedCollapsed ? "rotate(0deg)" : "rotate(180deg)", transition: `transform ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${theme.animation.timeEasingDrift}`, ...innerClasses.expanderIcon?.style || {}, ...expanderIconProps.style || {} }, children: /* @__PURE__ */ jsx2(ChevronDownIcon, {}) })
-  ] }) : badgeNode;
-  if (isCollapsed) {
-    const Component = as || (resolvedRenderMode === "navigation" ? "a" : "button");
-    const isButton = Component === "button";
-    const tokens = isSelected ? theme.listItem.active.default : theme.listItem.inactive.default;
-    const labelStyle = textStyleValue(theme, isSelected ? JumpyTextStyle.labelMediumEmphasized : JumpyTextStyle.labelMedium);
-    const collapsedWrapperInteractiveProps = resolvedRenderMode === "navigation" ? {
-      ref: wrapperItemRef,
-      tabIndex: resolvedTabIndex,
-      onClick: (event) => {
-        splitWrapperProps.onClick?.(event);
-        wrapperProps.onClick?.(event);
-        if (!event.defaultPrevented && event.target === event.currentTarget) itemRef.current?.click();
-      },
-      onKeyDown: (event) => {
-        splitWrapperProps.onKeyDown?.(event);
-        wrapperProps.onKeyDown?.(event);
-        if (!event.defaultPrevented && (event.key === KeyboardKeys.ENTER || event.key === KeyboardKeys.SPACE)) {
-          event.preventDefault();
-          itemRef.current?.click();
-        }
-      }
-    } : {};
-    return /* @__PURE__ */ jsxs2("li", { ...splitWrapperProps, ...wrapperProps, ...collapsedWrapperInteractiveProps, "data-jumpy-component": "side-menu-item-wrapper", "aria-expanded": hasNested ? !isNestedCollapsed : void 0, className: cn(innerClasses.selector?.className, splitWrapperProps.className, wrapperProps.className), style: { display: "block", margin: 0, padding: 0, ...splitWrapperProps.style || {}, ...innerClasses.selector?.style || {}, ...wrapperProps.style || {} }, children: [
-      withTooltip(
-        /* @__PURE__ */ jsxs2(
-          Component,
-          {
-            ...linkProps,
-            ref: itemRef,
-            ...restItemInteractionProps,
-            onClick: interactionOnClick ?? handleItemClick,
-            onKeyDown: interactionOnKeyDown ?? handleItemKeyDown,
-            type: isButton ? linkProps.type || "button" : linkProps.type,
-            disabled: isButton ? isDisabled : void 0,
-            "aria-disabled": !isButton && isDisabled ? true : void 0,
-            "aria-current": isSelected ? linkProps["aria-current"] || "page" : linkProps["aria-current"],
-            role: !isButton && !linkProps.href ? linkProps.role || "link" : linkProps.role,
-            tabIndex: resolvedRenderMode === "navigation" ? -1 : resolvedTabIndex,
-            "data-jumpy-component": "side-menu-item",
-            "data-collapsed": "true",
-            "data-selected": isSelected ? "true" : "false",
-            "data-disabled": isDisabled ? "true" : "false",
-            "data-value": !hasNested ? value : void 0,
-            "data-has-selected-children": hasSelectedChildren ? "true" : void 0,
-            "data-focused-view": focusedView ? "true" : void 0,
-            className: cn(className, innerClasses.collapsedLabel?.className),
-            style: {
-              position: "relative",
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "center",
-              width: "100%",
-              minWidth: sizeValue(theme, JumpySize.large8XL) - spacingValue(theme, JumpySpacing.large3XL),
-              boxSizing: "border-box",
-              border: 0,
-              borderRadius: 0,
-              backgroundColor: "transparent",
-              color: tokens.text,
-              cursor: isDisabled ? "not-allowed" : "pointer",
-              padding: `${spacingValue(theme, JumpySpacing.smallXS)}px 0`,
-              opacity: isDisabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid),
-              ...linkProps.style || {}
-            },
-            children: [
-              /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "side-menu-decorator", className: innerClasses.decoratorContainer?.className, style: { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", padding: `${spacingValue(theme, JumpySpacing.smallXS)}px ${spacingValue(theme, JumpySpacing.large2XL)}px ${spacingValue(theme, JumpySpacing.small3XS)}px`, color: tokens.icon, ...innerClasses.decoratorContainer?.style || {} }, children: [
-                iconNode,
-                badgeNode ? /* @__PURE__ */ jsx2("span", { style: { position: "absolute", top: 0, right: spacingValue(theme, JumpySpacing.large), display: "inline-flex" }, children: badgeNode }) : null
-              ] }),
-              children ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "label", "data-text": typeof children === "string" ? children : void 0, className: innerClasses.label?.className, style: { boxSizing: "border-box", paddingInline: spacingValue(theme, JumpySpacing.large), overflowWrap: "anywhere", textAlign: "center", fontFamily: theme.fontFamily.familyBase, fontSize: labelStyle.fontSize, lineHeight: labelStyle.lineHeight, fontWeight: labelStyle.fontWeight, ...truncateTexts ? { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", maxWidth: "100%" } : {}, ...innerClasses.label?.style || {} }, children }) : null
-            ]
-          }
-        )
-      ),
-      hasNested && !isNestedCollapsed ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "nested-menu", children: resolvedNestedMenu }) : null
-    ] });
-  }
-  const expandedItem = /* @__PURE__ */ jsx2(
-    JumpListItem,
-    {
-      ...linkProps,
-      ref: itemRef,
-      ...restItemInteractionProps,
-      as: as || (resolvedRenderMode === "navigation" ? "a" : "li"),
-      onClick: interactionOnClick ?? handleItemClick,
-      onKeyDown: interactionOnKeyDown ?? handleItemKeyDown,
-      selected: isSelected,
-      disabled: isDisabled,
-      leading: iconNode,
-      trailing: trailingNode,
-      metadata: resolvedMetadata,
-      description,
-      truncateTexts,
-      innerClasses,
-      "aria-expanded": hasNested ? !isNestedCollapsed : void 0,
-      role: linkProps.role || (resolvedRenderMode === "navigation" ? "link" : void 0),
-      tabIndex: resolvedTabIndex,
-      "data-jumpy-component": "side-menu-item",
-      "data-value": !hasNested ? value : void 0,
-      "data-has-selected-children": hasSelectedChildren ? "true" : void 0,
-      "data-focused-view": focusedView ? "true" : void 0,
-      className: cn(className, innerClasses.selector?.className),
-      style: {
-        "--jumpy-side-menu-item-indicator-scale": isSelected ? 1 : 0.5,
-        paddingLeft: spacingValue(theme, JumpySpacing.large2XL),
-        paddingRight: spacingValue(theme, JumpySpacing.large2XL),
-        paddingTop: spacingValue(theme, JumpySpacing.large),
-        paddingBottom: spacingValue(theme, JumpySpacing.large),
-        ...truncateTexts ? { overflow: "hidden" } : {},
-        ...innerClasses.selector?.style || {},
-        ...linkProps.style || {}
-      },
-      children
-    }
-  );
-  const expandedNestedMenu = hasNested && !isNestedCollapsed ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "nested-menu", children: resolvedNestedMenu }) : null;
-  if (resolvedRenderMode === "navigation") {
-    return withTooltip(
-      /* @__PURE__ */ jsxs2("li", { ...splitWrapperProps, ...wrapperProps, "data-jumpy-component": "side-menu-item-wrapper", "aria-expanded": hasNested ? !isNestedCollapsed : void 0, className: cn(splitWrapperProps.className, wrapperProps.className), style: { display: "block", margin: 0, padding: 0, ...splitWrapperProps.style || {}, ...wrapperProps.style || {} }, children: [
-        withTooltip(expandedItem),
-        expandedNestedMenu
-      ] })
-    );
-  }
-  return withTooltip(
-    /* @__PURE__ */ jsxs2(Fragment, { children: [
-      expandedItem,
-      expandedNestedMenu
-    ] })
-  );
-}
-function JumpTypography({ as, variant = "bodyMedium", color = "primary", className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "p";
-  const colorValue = color === "secondary" ? theme.color.textSecondary : color === "primary" ? theme.color.textPrimary : color;
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "typography",
-      className: cn(className),
-      style: {
-        ...getTypographyStyle(theme, variant),
-        color: colorValue,
-        margin: 0,
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpHyperlink({ as, variant = "inline", disabled = false, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "a";
-  if (variant !== "inline") {
-    return /* @__PURE__ */ jsx2(JumpLinkButton, { ...props, href: props.href || "#", variant: "borderless", className, children });
-  }
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "hyperlink",
-      "aria-disabled": disabled || void 0,
-      tabIndex: disabled ? -1 : props.tabIndex,
-      className: cn(className),
-      style: {
-        display: "inline",
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        backgroundColor: "transparent",
-        color: disabled ? theme.actions.tertiary.regular.disabled.text : theme.actions.tertiary.regular.default.text,
-        font: "inherit",
-        textDecoration: "none",
-        cursor: disabled ? "default" : "pointer",
-        pointerEvents: disabled ? "none" : void 0,
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpDivider({ as, direction = "horizontal", captionPosition = "center", className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  const isVertical = direction === "vertical";
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "divider",
-      role: "separator",
-      "aria-orientation": direction,
-      "aria-label": children ? String(children) : props["aria-label"],
-      className: cn(className),
-      style: {
-        display: isVertical ? "inline-flex" : "flex",
-        alignItems: "center",
-        justifyContent: captionPosition === "start" ? "flex-start" : captionPosition === "end" ? "flex-end" : "center",
-        alignSelf: isVertical ? "stretch" : void 0,
-        width: isVertical ? borderWidthValue(theme, JumpyBorderWidth.small) : "100%",
-        minHeight: isVertical ? sizeValue(theme, JumpySize.large) : void 0,
-        border: 0,
-        borderTop: isVertical ? 0 : `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}`,
-        borderLeft: isVertical ? `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}` : 0,
-        color: theme.color.textSecondary,
-        ...props.style || {}
-      },
-      children: children ? /* @__PURE__ */ jsx2("span", { style: { backgroundColor: theme.color.surfaceCard, padding: `0 ${spacingValue(theme, JumpySpacing.smallXS)}px`, transform: isVertical ? "rotate(-90deg)" : void 0 }, children }) : null
-    }
-  );
-}
-function JumpAvatar({ as, size: size2 = "medium", disableInteraction = false, disabled = false, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || (disableInteraction ? "span" : "button");
-  const isButton = Component === "button";
-  const sizes = { small: JumpySize.large, medium: JumpySize.large2XL, large: JumpySize.large4XL };
-  const avatarSize = sizeValue(theme, sizes[size2] || JumpySize.large2XL);
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      type: isButton ? props.type || "button" : props.type,
-      disabled: isButton ? disabled : void 0,
-      "aria-disabled": !isButton && disabled ? true : void 0,
-      "data-jumpy-component": "avatar",
-      className: cn(className),
-      style: {
-        display: "inline-grid",
-        placeItems: "center",
-        width: avatarSize,
-        height: avatarSize,
-        borderRadius: radiusValue(theme, JumpyRadius.full),
-        border: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}`,
-        backgroundColor: theme.color.infoSurface,
-        color: theme.color.surfacePrimary,
-        fontFamily: theme.fontFamily.familyBase,
-        fontWeight: theme.fontFamily.bodyMediumEmphasized.fontWeight,
-        opacity: disabled ? opacityValue(theme, JumpyOpacity.medium) : opacityValue(theme, JumpyOpacity.solid),
-        cursor: disableInteraction || disabled ? "default" : "pointer",
-        overflow: "hidden",
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpBanner({ as, status: statusProp = "other", variant = "default", direction = "horizontal", hideStatus = false, floating = false, title, actions, slots, innerClasses = {}, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  const status = variant === "inline" && statusProp === "other" ? "info" : statusProp;
-  const statusTone = getBannerStatusStyles(theme, status);
-  const urgent = status === "alarm";
-  const bannerTitle = slots?.title ?? title;
-  const bannerActions = slots?.actions ?? actions;
-  const bannerIcon = slots?.icon;
-  const contentContainerVertical = direction === "vertical";
-  const contentTitle = textStyleValue(theme, JumpyTextStyle.titleMediumEmphasized);
-  const contentDescription = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "banner",
-      "data-variant": variant,
-      "data-status": status,
-      "data-floating": floating ? "true" : "false",
-      role: urgent ? "alert" : "status",
-      "aria-live": urgent ? "assertive" : "polite",
-      className: cn(className),
-      style: {
-        "--jumpy-banner-status-icon": statusTone.indicator,
-        "--jumpy-banner-status-surface": statusTone.indicatorSurface,
-        "--jumpy-banner-inline-surface": statusTone.inlineSurface,
-        ...props.style || {}
-      },
-      children: [
-        !hideStatus ? /* @__PURE__ */ jsx2(
-          "span",
-          {
-            "data-jumpy-slot": "banner-status",
-            className: innerClasses.status?.className,
-            "aria-hidden": "true",
-            style: {
-              ...innerClasses.status?.style || {}
-            },
-            children: /* @__PURE__ */ jsx2(JumpSeverityIcon, { status, icon: bannerIcon })
-          }
-        ) : null,
-        /* @__PURE__ */ jsxs2(
-          "div",
-          {
-            "data-jumpy-slot": "banner-content-container",
-            "data-direction": direction,
-            className: innerClasses.contentContainer?.className,
-            style: {
-              ...innerClasses.contentContainer?.style || {}
-            },
-            children: [
-              /* @__PURE__ */ jsxs2(
-                "div",
-                {
-                  "data-jumpy-slot": "banner-content",
-                  className: innerClasses.content?.className,
-                  style: {
-                    ...innerClasses.content?.style || {}
-                  },
-                  children: [
-                    renderBannerSlot(bannerTitle, "span", innerClasses.contentTitle?.className, {
-                      margin: 0,
-                      fontFamily: theme.fontFamily.familyBase,
-                      fontSize: contentTitle.fontSize,
-                      lineHeight: contentTitle.lineHeight,
-                      fontWeight: contentTitle.fontWeight,
-                      letterSpacing: contentTitle.letterSpacing,
-                      color: "inherit",
-                      ...innerClasses.contentTitle?.style || {}
-                    }),
-                    renderBannerSlot(children, "p", innerClasses.contentDescription?.className, {
-                      margin: 0,
-                      fontFamily: theme.fontFamily.familyBase,
-                      fontSize: contentDescription.fontSize,
-                      lineHeight: contentDescription.lineHeight,
-                      fontWeight: contentDescription.fontWeight,
-                      letterSpacing: contentDescription.letterSpacing,
-                      color: "inherit",
-                      ...innerClasses.contentDescription?.style || {}
-                    })
-                  ]
-                }
-              ),
-              contentContainerVertical && bannerActions ? /* @__PURE__ */ jsx2(
-                "div",
-                {
-                  "data-jumpy-slot": "banner-actions-container",
-                  className: innerClasses.actionsContainer?.className,
-                  style: {
-                    ...innerClasses.actionsContainer?.style || {}
-                  },
-                  children: bannerActions
-                }
-              ) : bannerActions
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
-function JumpSkeletonLoader({ as, variant = "text", lines = 1, width, height, disableAnimation = false, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  if (children) return children;
-  const defaultHeight = variant === "text" ? theme.fontFamily.bodyMedium.fontSize * theme.fontFamily.bodyMedium.lineHeight : variant === "icon" || variant === "avatar" ? sizeValue(theme, JumpySize.large) : sizeValue(theme, JumpySize.large2XL);
-  const radius = variant === "avatar" ? radiusValue(theme, JumpyRadius.full) : radiusValue(theme, JumpyRadius.small);
-  const items = Array.from({ length: variant === "text" ? lines : 1 });
-  return /* @__PURE__ */ jsx2("div", { "data-jumpy-component": "skeleton-loader-group", className: cn(className), style: { display: "grid", gap: spacingValue(theme, JumpySpacing.smallXS), width: width || "100%", ...props.style || {} }, children: items.map((_, index) => /* @__PURE__ */ jsx2(
-    Component,
-    {
-      "aria-hidden": "true",
-      "data-jumpy-component": "skeleton-loader",
-      style: {
-        width: index === items.length - 1 && items.length > 1 ? "72%" : width || "100%",
-        height: height || defaultHeight,
-        borderRadius: radius,
-        backgroundColor: theme.color.borderSubtle,
-        opacity: disableAnimation ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.medium)
-      }
-    },
-    `skeleton-${lines}-${index}`
-  )) });
-}
-var JumpSearchField = forwardRef(function JumpSearchField2({ label = "Search", placeholder = "Search", className = "", ...props }, ref) {
-  const ariaLabelledBy = props["aria-labelledby"];
-  const ariaLabel = ariaLabelledBy ? void 0 : props["aria-label"] || label || placeholder;
-  return /* @__PURE__ */ jsx2(JumpBaseInput, { className: cn("jumpy-search-field", className), leading: /* @__PURE__ */ jsx2("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "currentColor", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ jsx2("path", { d: "M16.071 14.5q1.509-1.95 1.508-4.5c0-4.1-3.418-7.5-7.54-7.5C5.919 2.5 2.5 5.9 2.5 10s3.418 7.5 7.54 7.5c1.709 0 3.317-.6 4.524-1.5l5.529 5.5 1.407-1.4zm-6.031 1c-3.016 0-5.53-2.5-5.53-5.5s2.515-5.5 5.53-5.5S15.569 7 15.569 10s-2.513 5.5-5.53 5.5z" }) }), children: /* @__PURE__ */ jsx2(JumpInput, { ...props, ref, type: "search", placeholder, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy }) });
-});
-function JumpTooltip({ content, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const [visible, setVisible] = useState2(false);
-  return /* @__PURE__ */ jsxs2("span", { ...props, "data-jumpy-component": "tooltip", className: cn(className), style: { position: "relative", display: "inline-flex", ...props.style || {} }, onMouseEnter: () => setVisible(true), onMouseLeave: () => setVisible(false), onFocus: () => setVisible(true), onBlur: () => setVisible(false), children: [
-    children,
-    visible ? /* @__PURE__ */ jsx2("span", { role: "tooltip", style: { position: "absolute", left: "50%", bottom: `calc(100% + ${spacingValue(theme, JumpySpacing.smallXS)}px)`, transform: "translateX(-50%)", zIndex: 30, width: "max-content", maxWidth: 240, borderRadius: radiusValue(theme, JumpyRadius.small), backgroundColor: theme.color.textPrimary, color: theme.color.surfaceCard, padding: `${spacingValue(theme, JumpySpacing.small3XS)}px ${spacingValue(theme, JumpySpacing.smallXS)}px`, boxShadow: theme.shadow.positiveSmall, fontSize: theme.fontFamily.bodySmall.fontSize, lineHeight: theme.fontFamily.bodySmall.lineHeight }, children: content }) : null
-  ] });
-}
-function JumpPopover({ open, defaultOpen = false, onOpenChange, trigger, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const [internalOpen, setInternalOpen] = useState2(defaultOpen);
-  const visible = open ?? internalOpen;
-  const setVisible = (next) => {
-    setInternalOpen(next);
-    onOpenChange?.(next);
-  };
-  return /* @__PURE__ */ jsxs2("span", { "data-jumpy-component": "popover-root", className: cn(className), style: { position: "relative", display: "inline-flex", ...props.style || {} }, children: [
-    /* @__PURE__ */ jsx2("span", { onClick: () => setVisible(!visible), children: trigger }),
-    visible ? /* @__PURE__ */ jsx2("div", { role: "dialog", "data-jumpy-component": "popover", style: { position: "absolute", top: `calc(100% + ${spacingValue(theme, JumpySpacing.smallXS)}px)`, left: 0, zIndex: 30, minWidth: 220, borderRadius: radiusValue(theme, JumpyRadius.large), border: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}`, backgroundColor: theme.color.surfaceCard, color: theme.color.textPrimary, boxShadow: theme.shadow.positiveMedium, padding: spacingValue(theme, JumpySpacing.large) }, children }) : null
-  ] });
-}
-function JumpMenu({ trigger, triggerProps = {}, open, defaultOpen = false, onOpenChange, header, footer, children, className = "", placement = "bottom-start", closeOnSelect = true, ...props }) {
-  const theme = useJumpyTheme();
-  const [internalOpen, setInternalOpen] = useState2(defaultOpen);
-  const isOpen = open ?? internalOpen;
-  const menuRef = useRef2(null);
-  const insideEventRef = useRef2(null);
-  const menuOffset = spacingValue(theme, JumpySpacing.small3XS);
-  const menuPadding = spacingValue(theme, JumpySpacing.medium);
-  const menuMinWidth = sizeValue(theme, JumpySize.large8XL);
-  const { refs, floatingStyles } = useFloating({
-    open: isOpen,
-    onOpenChange: setOpen,
-    placement,
-    strategy: "fixed",
-    whileElementsMounted: autoUpdate,
-    middleware: [
-      offset(menuOffset),
-      flip({ padding: menuPadding }),
-      size({
-        padding: menuPadding,
-        apply({ rects, availableHeight, elements }) {
-          Object.assign(elements.floating.style, {
-            minWidth: `${Math.max(menuMinWidth, rects.reference.width)}px`,
-            maxHeight: `${Math.max(sizeValue(theme, JumpySize.large2XL), availableHeight)}px`
-          });
-        }
-      })
-    ]
-  });
-  function setOpen(next) {
-    setInternalOpen(next);
-    onOpenChange?.(next);
-  }
-  function getMenuItems() {
-    return Array.from(menuRef.current?.querySelectorAll('[role="menuitem"]') || []).filter((item) => item.getAttribute("aria-disabled") !== "true" && !item.disabled);
-  }
-  function focusMenuItem(direction) {
-    const menuItems = getMenuItems();
-    if (menuItems.length === 0) return;
-    const activeIndex = menuItems.indexOf(document.activeElement);
-    const nextIndex = direction === "first" ? 0 : direction === "last" ? menuItems.length - 1 : (activeIndex + direction + menuItems.length) % menuItems.length;
-    menuItems[nextIndex]?.focus();
-  }
-  function openAndFocusFirst() {
-    setOpen(true);
-    window.requestAnimationFrame(() => focusMenuItem("first"));
-  }
-  function handleTriggerKeyDown(event) {
-    if (event.key === KeyboardKeys.ARROW_DOWN || event.key === KeyboardKeys.ENTER || event.key === KeyboardKeys.SPACE) {
-      event.preventDefault();
-      openAndFocusFirst();
-    }
-    if (event.key === KeyboardKeys.ARROW_UP) {
-      event.preventDefault();
-      setOpen(true);
-      window.requestAnimationFrame(() => focusMenuItem("last"));
-    }
-  }
-  function handleMenuKeyDown(event) {
-    if (event.key === KeyboardKeys.ESCAPE) {
-      event.preventDefault();
-      setOpen(false);
-      refs.reference.current?.focus?.();
-    }
-    if (event.key === KeyboardKeys.ARROW_DOWN) {
-      event.preventDefault();
-      focusMenuItem(1);
-    }
-    if (event.key === KeyboardKeys.ARROW_UP) {
-      event.preventDefault();
-      focusMenuItem(-1);
-    }
-    if (event.key === KeyboardKeys.HOME) {
-      event.preventDefault();
-      focusMenuItem("first");
-    }
-    if (event.key === KeyboardKeys.END) {
-      event.preventDefault();
-      focusMenuItem("last");
-    }
-    props.onKeyDown?.(event);
-  }
-  useEffect2(() => {
-    if (!isOpen) return void 0;
-    function dismissOutside(event) {
-      if (insideEventRef.current !== event) setOpen(false);
-    }
-    document.addEventListener("pointerdown", dismissOutside);
-    document.addEventListener("focusin", dismissOutside);
-    return () => {
-      document.removeEventListener("pointerdown", dismissOutside);
-      document.removeEventListener("focusin", dismissOutside);
-    };
-  });
-  function markInteractionInside(event) {
-    insideEventRef.current = event.nativeEvent;
-  }
-  function handleMenuClick(event) {
-    props.onClick?.(event);
-    if (!closeOnSelect || event.defaultPrevented) return;
-    const item = event.target.closest?.('[role="menuitem"], [role="menuitemradio"], [role="menuitemcheckbox"]');
-    if (!item || item.disabled || item.getAttribute("aria-disabled") === "true" || item.closest("[aria-haspopup]")) return;
-    setOpen(false);
-    refs.domReference.current?.focus?.();
-  }
-  return /* @__PURE__ */ jsxs2("span", { "data-jumpy-component": "menu-root", className: cn(className), onPointerDown: markInteractionInside, onFocus: markInteractionInside, style: { display: "inline-flex", ...props.style || {} }, children: [
-    /* @__PURE__ */ jsx2("span", { ...triggerProps, ref: refs.setReference, "aria-haspopup": "menu", "aria-expanded": isOpen, tabIndex: 0, onClick: () => setOpen(!isOpen), onKeyDown: handleTriggerKeyDown, children: trigger }),
-    isOpen ? /* @__PURE__ */ jsx2(JumpyPortal, { children: /* @__PURE__ */ jsxs2(
-      "div",
-      {
-        ...props,
-        ref: (node) => {
-          refs.setFloating(node);
-          menuRef.current = node;
-        },
-        "data-jumpy-component": "menu",
-        role: "menu",
-        onClick: handleMenuClick,
-        onKeyDown: handleMenuKeyDown,
-        style: {
-          ...floatingStyles,
-          zIndex: JUMPY_POPUP_Z_INDEX,
-          maxWidth: "min(420px, calc(100vw - 32px))",
-          overflowY: "auto",
-          ...props.style || {}
-        },
-        children: [
-          header ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "menu-header", children: header }) : null,
-          children,
-          footer ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "menu-footer", children: footer }) : null
-        ]
-      }
-    ) }) : null
-  ] });
-}
-function JumpMenuItem({ as, children, selected = false, disabled = false, readOnly = false, focusedView = false, leading, trailing, metadata, description, slots = {}, nestedMenu, onClick, ...props }) {
-  const Component = as || "button";
-  const resolvedSlots = {
-    ...slots,
-    leading: slots.leading ?? leading,
-    trailing: nestedMenu ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", children: "\u203A" }) : slots.trailing ?? trailing,
-    metadata: slots.metadata ?? metadata,
-    description: slots.description ?? description
-  };
-  return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    /* @__PURE__ */ jsx2(
-      JumpListItem,
-      {
-        ...props,
-        as: Component,
-        role: props.role || "menuitem",
-        selected,
-        disabled,
-        readOnly,
-        focusedView,
-        slots: resolvedSlots,
-        "data-jumpy-component": "menu-item",
-        onClick: (event) => {
-          if (disabled || readOnly) return;
-          onClick?.(event);
-        },
-        children
-      }
-    ),
-    nestedMenu || null
-  ] });
-}
-function JumpToggleButton({ as, selected, value, disabled = false, onChange, leading, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const group = useContext(JumpyToggleButtonGroupContext);
-  const Component = as || "button";
-  const isButton = Component === "button";
-  const isDisabled = disabled || group?.disabled || false;
-  const isSelected = group && value !== void 0 ? group.value.includes(value) : Boolean(selected);
-  const textStyle = textStyleValue(theme, JumpyTextStyle.bodyMediumEmphasized);
-  function handleClick(event) {
-    if (isDisabled) return;
-    if (group && value !== void 0) group.onChange(value);
-    onChange?.(!isSelected);
-    props.onClick?.(event);
-  }
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      type: isButton ? props.type || "button" : props.type,
-      disabled: isButton ? isDisabled : void 0,
-      "aria-disabled": !isButton && isDisabled ? true : void 0,
-      "aria-pressed": isSelected,
-      "data-jumpy-component": "toggle-button",
-      "data-selected": isSelected ? "true" : "false",
-      "data-disabled": isDisabled ? "true" : "false",
-      className: cn(className),
-      onClick: handleClick,
-      style: {
-        boxSizing: "border-box",
-        position: "relative",
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        width: "fit-content",
-        height: sizeValue(theme, JumpySize.large),
-        gap: spacingValue(theme, JumpySpacing.small3XS),
-        padding: `${spacingValue(theme, JumpySpacing.smallXS)}px ${spacingValue(theme, JumpySpacing.large)}px`,
-        outline: "none",
-        border: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-cmp-toggle-button-border-color)`,
-        borderRadius: "var(--jumpy-cmp-toggle-button-border-radius)",
-        backgroundColor: "var(--jumpy-cmp-toggle-button-surface)",
-        color: "var(--jumpy-cmp-toggle-button-text)",
-        cursor: isDisabled ? "not-allowed" : "pointer",
-        userSelect: "none",
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: textStyle.fontSize,
-        lineHeight: textStyle.lineHeight,
-        fontWeight: textStyle.fontWeight,
-        opacity: isDisabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid),
-        ...props.style || {}
-      },
-      children: [
-        leading ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", style: { display: "inline-flex", color: "var(--jumpy-cmp-toggle-button-icon-fill)" }, children: typeof leading === "function" ? leading({ selected: isSelected }) : leading }) : null,
-        children ? /* @__PURE__ */ jsx2("span", { style: { display: "inline-flex", alignItems: "center", justifyContent: "center", margin: `0 ${spacingValue(theme, JumpySpacing.small3XS)}px`, whiteSpace: "nowrap" }, children }) : null
-      ]
-    }
-  );
-}
-function JumpToggleButtonGroup({ as, selected, defaultSelected = [], onChange, exclusive = false, disabled = false, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  const [internalSelected, setInternalSelected] = useState2(defaultSelected);
-  const currentSelected = selected ?? internalSelected;
-  function handleToggle(toggledValue) {
-    const nextSelected = currentSelected.includes(toggledValue) ? currentSelected.filter((item) => item !== toggledValue) : exclusive ? [toggledValue] : [...currentSelected, toggledValue];
-    setInternalSelected(nextSelected);
-    onChange?.(nextSelected);
-  }
-  return /* @__PURE__ */ jsx2(JumpyToggleButtonGroupContext.Provider, { value: { value: currentSelected, onChange: handleToggle, exclusive, disabled }, children: /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "toggle-button-group",
-      role: props.role || "toolbar",
-      className: cn(className),
-      style: { display: "inline-flex", flexDirection: "row", alignItems: "center", width: "fit-content", gap: spacingValue(theme, JumpySpacing.small3XS), flexWrap: "wrap", userSelect: "none", ...props.style || {} },
-      children
-    }
-  ) });
-}
-function JumpPinInput({ length = 6, value, defaultValue = "", onChange, onComplete, name, mask = false, type = "numeric", error = false, disabled = false, helperText, ariaLabels = {}, className = "", innerClasses = {}, ...props }) {
-  const theme = useJumpyTheme();
-  const normalizedLength = clampNumber(length, 4, 8);
-  const [internalValue, setInternalValue] = useState2(defaultValue);
-  const currentValue = String(value ?? internalValue).slice(0, normalizedLength);
-  const refs = useRef2([]);
-  const pattern = type === "alphanumeric" ? /^[a-z0-9]$/i : /^\d$/;
-  const helperId = helperText ? `${name || props.id || "jumpy-pin-input"}-helper` : void 0;
-  function commit(nextValue, focusIndex) {
-    const compact = nextValue.slice(0, normalizedLength);
-    setInternalValue(compact);
-    onChange?.(compact);
-    if (compact.length === normalizedLength) onComplete?.(compact);
-    if (focusIndex !== void 0) refs.current[clampNumber(focusIndex, 0, normalizedLength - 1)]?.focus();
-  }
-  function replaceAt(index, char) {
-    const cells = Array.from({ length: normalizedLength }, (_, cellIndex) => currentValue[cellIndex] || "");
-    cells[index] = char;
-    return cells.join("");
-  }
-  const supportingColor = disabled ? theme.color["jumpy-input-regular-disabled-supporting"] : error ? theme.color["jumpy-input-alarm-default-supporting"] : theme.color["jumpy-input-regular-default-supporting"];
-  const textStyle = textStyleValue(theme, JumpyTextStyle.bodyLarge);
-  return /* @__PURE__ */ jsxs2("fieldset", { ...props, disabled, "data-jumpy-component": "pin-input", className: cn(className), style: { display: "inline-flex", flexDirection: "column", alignItems: "flex-start", border: 0, margin: 0, padding: 0, ...props.style || {} }, children: [
-    name ? /* @__PURE__ */ jsx2("input", { type: "hidden", name, value: currentValue }) : null,
-    /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "pin-input-cells", className: cn(innerClasses.cells?.className), style: { display: "flex", gap: spacingValue(theme, JumpySpacing.small2XS), cursor: disabled ? "not-allowed" : "text", ...innerClasses.cells?.style || {} }, onClick: (event) => {
-      if (event.target === event.currentTarget) refs.current[Math.min(currentValue.length, normalizedLength - 1)]?.focus();
-    }, children: Array.from({ length: normalizedLength }, (_, index) => /* @__PURE__ */ jsx2(
-      "input",
-      {
-        ref: (node) => {
-          refs.current[index] = node;
-        },
-        type: mask ? "password" : "text",
-        inputMode: type === "alphanumeric" ? "text" : "numeric",
-        autoComplete: index === 0 ? "one-time-code" : "off",
-        autoCapitalize: "characters",
-        "aria-label": ariaLabels.cell ? ariaLabels.cell(index + 1, normalizedLength) : `PIN digit ${index + 1} of ${normalizedLength}`,
-        "aria-invalid": error || void 0,
-        "aria-describedby": helperId,
-        disabled,
-        "data-jumpy-slot": "pin-input-cell",
-        "data-status": error ? "alarm" : "regular",
-        "data-disabled": disabled ? "true" : "false",
-        maxLength: 1,
-        value: currentValue[index] || "",
-        onChange: (event) => {
-          const nextRaw = event.target.value.slice(-1);
-          if (!nextRaw) return;
-          if (!pattern.test(nextRaw)) return;
-          commit(replaceAt(index, nextRaw.toUpperCase()), index + 1);
-        },
-        onKeyDown: (event) => {
-          if (event.key === "Backspace") {
-            event.preventDefault();
-            if (currentValue[index]) commit(replaceAt(index, ""), index);
-            else commit(replaceAt(Math.max(index - 1, 0), ""), index - 1);
-          }
-          if (event.key === "ArrowLeft") refs.current[Math.max(index - 1, 0)]?.focus();
-          if (event.key === "ArrowRight") refs.current[Math.min(index + 1, normalizedLength - 1)]?.focus();
-        },
-        onPaste: (event) => {
-          event.preventDefault();
-          const pasted = event.clipboardData.getData("text").split("").filter((char) => pattern.test(char)).join("").slice(0, normalizedLength).toUpperCase();
-          if (pasted) commit(pasted, pasted.length - 1);
-        },
-        className: cn(innerClasses.cell?.className),
-        style: { width: sizeValue(theme, JumpySize.largeXL), height: sizeValue(theme, JumpySize.largeXL), boxSizing: "border-box", appearance: "none", WebkitAppearance: "none", border: 0, outlineWidth: "var(--jumpy-cmp-pin-input-cell-outline-width)", outlineStyle: "solid", outlineColor: "var(--jumpy-cmp-pin-input-cell-border)", outlineOffset: `calc(var(--jumpy-cmp-pin-input-cell-outline-width) * -1)`, borderRadius: radiusValue(theme, JumpyRadius.small), backgroundColor: "var(--jumpy-cmp-pin-input-cell-surface)", color: "var(--jumpy-cmp-pin-input-cell-value)", textAlign: "center", overflow: "hidden", fontFamily: theme.fontFamily.familyBase, fontSize: textStyle.fontSize, lineHeight: textStyle.lineHeight, fontWeight: textStyle.fontWeight, ...innerClasses.cell?.style || {} }
-      },
-      index
-    )) }),
-    helperText ? /* @__PURE__ */ jsx2("div", { id: helperId, "data-jumpy-slot": "pin-input-helper", className: cn(innerClasses.supportingText?.className), style: { paddingTop: spacingValue(theme, JumpySpacing.small3XS), color: supportingColor, fontFamily: theme.fontFamily.familyBase, fontSize: textStyleValue(theme, JumpyTextStyle.labelSmall).fontSize, ...innerClasses.supportingText?.style || {} }, children: helperText }) : null
-  ] });
-}
-function JumpPageControl({ totalPages = 1, currentPage, defaultPage = 0, maxVisibleDots = 7, disabled = false, disabledPages = [], disableInteraction = false, onPageChange, pageAriaLabels = [], className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const [internalPage, setInternalPage] = useState2(defaultPage);
-  const selectedPage = clampNumber(currentPage ?? internalPage, 0, Math.max(totalPages - 1, 0));
-  const visibleCount = clampNumber(maxVisibleDots, 3, Math.max(totalPages, 3));
-  const half = Math.floor(visibleCount / 2);
-  const start = clampNumber(selectedPage - half, 0, Math.max(totalPages - visibleCount, 0));
-  const pages = Array.from({ length: Math.min(totalPages, visibleCount) }, (_, index) => start + index);
-  const showLeft = start > 0;
-  const showRight = start + visibleCount < totalPages;
-  function selectPage(page, pageDisabled) {
-    if (disabled || disableInteraction || pageDisabled) return;
-    setInternalPage(page);
-    onPageChange?.(page);
-  }
-  function renderDot(page, truncation = false) {
-    const selected = page === selectedPage;
-    const pageDisabled = disabledPages.includes(page);
-    const dotSize = truncation ? sizeValue(theme, JumpySize.small5XS) : sizeValue(theme, JumpySize.small4XS);
-    return /* @__PURE__ */ jsx2("button", { type: "button", disabled: disabled || pageDisabled || truncation || disableInteraction, "aria-label": truncation ? "More pages" : pageAriaLabels[page] || `Page ${page + 1}`, "aria-current": selected ? "page" : void 0, "data-jumpy-component": "page-control-dot", "data-selected": selected ? "true" : "false", "data-truncation": truncation ? "true" : "false", onClick: () => selectPage(page, pageDisabled), style: { display: "inline-flex", alignItems: "center", justifyContent: "center", flexShrink: 0, width: truncation ? sizeValue(theme, JumpySize.small3XS) : sizeValue(theme, JumpySize.small), height: truncation ? sizeValue(theme, JumpySize.small3XS) : sizeValue(theme, JumpySize.small), border: `${borderWidthValue(theme, JumpyBorderWidth.medium)}px solid transparent`, borderRadius: radiusValue(theme, JumpyRadius.small), background: "transparent", cursor: disabled || pageDisabled || truncation || disableInteraction ? "default" : "pointer", opacity: disabled || pageDisabled ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid) }, children: /* @__PURE__ */ jsx2("span", { style: { display: "block", width: dotSize, height: dotSize, boxSizing: "border-box", borderRadius: selected || truncation ? radiusValue(theme, JumpyRadius.full) : radiusValue(theme, JumpyRadius.small), border: truncation ? 0 : `${borderWidthValue(theme, JumpyBorderWidth.medium)}px solid ${selected ? theme.listItem.active.default.icon : theme.color.borderStrong}`, backgroundColor: selected ? theme.listItem.active.default.icon : truncation ? theme.color.borderStrong : "transparent" } }) }, truncation ? `truncate-${page}` : page);
-  }
-  return /* @__PURE__ */ jsxs2("div", { ...props, "data-jumpy-component": "page-control", className: cn(className), style: { position: "relative", overflow: "clip", width: "100%", height: sizeValue(theme, JumpySize.small), display: "flex", justifyContent: "center", alignItems: "center", boxSizing: "border-box", ...props.style || {} }, children: [
-    showLeft ? renderDot(start - 1, true) : null,
-    pages.map((page) => renderDot(page)),
-    showRight ? renderDot(start + visibleCount, true) : null
-  ] });
-}
-function textFromNode(node) {
-  if (typeof node === "string" || typeof node === "number") return String(node);
-  if (Array.isArray(node)) return node.map(textFromNode).filter(Boolean).join(" ");
-  if (isValidElement(node)) return textFromNode(node.props.children);
-  return "";
-}
-function useJumpSnackbar() {
-  return useContext(JumpySnackbarContext);
-}
-function JumpSnackbarProvider({ children, position = "bottom-center", maxSnackbars = 3, offset: offset2 = {}, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const [snackbars, setSnackbars] = useState2([]);
-  const top = position.startsWith("top");
-  const align = position.endsWith("start") ? "flex-start" : position.endsWith("end") ? "flex-end" : "center";
-  const horizontalOffset = offset2.left ?? offset2.right ?? spacingValue(theme, JumpySpacing.large);
-  const verticalOffset = top ? offset2.top ?? spacingValue(theme, JumpySpacing.smallXS) : offset2.bottom ?? spacingValue(theme, JumpySpacing.smallXS);
-  function removeSnackbar(id) {
-    setSnackbars((items) => items.filter((item) => item.id !== id));
-  }
-  function addSnackbar(contentOrData, options = {}) {
-    const id = options.id || `jumpy-snackbar-${Date.now()}-${Math.random().toString(36).slice(2)}`;
-    const isData = contentOrData && typeof contentOrData === "object" && !isValidElement(contentOrData) && ("title" in contentOrData || "description" in contentOrData || "status" in contentOrData);
-    const duration = options.persistent || contentOrData?.persistent ? null : options.duration ?? contentOrData?.duration ?? 4e3;
-    const snackbar = { id, content: contentOrData, isData, createdAt: Date.now() };
-    setSnackbars((items) => [snackbar, ...items.filter((item) => item.id !== id)].slice(0, maxSnackbars));
-    if (duration) window.setTimeout(() => removeSnackbar(id), duration);
-    return id;
-  }
-  const contextValue = { addSnackbar, removeSnackbar, clearAll: () => setSnackbars([]), snackbars };
-  return /* @__PURE__ */ jsxs2(JumpySnackbarContext.Provider, { value: contextValue, children: [
-    children,
-    /* @__PURE__ */ jsx2("output", { "aria-live": "assertive", "aria-atomic": "true", style: { position: "absolute", width: 1, height: 1, padding: 0, margin: -1, overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: 0 }, children: snackbars[0] ? textFromNode(snackbars[0].content?.title || snackbars[0].content?.description || snackbars[0].content) : "" }),
-    /* @__PURE__ */ jsx2("div", { ...props, "data-jumpy-component": "snackbar-provider", className: cn(className), style: { position: "fixed", zIndex: 1100, left: position.endsWith("start") ? horizontalOffset : position.endsWith("end") ? "auto" : "50%", right: position.endsWith("end") ? horizontalOffset : "auto", top: top ? verticalOffset : "auto", bottom: top ? "auto" : verticalOffset, transform: position.endsWith("center") ? "translateX(-50%)" : void 0, display: "flex", flexDirection: "column", alignItems: align, gap: spacingValue(theme, JumpySpacing.smallXS), width: "min(487px, calc(100vw - 32px))", maxWidth: "50vw", pointerEvents: "none", ...props.style || {} }, children: snackbars.map((snackbar) => snackbar.isData ? /* @__PURE__ */ jsx2(JumpBanner, { floating: true, status: snackbar.content.status || "info", title: snackbar.content.title, actions: snackbar.content.slots?.actions, style: { width: "100%", pointerEvents: "auto", boxShadow: theme.shadow.positiveLarge }, children: snackbar.content.description }, snackbar.id) : /* @__PURE__ */ jsx2("div", { "data-jumpy-component": "snackbar", style: { width: "100%", pointerEvents: "auto", borderRadius: radiusValue(theme, JumpyRadius.small), boxShadow: theme.shadow.positiveLarge }, children: snackbar.content }, snackbar.id)) })
-  ] });
-}
-function JumpTable({ children, showHorizontalBorders = false, disabled = false, stickyHeader = false, density = "regular", containerProps, innerClasses = {}, className = "", ...props }) {
-  const { className: containerClassName, style: containerStyle, ...restContainerProps } = containerProps || {};
-  const contextValue = { showHorizontalBorders, disabled };
-  return /* @__PURE__ */ jsx2(JumpyTableContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "table-wrapper", className: innerClasses.wrapper?.className, style: innerClasses.wrapper?.style, children: /* @__PURE__ */ jsx2("div", { ...restContainerProps, "data-jumpy-slot": "table-container", "data-sticky-header": stickyHeader ? "true" : "false", className: cn(containerClassName), style: containerStyle, children: /* @__PURE__ */ jsx2("table", { ...props, "data-jumpy-component": "table", "data-horizontal-borders": showHorizontalBorders ? "true" : "false", "data-density": density === "condensed" ? "condensed" : void 0, "data-disabled": disabled ? "true" : void 0, role: props.role || "grid", className: cn(className), children }) }) }) });
-}
-function JumpTableHead({ as, children, className = "", ...props }) {
-  const Component = as || "thead";
-  return /* @__PURE__ */ jsx2(Component, { ...props, "data-jumpy-component": "table-head", role: props.role || "rowgroup", className: cn(className), children });
-}
-function JumpTableBody({ as, children, className = "", ...props }) {
-  const Component = as || "tbody";
-  return /* @__PURE__ */ jsx2(Component, { ...props, "data-jumpy-component": "table-body", role: props.role || "rowgroup", className: cn(className), children });
-}
-function JumpTableFooter({ as, children, className = "", ...props }) {
-  const Component = as || "tfoot";
-  return /* @__PURE__ */ jsx2(Component, { ...props, "data-jumpy-component": "table-footer", role: props.role || "rowgroup", className: cn(className), children });
-}
-function JumpTableRow({ as, children, selected = false, disabled = false, disableHover = false, verticalAlign = "middle", dragging = false, className = "", onClick, ...props }) {
-  const Component = as || "tr";
-  const tableContext = useContext(JumpyTableContext);
-  const isDisabled = disabled || tableContext?.disabled;
-  const isInteractive = !disableHover && !isDisabled && Boolean(onClick);
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "table-row",
-      "data-selectable": isInteractive ? "true" : void 0,
-      "data-disable-hover": disableHover ? "true" : void 0,
-      "data-disabled": isDisabled ? "true" : void 0,
-      "data-state": selected ? "selected" : void 0,
-      "data-vertical-align": verticalAlign === "top" ? "top" : void 0,
-      "data-dragging": dragging ? "true" : void 0,
-      role: props.role || "row",
-      "aria-selected": selected || void 0,
-      "aria-disabled": isDisabled || void 0,
-      tabIndex: isInteractive ? props.tabIndex ?? 0 : props.tabIndex,
-      className: cn(className),
-      onClick: isDisabled ? void 0 : onClick,
-      children
-    }
-  );
-}
-function getTableCellTypography(theme, emphasized = false) {
-  return textStyleValue(theme, emphasized ? JumpyTextStyle.bodyMediumEmphasized : JumpyTextStyle.bodyMedium);
-}
-function tableCellTextStyle(theme, emphasized = false, style) {
-  const textStyle = getTableCellTypography(theme, emphasized);
-  return {
-    fontFamily: theme.fontFamily.familyBase,
-    fontSize: textStyle.fontSize,
-    lineHeight: textStyle.lineHeight,
-    fontWeight: textStyle.fontWeight,
-    letterSpacing: textStyle.letterSpacing,
-    ...style
-  };
-}
-function JumpTableCell({ as, children, selected = false, disabled = false, align, variant = "default", padding = "default", showHorizontalBorder, pinned, pinnedEdge = false, leading, trailing, description, slots, innerClasses = {}, className = "", onClick, ...props }) {
-  const theme = useJumpyTheme();
-  const tableContext = useContext(JumpyTableContext);
-  const Component = as || "td";
-  const isControl = variant === "control" || padding === "checkbox";
-  const resolvedAlign = align || (isControl ? "center" : "start");
-  const cellLeading = slots?.leading ?? leading;
-  const cellTrailing = slots?.trailing ?? trailing;
-  const cellDescription = slots?.description ?? description;
-  const isDisabled = disabled || tableContext?.disabled;
-  const resolvedHorizontalBorder = showHorizontalBorder ?? tableContext?.showHorizontalBorders ?? false;
-  const isInteractive = !isDisabled && Boolean(onClick);
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "table-cell",
-      "data-pinned": pinned || void 0,
-      "data-pinned-edge": pinnedEdge ? "true" : void 0,
-      "data-horizontal-border": resolvedHorizontalBorder ? "true" : "false",
-      "data-state": selected ? "selected" : "default",
-      "data-disabled": isDisabled ? "true" : void 0,
-      "data-align": resolvedAlign,
-      "data-padding": padding,
-      "data-variant": isControl ? "control" : void 0,
-      "data-interactive": isInteractive ? "true" : void 0,
-      role: props.role || "gridcell",
-      "aria-disabled": isDisabled || void 0,
-      "aria-selected": selected || void 0,
-      tabIndex: props.tabIndex ?? (isInteractive ? 0 : void 0),
-      className: cn(className),
-      onClick: isDisabled ? void 0 : onClick,
-      children: [
-        /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", "data-jumpy-slot": "table-cell-surface" }),
-        /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "table-cell-inner", "data-align": resolvedAlign, className: innerClasses.inner?.className, style: innerClasses.inner?.style, children: [
-          cellLeading ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-leading", className: innerClasses.leading?.className, style: innerClasses.leading?.style, children: cellLeading }) : null,
-          /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "table-cell-content", className: innerClasses.content?.className, style: innerClasses.content?.style, children: [
-            /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-text", className: innerClasses.text?.className, style: tableCellTextStyle(theme, false, innerClasses.text?.style), children }),
-            cellDescription ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-description", className: innerClasses.description?.className, style: tableCellTextStyle(theme, false, innerClasses.description?.style), children: cellDescription }) : null
-          ] }),
-          cellTrailing ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-trailing", className: innerClasses.trailing?.className, style: innerClasses.trailing?.style, children: cellTrailing }) : null
-        ] })
-      ]
-    }
-  );
-}
-function getSortMapping(currentOrder, ascValue, descValue, defaultValue) {
-  if (currentOrder === "ascending" || currentOrder === "asc") return ascValue;
-  if (currentOrder === "descending" || currentOrder === "desc") return descValue;
-  return defaultValue;
-}
-function getNextSortOrder(order) {
-  if (order === "ascending" || order === "asc") return "desc";
-  if (order === "descending" || order === "desc") return "default";
-  return "asc";
-}
-function getSortOrder(sortDirection) {
-  return getSortMapping(sortDirection, "asc", "desc", "default");
-}
-function getSortActionLabel(currentOrder, columnName) {
-  if (columnName) {
-    return getSortMapping(currentOrder, `Sort ${columnName} descending`, `Clear sort on ${columnName}`, `Sort ${columnName} ascending`);
-  }
-  return getSortMapping(currentOrder, "Sort descending", "Clear sort", "Sort ascending");
-}
-function participatesInSelection(row) {
-  return row.getCanSelect() || (row.subRows?.some(participatesInSelection) ?? false);
-}
-function getSelectionChildren(row) {
-  const children = row.subRows?.filter(participatesInSelection);
-  return children?.length ? children : void 0;
-}
-function isRowFullySelected(row) {
-  const children = getSelectionChildren(row);
-  if (children) return children.every(isRowFullySelected);
-  return row.getCanSelect() && row.getIsSelected();
-}
-function applySubtreeSelection(row, selected) {
-  if (row.getCanSelect() && row.getIsSelected() !== selected) {
-    row.toggleSelected(selected, { selectChildren: false });
-  }
-  row.subRows?.forEach((subRow) => applySubtreeSelection(subRow, selected));
-}
-function getRowCheckboxProps(row, disabled) {
-  const checked = isRowFullySelected(row);
-  return {
-    checked,
-    indeterminate: !checked && row.getIsSomeSelected(),
-    disabled: disabled || !row.getCanSelect(),
-    "aria-label": `Select row ${row.id}`,
-    onChange: () => applySubtreeSelection(row, !isRowFullySelected(row))
-  };
-}
-function getHeaderCheckboxProps(table, disabled) {
-  const topRows = table.getRowModel?.().rows.filter((row) => (row.depth ?? 0) === 0 && participatesInSelection(row));
-  const isTree = topRows?.some((row) => getSelectionChildren(row)) ?? false;
-  const checked = isTree && topRows ? topRows.every(isRowFullySelected) : table.getIsAllRowsSelected();
-  return {
-    checked,
-    indeterminate: !checked && table.getIsSomeRowsSelected(),
-    disabled,
-    "aria-label": "Select all rows",
-    onChange: table.getToggleAllRowsSelectedHandler()
-  };
-}
-function sortSymbol(order) {
-  if (order === "ascending" || order === "asc") return "\u2191";
-  if (order === "descending" || order === "desc") return "\u2193";
-  return "\u2195";
-}
-function ariaSortOrder(order) {
-  if (order === "ascending" || order === "asc") return "ascending";
-  if (order === "descending" || order === "desc") return "descending";
-  if (order === "default" || order === "none" || order === false) return "none";
-  return void 0;
-}
-function JumpTableHeaderCell({ as, children, selected = false, disabled = false, align, variant = "default", padding = "default", showHorizontalBorder, pinned, pinnedEdge = false, sortable = false, sortOrder = "default", onSortChange, ariaLabels, leading, trailing, slots, innerClasses = {}, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const tableContext = useContext(JumpyTableContext);
-  const Component = as || "th";
-  const isControl = variant === "control" || padding === "checkbox";
-  const resolvedAlign = align || (isControl ? "center" : "start");
-  const cellLeading = slots?.leading ?? leading;
-  const cellTrailing = slots?.trailing ?? trailing;
-  const isDisabled = disabled || tableContext?.disabled;
-  const resolvedHorizontalBorder = showHorizontalBorder ?? tableContext?.showHorizontalBorders ?? false;
-  const participatesInSort = sortable || sortOrder !== "default" && sortOrder !== "none";
-  const ariaSort = participatesInSort ? ariaSortOrder(sortOrder) : void 0;
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      "data-jumpy-component": "table-header-cell",
-      "data-pinned": pinned || void 0,
-      "data-pinned-edge": pinnedEdge ? "true" : void 0,
-      "data-horizontal-border": resolvedHorizontalBorder ? "true" : "false",
-      "data-sortable": sortable ? "true" : "false",
-      "data-sort-order": sortOrder,
-      "data-disabled": isDisabled ? "true" : void 0,
-      "data-state": selected ? "selected" : "default",
-      "data-align": resolvedAlign,
-      "data-padding": padding,
-      "data-variant": isControl ? "control" : void 0,
-      role: props.role || "columnheader",
-      "aria-sort": ariaSort,
-      className: cn(className),
-      children: [
-        /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", "data-jumpy-slot": "table-cell-surface" }),
-        /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "table-cell-inner", "data-align": resolvedAlign, className: innerClasses.inner?.className, style: innerClasses.inner?.style, children: [
-          cellLeading ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-leading", className: innerClasses.leading?.className, style: innerClasses.leading?.style, children: cellLeading }) : null,
-          /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-content", className: innerClasses.label?.className, style: innerClasses.label?.style, children: /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "table-cell-text", className: innerClasses.labelText?.className, style: tableCellTextStyle(theme, true, innerClasses.labelText?.style), children }) }),
-          cellTrailing || sortable ? /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "table-cell-trailing", className: innerClasses.trailing?.className, style: innerClasses.trailing?.style, children: [
-            sortable ? /* @__PURE__ */ jsx2(JumpIconButton, { variant: "secondary", disabled: isDisabled, "aria-label": typeof ariaLabels?.sort === "function" ? ariaLabels.sort(sortOrder) : ariaLabels?.sort || getSortActionLabel(sortOrder, typeof children === "string" ? children : void 0), onClick: () => onSortChange?.(getNextSortOrder(sortOrder)), children: sortSymbol(sortOrder) }) : null,
-            cellTrailing
-          ] }) : null
-        ] })
-      ]
-    }
-  );
-}
-function ChevronIcon({ expanded }) {
-  return /* @__PURE__ */ jsx2("svg", { viewBox: "0 0 24 24", width: "24", height: "24", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ jsx2("path", { d: expanded ? "M7.4 15.4 12 10.8l4.6 4.6 1.4-1.4-6-6-6 6 1.4 1.4Z" : "M7.4 8.6 12 13.2l4.6-4.6 1.4 1.4-6 6-6-6 1.4-1.4Z" }) });
-}
-function JumpExpandable({ as, variant = "filled", disabled = false, expanded, defaultExpanded = false, onChange, slots, innerClasses = {}, className = "", children, ...props }) {
-  const Component = as || "div";
-  const context = useContext(JumpyExpandableContext);
-  const panelId = useId();
-  const isDisabled = disabled || context?.disabled;
-  const isControlled = expanded !== void 0 || context?.expanded !== void 0;
-  const [uncontrolledExpanded, setUncontrolledExpanded] = useState2(defaultExpanded);
-  const isExpanded = isControlled ? Boolean(expanded ?? context?.expanded) : uncontrolledExpanded;
-  const label = slots?.label;
-  const description = slots?.description;
-  const leading = slots?.leading;
-  const trailing = slots?.trailing;
-  function handleToggle() {
-    if (isDisabled) return;
-    const nextExpanded = !isExpanded;
-    context?.onExpandedChange?.(nextExpanded);
-    if (!isControlled) setUncontrolledExpanded(nextExpanded);
-    onChange?.(nextExpanded);
-  }
-  const header = /* @__PURE__ */ jsxs2(
-    "button",
-    {
-      ref: context?.buttonRef,
-      type: "button",
-      "data-jumpy-slot": "expandable-header",
-      className: innerClasses.header?.className,
-      style: innerClasses.header?.style,
-      onClick: handleToggle,
-      disabled: isDisabled,
-      "aria-controls": panelId,
-      "aria-expanded": isExpanded,
-      children: [
-        /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "expandable-slots-container", children: [
-          leading,
-          label || description ? /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "expandable-header-content", className: innerClasses.headerContent?.className, style: innerClasses.headerContent?.style, children: [
-            label ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "expandable-label", className: innerClasses.label?.className, style: innerClasses.label?.style, children: label }) : null,
-            description ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "expandable-description", className: innerClasses.description?.className, style: innerClasses.description?.style, children: description }) : null
-          ] }) : null
-        ] }),
-        /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "expandable-slots-container", children: [
-          trailing,
-          !isDisabled ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "expandable-icon", className: innerClasses.icon?.className, style: innerClasses.icon?.style, children: /* @__PURE__ */ jsx2(ChevronIcon, { expanded: isExpanded }) }) : null
-        ] })
-      ]
-    }
-  );
-  return /* @__PURE__ */ jsxs2(Component, { ...props, "data-jumpy-component": "expandable", "data-variant": variant, className: cn(className), children: [
-    context?.headingLevel ? /* @__PURE__ */ jsx2(context.headingLevel, { "data-jumpy-slot": "expandable-header-wrapper", children: header }) : header,
-    /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "expandable-content-wrapper", "data-expanded": isExpanded ? "true" : "false", children: /* @__PURE__ */ jsx2("div", { id: panelId, "data-jumpy-slot": "expandable-panel", className: innerClasses.panel?.className, style: innerClasses.panel?.style, children }) })
-  ] });
-}
-function headingTag(level) {
-  if (!level) return void 0;
-  return `h${Math.min(6, Math.max(1, Number(level)))}`;
-}
-function focusExpandableButton(buttonRefs, index) {
-  const nextButton = buttonRefs.current[index];
-  nextButton?.focus();
-}
-function JumpExpandableGroup({ as, multiple = false, disabled = false, headingLevel, onChange, innerClasses = {}, className = "", children, ...props }) {
-  const Component = as || "div";
-  const buttonRefs = useRef2([]);
-  const childArray = Children.toArray(children);
-  const [expandedIndices, setExpandedIndices] = useState2(() => {
-    const initial = /* @__PURE__ */ new Set();
-    childArray.forEach((child, index) => {
-      if (isValidElement(child) && (child.props.expanded || child.props.defaultExpanded)) initial.add(index);
-    });
-    return initial;
-  });
-  function updateExpanded(index, nextExpanded) {
-    setExpandedIndices((current) => {
-      const next = new Set(current);
-      if (nextExpanded) {
-        if (!multiple) next.clear();
-        next.add(index);
-      } else {
-        next.delete(index);
-      }
-      onChange?.(Array.from(next).sort((a, b) => a - b));
-      return next;
-    });
-  }
-  function handleKeyDown(event) {
-    const currentIndex = buttonRefs.current.findIndex((button) => button === event.target);
-    if (currentIndex === -1) {
-      props.onKeyDown?.(event);
-      return;
-    }
-    if (event.key === KeyboardKeys.ARROW_DOWN) {
-      event.preventDefault();
-      focusExpandableButton(buttonRefs, (currentIndex + 1) % buttonRefs.current.length);
-    } else if (event.key === KeyboardKeys.ARROW_UP) {
-      event.preventDefault();
-      focusExpandableButton(buttonRefs, (currentIndex - 1 + buttonRefs.current.length) % buttonRefs.current.length);
-    } else if (event.key === KeyboardKeys.HOME) {
-      event.preventDefault();
-      focusExpandableButton(buttonRefs, 0);
-    } else if (event.key === KeyboardKeys.END) {
-      event.preventDefault();
-      focusExpandableButton(buttonRefs, buttonRefs.current.length - 1);
-    }
-    props.onKeyDown?.(event);
-  }
-  return /* @__PURE__ */ jsx2(Component, { ...props, "data-jumpy-component": "expandable-group", "aria-disabled": disabled || void 0, className: cn(className), onKeyDown: handleKeyDown, children: childArray.map((child, index) => {
-    const contextValue = {
-      headingLevel: headingTag(headingLevel),
-      disabled,
-      expanded: expandedIndices.has(index),
-      onExpandedChange: (nextExpanded) => updateExpanded(index, nextExpanded),
-      buttonRef: (element) => {
-        buttonRefs.current[index] = element;
-      }
-    };
-    return /* @__PURE__ */ jsxs2(JumpyExpandableContext.Provider, { value: contextValue, children: [
-      child,
-      index < childArray.length - 1 ? /* @__PURE__ */ jsx2(JumpDivider, { direction: "horizontal", "data-jumpy-slot": "expandable-group-divider", className: innerClasses.divider?.className, style: innerClasses.divider?.style }) : null
-    ] }, child.key || index);
-  }) });
-}
-var JUMPY_POPUP_Z_INDEX = 1200;
-function JumpyPortal({ children }) {
-  const theme = useJumpyTheme();
-  const scope = useContext(JumpyThemeScopeContext);
-  return /* @__PURE__ */ jsx2(FloatingPortal, { children: /* @__PURE__ */ jsx2("div", { "data-jumpy-theme": "true", "data-jumpy-scope": scope || void 0, "data-jumpy-portal": "true", style: { ...!scope ? themeToCSSVariables(theme) : {}, fontFamily: theme.fontFamily.familyBase }, children }) });
-}
-function JumpyModalLayer({ children, onVisibleChange, style, onPointerDown, ...props }) {
-  const theme = useJumpyTheme();
-  const { refs, context } = useFloating({ open: true, onOpenChange: onVisibleChange });
-  return /* @__PURE__ */ jsx2(JumpyPortal, { children: /* @__PURE__ */ jsx2(FloatingOverlay, { ...props, lockScroll: true, onPointerDown: (event) => {
-    onPointerDown?.(event);
-    if (event.target === event.currentTarget) event.preventDefault();
-  }, style, children: /* @__PURE__ */ jsx2(FloatingFocusManager, { context, outsideElementsInert: true, restoreFocus: true, children: cloneElement(children, {
-    ref: refs.setFloating,
-    tabIndex: -1,
-    onKeyDown(event) {
-      children.props.onKeyDown?.(event);
-      const nestedPopup = !event.currentTarget.contains(event.target) || event.target.closest('[aria-haspopup][aria-expanded="true"]');
-      if (event.key === KeyboardKeys.ESCAPE && !event.defaultPrevented && !nestedPopup) {
-        event.preventDefault();
-        event.stopPropagation();
-        onVisibleChange?.(false);
-      }
-    }
-  }) }) }) });
-}
-function JumpSheet({ visible = false, onVisibleChange, position = "right", title, subtitle, footer, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const vertical = position === "left" || position === "right";
-  if (!visible) return null;
-  return /* @__PURE__ */ jsx2(JumpyModalLayer, { onVisibleChange, "data-jumpy-component": "sheet-overlay", role: "presentation", onClick: (event) => {
-    if (event.target === event.currentTarget) onVisibleChange?.(false);
-  }, style: { position: "fixed", inset: 0, zIndex: 50, backgroundColor: theme.color.surfaceOverlay }, children: /* @__PURE__ */ jsxs2("aside", { ...props, "data-jumpy-component": "sheet", className: cn(className), role: "dialog", "aria-modal": "true", "aria-label": title || props["aria-label"], tabIndex: -1, onClick: (event) => {
-    event.stopPropagation();
-    props.onClick?.(event);
-  }, style: { position: "fixed", top: position === "bottom" ? "auto" : 0, bottom: position === "top" ? "auto" : 0, left: position === "right" ? "auto" : 0, right: position === "left" ? "auto" : 0, width: vertical ? "min(420px, 100vw)" : "100vw", height: vertical ? "100dvh" : "min(420px, 100dvh)", backgroundColor: theme.color.surfaceCard, color: theme.color.textPrimary, boxShadow: theme.shadow.positiveMedium, display: "flex", flexDirection: "column", ...props.style || {} }, children: [
-    /* @__PURE__ */ jsxs2("div", { style: { padding: spacingValue(theme, JumpySpacing.large), borderBottom: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}` }, children: [
-      title ? /* @__PURE__ */ jsx2(JumpTypography, { variant: "titleMediumEmphasized", children: title }) : null,
-      subtitle ? /* @__PURE__ */ jsx2(JumpTypography, { variant: "bodySmall", color: "secondary", children: subtitle }) : null
-    ] }),
-    /* @__PURE__ */ jsx2("div", { style: { padding: spacingValue(theme, JumpySpacing.large), flex: 1, overflow: "auto" }, children }),
-    footer ? /* @__PURE__ */ jsx2("div", { style: { padding: spacingValue(theme, JumpySpacing.large), borderTop: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid ${theme.color.borderSubtle}` }, children: footer }) : null
-  ] }) });
-}
-function JumpyNavigationIcon({ type, size: size2 = 24 }) {
-  const paths = {
-    menu: "M4 6h16M4 12h16M4 18h16",
-    close: "M6 6l12 12M18 6 6 18",
-    back: "M15 18l-6-6 6-6",
-    more: "M5 12h.01M12 12h.01M19 12h.01"
-  };
-  return /* @__PURE__ */ jsx2("svg", { width: size2, height: size2, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: type === "more" ? 3 : 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", "data-jumpy-stroke-icon": "true", style: { display: "block" }, children: /* @__PURE__ */ jsx2("path", { d: paths[type] }) });
-}
-function JumpTopBar({ leading, onMenu, onBack, menuOpen = false, title, subtitle, trailing, sticky = true, titleAlign = "start", titleHidden = false, ariaLabels = {}, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const [scrolled, setScrolled] = useState2(false);
-  const titleStyle = textStyleValue(theme, JumpyTextStyle.bodyLargeEmphasized);
-  const subtitleStyle = textStyleValue(theme, JumpyTextStyle.bodySmall);
-  useEffect2(() => {
-    if (!sticky) return void 0;
-    const update = () => setScrolled(window.scrollY > 0);
-    update();
-    window.addEventListener("scroll", update, { passive: true });
-    return () => window.removeEventListener("scroll", update);
-  }, [sticky]);
-  const leadingType = leading === "menu" || leading === "back" ? leading : void 0;
-  const leadingNode = leading === "menu" ? /* @__PURE__ */ jsx2(JumpIconButton, { variant: "borderless", "aria-label": ariaLabels.menu || "Open navigation", "aria-haspopup": "dialog", "aria-expanded": menuOpen, onClick: onMenu, children: /* @__PURE__ */ jsx2(JumpyNavigationIcon, { type: "menu" }) }) : leading === "back" ? /* @__PURE__ */ jsx2(JumpIconButton, { variant: "borderless", "aria-label": ariaLabels.back || "Back", onClick: onBack, children: /* @__PURE__ */ jsx2(JumpyNavigationIcon, { type: "back" }) }) : leading;
-  return /* @__PURE__ */ jsxs2(
-    "header",
-    {
-      ...props,
-      "data-jumpy-component": "top-bar",
-      "data-sticky": sticky ? "true" : "false",
-      "data-scrolled": scrolled ? "true" : "false",
-      "data-title-align": titleAlign,
-      "data-title-hidden": titleHidden ? "true" : "false",
-      className: cn(className),
-      style: {
-        boxSizing: "border-box",
-        position: sticky ? "sticky" : "relative",
-        top: 0,
-        zIndex: 40,
-        alignItems: "center",
-        gap: spacingValue(theme, JumpySpacing.medium),
-        minHeight: `calc(${sizeValue(theme, JumpySize.large2XL)}px + env(safe-area-inset-top, 0px))`,
-        padding: `calc(${spacingValue(theme, JumpySpacing.smallXS)}px + env(safe-area-inset-top, 0px)) calc(${spacingValue(theme, JumpySpacing.large)}px + env(safe-area-inset-right, 0px)) ${spacingValue(theme, JumpySpacing.smallXS)}px calc(${spacingValue(theme, JumpySpacing.large)}px + env(safe-area-inset-left, 0px))`,
-        color: "var(--jumpy-color-text-primary)",
-        fontFamily: theme.fontFamily.familyBase,
-        ...props.style || {}
-      },
-      children: [
-        leadingNode ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "top-bar-leading", "data-leading": leadingType, style: { minWidth: 0, maxWidth: "100%", marginLeft: -spacingValue(theme, JumpySpacing.smallXS) }, children: leadingNode }) : null,
-        /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "top-bar-title", "aria-hidden": titleHidden || void 0, style: titleAlign === "center" ? {
-          display: "flex",
-          flexDirection: "column",
-          alignItems: "center",
-          textAlign: "center",
-          minWidth: 0,
-          opacity: titleHidden ? 0 : 1
-        } : { display: "flex", flexDirection: "column", flex: "1 1 auto", minWidth: 0, opacity: titleHidden ? 0 : 1 }, children: [
-          title ? /* @__PURE__ */ jsx2("span", { style: { maxWidth: "100%", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", fontSize: titleStyle.fontSize, lineHeight: titleStyle.lineHeight, fontWeight: titleStyle.fontWeight }, children: title }) : null,
-          subtitle ? /* @__PURE__ */ jsx2("span", { style: { maxWidth: "100%", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--jumpy-color-text-secondary)", fontSize: subtitleStyle.fontSize, lineHeight: subtitleStyle.lineHeight }, children: subtitle }) : null
-        ] }),
-        trailing ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "top-bar-trailing", style: { display: "inline-flex", flex: "0 0 auto", marginLeft: "auto", alignItems: "center", gap: spacingValue(theme, JumpySpacing.smallXS) }, children: trailing }) : null
-      ]
-    }
-  );
-}
-function JumpTabBar({ children, className = "", "aria-label": ariaLabel = "Main navigation", ...props }) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsx2(
-    "div",
-    {
-      "data-jumpy-component": "tab-bar",
-      className: cn(className),
-      style: {
-        boxSizing: "border-box",
-        position: "sticky",
-        bottom: 0,
-        zIndex: 40,
-        padding: `0 calc(${spacingValue(theme, JumpySpacing.medium)}px + env(safe-area-inset-right, 0px)) calc(${spacingValue(theme, JumpySpacing.medium)}px + env(safe-area-inset-bottom, 0px)) calc(${spacingValue(theme, JumpySpacing.medium)}px + env(safe-area-inset-left, 0px))`,
-        pointerEvents: "none"
-      },
-      children: /* @__PURE__ */ jsx2(
-        "nav",
-        {
-          ...props,
-          "aria-label": ariaLabel,
-          "data-jumpy-slot": "tab-bar-surface",
-          style: {
-            boxSizing: "border-box",
-            display: "flex",
-            gap: spacingValue(theme, JumpySpacing.small4XS),
-            padding: spacingValue(theme, JumpySpacing.small3XS),
-            borderRadius: radiusValue(theme, JumpyRadius.large2XL),
-            border: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-color-border-subtle)`,
-            boxShadow: theme.shadow.positiveMedium,
-            pointerEvents: "auto",
-            fontFamily: theme.fontFamily.familyBase,
-            ...props.style || {}
-          },
-          children
-        }
-      )
-    }
-  );
-}
-function JumpTabBarItem({ as, icon, badge, selected = false, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || (props.href ? "a" : "button");
-  const labelStyle = textStyleValue(theme, JumpyTextStyle.labelSmall);
-  const badgeNode = typeof badge === "number" ? badge > 0 ? /* @__PURE__ */ jsx2(JumpBadge, { size: "small", status: "active", "aria-label": void 0, role: "presentation", "aria-live": "off", children: badge > 99 ? "99+" : badge }) : null : badge;
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      ...props,
-      type: Component === "button" ? props.type || "button" : props.type,
-      "aria-current": selected ? props["aria-current"] || "page" : props["aria-current"],
-      "data-jumpy-component": "tab-bar-item",
-      "data-selected": selected ? "true" : "false",
-      className: cn(className),
-      style: {
-        boxSizing: "border-box",
-        flex: "1 1 0",
-        minWidth: 0,
-        display: "flex",
-        flexDirection: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: spacingValue(theme, JumpySpacing.small4XS),
-        minHeight: sizeValue(theme, JumpySize.large2XL),
-        padding: `${spacingValue(theme, JumpySpacing.smallXS)}px ${spacingValue(theme, JumpySpacing.small3XS)}px`,
-        border: 0,
-        borderRadius: radiusValue(theme, JumpyRadius.largeXL),
-        backgroundColor: selected ? "var(--jumpy-interactive-active-regular-default-surface)" : "transparent",
-        color: selected ? "var(--jumpy-interactive-active-regular-default-text)" : "var(--jumpy-color-text-secondary)",
-        textDecoration: "none",
-        cursor: "pointer",
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: labelStyle.fontSize,
-        lineHeight: labelStyle.lineHeight,
-        fontWeight: labelStyle.fontWeight,
-        ...props.style || {}
-      },
-      children: [
-        icon ? /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "tab-bar-item-icon", "aria-hidden": "true", style: { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", flexShrink: 0, width: sizeValue(theme, JumpySize.smallXS), height: sizeValue(theme, JumpySize.smallXS) }, children: [
-          icon,
-          badgeNode ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "tab-bar-item-badge", style: { position: "absolute", top: -spacingValue(theme, JumpySpacing.smallXS), left: "50%", marginLeft: spacingValue(theme, JumpySpacing.small3XS), display: "inline-flex" }, children: badgeNode }) : null
-        ] }) : null,
-        /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "tab-bar-item-label", style: { maxWidth: "100%", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children })
-      ]
-    }
-  );
-}
-var jumpyLocations = { current: null, previous: null };
-function jumpyNormalizeUrl(url) {
-  const resolved = new URL(url, window.location.href);
-  const path = resolved.pathname.length > 1 ? resolved.pathname.replace(/\/+$/, "") : resolved.pathname;
-  return `${resolved.origin}${path}${resolved.search === "?" ? "" : resolved.search}`;
-}
-function jumpyPreviousEntryIs(href) {
-  const target = jumpyNormalizeUrl(href);
-  const navigation = window.navigation;
-  if (navigation && typeof navigation.entries === "function" && navigation.currentEntry) {
-    if (!navigation.canGoBack) return false;
-    const previous = navigation.entries()[navigation.currentEntry.index - 1];
-    return Boolean(previous?.url) && jumpyNormalizeUrl(previous.url) === target;
-  }
-  return Boolean(jumpyLocations.previous) && jumpyNormalizeUrl(jumpyLocations.previous) === target && window.history.length > 1;
-}
-function JumpyAppShellBack({ back, variant, ariaLabels }) {
-  const theme = useJumpyTheme();
-  const Component = back.as || (back.href ? "a" : "button");
-  const textStyle = textStyleValue(theme, variant === "inline" ? JumpyTextStyle.bodySmallEmphasized : JumpyTextStyle.bodyMedium);
-  const accessibleName = ariaLabels.backTo ? ariaLabels.backTo(back.label) : `Back to ${back.label}`;
-  function handleClick(event) {
-    back.onClick?.(event);
-    if (event.defaultPrevented || !back.href || back.history === false) return;
-    if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return;
-    if (!jumpyPreviousEntryIs(back.href)) return;
-    event.preventDefault();
-    window.history.back();
-  }
-  return /* @__PURE__ */ jsxs2(
-    Component,
-    {
-      href: back.href,
-      type: Component === "button" ? "button" : void 0,
-      "aria-label": accessibleName,
-      "data-jumpy-slot": "app-shell-back",
-      "data-variant": variant,
-      onClick: handleClick,
-      style: {
-        boxSizing: "border-box",
-        alignItems: "center",
-        gap: spacingValue(theme, JumpySpacing.small4XS),
-        maxWidth: "100%",
-        minWidth: 0,
-        minHeight: variant === "inline" ? void 0 : sizeValue(theme, JumpySize.largeXL),
-        margin: variant === "inline" ? `0 0 ${spacingValue(theme, JumpySpacing.small3XS)}px ${-spacingValue(theme, JumpySpacing.small3XS)}px` : 0,
-        padding: variant === "inline" ? 0 : `0 ${spacingValue(theme, JumpySpacing.smallXS)}px 0 0`,
-        border: 0,
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        background: "transparent",
-        color: "var(--jumpy-interactive-active-regular-default-text)",
-        textDecoration: "none",
-        cursor: "pointer",
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: textStyle.fontSize,
-        lineHeight: textStyle.lineHeight,
-        fontWeight: textStyle.fontWeight
-      },
-      children: [
-        /* @__PURE__ */ jsx2(JumpyNavigationIcon, { type: "back", size: variant === "inline" ? 18 : 24 }),
-        /* @__PURE__ */ jsx2("span", { style: { minWidth: 0, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: back.label })
-      ]
-    }
-  );
-}
-function JumpyAppShellActions({ actions, variant, ariaLabels }) {
-  const theme = useJumpyTheme();
-  if (!actions.length) return null;
-  const gap = spacingValue(theme, JumpySpacing.smallXS);
-  if (variant === "full") {
-    return /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "app-shell-actions", "data-variant": "full", style: { alignItems: "center", gap, flexWrap: "wrap", justifyContent: "flex-end" }, children: actions.map((action, index) => /* @__PURE__ */ jsx2(JumpButton, { as: action.href ? "a" : void 0, href: action.href, variant: action.variant || "secondary", leadingIcon: action.icon, disabled: action.disabled, onClick: action.onClick, children: action.label }, action.id ?? index)) });
-  }
-  const visible = actions.length > 2 ? actions.slice(0, 1) : actions;
-  const overflow = actions.length > 2 ? actions.slice(1) : [];
-  return /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "app-shell-actions", "data-variant": "compact", style: { alignItems: "center", gap }, children: [
-    visible.map((action, index) => /* @__PURE__ */ jsx2(JumpIconButton, { as: action.href ? "a" : void 0, href: action.href, variant: action.variant === "primary" ? "primary" : "borderless", "aria-label": action.label, disabled: action.disabled, onClick: action.onClick, children: action.icon }, action.id ?? index)),
-    overflow.length ? /* @__PURE__ */ jsx2(
-      JumpMenu,
-      {
-        placement: "bottom-end",
-        triggerProps: { role: "button", "aria-label": ariaLabels.moreActions || "More actions", "data-jumpy-slot": "app-shell-actions-more" },
-        trigger: /* @__PURE__ */ jsx2(JumpIconButton, { as: "span", variant: "borderless", tabIndex: -1, "aria-hidden": "true", children: /* @__PURE__ */ jsx2(JumpyNavigationIcon, { type: "more" }) }),
-        children: overflow.map((action, index) => /* @__PURE__ */ jsx2(JumpMenuItem, { as: action.href ? "a" : void 0, href: action.href, leading: action.icon, disabled: action.disabled, onClick: action.onClick, children: action.label }, action.id ?? index))
-      }
-    ) : null
-  ] });
-}
-function JumpAppShell({ brand, navigation, sidebarFooter, topBar, tabBar, hideTabBar = false, breakpoint = 1024, sidebarWidth = 256, navigationOpen, defaultNavigationOpen = false, onNavigationOpenChange, ariaLabels = {}, children, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const shellId = useId();
-  const [internalOpen, setInternalOpen] = useState2(defaultNavigationOpen);
-  const isOpen = Boolean(navigation) && (navigationOpen ?? internalOpen);
-  const swipeStart = useRef2(null);
-  const rootRef = useRef2(null);
-  const [drawerMounted, setDrawerMounted] = useState2(isOpen);
-  const showDrawer = isOpen || drawerMounted;
-  const closing = drawerMounted && !isOpen;
-  const wasShown = useRef2(showDrawer);
-  const { desktop: topBarDesktop = false, leading, largeTitle = false, actions = [], back, ...topBarProps } = topBar || {};
-  const showLargeTitle = largeTitle && Boolean(topBarProps.title);
-  const hasBack = Boolean(back?.label);
-  const topBarOnDesktop = topBarDesktop || !showLargeTitle && (actions.length > 0 || hasBack);
-  const largeTitleRef = useRef2(null);
-  const [largeTitleCovered, setLargeTitleCovered] = useState2(false);
-  const resolvedLeading = hasBack ? /* @__PURE__ */ jsx2(JumpyAppShellBack, { back, variant: "bar", ariaLabels }) : leading ?? (navigation ? "menu" : void 0);
-  useEffect2(() => {
-    const href = window.location.href;
-    if (jumpyLocations.current === href) return;
-    jumpyLocations.previous = jumpyLocations.current;
-    jumpyLocations.current = href;
-  });
-  const shell = `[data-jumpy-app-shell="${shellId}"]`;
-  const width = typeof sidebarWidth === "number" ? `${sidebarWidth}px` : sidebarWidth;
-  function setOpen(next) {
-    if (navigationOpen === void 0) setInternalOpen(next);
-    onNavigationOpenChange?.(next);
-  }
-  useEffect2(() => {
-    if (!isOpen) return void 0;
-    const desktop = window.matchMedia(`(min-width: ${breakpoint}px)`);
-    const closeOnDesktop = () => {
-      if (desktop.matches) setOpen(false);
-    };
-    closeOnDesktop();
-    desktop.addEventListener("change", closeOnDesktop);
-    return () => desktop.removeEventListener("change", closeOnDesktop);
-  });
-  useEffect2(() => {
-    if (isOpen) {
-      setDrawerMounted(true);
-      return void 0;
-    }
-    if (!drawerMounted) return void 0;
-    if (window.matchMedia("(prefers-reduced-motion: reduce)").matches) {
-      setDrawerMounted(false);
-      return void 0;
-    }
-    const timer = window.setTimeout(() => setDrawerMounted(false), animationDurationValue(theme, JumpyAnimationDuration.small) * 1e3 + 100);
-    return () => window.clearTimeout(timer);
-  }, [isOpen, drawerMounted]);
-  useEffect2(() => {
-    const closed = wasShown.current && !showDrawer;
-    wasShown.current = showDrawer;
-    if (!closed) return void 0;
-    const frame = window.requestAnimationFrame(() => {
-      if (document.activeElement && document.activeElement !== document.body) return;
-      rootRef.current?.querySelector(':scope > [data-jumpy-slot="app-shell-body"] > [data-jumpy-component="top-bar"] > [data-leading="menu"] button')?.focus();
-    });
-    return () => window.cancelAnimationFrame(frame);
-  }, [showDrawer]);
-  useEffect2(() => {
-    const element = largeTitleRef.current;
-    if (!showLargeTitle || !element || typeof IntersectionObserver === "undefined") return void 0;
-    const bar = rootRef.current?.querySelector(':scope > [data-jumpy-slot="app-shell-body"] > [data-jumpy-component="top-bar"]');
-    const barHeight = bar && bar.getBoundingClientRect().height > 0 ? bar.getBoundingClientRect().height : 0;
-    const observer = new IntersectionObserver(([entry]) => setLargeTitleCovered(!entry.isIntersecting), { rootMargin: `-${Math.round(barHeight)}px 0px 0px 0px` });
-    observer.observe(element);
-    return () => observer.disconnect();
-  }, [showLargeTitle, topBarProps.title]);
-  function closeOnNavigate(event) {
-    const item = event.target.closest?.('a[href], [data-jumpy-component="side-menu-item"]');
-    if (!item || item.hasAttribute("aria-expanded") || item.getAttribute("aria-disabled") === "true" || item.disabled) return;
-    setOpen(false);
-  }
-  const shellStyles = `
-${shell} { grid-template-columns: minmax(0, 1fr); }
-${shell} > [data-jumpy-slot='app-shell-sidebar'] { display: none; }
-${shell} [data-jumpy-slot='app-shell-actions'][data-variant='compact'] { display: inline-flex; }
-${shell} [data-jumpy-slot='app-shell-actions'][data-variant='full'] { display: none; }
-${shell} [data-jumpy-slot='app-shell-back'][data-variant='inline'] { display: none; }
-@media (min-width: ${breakpoint}px) {
-  ${shell} { grid-template-columns: ${width} minmax(0, 1fr); }
-  ${shell} > [data-jumpy-slot='app-shell-sidebar'] { display: flex; }
-  ${shell} [data-jumpy-slot='app-shell-actions'][data-variant='compact'] { display: none; }
-  ${shell} [data-jumpy-slot='app-shell-actions'][data-variant='full'] { display: inline-flex; }
-  ${shell} [data-jumpy-slot='app-shell-back'][data-variant='inline'] { display: flex; width: fit-content; }
-  ${shell} > [data-jumpy-slot='app-shell-body'] > [data-jumpy-component='tab-bar'] { display: none; }
-  ${shell} > [data-jumpy-slot='app-shell-body'] > [data-jumpy-component='top-bar'][data-mobile-only='true'] { display: none; }
-  ${shell} > [data-jumpy-slot='app-shell-body'] > [data-jumpy-component='top-bar'] > [data-leading='menu'] { display: none; }
-}`;
-  const topBarNode = /* @__PURE__ */ jsx2(
-    JumpTopBar,
-    {
-      ...topBarProps,
-      "data-mobile-only": topBarOnDesktop ? "false" : "true",
-      leading: resolvedLeading,
-      menuOpen: isOpen,
-      onMenu: () => setOpen(true),
-      title: topBarProps.title ?? brand,
-      subtitle: showLargeTitle ? void 0 : topBarProps.subtitle,
-      titleAlign: showLargeTitle || hasBack ? "center" : topBarProps.titleAlign,
-      titleHidden: showLargeTitle ? !largeTitleCovered : topBarProps.titleHidden,
-      "data-large-title": showLargeTitle ? "true" : void 0,
-      trailing: actions.length || topBarProps.trailing ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-        /* @__PURE__ */ jsx2(JumpyAppShellActions, { actions, variant: "compact", ariaLabels }),
-        showLargeTitle ? null : /* @__PURE__ */ jsx2(JumpyAppShellActions, { actions, variant: "full", ariaLabels }),
-        topBarProps.trailing
-      ] }) : void 0,
-      ariaLabels: { menu: ariaLabels.openNavigation, back: ariaLabels.back, ...topBarProps.ariaLabels || {} }
-    }
-  );
-  return /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ...props,
-      ref: rootRef,
-      "data-jumpy-component": "app-shell",
-      "data-jumpy-app-shell": shellId,
-      "data-navigation-open": isOpen ? "true" : "false",
-      className: cn(className),
-      style: {
-        display: "grid",
-        minHeight: "100dvh",
-        backgroundColor: "var(--jumpy-color-surface-canvas)",
-        color: "var(--jumpy-color-text-primary)",
-        fontFamily: theme.fontFamily.familyBase,
-        ...props.style || {}
-      },
-      children: [
-        /* @__PURE__ */ jsx2("style", { children: shellStyles }),
-        /* @__PURE__ */ jsxs2(
-          "aside",
-          {
-            "data-jumpy-slot": "app-shell-sidebar",
-            "aria-label": ariaLabels.navigation || "Navigation",
-            style: {
-              boxSizing: "border-box",
-              position: "sticky",
-              top: 0,
-              height: "100dvh",
-              flexDirection: "column",
-              overflow: "hidden",
-              borderRight: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-color-border-subtle)`,
-              backgroundColor: "var(--jumpy-color-surface-card)"
-            },
-            children: [
-              brand ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-brand", style: { flex: "0 0 auto", padding: spacingValue(theme, JumpySpacing.large2XL), borderBottom: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-color-border-subtle)` }, children: brand }) : null,
-              navigation ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-navigation", style: { flex: "1 1 auto", minHeight: 0, overflowY: "auto", overscrollBehavior: "contain", padding: spacingValue(theme, JumpySpacing.large) }, children: navigation }) : null,
-              sidebarFooter ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-sidebar-footer", style: { flex: "0 0 auto", padding: spacingValue(theme, JumpySpacing.large), borderTop: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-color-border-subtle)` }, children: sidebarFooter }) : null
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "app-shell-body", style: { display: "flex", flexDirection: "column", minWidth: 0, minHeight: "100dvh" }, children: [
-          topBar !== null ? topBarNode : null,
-          /* @__PURE__ */ jsxs2("main", { "data-jumpy-slot": "app-shell-content", style: { flex: 1, minWidth: 0 }, children: [
-            showLargeTitle ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-large-title", style: { padding: `${spacingValue(theme, JumpySpacing.smallXS)}px calc(var(--jumpy-app-shell-gutter, ${spacingValue(theme, JumpySpacing.large)}px) + env(safe-area-inset-right, 0px)) 0 calc(var(--jumpy-app-shell-gutter, ${spacingValue(theme, JumpySpacing.large)}px) + env(safe-area-inset-left, 0px))` }, children: /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "flex-end", justifyContent: "space-between", gap: spacingValue(theme, JumpySpacing.large), flexWrap: "wrap" }, children: [
-              /* @__PURE__ */ jsxs2("div", { style: { minWidth: 0 }, children: [
-                hasBack ? /* @__PURE__ */ jsx2(JumpyAppShellBack, { back, variant: "inline", ariaLabels }) : null,
-                /* @__PURE__ */ jsx2("h1", { ref: largeTitleRef, style: { margin: 0, ...textStyleValue(theme, JumpyTextStyle.displaySmallEmphasized), overflowWrap: "anywhere" }, children: topBarProps.title }),
-                topBarProps.subtitle ? /* @__PURE__ */ jsx2("p", { style: { margin: `${spacingValue(theme, JumpySpacing.small4XS)}px 0 0`, color: "var(--jumpy-color-text-secondary)", ...textStyleValue(theme, JumpyTextStyle.bodyMedium) }, children: topBarProps.subtitle }) : null
-              ] }),
-              /* @__PURE__ */ jsx2(JumpyAppShellActions, { actions, variant: "full", ariaLabels })
-            ] }) }) : null,
-            children
-          ] }),
-          tabBar && !hideTabBar ? tabBar : null
-        ] }),
-        showDrawer ? /* @__PURE__ */ jsx2(JumpyModalLayer, { onVisibleChange: setOpen, "data-jumpy-component": "app-shell-drawer-overlay", "data-state": closing ? "closing" : "open", style: { position: "fixed", inset: 0, zIndex: 60, backgroundColor: "var(--jumpy-color-surface-overlay)" }, children: /* @__PURE__ */ jsxs2(
-          "div",
-          {
-            role: "dialog",
-            "aria-modal": "true",
-            "aria-label": ariaLabels.navigation || "Navigation",
-            "data-jumpy-component": "app-shell-drawer",
-            "data-state": closing ? "closing" : "open",
-            onAnimationEnd: (event) => {
-              if (closing && event.target === event.currentTarget) setDrawerMounted(false);
-            },
-            onClick: closeOnNavigate,
-            onTouchStart: (event) => {
-              const touch = event.touches[0];
-              swipeStart.current = touch ? { x: touch.clientX, y: touch.clientY } : null;
-            },
-            onTouchEnd: (event) => {
-              const start = swipeStart.current;
-              const touch = event.changedTouches[0];
-              swipeStart.current = null;
-              if (!start || !touch) return;
-              const dx = touch.clientX - start.x;
-              const dy = touch.clientY - start.y;
-              if (dx < -spacingValue(theme, JumpySpacing.large4XL) && Math.abs(dx) > Math.abs(dy) * 1.5) setOpen(false);
-            },
-            style: {
-              boxSizing: "border-box",
-              position: "fixed",
-              inset: 0,
-              display: "flex",
-              flexDirection: "column",
-              width: "100vw",
-              height: "100dvh",
-              overflow: "hidden",
-              outline: "none",
-              backgroundColor: "var(--jumpy-color-surface-card)",
-              color: "var(--jumpy-color-text-primary)",
-              fontFamily: theme.fontFamily.familyBase
-            },
-            children: [
-              /* @__PURE__ */ jsx2(
-                JumpTopBar,
-                {
-                  "data-jumpy-slot": "app-shell-drawer-header",
-                  sticky: false,
-                  style: { flex: "0 0 auto" },
-                  leading: /* @__PURE__ */ jsx2(JumpIconButton, { variant: "borderless", "aria-label": ariaLabels.closeNavigation || "Close navigation", onClick: () => setOpen(false), children: /* @__PURE__ */ jsx2(JumpyNavigationIcon, { type: "close" }) }),
-                  title: brand
-                }
-              ),
-              /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-drawer-navigation", style: { flex: "1 1 auto", minHeight: 0, overflowY: "auto", overscrollBehavior: "contain", padding: spacingValue(theme, JumpySpacing.large) }, children: navigation }),
-              sidebarFooter ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "app-shell-drawer-footer", style: { flex: "0 0 auto", padding: `${spacingValue(theme, JumpySpacing.large)}px calc(${spacingValue(theme, JumpySpacing.large)}px + env(safe-area-inset-right, 0px)) calc(${spacingValue(theme, JumpySpacing.large)}px + env(safe-area-inset-bottom, 0px)) calc(${spacingValue(theme, JumpySpacing.large)}px + env(safe-area-inset-left, 0px))`, borderTop: `${borderWidthValue(theme, JumpyBorderWidth.small)}px solid var(--jumpy-color-border-subtle)`, backgroundColor: "var(--jumpy-color-surface-card)" }, children: sidebarFooter }) : null
-            ]
-          }
-        ) }) : null
-      ]
-    }
-  );
-}
-function JumpSectionHeader({ as, variant = "regular", description, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "li";
-  return /* @__PURE__ */ jsxs2(Component, { ...props, "data-jumpy-component": "section-header", className: cn(className), style: { display: "grid", gap: variant === "prominent" ? spacingValue(theme, JumpySpacing.small3XS) : 0, padding: `${spacingValue(theme, JumpySpacing.smallXS)}px ${spacingValue(theme, JumpySpacing.large)}px`, color: theme.color.textSecondary, ...props.style || {} }, children: [
-    /* @__PURE__ */ jsx2(JumpTypography, { variant: variant === "prominent" ? "bodyMediumEmphasized" : "labelSmallEmphasized", color: "secondary", children }),
-    variant === "prominent" && description ? /* @__PURE__ */ jsx2(JumpTypography, { variant: "bodySmall", color: "secondary", children: description }) : null
-  ] });
-}
-function JumpSectionFooter({ as, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "li";
-  return /* @__PURE__ */ jsx2(Component, { ...props, "data-jumpy-component": "section-footer", className: cn(className), style: { padding: `${spacingValue(theme, JumpySpacing.smallXS)}px ${spacingValue(theme, JumpySpacing.large)}px`, color: theme.color.textSecondary, ...props.style || {} }, children: /* @__PURE__ */ jsx2(JumpTypography, { variant: "bodySmall", color: "secondary", children }) });
-}
-function JumpTag({ size: size2 = "small", status = "regular", disabled = false, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const labelStyle = textStyleValue(theme, size2 === "medium" ? JumpyTextStyle.labelMediumEmphasized : JumpyTextStyle.labelSmallEmphasized);
-  return /* @__PURE__ */ jsx2(
-    "span",
-    {
-      ...props,
-      "data-jumpy-component": "tag",
-      "data-size": size2,
-      "data-status": status,
-      "data-disabled": disabled ? "true" : "false",
-      className: cn(className),
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        width: "fit-content",
-        minHeight: size2 === "medium" ? sizeValue(theme, JumpySize.small) : sizeValue(theme, JumpySize.small2XS),
-        padding: `${spacingValue(theme, JumpySpacing.small3XS)}px ${spacingValue(theme, JumpySpacing.smallXS)}px`,
-        borderRadius: radiusValue(theme, JumpyRadius.full),
-        borderWidth: borderWidthValue(theme, JumpyBorderWidth.small),
-        borderStyle: "solid",
-        opacity: disabled ? opacityValue(theme, JumpyOpacity.medium) : opacityValue(theme, JumpyOpacity.solid),
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: labelStyle.fontSize,
-        lineHeight: labelStyle.lineHeight,
-        fontWeight: labelStyle.fontWeight,
-        letterSpacing: labelStyle.letterSpacing,
-        ...getTagStatusStyles(theme, status),
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpChip({ selected = false, disabled = false, className = "", children, ...props }) {
-  const theme = useJumpyTheme();
-  const bodyMediumEmphasized = textStyleValue(theme, JumpyTextStyle.bodyMediumEmphasized);
-  return /* @__PURE__ */ jsx2(
-    "button",
-    {
-      ...props,
-      type: props.type || "button",
-      "data-jumpy-component": "chip",
-      "data-selected": selected ? "true" : "false",
-      disabled,
-      className: cn(className),
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        minHeight: sizeValue(theme, JumpySize.large),
-        padding: `${spacingValue(theme, JumpySpacing.small2XS)}px ${spacingValue(theme, JumpySpacing.large)}px`,
-        borderRadius: radiusValue(theme, JumpyRadius.full),
-        borderWidth: borderWidthValue(theme, JumpyBorderWidth.small),
-        borderStyle: "solid",
-        borderColor: selected ? theme.color.surfacePrimary : theme.color.borderStrong,
-        backgroundColor: selected ? theme.color.infoSurface : theme.color.surfaceField,
-        color: selected ? theme.color.surfacePrimary : theme.color.textPrimary,
-        opacity: disabled ? opacityValue(theme, JumpyOpacity.medium) : opacityValue(theme, JumpyOpacity.solid),
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: bodyMediumEmphasized.fontSize,
-        lineHeight: bodyMediumEmphasized.lineHeight,
-        fontWeight: bodyMediumEmphasized.fontWeight,
-        letterSpacing: bodyMediumEmphasized.letterSpacing,
-        cursor: disabled ? "not-allowed" : "pointer",
-        ...props.style || {}
-      },
-      children
-    }
-  );
-}
-function JumpCheckbox({ label, children, checked, defaultChecked = false, indeterminate = false, onCheckedChange, onIndeterminateChange, labelPlacement = "end", innerClasses = {}, className = "", disabled = false, readOnly = false, style, ...props }) {
-  const theme = useJumpyTheme();
-  const labelLarge = textStyleValue(theme, JumpyTextStyle.labelLarge);
-  const inputRef = useRef2(null);
-  const [uncontrolledChecked, setUncontrolledChecked] = useState2(defaultChecked);
-  const isControlled = checked !== void 0;
-  const isChecked = Boolean(isControlled ? checked : uncontrolledChecked);
-  const isReadonly = readOnly && !disabled;
-  const activeDefault = theme.selectors.active.default;
-  const activeDisabled = theme.selectors.active.disabled;
-  const activeReadOnly = theme.selectors.active.readOnly;
-  const inactiveDefault = theme.selectors.inactive.default;
-  const inactiveDisabled = theme.selectors.inactive.disabled;
-  const inactiveReadOnly = theme.selectors.inactive.readOnly;
-  const labelContent = children ?? label;
-  useEffect2(() => {
-    if (inputRef.current) inputRef.current.indeterminate = indeterminate;
-  }, [indeterminate]);
-  const stateTokens = isChecked || indeterminate ? disabled ? activeDisabled : isReadonly ? activeReadOnly : activeDefault : disabled ? inactiveDisabled : isReadonly ? inactiveReadOnly : inactiveDefault;
-  function handleChange(event) {
-    if (isReadonly) {
-      if (inputRef.current) inputRef.current.indeterminate = indeterminate;
-      return;
-    }
-    if (indeterminate) onIndeterminateChange?.(false);
-    if (!isControlled) setUncontrolledChecked(event.target.checked);
-    onCheckedChange?.(event.target.checked);
-    props.onChange?.(event);
-  }
-  return /* @__PURE__ */ jsxs2(
-    "label",
-    {
-      "data-jumpy-component": "checkbox",
-      "data-checked": isChecked || indeterminate ? "true" : "false",
-      "data-disabled": disabled ? "true" : void 0,
-      "data-readonly": isReadonly ? "true" : void 0,
-      "data-label-placement": labelPlacement,
-      className: cn(className),
-      style: {
-        "--jumpy-cmp-checkbox-container-size": `${sizeValue(theme, JumpySize.large)}px`,
-        "--jumpy-cmp-checkbox-container-radius": `${radiusValue(theme, JumpyRadius.medium)}px`,
-        "--jumpy-cmp-checkbox-input-size": `${sizeValue(theme, JumpySize.smallXS)}px`,
-        "--jumpy-cmp-checkbox-input-radius": `${radiusValue(theme, JumpyRadius.small2XS)}px`,
-        "--jumpy-cmp-checkbox-label-gap-size": `${spacingValue(theme, JumpySpacing.smallXS)}px`,
-        "--jumpy-cmp-checkbox-label-color": stateTokens.text,
-        "--jumpy-cmp-checkbox-container-color": stateTokens.surface || activeDefault.surface,
-        "--jumpy-cmp-checkbox-container-bg": "transparent",
-        "--jumpy-cmp-checkbox-icon-fill": stateTokens.icon || activeDefault.icon || theme.color.textOnPrimary,
-        "--jumpy-cmp-checkbox-input-border-color": stateTokens.border || inactiveDefault.border,
-        "--jumpy-cmp-checkbox-hover-ring-color": "var(--jumpy-selectors-inactive-hover-hover-ring, var(--jumpy-color-feedback-info-surface))",
-        "--jumpy-cmp-checkbox-hover-border-color": "var(--jumpy-selectors-inactive-hover-border, var(--jumpy-color-focus-border))",
-        "--jumpy-cmp-checkbox-hover-surface-color": "var(--jumpy-selectors-active-hover-surface, var(--jumpy-color-surface-primary))",
-        "--jumpy-cmp-checkbox-focus-border-color": "var(--jumpy-selectors-inactive-focus-border, var(--jumpy-color-focus-border))",
-        "--jumpy-cmp-checkbox-focus-ring-color": "var(--jumpy-selectors-inactive-focus-focus-ring, var(--jumpy-color-focus-ring))",
-        "--jumpy-cmp-checkbox-active-focus-ring-color": "var(--jumpy-selectors-active-focus-focus-ring, var(--jumpy-color-focus-ring))",
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: labelLarge.fontSize,
-        lineHeight: labelLarge.lineHeight,
-        fontWeight: labelLarge.fontWeight,
-        letterSpacing: labelLarge.letterSpacing,
-        ...style || {}
-      },
-      children: [
-        /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "checkbox-container", className: innerClasses.container?.className, style: innerClasses.container?.style, children: [
-          /* @__PURE__ */ jsx2(
-            "input",
-            {
-              ...props,
-              ref: (node) => {
-                inputRef.current = node;
-                if (typeof props.ref === "function") props.ref(node);
-                else if (props.ref) props.ref.current = node;
-              },
-              type: "checkbox",
-              "data-jumpy-slot": "checkbox-input",
-              className: innerClasses.input?.className,
-              checked: isChecked,
-              disabled,
-              readOnly: isReadonly,
-              "aria-readonly": isReadonly || void 0,
-              onChange: handleChange
-            }
-          ),
-          isChecked || indeterminate ? /* @__PURE__ */ jsx2("svg", { "data-jumpy-slot": "checkbox-icon", className: innerClasses.icons?.className, style: innerClasses.icons?.style, viewBox: "0 0 24 24", "aria-hidden": "true", focusable: "false", children: indeterminate ? /* @__PURE__ */ jsx2("path", { d: "M6 11h12v2H6z" }) : /* @__PURE__ */ jsx2("path", { d: "M9.4 16.6 4.8 12l1.4-1.4 3.2 3.2 8.4-8.4L19.2 6.8z" }) }) : null
-        ] }),
-        labelContent ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "checkbox-label", children: labelContent }) : null
-      ]
-    }
-  );
-}
-function JumpSwitch({ label, children, checked, defaultChecked = false, onCheckedChange, labelPlacement = "end", innerClasses = {}, className = "", disabled = false, readOnly = false, style, ...props }) {
-  const theme = useJumpyTheme();
-  const bodyMedium = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  const [uncontrolledChecked, setUncontrolledChecked] = useState2(Boolean(defaultChecked));
-  const isControlled = checked !== void 0;
-  const isChecked = Boolean(isControlled ? checked : uncontrolledChecked);
-  const isReadonly = readOnly && !disabled;
-  const selectorState = disabled ? "disabled" : isReadonly ? "readOnly" : "default";
-  const selectorTokens = isChecked ? theme.selectors.active[selectorState] : theme.selectors.inactive[selectorState];
-  const labelContent = children ?? label;
-  return /* @__PURE__ */ jsxs2(
-    "label",
-    {
-      "data-jumpy-component": "switch",
-      "data-checked": isChecked ? "true" : "false",
-      "data-disabled": disabled ? "true" : void 0,
-      "data-readonly": isReadonly ? "true" : void 0,
-      "data-label-placement": labelPlacement,
-      className: cn(className),
-      style: {
-        "--jumpy-cmp-switch-thumb-size": `${sizeValue(theme, JumpySize.small2XS)}px`,
-        "--jumpy-cmp-switch-thumb-size-checked": `${sizeValue(theme, JumpySize.small)}px`,
-        "--jumpy-cmp-switch-track-width": `${sizeValue(theme, JumpySize.large2XL)}px`,
-        "--jumpy-cmp-switch-track-bg": selectorTokens.surface,
-        "--jumpy-cmp-switch-track-border": selectorTokens.border,
-        "--jumpy-cmp-switch-thumb-bg": selectorTokens.handle || selectorTokens.icon || theme.color.textOnPrimary,
-        "--jumpy-cmp-switch-icon-fill": selectorTokens.surface,
-        "--jumpy-cmp-switch-label-color": selectorTokens.text,
-        "--jumpy-cmp-switch-hover-track-bg": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-hover-surface)`,
-        "--jumpy-cmp-switch-hover-track-border": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-hover-border)`,
-        "--jumpy-cmp-switch-hover-thumb-bg": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-hover-handle)`,
-        "--jumpy-cmp-switch-focus-ring": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-focus-focus-ring)`,
-        "--jumpy-cmp-switch-focus-track-bg": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-focus-surface)`,
-        "--jumpy-cmp-switch-focus-track-border": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-focus-border)`,
-        "--jumpy-cmp-switch-focus-thumb-bg": `var(--jumpy-selectors-${isChecked ? "active" : "inactive"}-focus-handle)`,
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: bodyMedium.fontSize,
-        lineHeight: bodyMedium.lineHeight,
-        fontWeight: bodyMedium.fontWeight,
-        ...style || {}
-      },
-      children: [
-        /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "switch-container", className: innerClasses.container?.className, style: innerClasses.container?.style, children: [
-          /* @__PURE__ */ jsx2(
-            "input",
-            {
-              ...props,
-              type: "checkbox",
-              role: "switch",
-              checked: isChecked,
-              disabled,
-              readOnly: isReadonly,
-              "aria-checked": isChecked,
-              "aria-readonly": isReadonly || void 0,
-              "data-jumpy-slot": "switch-input",
-              className: innerClasses.input?.className,
-              onChange: (event) => {
-                if (isReadonly) return;
-                if (!isControlled) setUncontrolledChecked(event.target.checked);
-                onCheckedChange?.(event.target.checked);
-                props.onChange?.(event);
-              }
-            }
-          ),
-          /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "switch-track", className: innerClasses.track?.className, style: innerClasses.track?.style, children: /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "switch-thumb", className: innerClasses.thumb?.className, style: innerClasses.thumb?.style, children: /* @__PURE__ */ jsx2("svg", { "data-jumpy-slot": "switch-icon", className: innerClasses.icon?.className, style: innerClasses.icon?.style, viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ jsx2("path", { d: "M6 10.25 8.6 12.85 14 7.45", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }) })
-        ] }),
-        labelContent ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "switch-label", children: labelContent }) : null
-      ]
-    }
-  );
-}
-function JumpRadioGroup({ name, value, defaultValue, onValueChange, options, className = "", disabled = false, readOnly = false, direction = "vertical", innerClasses = {}, ...props }) {
-  const theme = useJumpyTheme();
-  const labelLarge = textStyleValue(theme, JumpyTextStyle.labelLarge);
-  const isReadonly = readOnly && !disabled;
-  const generatedName = useId();
-  const validName = name || generatedName;
-  const [uncontrolledValue, setUncontrolledValue] = useState2(defaultValue ?? "");
-  const isControlled = value !== void 0;
-  const selectedValue = isControlled ? value : uncontrolledValue;
-  return /* @__PURE__ */ jsx2("div", { ...props, role: "radiogroup", "aria-readonly": isReadonly || void 0, "aria-orientation": direction === "horizontal" ? "horizontal" : "vertical", "data-jumpy-component": "radio-group", "data-direction": direction, className: cn(className), style: { display: "flex", flexDirection: direction === "horizontal" ? "row" : "column", gap: spacingValue(theme, JumpySpacing.medium), ...props.style || {} }, onChange: (event) => {
-    if (isReadonly || event.defaultPrevented) return;
-    const target = event.target;
-    if (target?.type === "radio" && target.name === validName) {
-      if (!isControlled) setUncontrolledValue(target.value);
-      onValueChange?.(target.value);
-    }
-    props.onChange?.(event);
-  }, children: options.map((option) => {
-    const optionDisabled = disabled || option.disabled;
-    const optionSelected = selectedValue === option.value;
-    const selectorState = optionDisabled ? "disabled" : isReadonly ? "readOnly" : "default";
-    const selectorTokens = optionSelected ? theme.selectors.active[selectorState] : theme.selectors.inactive[selectorState];
-    return /* @__PURE__ */ jsxs2(
-      "label",
-      {
-        "data-jumpy-component": "radio",
-        "data-checked": optionSelected ? "true" : "false",
-        "data-disabled": optionDisabled ? "true" : void 0,
-        "data-readonly": isReadonly ? "true" : void 0,
-        style: {
-          "--jumpy-cmp-radio-label-color": selectorTokens.text,
-          "--jumpy-cmp-radio-input-border-color": selectorTokens.border,
-          "--jumpy-cmp-radio-dot-color": optionSelected ? selectorTokens.surface : "transparent",
-          "--jumpy-cmp-radio-container-bg": "transparent",
-          "--jumpy-cmp-radio-hover-ring-color": `var(--jumpy-selectors-${optionSelected ? "active" : "inactive"}-hover-hover-ring)`,
-          "--jumpy-cmp-radio-hover-border-color": `var(--jumpy-selectors-${optionSelected ? "active" : "inactive"}-hover-border)`,
-          "--jumpy-cmp-radio-hover-dot-color": `var(--jumpy-selectors-${optionSelected ? "active" : "inactive"}-hover-surface)`,
-          "--jumpy-cmp-radio-focus-ring-color": `var(--jumpy-selectors-${optionSelected ? "active" : "inactive"}-focus-focus-ring)`,
-          "--jumpy-cmp-radio-focus-border-color": `var(--jumpy-selectors-${optionSelected ? "active" : "inactive"}-focus-border)`,
-          fontFamily: theme.fontFamily.familyBase,
-          fontSize: labelLarge.fontSize,
-          lineHeight: labelLarge.lineHeight,
-          fontWeight: labelLarge.fontWeight,
-          letterSpacing: labelLarge.letterSpacing
-        },
-        children: [
-          /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "radio-container", className: innerClasses.container?.className, style: innerClasses.container?.style, children: /* @__PURE__ */ jsx2("input", { type: "radio", name: validName, value: option.value, checked: optionSelected, disabled: optionDisabled, "aria-readonly": isReadonly || void 0, readOnly: isReadonly || void 0, "data-jumpy-slot": "radio-input", className: innerClasses.input?.className, style: innerClasses.input?.style, onChange: () => {
-          } }) }),
-          /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "radio-label", className: innerClasses.label?.className, style: innerClasses.label?.style, children: option.label })
-        ]
-      },
-      option.value
-    );
-  }) });
-}
-function toDateValue(value) {
-  if (value === null || value === void 0 || value === "") return null;
-  const date = value instanceof Date ? value : new Date(value);
-  return Number.isNaN(date.getTime()) ? null : date;
-}
-function sameDay(a, b) {
-  if (!a || !b) return false;
-  return a.getFullYear() === b.getFullYear() && a.getMonth() === b.getMonth() && a.getDate() === b.getDate();
-}
-function formatDateValue(value, format = "MM/dd/yyyy") {
-  const date = toDateValue(value);
-  if (!date) return "";
-  const parts = {
-    dd: String(date.getDate()).padStart(2, "0"),
-    MM: String(date.getMonth() + 1).padStart(2, "0"),
-    yyyy: String(date.getFullYear())
-  };
-  return format.replace(/yyyy|MM|dd/g, (token) => parts[token]);
-}
-function formatTimeValue(value, format = "HH:mm") {
-  const date = toDateValue(value);
-  if (!date) return "";
-  const hours24 = date.getHours();
-  const minutes = String(date.getMinutes()).padStart(2, "0");
-  const period = hours24 >= 12 ? "PM" : "AM";
-  const hours12 = hours24 % 12 || 12;
-  return format.includes("aa") ? format.replace("hh", String(hours12).padStart(2, "0")).replace("mm", minutes).replace("aa", period) : format.replace("HH", String(hours24).padStart(2, "0")).replace("mm", minutes);
-}
-function parseDateValue(text, format = "MM/dd/yyyy") {
-  const value = text.trim();
-  if (!value) return null;
-  const activeFormat = Array.isArray(format) ? format[0] : format;
-  const escaped = activeFormat.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-  const pattern = escaped.replace("dd", "(?<dd>\\d{1,2})").replace("MM", "(?<MM>\\d{1,2})").replace("yyyy", "(?<yyyy>\\d{4})");
-  const match = value.match(new RegExp(`^${pattern}$`));
-  if (!match?.groups) return null;
-  const day = Number(match.groups.dd);
-  const month = Number(match.groups.MM) - 1;
-  const year = Number(match.groups.yyyy);
-  const date = new Date(year, month, day);
-  return date.getFullYear() === year && date.getMonth() === month && date.getDate() === day ? date : null;
-}
-function parseTimeValue(text, format = "HH:mm") {
-  const value = text.trim();
-  if (!value) return null;
-  const usesPeriod = format.includes("aa");
-  const match = usesPeriod ? value.match(/^(\d{1,2}):(\d{2})\s*(AM|PM)$/i) : value.match(/^(\d{1,2}):(\d{2})$/);
-  if (!match) return null;
-  let hour = Number(match[1]);
-  const minute = Number(match[2]);
-  if (usesPeriod) {
-    if (hour < 1 || hour > 12) return null;
-    const period = match[3].toUpperCase();
-    hour = period === "PM" ? hour % 12 + 12 : hour % 12;
-  }
-  if (hour > 23 || minute > 59) return null;
-  const date = /* @__PURE__ */ new Date();
-  date.setHours(hour, minute, 0, 0);
-  return date;
-}
-function coerceDateOutput(date, sample) {
-  return typeof sample === "number" ? date?.getTime() ?? null : date;
-}
-function PickerTrailingIcon({ type, open }) {
-  if (type === "time") {
-    return /* @__PURE__ */ jsxs2("svg", { "data-jumpy-stroke-icon": "true", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", style: { display: "block", fill: "none" }, children: [
-      /* @__PURE__ */ jsx2("path", { d: "M8 14A6 6 0 1 0 8 2a6 6 0 0 0 0 12Z", fill: "none", stroke: "currentColor", strokeWidth: "1.5" }),
-      /* @__PURE__ */ jsx2("path", { d: "M8 4.75V8l2.25 1.5", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs2("svg", { width: "16", height: "16", viewBox: "0 0 16 16", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", style: { display: "block" }, children: [
-    /* @__PURE__ */ jsx2("path", { d: "M4.25 2.5v2M11.75 2.5v2M3.25 6.25h9.5M3.75 3.75h8.5c.69 0 1.25.56 1.25 1.25v7.25c0 .69-.56 1.25-1.25 1.25h-8.5c-.69 0-1.25-.56-1.25-1.25V5c0-.69.56-1.25 1.25-1.25Z", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }),
-    open ? /* @__PURE__ */ jsx2("path", { d: "M6 10.5 7.25 11.75 10.25 8.75", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) : null
-  ] });
-}
-function getMonthDays(viewDate) {
-  const year = viewDate.getFullYear();
-  const month = viewDate.getMonth();
-  const firstDay = new Date(year, month, 1);
-  const leading = (firstDay.getDay() + 6) % 7;
-  const start = new Date(year, month, 1 - leading);
-  return Array.from({ length: 42 }, (_, index) => new Date(start.getFullYear(), start.getMonth(), start.getDate() + index));
-}
-function dateIsUnavailable(date, { minDate, maxDate, disabledDates = [], isDateDisabled }) {
-  const min = toDateValue(minDate);
-  const max = toDateValue(maxDate);
-  if (min && date < new Date(min.getFullYear(), min.getMonth(), min.getDate())) return true;
-  if (max && date > new Date(max.getFullYear(), max.getMonth(), max.getDate())) return true;
-  if (disabledDates.some((disabledDate) => sameDay(date, toDateValue(disabledDate)))) return true;
-  return Boolean(isDateDisabled?.(date));
-}
-function JumpDatePicker({ label = "Date", hint, value, defaultValue = null, onChange, open, onOpenChange, format = "MM/dd/yyyy", minDate, maxDate, disabledDates = [], isDateDisabled, labels = {}, disabled = false, readOnly = false, className = "", status = "regular", error = false, hideClearIcon = false, onClear, ...props }) {
-  const theme = useJumpyTheme();
-  const [internalValue, setInternalValue] = useState2(defaultValue);
-  const [internalOpen, setInternalOpen] = useState2(false);
-  const isControlled = value !== void 0;
-  const selectedDate = toDateValue(isControlled ? value : internalValue);
-  const selectedTime = selectedDate?.getTime() ?? null;
-  const [viewDate, setViewDate] = useState2(selectedDate || /* @__PURE__ */ new Date());
-  const isOpen = open ?? internalOpen;
-  const resolvedFormat = Array.isArray(format) ? format[0] : format;
-  const inputValue = formatDateValue(selectedDate, resolvedFormat);
-  const [draft, setDraft] = useState2(inputValue);
-  const typedValue = useRef2(void 0);
-  useEffect2(() => {
-    if (typedValue.current !== selectedTime) setDraft(inputValue);
-    typedValue.current = void 0;
-    if (selectedTime !== null) setViewDate(new Date(selectedTime));
-  }, [selectedTime, inputValue, resolvedFormat]);
-  const weekdays = ["Mo", "Tu", "We", "Th", "Fr", "Sa", "Su"];
-  const dayCells = getMonthDays(viewDate);
-  const { refs, floatingStyles } = useFloating({
-    open: isOpen,
-    onOpenChange: setOpen,
-    placement: "bottom-start",
-    strategy: "fixed",
-    whileElementsMounted: autoUpdate,
-    middleware: [offset(spacingValue(theme, JumpySpacing.smallXS)), flip({ padding: spacingValue(theme, JumpySpacing.medium) })]
-  });
-  function setOpen(next) {
-    setInternalOpen(next);
-    onOpenChange?.(next);
-  }
-  function commit(date) {
-    if (date && dateIsUnavailable(date, { minDate, maxDate, disabledDates, isDateDisabled })) return;
-    const next = coerceDateOutput(date, value ?? defaultValue);
-    typedValue.current = void 0;
-    if (!isControlled) setInternalValue(next);
-    setDraft(isControlled ? inputValue : formatDateValue(date, resolvedFormat));
-    onChange?.(next);
-    setOpen(false);
-  }
-  const trailing = readOnly ? void 0 : /* @__PURE__ */ jsx2(PickerTrailingIcon, { type: "date", open: isOpen });
-  return /* @__PURE__ */ jsxs2("div", { ref: refs.setReference, "data-jumpy-component": "date-picker", style: { position: "relative", width: "100%", maxWidth: "100%" }, children: [
-    /* @__PURE__ */ jsx2(JumpField, { label, hint, status, error, hideClearIcon, onClear, className, trailing, children: /* @__PURE__ */ jsx2(
-      JumpInput,
-      {
-        ...props,
-        role: "combobox",
-        "aria-expanded": isOpen,
-        "aria-haspopup": "dialog",
-        readOnly,
-        disabled,
-        "data-has-value": selectedTime !== null,
-        value: draft,
-        placeholder: props.placeholder || (Array.isArray(format) ? format[0] : format),
-        autoComplete: "off",
-        inputMode: "numeric",
-        onChange: (event) => {
-          const text = event.target.value;
-          setDraft(text);
-          const parsedDate = parseDateValue(text, format);
-          typedValue.current = void 0;
-          if (!text.trim() || parsedDate && !dateIsUnavailable(parsedDate, { minDate, maxDate, disabledDates, isDateDisabled })) {
-            const next = coerceDateOutput(parsedDate, value ?? defaultValue);
-            const nextTime = parsedDate?.getTime() ?? null;
-            if (nextTime !== selectedTime) typedValue.current = nextTime;
-            if (!isControlled) setInternalValue(next);
-            onChange?.(next);
-          }
-        },
-        onBlur: (event) => {
-          typedValue.current = void 0;
-          setDraft(inputValue);
-          props.onBlur?.(event);
-        },
-        onClick: (event) => {
-          if (!readOnly) setOpen(!isOpen);
-          props.onClick?.(event);
-        },
-        onKeyDown: (event) => {
-          if ((event.key === "ArrowDown" || event.key === "Enter") && !readOnly) {
-            event.preventDefault();
-            setOpen(true);
-          }
-          if (event.key === "Escape") setOpen(false);
-          props.onKeyDown?.(event);
-        }
-      }
-    ) }),
-    isOpen && !disabled && !readOnly ? /* @__PURE__ */ jsx2(JumpyPortal, { children: /* @__PURE__ */ jsxs2("div", { ref: refs.setFloating, role: "dialog", "aria-label": label, style: { ...floatingStyles, zIndex: JUMPY_POPUP_Z_INDEX, width: sizeValue(theme, JumpySize.large8XL) * 2.5, maxWidth: "calc(100vw - 32px)", overflow: "visible", borderRadius: radiusValue(theme, JumpyRadius.smallXS), backgroundColor: "var(--jumpy-card-inactive-default-surface, var(--jumpy-color-surface-card))", color: "var(--jumpy-card-inactive-default-text, var(--jumpy-color-text-primary))", boxShadow: theme.shadow.positiveMedium, padding: `${spacingValue(theme, JumpySpacing.small3XS)}px 0` }, children: [
-      /* @__PURE__ */ jsxs2("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", gap: spacingValue(theme, JumpySpacing.medium), padding: spacingValue(theme, JumpySpacing.small3XS) }, children: [
-        /* @__PURE__ */ jsx2(JumpIconButton, { variant: "borderless", "aria-label": "Previous", onClick: () => setViewDate(new Date(viewDate.getFullYear(), viewDate.getMonth() - 1, 1)), children: "\u2039" }),
-        /* @__PURE__ */ jsx2("strong", { style: { fontFamily: theme.fontFamily.familyBase, color: "inherit" }, children: viewDate.toLocaleDateString(void 0, { month: "long", year: "numeric" }) }),
-        /* @__PURE__ */ jsx2(JumpIconButton, { variant: "borderless", "aria-label": "Next", onClick: () => setViewDate(new Date(viewDate.getFullYear(), viewDate.getMonth() + 1, 1)), children: "\u203A" })
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: spacingValue(theme, JumpySpacing.small3XS), padding: `0 ${spacingValue(theme, JumpySpacing.small3XS)}px` }, children: [
-        weekdays.map((weekday) => /* @__PURE__ */ jsx2("span", { style: { color: theme.color.textSecondary, textAlign: "center", fontSize: textStyleValue(theme, JumpyTextStyle.labelSmall).fontSize, fontWeight: theme.fontFamily.labelSmall.fontWeight }, children: weekday }, weekday)),
-        dayCells.map((date) => {
-          const outside = date.getMonth() !== viewDate.getMonth();
-          const selected = sameDay(date, selectedDate);
-          const unavailable = dateIsUnavailable(date, { minDate, maxDate, disabledDates, isDateDisabled });
-          return /* @__PURE__ */ jsx2("button", { type: "button", disabled: unavailable, onClick: () => commit(date), style: { minHeight: sizeValue(theme, JumpySize.large), border: 0, borderRadius: radiusValue(theme, JumpyRadius.small), backgroundColor: selected ? "var(--jumpy-interactive-active-regular-default-surface, var(--jumpy-color-surface-primary))" : "transparent", color: selected ? "var(--jumpy-interactive-active-regular-default-text, var(--jumpy-color-text-on-primary))" : outside ? "var(--jumpy-card-inactive-default-subtext, var(--jumpy-color-text-secondary))" : "var(--jumpy-card-inactive-default-text, var(--jumpy-color-text-primary))", opacity: unavailable ? opacityValue(theme, JumpyOpacity.medium) : outside ? opacityValue(theme, JumpyOpacity.strong) : opacityValue(theme, JumpyOpacity.solid), cursor: unavailable ? "not-allowed" : "pointer", fontFamily: theme.fontFamily.familyBase }, children: date.getDate() }, date.toISOString());
-        })
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { style: { display: "flex", justifyContent: "flex-end", gap: spacingValue(theme, JumpySpacing.smallXS), padding: spacingValue(theme, JumpySpacing.large) }, children: [
-        /* @__PURE__ */ jsx2(JumpButton, { variant: "tertiary", onClick: () => setOpen(false), children: labels.cancelButton || "Cancel" }),
-        /* @__PURE__ */ jsx2(JumpButton, { variant: "borderless", onClick: () => commit(/* @__PURE__ */ new Date()), children: "Today" })
-      ] })
-    ] }) }) : null
-  ] });
-}
-function JumpTimePicker({ label = "Time", hint, value, defaultValue = null, onChange, open, onOpenChange, format, twentyFourHours = true, labels = {}, disabled = false, readOnly = false, className = "", status = "regular", error = false, hideClearIcon = false, onClear, ...props }) {
-  const theme = useJumpyTheme();
-  const resolvedFormat = format || (twentyFourHours ? "HH:mm" : "hh:mm aa");
-  const [internalValue, setInternalValue] = useState2(defaultValue);
-  const [internalOpen, setInternalOpen] = useState2(false);
-  const isControlled = value !== void 0;
-  const selectedDate = toDateValue(isControlled ? value : internalValue);
-  const selectedTime = selectedDate?.getTime() ?? null;
-  const inputValue = formatTimeValue(selectedDate, resolvedFormat);
-  const [draft, setDraft] = useState2(inputValue);
-  const typedValue = useRef2(void 0);
-  useEffect2(() => {
-    if (typedValue.current !== selectedTime) setDraft(inputValue);
-    typedValue.current = void 0;
-  }, [selectedTime, inputValue, resolvedFormat]);
-  const isOpen = open ?? internalOpen;
-  const hours = Array.from({ length: twentyFourHours ? 24 : 12 }, (_, index) => String(twentyFourHours ? index : index + 1).padStart(2, "0"));
-  const minutes = Array.from({ length: 60 }, (_, index) => String(index).padStart(2, "0"));
-  const currentHour = selectedDate ? selectedDate.getHours() : 0;
-  const currentMinute = selectedDate ? selectedDate.getMinutes() : 0;
-  const displayHour = twentyFourHours ? currentHour : currentHour % 12 || 12;
-  const currentPeriod = currentHour >= 12 ? "PM" : "AM";
-  const { refs, floatingStyles } = useFloating({
-    open: isOpen,
-    onOpenChange: setOpen,
-    placement: "bottom-start",
-    strategy: "fixed",
-    whileElementsMounted: autoUpdate,
-    middleware: [offset(spacingValue(theme, JumpySpacing.smallXS)), flip({ padding: spacingValue(theme, JumpySpacing.medium) })]
-  });
-  function setOpen(next) {
-    setInternalOpen(next);
-    onOpenChange?.(next);
-  }
-  function commit(part, rawValue) {
-    const next = selectedDate ? new Date(selectedDate) : /* @__PURE__ */ new Date();
-    if (part === "hour") {
-      const hour = Number(rawValue);
-      next.setHours(twentyFourHours ? hour : currentPeriod === "PM" ? hour % 12 + 12 : hour % 12);
-    }
-    if (part === "minute") next.setMinutes(Number(rawValue));
-    if (part === "period") {
-      const base = next.getHours() % 12;
-      next.setHours(rawValue === "PM" ? base + 12 : base);
-    }
-    next.setSeconds(0, 0);
-    const output = coerceDateOutput(next, value ?? defaultValue);
-    typedValue.current = void 0;
-    if (!isControlled) setInternalValue(output);
-    setDraft(isControlled ? inputValue : formatTimeValue(next, resolvedFormat));
-    onChange?.(output);
-  }
-  const trailing = readOnly ? void 0 : /* @__PURE__ */ jsx2(PickerTrailingIcon, { type: "time", open: isOpen });
-  return /* @__PURE__ */ jsxs2("div", { ref: refs.setReference, "data-jumpy-component": "time-picker", style: { position: "relative", width: "100%", maxWidth: "100%" }, children: [
-    /* @__PURE__ */ jsx2(JumpField, { label, hint, status, error, hideClearIcon, onClear, className, trailing, children: /* @__PURE__ */ jsx2(
-      JumpInput,
-      {
-        ...props,
-        role: "combobox",
-        "aria-expanded": isOpen,
-        "aria-haspopup": "dialog",
-        readOnly,
-        disabled,
-        "data-has-value": selectedTime !== null,
-        value: draft,
-        placeholder: props.placeholder || resolvedFormat,
-        autoComplete: "off",
-        inputMode: resolvedFormat.includes("aa") ? "text" : "numeric",
-        onChange: (event) => {
-          const text = event.target.value;
-          setDraft(text);
-          const parsedDate = parseTimeValue(text, resolvedFormat);
-          typedValue.current = void 0;
-          if (!text.trim() || parsedDate) {
-            const output = coerceDateOutput(parsedDate, value ?? defaultValue);
-            const nextTime = parsedDate?.getTime() ?? null;
-            if (nextTime !== selectedTime) typedValue.current = nextTime;
-            if (!isControlled) setInternalValue(output);
-            onChange?.(output);
-          }
-        },
-        onBlur: (event) => {
-          typedValue.current = void 0;
-          setDraft(inputValue);
-          props.onBlur?.(event);
-        },
-        onClick: (event) => {
-          if (!readOnly) setOpen(!isOpen);
-          props.onClick?.(event);
-        },
-        onKeyDown: (event) => {
-          if ((event.key === "ArrowDown" || event.key === "Enter") && !readOnly) {
-            event.preventDefault();
-            setOpen(true);
-          }
-          if (event.key === "Escape") setOpen(false);
-          props.onKeyDown?.(event);
-        }
-      }
-    ) }),
-    isOpen && !disabled && !readOnly ? /* @__PURE__ */ jsx2(JumpyPortal, { children: /* @__PURE__ */ jsxs2("div", { ref: refs.setFloating, role: "dialog", "aria-label": label, style: { ...floatingStyles, zIndex: JUMPY_POPUP_Z_INDEX, overflow: "visible", borderRadius: radiusValue(theme, JumpyRadius.smallXS), backgroundColor: `var(--jumpy-non-interactive-background-alternative, var(--jumpy-color-non-interactive-background-alternative, ${theme.color.surfaceCard}))`, color: "var(--jumpy-card-inactive-default-text, var(--jumpy-color-text-primary))", boxShadow: theme.shadow.positiveMedium, padding: `${spacingValue(theme, JumpySpacing.small3XS)}px 0`, minWidth: 260 }, children: [
-      /* @__PURE__ */ jsxs2("div", { style: { display: "flex", position: "relative", justifyContent: "center", alignItems: "center", gap: spacingValue(theme, JumpySpacing.small), padding: `${spacingValue(theme, JumpySpacing.zero)}px ${spacingValue(theme, JumpySpacing.zero)}px`, overflow: "hidden" }, children: [
-        /* @__PURE__ */ jsx2("div", { "aria-hidden": "true", style: { position: "absolute", left: 0, right: 0, top: "50%", height: sizeValue(theme, JumpySize.medium), transform: "translateY(-50%)", backgroundColor: "var(--jumpy-interactive-active-regular-default-surface)", pointerEvents: "none" } }),
-        /* @__PURE__ */ jsx2(TimeColumn, { label: "Hour", values: hours, selected: String(displayHour).padStart(2, "0"), onSelect: (next) => commit("hour", next), theme }),
-        /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", style: { zIndex: 1, display: "flex", alignItems: "center", justifyContent: "center", transform: "translateY(-0.1em)", width: sizeValue(theme, JumpySize.smallXS), height: sizeValue(theme, JumpySize.large), padding: `${spacingValue(theme, JumpySpacing.small3XS)}px 0`, color: "var(--jumpy-interactive-active-regular-default-text)", fontFamily: theme.fontFamily.familyBase, fontSize: textStyleValue(theme, JumpyTextStyle.bodyLargeEmphasized).fontSize, fontWeight: textStyleValue(theme, JumpyTextStyle.bodyLargeEmphasized).fontWeight }, children: ":" }),
-        /* @__PURE__ */ jsx2(TimeColumn, { label: "Minute", values: minutes, selected: String(currentMinute).padStart(2, "0"), onSelect: (next) => commit("minute", next), theme }),
-        !twentyFourHours ? /* @__PURE__ */ jsx2(TimeColumn, { label: "Period", values: ["AM", "PM"], selected: currentPeriod, onSelect: (next) => commit("period", next), theme }) : null
-      ] }),
-      /* @__PURE__ */ jsxs2("div", { style: { display: "flex", justifyContent: "space-between", gap: spacingValue(theme, JumpySpacing.smallXS), padding: spacingValue(theme, JumpySpacing.large) }, children: [
-        /* @__PURE__ */ jsx2(JumpButton, { variant: "tertiary", onClick: () => setOpen(false), children: labels.cancelButton || "Cancel" }),
-        /* @__PURE__ */ jsx2(JumpButton, { onClick: () => setOpen(false), children: labels.applyButton || "Apply" })
-      ] })
-    ] }) }) : null
-  ] });
-}
-function TimeColumn({ label, values, selected, onSelect, theme }) {
-  const selectedIndex = Math.max(0, values.indexOf(selected));
-  const wraps = values.length >= 5;
-  const visibleValues = Array.from({ length: 5 }, (_, offsetIndex) => {
-    const index = selectedIndex + offsetIndex - 2;
-    if (wraps) return values[(index + values.length) % values.length];
-    return index >= 0 && index < values.length ? values[index] : null;
-  });
-  const rowHeight = sizeValue(theme, JumpySize.large) + spacingValue(theme, JumpySpacing.small3XS) * 2;
-  const bodyMedium = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  const bodyLargeEmphasized = textStyleValue(theme, JumpyTextStyle.bodyLargeEmphasized);
-  return /* @__PURE__ */ jsx2("div", { "aria-label": label, style: { position: "relative", zIndex: 1, display: "flex", flexDirection: "column", overflow: "hidden", padding: `0 ${spacingValue(theme, JumpySpacing.small3XS)}px`, margin: `0 ${-spacingValue(theme, JumpySpacing.small3XS)}px`, height: rowHeight * 5 }, children: /* @__PURE__ */ jsx2("div", { style: { display: "flex", flexDirection: "column" }, children: visibleValues.map((value, offsetIndex) => {
-    if (value === null) return /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", style: { flex: `0 0 ${rowHeight}px` } }, `${label}-empty-${offsetIndex}`);
-    const active = value === selected;
-    return /* @__PURE__ */ jsx2("button", { type: "button", "data-jumpy-component": "time-picker-wheel-button", onClick: () => onSelect(value), "data-selected": active ? "true" : "false", style: { border: 0, width: sizeValue(theme, JumpySize.large), height: rowHeight, flex: `0 0 ${rowHeight}px`, backgroundColor: "transparent", color: active ? "var(--jumpy-interactive-active-regular-default-text, var(--jumpy-color-text-on-primary))" : "var(--jumpy-interactive-inactive-regular-default-text, var(--jumpy-color-text-primary))", padding: `${spacingValue(theme, JumpySpacing.small3XS)}px 0`, cursor: "pointer", fontFamily: theme.fontFamily.familyBase, fontSize: active ? bodyLargeEmphasized.fontSize : bodyMedium.fontSize, lineHeight: active ? bodyLargeEmphasized.lineHeight : bodyMedium.lineHeight, fontWeight: active ? bodyLargeEmphasized.fontWeight : bodyMedium.fontWeight }, children: value }, `${label}-${value}`);
-  }) }) });
-}
-function flattenDropdownItems(items) {
-  return items.flatMap((item) => [item, ...flattenDropdownItems(item.children || [])]);
-}
-function JumpDropdown({ label, hint, value, defaultValue = [], onChange, open, onOpenChange, items = [], placeholder, popupMinWidth = 0, disabled = false, readOnly = false, multiple = false, searchable = false, renderTrigger, renderItem, inputRef, className = "", status = "regular", error = false, hideClearIcon = false, onClear, ...props }) {
-  const theme = useJumpyTheme();
-  const fieldContext = useContext(JumpyFieldContext);
-  const generatedId = useId();
-  const triggerId = props.id || `jumpy-dropdown-${generatedId}`;
-  const [internalValue, setInternalValue] = useState2(defaultValue);
-  const [internalOpen, setInternalOpen] = useState2(false);
-  const [searchValue, setSearchValue] = useState2("");
-  const [focusedIndex, setFocusedIndex] = useState2(-1);
-  const dropdownRef = useRef2(null);
-  const triggerRef = useRef2(null);
-  const selectedValues = value ?? internalValue;
-  const isOpen = open ?? internalOpen;
-  const flattenedItems = flattenDropdownItems(items);
-  const visibleItems = searchValue ? flattenedItems.filter((item) => item.label.toLowerCase().includes(searchValue.toLowerCase())) : flattenedItems;
-  const enabledVisibleItems = visibleItems.filter((item) => !item.disabled);
-  const selectedItems = flattenedItems.filter((item) => selectedValues.includes(item.value));
-  const displayText = selectedItems.map((item) => item.label).join(", ");
-  const dropdownOffset = spacingValue(theme, JumpySpacing.small3XS);
-  const dropdownPadding = spacingValue(theme, JumpySpacing.medium);
-  const dropdownMinHeight = sizeValue(theme, JumpySize.large2XL);
-  const dropdownMaxHeight = sizeValue(theme, JumpySize.large8XL) * 2;
-  const { refs, floatingStyles } = useFloating({
-    open: isOpen,
-    onOpenChange: setOpen,
-    placement: "bottom-start",
-    strategy: "fixed",
-    whileElementsMounted: autoUpdate,
-    middleware: [
-      offset(dropdownOffset),
-      flip({ padding: dropdownPadding }),
-      shift({ padding: dropdownPadding }),
-      size({
-        padding: dropdownPadding,
-        apply({ rects, availableWidth, availableHeight, elements }) {
-          Object.assign(elements.floating.style, {
-            width: `${Math.max(0, Math.min(Math.max(rects.reference.width, popupMinWidth), availableWidth))}px`,
-            maxHeight: `${Math.max(dropdownMinHeight, Math.min(dropdownMaxHeight, availableHeight))}px`
-          });
-        }
-      })
-    ]
-  });
-  const triggerStyle = fieldContext && !label && !hint ? {
-    paddingRight: sizeValue(theme, JumpySize.small2XS) + spacingValue(theme, JumpySpacing.medium),
-    ...props.style || {}
-  } : props.style;
-  const triggerInputStyle = {
-    ...triggerStyle || {},
-    caretColor: "transparent"
-  };
-  function setOpen(next) {
-    setInternalOpen(next);
-    onOpenChange?.(next);
-    if (!next) {
-      setSearchValue("");
-      setFocusedIndex(-1);
-    } else if (enabledVisibleItems.length > 0 && focusedIndex < 0) {
-      setFocusedIndex(visibleItems.findIndex((item) => !item.disabled));
-    }
-  }
-  function commit(nextValues) {
-    setInternalValue(nextValues);
-    onChange?.(nextValues);
-    if (!multiple) {
-      setOpen(false);
-      triggerRef.current?.focus();
-    }
-  }
-  useEffect2(() => {
-    if (!isOpen) return void 0;
-    function dismissOutside(event) {
-      if (!dropdownRef.current?.contains(event.target) && !refs.floating.current?.contains(event.target)) setOpen(false);
-    }
-    document.addEventListener("pointerdown", dismissOutside);
-    document.addEventListener("focusin", dismissOutside);
-    return () => {
-      document.removeEventListener("pointerdown", dismissOutside);
-      document.removeEventListener("focusin", dismissOutside);
-    };
-  });
-  function selectItem(item) {
-    if (!item || item.disabled) return;
-    if (multiple) {
-      commit(selectedValues.includes(item.value) ? selectedValues.filter((v) => v !== item.value) : [...selectedValues, item.value]);
-      return;
-    }
-    commit([item.value]);
-  }
-  function moveFocus(direction) {
-    if (enabledVisibleItems.length === 0) return;
-    const currentEnabledIndex = enabledVisibleItems.findIndex((item) => item.value === visibleItems[focusedIndex]?.value);
-    const nextEnabledIndex = direction === "start" ? 0 : direction === "end" ? enabledVisibleItems.length - 1 : (currentEnabledIndex + direction + enabledVisibleItems.length) % enabledVisibleItems.length;
-    setFocusedIndex(visibleItems.findIndex((item) => item.value === enabledVisibleItems[nextEnabledIndex].value));
-  }
-  const triggerInput = /* @__PURE__ */ jsx2(
-    JumpInput,
-    {
-      ...props,
-      ref: (node) => {
-        triggerRef.current = node;
-        refs.setReference(node?.closest('[data-jumpy-component="field-control"]') || node);
-        if (typeof inputRef === "function") inputRef(node);
-        else if (inputRef) inputRef.current = node;
-      },
-      id: triggerId,
-      style: triggerInputStyle,
-      "data-jumpy-dropdown-trigger": "true",
-      onChange: () => {
-      },
-      "data-has-value": Boolean(displayText),
-      role: "combobox",
-      "aria-expanded": isOpen,
-      "aria-haspopup": "listbox",
-      "aria-controls": isOpen ? `${triggerId}-listbox` : void 0,
-      "aria-activedescendant": isOpen && focusedIndex >= 0 ? `${triggerId}-option-${focusedIndex}` : void 0,
-      readOnly,
-      disabled,
-      value: displayText,
-      placeholder: displayText ? void 0 : placeholder,
-      autoComplete: "off",
-      spellCheck: false,
-      inputMode: "none",
-      onClick: (event) => {
-        if (!readOnly) setOpen(!isOpen);
-        props.onClick?.(event);
-      },
-      onBlur: (event) => {
-        props.onBlur?.(event);
-      },
-      onKeyDown: (event) => {
-        if (event.key !== "Tab" && event.key !== "Escape") event.preventDefault();
-        if (readOnly) {
-          props.onKeyDown?.(event);
-          return;
-        }
-        if (event.key === "ArrowDown" || event.key === "Enter" || event.key === " ") {
-          setOpen(true);
-        }
-        if (event.key === "ArrowDown") moveFocus(1);
-        if (event.key === "ArrowUp") moveFocus(-1);
-        if (event.key === "Home") moveFocus("start");
-        if (event.key === "End") moveFocus("end");
-        if ((event.key === "Enter" || event.key === " ") && isOpen) selectItem(visibleItems[focusedIndex]);
-        props.onKeyDown?.(event);
-      },
-      onPaste: (event) => event.preventDefault()
-    }
-  );
-  const trailing = readOnly ? void 0 : /* @__PURE__ */ jsx2("svg", { width: "1em", height: "1em", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", style: { display: "block", fontSize: sizeValue(theme, JumpySize.small) }, children: /* @__PURE__ */ jsx2("path", { fillRule: "evenodd", d: isOpen ? "m16.59 15.705 1.41-1.41-6-6-6 6 1.41 1.41 4.59-4.58z" : "M7.41 8.295 6 9.705l6 6 6-6-1.41-1.41-4.59 4.58z", clipRule: "evenodd", fill: "currentColor" }) });
-  const trigger = renderTrigger ? renderTrigger(selectedValues, isOpen) : fieldContext && !label && !hint ? /* @__PURE__ */ jsxs2(Fragment, { children: [
-    triggerInput,
-    /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", style: { pointerEvents: "none", position: "absolute", right: spacingValue(theme, JumpySpacing.medium), top: "50%", transform: "translateY(-50%)", color: theme.color.textSecondary, display: "inline-flex", alignItems: "center", justifyContent: "center", lineHeight: 1 }, children: trailing })
-  ] }) : /* @__PURE__ */ jsx2(JumpField, { label, hint, status, error, hideClearIcon, onClear: () => {
-    commit([]);
-    setSearchValue("");
-    onClear?.();
-  }, className, trailing, children: triggerInput });
-  const listbox = isOpen && !disabled ? /* @__PURE__ */ jsx2(JumpyPortal, { children: /* @__PURE__ */ jsxs2(
-    "div",
-    {
-      ref: refs.setFloating,
-      id: `${triggerId}-listbox`,
-      role: "listbox",
-      "aria-multiselectable": multiple || void 0,
-      "data-jumpy-component": "dropdown-popover",
-      style: {
-        ...floatingStyles,
-        zIndex: JUMPY_POPUP_Z_INDEX,
-        overflowX: "hidden",
-        overflowY: "auto",
-        borderRadius: radiusValue(theme, JumpyRadius.large),
-        backgroundColor: `var(--jumpy-non-interactive-background-alternative, var(--jumpy-color-non-interactive-background-alternative, ${theme.color.surfaceCard}))`,
-        boxShadow: theme.shadow.positiveMedium,
-        padding: `${spacingValue(theme, JumpySpacing.small3XS)}px 0`
-      },
-      children: [
-        searchable ? /* @__PURE__ */ jsx2("div", { style: { margin: `${spacingValue(theme, JumpySpacing.small3XS)}px ${spacingValue(theme, JumpySpacing.smallXS)}px` }, children: /* @__PURE__ */ jsx2(JumpSearchField, { label: "Search", placeholder: "Search", value: searchValue, onChange: (event) => {
-          setSearchValue(event.target.value);
-          setFocusedIndex(-1);
-        } }) }) : null,
-        visibleItems.length === 0 ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "dropdown-empty-state", style: { padding: `${spacingValue(theme, JumpySpacing.medium)}px ${spacingValue(theme, JumpySpacing.large)}px`, color: "var(--jumpy-interactive-inactive-regular-default-text)", fontFamily: theme.fontFamily.familyBase, fontSize: textStyleValue(theme, JumpyTextStyle.bodyMedium).fontSize }, children: "No options available" }) : null,
-        visibleItems.map((item, index) => {
-          const selected = selectedValues.includes(item.value);
-          const listItemProps = {
-            id: `${triggerId}-option-${index}`,
-            role: "option",
-            "aria-selected": selected,
-            disabled: item.disabled,
-            onMouseDown: (event) => event.preventDefault(),
-            onMouseEnter: () => setFocusedIndex(index),
-            onClick: () => {
-              selectItem(item);
-            }
-          };
-          return renderItem ? renderItem(item, selected, listItemProps) : /* @__PURE__ */ jsx2(JumpListItem, { selected, ...listItemProps, children: item.label }, String(item.value));
-        })
-      ]
-    }
-  ) }) : null;
-  return /* @__PURE__ */ jsxs2("div", { ref: dropdownRef, "data-jumpy-component": "dropdown", onKeyDown: (event) => {
-    if (event.key === KeyboardKeys.ESCAPE && isOpen && !event.defaultPrevented) {
-      event.preventDefault();
-      event.stopPropagation();
-      setOpen(false);
-      triggerRef.current?.focus();
-    }
-  }, style: { position: "relative", width: "100%" }, children: [
-    trigger,
-    listbox
-  ] });
-}
-function JumpSpinner({ size: size2 = "medium", mode = "indeterminate", value = 0, showTrack = true, inverse = false, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const sizeMap = {
-    xSmall: { diameter: 20, strokeWidth: 2 },
-    small: { diameter: 24, strokeWidth: 2 },
-    medium: { diameter: 32, strokeWidth: 2 },
-    large: { diameter: 48, strokeWidth: 4 },
-    xLarge: { diameter: 56, strokeWidth: 4 },
-    xxLarge: { diameter: 72, strokeWidth: 4 }
-  };
-  const { diameter, strokeWidth } = sizeMap[size2] || sizeMap.medium;
-  const radius = (diameter - strokeWidth) / 2;
-  const center = diameter / 2;
-  const circumference = 2 * Math.PI * radius;
-  const clampedValue = Math.min(Math.max(value, 0), 100);
-  const dash = mode === "determinate" ? clampedValue / 100 * circumference : circumference * 0.72;
-  const gap = circumference - dash;
-  return /* @__PURE__ */ jsxs2("svg", { ...props, "data-jumpy-component": "spinner", className: cn(className), width: diameter, height: diameter, viewBox: `0 0 ${diameter} ${diameter}`, role: "progressbar", "aria-valuemin": mode === "determinate" ? 0 : void 0, "aria-valuemax": mode === "determinate" ? 100 : void 0, "aria-valuenow": mode === "determinate" ? clampedValue : void 0, "aria-label": props["aria-label"] || (mode === "determinate" ? `Loading progress: ${clampedValue}%` : "Loading in progress"), style: { color: inverse ? theme.color.textOnPrimary : theme.color.surfacePrimary, ...props.style || {} }, children: [
-    showTrack ? /* @__PURE__ */ jsx2("circle", { cx: center, cy: center, r: radius, fill: "none", stroke: theme.color.borderSubtle, strokeWidth }) : null,
-    /* @__PURE__ */ jsx2("circle", { cx: center, cy: center, r: radius, fill: "none", stroke: "currentColor", strokeWidth, strokeLinecap: "round", strokeDasharray: `${dash} ${gap}`, transform: `rotate(-90 ${center} ${center})`, children: mode === "indeterminate" ? /* @__PURE__ */ jsx2("animateTransform", { attributeName: "transform", type: "rotate", from: `0 ${center} ${center}`, to: `360 ${center} ${center}`, dur: "1s", repeatCount: "indefinite" }) : null })
-  ] });
-}
-function JumpDialog({ as, visible = false, onVisibleChange, title, description, footer, children, className = "", disableBackdropClick = false, disableContentScroll = false, fullScreen = false, overlayProps, slots, innerClasses = {}, ...props }) {
-  const theme = useJumpyTheme();
-  const Component = as || "div";
-  const labelId = useId();
-  const descriptionId = useId();
-  const dialogTitle = slots?.title ?? title;
-  const dialogDescription = slots?.description ?? description;
-  const dialogFooter = slots?.footer ?? footer;
-  const dialogIcon = slots?.icon;
-  const dialogIllustration = slots?.illustration;
-  const titleStyle = textStyleValue(theme, JumpyTextStyle.titleLarge);
-  const descriptionStyle = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  const { className: overlayClassName, style: overlayStyle, onClick: overlayOnClick, ...restOverlayProps } = overlayProps || {};
-  if (!visible) return null;
-  return /* @__PURE__ */ jsx2(
-    JumpyModalLayer,
-    {
-      ...restOverlayProps,
-      onVisibleChange,
-      "data-jumpy-component": "dialog-overlay",
-      "data-disable-content-scroll": disableContentScroll ? "true" : "false",
-      role: "presentation",
-      className: cn(overlayClassName),
-      onClick: (event) => {
-        overlayOnClick?.(event);
-        if (event.target === event.currentTarget && !event.defaultPrevented && !disableBackdropClick) onVisibleChange?.(false);
-      },
-      style: overlayStyle,
-      children: /* @__PURE__ */ jsxs2(
-        Component,
-        {
-          ...props,
-          "data-jumpy-component": "dialog",
-          "data-full-screen": fullScreen ? "true" : "false",
-          "data-no-footer": dialogFooter ? "false" : "true",
-          role: "dialog",
-          "aria-modal": "true",
-          "aria-labelledby": dialogTitle ? labelId : void 0,
-          "aria-describedby": dialogDescription ? descriptionId : void 0,
-          "aria-label": !dialogTitle ? props["aria-label"] || title : props["aria-label"],
-          className: cn(className),
-          onClick: (event) => {
-            event.stopPropagation();
-            props.onClick?.(event);
-          },
-          style: {
-            "--jumpy-dialog-width": props.style?.width || "472px",
-            ...props.style || {}
-          },
-          children: [
-            dialogIllustration ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "dialog-illustration", className: innerClasses.illustration?.className, style: innerClasses.illustration?.style, children: dialogIllustration }) : null,
-            /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "dialog-body", className: innerClasses.body?.className, style: innerClasses.body?.style, children: [
-              dialogIcon ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "dialog-icon", className: innerClasses.icon?.className, style: innerClasses.icon?.style, children: dialogIcon }) : null,
-              dialogTitle ? /* @__PURE__ */ jsx2(
-                "div",
-                {
-                  id: labelId,
-                  "data-jumpy-slot": "dialog-title",
-                  className: innerClasses.title?.className,
-                  style: {
-                    margin: 0,
-                    fontFamily: theme.fontFamily.familyBase,
-                    fontSize: titleStyle.fontSize,
-                    lineHeight: titleStyle.lineHeight,
-                    fontWeight: titleStyle.fontWeight,
-                    letterSpacing: titleStyle.letterSpacing,
-                    ...innerClasses.title?.style || {}
-                  },
-                  children: dialogTitle
-                }
-              ) : null,
-              /* @__PURE__ */ jsxs2("div", { "data-jumpy-slot": "dialog-scrollable-content", className: innerClasses.scrollableContent?.className, style: innerClasses.scrollableContent?.style, children: [
-                dialogDescription ? /* @__PURE__ */ jsx2(
-                  "div",
-                  {
-                    id: descriptionId,
-                    "data-jumpy-slot": "dialog-description",
-                    className: innerClasses.description?.className,
-                    style: {
-                      margin: 0,
-                      fontFamily: theme.fontFamily.familyBase,
-                      fontSize: descriptionStyle.fontSize,
-                      lineHeight: descriptionStyle.lineHeight,
-                      fontWeight: descriptionStyle.fontWeight,
-                      letterSpacing: descriptionStyle.letterSpacing,
-                      ...innerClasses.description?.style || {}
-                    },
-                    children: dialogDescription
-                  }
-                ) : null,
-                children
-              ] })
-            ] }),
-            dialogFooter ? /* @__PURE__ */ jsx2("div", { "data-jumpy-slot": "dialog-footer", className: innerClasses.footer?.className, style: innerClasses.footer?.style, children: dialogFooter }) : null
-          ]
-        }
-      )
-    }
-  );
-}
-function JumpLoader({ label = "Jumpy UI wird geladen", fullScreen = false, className = "", decorativeBackground = false }) {
-  const theme = useJumpyTheme();
-  const content = /* @__PURE__ */ jsxs2("div", { className: cn("flex flex-col items-center text-center", className), role: "status", "aria-live": "polite", children: [
-    /* @__PURE__ */ jsxs2("div", { className: "relative flex items-center justify-center", style: { height: theme.sizing.loaderSize, width: theme.sizing.loaderSize }, children: [
-      /* @__PURE__ */ jsx2("div", { className: "absolute inset-0", style: { borderRadius: theme.radius.large2XL, backgroundColor: theme.color.infoSurface } }),
-      /* @__PURE__ */ jsx2("div", { className: "absolute inset-2", style: { borderRadius: theme.radius.largeXL, border: `1px solid ${theme.color.infoBorder}`, backgroundColor: theme.color.surfaceCard, boxShadow: theme.shadow.loader } }),
-      /* @__PURE__ */ jsx2("span", { className: "relative grid place-items-center", style: { color: theme.color.surfacePrimary }, children: /* @__PURE__ */ jsx2(JumpSpinner, { size: "large", "aria-label": label }) })
-    ] }),
-    /* @__PURE__ */ jsx2("p", { className: "mt-5 text-[11px] font-bold uppercase tracking-[0.18em]", style: { color: theme.color.surfacePrimary }, children: label }),
-    /* @__PURE__ */ jsxs2("div", { className: "mt-3 flex items-center gap-1.5", "aria-hidden": "true", children: [
-      /* @__PURE__ */ jsx2("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full [animation-delay:-0.2s]", style: { backgroundColor: theme.color.surfacePrimary } }),
-      /* @__PURE__ */ jsx2("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full [animation-delay:-0.1s]", style: { backgroundColor: theme.color.successBorder } }),
-      /* @__PURE__ */ jsx2("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full", style: { backgroundColor: theme.color.infoBorder } })
-    ] }),
-    /* @__PURE__ */ jsx2("span", { className: "sr-only", children: "Laden" })
-  ] });
-  if (!fullScreen) return content;
-  return /* @__PURE__ */ jsxs2("div", { className: "relative flex min-h-screen items-center justify-center overflow-hidden p-6", style: { backgroundColor: theme.color.surfaceCanvas, color: theme.color.textPrimary }, children: [
-    decorativeBackground && /* @__PURE__ */ jsx2(JumpBackground, { snow: false }),
-    /* @__PURE__ */ jsx2(JumpCard, { className: cn("px-10 py-9", decorativeBackground && "relative z-10"), children: content })
-  ] });
-}
-function JumpButton({ as, size: size2, variant = "primary", status = "regular", className = "", isLoading = false, disabled, elevated = false, slots, leadingIcon, trailingIcon, children, ...props }) {
-  const theme = useJumpyTheme();
-  const variantStyles = getButtonVariantStyles(theme, variant, status);
-  const height = sizeValue(theme, size2 ?? JumpySize.large);
-  if (!Number.isFinite(height) || height < 0) throw new Error(`Invalid JumpButton size token: ${size2}`);
-  const compact = height < sizeValue(theme, JumpySize.large);
-  const textStyle = textStyleValue(theme, compact ? JumpyTextStyle.bodySmallEmphasized : JumpyTextStyle.bodyMediumEmphasized);
-  const iconSize = sizeValue(theme, compact ? JumpySize.small3XS : JumpySize.small2XS);
-  const [pressed, setPressed] = useState2(false);
-  const leading = slots?.leading ?? leadingIcon;
-  const trailing = slots?.trailing ?? trailingIcon;
-  const Component = as || "button";
-  const isButton = Component === "button";
-  const isDisabled = disabled || isLoading;
-  const displayedLeading = isLoading ? /* @__PURE__ */ jsx2(JumpSpinner, { size: "xSmall", showTrack: false, "aria-hidden": "true", style: { display: "block", width: iconSize, height: iconSize, color: "inherit" } }) : leading;
-  const spacing = getButtonSpacing(theme, variant, Boolean(displayedLeading), Boolean(trailing));
-  const hasBorder = variant === "secondary" || variant === "tertiary";
-  if (size2 !== void 0) {
-    const border = hasBorder ? borderWidthValue(theme, JumpyBorderWidth.small) : 0;
-    const contentHeight = Math.max(textStyle.fontSize * textStyle.lineHeight, displayedLeading || trailing ? iconSize : 0);
-    spacing.paddingTop = spacing.paddingBottom = Math.max(0, (height - contentHeight - border * 2) / 2);
-    if (compact) {
-      spacing.gap = spacingValue(theme, JumpySpacing.small3XS);
-      spacing.paddingLeft = spacing.paddingRight = spacingValue(theme, variant === "borderless" ? JumpySpacing.zero : JumpySpacing.medium);
-    }
-  }
-  const content = /* @__PURE__ */ jsxs2("span", { style: { display: "inline-flex", flexDirection: "row", alignItems: "center", justifyContent: "center", gap: spacing.gap, whiteSpace: "nowrap" }, children: [
-    displayedLeading ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "button-leading", "aria-hidden": "true", style: { display: "inline-flex", alignItems: "center", justifyContent: "center", flexShrink: 0, width: iconSize, height: iconSize, lineHeight: 0, fontSize: iconSize }, children: displayedLeading }) : null,
-    /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "button-label", children }),
-    trailing ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "button-trailing", "aria-hidden": "true", style: { display: "inline-flex", alignItems: "center", justifyContent: "center", flexShrink: 0, width: iconSize, height: iconSize, lineHeight: 0, fontSize: iconSize }, children: trailing }) : null
-  ] });
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      type: isButton ? props.type || "button" : props.type,
-      "data-jumpy-component": "icon-button",
-      "data-variant": variant,
-      "data-status": status,
-      "data-elevated": elevated ? "true" : "false",
-      "data-loading": isLoading ? "true" : "false",
-      "data-size": size2,
-      "data-pressed": pressed ? "true" : "false",
-      "aria-busy": isLoading || void 0,
-      "aria-disabled": !isButton && isDisabled ? true : props["aria-disabled"],
-      tabIndex: !isButton && isDisabled ? -1 : props.tabIndex,
-      disabled: isButton ? isDisabled : void 0,
-      onClick: (event) => {
-        if (isDisabled) {
-          event.preventDefault();
-          return;
-        }
-        props.onClick?.(event);
-      },
-      onPointerDown: (event) => {
-        setPressed(true);
-        props.onPointerDown?.(event);
-      },
-      onPointerUp: (event) => {
-        setPressed(false);
-        props.onPointerUp?.(event);
-      },
-      onPointerLeave: (event) => {
-        setPressed(false);
-        props.onPointerLeave?.(event);
-      },
-      onBlur: (event) => {
-        setPressed(false);
-        props.onBlur?.(event);
-      },
-      className: cn("disabled:cursor-not-allowed", className),
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        minHeight: height,
-        appearance: "none",
-        WebkitAppearance: "none",
-        boxSizing: "border-box",
-        paddingLeft: spacing.paddingLeft,
-        paddingRight: spacing.paddingRight,
-        paddingTop: spacing.paddingTop,
-        paddingBottom: spacing.paddingBottom,
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        letterSpacing: textStyle.letterSpacing,
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: textStyle.fontSize,
-        lineHeight: textStyle.lineHeight,
-        fontWeight: textStyle.fontWeight,
-        // Primary regular disabled tokens already encode the subdued appearance.
-        opacity: isDisabled && !(variant === "primary" && status === "regular") ? opacityValue(theme, JumpyOpacity.medium) : opacityValue(theme, JumpyOpacity.solid),
-        borderWidth: hasBorder ? borderWidthValue(theme, JumpyBorderWidth.small) : 0,
-        borderStyle: hasBorder ? "solid" : "none",
-        ...variantStyles,
-        ...elevated && !isDisabled ? { "--jumpy-action-default-shadow": shadowValue(theme, JumpyShadowStyle.positiveMedium) } : {},
-        ...props.style || {}
-      },
-      children: /* @__PURE__ */ jsx2("span", { style: { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", whiteSpace: "nowrap" }, children: content })
-    }
-  );
-}
-function JumpIconButton({ as, variant = "primary", status = "regular", alternateHover = false, elevated = false, className = "", disabled, children, "aria-label": ariaLabel, ...props }) {
-  const theme = useJumpyTheme();
-  const actionVariant = variant === "primary" ? "secondary" : variant === "secondary" ? "tertiary" : variant;
-  const variantStyles = getButtonVariantStyles(theme, actionVariant, status);
-  const actionTokenPrefix = `--jumpy-actions-${actionVariant}-${status}`;
-  const [pressed, setPressed] = useState2(false);
-  const Component = as || "button";
-  const isButton = Component === "button";
-  const supportsDisabled = typeof Component === "string" && supportsDisabledAttribute(Component);
-  const hasBorder = variant === "primary";
-  return /* @__PURE__ */ jsx2(
-    Component,
-    {
-      ...props,
-      type: isButton ? props.type || "button" : props.type,
-      "aria-label": ariaLabel,
-      "data-jumpy-component": "button",
-      "data-variant": variant,
-      "data-status": status,
-      "data-elevated": elevated ? "true" : "false",
-      "data-pressed": pressed ? "true" : "false",
-      "aria-disabled": !supportsDisabled && disabled ? true : props["aria-disabled"],
-      tabIndex: !supportsDisabled && disabled ? -1 : props.tabIndex,
-      disabled: supportsDisabled ? disabled : void 0,
-      onPointerDown: (event) => {
-        setPressed(true);
-        props.onPointerDown?.(event);
-      },
-      onPointerUp: (event) => {
-        setPressed(false);
-        props.onPointerUp?.(event);
-      },
-      onPointerLeave: (event) => {
-        setPressed(false);
-        props.onPointerLeave?.(event);
-      },
-      onBlur: (event) => {
-        setPressed(false);
-        props.onBlur?.(event);
-      },
-      className: cn("disabled:cursor-not-allowed", className),
-      style: {
-        display: "inline-grid",
-        placeItems: "center",
-        width: sizeValue(theme, JumpySize.large),
-        height: sizeValue(theme, JumpySize.large),
-        minWidth: sizeValue(theme, JumpySize.large),
-        minHeight: sizeValue(theme, JumpySize.large),
-        appearance: "none",
-        WebkitAppearance: "none",
-        boxSizing: "border-box",
-        padding: spacingValue(theme, JumpySpacing.small2XS),
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        borderWidth: hasBorder ? borderWidthValue(theme, JumpyBorderWidth.small) : 0,
-        borderStyle: hasBorder ? "solid" : "none",
-        opacity: disabled ? opacityValue(theme, JumpyOpacity.medium) : opacityValue(theme, JumpyOpacity.solid),
-        ...variantStyles,
-        "--jumpy-action-default-icon": `var(${actionTokenPrefix}-default-action, ${variantStyles["--jumpy-action-default-icon"]})`,
-        "--jumpy-action-hover-icon": `var(${actionTokenPrefix}-hover-action, ${variantStyles["--jumpy-action-hover-icon"]})`,
-        "--jumpy-action-focus-icon": `var(${actionTokenPrefix}-focus-action, ${variantStyles["--jumpy-action-focus-icon"]})`,
-        "--jumpy-action-pressed-icon": `var(${actionTokenPrefix}-pressed-action, ${variantStyles["--jumpy-action-pressed-icon"]})`,
-        "--jumpy-action-disabled-icon": `var(${actionTokenPrefix}-disabled-action, ${variantStyles["--jumpy-action-disabled-icon"]})`,
-        ...elevated && !disabled ? { "--jumpy-action-default-shadow": shadowValue(theme, JumpyShadowStyle.positiveMedium) } : {},
-        ...alternateHover ? {
-          "--jumpy-action-hover-surface": `var(--jumpy-interactive-inactive-${status}-hover-surface-alternate, ${variantStyles["--jumpy-action-hover-surface"]})`,
-          "--jumpy-action-pressed-surface": `var(--jumpy-interactive-inactive-${status}-pressed-surface-alternate, ${variantStyles["--jumpy-action-pressed-surface"]})`
-        } : {},
-        ...props.style || {}
-      },
-      children: /* @__PURE__ */ jsx2("span", { style: { display: "grid", placeItems: "center", width: sizeValue(theme, JumpySize.small), height: sizeValue(theme, JumpySize.small), lineHeight: 0, fontSize: sizeValue(theme, JumpySize.small) }, "aria-hidden": "true", children })
-    }
-  );
-}
-function JumpLinkButton({ href, variant = "borderless", status = "regular", className = "", leadingIcon, trailingIcon, children, ...props }) {
-  const theme = useJumpyTheme();
-  const variantStyles = getButtonVariantStyles(theme, variant, status);
-  const bodyMediumEmphasized = textStyleValue(theme, JumpyTextStyle.bodyMediumEmphasized);
-  const iconSize = sizeValue(theme, JumpySize.small2XS);
-  const [pressed, setPressed] = useState2(false);
-  const spacing = getButtonSpacing(theme, variant, Boolean(leadingIcon), Boolean(trailingIcon));
-  const hasBorder = variant === "secondary" || variant === "tertiary";
-  return /* @__PURE__ */ jsx2(
-    "a",
-    {
-      href,
-      ...props,
-      "data-jumpy-component": "link-button",
-      "data-variant": variant,
-      "data-status": status,
-      "data-pressed": pressed ? "true" : "false",
-      onPointerDown: (event) => {
-        setPressed(true);
-        props.onPointerDown?.(event);
-      },
-      onPointerUp: (event) => {
-        setPressed(false);
-        props.onPointerUp?.(event);
-      },
-      onPointerLeave: (event) => {
-        setPressed(false);
-        props.onPointerLeave?.(event);
-      },
-      onBlur: (event) => {
-        setPressed(false);
-        props.onBlur?.(event);
-      },
-      className: cn(className),
-      style: {
-        display: "inline-flex",
-        alignItems: "center",
-        justifyContent: "center",
-        minHeight: sizeValue(theme, JumpySize.large),
-        appearance: "none",
-        WebkitAppearance: "none",
-        boxSizing: "border-box",
-        paddingLeft: spacing.paddingLeft,
-        paddingRight: spacing.paddingRight,
-        paddingTop: spacing.paddingTop,
-        paddingBottom: spacing.paddingBottom,
-        borderRadius: radiusValue(theme, JumpyRadius.small),
-        letterSpacing: bodyMediumEmphasized.letterSpacing,
-        fontFamily: theme.fontFamily.familyBase,
-        fontSize: bodyMediumEmphasized.fontSize,
-        lineHeight: bodyMediumEmphasized.lineHeight,
-        fontWeight: bodyMediumEmphasized.fontWeight,
-        borderWidth: hasBorder ? borderWidthValue(theme, JumpyBorderWidth.small) : 0,
-        borderStyle: hasBorder ? "solid" : "none",
-        ...variantStyles,
-        ...props.style || {}
-      },
-      children: /* @__PURE__ */ jsxs2("span", { style: { display: "inline-flex", flexDirection: "row", alignItems: "center", justifyContent: "center", gap: spacing.gap, whiteSpace: "nowrap" }, children: [
-        leadingIcon ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", className: "inline-flex shrink-0 items-center justify-center", style: { width: iconSize, height: iconSize, lineHeight: 0, fontSize: iconSize }, children: leadingIcon }) : null,
-        /* @__PURE__ */ jsx2("span", { children }),
-        trailingIcon ? /* @__PURE__ */ jsx2("span", { "aria-hidden": "true", className: "inline-flex shrink-0 items-center justify-center", style: { width: iconSize, height: iconSize, lineHeight: 0, fontSize: iconSize }, children: trailingIcon }) : null
-      ] })
-    }
-  );
-}
-var JumpInput = forwardRef(function JumpInput2({ className = "", ...props }, ref) {
-  const theme = useJumpyTheme();
-  const fieldContext = useContext(JumpyFieldContext);
-  const inputOffset = fieldContext?.hasLabel ? spacingValue(theme, JumpySpacing.large) : spacingValue(theme, JumpySpacing.zero);
-  const inputMinHeight = fieldContext ? void 0 : sizeValue(theme, JumpySize.largeXL) - spacingValue(theme, JumpySpacing.small3XS) * 2;
-  const inputElement = /* @__PURE__ */ jsx2(
-    "input",
-    {
-      ...props,
-      ref,
-      "data-jumpy-component": "input",
-      className: cn("w-full text-sm disabled:cursor-not-allowed", className),
-      style: {
-        ...getFieldInputStyles(theme, props.disabled),
-        minHeight: inputMinHeight,
-        marginTop: inputOffset,
-        ...props.style || {}
-      }
-    }
-  );
-  if (fieldContext) {
-    return inputElement;
-  }
-  return renderStandaloneField(theme, props.disabled, "", null, inputElement, props.status || "regular", props.readOnly);
-});
-function TokenEditorField(props) {
-  const fieldContext = useContext(JumpyFieldContext);
-  return /* @__PURE__ */ jsx2(TokenEditor, { ...props, fieldContext });
-}
-function JumpTokenInput({ ref, value, defaultValue = [], onChange, onTokenInsert, onTokenRemove, multiline = false, minRows = 3, maxRows, hideClearIcon = false, onClear, label, hint, status = "regular", error = false, disabled = false, readOnly = false, className = "", ...props }) {
-  const editorHandle = useRef2(null);
-  const [internalValue, setInternalValue] = useState2(() => normalizeTokenInputValue(defaultValue, multiline));
-  const [, refresh] = useState2(0);
-  if (multiline && (!Number.isInteger(minRows) || minRows < 1 || maxRows !== void 0 && (!Number.isInteger(maxRows) || maxRows < minRows))) throw new Error("JumpTokenInput requires minRows >= 1 and maxRows >= minRows");
-  const model = normalizeTokenInputValue(value === void 0 ? internalValue : value, multiline);
-  const change = (next) => {
-    if (disabled || readOnly) return;
-    if (value === void 0) setInternalValue(next);
-    else refresh((revision) => revision + 1);
-    onChange?.(next);
-    const previousTokens = model.filter((part) => part.type === "token");
-    const nextTokens = next.filter((part) => part.type === "token");
-    for (const token of nextTokens) if (!previousTokens.some((previous) => previous.id === token.id)) onTokenInsert?.(token);
-    for (const token of previousTokens) if (!nextTokens.some((current) => current.id === token.id)) onTokenRemove?.(token);
-  };
-  return /* @__PURE__ */ jsx2(JumpField, { label, hint, status, error, hideClearIcon, onClear: () => editorHandle.current?.clear(), className, children: /* @__PURE__ */ jsx2(TokenEditorField, { ...props, editorRef: (handle) => {
-    editorHandle.current = handle;
-    if (typeof ref === "function") return ref(handle);
-    if (ref) ref.current = handle;
-  }, model, multiline, minRows, maxRows, value: tokenInputText(model), "data-has-value": model.length > 0, disabled, readOnly, onValueChange: change, onClear }) });
-}
-function JumpTextarea({ className = "", ...props }) {
-  const theme = useJumpyTheme();
-  const fieldContext = useContext(JumpyFieldContext);
-  const inputOffset = fieldContext?.hasLabel ? spacingValue(theme, JumpySpacing.large) : spacingValue(theme, JumpySpacing.zero);
-  const textareaElement = /* @__PURE__ */ jsx2(
-    "textarea",
-    {
-      ...props,
-      "data-jumpy-component": "textarea",
-      className: cn("w-full text-sm disabled:cursor-not-allowed", className),
-      style: {
-        ...getFieldInputStyles(theme, props.disabled),
-        minHeight: props.rows ? Number(props.rows) * 24 : sizeValue(theme, JumpySize.large2XL),
-        marginTop: inputOffset,
-        resize: "none",
-        ...props.style || {}
-      }
-    }
-  );
-  if (fieldContext) {
-    return textareaElement;
-  }
-  return renderStandaloneField(theme, props.disabled, "", { alignItems: "flex-start", height: "auto", maxHeight: "none", paddingRight: spacingValue(theme, JumpySpacing.small3XS) }, textareaElement, props.status || "regular", props.readOnly);
-}
-function JumpBaseInput({ label, hint, children, className = "", error = false, hideClearIcon = false, showCharCount = false, onClear, ...props }) {
-  const theme = useJumpyTheme();
-  const fieldId = useId();
-  const labelId = useId();
-  const helperId = useId();
-  const counterId = useId();
-  const child = Children.only(children);
-  const childValue = isValidElement(child) ? child.props.value ?? child.props.defaultValue ?? "" : "";
-  const childHasValue = isValidElement(child) && (child.props["data-has-value"] === true || child.props["data-has-value"] === "true");
-  const [focused, setFocused] = useState2(false);
-  const [hasValue, setHasValue] = useState2(childHasValue || Boolean(String(childValue).length));
-  const [inputValue, setInputValue] = useState2(String(childValue ?? ""));
-  const bodySmall = textStyleValue(theme, JumpyTextStyle.bodySmall);
-  const bodyMedium = textStyleValue(theme, JumpyTextStyle.bodyMedium);
-  const labelSmall = textStyleValue(theme, JumpyTextStyle.labelSmall);
-  useEffect2(() => {
-    setHasValue(childHasValue || Boolean(String(childValue).length));
-    setInputValue(String(childValue ?? ""));
-  }, [childHasValue, childValue]);
-  if (!isValidElement(child)) {
-    return /* @__PURE__ */ jsx2("div", { className: cn("block w-full", className), children });
-  }
-  const originalOnFocus = child.props.onFocus;
-  const originalOnBlur = child.props.onBlur;
-  const originalOnChange = child.props.onChange;
-  const disabled = Boolean(child.props.disabled);
-  const isDropdownTrigger = child.props["data-jumpy-dropdown-trigger"] === true || child.props["data-jumpy-dropdown-trigger"] === "true";
-  const readOnly = Boolean(child.props.readOnly) && !isDropdownTrigger;
-  const floating = focused && !readOnly || hasValue || Boolean(props.slots?.content);
-  const isTextarea = child.type === JumpTextarea || child.type === TokenEditorField && child.props.multiline;
-  const isDropdown = isDropdownTrigger || child.props["data-jumpy-component"] === "dropdown";
-  const status = error ? "alarm" : props.status || "regular";
-  const leading = props.slots?.leading ?? props.leading;
-  const trailing = props.slots?.trailing ?? props.trailing;
-  const content = props.slots?.content;
-  const helperText = props.slots?.helperText ?? hint;
-  const hasHelperText = Boolean(helperText);
-  const maxLength = child.props.maxLength;
-  const hasCounter = showCharCount && maxLength !== void 0 && maxLength !== null;
-  const showClearButton = hasValue && !hideClearIcon && !disabled && !readOnly;
-  const showErrorIcon = Boolean(error) && !disabled && !readOnly;
-  const showTrailing = showClearButton || trailing || showErrorIcon;
-  const describedBy = [child.props["aria-describedby"], hasHelperText ? helperId : void 0, hasCounter ? counterId : void 0].filter(Boolean).join(" ") || void 0;
-  const labelScale = labelSmall.fontSize / bodyMedium.fontSize;
-  const fieldInnerHeight = sizeValue(theme, JumpySize.largeXL) - spacingValue(theme, JumpySpacing.small3XS) * 2;
-  const labelRestingY = fieldInnerHeight / 2;
-  const labelFloatingY = (labelSmall.fontSize * labelSmall.lineHeight - labelSmall.fontSize) / 2;
-  const labelTiming = focused && !readOnly ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease;
-  const enhancedChild = cloneElement(child, {
-    id: child.props.id || fieldId,
-    "aria-labelledby": child.props["aria-labelledby"] || (!child.props["aria-label"] && label ? labelId : void 0),
-    "aria-invalid": error ? true : child.props["aria-invalid"],
-    "aria-describedby": describedBy,
-    placeholder: !label || isDropdown || floating ? child.props.placeholder : " ",
-    style: content ? {
-      ...child.props.style || {},
-      position: "absolute",
-      inset: 0,
-      zIndex: 2,
-      width: "100%",
-      height: "100%",
-      margin: 0,
-      opacity: 0,
-      cursor: disabled || readOnly ? "default" : "pointer"
-    } : child.props.style,
-    onFocus: (event) => {
-      setFocused(true);
-      originalOnFocus?.(event);
-    },
-    onBlur: (event) => {
-      setFocused(false);
-      setHasValue(childHasValue || Boolean(String(event.target?.value ?? "").length));
-      originalOnBlur?.(event);
-    },
-    onChange: (event) => {
-      setHasValue(childHasValue || Boolean(String(event.target?.value ?? "").length));
-      setInputValue(String(event.target?.value ?? ""));
-      originalOnChange?.(event);
-    }
-  });
-  const Container = label ? "label" : "div";
-  const containerProps = label ? { htmlFor: child.props.id || fieldId } : {
-    onClick: () => {
-      if (!disabled) document.getElementById(child.props.id || fieldId)?.focus();
-    }
-  };
-  return /* @__PURE__ */ jsxs2("div", { "data-jumpy-component": "base-input-root", className: cn("inline-flex w-full max-w-full flex-col", className), style: { color: "var(--jumpy-cmp-base-input-helper-color)" }, children: [
-    /* @__PURE__ */ jsx2(
-      Container,
-      {
-        ...containerProps,
-        "data-jumpy-component": "base-input",
-        "data-disabled": disabled ? "true" : "false",
-        "data-readonly": readOnly ? "true" : "false",
-        "data-status": status,
-        style: { color: "var(--jumpy-cmp-base-input-helper-color)" },
-        children: /* @__PURE__ */ jsxs2(
-          "div",
-          {
-            "data-jumpy-component": "field-control",
-            "data-disabled": disabled ? "true" : "false",
-            "data-readonly": readOnly ? "true" : "false",
-            "data-status": status,
-            "data-testid": props["data-testid"],
-            onMouseDown: (event) => {
-              const control = document.getElementById(child.props.id || fieldId);
-              const interactive = event.target.closest("input, textarea, select, button, a, [tabindex]");
-              if (disabled || !control || event.button !== 0 || interactive && event.currentTarget.contains(interactive)) return;
-              event.preventDefault();
-              control.focus();
-            },
-            style: {
-              ...getFieldShellStyles(theme, disabled, status, focused, readOnly),
-              alignItems: isTextarea ? "flex-start" : "center",
-              position: "relative",
-              height: isTextarea ? "auto" : sizeValue(theme, JumpySize.largeXL),
-              minHeight: isTextarea ? sizeValue(theme, JumpySize.large2XL) : sizeValue(theme, JumpySize.largeXL)
-            },
-            children: [
-              leading ? /* @__PURE__ */ jsx2(
-                "span",
-                {
-                  "aria-hidden": "true",
-                  className: "inline-flex shrink-0 items-center justify-center",
-                  style: {
-                    width: sizeValue(theme, JumpySize.small),
-                    height: sizeValue(theme, JumpySize.small),
-                    color: "var(--jumpy-cmp-base-input-icon-fill)",
-                    transition: `color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${focused && !readOnly ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease}`
-                  },
-                  children: leading
-                }
-              ) : null,
-              /* @__PURE__ */ jsxs2(
-                "div",
-                {
-                  style: {
-                    position: "relative",
-                    display: "flex",
-                    alignItems: isTextarea ? "initial" : "center",
-                    alignSelf: "stretch",
-                    flex: 1,
-                    minWidth: 0,
-                    overflow: "hidden"
-                  },
-                  children: [
-                    label && /* @__PURE__ */ jsx2(
-                      "span",
-                      {
-                        id: labelId,
-                        "data-testid": props.labelTestId,
-                        style: {
-                          position: "absolute",
-                          left: spacingValue(theme, JumpySpacing.zero),
-                          top: spacingValue(theme, JumpySpacing.zero),
-                          transform: floating ? `translateY(${labelFloatingY}px) scale(${labelScale})` : `translateY(calc(${labelRestingY}px - 50%)) scale(1)`,
-                          transformOrigin: "left top",
-                          color: "var(--jumpy-cmp-base-input-label-color)",
-                          fontFamily: theme.fontFamily.familyBase,
-                          fontSize: bodyMedium.fontSize,
-                          lineHeight: floating ? labelSmall.lineHeight : bodyMedium.lineHeight,
-                          fontWeight: floating ? labelSmall.fontWeight : bodyMedium.fontWeight,
-                          letterSpacing: floating ? labelSmall.letterSpacing : bodyMedium.letterSpacing,
-                          pointerEvents: "none",
-                          transition: `transform ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${labelTiming}, color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${labelTiming}`,
-                          maxWidth: "100%",
-                          overflow: "hidden",
-                          textOverflow: "ellipsis",
-                          whiteSpace: "nowrap"
-                        },
-                        children: label
-                      }
-                    ),
-                    /* @__PURE__ */ jsx2(JumpyFieldContext.Provider, { value: { fieldId, hasLabel: Boolean(label), floating }, children: enhancedChild }),
-                    content ? /* @__PURE__ */ jsx2(
-                      "div",
-                      {
-                        "data-jumpy-slot": "content",
-                        style: {
-                          width: "100%",
-                          minWidth: 0,
-                          paddingTop: label ? spacingValue(theme, JumpySpacing.large) : spacingValue(theme, JumpySpacing.zero),
-                          color: "var(--jumpy-cmp-base-input-value-color)",
-                          fontFamily: theme.fontFamily.familyBase,
-                          fontSize: bodyMedium.fontSize,
-                          lineHeight: `${bodyMedium.fontSize * bodyMedium.lineHeight}px`,
-                          overflow: "hidden",
-                          textOverflow: "ellipsis",
-                          whiteSpace: "nowrap"
-                        },
-                        children: content
-                      }
-                    ) : null
-                  ]
-                }
-              ),
-              showTrailing ? /* @__PURE__ */ jsxs2(
-                "span",
-                {
-                  "data-jumpy-slot": "trailing-container",
-                  className: "inline-flex shrink-0 items-center justify-center",
-                  style: {
-                    display: "inline-flex",
-                    alignItems: isTextarea ? "flex-start" : "center",
-                    justifyContent: "center",
-                    alignSelf: isTextarea ? "flex-start" : void 0,
-                    minHeight: isTextarea ? sizeValue(theme, JumpySize.large) : void 0,
-                    flexShrink: 0,
-                    gap: spacingValue(theme, JumpySpacing.smallXS),
-                    color: "var(--jumpy-cmp-base-input-trailing-color)",
-                    transition: `color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${focused && !readOnly ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease}`
-                  },
-                  children: [
-                    showClearButton ? /* @__PURE__ */ jsx2(
-                      JumpIconButton,
-                      {
-                        variant: "secondary",
-                        "aria-label": "Clear",
-                        "data-jumpy-slot": "clear-button",
-                        onClick: (event) => {
-                          event.preventDefault();
-                          event.stopPropagation();
-                          const input = document.getElementById(child.props.id || fieldId);
-                          if (input && child.props.value === void 0) input.value = "";
-                          setHasValue(false);
-                          setInputValue("");
-                          originalOnChange?.({ target: { value: "" }, currentTarget: { value: "" } });
-                          onClear?.();
-                          input?.focus();
-                        },
-                        style: {
-                          width: sizeValue(theme, JumpySize.large),
-                          height: sizeValue(theme, JumpySize.large),
-                          minWidth: sizeValue(theme, JumpySize.large),
-                          minHeight: sizeValue(theme, JumpySize.large),
-                          padding: spacingValue(theme, JumpySpacing.small2XS),
-                          borderRadius: radiusValue(theme, JumpyRadius.small)
-                        },
-                        children: /* @__PURE__ */ jsx2(CircleClearIcon, {})
-                      }
-                    ) : null,
-                    showErrorIcon || trailing ? /* @__PURE__ */ jsxs2("span", { "data-jumpy-slot": "trailing", "aria-hidden": "true", style: { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: spacingValue(theme, JumpySpacing.smallXS), paddingRight: spacingValue(theme, JumpySpacing.medium), color: "var(--jumpy-cmp-base-input-trailing-color)", fontSize: bodyMedium.fontSize, lineHeight: bodyMedium.lineHeight }, children: [
-                      showErrorIcon ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "trailing-error", style: { display: "inline-flex", alignItems: "center", color: "var(--jumpy-cmp-base-input-trailing-error-fill, var(--jumpy-cmp-base-input-icon-fill))", lineHeight: 1 }, children: /* @__PURE__ */ jsx2(CircleErrorIcon, { style: { width: sizeValue(theme, JumpySize.small2XS), height: sizeValue(theme, JumpySize.small2XS) } }) }) : null,
-                      trailing ? /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "trailing-text", style: { display: "inline-flex", alignItems: "center", maxWidth: `calc(30 * ${spacingValue(theme, JumpySpacing.smallXS)}px)`, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", lineHeight: 1 }, children: trailing }) : null
-                    ] }) : null
-                  ]
-                }
-              ) : null
-            ]
-          }
-        )
-      }
-    ),
-    (hasHelperText || hasCounter) && /* @__PURE__ */ jsxs2(
-      "div",
-      {
-        className: "flex justify-end",
-        style: {
-          gap: spacingValue(theme, JumpySpacing.smallXS),
-          paddingTop: spacingValue(theme, JumpySpacing.small3XS),
-          paddingLeft: spacingValue(theme, JumpySpacing.large),
-          paddingRight: spacingValue(theme, JumpySpacing.large),
-          color: "var(--jumpy-cmp-base-input-helper-color)",
-          fontSize: bodySmall.fontSize,
-          lineHeight: `${bodySmall.fontSize * bodySmall.lineHeight}px`,
-          transition: `color ${animationDurationValue(theme, JumpyAnimationDuration.smallXS)}s ${focused && !readOnly ? theme.animation.timeEasingImpulse : theme.animation.timeEasingRelease}`
-        },
-        children: [
-          hasHelperText ? /* @__PURE__ */ jsx2("span", { id: helperId, style: { flex: 1 }, children: helperText }) : null,
-          hasCounter ? /* @__PURE__ */ jsxs2("span", { id: counterId, style: { flex: 0, whiteSpace: "nowrap" }, children: [
-            inputValue.length,
-            "/",
-            maxLength
-          ] }) : null
-        ]
-      }
-    )
-  ] });
-}
-function JumpField(props) {
-  return /* @__PURE__ */ jsx2(JumpBaseInput, { ...props });
-}
-function JumpChoice({ selected = false, title, description, className = "", ...props }) {
-  const theme = useJumpyTheme();
-  return /* @__PURE__ */ jsxs2(
-    "button",
-    {
-      type: "button",
-      ...props,
-      "data-jumpy-component": "choice",
-      className: cn("w-full p-4 text-left transition active:scale-[0.99] disabled:cursor-not-allowed", className),
-      style: {
-        borderRadius: theme.sizing.choiceRadius,
-        border: `1px solid ${selected ? theme.color.surfacePrimary : theme.color.borderSubtle}`,
-        backgroundColor: selected ? theme.color.infoSurface : theme.color.surfaceCard,
-        color: theme.color.textPrimary,
-        opacity: props.disabled ? theme.opacity.disabled : 1
-      },
-      children: [
-        /* @__PURE__ */ jsx2("span", { className: "block text-sm font-bold", children: title }),
-        description && /* @__PURE__ */ jsx2("span", { className: "mt-1 block text-xs leading-5", style: { color: theme.color.textSecondary }, children: description })
-      ]
-    }
-  );
-}
-function JumpNotice({ tone = "info", title, children, className = "" }) {
-  const theme = useJumpyTheme();
-  const toneStyles = getNoticeToneStyles(theme, tone);
-  return /* @__PURE__ */ jsxs2("div", { className: cn("p-4", className), style: { borderRadius: theme.sizing.choiceRadius, border: `1px solid ${toneStyles.borderColor}`, backgroundColor: toneStyles.backgroundColor, color: toneStyles.color }, children: [
-    title && /* @__PURE__ */ jsx2("p", { className: "text-sm font-bold", children: title }),
-    /* @__PURE__ */ jsx2("div", { className: cn("text-xs leading-5", title && "mt-1"), children })
-  ] });
-}
-function JumpTabs({ items, value, onChange, className = "" }) {
-  const scrollRef = useRef2(null);
-  const indicatorRef = useRef2(null);
-  const tabRefs = useRef2(/* @__PURE__ */ new Map());
-  const placeIndicatorRef = useRef2(null);
-  placeIndicatorRef.current = (animate) => {
-    const selectedTab = tabRefs.current.get(value);
-    const scrollContainer = scrollRef.current;
-    const indicator = indicatorRef.current;
-    if (!selectedTab || !scrollContainer || !indicator) return;
-    const tabBounds = selectedTab.getBoundingClientRect();
-    const containerBounds = scrollContainer.getBoundingClientRect();
-    const tabStyles = getComputedStyle(selectedTab);
-    const content = selectedTab.firstElementChild;
-    const contentStyles = content ? getComputedStyle(content) : null;
-    const insetLeft = Number.parseFloat(tabStyles.paddingLeft) + (contentStyles ? Number.parseFloat(contentStyles.paddingLeft) : 0);
-    const insetRight = Number.parseFloat(tabStyles.paddingRight) + (contentStyles ? Number.parseFloat(contentStyles.paddingRight) : 0);
-    const x = tabBounds.left - containerBounds.left + scrollContainer.scrollLeft + insetLeft;
-    const width = tabBounds.width - insetLeft - insetRight;
-    if (!animate) indicator.style.transition = "none";
-    indicator.style.setProperty("--jumpy-cmp-tabs-indicator-x", `${x}px`);
-    indicator.style.setProperty("--jumpy-cmp-tabs-indicator-width", `${width}px`);
-    indicator.style.setProperty("--jumpy-cmp-tabs-indicator-opacity", "1");
-    if (!animate) {
-      indicator.getBoundingClientRect();
-      indicator.style.transition = "";
-    }
-  };
-  const indicatorPlacedRef = useRef2(false);
-  useLayoutEffect2(() => {
-    placeIndicatorRef.current(indicatorPlacedRef.current);
-    indicatorPlacedRef.current = true;
-  }, [items, value]);
-  useEffect2(() => {
-    const scrollContainer = scrollRef.current;
-    if (!scrollContainer || typeof ResizeObserver === "undefined") return void 0;
-    const sizes = /* @__PURE__ */ new WeakMap();
-    const observer = new ResizeObserver((entries) => {
-      let resized = false;
-      entries.forEach(({ target, contentRect }) => {
-        const size2 = `${contentRect.width}x${contentRect.height}`;
-        if (sizes.has(target) && sizes.get(target) !== size2) resized = true;
-        sizes.set(target, size2);
-      });
-      if (resized) placeIndicatorRef.current(false);
-    });
-    observer.observe(scrollContainer);
-    tabRefs.current.forEach((tab) => observer.observe(tab));
-    return () => observer.disconnect();
-  }, [items]);
-  return /* @__PURE__ */ jsx2("div", { className, "data-jumpy-component": "tabs", children: /* @__PURE__ */ jsxs2("div", { ref: scrollRef, "data-jumpy-slot": "tabs-scroll-container", role: "tablist", "aria-orientation": "horizontal", tabIndex: -1, children: [
-    items.map((item) => {
-      const active = item.key === value;
-      return /* @__PURE__ */ jsx2(
-        "button",
-        {
-          ref: (node) => {
-            if (node) tabRefs.current.set(item.key, node);
-            else tabRefs.current.delete(item.key);
-          },
-          type: "button",
-          role: "tab",
-          "aria-selected": active,
-          onClick: (event) => {
-            onChange(item.key);
-            event.currentTarget.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
-          },
-          "data-jumpy-component": "tab",
-          children: /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "tab-content", children: /* @__PURE__ */ jsx2("span", { "data-jumpy-slot": "tab-label", "data-text": item.label, children: item.label }) })
-        },
-        item.key
-      );
-    }),
-    /* @__PURE__ */ jsx2(
-      "div",
-      {
-        ref: indicatorRef,
-        "aria-hidden": "true",
-        "data-jumpy-slot": "tabs-indicator"
-      }
-    )
-  ] }) });
-}
-function JumpModal({ children }) {
-  return /* @__PURE__ */ jsx2(JumpDialog, { visible: true, children });
-}
 export {
   BrandMark,
   JumpAppShell,
@@ -4663,7 +196,9 @@ export {
   animationEasingValue,
   applySubtreeSelection,
   borderWidthValue,
+  createJumpyPresetFromAccent,
   createJumpyTheme,
+  createJumpyThemeFromAccent,
   createJumpyThemeFromPreset,
   defaultJumpyTheme,
   getHeaderCheckboxProps,