gridsmith-ui 0.30.0 → 0.30.2

package/dist/{chunk-KTPGMJUK.js → chunk-SQHKC4HA.js}

@@ -1,7 +1,8 @@
 "use client";
-import { Badge } from './chunk-NLXQ323J.js';
+import { Badge } from './chunk-BZRZENBS.js';
+import { useKeyboardScroll } from './chunk-ACLKDE5W.js';
 import { slotIcon, Icon } from './chunk-L6HWACK7.js';
-import { cn, FOCUS_RING } from './chunk-JTU7OBYJ.js';
+import { cn, FOCUS_RING, FOCUS_INSET } from './chunk-YL5KD5RC.js';
 import { forwardRef, useState, useCallback } from 'react';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 
@@ -23,6 +24,8 @@ function CodeBlock({
   }, [code]);
   const lines = code.split("\n");
   const wraps = wrap ?? lines.length === 1;
+  const [scroller, setScroller] = useState(null);
+  useKeyboardScroll(scroller, "Code", !wraps, false, "x");
   const gutterWidth = showLineNumbers ? `${String(lines.length).length + 1}ch` : void 0;
   return /* @__PURE__ */ jsxs(
     "div",
@@ -60,7 +63,7 @@ function CodeBlock({
             }
           )
         ] }),
-        /* @__PURE__ */ jsx("div", { className: wraps ? void 0 : "overflow-x-auto", "data-wrap": wraps ? "true" : void 0, children: /* @__PURE__ */ jsx("pre", { className: cn("p-ds-4 text-sm leading-relaxed font-[family-name:var(--ds-font-mono)]", wraps && "whitespace-pre-wrap break-words"), children: /* @__PURE__ */ jsx("code", { children: lines.map((line, i) => (
+        /* @__PURE__ */ jsx("div", { ref: setScroller, className: wraps ? void 0 : cn("overflow-x-auto", FOCUS_INSET), "data-wrap": wraps ? "true" : void 0, children: /* @__PURE__ */ jsx("pre", { className: cn("p-ds-4 text-sm leading-relaxed font-[family-name:var(--ds-font-mono)]", wraps && "whitespace-pre-wrap break-words"), children: /* @__PURE__ */ jsx("code", { children: lines.map((line, i) => (
           // with line numbers each line is a two-column row, so a wrapped line continues under its text, not under the gutter
           /* @__PURE__ */ jsxs("span", { className: showLineNumbers ? "grid grid-cols-[max-content_1fr]" : "block", children: [
             showLineNumbers && /* @__PURE__ */ jsx(
@@ -159,5 +162,5 @@ function Divider({
 }
 
 export { CodeBlock, Divider, Link };
-//# sourceMappingURL=chunk-KTPGMJUK.js.map
-//# sourceMappingURL=chunk-KTPGMJUK.js.map
+//# sourceMappingURL=chunk-SQHKC4HA.js.map
+//# sourceMappingURL=chunk-SQHKC4HA.js.map

package/dist/chunk-SQHKC4HA.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../showcase/src/components/CodeBlock.tsx","../../../showcase/src/components/Link.tsx","../../../showcase/src/components/Divider.tsx"],"names":["Link","jsxs","jsx"],"mappings":"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","file":"chunk-SQHKC4HA.js","sourcesContent":["import { useState, useCallback } from \"react\";\nimport { cn, FOCUS_INSET, FOCUS_RING } from \"../lib/utils\";\nimport { useKeyboardScroll } from \"../lib/use-keyboard-scroll\";\nimport { Icon } from \"../lib/icons\";\nimport { Badge } from \"./Badge\";\n\ninterface CodeBlockProps {\n  code: string;\n  language?: string;\n  showLineNumbers?: boolean;\n  /** Wrap long lines instead of scrolling sideways. Default: on for a single-line snippet (a tracking tag, a command), off for multi-line code. */\n  wrap?: boolean;\n  className?: string;\n}\n\nexport function CodeBlock({\n  code,\n  language,\n  showLineNumbers = false,\n  wrap,\n  className,\n}: CodeBlockProps) {\n  const [copied, setCopied] = useState(false);\n\n  const handleCopy = useCallback(async () => {\n    try {\n      await navigator.clipboard.writeText(code);\n      setCopied(true);\n      setTimeout(() => setCopied(false), 2000);\n    } catch {\n      /* clipboard not available */\n    }\n  }, [code]);\n\n  const lines = code.split(\"\\n\");\n  const wraps = wrap ?? lines.length === 1;\n  // code that scrolls sideways, with nothing in it to Tab to: a Tab stop while it scrolls (Sprint 25.30 item 2)\n  const [scroller, setScroller] = useState<HTMLDivElement | null>(null);\n  useKeyboardScroll(scroller, \"Code\", !wraps, false, \"x\");\n  const gutterWidth = showLineNumbers ? `${String(lines.length).length + 1}ch` : undefined;\n\n  return (\n    <div\n      className={cn(\n        \"relative group\",\n        \"bg-[var(--ds-bg-surface)] text-[var(--ds-text-primary)]\",\n        \"border-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)]\",\n        \"rounded-[var(--ds-radius-md)]\",\n        \"shadow-[var(--ds-shadow-sm)]\",\n        \"overflow-hidden\",\n        className,\n      )}\n    >\n      <div className=\"flex items-center justify-between px-ds-4 py-ds-2 border-b-[length:var(--ds-border-width)] border-[var(--ds-border-subtle)] bg-[var(--ds-bg-muted)]\">\n        <div className=\"flex items-center gap-ds-2\">\n          {language && <Badge variant=\"outline\" size=\"sm\">{language}</Badge>}\n        </div>\n        <button\n          type=\"button\"\n          onClick={handleCopy}\n          className={cn(\n            \"inline-flex items-center gap-ds-1.5 px-ds-2 py-ds-1 text-xs font-medium cursor-pointer\",\n            \"text-[var(--ds-text-muted)] hover:text-[var(--ds-text-primary)]\",\n            \"rounded-[var(--ds-radius-sm)]\",\n            \"hover:bg-[var(--ds-bg-surface)]\",\n            \"transition-colors\",\n            FOCUS_RING,\n          )}\n          aria-label={copied ? \"Copied\" : \"Copy code\"}\n        >\n          {/* Sprint 25.8.7 item 12: the copy icon, where a folder stood */}\n          <Icon name={copied ? \"check\" : \"copy\"} size={14} />\n          {copied ? \"Copied\" : \"Copy\"}\n        </button>\n      </div>\n\n      <div ref={setScroller} className={wraps ? undefined : cn(\"overflow-x-auto\", FOCUS_INSET)} data-wrap={wraps ? \"true\" : undefined}>\n        <pre className={cn(\"p-ds-4 text-sm leading-relaxed font-[family-name:var(--ds-font-mono)]\", wraps && \"whitespace-pre-wrap break-words\")}>\n          <code>\n            {lines.map((line, i) => (\n              // with line numbers each line is a two-column row, so a wrapped line continues under its text, not under the gutter\n              <span key={i} className={showLineNumbers ? \"grid grid-cols-[max-content_1fr]\" : \"block\"}>\n                {showLineNumbers && (\n                  <span\n                    className=\"text-right text-[var(--ds-text-muted)] select-none mr-ds-4 opacity-50\"\n                    style={{ width: gutterWidth }}\n                  >\n                    {i + 1}\n                  </span>\n                )}\n                <span className=\"min-w-0\">{line || \" \"}</span>\n              </span>\n            ))}\n          </code>\n        </pre>\n      </div>\n    </div>\n  );\n}\n","import { forwardRef, type AnchorHTMLAttributes, type ElementType, type ReactNode } from \"react\";\nimport { cn, FOCUS_RING } from \"../lib/utils\";\nimport { slotIcon, type IconSlot } from \"../lib/icons\";\n\ntype LinkUnderline = \"hover\" | \"always\" | \"none\";\ntype LinkTone = \"accent\" | \"muted\" | \"inherit\";\n\nexport interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {\n  href: string;\n  children: ReactNode;\n  /** When to show the underline. Default \"hover\". */\n  underline?: LinkUnderline;\n  /** Colour: accent (default), muted for secondary links, inherit to match surrounding text. */\n  tone?: LinkTone;\n  /** Opens in a new tab with rel=\"noopener noreferrer\". Default false. */\n  external?: boolean;\n  /**\n   * Render through a router link component instead of a plain anchor\n   * (e.g. `component={RouterLink}` from react-router or next/link). The\n   * component receives the same props; `href` is also passed as `to` for\n   * react-router compatibility. Any element type: a router's Link requires\n   * its own props (react-router's `to`), which a narrower type refused under\n   * strict TypeScript (Sprint 25.16 A19).\n   */\n  component?: ElementType;\n  /** An icon name (\"info\"), drawn as the theme's icon at 14 px, or an element. Not text: use children. */\n  iconLeft?: IconSlot;\n  /** As iconLeft, after the label. */\n  iconRight?: IconSlot;\n}\n\nconst toneStyles: Record<LinkTone, string> = {\n  accent: \"text-[var(--ds-accent-ink)] hover:text-[var(--ds-accent-primary-hover)] active:text-[var(--ds-accent-primary-active)]\",\n  muted: \"text-[var(--ds-text-secondary)] hover:text-[var(--ds-text-primary)]\",\n  inherit: \"text-inherit hover:text-[var(--ds-accent-ink)]\",\n};\n\nconst underlineStyles: Record<LinkUnderline, string> = {\n  hover: \"no-underline hover:underline\",\n  always: \"underline underline-offset-2\",\n  none: \"no-underline\",\n};\n\n/**\n * Navigation link. Renders a real <a> (or a router link via `component`) so\n * middle-click, open-in-new-tab, right-click \"copy link\" and screen readers\n * all behave correctly. Visually identical to Button variant=\"link\".\n *\n * Use Link for NAVIGATION (to a page or URL). Use Button variant=\"link\" for an\n * ACTION that should look like a link (show more, resend code). Never use a\n * ghost Button for inline text — its padding breaks the line.\n */\nexport const Link = forwardRef<HTMLAnchorElement, LinkProps>(function Link(\n  { href, children, underline = \"hover\", tone = \"accent\", external = false, component: Component, iconLeft, iconRight, className, target, rel, ...props },\n  ref,\n) {\n  const classes = cn(\n    \"inline-flex items-center gap-ds-1 font-medium cursor-pointer\",\n    \"transition-colors duration-[var(--ds-transition-speed)]\",\n    FOCUS_RING,\n    \"rounded-[var(--ds-radius-sm)]\",\n    toneStyles[tone],\n    underlineStyles[underline],\n    className,\n  );\n  const resolvedTarget = external ? \"_blank\" : target;\n  const resolvedRel = external ? cn(\"noopener noreferrer\", rel) : rel;\n  const content = (\n    <>\n      {slotIcon(iconLeft, 14, \"Link's iconLeft\")}\n      {children}\n      {slotIcon(iconRight, 14, \"Link's iconRight\")}\n    </>\n  );\n\n  if (Component) {\n    return (\n      <Component ref={ref} href={href} to={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n        {content}\n      </Component>\n    );\n  }\n\n  return (\n    <a ref={ref} href={href} className={classes} target={resolvedTarget} rel={resolvedRel} {...props}>\n      {content}\n    </a>\n  );\n});\n","import { cn } from \"../lib/utils\";\nimport type { ReactNode } from \"react\";\n\ntype Orientation = \"horizontal\" | \"vertical\";\n\ninterface DividerProps {\n  orientation?: Orientation;\n  label?: ReactNode;\n  className?: string;\n}\n\nexport function Divider({\n  orientation = \"horizontal\",\n  label,\n  className,\n}: DividerProps) {\n  if (orientation === \"vertical\") {\n    return (\n      <div\n        role=\"separator\"\n        aria-orientation=\"vertical\"\n        className={cn(\n          \"inline-block self-stretch min-h-[1em]\",\n          \"w-[var(--ds-divider-width)]\",\n          \"bg-[var(--ds-border-default)]\",\n          className,\n        )}\n      />\n    );\n  }\n\n  if (label) {\n    return (\n      <div\n        role=\"separator\"\n        className={cn(\"flex items-center gap-ds-3\", className)}\n      >\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n        <span className=\"text-xs font-medium text-[var(--ds-text-muted)] shrink-0\">\n          {label}\n        </span>\n        <span className=\"flex-1 h-[var(--ds-divider-width)] bg-[var(--ds-border-default)]\" />\n      </div>\n    );\n  }\n\n  return (\n    <hr\n      role=\"separator\"\n      className={cn(\n        \"border-none w-full\",\n        \"h-[var(--ds-divider-width)]\",\n        \"bg-[var(--ds-border-default)]\",\n        className,\n      )}\n    />\n  );\n}\n"]}

package/dist/{chunk-NI5542ZM.js → chunk-USHW523V.js}

@@ -2,15 +2,13 @@
 import { useShellPreferences, PREFERENCE_HOUSE_DEFAULTS } from './chunk-TYNDXMBV.js';
 import { useInputModality } from './chunk-7RKC5C7G.js';
 import { useReportedChange, useOptionalFormContext, FormChangeCtx } from './chunk-72SDAX54.js';
-import { ControlSizeContext, triggerType, RowsCtx, Button } from './chunk-Q36JVJX4.js';
-import { useRevealFocus } from './chunk-HTXP5BMM.js';
-import { useFocusLeave, usePopupFocus, focusAfterRemoval, usePressMarks, focusInitial } from './chunk-OIOII5L6.js';
-import { useTextOverflow, AutoTooltip } from './chunk-GQVBZ4GW.js';
-import { Slot } from './chunk-7Q46JXSK.js';
+import { ControlSizeContext, triggerType, RowsCtx, Button } from './chunk-MIUSSYVE.js';
+import { useTextOverflow } from './chunk-ZCDA74RQ.js';
+import { useRevealFocus, AutoTooltip } from './chunk-WWN6CQKI.js';
 import { Icon, warnOnce } from './chunk-L6HWACK7.js';
-import { usePosition } from './chunk-HP7WUZPK.js';
-import { useLatest } from './chunk-WH2FUFAC.js';
-import { cn, ERROR_HAS_FOCUS_RING, FIELD_HAS_FOCUS_RING, ERROR_FOCUS_RING, FIELD_FOCUS_RING, FOCUS_RING, ERROR_ACTIVE_RING, ACTIVE_RING, ERROR_FOCUS_WITHIN_RING, FIELD_FOCUS_WITHIN_RING, GLASS_DROPDOWN } from './chunk-JTU7OBYJ.js';
+import { Slot } from './chunk-7Q46JXSK.js';
+import { useLatest, useFocusLeave, usePopupFocus, focusAfterRemoval, usePosition, usePressMarks, focusInitial, focusAfterSelfRemoval, tabStops } from './chunk-4HJDOZ2M.js';
+import { cn, ERROR_HAS_FOCUS_RING, FIELD_HAS_FOCUS_RING, ERROR_FOCUS_RING, FIELD_FOCUS_RING, FOCUS_RING, ERROR_ACTIVE_RING, ACTIVE_RING, ERROR_FOCUS_WITHIN_RING, FIELD_FOCUS_WITHIN_RING, GLASS_DROPDOWN } from './chunk-YL5KD5RC.js';
 import { createContext, useContext, useRef, useCallback, useEffect, useId, useState, Children, isValidElement, useMemo, cloneElement, useLayoutEffect } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { createPortal } from 'react-dom';
@@ -411,6 +409,7 @@ function Dropdown({
   const triggerId = control.id ?? generatedId;
   const labelSpanId = `${triggerId}-label`;
   const labelledBy = control.labelId ? `${control.labelId} ${triggerId}` : label && !ariaLabel ? `${labelSpanId} ${triggerId}` : void 0;
+  const listLabelledBy = control.labelId ?? (label && !ariaLabel ? labelSpanId : void 0);
   const invalid = control.invalid;
   const size = sizeProp ?? contextSize ?? "md";
   const [open, setOpen] = useState(false);
@@ -558,6 +557,8 @@ function Dropdown({
     groups.get(g).push(opt);
   }
   const hasGroups = Array.from(groups.keys()).some((k) => k !== "");
+  const drawn = hasGroups ? Array.from(groups.values()).flat() : filtered;
+  const stopId = (drawn.find((o) => selectedValues.includes(o.id)) ?? drawn[0])?.id;
   const handleSelect = (id) => {
     if (multiple) {
       const arr = selectedValues.includes(id) ? selectedValues.filter((v) => v !== id) : [...selectedValues, id];
@@ -654,12 +655,13 @@ function Dropdown({
                 className: cn("w-full bg-transparent text-[var(--ds-text-primary)] placeholder:text-[var(--ds-text-muted)] outline-none", size === "sm" ? "text-xs" : "text-sm")
               }
             ) }),
-            /* @__PURE__ */ jsx("div", { ref: setListbox, role: "listbox", className: "overflow-y-auto scroll-p-[4px]", style: { padding: "max(var(--ds-space-1), 4px)", maxHeight: "var(--ds-dropdown-max-height)" }, children: filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: cn("text-[var(--ds-text-muted)] text-center py-ds-4", size === "sm" ? "text-xs" : "text-sm"), children: "No options found" }) : hasGroups ? Array.from(groups.entries()).map(([group, opts]) => /* @__PURE__ */ jsxs("div", { children: [
+            /* @__PURE__ */ jsx("div", { ref: setListbox, role: "listbox", "aria-labelledby": listLabelledBy, "aria-label": listLabelledBy ? void 0 : ariaLabel, "aria-multiselectable": multiple || void 0, className: "overflow-y-auto scroll-p-[4px]", style: { padding: "max(var(--ds-space-1), 4px)", maxHeight: "var(--ds-dropdown-max-height)" }, children: filtered.length === 0 ? /* @__PURE__ */ jsx("p", { className: cn("text-[var(--ds-text-muted)] text-center py-ds-4", size === "sm" ? "text-xs" : "text-sm"), children: "No options found" }) : hasGroups ? Array.from(groups.entries()).map(([group, opts]) => /* @__PURE__ */ jsxs("div", { children: [
               group && /* @__PURE__ */ jsx("p", { className: "text-2xs font-medium uppercase tracking-wider text-[var(--ds-text-muted)] px-ds-2 pt-ds-2 pb-ds-1", children: group }),
               opts.map((opt) => /* @__PURE__ */ jsx(
                 OptionButton,
                 {
                   opt,
+                  tabStop: opt.id === stopId,
                   isSelected: selectedValues.includes(opt.id),
                   multiple,
                   onSelect: handleSelect,
@@ -671,6 +673,7 @@ function Dropdown({
               OptionButton,
               {
                 opt,
+                tabStop: opt.id === stopId,
                 isSelected: selectedValues.includes(opt.id),
                 multiple,
                 onSelect: handleSelect,
@@ -691,7 +694,7 @@ function Dropdown({
           className: "inline-flex items-center gap-ds-1 text-xs rounded-[var(--ds-radius-sm)] bg-[var(--ds-bg-muted)] text-[var(--ds-text-secondary)] px-ds-1.5 py-ds-0.5",
           children: [
             opt.label,
-            /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx(AutoTooltip, { content: `Remove ${opt.label}`, children: /* @__PURE__ */ jsx(
               "button",
               {
                 type: "button",
@@ -704,7 +707,7 @@ function Dropdown({
                 "aria-label": `Remove ${opt.label}`,
                 children: /* @__PURE__ */ jsx(Icon, { name: "close", size: 10 })
               }
-            )
+            ) })
           ]
         },
         v
@@ -714,6 +717,7 @@ function Dropdown({
 }
 function OptionButton({
   opt,
+  tabStop,
   isSelected,
   multiple,
   onSelect,
@@ -726,7 +730,7 @@ function OptionButton({
       role: "option",
       "data-option-id": opt.id,
       "aria-selected": isSelected,
-      tabIndex: -1,
+      tabIndex: tabStop ? 0 : -1,
       onClick: () => onSelect(opt.id),
       className: cn(
         "w-full text-left cursor-pointer rounded-[var(--ds-radius-sm)]",
@@ -1098,11 +1102,31 @@ function contentTop(el) {
 }
 function LoadMore({ hasMore, onLoadMore, loadMoreLabel, currentPage, scroll, className }) {
   const marker = useRef(null);
+  const button = useRef(null);
+  const pager = useRef(null);
+  const watching = useRef(null);
+  const press = () => {
+    const b = button.current, root = pager.current;
+    if (b && root && document.activeElement === b) {
+      const list = root.previousElementSibling;
+      const had = new Set(rowsOf(list));
+      watching.current?.();
+      watching.current = focusAfterSelfRemoval(b, {
+        item: root,
+        to: () => {
+          const fresh = rowsOf(list).find((r) => !had.has(r));
+          return fresh ? tabStops(fresh)[0] ?? fresh : null;
+        }
+      });
+    }
+    onLoadMore();
+  };
   const load = useLatest(onLoadMore);
   const loadedAt = useRef(null);
+  const [held, setHeld] = useState(false);
   useEffect(() => {
     const el = marker.current;
-    if (!scroll || !hasMore || !el || typeof IntersectionObserver === "undefined") return;
+    if (!scroll || !hasMore || !el || held || typeof IntersectionObserver === "undefined") return;
     const observer = new IntersectionObserver((entries) => {
       if (!entries.some((e) => e.isIntersecting)) return;
       const at = contentTop(el);
@@ -1119,13 +1143,40 @@ function LoadMore({ hasMore, onLoadMore, loadMoreLabel, currentPage, scroll, cla
       observer.disconnect();
       window.removeEventListener("scroll", rearm, { capture: true });
     };
-  }, [scroll, hasMore, currentPage, load]);
+  }, [scroll, hasMore, currentPage, load, held]);
+  useEffect(() => {
+    const b = button.current;
+    if (b && document.activeElement === b) b.scrollIntoView?.({ block: "nearest" });
+  }, [currentPage]);
   if (!hasMore) return null;
-  return /* @__PURE__ */ jsxs("div", { "data-ds-pager": "", "data-pagination-mode": scroll ? "infinite-scroll" : "load-more", className: cn("flex flex-col items-center", className), children: [
+  return /* @__PURE__ */ jsxs("div", { ref: pager, "data-ds-pager": "", "data-pagination-mode": scroll ? "infinite-scroll" : "load-more", className: cn("flex flex-col items-center", className), children: [
     scroll && /* @__PURE__ */ jsx("div", { ref: marker, "data-load-more-trigger": "", "aria-hidden": "true", className: "h-px w-full" }),
-    /* @__PURE__ */ jsx(Button, { type: "button", variant: "secondary", onClick: onLoadMore, children: loadMoreLabel ?? "Load more" })
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref: button,
+        type: "button",
+        variant: "secondary",
+        onClick: press,
+        onFocus: (e) => setHeld(scroll && byKeyboard(e.currentTarget)),
+        onBlur: () => setHeld(false),
+        children: loadMoreLabel ?? "Load more"
+      }
+    )
   ] });
 }
+function rowsOf(list) {
+  if (!list) return [];
+  const marked = list.querySelectorAll("[data-row-key], [data-row-index]");
+  return Array.from(marked.length ? marked : list.querySelectorAll('tbody > tr, li, [role="row"], [data-card]'));
+}
+function byKeyboard(el) {
+  try {
+    return el.matches(":focus-visible");
+  } catch {
+    return true;
+  }
+}
 function PageNumbers({ currentPage, totalPages, onPageChange, pageSize: pageSizeProp, pageSizeOptions, onPageSizeChange, className }) {
   const pages = buildPageRange(currentPage, totalPages);
   const preferences = useShellPreferences();
@@ -1148,11 +1199,14 @@ function PageNumbers({ currentPage, totalPages, onPageChange, pageSize: pageSize
       ) })
     ] }),
     totalPages > 1 && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-ds-1", children: [
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(AutoTooltip, { content: "Previous page", children: /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
-          onClick: () => onPageChange(currentPage - 1),
+          onClick: (e) => {
+            focusAfterSelfRemoval(e.currentTarget);
+            onPageChange(currentPage - 1);
+          },
           disabled: currentPage <= 1,
           "aria-label": "Previous page",
           className: cn(
@@ -1167,7 +1221,7 @@ function PageNumbers({ currentPage, totalPages, onPageChange, pageSize: pageSize
           ),
           children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: 16, className: "rotate-180" })
         }
-      ),
+      ) }),
       pages.map(
         (p, i) => p === "..." ? /* @__PURE__ */ jsx(EllipsisJumper, { totalPages, onPageChange }, `ellipsis-${i}`) : /* @__PURE__ */ jsx(
           "button",
@@ -1188,11 +1242,14 @@ function PageNumbers({ currentPage, totalPages, onPageChange, pageSize: pageSize
           p
         )
       ),
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsx(AutoTooltip, { content: "Next page", children: /* @__PURE__ */ jsx(
         "button",
         {
           type: "button",
-          onClick: () => onPageChange(currentPage + 1),
+          onClick: (e) => {
+            focusAfterSelfRemoval(e.currentTarget);
+            onPageChange(currentPage + 1);
+          },
           disabled: currentPage >= totalPages,
           "aria-label": "Next page",
           className: cn(
@@ -1207,7 +1264,7 @@ function PageNumbers({ currentPage, totalPages, onPageChange, pageSize: pageSize
           ),
           children: /* @__PURE__ */ jsx(Icon, { name: "chevron-right", size: 16 })
         }
-      )
+      ) })
     ] })
   ] });
 }
@@ -1374,5 +1431,5 @@ function useWholeListCheck(component, length, pager) {
 }
 
 export { AddAnotherRowCtx, CHECK_FILL, Dropdown, Field, FilterRowContext, InlineFieldError, Input, Label, NumberInput, OutsideField, Pagination, Popover, SWITCH_KNOB_MOTION, SWITCH_KNOB_OFF, SWITCH_KNOB_ON, SWITCH_TRACK_OFF, SWITCH_TRACK_ON, Textarea, Toggle, pagerPart, useField, useFieldControl, usePagination, useWholeListCheck };
-//# sourceMappingURL=chunk-NI5542ZM.js.map
-//# sourceMappingURL=chunk-NI5542ZM.js.map
+//# sourceMappingURL=chunk-USHW523V.js.map
+//# sourceMappingURL=chunk-USHW523V.js.map