@nori-ui/core 0.0.5 → 1.0.2

package/dist/chunk-7GPDNQSX.js

@@ -0,0 +1,967 @@
+import { Select } from './chunk-ZQMNGPLE.js';
+import { useTranslation } from './chunk-RFW5SRZA.js';
+import { Slot } from './chunk-ZIBNLXIV.js';
+import { px } from './chunk-5A2QOOVN.js';
+import { cn } from './chunk-CHXHRJNZ.js';
+import { useThemeColors } from './chunk-R5JMDDCB.js';
+import { __name } from './chunk-WCQVDF3K.js';
+import { createContext, useState, useRef, useCallback, useMemo, useEffect, useContext } from 'react';
+import { useWindowDimensions, View, Text, TextInput, Platform, Pressable } from 'react-native';
+import { jsxs, jsx, Fragment } from 'nativewind/jsx-runtime';
+
+var range = /* @__PURE__ */ __name((from, to) => {
+  if (to < from) {
+    return [];
+  }
+  const out = new Array(to - from + 1);
+  for (let i = 0; i < out.length; i += 1) {
+    out[i] = from + i;
+  }
+  return out;
+}, "range");
+function usePagination(args) {
+  const {
+    page: controlledPage,
+    defaultPage = 1,
+    pageCount,
+    siblingCount = 1,
+    boundaryCount = 1,
+    showFirstLast = false,
+    showPrevNext = true,
+    onPageChange
+  } = args;
+  const isControlled = controlledPage !== void 0;
+  const [uncontrolledPage, setUncontrolledPage] = useState(defaultPage);
+  const onChangeRef = useRef(onPageChange);
+  onChangeRef.current = onPageChange;
+  const safePageCount = Math.max(1, Math.floor(pageCount));
+  const rawPage = isControlled ? controlledPage : uncontrolledPage;
+  const currentPage = Math.min(Math.max(1, Math.floor(rawPage)), safePageCount);
+  const goToPage = useCallback(
+    (next2) => {
+      const clamped = Math.min(Math.max(1, Math.floor(next2)), Math.max(1, Math.floor(pageCount)));
+      if (!isControlled) {
+        setUncontrolledPage(clamped);
+      }
+      onChangeRef.current?.(clamped);
+    },
+    [isControlled, pageCount]
+  );
+  const prev = useCallback(() => goToPage(currentPage - 1), [goToPage, currentPage]);
+  const next = useCallback(() => goToPage(currentPage + 1), [goToPage, currentPage]);
+  const first = useCallback(() => goToPage(1), [goToPage]);
+  const last = useCallback(() => goToPage(safePageCount), [goToPage, safePageCount]);
+  const pages = useMemo(() => {
+    const items = [];
+    const safeSibling = Math.max(0, Math.floor(siblingCount));
+    const safeBoundary = Math.max(0, Math.floor(boundaryCount));
+    if (showFirstLast) {
+      items.push({ type: "first", disabled: currentPage <= 1 });
+    }
+    if (showPrevNext) {
+      items.push({ type: "prev", disabled: currentPage <= 1 });
+    }
+    const startPages = range(1, Math.min(safeBoundary, safePageCount));
+    const endPages = range(Math.max(safePageCount - safeBoundary + 1, safeBoundary + 1), safePageCount);
+    const siblingsStart = Math.max(
+      Math.min(currentPage - safeSibling, safePageCount - safeBoundary - safeSibling * 2 - 1),
+      safeBoundary + 2
+    );
+    const siblingsEnd = Math.min(
+      Math.max(currentPage + safeSibling, safeBoundary + safeSibling * 2 + 2),
+      endPages.length > 0 ? endPages[0] - 2 : safePageCount - 1
+    );
+    const middle = [];
+    if (siblingsStart > safeBoundary + 2) {
+      middle.push("ellipsis");
+    } else if (safeBoundary + 1 < safePageCount - safeBoundary) {
+      middle.push(safeBoundary + 1);
+    }
+    for (const p of range(siblingsStart, siblingsEnd)) {
+      middle.push(p);
+    }
+    if (siblingsEnd < safePageCount - safeBoundary - 1) {
+      middle.push("ellipsis");
+    } else if (safePageCount - safeBoundary > safeBoundary) {
+      middle.push(safePageCount - safeBoundary);
+    }
+    const seen = /* @__PURE__ */ new Set();
+    const pushPage = /* @__PURE__ */ __name((n) => {
+      if (n < 1 || n > safePageCount || seen.has(n)) {
+        return;
+      }
+      seen.add(n);
+      items.push({ type: "page", page: n, selected: n === currentPage });
+    }, "pushPage");
+    for (const n of startPages) {
+      pushPage(n);
+    }
+    for (const m of middle) {
+      if (m === "ellipsis") {
+        items.push({ type: "ellipsis" });
+      } else {
+        pushPage(m);
+      }
+    }
+    for (const n of endPages) {
+      pushPage(n);
+    }
+    if (showPrevNext) {
+      items.push({ type: "next", disabled: currentPage >= safePageCount });
+    }
+    if (showFirstLast) {
+      items.push({ type: "last", disabled: currentPage >= safePageCount });
+    }
+    return items;
+  }, [currentPage, safePageCount, siblingCount, boundaryCount, showFirstLast, showPrevNext]);
+  return {
+    page: currentPage,
+    pages,
+    canPrev: currentPage > 1,
+    canNext: currentPage < safePageCount,
+    goToPage,
+    prev,
+    next,
+    first,
+    last
+  };
+}
+__name(usePagination, "usePagination");
+var PAGINATION_COMPACT_BREAKPOINT = 480;
+var PaginationContext = createContext(null);
+var usePaginationContext = /* @__PURE__ */ __name((label) => {
+  const ctx = useContext(PaginationContext);
+  if (!ctx) {
+    throw new Error(`<${label}> must be rendered inside a <Pagination> or <Pagination.Root>.`);
+  }
+  return ctx;
+}, "usePaginationContext");
+var ItemButton = /* @__PURE__ */ __name(({ type, selected, disabled, ariaLabel, ariaCurrent, label, onPress, testID }) => {
+  const colors = useThemeColors();
+  const isChevron = type === "prev" || type === "next" || type === "first" || type === "last";
+  const isInteractive = !disabled && type !== "ellipsis";
+  const size = px(colors.spacing["8"]);
+  if (type === "ellipsis") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        "aria-hidden": true,
+        accessibilityElementsHidden: true,
+        importantForAccessibility: "no-hide-descendants",
+        style: {
+          minWidth: size,
+          minHeight: size,
+          alignItems: "center",
+          justifyContent: "center"
+        },
+        children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontFamily: colors.fontFamily.body,
+              fontSize: px(colors.fontSize.sm),
+              color: colors.semantic.text.muted,
+              // Optical adjust so the dots sit on the row baseline.
+              marginTop: -2,
+              letterSpacing: 1
+            },
+            children: label
+          }
+        )
+      }
+    );
+  }
+  const baseStyle = {
+    minWidth: size,
+    height: size,
+    paddingHorizontal: px(colors.spacing["2"]),
+    alignItems: "center",
+    justifyContent: "center",
+    borderRadius: px(colors.radius.md),
+    // Selected: filled pill in primary. Default: transparent. Press/hover
+    // deltas overlay this in the style fn below.
+    backgroundColor: selected ? colors.semantic.interactive.primary : "transparent",
+    // A 1px transparent border is reserved on every item so the layout
+    // stays stable when the selected one shows its accent border.
+    borderWidth: 1,
+    borderColor: selected ? colors.semantic.interactive.primary : "transparent",
+    opacity: disabled ? 0.35 : 1
+  };
+  const webExtras = Platform.OS === "web" ? {
+    transitionProperty: "background-color, color, border-color",
+    transitionDuration: "120ms",
+    transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)"
+  } : null;
+  const staticStyle = { ...baseStyle, ...webExtras ?? {} };
+  return /* @__PURE__ */ jsx(
+    Pressable,
+    {
+      ...testID !== void 0 ? { testID } : {},
+      role: "button",
+      accessibilityRole: "button",
+      accessibilityLabel: ariaLabel,
+      "aria-label": ariaLabel,
+      ...ariaCurrent ? { "aria-current": ariaCurrent } : {},
+      disabled,
+      "aria-disabled": disabled || void 0,
+      onPress: isInteractive ? onPress : void 0,
+      style: Platform.OS === "web" ? (state) => {
+        const { pressed, hovered } = state;
+        const interactive = !selected && (pressed || hovered) ? colors.semantic.background.subtle : staticStyle.backgroundColor;
+        return { ...staticStyle, backgroundColor: interactive };
+      } : staticStyle,
+      children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: {
+            fontFamily: colors.fontFamily.body,
+            fontSize: isChevron ? px(colors.fontSize.md) : px(colors.fontSize.sm),
+            lineHeight: px(colors.fontSize.md),
+            color: selected ? colors.semantic.text.inverted : disabled ? colors.semantic.text.muted : colors.semantic.text.default,
+            fontWeight: selected ? colors.fontWeight.semibold : colors.fontWeight.medium,
+            fontVariant: ["tabular-nums"],
+            // Chevron glyphs sit a hair high in most fonts.
+            marginTop: isChevron ? -1 : 0
+          },
+          children: label
+        }
+      )
+    }
+  );
+}, "ItemButton");
+var LiveRegion = /* @__PURE__ */ __name(({ message }) => {
+  if (Platform.OS === "web") {
+    return /* @__PURE__ */ jsx(
+      View,
+      {
+        style: {
+          position: "absolute",
+          width: 1,
+          height: 1,
+          overflow: "hidden",
+          opacity: 0
+        },
+        role: "status",
+        "aria-live": "polite",
+        "aria-atomic": true,
+        children: /* @__PURE__ */ jsx(Text, { accessibilityLiveRegion: "polite", children: message })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(View, { accessibilityLiveRegion: "polite", style: { width: 0, height: 0 }, children: /* @__PURE__ */ jsx(Text, { children: message }) });
+}, "LiveRegion");
+var ItemsRenderer = /* @__PURE__ */ __name(({ items, onItemPress }) => {
+  const { labels, renderItem, dir } = usePaginationContext("Pagination.Items");
+  const elements = items.map((item, idx) => {
+    const key = `${item.type}-${item.page ?? idx}-${idx}`;
+    const ariaLabel = ariaLabelFor(item, labels);
+    const ariaCurrent = item.selected ? "page" : void 0;
+    const display = displayLabelFor(item, labels, dir);
+    const onPress = /* @__PURE__ */ __name(() => onItemPress(item), "onPress");
+    if (renderItem && item.type !== "ellipsis") {
+      return /* @__PURE__ */ jsx(View, { children: renderItem({
+        type: item.type,
+        ...item.page !== void 0 ? { page: item.page } : {},
+        selected: item.selected ?? false,
+        disabled: item.disabled ?? false,
+        ariaLabel,
+        ...ariaCurrent ? { ariaCurrent } : {},
+        children: display,
+        onPress
+      }) }, key);
+    }
+    return /* @__PURE__ */ jsx(
+      ItemButton,
+      {
+        type: item.type,
+        ...item.page !== void 0 ? { page: item.page } : {},
+        selected: item.selected ?? false,
+        disabled: item.disabled ?? false,
+        ariaLabel,
+        ...ariaCurrent ? { ariaCurrent } : {},
+        label: display,
+        onPress
+      },
+      key
+    );
+  });
+  return /* @__PURE__ */ jsx(Fragment, { children: elements });
+}, "ItemsRenderer");
+function ariaLabelFor(item, labels) {
+  switch (item.type) {
+    case "first":
+      return labels.first;
+    case "prev":
+      return labels.prev;
+    case "next":
+      return labels.next;
+    case "last":
+      return labels.last;
+    case "ellipsis":
+      return labels.ellipsis;
+    case "page":
+      return item.selected ? labels.currentPage : labels.gotoPage(item.page ?? 0);
+  }
+}
+__name(ariaLabelFor, "ariaLabelFor");
+function displayLabelFor(item, labels, dir) {
+  const flip = dir === "rtl";
+  switch (item.type) {
+    case "first":
+      return flip ? "\xBB" : "\xAB";
+    case "last":
+      return flip ? "\xAB" : "\xBB";
+    case "prev":
+      return flip ? "\u203A" : "\u2039";
+    case "next":
+      return flip ? "\u2039" : "\u203A";
+    case "ellipsis":
+      return "\u2026";
+    case "page":
+      return String(item.page ?? "");
+  }
+}
+__name(displayLabelFor, "displayLabelFor");
+var CompactView = /* @__PURE__ */ __name(({
+  onPrev,
+  onNext,
+  canPrev,
+  canNext,
+  pageLabel
+}) => {
+  const colors = useThemeColors();
+  const { labels, dir } = usePaginationContext("Pagination(compact)");
+  const flip = dir === "rtl";
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        justifyContent: "space-between",
+        gap: px(colors.spacing["1"]),
+        flexGrow: 1
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          ItemButton,
+          {
+            type: "prev",
+            selected: false,
+            disabled: !canPrev,
+            ariaLabel: labels.prev,
+            label: flip ? "\u203A" : "\u2039",
+            onPress: onPrev
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          View,
+          {
+            style: {
+              flexGrow: 1,
+              alignItems: "center",
+              justifyContent: "center",
+              paddingHorizontal: px(colors.spacing["3"])
+            },
+            children: /* @__PURE__ */ jsx(
+              Text,
+              {
+                style: {
+                  fontFamily: colors.fontFamily.body,
+                  fontSize: px(colors.fontSize.sm),
+                  color: colors.semantic.text.default,
+                  fontWeight: colors.fontWeight.medium,
+                  fontVariant: ["tabular-nums"]
+                },
+                children: pageLabel
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          ItemButton,
+          {
+            type: "next",
+            selected: false,
+            disabled: !canNext,
+            ariaLabel: labels.next,
+            label: flip ? "\u2039" : "\u203A",
+            onPress: onNext
+          }
+        )
+      ]
+    }
+  );
+}, "CompactView");
+var ANNOUNCE_DEBOUNCE_MS = 150;
+var PaginationRoot = /* @__PURE__ */ __name((props) => {
+  const {
+    page: controlledPage,
+    defaultPage = 1,
+    pageCount,
+    siblingCount = 1,
+    boundaryCount = 1,
+    showFirstLast = false,
+    hideOnSinglePage = true,
+    variant = "auto",
+    showRange = false,
+    itemCount,
+    pageSize: pageSizeProp,
+    onPageChange,
+    renderItem,
+    dir = "ltr",
+    previousLabel,
+    nextLabel,
+    firstLabel,
+    lastLabel,
+    ariaLabel,
+    className,
+    testID,
+    children
+  } = props;
+  const { t } = useTranslation();
+  const colors = useThemeColors();
+  const { width } = useWindowDimensions();
+  const [internalPageSize, setInternalPageSize] = useState(pageSizeProp);
+  useEffect(() => {
+    setInternalPageSize(pageSizeProp);
+  }, [pageSizeProp]);
+  const effectivePageSize = pageSizeProp ?? internalPageSize;
+  const labels = useMemo(
+    () => ({
+      prev: previousLabel ?? t("pagination.previous", { defaultValue: "Previous page" }),
+      next: nextLabel ?? t("pagination.next", { defaultValue: "Next page" }),
+      first: firstLabel ?? t("pagination.first", { defaultValue: "First page" }),
+      last: lastLabel ?? t("pagination.last", { defaultValue: "Last page" }),
+      ellipsis: t("pagination.ellipsis", { defaultValue: "More pages" }),
+      currentPage: t("pagination.currentPage", { defaultValue: "Current page" }),
+      gotoPage: /* @__PURE__ */ __name((n) => t("pagination.gotoPage", { page: n, defaultValue: `Go to page ${n}` }), "gotoPage"),
+      rangeFmt: /* @__PURE__ */ __name((from, to, total) => t("pagination.range", {
+        from,
+        to,
+        total,
+        defaultValue: `Showing ${from}\u2013${to} of ${total}`
+      }), "rangeFmt"),
+      pageOfFmt: /* @__PURE__ */ __name((p, total) => t("pagination.pageOf", { page: p, total, defaultValue: `Page ${p} of ${total}` }), "pageOfFmt"),
+      pageSize: t("pagination.pageSizeLabel", { defaultValue: "Items per page" }),
+      jumperLabel: t("pagination.jumperLabel", { defaultValue: "Go to page" }),
+      jumperPlaceholder: t("pagination.jumperPlaceholder", { defaultValue: "#" })
+    }),
+    [t, previousLabel, nextLabel, firstLabel, lastLabel]
+  );
+  const [announcement, setAnnouncement] = useState("");
+  const announceTimer = useRef(null);
+  useEffect(() => {
+    return () => {
+      if (announceTimer.current) {
+        clearTimeout(announceTimer.current);
+      }
+    };
+  }, []);
+  const handlePageChange = useCallback(
+    (next) => {
+      onPageChange?.(next, effectivePageSize !== void 0 ? { pageSize: effectivePageSize } : void 0);
+      if (announceTimer.current) {
+        clearTimeout(announceTimer.current);
+      }
+      announceTimer.current = setTimeout(() => {
+        setAnnouncement(labels.pageOfFmt(next, Math.max(1, pageCount)));
+      }, ANNOUNCE_DEBOUNCE_MS);
+    },
+    [onPageChange, effectivePageSize, labels, pageCount]
+  );
+  const setPageSize = useCallback(
+    (next) => {
+      if (pageSizeProp === void 0) {
+        setInternalPageSize(next);
+      }
+      onPageChange?.(1, { pageSize: next });
+    },
+    [onPageChange, pageSizeProp]
+  );
+  const pagination = usePagination({
+    ...controlledPage !== void 0 ? { page: controlledPage } : {},
+    defaultPage,
+    pageCount,
+    siblingCount,
+    boundaryCount,
+    showFirstLast,
+    onPageChange: handlePageChange
+  });
+  if (hideOnSinglePage && Math.max(1, pageCount) <= 1) {
+    return null;
+  }
+  const ctxValue = {
+    page: pagination.page,
+    pageCount: Math.max(1, pageCount),
+    pageSize: effectivePageSize,
+    itemCount,
+    siblingCount,
+    boundaryCount,
+    showFirstLast,
+    dir,
+    labels,
+    ...renderItem ? { renderItem } : {},
+    goToPage: pagination.goToPage,
+    setPageSize
+  };
+  if (children !== void 0) {
+    return /* @__PURE__ */ jsxs(PaginationContext.Provider, { value: ctxValue, children: [
+      /* @__PURE__ */ jsx(
+        View,
+        {
+          ...testID !== void 0 ? { testID } : {},
+          role: "navigation",
+          "aria-label": ariaLabel ?? t("pagination.ariaLabel", { defaultValue: "Pagination" }),
+          accessibilityLabel: ariaLabel ?? t("pagination.ariaLabel", { defaultValue: "Pagination" }),
+          accessible: true,
+          className: cn("flex-row items-center flex-wrap", className),
+          style: {
+            flexDirection: "row",
+            alignItems: "center",
+            flexWrap: "wrap",
+            rowGap: px(colors.spacing["2"]),
+            columnGap: px(colors.spacing["1"]),
+            direction: dir
+          },
+          children
+        }
+      ),
+      /* @__PURE__ */ jsx(LiveRegion, { message: announcement })
+    ] });
+  }
+  const isCompact = variant === "compact" || variant === "auto" && width > 0 && width < PAGINATION_COMPACT_BREAKPOINT;
+  const onItemPress = /* @__PURE__ */ __name((item) => {
+    if (item.disabled) {
+      return;
+    }
+    switch (item.type) {
+      case "first":
+        pagination.first();
+        return;
+      case "prev":
+        pagination.prev();
+        return;
+      case "next":
+        pagination.next();
+        return;
+      case "last":
+        pagination.last();
+        return;
+      case "page":
+        if (item.page !== void 0) {
+          pagination.goToPage(item.page);
+        }
+        return;
+      case "ellipsis":
+        return;
+    }
+  }, "onItemPress");
+  const showRangeBlock = showRange && itemCount !== void 0 && effectivePageSize !== void 0;
+  return /* @__PURE__ */ jsxs(PaginationContext.Provider, { value: ctxValue, children: [
+    /* @__PURE__ */ jsxs(
+      View,
+      {
+        ...testID !== void 0 ? { testID } : {},
+        role: "navigation",
+        "aria-label": ariaLabel ?? t("pagination.ariaLabel", { defaultValue: "Pagination" }),
+        accessibilityLabel: ariaLabel ?? t("pagination.ariaLabel", { defaultValue: "Pagination" }),
+        accessible: true,
+        className: cn(isCompact ? "flex-col items-stretch" : "flex-row items-center flex-wrap", className),
+        style: {
+          // Compact mode lays out as a column so the Range/PageSize
+          // block falls below the controls instead of overflowing
+          // a phone-width row. Numbered mode wraps on overflow.
+          flexDirection: isCompact ? "column" : "row",
+          alignItems: isCompact ? "stretch" : "center",
+          flexWrap: isCompact ? "nowrap" : "wrap",
+          rowGap: px(colors.spacing["2"]),
+          columnGap: px(colors.spacing["1"]),
+          direction: dir
+        },
+        children: [
+          isCompact ? /* @__PURE__ */ jsx(
+            CompactView,
+            {
+              onPrev: pagination.prev,
+              onNext: pagination.next,
+              canPrev: pagination.canPrev,
+              canNext: pagination.canNext,
+              pageLabel: labels.pageOfFmt(pagination.page, Math.max(1, pageCount))
+            }
+          ) : /* @__PURE__ */ jsx(ItemsRenderer, { items: pagination.pages, onItemPress }),
+          showRangeBlock ? /* @__PURE__ */ jsx(PaginationRange, {}) : null
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx(LiveRegion, { message: announcement })
+  ] });
+}, "PaginationRoot");
+var CompoundActionButton = /* @__PURE__ */ __name(({
+  actionType,
+  asChild,
+  children,
+  testID
+}) => {
+  const ctx = usePaginationContext(`Pagination.${actionType[0].toUpperCase() + actionType.slice(1)}`);
+  const disabled = actionType === "prev" || actionType === "first" ? ctx.page <= 1 : ctx.page >= ctx.pageCount;
+  const onPress = /* @__PURE__ */ __name(() => {
+    if (disabled) {
+      return;
+    }
+    switch (actionType) {
+      case "first":
+        ctx.goToPage(1);
+        return;
+      case "prev":
+        ctx.goToPage(ctx.page - 1);
+        return;
+      case "next":
+        ctx.goToPage(ctx.page + 1);
+        return;
+      case "last":
+        ctx.goToPage(ctx.pageCount);
+        return;
+    }
+  }, "onPress");
+  const ariaLabel = actionType === "prev" ? ctx.labels.prev : actionType === "next" ? ctx.labels.next : actionType === "first" ? ctx.labels.first : ctx.labels.last;
+  if (asChild) {
+    return /* @__PURE__ */ jsx(
+      Slot,
+      {
+        "aria-label": ariaLabel,
+        "aria-disabled": disabled || void 0,
+        onPress,
+        onClick: onPress,
+        children
+      }
+    );
+  }
+  const fallbackGlyph = actionType === "prev" ? "\u2039" : actionType === "next" ? "\u203A" : actionType === "first" ? "\xAB" : "\xBB";
+  return /* @__PURE__ */ jsx(
+    ItemButton,
+    {
+      type: actionType,
+      selected: false,
+      disabled,
+      ariaLabel,
+      label: children ?? fallbackGlyph,
+      onPress,
+      ...testID !== void 0 ? { testID } : {}
+    }
+  );
+}, "CompoundActionButton");
+var PaginationPrev = /* @__PURE__ */ __name(({ asChild, children, testID }) => CompoundActionButton({
+  actionType: "prev",
+  ...asChild !== void 0 ? { asChild } : {},
+  ...children !== void 0 ? { children } : {},
+  ...testID !== void 0 ? { testID } : {}
+}), "PaginationPrev");
+var PaginationNext = /* @__PURE__ */ __name(({ asChild, children, testID }) => CompoundActionButton({
+  actionType: "next",
+  ...asChild !== void 0 ? { asChild } : {},
+  ...children !== void 0 ? { children } : {},
+  ...testID !== void 0 ? { testID } : {}
+}), "PaginationNext");
+var PaginationFirst = /* @__PURE__ */ __name(({ asChild, children, testID }) => CompoundActionButton({
+  actionType: "first",
+  ...asChild !== void 0 ? { asChild } : {},
+  ...children !== void 0 ? { children } : {},
+  ...testID !== void 0 ? { testID } : {}
+}), "PaginationFirst");
+var PaginationLast = /* @__PURE__ */ __name(({ asChild, children, testID }) => CompoundActionButton({
+  actionType: "last",
+  ...asChild !== void 0 ? { asChild } : {},
+  ...children !== void 0 ? { children } : {},
+  ...testID !== void 0 ? { testID } : {}
+}), "PaginationLast");
+var PaginationItem = /* @__PURE__ */ __name(({
+  page,
+  asChild,
+  children,
+  testID
+}) => {
+  const ctx = usePaginationContext("Pagination.Item");
+  const selected = page === ctx.page;
+  const onPress = /* @__PURE__ */ __name(() => ctx.goToPage(page), "onPress");
+  const ariaLabel = selected ? ctx.labels.currentPage : ctx.labels.gotoPage(page);
+  if (asChild) {
+    return /* @__PURE__ */ jsx(
+      Slot,
+      {
+        "aria-label": ariaLabel,
+        ...selected ? { "aria-current": "page" } : {},
+        onPress,
+        onClick: onPress,
+        children
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    ItemButton,
+    {
+      type: "page",
+      page,
+      selected,
+      disabled: false,
+      ariaLabel,
+      ...selected ? { ariaCurrent: "page" } : {},
+      label: children ?? String(page),
+      onPress,
+      ...testID !== void 0 ? { testID } : {}
+    }
+  );
+}, "PaginationItem");
+var PaginationItems = /* @__PURE__ */ __name(({ children }) => {
+  const ctx = usePaginationContext("Pagination.Items");
+  const result = usePagination({
+    page: ctx.page,
+    pageCount: ctx.pageCount,
+    siblingCount: ctx.siblingCount,
+    boundaryCount: ctx.boundaryCount,
+    showFirstLast: false,
+    showPrevNext: false
+  });
+  if (children !== void 0) {
+    return /* @__PURE__ */ jsx(Fragment, { children });
+  }
+  return /* @__PURE__ */ jsx(
+    ItemsRenderer,
+    {
+      items: result.pages,
+      onItemPress: (item) => {
+        if (item.type === "page" && item.page !== void 0) {
+          ctx.goToPage(item.page);
+        }
+      }
+    }
+  );
+}, "PaginationItems");
+var PaginationEllipsis = /* @__PURE__ */ __name(({ children }) => {
+  const ctx = usePaginationContext("Pagination.Ellipsis");
+  return /* @__PURE__ */ jsx(
+    ItemButton,
+    {
+      type: "ellipsis",
+      selected: false,
+      disabled: true,
+      label: children ?? "\u2026",
+      ariaLabel: ctx.labels.ellipsis,
+      onPress: () => {
+      }
+    }
+  );
+}, "PaginationEllipsis");
+var PaginationRange = /* @__PURE__ */ __name(() => {
+  const ctx = usePaginationContext("Pagination.Range");
+  const colors = useThemeColors();
+  if (ctx.itemCount === void 0 || ctx.pageSize === void 0) {
+    if (process.env.NODE_ENV !== "production") {
+      console.warn("<Pagination.Range> requires both `itemCount` and `pageSize` on <Pagination>.");
+    }
+    return null;
+  }
+  const from = (ctx.page - 1) * ctx.pageSize + 1;
+  const to = Math.min(ctx.itemCount, ctx.page * ctx.pageSize);
+  const message = ctx.labels.rangeFmt(from, to, ctx.itemCount);
+  return /* @__PURE__ */ jsx(
+    Text,
+    {
+      role: "status",
+      "aria-live": "polite",
+      style: {
+        fontFamily: colors.fontFamily.body,
+        fontSize: px(colors.fontSize.sm),
+        color: colors.semantic.text.muted,
+        fontVariant: ["tabular-nums"],
+        paddingHorizontal: px(colors.spacing["2"]),
+        // Sits on the same baseline as the 32px buttons.
+        lineHeight: px(colors.spacing["8"])
+      },
+      children: message
+    }
+  );
+}, "PaginationRange");
+var PaginationPageSize = /* @__PURE__ */ __name(({ options, testID }) => {
+  const ctx = usePaginationContext("Pagination.PageSize");
+  const colors = useThemeColors();
+  const value = ctx.pageSize !== void 0 ? String(ctx.pageSize) : "";
+  const selectOptions = useMemo(
+    () => options.map((n) => ({ value: String(n), label: String(n) })),
+    [options]
+  );
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        gap: px(colors.spacing["2"])
+      },
+      children: [
+        /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontFamily: colors.fontFamily.body,
+              fontSize: px(colors.fontSize.sm),
+              color: colors.semantic.text.muted
+            },
+            children: ctx.labels.pageSize
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Select,
+          {
+            ...testID !== void 0 ? { testID } : {},
+            "aria-label": ctx.labels.pageSize,
+            options: selectOptions,
+            value,
+            onChange: (v) => {
+              const n = Number(v);
+              if (Number.isFinite(n) && n > 0) {
+                ctx.setPageSize(n);
+              }
+            }
+          }
+        )
+      ]
+    }
+  );
+}, "PaginationPageSize");
+var PaginationJumper = /* @__PURE__ */ __name(({
+  showLabel = false,
+  label,
+  placeholder,
+  inputWidth = 56,
+  testID
+}) => {
+  const ctx = usePaginationContext("Pagination.Jumper");
+  const colors = useThemeColors();
+  const [draft, setDraft] = useState("");
+  const [focused, setFocused] = useState(false);
+  const [hovered, setHovered] = useState(false);
+  const visibleLabel = label ?? ctx.labels.jumperLabel;
+  const placeholderText = placeholder ?? ctx.labels.jumperPlaceholder;
+  const submit = /* @__PURE__ */ __name(() => {
+    const trimmed = draft.trim();
+    if (trimmed === "") {
+      return;
+    }
+    const n = Number(trimmed);
+    if (!Number.isFinite(n) || n < 1) {
+      setDraft("");
+      return;
+    }
+    const clamped = Math.min(Math.max(1, Math.floor(n)), ctx.pageCount);
+    ctx.goToPage(clamped);
+    setDraft("");
+  }, "submit");
+  const borderColor = focused ? colors.semantic.interactive.primary : hovered ? colors.semantic.border.strong : colors.semantic.border.default;
+  return /* @__PURE__ */ jsxs(
+    View,
+    {
+      style: {
+        flexDirection: "row",
+        alignItems: "center",
+        gap: px(colors.spacing["2"])
+      },
+      children: [
+        showLabel ? /* @__PURE__ */ jsx(
+          Text,
+          {
+            style: {
+              fontFamily: colors.fontFamily.body,
+              fontSize: px(colors.fontSize.sm),
+              color: colors.semantic.text.muted
+            },
+            children: visibleLabel
+          }
+        ) : null,
+        /* @__PURE__ */ jsx(
+          View,
+          {
+            onPointerEnter: Platform.OS === "web" ? () => setHovered(true) : void 0,
+            onPointerLeave: Platform.OS === "web" ? () => setHovered(false) : void 0,
+            style: {
+              width: inputWidth,
+              height: px(colors.spacing["8"]),
+              borderWidth: 1,
+              borderColor,
+              borderRadius: px(colors.radius.md),
+              backgroundColor: colors.semantic.background.elevated,
+              paddingHorizontal: px(colors.spacing["2"]),
+              justifyContent: "center",
+              // Web-only properties (silently dropped on native).
+              ...focused ? {
+                boxShadow: `0 0 0 3px ${withAlpha(colors.semantic.interactive.primary, 0.15)}`
+              } : null,
+              transitionProperty: "border-color, box-shadow",
+              transitionDuration: "120ms",
+              transitionTimingFunction: "cubic-bezier(0.2, 0, 0, 1)"
+            },
+            children: /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                ...testID !== void 0 ? { testID } : {},
+                value: draft,
+                onChangeText: setDraft,
+                onSubmitEditing: submit,
+                onBlur: () => {
+                  setFocused(false);
+                  submit();
+                },
+                onFocus: () => setFocused(true),
+                keyboardType: "number-pad",
+                inputMode: "numeric",
+                placeholder: placeholderText,
+                placeholderTextColor: colors.semantic.text.muted,
+                "aria-label": visibleLabel,
+                accessibilityLabel: visibleLabel,
+                returnKeyType: "go",
+                selectTextOnFocus: true,
+                style: {
+                  fontFamily: colors.fontFamily.body,
+                  fontSize: px(colors.fontSize.sm),
+                  color: colors.semantic.text.default,
+                  fontVariant: ["tabular-nums"],
+                  textAlign: "center",
+                  // Strip the browser's default outline — we draw our own
+                  // focus ring on the wrapper.
+                  ...Platform.OS === "web" ? { outline: "none" } : null
+                }
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+}, "PaginationJumper");
+function withAlpha(color, alpha) {
+  if (color.startsWith("#") && (color.length === 7 || color.length === 4)) {
+    const expanded = color.length === 4 ? `#${color[1]}${color[1]}${color[2]}${color[2]}${color[3]}${color[3]}` : color;
+    const r = Number.parseInt(expanded.slice(1, 3), 16);
+    const g = Number.parseInt(expanded.slice(3, 5), 16);
+    const b = Number.parseInt(expanded.slice(5, 7), 16);
+    return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+  }
+  return color;
+}
+__name(withAlpha, "withAlpha");
+var Pagination = Object.assign(PaginationRoot, {
+  Items: PaginationItems,
+  Item: PaginationItem,
+  Prev: PaginationPrev,
+  Next: PaginationNext,
+  First: PaginationFirst,
+  Last: PaginationLast,
+  Ellipsis: PaginationEllipsis,
+  Range: PaginationRange,
+  PageSize: PaginationPageSize,
+  Jumper: PaginationJumper
+});
+
+export { PAGINATION_COMPACT_BREAKPOINT, Pagination, usePagination };
+//# sourceMappingURL=chunk-7GPDNQSX.js.map
+//# sourceMappingURL=chunk-7GPDNQSX.js.map